@charset "utf-8";
/* WePlay Expo Japan 2027 — 共通スタイル
   JS からは要素のカスタムプロパティ（--prog / --cx / --cy）だけを更新する。
   実際の transform 値は必ずこのファイル側に置く（markup へのインライン style は使わない）。 */

/* ============================================================
   1. トークン
   ============================================================ */
:root {
  --c-bg:        #061410;
  --c-bg-2:      #0a201a;
  --c-bg-3:      #0e2b22;
  --c-ink:       #eafff6;
  --c-mute:      #9ec6b8;
  --c-line:      rgba(160, 235, 205, 0.22);

  --c-cyan:      #2ad4f5;
  --c-green:     #35d69a;
  --c-lime:      #b9f227;
  --c-orange:    #ff8a1f;
  --c-orange-2:  #ff5a00;
  --c-on-orange: #2b1200;

  --grad-logo:   linear-gradient(100deg, var(--c-cyan) 0%, var(--c-green) 46%, var(--c-lime) 100%);
  --grad-hot:    linear-gradient(100deg, var(--c-orange-2) 0%, var(--c-orange) 55%, #ffc21f 100%);
  /* 明色セクションの日付・会場に使う濃いグラデーション */
  --grad-date:   linear-gradient(100deg, #06678a 0%, #0b7f5e 52%, #3c760c 100%);

  /* リード文（p-date__badge / c-head__lead / p-about__msg 共通）
     SP 15px 〜 PC 20px */
  --fs-lead: clamp(0.9375rem, 0.85rem + 0.45vw, 1.25rem);

  --wrap:        1200px;
  --wrap-narrow: 820px;
  --gut:         clamp(1.25rem, 4vw, 3.5rem);

  /* 本文カラムとボタン列の幅（em だと文字サイズで実寸がずれるため rem 固定） */
  --w-col:  58rem;
  --w-btns: 34rem;
  /* 角丸：カード／写真 */
  --r-card: clamp(0.4rem, -0.2rem + 1.6vw, 1.25rem);
  --r-img:  clamp(0.25rem, -0.1rem + 0.9vw, 0.75rem);

  /* 詰め組みの標準字間（§2 の「詰め組み＋字間」グループで使う） */
  --ls-set: 0.08em;

  --ff-jp: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "BIZ UDPGothic", "Yu Gothic", Meiryo, system-ui, sans-serif;
  --ff-en: "Helvetica Neue", Arial, "Arial Black", system-ui, sans-serif;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-pop: cubic-bezier(0.34, 1.56, 0.64, 1);

}

/* ============================================================
   2. ベース
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5.5rem;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-ink);
  font-family: var(--ff-jp);
  /* 本文：SP 14px 〜 PC 17px。長文の可読性優先で palt / 字間詰めは掛けない */
  font-size: clamp(0.875rem, 0.8rem + 0.32vw, 1.0625rem);
  line-height: 1.9;
  overflow-x: hidden;
}

/* 詰め組み（palt）は、日付・見出し・キャッチ・注記など「短い文字組み」だけに掛ける。
   長文（.p-about__body / .p-doc）には掛けない。日本語以外は §11 で外す。
   新しい要素に詰め組みを掛けるときは、個別ルールに書かず下の2つのどちらかにセレクタを足す。 */

/* 詰め組み＋字間 0.08em（標準） */
.c-btn,
.c-head__jp,
.p-date__badge,
.p-date__lead,
.p-dl__row dd,
.p-exp__note,
.p-exh__photos-note,
.p-plan__spec dt,
.p-footer__txt {
  font-feature-settings: "palt" 1;
  letter-spacing: var(--ls-set);
}

/* 詰め組みのみ（字間は要素ごとに違うため各ルールで指定） */
.p-hero__catch,
.p-date__main,
.p-date__venue,
.c-head__en,
.p-exp__en,
.p-plan__label,
.p-plan__name,
.p-dl__row dt,
.p-gnav__link,
.p-drawer__link,
.p-lang {
  font-feature-settings: "palt" 1;
}

img { max-width: 100%; height: auto; vertical-align: bottom; }
a { color: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p, dl, dd, dt, figure { margin: 0; }
button { font: inherit; color: inherit; }

:focus-visible {
  outline: 3px solid var(--c-lime);
  outline-offset: 3px;
  border-radius: 4px;
}

.u-nw { white-space: nowrap; }
/* 字間を詰めて、2本並べた「―」がつながって見えるようにする */
.u-dash { letter-spacing: -2px; }

.u-vh {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.l-wrap {
  width: min(100% - var(--gut) * 2, var(--wrap));
  margin-inline: auto;
}
.l-wrap--narrow { max-width: var(--wrap-narrow); }

.u-br { display: inline; }
.u-br-sp { display: inline; }
.u-br-pc { display: none; }

/* ============================================================
   3. 共通パーツ
   ============================================================ */
/* --- ボタン --- */
.c-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.75em;
  min-height: 3.25rem;
  padding: 0.9em 2.2em;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  background: var(--grad-hot);
  color: var(--c-on-orange);
  font-weight: 800;
  font-size: clamp(0.9375rem, 0.9rem + 0.25vw, 1.0625rem);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: box-shadow 0.25s var(--ease-out), filter 0.25s var(--ease-out);
}
.c-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 20%, rgba(255, 255, 255, 0.55) 50%, transparent 80%);
  transform: translateX(-120%);
  transition: transform 0.6s var(--ease-out);
}
.c-btn:hover, .c-btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(255, 194, 31, 0.5), 0 0.5rem 1.75rem rgba(255, 120, 20, 0.4);
  filter: saturate(1.15) brightness(1.06);
}
.c-btn:hover::after, .c-btn:focus-visible::after { transform: translateX(120%); }
.c-btn > * { position: relative; }

.c-btn--ghost {
  background: transparent;
  color: var(--c-ink);
  box-shadow: inset 0 0 0 2px var(--c-line);
}
.c-btn--ghost:hover, .c-btn--ghost:focus-visible {
  box-shadow: inset 0 0 0 2px var(--c-lime), 0 0 1.75rem rgba(45, 212, 191, 0.3);
  filter: none;
}

/* 明色セクション用 */
.c-btn--line {
  background: transparent;
  color: #0d3a2c;
  box-shadow: inset 0 0 0 2px rgba(13, 58, 44, 0.35);
}
.c-btn--line:hover, .c-btn--line:focus-visible {
  box-shadow: inset 0 0 0 2px #0d3a2c, 0 0 1.75rem rgba(13, 58, 44, 0.2);
  filter: none;
}

.c-btn__arrow {
  flex: 0 0 auto;
  width: 1.15em;
  height: 1.15em;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.25s var(--ease-pop);
}
.c-btn:hover .c-btn__arrow, .c-btn:focus-visible .c-btn__arrow { transform: translateX(0.3em); }

/* 小サイズ（ヘッダー内） */
.c-btn--sm {
  min-height: 2.75rem;
  padding: 0.6em 1.5em;
  font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.9375rem);
}

