@charset "UTF-8";

:root {
  --NcCollection-white: #fff;
  --NcCollection-black: #000;
  --NcCollection-ui-gray: #c3c3c3;
  --NcCollection-font: "Roboto", "Noto Sans JP", sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
  min-height: 0;
  background: var(--NcCollection-black);
  overflow: hidden;
  overscroll-behavior: none;
}

body {
  margin: 0;
  color: var(--NcCollection-white);
  font-family: var(--NcCollection-font);
}

.scroll-back-to-top-wrapper,
#to_top_scrollup,
#gotop {
  display: none !important;
}

.NcCollectionPage {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
}

.NcCollection {
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: var(--NcCollection-black);
}

.NcCollectionHero {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: var(--NcCollection-black);
  isolation: isolate;
}

.NcCollectionHeader {
  position: absolute;
  top: 1.875vw;
  left: 1.875vw;
  right: 1.875vw;
  z-index: 40;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  color: var(--NcCollection-white);
  clip-path: inset(0 0 100% 0);
  opacity: 0;
}

.NcCollectionPage.is-opening-playing .NcCollectionHeader,
.NcCollectionPage.is-opening-complete .NcCollectionHeader {
  animation: NcCollectionHeaderReveal 520ms cubic-bezier(0.77, 0, 0.175, 1) 80ms both;
}

.NcCollectionHeader__brand {
  display: block;
  width: 9.875vw;
  height: 1.125vw;
}

