@charset "UTF-8";
/* ==========================================================================
   コドマ！日野こども商店街 / style.css
   Art Direction: 「商店街のエディトリアル」 (docs/02)
   ========================================================================== */

/* ---------- Design Tokens ---------- */
:root{
  /* color */
  --paper:#FBF7F1;
  --white:#FFFFFF;
  --orange:#DD6F2B;          /* ロゴから採取。大きな文字・装飾のみ（対紙 3.08＝大文字可） */
  --brown:#52220B;           /* ロゴの「日野こども商店街」の色 */
  --orange-cta:#B0551C;      /* 同色相で白文字が載る面・小さな文字（対白 5.05＝AA） */
  --orange-cta-dark:#884216; /* CTAの影 */
  --orange-deep:#B0551C;
  --orange-tint:#FDF0E6;
  --ink:#231B12;
  --ink-60:#6B5C4C;
  --navy:#14304F;
  --navy-soft:#1D4269;
  --turquoise:#0E9C97;          /* 大きな文字・装飾のみ */
  --turquoise-cta:#0A7F7B;      /* 白文字を載せる面・小さな文字（対白 4.84＝AA） */
  --turquoise-cta-dark:#075E5B;
  --turquoise-tint:#E6F5F4;
  --yellow:#FFC93C;
  --sand:#F3E9D8;       /* 背景パネル */
  --sand-deep:#EADCC2;
  --rule:#E4DACB;

  /* type */
  --font-sans:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --font-round:"Zen Maru Gothic","Hiragino Maru Gothic ProN",sans-serif;
  --font-num:"Archivo Black","Zen Kaku Gothic New",sans-serif;

  /* layout */
  --container:1120px;
  --pad:40px;
  --gap-section:120px;
  --radius:20px;
  --radius-lg:28px;

  /* motion */
  --ease:cubic-bezier(.2,.7,.3,1);
}
@media (max-width:767px){
  :root{ --pad:20px; --gap-section:72px; --radius:16px; --radius-lg:20px; }
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-sans);
  font-weight:400;
  font-size:17px;
  line-height:1.9;
  letter-spacing:.02em;
  color:var(--ink);
  background:var(--paper);
  font-feature-settings:"palt" 1;
}
@media (max-width:767px){ body{ font-size:16px; } }
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
h1,h2,h3,h4,p,figure,dl,dd,ul,ol{ margin:0; padding:0; }
ul,ol{ list-style:none; }
:focus-visible{ outline:3px solid var(--orange); outline-offset:3px; border-radius:4px; }

/* ---------- Utility ---------- */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--pad); }
.section{ padding-block:var(--gap-section) calc(var(--gap-section) * 1.12); position:relative; }
.num{ font-family:var(--font-num); font-weight:400; letter-spacing:-.02em; line-height:1; font-variant-numeric:tabular-nums; }
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}


/* セクション見出し */
.h2{
  word-break:auto-phrase; text-wrap:pretty;
  font-size:clamp(28px,4vw,44px);
  font-weight:900; line-height:1.4; letter-spacing:-.015em;
  margin-bottom:20px;
}
.h2 em{ font-style:normal; color:var(--orange); }
.lead{ word-break:auto-phrase; text-wrap:pretty; font-size:clamp(15px,1.5vw,18px); color:var(--ink-60); line-height:2; max-width:64ch; }

/* ---------- Header ---------- */
.header{
  /* top ではなく transform で動かす（レイアウトを起こさないため） */
  position:fixed; left:0; right:0; top:0; bottom:auto; z-index:100;
  background:rgba(251,247,241,.94); backdrop-filter:blur(12px);
  transition:box-shadow .3s var(--ease);
}
.header.is-stuck{ box-shadow:0 1px 0 var(--rule); }
.header__inner{
  display:flex; align-items:center; gap:32px;
  height:64px;
}
.header__logo{ display:block; text-decoration:none; flex:none; }
.header__logo img{ height:27px; width:auto; display:block; }
.header__nav{ display:flex; gap:26px; margin-left:auto; }
.header__nav a{
  font-size:14px; font-weight:700; text-decoration:none; color:var(--ink);
  position:relative; padding-block:4px;
}
.header__nav a::after{
  content:""; position:absolute; left:0; bottom:0; width:100%; height:2px;
  background:var(--orange); transform:scaleX(0); transform-origin:left;
  transition:transform .25s var(--ease);
}
.header__nav a:hover::after{ transform:scaleX(1); }
@media (max-width:1023px){
  .header__nav{ display:none; }
  .header__inner{ height:56px; gap:12px; }
  .header__logo img{ height:22px; }
  .header .btn--sm{ margin-left:auto; padding:11px 18px; font-size:13px; }
}

/* ---------- Button ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-sans); font-weight:900; font-size:19px; line-height:1;
  padding:19px 36px; border-radius:999px; text-decoration:none;
  border:1.5px solid transparent; cursor:pointer;
  transition:transform .15s var(--ease), box-shadow .15s var(--ease), background .15s;
  white-space:nowrap;
}
.btn__arrow{ font-size:13px; transition:transform .15s var(--ease); }
.btn:hover .btn__arrow{ transform:translateX(3px); }
.btn--primary{ background:var(--orange); color:#fff; box-shadow:0 4px 0 #A8511A; }
.btn--primary:hover{ transform:translateY(-2px); box-shadow:0 6px 0 #A8511A; }
.btn--primary:active{ transform:translateY(2px); box-shadow:0 2px 0 #A8511A; }
.btn--ghost{ background:var(--white); color:var(--ink); border-color:var(--ink); }
.btn--ghost:hover{ transform:translateY(-2px); box-shadow:0 4px 0 rgba(35,27,18,.18); }
.btn--tq{ background:var(--turquoise); color:#fff; box-shadow:0 4px 0 var(--turquoise-cta-dark); }
.btn--tq:hover{ transform:translateY(-2px); box-shadow:0 6px 0 var(--turquoise-cta-dark); }
.btn--sm{ padding:13px 24px; font-size:14px; }
.btn--sm.btn--primary{ background:var(--orange-cta); box-shadow:0 3px 0 var(--orange-cta-dark); }
.btn--sm.btn--primary:hover{ box-shadow:0 5px 0 var(--orange-cta-dark); }
.btn--wide{ width:100%; }

/* ---------- Hero：写真の上にタイトルと日付が浮かび上がる ---------- */
/* タイトルの浮かび上がりは「スクロール量に連動」ではなく
   「少しスクロールしたら、時間をかけて出て、そのまま留まる」方式。
   連動式だと指を動かしている間ずっと状態が進み、読む前に覆われてしまうため。
   ※ 以前は sticky ＋ 余分な高さで「写真が留まる」演出にしていたが、
      iOS Safari で sticky が効かず、写真の下に大きな空白が出た。
      ヒーローの高さ＝写真の高さに固定し、空白が生まれない作りに変更 */
.heroWrap{ position:relative; height:calc(100svh + 820px); }
/* 写真は fixed で画面に固定する。
   iOS Safari で position:sticky が効かず破綻したため fixed に変更。
   lvh を使うのは、アドレスバーが隠れても画面を覆いきるため */
