@charset "UTF-8";

html{
  font-size: 10px;
  scroll-behavior: smooth;
}

html{
  font-size: calc(10 * (100vw / 1200));
}

body{
  overflow-x: clip;
}

.l-container{
  color: #000;
  font-family: "zen-kaku-gothic-new", sans-serif;
  margin: 0 auto;
  width: 100%;
}
.l-container a{
  display: block;
  color: #fff;
  text-decoration: none;
}

.l-container a:hover{
  cursor: pointer;
}

.l-container #feature a::after{
  content: "";
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.6);
  transition: all 0.4s;
}
.l-container #feature a:hover::after{
  opacity: 1;
  transition: 0.4s;
}

.l-container img{
  width: 100%;
  height: 100%;
  vertical-align: top;
}

.l-container .default-img{
  display: block;
  height: auto;
  width: 100%; 
}

.l-container .video__body{
  height: 100%;
  width: 100%;
}

.l-container .video__body--content{
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
}

.l-container #sp-only{
  display: none !important;
}

/*******************************
mv
*******************************/

.feature .mv{
  background: #f4f2ef;
  padding: calc(115 *(100vw / 1400) * 0.71) 0 calc(128 *(100vw / 1400) * 0.71);
  position: relative;
  width: 100%;
}

.feature .mv .inner{
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.feature .mv .mv__box.box01{
  margin: calc(4 *(100vw / 1400)) 0 0 calc(132 *(100vw / 1400));
  position: relative;
}
.feature .mv .mv__box.box02{
  margin-left: calc(36 *(100vw / 1400));
}

.feature .mv .mv__logo{
  margin: auto;
  width: calc(171.37 *(100vw / 1400));
}

.feature .mv .mv__latest{
  top: calc(-4 *(100vw / 1400));
  right: calc(4 *(100vw / 1400));
  position: absolute;
  width: calc(95.38 *(100vw / 1400));
}

.feature .mv .mv__ttl{
  font-weight: 700;
}
.feature .mv .mv__ttl.ttl01{
  color: #792a2d;
  font-size: calc(32 *(100vw / 1400));
  line-height: 1;
  margin: calc(48 *(100vw / 1400)) 0 0 calc(50 *(100vw / 1400));
  width: fit-content;
}
.feature .mv .mv__ttl.ttl02{
  font-weight: 500;
  font-size: calc(60 *(100vw / 1400));
  left: calc(-6 *(100vw / 1400));
  letter-spacing: -0.23em;
  line-height: 1.2325;
  margin: calc(1 *(100vw / 1400)) auto 0;
  position: relative;
  text-align: center;
}
.feature .mv .mv__ttl.ttl02 span:nth-of-type(1){
  font-size: calc(46 *(100vw / 1400));
  margin-left: calc(6 *(100vw / 1400) * 0.71);
}
.feature .mv .mv__ttl.ttl02 span:nth-of-type(2){
  left: calc(11 *(100vw / 1400) * 0.71);
  letter-spacing: 0.01em;
  position: relative;
}

.feature .mv .mv__img{
  margin: 0 auto;
  width: calc(474 *(100vw / 1400));
}

.feature .mv .mv__comment.comment01{
  margin: calc(-110 *(100vw / 1400)) 0 0 calc(39 *(100vw / 1400));
  width: calc(191.1 *(100vw / 1400));
}
.feature .mv .mv__comment.comment02{
  margin: calc(17 *(100vw / 1400)) 0 0 calc(148 *(100vw / 1400));
  width: calc(156 *(100vw / 1400));
}
.feature .mv .mv__comment.comment03{
  margin: calc(-146 *(100vw / 1400)) 0 0 calc(264 *(100vw / 1400));
  width: calc(184.3 *(100vw / 1400));
}

.feature .mv .mv__text{
  font-weight: 400;
  font-size: calc(18 *(100vw / 1400));
  letter-spacing: -0.105em;
  line-height: 2;
  margin: calc(38 *(100vw / 1400)) auto 0;
  position: relative;
  text-align: center;
  width: calc(565.57 *(100vw / 1400));
}
.feature .mv .mv__text::before,
.feature .mv .mv__text::after{
  background: url(../img/pc_line.svg) top left / contain no-repeat;
  content: "";
  position: absolute;
  top: calc(4 *(100vw / 1400));
  left: 0;
  height: calc(212.6 *(100vw / 1400));
  width: calc(13.5 *(100vw / 1400));
}
.feature .mv .mv__text::after{
  left: inherit;
  right: 0;
  transform: scale(-1,1);
}

.feature .mv .mv__year{
  position: absolute;
  top: calc(-2 *(100vw / 1400));
  right: calc(130 *(100vw / 1400));
  width: calc(33 *(100vw / 1400));
}
.feature .mv .mv__txt{
  color: #792a2d;
  font-family: "goldenbook", serif;
  font-weight: 800;
  font-size: calc(22.4 *(100vw / 1400));
  position: absolute;
  top: calc(440 *(100vw / 1400));
  right: calc(106 *(100vw / 1400));
  transform: rotate(90deg);
}

.feature .mv .mv__loop{
  margin: 0 auto;
  overflow: hidden;
  position: absolute;
  top: calc(60 *(100vw / 1400));
  right: calc(-172 *(100vw / 1400));
  transform: rotate(90deg);
  transform-origin: 0;
  height: calc(27.25 *(100vw / 1400));
  width: calc(318.3 *(100vw / 1400));
  z-index: 2;
}
.feature .mv .mv__loop-inner{
  display: flex;
}

.feature .mv .mv__loop .mv__loop-text{
  animation: Move01 15s infinite linear;
  color: #792a2d;
  flex-shrink: 0;
  font-family: "goldenbook", serif;
  font-weight: 600;
  font-size: calc(20.8 *(100vw / 1400));
  margin: 0 calc(4 *(100vw / 1400));
  height: fit-content;
  white-space: nowrap;
}
.feature .mv .mv__loop:nth-of-type(2) .mv__loop-text{
  animation: Move02 30s infinite linear;
}

@keyframes Move01{
  0% {transform: translateX(0%);}
  100% {transform: translateX(-100%);}
}
@keyframes Move02{
  0% {transform: translateX(-100%);}
  100% {transform: translateX(0%);}
}

/*******************************
flex
*******************************/

.feature .flex{
  display: flex;
  margin: 0 auto;
  width: calc(1140 *(100vw / 1400));
}

/*******************************
comparison
*******************************/

.feature .comparison{
  margin: calc(118 *(100vw / 1400) * 0.624) auto 0;
  padding-bottom: calc(80 *(100vw / 1400));
  position: sticky;
  top: 110px;
  height: fit-content;
  width: calc(570 *(100vw / 1400));
}

.feature .comparison .comparison__btn{
  left: calc(2 *(100vw / 1400));
  margin: calc(40 *(100vw / 1400)) auto 0;
  position: relative;
  width: calc(260 *(100vw / 1400));
}

.feature .comparison .comparison__ttl.ttl01{
  margin-left: calc(88 * (100vw / 1400));
  width: calc(396.14 *(100vw / 1400));
}

.feature .comparison .comparison__bg{
  left: calc(2 *(100vw / 1400));
  margin: calc(29 *(100vw / 1400)) auto 0;
  position: relative;
  width: calc(446 *(100vw / 1400));
}

.feature .comparison .comparison__link a::after{
  content: none !important;
}

.feature .comparison .comparison__link{
  position: absolute;
  width: calc(232 *(100vw / 1400) * 0.624);
}
.feature .comparison .comparison__link.link01{
  margin: auto;
  top: calc(330 *(100vw / 1400));
  left: 0;
  right: 0;
}
.feature .comparison .comparison__link.link02{
  top: calc(156 *(100vw / 1400) );
  left: calc(37 *(100vw / 1400));
}
.feature .comparison .comparison__link.link03{
  top: calc(496 *(100vw / 1400));
  left: calc(102 *(100vw / 1400));
}
.feature .comparison .comparison__link.link04{
  margin: auto;
  top: calc(448 *(100vw / 1400));
  left: 0;
  right: 0;
}
.feature .comparison .comparison__link.link05{
  top: calc(158 *(100vw / 1400));
  left: calc(140 *(100vw / 1400));
}
.feature .comparison .comparison__link.link06{
  top: calc(200 *(100vw / 1400));
  right: calc(170 *(100vw / 1400));
}
.feature .comparison .comparison__link.link07{
  top: calc(315 *(100vw / 1400));
  right: calc(94 *(100vw / 1400));
}

/*******************************
container
*******************************/

.feature .main{
  margin: calc(102 *(100vw / 1400) * 0.71) auto 0;
  width: calc(570 *(100vw / 1400));
}

.feature .sec{
  border-radius: calc(375 *(100vw / 1400) * 0.71) calc(375 *(100vw / 1400) * 0.71) 0 0;
  padding-top: calc(113 *(100vw / 1400) * 0.71);
  position: relative;
  margin: auto;
  width: calc(534 *(100vw / 1400));
  scroll-margin-top: 80px;
}
.feature .sec.beige{
  background: #f4f2ef;
}
.feature .sec.white{
  background: #fff;
}

.feature .sec .inner{
  margin: auto;
  position: relative;
  width: 100%;
}

.feature .sec .sec__flex{
  display: flex;
}
.feature .sec .sec__flex.coordinate{
  justify-content: space-between;
  margin: calc(29 *(100vw / 1400) * 0.71) auto 0;
  width: calc(675.5 *(100vw / 1400) * 0.71);
}

.feature .sec .sec__flex.coordinate .sec__item{
  width: calc(302 *(100vw / 1400) * 0.71);
}
.feature .sec .sec__flex.coordinate .sec__item-img{
  border: calc(1 *(100vw / 1400) * 0.71) solid #000;
}

.feature .sec .sec__flex.coordinate .sec__item p{
  color: #000;
  font-weight: 500;
  font-size: calc(22 *(100vw / 1400) * 0.71);
  left: calc(-4 *(100vw / 1400) * 0.71);
  letter-spacing: -0.18em;
  line-height: 1.27272;
  margin: calc(7 *(100vw / 1400) * 0.71) auto 0;
  position: relative;
  text-align: center;
}
.feature .sec .sec__flex.coordinate .sec__item p span{
  letter-spacing: -0.04em;
}

.feature .sec .sec__img,
.feature .sec .sec__item,
.feature .sec .sec__item-img{
  position: relative;
}

.feature .sec .sec__text{
  color: #792a2d;
  font-weight: 400;
  font-size: calc(28 *(100vw / 1400) * 0.71);
  left: calc(16 *(100vw / 1400) * 0.71);
  letter-spacing: -0.045em;
  line-height: 1.5714;
  margin: calc(53 *(100vw / 1400) * 0.71) auto 0;
  position: relative;
  width: calc(620 *(100vw / 1400) * 0.71);
}
.feature .sec .sec__text::before{
  background: #792a2d;
  content: "";
  top: calc(10 *(100vw / 1400) * 0.71);
  left: calc(-32 *(100vw / 1400) * 0.71);
  position: absolute;
  height: 98%;
  width: calc(2 *(100vw / 1400) * 0.71);
}

.feature .sec .sec__ttl{
  margin: 0 auto;
  position: relative;
}

.feature .sec .sec__read{
  font-weight: 500;
  font-size: calc(36 *(100vw / 1400) * 0.71);
  line-height: 1;
  text-align: center;
}

.feature .sec .sec__coordinate{
  font-weight: 500;
  font-size: calc(32 *(100vw / 1400) * 0.71);
  line-height: 1.25;
  margin: calc(68 *(100vw / 1400) * 0.71) auto 0;
  text-align: center;
}

.feature .sec .sec__price{
  font-weight: 500;
  font-size: calc(24 *(100vw / 1400) * 0.71);
  line-height: 1.7;
  margin: calc(31 *(100vw / 1400) * 0.71) auto 0;
  text-align: center;
}

/*******************************
sec01
*******************************/

.feature .sec01{
  margin: 0 auto;
  padding-bottom: calc(410 *(100vw / 1400) * 0.71);
}

.feature .sec01 .sec__ttl{
  width: calc(408 *(100vw / 1400) * 0.71);
}
.feature .sec01 .sec__price span{
  margin-left: calc(-20 *(100vw / 1400) * 0.71);
}

.feature .sec01 .flex01{
  justify-content: center;
  margin: calc(19 *(100vw / 1400) * 0.71) auto 0;
  width: 100%;
}

.feature .sec01 .sec__img{
  width: calc(350 *(100vw / 1400) * 0.71);
}

.feature .sec01 .sec__read{
  letter-spacing: -0.065em;
  margin: calc(26 *(100vw / 1400) * 0.71) auto 0;
}

/*******************************
sec02
*******************************/

.feature .sec02{
  margin: calc(-313 *(100vw / 1400) * 0.71) auto 0;
  padding-top: calc(113 *(100vw / 1400) * 0.71);
}

.feature .sec02 .ttl01{
  left: calc(8 *(100vw / 1400) * 0.71);
  width: calc(448 *(100vw / 1400) * 0.71);
}
.feature .sec02 .ttl02{
  margin: calc(64 *(100vw / 1400) * 0.71) auto 0;
  width: calc(588 *(100vw / 1400) * 0.71);
  scroll-margin-top: 80px;
}
.feature .sec02 .price02{
  margin-top: calc(29 *(100vw / 1400) * 0.71);
}

.feature .sec02 .sec__read{
  letter-spacing: -0.105em;
  margin: calc(23 *(100vw / 1400) * 0.71) auto 0;
}

.feature .sec02 .sec__coordinate{
  margin: 0 0 calc(26 *(100vw / 1400) * 0.71);
  text-align: left;
}
.feature .sec02 .sec__coordinate span{
  letter-spacing: -0.09em;
}

.feature .sec02 .flex01{
  justify-content: center;
  left: calc(-4 *(100vw / 1400) * 0.71);
  margin: calc(20 *(100vw / 1400) * 0.71) auto 0;
  position: relative;
  width: calc(690 *(100vw / 1400) * 0.71);
}
.feature .sec02 .sec__flex.coordinate{
  margin: calc(44 *(100vw / 1400) * 0.71) auto 0;
}

.feature .sec02 .sec__img{
  width: calc(300 *(100vw / 1400) * 0.71);
}

.feature .sec02 .slide01{
  margin: calc(34 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec02 .slide01 .sec__img{
  margin: 0 calc(22 *(100vw / 1400) * 0.71);
  width: calc(320 *(100vw / 1400) * 0.71) !important;
}

/*******************************
sec03
*******************************/

.feature .sec03{
  margin: calc(100 *(100vw / 1400) * 0.71) auto 0;
  padding: calc(121 *(100vw / 1400) * 0.71) 0 calc(420 *(100vw / 1400) * 0.71);
}

.feature .sec03 .sec__ttl{
  width: calc(234 *(100vw / 1400) * 0.71);
}

.feature .sec03 .sec__price{
  margin-top: calc(29 *(100vw / 1400) * 0.71);
}

.feature .sec03 .slide01{
  margin: calc(24 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec03 .sec__img{
  margin: 0 calc(10 *(100vw / 1400) * 0.71);
  width: calc(340 *(100vw / 1400) * 0.71) !important;
}

.feature .sec03 .sec__read{
  letter-spacing: -0.075em;
  margin: calc(32 *(100vw / 1400) * 0.71) auto 0;
}

/*******************************
sec04
*******************************/

.feature .sec04{
  margin: calc(-320 *(100vw / 1400) * 0.71) auto 0;
  padding-top: calc(120 *(100vw / 1400) * 0.71);
}

.feature .sec04 .sec__ttl.ttl01{
  width: calc(328 *(100vw / 1400) * 0.71);
}
.feature .sec04 .ttl02{
  margin-top: calc(71 *(100vw / 1400) * 0.71);
  width: calc(454 *(100vw / 1400) * 0.71);
  scroll-margin-top: 80px;
}

.feature .sec04 .sec__flex.coordinate{
  margin: calc(42 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec04 .sec__coordinate{
  margin: 0 0 calc(26 *(100vw / 1400) * 0.71);
  text-align: left;
}
.feature .sec04 .sec__coordinate span{
  letter-spacing: -0.09em;
}

.feature .sec04 .sec__flex.coordinate .sec__item:nth-of-type(2) p{
  letter-spacing: -0.155em;
  left: calc(-19 *(100vw / 1400) * 0.71);
  position: relative;
  white-space: nowrap;
}
.feature .sec04 .sec__flex.coordinate .sec__item:nth-of-type(2) p span{
  margin-left: calc(36 *(100vw / 1400) * 0.71);
}

.feature .sec04 .sec__read{
  margin: calc(25 *(100vw / 1400) * 0.71) auto 0;
}

.feature .sec04 .slide01{
  margin: calc(30 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec04 .slide01 .sec__img{
  margin: 0 calc(6 *(100vw / 1400) * 0.71);
  width: calc(330 *(100vw / 1400) * 0.71) !important;
}
.feature .sec04 .slide02{
  margin: calc(24 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec04 .slide02 .sec__img{
  margin: 0 calc(2 *(100vw / 1400) * 0.71);
  width: calc(340 *(100vw / 1400) * 0.71) !important;
}

/*******************************
sec05
*******************************/

.feature .sec05{
  border-radius: calc(355 *(100vw / 1400) * 0.71) calc(355 *(100vw / 1400) * 0.71) 0 0;
  margin: calc(96 *(100vw / 1400) * 0.71) auto 0;
  padding: calc(124 *(100vw / 1400) * 0.71) 0 calc(180 *(100vw / 1400) * 0.71);
}

.feature .sec05 .sec__ttl{
  width: calc(528 *(100vw / 1400) * 0.71);
}

.feature .sec05 .sec__price span{
  margin-left: calc(30 *(100vw / 1400) * 0.71);
}

.feature .sec05 .sec__read{
  margin: calc(20 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec05 .sec__text{
  letter-spacing: -0.06em;
}
.feature .sec05 .sec__text span{
  letter-spacing: -0.12em;
}

.feature .sec05 .sec__coordinate{
  margin: calc(67 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec05 .sec__flex.coordinate{
  margin: calc(27 *(100vw / 1400) * 0.71) auto 0
}

.feature .sec05 .slide01{
  margin: calc(24 *(100vw / 1400) * 0.71) auto 0;
}
.feature .sec05 .sec__img{
  margin: 0 calc(2 *(100vw / 1400) * 0.71);
  width: calc(340 *(100vw / 1400) * 0.71) !important;
}

.feature .sec05 .sec__btn{
  margin: calc(197 *(100vw / 1400) * 0.71) auto 0;
  position: relative;
  width: calc(600 *(100vw / 1400) * 0.71);
}

/*******************************
fade
*******************************/

.l-container #feature [data-fade="fade"]{
  opacity: 0;
  transition: opacity 1s ease;
}
.l-container #feature .target[data-fade="fade"][data-is-active="true"],
.l-container #feature .parent[data-is-active="true"] [data-fade="fade"]{
  opacity: 1;
}

.l-container #feature .target[data-fade="top"],
.l-container #feature .parent [data-fade="top"]{
  opacity: 0;
  transform: translateY(10%);
  transition: opacity 1s ease, transform 1s ease;
}
.l-container #feature .target[data-fade="top"][data-is-active="true"],
.l-container #feature .parent[data-is-active="true"] [data-fade="top"]{
  opacity: 1;
  transform: translateX(0);
}

.l-container #feature [data-fade="scale"],
.l-container #feature .parent [data-fade="scale"]{
  opacity: 0;
  transform: translateY(5px) scale(0.9);
  transition: opacity .3s ease .3s, transform .3s ease .3s;
}
.l-container #feature .parent[data-is-active="true"] [data-fade="scale"]{
  opacity: 1;
  transform: translate(0);
}

.l-container #feature .delay01{
  transition-delay: .3s !important;
}
.l-container #feature .delay02{
  transition-delay: .6s !important;
}
.l-container #feature .delay03{
  transition-delay: .9s !important;
}

@media screen and (min-width: 1400px){

}

.pc-footer{
  margin: 0;
}
.l-footer{
  padding: 0;
}


.swiper-wrapper {
  transition-timing-function: linear;
}