.NcCollectionHeader__brand img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.NcCollectionHeader__nav {
  display: flex;
  align-items: center;
  gap: 1.875vw;
  padding-top: 0.125vw;
  font-size: max(10px, 0.813vw);
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

.LatestCm {
  display: inline-flex;
}

.NcCollectionHeader__shop {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 8.125vw;
  height: 1.313vw;
  margin-left: 1.063vw;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 0.125vw;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(7px);
  font-size: max(9px, 0.75vw);
}

.NcCollectionHeader__menu {
  display: none;
}

.NcCollectionPage .Menu {
  display: none;
}

.NcCollectionSlider,
.NcCollectionSlide,
.NcCollectionOpening,
.NcCollectionTransition {
  position: absolute;
  inset: 0;
}

.NcCollectionSlider {
  z-index: 1;
  background: var(--NcCollection-black);
}

.NcCollectionSlide {
  opacity: 0;
  pointer-events: none;
}

.NcCollectionSlide.is-active {
  opacity: 1;
  pointer-events: auto;
}

.NcCollectionSlide picture,
.NcCollectionSlide__image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.NcCollectionSlide__image {
  object-fit: cover;
  object-position: center;
}

.NcCollectionSlide__video {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transition: opacity 240ms ease;
}

.NcCollectionSlide__fallback[hidden] {
  display: none !important;
}

.NcCollectionSlide__fallback {
  z-index: 1;
  opacity: 0;
  transition: opacity 240ms ease;
}

.NcCollectionPage.is-opening-complete .NcCollectionSlide.is-active.is-video-ready:not(.is-video-fallback) .NcCollectionSlide__video,
.NcCollectionPage.is-opening-complete .NcCollectionSlide.is-active.is-video-fallback .NcCollectionSlide__fallback {
  opacity: 1;
}

.NcCollectionSlide picture {
  overflow: hidden;
  transform-origin: center;
}

.NcCollectionPage.is-opening-playing:not(.is-opening-complete) .NcCollectionSlide.is-active picture {
  animation: NcCollectionOpeningFirstSlide 560ms linear var(--NcCollection-opening-out-delay, 3.14s) both;
}

.NcCollectionHero__copy {
  position: absolute;
  top: 50%;
  left: calc(50% + 0.031vw);
  z-index: 12;
  width: 100%;
  height: 3.375vw;
  transform: translate(-50%, -50%);
  transition: opacity 280ms ease;
  pointer-events: none;
}

.NcCollectionPage:not(.is-opening-complete) .NcCollectionHero__copy {
  opacity: 0;
}

.NcCollectionPage.is-opening-playing .NcCollectionHero__copy {
  animation: NcCollectionCopyReveal 2600ms cubic-bezier(0.22, 0.61, 0.36, 1) var(--NcCollection-opening-copy-delay, 3.84s) both;
}

.NcCollectionHero__copy.is-changing {
  transition: none;
}

.NcCollectionPage.is-opening-complete .NcCollectionHero__copy.is-revealing {
  animation: NcCollectionSlideCopyReveal 2600ms cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

.NcCollectionHero__copyImage {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.NcCollectionHero__copyText {
  display: none;
  margin: 0;
  color: var(--NcCollection-white);
  font-family: "Times New Roman", serif;
  font-size: max(28px, 3.375vw);
  line-height: 1;
  text-align: center;
}

.NcCollectionHero__copy.is-text .NcCollectionHero__copyImage {
  display: none;
}

.NcCollectionHero__copy.is-text .NcCollectionHero__copyText {
  display: block;
}

.NcCollectionControls {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.NcCollectionPage.is-opening-complete .NcCollectionControls {
  pointer-events: auto;
}

.NcCollectionControls__button {
  position: absolute;
  top: 46%;
  z-index: 20;
  display: block;
  width: 3.063vw;
  height: 3.063vw;
  min-width: 38px;
  min-height: 38px;
  padding: 0;
  border: 0;
  background: center / contain no-repeat;
  clip-path: inset(0 0 100% 0);
  opacity: 0;
  cursor: pointer;
}

.NcCollectionPage.is-opening-complete .NcCollectionControls__button {
  animation: NcCollectionUiReveal 520ms cubic-bezier(0.77, 0, 0.175, 1) both;
}

.NcCollectionControls__button--prev {
  left: 1.875vw;
  background-image: url("../img/icon-nc-collection-slider-prev.svg");
  transform: rotate(180deg);
}

.NcCollectionControls__button--next {
  right: 1.875vw;
  background-image: url("../img/icon-nc-collection-slider-next.svg");
}

.NcCollectionControls__progress {
  --NcCollection-progress-width: 12.5%;
  --NcCollection-progress-track-width: 76.5vw;
  position: absolute;
  left: 50%;
  bottom: 1.438vw;
  z-index: 21;
  width: var(--NcCollection-progress-track-width);
  height: 1.813vw;
  transform: translateX(-50%);
  opacity: 0;
}

.NcCollectionControls__progress::before,
.NcCollectionControls__progress::after {
  position: absolute;
  top: 1.563vw;
  left: 0;
  height: 1px;
  content: "";
}

.NcCollectionControls__progress::before {
  right: 0;
  background: #d6d6d6;
}

.NcCollectionControls__progress::after {
  z-index: 1;
  width: var(--NcCollection-progress-width);
  height: 0.188vw;
  transform: translateY(-0.063vw);
  background: var(--NcCollection-black);
}

.NcCollectionControls__progressItem {
  position: absolute;
  top: 0;
  left: var(--NcCollection-progress-position, 0%);
  z-index: 2;
  width: 1.25vw;
  margin: 0;
  padding: 0;
  border: 0;
  appearance: none;
  background: transparent;
  color: #d6d6d6;
  cursor: pointer;
  font: inherit;
  font-size: max(10px, 0.875vw);
  line-height: 1;
  text-align: center;
  transform: translateX(-50%);
}

.NcCollectionControls__progressItem:focus-visible {
  outline: 1px solid currentColor;
  outline-offset: 0.313vw;
}

.NcCollectionControls__progress.is-single::before,
.NcCollectionControls__progress.is-single::after {
  display: none;
}

.NcCollectionControls__progressItem:nth-child(2) {
  left: 9.563vw;
}

.NcCollectionControls__progressItem:nth-child(3) {
  left: 19.125vw;
}

.NcCollectionControls__progressItem:nth-child(4) {
  left: 28.688vw;
}

.NcCollectionControls__progressItem:nth-child(5) {
  left: 38.25vw;
}

.NcCollectionControls__progressItem:nth-child(6) {
  left: 47.813vw;
}

.NcCollectionControls__progressItem:nth-child(7) {
  left: 57.375vw;
}

.NcCollectionControls__progressItem:nth-child(8) {
  left: 66.938vw;
}

.NcCollectionControls__progressItem:nth-child(9) {
  left: 76.5vw;
}

.NcCollectionControls__progress .NcCollectionControls__progressItem {
  left: var(--NcCollection-progress-position, 0%);
}

.NcCollectionControls__progressItem:first-child {
  color: var(--NcCollection-black);
}

.NcCollectionControls__progressItem.is-filled {
  color: var(--NcCollection-black);
}

.NcCollectionControls__progressDot {
  position: absolute;
  top: 1.375vw;
  left: 50%;
  width: 0.438vw;
  height: 0.438vw;
  border-radius: 50%;
  transform: translateX(-50%);
  background: #d6d6d6;
}

.NcCollectionControls__progressDot.is-filled {
  background: var(--NcCollection-black);
}

.NcCollectionControls__counter {
  position: absolute;
  left: 1.875vw;
  bottom: 1.625vw;
  z-index: 20;
  display: inline-flex;
  align-items: flex-start;
  width: auto;
  min-width: 2.188vw;
  height: 1.688vw;
  font-family: "Times New Roman", serif;
  line-height: 0.9;
  white-space: nowrap;
  opacity: 0;
}

.NcCollectionPage.is-opening-complete .NcCollectionControls__progress,
.NcCollectionPage.is-opening-complete .NcCollectionControls__counter {
  animation: NcCollectionUiFadeIn 520ms ease both;
}

.NcCollectionControls__current {
  position: static;
  top: auto;
  left: auto;
  display: block;
  font-size: max(24px, 1.875vw);
}

.NcCollectionControls__counter--wide .NcCollectionControls__current {
  min-width: 1em;
}

.NcCollectionControls__total {
  position: static;
  top: auto;
  left: auto;
  display: block;
  margin-top: 0.75vw;
  margin-left: 0.188vw;
  font-size: max(11px, 0.875vw);
}

@media (min-width: 768px) {
  .NcCollectionControls__button,
  .NcCollectionControls__progress,
  .NcCollectionControls__counter {
    mix-blend-mode: difference;
  }

  .NcCollectionControls__progress::after {
    background: #fff;
  }

  .NcCollectionControls__progressItem:first-child,
  .NcCollectionControls__progressItem.is-filled {
    color: #fff;
  }

  .NcCollectionControls__progressDot.is-filled {
    background: #fff;
  }
}

.NcCollectionHero__detail {
  position: absolute;
  bottom: 10.824%;
  left: calc(50% - 0.094vw);
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 12.688vw;
  height: 2.813vw;
  transform: translateX(-50%);
  border-radius: 0.188vw;
  background: #2a2a2a;
  color: #fff;
  font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: max(11px, 0.875vw);
  font-weight: 300;
  letter-spacing: -0.05em;
  opacity: 0;
  transition: opacity 420ms ease;
  pointer-events: none;
}

.NcCollectionPage.is-opening-complete .NcCollectionHero__detail {
  animation: NcCollectionDetailFadeIn 480ms ease 100ms both;
  pointer-events: auto;
}

.NcCollectionCursor {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 30;
  display: none;
  width: 5.625vw;
  height: 5.625vw;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-100vw, -100vh, 0);
  transition: opacity 140ms linear;
  will-change: transform;
}

.NcCollectionCursor::before {
  position: absolute;
  inset: 0;
  background: center / contain no-repeat url("../img/icon-nc-collection-cursor-next.svg");
  content: "";
  transition: transform 120ms ease;
}

.NcCollectionCursor.is-prev::before {
  transform: rotate(180deg);
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .NcCollectionPage.is-opening-complete .NcCollectionCursor {
    display: block;
  }

  .NcCollectionCursor.is-visible {
    opacity: 1;
  }

  .NcCollectionHero.is-cursor-active {
    cursor: none;
  }

  .NcCollectionHero.is-cursor-active a,
  .NcCollectionHero.is-cursor-active button {
    cursor: pointer;
  }
}

.NcCollectionTransition {
  --NcCollection-slide-rise: 2.5vw;
  z-index: 10;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  will-change: opacity, transform;
}

.NcCollectionTransition.is-running {
  animation: NcCollectionSlideFadeUp 760ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.NcCollectionTransition__image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center;
}

.NcCollectionOpening {
  z-index: 25;
  overflow: hidden;
  background: var(--NcCollection-black);
}

.NcCollectionPage.is-opening-playing .NcCollectionOpening {
  animation: NcCollectionOpeningLayerOut 340ms linear var(--NcCollection-opening-out-delay, 3.14s) forwards;
}

.NcCollectionPage.is-opening-complete .NcCollectionOpening {
  display: none;
}

.NcCollectionOpening__brand {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: 13.375vw;
  height: 1.525vw;
  transform: translate(-50%, -50%);
  opacity: 0;
  clip-path: inset(0 0 100% 0);
}

.NcCollectionPage.is-opening-playing .NcCollectionOpening__brand {
  animation:
    NcCollectionOpeningBrandIn 420ms cubic-bezier(0.16, 1, 0.3, 1) 180ms both,
    NcCollectionOpeningBrandOut 340ms cubic-bezier(0.77, 0, 0.175, 1) var(--NcCollection-opening-out-delay, 3.14s) forwards;
}

.NcCollectionOpening__brand img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.NcCollectionOpening__card {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 29.375vw;
  height: 15.606vw;
  overflow: hidden;
  opacity: 0;
  transform: translate(-50%, -50%);
  transform-origin: center;
}

.NcCollectionOpening__card::after {
  content: none;
}

.NcCollectionOpening__card img {
  position: absolute;
  display: block;
  max-width: none;
  height: auto;
}

.NcCollectionOpening__card--t-line img {
  top: -8.073%;
  left: -6.596%;
  width: 113.149%;
}

.NcCollectionOpening__card--gray-studio img {
  top: -31.999%;
  left: -12.5%;
  width: 126.436%;
}

.NcCollectionOpening__card--general img {
  top: -19.765%;
  left: -3.5%;
  width: 105.69%;
}

.NcCollectionOpening__card--shadow-bag img {
  top: -9.606%;
  left: -6.375%;
  width: 111.915%;
}

.NcCollectionOpening__card--poolside img {
  top: -11.509%;
  left: -11.938%;
  width: 122.755%;
}

.NcCollectionOpening__card--custom img {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.NcCollectionPage.is-opening-playing .NcCollectionOpening__card {
  animation:
    NcCollectionOpeningCardFlash 180ms linear var(--NcCollection-opening-delay) both,
    NcCollectionOpeningCardOut 1ms linear var(--NcCollection-opening-out-delay, 3.14s) forwards;
}

.NcCollectionPage.is-opening-playing .NcCollectionOpening__card:last-child {
  animation:
    NcCollectionOpeningCardFlash 360ms linear var(--NcCollection-opening-delay) both,
    NcCollectionOpeningCardOut 1ms linear var(--NcCollection-opening-out-delay, 3.14s) forwards;
}

.NcCollectionPage.is-opening-playing .NcCollectionOpening__card--first {
  animation:
    NcCollectionOpeningFirstCard 560ms cubic-bezier(0.77, 0, 0.175, 1) var(--NcCollection-opening-delay) forwards,
    NcCollectionOpeningCardOut 1ms linear var(--NcCollection-opening-out-delay, 3.14s) forwards;
}

@keyframes NcCollectionOpeningBrandIn {
  0% {
    opacity: 0;
    clip-path: inset(100% 0 0 0);
    transform: translate(-50%, calc(-50% + 0.75vw));
  }

  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
    transform: translate(-50%, -50%);
  }
}

@keyframes NcCollectionOpeningBrandOut {
  0% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
    transform: translate(-50%, -50%);
  }

  100% {
    opacity: 0;
    clip-path: inset(100% 0 0 0);
    transform: translate(-50%, calc(-50% - 0.75vw));
  }
}

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

  0.1% {
    opacity: 1;
  }

  99.9% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes NcCollectionOpeningFirstCard {
  0% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.00213);
  }

  99.9% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes NcCollectionOpeningCardOut {
  to {
    opacity: 0;
  }
}

@keyframes NcCollectionOpeningFirstSlide {
  0% {
    opacity: 1;
    transform: scale(0.29375);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes NcCollectionOpeningLayerOut {
  0%,
  99.9% {
    visibility: visible;
    opacity: 1;
    background: transparent;
  }

  100% {
    visibility: hidden;
    opacity: 1;
    background: transparent;
  }
}

@keyframes NcCollectionHeaderReveal {
  from {
    clip-path: inset(0 0 100% 0);
    opacity: 0;
    transform: translateY(-0.75vw);
  }

  to {
    clip-path: inset(0 0 0 0);
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes NcCollectionCopyReveal {
  0% {
    opacity: 0;
    transform: translate(-50%, calc(-50% + 0.72vw));
    -webkit-mask-image: linear-gradient(135deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.58) 60%, transparent 74%);
    mask-image: linear-gradient(135deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.58) 60%, transparent 74%);
    -webkit-mask-size: 240% 240%;
    mask-size: 240% 240%;
    -webkit-mask-position: 100% 100%;
    mask-position: 100% 100%;
  }

  12% {
    opacity: 0.28;
    transform: translate(-50%, calc(-50% + 0.38vw));
    -webkit-mask-position: 86% 86%;
    mask-position: 86% 86%;
  }

  32% {
    opacity: 0.84;
    transform: translate(-50%, calc(-50% + 0.08vw));
    -webkit-mask-position: 44% 44%;
    mask-position: 44% 44%;
  }

  100% {
    opacity: 1;
    transform: translate(-50%, -50%);
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
  }
}

@keyframes NcCollectionSlideCopyReveal {
  0% {
    opacity: 0;
    transform: translate(-50%, calc(-50% + 0.72vw));
    -webkit-mask-image: linear-gradient(135deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.58) 60%, transparent 74%);
    mask-image: linear-gradient(135deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.58) 60%, transparent 74%);
    -webkit-mask-size: 240% 240%;
    mask-size: 240% 240%;
    -webkit-mask-position: 100% 100%;
    mask-position: 100% 100%;
  }

  12% {
    opacity: 0.28;
    transform: translate(-50%, calc(-50% + 0.38vw));
    -webkit-mask-position: 86% 86%;
    mask-position: 86% 86%;
  }

  32% {
    opacity: 0.84;
    transform: translate(-50%, calc(-50% + 0.08vw));
    -webkit-mask-position: 44% 44%;
    mask-position: 44% 44%;
  }

  100% {
    opacity: 1;
    transform: translate(-50%, -50%);
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
  }
}

@keyframes NcCollectionUiFadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes NcCollectionUiReveal {
  from {
    clip-path: inset(0 0 100% 0);
    opacity: 1;
  }

  to {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}

@keyframes NcCollectionDetailFadeIn {
  from {
    opacity: 0;
    transform: translateX(-50%);
  }

  to {
    opacity: 1;
    transform: translateX(-50%);
  }
}

@keyframes NcCollectionSlideFadeUp {
  from {
    opacity: 0;
    transform: translate3d(0, var(--NcCollection-slide-rise), 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (max-width: 767px) {
  .NcCollectionHero {
    height: 100%;
    min-height: 0;
  }

  .NcCollectionHeader {
    top: 4.8vw;
    left: 5.6vw;
    right: 5.333vw;
  }

  .NcCollectionHeader__brand {
    width: 30.43vw;
    height: 3.467vw;
  }

  .NcCollectionHeader__nav {
    display: none;
  }

  .NcCollectionHero__copy {
    width: 56.267vw;
    height: 10.8vw;
  }

  .NcCollectionControls {
    inset: 0;
  }

  .NcCollectionControls__button {
    top: auto;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 6.4vw);
    width: 13.067vw;
    height: 13.067vw;
  }

  .NcCollectionControls__button--prev {
    left: 5.333vw;
  }

  .NcCollectionControls__button--next {
    right: 5.333vw;
  }

  .NcCollectionControls__button::before {
    width: 2.133vw;
    height: 2.133vw;
  }

  .NcCollectionControls__progress {
    left: 31.2vw;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 11.333vw);
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    width: 37.6vw;
    height: 1.867vw;
    border: 0;
  }

  .NcCollectionControls__progress::before,
  .NcCollectionControls__progress::after {
    display: none;
  }

  .NcCollectionControls__progressItem {
    position: static;
    width: auto;
    font-size: 0;
    text-align: initial;
    transform: none;
  }

  .NcCollectionControls__progressItem:nth-child(n + 6) {
    display: none;
  }

  .NcCollectionControls__progressDot {
    position: static;
    width: 1.867vw;
    height: 1.867vw;
    transform: none;
  }

  .NcCollectionControls__counter,
  .NcCollectionHero__detail {
    display: none;
  }

  .NcCollectionOpening__brand {
    width: 38.133vw;
    height: 4.347vw;
  }

  .NcCollectionOpening__card {
    width: 78.4vw;
    height: 41.6vw;
  }

  @keyframes NcCollectionOpeningFirstSlide {
    0% {
      opacity: 1;
      transform: scale(0.784);
    }

    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
}

@media (max-width: 767px) {
  .NcCollectionHero::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    height: 23.988%;
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.62) 100%);
    content: "";
    pointer-events: none;
  }

  .NcCollectionPage.is-sp-opening-playing .NcCollectionHeader {
    clip-path: none;
    opacity: 1;
  }

  .NcCollectionControls {
    z-index: auto;
  }

  .NcCollectionHeader__menu {
    position: fixed;
    top: 4.8vw;
    right: 5.333vw;
    z-index: 90;
    display: block;
    width: 4.8vw;
    height: 3.733vw;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    mix-blend-mode: difference;
    isolation: auto;
    pointer-events: auto;
  }

  .NcCollectionHeader__menu:hover,
  .NcCollectionHeader__menu:focus {
    background: transparent !important;
    box-shadow: none;
  }

  .NcCollectionHeader__menu span {
    position: absolute;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background: #fff;
  }

  .NcCollectionHeader__menu span:nth-child(1) {
    top: 0;
  }

  .NcCollectionHeader__menu span:nth-child(2) {
    top: 1.867vw;
  }

  .NcCollectionHeader__menu span:nth-child(3) {
    top: 3.733vw;
  }

  .NcCollectionHero__copy {
    top: 50%;
    width: 52.267vw;
  }

  .NcCollectionHero__copyText {
    font-size: max(28px, 10.8vw);
  }

  .NcCollectionPage.is-sp-opening-playing .NcCollectionHero__copy {
    animation: NcCollectionSpCopyFadeIn 720ms cubic-bezier(0.19, 1, 0.22, 1) 1200ms both;
  }

  .NcCollectionPage.is-opening-complete .NcCollectionHero__copy.is-changing {
    transition: opacity 280ms ease;
  }

  .NcCollectionPage.is-opening-complete .NcCollectionHero__copy.is-revealing {
    animation: NcCollectionSpCopyFadeIn 720ms cubic-bezier(0.19, 1, 0.22, 1) both;
  }

  .NcCollectionControls__button {
    top: 43.178%;
    bottom: auto;
    min-width: 0;
    min-height: 0;
    background-image: url("../img/icon-nc-collection-slider-sp.svg");
    mix-blend-mode: difference;
    z-index: 20;
  }

  .NcCollectionControls__button--prev {
    left: 0;
  }

  .NcCollectionControls__button--next {
    right: 0;
  }

  .NcCollectionControls__progress {
    --NcCollection-progress-sp-item-width: 6.4vw;
    left: 0;
    bottom: 2.399%;
    display: flex;
    justify-content: center;
    width: 100%;
    height: 6.4vw;
    transform: none;
    pointer-events: auto;
  }

  .NcCollectionPage.is-opening-complete .NcCollectionControls__progress {
    opacity: 1;
    animation: none;
  }

  .NcCollectionControls__progressItem {
    position: relative;
    left: auto;
    display: block;
    flex: 0 0 var(--NcCollection-progress-sp-item-width);
    width: var(--NcCollection-progress-sp-item-width);
    height: 6.4vw;
    color: #a9a9a9;
    font-size: max(9px, 2.667vw);
    line-height: 1;
    text-align: center;
    z-index: auto;
  }

  .NcCollectionControls__progress .NcCollectionControls__progressItem {
    left: auto;
  }

  .NcCollectionControls__progressItem:first-child,
  .NcCollectionControls__progressItem.is-filled {
    color: #a9a9a9;
  }

  .NcCollectionControls__progressLabel {
    position: relative;
    z-index: 20;
    display: block;
  }

  .NcCollectionControls__progressItem:nth-child(n + 6) {
    display: block;
  }

  .NcCollectionControls__progressDot {
    position: absolute;
    top: 4.267vw;
    left: 50%;
    width: 1.067vw;
    height: 1.067vw;
    transform: translateX(-50%);
    background: #d6d6d6;
    mix-blend-mode: difference;
    z-index: 20;
  }

  .NcCollectionControls__progressDot.is-filled {
    background: #d6d6d6;
  }

  .NcCollectionControls__counter {
    position: absolute;
    left: 5.333vw;
    bottom: 2.399%;
    display: inline-flex;
    width: auto;
    min-width: 8.267vw;
    height: 6.667vw;
    z-index: 20;
    pointer-events: none;
  }

  .NcCollectionPage.is-opening-complete .NcCollectionControls__counter {
    opacity: 1;
    animation: none;
  }

  .NcCollectionControls__current {
    font-size: max(24px, 8vw);
  }

  .NcCollectionControls__total {
    margin-top: 3.2vw;
    margin-left: 0.8vw;
    font-size: max(11px, 3.733vw);
  }

  .NcCollectionPage .Menu {
    --Menu-content-height: 176vw;
    position: fixed;
    inset: 0;
    z-index: 100;
    display: block;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--NcCollection-white);
    color: var(--NcCollection-black);
    opacity: 0;
    pointer-events: none;
    transition: opacity 240ms ease;
    overscroll-behavior: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .NcCollectionPage .Menu::-webkit-scrollbar {
    display: none;
  }

  .NcCollectionPage .Menu::after {
    display: block;
    width: 1px;
    height: var(--Menu-content-height);
    content: "";
    pointer-events: none;
  }

  .NcCollectionPage .Menu.is-open {
    opacity: 1;
    pointer-events: auto;
  }

  .NcCollectionPage.is-menu-open {
    overflow: hidden;
  }

  .NcCollectionPage .Menu__header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 13.333vw;
  }

  .NcCollectionPage .Menu__logo {
    position: absolute;
    top: 4.8vw;
    left: 5.6vw;
    width: 30.43vw;
    height: 3.467vw;
    object-fit: contain;
    filter: invert(1);
  }

  .NcCollectionPage .Menu__close {
    position: absolute;
    top: 4.8vw;
    right: 5.333vw;
    width: 4.8vw;
    height: 3.733vw;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .NcCollectionPage .Menu__close:hover,
  .NcCollectionPage .Menu__close:focus {
    background: transparent !important;
    box-shadow: none;
  }

  .NcCollectionPage .Menu__close span {
    position: absolute;
    top: 1.867vw;
    left: 0;
    width: 4.8vw;
    height: 1px;
    background: var(--NcCollection-black);
    transform-origin: center;
  }

  .NcCollectionPage .Menu__close span:nth-child(1) {
    transform: rotate(45deg);
  }

  .NcCollectionPage .Menu__close span:nth-child(2) {
    transform: rotate(-45deg);
  }

  .NcCollectionPage .Menu__nav {
    position: absolute;
    top: 40vw;
    left: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5.333vw;
    transform: translateX(-50%);
    font-family: var(--NcCollection-font);
    font-size: max(12px, 3.733vw);
    line-height: 1;
    white-space: nowrap;
  }

  .NcCollectionPage .Menu__navLink,
  .NcCollectionPage .Menu__navLink:visited,
  .NcCollectionPage .Menu__navLink:hover,
  .NcCollectionPage .Menu__navLink:active,
  .NcCollectionPage .Menu__navLink:focus {
    color: var(--NcCollection-black) !important;
  }

  .NcCollectionPage .Menu__visual {
    position: absolute;
    top: 117.347vw;
    left: 0;
    width: 100%;
    height: 34.4vw;
  }

  .NcCollectionPage .Menu__photo {
    position: absolute;
    top: 3.987vw;
    left: 43.825vw;
    width: 43.108vw;
    height: 30.4vw;
    overflow: hidden;
  }

  .NcCollectionPage .Menu__photo::before {
    position: absolute;
    top: -3.987vw;
    left: -1.246vw;
    width: 44.393vw;
    height: 78.921vw;
    background: url("../img/photo-menu-legacy.webp") center / cover no-repeat;
    content: "";
  }

  .NcCollectionPage .Menu__copy {
    position: absolute;
    top: 8.8vw;
    left: 13.067vw;
    z-index: 1;
    margin: 0;
    color: var(--NcCollection-black);
    font-family: "Times New Roman", Times, serif;
    font-size: max(18px, 5.6vw);
    font-weight: 400;
    line-height: 0.9;
    white-space: nowrap;
  }

  .NcCollectionPage .Menu__copy span {
    display: block;
  }

  .NcCollectionPage .Menu__buttons {
    position: absolute;
    top: max(158.4vw, calc(100dvh - 21.333vw));
    right: 2.667vw;
    left: 2.667vw;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.4vw;
  }

  .NcCollectionPage .Menu__button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 10.667vw;
    border-radius: 0.533vw;
    color: var(--NcCollection-white);
    font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
    font-size: max(10px, 2.933vw);
    font-weight: 300;
    letter-spacing: -0.147vw;
    line-height: 1;
  }

  .NcCollectionPage .Menu__button,
  .NcCollectionPage .Menu__button:visited,
  .NcCollectionPage .Menu__button:hover,
  .NcCollectionPage .Menu__button:active,
  .NcCollectionPage .Menu__button:focus {
    color: var(--NcCollection-white) !important;
  }

  .NcCollectionPage .Menu__button--shop {
    background: #b19975;
  }

  .NcCollectionPage .Menu__button--collection {
    background: #2a2a2a;
  }

  .NcCollectionHero__detail {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: block;
    width: auto;
    height: auto;
    transform: none;
    border-radius: 0;
    background: transparent;
    color: transparent;
    font-size: 0;
    letter-spacing: 0;
    opacity: 1;
    animation: none;
    pointer-events: none;
  }

  .NcCollectionPage.is-opening-complete .NcCollectionHero__detail {
    animation: none;
    pointer-events: auto;
  }

  .NcCollectionOpening__brand,
  .NcCollectionOpening__card {
    display: none;
  }

  .NcCollectionPage.is-sp-opening-playing .NcCollectionOpening {
    animation: NcCollectionSpCurtainOut 1200ms cubic-bezier(0.72, 0, 0.22, 1) both;
  }

  .NcCollectionTransition {
    --NcCollection-slide-rise: 5.333vw;
  }
}

