@charset "UTF-8";
/*
//////////////////////////////////////////////////////////////////////////////////////////////
- setting default -
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.LB2604013CROCS * {
  box-sizing: border-box;
}
.LB2604013CROCS {
  --color-white: #fff;
  --color-black: #000;
  --color-text: #38383b;
  --color-pink: #efcee6;
  --color-gray: #e9e8ed;
  --color-bg-pink: rgba(239, 206, 230, 0.2);
  --color-bg-gray: rgba(233, 232, 237, 0.2);
  /* --font-yu: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; */
  --font-hiragino: "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", Osaka, sans-serif;
  --font-futura: "futura-pt", sans-serif;
  --font-ja: var(--font-hiragino);
  --font-en: var(--font-futura);
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  font-feature-settings: "palt";
  overflow: clip;
}
.LB2604013CROCS {
  --pc-width: 1400;
  --sp-width: 750;
  --pc-artboard-width: 420;
  --sp-artboard-width: 750;
}
.LB2604013CROCS img,
.LB2604013CROCS picture,
.LB2604013CROCS video {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
/* @media (min-width: 1400px) {
  .LB2604013CROCS {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: 1px;
  }
}
@media (min-width: 768px) and (max-width: 1400px) {
  .LB2604013CROCS {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: calc(100vw / var(--pc-width));
  }
} */
@media (min-width: 768px) {
  .LB2604013CROCS {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: calc(100vw / var(--pc-width));
  }
}
@media (max-width: 767px) {
  .LB2604013CROCS {
    --ratio: 1;
    --variable: calc(100vw / var(--sp-width));
  }
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
- setting others -
//////////////////////////////////////////////////////////////////////////////////////////////
*/
@media screen and (min-width: 768px) {
  .LB2604013CROCS .hidden-desktop {
    display: none !important;
  }
  .LB2604013CROCS {
    display: grid;
    grid-template-columns: 1fr calc(420*100vw/1400) 1fr;
    background-color: var(--color-gray);
  }
}
@media screen and (max-width: 767px) {
  .LB2604013CROCS .hidden-mobile {
    display: none !important;
  }
  .main-area {
    overflow: clip;
  }
  .main-area .main-inner {
    width: 100%;
  }
}
.LB2604013CROCS .common-position {
  position: absolute;
}
.LB2604013CROCS .common-grid {
  display: grid;
  gap: var(--row, 0) var(--column, 0);
}
.LB2604013CROCS .common-flex_row {
  display: flex;
  flex-direction: row;
  gap: var(--row, 0) var(--column, 0);
}
.LB2604013CROCS .common-flex_row_reverse {
  display: flex;
  flex-direction: row-reverse;
  gap: var(--row, 0) var(--column, 0);
}
.LB2604013CROCS .common-flex_column {
  display: flex;
  flex-direction: column;
  gap: var(--row, 0) var(--column, 0);
}
.LB2604013CROCS .common-flex_column_reverse {
  display: flex;
  flex-direction: column-reverse;
  gap: var(--row, 0) var(--column, 0);
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
- fixed_container -
//////////////////////////////////////////////////////////////////////////////////////////////
*/
@media screen and (min-width: 768px) {
  .LB2604013CROCS .fixed_container {
    position: sticky;
    top: calc(50*100vw/1400);
    height: 100vh;
  }
  .LB2604013CROCS .fixed_container-left {
    margin-top: calc(50*100vw/1400);
    margin-left: calc(50*100vw/1400);
  }
  .LB2604013CROCS .fixed_text {
    --row: calc(38*100vw/1400);
  }
  .LB2604013CROCS .fixed_ttl {
    width: calc(300*100vw/1400);
  }
  .LB2604013CROCS .fixed_lead {
    font-size: calc(14*100vw/1400);
    line-height: 1.8;
    letter-spacing: .04em;
    font-weight: var(--font-weight-light);
    font-family: var(--font-ja);
    color: var(--color-text);
    text-align: left;
  }
  .LB2604013CROCS .fixed_btn {
    position: absolute;
    bottom: calc(170*100vw/1400);
    right: calc(30*100vw/1400);
    width: calc(260*100vw/1400);
  }
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
- scroll_container -
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.LB2604013CROCS .scroll_container {
  padding-bottom: calc(200*var(--variable)*var(--ratio));
  background-color: var(--color-white);
}
/* hero */
.LB2604013CROCS .scroll_container .hero_content {
  grid-template-columns: 1fr calc(290*var(--variable)*var(--ratio));
  grid-template-rows: repeat(2, calc(305*var(--variable)*var(--ratio)));
}
.LB2604013CROCS .scroll_container .hero_image-model {
  grid-column: 1;
  grid-row: 1;
}
.LB2604013CROCS .scroll_container .hero_image-black {
  grid-column: 2;
  grid-row: 1;
}
.LB2604013CROCS .scroll_container .hero_image-pink {
  grid-column: 2;
  grid-row: 2;
}
.LB2604013CROCS .scroll_container .hero_text {
  margin-top: calc(120*var(--variable)*var(--ratio));
  --row: calc(52*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .hero_ttl {
  width: calc(666*var(--variable)*var(--ratio));
  margin: 0 auto;
}
.LB2604013CROCS .scroll_container .hero_lead {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  font-size: calc(25*var(--variable)*var(--ratio));
  line-height: 1.75;
  letter-spacing: .1em;
  font-weight: var(--font-weight-light);
  font-family: var(--font-ja);
  color: var(--color-text);
  text-align: center;
  white-space: nowrap;
}
.LB2604013CROCS .scroll_container .hero_information_date {
  margin-top: calc(110*var(--variable)*var(--ratio));
}

/* product */
.LB2604013CROCS .is-pink {
  background-color: var(--color-bg-pink);
  color: var(--color-pink);
}
.LB2604013CROCS .is-gray {
  background-color: var(--color-bg-gray);
  color: var(--color-gray);
}
.LB2604013CROCS .scroll_container .product_item {
  padding-top: calc(117*var(--variable)*var(--ratio));
  padding-bottom: calc(120*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .product_text_content {
  position: relative;
  z-index: 10;
  pointer-events: none;
}
.LB2604013CROCS .scroll_container .product_lead {
  position: relative;
  font-size: calc(34*var(--variable)*var(--ratio));
  line-height: 1.75;
  letter-spacing: .1em;
  font-weight: var(--font-weight-light);
  font-family: var(--font-ja);
  color: var(--color-text);
  text-align: center;
}
.LB2604013CROCS .scroll_container .product_lead::before {
  position: absolute;
  content: "";
  height: calc(28*var(--variable)*var(--ratio));
  top: calc(0*var(--variable)*var(--ratio));
  left: 50%;
  transform: translateX(-50%);
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 5;
  pointer-events: none;
}
.LB2604013CROCS .scroll_container .product_ttl {
  font-size: calc(110*var(--variable)*var(--ratio));
  line-height: 1.15;
  font-weight: var(--font-weight-semibold);
  font-family: var(--font-en);
}
.LB2604013CROCS .scroll_container .product_price {
  font-size: calc(34*var(--variable)*var(--ratio));
  line-height: 1.2352941176;
  letter-spacing: .06em;
  font-weight: var(--font-weight-semibold);
  font-family: var(--font-en);
  color: var(--color-text);
}
.LB2604013CROCS .scroll_container .product_image_visual {
  position: relative;
  z-index: 2;
  margin-top: calc(85*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .product_model_image {
  background-color: var(--color-white);
}
.LB2604013CROCS .scroll_container .product_detail_image {
  position: absolute;
  width: calc(320*var(--variable)*var(--ratio));
  background-color: var(--color-white);
}
.LB2604013CROCS .scroll_container .product_btn {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(670*var(--variable)*var(--ratio));
  margin: 0 auto;
  padding: calc(50*var(--variable)*var(--ratio)) 0;
  font-size: calc(38*var(--variable)*var(--ratio));
  line-height: 1;
  font-weight: var(--font-weight-semibold);
  font-family: var(--font-en);
  color: var(--color-text);
  text-align: center;
  background-color: var(--color-pink);
}
.LB2604013CROCS .scroll_container .product_btn::before {
  position: absolute;
  content: "";
  width: calc(23*var(--variable)*var(--ratio));;
  height: calc(23*var(--variable)*var(--ratio));;
  border-bottom: 1px solid var(--color-text);
  border-right: 1px solid var(--color-text);
  top: 50%;
  right: calc(45*var(--variable)*var(--ratio));
  transform: translateY(-50%) rotate(-45deg);
  z-index: 2;
  pointer-events: none;
}
/* product_item01 */
.LB2604013CROCS .scroll_container .product_item01 .product_lead::before {
  background-image: url(../img/coment-pink.svg);
  width: calc(540*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .product_item01 .product_ttl {
  margin-top: calc(60*var(--variable)*var(--ratio));
  margin-left: calc(40*var(--variable)*var(--ratio));
  text-align: left;
}
.LB2604013CROCS .scroll_container .product_item01 .product_price {
  margin-top: calc(35*var(--variable)*var(--ratio));
  margin-left: calc(40*var(--variable)*var(--ratio));
  text-align: left;
}
.LB2604013CROCS .scroll_container .product_item01 .product_image_visual {
  margin-top: calc(85*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .product_item01 .product_model_image {
  width: 100%;
}
.LB2604013CROCS .scroll_container .product_item01 .product_detail_image {
  top: calc(-337*var(--variable)*var(--ratio));
  right: calc(40*var(--variable)*var(--ratio));
}
/* product_item02 */
.LB2604013CROCS .scroll_container .product_item02 .product_lead::before {
  background-image: url(../img/coment-gray.svg);
  width: calc(694*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .product_item02 .product_ttl {
  margin-top: calc(60*var(--variable)*var(--ratio));
  margin-right: calc(40*var(--variable)*var(--ratio));
  text-align: right;
}
.LB2604013CROCS .scroll_container .product_item02 .product_price {
  margin-top: calc(35*var(--variable)*var(--ratio));
  margin-right: calc(40*var(--variable)*var(--ratio));
  text-align: right;
}
.LB2604013CROCS .scroll_container .product_item02 .product_image_visual {
  margin-top: calc(217*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .product_item02 .product_model_image {
  width: calc(610*var(--variable)*var(--ratio));
  margin-left: calc(100*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .product_item02 .product_detail_image {
  top: calc(-467*var(--variable)*var(--ratio));
  left: calc(40*var(--variable)*var(--ratio));
}
/*
//////////////////////////////////////////////////////////////////////////////////////////////
- animation -
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.LB2604013CROCS .scroll_container .hero_information_accordion {
  margin-top: calc(117*var(--variable)*var(--ratio));
  margin-bottom: calc(122*var(--variable)*var(--ratio));
  overflow: hidden;
}
.LB2604013CROCS .scroll_container .hero_information_accordion.is-open {
  margin-bottom: calc(112*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .hero_information_accordion-summary {
  --column: calc(30*var(--variable)*var(--ratio));
  align-items: center;
  justify-content: center;
}
.LB2604013CROCS .scroll_container .hero_information_accordion_summary_ttl {
  display: block;
  width: calc(264*var(--variable)*var(--ratio));
}
.LB2604013CROCS .scroll_container .hero_information_accordion_text {
  padding-top: calc(30*var(--variable)*var(--ratio));
  font-size: calc(24*var(--variable)*var(--ratio));
  line-height: 1.75;
  letter-spacing: .1em;
  font-weight: var(--font-weight-light);
  font-family: var(--font-ja);
  color: var(--color-text);
  text-align: center;
}
.LB2604013CROCS .scroll_container summary {
  list-style: none;
  cursor: pointer;
  outline: none;
}
.LB2604013CROCS .scroll_container summary::-webkit-details-marker {
  display: none;
}
.LB2604013CROCS .scroll_container .chevron {
  position: relative;
  width: calc(30*var(--variable)*var(--ratio));
  height: calc(30*var(--variable)*var(--ratio));
  bottom: calc(7*var(--variable)*var(--ratio));
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.LB2604013CROCS .scroll_container .chevron::before {
  content: '';
  width: calc(23*var(--variable)*var(--ratio));
  height: calc(23*var(--variable)*var(--ratio));
  border-bottom: 1px solid var(--color-text);
  border-right: 1px solid var(--color-text);
  transform: rotate(45deg);
  margin-top: 0;
}
.LB2604013CROCS .hero_information_accordion.is-open .chevron {
  transform: rotate(180deg);
  bottom: calc(-7*var(--variable)*var(--ratio));
}
.LB2604013CROCS .hero_information_accordion.is-open .content-inner {
    opacity: 1;
    transform: translateY(0);
}