@charset "UTF-8";

 html {
   font-size: 0.4857vw;
 }

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

 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;
 }

 /*-------------------------
   PC_page
  -------------------------*/
 .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;
 }

 #feature .left {
   position: sticky;
   top: 80px;
   left: 0;
   width: 100%;
   height: calc(100vh - 80px);
   display: flex;
   order: 1;
   flex: 1;
   justify-content: center;
   align-items: center;
 }

 #feature .left figure {
   width: 29.5rem;
 }

 #feature .right {
   position: sticky;
   top: 80px;
   left: 0;
   width: 100%;
   height: calc(100vh - 80px);
   display: flex;
   order: 3;
   flex: 1;
   justify-content: center;
   align-items: center;
 }

 #feature .right figure {
   width: 37rem;
   margin-top: 7rem;
 }

 #feature.active {
   background: #eae5d0;
 }

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

 #feature {
   box-sizing: border-box;
   overflow: clip;
   position: relative;
   width: 100%;
   color: #000;
   display: flex;
   font-family: "fot-cezanne-pron", sans-serif;
   font-weight: 500;
   font-style: normal;
   font-feature-settings: "palt";
   background: #f2dfe7;
   transition: background-color 0.5s ease-in-out;
 }

 #feature .feature__inner {
   max-width: 75rem;
   margin: auto;
   position: relative;
   overflow: clip;
   background: #f2e7eb;
   order: 2;
   flex: 1;
 }

 #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 .item_overlay {
   pointer-events: none;
 }

 #feature .section {
   position: relative;
 }

 #feature .section.sec01 {
   padding-bottom: 19rem;
 }

 #feature .section.sec02 {
   padding-bottom: 13.3rem;
   background: #efebdc;
 }

 /*-------------------------
 Movie
-------------------------*/
 #feature .mv {
   overflow: hidden;
   margin: 0 auto;
   position: relative;
 }

 #feature .mv video {
   width: 100%;
   -webkit-transform: translateZ(0);
   transform: translateZ(0);
   will-change: transform;
 }

 #feature .mv #sound {
   position: absolute;
   top: 1.9rem;
   right: 1.75rem;
   z-index: 10;
 }

 #feature .mv #sound:hover {
   cursor: pointer;
 }

 #feature .mv #sound span {
   display: none;
 }

 #feature .mv #sound span.active {
   display: block;
 }

 #feature .mv #sound span.off {
   width: auto;
   height: 1.62rem;
 }

 #feature .mv #sound span.off img {
   width: auto;
   height: 100%;
 }

 #feature .mv #sound span.on {
   width: auto;
   height: 1.62rem;
 }

 #feature .mv #sound span.on img {
   width: auto;
   height: 100%;
 }

 /*-------------------------
 fade
-------------------------*/
 #feature .fadeUp {
   opacity: 0;
   transition: opacity 1.1s ease, translate 1.1s ease;
   translate: 0 100px;
 }

 #feature .fadeUp.active {
   opacity: 1;
   translate: 0;
 }

 #feature .fadeIn {
   opacity: 0;
   transition: opacity 1.1s ease, translate 1.1s ease;
 }

 #feature .fadeIn.active {
   opacity: 1;
 }

 #feature .fadeIn_delay figure {
   opacity: 0;
   transition: opacity 0.1s ease, translate 0.1s ease;
 }

 #feature .fadeIn_delay.active figure {
   opacity: 1;
   translate: 0 0;
 }

 #feature .fadeIn_delay.active figure:nth-child(1) {
   transition-delay: 0.4s;
 }

 #feature .fadeIn_delay.active figure:nth-child(2) {
   transition-delay: 0.8s;
 }

 #feature .fadeIn_delay.active figure:nth-child(3) {
   transition-delay: 1.2s;
 }

 /*-------------------------
 Text
-------------------------*/
 #feature .text_accordion {
   text-align: center;
   margin-top: 6.7rem;
 }

 #feature .text_accordion_inner {
   overflow: hidden;
 }

 #feature .text_accordion p {
   color: #6d1b43;
   font-size: 2.6rem;
   letter-spacing: 0.075em;
   line-height: 2;
 }

 #feature .text_accordion_more {
   display: grid;
   grid-template-rows: 0fr;
   opacity: 0;
   visibility: hidden;
   transition:
     grid-template-rows 0.8s ease,
     opacity 0.6s ease,
     visibility 0.8s;
 }

 #feature .text_accordion_more>* {
   overflow: hidden;
 }

 #feature .text_accordion_more p {
   margin-top: 3.4rem;
 }

 #feature .text_accordion_more p:nth-of-type(2) {
   margin-top: 4.2rem;
 }

 #feature .text_accordion_more p:nth-of-type(4) {
   margin-top: 3.8rem;
 }

 #feature .text_accordion_button {
   display: block;
   padding: 0;
   margin-right: auto;
   margin-left: auto;
   background: transparent;
   border: 0;
   cursor: pointer;
   appearance: none;
 }

 #feature .text_accordion_button img {
   display: block;
   width: 100%;
   height: auto;
 }

 #feature .text_accordion_open {
   width: 7.84053rem;
   margin-top: 6.1rem;
   opacity: 1;
   visibility: visible;
   transition:
     opacity 0.4s ease,
     visibility 0.4s;
 }

 #feature .text_accordion_close {
   width: 7.53447rem;
   height: 0;
   margin-top: 0;
   overflow: hidden;
   opacity: 0;
   visibility: hidden;
   transition:
     height 0.5s ease,
     margin-top 0.5s ease,
     opacity 0.4s ease,
     visibility 0.5s;
 }

 #feature .text_accordion.is-open .text_accordion_more {
   grid-template-rows: 1fr;
   opacity: 1;
   visibility: visible;
 }

 #feature .text_accordion.is-open .text_accordion_open {
   height: 0;
   margin-top: 0;
   overflow: hidden;
   opacity: 0;
   visibility: hidden;
 }

 #feature .text_accordion.is-open .text_accordion_close {
   height: auto;
   margin-top: 5.2rem;
   opacity: 1;
   visibility: visible;
 }

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

 /*-------------------------
 Slider
-------------------------*/
 #feature .splide {
   width: 62rem;
   margin: 12rem 0 0 0;
 }

 #feature .splide02 {
   width: 66rem;
   margin: 19rem auto 0;
 }

 .splide__slide a {
   display: block;
 }

 #feature .splide__track {
   background: #fff;
 }

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

 /*-------------------------
 hero
-------------------------*/
 #feature .hero {
   width: 75rem;
   height: fit-content;
   margin: auto;
   position: relative;
 }

 /*-------------------------
 image
-------------------------*/
 #feature .ttl {
   width: 36rem;
   margin: 14rem auto 0;
 }

 #feature .release {
   width: 56rem;
   margin: 9.8rem auto 0;
 }

 #feature .img01 {
   width: 75rem;
   margin: 22rem auto 0;
 }

 #feature .img02 {
   width: 65rem;
   margin: 8rem auto 0;
 }

 #feature .img03 {
   width: 75rem;
   margin: 19rem auto 0;
 }

 #feature .img04 {
   width: 72.1236rem;
   margin: 7.2rem 0 0 5rem;
 }

 #feature .img04_2 {
   width: 32rem;
   position: absolute;
   top: 0.4rem;
   right: -8.8rem;
   pointer-events: none;
 }

 #feature .img04_3 {
   width: 31rem;
   position: absolute;
   bottom: 15.3rem;
   left: -6.5rem;
   pointer-events: none;
 }

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

 #feature .img06 {
   width: 52rem;
   margin: 21rem auto 0;
 }

 #feature .img06 {
   width: 52rem;
   margin: 21rem auto 0;
 }

 #feature .logo {
   width: 77.76683rem;
   margin: 16rem 0 0 -1.3rem;
 }

 #feature .img07 {
   width: 68rem;
   margin: -4rem auto 0;
   position: relative;
   z-index: 20;
 }

 #feature .img08_deco {
   width: 10rem;
   margin: -93rem 0 0 auto;
 }

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

 #feature .img11_deco {
   width: 49rem;
   margin: 0 auto 0 0;
 }

 #feature .img11_deco02 {
   width: 38rem;
   margin: -49.4rem 0 0 auto;
 }

 #feature .img11 {
   width: 52rem;
   margin: -34rem 3rem 0 auto;
   position: relative;
   z-index: 5;
 }

 #feature .img11_2 {
   width: 32rem;
   position: absolute;
   top: 47rem;
   left: 3.5rem;
   pointer-events: none;
   z-index: 10;
 }

 #feature .img11_3 {
   width: 76.63112rem;
   margin: 5.1rem auto 0 -4rem;
   position: relative;
   z-index: 10;
 }

 #feature .logo02 {
   width: 77.76683rem;
   margin: 18rem 0 0 -1.3rem;
   position: relative;
   z-index: 20;
   pointer-events: none;
 }

 #feature .img12 {
   width: 75rem;
   margin: -8.3rem auto 0;
   position: relative;
   z-index: 5;
 }

 #feature .img13 {
   width: 60rem;
   margin: 8rem auto 0;
 }

 #feature .img14 {
   width: 63rem;
   margin: 19rem auto 0 0;
 }

 #feature .img14_deco {
   width: 9rem;
   margin: -94.5rem 0 0 auto;
 }

 #feature .item01 {
   width: 16rem;
   margin: -33.7rem 0 0 54rem;
   position: relative;
   z-index: 10;
   pointer-events: none;
 }

 #feature .item02 {
   width: 16rem;
   margin: -16rem 0 0 34rem;
 }

 #feature .item03 {
   width: 16rem;
   margin: -15rem 0 0 53.9rem;
 }

 #feature .img15 {
   width: 58rem;
   margin: 12rem auto 0;
 }

 #feature .img17 {
   width: 63rem;
   margin: 8rem auto 0 0;
 }

 #feature .img18_bg {
   width: 75rem;
   margin-top: 12.2rem;
 }

 #feature .img18_bg img {
   display: block;
   width: 100%;
   height: auto;
 }

 #feature .img18 {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 60rem;
   z-index: 1;
 }

 #feature .block_area .img18 img {
   display: block;
   width: 100%;
   height: auto;
 }

 #feature .img19 {
   width: 54rem;
   margin: 19rem 0 0 17rem;
 }

 #feature .item04 {
   width: 20rem;
   margin: -31rem 0 0 2.3rem;
   position: relative;
   z-index: 10;
 }

 #feature .item05 {
   width: 20rem;
   margin: -10.3rem 0 0 24rem;
 }

 #feature .item06 {
   width: 20rem;
   margin: -3rem 0 0 8.5rem;
 }

 /*-------------------------
 Footer_area
-------------------------*/
 #feature .footer_area {
   width: 67.5rem;
   background: #fff;
   margin: 20rem auto 0;
 }

 #feature .logo_chilazawa {
   width: 36rem;
   margin: 0 auto;
   padding-top: 15rem;
 }

 #feature .footer_area p {
   width: 54.2rem;
   font-size: 2.6rem;
   text-align: justify;
   letter-spacing: 0.075em;
   line-height: 2;
   color: #6d1b43;
   margin: 4.7rem auto 0;
   padding-bottom: 10.5rem;
 }

 #feature .footer_area p span {
   letter-spacing: 0.1em;
 }

 #feature .btn {
   width: 56rem;
   margin: 22.2rem auto 0;
 }

 #feature .copy {
   width: 19.16597rem;
   margin: 4rem auto 0;
   padding-bottom: 8.7rem;
 }

 /*-------------------------
 credit
-------------------------*/
 #feature .credit-inner {
   display: flex;
   justify-content: center;
   gap: 0 2.3rem;
   margin-top: 2.7rem;
 }

 #feature .credit02 .credit-inner {
   display: block;
   margin: -0.4rem 3.9rem 0 0;
 }

 #feature .credit04 .credit-inner {
   width: 45rem;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 0 2.3rem;
   margin: 2.7rem auto 0;
 }

 #feature .credit04 .credit-inner li:nth-of-type(1) {
   margin: 0 12rem;
 }

 #feature .credit05 .credit-inner {
   display: block;
   width: fit-content;
   margin: -2.2rem 0 0 4rem;
 }

 #feature .credit06 .credit-inner {
   width: 40rem;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 0 2.3rem;
   margin: 5.8rem 0 0 17rem;
 }

 #feature .credit07 .credit-inner {
   width: fit-content;
   display: block;
   margin: 2.8rem 0 0 4rem;
 }

 #feature .credit10 .credit-inner {
   width: fit-content;
   display: block;
   margin: 2.8rem 3.9rem 0 auto;
 }

 #feature .credit-inner a {
   font-size: 2.2rem;
   letter-spacing: 0.05em;
   line-height: 2;
   text-align: left;
   color: #6d1b43;
   text-decoration: underline;
   text-decoration-skip-ink: none;
   pointer-events: auto;
   font-family: "futura-100", sans-serif;
   font-weight: 400;
   font-style: normal;
 }

 #feature .credit02 .credit-inner a {
   text-align: right;
 }

 #feature .credit05 .credit-inner a {
   text-align: left;
 }