@charset "UTF-8";
/* =========================================================
   悪戸新田獅子舞（ささら）公式サイト
   日本画・金雲テイスト  ── style.css
   ========================================================= */

/* ---------- 0. 外字（𫞎＝「橋」の異体字 U+2B78E） ----------
   会長「𫞎本」の姓に使う一文字。CJK拡張Dの文字でOS標準フォントにほぼ
   収録されていないため、1文字だけを収めたWebフォントを読み込みます。
   unicode-range でこの一文字にしか効かないので、他の書体には影響しません。
   書体：花園明朝B（HanaMinB／パブリックドメイン）
------------------------------------------------------------ */
@font-face{
  font-family:"GaijiHashi";
  src:url("../fonts/gaiji-2b78e.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap;
  unicode-range:U+2B78E;
}

/* ---------- 1. トークン ---------- */
:root{
  /* 色 */
  --sumi:        #1e1b17;   /* 墨 */
  --sumi-2:      #3d372e;   /* 薄墨 */
  --sumi-3:      #6b6355;   /* 鼠 */
  --kinari:      #f7f2e4;   /* 生成り（和紙） */
  --kinari-2:    #efe7d2;
  --kinari-3:    #e4d9bd;
  --kin:         #b08a2e;   /* 金茶 */
  --kin-l:       #d9b44a;   /* 淡金 */
  --kin-d:       #8a6a1c;
  --kinji:       #e9c04a;   /* 金地 */
  --shu:         #c0272d;   /* 朱 */
  --shu-d:       #94161c;
  --shu-l:       #e0453c;
  --ai:          #27455f;   /* 藍 */
  --midori:      #3f6b4a;   /* 緑青 */

  /* 文字 */
  --serif: "GaijiHashi","Kaisei Opti","Zen Old Mincho","Noto Serif JP",'Hiragino Mincho ProN','Yu Mincho',serif;
  --sans:  "GaijiHashi","Zen Old Mincho","Noto Serif JP",'Hiragino Mincho ProN','Yu Mincho',serif;
  --en:    "GaijiHashi","Vollkorn","Zen Old Mincho",serif;
  --ease-out-quart: cubic-bezier(.165,.84,.44,1);
  --ease-out-quad: cubic-bezier(.25,.46,.45,.94);

  /* 寸法 */
  --wrap: 1120px;
  --wrap-narrow: 820px;
  --pad: clamp(20px, 5vw, 48px);
  --r: 6px;

  --shadow-s: 0 2px 10px rgba(30,27,23,.08);
  --shadow-m: 0 8px 30px rgba(30,27,23,.13);
  --shadow-l: 0 20px 60px rgba(30,27,23,.22);
}

/* ---------- 2. リセット ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px;-webkit-text-size-adjust:100%;background:var(--kinari)}
body{
  margin:0;
  font-family:var(--sans);
  font-size:18px;
  line-height:2.1;
  color:var(--sumi);
  background:var(--kinari);
  overflow-x:hidden;
  font-feature-settings:"palt" 1;
  letter-spacing:.05em;
}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;transition:color .25s,opacity .25s}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p,figure,dl,dd{margin:0}
table{border-collapse:collapse;width:100%}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
:focus-visible{outline:2px solid var(--shu);outline-offset:3px}

/* 和紙テクスチャ */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(176,138,46,.05) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 60%, rgba(30,27,23,.035) 0 1.5px, transparent 3px),
    radial-gradient(circle at 45% 85%, rgba(176,138,46,.045) 0 2px, transparent 4px);
  background-size:180px 180px, 120px 120px, 240px 240px;
}

/* ---------- 3. 共通パーツ ---------- */
.wrap{width:min(100% - var(--pad)*2, var(--wrap));margin-inline:auto;position:relative;z-index:1}
.wrap-n{width:min(100% - var(--pad)*2, var(--wrap-narrow));margin-inline:auto;position:relative;z-index:1}
.sec{position:relative;padding:clamp(72px,10vw,124px) 0;z-index:1;overflow:hidden;background:transparent}
/* 淡い金の帯：上下がグラデーションで溶けるので継ぎ目が出ない */
.sec--tint{
  background:linear-gradient(180deg,
    rgba(233,192,74,0) 0%,
    rgba(233,192,74,.11) 16%,
    rgba(233,192,74,.11) 84%,
    rgba(233,192,74,0) 100%);
}

/* 見出し */
.sec-hd{text-align:center;margin-bottom:clamp(40px,6vw,68px);position:relative}
.sec-no{display:block;width:56px;height:56px;margin:0 auto 22px;position:relative}
.sec-no::before{
  content:"";position:absolute;left:50%;top:-52px;width:1px;height:46px;
  background:linear-gradient(180deg,rgba(176,138,46,0),rgba(176,138,46,.75));
}
.sec-no i{
  display:grid;place-items:center;width:56px;height:56px;border-radius:50%;
  border:1.5px solid var(--kin);background:rgba(255,253,246,.8);
  font-family:var(--serif);font-weight:700;font-size:23px;font-style:normal;
  color:var(--kin-d);letter-spacing:0;
  box-shadow:0 5px 16px rgba(176,138,46,.2), inset 0 0 0 4px rgba(255,253,246,.9);
}
.sec-ttl__en{
  display:block;font-family:var(--en);font-weight:700;font-size:16px;letter-spacing:.42em;
  color:var(--kin);text-transform:uppercase;margin-bottom:16px;
}
.sec-ttl__ja{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(32px,5.4vw,58px);line-height:1.4;letter-spacing:.14em;
}
.sec-ttl__ja .accent{color:var(--shu)}
.sec-hd .sec-lead{margin-top:22px}
.sec-lead{margin-top:24px;font-size:18px;line-height:2.3;color:var(--sumi-2)}

