/* ===== Contact + Footer（Figma 14511:48066）1440×1074 / bg-inverse / 上角r65 / pt140 px120 pb100 / gap80 ===== */
.contact-footer{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-under-h2);width:100%;padding:140px var(--pad-side) var(--sp-under-btn2);background:var(--c-bg-inverse);border-radius:var(--r-l) var(--r-l) 0 0;overflow:hidden;color:var(--c-inverse)}
.contact{display:flex;align-items:flex-start;gap:var(--sp-under-btn2);width:100%;padding:0 40px}
.contact__main{display:flex;flex-direction:column;align-items:flex-start;gap:56px;flex:1 0 0;min-width:1px}
.contact .sec-title__label{color:var(--c-inverse)}
.contact__en{font-size:110px;color:var(--c-inverse)}
.contact__text{width:100%;font-size:var(--fs-body-m);font-weight:400;line-height:2;letter-spacing:.16px}
.contact__side{display:flex;flex-direction:column;align-items:flex-start;gap:24px;flex:none;width:520px}
.contact__btn{display:flex;align-items:center;gap:40px;width:100%;padding:25px 24px 25px 32px;background:var(--c-base);border-radius:var(--r-m);text-decoration:none}
.contact__btn-label{flex:1 0 0;min-width:1px;padding-bottom:1px;font-size:var(--fs-h5);font-weight:500;line-height:1.6;letter-spacing:.2px;color:var(--c-text-sub);white-space:nowrap}
.contact__btn-icon{display:flex;flex:none;padding:10px;background:var(--c-main);border-radius:3px;overflow:hidden} /* overflow は矢印が右へ抜けるホバー（A-5）用 */
.contact__btn-icon img{display:block;width:14px;height:14px}
.contact__tel{display:flex;flex-direction:column;align-items:flex-start;width:100%}
.contact__tel-head{display:flex;align-items:center;gap:12px;width:100%}
.contact__tel-head p{font-size:var(--fs-h5);font-weight:500;line-height:1.6;letter-spacing:.2px;white-space:nowrap}
.contact__tel-line{flex:1 0 0;min-width:1px;height:1px;background:#cdcdcd}
.contact__tel-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 0 20px}
.contact__tel-num{display:flex;align-items:center;gap:6px;color:var(--c-inverse);text-decoration:none}
.contact__tel-num img{display:block;width:40px;height:40px}
.contact__tel-num span{font-family:var(--font-en);font-weight:700;font-size:40px;line-height:1.2;white-space:nowrap;font-feature-settings:normal}
.contact__hours{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;padding:6px 16px;background:#354050;border-radius:var(--r-s)}
.contact__hours-label{width:100%;font-size:var(--fs-body-s);font-weight:400;line-height:1.6;letter-spacing:.14px;text-align:center;white-space:nowrap}
.contact__hours-time{font-size:20px;font-weight:400;line-height:1.6;letter-spacing:.2px;white-space:nowrap}
/* footer */
.footer{display:flex;flex-direction:column;align-items:flex-start;width:100%}
.footer__top{display:flex;align-items:flex-start;justify-content:space-between;width:100%;padding-top:48px;border-top:1px solid var(--c-gray)}
.footer__corp{display:flex;flex-direction:column;align-items:flex-start;gap:36px;align-self:stretch}
.footer__logo img{display:block;width:180px;height:48px}
.footer__corp-info{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:284px}
.footer__corp-name{font-size:var(--fs-body-m);font-weight:500;line-height:1.6;letter-spacing:.16px}
.footer__corp-lines{font-size:12px;font-weight:400;line-height:1.6;letter-spacing:.12px;white-space:nowrap}
.footer__nav{display:flex;align-items:flex-start;gap:80px}
.footer__nav a{color:inherit;text-decoration:none}
.footer__nav-col{display:flex;flex-direction:column;align-items:flex-start;gap:18px;list-style:none;font-size:var(--fs-body-m);font-weight:500;line-height:1.6;letter-spacing:.16px;white-space:nowrap}
.footer__nav-group{display:flex;align-items:flex-start;gap:120px;align-self:stretch}
.footer__nav-service{display:flex;flex-direction:column;align-items:flex-start;gap:18px;width:157px}
.footer__nav-head{display:block;width:100%;font-size:var(--fs-body-m);font-weight:500;line-height:1.6;letter-spacing:.16px} /* 「事業案内」見出しは service.html へのリンク（あおさん修正 B-1） */
.footer__nav-sub{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:100%;list-style:none}
.footer__nav-sub li{display:flex;align-items:center;gap:8px;width:100%;font-size:var(--fs-body-s);font-weight:400;line-height:1.6;letter-spacing:.14px;white-space:nowrap}
.footer__nav-sub img{display:block;width:14px;height:14.987px}
.footer__nav-links{display:flex;flex-direction:column;align-items:flex-start;gap:10px;list-style:none;font-size:12px;font-weight:400;line-height:1.6;letter-spacing:.12px;color:#cdcdcd;white-space:nowrap}
.footer__bottom{display:flex;align-items:flex-end;justify-content:space-between;width:100%;padding-top:80px}
.footer__offices{display:flex;align-items:flex-start;gap:48px}
.footer__office{display:flex;align-items:flex-start;gap:24px}
.footer__office-text{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:194px}
.footer__office-head{width:100%;padding-bottom:4px;border-bottom:1px solid var(--c-border2);font-size:var(--fs-body-m);font-weight:500;line-height:1.6;letter-spacing:.16px;white-space:nowrap}
.footer__office-addr{width:100%;font-size:var(--fs-body-s);font-weight:400;line-height:1.6;letter-spacing:.14px}
/* 住所は地図リンク（最終Figma 9/15: 住所行に下線） */
.footer__office-link{color:inherit;text-decoration:underline;text-underline-offset:.15em;text-decoration-thickness:1px}
.footer__office-link:hover{opacity:.7}
.footer__map{flex:none;width:180px;height:117px;border-radius:var(--r-s);overflow:hidden}
.footer__map img{display:block;width:100%;height:100%}
.footer__copy{font-family:var(--font-en);font-weight:400;font-size:12px;line-height:21px;color:var(--c-gray);white-space:nowrap;font-feature-settings:normal}

/* SP専用のナビ項目（導入事例）はPCでは出さない（旧PC-TOPに無いため。新PC-TOPで採用する場合はこの行を外す） */
.footer__nav-item--sp{display:none}

/* ===== SP（Figma ContactFooter 14591:56745）375幅 / pt64 pb40 / gap64 / 上角r20 / Contact内幅303・footer内幅327 =====
   下層ページ共通。TOP固有の差分は書かない。 */
@media (max-width:768px){
  .contact-footer{align-items:center;gap:64px;padding:64px 0 40px;border-radius:20px 20px 0 0}
  /* 下層も上パディング64px（あおさん修正 B-1「トップページ以外の768px以下フッター 140→64」）。
     page-company.css / page-service.css / page-firerobo.css が .contact-footer--lower に 140px/80px を当てているため詳細度を上げて勝たせる */
  .page .contact-footer.contact-footer--lower{padding-top:64px}
  /* Contact は左右余白24px固定・幅は「画面幅−48px」で可変（あおさん修正 B-2。Figmaの303固定をやめる） */
  .contact{flex-direction:column;gap:40px;width:calc(100% - 48px);padding:0}
  .contact__main{flex:none;gap:40px;width:100%}
  .contact .sec-title{gap:4px}
  .contact .sec-title__label{gap:6px}
  .contact .sec-title__label img{width:13px;height:9px}
  .contact__en{font-size:var(--fs-h2-en);letter-spacing:0}
  .contact__text{letter-spacing:.15px}
  .contact__side{gap:16px;width:100%}
  /* ボタン2つ: 1つ目=アクセント地・白文字 / 2つ目=白地・枠線#cdcdcd・青文字。アイコン枠は28px固定・矢印12px */
  .contact__btn{gap:40px;padding:16px 16px 16px 24px;background:var(--c-accent)}
  .contact__btn + .contact__btn{background:var(--c-base);border:1px solid var(--c-border2)} /* 枠線は外側に足す（Figma実測: 高さ62） */
  .contact__btn-label{font-size:16px;letter-spacing:.16px;color:var(--c-inverse)}
  .contact__btn + .contact__btn .contact__btn-label{color:var(--c-text-sub)}
  .contact__btn-icon{align-items:center;justify-content:center;width:28px;height:28px;padding:0}
  .contact__btn-icon img{width:12px;height:12px}
  /* 電話ブロック: 左右の縦線(104px)＋下罫線で囲み、見出し文の左右に横線 */
  .contact__tel{position:relative;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--c-border2)}
  .contact__tel::before,.contact__tel::after{content:"";position:absolute;bottom:-1px;width:1px;height:104px;background:var(--c-border2)}
  .contact__tel::before{left:0}
  .contact__tel::after{right:0}
  .contact__tel-head{gap:8px}
  .contact__tel-head::before{content:"";flex:1 0 0;min-width:1px;height:1px;background:var(--c-border2)}
  .contact__tel-head p{font-size:14px;letter-spacing:.14px}
  .contact__tel-row{flex-direction:column;align-items:center;gap:4px;width:auto;padding:4px 0 0} /* 幅は番号行に合わせる */
  .contact__tel-num{gap:4px}
  .contact__tel-num img{width:30px;height:30px}
  .contact__tel-num span{font-size:32px}
  .contact__hours{flex-direction:row;align-items:center;justify-content:center;gap:8px;width:100%;padding:2px 12px}
  .contact__hours-label{width:auto;font-size:var(--fs-body-s);letter-spacing:.12px}
  .contact__hours-time{font-size:16px;letter-spacing:.16px}
  /* footer: 縦積み（ロゴ→会社情報→ナビ2列→事業案内→小リンク→本社/事業所＋地図→©） */
  .footer{align-items:center;width:calc(100% - 48px)} /* 375で327。Contact と同じく余白24px固定で可変 */
  .footer__top{flex-direction:column;gap:48px;padding-top:32px}
  .footer__corp{gap:32px;width:100%}
  .footer__logo img{width:200px;height:auto}
  .footer__corp-info{gap:8px;width:100%}
  .footer__corp-name{font-size:18px;letter-spacing:.18px}
  .footer__nav{display:grid;grid-template-columns:89px 1fr;column-gap:80px;row-gap:20px;width:100%}
  .footer__nav-col{display:contents}
  .footer__nav-item--sp{display:list-item}
  .footer__nav-group{grid-column:1/-1;flex-direction:column;gap:48px}
  .footer__nav-service{gap:16px}
  .footer__nav-head{letter-spacing:.15px}
  .footer__nav-sub li{font-size:13px;letter-spacing:.13px}
  .footer__nav-links{gap:16px;font-size:13px;letter-spacing:.13px}
  .footer__bottom{flex-direction:column;align-items:center;gap:40px;padding-top:49px} /* Figma値48。上流の小数行高(13px×1.6)の丸め差で地図が1px上にずれるため+1で補正（実測: 本社罫線 Figma1559 / 実装1557→1558） */
  .footer__offices{flex-direction:column;gap:24px;width:100%}
  .footer__office{flex-direction:column;gap:16px;width:100%}
  .footer__office-text{gap:8px;width:100%}
  .footer__office-head{letter-spacing:.15px}
  .footer__office-addr{font-size:var(--fs-body-s);letter-spacing:.12px}
  .footer__office-addr br{display:none}
  /* 地図は 327:220 の枠（Frame 1321318086）。画像はSP用（327×220・同比率）を <picture> で出し分け、枠いっぱいに敷いて
     下側の角丸3pxが効くようにする（あおさん修正 B-1: 旧実装は 360:234 の画像が枠より7px短く、下の角が角丸になっていなかった） */
  .footer__map{width:100%;height:auto;aspect-ratio:327/220}
  .footer__map img{width:100%;height:100%;object-fit:cover}
}

/* ===== タブレット（769〜1200px）: カンプ未支給。PCの構造のまま横を詰めて収める =====
   あおさん指示「1200〜769pxでレスポンシブができていない。左右パディング30px維持でテキストを折り返す」 */
@media (min-width:769px) and (max-width:1200px){
  .contact-footer{padding:100px var(--pad-side) var(--sp-under-btn)}
  .contact{gap:40px;padding:0}
  .contact__side{width:min(420px,45%)}
  .contact__btn{width:100%}
  .footer__top{gap:40px}
  .footer__nav{flex-wrap:wrap;gap:32px 40px}
  .footer__nav-group{gap:40px}
  .footer__corp-lines{white-space:normal}
  .footer__offices{gap:24px;flex-wrap:wrap}
  .footer__office{gap:16px}
  .footer__office-text{width:auto;min-width:150px}
  .footer__map{width:150px;height:98px}
}