.shot{
  position:fixed; top:0; left:0; right:0; z-index:0;
  height:100lvh; min-height:460px;
  overflow:hidden; background:var(--sand);
}
/* ヒーロー以降。固定した写真が透けないよう、不透明な面としてこの上を通り過ぎる */
.afterhero{ position:relative; z-index:1; background:var(--paper); }
.shot > picture,.shot > picture img{ display:block; width:100%; height:100%; }
.shot img{ object-fit:cover; object-position:50% 60%; }

/* 文字が出るときだけ、下半分をやわらかく沈める */
.shot__scrim{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to bottom,
    rgba(34,21,9,.90) 0%, rgba(34,21,9,.82) 22%,
    rgba(34,21,9,.56) 42%, rgba(34,21,9,.24) 62%,
    rgba(34,21,9,.06) 80%, rgba(34,21,9,0) 92%);
  opacity:1;
}
/* JS があるときだけ、最初は隠しておく */
.js .shot__scrim{ opacity:0; transition:opacity .8s var(--ease); }
.js .heroWrap.is-revealed .shot__scrim{ opacity:1; }

.shot__title{
  position:absolute; left:50%; transform:translateX(-50%);
  top:118px; bottom:auto; z-index:2; width:100%;
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:48px;
}
.shot__title > *{ min-width:0; }
.js .shot__titleinner,.js .shot__date{
  opacity:0; transform:translateY(32px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
  will-change:opacity, transform;
}
.js .heroWrap.is-revealed .shot__titleinner,
.js .heroWrap.is-revealed .shot__date{ opacity:1; transform:none; }
.js .heroWrap.is-revealed .shot__date{ transition-delay:.12s; }
.shot__logo{ margin:0 0 20px; }
.shot__logo img{ width:min(100%,440px); height:auto; display:block;
  filter:drop-shadow(0 4px 20px rgba(20,12,4,.55)); }
.shot__tag{
  color:#fff; font-size:clamp(17px,1.9vw,21px); font-weight:900; line-height:1.8;
  max-width:26em; word-break:auto-phrase;
  text-shadow:0 2px 14px rgba(30,18,8,.5);
}
.shot__tag em{ font-style:normal; color:var(--yellow); }
.shot__date{
  justify-self:end; flex:none; text-align:center;
  background:var(--yellow); color:var(--ink);
  padding:26px 40px 24px;
  border-radius:44% 56% 52% 48% / 50% 46% 54% 50%; transform-origin:center;
  box-shadow:0 14px 32px rgba(20,12,4,.34);
}
.shot__date b{
  display:block; font-family:var(--font-num); font-size:clamp(42px,4.2vw,56px);
  line-height:1; font-variant-numeric:tabular-nums; white-space:nowrap;
}
.shot__date b span{ font-family:var(--font-sans); font-size:.42em; font-weight:900; }
.shot__date i{ display:block; font-style:normal; font-size:13px; font-weight:900; margin-top:9px; white-space:nowrap; }

/* スクロール誘導（タイトルが出てきたら消える） */
.shot__cue{
  position:absolute; left:50%; bottom:34px; z-index:3; transform:translateX(-50%);
  width:26px; height:42px; border:2.5px solid rgba(255,255,255,.92); border-radius:14px;
  box-shadow:0 2px 12px rgba(0,0,0,.28);
  transition:opacity .45s var(--ease);
}
.js .heroWrap.is-revealed .shot__cue{ opacity:0; }
.shot__cue span{
  position:absolute; left:50%; top:8px; width:3px; height:8px; border-radius:2px;
  background:rgba(255,255,255,.96); transform:translateX(-50%);
  animation:cue 1.7s cubic-bezier(.4,.05,.35,1) infinite;
}
@keyframes cue{
  0%,100%{ transform:translate(-50%,0); opacity:1; }
  60%    { transform:translate(-50%,14px); opacity:.2; }
}
@media (prefers-reduced-motion:reduce){
  .shot__cue span{ animation:none; }
  /* 移動は止めるが、浮かび上がり（フェード）自体は残す */
  .js .shot__titleinner,.js .shot__date{ transform:none !important; }
}

/* 写真の下：会場・対象・募集 */
.introfacts-sec{
  position:relative; z-index:1; background:var(--paper);
  border-radius:44px 44px 0 0; margin-top:-44px;
  padding:56px 0 72px;
}
.introfacts{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.introfacts > *{ min-width:0; }
.introfacts__k{
  font-size:11.5px; font-weight:900; letter-spacing:.14em;
  color:var(--orange-cta); margin-bottom:8px;
}
.introfacts__v{ font-size:15px; font-weight:900; line-height:1.7; }
.introfacts__v small{
  display:block; font-size:12.5px; font-weight:500; color:var(--ink-60);
  margin-top:5px; line-height:1.8;
}
.introfacts__v a{
  color:var(--turquoise-cta); font-weight:900;
  text-decoration:underline; text-underline-offset:3px;
}
.introfacts__v a span{ margin-left:3px; }

@media (max-width:1023px){
  .heroWrap{ height:calc(100svh + 740px); }
  .shot__title{ top:100px; bottom:auto; grid-template-columns:1fr; gap:26px; justify-items:start; }
  .shot__date{ justify-self:start; }
  .introfacts-sec{ border-radius:34px 34px 0 0; }
  .introfacts{ grid-template-columns:1fr; gap:22px; }
}
@media (max-width:767px){
  .heroWrap{ height:calc(100svh + 660px); }
  .shot{ min-height:420px; }
  /* 縦長写真では紙面が下から上がってくるため、下端にタイトルを置くと
     出たそばから食われる。上に置いて、覆われるのを最後にする */
  .shot__title{ top:82px; bottom:auto; gap:16px; }
  .shot__logo{ margin-bottom:16px; }
  .shot__logo img{ width:min(100%,290px); }
  .shot__tag{ font-size:15px; line-height:1.75; }
  /* 日付は画面幅を取りすぎないよう小さめに */
  .shot__date{ padding:13px 20px 11px; }
  .shot__date b{ font-size:30px; }
  .shot__date i{ font-size:10.5px; margin-top:5px; }
  /* 誘導マークが日付と重なっていたので右下へ逃がす */
  .shot__cue{ left:auto; right:18px; bottom:20px; transform:none; width:22px; height:36px; }
  .shot__cue span{ top:6px; height:7px; }
  .introfacts-sec{ border-radius:26px 26px 0 0; padding-top:44px; }
}

/* ---------- Stats ---------- */
.stats{ padding-block:0; margin-block:0; }
.stats__panel{
  background:transparent; color:var(--ink);
  border-top:2px solid var(--sand-deep); border-bottom:2px solid var(--sand-deep);
  padding:44px 0;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
  position:relative; overflow:hidden;
}
.stat{ text-align:center; position:relative; z-index:1; }
.stat + .stat{ border-left:1px solid var(--sand-deep); }
.stat__num{ font-family:var(--font-num); font-size:clamp(40px,5vw,60px); line-height:1; color:var(--orange-cta); font-variant-numeric:tabular-nums; }
.stat__num small{ font-family:var(--font-sans); font-size:.36em; font-weight:900; margin-left:4px; }
.stat__label{ font-size:13px; font-weight:900; margin-top:12px; letter-spacing:.04em; }
.stat__note{ font-size:11.5px; color:var(--ink-60); margin-top:4px; }
@media (max-width:767px){
  .stats__panel{ grid-template-columns:repeat(2,1fr); gap:32px 16px; padding:36px 20px; }
  .stat:nth-child(even){ border-left:1px solid var(--sand-deep); }
  .stat:nth-child(odd){ border-left:none; }
}

/* ---------- About / Features ---------- */
.about__head{ max-width:760px; margin-bottom:56px; }
.features{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.feature{
  background:var(--white); border:1px solid var(--rule); border-radius:var(--radius);
  padding:34px 30px 32px;
}
.feature__no{ font-family:var(--font-num); font-size:15px; color:var(--orange-cta); letter-spacing:.06em; }
.feature__title{ word-break:auto-phrase; font-size:21px; font-weight:900; line-height:1.5; margin:14px 0 12px; }
.feature__text{ font-size:15px; line-height:1.95; color:var(--ink-60); }
@media (max-width:1023px){ .features{ grid-template-columns:1fr; } }

.showcase{ display:grid; grid-template-columns:1.15fr .85fr; gap:24px; margin-top:56px; }
.showcase figure{ border-radius:var(--radius); overflow:hidden; position:relative; }
.showcase img{ width:100%; height:100%; object-fit:cover; }
.showcase figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:44px 24px 20px; color:#fff; font-size:14px; font-weight:700; line-height:1.7;
  background:linear-gradient(to top, rgba(20,20,20,.78), rgba(20,20,20,0));
}
.showcase__stack{ display:grid; gap:24px; }
@media (max-width:767px){ .showcase{ grid-template-columns:1fr; } }

/* ---------- Event (本番) ---------- */
.event{ background:var(--orange-tint); }
.event__head{ display:grid; grid-template-columns:1fr auto; gap:40px; align-items:end; margin-bottom:56px; }
/* ---------- 2つの日程 ---------- */
.dates{ padding-block:0; margin-bottom:var(--gap-section); }
.dates__grid{
  display:grid; grid-template-columns:1fr auto 1fr; gap:0 28px; align-items:stretch;
}
.datecard{
  background:var(--white); border:2px solid var(--rule); border-radius:var(--radius-lg);
  padding:34px 34px 32px; display:flex; flex-direction:column;
}
.datecard--ws{ border-color:rgba(14,156,151,.4); }
.datecard--main{ border-color:rgba(221,111,43,.45); }
.datecard__kind{
  font-size:12px; font-weight:900; letter-spacing:.12em; color:var(--ink-60);
  display:flex; align-items:center; gap:8px; margin-bottom:14px;
}
.datecard__kind i{
  font-style:normal; font-size:10.5px; letter-spacing:.06em;
  background:var(--paper); color:var(--ink-60); padding:3px 9px; border-radius:999px;
}
.datecard--ws .datecard__kind{ color:var(--turquoise-cta); }
.datecard--main .datecard__kind{ color:var(--orange-cta); }
.datecard__day{
  display:flex; align-items:baseline; gap:2px; line-height:.9; margin-bottom:10px;
}
.datecard__day b{ font-family:var(--font-num); font-size:clamp(44px,5.4vw,64px); font-weight:400; }
.datecard__day span{ font-family:var(--font-num); font-size:clamp(32px,4vw,46px); margin:0 -.02em; }
.datecard__day i{
  font-style:normal; font-size:15px; font-weight:900; margin-left:8px;
  align-self:center; color:var(--ink-60);
}
.datecard--ws .datecard__day b, .datecard--ws .datecard__day span{ color:var(--turquoise); }
.datecard--main .datecard__day b, .datecard--main .datecard__day span{ color:var(--orange); }
.datecard__name{ font-size:20px; font-weight:900; line-height:1.45; margin-bottom:10px; }
.datecard__meta{ font-size:13.5px; color:var(--ink-60); line-height:1.85; margin-bottom:18px; }
.datecard__state{
  font-size:13.5px; font-weight:900; line-height:1.7;
  border-top:1px solid var(--rule); padding-top:16px; margin-top:auto; margin-bottom:18px;
}
.datecard__state span{ display:block; font-size:12px; font-weight:500; color:var(--ink-60); margin-top:3px; }
.datecard__state--open{ color:var(--turquoise-cta); }
.datecard--main .datecard__state--open{ color:var(--orange-cta); }
.datecard__state--closed{ color:var(--ink-60); }
.datecard__state--soon b{ color:var(--orange-cta); }
.datecard__ics{
  display:block; text-align:center; margin-top:10px;
  font-size:12px; font-weight:700; color:var(--ink-60);
  text-decoration:underline; text-underline-offset:3px;
}
/* 2枚をつなぐ矢印 */
.dates__link{ display:grid; place-items:center; position:relative; width:152px; }
.dates__link::before{
  content:""; position:absolute; left:0; right:0; top:50%; height:2px;
  background:repeating-linear-gradient(90deg,var(--rule) 0 7px,transparent 7px 14px);
}
.dates__linktext{
  position:relative; z-index:1; background:var(--paper); padding:12px 8px;
  font-size:12.5px; font-weight:900; line-height:1.75; text-align:center; color:var(--ink-60);
  white-space:nowrap;
}
.dates__linktext b{ color:var(--turquoise-cta); font-size:13px; }
@media (max-width:1023px){
  .dates__grid{ grid-template-columns:1fr; gap:0; }
  .dates__link{ width:auto; padding:16px 0; }
  .dates__link::before{ left:50%; right:auto; top:0; bottom:0; width:2px; height:auto;
    background:repeating-linear-gradient(180deg,var(--rule) 0 7px,transparent 7px 14px); }
  .dates__linktext{ padding:8px 14px; }
}
@media (max-width:767px){
  .datecard{ padding:26px 22px 24px; }
}

@media (max-width:767px){
  .event__head{ grid-template-columns:1fr; gap:24px; }
  .datecard{ min-width:0; }
}

.panels{ display:grid; grid-template-columns:1.25fr .75fr; gap:24px; align-items:start; }
@media (max-width:1023px){ .panels{ grid-template-columns:1fr; } }
.panel{
  background:var(--white); border:1px solid var(--rule); border-radius:var(--radius);
  padding:32px 34px;
}
.panel + .panel{ margin-top:24px; }
.panel__title{
  font-size:17px; font-weight:900; letter-spacing:.04em;
  padding-bottom:14px; margin-bottom:20px; border-bottom:2px solid var(--ink);
  display:flex; align-items:center; gap:10px;
}
.panel__title::before{ content:""; width:4px; height:17px; background:var(--orange); border-radius:2px; }

/* 定義リスト */
.dl{ display:grid; grid-template-columns:7.5em 1fr; row-gap:0; font-size:15px; }
.dl dt{
  font-weight:900; color:var(--ink); padding:14px 0;
  border-top:1px solid var(--rule);
}
.dl dd{ padding:14px 0; border-top:1px solid var(--rule); color:var(--ink-60); line-height:1.85; }
.dl dt:first-of-type, .dl dd:first-of-type{ border-top:none; padding-top:0; }
.dl small{ display:block; font-size:12.5px; opacity:.8; margin-top:2px; }
@media (max-width:767px){
  .dl{ grid-template-columns:1fr; }
  .dl dt{
    padding:16px 0 0; border-top:1px solid var(--rule); font-size:12px;
    letter-spacing:.08em; color:var(--ink-60);
  }
  .dl dd{ padding:2px 0 16px; border-top:none; color:var(--ink); font-weight:500; }
  .dl dd:first-of-type{ padding-top:2px; }
}

/* 料金 */
.fee{ display:grid; gap:10px; }
.fee__row{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  padding:16px 18px; border-radius:12px; background:var(--paper);
}
.fee__row b{ font-size:15px; font-weight:900; }
.fee__price{ font-family:var(--font-num); font-size:26px; color:var(--orange); white-space:nowrap; font-variant-numeric:tabular-nums; }
.fee__price small{ font-family:var(--font-sans); font-size:.5em; font-weight:900; margin-left:2px; }
.fee__opt{ background:transparent; border:1px dashed var(--rule); }
.fee__opt .fee__price{ color:var(--ink); font-size:22px; }
@media (max-width:767px){
  .fee__row{ flex-direction:column; align-items:flex-start; gap:6px; }
}
.note{ font-size:13px; color:var(--ink-60); line-height:1.85; margin-top:14px; }
.note::before{ content:"※ "; }

/* タイムライン */
.timeline{ position:relative; padding-left:30px; }
.timeline::before{
  content:""; position:absolute; left:6px; top:8px; bottom:8px; width:2px; background:var(--rule);
}
.timeline li{ position:relative; padding:0 0 26px; }
.timeline li:last-child{ padding-bottom:0; }
.timeline li::before{
  content:""; position:absolute; left:-30px; top:7px;
  width:14px; height:14px; border-radius:50%;
  background:var(--white); border:3px solid var(--rule);
}
.timeline li.is-main::before{ background:var(--orange); border-color:var(--orange); }
.timeline li.is-now::before{ background:var(--turquoise); border-color:var(--turquoise); }
.timeline li.is-now .timeline__date{ color:var(--turquoise-cta); }
.timeline li.is-now .timeline__text{ font-size:17px; font-weight:900; }
.timeline__date{ font-family:var(--font-num); font-size:15px; color:var(--orange-cta); letter-spacing:.02em; }
.timeline__date span{ font-family:var(--font-sans); font-size:12px; font-weight:900; margin-left:4px; }
.timeline__text{ font-size:15px; font-weight:700; margin-top:2px; }
.timeline li.is-main .timeline__text{ font-size:18px; font-weight:900; }

/* CTAブロック */
.ctablock{
  margin-top:40px; background:var(--ink); color:#fff;
  border-radius:var(--radius-lg); padding:44px 48px;
  display:grid; grid-template-columns:1fr auto; gap:32px; align-items:center;
}
.ctablock--tq{ background:var(--turquoise-cta); }
.ctablock__title{ word-break:auto-phrase; font-size:clamp(20px,2.4vw,28px); font-weight:900; line-height:1.5; }
.ctablock__text{ font-size:14px; opacity:.85; margin-top:10px; line-height:1.85; }
.ctablock__actions{ display:flex; flex-direction:column; gap:12px; align-items:stretch; }
.ctablock .btn--ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.5); }
.ctablock .btn--ghost:hover{ background:rgba(255,255,255,.1); box-shadow:none; }
.ctablock__deadline{
  display:inline-block; font-size:12px; font-weight:900; letter-spacing:.06em;
  background:var(--yellow); color:var(--ink); padding:6px 14px; border-radius:999px; margin-bottom:14px;
}
@media (max-width:1023px){
  .ctablock{ grid-template-columns:1fr; padding:34px 26px; }
}

