:root{
  --bg:#09060f;
  --bg2:#120818;
  --text:#fff;
  --muted:rgba(255,255,255,.72);
  --pink:#ff4da3;
  --pink2:#ff8acb;
  --purple:#8b5cff;
  --cyan:#6fdcff;
  --card:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at 12% 7%, rgba(161,59,205,.25), transparent 30%),
    radial-gradient(circle at 88% 17%, rgba(32,99,196,.20), transparent 33%),
    linear-gradient(180deg,var(--bg) 0%,var(--bg2) 42%,#08070d 100%);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  line-height:1.8;
}
a{color:inherit}
img{display:block;width:100%}
.container{width:min(1120px,calc(100% - 36px));margin:auto}
.header{
  position:fixed;inset:0 0 auto 0;z-index:50;
  background:rgba(7,4,12,.62);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.08)
}
.header-inner{height:64px;display:flex;align-items:center;justify-content:space-between;width:min(1180px,calc(100% - 28px));margin:auto}
.logo{font-size:13px;font-weight:800;letter-spacing:.13em;white-space:nowrap}
.header-entry{
  padding:8px 17px;border-radius:999px;text-decoration:none;font-weight:800;font-size:13px;
  background:linear-gradient(135deg,var(--pink),var(--purple));
  box-shadow:0 0 24px rgba(255,77,163,.28)
}
.hero{
  position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding-top:64px
}
.hero picture,.hero-bg{position:absolute;inset:0;width:100%;height:100%}
.hero-bg{object-fit:cover;object-position:center}
.hero::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(8,5,14,.92) 0%,rgba(8,5,14,.70) 28%,rgba(8,5,14,.18) 59%,rgba(8,5,14,.10) 100%),
    linear-gradient(180deg,rgba(0,0,0,.15),rgba(7,5,13,.90) 92%,#09060f 100%)
}
.sparkles{
  position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.24;
  background-image:radial-gradient(circle,rgba(255,255,255,.8) 1px,transparent 1.4px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,black,transparent 76%)
}
.hero-content{
  position:relative;z-index:3;width:min(650px,calc(100% - 40px));margin-left:max(4vw,calc((100vw - 1180px)/2));
  padding:50px 0 90px
}
.kicker{font-size:13px;letter-spacing:.30em;color:var(--pink2);font-weight:700;margin-bottom:15px}
.hero h1{font-size:clamp(46px,6.5vw,92px);line-height:.93;letter-spacing:-.055em;margin:0;font-weight:900;text-shadow:0 0 30px rgba(255,77,163,.18)}
.hero h1 span{display:block;font-size:.48em;letter-spacing:.12em;margin-top:.27em;color:#ff95d1}
.names{font-size:clamp(21px,2.7vw,34px);font-weight:800;letter-spacing:.10em;margin-top:28px}
.date{font:800 clamp(27px,4vw,43px)/1.2 Arial,sans-serif;letter-spacing:.08em;margin-top:22px}
.venue{font-size:clamp(14px,1.8vw,19px);letter-spacing:.14em;color:var(--muted);margin-top:3px}
.cta{display:inline-block;position:relative;overflow:hidden;margin-top:35px;min-width:min(480px,90vw);padding:17px 28px;text-align:center;text-decoration:none;border-radius:999px;font-size:clamp(18px,2vw,22px);font-weight:900;letter-spacing:.04em;background:linear-gradient(135deg,#ff2c8f,#ff70c0 45%,#8e59ff);box-shadow:0 15px 40px rgba(255,44,143,.34);transition:.2s}
.cta:hover{transform:translateY(-3px)}
.cta::after{content:"";position:absolute;top:-90%;left:-35%;width:24%;height:280%;transform:rotate(22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);animation:shine 4.3s infinite}
@keyframes shine{0%,68%{left:-35%}88%,100%{left:140%}}
.cta-note{font-size:12px;color:rgba(255,255,255,.62);margin-top:9px;text-align:center;max-width:480px}
.section{padding:105px 0}
.section-title{text-align:center;margin-bottom:48px}
.section-title small{display:block;font-size:11px;letter-spacing:.32em;color:var(--pink2);font-weight:800}
.section-title h2{font-size:clamp(31px,5vw,50px);line-height:1.25;margin:7px 0 0}
.story{
  position:relative;min-height:640px;display:flex;align-items:center;overflow:hidden;
}
.story-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.story::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,6,11,.92) 0%,rgba(8,6,11,.74) 34%,rgba(8,6,11,.20) 66%,rgba(8,6,11,.05) 100%),linear-gradient(180deg,#09060f 0%,transparent 12%,transparent 82%,#09060f 100%)}
.story-copy{position:relative;z-index:2;max-width:580px;padding:90px 0}
.story-copy .eyebrow{font-size:12px;letter-spacing:.3em;color:var(--pink2);font-weight:800}
.story-copy h2{font-size:clamp(34px,5vw,62px);line-height:1.25;margin:15px 0 24px}
.story-copy p{color:var(--muted);font-size:clamp(15px,1.8vw,18px)}
.info-card{max-width:860px;margin:auto;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));box-shadow:0 30px 70px rgba(0,0,0,.24)}
.info-row{display:grid;grid-template-columns:170px 1fr;border-bottom:1px solid rgba(255,255,255,.08)}
.info-row:last-child{border-bottom:0}
.info-label,.info-value{padding:19px 22px}
.info-label{font-weight:800;color:var(--pink2)}
.info-value{font-weight:600}
.entry-zone{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 84% 8%, rgba(70,70,180,.16), transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.015),rgba(255,255,255,.005));
}
.entry-inner{position:relative;z-index:2}
.entry-visual{
  position:relative;
  min-height:560px;
  margin-bottom:46px;
  overflow:hidden;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 90px rgba(0,0,0,.32);
}
.entry-visual-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.entry-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,
      rgba(8,5,14,.96) 0%,
      rgba(8,5,14,.88) 24%,
      rgba(8,5,14,.58) 42%,
      rgba(8,5,14,.18) 60%,
      rgba(8,5,14,.04) 100%),
    linear-gradient(180deg,
      rgba(8,5,14,.10) 0%,
      rgba(8,5,14,.04) 72%,
      rgba(8,5,14,.28) 100%);
}
.entry-copy{
  position:relative;
  z-index:2;
  width:min(48%,540px);
  min-width:420px;
  padding:72px 0 62px 54px;
}
.entry-copy .section-title{
  text-align:left;
  margin-bottom:30px;
}
.entry-intro{
  max-width:520px;
  color:var(--muted);
  margin:0;
}
.entry-details{
  position:relative;
  z-index:2;
}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.step{padding:24px 18px;background:rgba(13,9,19,.66);border:1px solid rgba(255,255,255,.13);border-radius:18px;backdrop-filter:blur(8px)}
.step-num{width:39px;height:39px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--pink),var(--purple));font-weight:900;margin-bottom:12px}
.step h3{margin:0 0 8px;font-size:16px}
.step p{margin:0;color:rgba(255,255,255,.68);font-size:13px;line-height:1.7}
.notice{max-width:760px;margin:34px 0;padding:18px 22px;border:1px solid rgba(255,100,183,.38);border-radius:16px;background:rgba(255,51,143,.075)}
.notice strong{color:#ff9bd2}
.entry-zone .cta{margin-top:0}
.offstage{background:linear-gradient(180deg,rgba(255,255,255,.02),transparent)}
.cast-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch}
.cast-card{height:100%;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.055);box-shadow:0 24px 70px rgba(0,0,0,.20)}
.cast-photo{aspect-ratio:4/5;object-fit:cover}
.cast-card:first-child .cast-photo{object-position:center 38%}
.cast-card:last-child .cast-photo{object-position:center 38%}
.cast-copy{padding:24px 25px 28px}
.cast-copy .off{font-size:11px;letter-spacing:.28em;color:var(--pink2);font-weight:800}
.cast-copy h3{font-size:clamp(28px,4vw,40px);margin:5px 0 13px}
.cast-copy p{margin:0;color:var(--muted)}
.gallery{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;align-items:stretch}
.gallery figure{margin:0;overflow:hidden;border-radius:24px;border:1px solid var(--line);background:rgba(255,255,255,.04);min-height:430px}
.gallery img{height:100%;object-fit:cover}
.gallery figure:first-child img{object-position:center}
.gallery figure:last-child img{object-position:center}
.final{padding:120px 20px;text-align:center;background:radial-gradient(circle at center,rgba(255,62,157,.18),transparent 58%)}
.final h2{font:900 clamp(42px,8vw,78px)/1 Arial,sans-serif;letter-spacing:.06em;margin:0 0 18px}
.final p{color:var(--muted);margin:0 0 10px}
footer{padding:38px 20px 46px;text-align:center;border-top:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.48);font-size:12px}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .9s cubic-bezier(.2,.75,.25,1),transform .9s cubic-bezier(.2,.75,.25,1)}
.reveal.show{opacity:1;transform:none}
@media(max-width:760px){
  .header-inner{height:58px}.logo{font-size:11px}.header-entry{padding:6px 12px}
  .hero{padding-top:58px;min-height:100svh;align-items:flex-end}
  .hero-bg{object-position:center top}
  .hero::after{
    background:
      linear-gradient(180deg,rgba(7,5,12,.12) 0%,rgba(7,5,12,.15) 38%,rgba(7,5,12,.80) 65%,rgba(7,5,12,.98) 100%),
      linear-gradient(90deg,rgba(7,5,12,.34),rgba(7,5,12,.08))
  }
  .hero-content{margin:0 auto;width:calc(100% - 30px);padding:0 0 54px;text-align:center}
  .kicker{font-size:11px;margin-bottom:10px}.hero h1{font-size:clamp(45px,15vw,67px)}
  .names{font-size:20px;margin-top:19px}.date{font-size:30px;margin-top:15px}.venue{font-size:13px}
  .cta{min-width:100%;margin-top:25px;padding:15px 20px}.cta-note{max-width:none}
  .section{padding:78px 0}
  .story{min-height:620px;align-items:flex-end}
  .story-img{object-position:68% center}
  .story::after{background:linear-gradient(180deg,rgba(8,6,11,.18),rgba(8,6,11,.20) 36%,rgba(8,6,11,.92) 72%,#09060f 100%)}
  .story-copy{padding:300px 0 58px;text-align:center}
  .story-copy h2{font-size:38px}
  .info-row{grid-template-columns:104px 1fr}.info-label,.info-value{padding:15px 12px;font-size:14px}
  .entry-visual{
    min-height:650px;
    margin-bottom:34px;
    border-radius:18px;
  }
  .entry-visual-bg{
    object-position:69% center;
  }
  .entry-visual::after{
    background:
      linear-gradient(180deg,
        rgba(8,5,14,.08) 0%,
        rgba(8,5,14,.12) 34%,
        rgba(8,5,14,.80) 66%,
        rgba(8,5,14,.97) 100%);
  }
  .entry-copy{
    width:auto;
    min-width:0;
    padding:340px 18px 34px;
    text-align:center;
  }
  .entry-copy .section-title{
    text-align:center;
    margin-bottom:24px;
  }
  .entry-intro{
    text-align:center;
    margin-left:auto;
    margin-right:auto;
  }
  .steps{grid-template-columns:1fr}.step{display:grid;grid-template-columns:48px 1fr;column-gap:10px}.step-num{grid-row:1/3;margin:0}.step h3{margin-top:1px}
  .notice{margin-left:auto;margin-right:auto;text-align:center}
  .cast-grid{grid-template-columns:1fr}.cast-photo{aspect-ratio:1/1.1}
  .gallery{grid-template-columns:1fr}.gallery figure{min-height:330px}
  .reiwa-grid{grid-template-columns:1fr;gap:24px}
  .reiwa-photo img{aspect-ratio:16/11}
  .reiwa-copy{padding-top:0}
}


@media(max-width:980px) and (min-width:761px){
  .entry-visual{min-height:520px}
  .entry-copy{
    width:50%;
    min-width:360px;
    padding:58px 0 50px 38px;
  }
  .entry-copy .section-title h2{font-size:clamp(34px,4.2vw,46px)}
  .entry-intro{font-size:14px}
}
/* =====================================================
   HERO INTRO ANIMATION
   旧版の動き（index(6).html）を再現
   ※開始だけは現行版同様、ページ読込後にJSでトリガー
===================================================== */
.hero .kicker,
.hero h1,
.hero .names,
.hero .date,
.hero .venue,
.hero .cta,
.hero .cta-note{
  opacity:0;
  transform:translateY(18px);
  filter:blur(5px);
}

.hero.hero-start .kicker,
.hero.hero-start h1,
.hero.hero-start .names,
.hero.hero-start .date,
.hero.hero-start .venue,
.hero.hero-start .cta,
.hero.hero-start .cta-note{
  animation:heroIntro .85s cubic-bezier(.2,.75,.25,1) forwards;
}

.hero.hero-start .kicker{animation-delay:.10s}
.hero.hero-start h1{animation-delay:.25s}
.hero.hero-start .names{animation-delay:.58s}
.hero.hero-start .date{animation-delay:.88s}
.hero.hero-start .venue{animation-delay:1.05s}
.hero.hero-start .cta{animation-delay:1.25s}
.hero.hero-start .cta-note{animation-delay:1.38s}

@keyframes heroIntro{
  from{
    opacity:0;
    transform:translateY(18px);
    filter:blur(5px);
  }
  to{
    opacity:1;
    transform:translateY(0);
    filter:blur(0);
  }
}

/* ENTRYボタンのキラリンは現行の速め設定を維持 */
.cta::after{
  animation:shine 2.6s ease-in-out infinite;
  animation-delay:.7s;
}

/* =====================================================
   ABOUT "REIWA USHIROYUBI"
===================================================== */
.reiwa-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
  gap:38px;
  align-items:center;
}
.reiwa-photo{
  margin:0;
  overflow:hidden;
  border-radius:24px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  box-shadow:0 24px 70px rgba(0,0,0,.18);
}
.reiwa-photo img{
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  object-position:center;
}
.reiwa-copy{padding:8px 0}
.reiwa-copy .eyebrow{
  font-size:11px;
  letter-spacing:.28em;
  color:var(--pink2);
  font-weight:800;
}
.reiwa-copy h2{
  margin:7px 0 20px;
  font-size:clamp(29px,4.2vw,44px);
  line-height:1.28;
}
.reiwa-copy p{
  margin:0 0 17px;
  color:var(--muted);
  font-size:clamp(14px,1.55vw,16.5px);
  line-height:1.9;
}
.reiwa-copy .not-unit{
  margin:22px 0;
  padding:13px 15px;
  border-left:3px solid var(--pink2);
  background:rgba(255,255,255,.045);
  color:#fff;
  font-weight:800;
  line-height:1.7;
}
.reiwa-copy .closing{
  margin-top:22px;
  color:#fff;
  font-size:clamp(17px,2vw,21px);
  font-weight:800;
  line-height:1.7;
}

/* =====================================================
   MAIL NOTICE
===================================================== */
.mail-caution{
  max-width:760px;
  margin:18px 0 0;
  padding:16px 18px;
  border-left:3px solid var(--pink2);
  background:rgba(255,255,255,.045);
  border-radius:0 12px 12px 0;
  color:rgba(255,255,255,.74);
  font-size:12px;
  line-height:1.75;
}
.mail-caution strong{color:#fff}


/* =====================================================
   FINAL POLISH
   控えめな動き・ライブ感・視線誘導
===================================================== */

/* スクロールするとヘッダーを少し濃くして読みやすく */
.header{
  transition:background .32s ease, box-shadow .32s ease, border-color .32s ease;
}
.header.is-scrolled{
  background:rgba(7,4,12,.90);
  border-bottom-color:rgba(255,255,255,.13);
  box-shadow:0 10px 30px rgba(0,0,0,.20);
}

/* HEROの奥で、青紫〜ピンクの光がごくゆっくり動く */
.hero::before{
  content:"";
  position:absolute;
  inset:-12%;
  z-index:1;
  pointer-events:none;
  opacity:.34;
  background:
    radial-gradient(circle at 73% 27%, rgba(88,117,255,.52) 0%, transparent 25%),
    radial-gradient(circle at 85% 58%, rgba(255,52,157,.35) 0%, transparent 23%),
    radial-gradient(circle at 52% 12%, rgba(177,86,255,.18) 0%, transparent 22%);
  filter:blur(22px);
  transform:translate3d(0,0,0) scale(1.03);
  animation:heroLightDrift 24s ease-in-out infinite alternate;
}
.hero::after{z-index:1}
.sparkles{z-index:2}
.hero-content{z-index:3}

@keyframes heroLightDrift{
  0%{
    transform:translate3d(-1.5%,-1%,0) scale(1.03);
    opacity:.21;
  }
  50%{
    transform:translate3d(1.8%,1.4%,0) scale(1.07);
    opacity:.31;
  }
  100%{
    transform:translate3d(-.4%,2.1%,0) scale(1.04);
    opacity:.24;
  }
}

/* LIVE INFORMATION：開催日だけ一段強く */
.info-date-row .info-value{
  font-size:clamp(18px,2.2vw,24px);
  font-weight:900;
  letter-spacing:.04em;
  color:#fff;
  text-shadow:0 0 18px rgba(255,77,163,.16);
}
.info-date-row .info-label{
  color:#ffadd8;
}

/* ENTRY STEP：PCでは1→2→3→4の流れを見える化 */
.steps{
  position:relative;
}
.step{
  position:relative;
  z-index:1;
  transition:transform .22s ease, border-color .22s ease, background .22s ease;
}
.step:hover{
  transform:translateY(-3px);
  border-color:rgba(255,105,187,.34);
  background:rgba(20,12,27,.76);
}
@media(min-width:761px){
  .step:not(:last-child)::after{
    content:"→";
    position:absolute;
    top:28px;
    right:-13px;
    z-index:4;
    width:26px;
    text-align:center;
    color:rgba(255,151,210,.66);
    font-size:19px;
    font-weight:800;
    text-shadow:0 0 12px rgba(255,80,170,.25);
    pointer-events:none;
  }
}

/* CAST：写真だけ、ほんの少しズーム */
.cast-photo{
  transition:transform .65s cubic-bezier(.2,.75,.25,1), filter .65s ease;
}
.cast-card:hover .cast-photo{
  transform:scale(1.025);
  filter:saturate(1.03);
}

/* 「令和うしろゆび」の原点の日付を軽く強調 */
.origin-date{
  color:#fff;
  font-weight:800;
  white-space:nowrap;
  text-shadow:0 0 18px rgba(255,83,171,.25);
}
.yubi-mark{
  display:inline-block;
  margin-left:.32em;
  color:rgba(255,255,255,.40);
  font-size:1.18em;
  transform:translateY(.04em);
}

/* 最後のCTA：ライブ写真をほぼシルエット程度に */
.final{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#09060f;
}
.final::before{
  content:"";
  position:absolute;
  inset:-4%;
  z-index:-2;
  background:url("../img/live-hero.jpg") center 43% / cover no-repeat;
  opacity:.16;
  filter:saturate(.85) contrast(1.08);
  transform:scale(1.04);
}
.final::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at center,rgba(255,62,157,.22),transparent 48%),
    linear-gradient(180deg,rgba(8,5,14,.72),rgba(8,5,14,.94));
}