@keyframes NcCollectionSpCurtainOut {
  0%,
  75% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-100%);
  }
}

@keyframes NcCollectionSpCopyFadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .NcCollectionHeader,
  .NcCollectionControls,
  .NcCollectionControls__button,
  .NcCollectionControls__progress,
  .NcCollectionControls__counter,
  .NcCollectionHero__detail,
  .NcCollectionHero__copy {
    clip-path: none;
    opacity: 1;
    animation: none !important;
  }

  .NcCollectionCursor,
  .NcCollectionCursor::before {
    transition: none;
  }
}

.NcCollectionDetailDocument {
  position: static;
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: auto;
  background: #000;
}

.NcCollectionDetailPage {
  position: static;
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow: visible;
  overscroll-behavior: auto;
  background: #000;
  color: #1c1c1c;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-weight: 300;
}

.NcCollectionDetailPage::before {
  position: fixed;
  inset: 0;
  z-index: 39;
  background: #000;
  content: "";
  pointer-events: none;
  animation: NcCollectionDetailBlackout 1200ms cubic-bezier(0.72, 0, 0.22, 1) both;
}

.NcCollectionDetailPage img {
  display: block;
  max-width: 100%;
}

.NcCollectionDetailHeader {
  position: absolute;
  top: 1.875vw;
  left: 1.875vw;
  right: 1.875vw;
  z-index: 40;
  color: #fff;
  clip-path: none;
  opacity: 1;
}

