/* Figma 164:1978, 393px canvas. PC rules remain unchanged above 767px. */
@media (max-width: 767px) {
  .composition { aspect-ratio: 393 / 1690; }
  .photo { left: var(--sp-left) !important; top: var(--sp-top) !important; width: var(--sp-width) !important; height: var(--sp-height) !important; }
  .typo { --type-origin: var(--sp-type-origin) !important; --type-center-y: var(--sp-type-center-y) !important; }
  .typo2-trigger { top: 46.5088757396%; height: 15%; }
  .typo--pc-only { display: none; }
  .story-region { display: block; margin-top: 0; }
  .story-rail { display: none; }
  .story-content { padding-top: 0; }
  .photo-gallery { width: 61.0687022901%; margin-left: 19.5928753181%; grid-template-columns: minmax(0,1fr); gap: 2.5445292621cqw; }
  .photo-gallery img { aspect-ratio: 3 / 4; }
  .gallery-group, .gallery-group--pair { grid-template-columns: minmax(0,1fr); gap: 2.5445292621cqw; padding-bottom: 7.6335877863cqw; }
  .gallery-credit { width: 92.5%; font-size: 2.5445292621cqw; }
  .gallery-group--hotta .gallery-photo:first-child { order: 2; }
  .gallery-group--hotta .gallery-photo:nth-child(2) { order: 1; }
  .gallery-group--hotta .gallery-credit { order: 3; }
  .program-article { width: 61.0687022901%; margin: 30.534351145cqw 0 0 19.5928753181%; gap: 15.2671755725cqw; }
  .article-text { width: 100%; min-height: 0; font-size: 4.0712468193cqw; line-height: 1.5; }
  h2.article-text { font-size: 4.5801526718cqw; }
  .article-text[data-content-node="143:1651"] { font-size: 3.0534351145cqw; line-height: 1.2; }
  .article-text[data-content-node="143:1652"] { width: 92.5%; font-size: 2.5445292621cqw; }
  .article-text[data-content-node="143:1653"] { font-size: 2.5445292621cqw; }
  .article-photos { width: 100%; grid-template-columns: minmax(0,1fr); gap: .5089058524cqw; }
  .article-photo-stack { gap: .5089058524cqw; }
  .article-photos img { aspect-ratio: 16 / 9; }
  /* Shared PC footer elements; only spacing and sizes adapt to the small viewport. */
  .footer-column { min-height: 0; padding: 79.8982188295cqw 2.5445292621cqw 15.2671755725cqw; }
  .p-gf { width: 100%; padding-top: 0; }
  .p-gf__vol1 { left: 57.5063613232%; top: 33.3333333333cqw; bottom: auto; width: 47.8371501272cqw; }
  .p-linklist { gap: 2.7989821883cqw; margin-bottom: 10.9414758269cqw; }
  .p-linklist a { min-height: 44px; }
  .c-icon { font-size: 8.1424936387cqw; }
  .c-brand-icon--hulu { width: 15.5852417303cqw; height: 5.0890585242cqw; }
  .p-gf__tt { font-size: 4.5801526718cqw; line-height: 1.5; margin-bottom: 12.7226463104cqw; }
  .p-gf__page-top { display: inline-flex; align-items: center; min-height: 44px; }
  .p-gf__site-top { margin-bottom: 1.5267175573cqw; }
  .p-gf__site-top-logo { width: 87.0229007634cqw; }
  .p-gf__copyright { font-size: 1.6539440204cqw; }
  .photo-lightbox { padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom); }
  .lightbox-stage { inset: 60px 12px 70px; padding: 0; }
  .photo-lightbox .lightbox-prev, .photo-lightbox .lightbox-next { width: 44px; height: 60px; top: auto; bottom: max(12px, env(safe-area-inset-bottom)); transform: none; }
  .lightbox-tools { top: max(12px, env(safe-area-inset-top)); right: 12px; }
  .lightbox-tools button { min-height: 44px; }
  .lightbox-caption { bottom: max(22px, env(safe-area-inset-bottom)); }
}
