/* 道の駅スタンプ帳（inc/hk-db-me.php が道の駅の48ページと /stamp/ だけで読む）2026-10-13
 * ・全部 body.hkme-on の下。クラスは hkme- で閉じる（器・エンジョイ東京型・案2の層とはぶつけない）
 * ・ボタンと帯は JS が後から足す。場所は html.hkme-js（頭の印）のときに CSS で先に取っておく＝足しても下が動かない（CLS 0）
 * ・細い線・影・ダークモードは使わない。押した判子だけ少し動く（動きを減らす設定では止める）
 */
body.hkme-on{--hkme-ink:#23519f;--hkme-link:#0075E0;--hkme-navy:#101820;--hkme-text:#16232D;--hkme-sub:#5C7080;--hkme-sky:#EDF6FF;--hkme-chip:#D0E9FF;--hkme-or:#FF8A00;--hkme-track:#EEF2F6;--hkme-paper:#FBF7EE;--hkme-num:"Barlow",-apple-system,BlinkMacSystemFont,"Hiragino Sans",sans-serif;--hkme-stamp:"Zen Kaku Gothic Antique","Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;--hkme-band-h:88px;--hkme-band-m:18px}

/* ============ 行ったボタン（判子） ============ */
body.hkme-on .hkme-go,body.hkme-on .hkdb .hkme-go{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;height:32px;max-width:100%;padding:0 12px 0 5px;border-radius:999px;background:var(--hkme-chip);color:var(--hkme-link);font:700 13px/1 "Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;cursor:pointer;white-space:nowrap;vertical-align:middle;-webkit-tap-highlight-color:transparent}
body.hkme-on .hkme-go:focus-visible{outline:3px solid var(--hkme-or);outline-offset:2px}
body.hkme-on .hkme-go__c{display:inline-block;flex:none;width:22px;height:22px;border-radius:50%;background:#fff}
body.hkme-on .hkme-go__st{display:none;flex:none;width:30px;height:30px;color:var(--hkme-ink)}
body.hkme-on .hkme-go__st svg{display:block;width:100%;height:100%;transform:rotate(-10deg);mix-blend-mode:multiply;opacity:.92}
body.hkme-on .hkme-go.is-on{background:#fff;color:var(--hkme-ink);padding:0 12px 0 1px}
body.hkme-on .hkme-go.is-on .hkme-go__c{display:none}
body.hkme-on .hkme-go.is-on .hkme-go__st{display:block}
body.hkme-on .hkme-go.is-press .hkme-go__st svg{animation:hkme-press .6s cubic-bezier(.2,.8,.3,1.1) both}
@keyframes hkme-press{0%{transform:rotate(-10deg) scale(1.9);opacity:0}55%{transform:rotate(-10deg) scale(.9);opacity:1}100%{transform:rotate(-10deg) scale(1);opacity:.92}}
@media (prefers-reduced-motion:reduce){body.hkme-on .hkme-go.is-press .hkme-go__st svg{animation:none}}

/* ---- 県ページ：一覧の章の駅名のマス。ボタンの段（34px）を CSS で先に取り、JS はその中へ絶対配置で置く ---- */
html.hkme-js body.hkme-on--pref .hkdb #list td[data-lb="道の駅"]{position:relative;padding-bottom:52px}
body.hkme-on--pref .hkdb #list td[data-lb="道の駅"] .hkme-row{position:absolute;left:12px;right:8px;bottom:10px;height:34px;display:flex;align-items:center}
@media (max-width:680px){
  html.hkme-js body.hkme-on--pref .hkdb #list .hkdb-tbl--cards td[data-lb="道の駅"]{padding-bottom:46px}
  body.hkme-on--pref .hkdb #list .hkdb-tbl--cards td[data-lb="道の駅"] .hkme-row{left:0;right:0;bottom:6px;padding-left:calc(6.5 * 12.5px + 8px)}
}

/* ---- 一覧ページ：駅のカード（data-f-sh があるのが駅・県のカードには無い）。段を CSS で先に取る ---- */
html.hkme-js body.hkme-on--list .hkdb li.hkdb-card[data-f-sh]{position:relative;padding-bottom:58px}
body.hkme-on--list .hkdb li.hkdb-card[data-f-sh] .hkme-row{position:absolute;left:18px;right:18px;bottom:14px;height:34px;display:flex;align-items:center}
@media (max-width:680px){
  html.hkme-js body.hkme-on--list .hkdb li.hkdb-card[data-f-sh]{padding-bottom:54px}
  body.hkme-on--list .hkdb li.hkdb-card[data-f-sh] .hkme-row{left:12px;right:12px;bottom:12px}
}

/* ============ 県のスタンプの帯（タブの下）。高さは決め打ち。タブの下の余白で先に取る ============ */
html.hkme-js body.hkme-on--pref .hkdb .hket-tabs{padding-bottom:calc(var(--hkme-band-m) + var(--hkme-band-h))}
html.hkme-js body.hkme-on--pref.hkme-band-in .hkdb .hket-tabs{padding-bottom:0}
body.hkme-on .hkme-band{box-sizing:border-box;display:flex;align-items:center;gap:16px;height:var(--hkme-band-h);margin:var(--hkme-band-m) 0 0;padding:0 18px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 2px var(--hkme-chip);overflow:hidden;font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif}
body.hkme-on .hkme-band__st{flex:none;width:52px;height:52px;color:var(--hkme-ink)}
body.hkme-on .hkme-band__st svg{display:block;width:100%;height:100%;transform:rotate(-10deg)}
body.hkme-on .hkme-band__b{flex:1;min-width:0}
body.hkme-on .hkme-band .hkme-band__k{margin:0;font-size:13px;line-height:18px;font-weight:700;color:var(--hkme-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.hkme-on .hkme-band .hkme-band__t{margin:0;height:30px;font-size:14px;line-height:30px;font-weight:700;color:var(--hkme-navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.hkme-on .hkme-band__t b{margin:0 2px 0 0;font:700 26px/30px var(--hkme-num);color:var(--hkme-ink)}
body.hkme-on .hkme-band__t small{margin-left:10px;font-size:12px;font-weight:500;color:var(--hkme-sub)}
body.hkme-on .hkme-band__bar{height:8px;margin-top:4px;border-radius:999px;background:var(--hkme-track);overflow:hidden}
body.hkme-on .hkme-band__bar i{display:block;height:100%;width:0;border-radius:999px;background:var(--hkme-or);transition:width .4s}
@media (max-width:680px){
  body.hkme-on{--hkme-band-h:130px;--hkme-band-m:16px}
  body.hkme-on .hkme-band{display:grid;grid-template-columns:52px minmax(0,1fr);grid-template-rows:56px 40px;gap:10px 12px;align-items:center;padding:12px 14px}
  body.hkme-on .hkdb .hkme-band .hkme-pill{grid-column:1/-1;width:100%;justify-content:center}
  body.hkme-on .hkme-band__t small{display:none}
}

/* ピルのボタン（リンクとボタンの両方） */
body.hkme-on .hkme-pill,body.hkme-on .hkdb .hkme-pill{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex:none;height:40px;padding:0 18px;border-radius:999px;background:var(--hkme-link);color:#fff;font:700 14px/1 "Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer}
body.hkme-on .hkdb a.hkme-pill::before,body.hkme-on .hkdb a.hkme-pill::after{content:none;display:none}
body.hkme-on .hkme-pill:focus-visible{outline:3px solid var(--hkme-or);outline-offset:2px}
body.hkme-on .hkme-pill--w,body.hkme-on .hkdb .hkme-pill--w{background:var(--hkme-sky);color:var(--hkme-link)}
body.hkme-on .hkme-pill--danger,body.hkme-on .hkdb .hkme-pill--danger{background:#fff;color:#B00A00;box-shadow:inset 0 0 0 2px #F6C9C5}
body.hkme-on .hkme-pill[disabled]{opacity:.5;cursor:default}

/* 押したあとのお知らせ（画面の下に浮かぶ。場所を取らないので下が動かない） */
body.hkme-on .hkme-toast{position:fixed;left:50%;bottom:20px;z-index:9990;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 32px);box-sizing:border-box;padding:10px 10px 10px 16px;border-radius:999px;background:var(--hkme-navy);color:#fff;font:700 14px/1.4 "Hiragino Sans",sans-serif;transform:translate(-50%,0);opacity:1;transition:opacity .25s,transform .25s}
body.hkme-on .hkme-toast[hidden]{display:flex;opacity:0;transform:translate(-50%,16px);pointer-events:none;visibility:hidden}
body.hkme-on .hkme-toast a{flex:none;padding:7px 14px;border-radius:999px;background:#fff;color:var(--hkme-navy)!important;text-decoration:none!important;font-size:13px}
body.hkme-on .hkme-toast a::before,body.hkme-on .hkme-toast a::after{content:none;display:none}
@media (prefers-reduced-motion:reduce){body.hkme-on .hkme-toast{transition:none}}

/* ============ スタンプ帳（/stamp/） ============ */
body.hkme-on--book .hkme-js-only{display:none}
html.hkme-js body.hkme-on--book .hkme-js-only{display:flex}
html.hkme-js body.hkme-on--book .hkme-danger.hkme-js-only{display:block}
body.hkme-on--book .hkme-hero{margin:18px 0 18px}
body.hkme-on--book .hkme-hero__t{margin:0 0 10px;font:700 28px/1.35 "Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;color:var(--hkme-navy)}
body.hkme-on--book .hkme-hero__lead{margin:0;font-size:15px;line-height:1.8;color:var(--hkme-text)}
body.hkme-on--book .hkme-book{font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;color:var(--hkme-text)}
body.hkme-on--book .hkme-sum{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;margin:0 0 8px}
body.hkme-on--book .hkme-sum__main{box-sizing:border-box;min-height:176px;background:#fff;border-radius:20px;padding:20px 22px;box-shadow:inset 0 0 0 2px var(--hkme-chip)}
body.hkme-on--book .hkme-sum__k{margin:0;font-size:14px;line-height:20px;font-weight:700;color:var(--hkme-sub)}
body.hkme-on--book .hkme-sum__v{margin:6px 0 0;height:52px;font:700 52px/52px var(--hkme-num);color:var(--hkme-ink);white-space:nowrap}
body.hkme-on--book .hkme-sum__v b{font:inherit;color:inherit}
body.hkme-on--book .hkme-sum__v small{font:700 18px/1 var(--hkme-num);color:var(--hkme-sub);margin-left:6px}
body.hkme-on--book .hkme-sum__bar{height:12px;margin-top:12px;border-radius:999px;background:var(--hkme-track);overflow:hidden}
body.hkme-on--book .hkme-sum__bar i{display:block;height:100%;width:0;background:var(--hkme-or);border-radius:999px}
body.hkme-on--book .hkme-sum__row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px;font-size:12.5px;line-height:1.45;color:var(--hkme-sub)}
body.hkme-on--book .hkme-sum__row>span{min-width:0}
body.hkme-on--book .hkme-sum__row b{display:block;height:24px;font:700 20px/24px var(--hkme-num);color:var(--hkme-navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.hkme-on--book .hkme-sum__row em{font-style:normal}
body.hkme-on--book .hkme-sum__keep{box-sizing:border-box;min-height:176px;background:var(--hkme-sky);border-radius:20px;padding:18px 20px}
body.hkme-on--book .hkme-sum__keep p{margin:0 0 12px;font-size:13.5px;line-height:1.7}
body.hkme-on--book .hkme-cta{display:flex;flex-wrap:wrap;gap:10px}
body.hkme-on--book .hkme-keep__msg{min-height:1.6em;margin:8px 0 0!important;font-size:13px!important;font-weight:700;color:var(--hkme-ink)}
body.hkme-on--book .hkme-keep__no{color:#B00A00}
@media (max-width:680px){
  body.hkme-on--book .hkme-hero__t{font-size:24px}
  body.hkme-on--book .hkme-sum{grid-template-columns:1fr}
  body.hkme-on--book .hkme-sum__main{padding:18px 16px}
  body.hkme-on--book .hkme-sum__v{height:46px;font-size:46px;line-height:46px}
  body.hkme-on--book .hkme-sum__keep{min-height:0;padding:16px}
  body.hkme-on--book .hkme-sum__keep .hkme-pill{width:100%}
}
body.hkme-on--book .hkme-h2{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:30px 0 12px;padding:0;font:700 20px/1.4 "Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;color:var(--hkme-navy);background:none;border:0}
body.hkme-on--book .hkme-h2::before{content:"";flex:none;width:8px;height:24px;border-radius:4px;background:var(--hkme-or)}
body.hkme-on--book .hkme-h2::after{content:none;display:none}
body.hkme-on--book .hkme-h2 small{font-size:13px;font-weight:500;color:var(--hkme-sub)}
@media (max-width:680px){body.hkme-on--book .hkme-h2 small{flex-basis:100%;margin-left:18px}}
body.hkme-on--book .hkme-regs{flex-wrap:nowrap;gap:6px;overflow-x:auto;margin:0 0 12px;padding:0 0 4px;scrollbar-width:none}
body.hkme-on--book .hkme-regs::-webkit-scrollbar{display:none}
body.hkme-on--book .hkme-reg{all:unset;box-sizing:border-box;flex:none;height:34px;line-height:34px;padding:0 14px;border-radius:999px;background:var(--hkme-sky);color:var(--hkme-link);font-weight:700;font-size:13px;cursor:pointer}
body.hkme-on--book .hkme-reg.is-on{background:var(--hkme-link);color:#fff}
body.hkme-on--book .hkme-reg:focus-visible{outline:3px solid var(--hkme-or);outline-offset:2px}
body.hkme-on--book .hkme-prefs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
body.hkme-on--book .hkme-prefs>li{margin:0;padding:0;list-style:none}
body.hkme-on--book .hkme-prefs>li::before,body.hkme-on--book .hkme-prefs>li::marker{content:none;display:none}
body.hkme-on--book .hkme-prefs>li[hidden]{display:none}
@media (max-width:1000px){body.hkme-on--book .hkme-prefs{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:680px){body.hkme-on--book .hkme-prefs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}}
body.hkme-on--book .hkdb a.hkme-pf,body.hkme-on--book a.hkme-pf{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:4px;height:118px;padding:12px 6px 10px;border-radius:16px;background:var(--hkme-sky);text-decoration:none;color:var(--hkme-text)}
body.hkme-on--book .hkdb a.hkme-pf::before,body.hkme-on--book .hkdb a.hkme-pf::after{content:none;display:none}
body.hkme-on--book .hkme-pf svg{flex:none;width:44px;height:44px;color:#B9D6F2}
body.hkme-on--book .hkme-pf.is-on{background:#fff;box-shadow:inset 0 0 0 2px var(--hkme-chip)}
body.hkme-on--book .hkme-pf.is-on svg{color:var(--hkme-ink)}
body.hkme-on--book .hkme-pf b{font-size:14px;line-height:18px}
body.hkme-on--book .hkme-pf em{font:700 13px/16px var(--hkme-num);font-style:normal;color:var(--hkme-sub)}
body.hkme-on--book .hkme-pf.is-on em{color:var(--hkme-ink)}
body.hkme-on--book .hkme-pf i{display:block;flex:none;width:80%;height:5px;margin-top:auto;border-radius:999px;background:#fff;overflow:hidden}
body.hkme-on--book .hkme-pf.is-on i{background:var(--hkme-track)}
body.hkme-on--book .hkme-pf i::after{content:"";display:block;height:100%;width:var(--w,0);background:var(--hkme-or)}
body.hkme-on--book .hkme-stamps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px 10px;padding:18px;border-radius:20px;background:var(--hkme-paper)}
@media (max-width:680px){body.hkme-on--book .hkme-stamps{grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;gap:10px 6px}}
body.hkme-on--book .hkme-stamps__none{grid-column:1/-1;margin:0;padding:12px 4px;font-size:14px;line-height:1.8}
body.hkme-on--book .hkme-stamps figure{margin:0;text-align:center;min-width:0}
body.hkme-on--book .hkme-stamps .s{display:block;width:100%;aspect-ratio:1;color:var(--hkme-ink)}
body.hkme-on--book .hkme-stamps .s svg{display:block;width:100%;height:100%;mix-blend-mode:multiply;opacity:.9}
body.hkme-on--book .hkme-stamps figcaption{margin-top:2px;font-size:12px;line-height:1.45;color:var(--hkme-sub);overflow-wrap:anywhere}
body.hkme-on--book .hkme-stamps .is-empty .s{display:flex;align-items:center;justify-content:center;border-radius:50%;background:#F1EADB;color:#8C7F66;font-size:12px;font-weight:700}
body.hkme-on--book .hkme-more{grid-column:1/-1;text-align:center;margin:6px 0 0}
body.hkme-on--book .hkme-sec{margin:8px 0 0}
body.hkme-on--book .hkme-p{margin:0 0 12px;font-size:15px;line-height:1.85}
body.hkme-on--book .hkme-steps{margin:0 0 12px;padding:0 0 0 1.6em;font-size:15px;line-height:1.85}
body.hkme-on--book .hkme-steps li{margin:0 0 6px;padding:0;list-style:decimal}
body.hkme-on--book .hkme-steps li::before{content:none;display:none}
body.hkme-on--book .hkme-danger{margin-top:14px;padding:16px 18px;border-radius:16px;background:#FFF6F5}
body.hkme-on--book .hkme-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:4px 0 0;padding:0;list-style:none}
@media (max-width:680px){body.hkme-on--book .hkme-links{grid-template-columns:1fr}}
body.hkme-on--book .hkme-links li{margin:0;padding:12px 14px;border-radius:14px;background:var(--hkme-sky);list-style:none;font-size:14px;line-height:1.6}
body.hkme-on--book .hkme-links li::before{content:none;display:none}
body.hkme-on--book .hkme-links a{color:var(--hkme-link);text-decoration:underline;font-weight:700}
body.hkme-on--book .hkme-links a b{display:inline-block;margin-right:8px;padding:1px 9px;border-radius:999px;background:#fff;color:var(--hkme-navy);font-size:12px;text-decoration:none}
body.hkme-on--book .hkme-links small{display:block;margin-top:2px;color:var(--hkme-sub);font-size:12.5px}
body.hkme-on--book .hkme-src{margin:24px 0 0;font-size:12.5px;line-height:1.7;color:var(--hkme-sub)}
body.hkme-on--book .hkme-src a{color:var(--hkme-link);text-decoration:underline}
body.hkme-on--book .hkme-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* 引き継ぎ用のURLを読み込む面（画面の上に浮かぶ。場所を取らない） */
body.hkme-on .hkme-veil{position:fixed;inset:0;z-index:9991;background:rgba(16,24,32,.48)}
body.hkme-on .hkme-dlg{position:fixed;z-index:9992;left:50%;top:50%;transform:translate(-50%,-50%);box-sizing:border-box;width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 64px);overflow:auto;padding:22px 22px 20px;border-radius:20px;background:#fff;color:var(--hkme-text);font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif}
body.hkme-on .hkme-dlg h2{margin:0 0 8px;font-size:19px;line-height:1.45;color:var(--hkme-navy)}
body.hkme-on .hkme-dlg p{margin:0 0 14px;font-size:14px;line-height:1.75}
body.hkme-on .hkme-dlg .hkme-cta{display:flex;flex-wrap:wrap;gap:10px}
body.hkme-on .hkme-dlg input{box-sizing:border-box;width:100%;margin:0 0 12px;padding:10px 12px;border:0;border-radius:10px;background:var(--hkme-track);font:13px/1.4 ui-monospace,Menlo,monospace;color:var(--hkme-text)}
/* 2026-10-13 320px でまとめの札の最後の1字（県・日）が次の行へ落ちた。380px 以下は字を1段小さく、2行になるときは行の長さをそろえる */
body.hkme-on--book .hkme-sum__row>span{text-wrap:balance}
@media (max-width:380px){body.hkme-on--book .hkme-sum__row{gap:6px;font-size:11px}}