/* 動きを減らす設定では演出を止める */
/* =====================================================
   WIDE PHOTO ENTRY ANIMATION
===================================================== */

/* 写真は下からではなく、ゆっくりフェード＋わずかなズーム */
.entry-photo-reveal{
  opacity:0;
  transform:scale(1.055);
  transition:
    opacity 1.15s ease,
    transform 1.35s cubic-bezier(.2,.75,.25,1);
}
.entry-photo-reveal.show{
  opacity:1;
  transform:scale(1);
}

/* 見出し→説明文の順に少し時間差で */
.entry-title-reveal{
  transition-delay:.10s;
}
.entry-intro-reveal{
  transition-delay:.34s;
}

/* STEPは少し遅れて続く */
.entry-details > .steps.reveal{
  transition-delay:.18s;
}
.entry-details > .notice.reveal{
  transition-delay:.10s;
}

/* スマホでも同じ順番で自然に見せる */
@media(max-width:760px){
  .entry-title-reveal{transition-delay:.06s}
  .entry-intro-reveal{transition-delay:.22s}
}



/* =====================================================
   MOBILE TUNING — FULL WIDTH IMAGES
===================================================== */

/* ENTRY本文はPC/スマホとも左揃え */
.entry-intro{ text-align:left; }

/* 購入までの流れ */
.flow-heading{
  margin:0 0 24px;
  text-align:center;
  font-size:clamp(22px,3vw,30px);
  line-height:1.35;
  letter-spacing:.04em;
}

