/* ===== トップ ===== */
/* ロゴ（タイトル画面のロゴ＝公式マークの使い場所。舞台の外のUIレイヤー。キャラ・吹き出しと重ねない） */
.logo9{position:absolute;z-index:11;display:flex;align-items:center;gap:18px}
.logo9 img{height:96px;width:auto;filter:drop-shadow(0 0 6px #FF2D95) drop-shadow(0 0 18px rgba(255,45,149,.55))}
.logo9 .wm{display:flex;flex-direction:column;gap:8px}
.logo9 b{font:900 60px/1 "Nunito",sans-serif;color:#fff;letter-spacing:.01em;text-shadow:0 0 18px rgba(63,224,232,.45),0 4px 0 rgba(0,0,0,.35)}
.logo9 b i{font-style:normal;font-weight:700;opacity:.7;margin-left:6px}
.logo9 .tg{font-size:16px;font-weight:700;color:#DCE6FF;letter-spacing:.06em;text-shadow:0 2px 6px rgba(0,0,0,.7)}
.logo9.ta{top:62px;left:50%;transform:translateX(-50%)}
.topgrade{position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(180deg,rgba(4,8,26,.78) 0,rgba(4,8,26,.2) 34%,transparent 50%,rgba(4,8,26,.55) 100%)}
.pl9{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.pl9 .pk,.pk9 .pk{font:900 10.5px/1 "Nunito",sans-serif;letter-spacing:.2em;color:#04223A;background:#FFC857;padding:5px 8px;border-radius:6px}
.pl9 b{font-size:16px;font-weight:900}
.prg{display:inline-block;width:96px;height:8px;border-radius:999px;background:rgba(113,130,174,.3);overflow:hidden}.prg i{display:block;height:100%;background:linear-gradient(90deg,#3FE0E8,#FFC857)}
.pn{font-size:12px;font-weight:700;color:var(--ink-2);white-space:nowrap}.pn b{font:900 17px/1 "Nunito",sans-serif;color:var(--panel-ink)}
/* 案a */
.d .dlg9.ta9{left:190px;right:190px;bottom:24px;height:176px}
.ta9 .pg{gap:14px;padding:20px 24px 20px}
.trow{display:flex;align-items:center;gap:10px}.trow .sp{flex:1}.trow.c{justify-content:center}
.tacts{display:grid;grid-template-columns:1fr 190px 150px;gap:12px}
.tacts .btn.sec{height:70px}
.m .logo9.ta{top:64px;flex-direction:column;gap:10px;text-align:center;width:100%}
.m .logo9 img{height:64px}
.m .logo9 b{font-size:40px}
.m .logo9 .wm{align-items:center;gap:6px}
.m .logo9 .tg{font-size:13px}
.m .dlg9.ta9{left:8px;right:8px;bottom:8px;top:auto;height:auto}
.m .ta9 .pg{gap:10px;padding:16px 14px 14px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.row2 .btn.sec{height:46px;font-size:14px}
/* 案b */
.logo9.tb{top:24px;left:28px;gap:14px}
.logo9.tb img{height:64px}.logo9.tb b{font-size:40px}.logo9.tb .tg{font-size:13px}
.d .rpanel.tb9{top:24px;bottom:16px;right:18px;width:560px}
.d .tb9~.hud,.d .hud.sx{z-index:12}
.sx-b.d .hud.sx{right:600px}
.tb9 .pg{gap:12px;padding:22px 22px 18px}
.cont9{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:16px;background:rgba(63,224,232,.08);border:2px solid rgba(63,224,232,.55);box-shadow:0 0 22px rgba(63,224,232,.2)}
.ct{display:flex;align-items:center;gap:16px}
.sh9{font-size:12px;font-weight:800;color:var(--ink-3);letter-spacing:.08em;margin-top:2px}
.pk9{display:flex;flex-direction:column;gap:7px}
.pkc{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;background:var(--tile);border:1.5px solid var(--tile-line)}
.pkc div{display:flex;flex-direction:column;gap:2px}.pkc b{font-size:16px;font-weight:900}.pkc small{font-size:11.5px;font-weight:700;color:var(--ink-2)}
.pkc .sp{flex:1}
.pkc.soon{border-style:dashed;background:transparent;opacity:.75}.pkc.soon b{font-size:13px;color:var(--ink-2)}
.pk9 .pk.g{background:transparent;color:var(--ink-3);border:1.5px solid rgba(113,130,174,.6)}
.sws{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.sw9{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px;border-radius:14px;background:var(--tile);border:1.5px solid var(--tile-line)}
.sw9 .th{width:100%;height:58px;background-size:cover;border-color:transparent}
.sw9 b{font-size:13px;font-weight:800;color:var(--ink-2)}
.sw9.on{border:2px solid #FFC857;box-shadow:0 0 16px rgba(255,200,87,.3)}.sw9.on b{color:#FFC857}
.row9.tb{margin-top:auto}
.row9 .sp{flex:1}
.m .logo9.tb{top:8px;left:8px;gap:8px}.m .logo9.tb img{height:30px}.m .logo9.tb b{font-size:22px}.m .logo9.tb .tg{display:none}
.sx-b.m .rpanel.tb9{left:8px;right:8px;width:auto;top:300px;bottom:8px}
.m .tb9 .pg{gap:8px;padding:14px 12px 12px}
.m .cont9{padding:10px;gap:10px}.m .ct{gap:10px}.m .ct .th.lg{width:84px;height:56px}
.m .bt9 b{font-size:17px}
.m .sws{gap:6px}.m .sw9{padding:5px}.m .sw9 .th{height:34px}.m .sw9 b{font-size:11.5px}
.m .pkc{padding:7px 10px}.m .pkc b{font-size:14px}.m .pkc.soon b{font-size:12px}
.m .prg{width:64px}
.m .sh9{font-size:11px}
/* 案c */
.one9{position:absolute;z-index:11;left:50%;top:50%;transform:translate(-50%,-56%);display:flex;flex-direction:column;align-items:center;gap:26px}
.logo9.tc{position:static;flex-direction:column;gap:16px;text-align:center}
.logo9.tc img{height:120px}.logo9.tc .wm{align-items:center}.logo9.tc b{font-size:68px}
.one9 .go{width:420px}
.one9 .go .btn.pri9{height:76px;font-size:22px}
.one9 .sub{display:flex;align-items:center;gap:12px;padding:8px 16px;border-radius:999px;background:rgba(6,14,36,.72);border:1.5px solid rgba(63,224,232,.3)}
.one9 .sub>i{font-style:normal;opacity:.5;color:var(--ink-2)}
.one9 .lk{display:inline-flex;align-items:center;gap:2px;font-size:14px;font-weight:800;color:var(--accent)}.one9 .lk svg{width:15px;height:15px}
.m .one9{width:100%;padding:0 16px;gap:20px;transform:translate(-50%,-58%)}
.m .logo9.tc img{height:84px}.m .logo9.tc b{font-size:44px}.m .logo9.tc .tg{font-size:13px}
.m .one9 .go{width:100%}
.m .one9 .sub{flex-wrap:wrap;justify-content:center;gap:8px;border-radius:16px}
.m .one9 .sub .prg{width:60px}
.d .sw9 .th{height:84px}
.sx-b .btn.pri9{height:64px}
.m .ta9 .pg{gap:10px}
.m .one9 .sub>i{display:none}