/* --- 見出し --- */
.c-head {
  position: relative;
  text-align: center;
  /* 背景英字は行数 × line-height ぶんの高さを親で確保する（切れ防止） */
  min-height: calc(clamp(3rem, 9vw, 7.5rem) * 1.05 + 3.5rem);
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
  padding-top: clamp(1rem, 2vw, 2rem);
}
.c-head__en {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  z-index: 0;
  font-family: var(--ff-en);
  font-size: clamp(3rem, 9vw, 7.5rem);
  font-weight: 900;
  font-style: italic;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(160, 235, 205, 0.34);
  white-space: nowrap;
  pointer-events: none;
}
.c-head__jp {
  position: relative;
  z-index: 1;
  display: inline-block;
  padding-top: clamp(1.5rem, 4vw, 3.25rem);
  font-size: clamp(1.375rem, 1.1rem + 1.4vw, 2.125rem);
  font-weight: 800;
  line-height: 1.5;
}
.c-head__jp::before {
  content: "";
  display: block;
  width: 3.5rem;
  height: 5px;
  margin: 0 auto 0.9rem;
  border-radius: 999px;
  background: var(--grad-logo);
}
.c-head__lead {
  position: relative;
  z-index: 1;
  max-width: 44em;
  margin: 0.75rem auto 0;
  color: var(--c-mute);
}

/* --- リード文（色以外は全セクション共通。p-date__lead は §6-2 で個別指定） --- */
.c-head__lead,
.p-date__badge,
.p-about__msg {
  font-size: var(--fs-lead);
  font-weight: 700;
  line-height: 1.95;
}

/* --- ピル --- */
.c-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.35em 1em;
  border-radius: 999px;
  background: rgba(45, 212, 191, 0.12);
  box-shadow: inset 0 0 0 1px var(--c-line);
  color: var(--c-lime);
  font-family: var(--ff-en);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.14em;
}
.c-pill--hot {
  background: rgba(255, 138, 31, 0.14);
  box-shadow: inset 0 0 0 1px rgba(255, 138, 31, 0.4);
  color: var(--c-orange);
}

/* --- 浮遊するピクセル装飾 --- */
.c-bits {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.c-bits__i {
  position: absolute;
  width: var(--s, 18px);
  height: var(--s, 18px);
  border-radius: var(--r, 4px);
  background: var(--c, var(--c-cyan));
  opacity: var(--o, 0.4);
  animation: var(--anim, bit-float) var(--d, 9s) ease-in-out var(--dl, 0s) infinite alternate;
}

/* 位置・大きさ・色・速度は data-bit で持たせる（markup に値を書かない）
   大粒（--s 36〜56px）ほど不透明度を下げ、小粒ほど濃くして強弱をつける（グローは使わない） */
.c-bits__i[data-bit="1"]  { --s: 52px; --o: .16; --d: 11s; --dl: -0.4s; --c: var(--c-cyan);   --anim: bit-drift; left: 4%;  top: 14%; }
.c-bits__i[data-bit="2"]  { --s: 13px; --o: .55; --d: 7s;  --dl: -2.1s; --c: var(--c-lime);   left: 15%; top: 68%; }
.c-bits__i[data-bit="3"]  { --s: 9px;  --o: .62; --d: 6s;  --dl: -3.6s; --c: var(--c-orange); left: 28%; top: 9%;  }
.c-bits__i[data-bit="4"]  { --s: 40px; --o: .14; --d: 13s; --dl: -1.2s; --c: var(--c-green);  --anim: bit-spin;  --r: 10px; left: 44%; top: 82%; }
.c-bits__i[data-bit="5"]  { --s: 11px; --o: .5;  --d: 8s;  --dl: -4.8s; --c: var(--c-lime);   left: 61%; top: 18%; }
.c-bits__i[data-bit="6"]  { --s: 56px; --o: .13; --d: 12s; --dl: -2.9s; --c: var(--c-cyan);   --anim: bit-drift; --r: 14px; left: 80%; top: 58%; }
.c-bits__i[data-bit="7"]  { --s: 16px; --o: .5;  --d: 9s;  --dl: -5.5s; --c: var(--c-orange); left: 91%; top: 24%; }
.c-bits__i[data-bit="8"]  { --s: 8px;  --o: .65; --d: 5.5s; --dl: -0.9s; --c: var(--c-lime);  left: 52%; top: 46%; }
.c-bits__i[data-bit="9"]  { --s: 26px; --o: .26; --d: 10s; --dl: -3.2s; --c: var(--c-green);  --anim: bit-spin; left: 8%;  top: 86%; }
.c-bits__i[data-bit="10"] { --s: 34px; --o: .18; --d: 14s; --dl: -6.1s; --c: var(--c-lime);   --anim: bit-drift; --r: 9px; left: 69%; top: 6%;  }
.c-bits__i[data-bit="11"] { --s: 10px; --o: .6;  --d: 6.5s; --dl: -1.7s; --c: var(--c-cyan);  left: 36%; top: 34%; }
.c-bits__i[data-bit="12"] { --s: 22px; --o: .30; --d: 9.5s; --dl: -4.2s; --c: var(--c-orange); --anim: bit-spin; left: 95%; top: 78%; }
.c-bits__i[data-bit="13"] { --s: 14px; --o: .48; --d: 7.5s; --dl: -2.6s; --c: var(--c-green); left: 24%; top: 52%; }
.c-bits__i[data-bit="14"] { --s: 44px; --o: .12;  --d: 15s; --dl: -7.3s; --c: var(--c-cyan);   --anim: bit-drift; --r: 12px; left: 57%; top: 92%; }

.c-bits__i[data-bit="2"], .c-bits__i[data-bit="5"], .c-bits__i[data-bit="7"],
.c-bits__i[data-bit="11"], .c-bits__i[data-bit="13"] { animation-direction: alternate-reverse; }

/* SPは本文の上に重なる中央寄りのパーツを出さない */
@media (max-width: 767px) {
  .c-bits__i[data-bit="3"],
  .c-bits__i[data-bit="4"],
  .c-bits__i[data-bit="5"],
  .c-bits__i[data-bit="8"],
  .c-bits__i[data-bit="11"],
  .c-bits__i[data-bit="13"] { display: none; }
}

@keyframes bit-float {
  from { transform: translate3d(0, 0, 0) rotate(0deg); }
  to   { transform: translate3d(14px, -62px, 0) rotate(38deg); }
}
@keyframes bit-drift {
  from { transform: translate3d(-26px, 24px, 0) rotate(-12deg) scale(0.82); }
  to   { transform: translate3d(26px, -46px, 0) rotate(16deg) scale(1.12); }
}
@keyframes bit-spin {
  from { transform: translate3d(0, 18px, 0) rotate(0deg) scale(0.9); }
  to   { transform: translate3d(-22px, -40px, 0) rotate(180deg) scale(1.15); }
}

/* --- カーソル（マウス環境のみ） --- */
.c-cursor { display: none; }
@media (hover: hover) and (pointer: fine) {
  .c-cursor {
    position: fixed;
    left: 0; top: 0;
    z-index: 300;
    display: block;
    width: 28px; height: 28px;
    margin: -14px 0 0 -14px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(185, 242, 39, 0.9) 0%, rgba(42, 212, 245, 0.35) 60%, transparent 70%);
    mix-blend-mode: screen;
    pointer-events: none;
    transform: translate3d(var(--cx, -100px), var(--cy, -100px), 0) scale(var(--cs, 1));
    transition: transform 0.12s linear, opacity 0.2s linear;
  }
  .c-cursor.is-hot { --cs: 2.6; }
}

