main section{
  padding: 0;
}
.pc{
  display: block;
}
#header{
  position: fixed;
}
@media (max-width: 767px) {
  .pc{
    display: none;
  }
}
.sp{
  display: none;
}
@media (max-width: 767px) {
  .sp{
    display: block;
  }
}
.ipadOsSafari #wrapper{
  overflow-x: visible;
}
#menu .mWrap .gbl #sub{
  padding: 0 6.3rem;
}

#menu .mWrap .gbl #sub li a{
  font-size: 2.2rem;
}
@media (max-width: 1200px) {
  #menu .mWrap .gbl #sub{
    padding: 0 4.3rem;
  }
  #menu .mWrap .gbl #sub li a {
    font-size: 1.8rem;
  }
}
@media (max-width: 767px) {
    #menu .mWrap .gbl #sub{
    padding: 0 2.3rem;
  }
  #menu .mWrap .gbl #sub li a {
    font-size: 2.1rem;
  }
}
#menu .mWrap .gbl #banners li a span img{
  width: 9.4rem;
  display: block;
}
#menu .mWrap .gbl #banners li a span:last-of-type {
  margin: 0;
}
#menu .mWrap .gbl #banners li a{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 7.2rem;
  gap: .4rem;
}
/* MVの指定ここから----------------------------- */
.mv{
  height: 53.26vw;
  position: relative;
  z-index: 1;
}
.mv__inner{
  display: flex;
}
.mv__l-box{
  width: 50.7333vw;
  height: 53.26vw;
  background: url(../images/sustainability/bg_mv.png);
  background-size: contain;
  margin-right: -.7333vw;
    position: relative;
  z-index: 1;
}
.mv__l-box-inner{
  margin-left: auto;
  margin-right: 0;
  position: relative;
}
.mv__l-box-inner img{
  transform: translateX(-2vw);
  opacity: 0;
}
.mv__r-box-top img {
  opacity: 0;
}
.mv__r-box-btm img {
  opacity: 0;
}
.mv__spoon{
  width: 9vw;
  position: absolute;
  left: 1.13vw;
  top: 10.066vw;
}
.mv__ttl-top{
  width: 36.933vw;
  top: 14.33vw;
  left: 8.8vw;
  position: absolute;
}
.mv__ttl-btm{
  width: 42vw;
  top: 29.33vw;
  left: 4vw;
  position: absolute;
}
.mv__r-box{
  width: 50vw;
  background: url(../images/sustainability/bg_mv.png);
  background-size: cover;
}
.mv__r-box-inner{
  display: flex;
  flex-direction: column;
}
.mv__r-box-top{
  display: flex;
}
.mv__r-box-top div{
  display: flex;
  flex-direction: column;
}
.mv__r-box-btm{
  display: flex;
}
.mv__r-box-btm>div{
  display: flex;
  flex-direction: column;
}
.mv__r-box-btm>div>div{
  display: flex;
}
.mv__photo{
  display: block;
}
.mv__photo--01{
  width: 33.33vw;
}
.mv__photo--02{
  width: 16.66vw;
}
.mv__photo--03{
  width: 16.66vw;
}
.mv__photo--04{
  width: 21.4vw;
}
.mv__photo--05{
  width: 28.66vw;
}
.mv__photo--06{
  width: 14.33vw;
}
.mv__photo--07{
  width: 14.33vw;
}
@media (max-width: 767px) {
  .mv{
    height: 72.1rem;
    position: relative;
    z-index: 1;
  }
  .mv__inner{
    display: block;
    position:relative;
  }
  .mv__l-box{
    width: 100%;
    height: 33.7rem;
    background: url(../images/sustainability/bg_mv_sp.png);
    background-size: contain;
    margin-right:0;
    position: absolute;
    z-index: 1;
    top: 19rem;
    left: 0;
    right: 0;
  }
  .mv__l-box-inner{
    margin-left: auto;
    margin-right: 0;
    position: relative;
  }
  .mv__r-box-top img {
    opacity: 0;
  }
  .mv__r-box-btm img {
    opacity: 0;
  }
  .mv__spoon{
    width: 8.8rem;
    position: absolute;
    left:0;
    top: 1.5rem;
  }
  .mv__ttl-top{
    width: 30.3rem;
    top: 6.19rem;
    left: 3.6rem;
    position: absolute;
  }
  .mv__ttl-btm{
    width: 30.3rem;
    top: 20.5rem;
    left: 3.1rem;
    position: absolute;
  }
  .mv__r-box{
    width: 100%;
    background:none;
  }
  .mv__r-box-inner{
    display: flex;
    flex-direction: column;
    gap: 32.1rem;
  }
  .mv__r-box-top{
    display: flex;
  }
  .mv__r-box-top div{
    display: flex;
    flex-direction: column;
  }
  .mv__r-box-btm{
    display: flex;
  }
  .mv__r-box-btm>div{
    display: flex;
    flex-direction: column;
  }
  .mv__r-box-btm>div>div{
    display: flex;
  }
  .mv__photo{
    display: block;
  }
  .mv__photo--01{
    width:25rem;
  }
  .mv__photo--02{
    width: 12.5rem;
  }
  .mv__photo--03{
    width: 12.5rem;
  }
  .mv__photo--04{
    width: 16rem;
  }
  .mv__photo--05{
    width: 21.5rem;
  }
  .mv__photo--06{
    width: 10.76rem;
  }
  .mv__photo--07{
    width: 10.6rem;
  }
}
/* MVの指定ここまで----------------------------- */


