
/* フッター：サービス紹介＋会社情報＋リンク（会社ホームページへ）
   記事ページは移管元CSSの p/a 指定が残るので、.foot から書いて余白・色を明示する */
.foot{background:var(--accent,#007B6A);color:#FFFFFF;padding-block:56px 0}
.foot .foot-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) minmax(0,.9fr);gap:40px;align-items:start}
.foot .foot-logo{display:inline-flex;align-items:center;gap:10px;font-size:20px;font-weight:700;color:#FFFFFF;text-decoration:none}
.foot .foot-logo b{display:grid;place-items:center;width:36px;height:36px;border-radius:8px;background:#FFFFFF;color:var(--accent,#007B6A);font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:13px}
.foot .foot-brand p{margin:14px 0 0;font-size:14px;line-height:1.8;color:#D2ECE3}
.foot .foot-cta{display:inline-flex;margin-top:18px;padding:10px 20px;border-radius:999px;background:#FFFFFF;color:var(--accent,#007B6A);font-weight:700;font-size:14px;text-decoration:none}
.foot .foot-co{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 18px;margin:0;font-size:14px;line-height:1.7}
.foot .foot-co dt{color:#D2ECE3;font-size:13px;white-space:nowrap}
.foot .foot-co dd{margin:0;color:#FFFFFF}
.foot .foot-co a{color:#FFFFFF;text-decoration:underline;text-underline-offset:3px}
.foot .foot-links{display:grid;gap:22px;font-size:14px}
.foot .foot-col{display:grid;gap:4px;align-content:start}
.foot .foot-col p{margin:0 0 4px;font-size:12px;font-weight:700;letter-spacing:.08em;color:#D2ECE3}
.foot .foot-col a{display:block;padding:4px 0;color:#FFFFFF;text-decoration:none;line-height:1.6}
.foot .foot-col a:hover{text-decoration:underline}
.foot .foot-bottom{margin-top:44px;padding-block:18px;border-top:1px solid rgba(255,255,255,.22);font-size:12px;color:#D2ECE3}
@media (max-width:900px){.foot .foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.foot .foot-brand{grid-column:1 / -1}}
@media (max-width:600px){
  .foot{padding-top:40px}
  .foot .foot-grid{grid-template-columns:minmax(0,1fr);gap:24px}
  /* スマホは直前に申込ボタン（下部固定ボタン・記事末の案内）があるので、フッター内のボタンは出さない */
  .foot .foot-cta{display:none}
  /* 会社情報は線で区切った表にする（項目名は左に細く、中身を右に） */
  .foot .foot-co{grid-template-columns:5.6em minmax(0,1fr);gap:0;border-top:1px solid rgba(255,255,255,.22);font-size:13.5px}
  .foot .foot-co dt,.foot .foot-co dd{padding-block:9px;border-bottom:1px solid rgba(255,255,255,.22)}
  .foot .foot-co dt{font-size:12px;white-space:normal;line-height:1.9}
  /* リンクは「サイト」「会社情報」を左右2列に */
  .foot .foot-links{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:16px}
  .foot .foot-col a{padding:7px 0;font-size:13.5px}
  .foot .foot-bottom{margin-top:32px}
}
/* 幅360px以下：リンク名が途中で折れないよう、会社情報側の列を広げて文字を少し小さく */
@media (max-width:360px){
  .foot .foot-co{grid-template-columns:6.4em minmax(0,1fr);font-size:13px}
  .foot .foot-links{grid-template-columns:minmax(0,.75fr) minmax(0,1.4fr);gap:12px}
  .foot .foot-col a{font-size:12.5px}
}
