@charset "utf-8";
/*===============================================
 *	環境保全への取り組み
===============================================*/
@media screen and (max-width: 568px) {
#environment .layer-ttl {font-size: 23px;}
}
/*-----------------------------------------------
 *	大見出し
-----------------------------------------------*/
#sub-main_head {background-color: #4fa95d;background-image: linear-gradient(45deg, #52ac60 25%, transparent 25%, transparent 75%, #52ac60 75%),linear-gradient(45deg, #52ac60 25%, transparent 25%, transparent 75%, #52ac60 75%);background-size: 40px 40px;background-position: 0 0, 20px 20px;position: relative;}
#sub-main_head::after {display: inline-block;content: "";background: url("../img/environment/bg-layout_heading_pc.png") repeat-x;background-size: contain;width: 100%;height: 200px;position: absolute;left: 0;top: 0;}

@media screen and (max-width: 568px) {
#sub-main_head::after {background: url("../img/environment/bg-layout_heading_sp.png") repeat-x;background-size: cover;height: 150px;}
}
/*-----------------------------------------------
 *	導入文
-----------------------------------------------*/
.bg-intro_eco{background: url("../img/environment/bg-intro_pc.png") bottom no-repeat;background-size: cover;padding: 0 0 60px;}
#environment .intro-contents img{max-width: 477px;}
#environment .intro-detail {width: 50%;}
.environment-intro_ttl{font-size: 32px;font-weight: bold;position: relative;line-height: 1.4;margin: 0 0 25px;}
.environment-intro_ttl::after {content: "";background: linear-gradient(90deg, #1f7739 0% 20%, #df0075 20% 40%, #f8b400 40% 60%, #009dcd 60% 80%, #e60015 80% 100%);background-size: contain;display: block;position: absolute;left: 0;bottom: -10px;width: 120px;height: 4px;}
.environment-intro_catch{color: #8fc75b;margin: 0 0 20px;}
@media screen and (max-width: 1024px) {
#environment .intro-detail {width: 46%;}
}
@media screen and (max-width: 960px) {
#environment .intro-contents img {max-width: 367px;}
.environment-intro_ttl {font-size: 28px;}
}
@media screen and (max-width: 568px) {
.bg-intro_eco{background: url("../img/environment/bg-intro_sp.png") bottom no-repeat;background-size: contain;padding: 0 0 30px;}
#environment .intro-contents img {max-width: initial;margin: 0 0 20px;}
#environment .intro-detail {width: 100%;}
}
/*-----------------------------------------------
 *	その業者で大丈夫
-----------------------------------------------*/
#environment .problems-ttl{color: #055157;position: relative;}
#environment .problems-ttl::before{content: "";display: block;position: absolute;top: -50px;}
#environment .problems-ttl::before{background: url("../img/environment/bg-problems.png") no-repeat;background-size: contain;width: 180px;height: 209px;left: 0;}

.problems-frame{background: #fff;border:#002b4e 4px solid;border-radius: 6px;padding: 40px;}
.problems-contents{position: relative;margin: 0 0 40px;padding: 0 0 80px;}
.problems-contents::after {content: "";position: absolute;display: block;color: #053657;line-height: 1;width: 0;height: 0;border-style: solid;border-color: transparent;border-width: 3em 12.5em;border-top-color: currentColor;border-bottom: 0;left: 50%;bottom: 0;transform: translateX(-50%);}
.problems-box{width: 48%;}
.problems-box dt{font-size: 26px;font-weight: bold;color: #fff;text-align: center;padding: 5px 0;margin: 0 0 10px;border-radius: 6px;}
.problems-a dt{background: #055157;}
.problems-b dt{background: #053657;}
.problems-caption{font-size: 26px;font-weight: bold;text-align: center;margin: 0 0 20px;}
.problems-caption span{background: linear-gradient(transparent 65%, #f1de05 0%);padding: 0 15px;}
.problems-box div p{font-size: 22px;width: 60%;}
.problems-a .problems-caption{color: #055157;}
.problems-b .problems-caption{color: #053657;}
.problems-a img{width: 160px;}
.problems-b img{width: 165px;}
.problems-summary dl{width: 65%;}
.problems-summary dt{background: #053657;color: #fff;padding: 5px;text-align: center;font-size:  28px;font-weight: bold;margin: 0 0 20px;}
.problems-summary img{width: 306px;}
@media screen and (max-width: 1024px) {
#environment .problems-ttl {padding: 0 0 0 2em;}
.problems-summary dl {width: 60%;}
.problems-a img{width: 150px;}
.problems-b img{width: 155px;}
}
@media screen and (max-width: 960px) {
#environment .problems-ttl::before {width: 160px;height: 186px;}
.problems-frame {padding: 30px;}
.problems-caption span {padding: 0 5px;}
.problems-box dt {font-size: 22px;}
.problems-caption {font-size: 20px;}
.problems-a img{width: 110px;}
.problems-b img{width: 115px;}
.problems-box div p {font-size: 20px;}
.problems-summary dt {font-size: 22px;margin: 0 0 15px;}
.problems-summary img {width: 246px;}
}
@media screen and (max-width: 568px) {
#environment .problems-ttl {padding: 0 0 0 4em;margin: 0 0 10px;}
#environment .problems-ttl::before {width: 130px;height: 151px;top: -40px;}
.problems-frame {padding: 20px;}
.problems-a img,
.problems-b img {margin: 0 auto 10px;}
.problems-box dt {font-size: 18px;}
.problems-caption {font-size: 17px;}
.problems-box div p {font-size: 17px;width: 100%;}
.problems-contents {margin: 0 0 20px;padding: 0 0 50px;}
.problems-contents::after {border-width: 2em 7.5em;}
.problems-summary dl {width: 100%;}
.problems-summary dt {font-size: 20px;}
.problems-summary img {width: 100%;margin: 15px 0 0;}
}
@media screen and (max-width: 375px) {
.problems-summary dt {font-size: 18px;}
}
/*-----------------------------------------------
 *	遺品整理
-----------------------------------------------*/
#environment .layer-item .layer-side_img {max-width: 540px;}
#environment .bnr-eco {margin: 0 auto;}
.eco-summary{border: #8fc75b 4px solid;padding: 30px;border-radius: 6px;}
.eco-summary dt{font-size: 24px;font-weight: bold;text-align: center;padding: 0 0 0 3.5em;position: relative;width: 32%;}
.eco-summary dt span{color: #8fc75b;}
.eco-summary dt::before{content: "";display: block;background: url("../img/environment/icon-eco.png") left no-repeat;background-size: contain;width: 82px;height: 109px;position: absolute;left: 0;top: 50%;transform: translateY(-50%);}
.eco-summary dd{border-left: #8fc75b 4px solid;padding: 0 0 0 30px;width: 68%;}
#environment .sdgs-link_contents {margin: 30px 0 0;}
@media screen and (max-width: 1024px) {
.eco-summary dt{width: 34%;}
.eco-summary dd{width: 65%;}
}
@media screen and (max-width: 960px) {
.eco-summary {padding: 20px;}
.eco-summary dt {font-size: 21px;padding: 0 0 0 2.5em;width: 35%;}
.eco-summary dt::before {width: 52px;height: 72px;}
.eco-summary dd {padding: 0 0 0 20px;width: 65%;}
}
@media screen and (max-width: 568px) {
#environment #environment-wrap .layer-item {width: 100%;}
#environment .img-recycling_rate {width: 100%;}
#environment .top-recycle_item {margin: 0 auto 30px;width: 100%;}
.eco-summary dt {font-size: 22px;padding: 0 0 0 15%;width: 84%;margin: 0 auto 20px;}
.eco-summary dd {padding: 15px 0 0 0;width: 100%;border-left: none;border-top: #8fc75b 4px solid;}

}