.footer { padding: 56px 0 40px; background: var(--panel); text-align: center; }
.footer__nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin-top: 28px; font-size: 14px; }
.footer__nav a { transition: color .3s; }
@media (hover: hover) { .footer__nav a:hover { color: var(--accent); } }
.footer__copy { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 24px; margin-top: 36px; font-size: 13px; color: var(--ink-sub); }
.footer__copy a { text-decoration: underline; text-underline-offset: 3px; }

/* スマホの画面下に出る予約のボタン */
.bar { display: none; }
@media (max-width: 767px) {
  .footer { padding-bottom: 108px; }
  .footer__nav { gap: 6px 20px; }
  .bar { position: fixed; left: 0; bottom: 0; z-index: 800; display: grid; grid-template-columns: 1fr 1.25fr; gap: 10px; width: 100%; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: rgb(255 255 255 / .94); box-shadow: 0 -2px 16px rgb(47 59 57 / .08); transform: translateY(110%); transition: transform .45s var(--ease); }
  .bar.is-show { transform: none; }
  .is-menuopen .bar { transform: translateY(110%); }
  .bar__btn { display: flex; align-items: center; justify-content: center; height: 52px; border: 1.5px solid var(--accent); border-radius: 12px; font-size: 15px; font-weight: 700; letter-spacing: .06em; color: var(--accent); white-space: nowrap; }
  .bar__btn svg { width: 20px; height: 20px; margin-right: 8px; }
  .bar__btn--line { background: var(--accent); color: var(--on-dark); }
}