@import url("https://use.typekit.net/bcp5ett.css");

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; background: #fff; font-size: 0.078125vw; }
body, h1, h2, h3, p, figure { margin: 0; }
body { overflow-x: hidden; color: #333; font-family: "Aktiv Grotesk", "aktiv-grotesk", Arial, sans-serif; -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

.page { width: 100vw; min-height: 100vh; overflow: hidden; background: #fff; --credit-font-size: min(12px, 0.9375vw); --ui-font-12: min(12px, 0.9375vw); --ui-font-16: min(16px, 1.25vw); }

.lead { width: 100vw; padding: 120rem 0 130rem; color: #333; font-size: var(--credit-font-size); line-height: 1.8; letter-spacing: 0.03em; }
.lead__inner { width: max-content; max-width: calc(100vw - 60px); margin: 0 auto; font-size: min(15px, 1.171875vw); text-align: left; }
.lead__title { margin-bottom: 1.8em; font-size: min(18px, 1.40625vw); }

.credits { position: absolute; display: flex; flex-direction: column; gap: 1.25em; width: 20.333em; font-size: var(--credit-font-size); }
.credit { display: flex; position: relative; gap: 0.75em; align-items: flex-start; justify-content: flex-start; width: max-content; height: 1.083em; color: #333; font-size: 1em; line-height: 0.89; letter-spacing: 0.03em; white-space: nowrap; }
.credit__item { display: block; flex: 0 0 auto; padding-top: 0.083em; }
.credit__buy { flex: 0 0 auto; padding-top: 0.083em; font-family: "neue-haas-grotesk-display", "Helvetica Neue", Arial, sans-serif; line-height: 1; letter-spacing: 0.05em; }

.js-reveal { opacity: 0; filter: blur(16px); transform: translateY(28rem); transition: opacity 1000ms ease, filter 1200ms ease, transform 1200ms ease; will-change: opacity, filter, transform; }
.js-reveal.is-visible { opacity: 1; filter: blur(0); transform: translateY(0); }

.main-visual { position: relative; width: calc(100vw - 60px); height: calc((100vw - 60px) * 0.65); margin: 30px; overflow: hidden; background: #fff; }
.main-visual__photo, .main-visual__photo picture, .main-visual__photo img { position: absolute; }
.main-visual__photo, .main-visual__photo picture { inset: 0; }
.main-visual__photo img { top: -5.95%; left: -0.19%; width: 107.63%; height: 110.43%; max-width: none; object-fit: cover; }
.main-visual__logo { position: absolute; top: 70rem; left: 70rem; width: 196.42rem; height: 31.82rem; }
.main-visual__logo img, .footer__logo img { width: 100%; height: 100%; object-fit: contain; }
.main-visual__nav { position: absolute; top: 70rem; right: 70rem; display: flex; gap: 26rem; align-items: center; color: #fff; font-size: 12rem; line-height: 1; white-space: nowrap; }
.main-visual__title { position: absolute; top: 357.32rem; left: 64.03rem; width: 543.6rem; height: 93.73rem; }
.main-visual__season, .main-visual__copy { position: absolute; max-width: none; object-fit: contain; }
.main-visual__season { top: 7.88rem; left: 9.54rem; width: 242.59rem; height: 19.77rem; }
.main-visual__copy { top: 47.92rem; left: 4.65rem; width: 536.27rem; height: 46.76rem; }

.main-contents { display: flex; position: relative; flex-direction: column; width: 100vw; height: auto; margin-top: 0; }
.look__media, .look__media img { position: absolute; }
.look { position: relative; flex: 0 0 auto; overflow: visible; }
.look__media { overflow: hidden; }
.look__media img { inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }

.look:not(.look--03):not(.look--11) { scale: 0.9; transform-origin: 0 0; }
.look:not(.look--03):not(.look--11) .credits { scale: 1.111111; transform-origin: 0 0; }

.look--01 { margin: 0 0 0 610.1rem; width: 602rem; height: 814.5rem; }
.look--01 .look__media--a { top: 0; left: 0; width: 600rem; height: 750rem; }
.look--01 .credits--a { top: calc(750rem + 30px); left: calc(600rem - 20.333em); }
.look--02 { margin: 35.5rem 0 0 165rem; width: 500rem; height: 562.5rem; }
.look--02 .look__media--a { inset: 0; }
.look--03 { margin: 312.5rem 0 0 0; width: 1280rem; height: 854rem; }
.look--03 .look__media--a { inset: 0; }
.look--04 { margin: 200rem 0 0 229.3rem; width: 786rem; height: 506.7rem; }
.look--04 .look__media--a { top: 0; left: 0; width: 450rem; height: 563rem; }
.look--04 .credits--a { top: 438rem; left: calc(450rem + 50px); }
.look--05 { margin: 156.3rem 0 0 121.6rem; width: 1152rem; height: 691.2rem; }
.look--05 .look__media--a { inset: 0; }
.look--06 { margin: 326.8rem 0 0 370rem; width: 600rem; height: 814.5rem; }
.look--06 .look__media--a { top: 0; left: 0; width: 600rem; height: 750rem; }
.look--06 .credits--a { top: calc(750rem + 30px); left: 0; }
.look--07 { margin: 190.5rem 0 0 0; width: 1280rem; height: 1319.4rem; }
.look--07 .look__media--a { top: 0; left: 0; width: 1024rem; height: 683rem; }
.look--07 .look__media--b { top: 783rem; left: 398.22rem; width: 1024rem; height: 683rem; }
.look--08 { margin: 396.6rem 0 0 121.6rem; width: 1152rem; height: 675rem; }
.look--08 .look__media--a { top: 0; left: 0; width: 600rem; height: 750rem; }
.look--08 .look__media--b { top: 0; left: 702rem; width: 450rem; height: 563rem; }
.look--08 .credits--a { top: calc(563rem + 30px); left: 702rem; }
.look--09 { margin: 175rem 0 0 415rem; width: 500rem; height: 562.5rem; }
.look--09 .look__media--a { inset: 0; }
.look--10 { margin: 312.5rem 0 0 121.6rem; width: 1152rem; height: 844.2rem; }
.look--10 .look__media--a { top: 0; left: 0; width: 500rem; height: 625rem; }
.look--10 .look__media--b { top: 313rem; left: 652rem; width: 500rem; height: 625rem; }
.look--10 .credits--a { top: calc(625rem + 30px); left: 0; }
.look--11 { margin: 373.8rem 0 0 415rem; width: 450rem; height: 330rem; }
.look--11 .look__media--a { inset: 0; }
.look--12 { margin: 344rem 0 0 370rem; width: 600rem; height: 675rem; }
.look--12 .look__media--a { inset: 0; }
.look--13 { margin: 175rem 0 0 0; width: 1236rem; height: 506.7rem; }
.look--13 .look__media--a { top: 0; left: 0; width: 450rem; height: 563rem; }
.look--13 .look__media--b { top: 0; left: 470rem; width: 450rem; height: 563rem; }
.look--13 .credits--a { top: 438rem; left: calc(470rem + 450rem + 30px); }
.look--14 { margin: 156.3rem 0 0 741rem; width: 500rem; height: 299.7rem; }
.look--14 .look__media--a { inset: 0; }
.look--15 { margin: 283.3rem 0 0 120.35rem; width: 1127rem; height: 1270.8rem; }
.look--15 .look__media--a { top: 0; left: 150rem; width: 450rem; height: 562rem; }
.look--15 .look__media--b { top: 146rem; left: 677rem; width: 450rem; height: 563rem; }
.look--15 .look__media--c { top: 662rem; left: 0; width: 600rem; height: 750rem; }
.look--15 .credits--a { top: auto; bottom: 0; left: 650rem; }
.look--16 { margin: 391.2rem 0 0 0; width: 1191rem; height: 720rem; }
.look--16 .look__media--a { top: 0; left: 0; width: 640rem; height: 800rem; }
.look--16 .look__media--b { top: 237rem; left: 741rem; width: 450rem; height: 563rem; }
.look--16 .credits--a { top: 62rem; left: 741rem; }
.look--17 { margin: 180rem 0 0 439rem; width: 500rem; height: 562.5rem; }
.look--17 .look__media--a { inset: 0; }
.look--18 { margin: 312.5rem 0 0 0; width: 1024rem; height: 614.7rem; }
.look--18 .look__media--a { inset: 0; }
.look--19 { margin: 268.3rem 0 0 121.7rem; width: 1154rem; height: 814.5rem; }
.look--19 .look__media--a { top: 93rem; left: 0; width: 450rem; height: 563rem; }
.look--19 .look__media--b { top: 0; left: 552rem; width: 600rem; height: 750rem; }
.look--19 .credits--a { top: calc(750rem + 30px); left: 552rem; }
.look--20 { margin: 340.5rem 0 0 0; width: 1280rem; height: 771.3rem; }
.look--20 .look__media--a { top: 0; left: 0; width: 561rem; height: 702rem; }
.look--20 .look__media--b { top: 280rem; left: 584rem; width: 337rem; height: 421rem; }
.look--20 .look__media--c { top: 281rem; left: 943rem; width: 337rem; height: 421rem; }
.look--20 .credits--a { top: calc(702rem + 30px); left: 50rem; }

.staff { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100vw; height: 478rem; padding: 200rem 0; color: #333; font-size: var(--ui-font-12); line-height: 1; text-align: center; }
.staff p + p { margin-top: 10px; }
.footer { display: flex; flex-direction: column; align-items: center; width: 100vw; padding: 100rem 0 50rem; border-top: 1rem solid #333; }
.footer__logo { width: 185.12rem; height: 30rem; }
.footer__nav { display: flex; gap: 9px; margin-top: 40rem; color: #333; font-size: var(--ui-font-16); line-height: 1; letter-spacing: 0.48px; white-space: nowrap; }
.footer__copy { margin-top: 60rem; color: #333; font-size: var(--ui-font-12); line-height: 1; white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .js-reveal { opacity: 1; filter: none; transform: none; transition: none; }
}

@media (max-width: 767px) {
  html { font-size: calc(100vw / 390); }
  .page { --credit-font-size: min(11px, 2.820513vw); --ui-font-12: min(12px, 3.076923vw); --ui-font-13: min(13px, 3.333333vw); }

  .main-visual { width: 100vw; height: 390rem; margin: 0; }
  .main-visual__photo { height: 390rem; }
  .main-visual__photo img { top: 0; left: 0; width: 100%; height: 100%; }
  .main-visual__logo { top: 28rem; left: 25rem; width: 158rem; height: 26rem; }
  .main-visual__title { top: 0; left: 0; width: 390rem; height: 390rem; }
  .main-visual__season { top: 281rem; left: 29.37rem; width: 192rem; height: 15.65rem; }
  .main-visual__copy { top: 313rem; left: 25.5rem; width: 337rem; height: 29.38rem; }
  .main-visual__nav { display: none; }

  .lead { padding: 80rem 0 90rem; font-size: var(--ui-font-13); line-height: 1.75; }
  .lead__inner { width: 337rem; max-width: calc(100vw - 50rem); font-size: inherit; }
  .lead__title { font-size: min(14px, 3.589744vw); }

  .main-contents { display: flex !important; flex-direction: column; width: 100vw; height: auto !important; margin-top: 0; }
  .look, .look__media, .credits { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; }
  .look { display: flex !important; flex: 0 0 auto; flex-direction: column; align-items: flex-start; height: auto !important; scale: 1 !important; }
  .look .credits { scale: 1 !important; }
  .look__media, .credits { flex: 0 0 auto; margin: 0; }
  .credits { width: 20.333em; margin-top: 15rem !important; gap: 1em; }
  .look__media + .look__media { margin-top: 40rem; }

  .look--01 { margin: 0 0 0 39rem !important; width: 312rem; }
  .look--01 .look__media--a { width: 312rem; height: 390rem; }
  .look--01 .credits--a { align-self: flex-end; }
  .look--02 { margin: 40rem 0 0 39rem !important; width: 234rem; }
  .look--02 .look__media--a { width: 234rem; height: 292.5rem; }
  .look--03 { margin: 100rem 0 0 0 !important; width: 390rem; }
  .look--03 .look__media--a { width: 390rem; height: 260.2rem; }
  .look--04 { margin: 40rem 0 0 39rem !important; width: 195rem; }
  .look--04 .look__media--a { width: 195rem; height: 243.75rem; }
  .look--05 { margin: 40rem 0 0 0 !important; width: 390rem; }
  .look--05 .look__media--a { width: 390rem; height: 260rem; }
  .look--06 { margin: 100rem 0 0 39rem !important; width: 312rem; }
  .look--06 .look__media--a { width: 312rem; height: 390rem; }
  .look--07 { margin: 40rem 0 0 0 !important; width: 390rem; }
  .look--07 .look__media--a, .look--07 .look__media--b { width: 351rem; height: 234.11rem; }
  .look--07 .look__media--b { margin-left: 39rem; }
  .look--08 { margin: 100rem 0 0 0 !important; width: 390rem; }
  .look--08 .look__media--b { order: 1; width: 234rem; height: 293rem; }
  .look--08 .look__media--a { order: 2; width: 351rem; height: 439rem; margin-top: 40rem; margin-left: 39rem; }
  .look--08 .credits--a { order: 3; margin-left: 39rem; }
  .look--09 { margin: 80rem 0 0 99rem !important; width: 195rem; }
  .look--09 .look__media--a { width: 195rem; height: 243.75rem; }
  .look--10 { margin: 100rem 0 0 0 !important; width: 390rem; }
  .look--10 .look__media--a, .look--10 .look__media--b { width: 312rem; height: 390rem; }
  .look--10 .credits--a { order: 2; margin-left: 20rem; }
  .look--10 .look__media--b { order: 3; margin-top: 40rem; margin-left: 78rem; }
  .look--11 { margin: 95rem 0 20rem 39rem !important; width: 312rem; }
  .look--11 .look__media--a { width: 312rem; height: 208rem; }
  .look--12 { margin: 80rem 0 0 0 !important; width: 390rem; }
  .look--12 .look__media--a { width: 390rem; height: 487.5rem; }
  .look--13 { margin: 40rem 0 0 39rem !important; width: 312rem; }
  .look--13 .look__media--a, .look--13 .look__media--b { width: 312rem; height: 390rem; }
  .look--13 .look__media--b { margin-top: 30rem; }
  .look--14 { margin: 40rem 0 0 39rem !important; width: 312rem; }
  .look--14 .look__media--a { width: 312rem; height: 207.79rem; }
  .look--15 { margin: 100rem 0 0 0 !important; width: 390rem; }
  .look--15 .look__media--a, .look--15 .look__media--b { width: 234rem; height: 293rem; }
  .look--15 .look__media--b { margin-top: 40rem; margin-left: 156rem; }
  .look--15 .look__media--c { width: 351rem; height: 439rem; margin-top: 40rem; margin-left: 19rem; }
  .look--15 .credits--a { margin-left: 19rem; }
  .look--16 { margin: 100rem 0 0 0 !important; width: 390rem; }
  .look--16 .look__media--a { width: 351rem; height: 438.75rem; }
  .look--16 .credits--a { order: 2; margin-left: 20rem; }
  .look--16 .look__media--b { order: 3; width: 234rem; height: 293rem; margin-top: 40rem; margin-left: 156rem; }
  .look--17 { margin: 40rem 0 0 78rem !important; width: 234rem; }
  .look--17 .look__media--a { width: 234rem; height: 292.5rem; }
  .look--18 { margin: 100rem 0 0 0 !important; width: 351rem; }
  .look--18 .look__media--a { width: 351rem; height: 234.11rem; }
  .look--19 { margin: 40rem 0 0 39rem !important; width: 312rem; }
  .look--19 .look__media--a { width: 234rem; height: 292.5rem; margin-left: 39rem; }
  .look--19 .look__media--b { width: 312rem; height: 390rem; margin-top: 40rem; }
  .look--19 .credits--a { align-self: flex-end; }
  .look--20 { display: grid !important; grid-template-columns: 170.085rem 10.83rem 170.085rem; margin: 100rem 0 0 19rem !important; width: 351rem; }
  .look--20 .look__media--a { grid-column: 1 / 4; order: 1; width: 351rem; height: 438.75rem; }
  .look--20 .credits--a { grid-column: 1 / 4; order: 2; }
  .look--20 .look__media--b { grid-column: 1; order: 3; width: 170.085rem; height: 212.606rem; margin-top: 40rem; }
  .look--20 .look__media--c { grid-column: 3; order: 4; width: 170.085rem; height: 212.606rem; margin-top: 40rem; }

  .staff { height: auto; padding: 200rem 0 100rem; }
  .footer { padding: 50rem 0 30rem; gap: 30rem; }
  .footer__logo { width: 160.43rem; height: 26rem; }
  .footer__nav { margin-top: 0; gap: 0.538em; font-size: var(--ui-font-13); letter-spacing: 0.03em; }
  .footer__copy { margin-top: 0; }
}