@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  border: none;
  list-style: none;
  text-decoration: none;
}
html{
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%;
}
body{ 
  font-family: 'Noto Sans JP', sans-serif;
  font-size: var(--fs-20);
  font-weight: 300;
  min-width: 320px;
  color: var(--fc-txt);
}
.en{
  font-family: "Marcellus", serif;
  font-style: normal;
}
#lottie{
  background-color: var(--bg-color-wht);
  width:100%;
  height:100%;
  display:block;
  overflow: hidden;
  transform: translate3d(0,0,0);
  text-align: center;
  opacity: 1;
}
#op-pc svg,
#op-sp svg{
  vertical-align: bottom;
}
/* ------------------------------------------ */
/* ------------------------------------------ */
.tb{ display: none !important;}
.sp{ display: none !important;}
.tbsp{ display: none !important;}

/* ------------------------------------------ */
/* ------------------------------------------ */
.section-inner-max{ padding: 25.0rem 0;}
.section-inner{ padding: 20.0rem 0;}
.section-inner-min{ padding: 12.0rem 0;}
.section-inner-min2{ padding: 8.0rem 0;}
.wrap-wide{ max-width: 148.0rem; margin:0 auto; padding-inline: max(4.0rem); box-sizing: border-box;}
.wrap-semi{ max-width: 132.0rem; margin:0 auto; padding-inline: max(4.0rem); box-sizing: border-box;}
.wrap-normal{ max-width: 118.0rem; margin:0 auto; padding-inline: max(4.0rem); box-sizing: border-box;}
.wrap-min{ max-width: 94.0rem; margin:0 auto; padding-inline: max(4.0rem); box-sizing: border-box;}
.bg-color-wht{ background-color: var(--bg-color-wht);}
.bg-color-key{ background-color: var(--bg-color-key);}
.fc-wht{ color: var(--fc-wht);}
.fc-blk{ color: var(--fc-blk);}
.fc-txt{ color: var(--fc-txt);}
.fc-key{ color: var(--fc-key);}
.fc-sub{ color: var(--fc-sub);}
.v-t{ vertical-align: top;}
.v-m{ vertical-align: middle;}
.v-b{ vertical-align: bottom;}
.t-l{ text-align: left;}
.t-c{ text-align: center;}
.t-r{ text-align: right;}
.p-t0{ padding-top: 0;}
.p-b0{ padding-bottom: 0;}
.m-t90{ margin-top: 9.0rem;}
.m-t100{ margin-top: 10.0rem;}
a{ color: var(--fc-txt); transition: 0.5s;}
img{ vertical-align: bottom;}
.txt{ line-height: 2.0em;}
.txt-tall{ line-height: 2.5em;}
h1,h2,h3,h4,h5,h6{ font-weight: unset;}
@media (hover: hover) and (pointer: fine) {
  a:hover{ transition: 0.5s ease-in-out;}
}
:root {
  --bg-color-wht:#fff;
  --bg-color-key: #162C51;
  --fc-wht: #fff;
  --fc-blk: #000;
  --fc-txt: #333;
  --fc-key: #162C51;
  --fc-sub: #999999;
  --fw-400: 400;
  --fw-500: 500;
  --fw-600: 600;
  --t-l: left;
  --t-c: center;
  --t-r: right;
  --border-radius: 1.0rem;
  --fs-12: 1.2rem;
  --fs-16: 1.6rem;
  --fs-18: 1.8rem;
  --fs-20: 2.0rem;
  --fs-24: 2.4rem;
  --fs-28: 2.8rem;
  --fs-30: 3.0rem;
  --fs-50: 5.0rem;
  --fs-70: 7.0rem;
  --mg-5: 0.5rem;
  --mg-10: 1.0rem;
  --mg-15: 1.5rem;
  --mg-20: 2.0rem;
  --mg-25: 2.5rem;
  --mg-30: 3.0rem;
  --mg-40: 4.0rem;
  --mg-50: 5.0rem;
  --mg-60: 6.0rem;
  --mg-70: 7.0rem;
  --mg-80: 8.0rem;
  --mg-90: 9.0rem;
  --mg-100: 10.0rem;
  --mg-200: 20.0rem;
}

