/* 既存の画像用ul・liの余白を引き継がず、昼夜とも同じセル寸法を保つため。 */
.fix_footer .SpFixedBottomCTA,
.fix_footer .PcFixedBottomCTA {
  width: 100%;
  box-sizing: border-box;
  border: 0;
}
.fix_footer .SpFixedBottomCTA { height: 64px; }
.fix_footer .PcFixedBottomCTA { height: 92px; }
.fix_footer .is-sp-cta-target-visible { display: none; }
.fix_footer .column-cta-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  gap: 0;
}
.fix_footer .column-cta-cell { min-width: 0; }
.fix_footer .column-cta-cell + .column-cta-cell { border-left: 1px solid #E0E0E0; }
.fix_footer .column-cta-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  gap: 2px;
  margin: 0;
  padding: 4px 2px;
  border: 0;
  border-radius: 0;
  font-family: inherit;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}
.fix_footer .column-cta-button:hover,
.fix_footer .column-cta-button:active { opacity: 1; }
/* テーマ共通のリンクの0.8sの変化で、読み込み直後に夜間の色から昼の色へフェードして見えないようにするため。 */
.fix_footer .column-cta-button,
.header-action-link .column-header-phone,
.header-slide-tel .column-header-phone { transition: none; }
.fix_footer .column-cta-icon {
  display: block;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
}
.fix_footer .column-cta-label { font-size: 10px; }
/* コラムは日中も夜間も、電話番号と受付時間を表示する（#505 10/21再訂正の4）。 */
.fix_footer .column-cta-hours { font-size: 9px; line-height: 12px; }
.fix_footer .PcFixedBottomCTA .column-cta-button { gap: 4px; }
.fix_footer .PcFixedBottomCTA .column-cta-caption { font-size: clamp(9px, 1.2vw, 14px); }
.fix_footer .PcFixedBottomCTA .column-cta-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.fix_footer .PcFixedBottomCTA .column-cta-label { font-size: clamp(14px, 2vw, 24px); }
.fix_footer .PcFixedBottomCTA .column-cta-icon { width: 40px; height: 40px; }
.fix_footer [data-sp-cta-phone].is-cta-day { background: #C8102E; color: #FFFFFF; }
.fix_footer [data-sp-cta-phone].is-cta-night,
.fix_footer [data-sp-cta-phone].is-cta-night:hover,
.fix_footer [data-sp-cta-phone].is-cta-night:active {
  background: #F5F5F5;
  color: #9E9E9E;
  cursor: default;
  box-shadow: none;
  transition: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.fix_footer [data-sp-cta-form] { background: #FFFFFF; color: #B45309; }
.fix_footer [data-sp-cta-line].is-cta-day { background: #FFFFFF; color: #333333; }
.fix_footer [data-sp-cta-line].is-cta-day svg { color: #06C755; }
.fix_footer [data-sp-cta-line].is-cta-night { background: #06C755; color: #FFFFFF; }

/* 画像と同じ比率と幅を使い、メニュー内の既存ボタンの配置を維持するため。 */
.header-action-link .column-header-phone,
.header-slide-tel .column-header-phone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  gap: 3%;
  padding: 0;
  background: #C8102E;
  color: #FFFFFF;
  font-family: inherit;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
}
.header-action-link .column-header-phone {
  width: 90%;
  aspect-ratio: 580 / 90;
  margin-bottom: 1rem;
}
.header-slide-tel .column-header-phone {
  width: 100%;
  aspect-ratio: 920 / 160;
}
.column-header-phone .column-header-phone-label { font-size: clamp(14px, 5vw, 26px); }
.column-header-phone .column-header-phone-hours {
  display: block;
  font-size: clamp(8px, 2.5vw, 12px);
}
.header-action-link .column-header-phone svg,
.header-slide-tel .column-header-phone svg { width: 9%; height: auto; max-width: 32px; }
.header-action-link .column-header-phone.is-business-hours-phone-disabled,
.header-slide-tel .column-header-phone.is-business-hours-phone-disabled {
  background: #F5F5F5;
  color: #9E9E9E;
}
@media screen and (min-width: 768px) {
  .header-action-link .column-header-phone { width: 100%; margin: 0; }
}

/* PC と判定したブラウザでも、幅が狭いときは SP の寸法と文言で出すため（#505 10/31 差し戻し）。
   境目の 640px は、案内シートの SP／PC の切り替え（business-hours-phone.css）と同じ値。
   2つの条件は「(min-width: 640px)」とその否定にする。max-width: 639px と min-width: 640px の組だと、
   表示倍率などで幅が 639.5px のような小数になったときにどちらにも当たらず、SP と PC が両方出る（11/2 差し戻し）。
   PC 側は display を指定し直さない（JS が付ける is-sp-cta-target-visible の非表示より強くしないため）。 */
@media not all and (min-width: 640px) {
  .fix_footer .SpFixedBottomCTA[data-cta-narrow-only] ~ .PcFixedBottomCTA { display: none; }
}
@media (min-width: 640px) {
  .fix_footer .SpFixedBottomCTA[data-cta-narrow-only] { display: none; }
}
