/* 德和科技 · 英文站手机端适配（www.chinafoamglass.com）
   与中文站同一套版面；全部规则在 @media(max-width:768px) 内，电脑端零影响
   首页 + 内页通用（内页 1.html / 2-2*.html / 3-*.html / 4-1-1.html）
   版本：v20261022d  引用：/en_mobile.css  */
/* =====================================================================
   德和科技 · 英文站（www.chinafoamglass.com）手机端适配样式
   与中文站 mobile_css.php 同一套版面（68px 头部 / 单列卡片 / 轮播重建）
   全部规则包裹在 @media (max-width:768px)，电脑端（>768px）零影响
   ===================================================================== */
@media (max-width: 768px) {

/* 0. 基础防溢出 */
html, body { max-width: 100%; overflow-x: hidden; }
.w80   { width: 92% !important; margin: 0 auto; float: none; }
.w80_2 { width: 94% !important; }
img    { max-width: 100%; height: auto; }
table  { max-width: 100%; }
.w80 .fr, .w80 .fl, .footer .fr, .footer .fl { float: none !important; }

/* 1. 顶部导航：68px 单行 —— 左 logo，右 CN + 汉堡；隐藏 PC 横向菜单与搜索框 */
.sp_header { height: 68px; }
.sp_logo { height: 68px; float: left; display: flex; align-items: center; }
.sp_logo a { display: flex; align-items: center; height: 68px; }
.sp_logo img { display: block; max-height: 58px; width: auto; vertical-align: middle; }
.sp_nav {
  width: 56px; height: 56px; margin-top: 6px; margin-right: 8px;
  float: right; position: relative; cursor: pointer;
  touch-action: manipulation; -webkit-tap-highlight-color: transparent;
}
.sp_nav span { width: 26px; height: 2px; left: 15px; }
.sp_nav span:nth-of-type(1) { top: 21px; }
.sp_nav span:nth-of-type(2) { top: 28px; }
.sp_nav span:nth-of-type(3) { top: 35px; }
.sp_nav_se span:nth-of-type(1) { top: 28px; }
.sp_nav_se span:nth-of-type(2) { width: 0; }
.sp_nav_se span:nth-of-type(3) { top: 28px; }
.sp_lanage { display: block !important; float: right; height: 68px; margin-right: 2px; }
.sp_lanage a {
  display: flex !important; align-items: center; justify-content: center;
  width: auto !important; height: 68px; line-height: 68px !important;
  padding: 0 8px; font-size: 14px !important; font-weight: bold;
  -webkit-tap-highlight-color: transparent;
}
.sp_lanage a, .sp_lanage a:link, .sp_lanage a:visited { color: #424242; }
.sp_lanage a:hover, .sp_lanage a:active { color: #c00; }
#nav { display: none !important; }
.sp_search { display: none !important; }

/* 抽屉菜单：单列全展开 */
/* PC 的 .sjj_nav 用 meunbg.png（厂区航拍）作背景，手机上菜单文字会压在照片上无法阅读，
   中文站手机端抽屉是纯白底，这里一并改为白底 */
.sjj_nav { top: -120%; height: calc(100% - 68px); z-index: 20; background: #fff !important; }
.nav_show { top: 68px; }
.sjj_nav ul li {
  width: 100% !important; float: none !important;
  height: auto !important; padding: 8px 6% !important;
  border-right: none !important; border-bottom: 1px dashed #e5e5e5;
  text-align: left; box-sizing: border-box;
}
.sjj_nav ul li > div { display: block; }
a.sjj_title { font-size: 16px; line-height: 36px; margin-bottom: 4px; }
a.sjj_b { font-size: 15px; line-height: 34px; }
.sjj_nav .sjj_bottom { margin: 16px 6% 30px; font-size: 14px; line-height: 28px; overflow-wrap: anywhere; word-break: break-word; }

/* 抽屉交互（仅在导航脚本生效时折叠，脚本失效则保持全展开） */
.dh_scrim { display: none; }
.dh_scrim.dh_on { display: block; position: fixed; left: 0; right: 0; top: 68px; bottom: 0; background: rgba(0, 0, 0, .28); z-index: 19; }
.sjj_nav.dh_js ul > li > div { display: none; }
.sjj_nav.dh_js ul > li.dh_open > div { display: block; }
a.sjj_title { display: block; position: relative; padding-right: 34px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
a.sjj_title::after {
  content: '+'; position: absolute; right: 2px; top: 0; width: 26px;
  text-align: center; font-size: 20px; font-weight: 700; line-height: 36px; color: #c9141e;
}
li.dh_open > a.sjj_title::after { content: '\2013'; }

/* 2. 横幅 */
.banner { margin-top: 68px; }

/* 3. 页脚：只保留 logo + 热线 / 邮箱 / 地址，居中（与中文站一致） */
.footer {
  height: auto !important; padding: 24px 0 10px;
  background-size: cover !important; background-position: center top !important;
}
.footermain_r { display: none !important; }
.footermain_l { width: 100% !important; text-align: center; }
.footer_logo { margin-bottom: 14px !important; }
.footer_logo img { max-height: 42px; width: auto; }
.footer_p1 { font-size: 14px; line-height: 24px; }
.footer_p2 { font-size: 18px; line-height: 30px; margin-bottom: 6px; }
.footer_p3 { font-size: 13px; line-height: 28px; }
.footer_bottom { font-size: 12px; line-height: 20px; padding: 10px 0; text-align: center; }

/* =====================================================================
   以下为首页专属：.index_A/.index_B/.index_C/.index_D 只在首页存在
   ===================================================================== */

/* 4. 公司简介：圆形企业照在上，GROUP PROFILE + 标题居中，正文居中，MORE
   说明：croup.png 即「GROUP PROFILE」标题图；indexa.png 是圆形企业照（原 .indexA_l） */
.index_A { height: auto !important; padding: 24px 0 26px; background-size: cover; background-position: center; }
.indexa_main { padding-top: 0 !important; display: flex; flex-direction: column; align-items: center; }
.indexA_r { display: contents; }
.indexAr_l { display: none !important; }
.indexA_l { order: 1; display: block !important; width: auto !important; height: auto !important; float: none !important; }
.indexA_l img { width: 270px; max-width: 74%; height: auto; display: block; margin: 0 auto; }
.indexAr_r { order: 2; display: flex; flex-direction: column; align-items: center; width: 100% !important; float: none !important; }
.croup { order: 1; width: 100%; text-align: center; margin-top: 14px; }
.croup img { width: auto; max-width: 64%; height: auto; }
.red_title { order: 2; width: 100%; text-align: center; margin: 4px 0 0; font-size: 20px; line-height: 34px; }
/* 英文正文较长：PC 端 height:150px 会截断，手机端放开高度 */
.indexAr_text {
  order: 3; width: 100%; text-align: center; text-indent: 0 !important;
  height: auto !important; overflow: visible !important;
  margin: 10px 0 0; font-size: 14px; line-height: 26px; color: #444;
}
.more { order: 4; width: 100%; margin-top: 12px; }
.more a { font-size: 14px; }

/* 5. 全球地图：按原图比例铺满（英文地图烧进去的标语比中文长，
   用 cover 会被左右裁掉，改用 padding-top 撑出 1920:1050 的原比例 → 不裁不拉伸） */
.index_B {
  height: auto !important; padding: 24px 0 !important;
  background: none !important;
}
.index_B a {
  display: block !important; width: 100% !important; height: 0 !important;
  padding-top: 54.69% !important;   /* 1050 / 1920 */
  background: url(images/map.jpg) no-repeat center center;
  background-size: 100% 100%;
}

/* 6. 产品轮播：Revolution 在手机上文字只有约 5px，由 en_mobile.js 重建为
   「单屏卡片 + 左右红色箭头 + 圆点」轮播 */
.index_C { height: auto !important; padding: 24px 0; }
.dh_prods { position: relative; padding: 6px 6% 14px; background: #fff; }
.dh_slide { display: none; padding: 22px 0 6px; text-align: center; }
.dh_slide.dh_on { display: block; animation: dhFade .35s ease; }
@keyframes dhFade { from { opacity: 0; } to { opacity: 1; } }
.dh_prod_img img { width: 82%; max-width: 340px; }
.dh_prod_t { margin: 10px 0 8px; font-size: 20px; line-height: 30px; color: #c9141e; }
.dh_prod_d, .dh_prod_a { font-size: 13px; line-height: 24px; color: #555; text-align: left; }
.dh_prod_a span { font-weight: 700; color: #222; }
.dh_prod_btn {
  display: inline-block; margin-top: 14px; padding: 0 26px; height: 38px; line-height: 36px;
  border: 1px solid #2f74d0; color: #2f74d0; border-radius: 3px; font-size: 14px; text-decoration: none;
}
/* 左右箭头（产品区：红色小方块） */
.dh_prev, .dh_next {
  position: absolute; top: 34%; width: 26px; height: 44px; margin: 0;
  border: none; padding: 0; background: #c9141e; color: #fff;
  font-size: 24px; line-height: 40px; font-family: Arial, sans-serif;
  cursor: pointer; z-index: 2; border-radius: 2px; opacity: .88;
  -webkit-tap-highlight-color: transparent;
}
.dh_prev { left: 4px; }
.dh_next { right: 4px; }
.dh_prev:active, .dh_next:active { opacity: 1; }
/* 圆点指示 */
.dh_dots { text-align: center; padding: 12px 0 4px; }
.dh_dots span { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #ccc; margin: 0 4px; cursor: pointer; }
.dh_dots span.dh_on { background: #c9141e; }

/* 7. 应用领域：背景图（标题已烧在图里）+ 单个图标卡，左右切换轮播 */
.index_D { height: auto !important; padding: 12px 0 0 !important; }
.c-banner .banner ul, .c-banner .button { display: none !important; }
.c-banner .nexImg, .c-banner .preImg { display: none !important; }
.c-banner { height: 320px !important; padding: 0 !important; overflow: hidden; }
/* 固定 320px 高（cover 比例 320/790≈0.405），用 background-position 负 X 偏移把
   背景图里烧好的标题（1920 宽中 x≈356 起）拉到与内容同一条左边线（16px）：
   16 - 356×0.405 ≈ -128px */
.dh_field {
  position: relative; width: 100%; height: 320px; min-height: 0;
  background-size: cover; background-position: -128px center;
  display: flex; align-items: center; justify-content: center; padding: 0;
}
.dh_field .dh_fslide { display: none; width: 150px; }
.dh_field .dh_fslide.dh_on { display: block; animation: dhFade .35s ease; }
.dh_field .dh_fslide img { width: 100%; display: block; }
.dh_field .dh_prev, .dh_field .dh_next { top: 50%; margin-top: -22px; background: rgba(255, 255, 255, .28); }
.dh_field .dh_dots { position: absolute; left: 0; right: 0; bottom: 10px; padding: 0; }
.dh_field .dh_dots span { background: rgba(255, 255, 255, .55); }
.dh_field .dh_dots span.dh_on { background: #fff; }

/* 8. 招募代理浮窗（英文站独有：PC 端是右下角 260×260 固定浮窗）
   手机屏宽仅 390，浮窗会盖住三分之二版面；中文站版面无此浮窗，故手机端隐藏 */
.mail { display: none !important; }

/* =====================================================================
   以下为内页（1.html / 2-2*.html / 3-*.html / 4-1-1.html）
   版式参照中文站手机端；只重排英文站已有内容，不新增中文站有而英文站没有的模块
   ===================================================================== */

/* 9-10. 内页：横幅与面包屑 */
.banner img { display: block; width: 100% !important; height: auto !important; }
.current1 {
  width: 100% !important; max-width: 100% !important; margin: 0 !important;
  padding: 12px 2% 12px 30px !important; box-sizing: border-box;
  font-size: 14px; line-height: 24px; font-weight: 400;
  background-position: 2px center !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* 11. 单页正文（公司简介） */
.about_A { padding-top: 6px !important; padding-bottom: 18px !important; }
.title_a { font-size: 22px; line-height: 32px; margin-bottom: 10px; }
.about_A .p1, .about_A .p2,
.aboutBa_p1, .aboutBb_p1, .aboutBc_p { font-size: 15px; line-height: 27px; margin-bottom: 12px; }
.about_A p { overflow-wrap: break-word; }
.about_A img { display: block; margin: 12px auto; }

/* 12. 产品列表：标题 → 图片 → 加粗简介 → 介绍文字 → MORE+（单列卡片） */
.product_list li { padding: 14px 0 !important; margin: 0 !important; height: auto !important; }
.product_list li.productb { background: #f5f5f5; }
.product_list li > .w80 { display: flex; flex-direction: column; }
.product_l, .product_r {
  display: contents !important; float: none !important; width: auto !important; padding-top: 0 !important;
}
.product_list li .productl_t { order: 1; font-size: 22px; line-height: 32px; }
.product_list li .productl_img { order: 2; margin: 8px auto 12px; text-align: center; }
.product_list li .productl_img img { width: 60%; max-width: 240px; height: auto; }
.product_list li .productr_text1 {
  order: 3; height: auto !important; overflow: visible !important;
  padding-bottom: 10px !important; margin-bottom: 10px !important;
  font-size: 15px; line-height: 25px;
}
.product_list li .productr_text2 {
  order: 4; height: auto !important; overflow: visible !important;
  margin-bottom: 14px !important; font-size: 14px; line-height: 24px;
}
.product_list li a.button03 { order: 5; box-sizing: border-box; width: 100% !important; margin-bottom: 0 !important; }
.product_list li .clear { display: none !important; }

/* 13. 应用领域：标签两栏 + 条目 标题 → 图片 → 描述 → More+（右对齐） */
.caseT_list { display: flex; margin-bottom: 20px; }
.caseT_list li { width: auto !important; flex: 1 1 0 !important; float: none !important; }
.caseT_list li a {
  font-size: 14px; padding: 0 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box;
}
.application_list li { display: flex !important; flex-direction: column !important; }
.application_list li .application_r {
  display: contents; float: none !important; width: auto !important;
}
.application_list li .application_l {
  order: 1; float: none !important; width: 100% !important; margin: 0 0 12px !important;
}
.application_list li .application_l img { width: 100% !important; height: auto; display: block; }
.application_list li .applicationr_t {
  order: 0; height: auto !important; overflow: visible !important;
  white-space: normal !important; text-overflow: clip !important;
  font-size: 18px; line-height: 28px;
  padding-bottom: 10px !important; margin-bottom: 12px !important;
}
.application_list li .applicationr_text {
  order: 2; height: auto !important; overflow: visible !important;
  font-size: 14px; line-height: 25px; margin-bottom: 14px !important;
}
.application_list li a.button04 { order: 3; margin-left: auto !important; margin-right: 0 !important; }
.application_list li > .clear { display: none !important; }

/* 14. 工程案例：一行两个卡片，标题最多两行 */
.case_list li {
  width: 46% !important; height: auto !important;
  margin: 0 2% 14px !important; box-sizing: border-box;
}
.caselist_img { height: auto !important; overflow: hidden !important; }
.caselist_img img {
  display: block; width: 100% !important;
  aspect-ratio: 4 / 3; object-fit: cover;
}
.caselist_p {
  width: 100% !important; height: auto !important; min-height: 40px;
  padding: 8px 4px !important; box-sizing: border-box;
  font-size: 12px; line-height: 20px; text-align: center;
  white-space: normal !important; text-overflow: clip !important;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden !important;
}

/* 15. 合作伙伴：一行三个 */
.partner_list li { width: 30% !important; margin: 0 1.5% 12px !important; box-sizing: border-box; }
.partner_list li img { width: 100% !important; height: auto !important; }
/* 卡片是浮动布局，父级高度会塌陷（电脑端靠固定高度兜住，手机端高度自动后footer会压住最后一行） */
.case_list::after, .partner_list::after { content: ''; display: block; clear: both; }

/* 16. 联系页：地址 / 电话 / 地图单列（原 li 是 50%、25% 浮动，手机上会挤压换行） */
.contact { padding-bottom: 24px !important; background-size: cover !important; }
.list04_en_add {
  font-size: 14px !important; line-height: 26px !important;
  padding: 10px 0 !important; border-bottom: 1px solid #eee;
}
.list04 li, .list04_en li {
  width: 100% !important; float: none !important;
  font-size: 14px !important; line-height: 44px !important;
}
.list07 { margin-bottom: 16px !important; }
.list07 li {
  width: 100% !important; float: none !important;
  font-size: 14px !important; line-height: 24px !important;
  padding: 8px 0 !important; word-break: break-word;
}
.map { width: 100% !important; height: 280px !important; margin-top: 18px !important; }
.map .BMap_cpyCtrl, .map .anchorBL { display: none !important; }

/* 17. 产品详情页（2-2xx_*.html）：标题 → 图片 → 正文 → 参数表（单列） */
.product_box { display: flex; flex-direction: column; }
.product_box_r { display: contents; float: none !important; width: auto !important; }
.product_box_l { order: 2; float: none !important; width: 100% !important; margin: 0 0 14px !important; }
.product_box_l img { width: 100% !important; height: auto; display: block; }
.productboxr_t { order: 1; font-size: 20px; line-height: 30px; margin-bottom: 12px; }
.productboxr_text { order: 3; font-size: 14px; line-height: 25px; margin-bottom: 24px; }
.productboxr_text p { margin-bottom: 10px; }
.product_main { padding-bottom: 16px !important; }
.productm_t { font-size: 18px; line-height: 32px; margin-bottom: 6px; }
/* 参数表：电脑端 16px 四列，手机上按中文站做法整表缩到 11px 完整显示（不横向滚动） */
.p_table01 { width: 100% !important; font-size: 11px !important; }
.p_table01 td, .p_table01 th { padding: 7px 2px !important; line-height: 16px !important; word-break: break-word; }

/* 18. 应用详情页（3-1-1-a~d.html）：标题 → 标签 → 配图 → 表格 → 下方导航 */
.applicat_r, .applicat_l { width: 100% !important; float: none !important; }
.applicatr_title { font-size: 20px; line-height: 30px; margin-bottom: 12px; }
/* PC 的标签栏是绝对定位 + 面板下移 100px（min-height:500px），手机上会互相压住并留出大片空白 */
#tab .tab_menu {
  position: static !important; display: flex !important; flex-wrap: wrap;
  width: 100% !important; float: none !important; margin-bottom: 4px;
}
#tab .tab_menu li {
  float: none !important; width: auto !important; flex: 1 1 30%; min-width: 30%;
  height: auto !important; min-height: 44px; margin: 0 3px 5px 0 !important;
  padding: 6px 3px !important; box-sizing: border-box;
  font-size: 12px !important; line-height: 16px !important;
  display: flex; align-items: center; justify-content: center; text-align: center;
}
#tab .tab_box {
  position: static !important; top: 0 !important;
  min-height: 0 !important; padding-bottom: 0 !important;
}
#tab .tab_box img { width: 100% !important; max-width: 100%; height: auto; display: block; margin: 0 auto; }
.appw_box { margin-bottom: 0 !important; }
.appwl, .appwr { width: 100% !important; float: none !important; }
.applicatl_list { margin-top: 14px !important; }
.applicatl_list li { height: auto !important; line-height: 40px !important; }
.applicatl_list li a { padding-left: 4% !important; }

/* 19. 内页防溢出兜底 */
.current1, .title_a, .productr_text1, .productr_text2, .applicationr_t,
.applicationr_text, .list04_en_add, .list07 li,
.productboxr_t, .productboxr_text, .applicatr_title { overflow-wrap: break-word; }

/* 20. 首页兜底防溢出 */
.indexAr_r, .indexA_l, .footermain_l, .footermain_r { max-width: 100%; min-width: 0; word-break: break-word; }
.indexAr_text { overflow-wrap: anywhere; }

}
