/* ============================================================
   RESET & TOKENS
============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --orange:    #FF6B0A;
  --orange-d:  #D94000;
  --orange-l:  #FF9240;
  --orange-xl: #FFB870;
  --yellow:    #FFD600;
  --cream:     #FFF5EE;
  --cream-2:   #FFE8D5;
  --white:     #FFFFFF;
  --dark:      #1A0800;
  --text:      #2C1200;
  --text-2:    #7A4020;
  --r-sm:  8px;  --r-md:  16px; --r-lg:  24px;
  --r-xl:  40px; --r-2xl: 60px;
  --shadow-sm: 0 2px 12px rgba(0,0,0,.07);
  --shadow-md: 0 8px 32px rgba(0,0,0,.10);
  --shadow-lg: 0 20px 60px rgba(0,0,0,.13);
  --shadow-or: 0 8px 28px rgba(255,107,10,.25);
}

html { scroll-behavior: smooth; }
body { font-family: 'Zen Maru Gothic', sans-serif; color: var(--text); background: var(--white); overflow-x: hidden; }
img { max-width: 100%; height: auto; }

/* ============================================================
   KEYFRAMES
============================================================ */
@keyframes fadeUp  { from { opacity:0; transform:translateY(32px); } to { opacity:1; transform:none; } }
@keyframes titleIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }
@keyframes heroIn  { from { opacity:0; transform:scale(.93) translateY(14px); } to { opacity:1; transform:scale(1) translateY(0); } }
@keyframes badgePop { 0%{transform:scale(.8);opacity:0;} 70%{transform:scale(1.06);} 100%{transform:scale(1);opacity:1;} }
@keyframes ticker  { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes pulse   { 0%,100%{box-shadow:0 0 0 0 rgba(255,214,0,.5);} 50%{box-shadow:0 0 0 10px rgba(255,214,0,0);} }
@keyframes float   { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }

/* ============================================================
   PROGRESS BAR
============================================================ */
#progress-bar {
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:linear-gradient(90deg, var(--yellow), var(--orange));
  z-index:2000; transition:width .1s linear;
}

/* ============================================================
   HEADER
============================================================ */
#site-header {
  position:fixed; top:0; left:0; right:0; height:64px; z-index:1060;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 32px; background:transparent;
  transition:background .35s, box-shadow .35s;
}
#site-header.scrolled { background:rgba(255,107,10,.97); box-shadow:0 2px 20px rgba(0,0,0,.15); }
.header-logo { font-size:clamp(.82rem,2.4vw,1rem); font-weight:900; color:var(--white); text-decoration:none; letter-spacing:.06em; transition:opacity .2s; }
.header-logo:hover { opacity:.8; }
.hamburger { width:44px; height:44px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; background:none; border:none; cursor:pointer; position:relative; z-index:1061; }
.hamburger span { display:block; height:2px; background:var(--white); border-radius:2px; transition:all .35s cubic-bezier(.77,0,.175,1); }
.hamburger span:nth-child(1) { width:26px; }
.hamburger span:nth-child(2) { width:18px; }
.hamburger span:nth-child(3) { width:26px; }
.hamburger.active span:nth-child(1) { width:24px; transform:translateY(8px) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity:0; width:0; }
.hamburger.active span:nth-child(3) { width:24px; transform:translateY(-8px) rotate(-45deg); }

/* ============================================================
   NAV OVERLAY
============================================================ */
#nav-overlay {
  position:fixed; inset:0; z-index:1050;
  background:linear-gradient(160deg, var(--orange) 0%, var(--orange-d) 100%);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .4s ease;
}
#nav-overlay.open { opacity:1; pointer-events:all; }
.nav-menu { list-style:none; text-align:center; }
.nav-menu li { margin:8px 0; }
.nav-menu a { display:inline-block; font-size:clamp(1.1rem,3.5vw,1.6rem); font-weight:700; color:rgba(255,255,255,.85); text-decoration:none; padding:8px 20px; letter-spacing:.06em; position:relative; transition:color .2s, transform .2s; }
.nav-menu a::after { content:''; position:absolute; bottom:4px; left:50%; width:0; height:2px; background:var(--yellow); border-radius:2px; transform:translateX(-50%); transition:width .3s; }
.nav-menu a:hover { color:var(--white); transform:translateX(5px); }
.nav-menu a:hover::after { width:60%; }

/* ============================================================
   HERO
============================================================ */
#hero {
  min-height:100dvh; position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:52px 24px 20px; overflow:hidden;
  background:linear-gradient(155deg, #FF9A44 0%, #FF6B0A 42%, #CC2800 100%);
}
/* ドット模様（常時） */
#hero::before { content:''; position:absolute; inset:0; z-index:1; background-image:radial-gradient(rgba(255,255,255,.14) 1px, transparent 1px); background-size:30px 30px; pointer-events:none; }
/* スライドショー時のグラデーションオーバーレイ */
#hero.hero--has-slides { background:#b02a00; }
#hero.hero--has-slides::after {
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(155deg, rgba(255,154,68,.52) 0%, rgba(255,107,10,.48) 42%, rgba(180,30,0,.60) 100%);
  pointer-events:none;
}