/* ============================================================
   4. スクロール演出
   発火: rect.top < innerHeight * 0.8 ／ 解除: 完全に画面外のときだけ
   ============================================================ */
.js-rv {
  opacity: 0;
  transform: translate3d(0, 1.5rem, 0);
  transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out);
}
.js-rv.is-in {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
/* Safari はボタンを親とは別に描き、親のフェードが効かずに最後にパッと出る。ボタン自身にも同じフェードを持たせる → DDR-024 */
.js-rv .c-btn {
  opacity: 0;
  transition: opacity 0.8s var(--ease-out), box-shadow 0.25s var(--ease-out), filter 0.25s var(--ease-out);
}
.js-rv.is-in .c-btn { opacity: 1; }

body.is-locked { overflow: hidden; }

/* ============================================================
   4-2. ローディング画面
   JS が .is-done を付けて消す。JSが動かない場合も
   loader-failsafe で必ず消えるようにしてある。
   ============================================================ */
body.is-loading { overflow: hidden; }

.p-loader {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  padding: var(--gut);
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 78% 0%, rgba(185, 242, 39, 0.22) 0%, transparent 58%),
    radial-gradient(110% 80% at 10% 100%, rgba(42, 212, 245, 0.2) 0%, transparent 58%),
    linear-gradient(168deg, #0a2b21 0%, var(--c-bg) 72%);
  animation: loader-failsafe 0.6s linear 6.5s forwards;
}
.p-loader[hidden] { display: none; }
.p-loader.is-done {
  opacity: 0;
  visibility: hidden;
  transform: scale(1.04);
  transition: opacity 0.75s var(--ease-out), transform 0.9s var(--ease-out), visibility 0.9s;
}
@keyframes loader-failsafe {
  to { opacity: 0; visibility: hidden; }
}

/* 走るグリッド */
.p-loader::before {
  content: "";
  position: absolute;
  inset: -30%;
  background-image:
    linear-gradient(to right, rgba(160, 235, 205, 0.1) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(160, 235, 205, 0.1) 1px, transparent 1px);
  background-size: 64px 64px;
  animation: loader-grid 7s linear infinite;
}
@keyframes loader-grid {
  to { transform: translate3d(-64px, -64px, 0); }
}

.p-loader__bits { position: absolute; inset: 0; }
.p-loader__bits span {
  position: absolute;
  border-radius: 4px;
  opacity: 0.5;
  animation: loader-bit 3.4s ease-in-out infinite alternate;
}
.p-loader__bits span[data-lb="1"] { left: 10%; top: 22%; width: 34px; height: 34px; background: var(--c-cyan);   animation-delay: -0.2s; }
.p-loader__bits span[data-lb="2"] { left: 84%; top: 30%; width: 18px; height: 18px; background: var(--c-lime);   animation-delay: -1.1s; }
.p-loader__bits span[data-lb="3"] { left: 20%; top: 74%; width: 12px; height: 12px; background: var(--c-orange); animation-delay: -2.0s; }
.p-loader__bits span[data-lb="4"] { left: 74%; top: 78%; width: 42px; height: 42px; background: var(--c-green);  animation-delay: -0.7s; border-radius: 10px; }
.p-loader__bits span[data-lb="5"] { left: 46%; top: 12%; width: 10px; height: 10px; background: var(--c-lime);   animation-delay: -2.6s; }
.p-loader__bits span[data-lb="6"] { left: 58%; top: 88%; width: 24px; height: 24px; background: var(--c-cyan);   animation-delay: -1.6s; }
@keyframes loader-bit {
  from { transform: translate3d(0, 20px, 0) rotate(0deg) scale(0.85); }
  to   { transform: translate3d(0, -28px, 0) rotate(45deg) scale(1.1); }
}

.p-loader__inner {
  position: relative;
  width: min(100%, 34rem);
  text-align: center;
}

.p-loader__logo {
  position: relative;
  display: block;
  margin: 0 auto clamp(1.5rem, 4vw, 2.5rem);
  overflow: hidden;
  filter: drop-shadow(0 0 2.5rem rgba(42, 212, 245, 0.5));
  animation: loader-logo 1s var(--ease-out) both;
}
.p-loader__logo img { display: block; width: 100%; }
@keyframes loader-logo {
  from { opacity: 0; transform: scale(0.92) translateY(10px); }
  to   { opacity: 1; transform: none; }
}
/* ロゴを横切る光 */
.p-loader__sweep {
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 35%, rgba(255, 255, 255, 0.75) 50%, transparent 65%);
  mix-blend-mode: screen;
  transform: translateX(-120%);
  animation: loader-sweep 2.2s var(--ease-out) 0.5s infinite;
}
@keyframes loader-sweep {
  to { transform: translateX(120%); }
}

.p-loader__meter {
  position: relative;
  height: 4px;
  border-radius: 999px;
  background: rgba(160, 235, 205, 0.18);
  overflow: hidden;
}
.p-loader__fill {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: var(--grad-logo);
  transform: scaleX(0);
  transform-origin: left;
  animation: loader-fill 2.4s cubic-bezier(0.3, 0.8, 0.3, 1) forwards;
}
@keyframes loader-fill {
  0%   { transform: scaleX(0); }
  55%  { transform: scaleX(0.72); }
  100% { transform: scaleX(1); }
}

