@charset "UTF-8";
/*アニメーション
----------------------------*/
.l-container #feature .js_fade {
  opacity: 0;
  transform: translateY(20px);
}
.l-container #feature .js_fade.is_show {
  transition: transform 1.2s, opacity 1.2s;
  transform: translateY(0) !important;
  opacity: 1;
}
.l-container #feature .fade_heart01 {
  opacity: 0;
  transition: all 0.5s;
}
.l-container #feature .fade_heart01.is_show {
  opacity: 1;
  transform: translateY(0);
  animation-delay: -1s;
}

.l-container #feature .fade_heart02 {
  opacity: 0;
  transition: all 0.5s;
}
.l-container #feature .fade_heart02.is_show {
  opacity: 1;
  transform: translateY(0);
  animation-delay: -1s;
}

.l-container #feature .fade_heart03 {
  opacity: 0;
  transition: all 0.5s;
  animation-delay: -1.5s;
}
.l-container #feature .fade_heart03.is_show {
  opacity: 1;
  transform: translateY(0);
}
.l-container #feature .fade_heart04 {
  opacity: 0;
  transition: all 0.5s;
  animation-delay: -2s;
}
.l-container #feature .fade_heart04.is_show {
  opacity: 1;
  transform: translateY(0);
}
.l-container #feature .fade_heart05 {
  opacity: 0;
  transition: all 0.5s;
}
.l-container #feature .fade_heart05.is_show {
  opacity: 1;
  transform: translateY(0);
  animation-delay: -2.5s;
}

/*共通
----------------------------*/
.l-container {
  width: 100%;
}

.l-footer {
  padding: 0;
}

.pc-footer {
  margin: 0;
}

#feature {
  width: 100%;
  padding-bottom: 150px;
  margin: 0 auto;
  color: #000;
  box-sizing: border-box;
  text-align: center;
  font-family: "kozuka-mincho-pr6n", serif;
  font-weight: 200;
  font-style: normal;
  font-feature-settings: "palt";
  position: relative;
  min-width: 1400px;
}
#feature * {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
#feature a {
  width: 100%;
  height: auto;
  display: block;
  color: #000;
}
#feature a:hover {
  text-decoration: none;
  opacity:0.7;
  transition: 0.3s;
}
#feature .fadeimg {
  transition: 0.3s;

}
#feature .js_anime {
  visibility: hidden;
  opacity: 0;
  transform: translate(0, 40px);
  transition: all ease 1.5s;
}
#feature .js_anime.is_show {
  visibility: visible;
  opacity: 1;
  transform: translate(0, 0);
}
#feature .inner {
  width: 890px;
  margin: 0 auto;
  position: relative;
}

.hero,
.sec01 {
  background-color: #33140c;
}
.sec02 {
  background-color: #4c0202;
}
.sec03,.bg03 {
  background-color: #d39b99;
}
.sec04 {
  background-color: #FFF;
  position: relative;
  z-index: 55;
}
#feature {
  /*メインビジュアル（.hero)
  ----------------------------*/
}
#feature .hero {
  padding-top: 100px;
  position: relative;
  
}
#feature .hero .hero__img {
  position: relative;
}
#feature .hero .hero__logo {
  width: 443.396px;
  height: 241.242px;
  margin: 68px auto 61px;
}
#feature .hero .hero__txt {
  margin-top: 39px;
  color: #967660;
  font-size: 16px;
  font-family: "kozuka-mincho-pr6n", serif;
  font-weight: 200;
  font-style: normal;
  line-height: 33px;
  letter-spacing: 0.1em;
  line-height: 2;
  padding: 0 0 61px 0;

}
  /*movie
  ----------------------------*/
  #feature .hero__img video {
 width: 380px;
 height: 570px;
 margin: 0 auto;
  }
  #feature .hero__img .sound-on {
    bottom: 23px;
    left: 542px;
    width: 73px;
    position: absolute;
    cursor: pointer;

  }
  #feature .hero__img .sound-off {
    bottom: 19px;
    left: 542px;
    width: 78px;
    position: absolute;
    cursor: pointer;

  }
  #feature .sound-off {
  display: none;
}
#feature .mute {
  cursor: pointer;

}