/* 私たちの想いと取り組みの指定ここから----------------------------- */
.visionSec{
  padding: 14.1rem 0 15rem;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  background-color: #F7F7F7;
}
.visionSec__inner{
  display: flex;
  width: 130rem;
  margin: 0 auto;
}
.visionSec__l-box{
  position: relative;
  width: 57.5rem;
}
.visionSec__leaf{
  width: 24.5rem;
  position: absolute;
  left: -4.4rem;
  top: 15.7rem;
  z-index: 1;
}
.visionSec__spice{
  width: 20.2rem;
  position: absolute;
  right: -1.4rem;
  top: -.9rem;
  z-index: 1;
}
.visionSec__photo{
  display: block;
  width: 57.5rem;
}
.visionSec__r-box{
  margin-left: 6rem;
  width: 66.9rem;
}
.visionSec__r-box h2{
  font-size: 4.8rem;
  letter-spacing: 0;
  font-weight: 700;
  margin-top: .6rem;
  margin-bottom: 2.5rem;
}
.visionSec__r-box p{
  font-size: 2rem;
  letter-spacing: 0;
  font-weight: 500;
  line-height: 2;
  margin-bottom: 2.5rem;
}
.visionSec__r-box p:last-of-type{
  margin-bottom: 0;
}
@media (max-width: 1320px) {
  .visionSec__inner{
    width: 120rem;
  }
  .visionSec__r-box{
    width: 55.6rem;
  }
}
@media(max-width:1200px){
  .visionSec__inner{
    width: 95vw;
  }
  .visionSec__photo{
    width: 45vw;
  }
  .visionSec__spice{
    width: 14.94vw;
    right: 3vw;
    top: -.3vw;
  }
  .visionSec__leaf{
    width: 15.6vw;
    left: -2.6vw;
    top: 14vw;
  }
}
@media (max-width: 767px) {
  .visionSec{
    padding: 7.35rem 0 7rem;
  }
  .visionSec__inner{
    flex-direction: column;
  }
  .visionSec__l-box{
    position: relative;
    width: 32.7rem;
    margin: 0 auto;
    display: flex;
    align-items: center;
  }
  .visionSec__l-box h2{
    font-size: 2.5rem;
    font-weight: 700;
    letter-spacing: 0;
    margin-left: 2rem;
    font-weight: 700;
  }
  .visionSec__photo{
    width: 15.2rem;
  }
  .visionSec__leaf{
    width: 7.71rem;
    position: absolute;
    left: -1.98rem;
    top: 5.8rem;
    z-index: 1;
  }
  .visionSec__spice{
    width: 5.897rem;
    position: absolute;
    right: auto;
    left: 9.7rem;
    top: -1.8rem;
    z-index: 1;
  }
  .visionSec__r-box{
    width: 30.5rem;
    margin: 0 auto;
    margin-top: 4.6rem;
  }
  .visionSec__r-box h2{
    font-size: 4.8rem;
    letter-spacing: 0;
    font-weight: 700;
    margin-top: .6rem;
    margin-bottom: 2.5rem;
  }
  .visionSec__r-box p{
    font-size: 1.6rem;
    letter-spacing: 0;
    line-height: 2;
    font-weight: 500;
    margin-bottom: 1.5rem;
  }
}
/* 私たちの想いと取り組みの指定ここまで----------------------------- */


