@charset "utf-8";
/* =====================================================================
   site_fix.css — 站点头部/底部/导航样式补丁
   规则一律 !important(覆盖默认样式),在 comm/head.html 引入,全局生效
   ===================================================================== */

/* ---- 1. 头部 LOGO 垂直居中 ---- */
#Sub436904523_2 { position: relative !important; }
#module_436904449 {
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    right: 0 !important;
    transform: translateY(-50%) !important;
}
#module_436904449 > .module_436904449 { margin-top: 0 !important; }

/* ---- 2. 导航栏目下拉浮层(2026-07-31 经 playwright 驱动 Edge 多轮对抗式实测敲定)
   showSubMenu(origin/PageJs.js,**框架不可动**)把栏目子菜单 复制 到 body 下 .moduleNavFloatSubMenu 浮层。
   三个相互独立的坑(逐一定位,改错任意一个都会复现“飘/不显示/切不动”):
   ① 看不见:子菜单默认 absolute,被困在浮层内 .nav(z:2)的局部层叠上下文 + 被 #pagebody(relative,
        含 banner slick)整体盖过 → 被 banner 完全遮挡。→ 子菜单改 fixed,脱离 .nav 进根层叠、盖过 banner。
   ② 滚动飘移:导航是吸顶栏(#module_451395537 position:fixed,常驻视口顶,栏目底恒在 y=70);
        但 showSubMenu 用 $(obj).offset().top(文档坐标)给子菜单设 top,fixed 却是视口坐标 →
        一滚动子菜单就被顶到视口下方 scrollY 处(飘到 banner 中间/内容区)。→ top:70px !important
        钉死在吸顶栏底部(视口固定值),与滚动无关。
   ③ 切换死锁:浮层复用了原导航的 .nav 类(absolute;top:0;width:100%;height:70px;z:2),该 .nav 相对
        文档定位在 y=0,scrollY=0 时 1440×70 正好盖住整个栏目区、z:2 压住所有 main-nav-item → 拦截栏目
        hover,导致“弹出一个后移到别的没反应”(首次能出是因浮层还没建;.nav 是 absolute,不受浮层
        height/overflow 约束,故改浮层 height 无效)。→ 浮层整体 pointer-events:none 不拦截栏目;
        子菜单 pointer-events:auto 恢复可点。
   浮层 height:0/overflow:hidden 保持框架原意(不占空间);子菜单 fixed 不受父 overflow 裁剪,故无需
   visible/auto 撑开浮层(撑开反而让 .nav/.dl 覆盖更多区域)。
   ⚠勿改回 absolute(被 banner 遮);勿给浮层加 position(变 .nav 包含块致坐标错乱);
     勿删 pointer-events(切换死锁回归);top 勿改回 JS 文档坐标(滚动飘移回归)。 ---- */
.moduleNavFloatSubMenu {
    overflow: hidden !important;
    height: 0 !important;
    pointer-events: none !important;
}
.moduleNavFloatSubMenu .sub-nav-item-group {
    position: fixed !important;
    top: 70px !important;
    z-index: 2147483646 !important;
    pointer-events: auto !important;
}

/* ---- 3. 底部 .footer 高度复位(按内容自然撑开) ---- */
.footer {
    position: static !important;
    height: auto !important;
    bottom: auto !important;
}

/* ---- 4. 底部小字提亮(深底上原色过淡看不清) ----
   p/span 有自身深色规则,从 .rr 继承的 !important 不生效,必须直接选到元素 */
.footer .copy .rr,
.footer .copy .rr p,
.footer .copy .rr span,
.footer .copy .rr a,
.footer .copy .rr em { color: rgba(255,255,255,.82) !important; }
.footer .foot .top .item dl dd a { color: rgba(255,255,255,.72) !important; }

/* ---- 5. 底部弹窗 .m-pop 默认隐藏 ----
   产品/内页未加载 /res/css/style.css,补上弹窗隐藏规则;否则 .m-pop 以 static 显示
   会撑出 1000+px 空高把 footer 拉长(参考 style.css 第1199-1252行) */
.footer .m-pop {
    position: fixed !important;
    left: 0 !important; top: 0 !important; right: 0 !important; bottom: 0 !important;
    display: none !important;
    z-index: 40 !important;
}
.footer .m-pop.open { display: block !important; }
.footer .m-pop .pop-bg {
    position: absolute !important; left: 0 !important; top: 0 !important;
    right: 0 !important; bottom: 0 !important; z-index: -1 !important;
    background: rgba(0,0,0,.7) !important;
}
.footer .m-win {
    position: absolute !important; left: 50% !important; top: 50% !important;
    transform: translate(-50%,-50%) !important;
    max-width: 90% !important; max-height: 80% !important;
    background: #fff !important; overflow: hidden !important; text-align: center !important;
}
.footer .m-pop .close {
    position: absolute !important; width: 42px !important; height: 42px !important;
    right: 0 !important; top: 0 !important; z-index: 10 !important;
    background: #F12535 url(/res/images/close.png) no-repeat center !important;
}

/* ---- 6. 品牌列表区:slick 轮播(发展史/荣誉/公益)
   复用 /res/css/style.css 既有 class;轮播由 comm/foot.html 脚本初始化 slick(slick.min.js/slick.css 已加载)。
   这里只补容器居中(避开 absolute 左侧子导航)与各区块底色/文字配色,不干预轮播自身布局。 ---- */

/* 6-1 (已弃用) 原 180px 顶部留白——设计参考首块紧贴顶部,改由下方居中避开导航。 */

/* 6-2b 荣誉页(m-slickl2)轮播居中约 1030px,避开左侧 absolute 子导航(覆盖 x≈20~140);
     发展史(m-slickl4)、公益(m-slickl3)设计参考为全宽轮播(首张均在导航右侧之外),故不收窄。 */
.g-boxl1 .m-slickl2 { max-width: 1030px !important; margin-left: auto !important; margin-right: auto !important; }


/* 6-4 发展历程(.m-burgeonl / .m-slickl4):浅底 + 年份卡 + 左侧 bgl4 竖线装饰,
   配色/布局/箭头(iconl27/28)全由 /res/css/style.css 提供;此处不覆盖,保持与设计参考一致。 */