/* ---------- Workshop ---------- */
.ws{ background:var(--turquoise-tint); }
.ws .h2 em{ color:var(--turquoise); }
.ws .panel__title::before{ background:var(--turquoise); }
.ws .timeline__date{ color:var(--turquoise-cta); }
.ws .fee__price, .ws .datecard__num{ color:var(--turquoise); }
.program{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; margin-bottom:24px; }
.program__item{ background:var(--white); border-radius:var(--radius); padding:32px 30px; border:1px solid rgba(14,156,151,.2); }
.program__no{ font-family:var(--font-num); font-size:14px; color:var(--turquoise-cta); }
.program__title{ word-break:auto-phrase; font-size:19px; font-weight:900; line-height:1.55; margin:10px 0 12px; }
.program__text{ font-size:15px; color:var(--ink-60); line-height:1.95; }
@media (max-width:767px){ .program{ grid-template-columns:1fr; } }
.priority{
  background:var(--white); border:2px solid var(--turquoise); border-radius:var(--radius);
  padding:28px 30px; margin-top:24px;
}
.priority__title{
  font-size:20px; font-weight:900; line-height:1.5;
  color:var(--turquoise-cta); margin-bottom:10px;
}
.priority__text{ font-size:15px; font-weight:700; line-height:1.9; }
.priority__note{ font-size:13px; color:var(--ink-60); line-height:1.85; margin-top:10px; }
@media (max-width:767px){
  .priority{ padding:22px 20px; }
  .priority__title{ font-size:18px; }
}

