/* 国鉄・JR編：国鉄色（青15号・クリーム1号・ぶどう色2号）と硬券 */
.jnr { --panel: #1c2e5a; --panel-2: #243a6e; --panel-ink: #efe6c8; --panel-dim: #aab3c9; --accent: #1c2e5a; }
.jnr .hd { border-bottom: 4px solid #efe6c8; box-shadow: 0 3px 0 #1c2e5a; }
.jnr .hd-nav a, .jnr .hd-btn { border-color: #3d5186; }
.jnr .hd-nav a.on { background: #efe6c8; color: #1c2e5a; }
.jnr .brand-mark { background: #efe6c8; box-shadow: 0 0 0 2px #0e1a38; }
.jnr .tl { background: #14224a; border-top-color: #efe6c8; }
.jnr .tl-b.play { background: #efe6c8; color: #1c2e5a; }

/* 硬券（エドモンソン券）ふうの日付 */
.kouken { position: relative; width: 190px; height: 58px; background:
    repeating-linear-gradient(0deg, rgba(60, 110, 70, .10) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(60, 110, 70, .08) 0 1px, transparent 1px 4px), #e7ebd4;
  border-radius: 3px; color: #1a2a1c; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr; padding: 3px 9px 4px; box-shadow: 0 2px 0 rgba(0, 0, 0, .35); font-family: "BIZ UDPMincho", "Yu Mincho", "Hiragino Mincho ProN", serif; }
.kouken::before, .kouken::after { content: ''; position: absolute; top: 50%; width: 8px; height: 8px; border-radius: 50%; background: var(--panel); transform: translateY(-50%); }
.kouken::before { left: -4px; } .kouken::after { right: -4px; }
.kouken .k-top { grid-column: 1 / 3; font-size: 9px; letter-spacing: .3em; border-bottom: 1px solid #6a7a60; text-align: center; }
.kouken .k-y { display: flex; align-items: baseline; gap: 2px; }
.kouken .k-y b { font-size: 26px; font-family: var(--mono); letter-spacing: .02em; color: #111; }
.kouken .k-y small { font-size: 12px; }
.kouken .k-w { font-size: 11px; align-self: start; text-align: right; padding-top: 5px; }
.kouken .k-era { position: absolute; right: 10px; bottom: 2px; font-size: 9.5px; color: #7a1f2a; font-weight: 700; letter-spacing: .1em; border: 1px solid #7a1f2a; padding: 0 3px; border-radius: 2px; transform: rotate(-4deg); background: rgba(255, 255, 255, .35); }
@media (max-width: 700px) { .kouken { width: 160px; } }

#map { background: var(--sea); }
.jtip { transform: translate(12px, -50%); }
.jtip .card { background: #efe6c8; color: #1a1a1a; border: 2px solid #1c2e5a; border-radius: 3px; padding: 6px 10px; min-width: 190px; font-size: 12px; }
.jtip .card b { font-size: 15px; display: block; letter-spacing: .08em; }
.jtip .card .co { display: inline-block; padding: 0 6px; border-radius: 2px; color: #fff; font-size: 11px; margin: 2px 0; }
.chg-grp { margin-bottom: 8px; }
.chg-grp h4 { margin: 0 0 3px; font-size: 11.5px; letter-spacing: .1em; color: var(--ink-2); }
.chg-row { display: grid; grid-template-columns: 1fr auto; gap: 6px; font-size: 12.5px; padding: 1px 0; }
.chg-row small { color: var(--ink-3); }
.chg-row .km { font-family: var(--mono); font-size: 11.5px; color: var(--ink-2); }
.kind { display: inline-block; font-size: 10px; padding: 0 5px; border-radius: 2px; color: #fff; margin-right: 4px; letter-spacing: .05em; }