.NcCollectionDetail {
  position: relative;
  width: 100%;
  height: 265.25vw;
  overflow: clip;
  background: #fff;
}

.NcCollectionDetail__article {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: 100%;
}

.NcCollectionDetailHeroBackdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.NcCollectionDetailHeroBackdrop__sticky {
  position: sticky;
  top: 0;
  width: 100%;
  height: 53.125vw;
  overflow: hidden;
  background: #000;
}

.NcCollectionDetailHero {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 53.125vw;
  overflow: hidden;
  background: transparent;
}

.NcCollectionDetailHero__media {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  overflow: hidden;
  animation: NcCollectionDetailHeroImageIn 760ms cubic-bezier(0.16, 1, 0.3, 1) 760ms both;
}

.NcCollectionDetailHero__media img {
  position: absolute;
  top: -17vw;
  left: -12.5vw;
  width: 126.438vw;
  max-width: none;
  height: 89.625vw;
  object-fit: fill;
}

.NcCollectionDetailHero__surface {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: transparent;
  pointer-events: none;
}

.NcCollectionDetailHero__title {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  margin: 0;
  transform: translate(-50%, -50%);
  color: #fff;
  font-family: "Times New Roman", serif;
  font-size: max(36px, 3.75vw);
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

.NcCollectionDetailIntro,
.NcCollectionDetailLook,
.NcCollectionDetailMovie,
.NcCollectionDetailFeature {
  z-index: 2;
}

.NcCollectionDetailNavWrap {
  position: absolute;
  top: 53.125vw;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 30;
  pointer-events: none;
}

.NcCollectionDetailNav {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  width: 100%;
  height: 3.188vw;
  padding: 0 1.875vw;
  background: #fff;
  color: #1c1c1c;
  box-shadow: 0 -3px 15px 6px rgba(0, 0, 0, 0.09);
  opacity: 0;
  pointer-events: auto;
}

.NcCollectionDetailPage.is-nc-detail-nav-visible .NcCollectionDetailNav {
  opacity: 1;
}

.NcCollectionDetailNav__brand {
  display: block;
  width: 7.132vw;
  height: 0.813vw;
  filter: invert(1);
}

.NcCollectionDetailNav__brand img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.NcCollectionDetailNav__links {
  display: flex;
  align-items: center;
  gap: 1.875vw;
  margin-right: 10.938vw;
  margin-left: auto;
  font-family: "Roboto", sans-serif;
  font-size: max(10px, 0.813vw);
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

.NcCollectionDetailNav__shop {
  position: absolute;
  top: 0.938vw;
  right: 1.875vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 8.125vw;
  height: 1.313vw;
  border: 1px solid rgba(0, 0, 0, 0.13);
  border-radius: 0.125vw;
  font-family: "Roboto", sans-serif;
  font-size: max(9px, 0.75vw);
  font-weight: 400;
  line-height: 1;
}

.NcCollectionDetailIntro {
  position: relative;
  height: 48.375vw;
  background: #fff;
}

.NcCollectionDetailIntro__visual {
  position: absolute;
  top: 12.5vw;
  left: 13.25vw;
  width: 35.5vw;
  height: 25.375vw;
  margin: 0;
  overflow: hidden;
}

.NcCollectionDetailIntro__visual picture,
.NcCollectionDetailIntro__visual img {
  width: 100%;
  height: 100%;
}

.NcCollectionDetailIntro__visual img {
  object-fit: cover;
  object-position: left center;
}

.NcCollectionDetailIntro__copy {
  position: absolute;
  top: 12.5vw;
  left: 51.25vw;
  width: 35.5vw;
  font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: max(8px, 1vw);
  font-feature-settings: "pwid", "palt";
  font-weight: 300;
  line-height: 1.8;
}

.NcCollectionDetailIntro__copy p {
  margin: 0;
}

.NcCollectionDetailButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20.313vw;
  height: 2.813vw;
  border: 1px solid #1c1c1c;
  border-radius: 0.188vw;
  background: #fff;
  color: #1c1c1c;
  font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: max(10px, 0.875vw);
  font-weight: 300;
  letter-spacing: -0.044vw;
  line-height: 1;
}

.NcCollectionDetailButton--dark {
  background: #1c1c1c;
  color: #fff;
}

.NcCollectionDetailIntro__button {
  position: absolute;
  top: 36.188vw;
  left: 51.25vw;
}

.NcCollectionDetailLook {
  position: relative;
  height: 55.438vw;
  background: #fff;
}

.NcCollectionDetailLook__visual {
  position: absolute;
  top: 0;
  left: 3.125vw;
  width: 93.75vw;
  height: 40vw;
  overflow: hidden;
}

.NcCollectionDetailLook__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 58%;
}