.notice{ text-align:left; }

/* ABOUT: desktop = 見出し → 写真＋本文 */
.reiwa-layout{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
  gap:38px;
  align-items:center;
}
.reiwa-heading{ grid-column:1 / -1; }
.reiwa-layout .reiwa-photo{ grid-column:1; }
.reiwa-layout .reiwa-copy{ grid-column:2; }
.reiwa-photo img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/10;
  object-fit:cover;
  object-position:center;
}

@media(max-width:760px){

  /* ---------- HERO ---------- */
  .hero{
    min-height:100svh;
    padding-top:58px;
    align-items:flex-end;
  }

  /* 画像は画面幅いっぱい。文字は下側へ逃がす */
  .hero picture{
    top:58px;
    left:0;
    right:0;
    bottom:auto;
    width:100%;
    height:auto;
    aspect-ratio:4/5;
  }
  .hero-bg{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:43% top;
  }
  .hero::after{
    background:
      linear-gradient(180deg,
        rgba(7,5,12,.01) 0%,
        rgba(7,5,12,.06) 38%,
        rgba(7,5,12,.74) 59%,
        rgba(7,5,12,.97) 79%,
        #09060f 100%),
      linear-gradient(90deg,rgba(7,5,12,.10),rgba(7,5,12,.02));
  }
  .hero-content{
    width:calc(100% - 26px);
    margin:0 auto;
    padding:0 0 20px;
    text-align:center;
  }
  .kicker{font-size:10px;margin-bottom:5px}
  .hero h1{
    font-size:clamp(34px,10.7vw,42px);
    line-height:.82;
    letter-spacing:-.045em;
    white-space:nowrap;
  }
  .hero h1 span{
    margin-top:.10em;
    line-height:.88;
  }
  .names{font-size:17px;margin-top:9px;line-height:1.25}
  .date{font-size:25px;margin-top:7px;line-height:1.05}
  .venue{font-size:11px;margin-top:1px;line-height:1.25}
  .hero .cta{
    min-width:100%;
    margin-top:13px;
    padding:12px 18px;
    font-size:16px;
  }
  .hero .cta-note{margin-top:4px;line-height:1.3}

  /* ---------- あのひとときを、もう一度 ---------- */
  .story{
    min-height:0;
    display:block;
    padding:26px 0 46px;
  }
  .story-img{
    position:relative;
    inset:auto;
    width:100vw;
    max-width:none;
    height:auto;
    aspect-ratio:4/3;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    object-fit:cover;
    object-position:68% center;
    border-radius:0;
  }
  .story::after{
    background:
      linear-gradient(180deg,
        transparent 0%,
        transparent 53%,
        rgba(9,6,15,.38) 72%,
        #09060f 100%);
    pointer-events:none;
  }
  .story .container{position:relative;z-index:2}
  .story-copy{
    max-width:none;
    padding:17px 4px 0;
    text-align:center;
  }
  .story-copy .eyebrow{margin-bottom:4px}
  .story-copy h2{
    margin:7px 0 15px;
    font-size:34px;
    line-height:.98;
  }
  .story-copy p{margin:0;line-height:1.72}

  /* ---------- ENTRYワイドフォト ---------- */
  .entry-visual{
    min-height:0;
    margin-bottom:32px;
    overflow:visible;
    border:0;
    border-radius:0;
    box-shadow:none;
    background:transparent;
  }
  .entry-visual::after{display:none}
  .entry-visual-bg{
    position:relative;
    inset:auto;
    display:block;
    width:100vw;
    max-width:none;
    height:auto;
    aspect-ratio:16/11;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    margin-bottom:24px;
    object-fit:cover;
    object-position:center;
    border-radius:0;
    box-shadow:none;
  }
  .entry-copy{
    width:auto;
    min-width:0;
    padding:0 4px;
    text-align:left;
  }
  .entry-copy .section-title{
    text-align:center;
    margin-bottom:19px;
  }
  .entry-copy .section-title h2{line-height:1.05}
  .entry-intro{
    max-width:none;
    margin:0;
    text-align:left;
    line-height:1.75;
  }

  .flow-heading{
    margin:4px 0 22px;
    font-size:24px;
  }

  .notice{
    margin-left:auto;
    margin-right:auto;
    text-align:left;
    line-height:1.75;
  }

  /* ---------- CAST ---------- */
  /* プロフィール写真だけはカード内の余白・角丸を維持 */
  .cast-card .cast-photo{
    width:100%;
    margin:0;
  }

  /* ---------- 「令和うしろゆび」とは ---------- */
  .reiwa-layout{
    display:flex;
    flex-direction:column;
    gap:0;
  }

  /* スマホは 写真 → 見出し → 本文 */
  .reiwa-layout .reiwa-photo{
    order:1;
    width:100vw;
    max-width:none;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    margin-bottom:27px;
    border-radius:0;
    border-left:0;
    border-right:0;
    min-height:1px;
    box-shadow:none;
  }
  .reiwa-layout .reiwa-photo img{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:16/11;
    object-fit:cover;
    object-position:center;
  }
  .reiwa-heading{
    order:2;
    width:100%;
    margin-bottom:30px;
  }
  .reiwa-layout .reiwa-copy{
    order:3;
    width:100%;
    padding-top:0;
  }
}


@media(max-width:760px){
  /* CAST → 「令和うしろゆびとは」の間隔を詰める */
  .offstage.section{
    padding-bottom:34px;
  }
  .reiwa-section.section{
    padding-top:34px;
  }
}


/* =====================================================
   CONTACT / RECEIVE TEST / MOVIE
===================================================== */
.x-link{
  color:#fff;
  text-decoration-color:rgba(111,220,255,.65);
  text-underline-offset:.18em;
}
.x-link:hover{color:var(--cyan)}

.mail-test-box{
  max-width:760px;
  margin:26px 0 0;
  padding:24px 24px 22px;
  border:1px solid rgba(111,220,255,.28);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(111,220,255,.075),rgba(139,92,255,.055));
}
.mail-test-copy small{
  display:block;
  margin-bottom:3px;
  color:var(--cyan);
  font-size:10px;
  font-weight:800;
  letter-spacing:.24em;
}
.mail-test-copy h3{
  margin:0 0 10px;
  font-size:clamp(20px,2.5vw,26px);
  line-height:1.4;
}
.mail-test-copy p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}
.mail-test-copy .mail-test-note{
  margin-top:12px;
  color:rgba(255,255,255,.62);
  font-size:12px;
}
.mail-test-copy .mail-test-note strong{color:#fff}
.test-cta{
  display:inline-block;
  margin-top:18px;
  padding:12px 22px;
  border:1px solid rgba(111,220,255,.48);
  border-radius:999px;
  background:rgba(111,220,255,.08);
  color:#fff;
  text-decoration:none;
  font-weight:800;
  font-size:14px;
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
.test-cta:hover{
  transform:translateY(-2px);
  background:rgba(111,220,255,.13);
  border-color:rgba(111,220,255,.72);
}
.test-mail-meta{
  margin-top:10px;
  color:rgba(255,255,255,.55);
  font-size:11px;
  line-height:1.65;
  overflow-wrap:anywhere;
}
.movie-frame{
  width:min(960px,100%);
  margin:0 auto;
  overflow:hidden;
  aspect-ratio:16/9;
  border:1px solid var(--line);
  border-radius:22px;
  background:#000;
  box-shadow:0 28px 80px rgba(0,0,0,.28);
}
.movie-frame iframe{display:block;width:100%;height:100%;border:0}

@media(max-width:760px){
  .mail-test-box{padding:20px 18px}
  .test-cta{display:block;width:100%;text-align:center}
  .movie-frame{
    width:100vw;
    max-width:none;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    border-left:0;
    border-right:0;
    border-radius:0;
    box-shadow:none;
  }
}


.movie-fallback{
  margin:14px auto 0;
  text-align:center;
  color:rgba(255,255,255,.58);
  font-size:12px;
}
.movie-fallback a{
  color:#fff;
  text-underline-offset:.2em;
  text-decoration-color:rgba(111,220,255,.65);
}
.movie-fallback a:hover{color:var(--cyan)}


/* =====================================================
   ORGANIZER / REIWA MOVIE
===================================================== */
.organizer-x{
  display:inline-flex;
  align-items:center;
  gap:.48em;
}
.x-icon{
  width:1em;
  height:1em;
  flex:0 0 auto;
  fill:currentColor;
}

.reiwa-movie{
  grid-column:1 / -1;
  width:100%;
  margin-top:14px;
}
.reiwa-movie .movie-frame{
  margin:0 auto;
}
.reiwa-movie .movie-fallback{
  margin-bottom:0;
}

@media(max-width:760px){
  .reiwa-layout .reiwa-movie{
    order:4;
    width:100vw;
    max-width:none;
    margin-top:8px;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
  .reiwa-layout .reiwa-movie .movie-frame{
    width:100%;
    margin:0;
  }
  .reiwa-layout .reiwa-movie .movie-fallback{
    width:calc(100% - 36px);
    margin:12px auto 0;
  }
}


/* =====================================================
   JOURNEY SLIDESHOW CTA
===================================================== */
.journey-final{
  position:relative;
  overflow:hidden;
  background:#09060f;
}
.journey-slider{
  max-width:1120px;
  margin:0 auto;
}
.journey-track{
  position:relative;
  min-height:560px;
  border:1px solid var(--line);
  border-radius:28px;
  overflow:hidden;
  background:#120d1d;
  box-shadow:0 30px 90px rgba(0,0,0,.30);
}
.journey-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .85s ease, visibility .85s ease;
  background-size:cover;
  background-position:center;
}
.journey-slide.is-active{
  opacity:1;
  visibility:visible;
}
.journey-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(7,5,12,.94) 0%, rgba(7,5,12,.74) 36%, rgba(7,5,12,.22) 64%, rgba(7,5,12,.08) 100%),
    linear-gradient(180deg,rgba(7,5,12,.18) 0%, rgba(7,5,12,.34) 70%, rgba(7,5,12,.72) 100%);
}
.journey-copy{
  position:relative;
  z-index:2;
  width:min(46%, 460px);
  min-width:320px;
  padding:60px 46px 52px;
}
.journey-copy small{
  display:block;
  margin-bottom:6px;
  color:var(--pink2);
  font-size:11px;
  font-weight:800;
  letter-spacing:.26em;
}
.journey-copy h2{
  margin:0 0 16px;
  font-size:clamp(38px,4.8vw,58px);
  line-height:.98;
  text-shadow:0 0 24px rgba(255,77,163,.18);
}
.journey-copy p{
  margin:0;
  color:rgba(255,255,255,.80);
  line-height:1.8;
}
.journey-slide-cta .journey-copy .cta{
  margin-top:22px;
}
.journey-bottom{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:18px;
}
.journey-nav{
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.05);
  color:#fff;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.journey-nav:hover{
  background:rgba(255,255,255,.12);
}
.journey-dots{
  display:flex;
  align-items:center;
  gap:10px;
}
.journey-dot{
  width:11px;
  height:11px;
  padding:0;
  border-radius:999px;
  border:0;
  background:rgba(255,255,255,.24);
  cursor:pointer;
}
.journey-dot.is-active{
  background:linear-gradient(135deg,var(--pink2), var(--cyan));
  box-shadow:0 0 14px rgba(255,77,163,.36);
}
.journey-labels{
  display:flex;
  justify-content:center;
  gap:22px;
  margin-top:12px;
  color:rgba(255,255,255,.48);
  font-size:11px;
  letter-spacing:.18em;
}

