@charset "UTF-8";
#feature {
  margin: 0 0 100px;
  text-align: center;
  overflow: hidden;
}
#feature .l-hdr {
  position: relative;
  width: 480px;
  margin: 0 auto;
}
#feature .l-hdr__txt {
  position: absolute;
  top: 264px;
  left: 49.3%;
  transform: translateX(-50%);
  width: 100%;
}
#feature .l-block {
  position: relative;
  font-size: 0;
}
#feature .l-block03 {
  margin: 145px 0 0;
}
#feature .l-block03:before {
  content: "";
  position: absolute;
  top: 342px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width: 1100px;
  height: 742px;
  background: #bec8d3;
}
#feature .l-block__wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
#feature .l-block__wrapper01 {
  width: 1100px;
  margin: 145px auto 0;
}
#feature .l-block__wrapper01:before {
  content: "";
  position: absolute;
  top: 200px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width: 1100px;
  height: 350px;
  background: #bec8d3;
}
#feature .l-block__wrapper02 {
  margin: 145px 0 0;
}
#feature .l-block__inner01, #feature .l-block__style02, #feature .l-block__style06, #feature .l-block__inner03, #feature .l-block__inner05, #feature .l-block__movie02, #feature .l-block__style10, #feature .l-block__inner06, #feature .l-block__style12 {
  display: inline-block;
  vertical-align: top;
}
#feature .l-block__inner {
  position: relative;
  z-index: 5;
}
#feature .l-block__inner01 {
  margin: 104px 0 0;
}
#feature .l-block__inner01:before {
  content: "";
  position: absolute;
  top: 185px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width: 740px;
  height: 640px;
  background: #f9fced;
}
#feature .l-block__inner02 {
  width: 420px;
  margin: 146px auto 0;
}
#feature .l-block__inner02:before {
  content: "";
  position: absolute;
  top: 220px;
  left: -110px;
  display: block;
  width: 310px;
  height: 840px;
  background: #efefef;
}
#feature .l-block__inner04 {
  width: 550px;
  margin: 193px auto 0;
  box-shadow: 50px -50px #d6e2fc;
}
#feature .l-block__inner05 {
  margin: 145px 0 0;
}
#feature .l-block__inner05:before {
  content: "";
  position: absolute;
  top: 206px;
  left: -110px;
  display: block;
  width: 900px;
  height: 600px;
  background: #edebfc;
}
#feature .l-block__inner06 {
  margin: 144px 0 0;
}
#feature .l-block__inner06:before {
  content: "";
  position: absolute;
  top: 180px;
  right: -120px;
  display: block;
  width: 350px;
  height: 650px;
  background: #efefef;
}
#feature .l-block__style {
  position: relative;
  z-index: 10;
}
#feature .l-block__style02 {
  margin: 504px -100px 0 -130px;
}
#feature .l-block__style04 {
  left: 110px;
  width: 420px;
  margin: 30px auto 0;
}
#feature .l-block__style06 {
  margin: 242px -64px 0 -29px;
}
#feature .l-block__style08 {
  width: 420px;
  margin: 50px auto 0;
}
#feature .l-block__style10 {
  margin: 245px -110px 0 0;
}
#feature .l-block__style12 {
  margin: 394px -80px 0 -120px;
}
#feature .l-block__style a {
  display: block;
  background: #fff;
}
#feature .l-block__movie {
  position: relative;
  z-index: 5;
}
#feature .l-block__movie01 {
  left: 78px;
  width: 321px;
  height: 569px;
  margin: -42px auto 0;
}
#feature .l-block__movie02 {
  z-index: 15;
  width: 300px;
  height: 534px;
  margin: 646px -60px 0 -70px;
}
#feature .l-block__movie iframe {
  width: 100%;
  height: 100%;
}
#feature .c-txt__ttl {
  color: #7676f4;
  font-family: ff-good-headline-web-pro-con, sans-serif;
  font-size: 91px;
  font-weight: 700;
  letter-spacing: -0.022em;
  font-style: italic;
}
#feature .c-txt__ttl span {
  margin: 0 0 0 15px;
  letter-spacing: -0.025em;
}
#feature .c-txt__ttl-lead {
  margin: 2px 0 0 6px;
  color: #fff;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  font-size: 19px;
  font-weight: 500;
  letter-spacing: -0.015em;
}
#feature .c-txt__lead {
  margin: 68px 0 0 8px;
  color: #000;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 2.875;
  letter-spacing: -0.015em;
}
#feature .c-txt__detail {
  position: relative;
  z-index: 5;
  margin: 45px 0 0 8px;
  color: #000;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.85;
  letter-spacing: 0;
}
#feature .c-txt__detail li:not(:first-child) {
  margin: 28px 0 0;
}
#feature .c-txt__detail03 {
  margin: 44px 0 0 8px;
  line-height: 1.86;
}
#feature .c-txt__detail03 li:not(:first-child) {
  margin: 26px 0 0;
}
#feature .c-txt__detail05 {
  margin: 44px 0 0 8px;
}
#feature .c-txt__detail05 li:not(:first-child) {
  margin: 27px 0 0;
}
#feature .c-txt__subttl {
  position: absolute;
  z-index: 15;
}
#feature .c-txt__subttl:before {
  content: "";
  position: absolute;
  z-index: 15;
  display: block;
}
#feature .c-txt__subttl01 {
  top: 56px;
  left: -60px;
}
#feature .c-txt__subttl01:before {
  bottom: -62px;
  right: -78px;
  width: 60px;
  height: 53px;
  background: url(../img/line01.png) no-repeat;
  background-size: contain;
}
#feature .c-txt__subttl02 {
  top: 35px;
  right: -50px;
}
#feature .c-txt__subttl02:before {
  bottom: -64px;
  left: -65px;
  width: 60px;
  height: 53px;
  background: url(../img/line02.png) no-repeat;
  background-size: contain;
}
#feature .c-txt__subttl03 {
  top: 225px;
  right: -23px;
}
#feature .c-txt__subttl03:before {
  bottom: -86px;
  left: -72px;
  width: 55px;
  height: 67px;
  background: url(../img/line03.png) no-repeat;
  background-size: contain;
}
#feature .c-txt__subttl04 {
  top: 86px;
  left: -33px;
}
#feature .c-txt__subttl04:before {
  bottom: -63px;
  right: -96px;
  width: 66px;
  height: 54px;
  background: url(../img/line04.png) no-repeat;
  background-size: contain;
}
#feature .c-txt__subttl05 {
  top: 47px;
  left: -110px;
}
#feature .c-txt__subttl05:before {
  bottom: -43px;
  right: -53px;
  width: 125px;
  height: 24px;
  background: url(../img/line05.png) no-repeat;
  background-size: contain;
}
#feature .c-txt__subttl06 {
  top: 46px;
  left: -60px;
}
#feature .c-txt__subttl06:before {
  bottom: -74px;
  right: -75px;
  width: 74px;
  height: 65px;
  background: url(../img/line06.png) no-repeat;
  background-size: contain;
}
#feature .c-btn a {
  display: block;
  width: 380px;
  height: 64px;
  margin: 145px auto 0;
  padding: 18px 0 0 2px;
  color: #000;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-decoration: none;
  border: 1px solid #000;
  box-sizing: border-box;
  transition: .3s;
}
#feature .c-btn a:hover {
  opacity: .6;
  text-decoration: none;
}
#feature .credit {
  width: 480px;
  margin: 30px auto 0;
}
#feature .credit02 {
  width: 450px;
}
#feature .credit03 {
  width: 500px;
}
#feature .credit04 {
  width: 480px;
}
#feature .credit05 {
  width: 520px;
}
#feature .credit06 {
  width: 350px;
}
#feature .credit li {
  display: inline-block;
  margin: 0 5px 0;
}
#feature .credit a {
  color: #000;
  font-family: quasimoda, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 2.16;
  letter-spacing: 0.03em;
}
#feature .l-block,
#feature .l-hdr {
  opacity: 0;
  will-change: opacity;
  -webkit-transition: cubic-bezier(0.385, 0.145, 0.28, 0.925), opacity 1000ms;
  transition: cubic-bezier(0.385, 0.145, 0.28, 0.925), opacity 1000ms;
}
#feature .l-block.show,
#feature .l-hdr.show {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
#feature .fadeimg {
  transition: .3s;
}