.network-section { padding-top:76px; padding-bottom:88px; }
.network-intro { display:block; margin-bottom:38px; text-align:center; }
.network-intro__eyebrow { color:#1662bb; font-family:Arial,sans-serif; font-size:12px; font-weight:700; letter-spacing:.16em; margin-bottom:18px; }
.network-intro__title { color:#153c70; font-family:"Noto Serif JP",serif; font-weight:600; font-size:32px; line-height:1.65; letter-spacing:.06em; }
.network-intro__description { margin-top:24px; margin-right:auto; margin-bottom:0; margin-left:auto; max-width:1000px; color:#344c67; font-size:16px; line-height:2; text-align:center; overflow-wrap:anywhere; }
.network-intro__lead { color:#556477; font-size:13px; line-height:2; }
.network-intro__contact { display:flex; align-items:center; justify-content:space-between; max-width:300px; color:#163f77; text-decoration:none; font-size:13px; border-bottom:1px solid #b4c8df; padding-top:12px; padding-bottom:12px; margin-top:12px; }
.network { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); border:1px solid #dbe4ed; border-radius:6px; overflow:hidden; background:#fff; box-shadow:0 16px 48px #153d7010; }
.network__map-panel { min-width:0; display:flex; flex-direction:column; background:#eff4f8; }
.network__map-heading { display:flex; align-items:center; justify-content:space-between; padding-top:24px; padding-right:28px; padding-bottom:16px; padding-left:28px; }
.network__eyebrow { color:#356494; font-family:Arial,sans-serif; font-size:10px; font-weight:700; letter-spacing:.15em; }
.network__map-area { color:#34516e; font-size:12px; }
.network__map { position:relative; overflow:hidden; flex:1; }
.network__map-image { display:block; width:100%; height:auto; filter:saturate(.64) brightness(1.07) contrast(.93); }
.network__map-canvas { position:relative; isolation:isolate; }
.network__connections { position:absolute; left:0; top:0; width:100%; height:100%; pointer-events:none; }
.network__connector { color:#174b86; }
.network__connector.is-active { color:#d86629; }
.network__connector[hidden] { display:none; }
.network__html-pin { position:absolute; display:grid; place-items:center; width:28px; height:28px; transform:translate(-50%,-50%); border:2px solid #fff; border-radius:50%; background:#174b86; box-shadow:0 2px 6px #123d7340; color:#fff; text-decoration:none; z-index:1; }
.network__html-number { font-family:Arial,sans-serif; font-size:11px; font-weight:700; line-height:1; }
.network__html-pin:hover, .network__html-pin:focus-visible, .network__html-pin.is-active { background:#d86629; z-index:3; }
.network__html-pin:focus-visible { outline:3px solid #163f76; outline-offset:2px; }
.network__html-pin[hidden] { display:none; }
.network__tooltip { position:absolute; left:50%; bottom:calc(100% + 6px); transform:translateX(-50%); width:max-content; max-width:160px; background:#163f76; border-radius:3px; color:#fff; font-size:11px; padding-top:6px; padding-right:9px; padding-bottom:6px; padding-left:9px; visibility:hidden; pointer-events:none; }
.network__html-pin:hover .network__tooltip, .network__html-pin:focus-visible .network__tooltip, .network__html-pin.is-active .network__tooltip { visibility:visible; }
@media (max-width:767px) { .network__html-pin { width:22px; height:22px; border-width:1px; } .network__html-number { font-size:10px; } }
.network__svg { display:block; width:100%; height:auto; }
.network__basemap { filter:grayscale(1); opacity:.46; }
.network__pin { color:#174b86; transition:opacity .2s; outline:none; }
.network__leader { stroke:currentColor; stroke-width:1.3; }
.network__point { fill:currentColor; }
.network__marker { fill:currentColor; stroke:#fff; stroke-width:2; }
.network__number { fill:#fff; font-family:Arial,sans-serif; font-size:12px; font-weight:700; text-anchor:middle; dominant-baseline:middle; pointer-events:none; }
.network__pin:hover, .network__pin:focus-visible, .network__pin.is-active { color:#d86629; }
.network__pin:focus-visible .network__marker { stroke:#123d73; stroke-width:4; }
.network__pin.is-muted { opacity:.22; }
.network__map-bottom { display:flex; justify-content:space-between; gap:20px; align-items:center; padding-top:15px; padding-right:24px; padding-bottom:12px; padding-left:24px; border-top:1px solid #d8e2eb; }
.network__map-guide { color:#4a6079; font-size:11px; }
.network__kyoto { display:flex; align-items:center; gap:12px; color:#23476f; text-decoration:none; background:#fff; border:1px solid #d7e2ec; border-radius:4px; padding-top:10px; padding-right:14px; padding-bottom:10px; padding-left:12px; }
.network__kyoto-number { display:grid; place-items:center; width:28px; height:28px; background:#164c86; border-radius:50%; color:#fff; font-family:Arial,sans-serif; font-size:12px; }
.network__kyoto-copy { font-size:13px; font-weight:600; }
.network__kyoto-label { display:block; font-family:Arial,sans-serif; font-size:9px; font-weight:400; letter-spacing:.06em; margin-bottom:3px; }
.network__kyoto:hover, .network__kyoto:focus-visible, .network__kyoto.is-active { outline:2px solid #d86629; outline-offset:-2px; }
.network__credit { color:#647487; font-size:9px; text-align:right; padding-right:24px; padding-bottom:12px; }
.network__credit-link { color:inherit; text-underline-offset:2px; }
.network__directory { padding-top:28px; padding-right:30px; padding-bottom:24px; padding-left:30px; border-left:1px solid #ffffff26; background-image:linear-gradient(215deg,#0561c9 0%,#193d80 100%); color:#fff; }
.network__directory-title { margin-top:0; font-size:20px; color:#fff; font-weight:600; letter-spacing:.04em; }
.network__filters { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; background:#ffffff1a; border:1px solid #ffffff40; border-radius:5px; padding-top:4px; padding-right:4px; padding-bottom:4px; padding-left:4px; margin-top:20px; margin-bottom:24px; }
.network__filter { cursor:pointer; font:inherit; font-size:14px; border:0; border-radius:3px; background:transparent; color:#fff; min-height:36px; }
.network__filter.is-selected { background:#fff; color:#164483; box-shadow:0 2px 6px #102e5e26; }
.network__filter:focus-visible, .network__link:focus-visible, .network__all-link:focus-visible { outline:2px solid #ffbd94; outline-offset:3px; }
.network__group { margin-bottom:20px; }
.network__group[hidden] { display:none; }
.network__group-title { display:flex; align-items:center; gap:10px; color:#fff; font-size:14px; font-weight:700; padding-bottom:8px; border-bottom:1px solid #ffffff59; }
.network__links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:16px; }
.network__link { display:flex; align-items:center; gap:8px; min-height:50px; border-bottom:1px solid #ffffff26; color:#fff; text-decoration:none; font-size:14px; }
.network__link-number { flex-shrink:0; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; background:#fc8d4b; color:#fff; font-family:"Noto Serif JP",serif; font-size:14px; font-weight:700; letter-spacing:0; }
.network__link-name { overflow-wrap:anywhere; text-decoration:underline; text-underline-offset:4px; }
.network__link-arrow { margin-left:auto; color:#d2e4fa; font-size:12px; }
.network__link:hover, .network__link.is-active { color:#fff; background:#ffffff1f; }
.network__all-link { display:flex; justify-content:space-between; align-items:center; border-top:1px solid #ffffff59; padding-top:16px; font-size:14px; font-weight:600; text-decoration:none; color:#fff; }
@media (max-width:1100px) { .network-intro { gap:30px; } .network-intro__title { font-size:27px; } .network__directory { padding-right:22px; padding-left:22px; } .network__links { column-gap:10px; } .network__link { font-size:13px; } .network__map-bottom { flex-direction:column; align-items:stretch; gap:10px; } .network__kyoto { justify-content:flex-start; } }
@media (max-width:767px) { .network-section { padding-top:40px; padding-bottom:48px; } .network-intro { grid-template-columns:1fr; gap:20px; margin-bottom:28px; } .network-intro__title { font-size:25px; } .network-intro__lead { font-size:12px; } .network { grid-template-columns:1fr; } .network__map-heading { padding-top:18px; padding-right:18px; padding-bottom:10px; padding-left:18px; } .network__map-bottom { padding-right:18px; padding-left:18px; } .network__map-guide { font-size:11px; } .network__kyoto { width:auto; } .network__directory { border-left:0; border-top:1px solid #dbe4ed; padding-top:24px; padding-right:20px; padding-bottom:24px; padding-left:20px; } .network__directory-title { font-size:19px; } .network__link { font-size:14px; min-height:52px; } .network__filter { min-height:40px; } .network__credit { font-size:8px; } }
@media (prefers-reduced-motion:reduce) { .network__pin { transition:none; } }
