@media screen and (max-width: 768px) {
    
    .banner img{
        width: 100%;
        height: 100%;
        object-position: left;
    }
    /* 公司介绍 */
    .main1{
        height: 181.3333vw;
        width: 100%;
        flex-direction: column;
        align-items: center;
                justify-content: flex-start;
        padding: 0 2.6667vw;
        gap: 0;
    }
    .about-text{
        width: 100%;
        height: auto;
        margin-top: 0;
    }
    .about-title{
        margin-top: 0;
    }
    .about-title .en {
        font-size: 8vw;
        margin-bottom: 8.6667vw;
        margin-top: 8.6667vw;
    }
    
    .about-title .zh {
        font-size: 6vw;
        top: 14.6667vw;
    }
    .about-desc{
        font-size: 4vw;
        line-height: 8vw;
        margin-bottom: 10.6667vw;
    }
    .about-more{
        width: 29.6667vw;
        padding: 2.1333vw 6vw;
        font-size: 2.9333vw;
        border-radius: 6.6667vw;
        border: #0074b0 0.0133vw solid;
        margin: 0 auto;
        display: block;
    }

    .about-image {
        width: 100%;
        height: 56vw;
        margin-top: 10vw;
        border-radius: 0 6.6667vw 0 6.6667vw;
    }

    /* ==============核心定位业务布局=============== */
    .content-box{
        display: none;
    }
    .page-title-ch h1 {
        font-size: 6vw;
        top: 9.3333vw;
    }
    .page-title {
        /* 10.6667vw → 16vw：按用户要求，标题距下方图片再加 40px(=5.3333vw)
           → 6.5vw：英文那一行现在占掉 0.8vw(margin-top) + 8.7206vw(行盒 6.6vw×1.3213) ≈ 9.52vw，
           等量从下边距里收掉，标题→图片的总高与加英文前一致（≈192px），图片不会往下跑。
           英文每次上下挪动，这里都同步反向加减同样的量（4.5 → 5.8333 → 7.3 → 6.5），
           保证下面的图片一动不动（中文标题是绝对定位，本来也不受英文影响） */
        margin-bottom: 6.5vw;
        height: auto;
    }
    .page-title-en h1 {
        /* 照抄公司简介 .about-title .en 的效果。
           字号没照抄它的 8vw：英文文案用同一字体(msyhbd)实测，
           8vw(60px) 时宽 777px，比 750 的视口还宽，会把页面撑出横向滚动条；
           按设计稿反推（英文墨迹高 38px）字号 = 6.57vw，这里取 6.6vw = 49.5px，墨迹高 38px 对得上 */
        font-size: 6.6vw;
        /* "CORE BUSINESS SECTORS" 6.6vw 实测宽 650px，而 .container 的 max-width 是 83.3333vw = 625px，
           不禁止折行就会被折成 "CORE BUSINESS" / "SECTORS" 两行（设计稿是一行）。
           容器左边缘 62.5px + 650 = 712.5px，仍在 750 视口内，溢出这 25px 不会出横向滚动条 */
        white-space: nowrap;
        color: #d9edf9;
        /* 行盒紧跟在 .page-title 的 padding-top(4.0863vw=30.6px) 下面。
           原 2.8vw(20.6px) → 1.4667vw(11px) → 0 → 0.8vw(6px)：按用户要求先两次各上移 ≈10px，
           这次再下移 6px。
           现在英文墨迹顶端 = 30.6 + 6 + 13.8(字身框顶到字母墨迹顶的距离 0.2787em×49.5px) ≈ 50px */
        margin-top: 0.8vw;
    }
    .swiper2{
        height: 93.3333vw;
        padding: 0 2.6667vw;
        overflow: hidden;
        display: block;
    }
    .swiper2 .swiper-slide{
        position: relative;
        background-color: #0074b0;
        height: 80vw;
    }
    .swiper2 .swiper-slide img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 16%;
    }
    .swiper2 .swiper-slide .s2_img{
        position: absolute;
        top: 0;
        flex-direction: column;
        display: flex;
        background: linear-gradient(to right, rgba(18, 82, 152, 0.85) 0%, rgba(10, 50, 100, 0.5) 50%, rgba(10, 50, 100, 0.1) 100%);
        height: 100%;
        width: 100%;
        padding: 14.2667vw 4vw;
        align-items: flex-start;
    }
    .s2_h2{
        font-size: 4.8vw;
        color: #ffffff;
        font-weight: bold;
    }
    .s2_t2{
        font-size: 3.2vw;
        line-height: 6.4vw;
        color: #ffffff;
        margin: 7.3333vw 0 16vw;
        text-align: left;
    }
    .s2_c2{
        font-size: 2.1333vw;
        width: 23.3333vw;
        border: #93bde4 0.1333vw solid;
        border-radius: 6.6667vw;
        padding: 2vw 5.3333vw;
        color: #ffffff;
        /* 原位置基础上再往上 30px(=4vw) */
        margin-top: -4vw;
    }
    .s2_title{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        font-size: 4vw;
        color: #ffffff;
        background-color: #2862a1;
        height: 13.3333vw;
    }
    .s2-left{
        background-color: rgba(255,255,255,0.5);
        width: 4.6667vw;
        height: 9.3333vw;
        border-radius: 20%;
        position: relative;
        left: 3.3333vw;
        /* 自然位置在 .swiper2 底部之下(93.3333vw)，提到蓝条(80~93.3333vw)垂直居中处 = 82vw */
        top: -11.3333vw;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 99;
    }
    .s2-right{
        background-color: rgba(255,255,255,0.5);
        width: 4.6667vw;
        height: 9.3333vw;
        border-radius: 20%;
        position: relative;
        left: 92vw;
        /* 排在 .s2-left 之后，自然位置再多一个自身高度 9.3333vw */
        top: -20.6667vw;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 99;
    }
        .s2-right img{
            width: 50%;
            height: 40%;
        }
        .s2-left img{
            width: 50%;
            height: 40%;
        }


    /* ===============核心产品=============== */
    .main3{
        width: 100%;
        height: 140.6667vw;
        
        position: relative;
    }
    .main-container {
        height: 96vw;
        width: 100%;
        background-repeat: no-repeat;    /* 禁止平铺 */
    background-size: cover;          /* 铺满盒子，超出裁剪 */
    background-position: 65%;     
        
    }
    .products-wrapper{
        display: none;
    }
    .en-title {
        font-size: 8vw;
        margin-top: 13.3333vw;
    }
    .cn-title{
        font-size: 6vw;
        top: -4.0vw;
    }
    /* ========轮播========= */
    .swiper3-mobile{
        width: 94.6667vw;
        display: block;
        
        overflow: hidden;
        margin: 0 auto;
        position: relative;
        top: -56.9999vw;
        /* 原 0.20833vw 0.20833vw 2.625vw：右下偏移。设计稿阴影只压在卡片下沿，负 spread 收掉两侧 */
        box-shadow: 0 0.5333vw 2.625vw -0.8vw rgba(0, 0, 0, 0.12);
    }
    .swiper3-mobile img{
        display: block;
        width: 100%;
        /* 原来是 height:100%，但父级 .swiper-slide 高度是 auto，100% 无参照值 = auto，
           图片就按原始比例撑开，卡片高度失控。设计稿：图片高 430(=57.3333vw) */
        height: 57.3333vw;
        object-fit: cover;
    }
    .product-info {
        /* 原 38.6667vw。卡片总高 94.6667vw = 图片 57.3333vw + 信息区 37.3333vw */
        height: 37.3333vw;
        background-color: rgb(255, 255, 255);
    }
    .product-name {
        font-size: 4vw;
    }
    .btn-detail{
        /* 桌面端 .btn-detail 的边框(0.0521vw ≈ 0.4px)和颜色(#438f61)本来会漏到手机端，
           按用户要求改成 1px、#aadabd，并固定尺寸 210×55px（= 28vw × 7.3333vw）。
           盒子定宽定高后，文字用 flex 居中，桌面端那点 padding 就不需要了 */
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28vw;
        height: 7.3333vw;
        padding: 0;
        border: 0.1333vw solid #aadabd;
        font-size: 2.9333vw;
        border-radius: 6.6667vw;
    }
    .product-name {
        margin-bottom: 8vw;
    }
    /* 左右两个箭头都已按要求从 index.html 删掉（原 id 是 swiper3-mobile_right /
       swiper3-mobile_lieft，跟实际方位是反的），它们对应的
       .swiper3-mobile .swiper-button-prev / -next 规则随之作废，一并删除 */



    /* 新闻中心 */
    .main4{
        width: 100%;
    }
    .main4-container{
        padding: 0 2.6667vw;
    }
    .header-section{
        height: auto;
        margin-bottom: 8vw;
    }
    .title-cn {
        font-size: 6vw;
        margin-top: 10.6667vw;
    }
    .bg-text-en{
        font-size: 8vw;
        top: -2.6667vw;
    }
    .content-wrapper{
        flex-direction: column;
        margin-left: 0;
    }
    .left-box {
        width: 100%;
    }
    .swiper {
        height: 83.3333vw;
        width: 100%;
        
    }
    .swiper .swiper-slide img {
        height: 52vw;
    }
    /* ======== */
   
    /* 3. 左右按钮默认隐藏，并设置过渡动画 */
    .mySwiper .swiper-button-prev,
    .mySwiper .swiper-button-next {
        opacity: 1; /* 默认完全透明 */
        visibility:visible; /* 默认不可见 */
        width: 25px;
        height: 25px;
        
    }
    
    /* ========= */
    .left-text-area {
        height: 31.3333vw;
        width: 100%;
    }

    .left-title {
        font-size: 4vw;
        /* 桌面端 line-height:1.9792vw(≈14.8px) 没被覆盖，这里字号却是 4vw(30px)，
           行盒只有字高一半，字被 .left-title h3 的 overflow:hidden 切掉 */
        line-height: 5.3333vw;
        
        /* 原 4vw。配合上面的行高收窄，整块仍能塞进 .left-text-area(31.3333vw) */
        margin: 2.6667vw 0;
    }
    .left-title h3{
        font-weight: normal;
    }
    .left-desc {
        font-size: 3.2vw;
        line-height: 5.3333vw;
        -webkit-line-clamp: 2;
        /* 桌面端是 #888888，按设计稿压深一档 */
        color: #666666;
    }
    .left-date {
        font-size: 2.9333vw;
        line-height: 3.0667vw;
        margin-top: 3.3333vw;
    }
    #main4_dian{
            text-align: right;
             bottom: 31.3333vw;
        }
    .right-box{
        display: none;
    }

    .right-box-mobile{
        width: 100%;
        display: block;
    }
    

    .item_mobile{
        display: flex;
        align-items: center;
        justify-content: space-between;
        /* 原 8.6667vw(65px)，按用户要求每行行距收 6px → 7.8667vw(59px)。
           注意第一行也吃这个上边距，所以第一行相对上面轮播的距离同样少 6px */
        margin-top: 7.8667vw;
    }
    .item-title-mobile{
        display: flex;
        align-items: center;
        font-size: 3.5vw;
        gap: 2.4133vw;
        color: #333333;
       
    }
    .item-title-mobile img{
        width: 2.6667vw;
        height: 2.6667vw;
    }
    .item-title-mobile .item-dot{
        /* 原来这里是 <span style="font-size:20px">◆</span>：◆ 的墨迹只有 0.46em
           （同字体实测 20px 字号只画出 9×9），所以怎么调字号都不好估尺寸。
           改成 CSS 方块旋转 45°：边长 9.2px(=1.2267vw) 时外接框正好 13×13，
           即设计要求的高宽 13px。flex:0 0 auto 是防止被 flex 压缩 */
        flex: 0 0 auto;
        width: 1.2267vw;
        height: 1.2267vw;
        background-color: #7ab8f2;
        transform: rotate(45deg);
    }
    .item-title-mobile h3{
        width: 76vw;
        font-weight: normal;
         white-space: nowrap;      /* 2. 强制文本不换行 */
        overflow: hidden;         /* 3. 隐藏超出容器的内容 */
        text-overflow: ellipsis;  /* 4. 溢出部分显示省略号 */ 
    }
    .item-date-mobile{
        /* 原 #333333，按设计稿改浅灰 */
        color: #9a9a9a;
        font-size: 3.2vw;
    }
    .item_mobile_a {
        height: 7.6vw;
        margin: 11.3333vw auto 3.9625vw;
        width: 30vw;
    }
    
    .item_mobile_a a{
        font-size: 2.9333vw;
        color: #0074b0;
        padding: 2.4vw 6vw;
        border: #0074b0 0.1333vw solid;
        border-radius: 6.6667vw;
    }
    .item_mobile_a a:hover{
        background-color: #0074b0;
        color: aliceblue;
    }

    #main4_dian .swiper-pagination-bullet-active {
        width: 2.6vw;
        height: 0.9vw;
    }
}