/* ボタン */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  min-height:58px;padding:0 36px;border-radius:999px;
  font-family:var(--serif);font-weight:700;font-size:17px;letter-spacing:.1em;
  transition:transform .25s, box-shadow .25s, background-color .25s, color .25s;
}
.btn:hover{transform:translateY(-2px)}
.btn--shu{background:var(--shu);color:#fff;box-shadow:0 6px 20px rgba(192,39,45,.3)}
.btn--shu:hover{background:var(--shu-d);box-shadow:0 10px 26px rgba(192,39,45,.4)}
.btn--kin{background:linear-gradient(135deg,var(--kin-l),var(--kin));color:#fff;box-shadow:0 6px 20px rgba(176,138,46,.32)}
.btn--kin:hover{filter:brightness(1.06)}
.btn--ghost{border:1.5px solid var(--kin);color:var(--kin-d);background:rgba(255,255,255,.6)}
.btn--ghost:hover{background:var(--kin);color:#fff}
.btn--ghost-l{border:1.5px solid var(--kin);color:var(--kin-d);background:rgba(255,255,255,.6)}
.btn--ghost-l:hover{background:var(--kin);color:#fff}
.btn--sm{min-height:46px;padding:0 24px;font-size:14px}
.btn-row{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}

/* （小さな雲は廃止：装飾は大きな金雲に一本化） */
@media (prefers-reduced-motion:reduce){
  .kumo-big--sway,.kumo-acc--sway{animation:none}
  html{scroll-behavior:auto}
  .totop__c1,.totop__c2{transition:none}
  .totop:hover .totop__c1,.totop:hover .totop__c2{transform:none}
}

/* ============ 霞（かすみ）帯：セクションの始まりに左右交互で置く ============ */
.kasumi{
  position:absolute;top:0;z-index:0;pointer-events:none;line-height:0;
  width:min(46%,620px);opacity:.42;
}
.kasumi img{width:100%;height:auto;display:block}
.kasumi--r{right:-3%}
.kasumi--l{left:-3%}
.kasumi--flip img{transform:scaleX(-1)}
@media (max-width:860px){
  .kasumi{width:min(62%,420px);opacity:.34}
}
@media (max-width:560px){
  .kasumi{width:min(78%,340px);opacity:.3}
}

/* ============ 雲形アクセント：全体を切らずにカード・表の背後へ ============ */
.kumo-acc{
  position:absolute;z-index:0;pointer-events:none;line-height:0;
  width:var(--w,30%);opacity:var(--o,.24);
}
.kumo-acc img{width:100%;height:auto;display:block}
.kumo-acc--flip img{transform:scaleX(-1)}
.kumo-acc--sway{animation:sway var(--sway-time,48s) ease-in-out infinite alternate}
@media (max-width:860px){
  .kumo-acc{width:min(var(--w,30%),46%);opacity:calc(var(--o,.24) * .8)}
}

/* 大きな金雲（全体を見せる・ゆっくり動く） */
.kumo-big{
  position:absolute;width:var(--w,100%);z-index:0;pointer-events:none;line-height:0;
  overflow:visible;
}
.kumo-big img{width:100%;height:auto;display:block}
.kumo-big--flip img{transform:scaleY(-1)}
.kumo-big--sway{animation:sway var(--sway-time,34s) ease-in-out infinite alternate}
@keyframes sway{
  from{transform:translate3d(calc(var(--sway-x,26px) * -1),calc(var(--sway-y,8px) * -1),0)}
  to{transform:translate3d(var(--sway-x,26px),var(--sway-y,8px),0)}
}

/* スクロールで現れる（すっと上へ）
   ぼかしは使いません。文字が終始くっきり読めるようにするためです。 */
.js .fx{opacity:0;transform:translateY(24px);
  transition:opacity .75s var(--ease-out-quart),transform .75s var(--ease-out-quart)}
.js .fx.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js .fx{opacity:1;transform:none;transition:none}
}

/* ---------- 4. ヘッダー（雲つきハンバーガー） ---------- */
.hdr{
  position:fixed;top:0;right:0;z-index:250;
  width:clamp(150px,16vw,220px);height:clamp(120px,13vw,180px);
  pointer-events:none;
}
.hdr__kumo{
  position:absolute;top:clamp(-20px,-1.8vw,-8px);right:clamp(-34px,-3vw,-16px);
  width:clamp(200px,21vw,290px);
  transition:opacity .35s var(--ease-out-quart);
  filter:drop-shadow(0 8px 20px rgba(120,88,20,.25));
}
body.menu-open .hdr__kumo{opacity:0}
.hdr__btn{
  position:absolute;top:clamp(24px,3vw,44px);right:clamp(30px,4vw,62px);
  pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:6px;
}
.hdr__lines{position:relative;width:46px;height:17px}
.hdr__lines span{
  position:absolute;display:block;height:3.5px;background:var(--sumi);
  border-radius:6px 3px 5px 2px / 4px 6px 2px 5px;
  transition:transform .35s var(--ease-out-quart),opacity .35s var(--ease-out-quart);
}
.hdr__lines span:nth-child(1){top:0;left:2px;width:40px;transform:rotate(-2.5deg);transform-origin:left top}
.hdr__lines span:nth-child(2){top:7px;left:0;width:46px;transform:rotate(1.5deg);transform-origin:right top}
.hdr__lines span:nth-child(3){top:14px;left:3px;width:36px;transform:rotate(-1.5deg)}
body.menu-open .hdr__lines span:nth-child(1){transform:translate(4px,1px) rotate(22deg)}
body.menu-open .hdr__lines span:nth-child(2){transform:translate(-2px,-4px) rotate(-22deg)}
body.menu-open .hdr__lines span:nth-child(3){opacity:0}
.hdr__txt{
  display:grid;justify-items:center;
  font-family:var(--en);font-weight:700;font-size:14px;letter-spacing:.08em;
  line-height:1;color:var(--sumi);
}
.hdr__txt span{grid-area:1/1;transition:opacity .35s var(--ease-out-quart)}
.hdr__txt .t-close{opacity:0}
body.menu-open .hdr__txt .t-open{opacity:0}
body.menu-open .hdr__txt .t-close{opacity:1}

/* 左上：小さなロゴ（下層ページの戻り導線） */
.hdr-mark{
  position:fixed;top:18px;left:26px;z-index:140;
  display:flex;align-items:center;gap:12px;pointer-events:auto;
}
.hdr-mark img{
  /* 横長ロゴ（1336 × 175）。高さで大きさを決め、狭い画面では幅で抑える */
  display:block;width:auto;height:44px;max-width:min(360px,46vw);object-fit:contain;
}
@media (max-width:1000px){
  .hdr-mark{top:14px;left:16px}
  .hdr-mark img{height:34px;max-width:min(280px,52vw)}
}
@media (max-width:400px){
  .hdr-mark img{height:28px;max-width:56vw}
}

/* ---------- 4b. 全画面メニュー（右ドロワー） ---------- */
.menu{position:fixed;inset:0;z-index:200;pointer-events:none}
body.menu-open .menu{pointer-events:auto}
.menu__overlay{
  position:absolute;inset:0;background:rgba(30,27,23,.5);
  opacity:0;transition:opacity .5s var(--ease-out-quart);
}
body.menu-open .menu__overlay{opacity:1}
.menu__inner{
  position:absolute;top:0;right:0;height:100%;
  width:min(440px,88vw);
  background:var(--kinari-2);
  border-left:1px solid rgba(176,138,46,.5);
  box-shadow:-24px 0 60px rgba(30,27,23,.25);
  transform:translateX(101%);
  transition:transform .5s var(--ease-out-quart);
  display:flex;align-items:center;justify-content:center;
  overflow-y:auto;overscroll-behavior:contain;
}
.menu__inner::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:
    radial-gradient(circle at 24% 28%, rgba(176,138,46,.06) 0 2px, transparent 3px),
    radial-gradient(circle at 72% 64%, rgba(30,27,23,.04) 0 1.5px, transparent 3px);
  background-size:170px 170px, 110px 110px;
}
body.menu-open .menu__inner{transform:translateX(0)}
.menu__content{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;
  padding:96px 0 56px;
}
.menu__list{display:flex;flex-direction:column;gap:clamp(20px,3.4vh,30px)}
.menuItem{
  opacity:0;transform:translateX(10px);
  transition:opacity .45s var(--ease-out-quad),transform .45s var(--ease-out-quad);
}
body.menu-open .menuItem{opacity:1;transform:none}
body.menu-open .menuItem:nth-child(1){transition-delay:.16s}
body.menu-open .menuItem:nth-child(2){transition-delay:.21s}
body.menu-open .menuItem:nth-child(3){transition-delay:.26s}
body.menu-open .menuItem:nth-child(4){transition-delay:.31s}
body.menu-open .menuItem:nth-child(5){transition-delay:.36s}
body.menu-open .menuItem:nth-child(6){transition-delay:.41s}
body.menu-open .menuItem:nth-child(7){transition-delay:.46s}
body.menu-open .menuItem:nth-child(8){transition-delay:.51s}
body.menu-open .menuItem:nth-child(9){transition-delay:.56s}
body.menu-open .menuItem:nth-child(10){transition-delay:.61s}
.menuItem a{display:grid;align-items:center}
.menuItem__icon{
  grid-area:1/1;width:9px;height:9px;border-radius:50%;
  background:var(--shu);opacity:0;
  transition:opacity .3s var(--ease-out-quad);
}
.menuItem__text{
  grid-area:1/1;
  font-family:var(--serif);font-weight:700;
  font-size:clamp(19px,2.6vh,23px);letter-spacing:.1em;line-height:1.2;
  color:var(--sumi);
  transform-origin:left center;
  transition:transform .3s var(--ease-out-quad) .15s;
}
.menuItem a:hover .menuItem__icon{opacity:1;transition-delay:.1s}
.menuItem a:hover .menuItem__text{transform:translateX(18px);transition-delay:0s}
/* メニューの Instagram（ページのリンクとは分けて、少し小さく置きます） */
.menuItem--sns{margin-top:6px;padding-top:clamp(16px,2.6vh,24px);border-top:1px solid rgba(176,138,46,.4)}
.menuItem--sns a{display:inline-flex;align-items:center;gap:10px}
.menuItem--sns .menuItem__text{grid-area:auto;font-size:clamp(16px,2.1vh,18px);letter-spacing:.08em;color:var(--sumi-2)}
.menuItem--sns a:hover .menuItem__text{transform:none;color:var(--shu)}
.ig__icon{
  width:1.25em;height:1.25em;flex:0 0 auto;
  fill:none;stroke:currentColor;stroke-width:1.7;
  color:var(--kin-d);transition:color .25s ease;
}
.ig__icon .ig__dot{fill:currentColor;stroke:none}
.menuItem--sns a:hover .ig__icon,.ftr__sns a:hover .ig__icon{color:var(--shu)}
.ftr__sns{margin-top:16px}
.ftr__sns a{display:inline-flex;align-items:center;gap:8px}
.menu__logo{
  width:96px;margin:40px auto 0;align-self:center;
  opacity:0;filter:blur(12px);
  transition:opacity .7s var(--ease-out-quad) .5s,filter .7s var(--ease-out-quad) .5s;
}
body.menu-open .menu__logo{opacity:1;filter:blur(0)}
body.menu-open{overflow:hidden}

/* ---------- 5. ヒーロー（ロゴ＋イラスト中央） ---------- */
.hero{
  position:relative;min-height:100svh;
  display:grid;place-items:center;
  overflow:hidden;isolation:isolate;
  background:#e9c04a url("../img/bg-kinji.webp") center top/cover no-repeat;
}
/* 金地 → 生成りへ、継ぎ目なく溶ける */
.hero::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    radial-gradient(120% 70% at 50% 8%, rgba(255,250,230,.42), transparent 58%),
    linear-gradient(180deg,
      rgba(247,242,228,0) 0%,
      rgba(247,242,228,0) 58%,
      rgba(247,242,228,.35) 78%,
      rgba(247,242,228,.82) 92%,
      var(--kinari) 100%);
}
.hero__center{
  position:relative;z-index:4;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:clamp(38px,5.5vh,70px) 16px clamp(14px,2.6vh,30px);
}
/* ロゴを h1 で包んでいます（見た目は変えず、検索エンジンに見出しとして伝えるため） */
.hero__ttl{margin:0;line-height:0;font-size:0}
.hero__biglogo{
  /* ロゴ（573 × 687）。高さ基準だが、横に広がりすぎないよう幅も抑える */
  width:auto;height:min(440px,52svh);max-width:min(400px,78vw);object-fit:contain;
  filter:drop-shadow(0 10px 30px rgba(120,88,20,.35));
}
.hero__figs{
  position:relative;z-index:5;
  display:flex;align-items:flex-end;justify-content:center;
  gap:clamp(4px,1.4vw,26px);
  margin-top:40px;
  pointer-events:none;
}
.hero__figs img{
  width:min(660px,58vw);
  filter:drop-shadow(0 16px 30px rgba(120,88,20,.34));
}

/* ---- スクロール誘導（和のテイスト／3種の切替） ---- */
.scroll-cue{
  position:absolute;left:clamp(14px,2.4vw,36px);bottom:22px;z-index:6;
  display:flex;flex-direction:column;align-items:center;gap:14px;
  pointer-events:none;user-select:none;
}
.scroll-cue__txt{
  writing-mode:vertical-rl;
  font-family:var(--serif);font-weight:700;
  font-size:15px;letter-spacing:.34em;color:var(--kin-d);
  text-shadow:0 1px 0 rgba(255,250,232,.65);
}
.scroll-cue__art{position:relative;display:block;width:28px;height:80px}
.scroll-cue i{display:block}

/* 案0：ファビコンの獅子マークがおりる（現行） */
.scroll-cue--mark .scroll-cue__art{--mark:24px;--fall:58px;height:84px}
.scroll-cue--mark .scroll-cue__art::before{
  content:"";position:absolute;left:50%;top:4px;width:1px;height:100%;
  background:linear-gradient(180deg,rgba(176,138,46,.5),rgba(176,138,46,0));
  transform:translateX(-50%);
}
.scroll-cue--mark i{
  position:absolute;left:50%;top:0;
  width:var(--mark);height:var(--mark);margin-left:calc(var(--mark) / -2);
  background:url(../img/favicon.svg) center/contain no-repeat;
  animation:cue-mark 2.7s cubic-bezier(.4,0,.2,1) infinite;
}
.scroll-cue--mark i:nth-child(2){animation-delay:.9s}
.scroll-cue--mark i:nth-child(3){animation-delay:1.8s}
@keyframes cue-mark{
  0%{transform:translateY(0) scale(.55);opacity:0}
  16%{opacity:1}
  72%{opacity:1}
  100%{transform:translateY(var(--fall)) scale(1);opacity:0}
}

/* 案1：雲がおりる */
.scroll-cue--kumo .scroll-cue__art::before{
  content:"";position:absolute;left:50%;top:2px;width:1px;height:100%;
  background:linear-gradient(180deg,rgba(176,138,46,.5),rgba(176,138,46,0));
  transform:translateX(-50%);
}
.scroll-cue--kumo i{
  position:absolute;left:50%;top:0;width:22px;height:8px;margin-left:-11px;
  background:var(--kin);border-radius:8px;
  animation:cue-kumo 2.7s cubic-bezier(.4,0,.2,1) infinite;
}
.scroll-cue--kumo i::before,.scroll-cue--kumo i::after{
  content:"";position:absolute;background:var(--kin);border-radius:50%;
}
/* 左の大きなふくらみ＋中央のふくらみ（box-shadowで追加） */
.scroll-cue--kumo i::before{
  width:11px;height:11px;left:0;top:-6px;
  box-shadow:8px 1px 0 -1px var(--kin);
}
/* 右へ伸びる尾 */
.scroll-cue--kumo i::after{
  width:7px;height:7px;right:0;top:-3px;
  border-radius:50% 50% 50% 0;
}
.scroll-cue--kumo i:nth-child(2){animation-delay:.9s}
.scroll-cue--kumo i:nth-child(3){animation-delay:1.8s}
@keyframes cue-kumo{
  0%{transform:translateY(0) scale(.65);opacity:0}
  16%{opacity:1}
  72%{opacity:1}
  100%{transform:translateY(66px) scale(1);opacity:0}
}

/* 案2：草鞋の足あと */
.scroll-cue--ashiato i{
  position:absolute;left:50%;width:13px;height:19px;
  background:var(--kin);border-radius:52% 52% 46% 46%;
  opacity:0;animation:cue-ashi 2.4s ease-in-out infinite;
}
.scroll-cue--ashiato i::after{
  content:"";position:absolute;left:50%;top:3px;width:1.8px;height:9px;margin-left:-.9px;
  background:var(--kinari);border-radius:2px;
}
.scroll-cue--ashiato i:nth-child(1){top:2px;margin-left:-13px;transform:rotate(-9deg)}
.scroll-cue--ashiato i:nth-child(2){top:29px;margin-left:0;transform:rotate(9deg);animation-delay:.36s}
.scroll-cue--ashiato i:nth-child(3){top:56px;margin-left:-13px;transform:rotate(-9deg);animation-delay:.72s}
@keyframes cue-ashi{0%,72%,100%{opacity:0}12%,46%{opacity:.95}}

/* 案3：太鼓の波紋 */
.scroll-cue--taiko .scroll-cue__art{height:62px}
.scroll-cue--taiko .scroll-cue__art::before{
  content:"";position:absolute;left:50%;top:5px;width:13px;height:13px;margin-left:-6.5px;
  border-radius:50%;background:var(--kin-d);
}
.scroll-cue--taiko i{
  position:absolute;left:50%;top:5px;width:13px;height:13px;margin-left:-6.5px;
  border:1.6px solid var(--kin);border-radius:50%;opacity:0;
  animation:cue-taiko 2.2s ease-out infinite;
}
.scroll-cue--taiko i:nth-child(2){animation-delay:.55s}
.scroll-cue--taiko i:nth-child(3){animation-delay:1.1s}
@keyframes cue-taiko{
  0%{transform:scale(1) translateY(0);opacity:.9}
  100%{transform:scale(2.7) translateY(36px);opacity:0}
}

@media (prefers-reduced-motion:reduce){
  .scroll-cue i{animation:none!important;opacity:.9!important}
  /* 動きを止める設定のときはマークを1つだけ表示 */
  .scroll-cue--mark i:nth-child(n+2){display:none}
}
@media (max-width:640px){
  .scroll-cue{left:10px;bottom:16px;gap:11px}
  .scroll-cue__txt{font-size:13.5px}
  .scroll-cue__art{height:62px}
  .scroll-cue--mark .scroll-cue__art{--mark:20px;--fall:42px;height:64px}
}

/* ヒーロー内の大きな雲（全体を見せる） */
.hero .kumo-big{z-index:1}

@media (max-width:820px){
  /* スマホでは雲をさらに大きく、画面外へ大きくはみ出させる */
  .hero .kumo-big{--w:155%!important}
  .hero .kumo-big:nth-of-type(1){left:-42%!important;top:-6%!important}
  .hero .kumo-big:nth-of-type(2){right:-48%!important;bottom:16%!important;opacity:1!important}
  .hero__biglogo{height:min(360px,38svh);max-width:82vw}
  .hero__figs img{width:min(430px,92vw)}
  .hero__scroll{left:14px}
}

/* ---------- 6. お知らせ ---------- */
.news{position:relative}
.news__list{display:grid;gap:0;border-top:1px solid rgba(176,138,46,.4)}
.news__item{
  display:grid;grid-template-columns:130px 90px 1fr;gap:0 22px;align-items:start;
  padding:26px 6px;border-bottom:1px solid rgba(176,138,46,.4);
}
.news__date{font-family:var(--en);font-size:15px;letter-spacing:.08em;color:var(--sumi-3);padding-top:2px}
.news__cat{
  justify-self:start;font-size:11.5px;letter-spacing:.14em;font-family:var(--serif);
  padding:4px 12px;border-radius:999px;background:var(--sumi);color:var(--kin-l);white-space:nowrap;
}
.news__cat[data-cat="募集"]{background:var(--shu);color:#fff}
.news__cat[data-cat="祭礼"]{background:var(--ai);color:#fff}
.news__ttl{font-family:var(--serif);font-weight:700;font-size:21px;line-height:1.75}
.news__body{margin-top:10px;font-size:17px;line-height:2.15;color:var(--sumi-2)}
.news__more{
  display:inline-flex;align-items:center;gap:.4em;margin-top:12px;
  font-size:15.5px;color:var(--shu);font-family:var(--serif);font-weight:700;
}
.news__more:hover{opacity:.7}
@media (max-width:720px){
  .news__item{grid-template-columns:1fr;gap:8px}
  .news__date{font-size:13px}
}

/* ---------- 7. ささらとは ---------- */
.about{position:relative;overflow:hidden;padding-top:clamp(34px,5vw,62px)}
.gyoretsu{
  position:relative;z-index:2;width:100%;line-height:0;
  padding:0 50px;margin:0 0 clamp(34px,5vw,62px);
}
/* 行列の絵は、どの画面幅でも先頭から最後まで全部おさまるようにします。
   （以前は min-width:820px を入れていたため、狭い画面で両端が切れていました） */
.gyoretsu{overflow:visible}
.gyoretsu img{width:100%;max-width:100%;min-width:0;height:auto;display:block;margin-inline:auto}
@media (max-width:860px){ .gyoretsu{padding:0 24px} }
@media (max-width:640px){ .gyoretsu{padding:0 10px} }
.about__grid{max-width:860px;margin-inline:auto;text-align:center}
.about__body h3{
  font-family:var(--serif);font-weight:700;font-size:clamp(25px,3.2vw,36px);
  line-height:1.6;letter-spacing:.08em;margin-bottom:28px;
}
.about__body p{font-size:18px;line-height:2.3;color:var(--sumi-2);margin-bottom:1.3em;text-align:left}
.about__body p .em{color:var(--shu);font-weight:700}

.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,30px);margin-top:clamp(48px,6vw,76px)}
.pillar{
  background:#fff;border:1px solid rgba(176,138,46,.35);border-radius:var(--r);
  padding:38px 28px 34px;text-align:center;position:relative;box-shadow:var(--shadow-s);
  transition:transform .3s, box-shadow .3s;
  display:flex;flex-direction:column;
}
.pillar:hover{transform:translateY(-4px);box-shadow:var(--shadow-m)}
.pillar__no{
  font-family:var(--serif);font-weight:700;font-size:22px;letter-spacing:.18em;
  color:var(--kin-d);display:block;margin-bottom:18px;
}
.pillar__fig{width:auto;max-width:100%;height:150px;object-fit:contain;margin:0 auto 20px}
.pillar h4{font-family:var(--serif);font-weight:700;font-size:24px;letter-spacing:.06em;margin-bottom:14px}
.pillar p{font-size:16.5px;line-height:2.1;color:var(--sumi-2);text-align:left}

.cast{margin-top:clamp(52px,7vw,84px)}
.cast__fig{margin:0 auto clamp(30px,4.4vw,52px);max-width:min(720px,86%)}
.cast__fig img{width:100%;height:auto;display:block}
.cast__list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cast__list li{
  background:#fff;border:1px solid rgba(176,138,46,.4);border-left:5px solid var(--shu);
  padding:22px 26px;box-shadow:var(--shadow-s);
}
.cast__list b{
  display:block;font-family:var(--serif);font-weight:700;font-size:22px;
  letter-spacing:.06em;margin-bottom:8px;
}
.cast__list span{display:block;font-size:16.5px;line-height:2.05;color:var(--sumi-2)}

@media (max-width:900px){
  .pillars{grid-template-columns:1fr}
  .cast__list{grid-template-columns:1fr}
  .cast__fig{max-width:100%}
}

/* ---------- 8. 巡行・時刻表 ---------- */
.info-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:clamp(40px,5vw,60px)}
.info-card{
  background:#fff;border-top:3px solid var(--shu);padding:28px 26px;box-shadow:var(--shadow-s);
}
.info-card dt{font-family:var(--en);font-weight:700;font-size:13.5px;letter-spacing:.24em;color:var(--kin);margin-bottom:10px}
.info-card dd{font-family:var(--serif);font-weight:700;font-size:clamp(18px,2.3vw,24px);line-height:1.6;letter-spacing:.06em}
.info-card dd small{display:block;font-size:15px;font-weight:400;color:var(--sumi-2);margin-top:8px;letter-spacing:.04em;font-family:var(--sans);line-height:1.9}

