:root {
  --purple: #6066ad;
  --pink: #b54898;
  --ink: #444e65;
  --footer: #242423;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 16px; }
body { margin: 0; color: var(--ink); font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; line-height: 1.7; }
body.modal-open { overflow: hidden; }
h1, h2, h3, p, figure, dl, dd { margin: 0; }
ul { list-style: none; margin: 0; padding: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; padding: 0; }
a, button { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
img { display: block; width: 100%; max-width: 100%; height: auto; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--pink); outline-offset: 4px; }
.purple a:focus-visible, .purple button:focus-visible, .detail-dialog button:focus-visible { outline-color: #fff45c; }
.sr-only, .skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link:focus { position: fixed; top: 10px; left: 10px; z-index: 100; padding: 12px 24px; background: white; }
.header-inner { width: min(1200px, calc(100% - 60px)); margin: auto; }
.group-bar { background: #f4f3f1; color: #111; }
.group-bar .header-inner { display: flex; align-items: center; justify-content: space-between; height: 42px; }
.group-bar p { font-size: 14px; font-weight: 700; letter-spacing: .12em; }
.group-bar a { width: 210px; }
.facility-bar { height: 90px; display: flex; align-items: center; justify-content: space-between; }
.facility-logo { width: 180px; }
.facility-actions { display: flex; align-items: center; gap: 28px; }
.members-link, .language-toggle { display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 10px; color: #555; line-height: 1.05; text-align: center; min-width: 58px; }
.members-link svg { width: 24px; height: 28px; stroke: #923166; stroke-width: 2; fill: none; margin-bottom: 3px; }
.language-toggle svg { width: 30px; height: 30px; stroke: #aaa; stroke-width: 2.5; fill: none; margin-bottom: 5px; }
.language-toggle span { color: #aaa; font-family: Arial, sans-serif; font-size: 10px; }
.hamburger { display: flex; flex-direction: column; justify-content: center; gap: 8px; width: 42px; height: 48px; }
.hamburger span { display: block; width: 32px; height: 3px; background: #242423; }
.magazine-header { border-top: 5px solid #333; color: #111; background: #fff; }
.magazine-brand-row { position: relative; height: 86px; display: flex; justify-content: center; align-items: center; width: min(1200px, 100%); margin: auto; }
.magazine-brand-row > a { width: 440px; }
.magazine-menu-toggle { position: absolute; left: 24px; display: flex; flex-direction: column; gap: 7px; width: 38px; min-height: 48px; justify-content: center; color: #222; }
.magazine-menu-toggle span { font: 700 10px Arial, sans-serif; }
.magazine-menu-toggle i { display: block; height: 2px; width: 30px; background: #222; }
.magazine-categories { border-top: 1px solid #111; display: flex; align-items: center; justify-content: center; gap: 45px; height: 62px; padding: 0 25px; }
.magazine-categories > a { font: 700 20px Arial, sans-serif; letter-spacing: .07em; }
.magazine-categories > a:hover { color: var(--pink); }
.magazine-date { font-family: Arial, sans-serif; white-space: nowrap; color: #111; }
.date-number { font-size: 29px; font-weight: 700; }
.date-weekday { font-size: 14px; letter-spacing: .12em; }
.purple { background: var(--purple); color: white; }
.white { background: white; }
.sns-area { border-top: 2px solid #eee; display: flex; align-items: flex-start; justify-content: center; padding: 12px 0 30px; background: #fff; }
.sns-area img { width: 32px; height: 32px; }
.site-footer { background: var(--footer); color: #fff; font-weight: 400; }
.site-footer .inner { max-width: 1120px; margin: auto; padding-inline: 24px; }
/*
.footerMenu { padding: 30px 0 45px; }
.footerLink { border-bottom: 1px solid #555; padding: 0 0 26px; }
.footerLink ul { display: flex; flex-wrap: wrap; justify-content: center; row-gap: 12px; }
.footerLink li { padding-inline: 14px; border-right: 1px solid #ddd; font-size: 12px; line-height: 1.2; }
.footerLink a:hover, .footerNav a:hover { text-decoration: underline; }
.footerWrap { display: grid; grid-template-columns: 2.1fr 1fr; gap: 50px; }
.footerUnit { padding-top: 30px; }
.footerLogoUrban { width: 275px; margin: 0 auto 35px; }
.footerLogoRayard { width: 200px; margin: 12px auto 40px; }
.footerNav { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.footerNav dt { font-size: 17px; font-weight: 700; margin-bottom: 16px; }
.footerNav dd { margin-bottom: 28px; }
.footerNav ul li { margin-bottom: 12px; padding-left: 13px; position: relative; font-size: 13px; line-height: 1.6; }
.footerNav li:before { content: ""; width: 0; height: 0; border-block: 4px solid transparent; border-left: 5px solid #888; position: absolute; top: .5em; left: 0; }
.footerNavRayard { grid-template-columns: 1fr; }
.footerBanner { background: #fff; padding: 24px 0 30px; }
.footerBanner01 { display: grid; grid-template-columns: repeat(6,1fr); gap: 16px; }
.footerBanner01 a { display: flex; height: 100%; align-items: center; }
.footerBanner01 li { border: 1px solid #d0d0d0; }
.footerBanner02 { display: flex; align-items: center; justify-content: center; gap: 45px; padding-top: 30px; }
.footerBanner02 li:first-child { width: 500px; }
.footerBanner02 li:last-child { width: 220px; }
.footerCopyright { padding: 20px 0; text-align: center; font-size: 12px; letter-spacing: .03em; line-height: 1.6; }
.footerCopyright .forSP { display: none; }
*/
.utility-links { position: fixed; right: 0; bottom: 0; width: 64px; z-index: 10; opacity: 0; visibility: hidden; transition: opacity .2s; }
.utility-links.is-visible { opacity: 1; visibility: visible; }
.utility-links a { display: flex; height: 64px; align-items: center; justify-content: center; flex-direction: column; color: #fff; }
.back-top { background: #303232d9; font: 10px Arial,sans-serif; }
.back-top span:first-child { font-size: 37px; line-height: .9; height: 34px; }
.point-link { background: #873263; font-size: 12px; gap: 2px; }
.point-link svg { width: 32px; height: 32px; }
dialog { padding: 0; border: 0; max-height: 92dvh; width: min(720px, calc(100% - 28px)); border-radius: 0; overscroll-behavior: contain; }
dialog::backdrop { background: #161833d4; }
.detail-dialog { background: var(--purple); color: white; }
.dialog-close { position: sticky; top: 0; display: flex; align-items: center; justify-content: flex-end; gap: 15px; width: 100%; min-height: 48px; padding: 8px 18px; font-size: 12px; background: inherit; color: inherit; z-index: 2; }
.dialog-close span { font-size: 28px; line-height: 1; }
#dialog-content img { width: 100%; }
.menu-dialog { padding: 0 28px 30px; background: white; color: #222; }
.menu-dialog > .dialog-close { margin-inline: -28px; width: calc(100% + 56px); }
.menu-dialog h2 { font-size: 19px; margin: 10px 0 25px; }
.menu-dialog nav > a { display: block; border-top: 1px solid #ddd; padding: 14px 3px; }
.facility-links ul { display: block; }
.facility-links li { margin-bottom: 12px; }
.facility-links li li { font-size: 13px; padding-left: 15px; }
.facility-links .inner { padding: 0; }
.facility-links a:hover { text-decoration: underline; }
.noscript-note { padding: 16px; background: #fff8dc; color: #222; font-size: 13px; }
.noscript-note a { text-decoration: underline; }
@media (max-width: 760px) {
  .header-inner { width: 100%; padding-inline: 2.8vw; }
  .group-bar .header-inner { height: 12.4vw; }
  .group-bar p { font-size: 3.4vw; letter-spacing: .07em; }
  .group-bar a { width: 30.5vw; }
  .facility-bar { height: 17vw; }
  .facility-logo { width: 25.8vw; }
  .facility-actions { gap: 3.5vw; }
  .members-link, .language-toggle { min-width: 0; }
  .members-link { font-size: 2.7vw; }
  .members-link svg { width: 5.2vw; height: 6.1vw; stroke-width: 2; margin-bottom: .3vw; }
  .language-toggle svg { width: 6.5vw; height: 6.5vw; margin-bottom: .8vw; }
  .language-toggle span { font-size: 2.5vw; }
  .hamburger { width: 7.2vw; height: 12vw; gap: 1.6vw; }
  .hamburger span { width: 7.2vw; height: .7vw; }
  .magazine-header { border-top-width: 1.25vw; }
  .magazine-brand-row { height: 12.8vw; }
  .magazine-brand-row > a { width: 57vw; margin-left: 0; }
  .magazine-menu-toggle { left: 2.8vw; width: 7.4vw; min-height: 10vw; gap: 1.6vw; }
  .magazine-menu-toggle span { font-size: 2.05vw; }
  .magazine-menu-toggle i { width: 7.4vw; height: .48vw; }
  .magazine-categories { height: 11vw; padding-inline: 3.8vw; justify-content: space-between; gap: 0; border-top-width: .25vw; }
  .magazine-categories > a { font-size: 3.6vw; letter-spacing: .05em; }
  .date-number { font-size: 4.9vw; }
  .date-weekday { font-size: 2.5vw; }
  .sns-area { height: 18.2vw; padding-top: 2.8vw; border-top-width: .35vw; }
  .sns-area img { width: 8vw; height: 8vw; }
  .site-footer .inner { padding-inline: 2.6vw; }
/*
  .footerMenu { padding: 5.8vw 0 0; }
  .footerLink { padding: 0 3vw 5.6vw; }
  .footerLink ul { gap: 3.7vw 0; }
  .footerLink li { padding-inline: 1.7vw; font-size: 3.15vw; line-height: 1.2; }
  .footerWrap { display: block; }
  .footerUnit { padding: 7.5vw 0 5vw; }
  .footerUnit + .footerUnit { border-top: 1px solid #555; padding-top: 7.5vw; }
  .footerLogoUrban { width: 51vw; margin-bottom: 9vw; }
  .footerLogoRayard { width: 34vw; margin: 0 auto 10vw; }
  .footerNav { gap: 6vw; padding-inline: 10vw 4vw; }
  .footerNav dt { font-size: 3.85vw; line-height: 1.5; margin-bottom: 4.2vw; }
  .footerNav dd { margin-bottom: 6.3vw; }
  .footerNav ul li { font-size: 3.05vw; padding-left: 2vw; margin-bottom: 3.8vw; line-height: 1.5; }
  .footerNav li:before { border-block-width: .55vw; border-left-width: .75vw; }
  .footerNavRayard { grid-template-columns: 1fr 1fr; gap: 6vw; padding-bottom: 2vw; }
  .footerNavRayard ul li { white-space: nowrap; }
  .footerBanner { padding: 5vw 0 4vw; }
  .footerBanner01 { grid-template-columns: 1fr 1fr; gap: 2.4vw 2.6vw; }
  .footerBanner02 { flex-direction: column; gap: 4vw; padding-top: 4vw; }
  .footerBanner02 li:first-child { width: 94vw; }
  .footerBanner02 li:last-child { width: 41vw; }
  .footerCopyright { font-size: 3vw; padding: 3.6vw 0; line-height: 1.5; }
  .footerCopyright .forSP { display: block; }
*/
  .utility-links { width: 15.4vw; max-width: 66px; }
  .utility-links a { height: 15.4vw; max-height: 66px; }
  .back-top { font-size: 2.6vw; }
  .back-top span:first-child { font-size: 9vw; height: 8vw; }
  .point-link { font-size: 3vw; }
  .point-link svg { width: 7.8vw; height: 7.8vw; }
  dialog { width: calc(100% - 24px); }
  .menu-dialog h2 { font-size: 16px; }
  .dialog-close { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

/* 2026-09-09 supplied SP/PC artwork. Coordinates refer to each source artboard. */
.reference-section { margin: 0; }
.reference-art { position: relative; width: 100%; margin-inline: auto; container-type: inline-size; }
.reference-art picture { display: block; }
.reference-art picture img { width: 100%; height: auto; }
.reference-art .cloud-navigation { display: contents; }
.reference-art .art-control { position: absolute; display: block; left: var(--pc-x); top: var(--pc-y); width: var(--pc-w); height: var(--pc-h); min-width: 24px; min-height: 24px; margin: 0; padding: 0; background: transparent; }
.reference-art .cloud-navigation a:last-child { width: var(--pc-w); margin: 0; }
.bus-route-copy { position: absolute; left: 54%; top: 48.95%; width: 43%; height: 5.7%; background: #fff; color: #9497c7; font-family: Meiryo, "Yu Gothic", sans-serif; font-size: 2.35cqw; font-weight: 700; line-height: 1.5; letter-spacing: .025em; }
.bus-route-copy p + p { margin-top: .3cqw; }
@media (max-width: 760px) {
 .reference-art .art-control { left: var(--sp-x); top: var(--sp-y); width: var(--sp-w); height: var(--sp-h); }
 .reference-art .cloud-navigation a:last-child { width: var(--sp-w); }
 .bus-route-copy { left: 13%; top: 60.7%; width: 83%; height: 4.9%; font-size: 4.7cqw; }
 .bus-route-copy p + p { margin-top: .65cqw; }
}

/* Original bus route artwork, restored per the revision email. */
.bus-route-copy img { display: block; width: 100%; height: auto; }