.NcCollectionDetailLook__buttons {
  position: absolute;
  top: 44.656vw;
  left: 50%;
  display: flex;
  gap: 2.5vw;
  transform: translateX(-50%);
}

.NcCollectionDetailMovie {
  position: relative;
  height: 63.688vw;
  overflow: hidden;
  background: #181818;
  color: #fff;
}

.NcCollectionDetailMovie__title {
  position: absolute;
  top: 6.25vw;
  left: 5.625vw;
  margin: 0;
  font-family: "Times New Roman", serif;
  font-size: max(18px, 1.875vw);
  font-weight: 400;
  line-height: 0.9;
}

.NcCollectionDetailMovie__visual {
  position: absolute;
  top: 12.938vw;
  left: 13.25vw;
  width: 73.5vw;
  height: 41.375vw;
  margin: 0;
  overflow: hidden;
}

.NcCollectionDetailMovie__visual picture,
.NcCollectionDetailMovie__visual picture img {
  width: 100%;
  height: 100%;
}

.NcCollectionDetailMovie__visual picture img {
  object-fit: cover;
  object-position: center;
}

.NcCollectionDetailMovie__centerIcon {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5.188vw;
  height: 5.188vw;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.NcCollectionDetailMovie__centerIcon img {
  display: block;
  width: 100%;
  height: 100%;
}

.NcCollectionDetailMovie__play {
  position: absolute;
  inset: 0;
  color: #fff;
}

.NcCollectionDetailMovie__play span {
  position: absolute;
  top: 6.875vw;
  left: 3.375vw;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 6.5vw;
  height: 6.5vw;
  border: 1px solid rgba(255, 255, 255, 0.88);
  border-radius: 50%;
  color: #fff;
  font-family: "Roboto", sans-serif;
  font-size: max(10px, 1vw);
  font-weight: 400;
  mix-blend-mode: difference;
  opacity: 0;
  pointer-events: none;
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .NcCollectionDetailMovie__play.is-play-following {
    cursor: none;
  }

  .NcCollectionDetailMovie__play.is-play-following span {
    top: 0;
    left: 0;
    opacity: 1;
    will-change: transform;
  }
}

@media (min-width: 1601px) {
  .NcCollectionDetail {
    height: auto;
  }

  .NcCollectionDetailMovie {
    height: 1019px;
  }

  .NcCollectionDetailMovie__title {
    top: 100px;
    left: 90px;
  }

  .NcCollectionDetailMovie__visual {
    top: 207px;
    left: 50%;
    width: 1176px;
    height: 662px;
    transform: translateX(-50%);
  }

  .NcCollectionDetailMovie__centerIcon {
    width: 83px;
    height: 83px;
  }

  .NcCollectionDetailMovie__play span {
    top: 110px;
    left: 54px;
    width: 104px;
    height: 104px;
  }
}

.NcVideoModal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.NcVideoModal.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.NcVideoModal__backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.7);
  cursor: pointer;
}