.p-loader__status {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-top: 0.85rem;
  font-family: var(--ff-en);
  font-weight: 800;
  letter-spacing: 0.3em;
}
.p-loader__txt {
  font-size: 0.6875rem;
  color: var(--c-mute);
  animation: loader-blink 1.4s steps(2, end) infinite;
}
@keyframes loader-blink {
  50% { opacity: 0.35; }
}
.p-loader__num {
  font-size: 1.125rem;
  letter-spacing: 0.06em;
  background: var(--grad-logo);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* 下層ページ（terms / privacy）はローディング画面を出さず、
   背景の上にコンテンツがふわっと現れるだけにする */
.is-sub .p-header {
  animation: page-fade 0.7s var(--ease-out) 0.05s both;
}
.is-sub main,
.is-sub .p-footer {
  animation: page-rise 0.8s var(--ease-out) 0.05s both;
}
@keyframes page-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes page-rise {
  from { opacity: 0; transform: translate3d(0, 10px, 0); }
  to   { opacity: 1; transform: none; }
}

/* ============================================================
   5. ヘッダー
   初期状態＝KVの上に透過でのせる（ロゴ大 ＋ 言語 ＋ CTA）
   .is-stuck＝背景がついた状態（ロゴ ＋ グローバルナビ ＋ 言語 ＋ CTA）
   ============================================================ */
.p-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  transform: translate3d(0, 0, 0);
  will-change: transform;
  /* 戻り（スライドイン）はゆっくり。
     背景・影・ぼかしは transition を掛けない ＝ 画面外にいる間に一瞬で切り替える。
     ここに background-color を足すと、スライドインの最中に背景が残って点滅して見える。 */
  transition: transform 0.5s var(--ease-out);
}
/* 状態を切り替える瞬間だけ画面外へ退避する（JS が付け外し） */
.p-header.is-out {
  transform: translate3d(0, -110%, 0);
  transition: transform 0.26s cubic-bezier(0.4, 0, 1, 1);
}
.p-header.is-stuck {
  background: rgba(6, 20, 16, 0.86);
  backdrop-filter: blur(14px);
  box-shadow: 0 1px 0 var(--c-line);
}
.p-header .l-wrap {
  width: 100%;
  max-width: none;
  padding-inline: clamp(1rem, 2.5vw, 2.75rem);
}
.p-header__bar {
  display: flex;
  align-items: center;
  gap: clamp(0.75rem, 2vw, 2rem);
  align-items: flex-start;
  height: auto;
  padding-block: clamp(0.5rem, 1.2vw, 1.25rem);
}
.p-header.is-stuck .p-header__bar {
  align-items: center;
  height: clamp(4rem, 3.25rem + 2.5vw, 5.75rem);
  padding-block: 0;
}

/* 言語切替＋CTA は1グループ。初期は右上、グループ内で縦中央にそろえる */
.p-header__util {
  display: flex;
  align-items: center;
  gap: clamp(0.4rem, 1.2vw, 1rem);
  margin-left: auto;
}

/* ロゴ＝ヘッダーの縦幅いっぱい */
.p-header__logo {
  flex: 0 0 auto;
  display: block;
  width: clamp(9rem, 32vw, 46rem);
  margin: 0;
  padding-bottom: 2px;  /* 光学調整：ロゴの下グローぶん持ち上げる */
  transition: filter 0.3s var(--ease-out);
}
.p-header__logo a { display: block; }
.p-header.is-stuck .p-header__logo { width: clamp(8.5rem, 16vw, 15rem); }
.p-header__logo:hover, .p-header__logo:focus-visible { filter: brightness(1.15); }
.p-header__logo img { display: block; width: 100%; }

/* グローバルナビは背景がついてから出す */
.p-gnav { display: none; }
/* 900〜1279px はヘッダー幅が足りないため、後ろ2項目（スポンサー・お問い合わせ）は出さない */
.p-gnav__i--wide { display: none; }
@media (min-width: 1280px) {
  .p-gnav__i--wide { display: block; }
}
.p-gnav__list {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.2vw, 2.25rem);
}
.p-gnav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-decoration: none;
  white-space: nowrap;
}
.p-gnav__link::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0.4rem;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--grad-logo);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s var(--ease-out);
}
.p-gnav__link:hover::after, .p-gnav__link:focus-visible::after { transform: scaleX(1); }

/* --- 言語切り替え（日本語／英語／簡体字／繁體字）
   PC: 4分割のピル ／ SP: 現在の言語ボタン ＋ ドロップダウン --- */
.p-lang { position: relative; }

.p-lang__btn { display: none; }

.p-lang__list {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  padding: 0.25rem;
  border-radius: 999px;
  /* KV（明るい緑）の上に重なるので、文字が AA を満たす濃さまで落とす。
     0.45 だと最悪ケースで 2.83 しか出ない（2026-09-24 実測） */
  background: rgba(6, 20, 16, 0.7);
  box-shadow: inset 0 0 0 1px var(--c-line);
}
@media (min-width: 900px) {
  /* 追従バーの上では下地が濃いのでピルの背景は不要。
     SPのドロップダウンにこれが効くと本文が読めなくなるので PC 限定にする */
  .p-header.is-stuck .p-lang__list { background: transparent; }
}

.p-lang__i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.25rem;
  min-height: 2.25rem;
  padding: 0 0.6rem;
  border-radius: 999px;
  font-family: var(--ff-en);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: var(--ls-set);
  color: #dff5ec;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 0.25s var(--ease-out), color 0.25s var(--ease-out);
}
.p-lang__i:hover, .p-lang__i:focus-visible { background: rgba(160, 235, 205, 0.14); }
.p-lang__i[aria-current="true"] {
  background: var(--grad-logo);
  color: #06140f;
}
.p-lang__i[aria-current="true"]:hover { background: var(--grad-logo); }

/* 中文は端末標準の中文フォントで出す（和文フォントだと字形が異なる） */
.p-lang__i[hreflang="zh-Hans"] {
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", var(--ff-jp);
  letter-spacing: 0.04em;
}
.p-lang__i[hreflang="zh-Hant"] {
  font-family: "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", var(--ff-jp);
  letter-spacing: 0.04em;
}

.p-lang__short { display: inline; }
.p-lang__full { display: none; }

.p-header__cta { display: none; letter-spacing: normal; }
/* メールアイコンは SP だけ。PC は「CONTACT」＋矢印 */
.p-header__cta-mail { display: none; }
/* 英字は OS ごとにフォントの上下余白が違い（Mac の Helvetica Neue は上寄りに見える）、
   line-height だけでは縦中央がずれる。text-box で行ボックスを大文字の高さ〜ベースラインに切り詰め、
   字面そのものをアイコンと縦中央にそろえる（非対応ブラウザは line-height: 1 の状態で表示）。
   アイコンと英字ラベルを並べるボタンを増やすときは、ここにセレクタを足す */
.p-header__cta-txt,
.p-lang__now {
  display: block;
  line-height: 1;
  text-box: trim-both cap alphabetic;
}
.p-header__cta-txt { font-family: var(--ff-en); }

.p-header__prog {
  position: absolute;
  left: 0; bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--grad-logo);
  transform: scaleX(var(--prog, 0));
  transform-origin: left;
}

