/* ご利用ガイド(/pages/guide)— FAQ 手风琴。
   数值源:analysis/07 §1 + front/v1/common.css(con_guide)/custom.css(box_mv_head,searchInputForPage)。 */

/* 面包屑 + FAQ 标题区 = 白底(box_mv_head.bgw),灰底从搜索区开始 */
.page-guide .breadcrumb { background: var(--color-white); }

/* FAQ 标题段:box_mv_head 实测 padding 120px 0 10px(双视口)+ Space 变体标题(-80px/-40px,mb 100/70) */
.section--faq-heading { padding: 120px 0 10px; background: var(--color-white); }
.section--faq-heading .section-title { margin-top: -80px; margin-bottom: 100px; }
@media (max-width: 768px) {
  .section--faq-heading .section-title { margin-top: -40px; margin-bottom: 70px; }
}

/* 关键词搜索(add-searchInput02.add-searchInputForPage:白药丸,icon 在右) */
.search-input-page {
  display: grid; grid-template-columns: 1fr 20px; align-items: center;
  max-width: 400px; height: 44px; margin: 2.4rem auto; padding: 0 12px 0 20px;
  background: var(--color-white); border-radius: 25px;
}
.search-input-page input[type="text"] {
  width: 100%; height: inherit; padding: 0 14px 0 0; font-size: 14px; color: var(--color-ink);
  background: transparent; border: none; outline: none;
}
.search-input-page input[type="text"]::placeholder { font-size: 14px; color: #b2b2b2; }
.search-input-page__icon {
  width: 17px; height: 17px;
  background: url(/assets/common/icon-search.svg) no-repeat center / contain;
}
@media (max-width: 768px) { .search-input-page { max-width: calc(100% - 2.5rem); width: 100%; } }

/* 手风琴 con_guide */
.con-guide { margin: 0 1.25rem; padding: 0 0 80px; }
@media (max-width: 768px) { .con-guide { padding: 10px 0 130px; } }
.box-guide { margin: 0 auto; max-width: 940px; }
.box-items .item { border-top: 1px solid var(--color-ink); }
.item .caption {
  display: flex; align-items: center; justify-content: space-between;
  cursor: pointer; padding: 25px 15px; font-size: 19px; font-weight: 500; line-height: 1.2;
}
@media (max-width: 768px) { .item .caption { padding: 20px 10px; font-size: 16px; } }
.item .caption .txt { width: calc(100% - 15px); }
/* +/− 切换 icon(伪元素双杠;active 竖杠转 90° 变 −) */
.item .caption .icon { position: relative; width: 16px; height: 16px; }
.item .caption .icon::before {
  content: ""; position: absolute; right: 0; top: 50%; margin-top: -1px;
  width: 16px; height: 2px; background: var(--color-ink); border-radius: 5px;
}
.item .caption .icon::after {
  content: ""; position: absolute; right: 7px; top: 50%; margin-top: -8px;
  width: 2px; height: 16px; background: var(--color-ink); border-radius: 5px;
  transform-origin: 50% 50%; transition: transform .3s;
}
.item .caption.active .icon::after { transform: rotate(90deg); }
.item .caption:hover { color: #797979; }
.item .caption:hover .icon::before, .item .caption:hover .icon::after { background: #797979; }

/* 答案面板:默认收起 */
.wrp-box-list { display: none; margin: 10px 15px 30px; padding: 40px 10px; background: var(--color-white); border-radius: 20px; }
@media (max-width: 768px) { .wrp-box-list { margin: 5px 0 20px; padding: 20px 15px; } }
.wrp-box-list.is-open { display: block; }
.box-list { max-width: 830px; margin: 0 auto; }
.box-list li { border-top: 1px solid #c7c7c7; }
.box-list li:first-child { border-top: none; }
/* 问题行:2026-08-08 起从死链 a 变成折叠按钮(Joel 拍板);排版数值原样保留 */
.qa__q {
  position: relative; display: block; width: 100%; padding: 20px 10px;
  font: inherit; font-size: 16px; line-height: 1.2; color: inherit; text-align: left;
  background: none; border: none; cursor: pointer;
}
@media (max-width: 768px) { .qa__q { padding: 14px 5px; font-size: 14px; } }
.qa__q .txt { display: inline-block; width: calc(100% - 30px); }
.qa__q::after {
  content: ""; position: absolute; right: 20px; top: 50%; translate: 0 -50%;
  width: 16px; height: 16px;
  background: url(/assets/common/icon-angle.svg) no-repeat center / contain;
  transition: transform .3s;
}
.qa__q:hover { color: #797979; }
.qa__q.active::after { transform: rotate(90deg); }
@media (max-width: 768px) { .qa__q::after { display: none; } }

/* 答案面板:默认收起,滑开逻辑与分类层同一套(guide.js) */
.qa__a { display: none; }
.qa__a.is-open { display: block; }
.qa__a p {
  max-width: 700px; padding: 0 10px 24px; font-size: 15px; line-height: 1.9; color: #4d4d4d;
}
@media (max-width: 768px) { .qa__a p { padding: 0 5px 18px; font-size: 13px; } }
.qa__a a { text-decoration: underline; }

/* 底部:解決しない場合… + 黑药丸 */
.box-bottom { margin-top: 90px; text-align: center; }
@media (max-width: 768px) { .box-bottom { margin-top: 50px; } }
.box-bottom .txt { font-size: 19px; font-weight: 500; }
.box-bottom .btn { margin-top: 20px; }
.btn-black-border {
  display: inline-block; width: 100%; max-width: 300px; height: 68px; line-height: 68px;
  font-size: 16px; font-weight: 700; color: var(--color-white); background: var(--color-ink-soft); border-radius: 60px;
  transition: opacity .3s;
}
.btn-black-border:hover { opacity: .7; }
/* guide 底部按钮双视口都是 68(线上实测);contact 等其他处走 55 移动缩 */
@media (max-width: 768px) { .btn-black-border { font-size: 15px; } }