/* プロジェクトの概要の指定ここから----------------------------- */
.projectSec{
  background-color: #fff;
  position: relative;
  z-index: 0;
  /* padding-bottom: 8.25rem; */
}
.projectSec__cont-wrp.remove .projectSec__cont::after{
  display: none;
}
.projectSec__cont-wrp.remove .projectSec__cont::before{
  display: none;
}
.projectSec__ttl-en-cont{
  width: 100%;
  height: 61.8rem;
  background-image: url(../images/sustainability/bg_project.png);
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;
  padding-top: 23.4rem;
  box-sizing: border-box;
  text-align: center;
  position: relative;
  z-index: -1;
}
.projectSec__ttl-en-cont:after{
  position: absolute;
  background-image: url(../images/sustainability/bg_project_top.png);
  background-size: contain;
  bottom: -0.2rem;
  content: "";
  background-repeat: repeat-x;
  width: 100%;
  height: 1rem;
  left: 0;
}
.projectSec__ttl-en{
  width: 24.7rem;
  display: block;
  margin: 0 auto;
}
.projectSec__ttl-cont{
  width: 113.6rem;
  height: 21.9rem;
  background-image: url(../images/sustainability/bg_project_ttl.png);
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0 auto;
  margin-top: -14.2rem;
  position: relative;
  padding-top: 5rem;
}
.projectSec__ttl{
  font-size: 6.5rem;
  font-weight: 700;
  letter-spacing: 0;
  text-align: center;
  line-height: 1;
}
.projectSec__ttl span{
  display: block;
  font-size: 3.5rem;
  font-weight: 700;
  letter-spacing: 0;
  margin-top: 2rem;
}
.projectSec__spice01{
  position: absolute;
  width: 15.2rem;
  left: 8.9rem;
  top: -7.1rem;
}
.projectSec__spice02{
  position: absolute;
  width: 11.2rem;
  right: 11.7rem;
  top: -5.3rem;
}
.projectSec__cont{
  position: relative;
  display: flex;
  flex-direction: column;
}
.projectSec__decorate{
  position: sticky;
  top: 0;
  margin-top: -6.4rem;
  height:100vh;
  z-index: -2;
  width: 8.2vw;
  object-fit: cover;
}
.projectSec__inner-top{
  display: flex;
  width: 100%;
}
.projectSec__inner{
  /* width: 110rem; */
  width: 100%;
  margin-inline: auto;
  display: flex;
  align-items: flex-start;
  padding-bottom: 2rem;
}
.projectSec__inner02{
  width: 110rem;
  margin-inline: auto;
  display: flex;
  align-items: flex-start;
  padding-bottom: 8.25rem;
  flex-direction: column;

}
.projectSec__img-box{
  width: 58.5rem;
  height: 47.2rem;
  position: sticky;
  z-index: -2;
  top: 0;
  left: 0;
}
.projectSec__img{
  width: 100%;
  height: 47.2rem;
  box-sizing: border-box;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  opacity: 0;
  left: 0;
  transition: .7s;
}
.projectSec__img.active{
  opacity: 1;
}
.projectSec__txt-box{
  width: 41rem;
  margin-left: 11rem;
}
.projectSec__txt-item{
  padding: 18rem 0;
  display: flex;
  align-items: center;
}
.projectSec__txt{
  font-size: 2rem;
  line-height: 2;
  letter-spacing: 0;
  font-weight: 700;
}
.projectSec__txt-l{
  font-size: 4.1rem;
  padding-bottom: 1rem;
  border-bottom: .3rem solid #3D2600;
  letter-spacing: 0;
  font-weight: 700;
  margin-top: .3rem;
}
.projectSec__skip{
  position: sticky;
  height: 2.7rem;
  /* position: absolute; */
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  bottom: 6.9rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 4.4rem;
  gap: .58rem;
  padding-bottom: .639rem;
  border-bottom: 1px solid #3D2600;
  opacity: 0;
  transition: .4s;
}
.projectSec__skip.active{
  opacity: 1;
}
.projectSec__skip:hover{
  opacity: .7;
}
.projectSec__skip-txt{
  width: 2.76rem;
}
.projectSec__skip-arrow{
  width: 1rem;
}

