html {
  font-size: 10px;
  -webkit-text-size-adjust: 100%;
}

@media screen and (max-width: 1400px) {
  html {
    font-size: 0.7142857143vw;
  }
}
body {
  max-width: 100%;
}

.l-container {
  width: 100%;
}

.sp {
  display: none;
}

.feature {
  box-sizing: border-box;
  color: #000;
  margin: 0 auto;
  overflow: clip;
  position: relative;
  width: 100%;
  font-family: "yu-gothic-pr6n", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-feature-settings: "palt";
}
.feature * {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  box-sizing: border-box;
  scroll-margin-top: 50px;
}
.feature a {
  color: #000;
  text-decoration: none;
}
.feature a:hover {
  opacity: 1;
}
.feature video {
  max-width: 100%;
}
.feature img {
  vertical-align: bottom;
  max-width: 100%;
}
.feature .js-fade {
  opacity: 0;
  transition: ease-in, opacity 1000ms, translate 500ms;
  translate: 0 10rem;
}
.feature .js-fade.is-active {
  opacity: 1;
  translate: 0;
}
.feature .wrap {
  display: flex;
}
.feature .wrap .leftcont {
  width: calc((100% - 37.5rem) / 2);
}
.feature .wrap .leftcont__Inner {
  position: sticky;
  top: 80px;
  width: 100%;
  height: calc(100vh - 80px);
}
.feature .wrap .leftcont .change_img {
  display: block;
  width: 100%;
}
.feature .wrap .leftcont .change_img--current,
.feature .wrap .leftcont .change_img--next {
  position: absolute;
  inset: 0;
}
.feature .wrap .leftcont .change_img--current {
  z-index: 1;
  opacity: 1;
}
.feature .wrap .leftcont .change_img--next {
  z-index: 2;
  opacity: 0;
}
.feature .wrap .leftcont img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
}
.feature .wrap .rightcont {
  width: calc((100% - 37.5rem) / 2);
}
.feature .wrap .rightcont__Inner {
  position: sticky;
  top: 80px;
  width: 100%;
  height: calc(100vh - 80px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: url("./../img/bg_pc_right.png");
  background-size: cover;
}
.feature .wrap .rightcont__Ttl {
  width: 39.8rem;
  transform: translateY(-11rem);
}
.feature .wrap .rightcont__Btn {
  position: absolute;
  bottom: 6rem;
  left: 0;
  width: 100%;
  text-align: center;
}
.feature .wrap .rightcont__Btn a {
  display: inline-block;
  font-size: 2.4rem;
  font-family: "the-seasons", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #82A9D8;
  font-weight: 800;
  letter-spacing: 0.02em;
  border-bottom: 0.1rem solid;
}
.feature .wrap .centercont {
  width: 37.5rem;
  overflow: clip;
  background: #fff;
  position: relative;
}
.feature .mv__Movie {
  position: relative;
  margin: auto;
  overflow: hidden;
}
.feature .mv__Movie video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  vertical-align: bottom;
}
.feature .mv__Movie .music {
  position: absolute;
  width: auto;
  height: 1.33rem;
  bottom: 0.9rem;
  right: 1.2rem;
}
.feature .mv__Movie .music:hover {
  cursor: pointer;
}
.feature .mv__Movie .music span {
  display: none;
}
.feature .mv__Movie .music span.active {
  display: block;
}
.feature .mv__Movie .music img {
  max-width: none;
  height: 100%;
  vertical-align: top;
  width: auto;
}
.feature .bg01 {
  background: url("./../img/bg_01.png");
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
  overflow: hidden;
}
.feature .bg01:before {
  position: absolute;
  top: -1rem;
  left: -2.4rem;
  content: "";
  width: 41.8rem;
  height: 276.2rem;
  background: url("./../img/flower_01_pc.png");
  background-size: cover;
  pointer-events: none;
}
.feature .mvbottom {
  padding-top: 14.8rem;
}
.feature .mvbottom__Ttl {
  width: 28rem;
  margin: 0 auto 7.6rem;
}
.feature .mvbottom__Box {
  display: flex;
  flex-flow: column;
  gap: 1.5rem;
  margin-bottom: 5.7rem;
}
.feature .mvbottom__Txt {
  text-align: center;
  font-size: 1.2rem;
  color: #82A9D8;
  line-height: 2.3rem;
  letter-spacing: -0.01em;
  font-weight: 600;
}
.feature .-roll {
  display: inline-block;
  animation: rotate-z 2.86s linear infinite;
  pointer-events: none;
}
@keyframes rotate-z {
  from {
    transform: rotateZ(0deg);
  }
  to {
    transform: rotateZ(360deg);
  }
}
.feature .sec01 {
  position: relative;
}
.feature .sec01 .-flower01 {
  position: absolute;
  width: 3.5rem;
  top: 100rem;
  left: 29.9rem;
}
.feature .sec01 .-flower02 {
  position: absolute;
  width: 4.5rem;
  top: 218.3rem;
  left: 2.9rem;
}
.feature .sec01__Model.-model01 {
  width: 58.5rem;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.feature .sec01__Model.-model01 img {
  max-width: none;
  width: 100%;
}
.feature .sec01__Model.-model02 {
  width: 37rem;
  margin-left: 0.5rem;
}
.feature .sec01__Model.-model03 {
  position: relative;
  margin-top: -5.8rem;
  width: 39.4rem;
}
.feature .sec01__Model.-model03 > a {
  display: inline-block;
  transition-delay: 0.6s;
}
.feature .sec01__Model.-model03 .-name {
  position: absolute;
  width: 14.7rem;
  top: 5rem;
  right: 5rem;
  pointer-events: none;
  z-index: 10;
}
.feature .sec01__Model.-model04 {
  position: relative;
  margin: -1.6rem 0 -0.8rem -0.8rem;
  width: 45rem;
}
.feature .sec01__Model.-model04 > a {
  display: inline-block;
}
.feature .sec01__Model.-model04 .-name {
  position: absolute;
  width: 20rem;
  bottom: 7.8rem;
  left: 6.8rem;
  pointer-events: none;
  z-index: 10;
}
@keyframes drawLineLoop {
  0% {
    transform: translateY(0) scaleY(0);
  }
  45% {
    transform: translateY(0) scaleY(1);
  }
  55% {
    transform: translateY(0) scaleY(1);
  }
  100% {
    transform: translateY(6.5rem) scaleY(0);
  }
}
.feature .sec01 .scroll {
  width: 1px;
  height: 6.5rem;
  position: relative;
  display: block;
  margin: -6rem auto 3.8rem;
  overflow: hidden;
}
.feature .sec01 .scroll:before {
  width: 1px;
  height: 12rem;
  display: block;
  content: "";
  background-color: #88AAD3;
  display: block;
  transform-origin: top;
  animation: drawLineLoop 2s ease-in-out infinite;
}
.feature .sec01__Ttl {
  position: relative;
  width: 31.7rem;
  margin: 0 auto 5.2rem;
}
.feature .bg02 {
  background: url("./../img/bg_02.png");
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
}
.feature .bg02:before {
  position: absolute;
  top: 9.5rem;
  left: -1.8rem;
  content: "";
  width: 37.54rem;
  height: 129.5rem;
  background: url("./../img/flower_02.png");
  background-size: cover;
  pointer-events: none;
}
.feature .sec02 {
  padding-top: 1.5rem;
  position: relative;
}
.feature .sec02 .-flower03 {
  position: absolute;
  width: 3.21rem;
  top: 15.2rem;
  left: 27.6rem;
}
.feature .sec02 .-flower04 {
  position: absolute;
  width: 4.5rem;
  top: 56.1rem;
  left: -1.8rem;
}
.feature .sec02 .-flower05 {
  position: absolute;
  width: 3.46rem;
  top: 127.7rem;
  left: 31.2rem;
}
.feature .sec02__Ttl {
  text-align: center;
  color: #F4B0CA;
  font-size: 2rem;
  line-height: 2.6rem;
  letter-spacing: 0.025em;
  font-family: "the-seasons", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 800;
  margin-bottom: 9.3rem;
}
.feature .sec02__Model.-model01 {
  width: 34.5rem;
  position: relative;
  margin: 0 0 0 -2.8rem;
}
.feature .sec02__Model.-model01 > a {
  display: inline-block;
  transition-delay: 0.6s;
}
.feature .sec02__Model.-model01 .-name {
  position: absolute;
  width: 14.3rem;
  top: 2.7rem;
  right: -1.2rem;
  pointer-events: none;
  z-index: 10;
}
.feature .sec02__Model.-model02 {
  width: 47.8rem;
  margin: 1.3rem 0 -11.8rem 1.7rem;
  position: relative;
}
.feature .sec02__Model.-model02 img {
  max-width: none;
  width: 100%;
}
.feature .sec02__Messege {
  margin-left: 1.7rem;
  color: #F4B0CA;
  font-size: 1.8rem;
  line-height: 2.6rem;
  letter-spacing: 0.02em;
  font-family: "the-seasons", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 800;
  margin-bottom: 12.2rem;
}
.feature .bg03 {
  background: url("./../img/bg_03.png");
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
}
.feature .bg03:before {
  position: absolute;
  top: 177.8rem;
  left: -1.5rem;
  content: "";
  width: 40.8rem;
  height: 165.4rem;
  background: url("./../img/flower_03.png");
  background-size: cover;
  pointer-events: none;
}
.feature .sec03 {
  padding-top: 10rem;
  position: relative;
}
.feature .sec03 .-flower06 {
  position: absolute;
  width: 3.75rem;
  top: 254.9rem;
  left: 4.6rem;
}
.feature .sec03 .-flower07 {
  position: absolute;
  width: 4.5rem;
  top: 329.8rem;
  left: 30.3rem;
}
.feature .sec03__Ttl {
  text-align: center;
  font-size: 3.8rem;
  line-height: 4rem;
  letter-spacing: 0.01em;
  color: #82A9D8;
  font-family: "the-seasons", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 800;
  padding-bottom: 2.2rem;
  overflow: hidden;
}
.feature .sec03__Ttl span {
  display: inline-block;
  translate: 0 150%;
  transition: translate 1.8s cubic-bezier(0.19, 1, 0.22, 1) calc(var(--index, 0) * 0.4s);
  will-change: translate;
}
.feature .sec03__Ttl.is-active span {
  translate: 0;
}
.feature .sec03__Model.-model01 {
  width: 34.3rem;
  margin: 0 auto 2.2rem;
}
.feature .sec03__Model.-model02 {
  width: 34.5rem;
  margin-bottom: 8.5rem;
}
.feature .sec03__Model.-model03 {
  width: 29.9rem;
  margin-left: auto;
  margin-bottom: 11.2rem;
  position: relative;
}
.feature .sec03__Model.-model03 > a {
  display: inline-block;
  transition-delay: 0.6s;
}
.feature .sec03__Model.-model03 .-name {
  position: absolute;
  width: 15.44rem;
  top: -2.3rem;
  left: -1rem;
  pointer-events: none;
  z-index: 10;
}
.feature .sec03__Model.-model04 {
  width: 31.7rem;
  margin: 0 auto 6rem;
  position: relative;
}
.feature .sec03__Model.-model04 > a {
  display: inline-block;
}
.feature .sec03__Model.-model04 .-name {
  position: absolute;
  width: 18.44rem;
  bottom: -1.7rem;
  right: -1rem;
  pointer-events: none;
  z-index: 10;
}
.feature .sec03__Model.-model05 {
  width: 42.5rem;
  margin-bottom: 5.5rem;
}
.feature .sec03__Txt {
  text-align: center;
  font-size: 1.7rem;
  line-height: 2.5rem;
  letter-spacing: 0.02em;
  color: #82A9D8;
  font-family: "the-seasons", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 800;
  margin-bottom: 10.5rem;
  overflow: hidden;
}
.feature .sec03__Txt span {
  display: inline-block;
  translate: 0 150%;
  transition: translate 1.8s cubic-bezier(0.19, 1, 0.22, 1) calc(var(--index, 0) * 0.4s);
  will-change: translate;
}
.feature .sec03__Txt.is-active span {
  translate: 0;
}
.feature .sec03__Messege {
  margin-left: 1.7rem;
  color: #82A9D8;
  font-size: 1.7rem;
  line-height: 2.3rem;
  letter-spacing: 0.02em;
  font-family: "the-seasons", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 800;
  margin-bottom: -3.1rem;
}
.feature .bg04 {
  background: url("./../img/bg_04.png");
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
}
.feature .sec04 {
  padding-top: 2.5rem;
  padding-bottom: 7.3rem;
}
.feature .sec04 .scroll {
  width: 1px;
  height: 5rem;
  position: relative;
  display: block;
  margin: 0 auto 1.5rem;
  overflow: hidden;
}
.feature .sec04 .scroll:before {
  width: 1px;
  height: 10rem;
  display: block;
  content: "";
  background-color: #88AAD3;
  display: block;
  transform-origin: top;
  animation: drawLineLoop 2s ease-in-out infinite;
}
.feature .sec04__Ttl {
  width: 25.3rem;
  margin: 0 auto 3.5rem;
}
.feature .sec04__Model {
  width: 60.8rem;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.feature .sec04__Creditbox {
  display: flex;
  flex-flow: column;
  gap: 2.8rem;
  margin-top: -2.7rem;
}
.feature .sec04__Dt {
  text-align: center;
  margin-bottom: 0.25rem;
}
.feature .sec04__Dt a {
  display: inline-block;
  font-size: 2.1rem;
  font-family: "interstate-condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-weight: 800;
  color: #82A9D8;
  letter-spacing: 0.02em;
}
.feature .sec04__Dd {
  text-align: center;
}
.feature .sec04__Dd .credit {
  display: block;
}
.feature .sec04__Dd .credit .item {
  line-height: 2rem;
  font-size: 1.6rem;
  font-family: "interstate-condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
  color: #82A9D8;
}
.feature .sec04__Dd .credit .item .link {
  line-height: 2rem;
  font-size: 1.6rem;
  font-family: "interstate-condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
  color: #82A9D8;
  letter-spacing: 0.02em;
}
.feature .sec04__Checkallitems {
  margin: 3.9rem auto 8.1rem;
  text-align: center;
}
.feature .sec04__Checkallitems a {
  width: 34.1rem;
  height: 6.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 2.7rem;
  font-family: "the-seasons", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 800;
  color: #82A9D8;
  background: #fff;
  border: 0.1rem solid #82A9D8;
  border-radius: 5rem;
  letter-spacing: 0.05em;
}
.feature .sec04__Staff dt {
  text-align: center;
  font-size: 2.1rem;
  font-family: "interstate-condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-weight: 800;
  color: #82A9D8;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-bottom: 1.2rem;
}
.feature .sec04__Staff dd {
  text-align: center;
  line-height: 1.7rem;
  font-size: 1.2rem;
  font-family: "interstate-condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
  color: #82A9D8;
  letter-spacing: 0.02em;
}

.l-footer {
  padding: 0;
}

.pc-footer {
  margin: 0;
}