/* 新サイト共通ヘッダー（2026-10-26）。新ページとレースページ（予想画面）の両方で使う。
   予想画面のCSSと混ざらないよう、すべて .site-hd の中に限定する。 */
.site-hd{--hd-ink:#22303f;--hd-muted:#7b8794;--hd-line:#e3e8ee;--hd-navy:#1D3557;--hd-brand:#E63946;--hd-bg:#f5f7fa;
  background:#fff;border-bottom:1px solid var(--hd-line);position:sticky;top:0;z-index:60;font:14px/1.6 "Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic UI",Meiryo,sans-serif;color:var(--hd-ink)}
.site-hd *{box-sizing:border-box}
.site-hd a{color:inherit;text-decoration:none}
.site-hd .topbar{border-bottom:1px solid var(--hd-line);font-size:12px;color:var(--hd-muted)}
.site-hd .topbar .in{max-width:1400px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:5px 14px}
.site-hd .topbar a:hover{color:var(--hd-ink)}
.site-hd .topbar .sp{flex:1}
.site-hd .btn-login{display:inline-block;background:#fff;color:var(--hd-navy);font-weight:700;padding:4px 14px;border-radius:999px;font-size:12px;border:1.5px solid var(--hd-line);white-space:nowrap;text-align:center;line-height:1.6;cursor:pointer}
.site-hd .btn-register{display:inline-block;background:var(--hd-brand);color:#fff;font-weight:800;padding:4px 14px;border-radius:999px;font-size:12px;border:0;white-space:nowrap;text-align:center;line-height:1.6;box-shadow:0 1px 4px rgba(230,57,70,.35);cursor:pointer}
.site-hd .btn-register:hover{color:#fff}
.site-hd .member{display:none!important}
.is-member .site-hd .member{display:inline-flex!important}
.is-member .site-hd .sp-btns.member{display:grid!important}
.is-member .site-hd .guest{display:none!important}
.site-hd .hd-in{max-width:1400px;margin:0 auto;display:flex;align-items:center;gap:14px;padding:8px 14px}
.site-hd .logo{display:flex;align-items:center;gap:5px;flex:0 0 auto}
.site-hd .logo img.mark{height:34px;width:auto}.site-hd .logo img.font{height:26px;width:auto}
.site-hd .vip-hd{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;padding:4px 10px;border-radius:999px;white-space:nowrap;background:#eef1f5;color:#5b6b7d;border:1px solid #dde3ea;min-width:0;overflow:hidden;text-overflow:ellipsis}
.site-hd .vip-hd.open{background:#fdeee5;color:#c0392b;border-color:#f2c4ad}
.site-hd .vip-hd .vh-x{font-weight:700;color:var(--hd-brand)}
.site-hd .gnav{margin-left:auto;display:flex;gap:2px}
.site-hd .gnav a{padding:8px 12px;border-radius:10px;font-weight:800;font-size:13.5px;color:var(--hd-navy);white-space:nowrap}
.site-hd .gnav a:hover{background:var(--hd-bg)}
.site-hd .gnav a.on{background:var(--hd-navy);color:#fff}
.site-hd .menu-sp{display:none;margin-left:auto;background:none;border:1px solid var(--hd-line);border-radius:10px;padding:6px 12px;font-size:18px;line-height:1.2;color:var(--hd-ink);cursor:pointer}
.site-hd .sp-menu{border-top:1px solid var(--hd-line);background:#fff;padding:8px 16px 14px;display:flex;flex-direction:column;max-height:calc(100vh - 60px);overflow-y:auto}
.site-hd .sp-menu[hidden]{display:none}
.site-hd .sp-menu>a{padding:12px 2px;font-weight:700;font-size:15px;border-bottom:1px dashed var(--hd-line)}
.site-hd .sp-menu>a.on{color:var(--hd-brand)}
.site-hd .sp-btns{display:grid;gap:8px;margin:4px 0 8px}
.site-hd .sp-btns .btn-register,.site-hd .sp-btns .btn-login{padding:10px 14px;font-size:14px}
.site-hd .sp-sub{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;font-size:13px;color:var(--hd-muted)}
@media (min-width:901px){.site-hd .sp-menu{display:none!important}}
@media (max-width:1100px){.site-hd .vip-hd .vh-x{display:none}}
@media (max-width:900px){
  .site-hd .topbar,.site-hd .gnav{display:none}
  .site-hd .menu-sp{display:block}
  .site-hd .vip-hd .vh-x{display:inline}
  .site-hd .hd-in{padding:6px 12px;gap:10px}
  .site-hd .logo img.mark{height:28px}.site-hd .logo img.font{height:21px}
}
@media (max-width:440px){.site-hd .vip-hd .vh-x{display:none}}