/* ============================================================
 * fanglei-site.css —— 防雷站(www.hsflkj.com) 站级增强样式
 * 2026-09-30 c2 / 归属：jiuzhoulc2（本机分工站）
 * 说明：纯站级文件，不影响 9 站共享组件(brand.js/group-footer.js/mnav.js)。
 *       采用「追加式」部署到 common.css 与 style.css 末尾，删末段即回滚。
 * 覆盖：①头部标语行 ②导航一行+留言并入联系我们 ③手机端压缩
 *       ④类目横向自动轮播 ⑤图片网格每行三列统一 ⑥全站宽度统一
 * ============================================================ */

/* ---------- ① 头部标语行：已停用（2026-10-02 站长反馈「标语多了一行」） ----------
 * 原设计会往 header.top 首位注入一条白底标语行「恒守项目安全底线 · 筑牢安全防线 | 咨询热线」，
 * 与站内 25 个页面本来就有的红底 .topbar（让中国的防雷事业名扬世界 · 恒守安全底线 · 筑牢安全防线
 * | 全国免费咨询热线）重复成两行。集团其它站（0371gs / hscmgs / 666ll / cmgsgw / 666zszs）
 * 均只有 .topbar 一条，故本站统一为一条：
 *   1) js/fanglei-site.js 已移除该行的注入逻辑；
 *   2) 此处保留 display:none 守卫，防止旧版脚本被回传后白条重新出现。
 * 恢复方式：删掉下面的 display:none 一行 + 还原 js 中的注入代码即可。 */