/* ---------- Organizer（主催者はにっしー1人） ---------- */
.organizer{
  display:grid; grid-template-columns:340px 1fr; gap:32px; align-items:start;
}
.organizer__profile{
  background:var(--white); border:1px solid var(--rule); border-radius:var(--radius);
  padding:38px 32px 34px; text-align:center;
}
.organizer__photo{
  width:168px; aspect-ratio:1; margin:0 auto 20px;
  border-radius:50%; overflow:hidden; border:7px solid var(--sand);
  box-shadow:0 12px 30px rgba(60,40,20,.14);
}
.organizer__photo img{ width:100%; height:100%; object-fit:cover; }
.organizer__name{ font-size:23px; font-weight:900; line-height:1.3; }
.organizer__role{ font-size:13px; font-weight:700; color:var(--navy); margin:8px 0 14px; line-height:1.75; }
.organizer__bio{ font-size:14px; color:var(--ink-60); line-height:1.9; text-align:left; }

/* 講師（ワークショップ内） */
.teacher{ display:grid; grid-template-columns:92px 1fr; gap:20px; align-items:start; }
.teacher__photo{
  width:92px; aspect-ratio:1; border-radius:50%; overflow:hidden;
  border:5px solid var(--turquoise-tint);
}
.teacher__photo img{ width:100%; height:100%; object-fit:cover; }
.teacher__name{ font-size:18px; font-weight:900; line-height:1.4; }
.teacher__role{ font-size:12.5px; font-weight:700; color:var(--turquoise-cta); margin:5px 0 9px; line-height:1.7; }
.teacher__bio{ font-size:14px; color:var(--ink-60); line-height:1.9; }

@media (max-width:1023px){
  .organizer{ grid-template-columns:1fr; gap:24px; }
  .organizer__profile{ display:grid; grid-template-columns:120px 1fr; gap:24px; text-align:left; align-items:center; padding:28px 24px; }
  .organizer__photo{ width:120px; margin:0; }
}
@media (max-width:767px){
  .organizer__profile{ grid-template-columns:1fr; gap:16px; }
  .organizer__photo{ width:100px; }
  .teacher{ grid-template-columns:1fr; gap:16px; }
}