/* 6-5 品牌荣誉(.m-honor / .m-slickl2):证书墙,证书比例框 + 标题 + 左右大圆箭头(iconq2/3),
   配色/布局全由 /res/css/style.css 提供;此处不覆盖,保持与设计参考一致。 */

/* 6-6 公益活动回顾(.m-reviewl):设计参考为"背景照片 + 白色回顾卡片 + 白色年份数字",
   配色/布局全由 /res/css/style.css 提供(.m-reviewl 背景图、.m-slickl3 白卡、.m-slickl3-num
   白色数字/当前项放大);背景图经 gid=203 幻灯片注入(template 内联 background-image)。
   此处不再覆盖配色,避免与设计参考白色卡片相悖。 */

/* 6-6a 回顾区背景图盖住左侧悬浮导航:导航滑到回顾区时被背景图盖住、滑过回顾区后自动恢复显示。
   导航 fixed z:20,与 .m-reviewl 同处根栈上下文(.g-boxl1 为 relative + z:auto,不建栈上下文),
   故直接提 .m-reviewl 层级到 30,其背景即在"重叠区"盖过导航;离开重叠区(无空间重叠)自然恢复。
   纯 CSS、随滚动天然生效,无需 JS 显隐。 */
.m-reviewl { z-index: 30 !important; }

/* 6-6b 回顾卡按"居中/选中"锐化:slick 把每张 .item 包成 .slick-slide>.item,slick-current 加在
   .slick-slide 上而非 .item(同 m-slickl5 的 slick 包装坑),故 style.css 的 .m-slickl3 .item.slick-current
   规则不命中——当前卡一直带白纱 + 缩放。这里按 .slick-slide.slick-current 补 scale(1) + 去白纱,
   使当前卡清晰、其余卡半透缩小;点年份(asNavFor 联动)即锐化对应卡。 */
.m-slickl3 .slick-slide.slick-current .con .box { -webkit-transform: scale(1)!important; transform: scale(1)!important; }
.m-slickl3 .slick-slide.slick-current .con .box:after { background-color: transparent !important; }

/* 6-7 (已弃用) 原移动端两列回退——改 slick 轮播后,窄屏列数由 slick responsive 控制。 */

/* ---- 7. 左侧子导航跟随滚动(comm/foot.html 脚本滚动时加 .nav-follow)
   导航原 position:absolute 在 .g-boxl1(banner 下方内容区)里,天然在 banner 之下、随内容滚入视野;
   滚到 banner 下方后切 fixed 钉视口左侧(top:76,贴 header 下),无布局位移。
   钉位判定:有 .ban 的页用 banner 实时底边(ban.bottom ≤ 76 才钉)——保证 banner 完全滚出后才钉,
   绝不会 fixed 钉住时压在视频上方;且导航在钉住前一直以自然位显在 banner 下方(用户要的"看到 banner
   下面内容就展示")。无 banner 的页(history/honor)用 origTop。勿改 absolute 基态。 ---- */
.ul-leftl.nav-follow {
    position: fixed !important;
    top: 76px !important;
    z-index: 20 !important;
}
/* 坑32:窄屏(平板/手机 ≤1199)左侧子导航不跟随——基础布局 ≤1199 已把 .ul-leftl 改 position:static、
   ul 藏、仅显 .tit 标题条;但上面 .nav-follow 的 fixed 无 media 限制,移动端一滚就被 JS 加上 →
   fixed 无宽度收缩成标题宽、浮在正文顶(用户反馈"悬浮在上面不对")。此处窄屏强制回 static,
   对齐基础布局移动标题条;PC(>1199)仍 fixed 跟随不变。JS 不动,降风险。 */
@media (max-width: 1199px) {
    .ul-leftl.nav-follow { position: static !important; top: auto !important; z-index: 10 !important; width: 100%; }
}

/* ---- 8. 轻量证书灯箱(免依赖自实现;点击 .fancybox 在浮层显大图,点任意处关闭) ---- */
.mini-lightbox {
    position: fixed !important; inset: 0 !important; background: rgba(0,0,0,.86) !important;
    z-index: 99999 !important; display: flex !important; align-items: center !important;
    justify-content: center !important; cursor: zoom-out !important;
}
.mini-lightbox img { max-width: 90vw !important; max-height: 88vh !important; box-shadow: 0 8px 40px rgba(0,0,0,.5) !important; }
.mini-lightbox .lb-close {
    position: absolute !important; top: 18px !important; right: 32px !important;
    color: #fff !important; font-size: 42px !important; line-height: 1 !important; cursor: pointer !important;
}

/* ---- 9. 产品服务推荐条(.ul-listl4)文字颜色
   对齐设计参考:ul 带 .black 时文字深灰(style.css .ul-listl4.black .con .tit 已定义 #333)
   但 ModuleStyleMobile.css 全局 p{color:#333} 会命中 .desc>p,这里显式排除以免覆盖;
   不带 .black 的白色场景由 style.css .ul-listl4 .con .tit{color:#fff} 覆盖,故移除旧的强制白色 ---- */
.ul-listl4.black .con .txt .desc p { color: rgba(51,51,51,.8); }
/* 非 .black 变体(白字场景,文字叠在深色图上):<p> 同样会被全局 p{color:#333} 覆盖,
   这里补白字,与 style.css .ul-listl4 .con .desc{rgba(255,255,255,.8)} 设计一致 */
.ul-listl4:not(.black) .con .txt .desc p { color: rgba(255,255,255,.8); }

/* ---- 10. 发展历程 hover 弹窗(.m-slickl4-txt-show-all-box)
   鼠标移到年份卡上,在卡同位浮层显示完整事件文本(卡片内截断),鼠标移开恢复
   对照设计参考 about/history inline CSS ---- */
