
@media screen and (max-width:1660px) {
    .w80{ width: 90%; margin: 0  auto; }

    .honorLeft{ left: 0;}
    .honorRight{right: 0;}

    .serviceUl li .txt{ padding-left: 5vw; padding-right: 60px;}
    .serviceUl  li:nth-child(2n) .txt{ padding-left: 60px; padding-right: 5vw;}
    .serviceUl li .txt .more{ height: 48px;}

    .newInfo{ margin-top: -40vh;}
}

@media screen and (max-width:1440px) {

    body{ font-size: 14px;}
    .f14{ font-size: 14px;}
    .f15{ font-size: 15px;}
    .f16{ font-size: 16px;}
    .f18{ font-size: 16px;}
    
    .f20{ font-size: 18px;}
    .f24{ font-size: 20px;}
    .f28{ font-size: 24px;}
    .f30{ font-size: 26px;}
    .f34{ font-size: 28px;}
    .f52{ font-size: 45px;}
    .f80{ font-size: 60px;}

    .f64{font-size: 56px;}
    .f48{ font-size: 40px;}
    .f50{ font-size: 40px;}
    .f40{ font-size: 34px;}
    .f100{ font-size: 80px;}
    .w80{ width: 100%; padding: 0 50px;}
    .about .left{ padding-left: 50px;}
    .aboutMore{width: 260px;height: 60px;}

    .areasTop a{ height: 160px;}
   
    .areasTop a img{ height: 50px;}
    .areasBot .txt li{ height: 50px;margin-bottom: 20px;}

    .aboutMore{width: 220px; height: 50px;}
    .aboutMore span::before{ width: 120%;}
    .idxnumUl li{ width: 180px; height: 180px;}
    .honor .swiper-container .img{ height: 300px;}

    .culture .txt .logoB{ width: 20%; bottom: 0;}
    .history .title{ left: 50px;}
    .history .left .swiper-slide .year{ font-size: 85px;}
    .history .right .swiper-slide{ width: 100px;}
    .history .right .prev{ top: 30px;}
    .history .right .next{ bottom: 30px;}

    .serviceUl li .txt{ padding-left: 50px; padding-right: 40px;}
    .serviceUl  li:nth-child(2n) .txt{ padding-left: 40px; padding-right: 50px;}

    .serviceBanner .txt .more{ height: 48px;}
    .choiceUl li{ width: 255px; height: 255px;}

    .choiceUl li img{ height: 48px;}
    .serviceThere .tabUol li span{ padding-bottom: 40px;}
    .serviceFour ul li{ height: 160px;}
    .serviceFour ul li span{ font-size: 68px;}
    .zzBtn .right{ width: 350px;}
    .serviceSeven{    padding: 70px 0 150px;}
    header .logo{ width: 200px;}
    header .zz{ width: 170px;}
    .servicetesting{ height: 420px;}
    .serviceMenu a{ line-height: 70px;}
   /* .serviceMenu{ margin-top: -70px;}*/

    .technologyOne .txt .con::before, .technologyOne .txt .con::after{ font-size: 80px;}
    .technologyOne .txt .con::before{top:-50px; left: -50px;} 
    .technologyOne .txt .con::after{ bottom:-50px ; right: -50px;}

    .newsList li .img img{ height: 260px;}
    .newsList li .f20{ height: 72px;}

    .mapBox{ height: 620px;}
    .conStyleUl li img{ height: 22px;}

    nav dt span.DIN{ font-size: 160px;}
}