#feature .sec01 .sec__txt {
  color: #967660;
  font-size: 16px;
  font-family: "kozuka-mincho-pr6n", serif;
  font-weight: 200;
  letter-spacing: 0.09em;
  line-height: 30px;
  margin: 0 0 70px 0;
}


  /*スライダー
  ----------------------------*/

#feature .slider .slick-dots {
  width: fit-content;
  height: calc(12* (100vw / 1400));
  display: flex;
  justify-content: center;
  position: absolute;
  top: calc(100% + 26px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
#feature .slider .slick-dots li {
  width: calc(12* (100vw / 1400));
  height: calc(12* (100vw / 1400));
  margin: 0 calc(26* (100vw / 1400));
}
#feature .slider .slick-dots li button {
  width: calc(12* (100vw / 1400));
  height: calc(12* (100vw / 1400));
  background-color: #967660;
  text-indent: -9999px;
  padding: 0;
  border: none;
  position: relative;
  border-radius: 50%;
}
#feature .slider .slick-dots li.slick-active button {
  background-color: #775c4a;
}
  /*各画像
  ----------------------------*/

#feature .sec__ttl01 {
  width: 285.807px;
  margin: 70px auto 40px;
}
#feature .sec__ttl02 {
    width: 280px;
    margin: 0 auto 30px;
}
#feature .sec__ttl03 {
  width: 389.25px;
  margin: 78px 0 0 256px;
}
#feature .sec__ttl04 {
  width: 450.59px;
  padding: 182px 0 59px 0;
  margin: 0 auto;
}
#feature .sec__ttl05 {
  width: 423.91px;
  margin: 100px auto 100px;
}

#feature .sec__img01 {
  width: 750px;
  margin: 0 auto;
}
#feature .sec__img02 img {
  width: calc(454* (100vw / 1400));
  margin: 0 0 0 calc(12.9* (100vw / 1400));
}
#feature .sec__img03 img  {
  width: calc(454* (100vw / 1400));
  margin: 0 0 0 calc(12.9* (100vw / 1400));
}
#feature .sec__img04 img  {
  width: calc(454* (100vw / 1400));
  margin: 0 0 0 calc(12.9* (100vw / 1400));
}

#feature .dot img{
  width: calc(116* (100vw / 1400));
  margin: calc(30* (100vw / 1400)) auto;
}
#feature .sec__img05 {
  width: 414px;
  margin: 165px auto 135px;
}
#feature .sec__img06 {
  width: 449px;
  margin: 0 0 0 196px;
}
#feature .sec__img07 {
  width: 400px;
  margin: 170px 20px 0 35px;
}
#feature .sec__img08 {
  width: 400px;
  margin: 170px 0 0 0;

}
#feature .sec__img09 {
  width: 467px;
  margin: 145px 0 0 210px;
}
#feature .sec__img10 {
  width: 297px;
}
#feature .sec__img11 {
  width: 297px;
}
#feature .sec__img12 {
  width: 297px;
}
#feature .sec__img13 {
  width: 297px;
}
#feature .sec__img14 {
  width: 460px;
  margin: 78px 0 0 0;
}
#feature .sec__img15 {
  width: 360px;
  margin: 328px 80px 0 -6px;
}
#feature .sec__img16 {
  width: 499px;
  margin: 178px 0 0 197px;
}
#feature .sec__img17 {
  width: 300px;
  margin: 152px 0 0 286px;
  position: relative;
} 
#feature .sec__icon_17  {
  position: absolute;
  width: 70px;
  top: -39px;
  left: 280px;
}
#feature .sec__img19 {
  width: 400px;
  margin: 0 20px 0 37px;
}
#feature .sec__img20 {
  width: 400px;
  position: relative;
}
#feature .sec__icon_19  {
  position: absolute;
  width: 147.95px;
  top: 436px;
  left: 290px;
}
#feature .sec__img21 {
  width: 360px;
  position: relative;
  margin: 150px 0 0 266px;
}
#feature .sec__img21 img{
  z-index: 1;
  position: relative;
}
#feature .sec__icon_21_01  {
  position: absolute;
  width: 51px;
  top: -26px;
  left: 344px;
  z-index: 0;
}