@media(max-width:1330px){
  .projectSec__decorate{
    width: 6.2vw;
    /* height: 100vh; */
  }
  .projectSec__inner02{
    width: 82vw;
  }
  .projectSec__txt-box{
    margin-left: 3vw;
    width: 33.7vw;
  }
}
@media (max-width: 767px) {
  .projectSec{
    padding-bottom: 0;
  }
  .projectSec__ttl-en-cont{
    height: 26.4rem;
    background-image: url(../images/sustainability/bg_project_sp.png);
    padding-top: 10.4rem;
  }
  .projectSec__ttl-en-cont:after{
    background-image: url(../images/sustainability/bg_project_top_sp.png);
    height: .6rem;
  }
  .projectSec__ttl-en{
    width: 10.6rem;
  }
  .projectSec__ttl-cont{
    width: 33.5rem;
    height: 9rem;
    background-image: url(../images/sustainability/bg_project_ttl_sp.png);
    margin-top: -4.6rem;
    padding-top: 2.5rem;
  }
  .projectSec__ttl{
    font-size: 2.4rem;
  }
  .projectSec__spice01{
    width: 5.85rem;
    left: -.2rem;
    top: -.1rem;
  }
  .projectSec__spice02{
    width: 5.1rem;
    right: -.3rem;
    top: .8rem;
  }
  .projectSec__cont{
    z-index: 0;
    padding-bottom: 8rem;
    margin-top: -3.8rem;
    padding-top: 7.5rem;
  }
  .projectSec__inner{
    width: 82vw;
  }
  .projectSec__inner02{
    width: 100%;
  }
  .projectSec__decorate{
    display: none;
  }
  .projectSec__cont:after{
    content: "";
    position: absolute;
    background-image: url(../images/sustainability/bg_project_l_sp.png);
    background-repeat: repeat-y;
    background-size: contain;
    width: 1.3rem;
    height: 100%;
    background-position: right;
    top: 0;
    left: 0;
  }
  .projectSec__cont:before{
    content: "";
    position: absolute;
    background-image: url(../images/sustainability/bg_project_r_sp.png);
    background-repeat: repeat-y;
    background-size: contain;
    width: 1.3rem;
    height: 100%;
    top: 0;
    right: 0;
    background-position: left;
  }
  .projectSec__inner{
    width: 30.5rem;
    margin-top: 0;
    flex-direction: column;
  }
  .projectSec__img-box{
    display: none;
  }
  .projectSec__img{
    margin: 0 auto;
    width: 30.3rem;
    position: static;
    height: auto;
    opacity: 1;
  }
  .projectSec__img01{
    margin-top: 0;
  }
  .projectSec__img02{
    margin-top: 7.1rem;
  }
  .projectSec__img03{
    margin-top: 5.6rem;
  }
  .projectSec__img04{
    margin-top: 5.4rem;
  }
  .projectSec__img:nth-of-type(2){
    margin-top: 3.9rem;
  }
  .projectSec__img.active{
    opacity: 1;
  }
  .projectSec__txt-box{
    display: none;
  }
  .projectSec__txt-item{
    height: auto;
    width: 28rem;
    margin: 0 auto;
    font-size: 1.6rem;
    padding: 0;
  }
  .projectSec__txt-item01{
    margin-top: 2.3rem;
    text-align: center;
    justify-content: center;
  }
  .projectSec__txt-item02{
    margin-top: 2.5rem;
  }
  .projectSec__txt-item03{
    margin-top: 2.5rem;
  }
  .projectSec__txt-item04{
    margin-top: 3rem;
  }
  .projectSec__txt{
    font-size: 1.6rem;
    line-height: 2;
  }
  .projectSec__txt-l{
    font-size: 3.2rem;
    padding-bottom: .8rem;
    border-bottom: .2rem solid #3D2600;
    margin-top: .6rem;
  }
  .projectSec__skip{
    display: none;
  }

}
/* プロジェクトの概要の指定ここまで----------------------------- */