.NcVideoModal__dialog {
  position: relative;
  z-index: 1;
  width: min(96vw, 167.5vh);
  aspect-ratio: 16 / 9;
  outline: 0;
}

.NcVideoModal__player,
.NcVideoModal__player iframe {
  width: 100%;
  height: 100%;
}

.NcVideoModal__player iframe {
  display: block;
  border: 0;
}

.NcVideoModal__close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4vw;
  height: 4vw;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.8);
  font-family: Arial, sans-serif;
  font-size: max(32px, 2.625vw);
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
}

body.is-nc-video-modal-open {
  overflow: hidden;
}

.NcCollectionDetailFeature {
  position: relative;
  height: 44.625vw;
  background: #fff;
}

.NcCollectionDetailFeature__visual {
  position: absolute;
  top: 9.375vw;
  left: 13.25vw;
  width: 35.5vw;
  height: 25.375vw;
  overflow: hidden;
}

.NcCollectionDetailFeature__visual > picture {
  display: block;
  width: 100%;
  height: 100%;
}

.NcCollectionDetailFeature__visual > picture img,
.NcCollectionDetailFeature__visual > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.NcCollectionDetailFeature__title {
  position: absolute;
  top: 9.375vw;
  left: 51.25vw;
  margin: 0;
  font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: max(12px, 1.375vw);
  font-weight: 600;
  line-height: 1.2;
}

.NcCollectionDetailFeature__title span {
  display: block;
}

.NcCollectionDetailFeature__copy {
  position: absolute;
  top: 16.625vw;
  left: 51.25vw;
  width: 35.5vw;
  margin: 0;
  font-family: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: max(8px, 1vw);
  font-weight: 300;
  line-height: 1.8;
}

.NcCollectionDetailFeature__button {
  position: absolute;
  top: 32.438vw;
  left: 51.25vw;
}

.NcFooter {
  position: relative;
  width: 100%;
  height: 41.875vw;
  background: #2a2a2a;
  color: #fff;
}

.NcFooter__inner {
  position: relative;
  height: 38.125vw;
}

.NcFooter__logo {
  position: absolute;
  top: 7.5vw;
  left: 3.75vw;
  width: 13vw;
  height: 1.481vw;
  object-fit: fill;
}

.NcFooter__socials {
  position: absolute;
  top: 11.375vw;
  left: 3.75vw;
  display: flex;
  align-items: center;
  gap: 0.996vw;
  height: 1.984vw;
}

