/* AEフォームハンドラー共通スタイル
   Marketo forms2.css が担っていたベーススタイルの補完 + 新規要素（ハニーポット等）。
   各LP固有の見た目は各LPの style.css の .mktoForm 系上書きがそのまま担う。 */
.mktoForm,
.mktoForm * {
  box-sizing: border-box;
}
.mktoForm .mktoClear {
  clear: both;
}
.mktoForm .mktoOffset,
.mktoForm .mktoGutter {
  width: 10px;
  height: 15.6px;
  /* flex-shrink は既定値(1)のままにする: 本番はスペースが足りない場面
     （モバイル時の同意行など）でoffset/gutterが幅0まで圧縮される実測のため、
     固定(0)にすると本番より幅が広がってしまう。 */
}
.mktoForm .mktoFormCol {
  margin-bottom: 10px;
}
.mktoForm .mktoLabel {
  width: 1px;
}
.mktoForm .mktoAsterix {
  color: #bf0000;
}
.mktoForm .mktoCheckboxList {
  width: 17px;
  padding: 0 3.9px;
}
/* style.css の汎用ルール `.mktoForm label { padding-left:5px!important; }` が、
   同意チェックボックスの見た目用の空labelにも意図せず適用され、
   デスクトップは.mktoCheckboxListの幅が固定(17px)のため実害はないが、
   モバイルはwidth:auto!important（style.css）になるため、この余分な
   padding-left分だけチェックボックス列の幅が本番より広がってしまう。
   本番はこの空labelに幅を持たせていない（実測）ため、この要素のみ無効化する。 */
.mktoForm .mktoCheckboxList label[for="personalInfoConsent"] {
  padding-left: 0 !important;
}
.mktoForm input[type="checkbox"].mktoField {
  width: 16px;
  height: 16px;
  margin: 0;
}
/* 本番(forms2.css読み込み時)の実測に合わせる: サイト共通style.cssの汎用ルール
   `input[type=text], input[type=password], textarea { margin-bottom: 20px; }`
   (.mktoForm スコープ外) が type=text の氏名・会社名フィールドにだけ滲み出し、
   行の高さが本番より広くなっていた（本番はforms2.cssが同specificityで後勝ちして
   margin-bottom:0にリセットしていた）。全フィールド共通でリセットして再現する。 */
.mktoForm .mktoField {
  margin-bottom: 0;
}
/* モバイル(max-width:1080px)実測: 本番はラベルのline-heightが1.2em相当(16pxフォント時19.2px、
   絶対値としてアスタリスク等の子要素にも継承される)になっている。デスクトップは body の
   line-height:1.8 継承のみで本番と自然一致するため触らない。personalInfoConsentラベルは
   style.css側で line-height:1.6!important の専用指定がありそちらが優先されるため対象外のまま。 */
@media screen and (max-width: 1080px) {
  .mktoForm label {
    line-height: 1.2em;
  }
}
/* モバイル(max-width:1080px)では style.css の一括ルール
   `.mktoForm .mktoGutter, .mktoForm .mktoOffset { display:block!important; height:5px!important; }`
   が、同意チェックボックスの隣だけ隠す `label[for=personalInfoConsent] + .mktoGutter { display:none; }`
   を!importance差で上書きしてしまい、幅10pxのガターが復活してチェックボックス列が本番より広くなる。
   本番(forms2.css)はこのガターがflex圧縮で幅0になる（実測）。同じ見た目になるよう幅を明示的に0にする。
   セレクタ詳細度は上の基本ルールより高いため!important不要。 */
.mktoForm label[for="personalInfoConsent"] + .mktoGutter {
  width: 0;
}
/* 同意テキスト列（.mktoHtmlText側）の.mktoOffsetは、本番ではモバイル幅時に
   Marketoランタイム(forms2.js)がインラインwidthを0まで動的に再計算していた
   （実測: 幅0、以下に幅を明示するmkto標準クラスの組み合わせでは表現できないため
   index.htmlに ae-consent-text-offset フックを追加）。静的HTML側では同じ計算は
   行えないため、本番の実測結果(モバイル時のみ幅0)をそのまま固定値として再現する。 */
@media screen and (max-width: 1080px) {
  .mktoForm .ae-consent-text-offset {
    width: 0;
  }
}
/* 本番(forms2.css読み込み時)の実測に合わせる: style.cssのborder(2px #dddddd)を
   詳細度で上書き（style.css側は!important無し）。フォーカス時の赤枠(style.css意図)は維持。 */
.mktoForm input[type="text"].mktoField,
.mktoForm input[type="tel"].mktoField,
.mktoForm input[type="email"].mktoField {
  border: 1px solid #aeb0b6;
}
.mktoForm input[type="text"].mktoField:focus,
.mktoForm input[type="tel"].mktoField:focus,
.mktoForm input[type="email"].mktoField:focus {
  border-color: #c5000b;
}
/* 送信ボタン（旧: .mktoButtonRow/.mktoButtonWrap/.mktoButton）。
   GTMのクリックトリガーが"mktoButton"という文字列に反応してしまう問題があり、
   ae-buttonRow/ae-buttonWrap/ae-button にリネーム（WEB-78 花木さんFB対応）。
   style.css側の同名ルール(.mktoForm .mktoButtonRow 等、~L2112-2222、2つのモバイル
   @media(max-width:1080px)ブロック含む)はもう新クラス名にマッチしないため、
   見た目を維持するためここに移植している。style.cssの旧ルールは無効化されるので
   out-specificityは不要だが、style.css内の別の生きたルールとは依然競合する:
   #block_form button { font-size:18px } (@media min-width:1281px) が効いてくるため
   font-sizeのみ!important必須（実測16pxを維持）。他プロパティはクラス3段の詳細度で
   button要素セレクタ系の汎用リセット（button,input,...等）に自然に勝つため!important不要。
   モバイルのpadding-right/left:40px上書き（style.css側）は、元々ベースルールの
   `padding:...!important`に競り負けて無効化されていた実測結果のため移植していない
   （移植すると逆に見た目が変わってしまう）。min-width:autoのみ実際に効いていたため移植する。 */
.mktoForm .ae-buttonRow {
  display: block;
  padding-left: 25px;
}
.mktoForm .ae-buttonWrap {
  margin-left: 0;
  display: inline-block;
  line-height: 1;
}
.mktoForm .ae-buttonWrap .ae-button {
  width: 100%;
  min-width: 300px;
  height: 60px;
  border-radius: 50px;
  background: #c5000b;
  background-image: none;
  border: 2px solid #c5000b;
  box-shadow: none;
  color: #fff;
  cursor: pointer;
  -webkit-appearance: button;
  font-size: 16px !important;
  line-height: 1;
  padding: 0 20px 2px;
  font-weight: bold;
  transition: all 0.5s ease;
  text-shadow: none;
  font-family: "Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, "Hiragino Kaku Gothic ProN", HiraKakuProN-W3, sans-serif;
  position: relative;
}
.mktoForm .ae-buttonWrap .ae-button:hover {
  background: #fff;
  color: #c5000b;
}
@media screen and (max-width: 1080px) {
  .mktoForm .ae-buttonWrap {
    width: 100%;
  }
  .mktoForm .ae-buttonWrap .ae-button {
    min-width: auto;
  }
}
.ae-button[disabled] {
  opacity: 0.6;
  cursor: default;
  pointer-events: none;
}
/* ハニーポット：画面外に退避（スクリーンリーダー・自動入力の誤爆防止は属性側で対応） */
form[data-ae-form] .ae-hp,
.ae-hp {
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}