@media  only screen and (max-width: 1440px){
  :root { --fs-50: clamp(4.4rem, 3.472vw, 5.0rem);}
}
@media  only screen and (max-width: 1280px){
  .section-inner-max{ padding: 19.531vw 0;}
  .section-inner{ padding: 15.625vw 0;}
  .section-inner-min{ padding: 9.375vw 0;}
  .section-inner-min2{ padding: 6.25vw 0;}
  .wrap-wide{ padding: 0 6%;}
  .wrap-semi{ padding: 0 6%;}
  .wrap-normal{ padding: 0 6%;}
  .wrap-min{ padding: 0 12%;}
  .pc{ display: none !important;}
  .tb{ display: block !important;}
  .sp{ display: none !important;}
  .pctb{ display: block !important;}
  .tbsp{ display: block !important;}
  .p-t0{ padding-top: 0;}
  .p-b0{ padding-bottom: 0;}
  .m-t90{ margin-top: 7.031vw;}
  .m-t100{ margin-top: 7.813vw;}
  :root {
    --fs-12: 0.938vw;
    --fs-16: 1.25vw;
    --fs-18: 1.406vw;
    --fs-20: 1.563vw;
    --fs-24: 1.875vw;
    --fs-28: 2.188vw;
    --fs-30: 2.344vw;
    --fs-50: 3.906vw;
    --fs-70: 5.469vw;
    --mg-5: 0.391vw;
    --mg-10: 0.781vw;
    --mg-15: 1.172vw;
    --mg-20: 1.563vw;
    --mg-25: 1.953vw;
    --mg-30: 2.344vw;
    --mg-40: 3.125vw;
    --mg-50: 3.906vw;
    --mg-60: 4.688vw;
    --mg-70: 5.469vw;
    --mg-80: 6.25vw;
    --mg-90: 7.031vw;
    --mg-100: 7.813vw;
    --mg-200: 15.625vw;
  }
}
@media screen and (max-width: 768px) {
  * { letter-spacing: 0;}
  body { width: 100%; font-size: 3.2vw;}
  .block{ width: 100%; max-width: 100%;}
  .section-inner-max{ padding: 26.667vw 0;}
  .section-inner{ padding: 26.667vw 0;}
  .section-inner-min{ padding: 20vw 0;}
  .section-inner-min2{ padding: 13.333vw 0;}
  .wrap-wide{ padding: 0 8%;}
  .wrap-semi{ padding: 0 8%;}
  .wrap-normal{ padding: 0 8%;}
  .wrap-min{ padding: 0 12%;}
  .pc{ display: none !important;}
  .tb{ display: none !important;}
  .sp{ display: block !important;}
  .pctb{ display: none !important;}
  .tbsp{ display: block !important;}
  .sp-t-l{ text-align: left;}
  .p-t0{ padding-top: 0;}
  .p-b0{ padding-bottom: 0;}
  .m-t90{ margin-top: 12vw;}
  .m-t100{ margin-top: 13.333vw;}
  :root {
    --border-radius: 1.333vw;
    --fs-12: 2.4vw;
    --fs-14: 2.667vw;
    --fs-16: 2.933vw;
    --fs-18: 3.2vw;
    --fs-20: 3.2vw;
    --fs-24: 3.467vw;
    --fs-28: 4.267vw;
    --fs-30: 4vw;
    --fs-50: 7.333vw;
    --fs-70: 9.333vw;
    --mg-5: 0.667vw;
    --mg-10: 1.333vw;
    --mg-15: 2vw;
    --mg-20: 2.667vw;
    --mg-25: 3.333vw;
    --mg-30: 4vw;
    --mg-40: 5.333vw;
    --mg-50: 6.667vw;
    --mg-60: 8vw;
    --mg-70: 9.333vw;
    --mg-80: 10.667vw;
    --mg-90: 12vw;
    --mg-100: 13.333vw;
    --mg-200: 26.667vw;
  }
}

/*  top mv
--------------------------------------------- */
.top-mv {
	position: relative;
  overflow: hidden;
}
.top-mv-container {
	width: 100%;
	height: auto;
  position: relative;
}
.top-mv-img {
  width: 100%;
  height: 100%;
}
#op-pc svg,
#op-pc image{
  vertical-align: bottom;
}