/* プロジェクトへの参加方法の指定ここまで----------------------------- */
.joinSec{
  position: relative;
  background-color: #f7f7f7;
  padding: 13.7rem 0 39.1rem;
}
.joinSec:after{
  content: "";
  position: absolute;
  background-image: url(../images/sustainability/bg_join_top.png);
  background-size: contain;
  background-repeat: repeat-x;
  width: 100%;
  height: 1rem;
  top: -.8rem;
  left: 0;
}
.joinSec:before{
  content: "";
  position: absolute;
  background-image: url(../images/sustainability/bg_join_btm.png);
  background-position: bottom;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 87.1rem;
  bottom: 0;
  left: 0;
}
.joinSec__inner{
  width: 120rem;
  margin: 0 auto;
}
.joinSec__item-cont{
  width: 120rem;
  margin: 0 auto;
  position: relative;
}
.joinSec__item-cont:after{
  content: "";
  position: absolute;
  width: 21.7rem;
  height: 7.9rem;
  background-repeat: no-repeat;
  background-size: contain;
  left: -1.4rem;
  top: 4.6rem;
  background-image: url(../images/sustainability/text_join_02.svg);
}
.joinSec__ttl{
  margin-bottom: 7.8rem;
}
.joinSec__ttl img{
  display: block;
}
.joinSec__item{
  box-sizing: border-box;
  border: .2rem solid #3D2600;
  border-radius: 2rem;
  position: relative;
  padding: 5.6rem 0 6.5rem;
  text-align: center;
  background-color: #F7F7F7;
}
.joinSec__item:after{
  content: "";
  position: absolute;
  width: 21.7rem;
  height: 7.9rem;
  background-repeat: no-repeat;
  background-size: contain;
  left: -1.5rem;
  top: 4.6rem;
}
.joinSec__item01{
  margin: 0 auto;
  margin-bottom: 4rem;
  width: 120rem;
}
.joinSec__item01:after{
  background-image: url(../images/sustainability/text_join_01.svg);
}
.joinSec__item-ttl{
  font-size: 3.6rem;
  letter-spacing: 0;
  font-weight: 700;
}
.joinSec__item-txt{
  background-color: #fff;
  border-radius: .9rem;
  width: 70.2rem;
  margin: 0 auto;
  margin-top: 3.9rem;
  font-size: 1.6rem;
  letter-spacing: 0;
  padding: .9rem 0;
  box-shadow: inset .087rem 0 0 #b3b3b3, inset 0 .087rem 0 #b3b3b3;
  position: relative;
}
.joinSec__item-txt:after{
  position: absolute;
  content: "";
  background-image: url(../images/sustainability/icon_join_arrow.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 3.6rem;
  height: 1.8rem;
  bottom: -1.7rem;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.joinSec__item-txt span{
  font-weight: 700;
  color: #3D8943;
}
.joinSec__spice{
  width: 104.1rem;
  margin: 0 auto;
  margin-top: 7.4rem;
}
.joinSec__step-box{
  display: flex;
  justify-content: center;
  gap: 6rem;
  margin-top: 5.4rem;
}
.joinSec__step-item{
  width: 28rem;
  background-color: #fff;
  border-radius: 1.5rem;
  border: .1rem solid #000;
  position: relative;
}
.joinSec__step-item:last-of-type:after{
  display: none;
}
.joinSec__step-item:after{
  position: absolute;
  content: "";
  background-image: url(../images/sustainability/icon_join_item_arrow.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 1.7rem;
  height: 2.4rem;
  top: 15rem;
  right: -3.9rem;
}
.joinSec__item-top{
  background-color: #3D2600;
  height: 7.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.5rem 1.5rem 0 0;
}
.joinSec__item-step01{
  width: 6.85rem;
  display: block;
}
.joinSec__item-step02{
  width: 7.25rem;
  display: block;
}
.joinSec__item-step03{
  width: 7.25rem;
  display: block;
}
.joinSec__icon{
  width: 10.6rem;
  display: block;
  position: absolute;
  margin: 0 auto;
  bottom: 3.1rem;
  right: 0;
  left: 0;
}
.joinSec__item-btm{
  height: 25rem;
  position: relative;
}
.joinSec__item-btm-txt{
  font-size: 2.2rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.5;
  padding-top: 3.1rem;
}
.joinSec__item-btm-txt01{
  padding-top: 4.7rem;
}
.joinSec__movie-ttl{
  font-size: 5rem;
  margin-top: 13.9rem;
}
.joinSec__movie-txt{
  font-size: 1.8rem;
  margin-top: 1.6rem;
  line-height: 2;
}
.joinSec__movie-txt span{
  color: #3D8943;
}
.joinSec #openModal{
  margin: 0 auto;
  display: block;
  margin-top: 5.2rem;
  width: 100rem;
  position: relative;
  cursor: pointer;
  transition: .3s;
}
.joinSec #openModal:hover{
  opacity: .8;
}
.joinSec #openModal .special__video-arrow{
  position: absolute;
  right: 30rem;
  top: 25.5rem;
  width: 8.2rem;
}
.joinSec #openModal .special__video-txt{
  position: absolute;
  left: 30.3rem;
  top: 27.4rem;
  width: 28.5rem;
}
.joinSec__note{
  height: 4rem;
  line-height: 4rem;
  box-shadow: inset .087rem 0 0 #b3b3b3, inset 0 .087rem 0 #b3b3b3;
  font-size: 1.2rem;
  letter-spacing: 0;
  font-weight: 500;
  background-color: #fff;
  border-radius: 1rem;
  width: 50.7rem;
  margin: 0 auto;
  margin-top: 3.1rem;
}
.special__video-txt.sustainability{
  font-size: 2.4rem;
  margin-top: 8.4rem;
}
.special__video-txt.sustainability:before{
  height:8.78rem;
  right: 25.567rem;
  top: -.008rem;
  transform: rotate(16deg);
}
.special__video-txt.sustainability:after{
  height:8.78rem;
  left: 25.567rem;
  top: -.008rem;
  transform: rotate(-16deg);
}
.special__video-txt.sustainability span{
  color: #3D8943;
  display: inline-block;
  font-size: 2.4rem;
}
.special__video-txt.sustainability img{
  width: 26.2rem;
  display: block;
  margin: 0 auto;
  margin-top: 1rem;
}
@media (max-width: 1270px) {
  .joinSec__item-box{
    padding: 0 5.6rem;
  }
  .joinSec__item-cont{
    width: 100%;
  }
  .joinSec__item01{
    width: 100%;
  }
  .special__video-txt.sustainability:before{
    right: 19.567rem;

  }
  .special__video-txt.sustainability:after{
    left: 19.567rem;
  }
}
@media (max-width: 767px) {
  .joinSec{
    padding: 7.7rem 0 14.8rem;
  }
  .joinSec:after{
    background-image: url(../images/sustainability/bg_join_top_sp.png);
    height: .8rem;
    top: -.01rem;
  }
  .joinSec:before{
    background-image: url(../images/sustainability/bg_join_btm_sp.png);
    height: 31.4rem;
  }
  .joinSec__inner{
    width: 100%;
  }
  .joinSec__ttl{
    margin: 0 auto;
    margin-bottom: 6rem;
    width: 33.6rem;
  }
  .joinSec__item-cont{
    padding:0 1.2rem;
  }
  .joinSec__item-cont:after{
    width: 16.2rem;
    height: 5.8rem;
    left: 1rem;
    top: 2.3rem;
    background-image: url(../images/sustainability/text_join_02.svg);
  }
  .joinSec__item{
    padding: 9.2rem 1.6rem 6rem;
    width: 100%;
  }
  .joinSec__item02{
    margin: 0 auto;
    padding-right:0;
    padding-left: 0;
    width: 33.6rem;
  }
  .joinSec__item02 .special__date-cont{
    width: 29.5rem;
  }
  .joinSec__item:after{
    width: 16.2rem;
    height: 5.8rem;
    left: -1.2rem;
    top: 2.3rem;
  }
  .joinSec__item01{
    margin: 0 auto;
    margin-bottom: 3rem;
    width: 33.6rem;
  }
  .joinSec__item01:after{
    background-image: url(../images/sustainability/text_join_01.svg);
  }
  .joinSec__item-ttl{
    font-size: 2.4rem;
    line-height: 1.5;
  }
  .joinSec__item-txt{
    width: 30.5rem;
    margin-top: 2.1rem;
    font-size: 1.4rem;
    text-align: left;
    padding:1.1rem 1.2rem 1.4rem 1.6rem;
    line-height: 1.5;
    box-shadow: inset .087rem 0 0 #b3b3b3, inset 0 .087rem 0 #b3b3b3;
  }
  .joinSec__item-txt:after{
    width: 2.4rem;
    height: 1.4rem;
    bottom: -1.3rem;
  }
  .joinSec__spice{
    width: 27.4rem;
    margin-top: 3rem;
  }

  .joinSec__step-box{
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    gap: 3.5rem;
    margin-top: 3rem;
    max-width: 100%;
    left: 0;
    margin-left: 0;
    padding:0 4.8rem;
    justify-content: flex-start;
  }
  .joinSec__step-item{
    width: 20.4rem;
    border-radius: 1rem;
    flex-shrink: 0;
  }
  .joinSec__step-item:last-of-type{
    margin-right: 4.8rem;
  }
  .joinSec__step-item.fade-in{
    opacity: 1;
    transform: translateY(0);
  }
  .joinSec__step-item:after{
    width: 1.3rem;
    height: 1.7rem;
    top: 11rem;
    right: -2.5rem;
  }
  .joinSec__item-top{
    height: 5.6rem;
    border-radius: 1rem 1rem 0 0;
  }
  .joinSec__item-step01{
    width: 4.9rem;
  }
  .joinSec__item-step02{
    width: 5.2rem;
  }
  .joinSec__item-step03{
    width: 5.2rem;
  }
  .joinSec__icon{
    width: 8.3rem;
    bottom: 2rem;
  }
  .joinSec__item-btm{
    height: 18.2rem;
  }
  .joinSec__item-btm-txt{
    font-size:1.6rem;
    padding-top: 2.2rem;
  }
  .joinSec__item-btm-txt01{
    padding-top: 3.4rem;
  }
  .joinSec__scroll-txt{
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0;
    text-align: center;
    letter-spacing: 0;
    position: relative;
    margin-top: 1rem;
    display: inline-block;
  }
  .joinSec__scroll-txt:after{
    content: "";
    position:absolute;
    background-image: url(../images/sustainability/icon_join_scroll_arrow.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.3rem;
    height: .5rem;
    right: -1.5rem;
    top: 0;
    bottom: 0;
    margin: auto 0;
  }
  .joinSec__movie-ttl{
    font-size: 5rem;
    margin-top: 13.9rem;
  }
  .joinSec__movie-txt{
    font-size: 1.8rem;
    margin-top: 1.6rem;
    line-height: 2;
  }
  .joinSec__movie-txt span{
    color: #3D8943;
  }
  .joinSec #openModal{
    margin-top: 2.7rem;
    width: 29.1rem;
    transition: .3s;
  }
  .joinSec #openModal:hover{
    opacity: .8;
  }
  .joinSec #openModal .special__video-arrow{
    right: 4rem;
    top: 6.4rem;
    width: 4.3rem;
  }
  .joinSec #openModal .special__video-txt{
    left: 4.2rem;
    top: 7.5rem;
    width:15.1rem;
  }
  .joinSec__note{
    width: 28.9rem;
    height: 6.4rem;
    line-height: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    margin-top: 1rem;
  }
  .special__video-txt.sustainability{
    font-size: 1.6rem;
    line-height: 1.6;
    margin-top:4rem;
  }
  .special__video-txt.sustainability:before{
    height:9.8rem;
    right: -.4rem;
    top: -.02rem;
    transform: rotate(18deg);
  }
  .special__video-txt.sustainability:after{
    height:9.8rem;
    left: -.4rem;
    top: -.02rem;
    transform: rotate(-18deg);
  }
  .special__video-txt.sustainability span{
    color: #3D8943;
    display: inline-block;
    font-size: 1.6rem;
  }
  .special__video-txt.sustainability img{
    width: 19.3rem;
    display: block;
    margin: 0 auto;
    margin-top: .8rem;
  }
  .joinSec__item-box{
    padding: 0;
  }
}
/* プロジェクトの参加方法の指定ここまで----------------------------- */