/* ハンバーガー */
.p-burger {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  width: 3rem; height: 3rem;
  padding: 0 0.6rem;
  border: 0;
  border-radius: 12px;
  background: rgba(6, 20, 16, 0.5);
  box-shadow: inset 0 0 0 1px var(--c-line);
  cursor: pointer;
}
.p-burger__l {
  display: block;
  height: 2px;
  border-radius: 2px;
  background: var(--c-ink);
  transition: transform 0.35s var(--ease-out), opacity 0.2s linear;
}
.p-burger[aria-expanded="true"] .p-burger__l:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.p-burger[aria-expanded="true"] .p-burger__l:nth-child(2) { opacity: 0; }
.p-burger[aria-expanded="true"] .p-burger__l:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* 項目が増えても縦スクロールで全部見せる。上はヘッダー高さ＋余白、下は安全領域＋余白 */
.p-drawer {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  justify-content: center;
  align-content: start;
  gap: clamp(0.5rem, 2.5vh, 1.25rem);
  padding: calc(4.25rem + clamp(1.5rem, 5vh, 3rem)) var(--gut) calc(clamp(2rem, 6vh, 3.5rem) + env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  background: linear-gradient(160deg, var(--c-bg-2), var(--c-bg));
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.4s var(--ease-out), visibility 0.4s;
}
.p-drawer.is-open { visibility: visible; opacity: 1; }
.p-drawer__link {
  display: block;
  padding: 0.4rem 0;
  font-family: var(--ff-en);
  font-size: clamp(1.375rem, 6.4vw, 2rem);
  line-height: 1.2;
  font-weight: 900;
  font-style: italic;
  text-decoration: none;
  opacity: 0;
  transform: translate3d(0, 1.5rem, 0);
  transition: opacity 0.5s var(--ease-out), transform 0.5s var(--ease-out);
}
.p-drawer.is-open .p-drawer__link {
  opacity: 1;
  transform: none;
  transition-delay: 0.1s;
}
.p-drawer.is-open .p-drawer__link:nth-child(2) { transition-delay: 0.16s; }
.p-drawer.is-open .p-drawer__link:nth-child(3) { transition-delay: 0.22s; }
.p-drawer.is-open .p-drawer__link:nth-child(4) { transition-delay: 0.28s; }
.p-drawer.is-open .p-drawer__link:nth-child(n+5) { transition-delay: 0.34s; }
.p-drawer__jp {
  display: block;
  margin-top: 0.3rem;
  font-family: var(--ff-jp);
  font-size: 0.8125rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.16em;
  color: var(--c-mute);
}

@media (min-width: 900px) {
  .p-burger, .p-drawer { display: none; }
  /* PCの「出展申込」は通常サイズのボタン（.c-btn--sm を打ち消す） */
  .p-header__cta {
    display: inline-flex;
    min-height: 3.25rem;
    padding: 0.9em 2.2em;
    font-size: clamp(0.9375rem, 0.9rem + 0.25vw, 1.0625rem);
  }
  .p-header.is-stuck .p-gnav { display: block; margin-left: auto; }
  .p-header.is-stuck .p-header__util { margin-left: clamp(1rem, 2vw, 2.25rem); }
}
@media (max-width: 899px) {
  /* SP：KVに被せず、最初から背景つきで上部固定 */
  .p-header {
    background: rgba(6, 20, 16, 0.92);
    backdrop-filter: blur(14px);
    box-shadow: 0 1px 0 var(--c-line);
  }
  .p-header .l-wrap { padding-inline: 0.5rem; }
  /* 操作要素は固定幅。余りをロゴが受け持ち、足りなければロゴだけが縮む */
  .p-header__util, .p-lang, .p-lang__i, .p-burger { flex: 0 0 auto; }
  .p-header__bar { gap: 0.45rem; }
  .p-header__util { gap: 0.4rem; }
  .p-header__bar,
  .p-header.is-stuck .p-header__bar {
    align-items: center;
    height: 4.25rem;
    padding-block: 0;
  }
  .p-header__logo,
  .p-header.is-stuck .p-header__logo {
    flex: 0 1 auto;
    padding-bottom: 5px;
    width: clamp(8rem, 44vw, 10.5rem); /* 高さ4.25remのバーに収まる上限（比率2.773） */
    min-width: 0;
  }
  .p-hero { padding-top: 4.25rem; }
  .p-hero__kv::after { display: none; }

  /* 右から ハンバーガー ← 出展申込 ← JP/EN の並び */
  .p-header__cta { display: inline-flex; }
  .p-header__cta .c-btn__arrow { display: none; }
  .p-header__cta {
    min-height: 2.25rem;
    padding: 0.4em 0.9em;
    font-size: 0.75rem;
  }
  .p-header__cta-mail {
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  /* 文字は読み上げ用に残し、見た目だけ隠す（.u-vh と同じ手法） */
  .p-header__cta-txt {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  /* SP は現在の言語ボタン ＋ ドロップダウン（4言語は横並びに入らないため） */
  .p-lang__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3em;
    min-width: 3.25rem;
    height: 2.25rem;
    padding: 0 0.6rem;
    border: 0;
    border-radius: 999px;
    /* 「出展申込」と同じ「塗りのピル」にして高さ・存在感をそろえる */
    background: var(--grad-logo);
    color: #06140f;
    font-family: var(--ff-en);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: box-shadow 0.25s var(--ease-out), filter 0.25s var(--ease-out);
  }
  .p-lang__btn:hover, .p-lang__btn:focus-visible { filter: saturate(1.15) brightness(1.06); }
  .p-lang__globe {
    width: 1.05em;
    height: 1.05em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
  }
  .p-lang.is-open .p-lang__btn {
    box-shadow: 0 0 0 3px rgba(185, 242, 39, 0.45);
  }

  .p-lang__list {
    position: absolute;
    right: 0;
    top: calc(100% + 0.5rem);
    flex-direction: column;
    align-items: stretch;
    gap: 0.1rem;
    min-width: 9.5rem;
    padding: 0.4rem;
    border-radius: 0.9rem;
    background: #0a1f19;
    backdrop-filter: blur(14px);
    box-shadow: inset 0 0 0 1px var(--c-line), 0 1rem 2rem rgba(0, 0, 0, 0.5);
    visibility: hidden;
    opacity: 0;
    transform: translate3d(0, -0.4rem, 0);
    transition: opacity 0.25s var(--ease-out), transform 0.25s var(--ease-out), visibility 0.25s;
  }
  .p-lang.is-open .p-lang__list {
    visibility: visible;
    opacity: 1;
    transform: none;
  }
  .p-lang__i {
    justify-content: flex-start;
    min-height: 2.5rem;
    padding: 0 0.9rem;
    border-radius: 0.55rem;
    font-size: 0.8125rem;
  }
  .p-lang__short { display: none; }
  .p-lang__full { display: inline; }
  .p-burger { width: 2.5rem; height: 2.5rem; padding: 0 0.45rem; gap: 5px; }
}

/* ============================================================
   6. ヒーロー（KVは最上部。PC 16:9／SP 4:3 で裁つ）
   ============================================================ */
.p-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 78% 100%, rgba(185, 242, 39, 0.2) 0%, transparent 60%),
    radial-gradient(110% 80% at 10% 100%, rgba(42, 212, 245, 0.2) 0%, transparent 60%),
    linear-gradient(180deg, #0a2b21 0%, var(--c-bg) 80%);
}

.p-hero__kv { position: relative; }
.p-hero__kv img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
/* ヘッダーを重ねるための上部スクリム */
.p-hero__kv::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: clamp(7rem, 16vw, 13rem);
  background: linear-gradient(to bottom, rgba(4, 16, 12, 0.72) 0%, rgba(4, 16, 12, 0.34) 55%, transparent 100%);
  pointer-events: none;
}
/* キャッチ：SPはKVの下、PCはKVに重ねる（ファーストビューを縮める） */
.p-hero__catch {
  position: relative;
  z-index: 2;
  margin: 0;
  padding: clamp(1rem, 4vw, 3.5rem) var(--gut);
  font-size: clamp(1.375rem, 0.5rem + 4.2vw, 4rem);
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: 0.12em;
  text-align: center;
  text-shadow: 0 0 2.5rem rgba(42, 212, 245, 0.45);
}
.p-hero__catch em {
  font-style: normal;
  background: var(--grad-logo);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

@media (min-width: 768px) {
  .u-br-sp { display: none; }
  .u-br-pc { display: inline; }
  .p-hero__catch {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    padding: clamp(4rem, 9vw, 8rem) var(--gut) clamp(1.5rem, 2.8vw, 2.75rem);
    background: linear-gradient(to top, rgba(4, 16, 12, 0.9) 0%, rgba(4, 16, 12, 0.62) 42%, rgba(4, 16, 12, 0) 100%);
  }
}

/* ============================================================
   6-2. DATE / VENUE（明色セクション）
   ============================================================ */
.p-date {
  position: relative;
  padding: clamp(3rem, 7vw, 5.5rem) 0 clamp(3.5rem, 8vw, 6rem);
  background:
    radial-gradient(70% 100% at 0% 0%, rgba(42, 212, 245, 0.16) 0%, transparent 60%),
    radial-gradient(70% 100% at 100% 100%, rgba(185, 242, 39, 0.22) 0%, transparent 60%),
    #f2fbf6;
  color: #07231a;
  text-align: center;
  overflow: hidden;
}
.p-date__badge {
  margin-bottom: clamp(0.75rem, 2vw, 1.25rem);
  color: #0f5a45;
  white-space: nowrap; /* PC・SPとも1行 */
}
.p-date__main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 0 0.1em;
  font-family: var(--ff-en);
  line-height: 1.1;
  letter-spacing: -0.01em;
}
/* 数字・年・曜日・区切りまで1つの濃いグラデーションで塗る */
.p-date__main {
  background-image: var(--grad-date);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.p-date__main > * { color: inherit; }
.p-date__main b {
  font-size: clamp(2.75rem, 1rem + 8vw, 6.5rem);
  font-weight: 900;
}
.p-date__y {
  font-size: clamp(1.5rem, 0.8rem + 3vw, 3rem);
  font-weight: 900;
}
.p-date__main small {
  margin-left: 0.18em;
  font-family: var(--ff-en);
  font-size: clamp(0.875rem, 0.65rem + 0.95vw, 1.375rem);
  font-weight: 900;
  letter-spacing: 0.04em;
}
.p-date__dash {
  padding: 0 0.15em;
  font-size: clamp(1.75rem, 0.8rem + 4vw, 4rem);
  font-weight: 900;
}
.p-date__venue {
  display: inline-block;
  margin-top: clamp(0.75rem, 2vw, 1.25rem);
  padding: 0.45em 1.5em;
  border-radius: 999px;
  background-image: var(--grad-date);
  color: #ffffff;
  font-size: clamp(1rem, 0.85rem + 0.8vw, 1.5rem);
  font-weight: 800;
  letter-spacing: 0.06em;
}
.p-date__lead {
  max-width: 64rem;
  margin: clamp(1.75rem, 4vw, 2.75rem) auto 0;
  color: #235143;
  font-size: clamp(0.875rem, 0.8rem + 0.32vw, 1.0625rem);
  font-weight: 700;
  line-height: 1.95;
}
.p-date__lead-top { display: block; }
/* ボタンはPC・SPとも同じ幅にそろえる */
.p-date__acts,
.p-exh__btns,
.p-about__link {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.875rem;
  max-width: var(--w-btns);
  margin: clamp(1.75rem, 4vw, 2.5rem) auto 0;
}
.p-date__acts .c-btn,
.p-exh__btns .c-btn,
.p-about__link .c-btn { width: 100%; }
@media (min-width: 640px) {
  .p-date__acts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 44rem;
  }
}

