@charset "UTF-8";
/* =========================================================
   fs-cta.css — 追従の予約ボタン（本番再現）
   マークアップは inc/clean-parts.php の hayashi_clean_cta()。全モードで読む。
   PC：画面右端に縦書きのタブを縦並び（電話予約＝濃茶／WEB予約＝ベージュ）
   SP：画面下端に全幅の横並び（高さ 60px）
   ※ 本番にはページトップボタンが無いため置かない。
   ========================================================= */
.fs-fixcta { position: fixed; right: 0; bottom: 10%; z-index: 900; opacity: .9; font-size: 0; }
.fs-fixcta ul { display: flex; flex-direction: column; width: 100%; }
.fs-fixcta li {
  writing-mode: vertical-rl; text-orientation: upright;
  margin: 0; padding: 40px 8px; font-size: 14px; border-right: 1px solid var(--fs-white);
}
.fs-fixcta li.is-tel, .fs-fixcta li:first-child { background: var(--fs-cta-tel); }
.fs-fixcta li.is-web, .fs-fixcta li:last-child { background: var(--fs-cta-web); }
.fs-fixcta li.is-line { background: var(--fs-line-color); }
.fs-fixcta a {
  display: block; width: 100%; padding: 10px; text-align: center;
  font-weight: 700; color: var(--fs-cta-label);
}

/* SP：下部固定バー。フッター側に padding-bottom を確保してあるので body は触らない */
@media screen and (max-width: 600px) {
  .fs-fixcta { right: 0; left: 0; width: 100%; height: 60px; bottom: 0; }
  .fs-fixcta ul { flex-direction: row; height: 100%; }
  .fs-fixcta li {
    width: 50%; padding: 0; border-right: none; border-bottom: 1px solid var(--fs-white);
    display: flex; justify-content: center; align-items: center; writing-mode: horizontal-tb;
  }
  .fs-fixcta a { padding: 0; line-height: 1.4; }
}