/* ---------- Gallery ---------- */
.gallery{
  display:grid; grid-template-columns:repeat(6,1fr);
  grid-auto-rows:190px; gap:16px;
}
.gallery figure{ border-radius:var(--radius); overflow:hidden; background:var(--rule); }
.gallery img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.gallery figure:hover img{ transform:scale(1.04); }
.gallery figure:nth-child(1){ grid-column:span 4; grid-row:span 2; }
.gallery figure:nth-child(2){ grid-column:span 2; }
.gallery figure:nth-child(3){ grid-column:span 2; }
.gallery figure:nth-child(4){ grid-column:span 2; }
.gallery figure:nth-child(5){ grid-column:span 2; }
.gallery figure:nth-child(6){ grid-column:span 2; }
@media (max-width:1023px){ .gallery{ grid-auto-rows:150px; } }
@media (max-width:767px){
  .gallery{ grid-template-columns:repeat(2,1fr); grid-auto-rows:120px; gap:10px; }
  .gallery figure:nth-child(1){ grid-column:span 2; grid-row:span 2; }
  .gallery figure:nth-child(n+2){ grid-column:span 1; grid-row:span 1; }
  .gallery figure:nth-child(6){ grid-column:span 2; }
}

/* ---------- History ---------- */
.history{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:48px; }
.history__item{ padding:0 24px; border-left:2px solid var(--rule); position:relative; }
.history__item:first-child{ padding-left:0; border-left:none; }
.history__item.is-now{ border-left-color:var(--orange); }
.history__year{ font-family:var(--font-num); font-size:15px; color:var(--ink-60); }
.history__item.is-now .history__year{ color:var(--orange-cta); }
.history__title{ font-size:16px; font-weight:900; margin-top:8px; line-height:1.6; }
.history__text{ font-size:13.5px; color:var(--ink-60); margin-top:6px; line-height:1.8; }
@media (max-width:1023px){
  .history{ grid-template-columns:1fr; gap:0; }
  .history__item{ padding:0 0 0 22px; border-left:2px solid var(--rule); padding-bottom:26px; }
  .history__item:first-child{ padding-left:22px; border-left:2px solid var(--rule); }
  .history__item:last-child{ padding-bottom:0; }
}