/* ─── スライドショー ─── */
@keyframes kenBurns { from { transform:scale(1) translateX(0); } to { transform:scale(1.07) translateX(-1%); } }
.hero-slides { position:absolute; inset:0; z-index:0; }
.hero-slide {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transition:opacity 1.4s ease;
}
/* activeとkbを分離：フェードアウト中もkbアニメを維持してスケールジャンプを防ぐ */
.hero-slide.active { opacity:1; }
.hero-slide.kb { animation:kenBurns 7s ease forwards; }
/* ドットナビ */
.hero-slide-dots {
  position:absolute; bottom:24px; left:50%; transform:translateX(-50%);
  z-index:3; display:flex; gap:8px;
}
.hero-slide-dot {
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,.35); border:none; cursor:pointer;
  transition:background .3s, transform .3s;
}
.hero-slide-dot.active { background:var(--yellow); transform:scale(1.3); }

.hero-deco { position:absolute; border-radius:50%; background:rgba(255,255,255,.07); pointer-events:none; z-index:2; }
.hd1 { width:500px; height:500px; top:-180px; right:-140px; animation:float 12s ease-in-out infinite; }
.hd2 { width:300px; height:300px; bottom:-100px; left:-80px; animation:float 10s ease-in-out infinite 2s; }
.hd3 { width:150px; height:150px; top:30%; left:5%; animation:float 8s ease-in-out infinite 1s; }
.hd4 { width:80px; height:80px; bottom:25%; right:8%; background:rgba(255,214,0,.15); animation:float 7s ease-in-out infinite 3s; }
.hero-content { position:relative; z-index:3; max-width:900px; }
.hero-eyebrow { font-size:clamp(.7rem,2vw,.82rem); font-weight:500; color:rgba(255,255,255,.8); letter-spacing:.2em; margin-bottom:20px; animation:heroIn .8s cubic-bezier(.16,1,.3,1) both .05s; }
.hero-logo { max-width:min(480px,82vw); height:auto; display:block; margin:0 auto; animation:heroIn 1s cubic-bezier(.16,1,.3,1) both .18s; }
.hero-year { font-family:'Bebas Neue', sans-serif; font-size:clamp(3rem,11vw,7.5rem); color:var(--yellow); letter-spacing:.14em; line-height:1; text-shadow:4px 5px 0 rgba(180,60,0,.5); margin-bottom:20px; animation:heroIn .8s cubic-bezier(.16,1,.3,1) both .34s; }
.hero-catch { font-size:clamp(.95rem,2.6vw,1.2rem); font-weight:500; color:rgba(255,255,255,.88); line-height:2; margin-bottom:28px; animation:heroIn .8s cubic-bezier(.16,1,.3,1) both .48s; }
.hero-info-box { display:inline-flex; flex-wrap:wrap; gap:0; background:rgba(255,255,255,.16); border:1.5px solid rgba(255,255,255,.3); border-radius:var(--r-xl); overflow:hidden; margin-bottom:12px; animation:heroIn .8s cubic-bezier(.16,1,.3,1) both .62s; }
.hero-info-item { padding:20px 36px; display:flex; flex-direction:column; gap:6px; position:relative; }
.hero-info-item + .hero-info-item::before { content:''; position:absolute; left:0; top:20%; bottom:20%; width:1.5px; background:rgba(255,255,255,.22); }
.hero-info-label { font-size:.6rem; font-weight:700; letter-spacing:.2em; color:rgba(255,255,255,.7); text-transform:uppercase; }
.hero-info-note { font-size:.62rem; color:rgba(255,255,255,.7); font-weight:600; letter-spacing:.02em; }
.hero-info-val { font-size:clamp(.88rem,2.2vw,1.05rem); font-weight:900; color:var(--white); line-height:1.5; text-align:center; text-shadow:2px 3px 0 rgba(150,30,0,.45); }
@media (max-width:580px) {
  .hero-info-box { flex-direction:column; border-radius:var(--r-lg); }
  .hero-info-item + .hero-info-item::before { left:16px; right:16px; top:0; bottom:auto; width:auto; height:1.5px; }
  .hero-info-item { padding:16px 28px; }
}

