 @charset "UTF-8";

 html {
   font-size: 0.4193vw;
 }

 @media screen and (min-width: 1919.9528px) {
   html {
     font-size: 8.05px;
   }
 }

 html,
 body,
 div,
 span,
 applet,
 object,
 iframe,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 p,
 blockquote,
 pre,
 a,
 abbr,
 acronym,
 address,
 big,
 cite,
 code,
 del,
 dfn,
 em,
 img,
 ins,
 kbd,
 q,
 s,
 samp,
 small,
 strike,
 strong,
 sub,
 sup,
 tt,
 var,
 b,
 i,
 dl,
 dt,
 dd,
 ol,
 ul,
 li,
 fieldset,
 form,
 label,
 legend,
 table,
 caption,
 tbody,
 tfoot,
 thead,
 tr,
 th,
 td,
 article,
 aside,
 canvas,
 details,
 embed,
 figure,
 figcaption,
 footer,
 header,
 hgroup,
 menu,
 nav,
 output,
 ruby,
 section,
 summary,
 time,
 mark,
 audio,
 video {
   margin: 0;
   padding: 0;
   border: 0;
   vertical-align: baseline;
   box-sizing: border-box;
 }

 .l-header {
   padding: 0;
   position: relative;
   z-index: 999;
   background-color: #fff;
   overflow-x: clip;
 }

 .l-footer {
   padding: 0;
   position: relative;
   z-index: 999;
   background-color: #fff;
   overflow-x: clip;
 }

 .pc-footer {
   margin: 0;
 }

 ul li {
   list-style: none;
 }

 /*-------------------------
   PC_area
  -------------------------*/
 #feature .left {
   position: -webkit-sticky;
   position: sticky;
   top: 55px;
   left: 0;
   width: 56.3%;
   height: calc(100vh - 55px);
 }

 #feature .hero {
   width: 100%;
   height: 100vh;
   margin: auto;
   position: relative;
   box-sizing: border-box;
 }

 #feature .hero img {
   width: 100%;
   height: 100vh;
   object-fit: cover;
   display: block;
 }

 #feature .pc_logo {
   position: absolute;
   top: 38.8%;
   left: 50%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   width: 48.6rem;
   pointer-events: none;
 }

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

 #feature .pc_ttl {
   position: absolute;
   bottom: 9%;
   left: 50.2%;
   transform: translateX(-50%);
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   width: 45.5rem;
   pointer-events: none;
 }

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

 /*-------------------------
 Content
-------------------------*/
 .l-container {
   width: 100%;
   overflow: clip;
 }

 #feature {
   box-sizing: border-box;
   overflow: clip;
   position: relative;
   font-family: "times-new-roman", sans-serif;
   font-weight: 400;
   font-style: normal;
   width: 100%;
   color: #000;
   display: flex;
   background: #fafaf7;
 }

 #feature .feature__inner {
   width: 75rem;
   margin: auto;
   position: relative;
   overflow: clip;
 }

 #feature a {
   display: block;
   transform: none;
   text-decoration: none;
 }

 #feature a:hover {
   cursor: pointer;
   opacity: .7;
   transition: all 0.3s ease-in-out;
 }

 #feature img,
 svg,
 video {
   width: 100%;
   height: auto;
   display: block;
   object-fit: cover;
 }

 #feature .section__inner {
   width: 100%;
 }

 #feature .block_area {
   position: relative;
   height: fit-content;
 }

 #feature .section {
   position: relative;
   background: #fafaf7;
 }

 #feature .section.sec01 {
   background: #fafaf7;
   border-radius: 1.2rem 1.2rem 0 0;
   padding-bottom: 11.4rem;
 }

 #feature .section.sec02 {
   padding-bottom: 18.7rem;
 }

 #feature .section.sec03 {
   padding-bottom: 18.6rem;
 }

 #feature .section.sec04 {
   padding-bottom: 14.2rem;
 }

 /*-------------------------
 fade
-------------------------*/
 #feature .fadeUp {
   opacity: 0;
   transition: 1.2s;
   transform: translateY(5rem);
 }

 #feature .fadeUp.active {
   opacity: 1;
   transform: translateY(0rem);
 }

 #feature .fadeIn {
   opacity: 0;
 }

 #feature .fadeIn.active {
   -webkit-animation: fade-in 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
   animation: fade_in 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
 }

 @keyframes fade_in {
   0% {
     opacity: 0;
   }

   100% {
     opacity: 1;
   }
 }

 /*-------------------------
 Sticky
-------------------------*/
 #feature .sticky {
   position: sticky;
   top: 0;
   -webkit-transform: translateZ(0);
   transform: translateZ(0);
   will-change: transform;
 }

 /*-------------------------
 Slider
-------------------------*/
 #feature .splide {
   width: 61rem;
   margin: 4rem auto 0;
   position: relative;
   z-index: 1;
 }

 .splide__slide a {
   display: block;
 }

 #feature .splide__track {
   background: #fff;
 }

 #feature .splide__slide img {
   width: 100%;
   display: block;
 }

 #feature .splide__pagination {
   position: absolute;
   top: auto;
   bottom: 1rem;
   right: 1.1rem;
   z-index: 10;
   display: flex;
   gap: 0.6rem;
   padding: 0;
   margin: 0;
 }

 #feature .splide__pagination__page {
   width: 0.7rem;
   height: 0.7rem;
   padding: 0;
   margin: 0;
   display: block;
   flex: none;
   border-radius: 50%;
   box-sizing: border-box;
   border: 1px solid #fff;
   background: transparent;
   opacity: 1;
   appearance: none;
   -webkit-appearance: none;
 }

 #feature .splide__pagination__page.is-active {
   background: #fff;
   transform: scale(1);
 }

 /*-------------------------
 tap_credit
-------------------------*/
 #feature .img_box {
   position: relative;
 }

 #feature .img_box__02 {
   width: 61rem;
   margin: 9rem auto 0;
 }

 #feature .img_box__03 {
   width: 75rem;
   margin: 3.8rem auto 0;
 }

 #feature .img_box__04 {
   width: 61rem;
   margin: 8.1rem auto 0;
 }

 #feature .img_box__05 {
   width: 75rem;
   margin: 12rem auto 0;
 }

 #feature .hero_area .img_box img {
   width: 100%;
   height: 100vh;
   object-fit: cover;
   display: block;
   cursor: pointer;
 }

 #feature .img_box img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
   cursor: pointer;
 }

 #feature .box_credit {
   opacity: 0;
   visibility: hidden;
   transition: 1.2s;
   z-index: 10;
   pointer-events: none;
 }

 #feature .img_box.active .box_credit {
   opacity: 1;
   visibility: visible;
   pointer-events: auto;
 }

 /*-------------------------
 hero
-------------------------*/
 #feature .hero {
   width: 100%;
   height: 100vh;
   margin: auto;
   /* position: relative; */
 }

 /*-------------------------
 ttl/text
-------------------------*/
 #feature .logo {
   width: 25.76342rem;
   margin: -1.2rem auto 0;
   padding-top: 10.3rem;
 }

 #feature .logo_02 {
   width: 25.76342rem;
   margin: 0 auto;
   padding-top: 10rem;
 }

 #feature .ttl_01 {
   width: 34.3751rem;
   margin: 16.2rem auto 0;
 }

 #feature .ttl_02 {
   width: 50.29438rem;
   margin: 0 auto;
 }

 #feature .ttl_03 {
   width: 54.05469rem;
   margin: 0 auto;
 }

 #feature .ttl_04 {
   width: 53.38223rem;
   margin: 0 auto;
 }

 #feature .ttl_05 {
   width: 51.35469rem;
   margin: 0 auto;
 }

 #feature .text_01 {
   width: 64.4644rem;
   margin: 59.6rem auto 50.05rem;
 }

 #feature .text_02 {
   width: 60.64536rem;
   margin: 4.5rem auto 0;
 }

 #feature .text_03 {
   width: 60.8269rem;
   margin: 4.5rem auto 0;
 }

 #feature .text_04 {
   width: 60.81597rem;
   margin: 4.5rem auto 0;
 }

 #feature .text_05 {
   width: 62.75518rem;
   margin: 5.5rem auto 0;
 }

 #feature .text_06 {
   width: 52.85469rem;
   margin: 4.8rem auto 0;
 }

 #feature .text_07 {
   width: 53.68306rem;
   margin: 4.5rem auto 0;
 }


 /*-------------------------
 image
-------------------------*/
 #feature .img04 {
   width: 50rem;
   margin: 6.4rem auto 0;
 }

 #feature .img05 {
   width: 75rem;
   margin: 4rem auto 0;
 }

 #feature .img06 {
   width: 75rem;
   margin: 4rem auto 0;
 }

 #feature .img08 {
   width: 75rem;
   margin: 4rem auto 0;
 }

 #feature .btn {
   width: 45.24159rem;
   margin: 16.6rem auto 0;
 }

 #feature .staff {
   width: 48.05503rem;
   margin: 5.2rem auto 0;
   padding-bottom: 8.7rem;
 }

 /*-------------------------
 credit
-------------------------*/
 #feature .credit-inner a {
   font-size: 2rem;
   letter-spacing: 0.01em;
   line-height: 1.285;
   text-align: left;
   color: #fff;
   pointer-events: auto;
   font-family: "times-new-roman", sans-serif;
   font-weight: 400;
   font-style: italic;
 }

 #feature .credit-inner li::before {
   content: "";
   position: absolute;
   top: 50%;
   left: -3.3rem;
   width: 1.73101rem;
   height: 1.73101rem;
   background: #fff;
   border-radius: 50%;
   transform: translateY(-50%);
 }

 /** credit_top **/
 #feature .img_box__top .credit01 .credit-inner {
   width: 24rem;
   position: absolute;
   left: 70%;
   top: 67%;
   transform: translate(-50%, -50%);
   text-align: right;
 }

 #feature .img_box__top .credit01 .credit-inner a {
   letter-spacing: 0.04em;
   line-height: 1.35;
   text-align: right;
 }

 #feature .img_box__top .credit01 .credit-inner a span:nth-of-type(1) {
   display: inline-block;
   margin-right: -0.5rem;
 }

 #feature .img_box__top .credit01 .credit-inner li::before {
    left: 105%;
    top: 50%;
 }

 #feature .img_box__top .credit02 .credit-inner {
   width: 19rem;
   position: absolute;
   left: 50%;
   top: 73%;
   transform: translate(-50%, -50%);
 }

 #feature .img_box__top .credit02 .credit-inner a {
   letter-spacing: 0.04em;
   line-height: 1.35;
 }

 #feature .img_box__top .credit02 .credit-inner a span:nth-of-type(1) {
   display: block;
 }

 #feature .img_box__top .credit02 .credit-inner li::before {
  left: -22%;
  top: 50%;
 }

 #feature .img_box__top .credit03 .credit-inner {
   width: 29rem;
   position: absolute;
   left: 68%;
   top: 47%;
   transform: translate(-50%, -50%);
 }

 #feature .img_box__top .credit03 .credit-inner a {
   letter-spacing: 0.04em;
   line-height: 1.3;
 }

 #feature .img_box__top .credit03 .credit-inner a span:nth-of-type(1) {
   display: block;
 }

 #feature .img_box__top .credit03 .credit-inner li::before {
  left: -13%;
  top: 50%;
 }

 #feature .img_box__top .credit04 .credit-inner {
   width: 28rem;
   position: absolute;
   left: 52.56%;
   top: 11%;
   transform: translate(-50%, -50%);
 }

 #feature .img_box__top .credit04 .credit-inner a {
   letter-spacing: 0.04em;
   line-height: 1.33;
 }

 #feature .img_box__top .credit04 .credit-inner a span:nth-of-type(1) {
   display: block;
 }

 #feature .img_box__top .credit04 .credit-inner li::before {
  left: -13%;
  top: 50%;
 }

 #feature .img_box__top .credit05 .credit-inner {
   width: 29rem;
   position: absolute;
   left: 37%;
   top: 83%;
   transform: translate(-50%, -50%);
 }

 #feature .img_box__top .credit05 .credit-inner a {
   letter-spacing: 0.052em;
   line-height: 1.33;
 }

 #feature .img_box__top .credit05 .credit-inner a span.price {
   display: inline-block;
   letter-spacing: 0.02em;
 }

 #feature .img_box__top .credit05 .credit-inner li::before {
  left: -13%;
  top: 50%;
 }



 /** credit_01 **/
 #feature .sec01 .credit01 .credit-inner {
   width: 24rem;
   position: absolute;
   top: 56.5rem;
   left: 29.3rem;
 }

 #feature .sec01 .credit01 .credit-inner a {
   letter-spacing: 0.032em;
   line-height: 1.35;
 }

 #feature .sec01 .credit01 .credit-inner li::before {
   top: 53.7%;
 }

 #feature .sec01 .credit01 .credit-inner a span:nth-of-type(1) {
   display: block;
 }

 /** credit_02 **/
 #feature .sec02 .credit02 .credit-inner {
   width: 19rem;
   position: absolute;
   top: 61.35rem;
   left: 39.3rem;
 }

 #feature .sec02 .credit02 .credit-inner a {
   letter-spacing: 0.04em;
   line-height: 1.33;
 }

 #feature .sec02 .credit02 .credit-inner a span:nth-of-type(1) {
   display: block;
 }

 #feature .sec02 .credit02 .credit-inner li::before {
   top: 37%;
   left: -3.5rem;
 }

 /** credit_03 **/
 #feature .sec04 .credit03 .credit-inner {
   width: 20rem;
   position: absolute;
   top: 48.9rem;
   left: 35.1rem;
 }

 #feature .sec04 .credit03 .credit-inner a {
   letter-spacing: 0.04em;
   line-height: 1.33;
 }

 #feature .sec04 .credit03 .credit-inner a span:nth-of-type(1) {
   display: block;
 }

 #feature .sec04 .credit03 .credit-inner li::before {
   top: 37%;
   left: -3.3rem;
 }

 /** credit_04 **/
 #feature .sec05 .credit04 .credit-inner {
   width: 28rem;
   position: absolute;
   top: 87.6rem;
   left: 41.4rem;
 }

 #feature .sec05 .credit04 .credit-inner a {
   letter-spacing: 0.04em;
   line-height: 1.33;
 }

 #feature .sec05 .credit04 .credit-inner a span:nth-of-type(1) {
   display: block;
 }

 #feature .sec05 .credit04 .credit-inner li::before {
   top: 55%;
   left: -2.8rem;
 }
