*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:#efe6d6;color:#2a241c;font-family:Georgia,serif;line-height:1.7}
.face{width:min(420px,92vw);margin:24px auto 8px;aspect-ratio:1;border-radius:50%;background:#f7f1e6;border:14px solid #2a241c;position:relative;box-shadow:inset 0 0 0 8px #c4a574}
.face a{position:absolute;width:88px;text-align:center;text-decoration:none;color:#2a241c;font-family:"Trebuchet MS",sans-serif;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.face a.on{color:#8a3b12;font-weight:700}
.face a:nth-child(1){top:18px;left:50%;transform:translateX(-50%)}
.face a:nth-child(2){right:16px;top:50%;transform:translateY(-50%)}
.face a:nth-child(3){bottom:18px;left:50%;transform:translateX(-50%)}
.face a:nth-child(4){left:16px;top:50%;transform:translateY(-50%)}
.hub{position:absolute;inset:34%;border-radius:50%;background:#2a241c;color:#f7f1e6;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.85rem}
.hour{max-width:680px;margin:0 auto;padding:12px 20px 56px}
h1{font-size:clamp(1.5rem,3.2vw,2.1rem);line-height:1.2;margin:8px 0 12px}
h2{font-size:.95rem;margin:20px 0 8px}
p,li{margin:0 0 12px}
ul{margin:0 0 12px 1.1em}
img{width:100%;height:auto;display:block;margin:12px 0}
.cap{color:#6e6254;font-size:.84rem;margin:-4px 0 14px}
table{width:100%;border-collapse:collapse;margin:8px 0 16px;font-size:.92rem;background:#f7f1e6}
td{border-bottom:1px solid #e0d3bc;padding:7px 6px}
td:first-child{width:7em}
.end{color:#6e6254;font-size:.88rem}
@media(max-width:520px){.face a{width:70px;font-size:.64rem}}