/* ワンフロンティア 下層ページ・共通パーツ用CSS(子テーマの css/of-sub.css に置く)
   Lightning G2 の標準的なクラス名を前提にしています。効かない部分があれば、その箇所を教えてください。 */

:root {
  --of-sky: #2CA9E1;
  --of-sky-d: #166F98;
  --of-deep: #14587F;
  --of-navy: #0F3A55;
  --of-pale: #EAF4FA;
  --of-text: #1D3A4F;
  --of-muted: #3C5A70;
  --of-line: #C9DEEB;
  --of-serif: 'Shippori Mincho', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
}

body { font-family: 'Zen Kaku Gothic New', 'Hiragino Sans', 'Yu Gothic', sans-serif; color: var(--of-text); }

/* ヘッダー・グローバルナビ */
.siteHeader { box-shadow: none; border-bottom: 1px solid #E1EDF4; }
.gMenu_name { font-weight: 700; color: var(--of-navy); }
.gMenu_description { font-family: var(--of-serif); font-size: 11px; letter-spacing: .14em; color: var(--of-sky-d) !important; opacity: 1 !important; }
.gMenu > li > a:after { border-bottom-color: var(--of-sky) !important; }

/* ページ上部の帯(ページタイトル) */
.page-header {
  position: relative; overflow: hidden; text-align: left;
  padding: clamp(28px, 4vw, 48px) 0 !important; min-height: 0 !important;
  background: linear-gradient(135deg, #D6EEFA 0%, #EAF4FA 60%, #FFFFFF 100%) !important;
}
.page-header::after {
  content: ''; position: absolute; right: -70px; top: -70px; width: 300px; height: 300px;
  border-radius: 50%; border: 1px solid rgba(44, 169, 225, .4); box-shadow: 0 0 0 44px rgba(44, 169, 225, .06);
  pointer-events: none;
}
.page-header .container { position: relative; z-index: 1; }
.page-header h1, .page-header h1 *, .page-header_pageTitle, .page-header-title {
  margin: 0; text-align: left; font-family: var(--of-serif); font-weight: 700;
  font-size: clamp(28px, 3.4vw, 40px); letter-spacing: .06em; color: var(--of-navy) !important; text-shadow: none !important;
}

/* パンくず */
.breadSection { background: #fff; border-bottom: 1px solid #E1EDF4; }
.breadSection, .breadSection ol, .breadSection li, .breadSection li span { font-size: 14px; color: var(--of-text) !important; }
.breadSection a, .breadSection li a { font-size: 14px; color: var(--of-sky-d) !important; }

/* 本文の見出し(トップページ用の of- クラスは除く) */
.mainSection { line-height: 2; }
.mainSection h2:not(.of-h2), .entry-body h2:not(.of-h2) {
  position: relative; margin: 2.2em 0 1em; padding: 0 0 .5em; background: none !important;
  border: 0 !important; border-bottom: 1px solid var(--of-line) !important;
  font-family: var(--of-serif); font-weight: 700; color: var(--of-navy);
}
.mainSection h2:not(.of-h2)::before, .entry-body h2:not(.of-h2)::before { content: none !important; }
.mainSection h2:not(.of-h2)::after, .entry-body h2:not(.of-h2)::after {
  content: '' !important; display: block !important; position: absolute; left: 0; bottom: -1px;
  width: 56px; height: 3px; border: 0; background: var(--of-sky);
}
.mainSection h3:not(.of-h3), .entry-body h3:not(.of-h3) {
  margin: 1.8em 0 .8em; padding: 0; background: none !important; border: 0 !important;
  font-family: var(--of-serif); font-weight: 700; color: var(--of-navy);
}
.mainSection h3:not(.of-h3)::before, .mainSection h3:not(.of-h3)::after,
.entry-body h3:not(.of-h3)::before, .entry-body h3:not(.of-h3)::after { content: none !important; }
.entry-body ul li::marker { color: var(--of-sky); }
.entry-body a { color: var(--of-sky-d); }
.entry-body a:hover { color: var(--of-navy); }
body:not(.home) .entry-body p, body:not(.home) .entry-body li, body:not(.home) .entry-body td { font-weight: 500; }
/* 表の1列目(年月など)を、狭い画面でも折り返さない。
   固定ページのブロックの「追加 CSS クラス」に of-table-nowrap-first を付けた表だけに効く(付けない表は変わらない) */
body:not(.home) .entry-body .wp-block-table.of-table-nowrap-first td:first-child { white-space: nowrap; }

/* サイドバー */
.sideSection .widget-title, .sideSection .subSection-title {
  position: relative; margin: 0 0 16px; padding: 0 0 12px; background: none; border: 0;
  border-bottom: 1px solid var(--of-line); font-family: var(--of-serif); font-weight: 700; color: var(--of-navy);
}
.sideSection .widget-title::before, .sideSection .subSection-title::before { content: none; }
.sideSection .widget-title::after, .sideSection .subSection-title::after {
  content: ''; position: absolute; left: 0; bottom: -1px; width: 56px; height: 3px; background: var(--of-sky);
}
.sideSection .widget ul li a {
  display: block; padding: 12px 14px; background: var(--of-pale); color: var(--of-text); transition: background .2s, color .2s;
}
.sideSection .widget ul li a:hover { background: #D6EEFA; color: var(--of-navy); }
.sideSection .widget ul li.current_page_item > a, .sideSection .widget ul li.current-menu-item > a { background: #D6EEFA; font-weight: 700; }

/* フッター */
.siteFooter { background: var(--of-pale) !important; border-top: 3px solid var(--of-sky); color: var(--of-text); }
.siteFooter a, .siteFooter .footerMenu a, .siteFooter .footerMenu li a { color: var(--of-text) !important; }
.siteFooter a:hover, .siteFooter .footerMenu a:hover { color: var(--of-sky-d) !important; }
.siteFooter .footerMenu { border-bottom: 1px solid var(--of-line); }
.siteFooter .widget-title, .siteFooter .subSection-title { font-family: var(--of-serif); color: var(--of-navy); }
.siteFooter .copySection, .siteFooter .copySection p { border-color: var(--of-line); color: var(--of-text) !important; font-size: 14px; }
.siteFooter .copySection { border-top: 1px solid var(--of-line); }

/* ===== お問い合わせフォーム (Contact Form 7, フォームID 579 のみ) =====
   フォームを作り直してIDが変わった場合は、wpcf7-f579- の数字を新しいIDに替えること。 */
body .wpcf7[id^="wpcf7-f579-"] input[type="text"],
body .wpcf7[id^="wpcf7-f579-"] input[type="email"],
body .wpcf7[id^="wpcf7-f579-"] input[type="tel"],
body .wpcf7[id^="wpcf7-f579-"] textarea {
  width: 100%;
  padding: 12px 14px;
  font-size: 16px; /* iPhoneで入力時に拡大されないよう16px */
  line-height: 1.6;
  color: #1D3A4F;
  background: #F4F8FB;
  border: 1px solid #5C8097;
  border-radius: 6px;
  box-shadow: none;
}
body .wpcf7[id^="wpcf7-f579-"] textarea { min-height: 220px; }
body .wpcf7[id^="wpcf7-f579-"] input[type="text"]:focus-visible,
body .wpcf7[id^="wpcf7-f579-"] input[type="email"]:focus-visible,
body .wpcf7[id^="wpcf7-f579-"] input[type="tel"]:focus-visible,
body .wpcf7[id^="wpcf7-f579-"] textarea:focus-visible {
  outline: 2px solid #166F98;
  outline-offset: 2px;
  border-color: #166F98;
  background: #fff;
}

/* ラジオボタン(2列、スマホは1列) */
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-radio {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px 24px;
}
@media (min-width: 641px) {
  body .wpcf7[id^="wpcf7-f579-"] .wpcf7-radio { grid-template-columns: 1fr 1fr; }
}
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-radio .wpcf7-list-item { display: block; margin: 0; }
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-radio label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin: 0;
  font-weight: 500;
  cursor: pointer;
}
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-radio input[type="radio"] {
  flex: none;
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: #166F98;
}

/* 個人情報の同意文 */
body .wpcf7[id^="wpcf7-f579-"] .of-form-note {
  margin: 28px 0 8px;
  font-size: 14px;
  line-height: 1.9;
  color: #1D3A4F;
}
body .wpcf7[id^="wpcf7-f579-"] .of-form-note a { color: #166F98; text-decoration: underline; }

/* 個人情報の同意チェック(ラジオと同じ見た目・タップ領域) */
body .wpcf7[id^="wpcf7-f579-"] .of-form-consent { margin: 8px 0; font-size: 14px; line-height: 1.9; color: #1D3A4F; }
body .wpcf7[id^="wpcf7-f579-"] .of-form-consent a { color: #166F98; text-decoration: underline; }
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-acceptance .wpcf7-list-item { display: block; margin: 0; }
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-acceptance label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin: 0;
  font-weight: 500;
  cursor: pointer;
}
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-acceptance input[type="checkbox"] {
  flex: none;
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: #166F98;
}

/* Turnstile を中央寄せ */
body .wpcf7[id^="wpcf7-f579-"] .cf-turnstile {
  display: flex;
  justify-content: center;
  margin: 20px 0 4px;
}

/* 送信ボタン(中央寄せの丸いボタン) */
body .wpcf7[id^="wpcf7-f579-"] p.center { text-align: center; margin-top: 16px; }
body .wpcf7[id^="wpcf7-f579-"] input.wpcf7-submit {
  display: inline-block;
  width: auto;
  min-width: 240px;
  max-width: 100%;
  padding: 14px 48px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #fff;
  background: #166F98;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
}
body .wpcf7[id^="wpcf7-f579-"] input.wpcf7-submit:hover { background: #14587F; }
body .wpcf7[id^="wpcf7-f579-"] input.wpcf7-submit:focus-visible {
  outline: 2px solid #166F98;
  outline-offset: 3px;
}

/* 送信ボタンの横の回転アイコンが場所を取らないようにし、ボタンを中央に保つ */
body .wpcf7[id^="wpcf7-f579-"] .wpcf7-spinner {
  position: absolute;
  margin: 0 0 0 12px;
}
