/*============================
#main
============================*/
#main {
}
#main .content {
  position: relative;
  padding-bottom: 0;
}

/*============================
#mv
============================*/
#mv {
  background-color: #b6c866;
}
#mv h1 {
  text-align: center;
}
#mv h1 img {
  max-width: 100%;
  margin:0 auto;
}

/* #mv,#about,#jcredit,#plan{
  z-index: 1;
} */

/*============================
#about
============================*/
#about {
  position: relative;
  background-color: #b6c866;
  padding-top: 66px;
  text-align: center;
  }
  #about::before,
  #about::after{
  position: absolute;
  content: "";
  display: block;
  width:100%;
  height:100%;
  z-index: 100;
  pointer-events: none;
}
  #about::before{
    width:12.29%;
    max-width: 177px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_about_01.png)
    transparent left top no-repeat;
    background-size: contain;
    left:43px;
    top:0;
    z-index: 5;
  }
  #about::after{
    width:25%;
    max-width: 360px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_about_02.png)
    transparent right top no-repeat;
    background-size: contain;
    right:0;
    top:0;
    z-index: 6;
  }
#about h3.ttl_sub {
  color: #315829;
  font-size: 20px;
  font-weight: 700;
  opacity: 40%;
}
#about h2.ttl {
  color: #315829;
  font-size: 36px;
  font-weight: 700;
  line-height: 54px;
  padding-top: 2px;
}
#about div.txt_area{
  padding-top: 50px;
}
#about p.txt {
  color: #315829;
  font-weight: 600;
  line-height: 28px;
  font-size: 14px;
}
#about p.txt + p.txt + p.txt{
  padding-top: 35px;
  padding-bottom: 85px;
}
#about p.img_box {
  max-width: 824px;
  background-color: #fff;
  padding: 20px 0;
  border-radius: 16px;
  margin: 0 auto;
}
#about p.img_box img {
  width: 87%;
}
#about p.btn_area {
  padding-top: 140px;
  padding-bottom: 128px;
}
#about p.btn_area a {
  position: relative;
  color: #315829;
  background-color: #ebe1a8;
  border: #315829 solid 4px;
  border-radius: 16px;
  padding: 26px 107px 27px 115px;
  text-decoration: none;
  font-weight: 700;
}
#about p.btn_area a:hover{
  opacity: 0.8;
}
#about p.btn_area a:before{
  content: "";
  position: absolute;
  width: 57px;
  height: 127px;
  border: none;
  left: 25px;
  top: -32px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/img04.png)
    no-repeat;
}
#about p.btn_area a:after{
  content: "";
  position: absolute;
  width: 29px;
  height: 29px;
  border: none;
  right: 50px;
  top: 29px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/arrow.png)
    no-repeat;
}
/*============================
#jcredit
============================*/
#jcredit {
  position:relative;
  background-color: #ebe1a8;
  padding-top: 66px;
  background-size: cover;
  text-align: center;
  }
#jcredit::after{
  position:absolute;
  content:"";
  display:block;
  width:100%;
  height: 24vw;
  background-image: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/ellipse.png);
  background-size:2420px;
  background-position: top center;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
  z-index:1;
} 
#jcredit .bg_jcredit{
  position: relative;
  pointer-events: none;
}
#jcredit .bg_jcredit::before,
#jcredit .bg_jcredit::after{
  position:absolute;
  content:"";
  display:block;
  width:100%;
  height:100%;
  z-index: 100;
  pointer-events: none;
}
#jcredit .bg_jcredit::before{
  width:24.44%;
  height:950px;
  max-width: 352px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_jcredit_01.png)
    transparent right top no-repeat;
  background-size: 100% auto;
  left:-5px;
  top:-155px;
  z-index: 5;
}
#jcredit .bg_jcredit::after{
  width:31%;
  height:1017px;
  max-width: 447px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_jcredit_02.png)
    transparent left top no-repeat;
  background-size: 100% auto;
  right:0;
  top:-110px;
  z-index: 6;
}

