/* 案2 zk2「きっぷとスタンプ」 2026-10-02
   主役の部品＝券の形（半券・ミシン目・丸い切り欠き・券番号の欄）／判子（朱の丸い判子・消印・青インクのスタンプ）／パタパタの板
   ・本文は #z4-root から書く（本番の .zm-zp4 .xxx＝0,2,0 に勝つ）。ヘッダーとフッターは 2026-10-02 午後に kami-zk.css（全ページ共通）へ移した
   ・足したクラスは全部 zk2- で始まる
   ・動き（animation と飾りの transition）は html.zk-m の下だけ。隠す初期状態は html.zk-io（JSが付ける）の下だけ
   ・切り欠きは mask（radial-gradient を半分ずつの面に置く＝合成なしで穴だけ抜ける）。影は親の drop-shadow で形に沿わせる */

body.home{--zk2-blue:#2b66cc;--zk2-blue-d:#1d4fa6;--zk2-shu:#cc3727;--zk2-ink:#23519f;--zk2-perf:#b3c4dc;
 --zk2-stamp:"Zen Kaku Gothic Antique","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
 --zk2-digit:"Barlow Condensed","DIN Alternate","Arial Narrow","Helvetica Neue",Arial,sans-serif}
.zk2-sp{position:absolute;width:0;height:0;overflow:hidden}
.zk2-seal,.zk2-pm,.zk2-rally__s,.zk2-rg__s{display:block;overflow:visible}
.zk2-seal text,.zk2-pm text{font-family:var(--zk2-stamp);font-weight:700;fill:currentColor}