.sched{background:#fff;box-shadow:var(--shadow-m);border:1px solid rgba(176,138,46,.3)}
.sched__hd{
  display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;justify-content:space-between;
  padding:22px 26px;border-bottom:2px solid var(--sumi);background:var(--kinari-2);
}
.sched__ttl{font-family:var(--serif);font-weight:700;font-size:21px;letter-spacing:.14em}
/* 雨天時の札（小雨決行）。管理画面で空にすると消えます */
.sched__rain{display:inline-block;vertical-align:3px;margin-left:14px;padding:2px 10px 3px;
  border:1.5px solid var(--shu);border-radius:4px;color:var(--shu);
  font-family:var(--sans);font-size:14px;font-weight:700;letter-spacing:.12em;line-height:1.5}
.sched__rain:empty{display:none}
@media (max-width:700px){ .sched__rain{display:table;margin:10px 0 0} }
.sched__legend{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14.5px;color:var(--sumi-2)}
.sched__legend i{font-style:normal;color:var(--shu);font-weight:700}
.sched__scroll{max-height:none}
.sched table{font-size:16.5px}
.sched thead th{
  background:var(--sumi);color:var(--kin-l);font-family:var(--serif);font-weight:700;
  letter-spacing:.12em;font-size:13px;padding:13px 10px;text-align:center;white-space:nowrap;
}
.sched tbody td{border-bottom:1px solid rgba(176,138,46,.28);padding:13px 10px;text-align:center;vertical-align:middle}
.sched tbody tr:nth-child(even){background:rgba(247,242,228,.55)}
.sched .c-no{width:56px;color:var(--sumi-3);font-family:var(--serif);font-size:13px}
.sched .c-time{width:170px;white-space:nowrap;font-family:var(--serif);letter-spacing:.04em}
.sched .c-time b{font-weight:700}
.sched .c-time span{color:var(--sumi-3);margin:0 .35em}
.sched .c-name{text-align:left;font-family:var(--serif);font-weight:700;font-size:18.5px;letter-spacing:.06em}
.sched .c-name small{display:block;font-family:var(--sans);font-weight:400;font-size:14px;color:var(--sumi-2);letter-spacing:.02em;margin-top:2px}
.sched .c-note{width:118px;font-size:14px;color:var(--sumi-2)}
.sched .c-grp{width:64px}
.sched .rest::before{content:"○";color:var(--shu);margin-right:.4em;font-size:12px;vertical-align:2px}

/* 舞をうけもつ組（イ・ロ・ハ）。色は配られる時刻表と同じ */
.grp{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:50%;
  font-family:var(--serif);font-style:normal;font-weight:700;font-size:15px;
  line-height:1;letter-spacing:0;color:#fff;
}
.grp--i {background:#d98a2b}
.grp--ro{background:#2f7fc4}
.grp--ha{background:#a6d45a;color:#243f05}  /* 黄緑。明るい色なので文字は濃い緑に */
.grp--non{background:none;color:var(--sumi-3);font-size:13px;width:auto;height:auto}
.sched tr.is-start .grp--non,.sched tr.is-end .grp--non{color:#8d8577}
.sched__grp{display:inline-flex;align-items:center;gap:4px}
.sched__grp .grp{width:24px;height:24px;font-size:13px}
.sched__grp em{font-style:normal;white-space:nowrap;margin-left:2px}
.sched tr.is-rite td{background:rgba(192,39,45,.07)}
.sched tr.is-meal td{background:rgba(233,192,74,.18)}
.sched tr.is-start td,.sched tr.is-end td{background:var(--sumi);color:var(--kinari)}
.sched tr.is-start .c-name,.sched tr.is-end .c-name{color:var(--kin-l)}
.sched tr.is-start .c-name small,.sched tr.is-end .c-name small,
.sched tr.is-start .c-note,.sched tr.is-end .c-note,
.sched tr.is-start .c-no,.sched tr.is-end .c-no{color:#c9c0ad}
.sched__ft{padding:18px 26px;background:var(--kinari-2);font-size:15px;color:var(--sumi-2);line-height:2}
.sched__ft b{color:var(--shu)}

.map-box{margin-top:clamp(36px,5vw,56px);display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,3.4vw,44px);align-items:start}
.map-box figure{background:#fff;padding:14px;box-shadow:var(--shadow-m);border:1px solid rgba(176,138,46,.3)}
.map-box a.zoom{display:block;position:relative}
.map-box a.zoom::after{
  content:"クリックで拡大";position:absolute;right:10px;bottom:10px;
  background:rgba(30,27,23,.82);color:var(--kin-l);font-size:11.5px;letter-spacing:.1em;
  padding:6px 12px;border-radius:999px;font-family:var(--serif);
}
.map-box a.zoom:hover::after{background:var(--shu);color:#fff}
.map-box figcaption{margin-top:12px;font-size:14.5px;color:var(--sumi-2);text-align:center;letter-spacing:.06em}
.caution{background:#fff;border-left:4px solid var(--shu);padding:26px 28px;box-shadow:var(--shadow-s)}
.caution h4{font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:.1em;margin-bottom:14px}
.caution li{position:relative;padding-left:1.3em;font-size:16.5px;line-height:2.1;color:var(--sumi-2);margin-bottom:.5em}
.caution li::before{content:"※";position:absolute;left:0;color:var(--kin)}

@media (max-width:900px){
  .info-cards{grid-template-columns:1fr}
  .map-box{grid-template-columns:1fr}
}
@media (max-width:700px){
  /* スマホでは「備考」を隠し、そのぶん「組」を画面内に収めます
     （小休止は町名のまえの○印、食事などは町名の下の補足でわかります） */
  .sched__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .sched table{min-width:0}
  .sched thead th{padding:11px 5px;letter-spacing:.06em}
  .sched tbody td{padding:12px 5px}
  .sched table{font-size:15px}
  .sched .c-no{width:30px;font-size:12px}
  .sched .c-time{width:118px;font-size:14.5px}
  .sched .c-time span{margin:0 .2em}
  .sched .c-grp{width:44px}
  .sched .c-note{display:none}
  .sched .c-name{font-size:16.5px;letter-spacing:.04em}
  .sched .c-name small{font-size:12.5px}
  .sched .grp{width:27px;height:27px;font-size:14px}
}

/* ---------- 9. 動画 ---------- */
.movies{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,30px)}
/* 本数が少ないときは中央に寄せ、1枚が巨大にならないようにする */
.movies:has(.movie:only-child){grid-template-columns:minmax(0,760px);justify-content:center}
.movies:has(.movie:nth-child(2)):not(:has(.movie:nth-child(3))){
  grid-template-columns:repeat(2,minmax(0,520px));justify-content:center;
}
.movie{background:#fff;border:1px solid rgba(176,138,46,.4);overflow:hidden;box-shadow:var(--shadow-m)}
.movie video{width:100%;aspect-ratio:16/9;object-fit:cover;background:#1e1b17;display:block}
/* YouTube：押すまで読み込まない（サムネイル＋再生ボタン） */
.movie .yt{
  display:block;position:relative;width:100%;aspect-ratio:16/9;
  padding:0;border:0;background:#1e1b17;cursor:pointer;overflow:hidden;
}
.yt__thumb{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s cubic-bezier(.2,.7,.3,1),filter .3s ease;
}
.yt:hover .yt__thumb,.yt:focus-visible .yt__thumb{transform:scale(1.045);filter:brightness(.88)}
.yt__play{
  position:absolute;left:50%;top:50%;translate:-50% -50%;
  width:74px;height:74px;border-radius:50%;
  background:rgba(30,27,23,.62);border:2px solid rgba(255,250,232,.9);
  backdrop-filter:blur(2px);
  transition:background .25s ease,scale .25s cubic-bezier(.2,.7,.3,1);
}
.yt__play::before{
  content:"";position:absolute;left:53%;top:50%;translate:-50% -50%;
  border-style:solid;border-width:13px 0 13px 22px;
  border-color:transparent transparent transparent var(--kinari);
}
.yt:hover .yt__play,.yt:focus-visible .yt__play{background:var(--shu);scale:1.08}
.yt:focus-visible{outline:3px solid var(--kin);outline-offset:-3px}
/* 映像モーダル */
.vm{
  /* ヘッダーの雲が z-index:250 なので、モーダルはそれより前に出します */
  position:fixed;inset:0;z-index:260;display:none;place-items:center;
  background:rgba(18,16,13,.94);padding:clamp(14px,4vw,40px);
  opacity:0;transition:opacity .22s ease;
}
.vm.is-open{display:grid}
.vm.is-shown{opacity:1}
/* グリッド中央寄せの子は中身なりに縮むので、包む側で幅を決める */
.vm__in{width:min(100%,1100px)}
.vm__box{
  position:relative;width:100%;
  aspect-ratio:16/9;max-height:min(78vh,calc(100vw * 9 / 16));
  background:#000;box-shadow:0 30px 80px rgba(0,0,0,.6);
  transform:scale(.97);transition:transform .22s var(--ease-out-quart);
}
.vm.is-shown .vm__box{transform:none}
.vm__box iframe{width:100%;height:100%;display:block;border:0}
.vm__ttl{
  margin:16px auto 0;max-width:1100px;text-align:center;
  color:var(--kinari);font-family:var(--serif);font-size:14.5px;letter-spacing:.08em;
}
/* 閉じるボタンは箱ではなく画面に固定する。
   画面が低いと箱が縮み、箱基準だとボタンが画面外に出てしまうため。 */
.vm__close{
  position:absolute;top:calc(16px + env(safe-area-inset-top,0px));right:16px;
  width:44px;height:44px;border:0;border-radius:50%;z-index:2;
  background:rgba(22,20,17,.72);color:var(--kinari);font-size:22px;line-height:1;
  display:grid;place-items:center;cursor:pointer;font-family:inherit;
  border:1px solid rgba(247,242,228,.34);backdrop-filter:blur(3px);
}
.vm__close:hover{background:rgba(247,242,228,.28)}
.vm__close:focus-visible{outline:2px solid var(--kin-l);outline-offset:2px}
@media (max-width:640px){
  .vm__close{width:40px;height:40px;font-size:20px}
  .vm__ttl{font-size:13px;margin-top:12px}
}
@media (prefers-reduced-motion:reduce){
  .vm,.vm__box{transition:none}
}
@media (max-width:640px){.yt__play{width:60px;height:60px}.yt__play::before{border-width:11px 0 11px 18px}}
@media (prefers-reduced-motion:reduce){
  .yt__thumb,.yt__play{transition:none}
  .yt:hover .yt__thumb{transform:none}
}
.movie__cap{padding:20px 22px 24px}
.movie__cap h4{font-family:var(--serif);font-weight:700;font-size:20px;letter-spacing:.08em;color:var(--kin-d);margin-bottom:8px}
.movie__cap p{font-size:16.5px;line-height:2;color:var(--sumi-2)}
@media (max-width:900px){.movies{grid-template-columns:1fr}}

/* ---------- 10. ギャラリー ---------- */
.gallery{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:12px;
}
@media (max-width:640px){ .gallery{grid-template-columns:repeat(2,1fr);gap:8px} }
.gallery button{
  position:relative;display:block;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--kinari-3);
  border:1px solid rgba(176,138,46,.3);
}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.gallery button:hover img{transform:scale(1.07)}
.gallery button::after{
  content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(30,27,23,.35),transparent 45%);
  opacity:0;transition:opacity .35s;
}
.gallery button:hover::after{opacity:1}

/* ライトボックス */
.lb{
  position:fixed;inset:0;z-index:260;display:none;place-items:center;
  background:rgba(18,16,13,.94);padding:24px;
}
.lb.is-open{display:grid}
.lb__img{max-width:min(100%,1200px);max-height:78vh;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.lb__cap{margin-top:18px;text-align:center;color:var(--kinari);font-family:var(--serif);font-size:14.5px;letter-spacing:.08em}
.lb__count{display:block;margin-top:6px;font-size:12px;color:var(--kin-l);letter-spacing:.2em}
.lb__btn{
  position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;
  background:rgba(247,242,228,.12);color:var(--kinari);font-size:22px;display:grid;place-items:center;
  transition:background-color .25s;
}
.lb__btn:hover{background:rgba(247,242,228,.28)}
.lb__prev{left:16px}
.lb__next{right:16px}
.lb__close{position:absolute;top:16px;right:16px;width:52px;height:52px;border-radius:50%;background:rgba(247,242,228,.12);color:var(--kinari);font-size:24px;display:grid;place-items:center}
.lb__close:hover{background:rgba(247,242,228,.28)}

/* ---------- 11. 募集 ---------- */
.recruit-hero{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,56px);align-items:center;
  margin-bottom:clamp(40px,5vw,64px);
}
.recruit-hero__fig{position:relative}
.recruit-hero__fig img{box-shadow:var(--shadow-l);border:8px solid #fff}
.recruit-hero__copy .catch{
  font-family:var(--serif);font-weight:700;font-size:clamp(30px,4.8vw,46px);line-height:1.5;letter-spacing:.08em;
  margin-bottom:20px;
}
.recruit-hero__copy .catch .shu{color:var(--shu)}
.recruit-hero__copy p{font-size:18px;line-height:2.25;color:var(--sumi-2)}

.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.slot{
  background:#fff;border:1px solid rgba(176,138,46,.4);padding:30px 26px 28px;position:relative;
  box-shadow:var(--shadow-s);
}
.slot::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:4px;
  background:linear-gradient(90deg,var(--shu),var(--kin-l));
}
.slot__no{font-family:var(--en);font-weight:700;font-size:13px;letter-spacing:.28em;color:var(--kin);display:block;margin-bottom:12px}
.slot h4{font-family:var(--serif);font-weight:700;font-size:22px;letter-spacing:.06em;line-height:1.6;margin-bottom:14px}
.slot p{font-size:17px;line-height:2.1;color:var(--sumi-2)}

.terms{margin-top:clamp(40px,5vw,60px);background:#fff;border:1px solid rgba(176,138,46,.4);box-shadow:var(--shadow-s)}
.terms dl{display:grid;grid-template-columns:200px 1fr}
.terms dt,.terms dd{padding:18px 26px;border-bottom:1px solid rgba(176,138,46,.28)}
.terms dt{background:var(--kinari-2);font-family:var(--serif);font-weight:700;font-size:17px;letter-spacing:.08em}
.terms dd{font-size:17.5px;line-height:2.1}
.terms dl>:nth-last-child(-n+2){border-bottom:0}

/* ---- はじめて参加されたご家族から（舞手募集） ---- */
.voices{margin-top:clamp(44px,5.5vw,66px)}
.voices__catch{
  text-align:center;font-family:var(--serif);font-weight:700;
  font-size:clamp(18px,2.3vw,23px);line-height:1.95;letter-spacing:.1em;
  color:var(--shu);margin:0;
}
.voices__lead{
  text-align:center;font-size:16px;line-height:2.3;color:var(--sumi-2);
  margin:20px auto 0;max-width:44em;
}
/* 見出しは、お便りのまとまりの入口に置いています */
.voices__ttl{
  font-family:var(--serif);font-weight:700;font-size:clamp(18px,2.2vw,22px);letter-spacing:.14em;
  text-align:center;color:var(--sumi);max-width:44em;
  margin:clamp(38px,4.6vw,54px) auto 0;padding-top:clamp(26px,3.2vw,36px);
  border-top:1px dashed rgba(176,138,46,.32);
}
.voices__ttl::after{content:"";display:block;width:54px;height:2px;background:var(--kin);margin:14px auto 0}
.voices__intro{
  text-align:center;font-size:15.5px;line-height:2.15;color:var(--sumi-3);
  margin:18px auto 0;max-width:44em;
}
.voices__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:28px}
.voice{
  margin:0;background:#fff;border:1px solid rgba(176,138,46,.32);box-shadow:var(--shadow-s);
  padding:clamp(22px,2.6vw,30px) clamp(20px,2.6vw,32px);position:relative;
}
.voice::before{
  content:"";position:absolute;top:0;left:0;width:3px;height:100%;
  background:linear-gradient(180deg,var(--kin-l),var(--kin));
}
.voice blockquote{
  margin:0;font-size:16.5px;line-height:2.2;color:var(--sumi-2);
  line-break:strict;text-wrap:pretty;
}
.voice figcaption{
  margin-top:16px;padding-top:13px;border-top:1px dashed rgba(176,138,46,.32);
  font-family:var(--serif);font-size:14.5px;letter-spacing:.08em;color:var(--sumi-3);text-align:right;
}
@media (max-width:820px){
  .voices__grid{grid-template-columns:1fr;gap:16px}
}
@media (max-width:600px){
  .voice blockquote{font-size:15.5px;line-height:2.1}
  .voices__catch{font-size:16.5px}
  .voices__lead{font-size:15px;text-align:left}
  .voices__intro{font-size:14.5px;text-align:left}
}

.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:clamp(36px,4.6vw,54px)}
.flow li{
  background:#fff;border:1px solid rgba(176,138,46,.4);padding:24px 18px;text-align:center;position:relative;
}
.flow li::after{
  content:"";position:absolute;right:-11px;top:50%;transform:translateY(-50%) rotate(45deg);
  width:12px;height:12px;border-top:2px solid var(--kin);border-right:2px solid var(--kin);z-index:2;
}
.flow li:last-child::after{display:none}
.flow .step{display:block;font-family:var(--en);font-weight:700;font-size:12.5px;letter-spacing:.26em;color:var(--kin);margin-bottom:10px}
.flow b{font-family:var(--serif);font-weight:700;font-size:17.5px;letter-spacing:.06em;display:block;margin-bottom:6px}
.flow small{font-size:14.5px;color:var(--sumi-2);line-height:1.9;display:block}

@media (max-width:900px){
  .recruit-hero{grid-template-columns:1fr}
  .slots{grid-template-columns:1fr}
  .terms dl{grid-template-columns:1fr}
  .terms dt{border-bottom:0;padding-bottom:0;background:#fff;color:var(--kin-d)}
  .flow{grid-template-columns:1fr 1fr}
  .flow li::after{display:none}
}

/* ---------- 12. スポンサー ---------- */
.sponsor-why{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:clamp(40px,5vw,60px)}
.sponsor-why li{
  border:1px solid rgba(176,138,46,.4);padding:28px 24px;background:#fff;box-shadow:var(--shadow-s);
}
.sponsor-why b{display:block;font-family:var(--serif);font-weight:700;font-size:20px;letter-spacing:.06em;color:var(--kin-d);margin-bottom:10px}
.sponsor-why p{font-size:17px;line-height:2.1;color:var(--sumi-2)}

.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.plan{
  background:#fff;border:1px solid rgba(176,138,46,.4);padding:32px 20px 28px;text-align:center;
  position:relative;box-shadow:var(--shadow-s);
}
.plan--reco{border-color:var(--kin);background:#fffdf4;box-shadow:var(--shadow-m),0 0 0 1px rgba(176,138,46,.35) inset}
.plan__tag{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--shu);color:#fff;font-family:var(--serif);font-size:11.5px;letter-spacing:.2em;
  padding:5px 16px;border-radius:999px;white-space:nowrap;
}
.plan h4{font-family:var(--serif);font-weight:700;font-size:19.5px;letter-spacing:.1em;color:var(--kin-d);margin-bottom:10px}
.plan .price{font-family:var(--serif);font-weight:700;font-size:clamp(24px,2.5vw,29px);color:var(--sumi);line-height:1.3;white-space:nowrap}
.plan .price small{font-size:.46em;margin-left:.2em;color:var(--sumi-3)}
.plan ul{margin-top:18px;text-align:left;border-top:1px solid rgba(176,138,46,.3);padding-top:16px}
.plan li{font-size:15.5px;line-height:1.95;color:var(--sumi-2);padding-left:1.4em;position:relative;margin-bottom:.5em}
.plan li::before{content:"✓";position:absolute;left:0;color:var(--kin)}
/* まだ決まっていない特典（チェックは付けず、控えめに見せます） */
.plan li.plan__tbd{color:var(--sumi-3);font-size:14.5px;line-height:1.85}
.plan li.plan__tbd::before{content:"…";color:var(--sumi-3)}
.sponsor-note{margin-top:26px;font-size:15.5px;color:var(--sumi-3);line-height:2;text-align:center}

/* ---- ご協賛くださったみなさま ---- */
.thanks{margin-top:clamp(44px,5.5vw,70px);background:#fff;border:1px solid rgba(176,138,46,.32);
  box-shadow:var(--shadow-s);padding:clamp(26px,3.4vw,40px) clamp(18px,3vw,40px)}
.thanks__ttl{font-family:var(--serif);font-weight:700;font-size:clamp(19px,2.3vw,24px);
  letter-spacing:.12em;text-align:center;margin-bottom:10px}
.thanks__ttl::after{content:"";display:block;width:54px;height:2px;background:var(--kin);
  margin:14px auto 0}
.thanks__note{text-align:center;font-size:14.5px;color:var(--sumi-3);line-height:1.95;margin-top:14px}
.thanks__foot{text-align:center;font-size:14px;color:var(--sumi-3);line-height:1.95;
  margin:26px auto 0;padding-top:20px;border-top:1px dashed rgba(176,138,46,.32);
  max-width:40em;text-wrap:balance}
.thanks__grp{margin-top:26px}
.thanks__grp .thanks__list{margin-top:16px}
.thanks__sub{display:flex;align-items:center;gap:14px;margin:0;
  font-family:var(--serif);font-size:15px;font-weight:700;letter-spacing:.18em;color:var(--sumi-2)}
.thanks__sub::before,.thanks__sub::after{content:"";flex:1;height:1px;background:rgba(176,138,46,.34)}
/* 特別協賛はひとまわり大きく、別の枠に */
.thanks__grp--sp{background:linear-gradient(180deg,#fffdf5,#fcf6e6);
  border:1px solid rgba(176,138,46,.5);border-radius:3px;
  padding:clamp(18px,2.4vw,26px) clamp(14px,2.2vw,26px) clamp(20px,2.6vw,28px)}
.thanks__grp--sp .thanks__sub{color:var(--kin-d)}
.thanks__grp--sp .thanks__sub::before,.thanks__grp--sp .thanks__sub::after{background:rgba(176,138,46,.5)}
/* 大きさはふつうの協賛と同じ。白地と金の枠でだけ区別します */
.thanks__grp--sp .thanks__it{border-color:rgba(176,138,46,.42)}
/* 数が少ないときにも据わりがよいよう、特別協賛はまんなかに寄せます */

.thanks__list{list-style:none;margin:26px 0 0;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
/* 札の幅は、枠（特別協賛とふつうの協賛）で変わらないよう、画面の幅から決めます。
   枠ごとの内側の余白に左右されると、大きさがそろわなくなるためです。 */
.thanks__list{--tile:clamp(178px,16vw,214px)}
/* 札の地色は、ロゴのあるなしにかかわらず白でそろえます */
.thanks__it{border:1px solid rgba(176,138,46,.28);border-radius:3px;background:#fff;
  width:var(--tile);min-height:96px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;
  padding:14px 16px;transition:border-color .25s, box-shadow .25s}
.thanks__it:hover{border-color:var(--kin);box-shadow:var(--shadow-s)}
.thanks__it a{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:9px;width:100%;height:100%}
.thanks__it img{max-width:100%;max-height:68px;width:auto;height:auto;display:block}
/* 長い社名・法人格も、はみ出さずに折り返します。
   「株式会社」などで名前が長いときは、字を少し小さくして行数をおさえます（PHP側で付けます）。 */
.thanks__nm{font-family:var(--serif);font-size:16px;font-weight:700;letter-spacing:.06em;
  line-height:1.55;text-align:center;color:var(--sumi);
  overflow-wrap:anywhere;line-break:strict;text-wrap:balance}
/* 管理画面で手で改行を入れたときは、その改行のとおりに出します */
.thanks__nm--br{text-wrap:wrap}
.thanks__nm--l{font-size:14px;letter-spacing:0}
.thanks__nm--xl{font-size:13px;letter-spacing:0;line-height:1.5}
/* ロゴの下にそえるお名前は、ひかえめに */
.thanks__nm--cap{font-size:13.5px;font-weight:500;letter-spacing:.04em;line-height:1.5;
  color:var(--sumi-2)}
.thanks__nm--cap.thanks__nm--l{font-size:12.5px}
.thanks__nm--cap.thanks__nm--xl{font-size:11.5px}
/* 金額・品物（お名前の下の一行） */
.thanks__amt{font-family:var(--en);font-size:13px;letter-spacing:.06em;color:var(--kin-d);
  font-variant-numeric:tabular-nums;line-height:1.45;text-align:center;
  overflow-wrap:anywhere}

/* ロゴの大きさ（管理画面「協賛者の一覧」で 小・中・大 を選べます）
   小 … 札はそのまま、ロゴをひかえめに
   大 … 札を横2つぶんの幅にして、ロゴを大きく（横長のロゴも大きく見えるように） */
.thanks__it--lg-s img{max-height:46px;max-width:74%}
.thanks__it--lg-l{width:calc(var(--tile) * 2 + 14px);max-width:100%}
.thanks__it--lg-l img{max-height:116px}

/* ご奉納の枠は、ご協賛の下に少しあけて */
.thanks--hono{margin-top:clamp(20px,2.4vw,30px)}
@media (max-width:700px){
  .thanks__list{gap:10px}
  .thanks__list{--tile:136px}
  .thanks__it{min-height:80px;padding:10px 9px;gap:7px}
  .thanks__grp--sp{padding-left:12px;padding-right:12px}
  .thanks__it img{max-height:54px}
  .thanks__nm{font-size:13.5px;letter-spacing:.02em}
  .thanks__sub{font-size:13.5px;gap:10px}

  .thanks__nm--cap{font-size:12.5px}
  .thanks__nm--l{font-size:12.5px}
  .thanks__nm--xl{font-size:11.5px}
  /* 手で改行したものは、指定どおりの行数で収まるよう、もう一段小さく */
  .thanks__nm--br{font-size:12px}
  .thanks__nm--br.thanks__nm--l{font-size:11px}
  .thanks__nm--br.thanks__nm--xl{font-size:10.5px}
  .thanks__nm--cap.thanks__nm--l{font-size:11.5px}
  .thanks__nm--cap.thanks__nm--xl{font-size:11px}
  .thanks__amt{font-size:12px}
  /* ロゴの大きさ（小・大）… スマホ */
  .thanks__it--lg-s img{max-height:36px}
  .thanks__it--lg-l{width:calc(var(--tile) * 2 + 10px)}
  .thanks__it--lg-l img{max-height:84px}

}

@media (max-width:1180px){
  .plans{grid-template-columns:repeat(2,1fr);gap:20px}
  .plan{padding:34px 26px 30px}
  .plan h4{font-size:21px;letter-spacing:.14em}
  .plan li{font-size:16.5px}
}
@media (max-width:900px){
  .sponsor-why{grid-template-columns:1fr}
}
@media (max-width:620px){
  .plans{grid-template-columns:1fr}
}

/* ---------- 13. フォーム ---------- */
.form-wrap{background:#fff;box-shadow:var(--shadow-m);border:1px solid rgba(176,138,46,.35);padding:clamp(28px,4vw,54px)}
.form-row{margin-bottom:26px}
.form-row label{
  display:block;font-family:var(--serif);font-weight:700;font-size:17px;letter-spacing:.08em;margin-bottom:9px;
}
.req{
  display:inline-block;background:var(--shu);color:#fff;font-size:10.5px;letter-spacing:.1em;
  padding:2px 8px;border-radius:3px;margin-left:.6em;vertical-align:2px;font-family:var(--sans);font-weight:700;
}
.opt{
  display:inline-block;background:var(--sumi-3);color:#fff;font-size:10.5px;letter-spacing:.1em;
  padding:2px 8px;border-radius:3px;margin-left:.6em;vertical-align:2px;font-family:var(--sans);font-weight:400;
}
/* 出したり隠したりする欄（舞手のときだけ出る年齢など） */
.form-row[hidden]{display:none}
.form-row input[type=text],.form-row input[type=email],.form-row input[type=tel],
.form-row input[type=number],.form-row input[type=url],
.form-row select,.form-row textarea{
  width:100%;padding:14px 16px;border:1px solid rgba(30,27,23,.28);border-radius:3px;
  font-family:inherit;font-size:16px;background:var(--kinari);color:var(--sumi);transition:border-color .25s, box-shadow .25s;
}
.form-row textarea{min-height:170px;resize:vertical;line-height:1.9}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{
  outline:none;border-color:var(--kin);box-shadow:0 0 0 3px rgba(176,138,46,.18);background:#fff;
}
.form-row .hint{margin-top:8px;font-size:14px;color:var(--sumi-3);line-height:1.85}
.form-row .hint--ok{color:var(--sumi-2);background:#f3f7f1;border-left:3px solid #6a9a3a;
  padding:10px 14px;margin-top:10px}
.form-row .hint--ok b{color:var(--sumi);font-weight:700}
/* ファイルを選ぶ欄（協賛のロゴ画像） */
.form-row input[type=file]{
  width:100%;padding:12px 14px;border:1px dashed rgba(30,27,23,.32);border-radius:3px;
  font-family:inherit;font-size:15px;background:var(--kinari);color:var(--sumi);
  transition:border-color .25s, background .25s;
}
.form-row input[type=file]:hover{border-color:var(--kin);background:#fff}
.form-row input[type=file]::file-selector-button{
  font-family:inherit;font-size:14px;margin-right:14px;padding:8px 16px;cursor:pointer;
  border:1px solid rgba(30,27,23,.3);border-radius:3px;background:#fff;color:var(--sumi);
}
.form-check{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;line-height:1.95;color:var(--sumi-2)}
.form-check input{margin-top:5px;width:18px;height:18px;accent-color:var(--shu);flex:none}
.form-submit{text-align:center;margin-top:34px}
.form-submit__note{margin-top:12px;font-size:14px;color:var(--sumi-2)}

/* ---- 送信前の確認画面 ---- */
.confirm{max-width:840px;margin:0 auto}
.confirm__list{background:#fff;border:1px solid rgba(176,138,46,.32);box-shadow:var(--shadow-m)}
.confirm__row{display:grid;grid-template-columns:230px 1fr;border-bottom:1px solid rgba(176,138,46,.24)}
.confirm__row:last-child{border-bottom:0}
.confirm__row dt{
  background:var(--kinari-2);padding:16px 20px;font-family:var(--serif);font-weight:700;
  font-size:15.5px;letter-spacing:.06em;border-right:1px solid rgba(176,138,46,.24);
}
.confirm__row dd{padding:16px 20px;font-size:16.5px;line-height:2;word-break:break-word}
.confirm__btns{text-align:center;margin-top:30px}
.confirm__btns--back{margin-top:16px}
.confirm__note{margin-top:14px;text-align:center;font-size:14px;color:var(--sumi-2)}
@media (max-width:700px){
  .confirm__row{grid-template-columns:1fr}
  .confirm__row dt{border-right:0;border-bottom:1px solid rgba(176,138,46,.2);padding:11px 16px;font-size:14.5px}
  .confirm__row dd{padding:13px 16px;font-size:16px}
}
/* 注意書きは、ヘッダーに隠れない位置で止めます */
.form-err{scroll-margin-top:96px}
.form-err:focus{outline:2px solid var(--shu);outline-offset:3px}
#contact-form{scroll-margin-top:96px}
@media (max-width:1000px){
  .form-err,#contact-form{scroll-margin-top:74px}
}
.form-err{
  background:rgba(192,39,45,.08);border:1px solid var(--shu);color:var(--shu-d);
  padding:18px 22px;margin-bottom:28px;font-size:14px;line-height:1.95;
}
.form-err li{padding-left:1.2em;position:relative}
.form-err li::before{content:"・";position:absolute;left:0}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* フォーム調整中のお知らせ */
.form-off{
  background:#fff;border:1px dashed rgba(176,138,46,.65);
  padding:clamp(30px,4.5vw,44px) clamp(22px,3vw,34px);text-align:center;box-shadow:var(--shadow-s);
}
.form-off b{
  display:block;font-family:var(--serif);font-weight:700;
  font-size:clamp(18px,2.4vw,22px);letter-spacing:.06em;color:var(--kin-d);margin-bottom:16px;
}
.form-off p{font-size:16.5px;line-height:2.1;color:var(--sumi-2);margin:0}
.form-off__mail{margin-top:20px!important}
.form-off__mail a{
  font-family:var(--en);font-weight:700;font-size:clamp(17px,2.2vw,22px);
  color:var(--shu);word-break:break-all;
}

.contact-alt{
  display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:clamp(32px,4vw,48px);
}
.contact-alt a,.contact-alt div{
  background:#fff;border:1px solid rgba(176,138,46,.4);padding:26px 24px;text-align:center;box-shadow:var(--shadow-s);
  transition:transform .25s, box-shadow .25s;
}
.contact-alt a:hover{transform:translateY(-3px);box-shadow:var(--shadow-m)}
.contact-alt .lbl{font-family:var(--en);font-weight:700;font-size:13.5px;letter-spacing:.24em;color:var(--kin);display:block;margin-bottom:10px}
.contact-alt .val{font-family:var(--serif);font-weight:700;font-size:clamp(22px,3vw,30px);letter-spacing:.06em;color:var(--shu)}
/* メールアドレスは文字数が多いので、少し小さく・折り返せるようにします */
.contact-alt .val--mail{
  display:block;font-family:var(--en);font-size:clamp(16px,2.2vw,22px);
  letter-spacing:.01em;line-height:1.5;word-break:break-all;
}
.contact-alt .sub{font-size:15px;color:var(--sumi-2);margin-top:9px}
@media (max-width:700px){.contact-alt{grid-template-columns:1fr}}

/* 完了画面 */
.done{text-align:center;padding:clamp(60px,10vw,120px) 0}
.done__mark{width:96px;margin:0 auto 28px}
/* 1ページに h1 は1つなので、ここは見た目だけ見出しに揃えた段落にしています */
.done h1,.done__ttl{font-family:var(--serif);font-weight:700;font-size:clamp(26px,4vw,38px);letter-spacing:.1em;margin-bottom:20px;color:var(--sumi)}
.done p{font-size:17.5px;line-height:2.25;color:var(--sumi-2);max-width:36em;margin-inline:auto}
.done p.done__ttl{font-size:clamp(26px,4vw,38px);line-height:1.5;max-width:none}

/* ---------- 14. アクセス／フッター ---------- */
.access{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.4vw,46px);align-items:stretch}
.access__map{min-height:340px;border:1px solid rgba(176,138,46,.4);box-shadow:var(--shadow-s);background:var(--kinari-3)}
.access__map iframe{width:100%;height:100%;min-height:340px;border:0;display:block}
.access__info{background:#fff;border:1px solid rgba(176,138,46,.4);padding:32px 30px;box-shadow:var(--shadow-s)}
.access__info h3{font-family:var(--serif);font-weight:700;font-size:24px;letter-spacing:.1em;margin-bottom:6px}
.access__info .en{font-family:var(--serif);font-size:11px;letter-spacing:.3em;color:var(--kin);margin-bottom:22px;display:block}
.access__info dl{display:grid;grid-template-columns:92px 1fr;gap:13px 16px;font-size:17px;line-height:1.95}
.access__info dt{font-family:var(--serif);font-weight:700;color:var(--kin-d)}
@media (max-width:820px){.access{grid-template-columns:1fr}}

.ftr{
  color:var(--sumi-2);padding:clamp(56px,7vw,84px) 0 0;position:relative;z-index:1;
  background:linear-gradient(180deg, rgba(233,192,74,0) 0%, rgba(233,192,74,.22) 45%, rgba(233,192,74,.42) 100%);
}
.ftr__top{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:clamp(28px,4vw,56px);padding-bottom:clamp(40px,5vw,60px)}
.ftr__brand{display:flex;gap:18px;align-items:flex-start}
/* ロゴは枠なしで、背景になじませます（ヒーローと同じ縦ロゴ） */
.ftr__brand img{width:clamp(88px,9vw,116px);height:auto;flex:none}
.ftr__brand .n1{font-family:var(--serif);font-weight:700;font-size:21px;letter-spacing:.1em;color:var(--sumi);margin-bottom:6px}
.ftr__brand .n2{font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.24em;color:var(--kin-d);margin-bottom:14px}
.ftr__brand p{font-size:15px;line-height:2.05;color:var(--sumi-2)}
.ftr h4{font-family:var(--serif);font-weight:700;font-size:15px;letter-spacing:.16em;color:var(--kin-d);margin-bottom:16px}
.ftr li{margin-bottom:12px;font-size:16px}
.ftr a:hover{color:var(--shu)}
.ftr__cr{border-top:1px solid rgba(176,138,46,.35);padding:22px 0 26px;text-align:center;font-family:var(--en);font-size:13px;letter-spacing:.06em;color:var(--sumi-3)}
/* 制作クレジット（金色の細い罫をはさんで、ひとまわり小さく） */
.ftr__credit{
  display:block;margin:13px auto 0;padding-top:13px;max-width:30em;
  font-family:var(--serif);font-size:12.5px;letter-spacing:.09em;line-height:1.9;color:var(--sumi-3);
  border-top:1px solid rgba(176,138,46,.3);
}
.ftr__credit a{color:var(--kin-d);border-bottom:1px solid rgba(176,138,46,.45);padding-bottom:1px;transition:color .25s,border-color .25s}
.ftr__credit a:hover{color:var(--shu);border-bottom-color:var(--shu)}
@media (max-width:820px){.ftr__top{grid-template-columns:1fr}}

/* ページトップ */
.totop{
  position:fixed;right:18px;bottom:18px;z-index:90;width:52px;height:52px;border-radius:50%;
  background:var(--sumi);color:var(--kin-l);display:grid;place-items:center;font-size:18px;
  box-shadow:var(--shadow-m);opacity:0;visibility:hidden;transform:translateY(10px);transition:.3s;
}
.totop.is-show{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--shu);color:#fff}
/* 二重の山形。マウスを乗せると、すっと上へ動きます */
.totop__icon{
  width:21px;height:21px;display:block;overflow:visible;
  fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
}
.totop__c1,.totop__c2{transition:transform .3s var(--ease-out-quart),opacity .3s ease}
.totop__c2{opacity:.45}
.totop:hover .totop__c1,.totop:focus-visible .totop__c1{transform:translateY(-2.6px)}
.totop:hover .totop__c2,.totop:focus-visible .totop__c2{transform:translateY(-2.6px);opacity:.95}
.totop:focus-visible{outline:3px solid var(--kin);outline-offset:3px}

/* ---------- 15. 下層（歴史）ページ ---------- */
.page-hero{
  position:relative;padding:clamp(160px,21vh,230px) 0 clamp(110px,14vw,180px);
  background:#e9c04a url("../img/bg-kinji.webp") center top/cover no-repeat;overflow:hidden;text-align:center;
}
.page-hero::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,
    rgba(255,250,232,.32) 0%,
    rgba(247,242,228,0) 42%,
    rgba(247,242,228,.5) 84%,
    var(--kinari) 100%);
}
.page-hero__in{position:relative;z-index:3}
.page-hero h1{
  font-family:var(--serif);font-weight:700;font-size:clamp(32px,5.6vw,54px);
  letter-spacing:.14em;color:var(--sumi);
  text-shadow:0 2px 0 rgba(255,250,232,.45);
}
.page-hero .en{display:block;font-family:var(--en);font-weight:700;font-size:15px;letter-spacing:.4em;color:var(--kin-d);margin-bottom:16px}
.page-hero .kumo-big{z-index:1}
.crumb{display:flex;gap:.6em;justify-content:center;margin-top:24px;font-size:14.5px;color:#5b4d2c;position:relative;z-index:3}
.crumb a:hover{color:var(--shu)}

.doc{max-width:var(--wrap-narrow);margin-inline:auto}
.doc h2{
  font-family:var(--serif);font-weight:700;font-size:clamp(26px,3.8vw,36px);letter-spacing:.1em;
  margin:clamp(48px,6vw,76px) 0 24px;padding-bottom:14px;border-bottom:2px solid var(--sumi);position:relative;
}
.doc h2::after{content:"";position:absolute;left:0;bottom:-5px;width:90px;height:2px;background:var(--shu)}
/* ページ内リンクで飛んだとき、右上の雲（メニュー）に見出しが隠れないように */
.doc h2[id],.doc h3[id]{scroll-margin-top:clamp(84px,11vw,150px)}
/* 本文中のリンク（ページ内の別の節へ、など） */
.doc p a,.doc figcaption a{color:var(--shu);border-bottom:1px solid rgba(176,40,40,.4);padding-bottom:1px;transition:border-color .25s,opacity .25s}
.doc p a:hover,.doc figcaption a:hover{border-bottom-color:currentColor;opacity:.85}
.doc h2:first-child{margin-top:0}
.doc h3{
  font-family:var(--serif);font-weight:700;font-size:clamp(20px,2.7vw,25px);letter-spacing:.08em;
  margin:36px 0 14px;padding-left:16px;border-left:4px solid var(--kin);
}
.doc p{font-size:17.5px;line-height:2.3;color:var(--sumi-2);margin-bottom:1.4em}
.doc p .em{color:var(--shu);font-weight:700}
.doc figure{margin:32px 0}
.doc figure img{box-shadow:var(--shadow-m);border:8px solid #fff}
.doc figcaption{margin-top:12px;font-size:12.5px;color:var(--sumi-3);text-align:center}
.doc .lead{
  font-family:var(--serif);font-size:clamp(17px,2.1vw,20px);line-height:2.15;color:var(--sumi);
  background:#fff;border-left:4px solid var(--shu);padding:26px 28px;box-shadow:var(--shadow-s);margin-bottom:2em;
}
.doc blockquote{
  margin:28px 0;padding:24px 28px;background:var(--kinari-2);border:1px solid rgba(176,138,46,.35);
  font-family:var(--serif);font-size:16.5px;line-height:2.1;color:var(--sumi-2);
}
.doc blockquote cite{display:block;margin-top:12px;font-size:12.5px;color:var(--sumi-3);font-style:normal;text-align:right}
/* 現代語訳・補足のかこみ */
.doc .note{
  margin:8px 0 28px;padding:20px 24px;background:#fff;
  border:1px dashed rgba(176,138,46,.55);
}
.doc .note--tight{margin-top:-14px}
/* かこみの中に挿し絵を入れる（背景は透明のまま。白フチも影もつけません） */
.doc .note--fig{display:flex;align-items:center;gap:clamp(12px,2.4vw,26px)}
.doc .note--fig .note__txt{flex:1 1 auto;min-width:0}
.doc .note--fig .note__fig{flex:0 0 auto;width:clamp(130px,25%,205px);margin:0}
.doc .note--fig .note__fig img{
  display:block;width:100%;height:auto;
  border:0;box-shadow:none;background:none;
}
@media (max-width:640px){
  .doc .note--fig{flex-direction:column;align-items:center;gap:10px}
  .doc .note--fig .note__fig{width:min(170px,52%)}
}
/* 引用の直後に置くかこみ（旧仕様の互換） */
.doc blockquote + .note{margin-top:-14px}
/* イラスト用の図版（白フチ・影なし） */
.doc figure.fig-plain{margin:6px auto 10px;max-width:min(420px,80%)}
.doc .fig-plain img{border:0;box-shadow:none;background:none}
/* 本文中の挿し絵（--fw で幅を指定。白マット＋やわらかい影） */
.doc figure.fig-illust{margin:30px auto 34px;max-width:min(var(--fw,620px),100%)}
.doc .fig-illust img{
  display:block;width:100%;height:auto;
  border:8px solid #fff;box-shadow:var(--shadow-m);
}
@media (max-width:640px){
  .doc figure.fig-illust{margin:24px auto 26px;max-width:100%}
  .doc .fig-illust img{border-width:6px}
}
.doc .note b{
  display:block;font-family:var(--serif);font-size:13px;letter-spacing:.14em;
  color:var(--kin-d);margin-bottom:8px;
}
.doc .note p{margin:0;font-size:16.5px}
.doc ul.dot li{position:relative;padding-left:1.4em;font-size:16.5px;line-height:2.15;color:var(--sumi-2);margin-bottom:.4em}
.doc ul.dot li::before{content:"●";position:absolute;left:0;font-size:.6em;top:.75em;color:var(--kin)}

/* 年表 */
.chrono{position:relative;margin-top:8px;padding-left:clamp(18px,3vw,34px)}
.chrono::before{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:linear-gradient(180deg,var(--kin-l),rgba(176,138,46,.2))}
.chrono li{position:relative;padding:0 0 30px 22px}
.chrono li::before{
  content:"";position:absolute;left:-11px;top:9px;width:12px;height:12px;border-radius:50%;
  background:var(--kinari);border:3px solid var(--shu);
}
.chrono .yr{font-family:var(--serif);font-weight:700;font-size:17px;letter-spacing:.08em;color:var(--shu);display:block;margin-bottom:6px}
.chrono .yr small{color:var(--sumi-3);font-weight:400;font-size:12px;margin-left:.6em;letter-spacing:.04em}
.chrono p{font-size:16.5px;line-height:2.1;color:var(--sumi-2);margin:0}

/* 行列ぜんたいの図（doc の中で横いっぱいに見せる） */
.doc .gyoretsu-doc{margin:10px 0 34px}
.gyoretsu-doc .scr{overflow-x:auto;line-height:0;-webkit-overflow-scrolling:touch}
.doc .gyoretsu-doc img{
  width:100%;height:auto;display:block;
  border:0;box-shadow:none;background:none;
}
/* 狭い画面だけ、枠の中で横スクロールさせて見やすさを確保 */
@media (max-width:700px){
  .doc .gyoretsu-doc img{min-width:640px}
}

/* 行列の順番（番号つきリスト） */
.order{counter-reset:ord;margin-top:8px}
.order__body{display:flex;gap:clamp(18px,2.6vw,32px);align-items:flex-start}
.order__body > p{flex:1 1 auto;min-width:0}
.doc .order__fig{flex:0 0 auto;margin:2px 0 0;line-height:0}
.doc .order__fig img{
  height:var(--fh,180px);width:auto;max-width:100%;display:block;
  border:0;box-shadow:none;background:none;
}
@media (max-width:760px){
  .order__body{display:block}
  .doc .order__fig{margin:16px 0 0}
  .doc .order__fig img{height:152px;margin-inline:auto}
}
@media (max-width:400px){ .doc .order__fig img{height:128px} }
.order li{position:relative;padding:0 0 28px 64px;counter-increment:ord}
.order li::before{
  content:counter(ord);position:absolute;left:0;top:2px;
  display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:rgba(255,253,246,.95);border:1.5px solid var(--kin);
  font-family:var(--serif);font-weight:700;font-size:16px;color:var(--kin-d);
  box-shadow:0 3px 10px rgba(176,138,46,.18);
}
.order li::after{
  content:"";position:absolute;left:18.5px;top:46px;bottom:4px;width:1px;
  background:linear-gradient(180deg,rgba(176,138,46,.6),rgba(176,138,46,.12));
}
.order li:last-child::after{display:none}
.order .nm{
  display:block;font-family:var(--serif);font-weight:700;
  font-size:19px;letter-spacing:.06em;color:var(--sumi);margin:5px 0 8px;
}
.order p{font-size:16.5px;line-height:2.1;color:var(--sumi-2);margin:0}
@media (max-width:560px){
  .order li{padding-left:52px}
  .order li::before{width:32px;height:32px;font-size:14px}
  .order li::after{left:15.5px;top:38px}
  .order .nm{font-size:17.5px}
}

/* 役割表（現在は未使用・表形式に戻したいとき用） */
.roles{width:100%;background:#fff;box-shadow:var(--shadow-s);border:1px solid rgba(176,138,46,.35);margin-top:8px}
.roles th,.roles td{padding:15px 17px;border-bottom:1px solid rgba(176,138,46,.25);font-size:16.5px;line-height:1.95;vertical-align:top}
.roles thead th{background:var(--sumi);color:var(--kin-l);font-family:var(--serif);letter-spacing:.12em;font-size:13px;text-align:left}
.roles tbody th{
  width:190px;text-align:left;font-family:var(--serif);font-weight:700;background:var(--kinari-2);letter-spacing:.06em;
}
.roles tbody th small{display:block;font-family:var(--sans);font-weight:400;font-size:12px;color:var(--sumi-3)}
@media (max-width:700px){
  .roles{display:block;overflow-x:auto}
  .roles table{min-width:560px}
}

.backlink{text-align:center;margin-top:clamp(56px,7vw,86px)}

/* 注釈：一回り小さい文字（ビジュアル編集の「小さく（注釈）」ボタンが付けます） */
.chu{font-size:.82em;color:var(--sumi-3);font-weight:400;letter-spacing:.02em}
.doc .chu,.sec .chu,.ftr .chu,.sec-lead .chu{font-size:.82em;color:var(--sumi-3)}

/* ルビ（読みがな） */
ruby{ruby-align:center}
rt{
  font-family:var(--sans);font-size:.44em;font-weight:400;
  letter-spacing:.02em;color:var(--kin-d);
  transform:translateY(.16em);
}

/* ---------- 15b. 現在地インジケータ（縦書き・スクロール追従） ---------- */
.nowat{
  position:fixed;left:16px;top:50%;transform:translateY(-50%) translateX(-14px);
  z-index:95;display:block;text-align:center;
  pointer-events:none;opacity:0;transition:opacity .45s var(--ease-out-quad),transform .45s var(--ease-out-quad);
}
.nowat.is-show{opacity:1;transform:translateY(-50%) translateX(0)}
.nowat__no{
  display:grid;place-items:center;width:34px;height:34px;margin:0 auto 12px;border-radius:50%;
  border:1.5px solid var(--kin);background:rgba(255,253,246,.92);
  font-family:var(--serif);font-weight:700;font-size:15px;color:var(--kin-d);
  box-shadow:0 3px 10px rgba(176,138,46,.22);
}
.nowat__txt{
  display:block;margin:0 auto;
  /* 縦書きなので inline-size ＝ 高さ。max-content にしないと親に潰される */
  inline-size:max-content;block-size:auto;
  writing-mode:vertical-rl;white-space:nowrap;
  font-family:var(--serif);font-weight:700;font-size:14.5px;letter-spacing:.2em;
  color:var(--sumi-2);
  background:rgba(255,253,246,.86);border:1px solid rgba(176,138,46,.4);
  padding:16px 6px;border-radius:999px;
  box-shadow:0 3px 12px rgba(30,27,23,.08);
}
@media (max-width:1200px){ .nowat{display:none} }

/* ---------- 16. ユーティリティ ---------- */
.sp-only{display:none}
@media (max-width:640px){ .sp-only{display:inline} br.sp-only{display:block} }
.pc-only{display:inline}
@media (max-width:640px){ .pc-only{display:none} }

/* ─── 協賛の確認ページ（sponsor.php） ─────────────────── */
.sp-lead{font-size:17px;line-height:2.2;color:var(--sumi-2);margin:0 0 34px;text-align:center}
.sp-lead b{font-size:19px;color:var(--sumi)}
.sp-box{background:var(--kinari);border:1px solid var(--kinari-3);border-radius:4px;
  padding:26px clamp(20px,4vw,34px);margin-bottom:22px}
.sp-box--bank{background:#fff;border-color:var(--kin);box-shadow:0 0 0 1px var(--kin-l) inset}
.sp-box__h{font-family:var(--serif);font-size:19px;letter-spacing:.08em;color:var(--sumi);
  margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid var(--kinari-3)}
.sp-box--bank .sp-box__h{border-bottom-color:var(--kin-l);color:var(--kin-d)}
.sp-dl{margin:0;display:grid;gap:11px}
.sp-dl>div{display:grid;grid-template-columns:11em 1fr;gap:10px;align-items:baseline}
.sp-dl dt{font-size:14px;color:var(--sumi-3);letter-spacing:.04em}
.sp-dl dd{margin:0;font-size:16.5px;color:var(--sumi);word-break:break-word}
.sp-bank{margin:0;font-family:var(--sans);font-size:16.5px;line-height:2.1;color:var(--sumi);
  white-space:pre-wrap;word-break:break-word}
.sp-note{font-size:15px;line-height:2.1;color:var(--sumi-3);text-align:center;margin:26px 0 0}
@media (max-width:640px){
  .sp-dl>div{grid-template-columns:1fr;gap:2px}
  .sp-dl dt{font-size:13px}
  .sp-bank{font-size:15.5px}
}

/* ─── お子さまの欄（舞手のご応募） ─────────────────── */
.kids{display:grid;gap:10px;margin-top:4px}
.kids__row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.kids__no{flex:0 0 4.2em;font-size:14px;color:var(--sumi-3);letter-spacing:.04em}
.kids__name{flex:1 1 13em;min-width:0}
.kids__agew{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px}
.kids__age{width:5.2em;text-align:center}
.kids__unit{font-size:15px;color:var(--sumi-3)}
.kids__del{
  flex:none;border:1px solid var(--kinari-3);background:#fff;color:var(--sumi-3);
  border-radius:3px;padding:7px 12px;font-size:13px;font-family:inherit;cursor:pointer;
  letter-spacing:.04em;line-height:1;
}
.kids__del:hover{border-color:var(--shu);color:var(--shu)}
.kids__del[hidden]{display:none}
.kids__add-wrap{margin:12px 0 0}
.btn--tiny{
  display:inline-block;border:1px solid var(--kin);background:#fff;color:var(--kin-d);
  border-radius:3px;padding:9px 18px;font-size:14px;font-family:inherit;cursor:pointer;
  letter-spacing:.06em;line-height:1.4;
}
.btn--tiny:hover{background:var(--kinari);border-color:var(--kin-d)}
.btn--tiny[hidden]{display:none}
.inp-zip{max-width:12em}
.hint--zip{min-height:1.5em}
@media (max-width:600px){
  .kids__row{gap:8px}
  .kids__no{flex-basis:100%;font-size:13px}
  .kids__name{flex:1 1 100%}
}

/* =========================================================
   会員のページ（members.php）
   中身は .doc の中に入るので、.doc の見出し・本文の決まりに
   負けないよう、どの行も .mem から書いています。
   ========================================================= */

/* ─── 入り口（合言葉） ─────────────────────────── */
.mem .mem__gate{
  max-width:440px;margin:0 auto;padding:clamp(28px,5vw,44px);
  background:#fff;border:1px solid var(--kinari-3);border-radius:var(--r);
  box-shadow:var(--shadow-s);text-align:center;
}
.mem .mem__gatelead{margin:0 0 24px;font-size:16px;line-height:2.1;color:var(--sumi-2)}
.mem .mem__gate label{
  display:block;font-family:var(--sans);font-size:15px;letter-spacing:.1em;
  color:var(--sumi-2);margin-bottom:9px;
}
.mem .mem__gate input[type=password]{
  width:100%;padding:14px 16px;font-family:inherit;font-size:17px;letter-spacing:.14em;
  text-align:center;border:1px solid var(--kinari-3);border-radius:3px;background:var(--kinari);
  color:var(--sumi);margin-bottom:20px;
}
.mem .mem__gate input[type=password]:focus{outline:none;border-color:var(--kin);background:#fff}
.mem .mem__gate .hint{margin:22px 0 0;font-size:14px;line-height:1.95;color:var(--sumi-3)}
.mem .mem__gate .hint a{color:var(--shu);border-bottom:1px solid rgba(176,40,40,.4)}

/* ─── 知らせ（うまくいった／いかなかった） ────────── */
.mem .mem__err,.mem .mem__ok{
  margin:0 auto 32px;max-width:640px;padding:14px 20px;border-radius:4px;
  font-family:var(--sans);font-size:15.5px;line-height:1.95;text-align:center;
}
.mem .mem__err{background:#fdf2f2;border:1px solid #e6c4c4;color:var(--shu-d)}
.mem .mem__ok{background:#f3f7f1;border:1px solid #cadfc0;color:#2f5d22}

/* ─── 中身への近道 ─────────────────────────── */
.mem .mem__jump{
  display:flex;flex-wrap:wrap;gap:10px 12px;justify-content:center;
  margin:0 0 clamp(44px,6vw,64px);
}
.mem .mem__jump a{
  font-family:var(--sans);font-size:14.5px;letter-spacing:.06em;color:var(--sumi-2);
  background:#fff;border:1px solid var(--kinari-3);border-radius:99px;padding:9px 18px;
  transition:border-color .25s,color .25s;
}
.mem .mem__jump a:hover{border-color:var(--kin);color:var(--kin-d)}

/* ─── 章 ───────────────────────────────── */
.mem .mem__sec{margin-bottom:clamp(56px,8vw,88px);scroll-margin-top:clamp(84px,11vw,150px)}
.mem .mem__sec:last-of-type{margin-bottom:0}
.mem .mem__h2{
  font-family:var(--serif);font-size:clamp(22px,3vw,27px);font-weight:700;letter-spacing:.08em;
  color:var(--sumi);margin:0 0 26px;padding:0 0 12px;position:relative;
  border-bottom:1px solid var(--kinari-3);
}
.mem .mem__h2::after{content:"";position:absolute;left:0;bottom:-1px;width:64px;height:2px;background:var(--kin)}
.mem .mem__note{font-size:16.5px;line-height:2.15;color:var(--sumi-2);margin:0 0 26px}
.mem .mem__none{
  font-size:16px;line-height:2;color:var(--sumi-3);margin:0;
  background:var(--kinari-2);border-radius:4px;padding:18px 22px;
}
.mem .mem__dl{
  display:inline-block;margin:0 0 24px;font-family:var(--sans);font-size:15.5px;
  color:var(--shu-d);background:#fdf5f4;border:1px solid #e6c4c4;border-radius:4px;padding:9px 18px;
}
.mem .mem__dl b{font-weight:700}

/* ─── 会員へのお知らせ ─────────────────────── */
.mem .mnews{list-style:none;margin:0;padding:0;display:grid;gap:2px;
  background:var(--kinari-3);border:1px solid var(--kinari-3);border-radius:5px;overflow:hidden}
.mem .mnews__it{display:grid;grid-template-columns:9.5em 1fr;gap:0 18px;background:#fff;padding:20px 22px}
.mem .mnews__date{
  font-family:var(--sans);font-size:14.5px;letter-spacing:.06em;color:var(--kin-d);
  padding-top:.4em;font-variant-numeric:tabular-nums;
}
.mem .mnews__ttl{
  font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.75;letter-spacing:.04em;
  color:var(--sumi);margin:0;padding:0;border:0;
}
.mem .mnews__body{font-size:16px;line-height:2.1;color:var(--sumi-2);margin:9px 0 0}

/* ─── これからの予定 ─────────────────────── */
.mem .msch{list-style:none;margin:0;padding:0;display:grid;gap:2px;
  background:var(--kinari-3);border:1px solid var(--kinari-3);border-radius:5px;overflow:hidden}
.mem .msch__it{display:grid;grid-template-columns:9.5em 6.5em 1fr;gap:0 16px;
  background:#fff;padding:17px 22px;align-items:baseline}
.mem .msch__it.is-past{opacity:.5}
.mem .msch__date{font-family:var(--sans);font-size:15.5px;color:var(--sumi);font-variant-numeric:tabular-nums}
.mem .msch__time{font-family:var(--sans);font-size:14.5px;color:var(--kin-d);font-variant-numeric:tabular-nums}
.mem .msch__b b{display:block;font-family:var(--serif);font-size:17px;font-weight:700;color:var(--sumi);line-height:1.7}
.mem .msch__b small{display:block;font-size:14.5px;color:var(--sumi-3);margin-top:4px}
.mem .msch__b em{display:block;font-style:normal;font-size:14.5px;color:var(--shu-d);margin-top:4px}

/* ─── 手順（写真つき） ─────────────────────── */
.mem .mstep{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:18px}
.mem .mstep__it{
  display:grid;grid-template-columns:44px 1fr 200px;gap:0 20px;align-items:start;
  background:#fff;border:1px solid var(--kinari-3);border-radius:5px;padding:20px 22px;
}
.mem .mstep__it:not(:has(.mstep__img)){grid-template-columns:44px 1fr}
.mem .mstep__no{
  width:38px;height:38px;display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(135deg,var(--kin-l),var(--kin));color:#fff;
  font-family:var(--sans);font-size:17px;font-weight:700;line-height:1;
}
.mem .mstep__b{min-width:0}
.mem .mstep__ttl{
  font-family:var(--serif);font-size:18.5px;font-weight:700;line-height:1.7;letter-spacing:.04em;
  color:var(--sumi);margin:0;padding:0;border:0;
}
.mem .mstep__b p{font-size:16px;line-height:2.1;color:var(--sumi-2);margin:9px 0 0}
.mem .mstep__img{display:block;border:5px solid #fff;box-shadow:var(--shadow-s);border-radius:2px;overflow:hidden}
.mem .mstep__img img{display:block;width:100%;height:auto}

/* ─── 動画 ───────────────────────────── */
.mem .mvid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px;margin:0 0 30px}
.mem .mvid__it{margin:0}
.mem .mvid__box{position:relative;padding-top:56.25%;background:#1e1b17;border-radius:4px;
  overflow:hidden;box-shadow:var(--shadow-s)}
.mem .mvid__box iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.mem .mvid figcaption{margin-top:10px;font-size:15px;line-height:1.9;color:var(--sumi-2);text-align:left}

/* ─── PDFなどのファイル ───────────────────── */
.mem .mfile{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.mem .mfile a{
  display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--kinari-3);
  border-radius:4px;padding:15px 20px;font-size:16px;color:var(--sumi);
  transition:border-color .25s,color .25s;
}
.mem .mfile a:hover{border-color:var(--kin);color:var(--kin-d)}
.mem .mfile__tag{
  flex:none;font-family:var(--sans);font-size:11.5px;font-weight:700;letter-spacing:.1em;
  color:#fff;background:var(--sumi-3);border-radius:3px;padding:5px 8px;line-height:1;
}

/* ─── Tシャツ ─────────────────────────── */
.mem .mform{max-width:660px}
.mem .msize{width:100%;border-collapse:collapse;margin:0 0 34px;background:#fff;
  border:1px solid var(--kinari-3);border-radius:5px;overflow:hidden}
.mem .msize th,.mem .msize td{
  border-bottom:1px solid var(--kinari-2);padding:13px 18px;text-align:left;font-size:16px}
.mem .msize thead th{
  background:var(--kinari-2);font-family:var(--sans);font-size:14px;letter-spacing:.08em;
  font-weight:400;color:var(--sumi-2);
}
.mem .msize tbody th{font-family:var(--sans);font-size:17px;font-weight:700;color:var(--sumi);width:8em}
.mem .msize__p{font-variant-numeric:tabular-nums;color:var(--sumi-2);width:8em}
.mem .msize__q{
  width:5.4em;padding:10px 12px;font-family:inherit;font-size:17px;text-align:center;
  border:1px solid var(--kinari-3);border-radius:3px;background:var(--kinari);color:var(--sumi);
}
.mem .msize__q:focus{outline:none;border-color:var(--kin);background:#fff}
.mem .msize tfoot th,.mem .msize tfoot td{
  background:var(--kinari-2);border-bottom:0;font-family:var(--sans);font-size:16px;font-weight:700;
}
.mem .msize tfoot td{font-variant-numeric:tabular-nums;color:var(--kin-d);font-size:19px}

/* ─── 出る ───────────────────────────── */
.mem .mem__out{margin:clamp(56px,8vw,88px) 0 0;text-align:center}
.mem .mem__out button{
  border:1px solid var(--kinari-3);background:#fff;color:var(--sumi-3);border-radius:99px;
  padding:11px 26px;font-family:var(--sans);font-size:14.5px;letter-spacing:.08em;cursor:pointer;
  transition:border-color .25s,color .25s;
}
.mem .mem__out button:hover{border-color:var(--shu);color:var(--shu)}

/* ─── 小さな画面 ─────────────────────────── */
@media (max-width:760px){
  .mem .mstep__it,.mem .mstep__it:not(:has(.mstep__img)){
    grid-template-columns:36px 1fr;gap:0 14px;padding:18px;
  }
  .mem .mstep__no{width:32px;height:32px;font-size:15px}
  .mem .mstep__img{grid-column:1 / -1;margin-top:16px;max-width:320px}
}
@media (max-width:600px){
  .mem .mnews__it{grid-template-columns:1fr;gap:6px;padding:17px 18px}
  .mem .mnews__date{padding-top:0}
  .mem .msch__it{grid-template-columns:1fr auto;gap:4px 12px;padding:15px 18px}
  .mem .msch__b{grid-column:1 / -1;margin-top:5px}
  .mem .mem__jump a{font-size:13.5px;padding:8px 15px}
  .mem .msize th,.mem .msize td{padding:11px 13px;font-size:15px}
  .mem .msize tbody th{width:auto;font-size:16px}
  .mem .msize__p{width:auto}
  .mem .msize__q{width:4.4em;font-size:16px}
}

/* =========================================================
   第六天のこと（dairokuten.php）
   図はすべて HTML／SVG で描いています（画像ファイルは使いません）
   ========================================================= */

/* ---- ひとことでいうと ---- */
.doc .dt-sum{margin:0 0 2.4em;background:#fff;border:1px solid rgba(176,138,46,.45);
  box-shadow:var(--shadow-s);padding:clamp(20px,3vw,30px) clamp(18px,3vw,32px)}
.doc .dt-sum__ttl{display:flex;align-items:center;gap:12px;margin:0 0 14px;
  font-family:var(--serif);font-weight:700;font-size:15px;letter-spacing:.2em;color:var(--kin-d)}
.doc .dt-sum__ttl::after{content:"";flex:1;height:1px;background:rgba(176,138,46,.4)}
.doc .dt-sum ol{list-style:none;margin:0;padding:0;counter-reset:dt}
.doc .dt-sum li{position:relative;padding:4px 0 4px 2.6em;margin:0 0 10px;
  font-size:16.5px;line-height:2;color:var(--sumi-2);counter-increment:dt}
.doc .dt-sum li:last-child{margin-bottom:0}
.doc .dt-sum li::before{content:counter(dt,cjk-ideographic);position:absolute;left:0;top:6px;
  width:1.8em;height:1.8em;border-radius:50%;background:var(--shu);color:#fff;
  font-family:var(--serif);font-weight:700;font-size:15px;line-height:1.8em;text-align:center}
.doc .dt-sum li .em{color:var(--shu);font-weight:700}

/* ---- 図のかこみ（共通） ---- */
.doc .dt-fig{margin:30px auto 36px;max-width:640px}
.doc .dt-fig figcaption{margin-top:12px}

/* ---- 欲界の六つの天 ---- */
.dt-ten{background:linear-gradient(180deg,#fffaf0,#f6edd6);border:1px solid rgba(176,138,46,.4);
  padding:22px clamp(14px,3vw,30px) 0;text-align:center;overflow:hidden}
.dt-ten ol{list-style:none;margin:0 auto;padding:0;display:flex;flex-direction:column;align-items:center;gap:6px}
.dt-ten li{display:flex;align-items:baseline;justify-content:center;gap:.6em;flex-wrap:wrap;
  width:var(--w);max-width:100%;padding:9px 12px;background:#fff;border:1px solid rgba(176,138,46,.38);
  border-radius:3px;font-family:var(--serif)}
.dt-ten li .no{font-weight:700;font-size:13px;letter-spacing:.1em;color:var(--kin-d)}
.dt-ten li b{font-size:17px;letter-spacing:.12em;color:var(--sumi)}
.dt-ten li small{font-family:var(--sans);font-size:12px;color:var(--sumi-3);letter-spacing:.06em}
.dt-ten li.is-on{background:var(--shu);border-color:var(--shu-d);box-shadow:0 4px 14px rgba(192,39,45,.25)}
.dt-ten li.is-on .no,.dt-ten li.is-on b,.dt-ten li.is-on small{color:#fff}
.dt-ten li.is-on b{font-size:19px}
.dt-ten__tag{display:inline-block;margin-left:.3em;padding:1px 8px;border-radius:999px;background:#fff;
  color:var(--shu)!important;font-weight:700;font-size:12px!important;letter-spacing:.08em}
.dt-ten__ground{margin:14px -40px 0;padding:12px 0 14px;background:#e7dcc0;border-top:1px solid rgba(176,138,46,.4);
  font-family:var(--serif);font-size:14px;letter-spacing:.2em;color:var(--sumi-2)}
.dt-ten__arrow{display:block;margin:8px auto 0;font-size:12.5px;color:var(--sumi-3);letter-spacing:.1em}

/* ---- 神世七代 ---- */
.dt-kami{list-style:none;margin:0;padding:0;border:1px solid rgba(176,138,46,.4);background:#fff}
.dt-kami li{display:grid;grid-template-columns:4.2em 1fr;align-items:center;gap:0 14px;
  padding:11px clamp(12px,2.4vw,20px);border-top:1px dashed rgba(176,138,46,.35)}
.dt-kami li:first-child{border-top:0}
.dt-kami .no{font-family:var(--serif);font-weight:700;font-size:14px;letter-spacing:.1em;color:var(--kin-d);text-align:center}
.dt-kami b{display:block;font-family:var(--serif);font-size:16.5px;letter-spacing:.06em;color:var(--sumi);line-height:1.6}
.dt-kami small{display:block;font-size:12px;color:var(--sumi-3);letter-spacing:.04em;line-height:1.6}
.dt-kami .pair{display:inline-block;margin-left:.5em;padding:0 6px;border:1px solid rgba(176,138,46,.5);
  border-radius:3px;font-size:11px;color:var(--kin-d);letter-spacing:.06em;vertical-align:2px;font-family:var(--sans)}
.dt-kami li.is-on{background:#fdf1ef;border-top-style:solid;border-top-color:rgba(192,39,45,.35)}
.dt-kami li.is-on + li{border-top-style:solid;border-top-color:rgba(192,39,45,.35)}
.dt-kami li.is-on .no{color:#fff;background:var(--shu);border-radius:4px;padding:6px 0}
.dt-kami li.is-on b{color:var(--shu-d);font-weight:700}
.dt-kami .eq{display:block;margin-top:2px;font-family:var(--serif);font-size:14px;color:var(--shu);font-weight:700;letter-spacing:.04em}

/* ---- 第六天社の数（横棒） ---- */
.dt-bars{list-style:none;margin:0;padding:18px clamp(14px,3vw,26px);background:#fff;border:1px solid rgba(176,138,46,.4)}
.dt-bars li{display:grid;grid-template-columns:5.2em 1fr;align-items:center;gap:12px;margin:10px 0}
.dt-bars .nm{font-family:var(--serif);font-weight:700;font-size:15px;letter-spacing:.08em;color:var(--sumi);text-align:right}
.dt-bars .bar{position:relative;height:30px;background:var(--kinari-2);border-radius:2px}
.dt-bars .bar i{position:absolute;left:0;top:0;bottom:0;width:var(--p);
  background:linear-gradient(90deg,var(--kin),var(--kin-l));border-radius:2px}
.dt-bars .bar span{position:absolute;left:calc(var(--p) + 8px);top:50%;transform:translateY(-50%);
  font-family:var(--serif);font-weight:700;font-size:15px;color:var(--kin-d);white-space:nowrap}
.dt-bars li.is-big .bar span{left:auto;right:10px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}

/* ---- 明治四十三年ごろの悪戸新田（地図） ---- */
.dt-map{background:#fbf7ea;border:1px solid rgba(176,138,46,.45);box-shadow:var(--shadow-s);line-height:0}
.dt-map svg{display:block;width:100%;height:auto}
.dt-map__hint{display:none}
@media (max-width:640px){
  .dt-map{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .dt-map svg{width:640px;max-width:none}
  .dt-map__hint{display:block;margin-top:8px;font-size:12px;color:var(--sumi-3);text-align:center;letter-spacing:.06em}
}

/* ---- ささらの一日と第六天 ---- */
.doc .dt-flow{list-style:none;margin:26px 0 30px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;counter-reset:fl}
.doc .dt-flow li{position:relative;background:#fff;border:1px solid rgba(176,138,46,.4);padding:18px 16px 16px;
  counter-increment:fl}
.doc .dt-flow li:not(:last-child)::after{content:"";position:absolute;right:-12px;top:50%;width:10px;height:10px;
  border-top:2px solid var(--kin);border-right:2px solid var(--kin);transform:translateY(-50%) rotate(45deg)}
.doc .dt-flow .tm{display:block;font-family:var(--serif);font-weight:700;font-size:13px;letter-spacing:.16em;color:var(--kin-d)}
.doc .dt-flow b{display:block;margin:4px 0 6px;font-family:var(--serif);font-size:18px;letter-spacing:.08em;color:var(--sumi)}
.doc .dt-flow p{margin:0;font-size:14.5px;line-height:1.9;color:var(--sumi-2)}
.doc .dt-flow li.is-on{border-color:var(--shu);background:#fdf3f1}
.doc .dt-flow li.is-on b{color:var(--shu-d)}
@media (max-width:640px){
  .doc .dt-flow{grid-template-columns:1fr;gap:16px}
  .doc .dt-flow li:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-13px;transform:translateX(-50%) rotate(135deg)}
}

/* ---- 写真（管理画面から入れたものだけ出ます） ---- */
.doc .dt-photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;margin:28px 0 34px}
.doc .dt-photos figure{margin:0}
.doc .dt-photos img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.doc .dt-photos .is-empty img{border-style:dashed;border-color:rgba(176,138,46,.6);background:#fbf7ea;box-shadow:none}

/* ---- もどるボタン（2つ） ---- */
.backlink--2{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---- 歴史ページから「第六天のこと」へのリンク ---- */
.doc a.dt-more{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 16px;
  margin:6px 0 30px;padding:18px 22px;background:#fff;border:1px solid rgba(176,138,46,.5);
  border-left:4px solid var(--shu);box-shadow:var(--shadow-s);transition:box-shadow .25s,transform .25s}
.doc a.dt-more:hover{box-shadow:var(--shadow-m);transform:translateY(-2px)}
.doc a.dt-more .k{grid-column:1;font-family:var(--serif);font-size:12.5px;letter-spacing:.2em;color:var(--kin-d)}
.doc a.dt-more b{grid-column:1;font-family:var(--serif);font-size:20px;letter-spacing:.1em;color:var(--sumi)}
.doc a.dt-more small{grid-column:1;font-size:13.5px;line-height:1.8;color:var(--sumi-3)}
.doc a.dt-more::after{content:"→";grid-column:2;grid-row:1 / span 3;font-size:22px;color:var(--shu)}