/* phase2共通CSS（consultant-phase2.css）はroot 10px（html{font-size:62.5%}）前提のrem設計。
   他5サイトはサイトCSS側がroot 10pxを供給するが、anshinだけはroot 16pxのため、
   フォームページのみrootを62.5%化する。サイトchrome（ヘッダー・メニュー・パンくず・モーダル）の
   文字サイズは下の「chrome文字サイズ補正」でroot 16px時の実測値へ固定する */
html.consultant-form-page {
  font-size: 62.5%;
}

/* chrome文字サイズ補正: root 62.5%化の影響を受けるサイト側要素を現行実寸へ戻す。
   継承依存のテキスト（header_bar・hd_label・受付時間など）はコンテナに16pxを与え、
   rem指定のある規則は個別に「元のrem値×16px」で上書きする */
html.consultant-form-page .hd_box {
  font-size: 16px;
}

html.consultant-form-page .tel_right .number {
  font-size: 30.4px; /* 1.9rem×16px */
}

html.consultant-form-page .menuNO1 {
  font-size: 16px; /* 1rem×16px */
}

html.consultant-form-page .global_menu a {
  font-size: 16px; /* 1rem×16px */
}

html.consultant-form-page .child_menu li a {
  font-size: 12.8px; /* 0.8rem×16px */
}

html.consultant-form-page .inner_menu li {
  font-size: 12.8px; /* 0.8rem×16px */
}

html.consultant-form-page #pan ul {
  font-size: 19.2px; /* 1.2rem×16px（SPのpan_title 10pxはpx指定のため影響なし） */
}

/* 完了画面のSP電話モーダル（modal.css）のrem補正 */
html.consultant-form-page .modal-content_midashi {
  font-size: 17.6px; /* 1.1rem×16px */
}

html.consultant-form-page .modal-content_text {
  font-size: 12.8px; /* 0.8rem×16px */
  line-height: 16px; /* 1rem×16px */
}

html.consultant-form-page .modal-content_btn {
  font-size: 16px; /* 1rem×16px */
  line-height: 24px; /* 1.5rem×16px */
}

/* local2.cssのSP規則 .inner{height:90px}（ヘッダー用）がphase2領域の.innerにも当たり
   コンテンツがクリップされるため打ち消す */
html.consultant-form-page .consultant-phase2 .inner {
  height: auto;
}

/* キャンペーンバナー枠: neofirstではサイトCSS（style.css）が.main_column/.bnr_imgを
   整形していたが、anshinのCSSには無いためテーマで同等を供給する
   （figureのブラウザ既定margin 40pxも打ち消す） */
html.consultant-form-page .main_column {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  padding: 30px 0 0;
}

html.consultant-form-page .bnr_img {
  margin: 0 0 20px;
}

html.consultant-form-page .bnr_img img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  html.consultant-form-page .main_column {
    padding: 0;
  }

  html.consultant-form-page .bnr_img {
    margin: 0;
  }
}

html.consultant-form-page .consultant-phase2 {
  --phase2-primary: #0269BB;
  --phase2-primary-deep: #03439b;
  --phase2-primary-soft: #eaf4fc;
  --phase2-primary-line: #bfdcf2;
  --phase2-accent: #ffd36a;
  --phase2-accent-deep: #ffc341;
  --phase2-required: #e64b4b;
  --phase2-required-soft: #fff1f1;
  /* 必須バッジ専用の濃い赤（白地・白文字と4.55:1でWCAG AAを満たす） */
  --phase2-required-badge: #d93a3a;
  --phase2-ink: #222;
  --phase2-muted: #626b75;
  --phase2-bg: #f2f7fc;
  --phase2-card: #fff;
  --phase2-line: #dadada;
  --phase2-input-line: #8593a6; /* 入力欄枠のWCAG 1.4.11対応（白地と3.12:1・es-g式と同値） */
  --phase2-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
  font-family: 'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
  letter-spacing: normal;
}

/* サイトCSSのグローバル見出しスタイル漏れに対する標準防御
   （anshinに該当のグローバル規則は無いが、6サイト共通の作法として維持） */
html.consultant-form-page .consultant-phase2 h1,
html.consultant-form-page .consultant-phase2 h2,
html.consultant-form-page .consultant-phase2 h3,
html.consultant-form-page .consultant-phase2 h4,
html.consultant-form-page .consultant-phase2 h5 {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: inherit;
}

html.consultant-form-page .consultant-phase2 h4::before,
html.consultant-form-page .consultant-phase2 h4::after {
  content: none;
}

