/* ======================================================
   mobile.css — 移动端响应式适配 (max-width: 768px)
   ====================================================== */

/* ---------- 基础重置 ---------- */
@media (max-width: 768px) {
    /* 注意：不覆盖 html font-size——JS 动态缩放系统继续按比例工作。
       所有移动端样式统一使用 px 单位来保证可读尺寸。 */
}

/* ---------- 容器 & 页面基础 ---------- */
@media (max-width: 768px) {
    /* 解除桌面端最小宽度限制 */
    body {
        min-width: auto !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .container,
    .container02 {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }

    /* 清除桌面浮动 */
    .fl {
        float: none !important;
    }
}

/* ======================================================
   头部 & 导航 (移动端汉堡菜单)
   ====================================================== */
@media (max-width: 768px) {
    .header {
        height: 60px !important;
        position: fixed !important;
        background: #fff !important;
        box-shadow: 0 2px 10px rgba(0,0,0,0.08) !important;
        z-index: 1000 !important;
    }
    .header .logo {
        padding-top: 10px !important;
        float: left !important;
    }
    .header .logo a img {
        height: 40px !important;
        max-width: 160px !important;
    }

    /* 显示汉堡菜单按钮 */
    .header .header-right .menu {
        display: block !important;
        float: right !important;
        margin-right: 10px !important;
        line-height: 60px !important;
    }
    .header .header-right .menu .navPhoneBtn {
        display: inline-block !important;
        padding: 20px 10px !important;
        cursor: pointer;
    }
    .header .header-right .menu .navPhoneBtn span {
        display: block !important;
        width: 24px !important;
        height: 2px !important;
        background: #194297 !important;
        margin: 5px 0 !important;
        border-radius: 2px;
        transition: 0.3s;
    }

    /* 隐藏桌面导航项（移动端用覆盖层取代） */
    .header .header-right .nav {
        display: none !important;
    }

    /* 移动端导航覆盖层（点击汉堡按钮后显示） */
    .header .header-right .nav.mobile-active {
        display: block !important;
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: rgba(255,255,255,0.98) !important;
        z-index: 999 !important;
        overflow-y: auto !important;
        padding: 20px 0 !important;
        float: none !important;
        margin: 0 !important;
    }
    .header .header-right .nav.mobile-active ul {
        display: block !important;
    }
    .header .header-right .nav.mobile-active ul li {
        display: block !important;
        float: none !important;
        margin: 0 !important;
        border-bottom: 1px solid #e8e8e8 !important;
    }
    .header .header-right .nav.mobile-active ul li a {
        display: block !important;
        line-height: 48px !important;
        font-size: 16px !important;
        color: #333 !important;
        padding: 0 20px !important;
        text-align: left !important;
        font-weight: normal !important;
    }
    .header .header-right .nav.mobile-active ul li a:after {
        display: none !important;
    }
    .header .header-right .nav.mobile-active ul li.active a {
        color: #155599 !important;
        font-weight: bold !important;
    }

    /* 子导航 - 移动端展示为下拉展开 */
    .header .header-right .nav.mobile-active .subnav {
        position: relative !important;
        display: block !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        background: #f5f5f5 !important;
        box-shadow: none !important;
        padding: 10px 0 !important;
    }
    .header .header-right .nav.mobile-active .subnav .container {
        width: 100% !important;
        padding: 0 !important;
    }
    .header .header-right .nav.mobile-active .subnav .text {
        width: 100% !important;
        padding: 0 20px !important;
    }
    .header .header-right .nav.mobile-active .subnav .text .bt a {
        font-size: 15px !important;
        line-height: 40px !important;
        color: #155599 !important;
    }
    .header .header-right .nav.mobile-active .subnav .text .jsh p {
        font-size: 13px !important;
        line-height: 1.6 !important;
        color: #666 !important;
    }
    .header .header-right .nav.mobile-active .subnav .text .list a {
        display: inline-block !important;
        line-height: 36px !important;
        font-size: 14px !important;
        color: #555 !important;
        padding: 0 12px !important;
        margin: 3px 5px 3px 0 !important;
        background: #e8eef5 !important;
        border-radius: 4px !important;
    }
    .header .header-right .nav.mobile-active .subnav .pic,
    .header .header-right .nav.mobile-active .subnav .download {
        display: none !important;
    }

    /* 语言切换器 - 移动端移动到导航内 */
    .header .header-right .lan {
        float: none !important;
        clear: both !important;
        display: none !important;
    }
    .header .header-right .lan.mobile-show {
        display: block !important;
        padding: 15px 20px !important;
    }
    .header .header-right .lan.mobile-show ul {
        position: relative !important;
        display: block !important;
        top: auto !important;
        left: auto !important;
        width: auto !important;
        margin: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }
    .header .header-right .lan.mobile-show ul li {
        display: inline-block !important;
        margin-right: 10px !important;
    }
    .header .header-right .lan.mobile-show ul li a {
        font-size: 13px !important;
        color: #555 !important;
        padding: 4px 10px !important;
        border: 1px solid #ccc !important;
        border-radius: 4px !important;
    }

    /* 搜索 - 移动端重新定位 */
    .header .header-right .header-search {
        float: right !important;
        margin-right: 5px !important;
    }
    .header .header-right .header-search .search {
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        right: 0 !important;
    }
    .header .header-right .header-search .search .search-main {
        width: 100% !important;
        border-radius: 0 !important;
    }
    .header .header-right .header-search .search .search-main input.form-control {
        height: 44px !important;
        font-size: 14px !important;
    }
}

/* ======================================================
   Banner 区域
   ====================================================== */
@media (max-width: 768px) {
    .inbanner {
        min-height: auto !important;
        margin-top: 60px !important;
    }
    .inbanner img {
        min-height: 180px !important;
        object-fit: cover !important;
    }
    .inbanner .banner-hover {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 90% !important;
    }
    .inbanner .banner-hover h1 {
        font-size: clamp(22px, 5vw, 32px) !important;
        line-height: 1.3 !important;
    }
    .inbanner .banner-hover p {
        font-size: clamp(13px, 3vw, 16px) !important;
    }
    .inbanner .banner-hover .bt {
        font-size: clamp(22px, 5vw, 32px) !important;
        line-height: 1.3 !important;
    }
    .inbanner .banner-hover1 {
        width: 90% !important;
    }
    .inbanner .banner-hover1 h1 {
        font-size: clamp(18px, 4.5vw, 28px) !important;
    }

    /* 首页全屏横幅 */
    .cbanner {
        margin-top: 60px !important;
    }
    .cbanner .swiper-slide .text {
        width: 90% !important;
        padding: 20px !important;
    }
    .cbanner .swiper-slide .text .bt {
        font-size: clamp(20px, 5vw, 32px) !important;
    }
    .cbanner .swiper-slide .text .desc {
        font-size: clamp(13px, 3vw, 15px) !important;
    }
}

/* ======================================================
   产品列表
   ====================================================== */
@media (max-width: 768px) {
    .product-list {
        padding: 40px 0 !important;
    }
    .product-list ul {
        margin: 0 -8px !important;
    }
    .product-list li {
        width: 50% !important;
        padding: 0 8px !important;
        margin-bottom: 16px !important;
    }
    .product-list li .pl-info {
        padding: 10px 10px 15px !important;
    }
    .product-list li .pl-info .tit {
        font-size: 14px !important;
        line-height: 1.3 !important;
        white-space: normal !important;
    }
    .product-list li .pl-info .info {
        font-size: 12px !important;
        line-height: 1.4 !important;
        -webkit-line-clamp: 2 !important;
    }
    .product-list li .pl-img img {
        width: 100% !important;
        height: auto !important;
    }

    .product-bottom .item .item-bottom .list ul li {
        width: 50% !important;
        padding: 5px !important;
    }

    .product-bottom .item .item-bottom {
        padding: 20px 0 !important;
    }
}

/* ======================================================
   新闻列表
   ====================================================== */
@media (max-width: 768px) {
    .newslist li,
    .newslist1 li {
        width: 100% !important;
        float: none !important;
        padding: 0 0 20px 0 !important;
    }
    .newslist li .text {
        padding: 10px 0 !important;
    }
    .newslist li .text .bt {
        font-size: 15px !important;
        line-height: 1.4 !important;
    }
    .newslist li .text .date {
        font-size: 12px !important;
    }
    .newslist li .pic {
        width: 100% !important;
        padding: 0 !important;
    }
    .newslist li .pic img {
        width: 100% !important;
        height: auto !important;
    }

    /* 首页新闻模块 */
    .home-news .home-top {
        padding: 0 15px !important;
    }
    .home-news .home-top .nlist ul li {
        font-size: 13px !important;
        padding: 0 8px !important;
    }
    .home-news .home-bottom .show .info1 {
        padding: 15px !important;
    }
    .home-news .home-bottom .show .info1 .bt {
        font-size: 16px !important;
    }
    .home-news .home-bottom .show .info1 .text {
        font-size: 13px !important;
        line-height: 1.6 !important;
    }

    /* 搜索页(新闻列表) */
    .search .newslist1 li .pic {
        width: 30% !important;
    }
    .search .newslist1 li .text {
        width: 65% !important;
    }
}

/* ======================================================
   页面内容
   ====================================================== */
@media (max-width: 768px) {
    /* 编辑区内容 */
    .inmain {
        padding: 30px 0 !important;
    }
    .content {
        padding: 30px 0 !important;
    }
    .content p,
    .content div,
    .content span {
        font-size: clamp(14px, 3.5vw, 16px) !important;
        line-height: 1.8 !important;
    }
    .content img {
        max-width: 100% !important;
        height: auto !important;
    }
    .content table {
        width: 100% !important;
        overflow-x: auto !important;
        display: block !important;
    }

    /* about 页面 */
    .about .box {
        padding: 20px 0 !important;
    }
    .about .box .text {
        width: 100% !important;
        padding: 0 15px !important;
    }
    .about .box .text .bt {
        font-size: 20px !important;
    }
    .about .box .text .info {
        font-size: 14px !important;
        line-height: 1.8 !important;
    }
    .about .box .pic {
        width: 100% !important;
        padding: 0 15px !important;
        margin-bottom: 15px !important;
    }
}

/* ======================================================
   联系页面 / 表单
   ====================================================== */
@media (max-width: 768px) {
    .contact .box .left,
    .contact .box .right {
        width: 100% !important;
        float: none !important;
        padding: 0 15px !important;
    }
    .contact .box .left {
        margin-bottom: 30px !important;
    }
    .contact .box .left .cont .list {
        font-size: 14px !important;
        line-height: 1.8 !important;
    }
    .contact .form-info input,
    .contact .form-info textarea,
    .contact .form-info select {
        width: 100% !important;
        font-size: 14px !important;
        box-sizing: border-box !important;
    }
    .contact .form-info .group {
        width: 100% !important;
        float: none !important;
        padding: 0 !important;
    }
    .contact .submit-btn input {
        width: 100% !important;
        height: 44px !important;
        font-size: 16px !important;
    }

    /* 供应商表单 */
    .supplier-form input,
    .supplier-form textarea,
    .supplier-form select {
        width: 100% !important;
        font-size: 14px !important;
        box-sizing: border-box !important;
    }
    .supplier-form .group2 {
        width: 100% !important;
        float: none !important;
    }
}

/* ======================================================
   底部
   ====================================================== */
@media (max-width: 768px) {
    .footer {
        padding: 0 15px !important;
    }
    .footer-list1 .footer-top {
        padding: 30px 0 15px !important;
        text-align: center !important;
    }
    .footer-list1 .footer-top .h3 {
        float: none !important;
        width: 100% !important;
        margin-bottom: 10px !important;
    }
    .footer-list1 .footer-top .h3 img {
        width: 120px !important;
        height: auto !important;
    }
    .footer-list1 .footer-top .input {
        float: none !important;
        width: 100% !important;
        font-size: 13px !important;
    }

    .footer-center {
        padding: 20px 0 30px !important;
    }
    .footer-center .footer-left {
        float: none !important;
        width: 100% !important;
        margin-bottom: 20px !important;
    }
    .footer-center .footer-left .flist {
        font-size: 13px !important;
        line-height: 1.8 !important;
    }
    .footer-center .footer-list {
        float: none !important;
        width: 100% !important;
    }
    .footer-center .footer-list ul li {
        width: 50% !important;
        float: left !important;
        margin-bottom: 15px !important;
    }
    .footer-center .footer-list ul li a {
        font-size: 14px !important;
        line-height: 1.8 !important;
    }
    .footer-center .footer-list ul li ul li {
        width: 100% !important;
        float: none !important;
    }
    .footer-center .footer-list ul li ul li a {
        font-size: 13px !important;
        line-height: 1.6 !important;
    }
    .footer-center .footer-list .list {
        clear: both !important;
        text-align: center !important;
        padding-top: 15px !important;
    }
    .footer-center .footer-list .list img {
        max-width: 100px !important;
        height: auto !important;
    }

    .footer-bottom {
        padding: 15px 0 !important;
        text-align: center !important;
    }
    .footer-bottom .top-btn {
        float: none !important;
        margin-top: 10px !important;
    }
    .footer-bottom .b {
        font-size: 12px !important;
        line-height: 1.6 !important;
    }
}

/* ======================================================
   站点地图
   ====================================================== */
@media (max-width: 768px) {
    .sitemap ul li {
        padding-bottom: 15px !important;
        margin-bottom: 15px !important;
    }
    .sitemap ul li .top {
        font-size: 16px !important;
    }
    .sitemap ul li .bot a {
        float: none !important;
        display: inline-block !important;
        font-size: 14px !important;
        margin: 3px 10px 3px 0 !important;
    }
}

/* ======================================================
   通用组件
   ====================================================== */
@media (max-width: 768px) {
    /* 标题区域 */
    .in-bt {
        font-size: clamp(20px, 4.5vw, 28px) !important;
        padding: 15px 0 !important;
    }
    .in-bt span {
        font-size: clamp(20px, 4.5vw, 28px) !important;
    }
    .tit-style {
        font-size: clamp(24px, 5vw, 32px) !important;
    }
    .desc1 {
        font-size: clamp(13px, 3vw, 15px) !important;
    }

    /* 分页 */
    .page {
        padding: 20px 0 !important;
    }
    .page a,
    .page span {
        font-size: 13px !important;
        padding: 6px 12px !important;
        margin: 0 2px !important;
    }

    /* 面包屑 */
    .bread {
        font-size: 13px !important;
        padding: 10px 15px !important;
    }
    .bread a {
        font-size: 13px !important;
    }

    /* Swiper 首页 Banner */
    .home-banner .swiper-slide {
        height: 50vw !important;
        min-height: 280px !important;
    }
    .home-banner .swiper-slide .info {
        width: 90% !important;
        left: 5% !important;
    }
    .home-banner .swiper-slide .info .bt {
        font-size: clamp(20px, 5vw, 30px) !important;
    }
    .home-banner .swiper-slide .info .text {
        font-size: clamp(13px, 3vw, 15px) !important;
    }

    /* 合作伙伴 */
    .partner-list li {
        width: 50% !important;
        padding: 10px !important;
    }

    /* 首页各模块间距 */
    .home-product {
        padding: 40px 0 !important;
    }
    .home-about {
        padding: 40px 0 !important;
    }
    .home-partner {
        padding: 40px 0 !important;
    }
    .home-news {
        padding: 40px 0 !important;
    }

    /* 复选框和隐私按钮 */
    .privacy-check label {
        font-size: 12px !important;
    }
    .transparent {
        z-index: 998 !important;
    }
}

/* ======================================================
   iPhone 小屏适配 (max-width: 375px)
   ====================================================== */
@media (max-width: 375px) {
    .product-list li {
        width: 100% !important;
    }
    .footer-center .footer-list ul li {
        width: 100% !important;
    }
    .partner-list li {
        width: 100% !important;
    }
}

/* ======================================================
   平板适配 (768px - 1024px)
   ====================================================== */
@media (min-width: 769px) and (max-width: 1024px) {
    body {
        min-width: auto !important;
        overflow-x: hidden !important;
    }
    .container,
    .container02 {
        width: 100% !important;
        padding: 0 20px !important;
        box-sizing: border-box !important;
    }
    .product-list li {
        width: 33.33% !important;
    }
    .footer-center .footer-left {
        width: 35% !important;
    }
    .footer-center .footer-list {
        width: 60% !important;
    }
}
