@charset "utf-8";
/* ============================================================
   preludeid.com 移动端响应式适配（2026-08-17 新增）
   —— 补全旧站模板预留的 st-* 响应式类 + 全站移动端布局适配
   断点沿用 Bootstrap 2.3.2 惯例：≤979px 小屏 / ≤767px 手机
   设计语言：白底轻量 + 商务蓝 #1d7ad9 + 橙 #ff970f 点缀，直角/虚线分隔
   ============================================================ */

/* ---------- 1. 响应式辅助类（旧站模板有使用但 CSS 从未实现） ---------- */
/* 默认（桌面）：仅小屏显示的元件默认隐藏 */
.st-m-show,
.st-sm-show { display: none !important; }

/* ≤979px（小屏：手机 + 平板窄）：隐藏 .st-sm-hide 元件、显示 .st-sm-show 元件 */
@media (max-width: 979px) {
  .st-sm-hide { display: none !important; }
  .st-sm-show { display: block !important; }
}
/* ≤767px（手机）：隐藏 .st-m-hide 元件、显示 .st-m-show 元件 */
@media (max-width: 767px) {
  .st-m-hide { display: none !important; }
  .st-m-show { display: block !important; }
}

/* ---------- 2. 全站容器自适应 ---------- */
@media (max-width: 979px) {
  body { padding: 0 8px; padding-top: 52px; }
  .st-container,
  .container.st-container { width: auto; max-width: 1170px; margin: 0 auto; }
  .st-container-page,
  .st-others-page,
  .st-content-box { width: 100%; }
}
@media (max-width: 767px) {
  body { padding: 0 6px; padding-top: 48px; }
  .st-container-page { padding: 0 2px; }
  /* 通用图片/表格防溢出 */
  .st-container img { max-width: 100% !important; height: auto !important; }
  .st-article-body table,
  .st-table-list,
  .st-param-box table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ---------- 3. 顶部导航（TopNav） ---------- */
@media (max-width: 979px) {
  .st-header { min-height: 52px; }
  .st-header .st-logo { width: 32%; }
  .st-header .st-logo img { max-width: 100%; height: auto; }
  .st-header .st-search-top { width: auto; margin: 12px 8px 0 0; }
  .st-header .st-search-top .st-input { width: 100%; }
  .st-header .st-nav-right { margin-top: 12px; }
}
@media (max-width: 767px) {
  .st-header { padding: 8px 0; }
  .st-header .st-logo { width: 38%; }
  .st-header .st-search-top { width: 100%; margin: 8px 0 0; float: none; }
  .st-header .st-search-top .st-input { width: 100%; }
  .st-header .st-nav-right { margin-top: 8px; }
  .st-header .st-nav-right a { display: inline-block; padding: 6px 8px; }
  /* 手机版电话按钮（旧站预留 st-m-show） */
  .st-tel2-top { font-size: 14px; font-weight: bold; color: #1d7ad9; }
}

/* ---------- 4. 主导航（MainNav，小屏隐藏，沿用 st-sm-hide 语义） ---------- */
/* .st-navbar-box 自带 st-sm-hide，无需额外规则 */

/* ---------- 5. 首页轮播（小屏隐藏，沿用 st-sm-hide 语义） ---------- */
/* .st-banner-box 自带 st-sm-hide，无需额外规则 */

/* ---------- 6. 首页分类楼层 ---------- */
@media (max-width: 767px) {
  .st-hpdt-box { padding: 12px 4px; }
  .st-hpdt-box .st-hpdt-title { font-size: 16px; }
  .st-hpdt-box .st-hpdt-title a { float: right; font-size: 12px; }
  .st-hpdt-box .st-name { width: 100% !important; float: none !important; margin: 0 0 10px; }
  .st-hpdt-box .st-name h2 { margin: 0 0 6px; }
  .st-hpdt-box .st-hpdt-list { padding: 0; }
  .st-hpdt-box .st-hpdt-list li { display: inline-block; margin: 4px 12px 4px 0; }
  .st-hpdt-box .st-hpdt-list li a { font-size: 14px; line-height: 1.9; }
}

/* ---------- 7. 分类页 / 列表页 ---------- */
@media (max-width: 767px) {
  /* 侧边栏 210px 固定 → 通栏（置于产品区上方） */
  .st-sidebar-box,
  .row-fluid .st-sidebar-box,
  .row .st-sidebar-box { width: 100%; float: none; margin: 0 0 16px; }
  .st-sidebar-box .st-sidebar-title { font-size: 15px; }
  .st-sidebar-box .st-sidebar-nav a { padding: 8px 12px; }

  /* 产品主区 930px 固定 → 通栏 */
  .st-product-box,
  .row-fluid .st-product-box { width: 100%; float: none; }

  /* 产品列表：一行 5 个 → 一行 2 个 */
  .st-pdt-list { margin: 0 -4px 24px; }
  .st-pdt-list li { width: 48%; margin: 0 1% 14px; }
  .st-pdt-list li p.st-name { max-width: 100%; height: auto; min-height: 36px; margin: 8px 4px 0; }
  .st-pdt-list li p.st-price { width: 100%; margin: 0 4px; }
  .st-typelist-pdt { width: 100%; height: auto; max-width: 152px; }

  /* 分页条换行紧凑 */
  .st-pdt-mt .st-pagination { white-space: nowrap; overflow-x: auto; display: block; padding: 4px 0; }
  .st-pdt-mt .st-pagination ul li a { padding: 4px 8px; }
}

/* ---------- 8. 商品详情页 ---------- */
@media (max-width: 767px) {
  .st-detail-preview { text-align: center; }
  .st-detail-preview img { max-width: 100%; height: auto; }
  .st-pdt-brief { padding: 0; }
  .st-pdt-brief h2 { font-size: 18px; line-height: 1.5; }
  .st-pdt-brief .st-brief-row { line-height: 2; font-size: 13px; }
  .st-mainpage-box { padding: 0; }
  /* 详情页操作按钮换行 */
  .st-detail-action { text-align: left; }
  .st-detail-action .btn { margin: 0 8px 8px 0; }
  /* dl 参数堆叠 */
  .st-param-box dl { margin: 0 0 8px; }
  .st-param-box dt { float: none; width: auto; }
  .st-param-box dd { margin-left: 0; }
}

/* ---------- 9. 通用页面（about/solution/support/contact/dealer/search 等） ---------- */
@media (max-width: 767px) {
  .st-others-page { padding: 8px 2px; }
  .st-others-page h2, .st-others-page h3 { word-break: break-all; }
  .st-contact-address, .st-contact-phone { font-size: 13px; line-height: 2; }
  .st-dealer-sect, .st-dealer-search { width: 100%; float: none; margin: 0 0 12px; }
  .st-dealer-search input { max-width: 100%; }
  /* 搜索结果页 */
  .st-search-result .st-pdt-list li { width: 48%; margin: 0 1% 14px; }
}

/* ---------- 10. 底部 Footer ---------- */
@media (max-width: 767px) {
  .st-footer { padding: 20px 8px; }
  .st-footer-nav { text-align: center; }
  .st-footer-nav a { display: inline-block; padding: 5px 8px; }
  .st-copyright { font-size: 12px; line-height: 1.9; word-break: break-all; text-align: center; }
  .st-footer .st-beian { display: block; }
}

/* ---------- 11. 返回顶部 ---------- */
@media (max-width: 767px) {
  .st-gotop { right: 8px; bottom: 8px; width: 36px; height: 36px; }
}