@media (max-width: 1200px){
    .container-box{
        width: 100%;
        padding: 0 20px;
    }
    .about-box .about{
        left: 20px;
    }
    .pub-header{
        line-height: 60px;
        position: fixed;
        width: 100%;
        top:0;left: 0;
        z-index: 999;
    }
    .pub-header .nav-list{
        float: none;
        position: fixed;
        padding-top: 30px;
        width: 40%;
        right: -40%;
        height: 100%;
        background: #B61E13;

        top:80px;
        z-index: 999;
        -webkit-transition: all 0.5s linear;
        -moz-transition: all 0.5s linear;
        -ms-transition: all 0.5s linear;
        -o-transition: all 0.5s linear;
        transition: all 0.5s linear;
    }
    .pub-header .nav-list.act{
        right: 0;
    }
    .benefit-service .benefit-list{
        padding-top: 10px;
    }
    .benefit-service .benefit-list .item{
        padding-top: 15px;
    }
    .pub-header .nav-list li{
        width: 100%;
        float: none;
    }
    .pub-header .nav-list li a{
        color:#FFF;
    }
    .pub-header .contact{
        display: none;
    }
    .top-area{
        display: none;
    }
    .pub-t .eng-text {
        font-size: 16px;
        letter-spacing: 0;
    }
    .pub-t .cha-text{
        font-size: 12px;
    }
    .benefit-service .benefit-list .item .content .cover .title{
        font-size: 14px;
    }
    .benefit-service .benefit-list .item .content .cover .icon{
        font-size: 30px;
    }
    .benefit-service .benefit-list .item .content .cover .more{
        font-size: 12px;
    }
    .service-case .case-list .item .num{
        font-size: 30px;
    }
    .about-box{
        background: #FFF;
    }
    .about-box .about{
        position: relative;
        width: 100%;
    }
    .about-box .about .title{
        display: none;
    }
    .about-box .about .content{
        width: 100%;
        float: none;
        padding: 15px;
    }
    .about-box .culture{
        width: 100%;
        padding: 0;
        float: none;

    }
    .about-box .culture .content{
        padding: 15px;
    }
    .news .content{
        padding: 10px 0;
    }
    .news .company-news .first-news .image{
        width: 100%;
    }
    .news .company-news .first-news .cont .title{
        font-size: 14px;
    }
    .news .company-news .first-news .cont .com{
        font-size: 12px;
    }
    .news .item a{
        font-size: 12px;
    }
    .news .news-list .item .time{
        font-size: 12px;
    }
    .news .company-news .first-news .cont{
        position: relative;
        width: 100%;
        padding: 10px 0 0 0;

    }
    .about-box .about{
        left: 0;
    }
    .news .company-news .first-news .cont .more{
        margin-top: 10px;
    }
    .banner{
        padding-top: 80px;
    }
    .about-box .cont{
        font-size: 12px;
    }
    .pub-header .xs-menu{
        display: block;
    }
    .pub-footer .ft-top{
        padding: 15px 0;
    }
    .pub-footer .ft-top .ft-navlist{
        width: 100%;
        float: none;
    }
    .pub-footer .ft-top .ft-navlist > li{
        width: 100%;
        float: none;
        padding: 15px 0;
        border-bottom: 1px solid #434343;
    }
    .pub-footer .ft-top .ft-navlist > li .toggle-nav{
        display: inline-block;
    }
    .pub-footer .ft-top .btm-ewm{
        float: none;
        padding-top:20px;
        width: 40%;
    }
    .pub-footer .ft-top .btm-ewm .ewm img{
        margin: 0;
    }
    .pub-footer .ft-top .ft-navlist > li > ul{
        display: none;
    }
    .pub-footer .ft-top .ft-navlist > li > ul>li{
        line-height: 26px;
    }
    .main-content .left-nav{
        display: none;
    }
    .main-content .right-content{
        width: 100%;
    }

}

@media (max-width: 767px) {
    .banner{
        padding-top: 60px;
    }
    .service-case .case-list .item .content .tit-area a{
        font-size: 14px;
        width: 70%;
    }
    .service-case .case-list .item .content .tit-area .time{
        width: 30%;
    }
    .service-case .case-list .item .content .com{
        margin-top: 10px;
        font-size: 12px;
    }
    .service-case .case-list .item .num{
        font-size: 20px;
    }
    .service-case .case-list{
        padding-top: 15px;
    }
    .pub-header{
        height: 60px;
    }
    .pub-header .logo{
        width: 40%;
        height: 60px;
    }
    .benefit-service .benefit-list .item .content .cover .icon{
        padding-top: 40px;
    }
    .about-box .more{
        font-size: 12px;
    }
    .pub-header .nav-list{
        width: 60%;
        top:60px;
        right: -60%;
    }
    .pub-header .xs-menu{
        line-height: 60px;
    }
    .main-content .right-content .content .list .item .image{
        flex-basis: 100%;
        width: 100%;
    }
    .main-content .right-content .content .list .item .cont{
        flex-basis: 100%;
        width: 100%;
        padding: 15px 0 0 0;

    }
    .main-content .right-content .content .list .item .main{
        display: block;
    }
}