#jcredit h3.ttl_sub {
  color: #315829;
  font-size: 20px;
  font-weight: 700;
  opacity: 40%;
}
#jcredit h2.ttl {
  color: #315829;
  font-size: 36px;
  font-weight: 700;
  line-height: 54px;
  padding-top: 2px;
}
#jcredit div.txt_area {
  padding-top: 50px;
}

#jcredit div.effort .txt_area {
    padding-top: 10px;
}
#jcredit p.txt {
  color: #315829;
  font-weight: 500;
}
#jcredit p.img_box {
  background-color: #fff;
  max-width: 318px;
  margin: 0 auto;
  border-radius: 8px;
  margin-top: 45px;
}
#jcredit p.img_box img {
  padding: 6px 0;
}
#jcredit p.img_box.bg_jcredit_02{
  position:relative;
}
#jcredit p.img_box.bg_jcredit_02::before,
#jcredit p.img_box.bg_jcredit_02::after{
  position: absolute;
  content: "";
  display: block;
  width:100%;
  height:100%;
  z-index: 100;
  pointer-events: none;
}
#jcredit p.img_box.bg_jcredit_02::before{
  width:6.7%;
  height:164px;
  max-width: 97px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_item_08.png)
    transparent center top no-repeat;
  background-size: 100% auto;
  left:7px;
  bottom:-118px;
  z-index: 7;
}
#jcredit p.img_box.bg_jcredit_02::after{
  width:9.5%;
  height:269px;
  max-width: 138px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_item_07.png)
    transparent center top no-repeat;
  background-size: 100% auto;
  right:-40px;
  bottom:47px;
  z-index: 8;
}
#jcredit p.source{
  color: #315829;
  font-size: 13px;
  padding-top: 9px;
  padding-bottom: 54px;
}
#jcredit div.effort {
  position:relative;
  max-width: 1200px;
  background-color: #fff;
  border: #315829 solid 4px;
  border-radius: 40px;
  padding: 81px 20px 87px;
  margin: 0 auto;
  z-index: 2;
}
@media screen and (max-width: 1240px) {
  #jcredit div.effort {
    margin: 0 20px;
  }
}
#jcredit .bg01{
  position: absolute;
  content: "";
  display: block;
  width: 447px;
  height: 194px;
  background-image: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_item_06.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top right;
  top: -3%;
  right: 0;
  margin: auto;
  z-index: 30;
}
#jcredit div.effort h2.ttl {
}
#jcredit div.effort p.txt {
  font-weight: 500;
}
#jcredit div.effort p.txt + p.txt {
    padding-top: 35px;
}
#jcredit div.effort p.asterisk {
  color: #315829;
  font-size: 13px;
  padding-bottom: 30px;
  font-weight: 500;
}
#jcredit div.effort p.img_box {
  max-width: 100%;
  margin: 0 auto;
  padding-top: 63px;
}
#jcredit div.effort p.img_box img {
  max-width: 100%;
}
#jcredit div.effort p.btn_area {
  padding-top: 68px;
}
#jcredit div.effort p.btn_area a span.logo img{
  height: 18px;
  vertical-align: baseline;
}
#jcredit div.effort p.btn_area a {
  display: block;
  max-width: 540px;
  position: relative;
  margin: 0 auto;
  border: #ff0a14 solid 2px;
  border-radius: 50px;
  padding: 26px 24px 27px 0;
  text-align: center;
  color: #ff0a14;
  text-decoration: none;
  font-size: 20px;
  font-weight: 800;
  overflow: hidden;
}
@media print, screen and (min-width: 768px)  {
  #jcredit div.effort p.btn_area a:before{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-color: #ff0a14;
    transform: scale(0, 1);
    transform-origin: right top;
    transition: transform 0.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    z-index: -2;
  }
  #jcredit div.effort p.btn_area a:hover{
    color: #ffffff;
    transition: all 0.2s;
  }
  #jcredit div.effort p.btn_area a:hover:before{
    transform: scale(1, 1);
    transform-origin: left top;
    visibility: visible;
    }
    #jcredit div.effort p.btn_area a:hover:after{
    transition: all 0.2s;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/arrow_white.png)
      no-repeat;
  }
  #jcredit div.effort p.btn_area a span.logo img.col_white{
    display: none;
  }
  #jcredit div.effort p.btn_area a:hover .logo img.col_red {
    display: none;
  }
  #jcredit div.effort p.btn_area a:hover .logo img.col_white {
    display: inline-block;
    }
}
#jcredit div.effort p.btn_area a:after{
  content: "";
  position: absolute;
  width: 29px;
  height: 29px;
  border: none;
  right: 64px;
  top: 35px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/arrow02.png)
    no-repeat;
}
/*============================
#plan
============================*/
#plan {
  background-color: #c8d58e;
  padding-top: 82px;
  text-align: center;
  overflow:visible;
  background-image: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_item_09.png),
    url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_item_10.png);
  background-position: top 20.5% left 7%, top 17.29% right 11%;
  background-size: 11.25%, 10%;
  background-repeat: no-repeat, no-repeat;
}
#plan h3.ttl_sub {
  color: #315829;
  font-size: 20px;
  font-weight: 700;
  opacity: 40%;
}
#plan h3.ttl_sub {
  color: #315829;
  font-size: 20px;
  font-weight: 700;
  opacity: 40%;
}
#plan h2.ttl {
  color: #315829;
  font-size: 36px;
  font-weight: 700;
  line-height: 54px;
  padding-top: 2px;
}
#plan div.txt_area {
  padding-top: 50px;
}
#plan p.txt {
  font-weight: 500;
  color: #315829;
}
#plan p.txt + p.txt {
  padding-top: 35px;
}
#plan p.txt + p.txt + p.txt {
  padding-top: 0;
}
#plan p.asterisk {
  color: #315829;
  font-size: 13px;
  padding-top: 33px;
  font-weight: 500;
}
#plan div.sec_inner {
  padding-top: 61px;
  padding-bottom: 80px;
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 {
  flex-wrap: nowrap;
  max-width:920px;
  margin:0 auto;
  gap:24px;
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 li.thum_text_link {
  max-width: 486px;
  width: auto;
  margin-right: 0;
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 li.thum_text_link + li {
  }
#plan div.sec_inner ul.thum_text_link_wrap._col2 li.thum_text_link a {
  height: auto;
  align-items: center;
  justify-content: center;
  color: #333333;
  background-color:#fff;
  font-size: 30px;
  max-width: 430px;
  border-radius: 8px;
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_thum {
  margin-bottom: 0;
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_thum
  figure {
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_thum
  figure
  span.download_prevent {
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_thum
  figure
  span.download_prevent
  img {
  border-radius: 8px 8px 0 0;
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_txtarea {
  padding-right: 6%;
  padding-left: 6%;
  text-align: left;
  /* padding: 5px 30px 37px; */
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_txtarea
  p.thum_text_link_ttl {
  font-size: 16px;
  margin-bottom: 0;
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_txtarea
  p.thum_text_link_ttl
  sub {
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_txtarea
  p.thum_text_lnk_txt {
  font-size: 12px;
}

#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link
  a
  div.thum_text_link_txtarea
  p.thum_text_lnk_txt
  sub {
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 li {
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 li a {
  display: inline-block;
  
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 li + li a{
  width: 566px;
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 li.thum_text_link a:after{
  right: 5%;
  bottom: 13px;
}
#plan
  div.sec_inner
  ul.thum_text_link_wrap._col2
  li.thum_text_link:hover
  a:after {
  right:6%;
  bottom:12px;
}
#plan div.sec_inner ul.thum_text_link_wrap._col2 li a img {
  max-width: 100%;
  box-shadow: 0px 8px 64px 0px rgba(49, 88, 41, 0.3);
}
#plan p.btn_area {
  height: 138px;
}
#plan p.btn_area a {
  position: relative;
  color: #315829;
  background-color: #ebe1a8;
  border: #315829 solid 4px;
  border-radius: 16px;
  padding: 26px 107px 27px 115px;
  text-decoration: none;
  font-weight: 700;
}
#plan p.btn_area a:hover{
  opacity: 0.8;
}
#plan p.btn_area a:before{
  content: "";
  position: absolute;
  width: 57px;
  height: 127px;
  border: none;
  left: 25px;
  top: -32px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/img04.png)
    no-repeat;
}
#plan p.btn_area a:after{
  content: "";
  position: absolute;
  width: 29px;
  height: 29px;
  border: none;
  right: 50px;
  top: 29px;
  background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/arrow.png)
    no-repeat;
}
#main .breadcrumbs_wrap {
}
#main .breadcrumbs_wrap .content_inner {
}
#main .breadcrumbs_wrap .content_inner ol.breadcrumbs {
}
#main .breadcrumbs_wrap .content_inner ol.breadcrumbs li {
}
#main .breadcrumbs_wrap .content_inner ol.breadcrumbs li a {
}
#main .breadcrumbs_wrap .content_inner ol.breadcrumbs li a span {
}
#main .breadcrumbs_wrap .content_inner ol.breadcrumbs li span {
}
/*============================
SP
============================*/
@media screen and (max-width: 767px){
  #about::before{
display: none;
  }
  #about::after{
    width: 48%;
    height:78px;
    max-width: 180px;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_item_01.png)
      transparent right top no-repeat;
    background-size: contain;
    top: 3%;
  }
  #about h3.ttl_sub{