.NcFooter__socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.453vw;
  height: 1.453vw;
}

.NcFooter__socials img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.NcFooter__socials a:first-child {
  width: 1.341vw;
  height: 1.211vw;
}

.NcFooter__socials .NcFooter__social--weibo {
  width: 2.025vw;
  height: 1.92vw;
}

.NcFooter__socials .NcFooter__social--youtube {
  width: 1.62vw;
  height: 1.62vw;
}

.NcFooter__socials .NcFooter__social--line {
  width: 1.564vw;
  height: 1.503vw;
}

.NcFooter__newsletter {
  position: absolute;
  top: 19.438vw;
  left: 3.75vw;
  width: 20.75vw;
}

.NcFooter__newsletterTitle {
  margin: 0;
  font-family: "Inter", sans-serif;
  font-size: clamp(14px, 0.938vw, 16px);
  font-weight: 400;
  line-height: 1;
}

.NcFooter__newsletterText {
  margin: 1.063vw 0 0;
  font-size: clamp(12px, 0.75vw, 13px);
  font-weight: 300;
  line-height: 1.3;
}

.NcFooter__newsletterForm {
  position: absolute;
  top: 9.313vw;
  left: 0;
  width: 20.75vw;
  height: 3.125vw;
  margin: 0;
  border: 1px solid #7d7d7d;
}

.NcFooter__newsletterForm input {
  width: 100%;
  height: 100%;
  padding: 0 3.125vw 0 1.25vw;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font: inherit;
  font-size: clamp(12px, 0.75vw, 13px);
  letter-spacing: 0.018vw;
}

.NcFooter__newsletterForm input::placeholder {
  color: #fff;
  opacity: 1;
}

.NcFooter__newsletterForm button {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.125vw;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}

.NcFooter__newsletterForm button img {
  width: 0.379vw;
  height: 0.669vw;
}

.NcFooter__links {
  position: absolute;
  top: 8.375vw;
  left: 65.188vw;
  display: grid;
  grid-template-columns: 5.438vw 8.75vw 8.125vw;
  gap: 3.438vw;
}

.NcFooter__nav {
  display: flex;
  flex-direction: column;
  gap: 1.25vw;
  line-height: 1;
  white-space: nowrap;
}

.NcFooter__nav--primary {
  font-family: "Roboto", sans-serif;
  font-size: clamp(12px, 0.75vw, 13px);
  font-weight: 400;
}

.NcFooter__nav--secondary,
.NcFooter__actions {
  font-size: clamp(11px, 0.688vw, 12px);
  font-weight: 300;
}

.NcFooter__actions {
  display: flex;
  flex-direction: column;
  gap: 1.25vw;
  white-space: nowrap;
}

.NcFooter__shop {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 8.125vw;
  height: 1.313vw;
  margin-bottom: 0.813vw;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 0.125vw;
  background: rgba(255, 255, 255, 0.18);
  font-family: "Roboto", sans-serif;
  font-size: clamp(10px, 0.625vw, 11px);
  font-weight: 400;
  line-height: 1;
}

.NcFooter__copyright {
  display: flex;
  height: 3.75vw;
  padding-right: 3.5vw;
  align-items: center;
  justify-content: flex-end;
  background: #000;
  font-family: "Roboto", sans-serif;
  font-size: clamp(12px, 0.75vw, 13px);
  font-weight: 400;
}

.u-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (min-width: 768px) and (max-width: 1199px) {
  .NcFooter {
    height: auto;
  }

  .NcFooter__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    grid-template-areas:
      "logo links"
      "socials links"
      "newsletter links";
    grid-template-rows: auto auto 1fr;
    column-gap: 7vw;
    row-gap: 2.5vw;
    height: auto;
    min-height: 0;
    padding: 7vw 5vw 8vw;
  }

  .NcFooter__logo {
    position: static;
    grid-area: logo;
    width: max(158px, 13vw);
    height: auto;
    transform: none;
  }

  .NcFooter__socials {
    position: static;
    grid-area: socials;
    gap: max(10px, 0.862vw);
    height: auto;
    transform: none;
  }

  .NcFooter__socials a {
    width: max(18px, 1.453vw);
    height: max(18px, 1.453vw);
  }

  .NcFooter__socials a:first-child {
    width: max(17px, 1.341vw);
    height: max(15px, 1.211vw);
  }

  .NcFooter__socials .NcFooter__social--weibo {
    width: max(25px, 2.025vw);
    height: max(24px, 1.92vw);
  }

  .NcFooter__socials .NcFooter__social--youtube {
    width: max(20px, 1.62vw);
    height: max(20px, 1.62vw);
  }

  .NcFooter__socials .NcFooter__social--line {
    width: max(19px, 1.564vw);
    height: max(18px, 1.503vw);
  }

  .NcFooter__newsletter {
    position: static;
    grid-area: newsletter;
    width: 100%;
  }

  .NcFooter__newsletterTitle {
    font-size: clamp(15px, 1.5vw, 16px);
  }

  .NcFooter__newsletterText {
    margin-top: max(14px, 1.063vw);
    font-size: clamp(12px, 1.25vw, 13px);
    line-height: 1.5;
  }

  .NcFooter__newsletterForm {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: max(50px, 3.125vw);
    margin-top: max(28px, 3vw);
  }

  .NcFooter__newsletterForm input {
    padding: 0 max(50px, 5vw) 0 max(18px, 1.25vw);
    font-size: clamp(12px, 1.172vw, 13px);
  }

  .NcFooter__newsletterForm button {
    width: max(50px, 5vw);
  }

  .NcFooter__newsletterForm button img {
    width: max(6px, 0.379vw);
    height: max(11px, 0.669vw);
  }

  .NcFooter__links {
    position: static;
    grid-area: links;
    grid-template-columns: max-content max-content;
    grid-template-rows: auto auto;
    column-gap: 4vw;
    row-gap: 4vw;
    width: 100%;
  }

  .NcFooter__nav {
    gap: max(20px, 1.25vw);
  }

  .NcFooter__nav--primary {
    font-size: clamp(12px, 1.25vw, 13px);
  }

  .NcFooter__nav--secondary,
  .NcFooter__actions {
    font-size: clamp(11px, 1.172vw, 12px);
  }

  .NcFooter__actions {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: max(130px, 8.125vw) max-content;
    gap: max(20px, 1.25vw) 3vw;
  }

  .NcFooter__shop {
    grid-row: 1 / span 2;
    width: max(130px, 8.125vw);
    height: max(21px, 1.313vw);
    margin: 0;
  }
}


