/* =========================================================
   フッター
   ========================================================= */
.footer {
  background: var(--bg);
  padding: 78px var(--gutter) 49px;
}
.footer__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  flex-wrap: wrap;
}
.footer__logo img { width: 244px; height: 59px; object-fit: contain; }
.footer__nav ul {
  display: flex;
  align-items: center;
  gap: 35px;
  font-size: 16px;
  font-weight: 700;
  color: var(--main);
  flex-wrap: wrap;
}
.footer__nav a { transition: opacity .2s; }
.footer__nav a:hover { opacity: .6; }

/* コピーライトはコンテンツ幅の中央、リンクは右端 */
.footer__bottom {
  margin-top: 117px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 24px;
}
.footer__copy { grid-column: 2; font-size: 14px; line-height: 1.5; text-align: center; }
.footer__links { grid-column: 3; justify-self: end; display: flex; gap: 28px; white-space: nowrap; }
.footer__links a {
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.footer__links a:hover { opacity: .6; }

/* ---- Responsive ---- */
/* 1140px 以下はリンクとコピーライトが横に並ぶと重なるため、
   リンクを上・コピーライトを下に中央揃えで縦積み */
@media (max-width: 1140px) {
  .footer__bottom {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: 18px;
  }
  .footer__links { justify-content: center; flex-wrap: wrap; white-space: normal; }
}

@media (max-width: 768px) {
  .footer { padding: 48px var(--gutter) 40px; }
  .footer__top { flex-direction: column; align-items: center; gap: 24px; }
  .footer__nav ul { justify-content: center; gap: 20px 28px; }
  .footer__bottom { margin-top: 40px; }
  .footer__links { gap: 18px; }
}