text-align: left;
    
font-size: 16px;
  }
  #about,
  #jcredit,
  #plan {
    padding-right: 27px;
    padding-left: 28px;
  }
  #jcredit h3.ttl_sub{
text-align: left;
    
font-size: 16px;
  }
  #about div.txt_area{
    text-align: left;
  }
  #about p.txt + p.txt{
padding-top: 35px;
  }
  #about p.txt + p.txt + p.txt{
  padding-bottom: 50px;
  }
  #about h2.ttl{
    padding-top: 26px;
    font-size: 24px;
    line-height: 36px;
    text-align: left;
  }
  #about p.img_box{
    max-width: 100%;
  }
  #about p.btn_area{
    padding-top: 70px;
    padding-bottom: 70px;
    white-space: nowrap;
  }
  #about p.btn_area a{
    display: block;
    padding-left: 0;
    padding-right: 0;
  }
  #about p.btn_area a:after{
    right: 45px;
  }
  #jcredit .bg_jcredit::before{
    width: 51%;
    height: 200px;
    max-width: 192px;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_item_04.png)
      transparent left top no-repeat;
    background-size: 100% auto;
    left: -10%;
    top: -124px;
    z-index: 6;
  }
  #jcredit .bg_jcredit::after{
    width:22.66%;
    height: 80px;
    max-width: 85px;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_jcredit_sp_02.png)
      transparent left top no-repeat;
    background-size: 100% auto;
    right: 32px;
    top: -373%;
    z-index: 6;
  }
  #jcredit h2.ttl{
    font-size: 24px;
    line-height: 36px;
    text-align: left;
    padding-top: 27.5px;
  }
  #jcredit p.txt{
