@charset "UTF-8";
/* =========================================================
   fs-cta.css — 追従の予約ボタン（WEB予約／LINE予約）＋ページトップ
   マークアップは inc/clean-parts.php の otsukyo_clean_cta()。全モードで読む。
   本番に合わせ PC は右端の縦書きタブ、SP は画面下部の横並びバー。
   ========================================================= */
.fixed-reservation-buttons { position: fixed; right: 0; top: 34%; z-index: 1100; display: flex; flex-direction: column; gap: 4px; }
.fixed-reservation-buttons .reservation-button {
  writing-mode: vertical-rl; text-orientation: upright;
  display: flex; align-items: center; justify-content: center;
  padding: 26px 13px; font-size: 14px; letter-spacing: .28em;
  color: var(--fs-white); background: var(--fs-rail-line);
  box-shadow: 0 2px 8px rgba(0,0,0,.14); transition: filter .2s, transform .2s;
}
.fixed-reservation-buttons .reservation-button:hover { filter: brightness(1.07); transform: translateX(-3px); }
.fixed-reservation-buttons .reservation-button.web  { background: var(--fs-rail-web); }
.fixed-reservation-buttons .reservation-button.line { background: var(--fs-rail-line); }
.fixed-reservation-buttons .reservation-button.tel  { background: var(--fs-tel-bg); }
/* 本番の縦タブにアイコンは無い */
.fixed-reservation-buttons .reservation-button i { display: none; }

/* ページトップへ戻る（400px スクロールで表示：fs-theme.js） */
.fs-pagetop { position: fixed; right: 20px; bottom: 88px; z-index: 1050; width: 44px; height: 44px; border-radius: 50%; background: var(--fs-primary); color: var(--fs-white); display: flex; align-items: center; justify-content: center; font-size: 16px; box-shadow: 0 4px 12px rgba(0,0,0,.25); transition: filter .2s, transform .2s; }
.fs-pagetop[hidden] { display: none; }
.fs-pagetop:hover { filter: brightness(1.1); transform: translateY(-2px); }

@media screen and (max-width: 768px) {
  .fixed-reservation-buttons { right: 0; left: 0; top: auto; bottom: 0; flex-direction: row; gap: 0; }
  .fixed-reservation-buttons .reservation-button {
    writing-mode: horizontal-tb; text-orientation: mixed;
    flex: 1; min-width: 0; justify-content: center; font-size: 14px; letter-spacing: .08em;
    padding: 14px 4px; box-shadow: none; min-height: 48px;
  }
  .fixed-reservation-buttons .reservation-button:hover { transform: none; }
  .fs-pagetop { left: 12px; right: auto; bottom: 62px; width: 42px; height: 42px; }
  body { padding-bottom: 48px; } /* 下部固定CTAの分、フッターが隠れないように */
}