/*
 * サイト共通CTA
 * ページ移動を表すリンクだけに cta-move / cta-back を付ける。
 * 電話、固定連絡バー、カレンダー、開閉ボタンには矢印を付けない。
 */
.cta-move,
.cta-back {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 12px 48px;
  border-radius: 999px;
  font-weight: 900;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
}

/* 文言を中央に保ったまま、移動方向を端の同じ位置に揃える。 */
.cta-move::after,
.cta-back::before {
  position: absolute;
  top: 50%;
  width: 1em;
  transform: translateY(-52%);
  font-size: 1.08em;
  font-weight: 900;
  line-height: 1;
}

.cta-move::after {
  content: "→";
  right: 21px;
  margin: 0;
}

.cta-back::before {
  content: "←";
  left: 21px;
}

/* 火災ページ旧指定の矢印位置を共通ルールへ一本化する。 */
.fire-btn.cta-move::after {
  margin-left: 0;
}

/* 予約ページのLINE導線も、ほかの主要CTAと同じ大きさで中央に置く。 */
.line-way .line-test-button.cta-move {
  display: flex;
  width: min(100%, 440px);
  margin: 18px auto 0;
}

/* 固定連絡バーは矢印CTAではない。3操作の高さと文字基準だけ揃える。 */
@media (max-width: 760px) {
  /* スマホヘッダーはメニューボタンを使う。共通CTAで予約ボタンを再表示しない。 */
  .site-header .header-cta {
    display: none;
  }

  body {
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
  }

  .cta-move,
  .cta-back {
    min-height: 52px;
    padding-right: 42px;
    padding-left: 42px;
  }

  .cta-move::after {
    right: 17px;
  }

  .cta-back::before {
    left: 17px;
  }

  .mobile-contact,
  .fire-mobile-contact {
    height: calc(64px + env(safe-area-inset-bottom));
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mobile-contact a,
  .fire-mobile-contact a {
    min-height: 64px;
    padding: 5px 4px;
    text-align: center;
  }

  .mobile-contact a b,
  .fire-mobile-contact a b {
    font-size: 14px;
    line-height: 1.05;
  }
}

@media (max-width: 360px) {
  .cta-move,
  .cta-back {
    padding-right: 37px;
    padding-left: 37px;
  }
}