font-size: 14px;
    
line-height: 28px;
  }
  #jcredit p.img_box{
    max-width: 71%;
  }
  #jcredit div.effort{
    position: relative;
    padding-top: 40px;
    padding-right: 24px;
    padding-bottom: 100px;
    padding-left: 28px;
    margin: 0 auto 0 -30px;
    border-left: none;
    border-radius: 0 40px 40px 0;
  }
  #jcredit div.effort::before {
    position: absolute;
    content: "";
    display: block;
    width: 54.93%;
    height: 133px;
    max-width: 206px;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_jcredit_sp_03.png) transparent left top no-repeat;
    background-size: 100% auto;
    right: -45px;
    top: -52px;
    z-index: 5;
    pointer-events: none;
  }
  #jcredit div.effort h2.ttl{
    text-align: left;
  }
  #jcredit div.effort .txt_area{
    padding-top: 0;
  }
  #jcredit div.effort p.btn_area{
    padding-top: 40px;
    white-space: nowrap;
  }
  #jcredit div.effort p.btn_area a {
    font-size: 12px;
    padding: 23px 24px 20px 0;
    line-height: 1.25;
  }
  #jcredit div.effort p.btn_area .box{
    display: inline-block;
    max-width: 260px;
    margin:0 auto;
  }
  #jcredit div.effort p.btn_area a span.logo{
