/* =========================================================
   確認画面・完了画面（iframeポップアップ）用
   KH100モニターキャンペーンLPのデザインに合わせた版
   ========================================================= */

body,
div,
form {
  margin: 0;
  padding: 0;
}

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

body {
  background: #fff;
}

form {
  max-width: 760px;
  margin: 0 auto;
  padding: 24px clamp(16px, 4vw, 32px);
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
  font-size: 15px;
  line-height: 1.8;
  color: #1f2b2d;
}

/* ---------- 冒頭の案内文 ---------- */
.aptoenq {
  margin: 0 0 20px;
  padding: 12px 16px;
  border-left: 5px solid #c8651b;
  border-radius: 0 8px 8px 0;
  background: #fff6ee;
  font-size: 14px;
  color: #34484a;
}

/* ---------- 設問と回答 ---------- */
.aptoenq_qa {
  margin: 0 0 14px;
  border: 1px solid #d3e4df;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

.aptoenq_q {
  padding: 10px 16px;
  border-bottom: 1px solid #d3e4df;
  background: #f3faf8;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.7;
  color: #0d3b3a;
}

.aptoenq_a {
  padding: 10px 16px;
  font-weight: 700;
  word-break: break-word;
}

.aptoenq_br {
  clear: both;
}

/* ---------- お客様情報 ---------- */
.aptoenq_cusinfo {
  display: grid;
  grid-template-columns: 150px 1fr;
  margin: 24px 0 0;
  font-size: 15px;
}

.aptoenq_cusinfo_subj {
  grid-column: 1 / -1;
  margin: 0 0 10px;
  padding: 0 0 0 12px;
  border-left: 5px solid #2fa08a;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.5;
  color: #0d3b3a;
}

.aptoenq_cusinfo .aptoenq_br {
  display: none;
}

.aptoenq_cusinfo .aptoenq_cusinfo_item,
.aptoenq_cusinfo .aptoenq_cusinfo_fm {
  width: auto;
  margin: 0;
  padding: 10px 14px;
  float: none;
  border-bottom: 1px solid #e3eeeb;
  line-height: 1.6;
}

.aptoenq_cusinfo .aptoenq_cusinfo_item {
  background: #f3faf8;
  font-size: 14px;
  font-weight: 700;
  color: #0d3b3a;
}

.aptoenq_cusinfo .aptoenq_cusinfo_fm {
  text-align: left;
  background: #fff;
  word-break: break-word;
}

.aptoenq_cusinfo_odd {
  background: #fff;
}

/* ---------- 汎用 ---------- */
.aptoenq_c {
  text-align: center;
}

.aptoenq_l {
  text-align: left;
}

.aptoenq_exp {
  margin: 24px 0 0;
  font-size: 13px;
  color: #5b6b6d;
}

/* 必須マーク（「*」を「必須」バッジ表示に置換） */
.aptoenq_red {
  display: inline-block;
  margin: 0 8px 0 0;
  font-size: 0;
  line-height: 1;
  vertical-align: 2px;
  color: transparent;
}

.aptoenq_red::after {
  content: "必須";
  display: inline-block;
  padding: 1px 8px;
  border-radius: 4px;
  background: #c8651b;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.6;
  color: #fff;
}

/* ---------- ボタン ---------- */
.aptoenq_bt_set {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: auto;
  margin: 26px auto;
}

.aptoenq_bt_send,
.aptoenq_bt_back {
  width: auto;
  float: none;
  text-align: center;
  background: none;
}

.aptoenq_bt_set button {
  border: 0;
  font-family: inherit;
  cursor: pointer;
}

.aptoenq_bt_send button {
  min-width: min(100%, 320px);
  height: auto;
  padding: 15px 36px;
  border-radius: 999px;
  background: #c8651b;
  box-shadow: 0 6px 18px rgba(200, 101, 27, .35);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.4;
  color: #fff;
  transition: transform .15s, background-color .15s;
}

.aptoenq_bt_send button:hover {
  background: #a45012;
  transform: translateY(-2px);
}

.aptoenq_bt_back button {
  height: auto;
  padding: 4px 8px;
  background: none;
  font-size: 13px;
  color: #5b6b6d;
  text-decoration: underline;
}

.aptoenq_bt_back button:hover {
  color: #0d3b3a;
}

.aptoenq_bt_set button:focus-visible {
  outline: 3px solid rgba(47, 160, 138, .4);
  outline-offset: 2px;
}

/* ---------- 幅が狭い場合（iframe幅で判定） ---------- */
@media (max-width: 520px) {
  form {
    padding: 20px 14px;
  }

  .aptoenq_cusinfo {
    grid-template-columns: 1fr;
  }

  .aptoenq_cusinfo .aptoenq_cusinfo_item {
    padding: 8px 14px;
    border-bottom: 0;
  }

  .aptoenq_bt_send button {
    min-width: 100%;
    padding: 15px 20px;
  }
}