/*  ttl
---------------------------------------------------  */
.ttl-box-max{
  margin-bottom: var(--mg-40);
}
.ttl-box-semi{
  margin-bottom: var(--mg-40);
}
.ttl-box{
  margin-bottom: var(--mg-25);
}
.ttl-box-min{
  margin-bottom: var(--mg-15);
}
.sub-enttl{
  font-size: var(--fs-18);
  color: var(--fc-sub);
  letter-spacing: 0.05em;
}
.main-ttl .h1-ttl{
  font-size: var(--fs-70);
  color: var(--fc-blk);
  margin-top: var(--mg-20);
  line-height: 1.2em;
}
.main-ttl .h1-ttl.no-top{
  margin-top: 0;
}
.main-ttl .h2-ttl{
  font-size: var(--fs-50);
  margin-top: var(--mg-25);
  line-height: 1.3em;
}
.mid-txt{
  font-size: var(--fs-20);
  font-weight: var(--fw-600);
}
.min-txt{
  font-size: var(--fs-16);
  font-weight: var(--fw-300);
}

/*  ----------------------------------------  */
/*  ----------------------------------------  */

/*  news
--------------------------------------------- */
.news{
  overflow-x: hidden;
  background: linear-gradient(90deg, #fff 0%, #fff 50%, var(--bg-color-key) 50%, var(--bg-color-key) 100%);
}
.news-wrapper{
  max-width: 70.0rem;
  margin-left: auto;
}
.news .section-inner{
  padding: var(--mg-40) 0;
}
.news-container{
  color: var(--fc-wht);
  display: flex;
  align-items: center;
}
.news-ttl{
  font-size: var(--fs-24);
  padding: 0 8.5rem;
}
.news-list{
  padding-left: var(--mg-70);
  border-left: 0.1rem solid var(--bg-color-wht);
}
.list-item,
.list-item a{
  display: flex;
  align-items: flex-start;
  padding: var(--mg-10) 0;
  text-decoration: none !important;
  font-size: var(--fs-16);
  max-width: 67.0rem;
}
@media (hover: hover) and (pointer: fine) {
  .list-item a:hover{
    opacity: .7;
  }
}
.list-item:first-child{
  padding-top: var(--mg-5);
}
.list-item:last-child{
  padding-bottom: var(--mg-5);
}
.list-time{
  color: var(--fc-sub);
  font-weight: var(--fw-600);
  min-width: var(--mg-80);
  margin-right: var(--mg-30);
  display: inline-block;
  white-space: nowrap;
}
.list-ttl{
  position: relative;
  line-height: 1.6em;
  color: var(--fc-wht);
}
@media  only screen and (max-width: 1280px){
  .news-wrapper{
    max-width: 68.359vw;
  }
  .news-ttl{
    padding: 0 6.641vw;
  }
  .list-item{
    max-width: 65.43vw;
  }
}
@media screen and (max-width: 768px) {
  .news{
    background: var(--bg-color-key);
  }
  .news .section-inner{
    padding: var(--mg-100) 0;
  }
  .news-wrapper{
    max-width: 100%;
  }
  .news-container{
    flex-wrap: wrap;
    gap: var(--mg-50);
  }
  .news-ttl{
    padding: 0 0 0 4%;
    font-size: 4.8vw;
    display: flex;
    align-items: center;
  }
  .news-ttl span{
    margin-right: var(--mg-30);
    letter-spacing: 0.05em;
  }
  .news-ttl:after{
    content: "";
    width: var(--mg-100);
    height: 0.1rem;
    border-top: 0.1rem solid var(--fc-wht);
  }
  .news-list{
    width: 92%;
    margin-inline: auto;
    padding-left: 0;
    border-left: none;
  }
  .list-item{
    padding: var(--mg-10) 0;
  }
  .list-time{
    margin-right: var(--mg-50);
  }
}

/*  concept
--------------------------------------------- */
.concept-bgimg{
  position: relative;
}
.concept-bgimg .section-inner-max{
  padding-top: var(--mg-100);
}
.concept-img{
  position: absolute;
  bottom: -0.1rem;
  left: 50%;
  transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  z-index: -1;
}
.concept-img img{
  vertical-align: bottom;
  max-width: 70.0rem;
}
.concept-ttl{
  margin-bottom: var(--mg-40);
  max-width: 110.0rem;
  margin-inline: auto;
}
.concept-subttl {
  font-size: var(--fs-28);
  color: var(--fc-blk);
  display: flex;
  align-items: center;
}
.concept-subttl span {
  margin-right: var(--mg-15);
  letter-spacing: 0.05em;
}
.concept-subttl:after{
  content: "";
  width: var(--mg-80);
  height: 0.1rem;
  border-top: 0.1rem solid var(--fc-blk);
}
.concept-txt{
  max-width: 100vw;
  width: 55.0rem;
  margin-left: auto;
}
.concept-txt .mid-txt{
  font-size: var(--fs-24);
}
@media  only screen and (max-width: 1440px){
  .concept-img img{
    max-width: 48.611vw;
  }
  .concept-txt{
    width: 34.18vw;
  }
}
@media  only screen and (max-width: 1280px){
  .concept-img img{
    max-width: 50.781vw;
  }
  .concept-ttl{
    max-width: 107.422vw;
  }
  .concept-txt{
    width: 34.18vw;
  }
}
@media screen and (max-width: 768px) {
  .concept-bgimg .section-inner-max{
    padding-top: 20vw;
    padding-bottom: 0;
  }
  .concept-ttl{
    margin-bottom: var(--mg-100);
  }
  .concept-subttl{
    font-size: var(--fs-28);
  }
  .concept-subttl span {
    margin-right: var(--mg-30);
  }
  .concept-subttl:after{
    width: var(--mg-90);
  }
  .concept-txt{
    width: 73.333vw;
  }
  .concept-img{
    position: relative;
    margin-top: var(--mg-60);
  }
  .concept-img img{
    max-width: 100%;
  }
}

/*  identity
--------------------------------------------- */
.identity .wrap-semi{
  max-width: 138.0rem;
}
.identity-item{
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 8.0rem;
}
.identity-img{
  width: 46.0rem;
}
.identity-img img{
  width: 100%;
}
.identity-logo{
  background: var(--bg-color-wht);
  padding: 5.7rem 2.0rem;
}
.identity-img h3{
  margin-top: var(--mg-30);
  color: var(--fc-wht);
  font-size: var(--fs-30);
}
.identity-txt{
  width: 63.0rem;
  color: var(--fc-wht);
}

@media  only screen and (max-width: 1280px){
  .identity-item{
    gap: 5.859vw;
  }
  .identity-img{
    width: 48.828vw;
  }
  .identity-logo{
    padding: 5.566vw 1.953vw;
  }
  .identity-txt{
    width: 61.523vw;
  }
}
@media screen and (max-width: 768px) {
  .identity-item{
    flex-wrap: wrap;
    gap: 13.333vw;
  }
  .identity-img{
    width: 61.333vw;
    margin-inline: auto;
  }
  .identity-logo{
    padding: 7.467vw 2vw;
  }
  .identity-txt{
    width: 100%;
  }
}

/*  collection
--------------------------------------------- */
.collection-item{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 11.0rem;
}
.collection-img{
  width: 61.0rem;
  margin-left: calc(50% - 50vw);
}
.collection-img img{
  width: 100%;
}
.collection-txt{
  width: 72.0rem;
}
.collection-01-img02{
  width: 40.0rem;
  text-align: right;
  margin-left: auto;
}
@media  only screen and (max-width: 1440px){
  .collection-item{
    gap: 7.639vw;  
  } 
  .collection-01-img02{
    width: 27.778vw;
  }
}
@media  only screen and (max-width: 1280px){
  .collection-item{
    gap: 7.813vw;
  }
  .collection-img{
    width: 53.711vw;
  }
  .collection-txt{
    width: 70.313vw;
  }
  .collection-01-img02{
    width: 24.414vw;
  }
}
@media screen and (max-width: 768px) {
  .collection-item{
    flex-wrap: wrap;
    gap: 13.333vw;
  } 
  .collection-img{
    width: 97%;
    margin-inline: auto;
  }
  .collection-txt{
    width: 100%;
  }
  .collection-01 .collection-img{
    margin-left: calc(50% - 50vw);
  }
  .collection-01-img02{
    width: 53.333vw;
  }
}

/*  lookbook
--------------------------------------------- */
.lookbook{
  width: 100%;
}
.lookbook-img img{
  width: 100%;
}
@media screen and (min-width: 769px) {
  .lookbook-img-flex{
    display: flex;
    width: 100%;
  }
  .lookbook-img-left{
    width: 45%;
  }
  .lookbook-img-right{
    width: 55%;
  }
}

/*  banner link
--------------------------------------------- */
.list-banner{
  display: flex;
  gap: var(--mg-20);
}
.list-banner .list-banner-item{
  flex: 1;
}
.list-banner .list-banner-item a{
  display: block;
  border: 0.1rem solid var(--fc-txt);
  border-radius: var(--border-radius);
  padding: var(--mg-25) 0;
  text-align: var(--t-c);
  position: relative;
}
.list-banner .list-banner-item a::after{
  position: absolute;
  content: "";
  top: 50%;
  right: var(--mg-40);
  transform:  translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
  width: 2.0rem;
  height: 0.7rem;
  background: url(../../assets/img/common/icon_arrow.svg) no-repeat center / contain;
}
@media (hover: hover) and (pointer: fine) {
  .list-banner .list-banner-item a:hover::after{ 
    animation: arrowSlide 0.5s ease-in-out forwards; 
  }
}
@keyframes arrowSlide { 
  0% { transform: translate(0, -50%); opacity: 1; }
  49% { transform: translate(100%, -50%); opacity: 0; }
  50% { transform: translate(-100%, -50%); opacity: 0; }
  100% { transform: translate(0, -50%); opacity: 1; } 
}
.list-banner .list-banner-item a img{
  width: 21.9rem;
}

@media  only screen and (max-width: 1280px){
  .list-banner .list-banner-item a img{
    width: 17.188vw;
  }
  .list-banner .list-banner-item a::after{
    width: 1.953vw;
    height: 0.684vw;
  }
}
@media screen and (max-width: 768px) {
  .list-banner{
    display: block;
  }
  .list-banner .list-banner-item{
    width: 66.667vw;
    margin-inline: auto;
  }
  .list-banner .list-banner-item:not(:first-child){
    margin-top: 5.333vw;
  }
  .list-banner .list-banner-item a{
    padding: 4.267vw 0;
  }
  .list-banner .list-banner-item a img{
    max-width: 52%;
    width: 52%;
  }
  .list-banner .list-banner-item a .hover-arrow-img {
    right: 6.4vw;
    width: 5.867vw;
    height: 5.867vw;
  }
  .list-banner .list-banner-item a::after{
    right: 5.867vw;
    width: 3.2vw;
    height: 1.2vw;
  }
}

/*  footer
--------------------------------------------- */
.footer-copy{
  color: var(--fc-txt);
  font-size: var(--fs-12);
  text-align: var(--t-c);
  letter-spacing: 0.05em;
}

/*  ----------------------------------------  */
/*  ----------------------------------------  */
/*  scl ｜下から上、右から、左から出現
--------------------------------------------- */
.js-scl {
    opacity: 0;
    transform: translate(0, 0);
    transition: all 1.5s;
}
.js-scl.js-scl-left {
    transform: translate(-30px, 0);
}
.js-scl.js-scl-left-long {
    transform: translate(-160px, 0);
}
.js-scl.js-scl-right {
    transform: translate(30px, 0);
}
.js-scl.js-scl-up {
    transform: translate(0, 30px);
}
.js-scl.js-scl-down {
    transform: translate(0, -30px);
}
.js-scl.js-scl-normal {
    transform: translate(0, 0);
}
.js-scl.scrollin {
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}
.time02 {transition-delay: .5s;}
.time03 {transition-delay: 1.0s;}
.time04 {transition-delay: 1.5s;}
.time05 {transition-delay: 2.0s;}
.time06 {transition-delay: 2.5s;}

/*  下から上に1文字ずつ遅延して現れるアニメーション
--------------------------------------------- */
.txt-anim {
  overflow: hidden;
  /* text-transform: uppercase; */
}
.char {
  display: inline-block;
  transform: translateY(110%);
  transition: transform 1s cubic-bezier(0.77, 0, 0.175, 1);
  transition-delay: calc(0.04s * var(--char-index));
}
.txt-anim.is-active .char {
  transform: translateY(0);
}
.whitespace {
  display: inline-block;
  width: 0.5em; /* スペースの幅を調整 */
}

/*  下から徐々に拡大して現れるアニメーション
--------------------------------------------- */
.scroll-image img {
  width: 100%;
  transform: scale(0.85) rotate(0.001deg);
  clip-path: inset(4.4%);
  transition: transform 0.1s ease-out, clip-path 0.1s ease-out;
  will-change: transform, clip-path;
}

/*  ----------------------------------------  */
/*  ----------------------------------------  */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}