@media (max-width: 767px) {
  .NcCollectionDetailHeader {
    position: absolute;
    top: 4.8vw;
    left: 5.6vw;
    right: 5.333vw;
  }

  .NcCollectionDetailHeader .NcCollectionHeader__brand {
    width: 30.43vw;
    height: 3.467vw;
  }

  .NcCollectionDetail {
    height: 930.933vw;
  }

  .NcCollectionDetailHero {
    height: 177.867vw;
  }

  .NcCollectionDetailHeroBackdrop__sticky {
    height: 177.867vw;
  }

  .NcCollectionDetailHero__media img {
    top: -19.467vw;
    left: -91.728vw;
    width: 290.667vw;
    height: 206.133vw;
  }

  .NcCollectionDetailHero__surface {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 72.114%, #000 104.27%);
  }

  .NcCollectionDetailHero__title {
    top: 17.067vw;
    transform: translateX(-50%);
    font-size: max(36px, 11.2vw);
    font-weight: 400;
  }

  .NcCollectionDetailNavWrap {
    display: none;
  }

  .NcCollectionDetailIntro {
    height: 233.333vw;
  }

  .NcCollectionDetailIntro__copy {
    top: 21.333vw;
    left: 5.333vw;
    width: 89.333vw;
    font-size: max(12px, 3.733vw);
    line-height: 1.8;
  }

  .NcCollectionDetailIntro__visual {
    top: 128vw;
    left: 5.333vw;
    width: 89.333vw;
    height: 64vw;
  }

  .NcCollectionDetailButton {
    width: 89.333vw;
    height: 12vw;
    border-radius: 0.8vw;
    font-size: max(12px, 3.733vw);
    letter-spacing: -0.187vw;
  }

  .NcCollectionDetailIntro__button {
    top: 200vw;
    left: 5.333vw;
  }

  .NcCollectionDetailLook {
    height: 165.333vw;
  }

  .NcCollectionDetailLook__visual {
    top: 0;
    left: 0;
    width: 100vw;
    height: 106.667vw;
  }

  .NcCollectionDetailLook__visual img {
    object-position: center 54%;
  }

  .NcCollectionDetailLook__buttons {
    top: 114.667vw;
    flex-direction: column;
    gap: 5.333vw;
  }

  .NcCollectionDetailMovie {
    height: 103.2vw;
  }

  .NcCollectionDetailMovie__title {
    top: 21.333vw;
    left: 5.333vw;
    font-size: max(18px, 5.333vw);
  }

  .NcCollectionDetailMovie__visual {
    top: 31.467vw;
    left: 5.333vw;
    width: 89.333vw;
    height: 50.4vw;
  }

  .NcCollectionDetailMovie__centerIcon {
    width: 14.587vw;
    height: 14.587vw;
  }

  .NcCollectionDetailMovie__play span {
    display: none;
  }

  .NcVideoModal__dialog {
    width: 94.667vw;
  }

  .NcVideoModal__close {
    width: 12.8vw;
    height: 12.8vw;
    font-size: max(32px, 11.2vw);
  }

  .NcCollectionDetailFeature {
    height: 251.2vw;
  }

  .NcCollectionDetailFeature__title {
    top: 21.333vw;
    left: 5.333vw;
    font-size: max(16px, 4.8vw);
    line-height: 1.25;
  }

  .NcCollectionDetailFeature__copy {
    top: 43.733vw;
    left: 5.333vw;
    width: 89.333vw;
    font-size: max(12px, 3.733vw);
    line-height: 1.8;
  }

  .NcCollectionDetailFeature__visual {
    top: 123.733vw;
    left: 5.333vw;
    width: 89.333vw;
    height: 75.467vw;
  }

  .NcCollectionDetailFeature__button {
    top: 207.2vw;
    left: 5.333vw;
  }

  .NcFooter {
    height: 242.667vw;
  }

  .NcFooter__inner {
    height: 230.933vw;
  }

  .NcFooter__logo {
    top: 21.333vw;
    left: 50%;
    width: 44.8vw;
    height: 5.067vw;
    transform: translateX(-50%);
  }

  .NcFooter__socials {
    top: 35.467vw;
    left: 50%;
    gap: 3.678vw;
    height: 6.322vw;
    transform: translateX(-50%);
  }

  .NcFooter__socials a {
    width: 4.781vw;
    height: 4.781vw;
  }

  .NcFooter__socials a:first-child {
    width: 4.414vw;
    height: 3.986vw;
  }

  .NcFooter__socials .NcFooter__social--weibo {
    width: 6.667vw;
    height: 6.322vw;
  }

  .NcFooter__socials .NcFooter__social--youtube {
    width: 5.333vw;
    height: 5.333vw;
  }

  .NcFooter__socials .NcFooter__social--line {
    width: 5.149vw;
    height: 4.935vw;
  }

  .NcFooter__newsletter {
    top: 66.667vw;
    left: 5.333vw;
    width: 89.333vw;
  }

  .NcFooter__newsletterTitle {
    font-size: clamp(15px, 4.267vw, 16px);
  }

  .NcFooter__newsletterText {
    width: 88.533vw;
    margin-top: 4vw;
    font-size: clamp(12px, 3.2vw, 13px);
  }

  .NcFooter__newsletterForm {
    top: 30.667vw;
    width: 89.333vw;
    height: 13.333vw;
  }

  .NcFooter__newsletterForm input {
    padding: 0 13.333vw 0 4.8vw;
    font-size: clamp(12px, 3.2vw, 13px);
    letter-spacing: 0.075vw;
  }

  .NcFooter__newsletterForm button {
    width: 13.333vw;
  }

  .NcFooter__newsletterForm button img {
    width: 1.616vw;
    height: 2.855vw;
  }

  .NcFooter__links {
    top: 124vw;
    left: 5.333vw;
    grid-template-columns: 40vw max-content;
    gap: 0 12vw;
  }

  .NcFooter__nav {
    gap: 5.333vw;
  }

  .NcFooter__nav--primary {
    padding-top: 1.333vw;
    font-size: clamp(13px, 3.733vw, 14px);
  }

  .NcFooter__nav--secondary {
    font-size: clamp(12px, 3.2vw, 13px);
  }

  .NcFooter__actions {
    position: absolute;
    top: 65.333vw;
    left: 0;
    gap: 5.333vw;
    font-size: clamp(12px, 3.2vw, 13px);
  }

  .NcFooter__shop {
    width: 34.667vw;
    height: 5.6vw;
    margin-bottom: 4vw;
    border-radius: 0.533vw;
    font-size: clamp(10px, 2.933vw, 11px);
  }

  .NcFooter__copyright {
    height: 11.733vw;
    padding-right: 5.333vw;
    font-size: clamp(10px, 2.933vw, 11px);
  }

}

@keyframes NcCollectionDetailBlackout {
  0%,
  75% {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
  }

  99% {
    opacity: 1;
    transform: translateY(-100%);
    visibility: visible;
  }

  100% {
    opacity: 1;
    transform: translateY(-100%);
    visibility: hidden;
  }
}

@keyframes NcCollectionDetailHeroImageIn {
  0% {
    opacity: 0.42;
    filter: brightness(0.78);
    transform: scale(1.025);
  }

  100% {
    opacity: 1;
    filter: brightness(1);
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {

  .NcCollectionDetailMovie__play span {
    transition: none;
  }

  .NcCollectionDetailPage::before {
    display: none;
    animation: none;
  }

  .NcCollectionDetailHero__media {
    opacity: 1;
    filter: none;
    transform: none;
    animation: none;
  }

  .NcCollectionDetailHeroBackdrop__sticky {
    position: relative;
  }
}

.NcCollectionPage {
  -webkit-user-select: none;
  user-select: none;
}

@media print {
  body {
    display: none !important;
  }
}