#feature .sec__icon_21_02  {
  position: absolute;
  width: 110px;
  top: 45px;
  left: 341px;
  z-index: 0;
}
#feature .sec__icon_21_03  {
  position: absolute;
  width: 59px;
  top: 462px;
  left: -43px;
  z-index: 0;
}
#feature .sec__img22 {
  width: 500px;
  margin: 150px 0 0 195px;

}

#feature .sec__flex {
  display: flex;
}
#feature .sec__flex01 {
  height: 605px;
  width: 600px;
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  justify-content: space-between;
  align-content: space-around;
}
#feature .sec01 {
  padding-bottom: 300px;
  margin: 0 0 300px 0;

}
#feature .sec02 {
  padding-bottom: 300px;
  padding-top: 135px;
  position: relative;
  margin: 0 0 300px 0;

}
#feature .sec02 .sec__bg {
  position: absolute;
  top: calc(-177* (100vw / 1400));
  height: calc(300* (100vw / 1400));
  width: 100%;
}
#feature .sec03 {
  position: relative;

}
#feature .sec03 .sec__bg {
  position: absolute;
  top: calc(-205* (100vw / 1400));
  height: calc(300* (100vw / 1400));
  width: 100%;
}
#feature .sec__img23 {
  top: calc(-245* (100vw / 1400));
  z-index: 2;
  width: 100%;

}
#feature .sec__img23 img {
  width: 100%;
}

/*クレジット
  ----------------------------*/
  #feature .sec .sec__credit {
    position: absolute;
  }
  #feature .sec .sec__credit .credit {
    display: block;
  }
  #feature .sec .sec__credit .credit .item {
    width: fit-content;
  }
  #feature .sec .sec__credit .credit .item .link {
    white-space: nowrap;
  }
  #feature .credit {
    display: flex;
  }
#feature .credit a {
  font-family: "linotype-didot", serif;
  font-weight: 400;
  font-style: italic;
  font-size: 15px;
  color: #602b11;
  line-height: 20px;
  margin: 16px 0 0 0;
}
#feature .sec01 .credit a {
  color: #967660;
}
#feature .sec02 .credit a {
  color: #bc7a7a;
}
#feature .sec03 .credit a {
  color: #602b11;
}

#feature .credit li { 
  margin-right: 5px;
}
#feature .credit li:last-child { 
  margin-right: 0px;
}

#feature .cre_center .credit  {
  justify-content: center;
}
#feature .cre_center .credit:nth-child(3) {
  margin: -12px 0 0 0;
}

#feature .sec__img .sec__img14 .credit  {
  justify-content: flex-end;

}
  /*スタッフ
  ----------------------------*/

#feature .staff {
  padding: 50px 0 50px 0;
  background-color: #FFF;
  position: relative;
  z-index: 55;
}
#feature  .staff p {
  font-family: "linotype-didot", serif;
  font-weight: 400;
  font-style: italic;
  font-size: 14px;
  color: #602b11;
}
#feature  .staff span {
  font-size: 12px;
}

  /*all btn
  ----------------------------*/

#feature .allitem__btn {
  width: 440px;
  background-color: #FFF;
  position: relative;
  z-index: 55;
  margin: 0 auto;
}
#feature .allitem {
  background-color: #FFF;
  position: relative;
  z-index: 55;
}
#feature .sticky {
  position: -webkit-sticky;
  position: sticky;
}