@media screen and (max-width:1280px) {
    body{ font-size: 12px;}
    .f14{ font-size: 12px;}
    .f15{ font-size: 14px;}
    .f16{ font-size: 14px;}
    .f18{ font-size: 14px;}
    
    .f20{ font-size: 16px;}
    .f24{ font-size: 16px;}
    .f28{ font-size: 16px;}
    .f30{ font-size: 18px;}
    .f34{ font-size: 22px;}
    .f52{ font-size: 34px;}
    .f80{ font-size: 48px;}


    .f64{font-size: 46px;}
    .f48{ font-size: 30px;}
    .f50{ font-size: 30px;}
    .f40{ font-size: 28px;}

    header .zz{ display: none;}
    nav{ width: 50vw;}
    nav a{ font-size: 16px;}

    .ban .swiper-slide img{ height: auto;}

    header .icon-24gf-phoneLoudspeaker,header .ENG{ display: none;}

    div.video-wrap{ width: 90vw;height: auto;}

    .culture .txt ul li{ padding-bottom: 80px;}
    .culture .txt ul li img{ height: 60px;}

    .history{ padding-bottom: 40px;}
    .history .title{ position: relative; left: auto; top: auto; text-align: center; padding-top: 30px;}
    .history .right .gallery-thumbs{ height: 300px;}
    .history .right .swiper-slide{ width: 73px;}
    .history .w80{ flex-direction: column;}
    .history .left{ width: 100%;}
    .history .right{ width: 100%;background: none; height: 60px; }
    .history .right .gallery-thumbs{ height: auto; width: 100%; display: none;}
    .history .right .swiper-slide{ height: 95px;}
    .history .right .prev{ top: 50%; transform: translateY(-50%) rotate(-90deg); left: 0; z-index: 10; -webkit-transform: translateY(-50%) rotate(-90deg); -moz-transform: translateY(-50%) rotate(-90deg); -ms-transform: translateY(-50%) rotate(-90deg); -o-transform: translateY(-50%) rotate(-90deg); }
    .history .right .next{ bottom: auto; top: 50%; transform: translateY(-50%) rotate(-90deg); left: auto; right: 0; z-index: 10; -webkit-transform: translateY(-50%) rotate(-90deg); -moz-transform: translateY(-50%) rotate(-90deg); -ms-transform: translateY(-50%) rotate(-90deg); -o-transform: translateY(-50%) rotate(-90deg); }
    .choiceUl li{ width: 200px; height: 200px;}
    .choiceUl li img{ height: 40px;}

    /* .newsList{grid-gap: 30px;} */
    .newsList li .img img{ height: 235px;}
    .newsList li .f20{ height: 65px;}

    .newInfo{ margin-top: -30vh;}

}

@media screen and (max-width:1060px) {
    .culture{ flex-direction: column;}
    .culture .img{ width: 100%;}
    .culture .txt{ width: 100%;}
    .culture .txt ul{ position: relative; width: 100%; left: 0;}
    .culture .txt .logoB{ width: auto; bottom: 20px; height: 100px;}
    .proServer,.acceUl{    grid-gap: 15px;}

    .newInfo{ margin-top: -10vh;}
}