/* 寄付の活用方法の指定ここから----------------------------- */
.donationSec{
  background-image: url(../images/sustainability/bg_donation.png);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
  margin-top: -2.7rem;
  padding: 15.2rem 0 11.6rem;
  box-sizing: border-box;
}
.donationSec:after{
  content: "";
  position: absolute;
  background-image: url(../images/sustainability/bg_donation_top.png);
  background-size: contain;
  background-repeat: repeat-x;
  width: 100%;
  height: 2rem;
  top: -1.6rem;
  left: 0;
}
.donationSec:before{
  content: "";
  position: absolute;
  background-image: url(../images/sustainability/bg_donation_btm.png);
  background-size: contain;
  background-repeat: repeat-x;
  width: 100%;
  height: 3.4rem;
  bottom: -3rem;
  left: 0;
}
.donationSec__inner{
  width: 110rem;
  margin: 0 auto;
  text-align: center;
}
.donationSec__ttl{
  font-size: 5rem;
  letter-spacing: 0;
  padding: 0 1rem;
  border-bottom: .3rem solid #3D2600;
  display: inline-block;
  position: relative;
}
.donationSec__ttl-donation:after{
  content: "";
  position: absolute;
  width: 11.8rem;
  height: 5.62rem;
  background-image: url(../images/sustainability/text_donation.svg);
  background-repeat: no-repeat;
  background-size: contain;
  left: -5.7rem;
  top: -2.8rem;
}
.donationSec__txt{
  font-size: 1.8rem;
  letter-spacing: 0;
  font-weight: 500;
  margin-top: 3.9rem;
  line-height: 2;
}
.donationSec__photo-box{
  margin-top: 3.9rem;
  display: flex;
  justify-content: center;
  gap: 1.32rem;
}
.donationSec__photo{
  width: 23.9rem;
}
.donationSec__btm-txt{
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0;
  width: 75rem;
  text-align: left;
  margin: 0 auto;
  margin-top: 4.4rem;
  line-height: 2;
}
.donationSec__btm-txt h4{
  text-align: center;
}
.donationSec__dot{
  margin-top: 8rem;
  margin-bottom: 8rem;
}
@media (max-width: 767px) {
  .donationSec{
    background-image: url(../images/sustainability/bg_donation_sp.png);
    margin-top:0;
    padding: 5.5rem 0 7rem;
  }
  .donationSec:after{
    background-image: url(../images/sustainability/bg_donation_top_sp.png);
    height: .9rem;
    top: -.7rem;
  }
  .donationSec:before{
    background-image: url(../images/sustainability/bg_donation_btm_sp.png);
    height: .7rem;
    bottom: -.6rem;
  }
  .donationSec__inner{
    width: 33.5rem
  }
  .donationSec__ttl{
    font-size: 2.4rem;
    padding: 0 1rem .4rem;
    border-bottom: .2rem solid #3D2600;
  }
  .donationSec__ttl-donation:after{
    width: 7.3rem;
    height:3.5rem;
    left: -2.2rem;
    top: -2.4rem;
  }
  .donationSec__txt{
    font-size: 1.6rem;
    margin-top: 3.3rem;
    line-height: 2;
    letter-spacing: 0;
    text-align: left;
  }
  .donationSec__photo-box{
    margin-top: 2rem;
    flex-wrap: wrap;
    gap: .8rem;
  }
  .donationSec__photo{
    width: 14.8rem;
  }
  .donationSec__btm-txt{
    font-size: 1.4rem;
    width: 33.5rem;
    margin-top: 2.4rem;
    line-height: 2;
  }
  .donationSec__dot{
    margin-top: 4.1rem;
    margin-bottom: 5.5rem;
  }

}
/* 寄付の活用方法の指定ここまで----------------------------- */

