@charset "UTF-8";
/* 画面下の固定の帯（include/_fix_cta.twig・T118・参考: kinoto）。全ページで読む（layout/_00_base.twig）。
   電話・オンライン相談・モデルハウス見学・資料請求・Instagram・LINE を PC・SP とも 1 行に並べる。fix-cta- 系のクラスだけに書く。
   重なり順: ヘッダー（900）・PC 右上のメニューボタン（1100）・SP のメニュー（999）・PC のメニュー（10000）・動画などのポップアップ（1042〜）より下 */

.fix-cta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 800; background: #F3EFE9; border-top: 1px solid #e3dbd0; transition: transform 0.4s ease; }
/* 最初の画面では隠す（.is-hidden は _fix_cta.twig の JS が付け外しする）。隠れていてもキーボードで帯の中に移ったときは出す（画面外のリンクにフォーカスが残らないように） */
.fix-cta.is-hidden { transform: translateY(100%); }
.fix-cta.is-hidden:focus-within { transform: none; }
.fix-cta-list { display: flex; max-width: 1280px; margin: 0 auto; padding: 0; list-style: none; }
.fix-cta-item { flex: 1 1 0; min-width: 0; }
.fix-cta-item + .fix-cta-item { border-left: 1px solid #e3dbd0; }
.fix-cta-item a { display: flex; align-items: center; justify-content: center; gap: 10px; height: 64px; padding: 0 8px; color: #3b2f26; font-size: 14px; letter-spacing: 0.08em; line-height: 1.3; text-decoration: none; transition: background-color 0.2s, color 0.2s; }
.fix-cta-item a:hover { background: #fff; color: #602600; text-decoration: none; opacity: 1; }
.fix-cta-icon { flex: none; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.fix-cta-dot { fill: currentColor; stroke: none; }
.fix-cta-item--tel .fix-cta-label { font-family: "Barlow", sans-serif; font-size: 17px; letter-spacing: 0.06em; }
.fix-cta-sub { display: block; font-size: 11px; letter-spacing: 0.06em; color: #7b6d61; }
/* 狭い幅だけで改行する（決めた位置でだけ折り返し、語の途中では割らない） */
.fix-cta-br { display: none; }
.fix-cta-label { word-break: keep-all; overflow-wrap: normal; }
/* ページの末尾（フッター）が帯に隠れないよう、帯の高さぶんの余白をフッターの後に置く */
.fix-cta-spacer { height: 64px; }

/* 1200px 以下: アイコンの上・文字の下に並べ、決めた位置で 2 行にする（横並びのままだと 768〜880px で電話の欄が 4 行になり枠からはみ出し、
   1101〜1140px では「モデルハウス見学予約」が区切り線にかかった・T118 G2 軽微 2 と差分確認 軽微 1）。営業時間は省く */
@media screen and (max-width: 1200px) {
  .fix-cta-br { display: inline; }
  .fix-cta-item a { flex-direction: column; gap: 3px; padding: 0 4px; font-size: 12px; letter-spacing: 0.02em; text-align: center; }
  .fix-cta-icon { width: 22px; height: 22px; }
  .fix-cta-item--tel .fix-cta-label { font-size: 13px; letter-spacing: 0.02em; }
  .fix-cta-sub { display: none; }
}

/* 767px 以下: 6 つを 1 行（アイコンの下に 2 行までの文字）。
   iPhone のホームバーの余白（env(safe-area-inset-bottom)）は使わない。viewport に viewport-fit=cover を付けていないため値は常に 0 で、
   Safari は固定要素をホームバーより上に置く（T118 G2 軽微 4） */
@media screen and (max-width: 767px) {
  .fix-cta-item a { height: 66px; padding: 0 2px; font-size: 10px; letter-spacing: 0; line-height: 1.3; }
  .fix-cta-item--tel .fix-cta-label { font-size: 11px; }
  .fix-cta-spacer { height: 66px; }
}
/* 389px 以下（iPhone SE・mini・Android の 360px など）: 「モデルハウス」（6 文字）が 1 行に収まるよう、文字の大きさは 10px のまま左右の余白と字間を詰める
   （375px で語の途中で割れた・T118 G2 軽微 1。9px は読みにくい・差分確認 軽微 2）。359px 以下（320px など）だけ 9px */
@media screen and (max-width: 389px) {
  .fix-cta-item a { padding: 0; letter-spacing: -0.05em; }
  .fix-cta-item--tel .fix-cta-label { letter-spacing: -0.02em; }
}
@media screen and (max-width: 359px) {
  .fix-cta-item a { font-size: 9px; letter-spacing: -0.04em; }
  .fix-cta-item--tel .fix-cta-label { font-size: 10px; letter-spacing: 0; }
}
/* 幅 1200px 以下で高さ 450px 以下（スマホの横向き、旧い Android のブラウザでキーボードを開いたとき）は出さない。
   タブレットは JS が viewport を width=1280 に固定する（layout/_00_base.twig）ので対象外（旧 PC 右端の固定ボタンと同じく出る）。
   旧 SP の固定フッター（common.css「andoroidのフォーム対策」）と同じ扱い（T118 G2 軽微 5）。
   低い PC のウィンドウ（開発者ツールを下に開いたときなど）では出す（旧 PC 右端の固定ボタンも消えなかった・差分確認 軽微 3） */
@media screen and (max-height: 450px) and (max-width: 1200px) {
  .fix-cta, .fix-cta-spacer { display: none; }
}