/*
 * Housing estimate renewal v2
 * Goal: visually match the renewed package estimate form.
 * Existing housing input names/ids/values/text/required labels and JS behavior are preserved.
 */

/* --- eliminate legacy housing layout influence --- */
body.form { margin:0 !important; background:#fff !important; color:#111; }
body.form #formWrapper { width:100% !important; min-width:0 !important; margin:0 !important; padding:0 !important; }
body.form .c-forms { width:100%; margin:0; }
body.form .sub_box,
body.form .form_table,
body.form .form_table table,
body.form .form_table thead,
body.form .form_table tbody { width:100% !important; margin:0 !important; padding:0 !important; border:0 !important; background:transparent !important; }
body.form .form_table table { border-collapse:collapse !important; border-spacing:0 !important; table-layout:fixed; }

/* --- section title: same visual rhythm as package form --- */
body.form .subttl {
  position:relative;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:52px 0 28px !important;
  padding:0 0 15px !important;
  background:none !important;
  border:0 !important;
  border-bottom:1px solid #c7cbd0 !important;
}
body.form .subttl::after {
  content:"";
  position:absolute;
  left:0; bottom:-1px;
  width:36px; height:2px;
  background:#0b4d95;
}
body.form .subttl h3 {
  margin:0 !important;
  padding:0 !important;
  color:#111 !important;
  font-size:24px !important;
  font-weight:700 !important;
  line-height:1.45 !important;
  background:none !important;
}
body.form .c-forms > .subttl:first-of-type { margin-top:0 !important; }

/* --- rows --- */
body.form .form_table tr {
  display:table-row !important;
  border-top:1px solid #d8dce1 !important;
  border-bottom:0 !important;
  background:#fff !important;
}

/* JS/旧フォームの display:none を最優先。
   これがないと table-row !important により条件項目が常時表示される。 */
body.form .form_table tr[style*="display: none"],
body.form .form_table tr[style*="display:none"] {
  display:none !important;
}

body.form .form_table tr:last-child { border-bottom:1px solid #d8dce1 !important; }
body.form .form_table th,
body.form .form_table td {
  float:none !important;
  box-sizing:border-box !important;
  height:auto !important;
  min-height:0 !important;
  border:0 !important;
  padding:24px 24px !important;
  vertical-align:middle !important;
}
body.form .form_table th {
  width:270px !important;
  background:#f0f4f8 !important;
  color:#111 !important;
  font-size:15px !important;
  font-weight:700 !important;
  text-align:left !important;
}
body.form .form_table td {
  width:auto !important;
  background:#fff !important;
  font-size:14px !important;
}
body.form .form_table th .flex-box {
  display:flex !important;
  width:100% !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}
body.form .form_hissu,
body.form .form_hissu2,
body.form .form_hissu4,
body.form .form_hissu5 {
  width:auto !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  background:none !important;
  color:#111 !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1.55 !important;
}
body.form .hissu_mark,
body.form .nini_mark {
  position:static !important;
  float:none !important;
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  min-width:38px !important;
  height:24px !important;
  margin:0 !important;
  padding:0 6px !important;
  border:0 !important;
  border-radius:0 !important;
  color:#fff !important;
  font-size:11px !important;
  font-weight:700 !important;
  line-height:1 !important;
}
body.form .hissu_mark { background:#e83028 !important; }
body.form .nini_mark { background:#71839a !important; }

/* --- radio / button choices --- */
body.form .f_list1,
body.form .f_list2,
body.form .conf_list1,
body.form .in-flex-box {
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:stretch !important;
  gap:10px !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
body.form .f_list1 li,
body.form .f_list2 li,
body.form .conf_list1 li { float:none !important; width:auto !important; height:auto !important; margin:0 !important; padding:0 !important; }
body.form .f_list1 input[type="radio"],
body.form .f_list2 input[type="radio"],
body.form .conf_list1 input[type="radio"],
body.form .f_txt_td > input[type="radio"] { position:absolute !important; opacity:0 !important; pointer-events:none; }
body.form .f_list1 input[type="radio"] + label,
body.form .f_list2 input[type="radio"] + label,
body.form .conf_list1 input[type="radio"] + label,
body.form .f_txt_td > input[type="radio"] + label {
  box-sizing:border-box !important;
  display:inline-flex !important;
  min-width:132px !important;
  min-height:56px !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  padding:9px 18px !important;
  border:1px solid #d6dbe1 !important;
  border-radius:3px !important;
  background:#fff !important;
  box-shadow:0 2px 6px rgba(0,0,0,.10) !important;
  color:#0b417f !important;
  font-size:14px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  text-align:center !important;
  cursor:pointer !important;
}
body.form input[type="radio"]:checked + label {
  border:2px solid #f04438 !important;
  color:#0b417f !important;
  background:#fff !important;
}

/* --- standard inputs --- */
body.form input[type="text"],
body.form input[type="email"],
body.form input[type="tel"],
body.form textarea {
  box-sizing:border-box !important;
  width:min(100%, 560px) !important;
  max-width:100% !important;
  height:42px !important;
  min-height:42px !important;
  margin:0 !important;
  padding:8px 12px !important;
  border:1px solid #c8d0d9 !important;
  border-radius:2px !important;
  background:#fff;
  color:#111 !important;
  font-size:15px !important;
  box-shadow:none !important;
}
body.form textarea { height:120px !important; resize:vertical; }
body.form input:focus, body.form textarea:focus { outline:2px solid rgba(11,77,149,.18) !important; border-color:#0b4d95 !important; }
body.form .f_rei, body.form .f_rei_n, body.form .f_kiki_txt, body.form .f_kiki_txt_r {
  width:auto !important; margin:7px 0 0 !important; padding:0 !important; font-size:12px !important; line-height:1.55 !important;
}
body.form .alert_txt_box, body.form .alert_txt_box2 { margin-top:7px !important; color:#e83028 !important; font-size:12px !important; }
body.form .check_mark { margin-left:10px !important; }
body.form .ok_icon { display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:28px; border-radius:50%; background:#66a9eb; color:#fff; font-size:11px; font-weight:700; }

/* --- housing equipment image cards --- */
body.form .f_kiki_isyo { display:block !important; width:100% !important; }
body.form .f_kiki_isyo > ul {
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:12px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
body.form .f_kiki_isyo li { float:none !important; width:auto !important; height:auto !important; margin:0 !important; padding:0 !important; }
body.form .f_kiki_isyo li:empty { display:none !important; }
body.form .f_kiki_isyo input[type="checkbox"] { position:absolute !important; opacity:0 !important; }
body.form .f_kiki_isyo label {
  display:flex !important;
  flex-direction:column !important;
  box-sizing:border-box !important;
  width:100% !important;
  min-height:140px !important;
  margin:0 !important;
  padding:10px !important;
  border:1px solid #d6dbe1 !important;
  border-radius:3px !important;
  background:#fff !important;
  box-shadow:0 2px 5px rgba(0,0,0,.08) !important;
  cursor:pointer !important;
}
body.form .f_kiki_isyo label img {
  display:block !important;
  width:100% !important;
  height:90px !important;
  object-fit:contain !important;
  margin:0 auto 8px !important;
  background:#f3f6fa !important;
}
body.form .f_kiki_isyo_name {
  display:flex !important;
  flex:1 !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:100% !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  color:#111 !important;
  font-size:13px !important;
  font-weight:600 !important;
  line-height:1.35 !important;
}
body.form .f_kiki_isyo input[type="checkbox"]:checked + label { border:2px solid #f04438 !important; padding:9px !important; }
body.form .f_kiki_other { display:none !important; }
body.form .f_heya_yoto { margin-top:210px !important; font-size:13px !important; }

/* --- installation-use icon cards --- */
body.form .f_fld_chk { display:block !important; width:100% !important; }
body.form .f_fld_chk > ul {
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:10px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
body.form .f_fld_chk li { float:none !important; width:auto !important; height:auto !important; margin:0 !important; padding:0 !important; }
body.form .f_fld_chk input[type="checkbox"] { position:absolute !important; opacity:0 !important; }
body.form .f_fld_chk label {
  display:flex !important;
  box-sizing:border-box !important;
  width:100% !important;
  min-height:58px !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 !important;
  padding:7px 10px !important;
  border:1px solid #d6dbe1 !important;
  border-radius:3px !important;
  background:#fff !important;
  box-shadow:0 2px 5px rgba(0,0,0,.08) !important;
  cursor:pointer !important;
}
body.form .f_fld_chk_img { float:none !important; width:34px !important; height:34px !important; margin:0 !important; padding:0 !important; }
body.form .f_fld_chk_img img { display:block !important; width:34px !important; height:34px !important; object-fit:contain !important; }
body.form .f_fld_chk_name { float:none !important; width:auto !important; margin:0 !important; padding:0 !important; color:#111 !important; font-size:12px !important; font-weight:600 !important; }
body.form .f_fld_chk input[type="checkbox"]:checked + label { border:2px solid #f04438 !important; padding:6px 9px !important; }

/* --- lower information panels --- */
body.form .guest_info_b {
  box-sizing:border-box !important;
  width:100% !important;
  margin:48px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  background:#fff !important;
}
body.form .guest_info_b h3 {
  position:relative; margin:0 0 24px !important; padding:0 0 15px !important;
  border-bottom:1px solid #c7cbd0 !important; color:#111 !important; font-size:24px !important; font-weight:700 !important;
}
body.form .guest_info_b h3::after { content:""; position:absolute; left:0; bottom:-1px; width:36px; height:2px; background:#0b4d95; }
body.form .guest_info_list_b { box-sizing:border-box !important; margin:0 !important; padding:22px 28px 22px 48px !important; border:1px solid #d8dce1 !important; background:#fff !important; font-size:13px !important; }
body.form .checkbox02 { margin:18px 0 0 !important; padding:0 !important; }
body.form .doi { display:inline-flex !important; align-items:center; gap:10px; min-height:42px; cursor:pointer; }
body.form .enq_box { box-sizing:border-box !important; padding:0 !important; }
body.form .enq_box ul { display:flex !important; flex-wrap:wrap !important; gap:12px 24px !important; margin:0 !important; padding:20px 24px !important; border:1px solid #d8dce1 !important; list-style:none !important; }
body.form .enq_box li { width:auto !important; margin:0 !important; }

/* --- submit / SSL --- */
body.form #chk_alert { color:#f04438 !important; font-size:14px !important; font-weight:700 !important; text-align:center !important; }
body.form .estimate_btn { margin:18px auto 20px !important; text-align:center !important; }
body.form .estimate_btn input[type="image"] { width:260px !important; max-width:80% !important; height:auto !important; }
body.form .form_under_txt { margin:20px 0 50px !important; font-size:12px !important; text-align:center !important; }

/* no legacy campaign/header/banner/footer should leak through because v2 HTML uses package components */

@media (max-width: 750px) {
  body.form .form_table table, body.form .form_table tbody, body.form .form_table thead, body.form .form_table tr,
  body.form .form_table th, body.form .form_table td { display:block !important; width:100% !important; }
  body.form .form_table th, body.form .form_table td { padding:16px !important; }
  body.form .f_kiki_isyo > ul, body.form .f_fld_chk > ul { grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
  body.form .subttl h3, body.form .guest_info_b h3 { font-size:20px !important; }
}

/* ============================================================
   v3: lower area matched to renewed package estimate form
   Questionnaire -> Request -> Consent -> Submit -> SSL
   ============================================================ */
body.form .package-lower-block {
  width:100% !important;
  margin:52px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  background:#fff !important;
}
body.form .package-lower-block h3 {
  position:relative !important;
  margin:0 0 28px !important;
  padding:0 0 15px !important;
  border:0 !important;
  border-bottom:1px solid #c7cbd0 !important;
  background:none !important;
  color:#111 !important;
  font-size:24px !important;
  font-weight:700 !important;
  line-height:1.45 !important;
}
body.form .package-lower-block h3::after {
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  bottom:-1px !important;
  width:36px !important;
  height:2px !important;
  background:#0b4d95 !important;
}

/* Questionnaire: package-style two-column form row */
body.form .enq_box {
  display:grid !important;
  grid-template-columns:270px minmax(0,1fr) !important;
  align-items:stretch !important;
}
body.form .enq_box > h3 {
  grid-column:1 / -1 !important;
}
body.form .enq_box > .enq_question {
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  min-height:184px !important;
  margin:0 !important;
  padding:24px !important;
  border-top:1px solid #d8dce1 !important;
  border-bottom:1px solid #d8dce1 !important;
  background:#f0f4f8 !important;
  color:#111 !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1.55 !important;
}
body.form .enq_box > .enq_question::after {
  content:"任意";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:38px;
  height:24px;
  margin-left:auto;
  padding:0 6px;
  box-sizing:border-box;
  background:#fff;
  border:1px solid #d8dce1;
  color:#111;
  font-size:11px;
  font-weight:700;
}
body.form .enq_box > ul {
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  min-height:184px !important;
  margin:0 !important;
  padding:20px 22px !important;
  border-top:1px solid #d8dce1 !important;
  border-bottom:1px solid #d8dce1 !important;
  border-left:0 !important;
  border-right:0 !important;
  background:#fff !important;
  list-style:none !important;
}
body.form .enq_box > ul > li {
  min-width:0 !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
}
body.form .enq_box > ul > li:not(.enq_other) > label {
  position:relative !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:52px !important;
  padding:8px 12px !important;
  border:1px solid #d6dbe1 !important;
  border-radius:4px !important;
  background:linear-gradient(#fff,#f8f9fb) !important;
  box-shadow:0 2px 6px rgba(0,0,0,.10) !important;
  color:#0b4d95 !important;
  font-size:14px !important;
  font-weight:700 !important;
  text-align:center !important;
  cursor:pointer !important;
}
body.form .enq_box > ul > li:not(.enq_other) > label > input[type="radio"] {
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
}
body.form .enq_box > ul > li:not(.enq_other) > label:has(input[type="radio"]:checked) {
  border:2px solid #ef4136 !important;
  padding:7px 11px !important;
  background:#fff !important;
}
body.form .enq_box > ul > .enq_other {
  grid-column:1 / -1 !important;
}
body.form .enq_box > ul > .enq_other > label {
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) !important;
  align-items:center !important;
  gap:12px !important;
  color:#0b4d95 !important;
  font-size:13px !important;
  font-weight:600 !important;
  cursor:pointer !important;
}
body.form .enq_box > ul > .enq_other > label > input[type="radio"] {
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
}
body.form .enq_box > ul > .enq_other input[type="text"] {
  box-sizing:border-box !important;
  width:100% !important;
  max-width:none !important;
  height:44px !important;
  margin:0 !important;
  padding:0 14px !important;
  border:1px solid #9fb0c3 !important;
  border-radius:3px !important;
  background:#fff !important;
  font-size:14px !important;
  box-shadow:none !important;
}

/* Request text: package has no boxed gray panel around the numbered list */
body.form .request_box .guest_info_list_b {
  box-sizing:border-box !important;
  margin:0 !important;
  padding:0 8px 0 24px !important;
  border:0 !important;
  background:#fff !important;
  color:#111 !important;
  font-size:13px !important;
  line-height:1.75 !important;
}
body.form .request_box .guest_info_list_b a {
  color:#e23b32 !important;
  text-decoration:underline !important;
}

/* Consent bar */
body.form .request_box .checkbox02 {
  box-sizing:border-box !important;
  width:100% !important;
  margin:24px 0 0 !important;
  padding:0 !important;
  border:1px solid #d8dce1 !important;
  background:linear-gradient(#fff,#f8f9fb) !important;
}
body.form .request_box .doi {
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  width:100% !important;
  min-height:44px !important;
  margin:0 !important;
  padding:8px 16px !important;
  color:#111 !important;
  font-size:14px !important;
  font-weight:700 !important;
  cursor:pointer !important;
}
body.form .request_box .doi input[type="checkbox"] {
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  width:20px !important;
  height:20px !important;
  margin:0 !important;
  border:1px solid #cbd1d8 !important;
  border-radius:0 !important;
  background:#fff !important;
  position:relative !important;
  cursor:pointer !important;
}
body.form .request_box .doi input[type="checkbox"]:checked::after {
  content:"";
  position:absolute;
  left:5px;
  top:1px;
  width:6px;
  height:11px;
  border:solid #0b4d95;
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
body.form .request_box .checkbox01-parts::before,
body.form .request_box .checkbox01-parts::after { display:none !important; }

/* Alert exactly above submit */
body.form #chk_alert {
  margin:30px 0 18px !important;
  color:#ef4136 !important;
  font-size:14px !important;
  font-weight:700 !important;
  text-align:center !important;
}

/* Keep original image-submit input/JS, but render package-style button on top of it. */
body.form .estimate_btn {
  position:relative !important;
  width:410px !important;
  height:86px !important;
  margin:32px auto 48px !important;
  padding:0 !important;
  border:0 !important;
  background:linear-gradient(to bottom,#ff3931 0%,#f3261e 55%,#e8140c 100%) !important;
  border-bottom:6px solid #b72a20 !important;
  border-radius:4px !important;
  overflow:hidden !important;
  text-align:center !important;
}
body.form .estimate_btn::before {
  content:"›";
  position:absolute;
  left:82px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:3px;
  background:#fff;
  color:#f3261e;
  font-size:38px;
  font-family:Arial,sans-serif;
  font-weight:400;
  line-height:1;
  z-index:1;
  pointer-events:none;
}
body.form .estimate_btn::after {
  content:"送信する";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding-left:36px;
  box-sizing:border-box;
  color:#fff;
  font-size:36px;
  font-weight:700;
  letter-spacing:.02em;
  z-index:1;
  pointer-events:none;
}
body.form .estimate_btn input[type="image"] {
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  display:block !important;
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  opacity:0 !important;
  cursor:pointer !important;
}
body.form .estimate_btn:has(#sub:disabled) {
  background:#a7b4c4 !important;
  border-bottom-color:#8996a6 !important;
}
body.form .estimate_btn:has(#sub:disabled)::before { color:#8ea0b4 !important; }
body.form .estimate_btn:has(#sub:disabled) input[type="image"] { cursor:not-allowed !important; }

body.form .form_under_txt {
  margin:0 0 54px !important;
  padding:0 !important;
  color:#111 !important;
  font-size:12px !important;
  line-height:1.65 !important;
  text-align:left !important;
}
body.form .form_under_txt a { color:#0b4d95 !important; text-decoration:underline !important; }

@media (max-width: 750px) {
  body.form .package-lower-block h3 { font-size:20px !important; }
  body.form .enq_box { display:block !important; }
  body.form .enq_box > .enq_question { min-height:0 !important; padding:16px !important; }
  body.form .enq_box > ul { grid-template-columns:1fr !important; min-height:0 !important; padding:16px !important; }
  body.form .enq_box > .enq_question { border-bottom:0 !important; }
  body.form .estimate_btn { width:min(410px,90vw) !important; height:76px !important; }
  body.form .estimate_btn::after { font-size:30px !important; }
  body.form .estimate_btn::before { left:64px !important; }
}

/* ============================================================
   v9: spacing under header note + larger choice-button typography
   Match the renewed package estimate form reference.
   ============================================================ */

/* Keep the same breathing room between the instructional note and first section title. */
body.form .c-forms-header-step__note {
  margin: 0 0 34px !important;
  padding: 0 !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

/* The first form heading follows the note with no extra collapsed/negative spacing. */
body.form .c-forms > .subttl:first-of-type {
  margin-top: 0 !important;
  margin-bottom: 28px !important;
}

/* Match package-form choice text size, including installation / schedule / room buttons. */
body.form .f_list1 input[type="radio"] + label,
body.form .f_list2 input[type="radio"] + label,
body.form .conf_list1 input[type="radio"] + label,
body.form .f_txt_td > input[type="radio"] + label,
body.form input[name="kouji"] + label {
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

/* In case labels contain small nested text, keep the main selection labels visually consistent. */
body.form .f_list1 input[type="radio"] + label > span:not([style*="80%"]),
body.form .f_list2 input[type="radio"] + label > span,
body.form .conf_list1 input[type="radio"] + label > span,
body.form input[name="kouji"] + label > span {
  font-size: 16px !important;
  font-weight: 700 !important;
}

@media (max-width: 750px) {
  body.form .c-forms-header-step__note {
    margin-bottom: 26px !important;
    font-size: 13px !important;
  }
  body.form .f_list1 input[type="radio"] + label,
  body.form .f_list2 input[type="radio"] + label,
  body.form .conf_list1 input[type="radio"] + label,
  body.form .f_txt_td > input[type="radio"] + label,
  body.form input[name="kouji"] + label {
    font-size: 15px !important;
  }
}

/* Banner telephone typography: restore package-form size */
body.form .c-banner-form__tel-wrap .is-label {
  font-size: 14px !important;
  line-height: 1 !important;
}
body.form .c-banner-form__tel-wrap .is-number {
  font-size: 32px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* =========================================================
   Housing banner title background image
   Package: bg-banner-form-title.webp
   Housing: hs-bg-banner-form-title-hs.webp
========================================================= */
body.form .c-banner-form__title {
  background-image: url("https://www.e-aircon.jp/assets/images/hs-bg-banner-form-title-hs.webp") !important;
}


/* ============================================================
   v12: smartphone responsive tuning
   Reference: renewed package form responsive rules.
   Desktop styles above are kept unchanged.
   ============================================================ */

/* Housing orange banner corner accents */
body.form .c-banner-form__title::before,
body.form .c-banner-form__title::after {
  background:#F17606 !important;
}

@media screen and (max-width: 750px) {
  /* Page/container: follow package form's compact mobile gutter */
  html { -webkit-text-size-adjust:100%; }
  body.form { min-width:0 !important; overflow-x:hidden !important; }
  body.form #formWrapper,
  body.form .c-forms,
  body.form .sub_box,
  body.form .form_table,
  body.form .form_table table,
  body.form .form_table tbody,
  body.form .form_table thead {
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }

  /* Section headings: same compact rhythm as package mobile */
  body.form .subttl {
    margin:34px 0 18px !important;
    padding:0 0 8px !important;
  }
  body.form .c-forms > .subttl:first-of-type {
    margin-top:0 !important;
    margin-bottom:18px !important;
  }
  body.form .subttl h3,
  body.form .guest_info_b h3,
  body.form .package-lower-block h3 {
    font-size:20px !important;
    line-height:1.45 !important;
  }
  body.form .subttl::after,
  body.form .guest_info_b h3::after,
  body.form .package-lower-block h3::after {
    width:18px !important;
  }

  /* Table rows become title block + content block, like .c-forms__block on SP. */
  body.form .form_table table,
  body.form .form_table tbody,
  body.form .form_table thead,
  body.form .form_table tr,
  body.form .form_table th,
  body.form .form_table td {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  body.form .form_table tr {
    border-top:1px solid #d3d3d3 !important;
  }
  body.form .form_table th {
    box-sizing:border-box !important;
    padding:10px !important;
    min-height:0 !important;
    border-bottom:1px solid #d3d3d3 !important;
    background:#f0f4f8 !important;
  }
  body.form .form_table td {
    box-sizing:border-box !important;
    padding:24px 0 !important;
    min-height:0 !important;
    background:#fff !important;
  }
  body.form .form_table th .flex-box {
    min-height:28px !important;
  }
  body.form .form_hissu,
  body.form .form_hissu2,
  body.form .form_hissu4,
  body.form .form_hissu5 {
    font-size:14px !important;
    line-height:1.45 !important;
  }
  body.form .hissu_mark,
  body.form .nini_mark {
    height:24px !important;
    min-width:38px !important;
    font-size:11px !important;
  }

  /* Remove desktop-only vertical spacer that causes the huge gray block on SP. */
  body.form .f_heya_yoto {
    margin:16px 0 0 !important;
    padding:0 !important;
    font-size:13px !important;
    line-height:1.4 !important;
  }

  /* Standard choice buttons: 3-column feel when space permits, same as package. */
  body.form .f_list1,
  body.form .f_list2,
  body.form .conf_list1,
  body.form .in-flex-box {
    gap:8px !important;
  }
  body.form .f_list1 li,
  body.form .f_list2 li,
  body.form .conf_list1 li {
    flex:1 1 calc(33.333% - 6px) !important;
    min-width:0 !important;
  }
  body.form .f_list1 input[type="radio"] + label,
  body.form .f_list2 input[type="radio"] + label,
  body.form .conf_list1 input[type="radio"] + label,
  body.form .f_txt_td > input[type="radio"] + label,
  body.form input[name="kouji"] + label {
    width:100% !important;
    min-width:0 !important;
    min-height:40px !important;
    padding:7px 8px !important;
    font-size:14px !important;
    line-height:1.3 !important;
  }

  /* Purpose cards: package SP hides icons and uses compact 3-column buttons. */
  body.form .f_fld_chk > ul {
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    gap:8px !important;
  }
  body.form .f_fld_chk label {
    min-height:40px !important;
    justify-content:center !important;
    padding:7px 6px !important;
    gap:0 !important;
  }
  body.form .f_fld_chk_img {
    display:none !important;
  }
  body.form .f_fld_chk_name {
    width:100% !important;
    text-align:center !important;
    font-size:12px !important;
    font-weight:700 !important;
    line-height:1.3 !important;
  }
  body.form .f_fld_chk input[type="checkbox"]:checked + label {
    padding:6px 5px !important;
  }

  /* Equipment cards: package SP uses compact image+text horizontal cards. */
  body.form .f_kiki_isyo > ul {
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    gap:8px !important;
  }
  body.form .f_kiki_isyo label {
    display:grid !important;
    grid-template-columns:60px minmax(0,1fr) !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
    min-height:60px !important;
    padding:3px !important;
  }
  body.form .f_kiki_isyo label img {
    width:60px !important;
    height:56px !important;
    margin:0 !important;
    object-fit:contain !important;
    background:#f3f6fa !important;
  }
  body.form .f_kiki_isyo_name {
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:auto !important;
    font-size:12px !important;
    font-weight:700 !important;
    line-height:1.25 !important;
    text-align:left !important;
  }
  body.form .f_kiki_isyo input[type="checkbox"]:checked + label {
    padding:2px !important;
  }

  /* Inputs / textarea use full mobile width. */
  body.form input[type="text"],
  body.form input[type="email"],
  body.form input[type="tel"],
  body.form textarea {
    width:100% !important;
    max-width:100% !important;
    font-size:16px !important; /* prevents iOS zoom */
  }
  body.form textarea { min-height:120px !important; }

  /* Validation mark no longer floats into the cards. */
  body.form .check_mark {
    position:relative !important;
    top:auto !important;
    right:auto !important;
    width:20px !important;
    height:20px !important;
    margin:12px 0 0 auto !important;
    display:none;
  }
  body.form .check_mark:has(*) { display:block !important; }

  /* Lower blocks */
  body.form .package-lower-block { margin-top:36px !important; }
  body.form .enq_box { display:block !important; }
  body.form .enq_box > .enq_question {
    min-height:0 !important;
    padding:10px !important;
    border-bottom:1px solid #d8dce1 !important;
  }
  body.form .enq_box > ul {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    min-height:0 !important;
    padding:16px 0 !important;
  }
  body.form .request_box .guest_info_list_b {
    padding-left:22px !important;
    font-size:12px !important;
  }

  /* Submit button fits the viewport. */
  body.form .estimate_btn {
    width:min(410px, calc(100vw - 32px)) !important;
    height:72px !important;
    margin:28px auto 38px !important;
  }
  body.form .estimate_btn::after { font-size:28px !important; }
  body.form .estimate_btn::before { left:52px !important; }

  /* Banner: keep all typography/content inside viewport. */
  body.form .c-banner-form {
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }
  body.form .c-banner-form__title {
    font-size:clamp(16px,4.4vw,22px) !important;
  }
  body.form .c-banner-form__lead {
    font-size:clamp(15px,4vw,20px) !important;
  }
  body.form .c-banner-form__list {
    font-size:clamp(10px,2.8vw,13px) !important;
  }
  body.form .c-banner-form__tel-wrap .is-label { font-size:12px !important; }
  body.form .c-banner-form__tel-wrap .is-number {
    font-size:clamp(22px,7vw,30px) !important;
    white-space:nowrap !important;
  }
  body.form .c-banner-form__tel-caption {
    font-size:clamp(10px,2.8vw,13px) !important;
  }
}

/* Narrow phones: keep cards readable instead of squeezing text. */
@media screen and (max-width: 430px) {
  body.form .f_kiki_isyo > ul,
  body.form .f_fld_chk > ul {
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
  body.form .f_list1 li,
  body.form .f_list2 li,
  body.form .conf_list1 li {
    flex-basis:calc(50% - 4px) !important;
  }
  body.form .f_kiki_isyo label {
    grid-template-columns:56px minmax(0,1fr) !important;
  }
  body.form .f_kiki_isyo label img {
    width:56px !important;
    height:52px !important;
  }
}

/* ============================================================
   v13: lower request/consent/SSL typography and list alignment
   ============================================================ */

/* Numbered request list: keep markers fully visible and make text easier to read. */
body.form .request_box .guest_info_list_b {
  list-style: decimal outside !important;
  padding: 0 10px 0 2.15em !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
}
body.form .request_box .guest_info_list_b > li {
  display: list-item !important;
  list-style-position: outside !important;
  margin: 0 0 3px !important;
  padding-left: 0.15em !important;
}
body.form .request_box .guest_info_list_b > li:last-child {
  margin-bottom: 0 !important;
}

/* Consent text slightly larger. */
body.form .request_box .doi {
  font-size: 15px !important;
}

/* Validation message slightly larger to match surrounding text. */
body.form #chk_alert {
  font-size: 15px !important;
  line-height: 1.6 !important;
}

/* SSL/privacy notice: larger and with comfortable line-height. */
body.form .form_under_txt {
  font-size: 14px !important;
  line-height: 1.8 !important;
}

@media screen and (max-width: 750px) {
  body.form .request_box .guest_info_list_b {
    padding: 0 4px 0 2.05em !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
  }
  body.form .request_box .doi {
    font-size: 14px !important;
  }
  body.form #chk_alert {
    font-size: 14px !important;
  }
  body.form .form_under_txt {
    font-size: 13px !important;
    line-height: 1.75 !important;
  }
}

/* ============================================================
   v14: larger installation-use labels and equipment-detail notes
   ============================================================ */
body.form .f_fld_chk_name {
  font-size: 15px !important;
  line-height: 1.35 !important;
}

body.form .f_kiki_txt_r {
  font-size: 14px !important;
  line-height: 1.65 !important;
}

@media screen and (max-width: 750px) {
  body.form .f_fld_chk_name {
    font-size: 14px !important;
  }
  body.form .f_kiki_txt_r {
    font-size: 13px !important;
    line-height: 1.6 !important;
  }
}

/* ============================================================
   v15: purpose-button text color and no-wrap
   ============================================================ */
body.form .f_fld_chk_name {
  color: #003a7e !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

@media screen and (max-width: 750px) {
  body.form .f_fld_chk_name {
    color: #003a7e !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }
}

/* ============================================================
   v16: change renewed-form navy UI areas to orange
   ============================================================ */
body.form .c-forms-header-step__item.is-current,
body.form .c-remaining-float,
body.form .l-footer__bottom {
  background: #F17606 !important;
}

/* Arrow tip at the right side of the current step */
body.form .c-forms-header-step__item.is-current::before,
body.form .c-forms-header-step__item.is-current::after {
  border-left-color: #F17606 !important;
  background-color: #F17606 !important;
}

/* ============================================================
   v19: larger helper/example text below customer information fields
   ============================================================ */
body.form .f_rei,
body.form .f_rei_n {
  font-size: 14px !important;
  line-height: 1.7 !important;
}

@media screen and (max-width: 750px) {
  body.form .f_rei,
  body.form .f_rei_n {
    font-size: 14px !important;
    line-height: 1.65 !important;
  }
}

/* ============================================================
   v21: SP - corporation / individual choices side by side
   Keep the same visual inset as the desktop form.
   ============================================================ */
@media screen and (max-width: 750px) {
  body.form .customer-type-options {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding: 14px 16px !important;
    box-sizing: border-box !important;
  }

  body.form .customer-type-options > input[type="radio"] {
    position: absolute !important;
  }

  body.form .customer-type-options > input[type="radio"] + label {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
  }

  body.form .customer-type-options > #chk_company + label {
    flex: 1.75 1 0 !important;
  }

  body.form .customer-type-options > #chk_kojin + label {
    flex: 1 1 0 !important;
  }

  body.form .customer-type-options .check_mark,
  body.form .customer-type-options .alert_txt_box {
    flex: 0 0 100% !important;
  }
}

/* ============================================================
   v22: corporation / individual choice button text alignment
   ============================================================ */
body.form .customer-type-options > input[type="radio"] + label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1.4 !important;
}

@media screen and (max-width: 750px) {
  body.form .customer-type-options > input[type="radio"] + label {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
}

/* ============================================================
   v23: corporation / individual choice group alignment
   Match the package-form inset and keep both button labels centered.
   ============================================================ */
@media screen and (min-width: 751px) {
  body.form .form_table td.customer-type-options {
    padding-left: 36px !important;
    white-space: nowrap !important;
  }

  body.form .customer-type-options > #chk_company + label {
    width: 232px !important;
    min-width: 232px !important;
    margin: 0 16px 0 0 !important;
    padding: 9px 12px !important;
  }

  body.form .customer-type-options > #chk_kojin + label {
    width: 132px !important;
    min-width: 132px !important;
    margin: 0 !important;
    padding: 9px 12px !important;
  }
}

body.form .customer-type-options > #chk_company + label,
body.form .customer-type-options > #chk_kojin + label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  vertical-align: middle !important;
  line-height: 1.4 !important;
}

@media screen and (max-width: 750px) {
  body.form .customer-type-options {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding: 16px !important;
  }

  body.form .customer-type-options > #chk_company + label,
  body.form .customer-type-options > #chk_kojin + label {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.form .customer-type-options > #chk_company + label {
    flex: 1.75 1 0 !important;
  }

  body.form .customer-type-options > #chk_kojin + label {
    flex: 1 1 0 !important;
  }

  body.form .customer-type-options .check_mark,
  body.form .customer-type-options .alert_txt_box {
    flex: 0 0 100% !important;
  }
}
