/* トップページ（index.html）・メンテナンスページ（maintenance.html） */
h1{margin:10px 0 18px;font-size:clamp(20px,3.2vw,26px);line-height:1.5;color:var(--fs-blue);text-wrap:balance;font-weight:700}
.notice{text-align:center}
.notice p{margin:0 auto;max-width:40em;text-align:left}
.notice p.date{text-align:center}
.notice .head{text-align:center}
.notice .date{margin-top:20px;font-size:13px;color:var(--muted)}
h2{margin:0 0 14px;font-size:19px;font-weight:700;color:var(--ink);letter-spacing:.04em}

/* 公開中のページ一覧（トップページ） */
.links{display:grid;grid-template-columns:1fr;gap:12px}
.links a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;border:1px solid var(--line);border-radius:6px;background:var(--wash);color:var(--fs-blue);text-decoration:none;transition:border-color .15s,background .15s}
.links a:hover{border-color:var(--fs-blue);background:var(--paper)}
.links a:focus-visible{outline:3px solid var(--fs-orange);outline-offset:2px}
.links .t{display:block;font-weight:700;font-size:16px;line-height:1.5}
.links .d{display:block;font-family:var(--font-num);font-weight:600;font-size:13px;color:var(--muted);letter-spacing:.04em;margin-bottom:2px}
.links .u{display:block;font-size:12px;color:var(--muted);word-break:break-all;margin-top:2px}
.links .arrow{flex:none;width:32px;height:32px;border-radius:50%;background:var(--fs-blue);color:#fff;display:grid;place-items:center;font-size:15px}
.links a > span:first-child{min-width:0}
/* サービス稼働状況：共通 */
.links a.status{padding:24px 26px}
.links a.status .t{font-size:21px;margin-top:6px}
.s-desc{display:block;font-size:14px;line-height:1.6;margin-top:2px}
.s-badge{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.06em;padding:3px 10px;border-radius:999px}
.s-cta{flex:none;display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block}
/* サービス稼働状況：ブルー塗り */
.links a.status{border:2px solid var(--fs-blue)}
.s-badge{background:var(--fs-blue);color:#fff}
.dot{background:#3DDC84;box-shadow:0 0 0 3px rgba(61,220,132,.3);animation:pulse 2s ease-in-out infinite}
.links a.status .arrow{background:var(--fs-orange)}
@keyframes pulse{50%{box-shadow:0 0 0 6px rgba(61,220,132,0)}}
@media (max-width:520px){.links a.status{flex-direction:column;align-items:flex-start}}

/* トップページへのボタン（メンテナンスページ） */
.notice p.back{margin-top:28px;text-align:center}
.back a{display:inline-flex;align-items:center;gap:12px;padding:12px 14px 12px 24px;border:2px solid var(--fs-blue);border-radius:999px;background:var(--paper);color:var(--fs-blue);font-weight:700;text-decoration:none;transition:background .15s,color .15s}
.back a:hover{background:var(--fs-blue);color:#fff}
.back a:focus-visible{outline:3px solid var(--fs-orange);outline-offset:2px}
.back .arrow{flex:none;width:28px;height:28px;border-radius:50%;background:var(--fs-blue);color:#fff;display:grid;place-items:center;font-size:14px}
.back a:hover .arrow{background:#fff;color:var(--fs-blue)}

/* フッター（お問い合わせ電話番号） */
footer .wrap{padding-block:40px 32px}
footer h2{color:#fff;font-size:19px;margin-bottom:20px}
.tels{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.tel{background:var(--fs-blue-deep);border-radius:6px;padding:20px 22px}
.tel .who{font-weight:700;font-size:15px}
.tel .hours{font-size:13px;opacity:.85}
.tel .num{display:block;margin-top:6px;font-family:var(--font-num);font-weight:700;font-size:clamp(22px,3.4vw,26px);letter-spacing:.02em;line-height:1.2;color:#fff;text-decoration:none;font-variant-numeric:tabular-nums;user-select:all}
.tel .num:focus-visible{outline:3px solid var(--fs-orange);outline-offset:3px}
/* フッター（お問い合わせフォームへの導線） */
.tel-form{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.2)}
.tel-form-btn{flex:none;display:inline-flex;align-items:center;gap:10px;padding:8px 8px 8px 16px;border-radius:999px;background:#fff;color:var(--fs-blue);font-weight:700;font-size:14px;line-height:1.4;text-decoration:none;transition:background .15s,color .15s}
.tel-form-btn .ico{flex:none}
.tel-form-btn .arrow{flex:none;width:26px;height:26px;border-radius:50%;background:var(--fs-orange);color:#fff;display:grid;place-items:center;font-size:13px}
.tel-form-btn:hover{background:var(--wash)}
.tel-form-btn:focus-visible{outline:3px solid var(--fs-orange);outline-offset:3px}
.copy{margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.2);font-size:12px;opacity:.8;text-align:center}