/* =========================================================
   toiawase（お問い合わせ）：版式とボタン色を統一
   - タイトル中央寄せ（company と同じトーン）
   - すべてのボタンをブルー（図4と同じ色）
========================================================= */

/* ブルーCTA（図4） */
:root{
  --cta: #2F80ED;
  --cta-shadow: rgba(47,128,237,.28);
  --cta-shadow-hover: rgba(47,128,237,.33);

  /* 既存トークン */
  --border:#e5e7eb;
  --muted:#64748b;
  --shadow-sm:0 2px 10px rgba(0,0,0,.06);
}

/* ページ幅は company / 事業内容と同じテイスト */
.page { max-width: unset; margin: 0; padding: 48px 0; }
.page.contact>.container { max-width: 1000px; margin: 0 auto; padding: 0 20px; }

/* パンくず */
.breadcrumbs{ font-size:.9rem; margin:12px 0 24px; color:#666; }

/* ★ タイトル中央寄せ（求人情報と同じ見た目） */
.hero_title{
  text-align:center;
  font-weight:800;
  letter-spacing:.3em;
  font-size:38px;
  line-height:1.2;
  margin:0 0 18px;
  color:#0f172a;
}

/* 見出し */
.h3{ font-size:1.15rem; line-height:1.35; margin:26px 0 10px; }

/* カード */
.card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  box-shadow:var(--shadow-sm);
  padding:20px;
}

/* 地図 */
.map{ margin-top:8px; }
.map iframe{ width:100%; height:420px; border:0; border-radius:12px; }
@media (max-width:600px){ .map iframe{ height:220px; } }

/* フォーム */
.form fieldset{ border:0; padding:0; margin:0; }
.form label{ display:block; margin:.6rem 0 .35rem; font-weight:600; }
.form input,.form textarea,.form select{
  width:100%; padding:.7rem .8rem; border:1px solid #ddd; border-radius:10px;
  font:inherit; line-height:1.35; background:#fff; transition:border-color .15s, box-shadow .15s;
}
.form textarea{ min-height:150px; }
.form input:focus,.form textarea:focus,.form select:focus{
  outline:0; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.22);
}
.form .hint{ color:#666; font-size:.9rem; margin-top:.25rem; }
.form_agree{ display:flex; align-items:center; gap:.55rem; margin:.9rem 0 1.1rem; }
.form_agree input{ width:18px; height:18px; flex:0 0 auto; }
.form_agree label{ margin:0; line-height:1.35; cursor:pointer; }

/* ★ ボタン：全ページ共通をブルーに */
.btn{
  display:inline-block;
  padding:.78rem 1.3rem;
  border-radius:12px;
  background:var(--cta);
  color:#fff;
  border:0;
  cursor:pointer;
  box-shadow:0 10px 24px var(--cta-shadow);
  transition:filter .15s, box-shadow .15s, transform .05s;
}
.btn:hover{ filter:brightness(1.06); box-shadow:0 10px 24px var(--cta-shadow-hover); }
.btn:active{ transform:translateY(1px); }

/* 「専用メールで連絡する」もブルーに */
.btn--brand{
  background:var(--cta);
  color:#fff;
  box-shadow:0 10px 24px var(--cta-shadow);
}

/* 送信ボタンの余白 */
.contact .form .btn{ margin-top:12px; }

/* ヘッダーのCTAも念のためブルー強制（styles.css にも同義あり） */
.nav_cta{
  background:var(--cta);
  box-shadow:0 8px 16px var(--cta-shadow);
  color:#fff;
}
.nav_cta:hover{ filter:brightness(1.06); box-shadow:0 10px 20px var(--cta-shadow-hover); }

/* レイアウト細部（単列） */
.contact .grid{ grid-template-columns:1fr; gap:24px; }
.contact .h3{ margin:22px 0 8px; }

/* フッター（共通に合わせる） */
.footer{background:#0b0f0c;color:#cbd5e1;padding:5px 0 0}
.footer a{color:#d1fae5}
.footer_cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:20px}
.footer_brand{display:flex;align-items:center;gap:12px;flex-wrap:nowrap}
.footer_text strong{display:block;line-height:1.3}
.footer_brand .muted{white-space:nowrap;margin:0}
@media (max-width:640px){.footer_brand{justify-content:center}}
@media (min-width:641px) and (max-width:980px){.footer_cols{grid-template-columns:1fr 1fr}}