/* =========================================================
   HubSpotフォーム調整 完全版
   ---------------------------------------------------------
   ■ 方針
   ・既存の追加CSSは削除し、このコードのみを設定
   ・上部余白は開けすぎず、少しだけ余白を戻す
   ・フォーム外枠（背景／線／角丸／影）は削除
   ・フォーム幅は維持
   ・設問ラベルはやや大きめを維持
   ・入力欄／送信ボタンの方針は維持
   ・スマホ見出しは小さめを維持
   ・ヘルプテキストはレギュラー表示
   ・チェックボックスは小さめに調整
   ========================================================= */

/* =========================================================
   1) フォーム外周
   ========================================================= */

.hs-form,
.hs-form-wrapper,
.hbspt-form,
.form-wrapper,
.hs_cos_wrapper_type_form,
.module-type-form,
.dnd-module .hs-form,
.dnd-module .hbspt-form,
.dnd-module .hs_cos_wrapper_type_form,
.dnd-module .hs-form-wrapper,
.dnd-module .form-wrapper {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

.hs-form {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 10px 32px 24px !important;
}

.hs-form,
.hs-form *,
.hs-form *::before,
.hs-form *::after {
  box-sizing: border-box;
}

.hs-form .hs-form-field {
  margin-bottom: 18px;
}

/* =========================================================
   2) 上部リッチテキストまわり
   ========================================================= */

.hs-form .hs-richtext,
.hbspt-form .hs-richtext,
.hs-form-wrapper .hs-richtext {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ロゴ */
.hs-form .hs-richtext img,
.hbspt-form .hs-richtext img,
.hs-form-wrapper .hs-richtext img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
}

/* 見出し */
.hs-form .hs-richtext h1,
.hs-form .hs-richtext h2,
.hbspt-form .hs-richtext h1,
.hbspt-form .hs-richtext h2,
.hs-form-wrapper .hs-richtext h1,
.hs-form-wrapper .hs-richtext h2 {
  margin: 0 0 12px 0 !important;
  padding: 0 !important;
  color: #0f57a4;
  line-height: 1.3;
  font-size: 38px !important;
}

/* 案内文 */
.hs-form .hs-richtext p,
.hbspt-form .hs-richtext p,
.hs-form-wrapper .hs-richtext p {
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
  color: #333333;
  font-size: 15px;
  line-height: 1.7;
}

.hs-form .hs-richtext p:last-child,
.hbspt-form .hs-richtext p:last-child,
.hs-form-wrapper .hs-richtext p:last-child {
  margin-bottom: 0 !important;
}

/* =========================================================
   3) 余計な上余白を抑制
   ========================================================= */

.page-center,
.content-wrapper,
.row-fluid-wrapper,
.row-fluid,
.cell-wrapper,
.dnd-section,
.dnd-module,
.hs_cos_wrapper_type_rich_text,
.dnd-module .hs_cos_wrapper_type_rich_text,
.page-center .hs_cos_wrapper_type_rich_text,
.hs_cos_wrapper_type_form,
.module-type-form,
.form-wrapper,
.hs-form-wrapper,
.hbspt-form {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.page-center > div:first-child,
.page-center .cell-wrapper:first-child,
.page-center .hs_cos_wrapper:first-child,
.dnd-section > .row-fluid-wrapper:first-child,
.dnd-module > .row-fluid-wrapper:first-child,
.hs_cos_wrapper_type_rich_text > :first-child,
.dnd-module .hs_cos_wrapper_type_rich_text > :first-child,
.page-center .hs_cos_wrapper_type_rich_text > :first-child,
.hs-form .hs-richtext > :first-child,
.hbspt-form .hs-richtext > :first-child,
.hs-form-wrapper .hs-richtext > :first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* =========================================================
   4) ラベル
   ========================================================= */

.hs-form .hs-form-field > label,
.hs-form fieldset > legend,
.hs-form .inputs-list + label {
  display: block;
  margin-bottom: 6px;
  color: #222222;
  font-size: 16px;
  line-height: 1.55;
  font-weight: 700;
}

.hs-form .hs-form-checkboxgroup > label,
.hs-form .hs-form-radio > label,
.hs-form fieldset.form-columns-1 > div > label,
.hs-form fieldset legend {
  margin-bottom: 8px !important;
  color: #222222 !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
  font-weight: 700 !important;
}

/* ヘルプテキストはレギュラー表示 */
.hs-form .hs-field-desc,
.hs-form .inputs-list .hs-field-desc,
.hs-form .hs-richtext .hs-form-field p,
.hs-form .hs-error-msgs,
.hs-form .hs-error-msgs label {
  color: #222222;
  font-size: 14px;
  line-height: 1.6;
  font-weight: 400 !important;
}

/* =========================================================
   5) 必須表示
   ========================================================= */

/* 既定の * 表示を隠す */
.hs-form .hs-form-required {
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}

/* 通常環境向け */
.hs-form .hs-form-field > label .hs-form-required::after,
.hs-form fieldset > legend .hs-form-required::after {
  content: "必須";
  display: inline-block;
  margin-left: 4px;
  color: #d70000;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  vertical-align: baseline;
}

/* :has が使える環境向けの補強 */
.hs-form .hs-form-field:has(.hs-form-required) > label::after,
.hs-form fieldset:has(.hs-form-required) > legend::after {
  content: " 必須";
  margin-left: 4px;
  color: #d70000;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  vertical-align: baseline;
}

.hs-form .hs-form-field:has(.hs-form-required) > label .hs-form-required::after,
.hs-form fieldset:has(.hs-form-required) > legend .hs-form-required::after {
  content: "";
  display: none;
}

.hs-form .hs-error-msg, .hs-form .hs-error-msgs {
    color: var(--hsElevate--formRequired__color)!important;
    font-weight: bold!important;
}

/* =========================================================
   6) 入力欄
   ========================================================= */

.hs-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not(.hs-button),
.hs-form select,
.hs-form textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  color: #333333;
  font-size: 16px;
  line-height: 1.5;
  background: #f7f9fc;
  border: 1px solid #d8dee8;
  border-radius: 0 !important;
  box-shadow: none !important;
  appearance: none;
  -webkit-appearance: none;
}