/* text-align継承がボタンへ漏れるケースに対する標準防御（6サイト共通の作法） */
html.consultant-form-page .consultant-phase2 button,
html.consultant-form-page .consultant-phase2 input[type="submit"],
html.consultant-form-page .consultant-phase2 input[type="button"] {
  text-align: center;
}

/* 共通phase2 CSSに残る青の固定値をサイト主色へ置き換える */
html.consultant-form-page .consultant-phase2 .l-progressbar__item.active {
  background: #0269BB;
}

html.consultant-form-page .consultant-phase2 .l-progressbar__item.active:not(:last-child)::after {
  border-left-color: #0269BB;
}

html.consultant-form-page .consultant-phase2 .phase2-trust span::before {
  background: #0269BB;
}

@media (hover: hover) {
  html.consultant-form-page .consultant-phase2 .reserve-arrow:not(.is-selected):not(.is-active):not(
      [aria-pressed="true"]
    ):not(:disabled):not(:has(input:checked)):not(:has(input:disabled)):hover {
    background: #03439b;
  }
}

/* CTAをサイトの.btn_soushinと同じ黄色、角丸、立体影へ合わせる */
html.consultant-form-page .consultant-phase2 #submit-btn.is-ready,
html.consultant-form-page .consultant-phase2 #confirm-send-button:not(:disabled) {
  background-color: #FCDD2E;
  box-shadow: 0 7px 0 #cab125;
  color: #0269BB;
}

html.consultant-form-page .consultant-phase2 #submit-btn.is-ready:hover,
html.consultant-form-page .consultant-phase2 #submit-btn.is-ready:focus-visible,
html.consultant-form-page .consultant-phase2 #confirm-send-button:not(:disabled):hover,
html.consultant-form-page .consultant-phase2 #confirm-send-button:not(:disabled):focus-visible {
  background-color: #f0cf1b;
  color: #0269BB;
}

html.consultant-form-page .consultant-phase2 #submit-btn.is-ready:active,
html.consultant-form-page .consultant-phase2 #confirm-send-button:not(:disabled):active {
  box-shadow: 0 2px 0 #cab125;
}

html.consultant-form-page .consultant-phase2 #submit-btn,
html.consultant-form-page .consultant-phase2 #confirm-send-button,
html.consultant-form-page .consultant-phase2 .phase2-confirm-back {
  border-radius: 10px;
}

/* SP追尾バーの電話ボタンをサイト標準の.ctaBtn-telと同じ青・角丸・影へ合わせる。
   サイト標準.telicon自体のfixed配置とscript.jsの表示制御には触れない */
html.consultant-form-page .consultant-phase2 .phase2-cta-tel {
  border-color: #009CE5;
  border-radius: 3px;
  color: #009CE5;
}

html.consultant-form-page .consultant-phase2 .phase2-cta-bar:not(.is-ready) .phase2-cta-tel {
  background: #009CE5;
  box-shadow: 2px 2px 4px #62626296;
  color: #fff;
}

/* サイト共通footer（local2.css）のmargin-top:30pxがフォーム末尾（CTAバーの注記）と
   フッターの間に白帯を作るため、na/Orixと同じ密着へ詰める */
html.consultant-form-page footer {
  margin-top: 0;
}

/* 相談フォームではフッターメニュー（会社概要等）を非表示にする（離脱防止・Orixの作法） */
html.consultant-form-page #footer #footerNav {
  display: none;
}

/* フッターはPC/SPともPマークを＜募集代理店＞ブロックの左隣に配置する（Orix/zurichのSP作法をPCにも適用）。
   サイト標準（PC=.infoL左・Pマーク右110px／SP=縦積み）をフォームページのみgridで組み替える */
html.consultant-form-page #footer .infoBOX {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  column-gap: 12px;
  padding-top: 20px;
}

/* サイト標準の.infoは高さ140px固定の青グラデ帯。grid化で中身が高くなるため可変にする */
html.consultant-form-page #footer .info {
  height: auto;
}

html.consultant-form-page #footer .info_address {
  display: contents;
  font-size: 12px;
}

html.consultant-form-page #footer .info_address__agency {
  grid-row: 1;
  grid-column: 2;
}

html.consultant-form-page #footer .info_address__underwriter {
  grid-row: 2;
  grid-column: 1 / -1;
  margin-top: 16px;
}

html.consultant-form-page #footer .isms {
  grid-row: 1;
  grid-column: 1;
  width: 68px;
  margin: 0;
  align-self: center;
}

html.consultant-form-page #footer .isms img {
  display: block;
  width: 68px;
  height: auto;
  margin: 0;
}
