﻿@charset "utf-8";

/* ==============================================
   全站移动端通用基础样式（所有页面共用）
   ============================================== */

/* 1. 全局移动端通用重置（≤1299px） */
@media (max-width: 1299px) {
    html, body {
        width: 100% ;
        overflow-x: hidden ;
        margin: 0 ;
        padding: 0 ;
    }
    body {
        font-size: 14px ;
        background: #F9F9F9 ;
        max-width: 100vw ;
    }
    * {
        box-sizing: border-box ;
        margin: 0 ;
        padding: 0 ;
        max-width: 100% ;
    }
    a {
        text-decoration: none ;
        color: inherit ;
    }
    ul, li {
        list-style: none ;
    }
    .visually-hidden {
        display: none ;
    }
    .clear {
        clear: both ;
    }

    /* 全站通用隐藏规则（移动端） */
    .huaxu-client-wrapper,
    .yh-trust-footer.huaxu-client-inner,
    .yh-client-tagline,
    .yh-client-logos.huaxu-client-logos,
    .content-list-wrapper,
    .content-list-container,
    .content-grid,
    .content-card,
    .card-title,
    .content-list,
    .article-top-img,
    .article-img,
    .article-top-title,
    .article-top-desc,
    #nav_all, 
    #nav-onhoo, 
    .text, 
    .textwz,
    #box1, .box1, .thumbnailwrapper2,
    .footer-links,
    .foot_ba,
    .yb_conct {
        display: none ;
        visibility: hidden ;
        height: 0 ;
        width: 0 ;
        overflow: hidden ;
        position: absolute ;
        top: -9999px ;
        left: -9999px ;
    }

/* 全站header移动端通用适配（适配logo居左、微信二维码居右，二者高度一致） */
#hd {
    height: auto ;
    background: #F9F9F9 ;
    padding: 10px 0 ;
    width: 100% ;
    max-width: 100vw ;
    overflow: visible ;
    position: relative ;
}
#header {
    width: 100% ;
    height: auto ;
    padding: 0 15px ; /* 避免元素贴边，提升美观度 */
    position: relative ;
    max-width: 100vw ;
    background: #F9F9F9 ;
    overflow: visible ;
    box-sizing: border-box ;
    display: flex ;
    justify-content: space-between ; /* 核心：logo居左、二维码居右 */
    align-items: center ; /* 核心：二者垂直居中，高度保持一致 */
}
.logo {
    width: 80vw ;
    max-width: 320px ;
    height: auto ;
    top: auto ;
    left: auto ;
    transform: none ;
    position: relative ;
    background: transparent ;
    margin: 10px 0 ;
    padding: 0 ;
    overflow: visible ;
    min-height: 80px ;
    display: flex ;
    align-items: center ; /* 确保logo自身垂直居中，与二维码高度匹配 */
}
.logo a {
    width: 100% ;
    height: 100% ;
    min-height: 80px ;
    padding: 10px 0 ;
    background-size: contain ;
    background-repeat: no-repeat ;
    background-position: center center ;
    display: block ;
    box-sizing: border-box ;
    line-height: 1 ;
    background-color: transparent ;
}
/* 二维码适配（与logo高度一致，居右显示） */
.header-qrcode {
    position: static ; /* 取消绝对定位，适配flex布局 */
    display: flex ;
    flex-direction: column ;
    align-items: center ;
    justify-content: center ;
    height: 80px ; /* 与logo min-height一致，保证高度统一 */
    margin: 10px 0 ; /* 与logo margin一致，布局对称 */
}
.header-qrcode img {
    width: 60px ;
    height: 60px ; /* 同步你提供的二维码尺寸 */
    display: block ;
}
.qrcode-text {
    display: none ; /* 核心：隐藏"+微信"文字，不占用布局空间 */
}

    /* 全站footer移动端通用适配 */
    #foot {
        width: 100% ;
        margin-top: 0px ;
        max-width: 100vw ;
        background: #000 ;
        padding-bottom: 0 ;
    }
    #foot_980 {
        width: 100% ;
        height: auto ;
        padding: 10px 15px ;
        max-width: 100vw ;
        display: flex ;
        flex-direction: column ;
        align-items: center ;
        gap: 5px ;
    }

/* ===================== 底部按钮 - 移动端样式 ===================== */
.foot-btn ul {
    list-style: none;
    padding: 0 15px; /* 移动端左右留白 */
    margin: 0 auto; /* 水平居中核心 */
    display: flex;
    justify-content: center; /* 按钮组内部居中 */
    flex-wrap: wrap; /* 核心：允许按钮换行 */
    box-sizing: border-box;
    gap: 10px; /* 按钮之间的间距（行内+换行后都生效） */
    max-width: 100%;
}

/* 控制每个按钮占比，实现两个一排 */
.foot-btn li {
    width: calc(50% - 5px); /* 50%宽度 - 一半的gap间距，避免换行 */
    box-sizing: border-box;
}