@media screen and (max-width:750px) {
    .w80{ width: 100%; padding: 0 20px;}
    
    .f14{ font-size: 12px;}
    .f15{ font-size: 12px;}
    .f16{ font-size: 13px;}
    .f18{ font-size: 13px;}
    
    .f20{ font-size: 14px;}
    .f24{ font-size: 14px;}
    .f28{ font-size: 14px;}
    .f30{ font-size: 14px;}
    .f34{ font-size: 16px;}
    .f52{ font-size: 20px;}
    .f80{ font-size: 34px;}

    .f100{ font-size: 30px;}
    .f64{font-size: 24px;}
    .f48{ font-size: 22px;}
    .f50{ font-size: 20px;}
    .f40{ font-size: 18px;}

    header{ padding: 0 0 0 20px; height: 60px; display: flex; justify-content: space-between;}
    header .right{ display: none;}
    .logo img{ height: 46px;}
    .h_nav {
        display: flex;
        margin-left: 20px;
    }
    nav{
        transform: translateX(100%);
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transition: all .6s;
        position: fixed;
        z-index: 100;
        top: 60px;
        left: 0;
        height: calc(100vh - 60px);
        background-color: #fff;
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start !important;
        -webkit-transition: all .6s;
        -moz-transition: all .6s;
        -ms-transition: all .6s;
        -o-transition: all .6s;
}
    nav.show{ transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; border-top: 1px solid #e5e5e5; }
   /* nav a{ width:50%; text-align: left; color: #333; line-height: 70px;} */

     nav li>a{ width:calc(100% - 60px); text-align: left; color: #333; line-height: 60px; height: 60px;}

    nav li { width: 90vw; text-align: center; border-bottom: 1px solid rgba(0, 0, 0, 0.05); position: relative;}
    nav dl.subMenu{ top: 61px; background-color: #fff; z-index: 15;
        padding: 15px;
        text-align: left;
        font-size: 14px;
        box-shadow: 0 0 10px rgb(0 0 0 / 0.1);
    }
    nav dl.subMenu dt{ display: none;}
    nav dd{ padding: 15px; grid-gap:20px;grid-template-columns: repeat(1,1fr);}
     .h_nav.close{align-items: center; justify-content: center;}
     .searchBox{ top: 60px; padding: 10px;}
     .searchBox form{ width: 100%;}
     .searchBox .input{ width: 80%;}
     .searchClose{ display: none;}

     .ban .swiper-slide img{ height: 320px;}
     .svg-swiper-pagination .swiper-pagination-bullet{ bottom: 20px;}
     .about{ flex-direction: column;}
     .about .left{ padding: 20px;}
     .about .left .txt{ padding: 0;}
     .about .left .txt img{ width: 50%;}
     .about .right .playBtn{ width: 60px; height: 60px;}
     .aboutMore{ width: 180px; padding: 0 15px;}
     .idxnumUl{ flex-wrap: wrap;}
     .idxnumUl li{ width: 130px; height: 130px; margin-bottom: 15px;}
     .honorLeft, .honorRight{ display: none;}
     .honor .swiper-container .img{ height: 200px;}

     .areasTop ul{ width: 100%;}
     .areasTop a{ width: 25%; height: 110px; margin: 0;}
     .areasTop a::before{ border-radius: 0 10px 0 10px; -webkit-border-radius: 0 10px 0 10px; -moz-border-radius: 0 10px 0 10px; -ms-border-radius: 0 10px 0 10px; -o-border-radius: 0 10px 0 10px; }
     .areasTop a img{ height: 30px;}
     .areasBot .swiper-slide{ flex-direction: column;}
     .areasBot .img{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px;  margin-bottom: 15px;}
     .areasBot .txt li{ width: 48%; margin-right: 4%; height: 42px; margin-bottom: 12px;}
     .areasBot .txt li:nth-child(3n){ margin-right: 4%;}
     .areasBot .txt li:nth-child(2n){ margin-right: 0;}
     .areasBot .aboutMore{ width: 100%;}
     .areasBot .swiper-slide .txt{ padding-left: 0;}
     .coverageTit{ position: relative; top: 20px; left: 20px; display: inline-block;}
     .coverageTxt{ position: relative; top: 30px;left: 0; width:100% ; right: 0; display: inline-block; padding: 0 20px;}
     .coverageTxt a{ height: 42px;}
     .mapTabl{  width: calc(100% - 40px); left: 20px; bottom: 10px; position: relative; padding-top: 20px;}
     .mapTabl li.on span{ display: none;}
     .coverage{ background: url(../images/BusinessBg.jpg) no-repeat center center; background-size: cover;}
     .coverage .swiper-slide{ background:none;}
     .coverage .swiper-container{ margin-top: 40px;}
     .wap-flex{flex-direction: column;}
     .customers .title{ align-items: flex-start;}
     .customersClass{ width: 100%; flex-wrap: wrap; justify-content: flex-start;}
     .customersClass li{ padding: 20px;}
     .customersCon ul li{ width: 48.5%; margin-right: 3%;}
     .customersCon ul li:nth-child(5n){ margin-right: 3%;}
     .customersCon ul li:nth-child(2n){ margin-right: 0;}
     .customersCon ul li{ height: 60px; padding: 6px; margin-bottom: 12px;}
     #newsSwiper .swiper-slide .img img{ height: 180px;}
     footer .top .left{ width: 100%;}
     .footewm,.footLogo{ height: 60px;}
     footer .top .right{ display: none;}
     footer .bottom{ line-height: 2.2; justify-content: center; text-align: center;}

     .video-box{ height: 50vh;}
    .video-box .video-background{ min-height: 50vh;}
    .videoPlay img{ width: 50px;}

    #toolbar{ display: flex;}
    body::after{ display: block; content: ''; width: 100%; height: 60px; background-color: #333;}

    .neibanImg{ width: 100%; height: 320px; object-fit: cover;}
    .aboutOne .img{ padding: 0;  }

    .companyImg{ margin-top: 10px;}
    .culture .txt .logoB{ height: 80px;}
    .culture .txt ul{ flex-direction: column;}
    .culture .txt ul li{ padding-bottom: 20px; width: 100%;}
    .history .right{ display: none;}
    .history .left{ margin-top: 20px;}
    .history .swiper-slide{ flex-direction: column;}
    .history .left .img{ padding: 10px 0;}
    .history .left .swiper-slide .year{ font-size: 50px; top: 0;}

    .serviceUl li .txt,.serviceUl li:nth-child(2n) .txt{ padding: 20px;}
    .serviceUl li:nth-child(2n) a{ flex-direction: column;}
    .serviceUl li .txt .more{ height: 38px;}
    .serviceBanner{ margin-top: 60px;}
    .serviceBanner .txt .more{ height: 38px;}

    .proServer{    grid-gap: 15px;grid-template-columns: repeat(1,1fr);}
    .proServer li .txt .bg-white .icon{ width: 24px; height: 24px;bottom: -12px;}
    .proServer li .txt .bg-white .icon .iconfont{ font-size: 16px;}

    .acceUl{    grid-gap: 15px;grid-template-columns: repeat(1,1fr);}
    .acceUl .f24{ font-size: 20px;}
    .acceUl li img{ height: 180px;}
    .acceUl li .txt .icon{ width: 38px; height: 38px;}

    .processUl span{ display: none;}
    .processUl{ flex-wrap: wrap;}
    .processUl li{ width: 30%; margin-bottom: 20px ;}
    .processUl li img{ height: 30px;}
    .processUl li  .f20{ font-size: 12px;}
    .choiceUl{ flex-wrap: wrap;}
    
    .choiceUl li{ margin-top: 15px; width: 48%; height: auto; border: none; border-radius:0 ; -webkit-border-radius:0 ; -moz-border-radius:0 ; -ms-border-radius:0 ; -o-border-radius:0 ; }
    .choiceUl li img{ height: 34px;}
    .choiceUl li:hover::after{ transform:scale(0) ; -webkit-transform:scale(0) ; -moz-transform:scale(0) ; -ms-transform:scale(0) ; -o-transform:scale(0) ; }
    .choiceUl li:hover{ color: #333;}
    .choiceUl li:hover .icon1{ display: block;}
    .choiceUl li:hover .icon2{ display: none;}
    .serviceContact{ margin-top: 10px;}
    .serviceContact ul li{ width: 50%;}
    .serviceContact ul li:last-child{ display: none;}
    .serviceContact ul li i{ width: 50px; height: 50px;}
    .serviceContact{background-attachment:scroll}

    .serviceMenuBgi{ width: 100%; padding: 0;}
    .serviceMenu a{ line-height: 50px;}
/*    .serviceMenu{ margin-top: -50px;}*/
    .servicetesting{ height: auto; padding: 25px 20px;background-attachment:scroll}
    .servicetesting .f20{ width: 100%; padding: 15px; line-height: 2;}
    .servicetesting .pic{ width: 30%;}
    .serviceItem .txt{ width: 100%;}
    .serviceItem .pic{ width: 100%;}
    .serviceItem .pic li:nth-child(2){ padding-bottom: 20px;}
    .serviceItem .pic li:nth-child(3){ padding-top: 10px;}
    
    .serviceThere .tabUol li{ width: 100%; padding: 0 8px; font-size: 12px;}
    .serviceThere .tabUol li span{ padding-bottom: 10px; display: block; height: 100%;} 
    .serviceFour ul{grid-gap: 15px 10px;grid-template-columns: repeat(2,1fr);}
    .serviceFour ul li{ height: 122px;}
    .serviceFour ul li .f20{ width: 90%;}
    .serviceFour ul li span{ font-size: 50px; top: 15px; right: 15px;}
    .serviceFour ul li:hover{ transform:translateY(-8px) ; -webkit-transform:translateY(-8px) ; -moz-transform:translateY(-8px) ; -ms-transform:translateY(-8px) ; -o-transform:translateY(-8px) ; }
    .zzBtn{ width: 96%; height: 48px; line-height: 48px; font-size: 12px;}
    .zzBtn .left{ width: 40%;}
    .zzBtn .right{ width: 60%;}

    .serviceFive .customersClass{ width: 100%;}
    .serviceSix .swiper-slide{ padding-bottom: 30px;}
    .serviceSeven{ padding: 20px 0; background-attachment:scroll}
    .serviceSevenUl li .img{ width: 60px; height: 60px;}
    .serviceSevenUl li{ margin-bottom: 15px;}
    .serviceSevenUl li:last-child{ display: none;}
    .servicetestingbox { padding: 0 20px;}

    .technologyOne .txt .con::before, .technologyOne .txt .con::after{ font-size: 50px;}
    .technologyOne .txt .con::before{top:-20px; left: -20px;} 
    .technologyOne .txt .con::after{ bottom:-20px ; right:-20px;}
    .technologyOneQiu{ width: 30%;right: 20px;}
    .technologyOneQiu .layer{ padding: 15px 0;}

    .pglist{ padding: 15px 0;}
    .pglist  span,.pglist .page{ display: none;}
    .newsClassBxo{ align-items: flex-start;}
    .select{ width: 100%;}
    .select select{ height: 38px; line-height: 38px;}
    .null-txt{ font-size: 16px;}
    .newsClass{ margin-top: 25px; padding-bottom: 10px; width: 100%; text-align: center;}
    .newsClass a{ padding: 0; width: 33.3%;}
    /* .newsList{    grid-gap: 15px;    grid-template-columns: repeat(1,1fr);} */

    .newsList li{ width: 100%; margin-right:0 ; margin-bottom: 15px;}
    .newsList li:nth-child(3n){ margin-right: 0;}

    .newsList li .img img{ height: 220px;}
    .newsList li .f20 { height: auto;}
    .newInfo{ margin-top: -16vh; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; box-shadow: 0 0 10px rgba(0, 0, 0, .05);}
    .newInfo .title .left{ width: 100%;}
    .newInfo .title .more{ display: none;}
    .newInfo  .w90{ width: 100%;}

    .newsPage{ flex-direction: column; line-height: 2;border-top: 1px solid #f28e2e; border-bottom: 1px solid #f28e2e;}
    .newsPage a{ width: 100%;}
    .newsPage a.text-right{ text-align: left;  margin-top: 20px;}
    .line-height2-8{ line-height: 2;}
    .conStyleUl{ flex-wrap: wrap;}
    .conStyleUl li{ width: 33.3%; margin-bottom: 15px;}
    .conStyleUl li:nth-child(4),.conStyleUl li:nth-child(5){ width: 50%;}
    .mapBox{ height: auto;}
    #mapall{ height: 260px !important;}
    .mapBoxUl{ display: flex; text-align: center; width: 100%; padding: 0; position: relative; top: 0; transform: translateY(0); right: 0; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); }
    .mapBoxUl li { width: 33.3%;}
    .mapBoxUl li .f18{ display: none;}
    .mapBoxUl li img{ height: 16px;}
    .c_input{ width: 100%; margin-top: 12px;}
    .c_textarea{ margin-bottom: -10px;}
    .jobtit{ line-height: 50px;}
    .joblist dt{ line-height: 50px;}
    .jobtop span:nth-child(3){ display: none;}
    .jobtop span:nth-child(4){ display: none;}
    .jobtop span:nth-child(1){ width: 30%;}
   .jobtop span:nth-child(2),.jobtop span:nth-child(5),.jobtop span:nth-child(6){ width: 23%;  white-space: nowrap;}
    .joblist li{ margin-top: 15px;}
    .joblist dd .item{ flex-direction: column;}
    .joblist dt .jian,.joblist dt .jia{ width: 18px; height: 18px;}
    .joblist dd .left,.joblist dd .right{ text-align: left; padding-left: 25px;}

    .joblist dd .left{ width: 100%;}
    .TalentUl{ flex-wrap: wrap;}
    .TalentUl li span{ width: 50px; height: 50px;}
    .TalentUl li{ width: 48%; margin-bottom: 20px;}

    .resultUl{ margin-top: 15px;}
    .TalentUl li::after{ top: -180px;}
    .resultFore{ margin-top: 12px;}
    .resultUl li .wap-flex{ align-items: flex-start;}
    .resultUl .f24{  width: 100%; margin-bottom: 12px;}

    .zhanwei{ margin-top: -70px; padding-top: 70px;}

    nav li.on>a::after{ width: 0;}

    .idxnumUl li b::after{ top: -16px; right: -16px; font-size: 16px;}

}


@media screen and (max-width:420px) { }