/* お問い合わせ(/a/p/contact)。数值源:analysis/07 §3 + front/v1/common.css 实测规则。 */

/* 标题段(bgw2 白底,与 guide 同法) */
.page-contact .breadcrumb { background: var(--color-white); }
.section--contact-heading { padding: 111px 0 70px; background: var(--color-white); } /* 实测:box_mv.contact 85/60 叠加后白区总高 360 */
.section--contact-heading .section-title { margin-top: -80px; margin-bottom: 60px; }
@media (max-width: 768px) { .section--contact-heading .section-title { margin-top: -40px; margin-bottom: 40px; } }

/* 3 步进度条:760 容器,圆 46(active 用品牌 rose token),连接横杠 4px */
.box-step { max-width: 760px; margin: 45px auto 0; width: 100%; }
@media (max-width: 768px) { .box-step { margin-top: 40px; } }
.box-step .step { position: relative; display: flex; justify-content: space-between; }
.box-step .step::before {
  content: ""; position: absolute; top: 22px; left: 90px; right: 95px; z-index: 0;
  height: 4px; background: #efefec;
}
@media (max-width: 768px) { .box-step .step::before { left: 16.67%; right: 16.67%; } }
.box-step .step li { text-align: center; }
.box-step .step li.step1 { width: 175px; }
.box-step .step li.step2 { width: 185px; }
.box-step .step li.step3 { width: 190px; }
@media (max-width: 768px) { .box-step .step li.step1, .box-step .step li.step2, .box-step .step li.step3 { width: 33.33%; } }
.box-step .step li .num {
  position: relative; z-index: 1; width: 46px; height: 46px; line-height: 46px;
  margin: 0 auto 15px; background: #efefec; border-radius: 50%;
  font-family: var(--font-en); font-style: italic; font-weight: 500; font-size: 18px;
}
@media (max-width: 768px) { .box-step .step li .num { width: 38px; height: 38px; line-height: 38px; margin-bottom: 5px; font-size: 16px; } }
.box-step .step li.active .num { background: var(--color-main); }
.box-step .step li .txt { font-weight: 500; line-height: 1.3; font-size: 14px; }
@media (max-width: 768px) { .box-step .step li .txt { font-size: 13px; } }
.box-step .step li.step2 .txt, .box-step .step li.step3 .txt { margin-top: 13px; }
@media (min-width: 769px) { .view-sp { display: none; } }

/* 表单容器 */
.con-contact { max-width: 940px; margin: 0 auto; padding: 100px 1.25rem 195px; }
@media (max-width: 768px) { .con-contact { padding: 50px 1.25rem 150px; } }
.box-st { margin: 0 0 70px; line-height: 1.5; text-align: center; }
@media (max-width: 768px) { .box-st { margin-bottom: 40px; } }
.box-st h2 { margin: 0 0 15px; font-weight: 400; font-size: 20px; }
@media (max-width: 768px) { .box-st h2 { font-size: 16px; } }
.box-st p em { color: red; font-style: normal; }

/* 字段行:左标签 220 / 右控件 */
.box-contact { max-width: 860px; margin: 0 auto 80px; }
@media (max-width: 768px) { .box-contact { margin-bottom: 60px; } }
.box-contact .items + .items { margin-top: 35px; } /* 分组 ul 之间保持行距(末行 mb 归零后仍有组间距) */
.box-contact .items li { display: flex; flex-wrap: wrap; align-items: flex-start; margin: 0 0 35px; }
@media (max-width: 768px) { .box-contact .items li { margin-bottom: 30px; } }
.box-contact .items li:last-child { margin-bottom: 0; }
.box-contact .items li .caption { width: 220px; padding-top: 12px; font-size: 16px; font-weight: 400; }
@media (max-width: 768px) { .box-contact .items li .caption { width: 100%; padding-top: 0; margin-bottom: 15px; font-size: 15px; font-weight: 500; } }
.box-contact .items li .caption em { color: red; font-size: 12px; font-style: normal; margin-left: 5px; vertical-align: top; }
.box-contact .items li .caption .sub { display: block; font-size: 13px; margin-top: 10px; }
@media (max-width: 768px) { .box-contact .items li .caption .sub { display: inline; font-size: 12px; margin-top: 0; } }
.box-contact .items li .controls { width: calc(100% - 220px); }
@media (max-width: 768px) { .box-contact .items li .controls { width: 100%; } }

/* 控件外观(form 全局规则) */
.box-contact input[type="text"], .box-contact input[type="email"], .box-contact select, .box-contact textarea {
  display: inline-block; width: 100%; height: 44px; line-height: 42px; padding: 0 15px;
  background: var(--color-white); border: 1px solid var(--color-white); border-radius: 7px; font-size: 15px;
}
.box-contact input { max-width: 400px; }
.box-contact .wrp-select select { max-width: 285px; }
.box-contact textarea { height: 218px; padding-top: 10px; line-height: 1.8; }
@media (max-width: 768px) { .box-contact input, .box-contact .wrp-select select { max-width: 100%; } }

/* 分组隔条 + 隐藏组 */
.box-contact .items li.line-border {
  display: block; margin: 35px 0; padding: 10px 0;
  border-top: 1px solid #999; border-bottom: 1px solid #999; font-size: 16px; font-weight: 500;
}
@media (max-width: 768px) { .box-contact .items li.line-border { font-size: 15px; } }
.box-contact .items li.border-bottom { border-bottom: 1px solid #999; padding-bottom: 35px; }
@media (max-width: 768px) { .box-contact .items li.border-bottom { padding-bottom: 30px; } }
.items.none { display: none; }

/* 条款滚动框 */
.box-privacy { max-width: 860px; margin: 0 auto 60px; }
@media (max-width: 768px) { .box-privacy { margin-bottom: 45px; } }
.box-privacy h3 { margin: 0 0 10px; font-size: 16px; font-weight: 400; }
@media (max-width: 768px) { .box-privacy h3 { font-size: 15px; } }
.box-privacy .privacy { height: 200px; padding: 25px 20px; overflow: auto; border: 1px solid #999; word-break: break-word; }
@media (max-width: 768px) { .box-privacy .privacy { height: 235px; padding: 15px 10px; } }
.box-privacy .privacy h2 { font-size: 15px; font-weight: 700; margin: 0 0 10px; }
.box-privacy .privacy p { font-size: 13px; line-height: 2; margin-bottom: 1em; }
@media (max-width: 768px) { .box-privacy .privacy p { font-size: 12px; line-height: 1.8; } }

/* 同意 + 提交 */
.box-action .confirm { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-bottom: 60px; }
@media (max-width: 768px) { .box-action .confirm { margin-bottom: 45px; } }
.box-action .confirm label { font-size: 16px; margin-left: 10px; }
@media (max-width: 768px) { .box-action .confirm label { font-size: 14px; } }
.box-action .btns { text-align: center; }
.btn-black-border {
  display: inline-block; width: 100%; max-width: 350px; height: 65px; line-height: 65px;
  font-size: 16px; font-weight: 700; color: var(--color-white); background: var(--color-ink-soft); border: 0; border-radius: 60px;
  cursor: pointer; transition: opacity .3s;
}
.btn-black-border:hover { opacity: .7; }
@media (max-width: 768px) { .btn-black-border { max-width: 300px; height: 55px; line-height: 55px; font-size: 15px; } }

/* 电话注意 */
.box-notice { margin-top: 115px; padding-top: 20px; border-top: 1px solid #999; line-height: 2.2; }
@media (max-width: 768px) { .box-notice { margin-top: 70px; font-size: 14px; } }