.hs-form textarea {
  min-height: 140px;
}

.hs-form input::placeholder,
.hs-form textarea::placeholder {
  color: #7d8da6;
  font-size: 16px;
}

/* =========================================================
   7) 送信ボタン
   ========================================================= */

.hs-form .actions {
  margin-top: 26px;
}

.hs-form .actions input[type="submit"],
.hs-form input[type="submit"],
.hs-form .hs-button,
.hs-form button[type="submit"] {
  display: inline-block !important;
  width: auto !important;
  min-width: 220px !important;
  min-height: 52px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 14px 24px !important;
  background: #0f57a4 !important;
  background-color: #0f57a4 !important;
  background-image: none !important;
  border: 1px solid #0f57a4 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-family: inherit !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.hs-form .actions input[type="submit"]:hover,
.hs-form input[type="submit"]:hover,
.hs-form .hs-button:hover,
.hs-form button[type="submit"]:hover {
  background: #0b4686 !important;
  background-color: #0b4686 !important;
  border-color: #0b4686 !important;
  color: #ffffff !important;
}

/* =========================================================
   8) チェックボックス／ラジオ
   ========================================================= */

.hs-form .inputs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-form .inputs-list li {
  margin: 0 0 10px 0;
  padding: 0;
}

.hs-form .inputs-list label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #222222;
  font-size: 15px;
  line-height: 1.65;
  font-weight: 400;
  cursor: pointer;
}

/* チェックボックスだけ小さく */
.hs-form input[type="checkbox"] {
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  min-height: 12px !important;
  margin: 4px 0 0 0 !important;
  padding: 0 !important;
  flex: 0 0 12px !important;
  box-shadow: none !important;
  vertical-align: top !important;
  accent-color: #0f57a4;
  appearance: auto !important;
  -webkit-appearance: auto !important;
}

/* ラジオはサイズは変えず位置だけ軽く調整 */
.hs-form input[type="radio"] {
  margin: 1px 0 0 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  vertical-align: top !important;
  width: 1em !important;
}

/* 単一チェックボックス用 */
.hs-form .hs-form-booleancheckbox label {
  display: flex !important;
  align-items: flex-start;
  gap: 8px;
  font-weight: 400 !important;
}

.hs-form .hs-form-booleancheckbox input[type="checkbox"] {
  margin-top: 4px !important;
}

/* 一部文字だけ大きくならないよう固定 */
.hs-form .inputs-list label,
.hs-form .inputs-list label *,
.hs-form .hs-form-booleancheckbox label,
.hs-form .hs-form-booleancheckbox label * {
  font-size: 16px !important;
  line-height: inherit !important;
  font-weight: 400 !important;
  font-style: normal !important;
}

.hs-form input.hs-input[type="checkbox"] {
  margin-top: 6px!important;
}

.form-columns-0 .hs-richtext.hs-main-font-element h4:not(.class) {
  margin: 20px 0px 40px !important;
}

.hs_submit {
  text-align: center;
}

/* 疑似要素の抑制 */
.hs-form .hs-form-booleancheckbox > label::after,
.hs-form .hs-form-radio > label::after,
.hs-form .inputs-list label::after {
  content: none !important;
}

