/* MA（Account Engagement）のフォーム https://mm.power-x.jp/l/1122603/2026-09-15/86tmgl 用。
   フォームのテンプレートの <head> に直接書いていた <style> を 2026-09-22 にここへ移した（MA 側の <style> は削除する前提）。
   テンプレートでは <style> の後にこのファイルを読んでいたので、移した指定を先に、元からこのファイルにあった上書きを後に置いて優先順を保っている。 */

/* ---------- Web フォント ----------
   PowerX Sans R だけを使う（項目ラベルと確認画面の見出し・項目名。下の「書体」）。
   dev の配信先は Basic 認証でフォントを読めないので、本番の絶対 URL で読む（本番は mm.power-x.jp からの読み込みを許可している）。
   2本の unicode-range は _tokens.scss と同じ（手で編集しない）。 */
@font-face {
  font-family: "PowerX Sans R";
  src: url("https://energy-solutions.power-x.jp/common/fonts/PowerXSans_R_2023_1024.woff2")
    format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range:
    U+0000-001F, U+007F-009F, U+0100-2001, U+2004-200F, U+2017, U+201B, U+201F,
    U+2023-2024, U+2027-202F, U+2031, U+2034-2038, U+203C-203D, U+203F-2043,
    U+2045-2059, U+205B-205C, U+205E-20AB, U+20AD-2102, U+2104-2108,
    U+210B-2112, U+2114-2115, U+2117-2120, U+2123-212A, U+212C-213A,
    U+213C-218F, U+2194-21C3, U+21C7-21D1, U+21D3, U+21D5-21E5, U+21EA-21F4,
    U+21F6-245F, U+2491-249B, U+24B6-24E9, U+24EB-259F, U+25A3-25B1,
    U+25B4-25B6, U+25B8-25BB, U+25BE-25C0, U+25C2-25C5, U+25C8, U+25CA,
    U+25CC-25CD, U+25D0-25E1, U+25E6-25EE, U+25F0-25FF, U+2604, U+2607-260D,
    U+260F-261B, U+2620-263F, U+2641, U+2643-265F, U+2668-2669, U+266B-266C,
    U+266E, U+2670-2775, U+277F-27A0, U+27A2-10FFFF;
}
@font-face {
  font-family: "PowerX Sans R";
  src: url("https://energy-solutions.power-x.jp/common/fonts/PowerXSans_R_2023_1024.latin.woff2")
    format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range:
    U+0020-007E, U+00A0-00FF, U+2002-2003, U+2010-2016, U+2018-201A,
    U+201C-201E, U+2020-2022, U+2025-2026, U+2030, U+2032-2033, U+2039-203B,
    U+203E, U+2044, U+205A, U+205D, U+20AC, U+2103, U+2109-210A, U+2113, U+2116,
    U+2121-2122, U+212B, U+213B, U+2190-2193, U+21C4-21C6, U+21D2, U+21D4,
    U+21E6-21E9, U+21F5, U+2460-2490, U+249C-24B5, U+24EA, U+25A0-25A2,
    U+25B2-25B3, U+25B7, U+25BC-25BD, U+25C1, U+25C6-25C7, U+25C9, U+25CB,
    U+25CE-25CF, U+25E2-25E5, U+25EF, U+2600-2603, U+2605-2606, U+260E,
    U+261C-261F, U+2640, U+2642, U+2660-2667, U+266A, U+266D, U+266F,
    U+2776-277E, U+27A1;
}