display: block;
    width:auto;
    text-align: left;
  }
  #jcredit div.effort p.btn_area a span.logo img{
   width:64px;
  }
  #jcredit div.effort p.btn_area a span.logo img.col_white{
    display: none;
  }
  #jcredit div.effort p.btn_area a span.txt{
    display: inline-block;
font-size: 16px;
    text-indent: 1em;
  }
  #jcredit div.effort p.btn_area a:after{
    width: 18px;
    height: 14px;
    right: 14px;
    top: 0;
    bottom:0;
    margin:auto;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/icon_sp_arrow.png)
      no-repeat;
    background-size: contain;
  }
  #jcredit div.txt_area{
    text-align: left;
    padding-top: 38px;
  }
  #jcredit div.effort p.asterisk{
padding-top: 13px;
    
padding-bottom: 41px;
    
font-size: 12px;
  }
  #jcredit div.effort p.img_box{padding-top: 50px;}
  #jcredit p.source{
    font-size: 12px;
    padding-bottom: 82px;
  }
  #jcredit p.img_box.bg_jcredit_02::before,
  #jcredit p.img_box.bg_jcredit_02::after{
  display: none;
  }
  #plan {
    position: relative;
    background-color: #c8d58e;
    padding-top: 82px;
    text-align: center;
    overflow:visible;
    background-image:none;
  }
  #plan::before,
  #plan::after {
    position: absolute;
    content: "";
    display: block;
    z-index: 5;
    pointer-events: none;
  }
  #plan::before{
    width: 51.2%;
    height: 116px;
    max-width: 192px;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_jcredit_sp_04.png) transparent left top no-repeat;
    background-size: 100% auto;
    left: -10px;
    top: -62px;
    z-index: 6;
    pointer-events: none;
  }
  #plan::after {
    width: 33.6%;
    height: 144px;
    max-width: 126px;
    background: url(/jpn/consumer/products/cg/useful/decarbonization/jcredit/images/bg_jcredit_sp_05.png) transparent left top no-repeat;
    background-size: 100% auto;
    right: 41px;
    top: -30px;
    z-index: 7;
  }
  #plan h3.ttl_sub{
text-align: left;
    
font-size: 16px;
  }
  #plan h2.ttl{
    font-size: 24px;
    line-height: 36px;
    text-align: left;
    padding-top: 27px;
  }
  #plan div.txt_area{
padding-top: 39px;
  }
  #plan p.txt{
line-height: 28px;
    
font-size: 14px;
  }
  #plan p.txt + p.txt + p.txt{
padding-top: 35px;
  }
  #plan p.asterisk{
    font-size: 12px;
    padding-top: 72px;
  }
  #plan div.txt_area,
  p.asterisk {
    text-align: left;
  }
  #plan div.sec_inner ul.thum_text_link_wrap._col2 li.thum_text_link + li {
    padding-top: 16px;
  }
  #plan div.sec_inner ul.thum_text_link_wrap._col2 li + li a{
    width: 100%;
  }
  #plan p.btn_area {
  padding-bottom: 160px;
  white-space: nowrap;
  }
  #plan p.btn_area a{
    display: block;
    padding-left: 0;
    padding-right: 0;
  }
  #plan p.btn_area a:after{
    right: 45px;
  }
  #plan div.sec_inner{
    padding-top: 45px;
    padding-bottom: 30px;
  }
}