/* ── 0 見出しの型：左に硬券の札（左右の丸い切り欠き・ミシン目・小さな半券・線画アイコン）。文字は大きく太く、左寄せにそろえる */
#z4-root .zk2-h{display:flex;align-items:center;justify-content:flex-start;gap:16px;padding-left:0;text-align:left;font-family:var(--z5-bold);font-weight:700;font-size:32px;line-height:1.3;letter-spacing:.04em;color:#111}
#z4-root .zk2-h--w{color:#fff}
#z4-root .zk2-h::before,#z4-root .zk2-h::after{content:none;display:none}
#z4-root .z4-shelf__ttl .z4-shelf__ico{display:none}
#z4-root .zk2-ht{position:relative;flex:none;display:block;width:66px;height:42px;--zk2-hbg:#fff}
#z4-root .zk2-ht__b{position:absolute;inset:0;border-radius:5px;color:#fff;
 background:radial-gradient(circle 1.5px,rgba(255,255,255,.95) 90%,#0000) 46px 3px/3px 6.6px repeat-y,linear-gradient(90deg,#0000 47.5px,rgba(8,30,90,.17) 47.5px),linear-gradient(135deg,#2d69d0,#2bcccc);
 -webkit-mask:radial-gradient(circle 6px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 6px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .zk2-ht__i{position:absolute;left:11px;top:50%;width:25px;height:25px;margin-top:-12.5px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
#z4-root .zk2-ht__cut{position:absolute;left:29px;top:-1px;width:13px;height:10px;background:var(--zk2-hbg);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0}
#z4-root .zk2-ht__chip{position:absolute;left:29px;top:0;width:13px;height:10px;background:#2f71d2;clip-path:polygon(0 0,100% 0,50% 100%);opacity:0;pointer-events:none}
#z4-root .zk2-ht--w{--zk2-hbg:#2f70d1}
#z4-root .zk2-ht--w .zk2-ht__b{color:var(--zk2-blue);background:radial-gradient(circle 1.5px,#93aedb 90%,#0000) 46px 3px/3px 6.6px repeat-y,linear-gradient(90deg,#0000 47.5px,#e6eefa 47.5px),#fff}
#z4-root .zk2-ht--w .zk2-ht__chip{background:#fff}
@keyframes zk2-cut{0%{transform:scaleY(0)}55%{transform:scaleY(1.3)}100%{transform:scaleY(1)}}
@keyframes zk2-chip{0%{opacity:0;transform:none}15%{opacity:1;transform:none}100%{opacity:0;transform:translate(7px,34px) rotate(170deg)}}
@keyframes zk2-jolt{0%,100%{transform:none}35%{transform:translateY(2px) scale(.97)}}
html.zk-io #z4-root .zk2-ht[data-zk2]:not(.zk2-go):not(.zk2-done) .zk2-ht__cut{transform:scaleY(0)}
html.zk-m #z4-root .zk2-ht.zk2-go .zk2-ht__cut{animation:zk2-cut .34s .14s cubic-bezier(.3,1.7,.6,1) both}
html.zk-m #z4-root .zk2-ht.zk2-go .zk2-ht__chip{animation:zk2-chip .95s .18s cubic-bezier(.45,0,.8,.55) both}
html.zk-m #z4-root .zk2-ht.zk2-go .zk2-ht__b{animation:zk2-jolt .34s .12s ease-out both}
/* 最初の画面（注目のイベント）は JS を待たず CSS の時間差で */
html.zk-m #z4-root .zk2-ht.zk2-fv .zk2-ht__cut{animation:zk2-cut .34s .55s cubic-bezier(.3,1.7,.6,1) both}
html.zk-m #z4-root .zk2-ht.zk2-fv .zk2-ht__chip{animation:zk2-chip .95s .59s cubic-bezier(.45,0,.8,.55) both}
html.zk-m #z4-root .zk2-ht.zk2-fv .zk2-ht__b{animation:zk2-jolt .34s .53s ease-out both}

/* ── 判子（朱）の共通 */
#z4-root .zk2-seal{position:absolute;color:var(--zk2-shu);mix-blend-mode:multiply;pointer-events:none}

/* ── 1 ヘッダー … 2026-10-02 午後に kami-zk.css（全ページ共通）へ移した。トップも kami-zk.css を読む（kami/zk-parts.php）。
   ここには本文のテーマの札が使う zk2-snip だけ残す */
@keyframes zk2-snip{0%{transform:scaleY(0)}50%{transform:scaleY(1.35)}100%{transform:scaleY(1)}}

/* ── 2 注目のイベント：3枚を券の形に（写真と文字の境にミシン目と左右の切り欠き・右に半券） */
#z4-root .z4-pick__cards>li{filter:drop-shadow(2px 3px 6px rgba(19,30,51,.17))}
#z4-root .z4-pc{background:transparent;box-shadow:none;border-radius:6px}
#z4-root .z4-pc__img{-webkit-mask:radial-gradient(circle 10px at 0 100%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 10px at 100% 100%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z4-pc__txt{position:relative;flex:1 1 auto;box-sizing:border-box;background:#fff;
 -webkit-mask:radial-gradient(circle 10px at 0 0,#0000 94%,#000) 0 0/51% 51% no-repeat,radial-gradient(circle 10px at 100% 0,#0000 94%,#000) 100% 0/51% 51% no-repeat,radial-gradient(circle 8px at calc(100% - var(--zk2-stub,-40px)) 100%,#0000 94%,#000) 0 100%/100% 50% no-repeat}
#z4-root .z4-pc__txt::before{content:"";position:absolute;left:14px;right:14px;top:1px;height:4px;background:radial-gradient(circle 1.6px,var(--zk2-perf) 90%,#0000) 0 0/8px 4px repeat-x;pointer-events:none}
/* パタパタの板（あと◯日・人出の共通）。本番の札の文字は板の下に残る（読み上げはそちら） */
#z4-root .zk2-flap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:4px;border-radius:inherit;background:var(--zk2-blue-d);color:#fff;font-family:var(--zk2-stamp);font-weight:700;line-height:1;white-space:nowrap;pointer-events:none}
#z4-root .zk2-flap__h{display:none}
#z4-root .zk2-flap__row{display:flex;align-items:center;gap:3px}
#z4-root .zk2-flap__ds{display:flex;gap:2px}
#z4-root .zk2-fd{position:relative;display:block;width:.84em;height:1.32em;border-radius:2px;background:linear-gradient(#3168c4 50%,#285aad 50%);box-shadow:inset 0 -1px 0 rgba(0,0,0,.18);perspective:80px}
#z4-root .zk2-fd b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--zk2-digit);font-weight:600;font-size:1.14em;line-height:1;color:#fff}
#z4-root .zk2-fd::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;margin-top:-.5px;background:rgba(8,20,50,.45)}
#z4-root .zk2-fd i{position:absolute;left:0;right:0;top:0;height:50%;border-radius:2px 2px 0 0;background:#3a72cf;transform-origin:50% 100%;opacity:0}
#z4-root .z4-pc__left{z-index:2}
#z4-root .z4-pc--m .z4-pc__left{left:8px;top:8px}
@media (min-width:768px){
 #z4-root .z4-pc--l{--zk2-stub:136px}
 #z4-root .z4-pc--m{--zk2-stub:88px}
 #z4-root .z4-pc--l .z4-pc__txt{min-height:150px;padding-right:calc(var(--zk2-stub) + 16px)}
 #z4-root .z4-pc--m .z4-pc__txt{min-height:118px;padding-right:calc(var(--zk2-stub) + 8px)}
 /* あと◯日の札を、右下の半券（ミシン目つき）にする。札の位置は absolute なので並びは動かない */
 #z4-root .z4-pc .z4-pc__left{left:auto;top:auto;right:0;bottom:0;width:var(--zk2-stub);padding:0;border-radius:0;transform-origin:0 100%;
  -webkit-mask:radial-gradient(circle 10px at 100% 0,#0000 94%,#000) 100% 0/51% 100% no-repeat,radial-gradient(circle 8px at 0 100%,#0000 94%,#000) 0 0/51% 100% no-repeat}
 #z4-root .z4-pc--l .z4-pc__left{height:150px}
 #z4-root .z4-pc--m .z4-pc__left{height:118px}
 #z4-root .z4-pc .zk2-flap{flex-direction:column;gap:5px;border-radius:0;color:#24426f;background:radial-gradient(circle 1.5px,#a6bad6 90%,#0000) 0 5px/3px 7px repeat-y,#f2f6fc}
 #z4-root .z4-pc .zk2-flap__h{display:block;position:absolute;left:50%;top:13px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#fff;box-shadow:inset 1px 1px 2px rgba(19,30,51,.32)}
 #z4-root .z4-pc .zk2-flap__w{margin-top:16px;font-size:13px;letter-spacing:.14em;color:#4b6086}
 #z4-root .z4-pc .zk2-flap__row{gap:4px;align-items:flex-end}
 #z4-root .z4-pc .zk2-flap__ds{gap:3px}
 #z4-root .z4-pc--l .zk2-fd{font-size:34px}
 #z4-root .z4-pc--m .zk2-fd{font-size:23px}
 #z4-root .z4-pc .zk2-flap__u{font-size:15px;margin-bottom:3px;color:#24426f}
 #z4-root .z4-pc--m .zk2-flap__w{margin-top:14px;font-size:12px}
 #z4-root .z4-pc--m .zk2-flap__u{font-size:13px}
 /* 触ると半券がもぎれかけて戻る（ミシン目の付け根を軸に少し開く） */
 html.zk-m #z4-root .z4-pc .z4-pc__left{transition:transform .38s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
 html.zk-m:not(.zk2-scr) #z4-root .z4-pc:hover .z4-pc__left{transform:rotate(4deg) translateX(2px);box-shadow:-5px 0 9px -4px rgba(19,30,51,.35)}
}
/* 大きいカードの割印「注目」（ミシン目をまたいで押す・最初の画面なので CSS の時間差で） */
#z4-root .zk2-seal--pick{z-index:3;right:calc(var(--zk2-stub,0px) - 18px);bottom:52px;width:76px;height:76px;transform:rotate(-14deg);opacity:.92}
@keyframes zk2-wariin{0%{opacity:0;transform:rotate(-30deg) scale(1.9)}55%{opacity:.95;transform:rotate(-14deg) scale(.92)}72%{transform:rotate(-14deg) scale(1.04)}100%{opacity:.92;transform:rotate(-14deg) scale(1)}}
html.zk-m #z4-root .zk2-seal--pick{animation:zk2-wariin .62s 1.45s cubic-bezier(.2,.8,.3,1.1) both}
/* よく調べられている5件：半券の束（白い半券・写真と文字の間にミシン目と上下の切り欠き・順位を券番号の欄に） */
#z4-root .z4-pick__list{isolation:isolate}
#z4-root .z4-pr{position:relative}
#z4-root .z4-pr::before{content:"";position:absolute;inset:-6px -8px;z-index:-1;background:#fff;border-radius:4px;
 -webkit-mask:radial-gradient(circle 5.5px at 98px 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 5.5px at 98px 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
#z4-root .z4-pr::after{content:"";position:absolute;left:88.5px;top:2px;bottom:2px;width:3px;background:radial-gradient(circle 1.4px,var(--zk2-perf) 90%,#0000) 0 0/3px 6px repeat-y;pointer-events:none}
#z4-root .z4-pr__no{left:-4px;top:-4px;width:28px;height:22px;border:0;border-radius:3px;background:var(--zk2-blue);color:#fff;font-size:14px;font-variant-numeric:tabular-nums;box-shadow:0 1px 3px rgba(19,30,51,.3)}

/* ── 3 記事のカルーセル：カードを券に（写真と文字の境にミシン目・上下の切り欠き）。点は小さな硬券で、送るたびにパンチ穴が開く */
#z4-root .z4-slide__a{background:transparent;border-radius:6px}
#z4-root .z4-slide__img{-webkit-mask:radial-gradient(circle 11px at 100% 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 11px at 100% 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
#z4-root .z4-slide__txt{position:relative;background:#fff;-webkit-mask:radial-gradient(circle 11px at 0 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 11px at 0 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
#z4-root .z4-slide__txt::before{content:"";position:absolute;left:1px;top:14px;bottom:14px;width:3px;background:radial-gradient(circle 1.5px,var(--zk2-perf) 90%,#0000) 0 0/3px 7px repeat-y;pointer-events:none}
#z4-root .z4-dot{position:relative}
#z4-root .z4-dot::before{width:26px;height:15px;border-radius:2px;background:#fff;
 -webkit-mask:radial-gradient(circle 3.5px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 3.5px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z4-dot.is-on::before{background:var(--zk2-blue)}
#z4-root .z4-dot::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:#c9e2ee;transform:scale(0);pointer-events:none}
#z4-root .z4-dot.is-on::after{transform:scale(1)}
@keyframes zk2-hole{0%{transform:scale(0);box-shadow:0 0 0 0 rgba(43,102,204,1)}35%{transform:scale(1.45);box-shadow:0 0 0 0 rgba(43,102,204,1)}100%{transform:scale(1);box-shadow:4px 22px 0 -1.5px rgba(43,102,204,0)}}
html.zk-m #z4-root .z4-dot.is-on::after{animation:zk2-hole .62s cubic-bezier(.3,1.5,.5,1) both}

/* ── 4 テーマの札19：硬券（アイコンが半券・ミシン目・上下の切り欠き・左上に入鋏の欠け）。触るとパチンと切れ込み、半券が少しずれる */
#z4-root .z4-gb{position:relative;-webkit-mask:radial-gradient(circle 6px at 52px 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 6px at 52px 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
#z4-root .z4-gb__in{position:relative}
#z4-root .z4-gb__in::before{content:"";position:absolute;left:48.5px;top:9px;bottom:9px;width:3px;background:radial-gradient(circle 1.4px,#bccadc 90%,#0000) 0 0/3px 6px repeat-y;pointer-events:none}
#z4-root .z4-gb::before{content:"";position:absolute;left:18px;top:0;width:10px;height:8px;z-index:1;background:#fff;clip-path:polygon(0 0,100% 0,50% 100%);pointer-events:none}
#z4-root .z4-gb::after{content:"";position:absolute;left:34px;bottom:0;width:10px;height:8px;z-index:1;background:#fff;clip-path:polygon(0 100%,100% 100%,50% 0);transform:scaleY(0);transform-origin:50% 100%;pointer-events:none}
html.zk-io #z4-root .z4-genre:not(.zk2-go):not(.zk2-done) .z4-gb::before{transform:scaleY(0)}
#z4-root .z4-gb::before{transform-origin:50% 0}
html.zk-m #z4-root .z4-genre.zk2-go .z4-gb::before{animation:zk2-cut .3s calc(var(--zk2-i,0) * 55ms + .15s) cubic-bezier(.3,1.7,.6,1) both}
@keyframes zk2-tug{0%{transform:none}35%{transform:translate(-3px,1px) rotate(-10deg)}100%{transform:translate(-2px,0) rotate(-6deg)}}
html.zk-m:not(.zk2-scr) #z4-root .z4-gb:hover::after{animation:zk2-snip .26s cubic-bezier(.3,1.8,.5,1) both}
html.zk-m:not(.zk2-scr) #z4-root .z4-gb:hover .z4-gb__ico{animation:zk2-tug .42s .08s cubic-bezier(.3,1.5,.5,1) both}

/* ── 5 日程が決まっているイベント：青い面を大きな券面に（左に白い半券・ミシン目・上下の切り欠き・朱の日付印）。開催月は日付印の丸に */
#z4-root .zk2-evstub{position:absolute;left:0;top:0;bottom:0;width:92px;background:#e9f1fc;pointer-events:none}
#z4-root .zk2-evstub::after{content:"";position:absolute;right:-1.5px;top:12px;bottom:12px;width:3px;background:radial-gradient(circle 1.6px,#9db6dd 90%,#0000) 0 0/3px 8px repeat-y}
#z4-root .zk2-seal--ev{left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;transform:rotate(-9deg);opacity:.93}
@keyframes zk2-dater{0%{opacity:0;transform:rotate(-100deg) scale(1.7)}60%{opacity:.95;transform:rotate(-6deg) scale(.93)}80%{transform:rotate(-10deg) scale(1.03)}100%{opacity:.93;transform:rotate(-9deg) scale(1)}}
html.zk-io #z4-root .zk2-evstub:not(.zk2-go):not(.zk2-done) .zk2-seal{opacity:0}
html.zk-m #z4-root .zk2-evstub.zk2-go .zk2-seal{animation:zk2-dater .7s .2s cubic-bezier(.2,.8,.3,1.1) both}
@media (min-width:768px){
 #z4-root .z5-ev__card{padding-left:calc(3% + 104px);-webkit-mask:radial-gradient(circle 9px at 92px 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 9px at 92px 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
}
/* あと◯日の札（写真の上・開催が近い順のカード）はパタパタの板の見た目に（上下で色を分けて、まん中に継ぎ目） */
#z4-root .z5-left,#z4-root .z5-tc__badge{background:linear-gradient(#3168c4 50%,#285aad 50%);border-radius:4px;font-variant-numeric:tabular-nums;letter-spacing:.08em}
#z4-root .z5-left::after,#z4-root .z5-tc__badge::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(8,20,50,.35);pointer-events:none}
/* 開催月の札＝日付印の丸（二重の輪）。種類の札＝小さな硬券 */
#z4-root .z5-find__box:first-child .z5-find__list{gap:14px 10px}
#z4-root .z5-find__box:first-child .z5-chip{min-width:0;width:60px;height:60px;padding:0;border-radius:50%;font-size:16px;font-weight:700;color:var(--zk2-blue);background:#fff;
 box-shadow:inset 0 0 0 2.5px var(--zk2-blue),inset 0 0 0 6px #fff,inset 0 0 0 7.3px var(--zk2-blue)}
#z4-root .z5-find__box:first-child .z5-chip::before{inset:0}
#z4-root .z5-find__box:first-child .z5-chip:hover,#z4-root .z5-find__box:first-child .z5-chip:focus-visible{background:var(--zk2-blue);color:#fff;box-shadow:inset 0 0 0 2.5px #fff,inset 0 0 0 6px var(--zk2-blue),inset 0 0 0 7.3px #fff}
#z4-root .z5-find__box:first-child .z5-chip::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2.5px solid var(--zk2-blue);opacity:0;pointer-events:none}
@keyframes zk2-ring{0%{opacity:0;transform:scale(1.45)}45%{opacity:.85;transform:scale(.97)}100%{opacity:0;transform:scale(1)}}
html.zk-m:not(.zk2-scr) #z4-root .z5-find__box:first-child .z5-chip:hover::after{animation:zk2-ring .5s ease-out both}
#z4-root .z5-find__box+.z5-find__box .z5-chip{min-height:44px;border-radius:4px;-webkit-mask:radial-gradient(circle 4px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 4px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}

/* ── 6 開催が近い順：カードを券に（写真と文字の間にミシン目・上下の切り欠き）。帯に入ってくるたびに消印がポン */
#z4-root .z5-tc::before,#z4-root .z5-tc::after{content:"";position:absolute;left:153px;width:16px;height:16px;border-radius:50%;background:#f4f4f4;pointer-events:none}
#z4-root .z5-tc::before{top:-8px}
#z4-root .z5-tc::after{bottom:-8px}
#z4-root .z5-tc__img{position:relative}
#z4-root .z5-tc__body{position:relative}
#z4-root .z5-tc__body::before{content:"";position:absolute;left:-7.5px;top:8px;bottom:8px;width:3px;background:radial-gradient(circle 1.5px,var(--zk2-perf) 90%,#0000) 0 0/3px 7px repeat-y;pointer-events:none}
#z4-root .z5-tc__badge{left:69%}
#z4-root .zk2-pm{position:absolute;left:118px;top:-6px;z-index:2;width:66px;height:66px;color:#1f4a96;mix-blend-mode:multiply;opacity:.86;transform:rotate(var(--r));pointer-events:none}
@keyframes zk2-cancel{0%{opacity:0;transform:translateY(-12px) rotate(var(--r)) scale(1.3)}45%{opacity:.95;transform:translateY(0) rotate(var(--r)) scale(.93)}100%{opacity:.86;transform:rotate(var(--r)) scale(1)}}
html.zk-io #z4-root .zk2-pm:not(.zk2-go):not(.zk2-done){opacity:0}
html.zk-m #z4-root .zk2-pm.zk2-go{animation:zk2-cancel .4s cubic-bezier(.25,.9,.35,1.15) both}

/* ── 7 人出の多いイベント：縦長カードを入場券に（下に半券・ミシン目・左右の切り欠き）。人出はパタパタ。触ると半券がもぎれかける */
#z4-root .z5-vc{-webkit-mask:radial-gradient(circle 9px at 0 calc(100% - 132px),#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 9px at 100% calc(100% - 132px),#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .zk2-vperf{position:absolute;left:14px;right:14px;bottom:130px;z-index:2;height:4px;background:radial-gradient(circle 1.7px,rgba(255,255,255,.88) 90%,#0000) 0 0/9px 4px repeat-x;pointer-events:none}
#z4-root .zk2-vperf__t{position:absolute;left:-14px;right:-14px;top:-4px;height:12px;transform:scaleX(0);transform-origin:0 50%;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='M0 8 3 4 6 8 9 4 12 8' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linejoin='round'/%3E%3C/svg%3E") 0 0/12px 12px repeat-x;filter:drop-shadow(0 1px 1px rgba(0,0,0,.45))}
html.zk-m #z4-root .zk2-vperf__t{transition:transform .45s cubic-bezier(.4,0,.2,1)}
html.zk-m:not(.zk2-scr) #z4-root .z5-vc:hover .zk2-vperf__t{transform:scaleX(.62)}
#z4-root .z5-vc__pill{border-radius:5px;padding:4px 27px}
#z4-root .zk2-flap--ppl{gap:5px;font-size:13px;background:#132f63}
#z4-root .zk2-flap--ppl .zk2-fd{font-size:17px;background:linear-gradient(#4078d6 50%,#3468c0 50%)}
#z4-root .zk2-flap--ppl .zk2-fd i{background:#4f86e0}

/* ── 8 新着記事：大きい2本の写真を券に（下の切り欠き・ミシン目）・小さいカードに検札のパンチ穴・日付を券面の印字に。「記事をもっと見る」は券のボタン（押すとパンチ穴が開いてから開く） */
#z4-root .z5-nc--l .z5-nc__img{-webkit-mask:radial-gradient(circle 10px at 0 100%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 10px at 100% 100%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z5-nc--l .z5-nc__img::after{content:"";position:absolute;left:16px;right:16px;bottom:2px;height:4px;z-index:1;background:radial-gradient(circle 1.7px,rgba(255,255,255,.92) 90%,#0000) 0 0/9px 4px repeat-x;pointer-events:none}
#z4-root .z5-nc:not(.z5-nc--l) .z5-nc__img{-webkit-mask:radial-gradient(circle 8px at 0 100%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 8px at 100% 100%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z5-nc__date{align-self:flex-start;padding:1px 7px;border-radius:2px;background:#edf3fb;color:#2a4f8f;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.06em}
#z4-root .z5-btn--o{position:relative;border-radius:6px;padding-right:76px;-webkit-mask:radial-gradient(circle 8px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 8px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z5-btn--o::after{content:"";position:absolute;right:58px;top:9px;bottom:9px;width:3px;background:radial-gradient(circle 1.5px,#94b0dc 90%,#0000) 0 0/3px 7px repeat-y;pointer-events:none}
#z4-root .z5-btn--o .z5-btn__i{position:absolute;right:20px;top:50%;margin-top:-9.5px}
#z4-root .z5-btn--o .z5-btn__i::after{content:"";position:absolute;inset:0;border-radius:50%;background:#fff;box-shadow:inset 1px 1px 3px rgba(19,30,51,.4);transform:scale(0)}
@keyframes zk2-punch{0%{transform:scale(1)}40%{transform:scale(.6)}100%{transform:scale(1)}}
@keyframes zk2-punchhole{0%{transform:scale(0)}45%{transform:scale(0)}70%{transform:scale(1.15)}100%{transform:scale(1)}}
html.zk-m #z4-root .z5-btn--o.zk2-punch .z5-btn__i{animation:zk2-punch .3s ease-out both}
html.zk-m #z4-root .z5-btn--o.zk2-punch .z5-btn__i::after{animation:zk2-punchhole .3s ease-out both}

/* ── 9 テーマ別の記事：スタンプラリーの台紙（左右にミシン目）。3テーマのアイコンをスタンプの枠にして、画面に入ると順にポン */
#z4-root .z5-theme__box{position:relative}
#z4-root .z5-theme__box::before,#z4-root .z5-theme__box::after{content:"";position:absolute;top:22px;bottom:22px;width:3px;background:radial-gradient(circle 1.6px,#c5d3e6 90%,#0000) 0 0/3px 9px repeat-y;pointer-events:none}
#z4-root .z5-theme__box::before{left:12px}
#z4-root .z5-theme__box::after{right:12px}
#z4-root .z5-theme__head{position:relative}
#z4-root .z5-theme__ico{visibility:hidden}
#z4-root .zk2-rally{position:absolute;left:-9px;top:50%;width:54px;height:54px;margin-top:-27px;color:var(--zk2-ink);pointer-events:none}
#z4-root .zk2-rally__f{position:absolute;inset:0;border-radius:50%;border:1.6px dashed #a9bddb}
#z4-root .zk2-rally__s{position:absolute;inset:0;width:100%;height:100%;mix-blend-mode:multiply;opacity:.9;transform:rotate(var(--r))}
@keyframes zk2-rallyp{0%{opacity:0;transform:rotate(var(--r)) scale(.55)}50%{opacity:1;transform:rotate(var(--r)) scale(1.12)}75%{transform:rotate(var(--r)) scale(.96)}100%{opacity:.9;transform:rotate(var(--r)) scale(1)}}
html.zk-io #z4-root .zk2-rally:not(.zk2-go):not(.zk2-done) .zk2-rally__s{opacity:0}
html.zk-m #z4-root .zk2-rally.zk2-go .zk2-rally__s{animation:zk2-rallyp .5s .15s cubic-bezier(.3,1.4,.5,1) both}

/* ── 10 よく読まれている記事：1位の面を券に（写真と面の境にミシン目と上下の切り欠き）。1位は朱の丸判子、2〜9位は青インクの丸い印 */
#z4-root .z5-pop__main{background:transparent}
#z4-root .z5-pop__mbody{position:relative;background:var(--zk2-blue);-webkit-mask:radial-gradient(circle 12px at 0 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 12px at 0 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
#z4-root .z5-pop__mbody::before{content:"";position:absolute;left:1px;top:18px;bottom:18px;width:3px;background:radial-gradient(circle 1.6px,rgba(255,255,255,.8) 90%,#0000) 0 0/3px 8px repeat-y;pointer-events:none}
#z4-root .z5-pop__mimg{-webkit-mask:radial-gradient(circle 12px at 100% 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 12px at 100% 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
#z4-root .z5-rank--l{left:16px;top:16px;width:80px;height:80px;background:rgba(255,255,255,.95);color:var(--zk2-shu);font-family:var(--zk2-stamp);font-size:36px;font-weight:700;transform:rotate(-10deg);
 box-shadow:inset 0 0 0 4px var(--zk2-shu),inset 0 0 0 8px rgba(255,255,255,.95),inset 0 0 0 9.8px var(--zk2-shu),0 2px 8px rgba(19,30,51,.3)}
#z4-root .z5-rank:not(.z5-rank--l){background:rgba(255,255,255,.95);color:var(--zk2-ink);font-variant-numeric:tabular-nums;transform:rotate(-6deg);
 box-shadow:inset 0 0 0 2.2px var(--zk2-ink),inset 0 0 0 4.4px rgba(255,255,255,.95),inset 0 0 0 5.4px var(--zk2-ink),0 1px 4px rgba(19,30,51,.25)}
#z4-root .z5-rank--l::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 3px var(--zk2-shu);opacity:0;pointer-events:none}
@keyframes zk2-thump{0%{opacity:0;transform:translateY(-40px) rotate(-30deg) scale(1.55)}55%{opacity:1;transform:translateY(0) rotate(-10deg) scale(.9)}75%{transform:rotate(-10deg) scale(1.05)}100%{opacity:1;transform:rotate(-10deg) scale(1)}}
@keyframes zk2-inkring{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.55)}}
html.zk-io #z4-root .z5-pop__main:not(.zk2-go):not(.zk2-done) .z5-rank--l{opacity:0}
html.zk-m #z4-root .z5-pop__main.zk2-go .z5-rank--l{animation:zk2-thump .62s .2s cubic-bezier(.2,.8,.3,1.1) both}
html.zk-m #z4-root .z5-pop__main.zk2-go .z5-rank--l::after{animation:zk2-inkring .6s .55s ease-out both}

/* ── 11 早見表・比較表：色のベタのタイルを硬券に（左に色の半券・ミシン目・左右の切り欠き）。数はナンバリングの輪が回って決まる */
#z4-root .z4-db__a{position:relative;padding:0 16px 0 36px;color:#141414;background:linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.9)),var(--c);
 -webkit-mask:radial-gradient(circle 7px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 7px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z4-db__a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:20px;background:radial-gradient(circle 3.6px at 10px 18px,#fff 90%,#0000) no-repeat,var(--c)}
#z4-root .z4-db__a::after{content:"";position:absolute;left:23.5px;top:7px;bottom:7px;width:3px;background:radial-gradient(circle 1.5px,var(--c) 90%,#0000) 0 0/3px 7px repeat-y;opacity:.55}
#z4-root .z4-db__num{position:relative;color:var(--c);font-variant-numeric:tabular-nums;-webkit-text-fill-color:transparent}
#z4-root .z4-db__nm{color:#1b1b1b}
#z4-root .zk2-num{position:absolute;left:0;top:0;bottom:0;display:flex;align-items:center;white-space:nowrap;color:var(--c);-webkit-text-fill-color:var(--c);pointer-events:none}
#z4-root .zk2-dr{position:relative;display:inline-block;width:1ch;height:1.2em;overflow:hidden}
#z4-root .zk2-dr i{position:absolute;left:0;top:0;width:100%;font-style:normal;text-align:center;line-height:1.2em;white-space:pre;transform:translateY(calc(var(--n) * -1.2em))}
#z4-root .zk2-dr i::before{content:"0\A 1\A 2\A 3\A 4\A 5\A 6\A 7\A 8\A 9\A 0\A 1\A 2\A 3\A 4\A 5\A 6\A 7\A 8\A 9"}
@keyframes zk2-roll{from{transform:translateY(calc((var(--n) + 10) * -1.2em))}to{transform:translateY(calc(var(--n) * -1.2em))}}
html.zk-m #z4-root .zk2-num.zk2-go .zk2-dr i{animation:zk2-roll 1.15s calc(var(--d) * 110ms) cubic-bezier(.15,.65,.25,1) both}

/* ── 12 道の駅：スタンプ帳（地方ごとに丸い枠＝地方の形のスタンプ）。画面に入ると北から順に押され、行に触るとその地方の判子がもう一度ポン */
#z4-root .z4-area__row{position:relative}
#z4-root .zk2-rg{position:absolute;left:112px;top:50%;width:46px;height:46px;margin-top:-23px;color:var(--zk2-ink);pointer-events:none}
#z4-root .zk2-rg__f{position:absolute;inset:0;border-radius:50%;border:1.6px dashed #a6bbd9}
#z4-root .zk2-rg__s{position:absolute;inset:0;width:100%;height:100%;mix-blend-mode:multiply;opacity:.88;transform:rotate(var(--r))}
@keyframes zk2-rgp{0%{opacity:0;transform:rotate(var(--r)) scale(.4)}55%{opacity:1;transform:rotate(var(--r)) scale(1.12)}100%{opacity:.88;transform:rotate(var(--r)) scale(1)}}
html.zk-io #z4-root .z4-area__box:not(.zk2-go):not(.zk2-done) .zk2-rg__s{opacity:0}
html.zk-m #z4-root .z4-area__box.zk2-go .zk2-rg__s{animation:zk2-rgp .4s calc(var(--i) * .12s + .25s) cubic-bezier(.3,1.5,.5,1) both}
html.zk-m #z4-root .zk2-rg.zk2-hit .zk2-rg__s{animation:zk2-rgp .36s cubic-bezier(.3,1.6,.5,1) both}

/* ── 13 季節と時期の記事：紅葉の記念スタンプ（画面に入ると、押し付けて左右に揺らす押し方）。写真は記念切符の角（4つの角を丸く欠く） */
#z4-root .z4-feat .z4-in{position:relative}
#z4-root .zk2-feat-st{position:absolute;right:-178px;top:-14px;width:150px;height:150px;pointer-events:none}
#z4-root .zk2-feat-st .zk2-seal{position:absolute;inset:0;width:100%;height:100%;transform:rotate(7deg);opacity:.92}
@keyframes zk2-rock{0%{opacity:0;transform:rotate(-16deg) scale(1.35)}40%{opacity:.95;transform:rotate(12deg) scale(.96)}62%{transform:rotate(3deg) scale(1)}80%{transform:rotate(9deg)}100%{opacity:.92;transform:rotate(7deg)}}
html.zk-io #z4-root .zk2-feat-st:not(.zk2-go):not(.zk2-done) .zk2-seal{opacity:0}
html.zk-m #z4-root .zk2-feat-st.zk2-go .zk2-seal{animation:zk2-rock .8s .15s cubic-bezier(.3,.9,.4,1) both}
#z4-root .z4-feat__img{display:block;-webkit-mask:radial-gradient(circle 9px at 0 0,#0000 94%,#000) 0 0/51% 51% no-repeat,radial-gradient(circle 9px at 100% 0,#0000 94%,#000) 100% 0/51% 51% no-repeat,radial-gradient(circle 9px at 0 100%,#0000 94%,#000) 0 100%/51% 51% no-repeat,radial-gradient(circle 9px at 100% 100%,#0000 94%,#000) 100% 100%/51% 51% no-repeat}
@media (max-width:1259.9px){#z4-root .zk2-feat-st{right:0;top:-34px;width:104px;height:104px}}

/* ── 14・15 一覧から探す／よくある質問：見出しの帯を回数券に（左右の切り欠き・右にミシン目と半券）。＋はパンチ穴。開くとパンチが下りる */
#z4-root .z4-acc__sum{position:relative;padding-right:64px;-webkit-mask:radial-gradient(circle 6px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 6px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z4-acc__sum::after{content:"";position:absolute;right:50px;top:7px;bottom:7px;width:3px;background:radial-gradient(circle 1.5px,#a9bdd9 90%,#0000) 0 0/3px 7px repeat-y;pointer-events:none}
#z4-root .z4-acc__pm{position:absolute;right:13px;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;background:#fff;box-shadow:inset 1px 1px 3px rgba(19,30,51,.28)}
#z4-root .z4-acc__pm::before,#z4-root .z4-acc__pm::after{left:6px;width:14px}
#z4-root .z4-acc__item[open]>.z4-acc__sum .z4-acc__pm{background:var(--zk2-blue);box-shadow:inset 1px 1px 3px rgba(0,0,0,.35)}
#z4-root .z4-acc__item[open]>.z4-acc__sum .z4-acc__pm::before,#z4-root .z4-acc__item[open]>.z4-acc__sum .z4-acc__pm::after{background:#fff}
@keyframes zk2-die{0%{box-shadow:inset 0 0 0 13px #17305c,0 -16px 0 -4px rgba(23,48,92,0)}35%{box-shadow:inset 0 0 0 13px #17305c,0 0 0 0 rgba(23,48,92,.0)}60%{box-shadow:inset 0 0 0 5px #17305c}100%{box-shadow:inset 1px 1px 3px rgba(0,0,0,.35)}}
html.zk-m #z4-root .z4-acc__item[open]>.z4-acc__sum .z4-acc__pm{animation:zk2-die .5s ease-out}
#z4-root .z5-credit__pm{width:18px;height:18px;border-radius:50%;background:#f0f5fb;box-shadow:inset 1px 1px 2px rgba(19,30,51,.25)}
#z4-root .z5-credit__pm::before,#z4-root .z5-credit__pm::after{left:4px;top:8px}

/* ── 16 フッター … 2026-10-02 午後に kami-zk.css（全ページ共通）へ移した */

/* ── スマホ（本番の切り替え 767.9px にそろえる） */
@media (max-width:767.9px){
 #z4-root .zk2-h{font-size:22px;gap:12px;letter-spacing:.02em}
 #z4-root .zk2-ht{width:52px;height:34px}
 #z4-root .zk2-ht__b{background:radial-gradient(circle 1.4px,rgba(255,255,255,.95) 90%,#0000) 36px 3px/3px 6px repeat-y,linear-gradient(90deg,#0000 37.5px,rgba(8,30,90,.17) 37.5px),linear-gradient(135deg,#2d69d0,#2bcccc);
  -webkit-mask:radial-gradient(circle 5px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 5px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
 #z4-root .zk2-ht--w .zk2-ht__b{background:radial-gradient(circle 1.4px,#93aedb 90%,#0000) 36px 3px/3px 6px repeat-y,linear-gradient(90deg,#0000 37.5px,#e6eefa 37.5px),#fff}
 #z4-root .zk2-ht__i{left:9px;width:20px;height:20px;margin-top:-10px}
 #z4-root .zk2-ht__cut,#z4-root .zk2-ht__chip{left:21px;width:11px;height:8px}
 /* 注目：大きいカードだけ右に半券。小さい2枚は写真の左上にパタパタの板（1行） */
 #z4-root .z4-pc--l{--zk2-stub:108px}
 #z4-root .z4-pc--l .z4-pc__txt{min-height:126px;padding-right:calc(var(--zk2-stub) + 12px)}
 #z4-root .z4-pc--l .z4-pc__left{left:auto;top:auto;right:0;bottom:0;width:var(--zk2-stub);height:126px;padding:0;border-radius:0;
  -webkit-mask:radial-gradient(circle 10px at 100% 0,#0000 94%,#000) 100% 0/51% 100% no-repeat,radial-gradient(circle 8px at 0 100%,#0000 94%,#000) 0 0/51% 100% no-repeat}
 #z4-root .z4-pc--l .zk2-flap{flex-direction:column;gap:4px;border-radius:0;color:#24426f;background:radial-gradient(circle 1.5px,#a6bad6 90%,#0000) 0 5px/3px 7px repeat-y,#f2f6fc}
 #z4-root .z4-pc--l .zk2-flap__h{display:block;position:absolute;left:50%;top:11px;width:11px;height:11px;margin-left:-5.5px;border-radius:50%;background:#fff;box-shadow:inset 1px 1px 2px rgba(19,30,51,.32)}
 #z4-root .z4-pc--l .zk2-flap__w{margin-top:14px;font-size:12px;letter-spacing:.14em;color:#4b6086}
 #z4-root .z4-pc--l .zk2-flap__row{gap:3px;align-items:flex-end}
 #z4-root .z4-pc--l .zk2-fd{font-size:28px}
 #z4-root .z4-pc--l .zk2-flap__u{font-size:14px;margin-bottom:2px;color:#24426f}
 #z4-root .z4-pc--m .z4-pc__left{padding:2px 14px}
 #z4-root .z4-pc--m .zk2-flap{font-size:12px}
 #z4-root .z4-pc--m .zk2-fd{font-size:15px}
 #z4-root .zk2-seal--pick{right:calc(var(--zk2-stub) - 14px);bottom:44px;width:62px;height:62px}
 #z4-root .z4-pr::before{-webkit-mask:radial-gradient(circle 5.5px at 102px 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 5.5px at 102px 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
 #z4-root .z4-pr::after{left:92.5px}
 /* カルーセルの点（SPは細い棒だったので小さめの硬券） */
 #z4-root .z4-dot::before{width:18px;height:10px;-webkit-mask:radial-gradient(circle 2.5px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 2.5px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
 #z4-root .z4-dot::after{width:5px;height:5px;margin:-2.5px 0 0 -2.5px}
 #z4-root .z4-slide__img{-webkit-mask:radial-gradient(circle 7px at 100% 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 7px at 100% 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
 #z4-root .z4-slide__txt{-webkit-mask:radial-gradient(circle 7px at 0 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 7px at 0 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
 #z4-root .z4-slide__txt::before{top:10px;bottom:10px}
 /* テーマの札（SP 190幅・中の余白8） */
 #z4-root .z4-gb{-webkit-mask:radial-gradient(circle 5px at 45px 0,#0000 94%,#000) 0 0/100% 51% no-repeat,radial-gradient(circle 5px at 45px 100%,#0000 94%,#000) 0 100%/100% 51% no-repeat}
 #z4-root .z4-gb__in::before{left:41.5px}
 #z4-root .z4-gb::before{left:13px}
 #z4-root .z4-gb::after{left:27px}
 /* 日程：白い半券は券面の右上に小さく */
 #z4-root .zk2-evstub{left:auto;right:0;top:58px;bottom:auto;width:80px;height:80px;border-radius:4px;
  -webkit-mask:radial-gradient(circle 6px at 0 50%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 6px at 100% 50%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
 #z4-root .zk2-evstub::after{display:none}
 #z4-root .zk2-seal--ev{width:64px;height:64px;margin:-32px 0 0 -32px}
 #z4-root .z5-ev__card{position:relative}
 #z4-root .z5-ev__name,#z4-root .z5-ev__tag{margin-right:92px}
 #z4-root .z5-find__box:first-child .z5-find__list{gap:10px 6px}
 #z4-root .z5-find__box:first-child .z5-chip{width:52px;height:52px;font-size:14px}
 /* 開催が近い順（SPのカード：余白12・写真115） */
 #z4-root .z5-tc::before,#z4-root .z5-tc::after{left:126px;width:14px;height:14px}
 #z4-root .z5-tc::before{top:-7px}
 #z4-root .z5-tc::after{bottom:-7px}
 #z4-root .z5-tc__body::before{left:-7.5px}
 #z4-root .z5-tc__badge{left:71%}
 #z4-root .zk2-pm{left:98px;top:-4px;width:54px;height:54px}
 /* 人出（SPのカードは幅61.5vw） */
 #z4-root .z5-vc{-webkit-mask:radial-gradient(circle 8px at 0 calc(100% - 118px),#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 8px at 100% calc(100% - 118px),#0000 94%,#000) 100% 0/51% 100% no-repeat}
 #z4-root .zk2-vperf{left:12px;right:12px;bottom:116px}
 #z4-root .z5-vc__pill{padding:2px 22px}
 /* 新着 */
 #z4-root .z5-nc--l .z5-nc__img,#z4-root .z5-nc:first-child .z5-nc__img{-webkit-mask:radial-gradient(circle 8px at 0 100%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 8px at 100% 100%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
 /* テーマ別 */
 #z4-root .z5-theme__box::before{left:5px}
 #z4-root .z5-theme__box::after{right:5px}
 #z4-root .zk2-rally{left:-8px;width:44px;height:44px;margin-top:-22px}
 /* よく読まれている（SPは写真が上・面が下） */
 #z4-root .z5-pop__mimg{-webkit-mask:radial-gradient(circle 10px at 0 100%,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 10px at 100% 100%,#0000 94%,#000) 100% 0/51% 100% no-repeat}
 #z4-root .z5-pop__mbody{-webkit-mask:radial-gradient(circle 10px at 0 0,#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 10px at 100% 0,#0000 94%,#000) 100% 0/51% 100% no-repeat}
 #z4-root .z5-pop__mbody::before{left:16px;right:16px;top:1px;bottom:auto;width:auto;height:3px;background:radial-gradient(circle 1.5px,rgba(255,255,255,.8) 90%,#0000) 0 0/8px 3px repeat-x}
 #z4-root .z5-rank--l{left:10px;top:10px;width:58px;height:58px;font-size:26px;box-shadow:inset 0 0 0 3px var(--zk2-shu),inset 0 0 0 6px rgba(255,255,255,.95),inset 0 0 0 7.4px var(--zk2-shu),0 2px 6px rgba(19,30,51,.3)}
 /* 早見表（SP 190幅・高さ64） */
 #z4-root .z4-db__a{padding:0 10px 0 30px}
 #z4-root .z4-db__a::before{width:16px}
 #z4-root .z4-db__a::after{left:19px}
 /* 道の駅：スタンプは行の左に（行の左の余白を広げて場所を取る） */
 #z4-root .z4-area__row{padding-left:54px}
 #z4-root .zk2-rg{left:8px;top:8px;margin-top:0;width:38px;height:38px}
 /* 季節 */
 #z4-root .zk2-feat-st{right:8px;top:-22px;width:76px;height:76px}
 /* 一覧・質問 */
 #z4-root .z4-acc__sum{padding-right:56px}
 #z4-root .z4-acc__sum::after{right:44px}
 #z4-root .z4-acc__pm{right:10px;width:24px;height:24px;margin-top:-12px}
 #z4-root .z4-acc__pm::before,#z4-root .z4-acc__pm::after{left:5px}
}
/* フッターのスマホ（max-width:680px）も 2026-10-02 午後に kami-zk.css へ移した */

/* ── 2026-10-04 人出の多いイベント：写真を横長（3:2）にしてカードの上に置き、文は写真の下の半券へ移す
   （藤井さん「縦画像になるのは基本NG」→ 選択式で「写真だけ横長にする」）。カードの幅・入場券の形（左右の切り欠き・ミシン目）・
   人出のパタパタ・横に送る並びは今のまま。半券の高さ（PC140px・スマホ126px）に切り欠きとミシン目の位置をそろえる */
#z4-root .z5-vc{display:flex;flex-direction:column;aspect-ratio:auto;background:#132f63;
 -webkit-mask:radial-gradient(circle 9px at 0 calc(100% - 140px),#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 9px at 100% calc(100% - 140px),#0000 94%,#000) 100% 0/51% 100% no-repeat}
#z4-root .z5-vc::after{display:none}
#z4-root .z5-vc__img{position:relative;inset:auto;flex:none;aspect-ratio:3/2;overflow:hidden}
#z4-root .z5-vc__txt{position:relative;left:auto;right:auto;bottom:auto;flex:none;box-sizing:border-box;height:140px;justify-content:center;padding:14px 16px 16px}
#z4-root .z5-vc__ttl{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-shadow:none}
#z4-root .zk2-vperf{bottom:138px}
@media (max-width:767.9px){
 #z4-root .z5-vc{-webkit-mask:radial-gradient(circle 8px at 0 calc(100% - 126px),#0000 94%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 8px at 100% calc(100% - 126px),#0000 94%,#000) 100% 0/51% 100% no-repeat}
 #z4-root .z5-vc__txt{height:126px;padding:12px 12px 12px}
 #z4-root .zk2-vperf{bottom:124px}
}