/* ---------- テンプレートから移した指定 ---------- */
body {
  background-color: #ffffff;
  font-family:
    "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN",
    "Hiragino Sans", Meiryo, sans-serif;
  color: #333333;
  line-height: 1.6;
  margin: 0;
  padding: 40px 20px;
}
/* フォームコンテナ */
.form-container {
  max-width: 800px;
  margin: 0 auto;
  background-color: #ffffff;
  padding: 40px;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

form.form {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

form.form .description {
  font-size: 13px;
  color: #666666;
}

/* 基本は全項目を1列（100%幅）で縦並びにする */
form.form .form-group,
form.form .form-field {
  width: 100% !important;
  max-width: 100% !important;
  margin-bottom: 24px;
  box-sizing: border-box;
}

form.form .name-row {
  display: flex !important;
  align-items: flex-end;
  gap: 12px;
  width: 100% !important;
}

form.form .name-row .field-group {
  width: calc(50% - 6px) !important;
  max-width: calc(50% - 6px) !important;
}

form.form .name-row .field-group input {
  width: 100% !important;
  box-sizing: border-box;
}

@media screen and (max-width: 639px) {
  form.form .name-row {
    flex-direction: column;
    gap: 8px;
  }
  form.form .name-row .field-group {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ラベルのスタイル */
form.form label {
  display: block;
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 8px;
  color: #111111;
}

/* 赤い「必須」バッジ */
.required-label {
  background-color: #e60000;
  color: #ffffff;
  font-size: 11px;
  font-weight: normal;
  padding: 2px 8px;
  border-radius: 4px;
  margin-left: 10px;
  vertical-align: middle;
  display: inline-block;
  font-family:
    "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN",
    "Hiragino Sans", Meiryo, sans-serif; /* ラベル（PowerX Sans R）を継承させない */
}

/* 入力フィールド */
form.form input[type="text"],
form.form input[type="email"],
form.form input[type="tel"],
form.form select,
form.form textarea {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  font-size: 15px;
  box-sizing: border-box;
  background-color: #fafafa;
  transition: border-color 0.3s;
  font-family: inherit;
}

form.form select {
  min-height: 56px !important;
  line-height: 1.5 !important;
}

form.form input:focus,
form.form select:focus,
form.form textarea:focus {
  outline: none;
  border-color: #999999;
  background-color: #ffffff;
}

form.form textarea {
  min-height: 120px;
  resize: vertical;
}

/* プルダウンの選択してくださいの文字カラー */
form.form select:has(option:nth-child(2):checked) {
  color: #7b7b7b !important;
}

/* エラー時の表示 */
.error input,
.error select,
.error textarea {
  border-color: #e60000 !important;
  background-color: #fff8f8 !important;
}
p.error.no-label {
  color: #e60000;
  font-size: 13px;
  margin: 6px 0 0;
  width: 100%;
}
p.errors {
  border-color: #e60000 !important;
}

/* 横並び項目のエラー表示設定 */
.name-row:has(+ div[id^="error_"] + p.error) input {
  border-color: #e60000 !important;
  background-color: #fff8f8 !important;
}

/* プレースホルダー文字色 */
::placeholder {
  color: #7b7b7b;
  font-family: inherit;
}

/* 送信ボタン */
form.form p.submit {
  text-align: center;
  margin-top: 30px;
  width: 100%;
}

form.form p.submit input {
  background-color: #e60000;
  color: #ffffff;
  font-weight: bold;
  font-size: 18px;
  padding: 18px 60px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  width: 100%;
  max-width: 400px;
  transition: background-color 0.3s;
  font-family: inherit;
}

form.form p.submit input:hover {
  background-color: #cc0000;
}

/* チェックボックス */
form.form span.value {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 5px;
}

form.form input[type="checkbox"] {
  display: none;
}

form.form input[type="checkbox"] + label {
  position: relative;
  padding-left: 32px;
  cursor: pointer;
  font-weight: normal;
  color: #333333;
  display: inline-block;
  line-height: 1.6;
  font-size: 14px;
}

form.form input[type="checkbox"] + label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  background-color: #fafafa;
  box-sizing: border-box;
  transition: all 0.2s ease-in-out;
}

form.form input[type="checkbox"]:checked + label::before {
  background-color: #e60000;
  border-color: #e60000;
}

form.form input[type="checkbox"]:checked + label::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 50%;
  transform: translateY(-60%) rotate(45deg);
  width: 5px;
  height: 10px;
  border-bottom: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
}

@media (max-width: 600px) {
  .form-container {
    padding: 20px;
  }
}

.pardot-recaptcha-wrapper {
  display: block;
  margin: 0 auto !important;
}

/* ---------- 書体 ----------
   全体は Noto Sans JP（body）。PowerX Sans R は項目ラベル・確認画面の見出し・一覧の項目名だけ。 */
form.form label.field-label,
#pardot-form .aefc-confirm-title,
#pardot-form .aefc-confirm-row dt {
  font-family:
    "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN",
    "Hiragino Sans", Meiryo, sans-serif;
}

/* ---------- 上書き（テンプレートの <style> より後に読まれていた指定） ---------- */
body {
  padding: 40px 6px;
}

@media (max-width: 600px) {
  .form-container {
    padding: 12px;
  }
}

form.form p.pd-hidden {
  display: none;
}

form.form .form-field.error {
  margin-bottom: 0;
}

form.form #error_for_Recaptchapi_Recaptcha + .error.no-label {
  text-align: center;
}