/* Loaded exclusively by front-page-20261019.php. */
.sm2027-top {
  --sm2027-purple: #322b5c;
  --sm2027-red: #88090d;
  color: #1b1b1b;
}
.sm2027-top *, #footer * { box-sizing: border-box; }
/* Keep the existing application button layout and image sizes. */
.sm2027-top #sec-exhibiting { z-index: 2; background-color: var(--sm2027-purple); }

.sm2027-news {
  position: relative;
  isolation: isolate;
  min-height: 450px;
  padding: clamp(105px, 9vw, 190px) 40px clamp(55px, 5vw, 110px);
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% auto;
}
.sm2027-news__heading {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 50%;
  width: clamp(320px, 42vw, 900px);
  margin: 0;
  padding: 0;
  /* Show the middle of the rope while its ends stay behind the blue band. */
  transform: translate(-50%, -25%);
  color: var(--sm2027-purple);
  text-align: center;
  pointer-events: none;
}
.sm2027-news__scene { position: relative; display: block; width: 100%; aspect-ratio: 1497 / 319; }
.sm2027-news__thread { position: absolute; top: 0; left: 0; display: block; width: 100%; height: auto; }
.sm2027-news__lantern {
  position: absolute;
  display: block;
  width: 9.6192%;
  height: auto;
  transform-origin: 50% 0;
  animation: sm2027-lantern-sway var(--lantern-duration) ease-in-out var(--lantern-delay) infinite alternate;
}
.sm2027-news__lantern--n { left: 29.9933%; top: 38.2445%; transform-origin: 67% 0; --lantern-swing: 7deg; --lantern-duration: 2.3s; --lantern-delay: -.7s; }
.sm2027-news__lantern--e { left: 45.157%; top: 38.8715%; --lantern-swing: 5deg; --lantern-duration: 2.8s; --lantern-delay: -1.8s; }
.sm2027-news__lantern--w { left: 58.0494%; top: 39.185%; width: 9.4856%; transform-origin: 42% 0; --lantern-swing: 6deg; --lantern-duration: 2.1s; --lantern-delay: -.2s; }
.sm2027-news__lantern--s { left: 69.4723%; top: 33.2288%; --lantern-swing: 5.5deg; --lantern-duration: 3.1s; --lantern-delay: -2.2s; }
.sm2027-news__content { position: relative; z-index: 1; max-width: 800px; margin: 0 auto; }
.sm2027-news__list { padding: clamp(30px, 3vw, 60px) 0; margin: 0; list-style: none; }
.sm2027-news__list li { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 20px; padding: 12px 0; font-size: 15px; line-height: 1.8; }
.sm2027-news__list time { font-variant-numeric: tabular-nums; }
.sm2027-news__list a { color: #222; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.sm2027-news__more { margin-top: 26px; text-align: right; }
.sm2027-news__more a { display: inline-block; padding: 8px 16px; background: #332d29; color: #fff; font-size: 12px; line-height: 1.5; }
.sm2027-news__empty { text-align: center; }
.sm2027-petals { position: absolute; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; }
/* Clip the falling petals to the two margins, keeping NEWS links clear. */
.sm2027-petals__side {
  position: absolute;
  top: 0;
  bottom: 0;
  width: min(24%, max(40px, calc((100% - 848px) / 2)));
  overflow: hidden;
}
.sm2027-petals__side--left { left: 0; }
.sm2027-petals__side--right { right: 0; }

.sm2027-petal {
  position: absolute;
  top: 0;
  left: var(--petal-left);
  display: block;
  width: var(--petal-size);
  height: var(--petal-size);
  opacity: var(--petal-opacity);
  animation: sm2027-petal-fall var(--petal-duration) linear var(--petal-delay) infinite;
}
.sm2027-petal img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  animation: sm2027-petal-flutter var(--petal-flutter) ease-in-out var(--petal-delay) infinite alternate;
}
.sm2027-location {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  min-height: clamp(430px, 34.5vw, 750px);
  padding: clamp(110px, 8.5vw, 180px) 24px clamp(150px, 11vw, 230px);
  overflow: hidden;
  background-color: var(--sm2027-red);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: #fff;
  text-align: center;
}
.sm2027-location__content { position: relative; z-index: 3; width: min(58%, 950px); }
.sm2027-location h2 { margin: 0 0 12px; padding: 0; color: inherit; font-weight: 700; line-height: 1.2; }
.sm2027-location h2 strong { font-size: clamp(48px, 4.7vw, 100px); letter-spacing: .035em; }
.sm2027-location h2 span { font-size: clamp(16px, 1.5vw, 32px); white-space: nowrap; }
.sm2027-location__lead { margin: 0 0 20px; font-size: clamp(17px, 1.9vw, 40px); font-weight: 700; line-height: 1.65; }
.sm2027-location h3 { margin: 0 0 6px; padding: 0; color: inherit; font-size: clamp(24px, 2vw, 42px); font-weight: 700; line-height: 1.3; }
.sm2027-location__address { margin: 0; font-size: clamp(12px, 1.2vw, 25px); line-height: 1.8; }
/* Desktop timing: wind god leans inward as thunder god leans outward. */
.sm2027-location__god { --god-sway: clamp(28px, 3vw, 65px); position: absolute; z-index: 2; display: block; height: auto; pointer-events: none; transform-origin: 50% 55%; animation: sm2027-god-float 2.8s cubic-bezier(.45, 0, .55, 1) infinite alternate; will-change: transform; }
.sm2027-location__god--raijin { top: 39%; left: 5%; width: 22%; }
.sm2027-location__god--fujin { top: calc(.75vw + 6px); right: 6%; width: 20%; }
/* Layer order: building, clouds, gods, text. */
.sm2027-location__art { position: absolute; z-index: 1; display: block; height: auto; pointer-events: none; }
.sm2027-location__art--cloud-left-top { top: 3%; left: -3%; width: 22%; }
.sm2027-location__art--cloud-left-end { bottom: -5vw; left: -1%; width: 35%; }
.sm2027-location__art--cloud-right { top: -2%; right: -3%; width: 32%; }
/* Move the uneven lower edge below the clipped section boundary. */
.sm2027-location__art--building { z-index: 0; bottom: 0; right: -3%; width: 40%; margin-bottom: -6.8vw; }

/* Retain the current gallery artwork and year selector. */
.sm2027-top #sec-gallery { padding-top: clamp(140px, 8vw, 180px); padding-bottom: clamp(72px, 5vw, 112px); }
.sm2027-top #sec-gallery.sec .sec-inr { padding-top: 0; padding-bottom: 0; }
.sm2027-top #top_gallery_playerframe { transform: none; opacity: 1; }
.sm2027-top #top_gallery_title,
.sm2027-top #top_gallery_left img,
.sm2027-top #top_gallery_right img,
.sm2027-top #gallery_archive_top .gallery-year-btn,
.sm2027-top #gallery_archive_current { transform: none; opacity: 1; animation: none; }
.sm2027-top #top_gallery_left,
.sm2027-top #top_gallery_right { appearance: none; padding: 0; border: 0; background: transparent; }
.sm2027-top #top_gallery_left:disabled,
.sm2027-top #top_gallery_right:disabled { opacity: .3; cursor: default; }
.sm2027-top .sm2027-gallery-empty { position: relative; z-index: 2; padding: 60px 20px; background: #fff; text-align: center; }

#footer {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-height: clamp(560px, 36vw, 780px);
  overflow: hidden;
  /* Keep text inside the central area between the large waves. */
  padding: clamp(90px, 7vw, 150px) 26% clamp(45px, 4vw, 80px);
  background: #322b5c;
  color: #fff;
  text-shadow: 0 1px 3px rgba(20, 14, 42, .8), 0 0 6px rgba(20, 14, 42, .65);
}
#footer::before, #footer::after { content: ""; position: absolute; z-index: -1; display: block; pointer-events: none; background: no-repeat center / contain; }
#footer::before { top: -1vw; left: 0; width: 30%; margin-left: -4vw; aspect-ratio: 921 / 1384; background-image: url("/img_2027/wave02.webp"); }
#footer::after { bottom: 0; right: -3vw; width: 60%; margin-bottom: -3vw; aspect-ratio: 1930 / 1041; background-image: url("/img_2027/wave01.webp"); }
#footer .sm2027-footer-ornament { position: absolute; z-index: 0; left: clamp(40px, 11vw, 230px); bottom: clamp(16px, 2vw, 36px); width: clamp(130px, 12vw, 270px); height: auto; pointer-events: none; }
#footer > .fellow, #footer > .sm-footer-credits, #footer > .copyright { position: relative; z-index: 1; }
#footer .fellow { padding: 10px 16px; }
#footer .fellowblock p { margin: 0; font-size: 15px; line-height: 1.8; text-shadow: inherit; }
#footer .sm-footer-credits { width: min(100%, 1120px); margin: 0 auto; padding: 25px 20px; text-align: center; }
#footer .sm-footer-credits__group + .sm-footer-credits__group { margin-top: 25px; }
#footer .sm-footer-credits__title { margin: 0 0 12px; padding: 0; color: inherit; font-size: 15px; line-height: 1.6; font-weight: 700; }
#footer .sm-footer-credits__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; margin: 0; padding: 0; list-style: none; }
#footer .sm-footer-credits__list > li { margin: 0; padding: 0; font-size: 13px; line-height: 1.8; list-style: none; overflow-wrap: anywhere; }
/* Keep the copyright at the bottom, leaving room for the future lower-left artwork. */
#footer .copyright { width: 100%; max-width: 1080px; margin: auto auto 0; padding-top: clamp(70px, 6vw, 120px); font-size: 12px; line-height: 1.8; text-align: center; }
.sm2027-top a:focus-visible, .sm2027-top button:focus-visible { outline: 3px solid #dbab45; outline-offset: 5px; }
.sm2027-top .is-motion-paused .sm2027-petal,
.sm2027-top .is-motion-paused .sm2027-petal img,
.sm2027-top .is-motion-paused .sm2027-news__lantern,
.sm2027-top .is-motion-paused .sm2027-location__god { animation-play-state: paused; }

@keyframes sm2027-petal-fall {
  from { transform: translate3d(0, -65px, 0); }
  to { transform: translate3d(var(--petal-drift), calc(var(--sm2027-news-height, 500px) + 65px), 0); }
}
@keyframes sm2027-petal-flutter {
  from { transform: translateX(-8px) rotate(var(--petal-rotation)); }
  to { transform: translateX(8px) rotate(calc(var(--petal-rotation) + 90deg)); }
}
@keyframes sm2027-lantern-sway { from { transform: rotate(calc(0deg - var(--lantern-swing))); } to { transform: rotate(var(--lantern-swing)); } }
@keyframes sm2027-god-float {
  from { transform: translate3d(calc(0px - var(--god-sway)), -4px, 0) rotate(-8deg); }
  to { transform: translate3d(var(--god-sway), 4px, 0) rotate(8deg); }
}

@media (max-width: 770px) {
  .sm2027-news { min-height: 350px; padding: 100px 40px 45px; background-size: auto 100%; }
  .sm2027-news__heading { width: min(94vw, 380px); }
  .sm2027-news__list { padding: 0; }
  .sm2027-news__list li { grid-template-columns: 1fr; gap: 2px; padding: 12px 0; font-size: 14px; }
  .sm2027-news__list time { font-size: 12px; }
  .sm2027-location { min-height: 490px; padding: clamp(240px, 52vw, 430px) 24px clamp(210px, 42vw, 300px); background-size: auto 100%; }
  .sm2027-location__content { width: 100%; }
  .sm2027-location h2 strong { font-size: 48px; }
  .sm2027-location__lead { font-size: 17px; }
  .sm2027-location__god--raijin { top: auto; bottom: 36px; left: clamp(34px, 10vw, 72px); width: 40%; animation-duration: 2.8s; animation-delay: -1.2s; }
  .sm2027-location__god--fujin { top: clamp(42px, 8vw, 70px); right: clamp(26px, 7vw, 54px); width: 38%; animation-duration: 3.2s; animation-delay: -.4s; }
  .sm2027-location__art--cloud-left-top { top: 5%; left: -10%; width: 50%; }
  .sm2027-location__art--cloud-left-end { bottom: -13vw; left: -10%; width: 80%; }
  .sm2027-location__art--cloud-right { top: -3%; right: -15%; width: 70%; }
  .sm2027-location__art--building { right: -8%; width: 68%; margin-bottom: -11.5vw; }
  .sm2027-top #sec-gallery { padding-top: 56px; padding-bottom: 72px; }
  /* On small screens, reserve space above the text instead of narrowing it. */
  #footer { min-height: 0; padding: clamp(190px, 50vw, 260px) 24px 40px; }
  #footer::before { top: -4vw; width: 36%; margin-left: -7vw; }
  #footer::after { right: -4vw; width: 100%; margin-bottom: -4.8vw; }
  #footer .sm-footer-credits { padding: 20px 0; }
  #footer .sm2027-footer-ornament { left: clamp(24px, 7vw, 48px); bottom: 64px; width: clamp(120px, 34vw, 180px); }
  #footer .copyright { padding-top: clamp(250px, 60vw, 330px); }
  #footer .sm-footer-credits__list { display: block; }
  #footer .sm-footer-credits__list > li + li { margin-top: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .sm2027-petals { display: none; }
  .sm2027-news__lantern, .sm2027-location__god { animation: none; }
  .sm2027-top .fan-visual { animation: none !important; }
}
