@charset "UTF-8";

/* ==========================================
   フッター
   XD: 01_TOP_SP の footer（375px・高さ 562）、01_TOP_PC の footer（1366px・高さ 351）
   y は footer の上端からの値。文字の行の上端は「ベースライン − 13.5」（16px・line-height 16px）などで置く
   ========================================== */
.footer {
  box-sizing: border-box;
  padding: 30px 14px 24px; /* XD SP: ロゴ y=30・x=14.21、コピーライト y=522 h=16 → 下端 538（高さ 562） */
  font-family: var(--font-ja);
  font-size: 16px;
  font-weight: 500;
  color: var(--color-text);
  background-color: var(--color-white);
}

.footer__top {
  display: flex;
  flex-direction: column;
}

.footer__logo {
  display: block;
  width: 202.08px; /* XD: ロゴ w=202.08 h=34.71（SP・PC 共通） */
  height: auto;
}

.footer__address {
  /* XD SP: 住所の 1 行目のベースライン y=109（行の高さ 27 → 行の上端 90）。ロゴの下端 64.71 から 25.29 */
  margin: 25.29px 0 0;
  font-style: normal;
  line-height: 1.6875; /* 27px ÷ 16px */
}

.footer__address-location,
.footer__address-line {
  display: block;
}

.footer__address-tel {
  /* XD SP: TEL のベースライン y=182（住所の 2 行目 136 から 46 ＝ 27 ＋ 19） */
  display: block;
  margin-top: 19px;
}

.footer__nav {
  display: flex;
  flex-direction: column;
  gap: 13px; /* XD SP: 項目の間隔 29（行の高さ 16 ＋ 13）。最初のベースライン y=255 → 行の上端 241.5 */
  margin: 25px 0 0;
}

.footer__nav-item--access {
  /* XD SP: アクセス（y=357）がお知らせ（y=386）の前。DOM はお知らせが先（PC の並び） */
  order: 1;
}

.footer__nav-item--news {
  order: 2;
}

.footer__nav-link {
  display: block;
  font-weight: 700;
  line-height: 1; /* 16px ÷ 16px */
  letter-spacing: 0.05em; /* XD: 50 ＝ 0.8px */
  color: var(--color-text);
  transition: color 0.3s ease;
}

@media (any-hover: hover) {
  .footer__nav-link:hover {
    color: var(--color-main);
  }
}

.footer__sns {
  /* XD SP: 円 x=172・241・309 y=432 w=50（右端 359）。間隔は 18.5 */
  display: flex;
  gap: 18.5px;
  justify-content: flex-end;
  margin: 29px 2px 0 0;
}

.footer__sns-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--color-white);
  box-shadow: var(--shadow-card);
  transition: background-color 0.3s ease;
}

@media (any-hover: hover) {
  .footer__sns-icon:hover {
    background-color: var(--color-main);
  }
}

.footer__sns-icon img {
  width: 25px; /* XD: 画像 25×25（円の中央） */
  height: 25px;
}

.footer__bottom {
  /* XD SP: コピーライト y=522（SNS の下端 482 から 40）。Archivo Narrow 12px・行の高さ 16・字間 50（0.6px）・中央 */
  margin-top: 40px;
  text-align: center;
}

.footer__copyright {
  margin: 0;
  font-family: var(--font-en);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3334; /* 16px ÷ 12px（切り上げて 16px ちょうどにする） */
  letter-spacing: 0.05em;
}

@media (width >= 768px) {
  .footer {
    padding: 80px 16px 30px; /* XD PC: ロゴ y=80、コピーライト y=305 h=16 → 下端 321（高さ 351） */
  }

  .footer__top {
    /* XD PC: 中身は x=203〜1163（幅 960）。ロゴ x=203.21、SNS の右端 1163 */
    flex-direction: row;
    gap: 24px;
    align-items: flex-start;
    justify-content: space-between;
    max-width: 960px; /* --content-width と同じ */
    margin: 0 auto;
  }

  .footer__left {
    /* 狭い幅（768px 付近）でナビを折り返し、住所は縮めない */
    flex-shrink: 0;
  }

  .footer__address {
    /* XD PC: 住所のベースライン y=174（行の上端 155）。ロゴの下端 114.71 から 40.29 */
    margin-top: 40.29px;
  }

  .footer__right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }

  .footer__nav {
    /* XD PC: ナビは横 1 列。x=592・659・794・878・1013・1097（項目の間 約 18）、ベースライン y=94（行の上端 80.5） */
    flex-flow: row wrap;
    gap: 13px clamp(8px, 2.2vw - 12.86px, 17.2px); /* 項目の幅は字間の末尾 0.8px を含む。XD の x の間隔から 16.8〜17.4 */
    justify-content: flex-end;
    margin: 1px -1.2px 0 0; /* XD PC: アクセスの右端 1164.2 */
  }

  .footer__nav-item--access,
  .footer__nav-item--news {
    order: 0;
  }

  .footer__sns {
    /* XD PC: 円 x=976・1045・1113 y=226 */
    margin: 129.5px 0 0;
  }

  .footer__bottom {
    /* XD PC: 住所の下端 282 → コピーライト y=305 */
    margin-top: 23px;
  }
}