/* ---------- FAQ ---------- */
.faq{ max-width:840px; margin-inline:auto; }
.faq details{
  background:var(--white); border:1px solid var(--rule); border-radius:var(--radius);
  margin-bottom:12px; overflow:hidden;
}
.faq summary{
  display:flex; align-items:center; gap:16px; cursor:pointer; list-style:none;
  padding:24px 28px; font-size:17px; font-weight:900; line-height:1.6;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::before{
  content:"Q"; flex:none; font-family:var(--font-num); font-size:16px;
  width:30px; height:30px; border-radius:50%; background:var(--orange-cta); color:#fff;
  display:grid; place-items:center;
}
.faq summary::after{
  content:""; flex:none; margin-left:auto; width:14px; height:14px;
  background:
    linear-gradient(var(--ink),var(--ink)) center/100% 2px no-repeat,
    linear-gradient(var(--ink),var(--ink)) center/2px 100% no-repeat;
  transition:transform .25s var(--ease);
}
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq__body{ padding:0 28px 26px 74px; font-size:15px; color:var(--ink-60); line-height:2; }
@media (max-width:767px){
  .faq summary{ padding:20px; font-size:16px; gap:12px; }
  .faq__body{ padding:0 20px 22px 20px; }
}

/* ---------- Support ---------- */
.support{ background:var(--navy); color:#fff; }
.support .h2{ color:#fff; }
.support .h2 em{ color:var(--yellow); }
.support .lead{ color:rgba(255,255,255,.78); }
.support__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; margin:48px 0 36px; }
.support__card{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16);
  border-radius:var(--radius); padding:32px 34px;
}
.support__type{ font-size:13px; font-weight:900; letter-spacing:.1em; color:var(--yellow); }
.support__price{ font-family:var(--font-num); font-size:38px; margin:10px 0 18px; line-height:1; }
.support__price small{ font-family:var(--font-sans); font-size:.36em; font-weight:900; margin-left:4px; }
.support__list li{ font-size:14.5px; line-height:1.9; padding-left:22px; position:relative; color:rgba(255,255,255,.86); }
.support__list li::before{
  content:""; position:absolute; left:2px; top:.72em; width:9px; height:9px;
  border-radius:50%; background:var(--yellow);
}
@media (max-width:767px){ .support__grid{ grid-template-columns:1fr; } }

/* ---------- Footer ---------- */
.footer{ position:relative; z-index:1; background:var(--ink); color:rgba(255,255,255,.8); padding-block:64px 40px; }
.footer__grid{ display:grid; grid-template-columns:1.2fr 1fr; gap:48px; align-items:start; }
.footer__logo img{ width:190px; height:auto; display:block; margin-bottom:10px; }
.footer__logo span{
  display:block; font-size:19px; font-weight:900; color:#fff; letter-spacing:.1em;
}
.footer__tag{ font-size:14px; margin-top:10px; line-height:1.9; }
.footer__badge{
  display:inline-block; margin-top:20px; font-size:12px; font-weight:700; line-height:1.7;
  border:1px solid rgba(255,255,255,.3); border-radius:10px; padding:10px 16px; color:#fff;
}
.footer__dl{ display:grid; grid-template-columns:6em 1fr; font-size:14px; row-gap:12px; }
.footer__dl dt{ font-weight:900; color:#fff; }
.footer__dl a{ color:var(--yellow); text-decoration:underline; text-underline-offset:3px; }
.footer__bottom{
  margin-top:48px; padding-top:24px; border-top:1px solid rgba(255,255,255,.14);
  font-size:12px; color:rgba(255,255,255,.55);
}
@media (max-width:767px){
  .footer{ padding-bottom:104px; }
  .footer__grid{ grid-template-columns:1fr; gap:32px; }
  .footer__dl{ grid-template-columns:5.5em 1fr; }
}

/* ---------- SP固定CTAバー ---------- */
.spbar{
  position:fixed; left:0; right:0; bottom:0; z-index:99;
  display:none; gap:10px; padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:rgba(251,247,241,.95); backdrop-filter:blur(12px);
  border-top:1px solid var(--rule);
  transform:translateY(110%); transition:transform .3s var(--ease);
}
.spbar.is-visible{ transform:translateY(0); }
.spbar .btn{ flex:1; padding:15px 8px; font-size:14px; box-shadow:none; }
.spbar .btn--primary{ background:var(--orange-cta); }
.spbar .btn--primary{ flex:1.35; }
@media (max-width:1023px){ .spbar{ display:flex; } }

/* ---------- Reveal ---------- */
.js .reveal{ opacity:0; transform:translateY(16px); }
.js .reveal.is-in{
  opacity:1; transform:none;
  transition:opacity .5s var(--ease), transform .5s var(--ease);
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .js .reveal,.js .reveal.is-in{ opacity:1; transform:none; transition:none; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* 改行制御（PCだけで改行したい箇所） */
.nobr{ white-space:nowrap; }
.br-pc{ display:none; }
@media (min-width:1024px){ .br-pc{ display:inline; } }

/* ---------- キャラクター（まなてぃーさん・もなちゃん） ---------- */
/* 密度の原則：1ページに3箇所まで。文脈のあるところにだけ置く */
.char{ display:block; height:auto; pointer-events:none; user-select:none; }

/* 本番CTAブロックの左 */
.ctablock--chars{ grid-template-columns:auto 1fr auto; }
.ctablock__char{ width:132px; align-self:end; margin-bottom:-44px; }
@media (max-width:1023px){
  .ctablock--chars{ grid-template-columns:1fr; }
  .ctablock__char{ width:96px; margin:0 0 -34px auto; }
}

/* FAQ見出しの脇 */
.faq__head{ position:relative; }
.faq__char{
  position:absolute; right:0; bottom:-10px; width:132px;
}
@media (max-width:1200px){ .faq__char{ right:-8px; width:104px; } }
@media (max-width:767px){ .faq__char{ position:static; width:92px; margin:14px auto -6px; } }

/* 協賛セクションの下端から覗く */
.support{ position:relative; overflow:hidden; }
.support__char{
  position:absolute; right:5%; bottom:0; width:150px; opacity:.95;
}
@media (max-width:1023px){ .support__char{ width:104px; right:2%; } }
@media (max-width:767px){ .support__char{ display:none; } }

/* 会場の地図リンク */
.maplink{
  display:inline-flex; align-items:center; gap:5px;
  margin-top:8px; font-size:12.5px; font-weight:900; letter-spacing:.02em;
  color:var(--orange-cta); text-decoration:none;
  border:1.5px solid currentColor; border-radius:999px; padding:5px 13px;
  transition:background .15s var(--ease), color .15s var(--ease);
}
.maplink::before{ content:"◎"; font-size:11px; }
.maplink:hover{ background:var(--orange-cta); color:#fff; }
.maplink--tq{ color:var(--turquoise-cta); }
.maplink--tq:hover{ background:var(--turquoise-cta); color:#fff; }

/* ヒーロー：ロゴ下の手描き線の間隔 */
.hero__rule{ margin-top:2px; }

/* ヒーロー：いま何を受け付けているか */
.hero__status{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px;
  font-size:14px; font-weight:700; color:var(--ink-60);
  margin:-6px 0 20px;
}
.hero__status b{
  font-size:12px; font-weight:900; letter-spacing:.1em;
  background:var(--turquoise-cta); color:#fff;
  padding:5px 12px; border-radius:999px;
}
.hero__status span{ color:var(--ink-60); opacity:.85; font-size:13px; }
@media (max-width:767px){
  .hero__status{ font-size:13px; }
  .hero__status span{ width:100%; }
}

/* 受付開始前のバッジ */
.ctablock__deadline--soon{ background:var(--turquoise); color:#fff; }
.ctablock__text b{ color:var(--yellow); font-weight:900; }


@media (max-width:1023px){
}

/* ---------- 大きな背景パネル ---------- */
.panel-lg{
  position:relative;
  background:var(--sand); border-radius:56px;
  padding:82px 76px 78px;
}
@media (max-width:1023px){ .panel-lg{ padding:56px 32px 52px; border-radius:36px; } }
@media (max-width:767px){ .panel-lg{ padding:44px 22px 40px; border-radius:26px; } }

/* 斜めの英字ラベル */
.eyebrow{ margin-bottom:6px; }
.eyebrow span{
  display:inline-block;
  font-family:var(--font-num); font-size:15px; letter-spacing:.22em;
  color:var(--orange-cta); transform:rotate(-4deg);
}
.h2--lg{ font-size:clamp(30px,4.6vw,52px); line-height:1.35; }
.about .lead{ margin-top:18px; max-width:46ch; }

/* 円形写真の3点セット */
.points{
  display:grid; grid-template-columns:repeat(3,1fr); gap:40px 26px;
  margin-top:62px;
}
.point{ text-align:center; }
.point__photo{
  width:min(244px,76%); aspect-ratio:1; margin:0 auto 24px;
  border-radius:50%; overflow:hidden;
  border:7px solid var(--white);
  box-shadow:0 12px 30px rgba(60,40,20,.14);
}
.point__photo img{ width:100%; height:100%; object-fit:cover; }
.point__title{ font-size:20px; font-weight:900; line-height:1.5; margin-bottom:10px; }
.point__text{ font-size:14.5px; color:var(--ink-60); line-height:1.85; text-wrap:balance; }
@media (max-width:767px){
  .points{ grid-template-columns:1fr; gap:28px; margin-top:40px; }
  /* 写真が2行ぶんを占める。指定しないと3つ目（説明文）が写真の下の狭い列に落ちる */
  .point{
    display:grid; grid-template-columns:104px 1fr; grid-template-rows:auto auto;
    column-gap:18px; row-gap:6px; text-align:left; align-items:start;
  }
  .point__photo{ grid-column:1; grid-row:1 / span 2; width:104px; margin:0; border-width:5px; }
  .point__title{ grid-column:2; grid-row:1; font-size:18px; margin-bottom:0; align-self:end; }
  .point__title br{ display:none; }
  .point__text{ grid-column:2; grid-row:2; font-size:14px; }
}

/* Aboutの装飾（パネルからはみ出す） */

/* 斜め英字ラベルの色バリエーション */
.eyebrow--tq span{ color:var(--turquoise-cta); }
.eyebrow--navy span{ color:var(--navy); }
.eyebrow--yellow span{ color:var(--yellow); }
.support .eyebrow span{ color:var(--yellow); }
.eyebrow{ margin-bottom:10px; }

/* 見出しまわりの余白を統一（ピル廃止に伴う調整） */
.about__head{ margin-bottom:52px; }
.event__head{ margin-bottom:52px; }

/* ---------- 募集開始の告知（SAVE THE DATE） ---------- */
.savedate{ padding-block:0; margin-bottom:var(--gap-section); }
.savedate__inner{
  position:relative;
  display:grid; grid-template-columns:1fr auto; gap:32px; align-items:center;
  background:var(--ink); color:#fff;
  border-radius:var(--radius-lg); padding:40px 52px;
  width:100%; max-width:var(--container); margin-inline:auto;
}
.savedate__label{
  font-family:var(--font-num); font-size:13px; letter-spacing:.24em;
  color:var(--yellow); margin-bottom:10px;
}
.savedate__title{
  font-size:clamp(20px,2.4vw,27px); font-weight:900; line-height:1.35;
  display:flex; align-items:baseline; flex-wrap:wrap; gap:0 8px;
}
.savedate__date{
  font-family:var(--font-num); font-size:clamp(46px,6vw,72px); line-height:.9;
  color:var(--yellow); letter-spacing:-.02em; margin:0 2px;
}
.savedate__date span{ margin:0 -.04em; }
.savedate__title i{ font-style:normal; font-size:.7em; font-weight:900; }
.savedate__note{ font-size:13.5px; color:rgba(255,255,255,.72); margin-top:12px; }
.savedate__actions{ display:flex; flex-direction:column; align-items:stretch; gap:10px; }
.savedate__ics{
  font-size:12.5px; font-weight:700; color:rgba(255,255,255,.7);
  text-align:center; text-decoration:underline; text-underline-offset:3px;
}
.savedate__ics:hover{ color:#fff; }
.br-sp{ display:none; }
@media (max-width:1023px){
  .savedate__inner{ grid-template-columns:1fr; gap:24px; padding:32px 26px; }
}
@media (max-width:767px){
  .savedate__inner{ padding:26px 20px; border-radius:20px; }
  .savedate__title{ font-size:19px; }
  .br-sp{ display:inline; }
}

/* ---------- ワークショップの写真 ---------- */
.ws__figure{ position:relative; width:min(100%,420px); justify-self:end; }
.ws__photo{
  border-radius:52% 48% 42% 58% / 50% 46% 54% 50%;
  overflow:hidden; transform:rotate(1deg);
  box-shadow:0 20px 44px rgba(20,80,78,.18);
}
.ws__photo img{ width:100%; aspect-ratio:11/8; object-fit:cover; display:block; }
.ws__date{
  position:absolute; left:-24px; bottom:-14px;
  background:var(--turquoise); color:#fff;
  padding:16px 24px 14px; text-align:center;
  border-radius:46% 54% 50% 50% / 52% 48% 52% 48%;
  transform:rotate(-3deg);
  box-shadow:0 12px 26px rgba(20,80,78,.22);
}
.ws__date b{ display:block; font-family:var(--font-num); font-size:40px; line-height:1; }
.ws__date b span{ font-family:var(--font-sans); font-size:.4em; font-weight:900; }
.ws__date i{ display:block; font-style:normal; font-size:11.5px; font-weight:900; margin-top:7px; }
@media (max-width:1023px){
  .ws__figure{ width:100%; max-width:none; justify-self:stretch; }
  .ws__date{ left:auto; right:6px; }
}

/* プログラムカードの写真 */
.program__item{ display:grid; grid-template-columns:88px 1fr; gap:0 22px; align-items:start; }
.program__thumb{
  grid-row:span 3; width:88px; aspect-ratio:1; border-radius:18px; overflow:hidden;
  border:4px solid var(--white); box-shadow:0 6px 16px rgba(20,80,78,.14);
}
.program__thumb img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:767px){
  .program__item{ grid-template-columns:68px 1fr; gap:0 16px; }
  .program__thumb{ width:68px; }
}

/* ワークショップの一言（CSS入れ替えで消えていたため復旧） */
.ws__catch{
  display:inline-block; margin-top:20px;
  font-size:clamp(15px,1.7vw,18px); font-weight:900; line-height:1.7;
  background:var(--yellow); color:var(--ink);
  padding:12px 20px; border-radius:12px; word-break:auto-phrase;
}
/* WS見出しの左カラムが窮屈だったので広げる */
.ws .event__head{ grid-template-columns:1fr minmax(300px,400px); gap:48px; }
@media (max-width:1023px){ .ws .event__head{ grid-template-columns:1fr; gap:28px; } }

/* ---------- 隊長からのメッセージ（CSS入れ替えで消えていたため復旧） ---------- */
.message{
  margin:0; background:var(--white); border:1px solid var(--rule);
  border-left:5px solid var(--orange); border-radius:var(--radius);
  padding:44px 48px 36px; position:relative;
}
.message__body{ margin:0; }
.message__body p{
  margin:0; font-size:clamp(15.5px,1.55vw,18px); font-weight:700; line-height:2.05;
  word-break:auto-phrase;
}
.message__body p + p{ margin-top:1.3em; }
.message__body p:last-of-type{ font-weight:900; }
.message__by{
  margin-top:24px; padding-top:16px; border-top:1px solid var(--rule);
  font-size:13.5px; font-weight:700; color:var(--ink-60);
}
@media (max-width:767px){
  .message{ padding:28px 22px 24px; }
  .message__body p{ font-size:16px; line-height:1.95; }
}

/* 主催者セクションの見出し：改行は <br> で明示し、自動の行バランスを無効にする
   （text-wrap:pretty が働くと「あるんだ」だけが3行目に落ちるため） */
.h2--organizer{
  font-size:clamp(25px,3.2vw,38px);
  max-width:none; text-wrap:normal; word-break:normal;
}

/* 協賛の見出し：2行の言い切り。改行は <br> で固定。
   親の .about__head が max-width:760px のため「つくれま／せん。」で泣き別れていた */
.support .about__head{ max-width:920px; }
.h2--support{
  font-size:clamp(23px,2.9vw,35px); line-height:1.5;
  max-width:none; text-wrap:normal; word-break:normal;
}

/* ---------- 狭い画面での横はみ出し対策 ---------- */
/* 原因1：.btn の white-space:nowrap が grid トラックの最小幅を押し上げていた
   原因2：word-break:auto-phrase は「文節」が min-content になるため、
          狭い幅で grid の 1fr トラックが縮まなくなる */
.ctablock > *, .program__item > *, .point > *, .organizer > *,
.dates__grid > *, .datecard > *, .teacher > *, .person > *{ min-width:0; }

@media (max-width:767px){
  .btn{
    white-space:normal; text-align:center; line-height:1.45;
    font-size:17px; padding:16px 22px;
  }
  .ctablock__actions .btn, .hero__cta .btn{ width:100%; }
  .spbar .btn{ font-size:13px; padding:14px 6px; }
}
@media (max-width:359px){
  :root{ --pad:14px; }
  .btn{ font-size:16px; padding:15px 14px; }
  .program__item{ padding:24px 18px; }
  .ctablock{ padding:26px 18px; }
}

/* ---------- ③ 紙のテクスチャ（フラットさを壊す） ---------- */
body::after{
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px 200px;
}
@media (prefers-reduced-motion:reduce){ body::after{ opacity:.03; } }

/* ---------- ② 3等分カードの並びを崩す（縦位置をずらす） ---------- */
@media (min-width:1024px){
  .point:nth-child(2){ margin-top:44px; }
  .point:nth-child(3){ margin-top:14px; }
  .point:nth-child(1) .point__photo{ width:min(264px,80%); }
  .point:nth-child(3) .point__photo{ width:min(228px,72%); }
}

/* ---------- ⑤ 白カードの「罫線＋影」感を薄める ---------- */
.panel{ border-color:var(--sand-deep); }

/* ---------- ⑥ skip link（キーボード操作） ---------- */
.skiplink{
  position:absolute; left:16px; top:0; z-index:200;
  transform:translateY(-110%);
  background:var(--ink); color:#fff; font-weight:900; font-size:14px;
  padding:12px 20px; border-radius:0 0 12px 12px; text-decoration:none;
  transition:transform .2s var(--ease);
}
.skiplink:focus{ transform:translateY(0); }

/* ---------- ⑦ ナビの現在地表示（スクロールスパイ） ---------- */
.header__nav a.is-current::after{ transform:scaleX(1); }
.header__nav a.is-current{ color:var(--orange-cta); }

/* inline style を置き換えたユーティリティ */
.section--tight{ padding-top:0; }
.priority--first{ margin-top:0; }
.panel--stacked{ margin-top:24px; }
.link-tq{ color:var(--turquoise-cta); font-weight:700; }

/* ---------- 判断に使う3つの要点 ---------- */
.keyfacts{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
  margin-bottom:64px;
}
.keyfact{
  background:var(--white); border-radius:var(--radius);
  padding:30px 30px 28px;
  border-top:4px solid var(--orange);
  display:flex; flex-direction:column;
}
.keyfact__label{
  font-size:11.5px; font-weight:900; letter-spacing:.16em;
  color:var(--orange-cta); margin-bottom:14px;
}
.keyfact__main{
  font-family:var(--font-num); font-size:clamp(34px,3.8vw,46px); line-height:1;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums;
  display:flex; align-items:baseline; flex-wrap:wrap; gap:0 2px;
}
.keyfact__main span{ font-family:var(--font-sans); font-size:.36em; font-weight:900; }
.keyfact__main i{ font-family:var(--font-sans); font-style:normal; font-size:.34em; font-weight:900; margin-left:4px; }
.keyfact__main--text{
  font-family:var(--font-sans); font-size:clamp(24px,2.6vw,32px); font-weight:900;
  line-height:1.3; display:block; letter-spacing:0;
}
.keyfact__main--text small{ display:block; font-size:.46em; font-weight:900; margin-top:6px; line-height:1.5; }
.keyfact__sub{
  font-size:13px; color:var(--ink-60); line-height:1.85; margin-top:14px;
}
.keyfact .maplink{ align-self:flex-start; margin-top:auto; }
.keyfact__sub + .maplink{ margin-top:16px; }
@media (max-width:1023px){
  .keyfacts{ grid-template-columns:1fr; gap:14px; margin-bottom:48px; }
  .keyfact{ padding:24px 24px 22px; }
}

/* ---------- 募集要項（カードにせず罫線だけ） ---------- */
.detail{ margin-bottom:64px; }
.detail__title{
  font-size:15px; font-weight:900; letter-spacing:.1em;
  padding-bottom:14px; margin-bottom:22px;
  border-bottom:2px solid var(--ink);
  display:flex; align-items:center; gap:9px;
}
.detail__title::before{ content:""; width:4px; height:15px; background:var(--orange); border-radius:2px; }
.detail__dl{
  display:grid; grid-template-columns:8.5em 1fr 11.5em 1fr; font-size:14.5px;
  column-gap:0;
}
.detail__dl dt{
  font-weight:900; padding:15px 20px 15px 0; border-bottom:1px solid var(--sand-deep);
}
.detail__dl dd{
  padding:15px 40px 15px 0; border-bottom:1px solid var(--sand-deep);
  color:var(--ink-60); line-height:1.8;
}
/* 左右2組の切れ目 */
@media (min-width:1024px){
  .detail__dl dt:nth-of-type(2n+1){ padding-left:0; }
  .detail__dl dd:nth-of-type(2n+1){ padding-right:40px; }
  .detail__dl dt:nth-of-type(2n){ padding-left:40px; border-left:1px solid var(--sand-deep); }
}
.detail__dl small{ display:block; font-size:12.5px; opacity:.85; margin-top:3px; }
@media (max-width:1023px){
  .detail__dl{ grid-template-columns:7.5em 1fr; }
  .detail__dl dd{ padding-right:0; }
}
@media (max-width:767px){
  .detail{ margin-bottom:48px; }
  .detail__dl{ grid-template-columns:1fr; }
  .detail__dl dt{
    padding:16px 0 0; border-bottom:none; font-size:11.5px;
    letter-spacing:.1em; color:var(--orange-cta);
  }
  .detail__dl dd{ padding:3px 0 16px; border-bottom:1px solid var(--sand-deep); color:var(--ink); font-weight:500; }
}

/* ---------- 本番までの流れ（横並びのステップ） ---------- */
.flow__list{ display:grid; grid-template-columns:repeat(6,1fr); gap:0; margin:28px 0 20px; }
.flow__step{ position:relative; padding:26px 12px 0 0; }
.flow__step::before{
  content:""; position:absolute; left:0; top:0; right:0; height:2px;
  background:var(--sand-deep);
}
.flow__step::after{
  content:""; position:absolute; left:0; top:-5px;
  width:12px; height:12px; border-radius:50%;
  background:var(--paper); border:3px solid var(--sand-deep);
}
.flow__step--now::after{ background:var(--turquoise); border-color:var(--turquoise); }
.flow__step--goal::after{ background:var(--orange); border-color:var(--orange); }
.flow__step--goal::before{ background:var(--orange); right:auto; width:44px; }
.flow__date{
  font-family:var(--font-num); font-size:17px; color:var(--ink-60);
  font-variant-numeric:tabular-nums; letter-spacing:-.01em;
}
.flow__date span{ font-family:var(--font-sans); font-size:11px; font-weight:900; margin-left:4px; }
.flow__step--now .flow__date{ color:var(--turquoise-cta); }
.flow__step--goal .flow__date{ color:var(--orange-cta); }
.flow__text{ font-size:13px; font-weight:700; line-height:1.7; margin-top:6px; }
.flow__step--goal .flow__text{ font-weight:900; }
@media (max-width:1023px){
  .flow__list{ grid-template-columns:repeat(3,1fr); row-gap:26px; }
}
@media (max-width:600px){
  .flow__list{ grid-template-columns:1fr; row-gap:0; margin-top:20px; }
  .flow__step{ padding:0 0 22px 26px; }
  .flow__step::before{ left:5px; top:0; bottom:0; right:auto; width:2px; height:auto; }
  .flow__step:last-child::before{ bottom:auto; height:14px; }
  .flow__step::after{ left:0; top:2px; }
  .flow__date{ font-size:16px; }
}

/* 募集要項の補足を、次の行と混ざらないように */
.detail__dl dd small{ margin-bottom:6px; }
.detail__dl dd small b{ color:var(--orange-cta); font-weight:900; }

/* ---------- 先頭に戻る ---------- */
.totop{
  position:fixed; right:26px; bottom:26px; z-index:98;
  width:52px; height:52px; border-radius:50%;
  background:rgba(255,255,255,.94); backdrop-filter:blur(8px);
  border:1.5px solid var(--rule); color:var(--orange-cta);
  display:grid; place-items:center; text-decoration:none;
  box-shadow:0 8px 22px rgba(60,40,20,.18);
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .25s var(--ease), transform .25s var(--ease), visibility .25s, box-shadow .2s var(--ease);
}
.totop.is-visible{ opacity:1; visibility:visible; transform:translateY(0); }
.totop svg{ width:22px; height:22px; display:block; }
.totop:hover{ transform:translateY(-3px); box-shadow:0 12px 26px rgba(60,40,20,.24); }
.totop:active{ transform:translateY(0); }
@media (max-width:1023px){
  /* スマホは下部の固定バーに重ならない位置へ */
  .totop{
    right:14px; width:46px; height:46px;
    bottom:calc(80px + env(safe-area-inset-bottom));
  }
  .totop svg{ width:20px; height:20px; }
}
@media (prefers-reduced-motion:reduce){
  .totop{ transition:opacity .01ms, visibility .01ms; transform:none; }
  .totop.is-visible{ transform:none; }
}

/* 2026-09-23 出店申込 受付開始 */