/* ============================================================
   7. セクション共通
   ============================================================ */
.p-sec {
  position: relative;
  padding: clamp(4.5rem, 10vw, 8.5rem) 0;
  overflow-x: clip; /* 背景英字（長い SPONSORSHIP 等）が 320px 幅で横にはみ出すのを止める */
}
.p-sec--about {
  background:
    radial-gradient(90% 60% at 85% 0%, rgba(42, 212, 245, 0.12) 0%, transparent 60%),
    var(--c-bg);
}
.p-sec--outline { background: var(--c-bg-2); }
.p-sec--about, .p-sec--outline, .p-sec--exhibit,
.p-sec--sponsor, .p-sec--partner, .p-sec--contact { text-align: center; }
.p-sec--sponsor, .p-sec--contact { background: var(--c-bg-2); }
.p-sec--about > .l-wrap { position: relative; z-index: 1; }
.p-sec--exhibit {
  background:
    radial-gradient(80% 60% at 10% 100%, rgba(255, 138, 31, 0.14) 0%, transparent 60%),
    var(--c-bg);
}

/* ABOUT */
.p-about__msg {
  position: relative;
  z-index: 1;
  max-width: var(--w-col);
  margin-inline: auto;
  font-weight: 800;
}
.p-about__body {
  position: relative;
  z-index: 1;
  max-width: var(--w-col);
  margin: clamp(2rem, 4vw, 3rem) auto 0;
  color: var(--c-mute);
  text-align: left;
}
.p-about__body p + p { margin-top: 1.25em; }

/* 開催概要 */
.p-outline__grid {
  max-width: 44em;
  margin-inline: auto;
}
.p-dl { border-top: 1px solid var(--c-line); }
.p-dl__row {
  padding: 1.25rem 0.5rem;
  border-bottom: 1px solid var(--c-line);
}
.p-dl__row dt {
  font-family: var(--ff-en);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  color: var(--c-lime);
}
.p-dl__row dd {
  margin-top: 0.3rem;
  font-weight: 600;
}
.p-dl__day {
  display: block;
  margin-top: 0.9rem;
}
.p-dl__row dd small {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--c-mute);
}

@media (min-width: 900px) {
  .p-dl { text-align: left; }
  .p-dl__row {
    display: grid;
    grid-template-columns: 10rem minmax(0, 1fr);
    gap: 0 1.75rem;
    align-items: baseline;
    padding: 1.25rem 0.25rem;
  }
  .p-dl__row dd { margin-top: 0; }
}