/* 参加者様からのコメントの指定ここから----------------------------- */
.commentSec{
  width: 100rem;
  margin: 0 auto;
  text-align: center;
}
.donationSec__ttl-comment:after{
  content: "";
  position: absolute;
  width: 12.5rem;
  height:6.29rem;
  background-image: url(../images/sustainability/text_comment.svg);
  background-repeat: no-repeat;
  background-size: contain;
  left: -6.8rem;
  top: -3.3rem;
}
.commentSec__item:first-of-type{
  margin-top: 5.2rem;
  margin-bottom: 2rem;
}
.commentSec__item{
  width: 100%;
  background-color: #fff;
  border: .2rem solid #3D2600;
  border-radius: 2rem;
  padding: 4.4rem 11.1rem 4.1rem;
  text-align: left;
  position: relative;
}
.commentSec__item:after{
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  width: 11.2rem;
  height: 11.2rem;
}
.commentSec__item01:after{
  background-image: url(../images/sustainability/text_comment_tag_01.svg);
  left: -1.7rem;
  top: -1.7rem;
}
.commentSec__item02:after{
  background-image: url(../images/sustainability/text_comment_tag_02.svg);
  left: -1.7rem;
  top: -1.7rem;
}
.commentSec__item-txt{
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: 2;
}
@media (max-width: 767px) {
  .commentSec{
    width: 33.2rem;
  }
  .donationSec__ttl-comment:after{
    content: "";
    position: absolute;
    width: 7.9rem;
    height:3.9rem;
    left: -2.4rem;
    top: -2.8rem;
  }
  .commentSec__item:first-of-type{
    margin-top: 4rem;
    margin-bottom: 1.5rem;
  }
  .commentSec__item{
    border: .2rem solid #3D2600;
    padding: 3.4rem 2rem 3.6rem;
  }
  .commentSec__item:after{
    width: 6.7rem;
    height: 6.7rem;
  }
  .commentSec__item01:after{
    background-image: url(../images/sustainability/text_comment_tag_01_sp.svg);
    left: -1.1rem;
    top: -1.1rem;
  }
  .commentSec__item02:after{
    background-image: url(../images/sustainability/text_comment_tag_02_sp.svg);
    left: -1.1rem;
    top: -1.1rem;
  }
}
/* 参加者様からのコメントの指定ここまで----------------------------- */


