/* 恋みくじ：見た目は部品の画像（art/parts → /img/*.webp）で組む。CSSで似せた枠・ボタンは使わない。
   日本語のWebフォントは使わない（端末の明朝・ゴシック）。 */
:root{
  --red:#b3122a; --red2:#d81f3b; --gold:#c9962e; --navy:#1d2452; --ink:#3a1f22; --cream:#fff8ec;
  --mincho:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP","MS PMincho",serif;
  --gothic:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Noto Sans JP",Meiryo,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;color:#2a1214;font-family:var(--gothic);font-size:16px;line-height:1.75;
  background:#fbf1e6 url(/img/bg_pattern.webp) repeat;background-size:420px auto;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
/* 左右の縁の桜と赤い糸（同じ絵を右は左右反転） */
body{position:relative;isolation:isolate}
.km-bgdeco{position:absolute;inset:0;pointer-events:none;z-index:-1}
.km-bgdeco::before,.km-bgdeco::after{content:"";position:absolute;top:120px;bottom:0;width:44px;
  background:url(/img/side_l.webp) left top/44px auto repeat-y}
.km-bgdeco::before{left:0}
.km-bgdeco::after{right:0;transform:scaleX(-1)}
.km-main,.km-foot{position:relative;z-index:1}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- ヘッダー（桜雲の背景＋ロゴ＋副題の帯） ---- */
.km-head{position:relative;z-index:2;text-align:center;padding:6px 10px 4px;
  background:url(/img/bg_header.webp) center top/cover no-repeat}
.km-h1{margin:0;font-size:inherit}
.km-logo{display:inline-block}
.km-logo-img{width:min(300px,78vw);margin:0 auto}
.km-sub{display:inline-flex;align-items:center;gap:8px;margin:-6px auto 0;padding:9px 6px 5px;line-height:26px;max-width:calc(100vw - 16px);gap:5px;
  font-family:var(--gothic);font-weight:800;font-size:clamp(13px,3.75vw,17px);color:#fff;letter-spacing:0;
  border-style:solid;border-width:0 34px;border-image:url(/img/midashi_mid.webp) 0 112 fill / 0 34px round;
  -webkit-text-stroke:3px rgb(80,0,10);paint-order:stroke fill;white-space:nowrap}
.km-sub i{width:2px;height:15px;background:#f3d79a}
.km-nav{display:none}
.km-menu-btn{position:absolute;right:6px;top:8px;width:auto;height:36px;padding:0;color:#fff;font-family:var(--gothic);font-weight:800;font-size:13.5px;-webkit-text-stroke:3px #6b0a18;paint-order:stroke fill;
  border-style:solid;border-width:0 16px;border-image:url(/img/btn_small.webp) 0 80 fill / 0 16px round;background:none;display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center}
.km-menu-btn i{display:none}

.km-main{max-width:1180px;margin:0 auto;padding:0 10px 20px;position:relative}

/* ---- 主役：女の子＋今日の恋みくじを引く ---- */
/* 枠（中くり抜き hero_frame_sp 1496x953）・中の背景（hero_bg）・ボタンの台（hero_dai）をチャッピーの部品で重ねる。枠は縦横比そのまま（伸ばさない） */
.km-hero{position:relative;z-index:6;display:flex;align-items:flex-end;aspect-ratio:1496/953;height:auto;margin:4px -4px 0;padding:0 4% 3.5%;
  background:url(/img/hero_bg.webp) center/cover no-repeat;background-clip:content-box;background-origin:border-box}
.km-hero::before{content:"";position:absolute;inset:1.6% 1.4%;z-index:0;background:url(/img/hero_bg.webp) center/cover no-repeat}
.km-hero::after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:url(/img/hero_frame_sp.webp) center/100% 100% no-repeat}
.km-hero{background:none}
/* 中の背景の四角い切れ目が枠からのぞいて目立つ→端をぼかしてまわりの背景になじませる */
.km-hero::before{-webkit-mask:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent);
  -webkit-mask-composite:source-in;mask:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent);mask-composite:intersect}
.km-hero-girl{width:44%;position:relative;z-index:7}
.km-hero-img{width:100%;max-width:230px;margin:0 0 -4px -2px}
.km-hero-act{flex:1;position:relative;z-index:8;padding-bottom:9%}
.km-btn-big{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;width:100%;max-width:222px;height:86px;margin-left:auto;
  text-align:center;color:#fff;font-family:var(--mincho);font-weight:800;font-size:15px;line-height:1.2;padding:0 0 22px;
  border-style:solid;border-width:0 45px;border-image:url(/img/btn_red.webp) 0 88 fill / 0 45px round;touch-action:manipulation}
.km-btn-big:active{border-image-source:url(/img/btn_red_on.webp)}
.km-btn-big-t{display:block;margin:0 -8px;white-space:nowrap}
.km-btn-big-t span{font-size:1.12em}
.km-btn-big b{font-size:1.05em;margin-left:1px}
.km-pill{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);width:auto;min-width:64%;white-space:nowrap;line-height:19px;padding-top:4px;
  font-family:var(--gothic);font-size:13px;font-weight:700;color:#5b2a14;-webkit-text-stroke:0;
  border-style:solid;border-width:0 14px;border-image:url(/img/mokuji.webp) 0 90 fill / 0 14px round}
.km-hero-ito{display:none}

/* ---- 今の季節 ---- */
.km-season{margin:4px 0 0}
.km-season-card{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;
  height:88px;padding:0 46px 0 76px;color:#fff;text-align:center;overflow:hidden;
  border-style:solid;border-width:9px;border-image:url(/img/cardbg_season.webp) 46 fill / 9px round}
.km-season-label{font-size:13px;line-height:19px;font-family:var(--gothic);font-weight:700;color:#5b2a14;padding:0 4px;
  border-style:solid;border-width:0 14px;border-image:url(/img/mokuji.webp) 0 90 fill / 0 14px round}
.km-season-name{font-family:var(--mincho);font-weight:800;font-size:23px;line-height:1.25;white-space:nowrap;-webkit-text-stroke:3px rgb(0,0,30);paint-order:stroke fill}
.km-season-name br{display:none}
.km-season-name.long{font-size:19px}
.km-season-art{position:absolute;left:0;top:0;width:66px;height:66px;max-width:none;object-fit:cover;z-index:-1}
.km-season-card{isolation:isolate}
.km-arrow{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:32px}

/* ---- 見出し（赤い帯） ---- */
.km-sec{margin-top:8px}
.km-h2{text-align:center;margin:0 0 4px;font-size:inherit;line-height:1}
.km-h2 span{display:inline-block;padding:2px 12px 6px;line-height:30px;color:#fff;font-family:var(--mincho);font-weight:800;font-size:21px;
  border-style:solid;border-width:0 44px;border-image:url(/img/ribbon_thin.webp) 0 205 fill / 0 44px round;
  -webkit-text-stroke:3px rgb(80,0,10);paint-order:stroke fill;white-space:nowrap}

