/* =====================================================================
   footer.css — 共通フッター ＆ パンくず
   PC(>=1150px)=多列レイアウト / モバイル(<=1149px)=アコーディオン
   ===================================================================== */

/* ---------------- パンくず ---------------- */
.l-breadcrumb { background: var(--bg-default); margin-top: var(--space-64); }   /* パンくず上の余白＝64px（各セクションの下余白ではなくここで一元管理） */
.l-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-8);
  max-width: 1200px;
  margin-inline: auto;
  padding: var(--space-24) var(--space-24);
}
.l-breadcrumb li {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  font-size: 12px;
  line-height: 18px;
  letter-spacing: .04em;
  color: var(--text-default);
}
.l-breadcrumb li:not(:first-child)::before {
  content: "";
  width: 6px; height: 6px;
  border-top: 2px solid var(--text-default);
  border-right: 2px solid var(--text-default);
  transform: rotate(45deg);
  opacity: .55;
}
.l-breadcrumb a { display: inline-flex; align-items: center; gap: 5px; }
.l-breadcrumb a:hover { text-decoration: underline; }
.l-breadcrumb__home { width: 24px; height: 24px; flex: none; }
.l-breadcrumb [aria-current="page"] { color: var(--text-default); }

/* SP(<600px): パンくずをインラインフロー化。flex(リンク単位で折返し)をやめ、
   ひと続きのテキストとして流し、文字の途中でも改行されるようにする */
@media (max-width: 599px) {
  .l-breadcrumb ol {
    display: block;
    /* 折返し行を家アイコンの右（＝「ホーム」テキスト開始位置）に揃えるぶら下げインデント。
       hang = アイコン幅24px + アイコン〜文字間5px。1行目は負のtext-indentでアイコンを元の左端(24px)へ戻す */
    padding-left: calc(var(--space-24) + 24px + 5px);
    text-indent: calc(-24px - 5px);
  }
  .l-breadcrumb li { display: inline; }
  /* text-indent は継承されるため、inline-flex のリンク内で再適用され文字がアイコンに重なる。
     リンク内ではリセットして親のぶら下げインデントだけを効かせる */
  .l-breadcrumb a { text-indent: 0; }
  /* アイコン・区切り・各テキストの縦位置を中央で統一（現在ページのbaselineズレ対策） */
  .l-breadcrumb a,
  .l-breadcrumb [aria-current="page"] { vertical-align: middle; }
  .l-breadcrumb li:not(:first-child)::before {
    display: inline-block;
    margin: 0 var(--space-8);
    vertical-align: middle;
  }
}

/* ---------------- 共通 ---------------- */
.l-footer { background: var(--bg-default); }
.l-footer__pc { display: none; }
.f-col__head {
  font-size: 16px;
  line-height: 24px;
  font-weight: var(--fw-bold);
  color: var(--text-default);
}
a.f-col__head:hover { color: #211F1C; text-decoration: none; }

.l-footer__sns { display: flex; gap: var(--space-16); }
.l-footer__sns a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px; height: 48px;
  border-radius: var(--radius-full);
  background: var(--container-white-alfa);
  transition: background-color .2s ease;
}
.l-footer__sns a:hover { background: var(--container-white); }

.l-footer__tel {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  font-size: 20px;
  line-height: 34px;
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
  color: var(--text-default);
}
.l-footer__hours-label {
  margin-top: var(--space-8);
  font-size: 14px;
  line-height: 22px;
  font-weight: var(--fw-bold);
  color: var(--text-default);
}
.l-footer__hours {
  font-size: 12px;
  line-height: 18px;
  letter-spacing: .04em;
  color: var(--text-default);
}

/* コピーライト */
.l-footer__copyright {
  background: var(--container-level1);
  padding: var(--space-16);
  text-align: center;
}
.l-footer__copyright p {
  font-size: 12px;
  line-height: 18px;
  letter-spacing: .04em;
  color: var(--text-default);
}
.l-footer__org { text-decoration: underline; }
.l-footer__org:hover { color: var(--text-primary); }