.foot-btn a.foot-btn {
    /* 移动端视觉+尺寸样式（对齐PC端配色） */
    padding: 0 8px;
    font-size: 14px;
    font-weight: 600; /* 字体加粗（和PC端一致） */
    margin: 0;
    width: 100%; /* 按钮占满li的宽度 */
    height: 32px;
    text-decoration: none;
    color: #fff; /* 文字白色（和PC端一致） */
    border-radius: 2px; /* 圆角（和PC端一致） */
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #007Fdd; /* 背景色（和PC端一致） */
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 移动端悬浮/点击响应效果（和PC端一致） */
.foot-btn a.foot-btn:hover,
.foot-btn a.foot-btn:active {
    background: #005fa8;
    color: #fff;
}

    .footer-main {
        width: 100% ;
        display: flex ;
        flex-direction: column ;
        align-items: center ;
        gap: 5px ;
        padding: 0 ;
        margin: 0 ;
    }
    .footer-wechat {
        text-align: center ;
        margin: 0 ;
        padding: 0 ;
        width: 100% ;
    }
    .wechat-title {
        color: #ffffff ;
        margin: 0 0 8px 0 ;
        font-size: 14px ;
        padding: 0 ;
    }
    .wechat-img {
        width: 80px ;
        height: auto ;
        margin: 0 auto ;
        display: block ;
    }
    .footer-contact {
        text-align: center ;
        width: 100% ;
        margin: 0 ;
        padding: 0 ;
        color: #fff ;
    }
    .contact-phone {
        margin: 0 0 8px 0 ;
        font-size: 14px ;
        line-height: 1.2 ;
        color: #ff0 ;
    }
    .contact-address {
        margin: 0 0 8px 0 ;
        font-size: 12px ;
        line-height: 1.2 ;
        color: #fff ;
    }
    .contact-map {
    display: none !important; /* 强制隐藏，覆盖原有 display 样式 */
    /* 兜底：即使 display 失效，也通过其他属性隐藏 */
    visibility: hidden;
    height: 0;
    width: 0;
    margin: 0;
    padding: 0;
    }
    .map-img {
        width: 80px ;
        height: auto ;
    }
    .company-name {
        margin: 5px 0 0 0 ;
        font-size: 12px ;
        line-height: 1 ;
        color: #fff ;
    }
    .company-name a {
        color: #fff ;
        text-decoration: none ;
    }

    /* 全站通用容器适配 */
    #hotall {
        width: 100% ;
        padding: 0 15px ;
        margin: 0 ;
        max-width: 100vw ;
    }
    .hot_all_footer.container {
        padding: 10px ;
        max-width: 100vw ;
    }

/* 底部四列导航 - 移动端 彻底消白底空隙版 */
.foot-container {
  background: #d8d8d8;
  padding: 20px 0;
  border-top: 1px solid #aaa;
  margin: 0 0 0 0 !important; /* 上/下全清外边距，杜绝白底 */
}
.foot-wrapper {
  max-width: 92%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  font-size: 12px;
  color: #333;
}
.foot-group {
  width: 24%;
  margin-bottom: 6px;
  text-align: left;
}
.foot-group h3 {
  font-size: 15px;
  font-weight: bold;
  margin: 0 0 6px 0;
  color: #333;
  text-align: left;
}
.foot-group ul {
  list-style: none;
  padding: 0;
  margin: 6px 0 0 0;
}
.foot-group li {
  margin: 3px 0;
  text-align: left;
}
.foot-group a {
  color: #333;
  text-decoration: none;
}

}



/* 手机端：只显示2个带图，第3个图隐藏 → 完美2列 */
@media (max-width:768px) {
  .video-case-module2 .case-grid .case-item:nth-child(3) img {
    display: none !important;
  }
}
/* ==============================================
   小屏手机（≤480px）全站通用适配
   ============================================== */
@media (max-width: 480px) {
    /* 全站logo小屏适配 */
    .logo {
        min-height: 60px ;
    }
    .logo a {
        min-height: 60px ;
        padding: 8px 0 ;
    }

    /* 全站footer小屏适配 */
    .wechat-img {
        width: 70px ;
    }
    .contact-phone {
        font-size: 13px ;
    }
    .contact-address {
        font-size: 11px ;
    }
    .map-img {
        width: 70px ;
    }
    .company-name {
        font-size: 11px ;
    }
}

/* ==============================================
   兜底（≥1300px）全站通用样式还原
   ============================================== */
@media (min-width: 1300px) {
    /* 全站通用隐藏元素还原 */
    #box1, .box1, .thumbnailwrapper2,
    .huaxu-client-wrapper,
    .yh-trust-footer.huaxu-client-inner,
    .yh-client-tagline,
    .yh-client-logos.huaxu-client-logos,
    .content-list-wrapper,
    .content-list-container,
    .content-grid,
    .content-card {
        display: block ;
        visibility: visible ;
        height: auto ;
        width: auto ;
        overflow: visible ;
        position: static ;
        top: auto ;
        left: auto ;
    }

    /* 全站logo PC端还原 */
    /* 全站logo PC端还原 - 修正为原始尺寸 */
    .logo {
        width: 300px !important;   /* 改回300px */
        height: 60px !important;   /* 改回60px */
        min-height: auto ;
        top: 15px;                  /* 恢复原始定位 */
        position: absolute;         /* 恢复绝对定位 */
    }
    .logo a {
        min-height: auto ;
        padding: 0 ;
        height: 60px !important;    /* 改回60px */
        width: 300px !important;
        background: #A00000 url(/sites/images/logot.png) !important;
        background-size: auto !important;  /* 不要缩放 */
    }
}

/* ==============================================
   全局兜底样式（所有设备共用）
   ============================================== */
* {
    margin: 0 ;
    padding: 0 ;
    box-sizing: border-box ;
}
html {
    width: 100% ;
    overflow-x: hidden ;
}
body {
    position: relative ;
    width: 100% ;
    overflow-x: hidden ;
}