@charset "utf-8";
/* filtersfactory 主题补充样式：主色沿用站点蓝 #1f6bc1 */
.news-list { list-style: none; margin: 0; padding: 0; }
.news-list li { line-height: 34px; border-bottom: 1px dashed #ececec; color: #555; font-size: 14px; overflow: hidden; }
.news-list li a { color: #555; text-decoration: none; float: left; max-width: 78%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.news-list li a:hover { color: #1f6bc1; }
.news-list li span { float: right; color: #8a8a8a; font-size: 12px; }

.pages { clear: both; text-align: center; padding: 18px 0; }
.pages a, .pages span { display: inline-block; padding: 4px 11px; margin: 0 3px; border: 1px solid #ececec; color: #555; text-decoration: none; font-size: 13px; }
.pages a:hover { border-color: #1f6bc1; color: #1f6bc1; }
.pages span.on { background: #1f6bc1; border-color: #1f6bc1; color: #fff; }

.detail-title { font-size: 22px; color: #333; line-height: 40px; text-align: center; font-weight: normal; }
.detail-meta { text-align: center; color: #8a8a8a; border-bottom: 1px solid #ececec; padding-bottom: 8px; margin-bottom: 10px; }
.detail-summary { background: #f7f9fc; border-left: 3px solid #1f6bc1; padding: 10px 14px; color: #555; line-height: 26px; }
.detail-cover { text-align: center; }
.detail-cover img { max-width: 100%; }
.detail-nav { border-top: 1px dashed #ececec; margin-top: 14px; padding-top: 10px; }
.detail-nav a { color: #555; text-decoration: none; }
.detail-nav a:hover { color: #1f6bc1; }

.spec-table { width: 100%; border-collapse: collapse; margin: 6px 0; }
.spec-table th, .spec-table td { border: 1px solid #ececec; padding: 7px 12px; font-size: 13px; font-weight: normal; text-align: left; color: #555; }
.spec-table th { width: 160px; background: #f7f9fc; }

.download-list { list-style: none; padding: 0; }
.download-list li { line-height: 32px; }
.download-list li a { color: #1f6bc1; text-decoration: none; }
.download-list li a:hover { text-decoration: underline; }

.inquiry-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 12px 0; }
.inquiry-form label { display: block; color: #555; font-size: 13px; }
.inquiry-form input, .inquiry-form textarea { width: 100%; border: 1px solid #ececec; padding: 7px 9px; font-size: 13px; color: #555; }
.inquiry-form .full { grid-column: 1 / -1; }
.inquiry-form .honeypot { display: none; }
.inquiry-form button { background: #1f6bc1; color: #fff; border: 0; padding: 8px 26px; cursor: pointer; font-size: 14px; }
.inquiry-form button:hover { background: #15508f; }

/* 主图区 + 参数区：改用 flex 两栏，不再依赖 float（浮动在窄容器下会因舍入/内边距换行） */
.xpghe_v { display: flex; flex-wrap: wrap; align-items: flex-start; }
.xpghe_v > .show_pro { float: none; flex: 0 0 480px; }
.xpghe_v > .e_vrig { float: none; flex: 0 1 410px; min-width: 0; margin-left: auto; }
/* 原模板两侧栏不撑开父容器（没有 clearfix），补一个不影响下拉菜单的清浮动 */
.lrggxqq::after { content: ''; display: block; clear: both; }

/* 产品图区：原站这段样式是写在页面里的内联 <style>，这里补进主题样式表 */
#preview { float: none; text-align: center; width: 480px; }
.jqzoom { width: 480px; height: 410px; position: relative; margin: 0 auto; padding: 0; }
.jqzoom img { display: block; margin: 0 auto; }

/* 缩略图轮播条（左右箭头 + 列表），取自参考站产品页内联样式 */
.list-h li { float: left; }
#spec-n5 { width: 480px; height: 127px; padding-top: 6px; overflow: hidden; }
#spec-left, #spec-right { width: 35px; height: 70px; margin-top: 25px; cursor: pointer; }
#spec-left { float: left; margin-right: 26px; }
#spec-right { float: right; }
#spec-left img, #spec-right img { display: block; width: 35px; height: 70px; }
#spec-list { position: relative; width: 330px; margin-left: 19px; float: left; }
#spec-list ul li { float: left; width: 130px; }
#spec-list ul li img { float: left; width: 110px; height: 95px; border: 1px solid #ccc; }

/* 放大镜（jqueryzoom） */
.zoomdiv { z-index: 100; position: absolute; top: 1px; left: 0; width: 480px; height: 410px; background: #fff; border: 1px solid #e4e4e4; display: none; text-align: center; overflow: hidden; }
.bigimg { width: 1204px; height: 708px; }
/* 关键：窄窗口下 .oi_riggg img{max-width:100%} 会把放大用的大图压回面板宽度，
   放大倍率变成 1，表现为“鼠标放上去没反应”。这里强制大图不受约束（实际尺寸由 JS 按倍率设置）。 */
.zoomdiv .bigimg, .oi_riggg .zoomdiv img { max-width: none; height: auto; }
.jqZoomPup { z-index: 10; visibility: hidden; position: absolute; top: 0; left: 0; width: 480px; height: 410px; border: 1px solid #aaa; background: #FEDE4F 50% top no-repeat; opacity: 0.5; -moz-opacity: 0.5; -khtml-opacity: 0.5; filter: alpha(Opacity=50); cursor: move; }
/* 相册为空时缩略图条留空，箭头不显示 */
#spec-n5.is-empty #spec-left, #spec-n5.is-empty #spec-right { visibility: hidden; }

/* ===== 英文站侧边栏：栏目名是英文，比参考站的中文名长很多。
   参考站每条是 260px 宽、89px 高的紧凑条（96px 图标 + 单行 20px 名称）。
   英文名按 20px 会折成 2-3 行，把条撑到 180-270px 高，侧边栏完全变形。
   这里固定条高 89px，名称改 16px、限制两行并垂直居中，整体保持参考站的紧凑条状布局；
   同时让子菜单横向位置跟随侧边栏宽度（left:100% 在 260px 侧栏下与原来的 left:260px 等价）。 ===== */
/* 注意：必须用 > ul > li 限定为顶层栏目条。
   若写成 "ul li"，子菜单里的 <li><a> 也是直接子元素，会一起命中：
   子菜单链接被套上 display:flex + max-width:120px 后，文字在 ~120px 处强制折行，
   且子菜单 li 被加上 height:89px，每条子分类变成 90px 高。 */
.lrggxqq .oi_lefff .oxlk_up > ul > li,
.weggxqq .i_lefff .xlk_up > ul > li { height: 89px; }

.lrggxqq .oi_lefff .oxlk_up > ul > li > a,
.weggxqq .i_lefff .xlk_up > ul > li > a {
  float: left;
  display: flex;
  align-items: center;
  height: 89px;
  max-width: 120px;
  margin-left: 16px;
  font-size: 16px;
  line-height: 24px;
}

.lrggxqq .oi_lefff .oxlk_up ul li ul,
.weggxqq .i_lefff .xlk_up ul li ul { left: 100%; }

/* ===== 子菜单单行显示：参考站子菜单固定 145px 宽、14px 字，
   英文条目（如 "Fuel oil-water separator series"）会被折成 2-3 行。
   这里改成不换行 + 宽度随内容（绝对定位向右展开，不影响侧边栏布局），
   字号略降到 13px。≤900px 的竖排手风琴规则在文件后面，特异性相同时胜出。 ===== */
.lrggxqq .oi_lefff .oxlk_up ul li ul,
.weggxqq .i_lefff .xlk_up ul li ul {
  width: auto;
  min-width: 145px;
  padding: 10px 20px;
}
.lrggxqq .oi_lefff .oxlk_up ul li ul li,
.weggxqq .i_lefff .xlk_up ul li ul li { white-space: nowrap; text-align: left; }
.lrggxqq .oi_lefff .oxlk_up ul li ul li a,
.weggxqq .i_lefff .xlk_up ul li ul li a { font-size: 13px; }

/* ===== 顶部导航：文字全部大写 + 紧凑间距 =====
   参考站同规则（14px 字、48px 条高）下，英文项比参考站长（CONTACT US > CONTACT），
   观感偏松。padding 取 40px：项间空白 ~80px，同时 ul 总宽把 HOME 推到蓝条左缘
   附近（桌面下 HOME 距蓝条满色左缘约 44px，不再空出一大段）；
   字号保持 14px。≤1240/≤900 块内有更窄的 padding，特异性相同且在文件后面，不受影响。 */
.isiu .lomenu .ziit ul li { padding: 0 40px; }
.isiu .lomenu .ziit ul li a { text-transform: uppercase; letter-spacing: 0; }

/* ===== 产品网格标题：卡片定宽 291px，英文标题超长会折行把卡片撑高、
   与同行其他卡片错位。这里单行截断加省略号，卡片整齐。
   覆盖三个容器：首页 .i_riggg、产品页 .kjjbn、内页（company/contact 等）推荐产品 .knbnbn ===== */
.weggxqq .i_riggg ul li p,
.kjjbn ul li p,
.knbnbn ul li p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== Latest News（.dudua）两列对齐 =====
   原站结构：li 内 a(标题) float:left + span(日期) float:right。
   英文标题较长会折行，浮动 span 被挤到第二行，日期与虚线分隔线错位（用户反馈"有点乱"）。
   改为 flex 单行：标题弹性占宽 + 超长省略号，日期固定靠右不收缩，
   每条高度一致（40px）、日期右缘齐平、虚线等距。 */
.dudua ul li { display: flex; align-items: center; }
.dudua ul li a {
  float: none;
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dudua ul li span { float: none; flex: 0 0 auto; margin-left: 12px; }

/* ===== 横幅圆点（可手动切换） =====
   图形完全沿用参考站的雪碧图 btn_main_img.png：未选中是淡白环、选中是亮白环，
   两者都是 21px 同一尺寸（与中文站观感一致，不做放大、不加圆底填充）。
   可用性只做两件事：手型光标 + 用 ::before 把点击热区外扩 6px（不改图形、
   不撑大盒子），所以鼠标移上去圆点大小不变。 */
div.flicking_con a {
  position: relative;
  cursor: pointer;
  background-repeat: no-repeat;
}
div.flicking_con a::before {
  content: "";
  position: absolute;
  /* 横向只外扩 2px（圆点间距 27px，再多会和相邻热区重叠点错），纵向放宽 8px */
  top: -8px;
  right: -2px;
  bottom: -8px;
  left: -2px;
}

/* ===== Hot News 列表：参考站按中文标题硬截断 18 字（slice(0,18)），
   英文标题同样 18 字符会切在单词中间（"Use different filt…"）。
   模板已改为输出完整标题，这里用 CSS 省略号收尾，任何宽度都干净。 ===== */
.lrggxqq .oi_lefff .oxlk_up3 ul li a {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 手风琴开关控件：桌面端永远隐藏（桌面保持参考站的 hover 展开），仅 ≤900px 显示 */
.sub-toggle, .sub-switch { display: none; }

/* ===== 顶部 banner：原图 1920×739（内页 1920×579）。
   原站是 1920 定宽整图，窗口一窄就只露中间一块（文字被切掉）。
   这里 <1920 时按宽度等比缩放（38.5vw = 739/1920），并给高度下限
   min(720px, 85vh)（内页 min(540px, 62vh)）：常见笔电宽度、以及浏览器
   125% 缩放（CSS 视口 1536）下 banner 仍有原站"占大半屏"的高度，
   蓝条不会被顶到图片上面、圆点也有地方放；85vh 上限保证矮视口不顶满首屏。
   图片用 cover 等比裁切（不要 100% 100% 拉伸变形）。 ===== */
@media (max-width: 1919px) {
  .main_visual, .main_image { height: 38.5vw; min-height: min(720px, 85vh); }
  .main_image ul, .main_image li { height: 100%; }
  body:not([data-page-type="home"]) .main_visual,
  body:not([data-page-type="home"]) .main_image { height: 30.2vw; min-height: min(540px, 62vh); }
  body:not([data-page-type="home"]) .main_image ul,
  body:not([data-page-type="home"]) .main_image li { height: 100%; }
  .main_visual .main_image li span,
  .main_visual .main_image li a { height: 100%; background-size: cover; background-position: center top; }
  /* 圆点改用 bottom 定位，跟着 banner 实际高度走。
     原 top:700px 写死只在 1920 宽时正好落在 banner 底部；125% 缩放（视口 1536）
     下 banner 只有 591px，圆点会掉出 banner 被 overflow:hidden 裁掉——看不见也点不到。 */
  .main_visual .flicking_con { top: auto; bottom: 21px; }
  /* 头部下方那条通栏图（1920×122 / 1920×173）同样等比缩放 */
  .gadxx  { height: 6.35vw; background-size: 100% 100%; }
  .gadxxt { height: 9vw;    background-size: 100% 100%; }
}
/* 手机屏：banner 恢复纯比例缩放，不设下限（720px 会顶满整屏）。
   圆点 bottom 取 16px：热区外扩 6px 但不改盒子尺寸，视觉上离底边还有 16px。 */
@media (max-width: 767px) {
  .main_visual, .main_image { height: 46vw; min-height: 0; }
  body:not([data-page-type="home"]) .main_visual,
  body:not([data-page-type="home"]) .main_image { height: 36vw; min-height: 0; }
  .main_visual .flicking_con { bottom: 16px; }
}

/* ===== banner 圆点位置：真正居中 =====
   原站 .flicking_con 是 left:50% + margin-left:-50px，圆点串偏在中心右侧约 100px。
   这里 width:300px + margin-left:-150px + flex 居中，与中文参考站一致。 */
.main_visual .flicking_con { display: flex; justify-content: center; width: 300px; margin-left: -150px; }
.main_visual .flicking_con a { float: none; margin: 0 3px; }

/* 原站 css.css 里 .xkjuuj 的背景图 images/ex.jpg 在参考站资源里本来就没带（原站同样 404），
   这里直接去掉，避免每个内容页都发一次 404 请求（视觉上与原站一致：本来就没有这张小方块） */
.xkjuuj { background-image: none; }

/* 自适应：原模板是固定 1200px，窗口窄于 1200 时左右两侧会被裁掉（左栏尤其明显）。
   下面把固定宽度换成百分比，视口 ≥1240px 时完全保持原设计不动。 */
@media (max-width: 1240px) {
  .lrggxqq, .weggxqq, .isiu .sxit, .isiu .loit, .isiu .lomenu .ziit,
  .xifot .fotxgs, .xian, .gaooot .xkjt, .rnksdxx .ttj_ggg, .rnksdxx .xigcc,
  .ryadxx .xiiuu .uu_san, .ryadxx .ju_ggg, .xk_egg { width: 96%; }

  /* ===== 导航：原菜单项 padding 0 48px，窄屏会挤成多行 ===== */
  .isiu .lomenu .ziit ul li { padding: 0 18px; height: 44px; line-height: 44px; }
  .isiu .lomenu .ziit ul li a { font-size: 13px; }

  .lrggxqq .oi_lefff { width: 23%; }
  .lrggxqq .oi_riggg { width: 75%; }
  .lrggxqq .oi_riggg .xpyuee_lo { width: 100%; margin-left: 0; }
  .lrggxqq .oi_lefff .oxlk_up ul li img { width: 32%; height: auto; }
  .lrggxqq .oi_lefff .oxlk_up ul li a { font-size: 16px; margin-left: 8px; }
  .lrggxqq .oi_lefff .oxlk_up ul li ul { width: auto; left: 100%; padding: 10px 14px; }
  .lrggxqq .oi_lefff .oxlk_up3 ul { width: 90%; margin-left: 5%; }

  /* 产品图 + 参数两栏：跟随内容区缩放 */
  .xpghe_v .show_pro, .fi_re .xpghe_v .show_pro { width: 48%; flex: 0 0 48%; }
  #preview { width: 100%; }
  .jqzoom { width: 100%; height: auto; }
  .jqzoom img { width: 100%; height: auto; }
  .xpghe_v .e_vrig, .fi_re .xpghe_v .e_vrig { width: 50%; flex: 0 1 50%; margin-left: auto; }

  /* 缩略图条跟随图片区缩放（箭头保持定宽） */
  #spec-n5 { width: 100%; height: auto; }
  #spec-left, #spec-right { width: 28px; height: 56px; margin-top: 16px; }
  #spec-left img, #spec-right img { width: 28px; height: 56px; }
  #spec-left { margin-right: 2%; }
  #spec-list { width: calc(100% - 80px); margin-left: 0; }
  #spec-list ul li { width: 25%; }
  #spec-list ul li img { width: 100%; height: auto; }

  /* ===== 产品/设备/相关产品网格：原站是 li float:left + 定宽 291px。
     卡片里的图有横有竖，图片高度天然不等 → float 会让后面的卡片被"卡"在
     上一行较高卡片的空隙里（第三张跑到右列、行与行错开）。这里统一改成
     等高网格：图片框用 aspect-ratio 定死比例 + object-fit:contain，
     标题单行截断，任何页面都不会再有错位。 ===== */
  .kjjbn ul,
  .knbnbn ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; overflow: visible; }
  .kjjbn ul li,
  .knbnbn ul li {
    float: none; width: auto; margin: 0;
    display: flex; flex-direction: column; min-width: 0;
  }
  .kjjbn ul li > a,
  .knbnbn ul li > a {
    position: relative; display: block;
    width: 100%; aspect-ratio: 291 / 249; overflow: hidden;
    background: #fff; border: 1px solid #b5b8b6; box-sizing: border-box;
  }
  .kjjbn ul li > a img,
  .knbnbn ul li > a img {
    /* 竖长图（如 PBF 系列）会把卡片撑高，所以图片脱离文档流固定在图片框内，
       由 object-fit 负责缩放到框里，行高永远一致 */
    position: absolute; top: 0; left: 0; margin: auto;
    float: none; display: block;
    width: 100% !important; height: 100% !important;
    object-fit: contain; border: 0;
  }
  .kjjbn ul li p,
  .knbnbn ul li p {
    float: none; width: 100%; margin: 0; line-height: 34px; height: 34px;
    overflow: hidden; text-align: center;
  }

  /* 正文里从原站带过来的定宽图/表，避免撑破内容区 */
  .dudua ul { width: 100%; margin-left: 0; }
  .dudua ul li { width: 48%; }
  .oi_riggg img { max-width: 100%; height: auto; }
  .oi_riggg table, .xpyuee_lo table, .iyi_qq table { max-width: 100%; }

  /* 页脚：原站选择器是 .xifot .fotxgs .xxsgr（三个类），这里必须用同等及以上优先级才能覆盖 */
  .xifot .fotxgs { width: 96%; }
  .xifot .fotxgs .xxsgl { width: 20%; }
  .xifot .fotxgs .xxsgr { width: 78%; }

  /* 产品信息区：原站 .hi_r 固定 320px，右栏一变窄就会挤出去 */
  .fi_re .xpghe_v .e_vrig .ghi_2 .hi_l { width: 22%; }
  .fi_re .xpghe_v .e_vrig .ghi_2 .hi_r { width: 76%; }

  /* 首页产品展示区两栏 + 卡片 */
  .weggxqq .i_lefff { width: 23%; }
  .weggxqq .i_riggg { width: 75%; }
  .weggxqq .i_riggg ul li { width: 31%; margin: 0 1%; }
  .weggxqq .i_riggg ul li img { width: 100%; height: auto; }

  /* ===== 首页车间图墙 .xk_egg =====
     原站是 1200px 定宽 + 5 块绝对定位的拼图（cs1~cs5 各自写死 left/top/宽高）。
     容器一缩窄，百分比宽度和固定高度就不再匹配，五块互相错位、图片被拉扁。
     容器小于 1240 时直接改成等高网格，图片统一比例裁切。 */
  .xk_egg { height: auto; margin: 24px auto; overflow: visible; }
  .xk_egg ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .xk_egg ul li,
  .xk_egg ul .cs1, .xk_egg ul .cs2, .xk_egg ul .cs3,
  .xk_egg ul .cs4, .xk_egg ul .cs5 {
    position: static; left: auto; right: auto; top: auto; bottom: auto;
    width: auto; height: auto; float: none;
    box-sizing: border-box; aspect-ratio: 4 / 3; overflow: hidden;
  }
  .xk_egg ul .cs1 img, .xk_egg ul .cs2 img, .xk_egg ul .cs3 img,
  .xk_egg ul .cs4 img, .xk_egg ul .cs5 img {
    width: 100%; height: 100%; object-fit: cover; display: block;
  }
  /* 5 张图铺 3 列：让最后一张跨 2 列，用 8/3 的比例让它的高度贴近同行的 cs4（4/3），
     第二行正好填满。不能只写 align-self:stretch——li 高度 auto 时会被图片固有比例撑高。 */
  .xk_egg ul .cs5 { grid-column: span 2; aspect-ratio: 8 / 3; }

  /* 首页新闻区 */
  .rnksdxx .xigcc .cc_lef { width: 26%; margin-left: 18%; }
  .rnksdxx .xigcc .cc_lef img { width: 100%; height: auto; }
  .rnksdxx .xigcc .cc_rig { width: 51%; margin-right: 1%; }

  /* 四大优势区是 1200px 定宽 + 绝对定位的文字压在 1920 背景图上（数字 01-04 是图上画的），
     视口装不下 1200 时文字和背景数字会错位、互相压叠，所以 ≤1240 就改成竖向堆叠的普通列表。 */
  .gaooot { height: auto; background: #f5f8fc; padding: 26px 0 8px; }
  .gaooot .xkjt { width: 96%; height: auto; }
  .gaooot .xkjt .jtt_1,
  .gaooot .xkjt .jtt_2,
  .gaooot .xkjt .jtt_3,
  .gaooot .xkjt .jtt_4 {
    position: static;
    width: 100%;
    margin: 0 0 24px;
    padding: 0 14px;
  }
  .gaooot .xkjt .jtt_1 h2, .gaooot .xkjt .jtt_2 h2,
  .gaooot .xkjt .jtt_3 h2, .gaooot .xkjt .jtt_4 h2 { font-size: 20px; line-height: 30px; }
}
/* 更窄的窗口：左栏改为整行，避免挤压成一团 */
@media (max-width: 900px) {
  .lrggxqq .oi_lefff, .lrggxqq .oi_riggg { width: 100%; float: none; }
  .lrggxqq .oi_lefff { margin-bottom: 16px; }
  .knbnbn ul li { width: 46%; }
  .isiu .lomenu .ziit ul li { padding: 0 10px; height: 42px; line-height: 42px; }
  .isiu .lomenu .ziit ul li a { font-size: 12px; }
  .isiu .loit img { width: 104px; height: auto; }
}
/* 手机宽度：主图与参数改为上下堆叠；菜单改成一行横向排列（放不下时内部横向滚动，不再折行） */
@media (max-width: 640px) {
  /* 主图与参数上下堆叠。注意：≤1240px 块里 .fi_re .xpghe_v .show_pro 特异性 (0,3,0)
     压过朴素的 .xpghe_v > .show_pro (0,2,0)，这里必须带上同等及以上特异性，否则 48% 仍生效。 */
  .xpghe_v .show_pro, .fi_re .xpghe_v .show_pro,
  .xpghe_v .e_vrig, .fi_re .xpghe_v .e_vrig { flex: 0 0 100%; width: 100%; margin-left: 0; }
  /* 联系电话：25px 红色号码在窄栏里从中间折行（"86-318-" / "7538821"），缩小并不折行 */
  .fi_re .xpghe_v .e_vrig .ghi_3 { white-space: nowrap; }
  .fi_re .xpghe_v .e_vrig .ghi_3 b { font-size: 20px; }
  /* 产品描述：标签 22% + 正文 76% 在窄栏里标签会被挤成两行，改为上下堆叠 */
  .fi_re .xpghe_v .e_vrig .ghi_2 .hi_l,
  .fi_re .xpghe_v .e_vrig .ghi_2 .hi_r { float: none; width: 100%; }
  /* 窄屏菜单改为左起一行后会压到 logo（logo 高 89px、菜单原来 top:83px），把菜单挪到 logo 下面 */
  .isiu .lomenu { top: 110px; }
  .isiu .lomenu .ziit ul { float: none; text-align: center; white-space: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .isiu .lomenu .ziit ul::-webkit-scrollbar { height: 0; }
  .isiu .lomenu .ziit ul li { float: none; display: inline-block; padding: 0 9px; height: 40px; line-height: 40px; }
  /* Latest News：两列各 48% 在窄屏放不下"标题+日期"，改单列通栏。
     注意 .dudua ul li (0,2,1) 特异性高于 .ab_left/.ab_right (0,1,0)，float:none 能压过列类。 */
  .dudua ul li { width: 100%; float: none; }
}

/* 手机/窄屏（≤900px）：侧边栏通栏后 32% 的图标会过大，压回参考站原尺寸；
   触屏没有 hover，子分类改为手风琴：默认折叠，点条目右侧箭头展开，
   当前所在栏目由模板预置 checked 默认展开。首页产品区（weggxqq）左侧栏也通栏。 */
@media (max-width: 900px) {
  .weggxqq .i_lefff,
  .weggxqq .i_riggg { width: 100%; float: none; }
  .weggxqq .i_lefff { margin-bottom: 16px; }

  .lrggxqq .oi_lefff .oxlk_up ul li img,
  .weggxqq .i_lefff .xlk_up ul li img { width: 96px; height: 79px; }

  /* Hot News 列表：桌面定宽 240px，侧边栏通栏后改为自适应（保留省略号收尾） */
  .lrggxqq .oi_lefff .oxlk_up3 ul { width: auto; margin: 0 14px; float: none; }

  /* 同样只针对顶层栏目条；子菜单 li 不能继承 min-height:89px（每条会变成 90px 高） */
  .lrggxqq .oi_lefff .oxlk_up > ul > li,
  .weggxqq .i_lefff .xlk_up > ul > li { height: auto; min-height: 89px; }

  /* 手风琴开关：桌面隐藏，仅窄屏显示 */
  .sub-switch {
    display: block;
    position: absolute;
    right: 6px;
    top: 0;
    width: 54px;
    height: 100%;
    cursor: pointer;
    z-index: 3;
  }
  .sub-switch::after {
    content: '';
    position: absolute;
    right: 20px;
    top: 50%;
    width: 11px;
    height: 11px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: translateY(-70%) rotate(-45deg);
  }
  .sub-toggle:checked ~ .sub-switch::after { transform: translateY(-30%) rotate(45deg); }

  /* 窄屏取消 hover 展开，改由复选框控制 */
  .lrggxqq .oi_lefff .oxlk_up ul li:hover ul,
  .weggxqq .i_lefff .xlk_up ul li:hover ul { display: none; }

  .lrggxqq .oi_lefff .oxlk_up ul li > ul,
  .weggxqq .i_lefff .xlk_up ul li > ul {
    display: none;
    position: static;
    width: 100%;
    padding: 2px 0 6px;
  }
  .lrggxqq .oi_lefff .oxlk_up ul li > .sub-toggle:checked ~ ul,
  .weggxqq .i_lefff .xlk_up ul li > .sub-toggle:checked ~ ul { display: block; }

  /* 展开中的条目保持高亮蓝（:has 不支持的浏览器退化为无高亮） */
  .lrggxqq .oi_lefff .oxlk_up ul li:has(> .sub-toggle:checked),
  .weggxqq .i_lefff .xlk_up ul li:has(> .sub-toggle:checked) { background: #1f6bc1; }

  .lrggxqq .oi_lefff .oxlk_up ul li ul li,
  .weggxqq .i_lefff .xlk_up ul li ul li {
    line-height: 38px;
    text-align: left;
    padding-left: 128px;
    border-bottom: 1px dashed #6792cf;
    /* css.css 里子菜单 li 是 width:100% + float:left，这里又加了 128px 左内边距，
       box-sizing 默认 content-box 会让总宽 = 100% + 128px，向右侧溢出侧边栏 128px
       （虚线分隔线会画出界）。改为 border-box 让 100% 含内边距。 */
    box-sizing: border-box;
  }
  /* 子菜单链接占满整行，整行可点；display:flex/限宽只属于顶层条目规则，不波及这里 */
  .lrggxqq .oi_lefff .oxlk_up ul li ul li a,
  .weggxqq .i_lefff .xlk_up ul li ul li a { display: block; }

  /* 四大优势区已在 ≤1240px 改成竖向堆叠（见上面的块），这里不再重复 */
}

/* 手机宽度（≤640px）：首页产品卡片两列，图片文字更清楚 */
@media (max-width: 640px) {
  .weggxqq .i_riggg ul li { width: 46%; margin: 0 2% 12px; }
  .weggxqq .i_riggg ul li p { font-size: 13px; line-height: 20px; }
}

/* ===== 四大优势（01-04）：字体与排版按原站还原 =====
   原站 css.css 是 h2 18px/30px #1f6bc1、p 14px/24px #555 + margin-top:5px，
   文案用 "and" 的整句式标题（单行放得下）。之前这两处被改成 24px/36px 与
   30px 行高，标题在 466px 宽的列里折成两行，把 03/04 的数字和圆形工厂图压住。
   这里按原站数值还原，块位置也取原站的（jtt_1 473px、jtt_2 484px）。
   窄屏（≤1240px）仍走上面的竖向堆叠布局，不受影响。 */
@media (min-width: 1241px) {
  .gaooot .xkjt .jtt_1 { top: 108px; left: 81px; width: 473px; }
  .gaooot .xkjt .jtt_2 { top: 244px; left: 88px; width: 484px; }
  .gaooot .xkjt .jtt_3 { bottom: 307px; right: 40px; width: 466px; }
  .gaooot .xkjt .jtt_4 { bottom: 190px; right: 40px; width: 466px; }
  .gaooot .xkjt .jtt_1 h2,
  .gaooot .xkjt .jtt_2 h2,
  .gaooot .xkjt .jtt_3 h2,
  .gaooot .xkjt .jtt_4 h2 {
    font-size: 18px;
    line-height: 30px;
    color: #1f6bc1;
    font-weight: 700;
  }
  .gaooot .xkjt .jtt_1 p,
  .gaooot .xkjt .jtt_2 p,
  .gaooot .xkjt .jtt_3 p,
  .gaooot .xkjt .jtt_4 p {
    font-size: 14px;
    line-height: 24px;
    color: #555;
    margin-top: 5px;
  }
}

/* 全站已改用原站的 Arial（css.css 里 body 字体），这里不再需要单独指定；
   保留 letter-spacing:0 以防其它地方再引入字距，标题 473px 列宽刚好单行。 */
.gaooot .xkjt .jtt_1 h2, .gaooot .xkjt .jtt_2 h2,
.gaooot .xkjt .jtt_3 h2, .gaooot .xkjt .jtt_4 h2,
.gaooot .xkjt .jtt_1 p, .gaooot .xkjt .jtt_2 p,
.gaooot .xkjt .jtt_3 p, .gaooot .xkjt .jtt_4 p {
  letter-spacing: 0;
}

/* ===== 手机端（≤767px）整体重排 =====
   原模板是按 1200px 画布画的：一堆 width:1200px 容器 + position:absolute 定坐标，
   再配 html{overflow-x:hidden}，手机上宽内容被直接裁掉（看不见也滑不动），所以"乱"。
   这里在手机宽度下把这些固定坐标改成流式布局。
   实测问题（390px 视口）：.sna_di 定宽 653px 左移 -271px → ABOUT US 正文被切掉大半；
   .rnksdxx 高 554 装 1043 内容 → NEWS 被裁一半；.xifot 高 158 装 232 内容 → 页脚被裁；
   .jtt_x 是 content-box + padding 14px → 四大优势正文右溢出 6px 被裁；
   导航 452px 塞进 374px → CONTACT 跑到屏外（内部横向滚动，用户看不出来）。
   ---- */
@media (max-width: 767px) {
  html { overflow-x: hidden; }
  body { font-size: 13px; -webkit-text-size-adjust: 100%; }
  img { max-width: 100%; height: auto; }

  /* ---- 顶部：52px 蓝色紧凑栏（汉堡居左 / logo+公司名居中 / 语言旗居右），导航默认收起 ---- */
  .main_visual { display: flex; flex-direction: column; height: auto !important; min-height: 0 !important; }
  .isiu {
    order: -1; position: fixed; left: 0; right: 0; top: 0; z-index: 5000;
    width: 100%; height: 52px; background: #1f6bc1; box-shadow: 0 1px 6px rgba(0, 0, 0, .18);
  }
  /* 头部改 fixed 后脱离文档流，用内边距把 banner 让出来，否则首屏被顶栏压住 */
  body { padding-top: 52px; }
  .main_image { height: 46vw !important; min-height: 0 !important; }
  .main_image ul, .main_image li,
  .main_visual .main_image li span, .main_visual .main_image li a { height: 100%; background-size: cover; background-position: center center; }
  body:not([data-page-type="home"]) .main_image { height: 34vw !important; min-height: 0 !important; }

  .mnav-btn {
    display: block; position: absolute; left: 8px; top: 13px; z-index: 30;
    width: 36px; height: 26px; padding: 0 5px; border: 0; background: none; cursor: pointer;
  }
  .mnav-btn span { display: block; height: 3px; margin: 4px 0; background: #fff; border-radius: 2px; }

  /* 语言切换挪到右侧，只留小旗，不再占一整行 */
  .isiu .sxit { position: absolute; right: 8px; top: 15px; width: auto; z-index: 30; }
  .isiu .sxit ul li { margin: 0 0 0 4px; }
  .isiu .sxit ul li img { display: block; width: 20px; height: auto; }

  /* logo + 公司名（白字）居中；名字过长省略，不换行 */
  .isiu .loit {
    position: absolute; left: 52px; right: 62px; top: 0; height: 52px;
    width: auto; margin: 0; display: flex; align-items: center; justify-content: center;
    gap: 7px; overflow: hidden;
  }
  /* <a> 也要 flex，否则 block 的 img 会把 logo 和公司名挤成上下两行 */
  .isiu .loit a { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; min-width: 0; }
  .isiu .loit img { display: block; flex: 0 0 auto; height: 34px; width: auto; }
  .isiu .loit .loit-name {
    display: block; color: #fff; font-size: 14px; font-weight: bold; letter-spacing: .3px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* 导航默认收起；.nav-open 时从栏底弹出竖排列表（fixed 盖在内容上，不把页面顶下去） */
  .isiu .lomenu { display: none; margin-top: 0; background: #1f6bc1; }
  .isiu.nav-open .lomenu {
    display: block; position: fixed; top: 52px; left: 0; width: 100%; z-index: 4999;
    max-height: calc(100vh - 102px); overflow-y: auto; -webkit-overflow-scrolling: touch;
    box-shadow: 0 6px 10px rgba(0, 0, 0, .18);
  }
  .isiu .lomenu .ziit { width: 100%; }
  .isiu .lomenu .ziit ul { float: none; display: block; padding: 0; white-space: normal; overflow: visible; }
  .isiu .lomenu .ziit ul li {
    float: none; display: block; padding: 0; height: 44px; line-height: 44px;
    border-top: 1px solid rgba(255, 255, 255, .18); text-align: center;
  }
  .isiu .lomenu .ziit ul li:first-child { border-top: 0; }
  .isiu .lomenu .ziit ul li a { display: block; font-size: 15px; color: #fff; }

  /* banner 圆点：随缩窄的 banner 居中收窄，留出离底距离 */
  .main_visual .flicking_con { bottom: 8px; width: 200px; margin-left: -100px; }

  /* ---- 通栏装饰条：原来 6.35vw 在手机上只有 25px，蓝条文字看不清 ---- */
  .gadxx  { height: 8vw;  min-height: 30px; background-size: 100% 100%; }
  .gadxxt { height: 12vw; min-height: 48px; background-size: 100% 100%; }

  /* ---- 四大优势：去掉绝对定位，改成竖排白色卡片 ---- */
  .gaooot { height: auto; background: #f4f7fb; padding: 12px 0; }
  .gaooot .xkjt { width: 96%; height: auto; }
  .gaooot .xkjt .jtt_1, .gaooot .xkjt .jtt_2,
  .gaooot .xkjt .jtt_3, .gaooot .xkjt .jtt_4 {
    position: static; top: auto; left: auto; right: auto; bottom: auto;
    width: 100%; padding: 10px 12px; margin: 0 0 8px;
    background: #fff; border-left: 3px solid #1f6bc1; box-sizing: border-box;
  }
  .gaooot .xkjt .jtt_1 h2, .gaooot .xkjt .jtt_2 h2,
  .gaooot .xkjt .jtt_3 h2, .gaooot .xkjt .jtt_4 h2 { font-size: 17px; line-height: 26px; }
  .gaooot .xkjt .jtt_1 p, .gaooot .xkjt .jtt_2 p,
  .gaooot .xkjt .jtt_3 p, .gaooot .xkjt .jtt_4 p { font-size: 13px; line-height: 22px; }

  /* ---- 栏目标题 ---- */
  .xian { width: 96%; margin: 14px auto; }
  .xian p { font-size: 15px; }

  /* ---- 首页产品区：左栏分类与右栏产品上下排，产品两列 ---- */
  .weggxqq { width: 96%; margin: 14px auto; }
  .weggxqq .i_lefff { width: 100%; float: none; margin-bottom: 12px; overflow: hidden; }
  .weggxqq .i_lefff .xlk_up, .weggxqq .i_lefff .xlk_dw { float: none; width: 100%; }
  .weggxqq .i_lefff .xlk_up ul li { line-height: 54px; }
  .weggxqq .i_lefff .xlk_up ul li img { width: 42px; height: auto; margin: 5px 8px; }
  .weggxqq .i_lefff .xlk_up ul li a { font-size: 15px; margin-left: 6px; }
  /* 二级菜单原为绝对定位浮在右侧，手机上改成在卡片内部展开（由 .sub-switch 手风琴控制，
     展开态样式见 ≤900px 块的 .sub-toggle:checked ~ ul） */
  .weggxqq .i_lefff .xlk_up ul li > ul { position: static; width: 100%; left: auto; top: auto; padding: 0 0 6px 52px; box-sizing: border-box; }
  .weggxqq .i_lefff .xlk_dw { height: auto; background-size: 100% 100%; padding-bottom: 8px; }
  .weggxqq .i_riggg { width: 100%; float: none; }
  .weggxqq .i_riggg ul li { width: 48%; margin: 0 1% 8px; }
  .weggxqq .i_riggg ul li img { width: 100%; height: auto; }
  .weggxqq .i_riggg ul li p { line-height: 30px; }

  /* ---- 首页 ABOUT US + 资质证书：.sna_di 原为定宽 653px，手机上左移 -271px ---- */
  .ryadxx { height: auto; background-size: cover; padding-bottom: 14px; }
  .ryadxx .xiiuu { margin-top: 0; height: auto; background: none; }
  .ryadxx .xiiuu .uu_san { width: 96%; height: auto; }
  .ryadxx .xiiuu .uu_san .sna_di { width: 100%; height: auto; float: none; }
  .ryadxx .xiiuu .uu_san .sna_di .xk_sup p { font-size: 13px; line-height: 24px; }
  .ryadxx .ju_ggg { width: 96%; height: auto; margin-top: 14px; }
  .ryadxx .ju_ggg ul li { width: 48%; margin: 0 1% 8px; }
  .ryadxx .ju_ggg ul li img { width: 100%; height: auto; }

  /* ---- 首页 NEWS：原为左右两栏 + 固定高度，手机上内容被裁掉一半 ---- */
  .rnksdxx { height: auto; background-size: cover; padding-bottom: 14px; }
  .rnksdxx .ttj_ggg { width: 96%; margin: 12px auto 8px; line-height: 34px; font-size: 17px; }
  .rnksdxx .xigcc { width: 96%; height: auto; margin-top: 0; }
  .rnksdxx .xigcc .cc_lef { width: 100%; margin-left: 0; float: none; height: auto; }
  .rnksdxx .xigcc .cc_lef img { width: 100%; height: auto; }
  .rnksdxx .xigcc .cc_rig { width: 100%; float: none; margin-right: 0; }
  .rnksdxx .xigcc .cc_rig ul li { line-height: 38px; }
  .rnksdxx .xigcc .cc_rig ul li a { font-size: 13px; max-width: 72%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .rnksdxx .xigcc .cc_rig ul li span { font-size: 12px; }

  /* ---- 页脚：原固定高 158px 装 232px 内容，且左右两栏挤压 ---- */
  .xifot { height: auto; }
  .xifot .fotxgs { width: 96%; height: auto; padding: 12px 0; }
  .xifot .fotxgs .xxsgl { float: none; width: 100%; height: auto; }
  .xifot .fotxgs .xxsgl img { margin-top: 0; width: 118px; }
  .xifot .fotxgs .xxsgr { float: none; width: 100%; padding-top: 8px; }
  .xifot .fotxgs .xxsgr p { font-size: 12px; line-height: 22px; }

  /* ---- 列表页（产品中心 / 新闻 / 资质）：左栏通栏 + 列表两列 ---- */
  .lrggxqq { width: 96%; margin: 14px auto; }
  .lrggxqq .oi_lefff { width: 100%; float: none; margin-bottom: 12px; overflow: hidden; }
  .lrggxqq .oi_lefff .oxlk_up, .lrggxqq .oi_lefff .oxlk_up2, .lrggxqq .oi_lefff .oxlk_up3,
  .lrggxqq .oi_lefff .oxlk_up4, .lrggxqq .oi_lefff .oxlk_up5, .lrggxqq .oi_lefff .oxlk_up6 { float: none; width: 100%; }
  .lrggxqq .oi_lefff .oxlk_up ul li { line-height: 54px; }
  .lrggxqq .oi_lefff .oxlk_up ul li img { width: 42px; height: auto; margin: 5px 8px; }
  .lrggxqq .oi_lefff .oxlk_up ul li a { font-size: 15px; margin-left: 6px; }
  .lrggxqq .oi_lefff .oxlk_up ul li > ul { position: static; width: 100%; left: auto; top: auto; padding: 0 0 6px 52px; box-sizing: border-box; }
  .lrggxqq .oi_lefff .oxlk_up ul li ul li { padding-left: 0; }
  .lrggxqq .oi_lefff .oxlk_up2,
  .lrggxqq .oi_lefff .oxlk_up4 { line-height: 44px; font-size: 16px; margin-top: 8px; }
  .lrggxqq .oi_lefff .oxlk_up5 a { padding: 7px 12px; margin: 4px; font-size: 12px; }
  .lrggxqq .oi_lefff .oxlk_up6 p { font-size: 12px; line-height: 24px; }
  .lrggxqq .oi_lefff .oxlk_up3 ul { width: 92%; margin-left: 4%; }
  .lrggxqq .oi_riggg { width: 100%; float: none; }
  /* 列表页卡片：两列等高网格（父级 display:grid 由 ≤1240 块给出，这里只改列数） */
  .kjjbn ul, .knbnbn ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .kjjbn ul li, .knbnbn ul li { width: auto; margin: 0; }
  .kjjbn ul li p, .knbnbn ul li p { line-height: 30px; height: 30px; font-size: 12px; }

  /* 首页车间图墙：手机两列，最后一张（cs5 竖图）通栏 */
  .xk_egg ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .xk_egg ul li, .xk_egg ul .cs1, .xk_egg ul .cs2,
  .xk_egg ul .cs3, .xk_egg ul .cs4, .xk_egg ul .cs5 { aspect-ratio: 1 / 1; }
  .xk_egg ul .cs5 { grid-column: 1 / -1; aspect-ratio: 21 / 10; }

  /* ---- 详情页 ---- */
  .xpghe_v { display: block; }
  .xpghe_v > .show_pro, .xpghe_v > .e_vrig,
  .fi_re .xpghe_v .e_vrig { width: 100%; flex: none; float: none; margin: 0 0 12px; }
  #preview { width: 100%; }
  .jqzoom { width: 100%; height: auto; }
  .jqzoom img { width: 100%; height: auto; }
  #spec-n5 { width: 100%; height: auto; }
  #spec-left, #spec-right { width: 22px; height: 44px; margin-top: 12px; }
  #spec-left img, #spec-right img { width: 22px; height: 44px; }
  #spec-list { width: calc(100% - 60px); }
  #spec-list ul li { width: 33.3%; }
  #spec-list ul li img { width: 90%; height: auto; }
  .fi_re .xpghe_v .e_vrig .ghi_2 .hi_l { float: none; width: 100%; }
  .fi_re .xpghe_v .e_vrig .ghi_2 .hi_r { float: none; width: 100%; }
  .xpyuee_lo { width: 100%; margin-left: 0; }
  .iyi_qq { width: 96%; }
  .dudua ul { width: 100%; margin-left: 0; }
  .dudua ul li { width: 100%; float: none; }
  /* 正文里从原站带过来的长 URL 不断行，会把内容区撑破 */
  .xpyuee_lo, .iyi_qq, .oi_riggg, .dudua { word-break: break-word; overflow-wrap: anywhere; }
  .xpyuee_lo img, .iyi_qq img { display: block; max-width: 100%; height: auto; margin: 6px 0; }
  .oi_riggg img { max-width: 100%; height: auto; }
  .oi_riggg table, .xpyuee_lo table, .iyi_qq table { max-width: 100%; }
  .detail-title { font-size: 18px; line-height: 28px; }
}

/* 超窄屏（≤360px）：卡片改单列 */
@media (max-width: 360px) {
  .weggxqq .i_riggg ul li,
  .ryadxx .ju_ggg ul li { width: 98%; margin: 0 1% 8px; }
  .kjjbn ul, .knbnbn ul { grid-template-columns: 1fr; gap: 8px; }
  .kjjbn ul li, .knbnbn ul li { width: auto; margin: 0; }
}

/* ===== 手机端补丁：清浮动 + 顶部视觉微调 =====
   ① 原站所有列表都是 li float:left，窄屏把它们改成 float:none 后父级 ul 不再是 BFC，
      ul 高度塌成 0 → 后面的块（产品区客服电话块、页脚等）会爬到列表上面被盖住，
      只在卡片 6px 的间隙里露出背景。用 flow-root + clear 兜住。
   ② banner 在 390px 宽下 46vw 只有 179px，横图竖屏 cover 后只剩一条虚化天空；
     加高到 58vw 能露出更多主体，视觉中心下移到 45%。 */
@media (max-width: 767px) {
  .weggxqq .i_lefff .xlk_up ul,
  .weggxqq .i_lefff .xlk_up,
  .lrggxqq .oi_lefff .oxlk_up ul,
  .lrggxqq .oi_lefff .oxlk_up,
  .lrggxqq .oi_lefff .oxlk_up5,
  .ryadxx .ju_ggg ul,
  .ryadxx .xiiuu,
  .rnksdxx .xigcc,
  .xifot .fotxgs { display: flow-root; }

  .weggxqq .i_lefff .xlk_up ul::after,
  .lrggxqq .oi_lefff .oxlk_up ul::after,
  .lrggxqq .oi_lefff .oxlk_up5::after,
  .ryadxx .ju_ggg ul::after,
  .rnksdxx .xigcc::after,
  .xifot .fotxgs::after { content: ""; display: block; clear: both; height: 0; visibility: hidden; }

  /* 分类卡片：原为 img float + a float，窄屏下 a 的可用宽度被挤掉会折成两行。
     改成 flex 单行：图标定宽、标题可压缩、右侧留出 44px 给手风琴箭头。 */
  .weggxqq .i_lefff .xlk_up > ul > li {
    float: none; display: flex; flex-wrap: wrap; align-items: center;
    line-height: 1.35; height: auto; min-height: 58px;
    padding-right: 44px; box-sizing: border-box;
  }
  .weggxqq .i_lefff .xlk_up > ul > li img { float: none; flex: 0 0 42px; width: 42px; height: auto; margin: 8px 10px 8px 0; }
  .weggxqq .i_lefff .xlk_up > ul > li > a {
    float: none; display: block; flex: 1 1 auto; min-width: 0; margin-left: 0;
    /* 桌面版的 max-width:120px / height:89px 是为了让长分类名不压到右侧箭头，
       手机上这条会把 "Agricultural Machinery" 挤成两行，必须解掉 */
    max-width: none; height: auto;
    font-size: 15px; line-height: 1.35;
  }
  /* 展开的二级菜单独占一行 */
  .weggxqq .i_lefff .xlk_up > ul > li > ul { flex: 0 0 100%; margin: 0 0 4px; }
  /* 列表页（产品中心 / 新闻 / 资质）左栏分类条结构与首页相同，同样改成 flex 单行。
     这里必须用 oxlk_up：只改 xlk_up 的话列表页标题仍会被 max-width:120px 挤成两行。 */
  .lrggxqq .oi_lefff .oxlk_up > ul > li {
    float: none; display: flex; flex-wrap: wrap; align-items: center;
    line-height: 1.35; height: auto; min-height: 58px;
    padding-right: 44px; box-sizing: border-box;
  }
  .lrggxqq .oi_lefff .oxlk_up > ul > li img { float: none; flex: 0 0 42px; width: 42px; height: auto; margin: 8px 10px 8px 0; }
  .lrggxqq .oi_lefff .oxlk_up > ul > li > a {
    float: none; display: block; flex: 1 1 auto; min-width: 0; margin-left: 0;
    max-width: none; height: auto;
    font-size: 15px; line-height: 1.35;
  }
  .lrggxqq .oi_lefff .oxlk_up > ul > li > ul { flex: 0 0 100%; margin: 0 0 4px; }

  /* 客服电话块：背景图按元素宽度铺满，不再按原始尺寸溢出 */
  .weggxqq .i_lefff .xlk_dw { background-size: 100% 100%; }
  .weggxqq .i_lefff .xlk_dw h2 { padding: 12px 10px 0; line-height: 24px; }
  .weggxqq .i_lefff .xlk_dw p { font-size: 17px; line-height: 26px; }

  /* banner：加高并让图片按容器裁切铺满。
     模板给每张幻灯片写的是内联 style="background:url(...) center top no-repeat"，
     这是简写，会把 background-size 重置成 auto（原图 1920×739 原尺寸，窄屏只露中间一条虚化天空）。
     CSS 覆盖不了内联，只有 !important 能压过它。 */
  .main_image { height: 58vw !important; }
  body:not([data-page-type="home"]) .main_image { height: 40vw !important; }
  .main_visual .main_image li span,
  .main_visual .main_image li a {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
  }
}

/* ===== 平板竖屏（768~900px）补丁 =====
   这一档走的是桌面布局，但有两处硬伤：
   ① .lomenu 是 absolute top:83px，logo 块（top:18 + 高 92）到 110px，导航直接压住"惠隆液压"字样；
   ② banner 的内联 background 简写让 background-size 停在 auto（原图 1920 宽），
      容器 768 时只露中间一条，"HUILONG HYDRAULIC" 和电话被裁掉右半。 */
@media (min-width: 768px) and (max-width: 900px) {
  .isiu .lomenu { top: 110px; }
  .main_visual .main_image li span,
  .main_visual .main_image li a {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
  }
}

/* ===== 手机端 v2（20261103a）：汉堡折叠导航 + 底部工具条 + 内页只留内容 =====
   参考 lishengyaoye：顶栏一个汉堡按钮，导航默认收起、点了才展开；
   底部固定「Home / Call / Contact」；内页手机端只显示栏目/详情内容本身。
   桌面默认隐藏这两块，靠下面的媒体查询只在 ≤767px 打开。 */
.mnav-btn, .mbar { display: none; }
@media (min-width: 768px) { .isiu .loit .loit-name { display: none; } }

@media (max-width: 767px) {
  /* 这里必须再声明一次 display：文件末尾的 .mnav-btn{display:none} 用于桌面隐藏，
     同特异性且顺序在后，会把上面手机段的 display:block 盖掉 */
  .mnav-btn {
    display: block; position: absolute; left: 8px; top: 13px; z-index: 30;
    width: 36px; height: 26px; padding: 0 5px; border: 0; background: none; cursor: pointer;
  }
  .mnav-btn span { display: block; height: 3px; margin: 4px 0; background: #fff; border-radius: 2px; }

  /* ---- 底部固定工具条：三格平分，图标 + 文字 ---- */
  .mbar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
    background: #1f6bc1; box-shadow: 0 -1px 6px rgba(0, 0, 0, .18);
  }
  .mbar a {
    flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 5px;
    height: 50px; color: #fff; font-size: 14px; text-decoration: none;
  }
  .mbar a + a { border-left: 1px solid rgba(255, 255, 255, .18); }
  .mbar a svg { width: 17px; height: 17px; flex: 0 0 auto; }
  .mbar a:active { background: #185a9f; }
  body { padding-bottom: 50px; }  /* 给固定条留高度，别盖住页脚 */

  /* ---- 内页精简：只留栏目 / 详情内容本身 ----
     栏目页：标题 + 列表 + 分页；详情页：标题 + 正文（产品另有图/参数/介绍）。
     左栏（产品分类/热点新闻/热搜关键词/联系我们）、面包屑一并隐藏。 */
  .lrggxqq .oi_lefff { display: none; }
  .lrggxqq .lklltr { display: none; }
  .lrggxqq .mob-extra { display: none; }   /* 相关产品 / 推荐产品 / 最新动态 / 相关新闻（模板里包了 .mob-extra） */
  .lrggxqq .detail-nav { display: none; }  /* 上一篇 / 下一篇 */
}

/* ==================== SEO 结构补充（2026-11-05） ==================== */
/* 1. 栏目标题由 div 改为 h1：css.css 给 h1-h6 统一 font-weight:700，这里还原原视觉（常规字重）。
   改动的模板：product-list / gallery-list / news-list / pc-list / page-detail / pc-detail 的 .lklltl */
h1.lklltl { font-weight: 400; }

/* 2. 首页视觉隐藏 H1（clip 方式，读屏可读、不占版面） */
.seo-h1 {
  position: absolute; width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden; white-space: nowrap;
}