/* 体験できること（開催概要の末尾・5項目） */
.p-exp {
  max-width: var(--w-col);
  margin: clamp(3.5rem, 7vw, 5.5rem) auto 0;
}
.p-exp__ttl { color: var(--c-ink); }
.p-exp__lead {
  margin-top: 0.75rem;
  color: var(--c-mute);
}
/* 体験カードは l-wrap（1200px）を越えて最大1440pxまで広げる */
.p-exp__list {
  --wide: min(100vw - var(--gut) * 2, 1440px);
  width: var(--wide);
  margin-inline: calc((100% - var(--wide)) / 2);
}
.p-exp__list {
  display: grid;
  gap: 0.75rem;
  margin-top: clamp(1.75rem, 3.5vw, 2.5rem);
  text-align: left;
}
/* カードの面（体験できること・お問い合わせで共通） */
.p-exp__i,
.p-plan {
  border-radius: var(--r-card);
  background: var(--c-bg-2);
  box-shadow: inset 0 0 0 1px var(--c-line);
}
.p-exp__i {
  display: grid;
  grid-template-columns: 38% minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  padding: 0.75rem;
}
/* 3:2 の写真（体験できること・出展者募集で共通） */
.p-exp__img,
.p-exh__photo img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: var(--r-img);
}
.p-exp__en {
  font-family: var(--ff-en);
  font-size: 0.8125rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  color: var(--c-lime);
}
.p-exp__jp {
  margin-top: 0.2rem;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.7;
}
/* 写真の注記（出展者募集の注記と共通） */
.p-exp__note,
.p-exh__photos-note {
  font-size: 0.75rem;
  color: var(--c-mute);
}
.p-exp__note { margin-top: 1rem; }
@media (min-width: 768px) {
  /* 上段3・下段2を中央揃え */
  .p-exp__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
  }
  .p-exp__i {
    flex: 0 0 calc((100% - 2rem) / 3);
    grid-template-columns: 1fr;
    align-content: start;
    gap: 1rem;
    padding: 0.875rem 0.875rem 1.5rem;
    text-align: center;
  }
}

/* 出展者募集：過去開催のブース写真 */
.p-exh__photos {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  max-width: 72rem;
  margin-inline: auto;
}
.p-exh__photos-note { margin-top: 0.75rem; }
@media (min-width: 640px) {
  .p-exh__photos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
  .p-exh__photo--dup { display: none; }
}
/* 639px 以下は3枚が1列に収まらないため、横1列のまま自動で横スライドさせる。
   同じ3枚を複製して並べ、全体の半分（＝元の3枚ぶん）動かしたところで先頭に戻すと継ぎ目が出ない */
@media (max-width: 639px) {
  .p-exh__photos-view {
    overflow: hidden;
    margin-inline: calc(var(--gut) * -1);
  }
  .p-exh__photos {
    display: flex;
    gap: 0;
    width: max-content;
    max-width: none;
    animation: exh-photos-slide 36s linear infinite;
  }
  .p-exh__photo {
    flex: 0 0 auto;
    width: min(72vw, 18rem);
    padding-right: 0.75rem; /* gap だと -50% と一周の長さがずれるため padding で間隔を取る */
  }
}
@keyframes exh-photos-slide {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* お問い合わせカード（.p-contact）で使用 */
.p-plan {
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 3vw, 2.25rem);
}
.p-plan__label {
  font-family: var(--ff-en);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0.2em;
  color: var(--c-orange);
}
.p-plan__name {
  margin-top: 0.3rem;
  font-size: clamp(1.0625rem, 0.95rem + 0.5vw, 1.25rem);
  font-weight: 800;
  letter-spacing: 0.04em;
}
.p-plan__spec { margin-top: 0.9rem; }
.p-plan__spec > div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.1rem 1rem;
  padding: 0.55rem 0;
  border-bottom: 1px dashed rgba(160, 235, 205, 0.16);
  font-size: 0.875rem;
}
.p-plan__spec dt { color: var(--c-mute); }
.p-plan__spec dd { font-weight: 700; }
@media (min-width: 1000px) {
  .p-plan__spec > div { grid-template-columns: 9rem minmax(0, 1fr); }
}

/* 出展のご案内（囲みなし） */
.p-exh__cta {
  max-width: var(--w-col);
  margin: clamp(2rem, 4vw, 3rem) auto 0;
}
.p-exh__note {
  font-size: 0.875rem;
  color: var(--c-mute);
}

/* スポンサー募集 */
.p-spn__btn {
  max-width: var(--w-btns);
  margin: clamp(1.25rem, 3vw, 2rem) auto 0;
}
.p-spn__btn .c-btn { width: 100%; }
/* 主催・パートナー：ロゴは配色がまちまちなので、共通比率（約2.75:1）の白地タイルに収める */
.p-partner {
  display: grid;
  gap: clamp(2rem, 4vw, 2.5rem) 1.5rem;
  max-width: var(--w-col);
  margin-inline: auto;
}
.p-partner__ttl {
  font-size: clamp(1rem, 0.9rem + 0.4vw, 1.25rem);
  font-weight: 800;
  letter-spacing: 0.06em;
}
.p-partner__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.9rem;
}
.p-partner__tile {
  width: clamp(11.4rem, 48vw, 18rem);
  max-width: 100%; /* 768px 付近で 1fr 列より広くならないように */
  aspect-ratio: 292 / 106;
  border-radius: 0.25rem;
  background: #fff;
}
/* リンクはタイル全面をクリック範囲にするため、中央寄せと内側余白はリンク側に持たせる */
.p-partner__link,
.p-partner__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0 clamp(1.2rem, 4.8vw, 2.1rem); /* % 指定は親 ul の幅基準になるため固定値 */
  border-radius: inherit;
}
/* ロゴは「タイル内側の幅 × 高さ3.6rem」の枠に contain で収める */
.p-partner__tile img {
  width: 100%;
  height: 3.6rem;
  object-fit: contain;
  transition: transform 0.3s var(--ease-out);
}
.p-partner__link:hover img, .p-partner__link:focus-visible img { transform: scale(1.05); }
@media (min-width: 768px) {
  .p-partner { grid-template-columns: 2fr 1fr; }
}

/* Media partners: two columns on mobile, four on desktop. */
.p-partner__g--media { grid-column: 1 / -1; }
.p-partner__g--media .p-partner__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 18rem));
  justify-content: center;
}
.p-partner__g--media .p-partner__tile { width: auto; }
@media (max-width: 767px) {
  .p-partner__g--media :is(.p-partner__link, .p-partner__logo) { padding-inline: 0.75rem; }
  .p-partner__g--media .p-partner__tile img { height: min(3.6rem, 72%); } /* 2列だとタイルの高さが3.6remを割るため、タイル基準で上下に余白を残す */
}
@media (min-width: 1000px) {
  .p-partner__g--media .p-partner__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .p-partner__g--media :is(.p-partner__link, .p-partner__logo) { padding-inline: 1.25rem; }
}