/* ─── ポスター ライトボックス ─── */
.poster-lb {
  position:fixed; inset:0; z-index:9000;
  background:rgba(20,4,0,.88); backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
.poster-lb.open { opacity:1; pointer-events:all; }
.poster-lb-img {
  max-width:min(88vw,560px); max-height:88dvh;
  border-radius:var(--r-lg);
  box-shadow:0 40px 100px rgba(0,0,0,.55), 0 0 0 4px rgba(255,255,255,.15);
  transform:scale(.7) translateY(48px);
  transition:transform .45s cubic-bezier(.16,1,.3,1);
  display:block;
}
.poster-lb.open .poster-lb-img { transform:scale(1) translateY(0); }
.poster-lb-close {
  position:absolute; top:20px; right:24px;
  width:46px; height:46px; border-radius:50%; border:none;
  background:rgba(255,255,255,.15); color:var(--white);
  font-size:1.3rem; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .2s;
}
.poster-lb-close:hover { background:rgba(255,255,255,.3); transform:scale(1.12); }
.poster-card img { cursor:zoom-in; }

/* ============================================================
   TICKER
============================================================ */
.ticker-wrap { background:var(--yellow); overflow:hidden; padding:12px 0; border-top:2px solid rgba(0,0,0,.05); border-bottom:2px solid rgba(0,0,0,.05); }
.ticker-inner { display:flex; width:max-content; animation:ticker 22s linear infinite; }
.ticker-inner:hover { animation-play-state:paused; }
.ticker-item { padding:0 48px; font-size:.74rem; font-weight:700; color:var(--dark); letter-spacing:.08em; white-space:nowrap; display:flex; align-items:center; gap:16px; }
.ticker-item::before { content:'◆'; color:var(--orange); font-size:.5rem; }
/* empty ticker – keep band visible */
.ticker-inner:empty + .ticker-inner, .ticker-inner:empty { min-height:20px; }

/* ============================================================
   WAVE
============================================================ */
.wave { line-height:0; overflow:hidden; }
.wave svg { display:block; width:100%; }

/* ============================================================
   SECTION BASE
============================================================ */
.sec { padding:96px 24px; }
.sec-inner { max-width:1100px; margin:0 auto; position:relative; }
.sec-head { text-align:center; margin-bottom:60px; }
.sec-en { display:inline-block; font-size:.6rem; font-weight:700; letter-spacing:.32em; text-transform:uppercase; color:var(--orange); margin-bottom:12px; }
.sec-head h2 { font-size:clamp(1.75rem,5vw,2.9rem); font-weight:900; color:var(--dark); line-height:1.2; letter-spacing:-.02em; }
.sec-head h2 em { font-style:normal; background:linear-gradient(135deg, var(--orange), var(--orange-d)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.deco-line { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:14px; font-size:.6rem; font-weight:700; color:var(--orange); letter-spacing:.2em; }
.deco-line::before, .deco-line::after { content:''; flex:1; max-width:60px; height:1px; background:var(--orange-xl); }

/* ============================================================
   SCROLL REVEAL
============================================================ */
.fi { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.fi.on { opacity:1; transform:none; }
.fi-children > * { opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s ease; }
.fi-children.on > *:nth-child(1)  { opacity:1; transform:none; transition-delay:.04s; }
.fi-children.on > *:nth-child(2)  { opacity:1; transform:none; transition-delay:.10s; }
.fi-children.on > *:nth-child(3)  { opacity:1; transform:none; transition-delay:.16s; }
.fi-children.on > *:nth-child(4)  { opacity:1; transform:none; transition-delay:.22s; }
.fi-children.on > *:nth-child(5)  { opacity:1; transform:none; transition-delay:.28s; }
.fi-children.on > *:nth-child(6)  { opacity:1; transform:none; transition-delay:.34s; }
.fi-children.on > *:nth-child(7)  { opacity:1; transform:none; transition-delay:.40s; }
.fi-children.on > *:nth-child(n+8){ opacity:1; transform:none; transition-delay:.46s; }

/* ============================================================
   POSTER SECTION
============================================================ */
.poster-section { padding:64px 24px; background:var(--cream); }
.poster-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; max-width:1100px; margin:0 auto; }
@media (max-width:600px) { .poster-grid { grid-template-columns:1fr; gap:20px; } }
.poster-single { display:flex; justify-content:center; max-width:1100px; margin:0 auto; }
.poster-single-img { max-width:min(480px,84vw); width:100%; }
.poster-card { display:flex; flex-direction:column; align-items:center; gap:12px; }
.poster-card img { width:100%; border-radius:var(--r-lg); box-shadow:var(--shadow-lg); transition:transform .3s ease; }
.poster-card img:hover { transform:scale(1.02); }
.poster-placeholder { width:100%; aspect-ratio:3/4; background:var(--cream-2); border:2px dashed var(--cream-2); border-radius:var(--r-lg); display:flex; align-items:center; justify-content:center; color:var(--orange-xl); font-size:.8rem; font-weight:700; }

/* ============================================================
   ABOUT
============================================================ */
#about { background:var(--cream); }
.about-layout { display:grid; grid-template-columns:1fr 340px; gap:64px; align-items:start; }
@media (max-width:860px) { .about-layout { grid-template-columns:1fr; gap:44px; } }
.about-text h3 { font-size:clamp(1.15rem,3vw,1.55rem); font-weight:900; color:var(--orange); margin-bottom:24px; line-height:1.5; letter-spacing:-.01em; }
.about-text p { font-size:.97rem; line-height:2.1; color:var(--text-2); margin-bottom:16px; }
.about-author { margin-top:36px; padding:20px 24px; background:var(--white); border-left:3px solid var(--orange); border-radius:0 var(--r-sm) var(--r-sm) 0; font-size:.88rem; font-weight:700; color:var(--orange); line-height:1.8; box-shadow:var(--shadow-sm); }
.about-photo { display:flex; align-items:center; justify-content:center; }
.about-moe-img { width:100%; max-width:380px; border-radius:var(--r-xl); box-shadow:var(--shadow-lg); object-fit:cover; }
.about-photo-placeholder { width:100%; max-width:380px; aspect-ratio:3/4; background:var(--cream-2); border:2px dashed var(--cream-2); border-radius:var(--r-xl); display:flex; align-items:center; justify-content:center; color:var(--orange-xl); font-size:.8rem; font-weight:700; }

/* ============================================================
   SCHEDULE
============================================================ */
#schedule { background:var(--white); }
.tab-row { display:flex; justify-content:center; gap:0; margin-bottom:48px; background:var(--cream); border-radius:99px; padding:4px; width:fit-content; margin-left:auto; margin-right:auto; }
.tab-btn { padding:10px 34px; border:none; border-radius:99px; background:transparent; color:var(--text-2); font-family:'Zen Maru Gothic', sans-serif; font-weight:700; font-size:.88rem; letter-spacing:.04em; cursor:pointer; transition:background .25s, color .25s, box-shadow .25s; }
.tab-btn.active { background:var(--orange); color:var(--white); box-shadow:var(--shadow-or); }
.tab-panel { display:none; }
.tab-panel.active { display:block; }
.schedule-img { display:block; max-width:100%; width:100%; border-radius:var(--r-md); box-shadow:var(--shadow-md); }
.schedule-placeholder { max-width:680px; margin:0 auto; aspect-ratio:16/9; background:var(--cream); border:2px dashed var(--cream-2); border-radius:var(--r-md); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.schedule-placeholder span { font-size:.62rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--orange-xl); }
.schedule-placeholder p { font-size:.9rem; font-weight:700; color:var(--orange-xl); }

/* ─── Schedule Coming Soon ─── */
.schedule-coming-soon {
  max-width:680px; margin:0 auto;
  padding:72px 24px 80px;
  background:linear-gradient(140deg, var(--cream) 0%, var(--cream-2) 100%);
  border-radius:var(--r-lg);
  border:2.5px dashed var(--orange-xl);
  text-align:center;
  position:relative; overflow:hidden;
}
.schedule-coming-soon::before {
  content:''; position:absolute; inset:0;
  background-image:radial-gradient(var(--orange-xl) 1px, transparent 1px);
  background-size:22px 22px;
  opacity:.12; pointer-events:none;
}
.scs-note {
  display:inline-block; position:relative;
  font-size:.68rem; font-weight:700; letter-spacing:.2em;
  color:var(--white); background:var(--orange);
  padding:4px 18px; border-radius:99px;
  margin-bottom:20px;
}
.scs-title {
  font-family:'Bebas Neue', sans-serif;
  font-size:clamp(2.8rem,9vw,5rem);
  color:var(--orange); letter-spacing:.08em; line-height:1;
  text-shadow:3px 4px 0 rgba(180,60,0,.18);
  position:relative; margin-bottom:14px;
}
.scs-dots { color:var(--orange-d); }
.scs-sub {
  font-size:.88rem; font-weight:700; color:var(--text-2);
  letter-spacing:.04em; position:relative;
}

/* ─── Shops Coming Soon ─── */
.shops-coming-soon {
  padding:80px 24px;
  background:linear-gradient(140deg, var(--cream) 0%, var(--cream-2) 100%);
  border-radius:var(--r-xl);
  border:2.5px dashed var(--orange-xl);
  text-align:center;
  position:relative; overflow:hidden;
}
.shops-coming-soon::before {
  content:''; position:absolute; inset:0;
  background-image:radial-gradient(var(--orange-xl) 1px, transparent 1px);
  background-size:22px 22px;
  opacity:.12; pointer-events:none;
}
.shops-cs-icon {
  font-size:2.6rem; margin-bottom:16px; position:relative;
  animation:float 3s ease-in-out infinite;
}
.shops-cs-title {
  font-family:'Bebas Neue', sans-serif;
  font-size:clamp(2.6rem,8vw,4.5rem);
  color:var(--orange); letter-spacing:.08em; line-height:1;
  text-shadow:3px 4px 0 rgba(180,60,0,.18);
  position:relative; margin-bottom:14px;
}
.shops-cs-sub {
  font-size:.92rem; font-weight:700; color:var(--text-2);
  letter-spacing:.04em; position:relative;
}

/* ─── Shops 画像表示モード ─── */
.shops-venue-images {
  display:flex;
  flex-direction:column;
  gap:40px;
}
.shops-venue-day {
  display:flex;
  flex-direction:column;
  gap:14px;
}
.shops-venue-row {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:16px;
}
.shops-venue-block {
  display:flex;
  flex-direction:column;
  gap:8px;
}
.shops-venue-label {
  font-size:.85rem;
  font-weight:700;
  color:var(--text-2);
  letter-spacing:.06em;
  margin:0;
}
.shops-venue-img {
  width:100%;
  border-radius:var(--r-md);
  box-shadow:var(--shadow-md);
  display:block;
}
@media (max-width:560px) {
  .shops-venue-row {
    grid-template-columns:1fr;
  }
}

/* ============================================================
   PERFORMERS / SHOPS (LINEUP)
============================================================ */
#performers { background:var(--cream); }
#shops { background:var(--cream); padding-top:0; }
.lineup-cat { margin-bottom:44px; }
.lineup-cat:last-child { margin-bottom:0; }
.lineup-cat-head { display:flex; align-items:center; gap:12px; margin-bottom:20px; padding-bottom:14px; border-bottom:2px solid var(--cream-2); }
.lineup-badge { background:var(--orange); color:var(--white); font-size:.72rem; font-weight:700; padding:4px 16px; border-radius:99px; letter-spacing:.04em; white-space:nowrap; }
.lineup-cat-title { font-size:1rem; font-weight:900; color:var(--dark); }

.perf-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:16px; }
.perf-card { background:var(--white); border-radius:var(--r-md); padding:11px 7px 9px; text-align:center; box-shadow:var(--shadow-sm); transition:transform .25s, box-shadow .25s; cursor:default; }
.perf-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.perf-photo { width:100%; aspect-ratio:1; background:linear-gradient(135deg, var(--cream-2), var(--cream)); border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; margin-bottom:6px; font-size:.6rem; font-weight:700; letter-spacing:.1em; color:var(--orange-xl); border:1.5px dashed var(--cream-2); overflow:hidden; }
.perf-photo img { width:100%; height:100%; object-fit:cover; border-radius:var(--r-sm); }
.perf-card h4 { font-size:.9rem; font-weight:700; color:var(--text); }

/* ─── 注目出演者（2×2 = 4倍表示） ─── */
.perf-card--featured { grid-column: span 2; grid-row: span 2; padding:14px 10px 11px; border:2px solid var(--orange-xl); box-shadow:var(--shadow-or); }
.perf-card--featured .perf-photo { margin-bottom:8px; border-color:var(--orange-xl); }
.perf-card--featured h4 { font-size:1.15rem; font-weight:900; color:var(--orange-d); }
@media (max-width: 400px) { .perf-card--featured { grid-column: span 1; grid-row: span 1; } }

.shop-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:16px; }
.shop-card { background:var(--white); border-radius:var(--r-md); padding:11px 7px 9px; text-align:center; box-shadow:var(--shadow-sm); transition:transform .25s, box-shadow .25s; }
.shop-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.shop-photo { width:100%; aspect-ratio:1; background:linear-gradient(135deg, var(--cream-2), var(--cream)); border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; font-size:.6rem; font-weight:700; letter-spacing:.1em; color:var(--orange-xl); border:1.5px dashed var(--cream-2); overflow:hidden; margin-bottom:6px; }
.shop-photo img { width:100%; height:100%; object-fit:cover; border-radius:var(--r-sm); }
.shop-body h4 { font-size:.9rem; font-weight:700; margin-bottom:4px; color:var(--dark); }
.shop-body p  { font-size:.78rem; color:var(--text-2); line-height:1.6; }

/* ============================================================
   X TIMELINE
============================================================ */
.x-timeline-wrap { max-width:620px; margin:0 auto 36px; border-radius:var(--r-lg); overflow:hidden; border:1.5px solid var(--cream-2); box-shadow:var(--shadow-md); min-height:200px; }
.x-cta { text-align:center; }
.btn-x { display:inline-flex; align-items:center; gap:10px; background:#000; color:#fff; font-size:.9rem; font-weight:700; padding:13px 36px; border-radius:99px; text-decoration:none; letter-spacing:.04em; transition:transform .25s, box-shadow .25s, background .2s; box-shadow:0 4px 18px rgba(0,0,0,.18); }
.btn-x:hover { background:#222; transform:translateY(-3px); box-shadow:0 10px 30px rgba(0,0,0,.24); }
.btn-x-icon { font-size:1.1rem; }

/* ============================================================
   ACCESS
============================================================ */
#access { background:var(--white); }
.access-grid { display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:start; }
@media (max-width:780px) { .access-grid { grid-template-columns:1fr; } }
.access-map { border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/3; box-shadow:var(--shadow-md); }
.access-map iframe { width:100%; height:100%; border:0; display:block; }
.access-info h3 { font-size:1.2rem; font-weight:900; color:var(--orange); margin-bottom:24px; text-shadow:2px 2px 0 var(--yellow); }
.access-row { display:flex; gap:14px; align-items:flex-start; margin-bottom:18px; }
.access-icon { width:38px; height:38px; min-width:38px; background:linear-gradient(135deg, var(--orange-l), var(--orange)); border-radius:var(--r-sm); font-size:1rem; display:flex; align-items:center; justify-content:center; box-shadow:0 3px 10px rgba(255,107,10,.28); }
.access-row strong { display:block; font-size:.7rem; font-weight:700; color:var(--orange); margin-bottom:3px; letter-spacing:.06em; }
.access-row span { font-size:.88rem; color:var(--text-2); line-height:1.8; }
.access-note { margin-top:20px; padding:14px 18px; background:#FFF8E7; border-left:3px solid var(--yellow); border-radius:0 var(--r-sm) var(--r-sm) 0; font-size:.82rem; color:#7A5800; line-height:1.8; }

/* ============================================================
   VENUE MAP
============================================================ */
#venue-map { background:var(--cream); }
.venue-map-img { display:block; max-width:100%; border-radius:var(--r-lg); box-shadow:var(--shadow-lg); margin:0 auto; }
.venue-map-placeholder { max-width:860px; margin:0 auto; aspect-ratio:16/9; background:var(--white); border:2px dashed var(--cream-2); border-radius:var(--r-lg); display:flex; align-items:center; justify-content:center; color:var(--orange-xl); font-size:.9rem; font-weight:700; }

/* ============================================================
   SPONSORS
============================================================ */
#sponsors { background:var(--cream); padding:96px 24px; }
.sp-tier { margin-bottom:44px; }
.sp-tier__heading { text-align:center; font-size:.9rem; font-weight:900; color:var(--orange-d); margin-bottom:22px; letter-spacing:.04em; display:flex; align-items:center; justify-content:center; gap:18px; }
.sp-tier__heading::before, .sp-tier__heading::after { content:''; flex:1; max-width:80px; height:1.5px; background:var(--orange-xl); }
.sp-tier__items { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.sp-logo { background:var(--white); border:1.5px solid var(--cream-2); border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; overflow:hidden; transition:border-color .25s, box-shadow .25s, transform .25s; }
.sp-logo:hover { border-color:var(--orange-xl); box-shadow:var(--shadow-sm); transform:translateY(-3px); }
.sp-logo img { width:100%; height:100%; object-fit:contain; padding:10px; opacity:.85; transition:opacity .2s; }
.sp-logo:hover img { opacity:1; }
.sp-logo__placeholder { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:12px; }
.sp-logo__placeholder-name { font-weight:700; color:var(--text); text-align:center; line-height:1.4; }
.sp-logo--t1 { width:330px; height:162px; } .sp-logo--t1 .sp-logo__placeholder-name { font-size:1.1rem; }
.sp-logo--t2 { width:260px; height:128px; } .sp-logo--t2 .sp-logo__placeholder-name { font-size:.95rem; }
.sp-logo--t3 { width:204px; height:100px; } .sp-logo--t3 .sp-logo__placeholder-name { font-size:.85rem; }
.sp-logo--t4 { width:162px; height:80px;  } .sp-logo--t4 .sp-logo__placeholder-name { font-size:.78rem; }
.sp-logo--t5 { width:128px; height:62px;  } .sp-logo--t5 .sp-logo__placeholder-name { font-size:.72rem; }
@media (max-width:520px) {
  .sp-logo { height:auto !important; }
  .sp-logo--t1 { width:min(330px,82vw); aspect-ratio:330/162; }
  .sp-logo--t2 { width:min(260px,74vw); aspect-ratio:260/128; }
  .sp-logo--t3 { width:min(204px,66vw); aspect-ratio:204/100; }
  .sp-logo--t4 { width:min(162px,56vw); aspect-ratio:162/80; }
  .sp-logo--t5 { width:min(128px,46vw); aspect-ratio:128/62; }
}
.sp-text { display:inline-flex; align-items:center; justify-content:center; border-radius:var(--r-sm); font-weight:600; transition:all .2s; }
.sp-text--t6 { font-size:.9rem; padding:9px 18px; background:var(--white); border:1.5px solid var(--cream-2); color:var(--text-2); }
.sp-text--t6:hover { border-color:var(--orange-xl); color:var(--orange-d); transform:translateY(-2px); }
.sp-text--t7 { font-size:.74rem; padding:7px 14px; background:var(--white); border:1px solid var(--cream-2); color:var(--text-2); }
.sp-text--t7:hover { color:var(--orange); }
.sp-divider { border:none; border-top:1.5px solid var(--cream-2); margin:0 0 40px; }
.sp-section-label { text-align:center; font-size:1.17rem; font-weight:900; color:var(--orange-d); letter-spacing:.14em; margin-bottom:20px; }

/* ============================================================
   NEWS / BANNERS GRID
============================================================ */
.banners-section { padding:56px 24px; background:#FFEEDD; }
.banners-grid { max-width:920px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:24px; }
@media (max-width:680px) { .banners-grid { grid-template-columns:1fr; } }
.banner-card { border-radius:var(--r-xl); padding:40px 32px; text-align:center; position:relative; overflow:hidden; }
@media (max-width:560px) { .banner-card { padding:32px 22px; } }
.banner-glow { position:absolute; border-radius:50%; background:rgba(255,255,255,.1); filter:blur(40px); pointer-events:none; }
.banner-tag { display:inline-block; font-size:.62rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.8); background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.25); padding:5px 16px; border-radius:99px; margin-bottom:18px; position:relative; }
.banner-card h3 { font-size:clamp(1.4rem,4vw,2.2rem); font-weight:900; color:var(--white); margin-bottom:16px; position:relative; letter-spacing:-.01em; line-height:1.2; }
.banner-card p { color:rgba(255,255,255,.88); font-size:.92rem; line-height:1.95; margin-bottom:32px; position:relative; }
.banner-card p strong { color:var(--yellow); font-weight:700; }
.btn-white { display:inline-block; background:var(--white); color:var(--orange-d); font-size:.92rem; font-weight:700; padding:14px 50px; border-radius:99px; text-decoration:none; letter-spacing:.06em; box-shadow:0 6px 24px rgba(0,0,0,.18); transition:transform .25s, box-shadow .25s; position:relative; }
.btn-white:hover { transform:translateY(-4px); box-shadow:0 14px 40px rgba(0,0,0,.24); }

/* ============================================================
   CONTACT
============================================================ */
#contact { background:var(--cream); }
.sns-row { display:flex; justify-content:center; flex-wrap:wrap; gap:32px; margin-bottom:56px; }
.sns-link { display:flex; flex-direction:column; align-items:center; gap:10px; text-decoration:none; transition:transform .25s; }
.sns-link:hover { transform:translateY(-7px); }
.sns-icon { width:68px; height:68px; border-radius:20px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; font-weight:900; color:var(--white); box-shadow:var(--shadow-md); transition:transform .2s, box-shadow .2s; overflow:hidden; }
.sns-link:hover .sns-icon { transform:scale(1.08); box-shadow:var(--shadow-lg); }
.si-x         { background:#000; }
.si-instagram { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); }
.si-youtube   { background:#FF0000; }
.sns-icon svg { display:block; }
.sns-label  { font-size:.7rem; font-weight:700; color:var(--text-2); }
.contact-cards { display:flex; flex-direction:column; gap:12px; align-items:center; }
.contact-card { display:flex; align-items:baseline; gap:14px; background:var(--white); border-radius:var(--r-md); padding:14px 28px; text-align:left; }
@media (max-width:480px) { .contact-card { flex-direction:column; gap:4px; padding:12px 20px; width:100%; } }
.contact-card-label { font-size:.58rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--orange); flex-shrink:0; }
.contact-card a { font-size:clamp(.88rem,2.4vw,1.05rem); font-weight:700; color:var(--dark); text-decoration:none; transition:color .2s; word-break:break-all; }
.contact-card a:hover { color:var(--orange); }
.contact-card-sub { font-size:clamp(.88rem,2.4vw,1.05rem); font-weight:700; color:var(--dark); margin-left:8px; }

/* ============================================================
   FOOTER
============================================================ */
footer { background:var(--dark); padding:56px 24px 40px; text-align:center; }
.footer-logo { font-size:1.5rem; font-weight:900; color:var(--orange); margin-bottom:28px; letter-spacing:.04em; }
.footer-credits { display:inline-block; margin-bottom:28px; text-align:left; }
.fc-row { display:flex; flex-wrap:wrap; align-items:center; gap:10px 24px; margin-bottom:12px; justify-content:center; }
.fc-badge { display:inline-block; background:var(--orange); color:var(--white); font-size:1.05rem; font-weight:700; padding:4px 12px; border-radius:8px; letter-spacing:.04em; white-space:nowrap; }
.fc-val { font-size:1.23rem; color:rgba(255,255,255,.65); font-weight:500; }
.fc-val a { color:rgba(255,255,255,.65); text-decoration:none; }
.fc-val a:hover { color:var(--orange-xl); }
.fc-row--full { margin-top:4px; }
.footer-copy { font-size:.68rem; color:rgba(255,255,255,.28); margin-top:8px; }

/* ============================================================
   CHARACTER DECORATION
============================================================ */
@keyframes charFloat0 { 0%,100%{transform:translateY(0);}    50%{transform:translateY(-9px);} }
@keyframes charFloat1 { 0%,100%{transform:translateY(0);}    50%{transform:translateY(-7px);} }
@keyframes charFloat2 { 0%,100%{transform:translateY(0);}    50%{transform:translateY(-10px);} }
@keyframes charFloat3 { 0%,100%{transform:translateY(0);}    50%{transform:translateY(-6px);} }
@keyframes charFloat0f { 0%,100%{transform:scaleX(-1) translateY(0);}  50%{transform:scaleX(-1) translateY(-9px);} }
@keyframes charFloat1f { 0%,100%{transform:scaleX(-1) translateY(0);}  50%{transform:scaleX(-1) translateY(-7px);} }
@keyframes charFloat2f { 0%,100%{transform:scaleX(-1) translateY(0);}  50%{transform:scaleX(-1) translateY(-10px);} }
@keyframes charFloat3f { 0%,100%{transform:scaleX(-1) translateY(0);}  50%{transform:scaleX(-1) translateY(-6px);} }

.char-deco { position:absolute; z-index:10; pointer-events:none; }
.char-deco img { display:block; width:100%; height:auto; filter:drop-shadow(2px 6px 10px rgba(0,0,0,.18)); }

/* 位置: sec-inner基点（コンテンツ領域の端に近接配置） */
.char-deco--slot0 { top:20px;    right:-28px; animation:charFloat0 3.8s ease-in-out infinite; }
.char-deco--slot1 { top:20px;    left:-28px;  animation:charFloat1 4.2s ease-in-out infinite .6s; }
.char-deco--slot2 { bottom:20px; right:-28px; animation:charFloat2 3.5s ease-in-out infinite 1.2s; }
.char-deco--slot3 { bottom:20px; left:-28px;  animation:charFloat3 4.6s ease-in-out infinite 1.9s; }

/* 左右反転 */
.char-deco--flip.char-deco--slot0 { animation-name:charFloat0f; }
.char-deco--flip.char-deco--slot1 { animation-name:charFloat1f; }
.char-deco--flip.char-deco--slot2 { animation-name:charFloat2f; }
.char-deco--flip.char-deco--slot3 { animation-name:charFloat3f; }
.char-deco--flip img { transform:scaleX(-1); }

/* サイズ */
.char-deco--sm { width:80px; }
.char-deco--md { width:120px; }
.char-deco--lg { width:160px; }
.char-deco--xl { width:220px; }

/* ヒーロー: #hero基点（sec-innerなし）なので個別に指定 */
#hero .char-deco--slot0 { right:20px; }
#hero .char-deco--slot1 { left:20px; }
#hero .char-deco--slot2 { right:20px; bottom:56px; }
#hero .char-deco--slot3 { left:20px;  bottom:56px; }

/* バナー黄色文字装飾 */
.banner-card .hl-yellow { color:var(--yellow); text-shadow:0 1px 5px rgba(0,0,0,.6); font-weight:700; }

/* スマホ: サイズ縮小・端に寄せる */
@media (max-width:900px) {
  .char-deco--slot0, .char-deco--slot2 { right:0; }
  .char-deco--slot1, .char-deco--slot3 { left:0; }
  #hero .char-deco--slot0, #hero .char-deco--slot2 { right:8px; }
  #hero .char-deco--slot1, #hero .char-deco--slot3 { left:8px; }
}
@media (max-width:768px) {
  .char-deco--xl { width:130px; }
  .char-deco--lg { width:100px; }
  .char-deco--md { width:76px; }
  .char-deco--sm { width:54px; }
}
@media (max-width:480px) {
  .char-deco--slot2, .char-deco--slot3 { display:none; }
  .char-deco--xl { width:90px; }
  .char-deco--lg { width:70px; }
}

/* ============================================================
   GO TOP
============================================================ */
#go-top { position:fixed; bottom:28px; right:28px; width:50px; height:50px; background:linear-gradient(135deg, var(--orange-l), var(--orange-d)); color:var(--white); border:none; border-radius:50%; font-size:1.35rem; cursor:pointer; box-shadow:var(--shadow-or); opacity:0; transform:translateY(18px); transition:opacity .3s, transform .3s, box-shadow .2s; z-index:900; display:flex; align-items:center; justify-content:center; }
#go-top.show { opacity:1; transform:none; }
#go-top:hover { transform:translateY(-3px) !important; box-shadow:0 14px 40px rgba(255,107,10,.4); }