.m-slickl4-txt-show-all-box { position: absolute; color: rgba(51,51,51,.6); font-size: 14px; line-height: 2.14em; display: none; z-index: 20; }
.m-slickl4-txt-show-all-box p { position: relative; padding-left: 18px; }
.m-slickl4-txt-show-all-box p:after { content: ""; position: absolute; top: 13px; left: 0; width: 4px; height: 4px; background-color: #828282; border-radius: 50%; }

/* ---- 11. 工程案例列表(.ban banner + .case-subnav 横排子栏目导航 + .m-case-grid 3列网格)
   对照设计参考(工程案例页):banner 大图(含居中标题)→ 横排分类导航 → 3列卡片网格。 ---- */

/* 11-1 banner:复用 /res/css/style.css .ban(600px/cover/居中);.case-ban 仅补移动端高度,
   避免窄屏 600px 过高;.ban .txt/.tit 居中白字覆盖由 style.css 提供。 */
.case-ban { position: relative; }
.case-ban .txt .tit { font-size: 40px !important; }
.case-ban .txt .line { color: #fff; font-size: 40px; line-height: 1; margin-top: 6px; letter-spacing: 4px; }
@media (max-width: 768px) {
    .case-ban { height: 240px !important; }
    .case-ban .txt .tit { font-size: 26px !important; }
    .case-ban .txt .line { font-size: 26px !important; }
}

/* 11-2 横排子栏目导航(playwright 实测设计参考 ModuleGridContainer448279:容器 h53,全透明,
   无背景/无阴影/无边框;内 UL.one-classify-box h40——tab 自身行高撑到 40px(pad 0);
   tab 文字 #434343/16px,详情页 7 tab 全同色无 active 标记。
   ⚠此区设计参考既无阴影也无任何线条;此前误判的 #f2f2f2 阴影/"一条线"实测均不存在,已撤。
   "更高"指的是 tab 行自身更高(目标 h40),故用 line-height 撑高 tab,而非靠容器 padding。) */
.case-subnav { background: transparent; box-shadow: 0 4px 12px rgba(0,0,0,.1); margin-bottom: 22px; }
.case-subnav .wp { max-width: 1200px !important; margin: 0 auto !important; padding: 32px 22px !important; text-align: left !important; font-size: 0; }
.case-subnav .wp > a {
    display: inline-block; vertical-align: middle; padding: 0 10px;
    font-size: 16px; color: #434343; line-height: 2.5em; transition: color .2s;
}
.case-subnav .wp > a:hover { color: #333; }
/* 详情页设计参考无 active(case.html 已去 .on);列表页 .on 仅留轻微加粗,不再红色 */
.case-subnav .wp > a.on { color: #434343; font-weight: 500; }
.case-subnav .wp > a.on:after { content: none; }
@media (max-width: 768px) {
    .case-subnav .wp { white-space: nowrap; overflow-x: auto; text-align: left; }
    .case-subnav .wp > a { padding: 10px 10px; font-size: 14px; }
}

/* 11-3 卡片网格:一排 3 个(对照设计参考 col-lg-3 布局这里的 3 列大图卡) */
.m-case-grid { overflow: hidden; margin: 0 -12px; }
.m-case-grid li { width: 33.333%; float: left; padding: 0 12px; margin-bottom: 36px; }
.m-case-grid .con { display: block; overflow: hidden; background: #fff; }
.m-case-grid .pic { padding-top: 71.5%; position: relative; height: 0; overflow: hidden; }
.m-case-grid .pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.m-case-grid .txt { padding: 18px 18px 24px; text-align: center; }
.m-case-grid .tit { font-size: 16px; color: #333; line-height: 1.5em; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-bottom: 8px; }
.m-case-grid .desc { font-size: 13px; color: rgba(51,51,51,.6); line-height: 1.5em; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.m-case-grid li:hover .tit { color: #F12535; }
@media (max-width: 768px) { .m-case-grid li { width: 50%; } }

/* ---- 12. 工程案例详情(.case-detail):对齐设计参考纯图文正文,复用 style.css .m-details
   标题/正文基础样式由 style.css 提供;此处补 面包屑/meta/正文阅读宽度/图片/上下篇 ---- */
/* 面包屑:首页 > 工程案例 > 子栏目 > 标题(灰底白卡顶,> 分隔,当前项可截断)
   ⚠ .wp 用 white-space:nowrap 强制所有 item 同一行(flex/inline-block 下长标题会因
   min-width:auto 换行错位);.cur 限宽 + ellipsis 截断超长标题。
   .g-boxl1 .wp 全局规则(max-width:none/padding:0 22px)会覆盖,关键属性加 !important。 */
.case-crumb { background: transparent !important; border-bottom: none !important; }
.case-crumb .wp {
    max-width: 1200px !important; width: auto !important;
    margin: 0 auto !important; padding: 12px 22px !important;
    white-space: nowrap !important; overflow: hidden !important;
    font-size: 12px !important; color: #333; line-height: 1.5em;
}
/* ⚠坑16⑦:框架运行时往 .wp/<a> 注入 inline font-size:16px(静态 CSS 搜不到);
   !important 在样式表里压过无 !important 的 inline 注入,故 item/sep/a 显式钉 12px !important */
.case-crumb .wp > .item { display: inline-block !important; vertical-align: middle !important; white-space: nowrap !important; color: #333; font-size: 12px !important; }
/* 分隔符:真实 DOM <span class="sep">>(非 ::before,避免被 iconfont/字体覆盖渲染成图标;设计参考同此法) */
.case-crumb .wp .sep {
    display: inline-block !important; vertical-align: middle !important;
    margin: 0 4px; color: #333; font-family: inherit !important; font-size: 12px !important;
}
.case-crumb .wp a { color: #333; font-size: 12px !important; transition: color .2s; }
.case-crumb .wp a:hover { color: #333; }
.case-crumb .wp .cur {
    color: #333; max-width: 480px;
    font-size: 12px !important; line-height: 1.5em !important;
    padding: 0 !important; margin: 0 !important;
    overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
}
/* 去掉全局 .cur:after 的 iq31.png 图标(style.css:951 全站「当前项」标记,面包屑标题不需要) */
.case-crumb .cur:after { content: none !important; display: none !important; background: none !important; }
.case-detail .wp { max-width: 1200px; }
/* 去掉 .m-details 框架注入的全屏 border-bottom(2px#eaeaea,上下篇下方那条全屏线;用户要"去掉") */
.case-detail { border-bottom: none !important; }
/* 标题:对照设计参考(SPAN 40px/fw700/#262626/居中)→ 本地 H1 改加粗+深色 */
.case-detail .title { font-size: 40px !important; font-weight: 700 !important; color: #262626 !important; }
/* meta 日期:对照设计参考 14px/#333/居中(原半透明 .55 改实色) */
.case-detail .meta { text-align: center; font-size: 14px; color: #333; margin-top: -20px; margin-bottom: 40px; }
.case-detail .meta span { display: inline-block; margin: 0 8px; }
.case-detail .meta .cat { position: relative; padding-left: 18px; }
.case-detail .meta .cat:after { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; background: #F12535; border-radius: 50%; }
/* 文章简介 ext_desc(独立于 SEO description):摘要框,浅底左红线,标题正文之间 */
.case-detail .desc {
    max-width: 1200px; margin: 0 auto 36px; padding: 18px 22px;
    background: #f7f8fa; border-left: 3px solid #F12535; border-radius: 0 4px 4px 0;
    font-size: 15px; line-height: 1.8em; color: rgba(51,51,51,.78);
}
/* 正文:对照设计参考通栏 1200(图文自适应) */
.case-detail .text { max-width: 1200px; margin: 0 auto; }
.case-detail .text p { margin-bottom: 1.2em; }
.case-detail .text img { display: block; max-width: 100% !important; height: auto !important; margin: 18px auto; border-radius: 4px; }
.case-detail .text h2,.case-detail .text h3 { font-size: 22px; margin: 1.4em 0 .6em; font-weight: 600; }
/* 上下篇:两栏,带分隔线 */
.case-detail .case-nav { max-width: 1200px; margin: 50px auto 0; padding-top: 24px; border-top: 1px solid #eaeaea; display: flex; justify-content: space-between; gap: 20px; }
.case-detail .case-nav p { width: 50%; font-size: 15px; line-height: 1.6em; }
.case-detail .case-nav p.next { text-align: right; }
.case-detail .case-nav p span { color: rgba(51,51,51,.5); }
.case-detail .case-nav a { color: #333; transition: color .2s; }
.case-detail .case-nav a:hover { color: #F12535; }
.case-detail .case-nav .empty { color: rgba(51,51,51,.35); }
@media (max-width: 768px) {
    .case-detail .title { font-size: 24px !important; }
    .case-detail .case-nav { flex-direction: column; }
    .case-detail .case-nav p, .case-detail .case-nav p.next { width: 100%; text-align: left; }
}

/* ---- 13. 案例详情底部:推荐产品 + 联系我们(严格对照设计参考 参考设计 NewsDetail 渲染实测)
     推荐产品(ModuleRelevanceGiant):标题上方 1px #d8d8d8 分隔线(1200居中不全屏);标题 #333 加粗无下划线;
        标题下方短蓝条 #0072d4(设计参考该位为失效白色占位 imgbg.png,用户要"蓝色图标或线");
        产品卡 图85%比例contain + 灰底#dddee1名称栏。
     联系我们(ModuleGridGiant 双栏):整条深灰#333底+白字(坑16⑤:设计参考无红色,layout-color-* 不影响模块背景);
        左半文案「即刻取得联系，/为您的水问题提供专业的解决方案。」右半「联系我们」白边框按钮(链接服务支持 scode=5)。
     ⚠联系我们 margin-top:0 与推荐产品相邻(对照设计参考 0 间隙,"联系起来");margin-bottom:96 下离 footer 留白 ---- */
.case-recommend { padding: 40px 0 40px; background: #fff; }
.case-recommend .wp { max-width: 1200px !important; width: auto !important; margin: 0 auto !important; padding: 0 22px; }
.case-recommend .rec-line { border: none; border-top: 1px solid #d8d8d8; margin: 0 0 36px; }  /* 上方分隔线:wp内居中,不全屏(对照设计参考 hr.hr-line 1200居中) */
.case-recommend .sec-tit { font-size: 16px; font-weight: 700; color: #333; margin: 0 0 8px; border: none; height: auto; line-height: 1.4em; }  /* 标题无长下划线 */
.case-recommend .sec-bar { display: block; width: 40px; height: 3px; background: #0072d4; margin: 0 0 26px; }  /* 标题下短蓝条(设计参考该位占位失效,以蓝色短条呈现) */
.case-recommend-grid { overflow: hidden; margin: 0 -12px; }
.case-recommend-grid li { width: 25%; float: left; padding: 0 12px; box-sizing: border-box; }
.case-recommend-grid .con { display: block; overflow: hidden; }
.case-recommend-grid .pic { padding-top: 85%; position: relative; height: 0; overflow: hidden; border: 1px solid #dddee1; background: #fff; }
.case-recommend-grid .pic img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 92%; max-height: 92%; object-fit: contain; transition: transform .4s; }
.case-recommend-grid li:hover .pic img { transform: translate(-50%,-50%) scale(1.04); }
.case-recommend-grid .txt { background: #dddee1; padding: 6px 10px; text-align: center; }
.case-recommend-grid .tit { font-size: 14px; color: #333; font-weight: 400; line-height: 1.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; }
@media (max-width: 768px) {
    .case-recommend { padding: 36px 0 26px; }
    .case-recommend-grid li { width: 50%; margin-bottom: 16px; }
}

/* 联系我们:全宽白底 + 中间居中1200深灰条(对照设计参考:#module_452401157 .BodyCenter 全宽白,
   .row.ModuleSubContainer 深灰rgb(51,51,51)居中不全宽)。⚠设计参考深灰条不全屏,勿改全宽。
   margin-top:0:对照设计参考推荐产品(BodyCenter446980912 底=4320)→联系我们(BodyCenter452401157 顶=4320)
   完全相邻无间隙(0),即"联系起来";margin-bottom:96 下离 footer 留白。 */
.case-contact { background: #fff; margin-top: 0; margin-bottom: 96px; }
.case-contact .ct-inner { background: #333; max-width: 1200px; margin: 0 auto; display: flex !important; align-items: center; }
.case-contact .ct-txt { flex: 1; padding: 44px 22px 44px 15%; box-sizing: border-box; }
.case-contact .ct-txt p { color: #fff !important; font-size: 24px; line-height: 1.5em; margin: 0; font-weight: 500; }
.case-contact .ct-btn-cell { flex: 0 0 38%; display: flex; align-items: center; justify-content: center; padding: 0 40px; box-sizing: border-box; }
.case-contact .ct-btn { color: #fff !important; font-size: 15px; padding: 10px 32px; border: 1px solid rgba(255,255,255,.35); border-radius: 4px; transition: all .2s; display: inline-block; }
.case-contact .ct-btn:hover { background: #fff; color: #1a1a1a !important; border-color: #fff; }
@media (max-width: 768px) {
    .case-contact { margin-top: 0; margin-bottom: 56px; }
    .case-contact .ct-inner { flex-direction: column !important; }
    .case-contact .ct-txt { padding: 28px 16px; text-align: center; flex: none; }
    .case-contact .ct-txt p { font-size: 20px; }
    .case-contact .ct-btn-cell { padding: 24px; flex: none; }
}

/* ===== 售后及服务(scode=25)服务政策 文章式(style.css ol/ul 已 reset list-style,需补编号)===== */
.m-details.scode-25 .text h2{font-size:26px;font-weight:bold;color:#333;text-align:center;margin:10px 0 28px;}
.m-details.scode-25 .text h3{font-size:18px;font-weight:bold;color:#F12535;margin:26px 0 14px;}
.m-details.scode-25 .text ol.policy-list{list-style:decimal;padding-left:24px;margin:8px 0 18px;}
.m-details.scode-25 .text ol.policy-list li{line-height:1.9em;margin-bottom:10px;color:#333;}
.m-details.scode-25 .text .policy-note{font-size:14px;color:#666;line-height:1.8em;margin:6px 0;padding-left:8px;}
.m-details.scode-25 .text p{margin-bottom:12px;}
@media (max-width:768px){
    .m-details.scode-25 .text h2{font-size:22px;margin:6px 0 20px;}
    .m-details.scode-25 .text h3{font-size:16px;margin:20px 0 10px;}
}

/* ===== 社交媒体二维码页(scode=27,4 二维码走幻灯片 gid=506)=====
   尺寸:200×200 正方形(原 180),object-fit:cover 强制填满 1:1(原图非正方形时裁切填满,
   正方形原图 cover=无操作不裁切;占位图后续会在后台替换为正方形二维码)。 */
.m-social{padding:70px 0 90px;overflow:hidden;}
.m-social .g-titq2{margin-bottom:8px;}
.m-social .social-desc{text-align:center;font-size:16px;color:#666;margin-bottom:50px;}
.m-social .ul-social{display:flex;flex-wrap:wrap;justify-content:center;margin:0 -15px;}
.m-social .ul-social li{width:25%;padding:0 15px;box-sizing:border-box;text-align:center;margin-bottom:30px;}
.m-social .qr-box{background:#f8f8f8;padding:34px 20px;border-radius:6px;transition:.3s;}
.m-social .qr-box:hover{background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.08);}
.m-social .qr-pic{width:200px;height:200px;margin:0 auto 20px;}
.m-social .qr-pic img{width:100%;height:100%;object-fit:cover;display:block;}
.m-social .qr-name{font-size:20px;color:#333;font-weight:500;margin-bottom:8px;}
.m-social .qr-tip{font-size:14px;color:#999;}
@media (max-width:768px){
    .m-social{padding:40px 0 50px;}
    .m-social .social-desc{font-size:14px;margin-bottom:30px;}
    .m-social .ul-social li{width:50%;}
    .m-social .qr-pic{width:150px;height:150px;}
    .m-social .qr-name{font-size:18px;}
}

/* ---- 14. 新闻动态(/?news/ scode=10 + 子栏目 35-38):4 分类双图 tab + 横排图文卡片 + 详情
   对照设计参考 news 页:.ul-tabulationl 4 tab(双图 hover)+ 横排卡片(缩略图左+标题/日期/摘要右),10 条/页。
   tab 双图:常态走栏目 ico 字段 / hover 走 pic 字段,CSS opacity 切换;.on 态常显 hover 图。
   列表缩略图走内容 ico 字段;分页用服务端 comm/page.html(list 标签 page=true)。 ---- */

/* 14-1 分类 tab:列表页也走设计 .m-tabulationl.qm(与详情页一致),源 CSS 自带 ul pt/pb60 + li width25% + imgl1/imgl2 双图 + .on 红字,此处不覆盖,保证 PC/移动两端与设计一致 */

/* 14-2 卡片列表(对齐设计参考实测:标题30px/图文间距82/卡片留白64 无分隔线,留白显大气;目标 li mb80 a padding0 无 border) */
.m-newslist { list-style:none; max-width:1180px; margin:0 auto; padding:80px 10px 0; } /* 顶 80:与上方 .qm 底 2px 分隔线拉开,设计列表此处 pt100;卡片已拆到独立 .wp */
.m-newslist li { margin-bottom:64px; }
.m-newslist li:last-child { margin-bottom:0; }
.m-newslist li .con { display:block; overflow:hidden; padding:0; }
.m-newslist li .pic { float:left; width:266px; height:177px; margin-right:82px; overflow:hidden; border-radius:4px; background:#f3f3f3; }
.m-newslist li .pic img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.m-newslist li:hover .pic img { transform:scale(1.04); }
.m-newslist li .txt { overflow:hidden; padding-top:5px; } /* 包浮动 pic;顶对齐图顶偏下5px(对齐目标 txt padding-top5) */
.m-newslist li .txt h3 { font-size:30px; color:#333; line-height:1.5em; margin:0 0 16px; font-weight:400; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; transition:color .2s; }
.m-newslist li:hover .txt h3 { color:#F12535; }
.m-newslist li .txt span { display:block; font-size:16px; color:rgba(51,51,51,.8); line-height:24px; margin-bottom:15px; }
.m-newslist li .txt .desc { font-size:16px; color:rgba(51,51,51,.6); line-height:24px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* 14-3 详情页:改用设计原样结构(.m-tabulationl.qm tab / .cur 面包屑 / .m-textq1.ls 正文 / .m-brandl+.m-slickl5 相关资讯),
     样式全部由设计 /res/css/style.css(已本地化)提供,此处不覆盖,与设计 /news/7307 一致。仅 h1 字重兜底(设计渲染 700,本地被 reset 压成 400)+ 正文图片防溢出。 */
.m-textq1 h1 { font-weight:700; }
.m-textq1 .txt img { max-width:100%; height:auto; }
/* 相关资讯居中卡高亮:slick 把 .item 多包了一层 .slick-slide,源 CSS 的 .item.slick-current 匹配不到;
   按实际结构补(对齐设计:居中卡 opacity1/pic173/desc 展开 3em,其余卡 opacity.6)。hover 高亮源 CSS 已生效。 */
.m-slickl5 .slick-slide.slick-current .con { opacity:1; }
.m-slickl5 .slick-slide.slick-current .con .pic { height:173px; }
.m-slickl5 .slick-slide.slick-current .con .desc { height:3em; }
/* 源 CSS .m-slickl5 .con .pic img 是 min-height:100%/max-width:none/min-width:100%(无 object-fit),
   796px 宽的封面图按原始尺寸渲染→溢出 246 宽 .pic 框被裁成坏角;这里强制填满 + 居中裁剪,设计原视觉 */
.m-slickl5 .con .pic img { width:100%; height:100%; max-width:none; min-width:0; object-fit:cover; }
/* 14-3c 相关资讯轮播箭头:用户要求「单独放在内容版块下方、内容与 footer 之间的留白带」,不压图片/文字。
   🔴 坑:slick-theme.css 给 .slick-arrow 设了 top:50%(垂直居中压图上),设计 bottom:0 因此失效——
   top+bottom+height 同设时 bottom 被忽略,箭头实际卡在图片下半部(top:233=50%×466)。必须 top:auto 让 bottom 生效。
   解法:给 .m-slickl5 底 padding 70 造独立留白带,箭头落带底、水平居中成对(沿用源 left/right:46.5%)。 */
.m-slickl5 { padding-bottom: 70px; }
.m-slickl5 .slick-arrow { top: auto; bottom: 24px; transform: none; z-index: 5; }
.m-slickl5 .slick-prev { left: 46.5%; right: auto; }
.m-slickl5 .slick-next { right: 46.5%; left: auto; }
@media (max-width:768px){
    .m-slickl5 { padding-bottom: 50px; }
    .m-slickl5 .slick-arrow { bottom: 16px; }
    .m-slickl5 .slick-prev { left: 30%; right: auto; }
    .m-slickl5 .slick-next { right: 30%; left: auto; }
}

/* 14-4 移动端:对照设计参考,移动隐藏 4tab(源 CSS .ul-tabulationl display:none),改当前栏目 .tit 手风琴头(点开竖排 4 分类);
   模板补 .tit(newslist.html)+ JS 切 .open;源 CSS 已给 .tit display:block + 右侧图标、展开 li 竖排,此处仅补 .tit 内边距/字 + 展开态显隐 */
@media (max-width:768px){
    .m-news .m-tabulationl, .m-news-detail .m-tabulationl { background:#fff; border:none; padding:0; }
    .m-news .m-tabulationl .wp, .m-news-detail .m-tabulationl .wp { padding:0; }
    .m-news .m-tabulationl .tit, .m-news-detail .m-tabulationl .tit { padding:14px 22px; font-size:16px; color:#333; font-weight:600; cursor:pointer; min-height:44px; display:flex; align-items:center; position:relative; box-sizing:border-box; }
    .m-news .m-tabulationl .tit::after, .m-news-detail .m-tabulationl .tit::after { content:'∨'; position:absolute; right:16px; top:50%; transform:translateY(-50%); color:#999; font-size:14px; font-weight:400; transition:transform .2s; }
    .m-news .m-tabulationl.open .tit::after, .m-news-detail .m-tabulationl.open .tit::after { transform:translateY(-50%) rotate(180deg); }
    .m-news .m-tabulationl.open .ul-tabulationl, .m-news-detail .m-tabulationl.open .ul-tabulationl { display:block !important; }
    .m-newslist { padding-top:20px; }
    .m-newslist li { margin-bottom:0; }
    .m-newslist li .con { display:flex; display:-webkit-flex; align-items:center; padding:14px 0; border-bottom:1px solid #eee; }
    .m-newslist li .pic { float:none; width:115px; height:80px; margin-right:13px; margin-bottom:0; padding-top:0; flex:0 0 115px; -webkit-flex:0 0 115px; position:relative; overflow:hidden; border-radius:4px; background:#f3f3f3; }
    .m-newslist li .pic img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; transition:none; }
    .m-newslist li:hover .pic img { transform:none; }
    .m-newslist li .txt { flex:1; -webkit-flex:1; min-width:0; padding-top:0; overflow:hidden; }
    .m-newslist li .txt h3 { font-size:15px; line-height:1.4; margin:0 0 8px; white-space:normal; -webkit-line-clamp:2; }
    .m-newslist li .txt span { font-size:12px; color:#999; line-height:18px; margin:0; }
    .m-newslist li .txt .desc { display:none; }
}

/* 14-6 坑33:品牌荣誉 .m-slickl2 移动居中模式(对齐公益 .m-slickl3)——foot.html 768 断点切 centerMode,
   此处选中证书满尺寸高清、邻卡 scale(.8)+opacity(.4) 缩小蒙白,凸显当前选中(用户要"选中图更高清");
   PC 仍 3 卡轮播不动。.m-slickl2 原带 margin:0 -15px(基础布局),移动收 0 防溢出。 */
@media (max-width: 767px) {
    .m-slickl2 { margin: 0; }
    .m-slickl2 .slick-slide .item { -webkit-transition: opacity .35s, -webkit-transform .35s; transition: opacity .35s, transform .35s; }
    .m-slickl2 .slick-slide:not(.slick-center) .item { -webkit-transform: scale(.8); transform: scale(.8); opacity: .4; }
    .m-slickl2 .slick-slide.slick-center { z-index: 2; }
}

/* 14-5 查看更多(居中,仿设计 .more;AJAX 追加见 newslist.html JS) */
.m-news { padding-bottom: 80px; } /* 列表区底留白:无论有无「查看更多」(子栏目单页无按钮)都与 footer 拉 80;原 pb 挂按钮上→子栏目没同步,改挂容器 */
.news-more-wrap { text-align:center; padding:48px 0 0; } /* 顶 48 留末卡到按钮间距;底交给 .m-news */
a.news-more { display:inline-block; min-width:160px; padding:13px 44px; border:1px solid #c9c9c9; color:#595959; font-size:15px; line-height:1.4; background:#fff; border-radius:2px; transition:border-color .2s, color .2s; }
a.news-more:hover { border-color:#F12535; color:#F12535; }
a.news-more.loading { opacity:.65; pointer-events:none; }
a.news-more.loading:before { content:''; display:inline-block; width:14px; height:14px; margin-right:8px; border:2px solid #d8d8d8; border-top-color:#F12535; border-radius:50%; vertical-align:-2px; animation:newsSpin .7s linear infinite; }
a.news-more.end { color:#bbb; border-color:#eee; cursor:default; } /* 单页/已到底:置灰占位,视觉一致不消失 */
@keyframes newsSpin { to { transform:rotate(360deg); } }
@media (max-width:768px) {
    a.news-more { min-width:120px; padding:11px 30px; font-size:14px; }
    .m-news { padding-bottom: 50px; }
    .news-more-wrap { padding:32px 0 0; }
}

/* ---- 15. 移动端底部 contact 社交图标适配(@media ≤768px)
   PC 端 .bdsharebuttonbox > a 的图标背景由 style.css 提供,hover 弹 .box 二维码;
   移动首页未引 style.css → a 无背景图标,微信/抖音/小红书的 .box 二维码图常显且全宽堆叠,
   把 contact 区撑到 1000+px。移动端改为:有码的 3 个缩小横排(80×80+文字),无图标(微博/知乎)隐藏。 ---- */
@media (max-width: 768px) {
    .footer .foot .contact .rr .bdsharebuttonbox { font-size: 0; }
    .footer .foot .contact .rr .bdsharebuttonbox > a {
        display: inline-block !important; vertical-align: top;
        width: 80px !important; height: auto !important; margin: 10px 8px 0 0 !important;
    }
    .footer .foot .contact .rr .bdsharebuttonbox > a .box { display: block !important; }
    .footer .foot .contact .rr .bdsharebuttonbox > a .box .pic {
        width: 80px !important; height: 80px !important; margin: 0 auto !important;
    }
    .footer .foot .contact .rr .bdsharebuttonbox > a .box .pic img {
        width: 100% !important; height: 100% !important; object-fit: contain;
    }
    .footer .foot .contact .rr .bdsharebuttonbox > a .box .txt {
        font-size: 11px; text-align: center; color: rgba(255,255,255,.82); margin-top: 4px;
    }
    .footer .foot .contact .rr .bdsharebuttonbox > a.bds_tsina,
    .footer .foot .contact .rr .bdsharebuttonbox > a.zhi { display: none !important; }
}

/* ---- 16. 移动端底部(折叠站点地图 + 深底联系/版权 + fixed 功能栏)
   5 组折叠分类(白底黑字,默认收起,点标题展开)+ 联系/版权区(深底白字)
   + 底部 fixed 功能栏(首页/顶部/返回)。.m-foot 仅移动 DOM 含;PC 用独立 .footer,
   此处规则对 PC 无元素不生效。 ---- */
.m-foot { background: #1f1f1f; }
.m-foot-map { padding: 0; }
.m-foot-cat { border-bottom: 0; }
.m-foot-tit {
    margin: 0; padding: 0 20px; height: 50px; font-size: 15px; color: #fff; font-weight: 600;
    display: flex; justify-content: space-between; align-items: center; cursor: pointer;
}
.m-foot-ico { position: relative; width: 16px; height: 16px; flex: 0 0 16px; }
.m-foot-ico::before, .m-foot-ico::after {
    content: ''; position: absolute; left: 50%; top: 50%; background: #fff; transition: transform .2s;
}
.m-foot-ico::before { width: 14px; height: 2px; margin: -1px 0 0 -7px; }   /* 横线 */
.m-foot-ico::after  { width: 2px; height: 14px; margin: -7px 0 0 -1px; }   /* 竖线 */
.m-foot-cat.open .m-foot-ico::after { transform: scaleY(0); }              /* 展开变 "−" */
.m-foot-sub {
    list-style: none; margin: 0; padding: 0; max-height: 0; overflow: hidden;
    transition: max-height .25s ease;
}
.m-foot-cat.open .m-foot-sub { max-height: 460px; }
.m-foot-sub li a {
    display: flex; align-items: center; height: 41px; padding: 0 20px;
    font-size: 13px; color: #bdbdbd; background: #333;
    border-bottom: 1px solid #515151;
}
.m-foot-sub li:last-child a { border-bottom: 0; }
.m-foot-sub li a::before {
    content: ''; width: 4px; height: 14px; background: #0072d4; margin-right: 10px; flex: 0 0 4px;
}
.m-foot-sub li a:active { color: #fff; }

.m-foot-info { background: #1f1f1f; padding: 20px 16px 76px; }  /* 底 76:留 fixed 功能栏 50 + 视觉间距 */
.m-foot-ct-tit { margin: 0 0 8px; font-size: 14px; color: rgba(255,255,255,.82); }
.m-foot-tel {
    display: inline-block; font-size: 26px; font-weight: 700; color: #fff; line-height: 1.2;
    margin-bottom: 16px;
}
.m-foot-tel i { font-size: 22px; margin-right: 6px; vertical-align: -2px; }
.m-foot-soc { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 18px; }
.m-foot-soc-i { flex: 1; text-align: center; min-width: 0; }
.m-foot-soc-i img { width: 100%; max-width: 72px; aspect-ratio: 1 / 1; display: block; margin: 0 auto; background: #fff; padding: 4px; box-sizing: border-box; border-radius: 4px; }
.m-foot-soc-i span { display: block; margin-top: 6px; font-size: 12px; color: rgba(255,255,255,.82); }
.m-foot-copy p { margin: 4px 0; font-size: 12px; color: rgba(255,255,255,.6); line-height: 1.7; }
.m-foot-copy a { color: rgba(255,255,255,.6); }
.m-foot-copy p span { color: rgba(255,255,255,.45); }

/* fixed 功能栏(首页/顶部/返回) */
.m-footbar {
    position: fixed; left: 0; right: 0; bottom: 0; height: 50px; z-index: 900;
    background: #fff; border-top: 1px solid #e6e6e6; display: flex;
    box-shadow: 0 -2px 8px rgba(0,0,0,.06);
}
.m-fb-item {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: 11px; color: #666; line-height: 1.2;
}
.m-fb-item i { font-size: 18px; margin-bottom: 3px; }
.m-fb-item:active { color: #F12535; }

/* ---- 17. 移动端产品列表兼容:基础布局模板产品卡 col-xs-2(6列密集小卡)→ 移动 2 列大卡(对齐移动端阅读)
   ⚠踩坑(坑31):基础布局 PageCss 有 .ModuleProductListGiant.layout-104 .pro-container .pro-item{margin:0 3.1% 3.1% 0 !important},
   同为 !important 但基础布局多一个 class(0,4,0)>我的(0,3,0),且 PageCss 在 site_fix 之后加载 → 我的 margin:0 被压;
   3.1%×390≈12px 右边距 + width:50% → 两个>100% → flex 换行变 1 列。
   修复:改用 #module_459737130(ID 级 (1,2,0))带 !important,压过基础布局任何 class 级 !important;margin 清零,间距走内 padding。 ---- */
@media (max-width: 767px) {
    .ModuleProductListGiant .pro-container { display: flex !important; flex-wrap: wrap !important; }
    #module_459737130 .pro-container .pro-item { width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; box-sizing: border-box !important; margin: 0 !important; padding: 0 5px 12px !important; }
    #module_459737130 .pro-container .pro-item .pro-img img,
    #module_459737130 .pro-container .pro-item img { width: 100%; height: auto; }
}

/* ---- 18. 移动端内页吸顶:内页 body 被 padding-top:50 下推,致静态头部与顶部留 50px 缝(首页无此 padding 正常);归零贴顶,头部回 top:0,内容紧贴其下,与首页一致 ---- */
@media (max-width: 767px) {
    body { padding-top: 0 !important; }
    #MobileNav { top: 0 !important; }
}

/* ---- 19. 移动端产品详情面包屑:设计参考移动详情页无面包屑,本站原继承基础布局 .m-information .breadcrumb 在窄屏溢出换行;移动端隐藏与参考一致(PC 不受 @media 影响) ---- */
@media (max-width: 767px) {
    .m-information .breadcrumb { display: none !important; }
}

/* ---- 20. 移动端浮动电话按钮(对照设计参考 setright:右下圆形直拨钮,悬于底栏 .m-footbar 上方) ---- */
.m-tel-float { display: none; }
@media (max-width: 767px) {
    .m-tel-float { display: flex; position: fixed; right: 12px; bottom: 72px; z-index: 900; width: 48px; height: 48px; border-radius: 50%; background: #F12535; color: #fff; align-items: center; justify-content: center; font-size: 22px; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
    .m-tel-float i { color: #fff; }
}

/* ---- 21. 移动端产品分类图标网格(module_453860428):基础布局 col-xs-3 float 4 列,但「全部产品」纯文字卡/空图标卡(家用/工程案例)与图标卡高度不均致 float 错位
     (实测行2 从右半 l:195 起、行3 从左半,视觉像「2 列」)。
     救法:float 基础上 nth-child(4n+1) 强制每 4 项 clear:left 换行——高度差不影响,严格 4 列。
     ⚠ 踩坑:基础布局 .ModuleGridGiant 自身带 clearfix 类,不能写 .clearfix{display:none}(会把整模块父级一起隐藏致全塌);只藏分隔符 .clearfix.visible-xs/.visible-lg。
     项定高 100px 覆盖基础布局 height:100%!,图标位定高居中,空图标卡留位文字居中 ---- */
@media (max-width: 767px) {
    #module_453860428 .clearfix.visible-lg,
    #module_453860428 .clearfix.visible-xs { display: none !important; }
    #module_453860428 .ModuleGridItem { float: left !important; clear: none; height: 100px !important; min-height: 100px; box-sizing: border-box; padding: 6px 2px; }
    #module_453860428 .ModuleGridItem:nth-child(4n+1) { clear: left !important; }
    #module_453860428 .imageTextGiant-Container { display: flex; flex-direction: column; height: 100%; }
    #module_453860428 .GraphicUpper { min-height: 58px; display: flex; align-items: center; justify-content: center; }
    #module_453860428 .GraphicUpper img { max-width: 88%; max-height: 54px; height: auto; }
    #module_453860428 .ModuleImageTextGiantContent p { text-align: center !important; font-size: 13px; line-height: 1.3; }
    /* 无图标卡(家用/工程案例/全部产品):隐空图标位,文字垂直居中,文字卡不显空旷 */
    #module_453860428 .ModuleGridItem.no-ico .GraphicUpper { display: none; }
    #module_453860428 .ModuleGridItem.no-ico .imageTextGiant-Container { justify-content: center; }
}

/* ========= 站点全局搜索(自包含浮层,PC+移动通用) §34 ========= */
.site-search-fab{position:fixed;right:20px;bottom:60px;z-index:902;width:48px;height:48px;border-radius:50%;background:#F12535;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.25);cursor:pointer;line-height:1;}
.site-search-fab:hover{background:#d81e2c;}
.site-search-fab svg{width:22px;height:22px;fill:currentColor;display:block;}
.site-search-wrap{position:fixed;inset:0;z-index:9999;display:none;}
.site-search-wrap.open{display:block;}
.site-search-mask{position:absolute;inset:0;background:rgba(0,0,0,.45);}
.site-search-box{position:relative;max-width:680px;margin:18vh auto 0;background:#fff;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.2);padding:18px;box-sizing:border-box;}
.site-search-box form{display:flex;align-items:center;gap:8px;}
.site-search-input{flex:1;height:44px;border:2px solid #eee;border-radius:8px;padding:0 14px;font-size:15px;outline:none;}
.site-search-input:focus{border-color:#F12535;}
.site-search-btn{height:44px;padding:0 22px;border:0;border-radius:8px;background:#F12535;color:#fff;font-size:15px;cursor:pointer;white-space:nowrap;}
.site-search-btn:hover{background:#d81e2c;}
.site-search-close{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;font-size:24px;color:#999;cursor:pointer;border-radius:50%;flex-shrink:0;}
.site-search-close:hover{background:#f2f2f2;color:#333;}
@media(max-width:767px){
    .site-search-fab{display:none !important;} /* 移动端隐藏搜索悬浮球(用户要求 2026-08-10) */
    .site-search-box{margin-top:12vh;border-radius:0 0 10px 10px;}
    .site-search-btn{padding:0 14px;}
    .site-search-close{width:32px;height:32px;font-size:22px;}
}

/* ---- 22. (已删除 2026-08-10)原隐藏移动端浮动电话按钮,应反馈"图标没了"现恢复显示(由 §20 控制:移动 display:flex);如需再隐,在本 @media 加回 .m-tel-float{display:none!important} ---- */