/* お問い合わせ */
.p-contact {
  display: grid;
  gap: 1rem;
  max-width: var(--w-col);
  margin-inline: auto;
  text-align: left;
}
.p-contact .p-plan { background: var(--c-bg); }
.p-contact__mail {
  color: var(--c-lime);
  text-underline-offset: 0.2em;
  word-break: break-all;
}
.p-contact__mail:hover { text-decoration: none; }
.p-contact__btn {
  max-width: var(--w-btns);
  margin: clamp(1.5rem, 3vw, 2.25rem) auto 0;
}
.p-contact__btn .c-btn { width: 100%; }
@media (min-width: 768px) {
  .p-contact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============================================================
   8. フッター
   ============================================================ */
.p-footer {
  position: relative;
  padding: clamp(3.5rem, 7vw, 5.5rem) 0 2.5rem;
  background: var(--c-bg-3);
  overflow: hidden;
}
.p-footer__top {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid var(--c-line);
}
.p-footer__logo { display: block; width: min(100%, 15rem); }
.p-footer__logo img { display: block; width: 100%; }
.p-footer__txt {
  margin-top: 1rem;
  font-size: 0.875rem;
  color: var(--c-mute);
}
.p-footer__nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: 0.5rem 1.5rem;
}
.p-footer__nav a {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  font-size: 0.9375rem;
  font-weight: 700;
  text-decoration: none;
  transition: color 0.25s var(--ease-out);
}
.p-footer__nav a:hover { color: var(--c-lime); }
.p-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 1.75rem;
  font-size: 0.75rem;
  color: var(--c-mute);
}
@media (min-width: 900px) {
  .p-footer__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
}

/* ============================================================
   9. 下層ページ（利用規約・個人情報保護方針）
   ============================================================ */
.p-page {
  padding: clamp(7.5rem, 14vw, 11rem) 0 clamp(4rem, 8vw, 7rem);
  background:
    radial-gradient(90% 60% at 80% 0%, rgba(42, 212, 245, 0.12) 0%, transparent 55%),
    var(--c-bg);
}
.p-page__crumb {
  margin-bottom: 1.25rem;
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  color: var(--c-mute);
}
.p-page__crumb a { text-decoration: none; }
.p-page__crumb a:hover { color: var(--c-lime); }

.p-doc h2 {
  margin-top: clamp(2.25rem, 5vw, 3.25rem);
  margin-bottom: 0.75rem;
  padding-left: 0.9rem;
  border-left: 5px solid transparent;
  border-image: var(--grad-logo) 1;
  font-size: clamp(1.0625rem, 0.95rem + 0.5vw, 1.25rem);
  font-weight: 800;
  letter-spacing: 0.06em;
}
.p-doc h3 {
  margin-top: 1.75rem;
  margin-bottom: 0.4rem;
  font-size: 1rem;
  font-weight: 800;
  color: var(--c-lime);
}
.p-doc p { color: var(--c-mute); }
.p-doc p + p { margin-top: 1em; }
.p-doc ol, .p-doc ul { margin-top: 0.5rem; color: var(--c-mute); }
.p-doc ol { counter-reset: item; }
.p-doc ol > li {
  position: relative;
  padding-left: 2.25rem;
  margin-top: 0.4rem;
}
.p-doc ol > li::before {
  counter-increment: item;
  content: "(" counter(item) ")";
  position: absolute;
  left: 0;
  font-family: var(--ff-en);
  font-weight: 800;
  color: var(--c-cyan);
}
.p-doc ul > li {
  position: relative;
  padding-left: 1.5rem;
  margin-top: 0.4rem;
}
.p-doc ul > li::before {
  content: "";
  position: absolute;
  left: 0.25rem; top: 0.85em;
  width: 6px; height: 6px;
  border-radius: 2px;
  background: var(--c-lime);
}
.p-doc__contact a { color: var(--c-lime); }
.p-doc__date {
  margin-top: clamp(2.5rem, 5vw, 3.5rem);
  padding-top: 1.25rem;
  border-top: 1px solid var(--c-line);
  font-size: 0.8125rem;
  color: var(--c-mute);
  text-align: right;
}

/* ============================================================
   9-2. SP のリード文は改行なし・左揃え
   ============================================================ */
@media (max-width: 767px) {
  /* 長文のリードは左揃え（ABOUT・出展者募集） */
  .p-date__lead,
  .p-exp__lead,
  .p-exp__note,
  .p-exh__photos-note,
  .p-exh__note,
  .p-sec--exhibit .c-head__lead,
  .p-sec--sponsor .c-head__lead,
  .p-sec--contact .c-head__lead {
    text-align: left;
  }
  /* リード冒頭の2行は中央揃え・文字は p-date__badge と同じ大きさ */
  .p-date__lead-top {
    margin-bottom: 0.75em;
    font-size: min(var(--fs-lead), 4.6vw);
    text-align: center;
  }
  .p-footer__sep { display: none; }
  /* 1行（ABOUTは1行目）を 320px 幅でも折り返さない上限 */
  .p-date__badge { font-size: min(var(--fs-lead), 4.6vw); letter-spacing: 0.02em; }
  .p-about__msg { font-size: min(var(--fs-lead), 4.4vw); }
  /* キャッチは1行に収める */
  .p-hero__kv img { aspect-ratio: 4 / 3; }
  .p-hero__catch {
    /* 16文字 × 字間 が 92vw（左右の余白を除いた幅）に収まる上限 */
    font-size: min(5.2vw, 1.5rem);
    letter-spacing: 0.02em;
    white-space: nowrap;
  }
  /* フッターは中央揃え */
  .p-footer__brand { text-align: center; }
  .p-footer__logo { margin-inline: auto; }
  .p-footer__bottom {
    justify-content: center;
    text-align: center;
  }
}

/* ============================================================
   10. 動きを減らす設定
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  /* 自動スライドの代わりに手で横スクロールできるようにする */
  .p-exh__photos { animation: none; }
  .p-exh__photos-view { overflow-x: auto; }
  .p-exh__photo--dup { display: none; }
  *, *::before, *::after {
    animation-duration: 0.001ms;
    animation-iteration-count: 1;
    transition-duration: 0.001ms;
  }
  .js-rv, .js-rv .c-btn { opacity: 1; transform: none; }
  .p-loader { display: none; }
  .p-header, .p-header.is-out { transform: none; }
  .p-loader__fill { transform: scaleX(1); }
  .c-cursor { display: none; }
  .p-hero::before { transform: none; }
  .p-hero__kv img { transform: none; }
}

/* ============================================================
   11. 言語別の調整（en / zh-hans / zh-hant）
   ============================================================ */
/* 本文フォントは --ff-jp を言語ごとに差し替える（和文フォントのままだと中文の字形が変わる） */
html:lang(en) { --ff-jp: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Noto Sans JP", system-ui, sans-serif; }
html:lang(zh-CN) { --ff-jp: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif; }
html:lang(zh-TW) { --ff-jp: "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", system-ui, sans-serif; }
/* palt は和文用の詰め組みなので、日本語以外では外す（§2 の一覧と個別指定をまとめて打ち消す） */
html:not(:lang(ja)) * { font-feature-settings: normal; }
/* 英文は和文用の広い字間だと間延びするので詰める */
html:lang(en) .p-date__lead,
html:lang(en) .p-dl__row dd { letter-spacing: 0.01em; }
@media (min-width: 768px) {
  html:lang(en) .p-hero__catch { letter-spacing: 0.04em; }
}