.jzlc-headslogan{display:none !important}
.jzlc-headslogan .hs-inner{
  width:100%;max-width:1200px;margin:0 auto;padding:7px 16px;box-sizing:border-box;
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.jzlc-headslogan .hs-hot{font-size:13px;font-weight:700;color:#c9281e;text-decoration:none;white-space:nowrap}
.jzlc-headslogan .hs-brand{
  font-size:14px;font-weight:700;letter-spacing:1px;color:#c9281e;white-space:nowrap;
}
.jzlc-headslogan .hs-brand i{font-style:normal;color:#9aa3ad;margin:0 6px}
.jzlc-headslogan .hs-safe{
  font-size:13px;color:#5b6672;letter-spacing:.5px;white-space:nowrap;
}
.jzlc-headslogan .hs-safe::before{
  content:"";display:inline-block;width:14px;height:1px;background:#d5dae1;
  vertical-align:middle;margin-right:8px;
}
/* ---------- ①-c 桌面端隐藏移动端汉堡按钮（2026-10-02 站长反馈「购物车旁边多一个空小方框」） ----------
 * 原因：group-footer.js 对「页头里没有汉堡按钮」的模板会自建一个
 *       <button class="nav-toggle">（内含 3 个空 span），并把它的 40×40 灰底样式
 *       只写在 @media(max-width:900px) 里。桌面端没有任何隐藏规则 → 该按钮退化成
 *       浏览器默认按钮，表现为一个空的浅色圆角小方框（没文字也没图标）。
 * 处理：桌面端隐藏它；≤900px 仍由共享组件正常显示并驱动抽屉菜单。 */
@media(min-width:901px){
  header.top .nav-toggle,header.top #menuBtn,header.top .menu-btn,
  header.top .mnav-btn,header.top .navbar-toggle{display:none !important}
}
/* ---------- ①-b LOGO 区（20261003：桌面端 LOGO 放大 1.4 倍=98px，品牌字紧贴 LOGO 下方，导航居右）
   注意：堆叠布局只限桌面端——手机端保持共享组件的紧凑行模式（jzl-mn-top），否则会误触发行堆叠大LOGO模式 ---------- */
@media(min-width:861px){
  header.top>.wrap{min-height:0 !important;padding-top:10px !important;padding-bottom:10px !important;align-items:center !important;gap:18px !important}
.logo.logo-stack,.logo{display:flex !important;flex-direction:column !important;align-items:center !important;gap:0 !important;margin:0 !important}
header.top .logo img,.logo.logo-stack img{height:132px !important;max-height:none !important;width:auto !important;display:block !important}
  .logo .logo-sub{
    margin-left:0 !important;line-height:1.3 !important;font-size:13px !important;font-weight:700;
    color:#0e7c66 !important;white-space:nowrap !important;text-align:center;letter-spacing:.5px;
  }
  .top .nav{flex:1 1 auto;min-width:0;border-bottom:none !important}
  .top .nav>ul{align-items:center !important;border-bottom:none !important}
  .top .nav ul li a{line-height:1.5 !important;padding-top:10px !important;padding-bottom:10px !important}
}
/* 手机端仅去导航下划线，其余交给共享移动头部机制 */
@media(max-width:860px){
  .top .nav{border-bottom:none !important}
  .jzl-mh-slogan{color:#0e7c66 !important;font-weight:700 !important}
}

/* ---------- ② 导航：单行显示 + 下拉对齐 ---------- */
@media(min-width:901px){
  .top .nav>ul{flex-wrap:nowrap !important}
  .top .nav>ul>li>a,.top .nav ul li a{padding:0 clamp(7px,1.05vw,14px) !important;font-size:15px !important;white-space:nowrap}
  .top .nav>ul>li.has-dropdown>a .caret{font-size:11px;margin-left:2px;color:#8b95a1}
}
/* 下拉加入「在线留言」后加宽、保证不折行 */
.top li.has-dropdown>.dropdown{min-width:168px !important}
.top li.has-dropdown>.dropdown>li>a{white-space:nowrap !important;font-size:14px !important;padding:9px 18px !important}

/* ---------- ⑤ 图片/卡片网格：每行三列、大小一致、上下对齐 ---------- */
.grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:20px !important}
/* 卡片统一为纵向 flex，图片区定高 → 标题基线对齐 */
.card,.case-link .card{display:flex !important;flex-direction:column !important;height:100% !important}
.card .ph,.card .ph-img,.card .ico-img{
  height:180px !important;min-height:180px !important;padding:0 !important;
  border-radius:8px !important;overflow:hidden !important;margin-bottom:10px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
}
.card .ph img,.card .ph-img img,.card .ico-img img,
.card.case img,.case-link img{
  width:100% !important;height:100% !important;max-height:180px !important;
  object-fit:cover !important;display:block !important;border-radius:8px !important;
}
.card h3,.card.case h3{font-size:16px !important;line-height:1.5 !important;margin-bottom:8px !important;min-height:0}
.card.case .tag{margin-bottom:6px !important}
/* 首页成功案例卡片同样三列同高 */
.m-qb .case-list{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:20px !important;margin:0 !important;padding:0 !important;list-style:none !important}
.m-qb .case-list li{width:auto !important;float:none !important;margin:0 !important;height:100%}
.m-qb .case-list li img{height:180px !important;object-fit:cover !important}
/* 详情/图文页图片统一等比裁切 */
.page-con img,.card-box img,img{max-width:100% ;height:auto}
.page-con .grid img{height:180px !important;object-fit:cover !important;max-height:180px !important}

/* ---------- ⑥ 全站内容宽度统一 1200 居中 ---------- */
.wrap,.container,.header-box,.page-con,.top .wrap,
section .wrap,footer .wrap{width:100% !important;max-width:1200px !important;margin-left:auto !important;margin-right:auto !important;box-sizing:border-box !important}

/* ---------- ③-c 详情页页头横幅（原 .page-banner 无样式，裸 h1 露顶） ---------- */
.page-banner{
  background:linear-gradient(135deg,#c9281e 0%,#fd581f 100%);
  padding:32px 16px;text-align:center;
}
.page-banner h1{color:#fff;font-size:24px;font-weight:700;margin:0;letter-spacing:1px}

/* ---------- ③-b 详情页「相关资讯与实拍」卡片（每行三列） ---------- */
.jz-rel-panel{
  width:100%;max-width:1200px;margin:28px auto 0;box-sizing:border-box;padding:0 16px;
}
.jz-rel-panel .jz-rel-title{
  font-size:20px;color:#1a2a6c;margin:0 0 16px;padding-left:10px;border-left:4px solid #c9281e;line-height:1.3;
}
.jz-rel-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
}
.jz-rel-card{
  display:flex;flex-direction:column;background:#fff;border:1px solid #eaeef2;border-radius:10px;
  overflow:hidden;text-decoration:none;color:#33404f;transition:.2s;height:100%;
}
.jz-rel-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.08);transform:translateY(-3px)}
.jz-rel-card img{
  width:100%;height:180px;object-fit:cover;display:block;background:#f3f5f8;
}
.jz-rel-card .jz-rel-ph{
  height:180px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#c9281e,#fd581f);color:#fff;font-size:14px;
}
.jz-rel-card h4{
  font-size:15px;line-height:1.5;margin:10px 12px 0;color:#23303d;font-weight:600;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:45px;
}
.jz-rel-card span{
  display:block;margin:8px 12px 12px;font-size:12px;color:#98a2ae;
}
.jz-rel-tip{grid-column:1/-1;color:#98a2ae;font-size:14px;padding:8px 0}

/* ============================================================
 * ---------- ③ 手机端压缩：缩小间距与板块宽度 ----------
 * ============================================================ */
@media(max-width:860px){
  /* 板块留白整体收紧 */
  .pro,.zhichi,.about,.m-qb,.news,.jidi,.wenda,.liuyan,.link{
    padding-top:30px !important;margin-bottom:22px !important;height:auto !important;
  }
  .m-qb .content{padding:26px 14px 0 !important;width:auto !important;max-width:100% !important;margin:0 !important;box-sizing:border-box !important}
  .m-qb .case-show{padding:26px 14px 0 !important;width:auto !important;max-width:100% !important;margin:0 !important;box-sizing:border-box !important}
  .pro .content,.news .wrap,.jidi .wrap,.liuyan .wrap{padding:0 14px !important;box-sizing:border-box !important}
  /* 标题区压缩 */
  .title{margin-bottom:18px !important}
  .title h3{font-size:19px !important;line-height:1.4 !important;margin-bottom:6px !important}
  .title p{font-size:12px !important;letter-spacing:1px !important;margin-bottom:6px !important}
  /* 卡片/网格压缩 */
  .plist,.wen,.nbox,.jdlist{gap:10px !important}
  .grid{gap:10px !important}
  .card{padding:12px !important}
  .card .ph,.card .ph-img,.card .ico-img{height:132px !important;min-height:132px !important}
  .card .ph img,.card .ph-img img,.card .ico-img img{max-height:132px !important}
  .card h3{font-size:15px !important}
  .card p{font-size:12.5px !important;line-height:1.65 !important}
  /* 六大服务保障内容区压缩 */
  .zhichi .zcbox,.zcbox{padding:0 0 12px !important}
  .zhichi .wen p{font-size:13px !important;line-height:1.75 !important}

  /* 六大服务保障：内容区改「横向滑动卡」，不再纵向堆 6 屏 */
  .zhichi .zcbox{
    height:auto !important;width:100% !important;overflow:visible !important;
    padding:0 !important;background:none !important;
  }
  .zhichi .zcbox ul{
    position:static !important;width:100% !important;overflow:visible !important;
    display:flex !important;flex-wrap:nowrap !important;overflow-x:auto !important;overflow-y:hidden;
    scroll-snap-type:x mandatory;scroll-behavior:smooth;
    scrollbar-width:none;-ms-overflow-style:none;gap:0 !important;
    padding-bottom:6px;
  }
  .zhichi .zcbox ul::-webkit-scrollbar{display:none !important}
  .zhichi .zcbox ul>li{
    float:none !important;position:relative !important;
    width:86% !important;flex:0 0 86% !important;max-width:86% !important;
    height:auto !important;min-height:0 !important;margin:0 2% !important;
    padding:14px !important;box-sizing:border-box !important;
    background:#fff !important;border:1px solid #e9edf2 !important;border-radius:10px;
    scroll-snap-align:center;
  }
  .zhichi .zcbox ul>li img{
    float:none !important;display:block;width:100% !important;height:132px !important;
    object-fit:cover !important;border-radius:8px;margin-bottom:10px;
  }
  .zhichi .zcbox ul>li .wen{
    width:100% !important;float:none !important;margin:0 !important;height:auto !important;
  }
  .zhichi .zcbox ul>li .wen b{font-size:22px !important}
  .zhichi .zcbox ul>li .wen h4{font-size:16px !important;margin:4px 0 6px !important}
  .zhichi .zcbox ul>li .wen span{font-size:11px !important}
  .zhichi .zcbox ul>li .wen p{font-size:13px !important;line-height:1.7 !important;margin-top:6px !important}
  .zhichi .zcbox .btn,.zhichi .zcbox .btn02{display:none !important}

  /* 产品中心展示区：2×2 整齐网格（原「左大图+右小卡」在手机端错落） */
  .pbox .plist{
    display:none !important;grid-template-columns:1fr 1fr !important;gap:10px !important;
    width:100% !important;height:auto !important;margin:0 0 14px !important;overflow:visible !important;
  }
  .pbox .plist.act{display:grid !important;}
  .pbox .plist .lefttu{
    float:none !important;width:100% !important;height:auto !important;
    aspect-ratio:1/1;object-fit:cover !important;border-radius:8px;
  }
  .pbox .plist ul{display:contents !important;width:auto !important;float:none !important;height:auto !important}
  .pbox .plist ul li{
    float:none !important;width:auto !important;height:auto !important;margin:0 !important;
    background:#fff !important;border:1px solid #eef1f5;border-radius:8px;overflow:hidden;
    padding-bottom:4px;
  }
  .pbox .plist ul li img{width:100% !important;height:auto !important;aspect-ratio:1/1;object-fit:cover !important;display:block;margin-bottom:8px !important}
  .pbox .plist ul li span{display:block;font-size:12.5px;text-align:center;padding:2px 4px 6px;color:#23303d;white-space:normal !important;line-height:1.4}
  .pbox .plist ul li a{display:none !important}

  /* 成功案例卡片：手机端单列（桌面三列） */
  .m-qb .case-list{grid-template-columns:1fr !important}
  .m-qb .case-list li img{height:170px !important}

  /* 四大工程保障体系：手机端单项轮播（一屏一项，横向滑动切换；老内核 flex 兼容，不用 grid） */
  ul.tixi{display:flex !important;flex-wrap:nowrap !important;overflow-x:auto !important;-webkit-overflow-scrolling:touch !important;scroll-snap-type:x mandatory !important;gap:12px !important;padding:0 14px 6px !important;box-sizing:border-box !important;scrollbar-width:none}
  ul.tixi::-webkit-scrollbar{display:none !important}
  ul.tixi>li{flex:0 0 100% !important;width:100% !important;float:none !important;margin:0 !important;height:auto !important;scroll-snap-align:center !important;box-sizing:border-box !important;background:#fff !important;border:1px solid #eef1f5;border-radius:8px;overflow:hidden;padding-bottom:10px}
  ul.tixi>li img{width:100% !important;height:170px !important;object-fit:cover !important;display:block}
  ul.tixi>li .tixi-ph{width:100% !important;height:170px !important;margin:0 !important;border-radius:0 !important}
  ul.tixi>li h4{font-size:15px !important;margin:10px 0 4px !important;text-align:center}
  ul.tixi>li p{font-size:13px !important;line-height:1.7 !important;padding:0 14px !important;text-align:center}

  /* 首屏 banner 过高（578px），手机端压到 300px */
  #flashs{height:300px !important}
  #flashs .bgitem,.bgitem{height:300px !important}
  .flash-slogan,#flashs .flash-slogan{height:300px !important;top:0 !important;left:0 !important;width:100% !important;max-width:100% !important;box-sizing:border-box !important;padding:0 18px !important}
  .flash-slogan .fs-inner h2{font-size:20px !important;margin-bottom:8px !important}
  .flash-slogan .fs-inner p{font-size:12.5px !important;line-height:1.6 !important}
  .flash-slogan .fs-btn{padding:8px 18px !important;font-size:13px !important}

  /* 关于我们：正文紧凑、配图限高 */
  .about{height:auto !important}
  .about .wrap{padding:0 14px !important}
  .about .about-txt,.about p{font-size:13px !important;line-height:1.75 !important}
  .about img{max-height:150px !important;width:auto !important}
  .about .ewm img{max-height:110px !important}
  /* 关于我们/新闻/留言 */
  .about .ewm,.about .btn{margin-top:10px !important}
  .nlist li,.liuyan li{margin-bottom:10px !important;font-size:13.5px !important}
  /* 页脚 */
  .footer{padding:22px 0 !important;font-size:12.5px !important}
  /* 头部：手机端第一行恒守标语居中；LOGO 回小尺寸保持堆叠布局 */
  .jzlc-headslogan .hs-inner{padding:6px 14px !important;justify-content:center !important;text-align:center}
  .jzlc-headslogan .hs-safe{display:inline-block !important;font-size:12px !important;white-space:normal !important;text-align:center}
  .jzlc-headslogan .hs-safe::before{display:none !important}
  header.top>.wrap{padding-top:6px !important;padding-bottom:6px !important;gap:10px !important}
  /* 手机端 LOGO 布局由 group-footer.js 统一接管（注入标语/宽 40%），这里只恢复 130px 上限 */
  header.top .logo img{max-height:150px !important}
  .top .nav ul li a{padding-top:6px !important;padding-bottom:6px !important}
}

/* ============================================================
 * ---------- ④ 手机端类目横向轮播（每屏 3~4 个，自动左→右） ----------
 * ============================================================ */
@media(max-width:860px){
  .pro .menu,.zhichi .menu{
    display:flex !important;flex-wrap:nowrap !important;overflow-x:auto !important;
    overflow-y:hidden;-webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;scroll-behavior:smooth;
    scrollbar-width:none;-ms-overflow-style:none;
    width:100% !important;margin:0 0 14px !important;padding:2px 0 !important;
  }
  .pro .menu::-webkit-scrollbar,.zhichi .menu::-webkit-scrollbar{display:none !important}
  .pro .menu>li,.zhichi .menu>li{
    flex:0 0 auto !important;float:none !important;position:static !important;
    width:auto !important;min-width:0 !important;height:auto !important;
    padding:0 !important;margin:0 6px 0 0 !important;
    scroll-snap-align:start;white-space:nowrap;
    border:1px solid #e6e9ee !important;border-radius:16px !important;
    background:#fff !important;line-height:32px !important;font-size:13px !important;
  }
  .pro .menu>li a,.zhichi .menu>li a{display:block;padding:0 13px !important;line-height:32px !important;font-size:13px !important;color:#33404f !important;text-decoration:none}
  /* 保障类目为纯文本节点，需显式定宽才能做到「每屏 3~4 个」 */
  .zhichi .menu>li{min-width:104px !important;text-align:center !important}
  .pro .menu>li.cur,.zhichi .menu>li.cur{border-color:#c9281e !important;background:#c9281e !important}
  .pro .menu>li.cur a,.zhichi .menu>li.cur a,.pro .menu>li.cur,.zhichi .menu>li.cur{color:#fff !important}
  .pro .menu>li img,.zhichi .menu>li img{display:none !important}
  /* 滑动提示渐隐遮罩（右侧） */
  .pro .menu,.zhichi .menu{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%)}
}


/* ---- 20261002 站长：LOGO 放大 + 品牌标语贴近 LOGO ---- */
.jzl-mn-top .logo.logo-stack .logo-sub,.jzl-mn-top .logo .logo-sub{
  margin-left:0 !important;margin-top:-7px !important;line-height:1.02 !important;
  letter-spacing:.5px !important;color:#C9A24B !important;font-size:15px !important;
}
@media(max-width:900px){
  .jzl-mn-top .logo.logo-stack .logo-sub,.jzl-mn-top .logo .logo-sub{
    margin-left:0 !important;margin-top:-4px !important;font-size:15px !important;
  }
}


/* ============================================================
 * 20261002 c4 第 5 批
 * ⑦-a 页头：品牌副标题已上移到顶部条标语之前（js/fanglei-site.js initTopbarBrand），
 *      此处隐藏 LOGO 下方那一行并按 LOGO 实际尺寸收紧中部高度
 *      （LOGO 图已裁掉上下白边，备份 .bak_trim20261002）
 * ============================================================ */
@media(min-width:861px){
  header.top>.wrap{padding-top:6px !important;padding-bottom:6px !important;gap:14px !important}
  header.top .logo img,.logo.logo-stack img{height:104px !important;max-height:none !important}
  header.top .logo .logo-sub,.logo.logo-stack .logo-sub{display:none !important}
}
.jzl-topbar-brand{font-weight:700;letter-spacing:.5px;white-space:nowrap}
.jzl-topbar-brand::after{content:"|";margin:0 12px;opacity:.45;font-weight:400}
@media(max-width:860px){.jzl-topbar-brand{display:none !important}}

/* ---------- ⑦-b 产品中心：桌面端「左侧主图 + 右侧一行三个等大卡片」 ----------
 * 原状：6 组 .plist 全部 position:absolute 叠放、无切换脚本 → 图叠图；
 *       右侧 ul 内 li 固定 247x289，而图片实际渲染高 328 → 溢出错位。 */
@media(min-width:861px){
  .pro .pbox{height:auto !important;overflow:visible !important}
  .pro .plist{position:static !important;display:none !important;width:100% !important;height:auto !important;overflow:visible !important}
  .pro .plist.act{display:flex !important;flex-wrap:nowrap !important;gap:16px !important;align-items:stretch !important}
  .pro .plist>a{flex:0 0 32% !important;width:32% !important;float:none !important;display:block !important}
  .pro .plist .lefttu{float:none !important;width:100% !important;height:100% !important;min-height:300px !important;object-fit:cover !important;border-radius:8px !important;display:block !important}
  .pro .plist ul{float:none !important;width:auto !important;height:auto !important;flex:1 1 auto !important;display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:16px !important;border:0 !important;overflow:visible !important}
  .pro .plist ul li{float:none !important;width:auto !important;height:auto !important;border:0 !important;display:flex !important;flex-direction:column !important;background:#fff !important;border-radius:8px !important;overflow:hidden !important;box-shadow:0 2px 10px rgba(16,36,59,.06)}
  .pro .plist ul li img{width:100% !important;height:auto !important;aspect-ratio:1/1 !important;object-fit:cover !important;margin:0 !important;display:block !important}
  .pro .plist ul li span{padding:10px 6px 12px !important;font-size:14px !important;text-align:center !important;white-space:nowrap !important;text-overflow:ellipsis !important;overflow:hidden !important}
  .pro .plist ul li a{display:none !important}
}
/* 手机端产品区：沿用 2 列自适应网格，仅补高度自适应 */
@media(max-width:860px){
  .pro .pbox{height:auto !important}
}

/* ---------- ⑦-c 手机端产品区尺寸兜底（原 li 图被压成 86px，与主图不齐） ---------- */
@media(max-width:860px){
  .pro .pbox{height:auto !important}
  .pro .pbox .plist ul li{min-width:0 !important}
  .pro .pbox .plist ul li img{width:100% !important;max-width:100% !important;height:auto !important;aspect-ratio:1/1 !important;object-fit:cover !important}
  .pro .pbox .plist .lefttu{float:none !important;width:100% !important;max-width:100% !important;aspect-ratio:1/1 !important;object-fit:cover !important}
}