section#share{
  background-color: #f7f7f7;
  position:relative;
}
#footer{
  background-color: #f7f7f7;
  position: relative;
  z-index: 1;
}
#share #action .inner .detail a.share__btn{
  display: flex;
  justify-content: center;
}
#share #action .inner .detail a.share__btn:before{
  background: url(../images/sustainability/img_lineups3.webp) no-repeat 0 0;
  width: 89.4rem;
  height: 15.6rem;
  background-size: contain;
}
.share__organic-txt{
  width: 11.6rem;
  margin-right: .6rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.share__organic-txt img{
  display: block;
  width: 100%;
  position:absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  left: 0;
  transition: all 300ms ease-out;
}
.share__organic-txt img.white{
  opacity: 0;
}
#share #action .inner .detail a.share__btn:hover .share__organic-txt img.white{
  opacity: 1;
}
#share #action .inner .detail a.share__btn:hover .share__organic-txt img.black{
  opacity: 0;
}
@media (max-width: 767px) {
  #share #action .inner .detail a.share__btn{
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 1.6rem;
    padding: 1.8rem 0;
  }
  #share #action .inner .detail a.share__btn:before{
    background: url(../images/sustainability/img_lineups3_sp.webp) no-repeat 0 0;
    width: 32.7rem;
    height: 8.3rem;
    background-size: contain;
    left: 2.1rem;
    bottom: 1.1rem;
  }
  .share__organic-txt{
    width: 8.3rem;
    height: 1.3rem;
    margin-right:0;
    margin-bottom: .2rem;
    display: block;
    margin-bottom: .7rem;
  }
  .share__organic-txt img.white{
    display: none;
  }
  .share__organic-txt img.black{
    display: block;
  }
  #share #action .inner .detail a.share__btn:hover .share__organic-txt img.black{
    opacity: 1;
  }
  .fade-in-sp {
    opacity: 0;
    transform: translateY(3rem);
    transition: opacity 0.5s ease-out, transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
  .is-visible {
    opacity: 1;
    transform: translateY(0);
  }
}