@media(max-width:760px){
  .journey-track{
    min-height:620px;
    border-left:0;
    border-right:0;
    border-radius:0;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
  .journey-slide{
    background-position:center;
  }
  .journey-overlay{
    background:
      linear-gradient(180deg,rgba(7,5,12,.12) 0%, rgba(7,5,12,.18) 38%, rgba(7,5,12,.72) 66%, rgba(7,5,12,.95) 100%);
  }
  .journey-copy{
    width:auto;
    min-width:0;
    max-width:none;
    padding:348px 22px 28px;
    text-align:center;
  }
  .journey-copy h2{
    font-size:34px;
    line-height:1.02;
  }
  .journey-copy p{
    font-size:14px;
    line-height:1.75;
  }
  .journey-slide-cta .journey-copy .cta{
    display:block;
    width:100%;
    min-width:0;
  }
  .journey-labels{
    gap:12px;
    font-size:10px;
    letter-spacing:.12em;
    flex-wrap:wrap;
  }
}


/* =====================================================
   JOURNEY SLIDESHOW — IMAGE FIT / AUTOPLAY FIX
===================================================== */

/* 1枚目：縦写真なので全身が見えるよう右側に収める */
.journey-slide:nth-child(1){
  background-size:auto 88%;
  background-repeat:no-repeat;
  background-position:78% center;
  background-color:#09060f;
}

/* 2枚目：デコトラ全体が見えるよう縮小 */
.journey-slide:nth-child(2){
  background-size:92% auto;
  background-repeat:no-repeat;
  background-position:center;
  background-color:#09060f;
}

/* 3枚目だけはライブ写真を従来通り大きく */
.journey-slide:nth-child(3){
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
}

@media(max-width:760px){
  .journey-slide:nth-child(1){
    background-size:auto 54%;
    background-position:center 28px;
  }
  .journey-slide:nth-child(2){
    background-size:100% auto;
    background-position:center 44px;
  }
  .journey-slide:nth-child(3){
    background-size:cover;
    background-position:center;
  }

  /* 写真部分を上、文章を下に分けて見せる */
  .journey-copy{
    padding-top:390px;
  }

  .journey-slide:nth-child(1) .journey-overlay,
  .journey-slide:nth-child(2) .journey-overlay{
    background:
      linear-gradient(180deg,
        rgba(7,5,12,.02) 0%,
        rgba(7,5,12,.04) 46%,
        rgba(7,5,12,.78) 66%,
        rgba(7,5,12,.97) 100%);
  }
}


/* =====================================================
   JOURNEY SLIDESHOW — REVISED FIT / LOOP
===================================================== */

/* 1枚目：新しいアップめ写真を大きく見せつつ、顔まわりを優先 */
.journey-slide:nth-child(1){
  background-size:auto 90%;
  background-repeat:no-repeat;
  background-position:82% center;
  background-color:#09060f;
}

/* 2枚目：デコトラ全景＋左の人物も残す */
.journey-slide:nth-child(2){
  background-size:82% auto;
  background-repeat:no-repeat;
  background-position:58% center;
  background-color:#09060f;
}

/* 3枚目だけはライブ写真を従来通り大きく */
.journey-slide:nth-child(3){
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
}

@media(max-width:760px){
  .journey-slide:nth-child(1){
    background-size:100% auto;
    background-position:center 18px;
  }
  .journey-slide:nth-child(2){
    background-size:112% auto;
    background-position:52% 36px;
  }
  .journey-slide:nth-child(3){
    background-size:cover;
    background-position:center;
  }

  .journey-copy{
    padding-top:382px;
  }

  .journey-slide:nth-child(1) .journey-overlay,
  .journey-slide:nth-child(2) .journey-overlay{
    background:
      linear-gradient(180deg,
        rgba(7,5,12,.02) 0%,
        rgba(7,5,12,.06) 48%,
        rgba(7,5,12,.79) 68%,
        rgba(7,5,12,.97) 100%);
  }
}


/* =====================================================
   DEKOTORA SLIDE — FULL IMAGE VIEW
===================================================== */

/* デコトラはトリミングせず全景を表示 */
.journey-slide:nth-child(2){
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  background-color:#07050c;
}

/* 左の人物や車体を隠さないよう、文字は下部へ */
.journey-slide:nth-child(2) .journey-overlay{
  background:
    linear-gradient(180deg,
      rgba(7,5,12,.02) 0%,
      rgba(7,5,12,.03) 58%,
      rgba(7,5,12,.70) 78%,
      rgba(7,5,12,.94) 100%);
}

.journey-slide:nth-child(2) .journey-copy{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  width:auto;
  min-width:0;
  max-width:none;
  padding:28px 36px 30px;
  text-align:center;
}

.journey-slide:nth-child(2) .journey-copy h2{
  font-size:clamp(30px,3.6vw,46px);
  margin-bottom:8px;
}

.journey-slide:nth-child(2) .journey-copy p{
  font-size:14px;
}

@media(max-width:760px){
  .journey-slide:nth-child(2){
    background-size:100% auto;
    background-position:center 26px;
  }

  .journey-slide:nth-child(2) .journey-copy{
    padding:0 18px 26px;
  }

  .journey-slide:nth-child(2) .journey-copy h2{
    font-size:30px;
  }
}


/* =====================================================
   IMAGE PATH FIX FOR EXTERNAL STYLESHEET
   css/style.css -> ../img/
===================================================== */
.journey-slide:nth-child(1){
  background-image:url("../img/history-2025.webp");
}
.journey-slide:nth-child(2){
  background-image:url("../img/dekotora.webp");
}
.journey-slide:nth-child(3){
  background-image:url("../img/live-hero.jpg");
}

/* 1枚目「もういちど…」スライド調整 */
@media(min-width:761px){
  .journey-slide:nth-child(1) .journey-copy{
    width:min(68%, 720px);
    max-width:720px;
    text-align:left;
  }

  .journey-slide:nth-child(1) .journey-copy h2{
    font-size:clamp(38px, 4.5vw, 52px);
    white-space:nowrap;
  }

  .journey-slide:nth-child(1) .journey-copy p{
    white-space:nowrap;
  }
}
/* 3枚目「渋谷で、もういちど。」 */
@media(max-width:760px){

  .journey-slide:nth-child(3) .journey-copy{
    left:0;
    right:0;
    width:100%;
    padding-left:10px;
    padding-right:10px;
  }

  .journey-slide:nth-child(3) .journey-copy h2{
    font-size:clamp(24px, 7vw, 30px);
    line-height:1.1;
    letter-spacing:-0.03em;
    white-space:nowrap;
  }
}
/* =====================================================
   MOBILE 最終調整
===================================================== */
@media(max-width:760px){

  /* HERO：タイトルまわりを少しゆったり */
  .hero h1{
    line-height:.92;
  }

  .hero h1 span{
    margin-top:.18em;
    line-height:1;
  }

  .names{
    margin-top:13px;
  }

  .date{
    margin-top:10px;
  }

  .venue{
    margin-top:4px;
  }


  /* 「令和うしろゆびとは」本文 → YouTube の間を広げる */
  .reiwa-layout .reiwa-movie{
    margin-top:32px;
  }

  /* YouTube → 最後のスライドショーは詰める */
  .reiwa-section.section{
    padding-bottom:30px;
  }

  .journey-final{
    padding-top:30px;
  }


  /* ---------- 1枚目 ---------- */

  .journey-slide:nth-child(1) .journey-copy h2{
    font-size:34px;
    white-space:nowrap;
  }


  /* ---------- デコトラ ---------- */

  /* テキスト全体を少し上へ */
  .journey-slide:nth-child(2) .journey-copy{
    bottom:58px;
    padding:0 16px;
  }

  /* 見出しを一行に */
  .journey-slide:nth-child(2) .journey-copy h2{
    font-size:24px;
    line-height:1.15;
    white-space:nowrap;
    margin-bottom:14px;
  }

  .journey-slide:nth-child(2) .journey-copy p{
    font-size:13px;
    line-height:1.7;
  }


  /* ---------- 最後のスライド ---------- */

  /* PC用横長画像ではなく、スマホHERO用画像を使用 */
  .journey-slide:nth-child(3){
    background-image:url("../img/live-hero-sp.jpg");
    background-size:100% auto;
    background-position:center 18px;
    background-repeat:no-repeat;
    background-color:#09060f;
  }

  .journey-slide:nth-child(3) .journey-copy h2{
    font-size:30px;
    line-height:1.12;
    white-space:nowrap;
  }
}

/* =====================================================
   スライドショー 最終調整
===================================================== */

/* ---------- PC：3枚目 ---------- */
@media(min-width:761px){

  .journey-slide:nth-child(3) .journey-copy{
    width:72%;
    max-width:760px;
    min-width:0;
    text-align:left;
  }

  .journey-slide:nth-child(3) .journey-copy h2{
    font-size:clamp(38px, 4vw, 48px);
    line-height:1.08;
    letter-spacing:-0.035em;
    white-space:nowrap;
  }
}


/* ---------- スマホ ---------- */
@media(max-width:760px){

  /* デコトラの写真と文章を近づける */
  .journey-slide:nth-child(2) .journey-copy{
    top:330px;
    bottom:auto;
    left:0;
    right:0;
    width:100%;
    padding:0 16px;
    text-align:center;
  }

  .journey-slide:nth-child(2) .journey-copy h2{
    font-size:24px;
    line-height:1.15;
    white-space:nowrap;
    margin-bottom:12px;
  }

  .journey-slide:nth-child(2) .journey-copy p{
    font-size:13px;
    line-height:1.65;
  }


  /* 最終スライド */
  .journey-slide:nth-child(3) .journey-copy{
    left:0;
    right:0;
    width:100%;
    padding-left:10px;
    padding-right:10px;
  }

  .journey-slide:nth-child(3) .journey-copy h2{
    font-size:clamp(24px, 7vw, 29px);
    line-height:1.08;
    letter-spacing:-0.04em;
    white-space:nowrap;
  }
}