@charset "utf-8";
/* MV */
.mv{position: relative;}

@media screen and (min-width: 768px){
    .mv{max-width: 1400px; width: 94%; margin: 0 auto 40px; border-radius: 10px; overflow: hidden;}    
}

@media screen and (max-width: 767px){    
    .mv{margin: 0 0 20px;}
}

/* Detail Common */
.main{padding-top: 80px; line-height: 2.2;}
.main .cate{font-family: "Zen Kaku Gothic New", serif; color: #009869; margin: 15px 0 5px; line-height: 1.7; font-size: 1.6rem;}
.main .cate li:before{content: ''; margin-right: 10px; display: inline-block; position: relative; top: 3px;}
.main .cate01:before{width: 16px; height: 20px; background: url("../img/common/ic-leaf.svg") no-repeat top left/100% auto;}
.main .cate02:before{width: 14px; height: 18px; background: url("../img/common/ic-recycle.svg") no-repeat top left/100% auto;}
.main .cate03:before{width: 16px; height: 18px; background: url("../img/common/ic-tree.svg") no-repeat top left/100% auto;}

.main .hashtag{display: flex; flex-wrap: wrap;}
.main .hashtag li{padding: 3px 10px 4px; border: 1px solid #009869; color: #009869; line-height: 1.5; margin: 0 6px 6px 0;}
.main .other .hashtag li {font-size: 1.4rem;}
.imgSp-out{position: relative;}

.main sup{font-size: 60%;}

.txt-link {color:#009869;text-decoration:underline;}
.txt-link:hover {text-decoration:none;}

@media screen and (max-width: 767px){
    .main{padding-top: 50px; font-size: min(4vw,1.6rem);}    
    .main .cate{font-size: min(3.8vw,1.6rem);}
    .main .detail-head .cate{font-size: min(4vw,1.6rem);}
    .main .hashtag li {font-size: min(3.4vw,1.6rem);}
    .main .other .hashtag li {font-size: min(3.2vw,1.4rem);}

    .imgSp-out{border-radius: 0; overflow: inherit;}
    .imgSp-out img{border-radius: 10px;}
    .imgSp-out .cap-abs_right{position: static; padding: 5px 0 0 0;}
}

/* Detail Head */
.detail-head{margin: 0 0 50px;}
.detail-head .title{font-size: 3.4rem; line-height: 1.5; padding: 0 0 10px;}
.detail-head .title span{background-image: linear-gradient(to right, rgba(0,152,105,.2) 0, rgba(0,152,105,.2) 100%);    
background-position: 0 1.1em; background-size: 100% 100%; background-repeat: no-repeat;}
.detail-head .text{font-size: 2rem; line-height: 1.7; font-weight: bold; font-family: "Zen Kaku Gothic New", serif;}
.detail-head .cate{margin: 0 0 8px;}
.detail-head .hashtag{margin: 15px 0;}

@media screen and (max-width: 767px){
    .detail-head .title{font-size: 2.4rem; line-height: 1.6;}
    .detail-head .text{font-size: 1.6rem;}
}

/* Detail Index */
.detail-index{border: 1px solid #009869; padding: 40px; border-radius: 10px; margin: 0 0 90px;}
.detail-index .title{font-size: 2rem; line-height: 1; color: #009869; font-family: "Lato", serif; display: flex; align-items: center; letter-spacing: 0.1em; margin: 0 0 10px;}
.detail-index .title:before{content: ''; width: 17px; height: 17px; background: url("../img/common/ic-pen.svg") no-repeat top left/100% auto; margin-right: 10px;}

.detail-index .list li{border-bottom: 1px dotted #c0bcb7;}
.detail-index .list a{position: relative; padding: 12px 0 12px 50px; display: block; font-size: 2rem; line-height: 1.7; font-weight: bold; font-family: "Zen Kaku Gothic New", serif; text-decoration: underline; text-underline-offset: 0.2em;}
.detail-index .list .num{position: absolute; top: 14px; left: 0; width: 32px; height: 32px; background: #009869; color: #fff; font-size: 1.6rem; line-height: 1; font-family: "Lato", serif; border-radius: 100%; text-align: center; display: flex; justify-content: center; align-items: center; padding-bottom: 2px; font-weight: bold;}
.detail-index .list a:after{content: ''; width: 20px; height: 20px; margin-left: 5px; background: url("../img/common/ic-arrow.png") no-repeat top left/100% 100%; display: inline-block; position: relative; top: 2px;}
.detail-index .list a:hover{color: #009869; text-decoration: none;}
.detail-index .list a:hover:after{background: url("../img/common/ic-arrow_green.png") no-repeat top left/100% 100%;}

@media screen and (max-width: 767px){
    .detail-index{padding: 30px 20px; margin: 0 0 50px;}
    .detail-index .list a{padding: 15px 0 15px 34px; font-size: 1.6rem; line-height: 1.5;}
    .detail-index .list .num{width: 24px; height: 24px; font-size: 1.3rem; padding-bottom: 0; top: 15px;}
    .detail-index .list a:after{width: 16px; height: 16px;}
}

/* Detail */
.detail-group{margin: 0 0 90px;}
.detail-group:last-of-type{margin: 0 0 50px;}
.detail-group p:not(:last-of-type){margin-bottom: 35px;}

.detail-box:not(:last-of-type){margin: 0 0 55px;}
.detail-box.is-full{display: block;}
.detail-box.is-full .m-photo{width: 100%;}
.detail-rows{margin: 0 0 45px;}

.detail-box .img .m-photo{width: 100%; margin: 0 0 20px;}
.detail-box .img .m-photo:last-of-type{margin: 0;}

.detail-tit{font-size: 2.6rem; line-height: 1.5; margin: 0 0 20px; position: relative; padding-left: 2rem;}
.detail-tit::before{content: ''; width: 4px; height: calc(100% - 12px); background: #009869; position: absolute; top: 0.3em; left: 0; border-radius: 6px;}
.detail-tit2{font-size: 2.2rem; line-height: 1.5; margin: 0 0 20px;}
.detail-tit3{font-size: 1.8rem; line-height: 1.5; margin: 0 0 10px; color: #009869; padding-left: 1em; position: relative;}
.detail-tit3:before{content: ''; position: absolute; top: 10px; left: 0; width: 8px; height: 8px; background: #009869; border-radius: 100%;}

.detail-list li:not(:last-of-type){margin: 0 0 25px;}

@media screen and (min-width: 768px){
    .detail-box{display: flex; align-items: flex-start; flex-wrap: wrap; justify-content: space-between;}
    .detail-box .img{width: 36.12%;}    
    .detail-box .inner{width: 57.88%;}
    .detail-box .inner2{width: 100%; margin-top: 35px;}
}

@media screen and (max-width: 767px){
    .detail-group{margin: 0 0 70px;}
    .detail-group:last-of-type{margin: 0 0 35px;}
    .detail-group p:not(:last-of-type){margin-bottom: 15px;}
    
    .detail-box:not(:last-of-type){margin: 0 0 20px;}
    .detail-box .inner{margin: 0 0 20px;}
    .detail-box .inner2{margin: 20px 0 0 0;}
    .detail-box.is-full .cap {font-size: min(3vw,1.2rem);}
    .detail-rows{margin: 0 0 20px;}
    
    .detail-tit{font-size: min(5.1vw,2.2rem); margin: 0 0 12px;}    
    .detail-tit2{font-size: min(5vw,2rem); margin: 0 0 12px;}    
        
    .detail-list li:not(:last-of-type){margin: 0 0 20px;}
    
    .cap-abs_right.sp-out{bottom: auto; top: 100%;}
}

/* Relate */
.relate{border: 1px solid #009869; border-radius: 10px; padding: 4.6%; margin: 0 0 50px; line-height: 1.6;}
.relate-tit{font-size: 2.4rem; line-height: 1.4; margin: -5px 0 15px;}
.relate-txt{font-weight: bold; font-size: min(4.5vw,1.8rem);}
.relate-logo{line-height: 1; margin: 0 0 20px;}

.relate-tbl{width: 100%; line-height: 1.7;}
.relate-tbl th,
.relate-tbl td{border-bottom: 2px solid #f0ebe5;}
.relate-tbl th{background: #acaca3; color: #fff; text-align: center; width: 103px; padding: 6px 0; font-weight: 400; font-family: "Crimson Text", serif;}
.relate-tbl td{background: #f8f5f2; padding: 6px 15px; font-weight: bold; color: #4b575e; font-family: "Noto Serif JP", serif;}
.relate-tbl .list li{margin-left: 0.5em; text-indent: -0.5em;}

.relate-btn{margin: 30px 0 0;}
.relate-btn a{max-width: 400px; width: 100%; min-height: 60px; padding: 5px 0; border-radius: 60px; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; color: #fff; background: #009869; font-size: 1.8rem; line-height: 1.5; text-align: center; font-weight: bold; font-family: "Zen Kaku Gothic New", serif; position: relative; border: 1px solid #009869; transition: .5s;}
.relate-btn a:after{content: ''; position: absolute; top: 50%; right: 7%; background:#fff; width: 16px; height: 16px; margin-top: -8px; line-height: 1; display: block; mask: url("../img/common/ic-open.svg") no-repeat top left/100% 100%; -webkit-mask: url("../img/common/ic-open.svg") no-repeat top left/100% 100%;}
.relate-btn a:hover{background: #fff; color: #009869;}
.relate-btn a:hover:after{background: #009869;}

@media screen and (min-width: 768px){
    .relate{display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-start;}    
    .relate-imgPc{width: 234px;}
    .relate-imgSp{display: none;}
    .relate-inner{width: calc(95% - 234px);}	
}

@media screen and (max-width: 767px){
    .relate{padding: 30px; margin: 0 0 35px;}
    .relate-imgPc{display: none;}
    .relate-imgSp{max-width: 400px; width: 100%; margin: 0 auto 30px;}
    .relate-tit{font-size: 2rem; text-align: center; margin: 0 0 15px;}
    .relate-logo{text-align: center;}
    
    .relate-tbl,
    .relate-tbl tbody,
    .relate-tbl tr,
    .relate-tbl th,
    .relate-tbl td{width: 100%; display: block; border: none;}    
    .relate-tbl td{padding: 10px 15px;}
    
    .relate-btn{margin: 20px 0 0;}
    .relate-btn a{font-size: 1.6rem; min-height: 50px;}
    .relate-btn a:after{width: 14px; height: 14px; margin-top: -7px;}	
}

/* Other */
.other{background: #f8f5f2;}
.other:before,
.other:after{content: ''; display: block; width: 100%;}

.other-wrap{padding: 70px 0 10px;}
.other-tit{font-size: 2.8rem; line-height: 1.6; margin: 0 0 40px; text-align: center;}
.other-item .tit{font-size: 1.8rem; line-height: 1.6; margin: 0 0 15px;}
.other-item .m-photo img{transition: 1s;}
.other-item a:hover .tit{color: #009869;}
.other-item a:hover .m-photo img{transform: scale(1.05);}

@media screen and (min-width: 768px){
    .other:before{height: 55px; background: url("../img/report/bg-01.jpg") no-repeat center center;}
    .other:after{height: 80px; background: url("../img/report/bg-02.jpg") no-repeat center center;}
    
    .other-list{display: flex; flex-wrap: wrap;}
    .other-item{width: 29.26%; margin-right: 6.11%;}
    .other-item:nth-of-type(3n){margin-right: 0;}
}

@media screen and (min-width: 1921px){
    .other:before,
    .other:after{background-size: 100% 100%;}
}

@media screen and (max-width: 767px){
    .other:before{height: 30px; background: url("../img/report/bg-01_sp.jpg") no-repeat center center/100% 100%;}
    .other:after{height: 16px; background: url("../img/report/bg-02_sp.jpg") no-repeat center center/100% 100%;}
    
    .other-wrap{width: 100%; padding: 30px 0 50px;}
    .other .slick-slide{margin: 0 20px;}
    .other .slick-arrow{width: 40px; height: 60px; position: absolute; top: 28vw; margin-top: -30px; z-index: 10; text-indent: -9999px; cursor: pointer;}
    .other .slick-next{background: url("../img/report/btn-next.png") no-repeat top left/100% 100%; right: 0px;}
    .other .slick-prev{background: url("../img/report/btn-prev.png") no-repeat top left/100% 100%; left: 0px;}
    .other .slick-dots{display: flex; justify-content: center; align-items: center; margin: 15px 0 0 0;}
    .other .slick-dots li{width: 10px; height: 10px; border-radius: 100%; margin: 0 6px; background: #b5b5b5; text-indent: -9999px;}
    .other .slick-dots li.slick-active{background: #009869;}
    
    .other-tit{font-size: min(6vw,2.4rem); margin: 0 0 25px;}
}

/* Detail04 */
.detail04-box01 .inner .cap{padding: 70px 0 0 0;}

@media screen and (max-width: 767px){
    .detail04-box01 .cap{padding: 20px 0 0 0;}
}

/* Detail06 */

#detail06 .relate-info .txt-link{display: inline-block; margin: 10px 0 5px; position: relative; text-underline-offset: 5px}
#detail06 .relate-info .txt-link::after{content: ''; position: absolute; top: 50%; right: -30px; background: #009869; width: 16px; height: 16px; margin-top: -8px; line-height: 1; display: block; mask: url(../img/common/ic-open.svg) no-repeat top left / 100% 100%; -webkit-mask: url(../img/common/ic-open.svg) no-repeat top left / 100% 100%;}

/* Detail07 */
#detail07 .mecIndustry figure {
    margin-top: 35px;
}

#detail07 .mecIndustry .img02 {
    max-width: 800px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width: 767px){
    #detail07 .mecIndustry figure {
        margin-top: 15px;
    }
    #detail07 .img.only-sp{
        margin-bottom: 15px;
    }
}