/* ---- 種類のカード（縦1列：女の子・名前・説明・引く） ---- */
.km-kinds{display:grid;grid-template-columns:1fr;gap:7px;padding:0 6px}
.km-kind{position:relative;display:flex;align-items:center;gap:4px;height:90px;padding:0 6px 0 31%;color:#fff;
  border-style:solid;border-width:7px;border-image:url(/img/cardbg_red.webp) 30 fill / 7px round;overflow:hidden}
.km-kind.c-pink{border-image-source:url(/img/cardbg_pink.webp)}
.km-kind.c-coral{border-image-source:url(/img/cardbg_coral.webp)}
.km-kind.c-purple{border-image-source:url(/img/cardbg_purple.webp)}
.km-kind.c-blue{border-image-source:url(/img/cardbg_blue.webp)}
.km-kind.c-gold{border-image-source:url(/img/cardbg_gold.webp)}
.km-kind-girl{position:absolute;left:-6px;bottom:-26px;width:33%;max-width:none}
.km-kind-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.km-kind-t{font-family:var(--mincho);font-weight:800;font-size:clamp(15px,4.8vw,20px);line-height:1.2;letter-spacing:0;-webkit-text-stroke:3px rgb(60,0,20);paint-order:stroke fill;white-space:nowrap}
.km-kind-t em{display:none!important;display:inline-block;font-style:normal;font-family:var(--gothic);font-size:10.5px;line-height:18px;font-weight:700;color:#5b2a14;-webkit-text-stroke:0;margin-left:4px;vertical-align:3px;padding:0 2px;border-style:solid;border-width:0 10px;border-image:url(/img/mokuji.webp) 0 90 fill / 0 10px round}
.km-kind-d{font-size:13.5px;line-height:1.4;font-weight:700;-webkit-text-stroke:3px rgb(40,0,10);paint-order:stroke fill;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.km-kind-go{flex:none;width:80px;height:44px;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-family:var(--gothic);font-weight:800;font-size:17px;
  border-style:solid;border-width:0 20px;border-image:url(/img/btn_small.webp) 0 80 fill / 0 20px round;-webkit-text-stroke:3px rgb(80,0,10);paint-order:stroke fill}
.km-more{justify-content:flex-start;gap:12px;height:76px;padding:0 14px;color:var(--red);border-image:url(/img/cardbg_more.webp) 60 90 fill / 10px 24px round;border-width:10px 24px}
.km-more,.km-more *{-webkit-text-stroke:0!important}
.km-more b{font-family:var(--mincho);font-size:18px}
.km-more small{font-size:13.5px;color:#5a2a20;font-weight:700}
.km-more-plus{width:40px;flex:none}

/* ---- 記録と読み物 ---- */
.km-cal-wrap{position:relative;display:flex;gap:4px;align-items:center;padding:0 8px}
.km-cal{background:#fffaf2;background-clip:padding-box;flex:0 0 66%;font-size:13.5px;line-height:1.3;padding:0 2px;
  border-style:solid;border-width:6px;border-image:url(/img/card_white.webp) 40 / 6px round}
.km-cal-head{display:flex;justify-content:center;gap:24px;align-items:center;font-weight:700;font-size:14px}
.km-cal-head button{border:0;background:none;font-size:13px;line-height:1;color:var(--ink);padding:0 4px}
.km-cal table{width:100%;border-collapse:collapse;text-align:center}
.km-cal th{font-weight:500;color:#7a5a50;background:#fbeee4;border:1px solid #f0dccd}
.km-cal th.sun{color:var(--red)} .km-cal th.sat{color:#2a53b3}
.km-cal td{height:24px;border:1px solid #f0dccd;position:relative;background:#fffdf9}
.km-cal td.on{color:#fff;font-weight:700}
.km-cal td.on::before{content:"";position:absolute;inset:1px 3px;background:url(/img/heart_red.webp) center/contain no-repeat;z-index:-1}
.km-cal tbody{position:relative;z-index:0}
/* 引いた日のハート：重ね（::before z-index:-1）はiPhoneのSafariで白い地の後ろに隠れる→マスの背景そのものに描く */
.km-cal td.on{background:url(/img/heart_red.webp) center/auto 92% no-repeat}
.km-cal td.on::before{content:none}
.km-cal-side{flex:1;position:relative;text-align:center}
.km-fuki{margin:0 0 -6px;padding:6px 4px 10px;font-size:13px;line-height:1.4;color:var(--red);font-weight:700;
  border-style:solid;border-width:14px 18px 18px;border-image:url(/img/fukidashi.webp) 80 110 110 fill / 14px 18px 18px round}
.km-cal-girl{width:82px;margin:0 0 0 auto}
@media (max-width:899px){.km-cal-girl{margin:0 auto}}  /* スマホは吹き出しの真下（右の飾り枠にかからない） */
.km-arts{display:grid;grid-template-columns:1fr;gap:6px;padding:0 6px}
.km-art{background:#fffaf2;background-clip:padding-box;display:flex;align-items:center;gap:12px;height:76px;padding:0;font-family:var(--mincho);font-weight:800;font-size:17px;line-height:1.35;
  border-style:solid;border-width:5px;border-image:url(/img/card_white.webp) 40 / 5px round;overflow:hidden}
.km-art-img{width:62px;height:62px;flex:none}
.km-art span{white-space:nowrap}
.km-art br{display:none}
.km-art b{color:var(--red);margin-left:1px}

/* ---- フッター ---- */
.km-foot{margin-top:10px;padding:26px 10px 14px;text-align:center;color:#fff3dc;font-size:13.5px;
  background:#16204a url(/img/bg_footer.webp) center top/cover no-repeat}
.km-foot nav{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 0;width:max-content;max-width:100%;margin:0 auto;padding:6px 8px;
  border-style:solid;border-width:10px;border-image:url(/img/card_white.webp) 40 / 10px round;background:#fffaf2;background-clip:padding-box}
.km-foot nav a{padding:2px 10px;color:#7a1020;font-weight:800;font-size:14px;border-left:1px solid #e4c48c}
.km-foot nav a:first-child{border-left:0}
.km-copy{display:inline-block;margin:8px 0 0;padding:2px 14px;font-size:13px;font-weight:700;color:#7a1020;background:#fffaf2}
.km-totop{position:fixed;right:10px;bottom:14px;width:44px;height:44px;font-size:0;background:url(/img/btn_arrow.webp) center/contain no-repeat;transform:rotate(-90deg);opacity:0;pointer-events:none;transition:opacity .3s;z-index:20}
.km-totop.on{opacity:1;pointer-events:auto}
.km-petals{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:15}

/* ---- PC ---- */
@media (min-width:900px){
  body{font-size:16px;background-repeat:repeat}
  .km-head{display:grid;grid-template-columns:auto 1fr;align-items:start;text-align:left;padding:10px max(24px,calc(50% - 600px)) 6px;
    background:url(/img/bg_header.webp) center top/cover no-repeat}
  .km-bgdeco{background:none}
  /* ヘッダーと本文の境目の飾り（チャッピーの桜と金の雲の帯） */
  .km-head{position:relative;padding-bottom:14px!important}
  .km-head::after{content:"";position:absolute;left:50%;transform:translate(-50%,50%);bottom:0;width:min(1100px,94%);aspect-ratio:2093/108;height:auto;z-index:3;pointer-events:none;
    background:url(/img/hline.webp) center/contain no-repeat}
  .km-main{margin-top:20px}
  /* これから増えます：横長の札（伸ばさない＝縦横比そのまま） */
  .km-more{border:0!important;border-image:none!important;background:url(/img/fuda_wide.webp) center/100% 100% no-repeat;
    aspect-ratio:2068/262;height:auto!important;max-width:900px;margin:4px auto 0;width:100%}
  .km-bgdeco::before,.km-bgdeco::after{top:-300px;width:70px;background-size:70px auto}
  .km-logo-img{width:340px}
  .km-sub{grid-column:1;font-size:22px;margin-top:-8px;line-height:34px;padding:12px 10px 8px;border-width:0 50px;border-image-width:0 50px}
  .km-sub i{height:20px}
  .km-nav{display:flex;background:#fffaf2;background-clip:padding-box;grid-column:2;grid-row:1;justify-self:end;margin-top:6px;padding:8px 18px;
    border-style:solid;border-width:14px;border-image:url(/img/card_white.webp) 50 / 14px round}
  .km-nav a{display:flex;align-items:center;gap:6px;padding:2px 14px;white-space:nowrap;font-family:var(--mincho);font-weight:800;color:var(--red);border-left:1px solid #e8cdb0}
  .km-nav a:first-child{border-left:0}
  .km-nav-ic{width:28px}
  .km-main{display:grid;grid-template-columns:1fr 410px;gap:6px 26px;padding:0 24px 24px}
  .km-hero{grid-column:1;height:auto;margin:0;padding:0 4% 3%;align-items:flex-end}
  .km-hero-act{padding-bottom:10%}
  .km-hero-girl{width:auto;flex:0 0 360px}
  .km-hero-img{width:360px;max-width:none;margin:0 0 -10px 0}
  .km-more{padding:0!important;border-image-repeat:round}
  .km-hero-act{display:flex;justify-content:center;padding-right:3%}
  .km-hero-act::before{display:none}
  .km-hero-act{min-width:0}
  .km-btn-big{font-size:25px;width:100%;max-width:300px;height:146px;margin:0;padding-bottom:34px;border-width:0 58px;border-image-width:0 58px}
  .km-btn-big-t{margin:0 -16px}
  .km-pill{font-size:16px;bottom:18px;padding-top:3px;line-height:23px}
  .km-hero-ito{width:110px;right:30%;top:0}
  .km-season{grid-column:2;grid-row:1;align-self:center;margin:0}
  .km-season-card{height:230px;padding:30px 16px 16px 120px;border-width:18px;border-image-width:18px}
  .km-season-label{position:absolute;top:2px;left:50%;transform:translateX(-50%);font-size:14px;line-height:24px;padding:2px 24px 0;white-space:nowrap}
  .km-season-name{font-size:24px;white-space:nowrap}
  .km-season-name.long{font-size:17px}
  .km-season-card{padding-left:160px!important;padding-right:62px!important}
  .km-kind-t{font-size:19px!important}
  .km-kind-go{width:68px;font-size:15px}
  .km-kind{-webkit-text-stroke:3px rgb(60,0,20);paint-order:stroke fill}
  .km-season-name br{display:inline}
  .km-season-card{padding:34px 54px 10px 150px}
  .km-season-art{width:140px;height:140px;top:auto;bottom:10px;left:6px}
  .km-arrow{width:40px}
  .km-sec{grid-column:1/-1;margin-top:4px}
  .km-h2 span{font-size:27px;line-height:38px;padding:3px 20px 7px;border-width:0 56px;border-image-width:0 56px}
  .km-kinds{grid-template-columns:1fr 1fr 1fr;gap:12px;padding:0}
  .km-kind{height:112px;padding-left:34%}
  .km-kind-t{font-size:22px}
  .km-kind-d{font-size:13px}
  .km-more{grid-column:1/-1;height:84px;justify-content:center;text-align:center;border-width:12px 40px;border-image-width:12px 40px}
  .km-more>span{flex:none}
  .km-more b{font-size:22px}
  .km-more small{font-size:15px}
  .km-row2{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.25fr;gap:24px}
  .km-row2 .km-sec{grid-column:auto}
  .km-about{grid-column:1/-1}  /* 恋みくじについて＝PCでも横幅いっぱい */
  .km-top-share{grid-column:1;margin:4px 0 0}  /* トップの共有ボタン＝女の子の画像のすぐ下 */
  .km-cal-wrap{padding:0}
  .km-cal{font-size:12px} .km-cal-head{font-size:13px} .km-cal td{height:20px}
  .km-fuki{font-size:12px;padding:12px 10px 18px}
  .km-cal-girl{width:120px}
  .km-arts{gap:8px;grid-template-columns:1fr 1fr 1fr;padding:0}
  .km-art br{display:inline}
  .km-art{font-size:16px}
  .km-art-img{width:88px;height:88px}
  .km-art{height:100px;font-size:15px;border-width:7px;border-image-width:7px;gap:6px}
  .km-art-img{width:48%}
}
@media (prefers-reduced-motion:reduce){.km-petals{display:none}}

/* ===== 引くページ ===== */
.km-crumb{font-size:12px;color:#7a4a40;margin:4px 0 2px;display:flex;gap:6px}
.km-crumb a{color:var(--red);font-weight:700}
.km-ttl span{font-size:17px;line-height:25px;padding:0 14px 3px}
.km-lead{text-align:center;font-size:12.5px;margin:2px 0 6px;color:#5a3530}
.km-draw{position:relative;min-height:300px}
.km-stage[hidden]{display:none!important}
.km-st-start{display:flex;flex-direction:column;align-items:center;gap:6px;padding:6px 0 10px}
.km-st-girl{width:210px}
.km-st-btn{max-width:270px;height:86px;background:none;cursor:pointer;font-size:19px;padding:4px 0 0;margin:0 auto!important}
.km-st-btn.has-pill{height:104px;padding:0 0 40px}
.km-st-btn .km-pill{bottom:14px}
/* 筒をふる */
.km-st-pick{position:relative;text-align:center;padding:6px 0 18px}
.km-tsutsu{width:150px;margin:0 auto;transform-origin:50% 80%}
.is-shake .km-tsutsu{animation:kmShake .18s ease-in-out 5 alternate}
@keyframes kmShake{from{transform:rotate(-14deg) translateY(0)}to{transform:rotate(14deg) translateY(-6px)}}
.km-pick-msg{margin:4px 0 6px;font-family:var(--mincho);font-weight:800;color:var(--red);font-size:16px;opacity:0;transition:opacity .5s .3s}
.is-fan .km-pick-msg{opacity:1}
.km-slips{position:relative;height:190px;max-width:420px;margin:0 auto}
.km-slip{position:absolute;left:50%;bottom:0;width:15%;max-width:62px;padding:0;border:0;background:none;cursor:pointer;
  transform:translate(-50%,40px) scale(.4);opacity:0;transition:transform .7s cubic-bezier(.2,1.3,.4,1),opacity .4s,filter .3s;touch-action:manipulation}
.km-slip img{width:100%;filter:drop-shadow(0 4px 6px rgba(80,0,20,.35))}
.is-fan .km-slip{opacity:1}
.is-fan .km-slip[data-slip="0"]{transform:translate(-300%,0) rotate(-22deg)}
.is-fan .km-slip[data-slip="1"]{transform:translate(-200%,-18px) rotate(-13deg)}
.is-fan .km-slip[data-slip="2"]{transform:translate(-100%,-28px) rotate(-4deg)}
.is-fan .km-slip[data-slip="3"]{transform:translate(0%,-28px) rotate(4deg)}
.is-fan .km-slip[data-slip="4"]{transform:translate(100%,-18px) rotate(13deg)}
.is-fan .km-slip[data-slip="5"]{transform:translate(200%,0) rotate(22deg)}
.is-fan .km-slip:hover{filter:brightness(1.08)}
.is-chosen .km-slip{opacity:0;transform:translate(-50%,60px) scale(.6)!important}
.is-chosen .km-slip.on{opacity:1;transform:translate(-50%,-70px) scale(1.5)!important;filter:drop-shadow(0 0 18px #ffd86b) drop-shadow(0 0 30px #fff3c0)}
/* 結果の巻物 */
.km-st-res{position:relative;padding:0 0 10px;overflow-x:clip}
@keyframes kmOpen{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
.km-sc-kind{display:inline-block;margin:0 0 2px;padding:0 10px;font-family:var(--mincho);font-weight:800;color:#fff;font-size:15px;line-height:23px;
  border-style:solid;border-width:0 22px;border-image:url(/img/midashi_mid.webp) 0 112 fill / 0 22px round}
.km-rank img{width:70%;margin:2px auto 0}
.km-rank-sub{display:inline-block;white-space:nowrap;margin:-2px 0 2px;padding:0 4px;font-family:var(--mincho);font-weight:800;font-size:13.5px;color:#6b3a10;line-height:22px;
  border-style:solid;border-width:0 26px;border-image:url(/img/mokuji.webp) 0 90 fill / 0 26px round}
.km-sc-mizu{width:52%;margin:0 auto 4px}
.km-items{margin:0;text-align:left}
.km-item{display:grid;grid-template-columns:34px 1fr;gap:0 6px;padding:4px 0;border-bottom:1px dashed #ecd3c0}
.km-item:last-child{border-bottom:0}
.km-item dt{grid-row:1/3;display:contents}
.km-item dt img{grid-row:1/3;width:34px;height:34px}
.km-item dt{font-family:var(--mincho);font-weight:800;color:#c0182e;font-size:16px;line-height:1.3}
.km-item dd{margin:0;font-size:14px;line-height:1.6;color:#2a1214;font-weight:500}
.km-res-girl{position:absolute;left:-16px;top:300px;width:24%;max-width:170px;z-index:3}
.km-res-tsutsu{display:none;position:absolute;right:-14px;top:520px;width:20%;max-width:110px;z-index:3;transform:rotate(14deg)}
.km-arrows{display:none}
.rk-daikyo .km-arrows{display:block;position:absolute;inset:40px 0 auto;height:420px;z-index:1;pointer-events:none}
.km-arrows img{position:absolute;width:24%;bottom:0;animation:kmUp 2.4s ease-in-out infinite}
.km-arrows img:first-child{left:2%}.km-arrows img:last-child{right:2%;animation-delay:.6s}
@keyframes kmUp{0%{transform:translateY(30px);opacity:0}30%{opacity:1}100%{transform:translateY(-60px);opacity:0}}
.km-goko{position:absolute;left:50%;top:40px;width:120%;aspect-ratio:1;transform:translateX(-36%);z-index:1;pointer-events:none;opacity:0;
  background:url(/img/goko.webp) center/contain no-repeat}
.rk-daikichi .km-goko,.rk-daidai .km-goko,.rk-koi .km-goko,.rk-kiseki .km-goko{opacity:.9;animation:kmSpin 24s linear infinite}
.rk-daidai .km-goko{filter:saturate(0) brightness(1.15)}
.rk-koi .km-goko{filter:hue-rotate(-25deg) saturate(1.6)}
.rk-kiseki .km-goko{filter:hue-rotate(0deg) saturate(2);animation:kmSpin 24s linear infinite,kmRain 6s linear infinite}
@keyframes kmSpin{to{transform:translateX(-36%) rotate(360deg)}}
@keyframes kmRain{to{filter:hue-rotate(360deg) saturate(2)}}
.km-rare{position:absolute;right:-2px;top:70px;width:88px;z-index:4;text-align:center}
.km-rare span{position:absolute;left:0;right:0;top:20%;font-family:var(--gothic);font-weight:800;color:var(--red);font-size:12.5px;line-height:1.2}
.km-bonus{position:relative;z-index:3;margin:14px 0 8px;padding:6px 4px 2px;text-align:center;font-size:14.5px;
  background:#fffaf3 padding-box;border-style:solid;border-width:30px 28px;border-image:url(/img/card_gold.webp) 66 62 / 30px 28px round}
.km-bonus .km-h2{margin-top:-30px}
.km-bonus .km-h2 span{font-size:14px}
.km-lucky{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:10px 0 8px}
.km-lk{display:flex;flex-direction:column;justify-content:center;text-align:center;padding:4px 0 0;font-size:14px;line-height:1.35;height:112px;
  border-style:solid;border-width:30px 14px 14px;border-image:url(/img/lucky_frame.webp) 110 60 60 fill / 30px 14px 14px round}
.km-lk b{display:block;font-family:var(--gothic);color:#6b3a10;font-size:12px;letter-spacing:-.02em;white-space:nowrap;margin-bottom:2px}
.km-lk p{margin:4px 0 0;font-family:var(--mincho);font-weight:800;color:#3a1f22}
.km-hearts{font-style:normal;color:#e0244a;font-size:13px;letter-spacing:-1px}
.km-rare em{font-style:normal;font-size:17px;color:#c0182e}
.km-res-btns{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.km-btn-sm{display:flex;align-items:center;justify-content:center;height:50px;white-space:nowrap;color:#fff;font-family:var(--mincho);font-weight:800;font-size:15px;background:none;
  border-style:solid;border-width:0 26px;border-image:url(/img/btn_red.webp) 0 88 fill / 0 26px round;-webkit-text-stroke:3px rgb(80,0,10);paint-order:stroke fill;cursor:pointer;touch-action:manipulation}
.km-btn-pink{border-image-source:url(/img/btn_pink.webp)}
.km-btn-navy{grid-column:1/-1;color:#3a1f22;-webkit-text-stroke:0;border-image-source:url(/img/btn_navy.webp);margin:0 8%}
.km-btn-sm[hidden]+.km-btn-pink{grid-column:1/-1;margin:0 8%}
.km-next{text-align:center;font-size:14px;font-weight:700;color:#7a4a40;margin:6px 0 0}
.rk-daikyo .km-rank img{width:62%}.rk-kyo .km-rank img{width:40%}.rk-kiseki .km-rank img{width:96%}
.km-body{margin-top:16px}
@media (min-width:900px){
  .pg-draw .km-main{display:block;max-width:900px}
  .km-scroll{width:560px;margin:0 auto}
  .km-res-girl{left:4%;width:24%}
  .km-st-girl{width:280px}
  .km-st-btn{max-width:320px;height:150px;font-size:26px;padding:2px 0 0;border-width:0 78px;border-image-width:0 78px}
  .km-st-btn.has-pill{height:168px;padding:0 0 82px}
  .km-st-btn .km-pill{bottom:24px}
  .km-slips{height:260px}
  .km-lucky{max-width:620px;margin:12px auto}
  .km-res-btns{max-width:620px;margin:0 auto}
}

/* 本文・前置きは紙の枠の上に（柄の背景の上に直接文字を置かない） */
.km-crumb,.km-lead{background:#fffaf2;background-clip:padding-box;position:relative;z-index:2;width:max-content;max-width:100%;margin-left:auto;margin-right:auto;padding:2px 6px;
  border-style:solid;border-width:6px 10px;border-image:url(/img/card_white.webp) 40 / 6px 10px round}
.km-crumb{font-size:14px;margin-top:6px}
.km-lead{font-size:14px;font-weight:700;color:#2a1214;text-align:center}
.km-body{position:relative;z-index:2;margin:18px 4px 0;padding:14px 16px 6px;font-size:15.5px;line-height:1.85;color:#2a1214;
  border-style:solid;border-width:12px;border-image:url(/img/card_white.webp) 40 / 12px round;background:#fffaf2;background-clip:padding-box}
.km-body h2{margin:22px 0 8px;font-family:var(--mincho);font-weight:800;font-size:19px;line-height:1.45;color:#b3122a}
.km-body h2:first-child{margin-top:4px}
.km-body p{margin:0 0 12px}
.km-body ul{margin:0 0 12px;padding-left:1.3em}
.km-body li{margin:4px 0}
.km-body dt{font-weight:800;color:#b3122a;margin-top:12px}
.km-body dd{margin:2px 0 0}

.pg-draw .km-logo-img{width:min(250px,64vw)}
@media (min-width:900px){.km-res-tsutsu{display:block}.pg-draw .km-logo-img{width:340px}}

/* お問い合わせフォーム */
.km-form{display:grid;gap:12px;margin:14px 0 6px}
.km-form label{display:grid;gap:4px;font-weight:700;font-size:15px}
.km-form input,.km-form select,.km-form textarea{font:inherit;font-size:16px;padding:8px 10px;border:2px solid #e4c48c;background:#fff;color:#2a1214}
.km-form .km-btn-sm{width:70%;margin:6px auto 0}
.km-form-msg{font-weight:800;color:#b3122a}
.km-body table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 12px}
.km-body th,.km-body td{border:1px solid #ecd3c0;padding:6px 8px;text-align:left;vertical-align:top}
.km-body th{background:#fdf0e3;white-space:nowrap}
.km-body a{color:#b3122a;text-decoration:underline;word-break:break-all}

/* 右上のメニュー（トップ以外） */
.km-menu{position:absolute;right:6px;top:50px;z-index:30;display:grid;min-width:210px;padding:4px 6px;text-align:left;
  border-style:solid;border-width:12px;border-image:url(/img/card_white.webp) 40 / 12px round;background:#fffaf2;background-clip:padding-box}
.km-menu a{display:block;padding:10px 6px;font-family:var(--mincho);font-weight:800;font-size:16px;color:#b3122a;border-bottom:1px dashed #ecd3c0}
.km-menu a:last-child{border-bottom:0}

/* 結果の巻物：1枚の絵から切った 上・中（くり返し）・下。紙は絵の幅の21%〜79%（上の軸の下＝幅の16.7%から紙）
   上の絵は紙の上の部分まで含み、中のくり返しの位置は JS（omikuji.js fitScroll）で上の絵の終わりにそろえる */
.km-scroll{position:relative;width:128%;max-width:none;margin:0 0 0 -14%;z-index:2;animation:kmOpen .8s ease-out}
@keyframes kmOpen{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 -20% -20% -20%)}}
.km-sc2-top,.km-sc2-bot{position:relative;z-index:2;width:100%;max-width:none;pointer-events:none}
.km-sc2-top{margin-bottom:calc(-67.56% + 16.74%)}
.km-sc2-bot{margin-top:-1px}
.km-sc-body{position:relative;z-index:3;margin:0 21.5%;padding:0 2%;text-align:center}
.km-sc-body::before{content:"";position:absolute;z-index:-1;left:var(--bl,0);right:var(--bl,0);top:var(--off,0);bottom:0;
  background:url(/img/sc2_mid.webp) repeat-y;background-size:var(--bw,100%) auto;background-position:var(--bx,0) 0}
.km-sc2-bot{margin-top:0}

/* PC：みくじページは1枚の大きい背景（くり返さない・画面いっぱい・固定） */
@media (min-width:900px){
  body.has-pcbg::before{background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(255,252,249,.62),rgba(255,252,249,.32)),var(--pcbg) center/cover no-repeat}
}
@media (min-width:900px){.km-menu-btn,.km-menu{display:none!important}}

/* 季節の絵に額（チャッピーの額・中くり抜き）を重ねる。絵は額の内側（横12.7〜87.3%・縦12.3〜85.3%）に */
.km-season-pic{position:absolute;left:-2px;top:50%;transform:translateY(-50%);width:80px;aspect-ratio:1234/1207;z-index:1}
.km-season-pic .km-season-art{position:absolute!important;left:11%!important;top:10.5%!important;width:78%!important;height:77%!important;object-fit:cover;z-index:0}
.km-season-gaku{position:absolute;inset:0;width:100%;height:100%;max-width:none;z-index:1}
@media (min-width:900px){.km-season-pic{width:156px;left:4px}}
.km-yomu-thumb img{width:100%;max-width:420px;margin:0 auto 12px;aspect-ratio:1;object-fit:cover}

/* みくじページは、スマホもPCも1枚の背景（くり返さない）。固定は ::before で（iPhoneでも効く） */
body.has-pcbg{background:#fbeee6!important}
body.has-pcbg::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(rgba(255,251,247,.45),rgba(255,251,247,.45)),var(--pcbg) center/cover no-repeat}
@media (min-width:900px){body.has-pcbg::before{background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(255,252,249,.62),rgba(255,252,249,.32)),var(--pcbg) center/cover no-repeat}}

.km-kind-go{position:relative;z-index:3;margin-right:6px}
.km-kind{overflow:visible}

/* ボタン系は一番前（飾り・絵・枠より手前）＝相性図鑑の決まり7 */
.km-btn-big,.km-btn-sm,.km-kind-go,.km-form input,.km-form select,.km-form textarea,.km-cal-head button{position:relative;z-index:50}
.km-arrow{z-index:50}


/* 文字は飾り・枠より前（ボタン50 ＞ 文字40 ＞ 飾り） */
.km-h2,.km-h2 span,.km-sub,.km-kind-body,.km-season-label,.km-season-name,.km-lead,.km-crumb,.km-items,.km-rank,.km-lk,.km-art span,.km-more>span,.km-fuki{position:relative;z-index:40}
/* 読み物の題名は長いので、帯ではなく紙の枠に2段まで */
.pg-yomu .km-ttl span{display:block;white-space:normal;max-width:min(680px,100%);margin:6px auto 0;padding:8px 16px;line-height:1.45;font-size:19px;color:#b3122a;-webkit-text-stroke:0;
  border-style:solid;border-width:12px;border-image:url(/img/card_white.webp) 40 / 12px round;background:#fffaf2;background-clip:padding-box}
@media (min-width:900px){.pg-yomu .km-ttl span{font-size:24px}}
@media (max-width:379px){.km-kind-go{width:66px;font-size:15px}.km-kind{padding-left:30%}}

.km-menu-btn{z-index:50}
.km-slip{z-index:50}
.km-body:not(:has(*)){display:none}

.km-btn-big-t b{position:absolute;right:-.9em;top:50%;transform:translateY(-50%)}
.km-btn-big-t>span{position:relative}
.km-btn-big-t{position:relative;display:inline-block}
.km-st-btn{border-width:0 38px!important;font-size:clamp(16px,5vw,19px)}
@media (min-width:900px){.km-st-btn{border-width:0 70px!important;font-size:26px}}

.km-slip{width:13%}
@media (min-width:900px){.km-slip{width:15%}}

/* 読み物・固定ページ：パンくず・題名・記事を画面の中央に（PCの2列をやめる） */
@media (min-width:900px){.pg-yomu .km-main,.pg-fixed .km-main{display:block;max-width:860px;margin-left:auto;margin-right:auto}}
.pg-yomu .km-body,.pg-fixed .km-body{max-width:820px;margin-left:auto;margin-right:auto}
.km-body h2{text-align:center}
.km-yomu-list{display:grid;grid-template-columns:1fr;gap:12px;list-style:none;padding:0;margin:8px 0}
.km-yomu-list a{display:flex;align-items:center;gap:12px;padding:4px;font-family:var(--mincho);font-weight:800;font-size:17px;color:#b3122a;text-decoration:none;
  border-style:solid;border-width:8px;border-image:url(/img/card_white.webp) 40 / 8px round;background:#fffaf2;background-clip:padding-box}
.km-yomu-list img{width:84px;height:84px;object-fit:cover;flex:none}
@media (min-width:900px){.km-yomu-list{grid-template-columns:1fr 1fr}}
.pg-fixed .km-ttl span{font-size:clamp(18px,5.6vw,24px);line-height:34px;padding:3px 10px 7px;border-width:0 44px;border-image-width:0 44px;max-width:calc(100vw - 16px)}
@media (min-width:900px){.pg-fixed .km-ttl span{font-size:30px;line-height:42px;padding:4px 24px 8px;border-width:0 62px;border-image-width:0 62px}}

/* カードの地：カードの形に合わせてチャッピーに描かせた1枚の絵（くり返さない・伸ばさない＝カードを絵と同じ縦横比に） */
.km-kind{border:0!important;border-image:none!important;height:auto!important;aspect-ratio:1136/262;background:center/100% 100% no-repeat}
.km-kind.c-red{background-image:url(/img/kc_red.webp)}.km-kind.c-pink{background-image:url(/img/kc_pink.webp)}
.km-kind.c-coral{background-image:url(/img/kc_coral.webp)}.km-kind.c-purple{background-image:url(/img/kc_purple.webp)}
.km-kind.c-blue{background-image:url(/img/kc_blue.webp)}.km-kind.c-gold{background-image:url(/img/kc_gold.webp)}
.km-kind{padding:0 3.5% 0 31%!important}
.km-kind-girl{bottom:-20%!important;left:1%!important;width:30%!important}
.km-more{border:0!important;border-image:none!important;height:auto!important;aspect-ratio:1201/278;max-width:560px;margin:4px auto 0;width:100%;
  background:url(/img/kc_cream.webp) center/100% 100% no-repeat!important;padding:0 6%!important;justify-content:center}
.km-season-card{border:0!important;border-image:none!important;height:auto!important;aspect-ratio:1201/280;background:url(/img/kc_navy.webp) center/100% 100% no-repeat;
  justify-content:flex-start!important;align-items:flex-end!important;padding:5% 13% 0 30%!important}
.km-season-name{text-align:right}
.km-season-pic{left:3%!important}
@media (min-width:900px){
  .km-season-card{aspect-ratio:1750/617;background-image:url(/img/kc_season_pc.webp);padding:6% 15% 0 44%!important}
  .km-season-pic{width:38%!important;left:4%!important}
  .km-kind{padding:0 3% 0 30%!important}
  .km-kind-t{font-size:18px!important}.km-kind-d{font-size:12px}
}
.km-kind{padding:0 2.5% 0 34%!important}
.km-kind-girl{width:30%!important;left:0!important}
.km-kind-go{margin-right:0!important;flex-shrink:0}
.km-kind-body{min-width:0;overflow:hidden}
@media (max-width:379px){.km-kind-go{width:58px!important;font-size:14px!important}.km-kind-d{font-size:12.5px}}
@media (min-width:900px){.km-more{max-width:760px}.km-more small{font-size:14px}.km-kind{padding:0 3% 0 34%!important}}
.km-kinds{grid-template-columns:minmax(0,1fr)}.km-kind,.km-more{min-width:0;max-width:100%}@media (min-width:900px){.km-kinds{grid-template-columns:repeat(3,minmax(0,1fr))}.km-more{max-width:760px}}
.km-more{aspect-ratio:1201/278!important;min-height:0!important;padding-top:0!important;padding-bottom:0!important;line-height:1.3}
@media (min-width:900px){.km-more{max-width:520px!important}.km-more b{font-size:19px}.km-more small{font-size:13px}}
@media (min-width:900px){.km-more{max-width:600px!important;padding:0 7% 0 9%!important;gap:8px}.km-more-plus{width:32px}.km-more small{font-size:12.5px}.km-more b{font-size:18px}}

/* ヘッダーの境目：立体的な赤い細い線（殿の指定でCSS） */
.km-head{position:relative}
.km-head::after,.km-head::after{content:"";position:absolute;left:0!important;right:0;bottom:0;width:100%!important;height:6px!important;aspect-ratio:auto!important;transform:none!important;z-index:4;pointer-events:none;
  background:linear-gradient(to bottom,#ff8a98 0%,#e8203f 30%,#b30d2a 70%,#6e0618 100%)!important;
  box-shadow:0 2px 4px rgba(90,0,15,.45),0 -1px 0 rgba(255,255,255,.55)}
@media (min-width:900px){.km-head{padding-bottom:12px!important}.km-main{margin-top:14px!important}}

/* 季節の絵は額をやめて細い金の線（殿の指定） */
.km-season-pic .km-season-art{left:0!important;top:0!important;width:100%!important;height:100%!important;outline:2px solid #e8c36a;outline-offset:-2px;box-shadow:0 0 0 1px #8a5a10}
.km-season-pic{aspect-ratio:1!important;width:64px!important}
@media (min-width:900px){.km-season-pic{width:30%!important;left:5%!important}}
/* 文字は右上に行き過ぎ→半分戻す */
.km-season-card{padding:2.5% 13% 0 28%!important;align-items:center!important}
.km-season-name{text-align:center}
@media (min-width:900px){.km-season-card{padding:3% 15% 0 40%!important}}
/* 「今の季節の恋みくじ」の帯を大きく */
#season .km-h2 span{font-size:clamp(18px,5.4vw,23px);line-height:32px;padding:2px 10px 6px;border-width:0 46px;border-image-width:0 46px;max-width:calc(100vw - 16px)}
@media (min-width:900px){#season .km-h2 span{font-size:24px;line-height:34px;padding:3px 12px 7px;border-width:0 50px;border-image-width:0 50px;white-space:nowrap}}
/* ロゴの周りをやわらかく白く */
.km-logo{position:relative}
.km-logo::before{content:"";position:absolute;inset:-6% -8%;z-index:-1;background:radial-gradient(ellipse 50% 50% at 50% 52%,rgba(255,255,255,.92) 55%,rgba(255,255,255,.6) 75%,rgba(255,255,255,0) 100%);pointer-events:none}
.km-logo-img{filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 6px rgba(255,255,255,.9))}
@media (min-width:900px){#season .km-h2 span{font-size:28px;line-height:40px;padding:4px 16px 8px;border-width:0 60px;border-image-width:0 60px}}
.km-logo::before{inset:-10% -12%;background:radial-gradient(ellipse 52% 52% at 50% 50%,rgba(255,255,255,.95) 50%,rgba(255,255,255,.75) 70%,rgba(255,255,255,0) 100%)}
/* #63 帯の端の飾りに文字がかからない（文字の左右に余白）／#64 季節の名前を上下の真ん中に */
#season .km-h2 span{padding-left:26px!important;padding-right:26px!important}
@media (min-width:900px){#season .km-h2 span{padding-left:44px!important;padding-right:44px!important}}
.km-season-card{justify-content:center!important;padding-top:0!important;padding-bottom:0!important}
.km-head{z-index:30!important}.km-sub{z-index:45!important}.km-logo{z-index:44}
@media (min-width:900px){#season .km-h2 span{font-size:25px!important;padding-left:34px!important;padding-right:34px!important;border-width:0 50px!important;border-image-width:0 50px!important}}

/* 結果の下の共有ボタン（チャッピーのボタンの絵・端は固定） */
.km-share{position:relative;z-index:50;text-align:center;margin:10px 0 0}
.km-share-t{display:inline-block;margin:0 0 6px;padding:0 8px;font-family:var(--gothic);font-weight:800;font-size:14px;color:#5b2a14;line-height:22px;
  border-style:solid;border-width:0 16px;border-image:url(/img/mokuji.webp) 0 90 fill / 0 16px round}
.km-share-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;max-width:460px;margin:0 auto 10px}
.km-sh{position:relative;z-index:50;display:flex;align-items:center;justify-content:center;height:44px;padding:0;color:#fff;font-family:var(--gothic);font-weight:800;font-size:14px;
  white-space:nowrap;text-decoration:none;background:none;cursor:pointer;-webkit-text-stroke:3px rgb(80,0,10);paint-order:stroke fill;
  border-style:solid;border-width:0 20px;border-image:url(/img/btn_small.webp) 0 80 fill / 0 20px round;touch-action:manipulation}
.km-sh[hidden]{display:none}
.km-other{display:flex;max-width:360px;margin:0 auto}
@media (min-width:900px){.km-st-btn.has-pill{padding:0!important;margin-bottom:22px!important}.km-st-btn.has-pill .km-pill{bottom:-14px!important}}
.km-st-btn.has-pill{padding:0!important;height:86px!important;margin-bottom:16px!important}.km-st-btn.has-pill .km-pill{bottom:-11px!important}
.pg-top .km-btn-big{padding:0!important}.pg-top .km-btn-big .km-pill{bottom:-11px!important}@media (min-width:900px){.pg-top .km-btn-big .km-pill{bottom:-14px!important}}
@media (min-width:900px){.pg-top .km-btn-big{padding-top:4px!important}}

/* #70 今の季節の恋みくじの帯を大きく（殿2回目・下げない） */
#season .km-h2 span{font-size:24px!important;line-height:36px!important;padding:4px 30px 8px!important;border-width:0 50px!important;border-image-width:0 50px!important;max-width:none!important;white-space:nowrap}
@media (max-width:379px){#season .km-h2 span{font-size:22px!important;padding:4px 22px 8px!important;border-width:0 44px!important;border-image-width:0 44px!important}}
@media (min-width:900px){#season .km-h2 span{font-size:32px!important;line-height:46px!important;padding:5px 40px 9px!important;border-width:0 66px!important;border-image-width:0 66px!important}
  .km-main{grid-template-columns:1fr 470px!important}}
/* #69 季節の名前の後ろをやわらかく白く・文字は濃い赤 */
.km-season-name{color:#a8102a!important;-webkit-text-stroke:0!important;padding:4px 14px;border-radius:999px;
  background:radial-gradient(ellipse 60% 62% at 50% 50%,rgba(255,255,255,.96) 55%,rgba(255,255,255,.8) 72%,rgba(255,255,255,0) 100%);
  text-shadow:0 0 6px #fff}
#season .km-h2 span{padding:4px 16px 8px!important;border-width:0 46px!important;border-image-width:0 46px!important}
@media (max-width:379px){#season .km-h2 span{font-size:21px!important;padding:4px 12px 8px!important;border-width:0 40px!important;border-image-width:0 40px!important}}
@media (min-width:900px){#season .km-h2 span{padding:5px 22px 9px!important;border-width:0 58px!important;border-image-width:0 58px!important}
  .km-hero-img{margin-left:6px!important}}
/* #71 スマホ：女の子を大きくして頭と枠のすき間を詰める */
@media (max-width:899px){.km-hero-girl{width:52%}.km-hero-img{max-width:270px;margin-bottom:-2px}}
@media (max-width:899px){.km-hero-girl{width:58%}.km-hero-img{max-width:none;width:100%}
  .pg-top .km-btn-big{border-width:0 36px!important;border-image-width:0 36px!important;font-size:14px;height:78px}}
@media (min-width:900px){.km-hero-girl{flex:0 0 360px!important;margin-left:4%}.km-hero-img{margin-left:0!important}}
@media (min-width:900px){.pg-top .km-btn-big{max-width:340px!important;border-width:0 50px!important;border-image-width:0 50px!important}.km-hero-girl{flex:0 0 330px!important}.km-hero-img{width:330px!important}}
/* 横長の帯・ボタンは「横はくり返し・縦はそのまま」（縦にくり返して2つに見えるのを防ぐ） */
.km-btn-big,.km-btn-sm,.km-sh,.km-kind-go,.km-pill,.km-sub,.km-h2 span,.km-season-label,.km-menu-btn,.km-sc-kind,.km-rank-sub,.km-share-t,.km-kind-t em{border-image-repeat:round stretch!important}
@media (min-width:900px){.pg-top .km-btn-big{max-width:360px!important;height:130px!important;font-size:24px!important}}
@media (min-width:900px){.pg-top .km-btn-big{font-size:20px!important;height:116px!important;border-width:0 44px!important;border-image-width:0 44px!important}.pg-top .km-hero-act{min-width:250px}}

/* ===== レアの演出 ===== */
.km-rank{position:relative;isolation:isolate}
.km-rank img{position:relative;z-index:2}
.km-rank-goko{display:none;position:absolute;left:50%;top:50%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:1;pointer-events:none;
  background:url(/img/goko.webp) center/contain no-repeat;animation:kmGoko 14s linear infinite;opacity:.95}
@keyframes kmGoko{to{transform:translate(-50%,-50%) rotate(360deg)}}
.rk-daikichi .km-rank-goko,.rk-daidai .km-rank-goko,.rk-koi .km-rank-goko,.rk-kiseki .km-rank-goko{display:block}
.rk-daikichi .km-rank-goko{opacity:.6;filter:saturate(.4) brightness(1.2)}
.rk-daidai .km-rank-goko{filter:grayscale(1) brightness(1.35);opacity:.85}
.rk-koi .km-rank-goko{filter:hue-rotate(-30deg) saturate(1.8) brightness(1.1);width:170%}
.rk-kiseki .km-rank-goko{width:190%;animation:kmGoko 10s linear infinite,kmRainbow 4s linear infinite}
@keyframes kmRainbow{0%{filter:hue-rotate(0) saturate(2.2)}100%{filter:hue-rotate(360deg) saturate(2.2)}}
/* お祝いの札 */
.km-rare-cele{position:relative;z-index:3;display:inline-block;margin:2px 0 0;padding:0 6px;font-family:var(--gothic);font-weight:800;font-size:14px;line-height:24px;color:#fff;
  -webkit-text-stroke:3px #8a0a1e;paint-order:stroke fill;border-style:solid;border-width:0 22px;border-image:url(/img/midashi_mid.webp) 0 112 fill / 0 22px round stretch;
  animation:kmPop .6s cubic-bezier(.2,1.6,.4,1)}
.rk-kiseki .km-rare-cele{animation:kmPop .6s cubic-bezier(.2,1.6,.4,1),kmRainbowTxt 3s linear infinite}
@keyframes kmPop{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes kmRainbowTxt{to{filter:hue-rotate(360deg)}}
/* 赤い糸が結ばれていく（恋大吉・奇跡の恋大吉） */
.km-ito{display:none;position:relative;height:40px;margin:-6px 0 0}
.km-ito img:first-child{width:100%;height:40px;object-fit:fill;clip-path:inset(0 100% 0 0);animation:kmIto 1.6s .5s ease-out forwards}
.km-ito-heart{position:absolute;left:50%;top:50%;width:42px;transform:translate(-50%,-50%) scale(0);animation:kmHeart .7s 1.9s cubic-bezier(.2,1.8,.4,1) forwards}
@keyframes kmIto{to{clip-path:inset(0 0 0 0)}}
@keyframes kmHeart{to{transform:translate(-50%,-50%) scale(1)}}
.rk-koi .km-ito,.rk-kiseki .km-ito{display:block}
.rk-koi .km-sc-mizu,.rk-kiseki .km-sc-mizu{display:none}
/* 巻物のまわりが光る */
.rk-koi .km-scroll{filter:drop-shadow(0 0 14px rgba(255,200,90,.9)) drop-shadow(0 0 26px rgba(255,120,160,.6))}
.rk-kiseki .km-scroll{animation:kmOpen .8s ease-out,kmGlow 3s linear infinite}
@keyframes kmGlow{0%{filter:drop-shadow(0 0 16px hsl(0 95% 65%))}25%{filter:drop-shadow(0 0 16px hsl(90 95% 60%))}50%{filter:drop-shadow(0 0 16px hsl(190 95% 65%))}75%{filter:drop-shadow(0 0 16px hsl(280 95% 70%))}100%{filter:drop-shadow(0 0 16px hsl(360 95% 65%))}}
.rk-daidai .km-scroll{filter:drop-shadow(0 0 12px rgba(220,230,255,.95))}
.km-burst{position:fixed;inset:0;z-index:60;pointer-events:none}
@media (prefers-reduced-motion:reduce){.km-rank-goko,.km-rare-cele,.km-ito img,.km-ito-heart,.km-scroll{animation:none!important}.km-ito img:first-child{clip-path:none}.km-ito-heart{transform:translate(-50%,-50%)}}
.km-rank-goko{width:118%!important;opacity:.7!important;-webkit-mask:radial-gradient(circle,#000 35%,transparent 70%);mask:radial-gradient(circle,#000 35%,transparent 70%)}
.rk-koi .km-rank-goko{width:126%!important;opacity:.8!important}
.rk-kiseki .km-rank-goko{width:132%!important;opacity:.85!important}
.km-sc-kind,.km-rare-cele{position:relative;z-index:5}
.km-items,.km-ito,.km-rank-sub{position:relative;z-index:5}
.km-sc-body .km-rank{z-index:4!important}.km-sc-body .km-sc-kind,.km-sc-body .km-rare-cele,.km-sc-body .km-items,.km-sc-body .km-ito,.km-sc-body .km-rank-sub{z-index:6!important}
/* #76 結果の女の子は文字に重ねない：スマホは巻物の下に、PCは巻物の左の外に */
.km-res-girl{position:relative!important;left:auto!important;top:auto!important;display:block;width:130px!important;max-width:none;margin:-18px auto 0;z-index:3}
@media (min-width:900px){.km-st-res{position:relative}.km-res-girl{position:absolute!important;left:-150px!important;top:260px!important;width:150px!important;margin:0}
  .km-scroll{max-width:520px!important}}

/* #76 女の子は段階の大きな字の横（字・項目に重ねない） */
.km-rank{display:flex;align-items:center;justify-content:center;gap:2px;padding-right:15%}
.km-rank .km-res-girl{position:relative!important;left:auto!important;top:auto!important;flex:none;width:23%!important;max-width:none;margin:0 -2% 0 -8%!important;z-index:3}
.km-rank img[data-rank-img]{width:64%!important;margin:0!important}
.rk-kiseki .km-rank img[data-rank-img]{width:74%!important}
.rk-kyo .km-rank img[data-rank-img]{width:34%!important}
.rk-daikyo .km-rank img[data-rank-img]{width:52%!important}
@media (min-width:900px){.km-rank .km-res-girl{width:20%!important}}
.km-rank .km-res-girl{margin:0 2% 0 -8%!important}
@media (min-width:900px){.km-scroll{width:700px!important;max-width:none!important;margin:0 auto!important}
.km-st-res{overflow:visible}}
/* レア度の札は巻物の中（段階の字の右・左の女の子と左右対称） */
.km-rank{padding-right:0}
/* 札は元の大きさ（88px）・字も元のまま */
.km-rank .km-rare{position:relative;right:auto;left:auto;top:auto;flex:none;width:88px;margin:0 -10px 0 0;z-index:6}
.km-rank .km-rare[hidden]{display:none}
.km-rank .km-rare span{z-index:3}
.km-rank .km-rare img{display:block;width:100%!important;margin:0!important}
.km-rank img[data-rank-img]{flex:1 1 auto;min-width:0;width:auto!important;max-width:56%}
.rk-kiseki .km-rank img[data-rank-img]{max-width:60%}
.rk-kyo .km-rank img[data-rank-img]{max-width:34%}
.rk-daikyo .km-rank img[data-rank-img]{max-width:50%}
@media (min-width:900px){.km-rank .km-rare{margin-right:0}}
.km-goko{display:none!important}
.km-res-tsutsu{display:none!important}