/* =========================================================
   9) タブレット
   ========================================================= */

@media (max-width: 991px) {
  .hs-form {
    padding: 8px 24px 20px !important;
  }

  .hs-form .hs-form-field {
    margin-bottom: 17px;
  }

  .hs-form .hs-richtext,
  .hbspt-form .hs-richtext,
  .hs-form-wrapper .hs-richtext {
    margin-bottom: 16px !important;
  }

  .hs-form .hs-richtext img,
  .hbspt-form .hs-richtext img,
  .hs-form-wrapper .hs-richtext img {
    margin-bottom: 8px !important;
  }

  .hs-form .hs-richtext h1,
  .hs-form .hs-richtext h2,
  .hbspt-form .hs-richtext h1,
  .hbspt-form .hs-richtext h2,
  .hs-form-wrapper .hs-richtext h1,
  .hs-form-wrapper .hs-richtext h2 {
    margin-bottom: 10px !important;
    font-size: 30px !important;
    line-height: 1.3 !important;
  }

  .hs-form .hs-richtext p,
  .hbspt-form .hs-richtext p,
  .hs-form-wrapper .hs-richtext p {
    margin-bottom: 8px !important;
    font-size: 14px;
    line-height: 1.65;
  }

  .hs-form .hs-field-desc,
  .hs-form .inputs-list .hs-field-desc,
  .hs-form .hs-richtext .hs-form-field p,
  .hs-form .hs-error-msgs,
  .hs-form .hs-error-msgs label {
    font-size: 13px;
    line-height: 1.6;
    font-weight: 400 !important;
  }
}

/* =========================================================
   10) スマホ
   ========================================================= */

@media (max-width: 767px) {
  .hs-form {
    padding: 4px 16px 16px !important;
  }

  .hs-form .hs-form-field {
    margin-bottom: 16px;
  }

  .hs-form .hs-richtext,
  .hbspt-form .hs-richtext,
  .hs-form-wrapper .hs-richtext {
    margin-bottom: 12px !important;
  }

  .hs-form .hs-richtext img,
  .hbspt-form .hs-richtext img,
  .hs-form-wrapper .hs-richtext img {
    margin-bottom: 6px !important;
  }

  .hs-form .hs-richtext h1,
  .hs-form .hs-richtext h2,
  .hbspt-form .hs-richtext h1,
  .hbspt-form .hs-richtext h2,
  .hs-form-wrapper .hs-richtext h1,
  .hs-form-wrapper .hs-richtext h2,
  .hs-form h1,
  .hs-form h2,
  .hbspt-form h1,
  .hbspt-form h2,
  .hs-form-wrapper h1,
  .hs-form-wrapper h2,
  .hs_cos_wrapper_type_rich_text h1,
  .hs_cos_wrapper_type_rich_text h2,
  .dnd-module .hs_cos_wrapper_type_rich_text h1,
  .dnd-module .hs_cos_wrapper_type_rich_text h2,
  .page-center .hs_cos_wrapper_type_rich_text h1,
  .page-center .hs_cos_wrapper_type_rich_text h2,
  .module-type-rich_text h1,
  .module-type-rich_text h2,
  .page-center h1,
  .page-center h2 {
    margin-bottom: 8px !important;
    font-size: 18px !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;
  }

  .hs-form .hs-richtext p,
  .hbspt-form .hs-richtext p,
  .hs-form-wrapper .hs-richtext p {
    margin-bottom: 6px !important;
    font-size: 13px;
    line-height: 1.6;
  }

  .hs-form .hs-field-desc,
  .hs-form .inputs-list .hs-field-desc,
  .hs-form .hs-richtext .hs-form-field p,
  .hs-form .hs-error-msgs,
  .hs-form .hs-error-msgs label {
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400 !important;
  }

  .hs-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not(.hs-button),
  .hs-form select,
  .hs-form textarea {
    min-height: 44px;
    padding: 11px 12px;
    font-size: 14px;
  }

  .hs-form .actions {
    margin-top: 22px;
  }

  .hs-form .actions input[type="submit"],
  .hs-form input[type="submit"],
  .hs-form .hs-button,
  .hs-form button[type="submit"] {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
  }

  /* スマホではさらに少し小さく */
  .hs-form input[type="checkbox"] {
    width: 11px !important;
    height: 11px !important;
    min-width: 11px !important;
    min-height: 11px !important;
    flex: 0 0 11px !important;
    margin-top: 4px !important;
  }

  .hs-form .inputs-list label,
  .hs-form .hs-form-booleancheckbox label {
    gap: 7px;
    font-size: 14px;
    line-height: 1.6;
  }
}