/* ---------------- SP / タブレット（<=1149px） ---------------- */
.l-footer__sp {
  background: var(--container-level3);
  padding: var(--space-48) var(--space-24) var(--space-48);
}
.l-footer__sp-cta {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  margin-bottom: var(--space-24);
}
/* SPのサブリンクは1カラム（手数料・各ナビ） */
.l-footer__sp .l-nav-group__sub--1col { grid-template-columns: 1fr; }
.l-footer__sp .l-nav-group { border-color: var(--border-dark); }

.l-footer__sp-contact { padding-block: var(--space-40); }
.l-footer__sp-contact .f-col__head { margin-bottom: var(--space-16); }
.l-footer__sp-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-24);
  border-top: 1px solid var(--border-dark);
  padding-top: var(--space-64);
}
.l-footer__sp-brand .l-footer__logo img { height: 36px; width: auto; }

/* SPコピーライト: 上24 / 下64 */
@media (max-width: 1149px) {
  .l-footer__copyright { padding: var(--space-24) var(--space-16) var(--space-64); }
  .l-breadcrumb { margin-top: var(--space-40); }   /* SPはパンくず上40px（PCは64px） */
}

/* ---------------- PC（>=1150px） ---------------- */
@media (min-width: 1150px) {
  .l-footer__sp { display: none; }

  .l-footer__pc {
    display: block;
    background: var(--container-level3);
  }
  .l-footer__inner {
    max-width: 1200px;
    margin-inline: auto;
    padding: var(--space-80) var(--space-24);
  }

  .l-footer__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
  }
  .l-footer__pc .l-footer__logo img { height: 41px; width: auto; }

  .l-footer__content {
    display: flex;
    gap: var(--space-80);
    margin-top: var(--space-64);
    align-items: stretch;
  }
  .l-footer__navarea {
    display: flex;
    flex-direction: column;
    gap: var(--space-48);
    flex: 0 1 auto;
  }
  .l-footer__cols { display: flex; gap: var(--space-40); align-items: flex-start; }
  .f-col { display: flex; flex-direction: column; gap: var(--space-16); }
  .f-col--stack { gap: var(--space-40); }
  .f-col--stack > div { display: flex; flex-direction: column; gap: var(--space-16); }
  .f-col__list { display: flex; flex-direction: column; gap: var(--space-8); padding-left: var(--space-8); }
  .f-col__list a {
    font-size: 12px;
    line-height: 18px;
    letter-spacing: .04em;
    color: var(--text-default);
  }
  .f-col__list a:hover { color: #211F1C; text-decoration: none; }

  .l-footer__fee { display: flex; flex-direction: column; gap: var(--space-16); }
  .l-footer__fee-cols { padding-left: var(--space-8); }
  /* 手数料リンクは横4列・行優先（1 2 3 4 / 5 6 7 8） */
  .l-footer__fee-cols .f-col__list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-8) var(--space-16);
    padding-left: 0;
  }
  .l-footer__fee-cols .f-col__list a { font-size: 12px; line-height: 18px; }

  .l-footer__divider { width: 1px; align-self: stretch; background: var(--border-default); flex: none; }

  .l-footer__contact {
    flex: 1 1 0;
    min-width: 320px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: var(--space-40);
  }
  .l-footer__ctagroup { display: flex; flex-direction: column; gap: var(--space-16); }
}

/* ---------------- SP フロートCTA ---------------- */
.l-float-cta {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 80; /* ドロワー(90)より下・ページ内容より上 */
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--space-24);
  background: rgba(255, 255, 255, 0.64);
  transform: translateY(110%); /* 既定は画面外（下）へ退避 */
  transition: transform .3s ease;
}
.l-float-cta.is-visible { transform: translateY(0); } /* 下からスライドイン */

/* ドラッグ用ハンドル（フレーム上端から8px・横中央）。下スワイプ/枠タップで隠す目印 */
.l-float-cta__handle {
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 46px;
  height: 8px;
  border-radius: 9999px;
  background: #ABA9A7;
}

/* PCでは非表示 */
@media (min-width: 1150px) {
  .l-float-cta { display: none; }
}