@media screen and  (max-width: 1450px){
    .index-news ul li{
        width: 32.33%;
        margin: 0px 0.5%  0px 0.5%;
    }
    .index-news ul li .pic-box img{
        display: block;
        margin: 0px auto;
    }
}
@media screen and  (max-width: 1650px){
    .header{
        width: 90%;
        left: 5%;
    }
    .header .header-main{
        width: 100%;
    }
    .header .header-main .menu{
        width:calc(100% - 490px);
        float: right;
        position: relative;
        left: auto ;
        top: auto;
    }

    .header  .nav > li >ul >li{
        min-width: 120px;
        margin-right: 60px;
    }
    .header .nav > li >ul {
        width: 90%;
        left: 5%;
    }
    .header .main{
        width: 100% !important;
        max-width: 100% !important;
    }
    .index-banner .swiper-pagination{
        width: 90% !important;
        left: 5% !important;
    }
    .header .nav > li > a {
        padding: 15px 30px;
    }
}
@media screen and  (max-width: 1500px){
    .header .nav > li > a {
        padding: 15px 20px;
    }
}
@media screen and  (max-width: 1400px){
    .header .nav > li > a {
        padding: 15px 40px;
    }
    .header .header-main .logo img{
        width: 150px;
        margin-top: 33px;
    }
    .header .header-main .logo font{
        font-size: 16px;
    }
    .header .header-main .logo{
        width: 335px;
    }
    .header .header-main .menu{
        width: calc(100% - 335px);
    }
    .header .nav > li >img{
        margin-left: 15px;
        margin-right: 15px;
    }
    .header .info{
        margin-left: 10px;
    }
    .header .icon{
        width: 30px;
        height: 30px;
        margin-top: 8px;
    }
    img{

        max-width: 100%;

    }
    .main{
        max-width: 98%;
    }
    .inner-banner .main{
        left: 1%;
    }
    .about-pages .evi ul li{
        width: 32.3333%;
        margin: 0px 0.5% 25px 0.5%;
    }
    .about-pages .honor ul li{
        width: 32.3333%;
        margin: 0px 0.5% 25px 0.5%;
    }
    .about-pages .evi ul li:nth-child(4n){
        margin-right: 0.5%;
    }

    .about-pages .evi ul li img{
        display: block;
        margin: 0px auto;
        max-width: 100%;
        width: 100%;

    }
    .about-pages .honor ul li:nth-child(4n){
        margin-right: 0.5%;
    }

    .about-pages .honor ul li img{
        display: block;
        margin: 0px auto;
        max-width: 100%;
        width: 100%;

    }







    .case-pages .list .product-list{
        width: 100%;
    }
    .case-pages .list .product-list li{
        width: 32.333%;
        margin-left: 0.5%;
        margin-right: 0.5%;
    }
    .case-pages .list .product-list li img{
        display: block;
        margin: 25px auto;
    }
    .news-pages .news-content .main{
        width: 100%;
        max-width: 100%;
    }
    .news-pages .list .news-list li .pic{
        width: 20%;
    }
    .news-pages .list .news-list li .info{
        width: 80%;
    }
    .news-pages .list .news-list li .info .col-xs-10{
        width: 78%;
    }
    .news-pages .list .news-list li .info .col-xs-2{
        width: 20%;
    }
    .product-pages .application ul li{
        width: 32.333%;
        margin: 0px 0.5% 15px 0.5%;
    }
    .product-pages .application ul li:nth-child(3n){
        margin: 0px 0.5% 15px 0.5%;
    }


}
@media screen and  (max-width: 1350px){
    .contact-pages .contact .contact-main .contact-box i{
        display: block;
    }
    .contact-pages .contact .contact-main .contact-box{
        text-align: center;
    }
}
@media screen and  (max-width: 1300px){
    .case-pages .list .product-list li img{
        display: block;
        margin: 15px auto;
    }

    .header .nav > li > a {
        padding: 15px 30px;
    }

}
@media screen and  (max-width: 1200px){
    .header .nav > li > a {
        padding: 15px 20px;
    }
    .section{
        max-width: 100% !important;
        width: 100% !important;
    }
    html{
        max-width: 100% !important;
        width: 100% !important;
    }
    body{
        max-width: 100% !important;
        width: 100% !important;
    }
    .section.table, .slide.table{
        display: block !important;
    }

    .logo p{
        display: none;
    }
    .header .header-main{
        border-bottom-left-radius: 10px;
    }
    .case-pages .list .product-list li img{
        display: block;
        margin: 0px auto;
    }
    .case-pages .show .pic-box{
        width: 100%;
        float: none;
    }
    .case-pages .show .intro{
        width: 100%;
        float: none;
        margin-top: 90px;
    }


    .news-pages .list .news-list li .pic{
        width: 25%;
    }
    .news-pages .list .news-list li .info{
        width: 75%;
    }


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

    .footer{
        background: #333 !important;
        height: auto;
    }
    .footer .about h1{
        margin: 45px auto;
    }
    .footer .about p{
        width: 90%;
    }
    .footer .contact{
        width: 90%;
    }
    .footer .contact .msg{
        width: 100%;
        padding: 20px 20px 0px 20px;
    }
    .footer .contact .info{
        width: 100%;
        padding: 30px;
    }
    .footer .copy{
        width: 90%;
    }
    .footer .contact .msg textarea{
        width: 100%;
    }
    .footer .contact .msg input{
        width: 100%;
    }
}
@media screen and  (max-width: 1100px){
    .header .nav > li > a {
        padding: 15px 10px;
    }

    .product-pages .feature ul li .title{
        margin-top: 30px;
    }
    .service-pages .items ul li .title{
        margin-top: 30px;
    }

    .index-cases .des{
        width: 90%;
    }
    .index-cases .series-list{
        width: 90%;
    }
    .index-cases .series-list ul li {
        margin-bottom: 15px;
    }
    .index-product-main .series-list{
        width: 90%;
    }
    .index-product-main .series-list ul li{
        margin-bottom: 15px;
    }
    .join-pages .contact .contact-main .items li .col-xs-6{
        width: 100%;
        margin-bottom: 15px;
    }
    .join-pages .contact .contact-main .items li .row{
        margin: 15px auto;
    }
    .case-pages .cat-content .item  .right{
        padding-left: 0px;
    }

    .case-pages .cat-content .item  .col-xs-6{
        width: 100%;
        padding: 0px 3%;
    }
    .case-pages .cat-content .item .more{
        margin: 15px auto 45px auto;
    }
    .case-pages .cat-content .item  .info{
        width: 100%;
        margin-bottom: 20px;
    }
    .case-pages .cat-content .item .title{
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .case-pages .cat-content .item img{
        margin: 15px auto;
        display: block;
    }
}
@media screen and  (max-width: 1024px){
    .product-pages .cat-list .nav li{
        height: auto;
    }
    .product-pages .cat-list .nav li a{
        padding: 10px 15px;
    }
    .header .icon{
        display: none;
    }
    .header .info{
        width: 100%;
        margin-left: 0px;
    }
    .header .navbar-inverse .navbar-nav > li > a h5{
        display: none;
    }
    .header .navbar-inverse .navbar-nav > li > a h1{
        line-height: 60px;
        color: #000;
        font-weight: normal;
        font-size: 16px;
    }
    .header .header-main .logo font{
        display: none;
    }

    .wap-menu{
        display: block !important;
    }
    .header{
        position: absolute !important;
    }
    .header .nav > li{
        position: relative;
        height: auto;

    }
    .header .nav .active  span{
        display: none;
    }
    .header .nav > li >ul >li{
        width: 100% !important;
    }
    .header .nav > li >ul >li font{
        color: #999;
        width: 100%;
        border-bottom: 1px dashed #999;
        height: 45px;
        line-height: 45px;
        margin-bottom: 0px;
    }
    .header .nav > li:hover >.line{
        display: none;
    }
    .header .nav > li >ul >li >a{
        padding-left: 0px;
    }
    .header .nav > li >ul{
        position: relative;
        top: 0px;
        left: 0px;
        width: 100%;
        height: auto;
        zoom: 1;
        overflow: hidden;
        border-radius: 0px;
    }
    .header .navbar-inverse .navbar-nav > .active > a,  .header  .navbar-inverse .navbar-nav > .active > a:hover,  .header  .navbar-inverse .navbar-nav > .active > a:focus{
        background: #6b9eac;
        color: #fff;
    }
    .header .nav .active h1{
        color: #000 !important;
    }
    .header .nav > li:hover h1{
        color: #000 !important;
    }
    .header .nav > li:hover{
        background: #6b9eac !important;
        color: #fff !important;
    }
    .header .nav > li:hover > a{
        color: #fff !important;
    }
    .header .nav .active a{
        color: #fff !important;
    }
    .header .nav > li >ul >li .line{
        margin-bottom: 0px;
    }
    .header .navbar{
        width: 100%;
    }
    .about-pages .top .position{
        display: none;
    }
    .about-pages .top .col-xs-10{
        width: 100%;
    }
    .about-pages .top .col-xs-2{
        display: none;
    }
    .about-pages .top{
        height: auto;
        background: none;
    }
    .about-pages .top ul{
        height: auto;
    }
    .about-pages .top ul li{
        width: 23%;
        margin: 0px 1% 25px 1%;
        border-bottom: 1px solid #dedede;
    }
    .about-pages .top ul .active{
        border-bottom: 1px solid #6b9eac;
    }
    .about-pages .top ul li a{
        color: #000;
    }



    .service-pages .top .position{
        display: none;
    }
    .service-pages .top .col-xs-10{
        width: 100%;
    }
    .service-pages .top .col-xs-2{
        display: none;
    }
    .service-pages .top{
        height: auto;
        background: none;
    }
    .service-pages .top ul{
        height: auto;
    }
    .service-pages .top ul li{
        width: 23%;
        margin: 0px 1% 25px 1%;
        border-bottom: 1px solid #dedede;
    }
    .service-pages .top ul .active{
        border-bottom: 1px solid #6b9eac;
    }
    .service-pages .top ul li a{
        color: #000;
    }



    .case-pages .top .position{
        display: none;
    }
    .case-pages .top .col-xs-10{
        width: 100%;
    }
    .case-pages .top .col-xs-2{
        display: none;
    }
    .case-pages .top{
        height: auto;
        background: none;
    }
    .case-pages .top ul{
        height: auto;
    }
    .case-pages .top ul li{
        width: 23%;
        margin: 0px 1% 25px 1%;
        border-bottom: 1px solid #dedede;
    }
    .case-pages .top ul .active{
        border-bottom: 1px solid #6b9eac;
    }
    .case-pages .top ul li a{
        color: #000;
    }





    .product-pages .top .position{
        display: none;
    }
    .product-pages .top .col-xs-10{
        width: 100%;
    }
    .product-pages .top .col-xs-2{
        display: none;
    }
    .product-pages .top{
        height: auto;
        background: none;
    }
    .product-pages .top ul{
        height: auto;
    }
    .product-pages .top ul li{
        width: 23%;
        margin: 0px 1% 25px 1%;
        border-bottom: 1px solid #dedede;
    }
    .product-pages .top ul .active{
        border-bottom: 1px solid #6b9eac;
    }
    .product-pages .top ul li a{
        color: #000;
    }





    .news-pages .top .position{
        display: none;
    }
    .news-pages .top .col-xs-10{
        width: 100%;
    }
    .news-pages .top .col-xs-2{
        display: none;
    }
    .news-pages .top{
        height: auto;
        background: none;
    }
    .news-pages .top ul{
        height: auto;
    }
    .news-pages .top ul li{
        width: 23%;
        margin: 0px 1% 25px 1%;
        border-bottom: 1px solid #dedede;
    }
    .news-pages .top ul .active{
        border-bottom: 1px solid #6b9eac;
    }
    .news-pages .top ul li a{
        color: #000;
    }





    .contact-pages .top .position{
        display: none;
    }
    .contact-pages .top .col-xs-10{
        width: 100%;
    }
    .contact-pages .top .col-xs-2{
        display: none;
    }
    .contact-pages .top{
        height: auto;
    }
    .contact-pages .top ul{
        height: auto;
    }

    .contact-pages .top ul .active{
        border-bottom: 1px solid #6b9eac;
    }



    .join-pages .top .position{
        display: none;
    }
    .join-pages .top .col-xs-10{
        width: 100%;
    }
    .join-pages .top .col-xs-2{
        display: none;
    }
    .join-pages .top{
        height: auto;
    }
    .join-pages .top ul{
        height: auto;
    }

    .join-pages .top ul .active{
        border-bottom: 1px solid #6b9eac;
    }








    .header{
        width: 100%;
        border-radius: 0px;
        left: 0px;
    }
    .header .main{
        max-width:100% !important;
    }

    .header .col-xs-12:first-child{
        display: none;
    }
    .header .top{
        display: none;
    }
    .header .header-main{
        width: 100%;
        border-radius: 0px;
        height: 60px;
        background: #fff;
    }
    .header .header-main .menu{
        position: relative;
        left: auto;
        top: auto;
    }
    .navbar-toggle{
        border: none;
        margin-top: 15px;
    }


    .navbar-inverse .navbar-toggle .icon-bar {
        background-color: #6b9eac;
    }
    .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus{
       background: none;
    }
    .navbar-header{
        float: right;

    }
    .header .header-main .logo{
        width: 30%;
        position: absolute;
    }
    .header .header-main .logo img{
        margin-top: 5px;
        width: 180px;
        height: auto;
        max-width: none;
    }
    .header .header-main .menu{
        width: 100%;
        margin-right: 0px;
    }
    .navbar-collapse{
        width: 100%;
    }
    .navbar-nav{
        width: 100%;
        background: #6b9eac;
        margin: 0px auto;
        height: auto;
    }
    .navbar-nav > li{
        width: 100%;
        height: 60px;
        border-bottom: 1px solid #ccc;
    }
    .navbar-nav > li:last-child{
        border-bottom:none;
        display: none;
    }
    .header .nav > li > a{
        border-right: none;
        padding: 0px;
        text-align: center;
        width: 100%;
        height: 100%;
        line-height: 60px;
        margin: 0px auto;

    }
    .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{
        border: none;
    }
    .navbar-inverse .navbar-nav > li > a{
        color: #fff;
    }
    .nav > li >img{
       display: none;
    }
    .inner-banner{
        margin-top: 60px;
    }
    .inner-banner .main{
        max-width: 90%;
        left: 5%;
    }
    .contact-pages .contact .contact-main .pic-box{
        width: 100%;
    }
    .contact-pages .contact .contact-main .text-box{
        width: 100%;
    }
    .navbar{
        float: none;
    }
    .header .header-main .logo{
        background: none;
    }



    .news-pages .list .news-list li .pic{
        width: 28%;
    }
    .news-pages .list .news-list li .pic img{
        max-width: 100%;
    }
    .news-pages .list .news-list li .info{
        width: 70%;
    }
    .product-pages .pic-box{
        height: 640px;
    }
    .navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus{
        color: #fff;
    }
    .index-banner{
        height: 480px;
    }
    .index-banner .swiper-pagination{
        display: none;
    }
    .index-product{
        height: auto;
        margin-bottom: 30px;
    }
    .index-product-main h1{
        margin: 45px auto;
    }
    .index-product-main .index-product-list .product-banner{
        width: 100%;
        height: auto;
        margin: 0px auto 30px auto;
        max-width: 640px;
        clear: both;
        float: none;
    }
    .index-product-list .product-series-list{
        width: 100%;
    }
    .index-cases{
        height: auto;
    }
    .index-cases h1{
        margin: 45px auto;
    }
    .index-news{
        height: auto;
    }
    .index-news h1{
        margin: 45px auto;
    }
    .product-pages .top-cat{
        display: block !important;
        background: #508d9e !important;
        margin-bottom: 30px !important;
    }
    .product-pages .top-cat ul li{
        width: 50% !important;
        margin: 0px auto !important;
        border-bottom: none !important;
    }
    .product-pages .top-cat ul .active{
        border-bottom: none !important;
    }



    .about-pages .top-cat{
        display: block !important;
        background: #508d9e !important;
        margin-bottom: 30px !important;
    }
    .about-pages .top-cat ul li{
        width: 33.333% !important;
        margin: 0px auto !important;
        border-bottom: none !important;
    }
    .about-pages .top-cat ul .active{
        border-bottom: none !important;
    }


    .service-pages .top-cat{
        display: block !important;
        background: #508d9e !important;
        margin-bottom: 30px !important;
    }
    .service-pages .top-cat ul li{
        width: 33.333% !important;
        margin: 0px auto !important;
        border-bottom: none !important;
    }
    .service-pages .top-cat ul .active{
        border-bottom: none !important;
    }



    .case-pages .top-cat{
        display: block !important;
        background: #508d9e !important;
        margin-bottom: 30px !important;
    }
    .case-pages .top-cat ul li{
        width: 33.333% !important;
        margin: 0px auto !important;
        border-bottom: none !important;
    }
    .case-pages .top-cat ul .active{
        border-bottom: none !important;
    }
    .news-pages .cat-list{
        display: none;
    }
    .header .navbar-collapse{
        position: relative;
        z-index: 999999;
    }
    .g-pc{
        display: none;
    }
    .g-wap{
        display: block;
    }
    .about-pages .items ul li{
        margin-bottom: 60px;
    }
    .about-pages .items ul li .col-xs-4{
        width: 100%;
    }
    .about-pages .items ul li .title h1{
        margin-top: 45px;
    }
    .about-pages .items ul li .title .line{
        display: none;
    }
    .about-pages .items ul li .content{
        padding-left: 0px;
        padding-right: 0px;
        margin-top: 30px;
    }
    .about-pages .items ul li:nth-child(2n) .content {
        padding-left: 0px;
        padding-right: 0px;
    }
}

@media screen and  (max-width: 768px){
    .pc{
        display: none;
    }
    .wap{
        display: block;
    }
    .about-pages .evi ul li{
        width: 49%;
        margin-bottom: 10px;
    }
    .about-pages .honor ul li{
        width: 49%;
        margin-bottom: 10px;
    }
    .about-pages .evi h1{
        font-size: 22px;
    }
    .about-pages .evi p{
        font-size: 14px;
        margin-bottom: 15px;
    }
    .about-pages .evi h1{
        margin: 20px auto;
    }
    .about-pages .intro .content .col-xs-6{
        width: 100%;
    }
    .about-pages .intro .text-box p{
        width: 96%;
        margin-left: 2%;
        margin-bottom: 15px;
    }
    .about-pages .intro .text-box{
        margin-bottom: 30px;
    }
    .inner-banner .main .en{
        font-size: 22px;
    }
    .inner-banner .main .cn{
        font-size: 20px;
    }
    .about-pages .intro h1{
        font-size: 22px;
        margin-top: 15px;
    }
    .case-pages .list{
        padding: 45px 0px;
    }

    .service-pages .items .main{
        padding: 10px;
    }
    .about-pages .items .main{
        padding: 10px;
    }


    .case-pages .show .pic-box{
        height: 450px;
    }

    .contact-pages  .contact .contact-main .down-box ul li{
        width: 100%;
        margin-right: 0px;
    }
    .case-pages .show .main{
        padding-top: 20px;
    }
    .contact-pages .contact h1{
        font-size: 22px;
        margin: 30px auto;
    }
    .join-pages .contact h1{
        font-size: 22px;
        margin: 30px auto;
    }
    .contact-pages .contact .contact-main .text-box h5{
        font-size: 20px;
    }
    .contact-pages .contact .contact-main{
        padding: 10px;
    }
    .contact-pages .contact .contact-main .info-box{
        padding: 0px 10px;
        font-size: 16px;
        line-height: 25px;
    }
    .join-pages .contact .contact-main .info-box{
        padding: 0px 10px;
        font-size: 16px;
        line-height: 25px;
    }
    .contact-pages .contact .contact-main .contact-box{
        width: 100%;
    }
    .contact-pages .contact .contact-main .msg-box{
        width: 90%;
    }
    .contact-pages .contact .contact-main{
        margin: 20px auto 30px auto;
    }
    .news-pages .list .news-list{
        margin: 20px auto;
    }

    .news-pages .top ul li{
        height: 45px;
        margin-right: 0px;
    }
    .news-pages .top ul li a{
        height: 45px;
        line-height: 45px;
    }
    .news-pages .top .col-xs-6{
        width: 100%;
    }
    .news-pages .top .pull-right{
        display: none;
    }
    .news-pages .list .news-list li .pic{
        width: 25%;
    }
    .news-pages .list .news-list li .info .day{
        font-size: 20px;
    }
    .news-pages .list .news-list li .info .year{
        font-size: 14px;
    }
    .news-pages .list .news-list li .info .col-xs-10{
        width: 70%;
    }
    .news-pages .list .news-list li .info .col-xs-2{
        width: 25%;
    }
    .news-pages .list .news-list li .info h1{
        margin-bottom: 15px;
    }
    .news-pages .news-content .main{
        margin: 20px auto;
        padding:30px  20px 20px 20px;
    }
    .news-pages .news-content .main .title{
        font-size: 18px;
        margin-bottom: 15px;
    }
    .news-pages .news-content .main img{
        display: block;
        margin: 15px auto;
        max-width: 100%;
    }
    .news-pages .news-content .main .inner-content{
        margin: 15px auto;
        padding:15px 0px;
    }
    .news-pages .news-content .main .hot-list{
        margin: 30px auto;
    }
    .product-pages .cat-list{
        padding: 20px 0px 15px 0px;
    }
    .product-pages .cat-list ul{
        overflow: visible;
        background: #fff;
    }
    .product-pages .cat-list ul li{
        margin-right: 0px;
    }
    .product-pages .cat-list ul li a{
        width: 100%;
    }
    .product-pages .cat-list ul .active a{
        color: #fff;
    }
    .wap-search-list .dropdown{
        height: auto;
    }
    .product-pages .cat-list .main{
        overflow: visible;
    }
    .product-pages .feature ul li .col-xs-6{
        width: 100%;
    }
    .product-pages .feature ul li .right{
        padding-left: 0px;
    }
    .product-pages .feature ul li .info{
        width: 100%;
        margin-bottom: 20px;
    }
    .product-pages .feature ul li .title{
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .product-pages .feature ul li{
        margin-bottom: 0px;
    }
    .product-pages .show h1{
        font-size: 22px;
        margin-bottom: 20px;
    }
    .product-pages .show{
        padding: 20px 0px;
    }
    .product-pages .application{
        padding: 20px 0px;
    }
    .product-pages .application h1{
        font-size: 22px;
        margin-bottom: 30px;
    }
    .product-pages .application ul li{
        width: 100%;
        margin-bottom: 15px;
    }
    .product-pages .application ul li img{
        display: block;
        margin: 0px auto;
    }
    .index-banner{
        height: 320px;
    }

    .service-pages .items ul li .col-xs-6{
        width: 100%;
    }
    .service-pages .items ul li .right{
        padding-left: 0px;
    }
    .service-pages .items ul li .info{
        width: 100%;
        margin-bottom: 20px;
    }
    .service-pages .items ul li .title{
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .service-pages .items ul li{
        margin-bottom: 0px;
    }













    .join-pages .contact .contact-main{
        padding: 0px 15px;
    }
    .join-pages .contact .contact-main .items li .cn{
        font-size: 20px;
    }
    .join-pages .contact .contact-main .items li{
        margin-bottom: 30px;
        padding-bottom: 15px;
    }
    .about-pages .partner-list ul li{
        width: 48%;
    }
    .f-box{
        right: 50px;
    }
    .about-pages .items ul li .pic-box{
        line-height: 150px;
    }
    .about-pages .items ul li .pic-box img{
        width: 150px;
    }
    .about-pages .intro h1{
        margin-bottom: 45px !important;
    }
    .about-pages .items ul li .title h1{
        margin-top: 30px;
        font-size: 22px;
    }
    .about-pages .items ul li .content{
        margin-top: 15px;
    }
}
@media screen and  (max-width: 640px) {
    .product-pages .pic-box{
        height: 480px;
        margin-bottom: 15px;
    }
    .swiper-button-next, .swiper-button-prev{
        top: 40% !important;
    }
    .product-pages .gallery-thumbs{
        width: 80%;
    }
    .index-product-list .product-series-list .item .text-box .des{
        height: 140px;
        -webkit-line-clamp: 6;
    }
    .index-product-main .series-list ul li{
        width: 23%;
        margin: 0px 1% 10px 1%;
    }
    .index-cases .series-list ul li {
        width: 23%;
        margin: 0px 1% 10px 1%;
    }
    .index-cases .des{
        font-size: 14px;
    }
    .index-news ul li{
        width: 100%;
        margin: 0px auto 30px auto;
    }
    .index-news .more{
        margin: 20px auto;
    }
    .index-news ul li .pic-box .text-box{
        position: relative;
        bottom: auto;
        left: auto;
        background: #333;

    }
    .index-news ul li .pic-box .text-box p{
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

}
@media screen and  (max-width: 560px) {
    .news-pages .list .news-list  li {
        padding: 15px 15px 15px 20px;
    }

    .news-pages .list .news-list li .pic {
        width: 30%;
    }

    .news-pages .list .news-list li .info {
        width: 65%;
    }
}
@media screen and  (max-width: 480px){
    .contact-pages  .contact .contact-main .contact-box .col-xs-4{
        width: 100%;
        margin-bottom: 45px;
    }
    .contact-pages .contact .contact-main .contact-box{
        margin: 30px auto;
    }
    .contact-pages .contact .contact-main .contact-box img{
        width: 40px;
        height: auto;
        margin-bottom: 15px;
    }
    .index-product-main h1 .l{
        width: 90px;
        height: 9px;
        background-size: 100% auto;
    }
    .index-product-main h1 .r{
        width: 90px;
        height: 9px;
        background-size: 100% auto;
    }
    .about-pages .top ul li {
        width: 31.333%;
    }
    .service-pages .top ul li {
        width: 31.333%;
    }
    .case-pages .top ul li {
        width: 31.333%;
    }
    .product-pages .top ul li {
        width: 31.333%;
    }
    .case-pages .top ul li {
        width: 31.333%;
    }

    .news-pages .top ul li {
        width: 31.333%;
    }


    .header .header-main .logo img{
        width: 150px;
        margin-top: 10px;
    }
    .case-pages .list .product-list li{
        width: 49%;
        margin-bottom: 30px;
    }
    .case-pages .show .main{
        padding-top: 10px;
    }
    .case-pages .show .intro .intro-top .title{
        width: 100%;
    }
    .case-pages .show .intro .intro-top .btns{
        width: 30%;
        margin-top:10px;
    }
    .contact-pages .contact h1{
        margin: 20px auto;
    }
    .join-pages .contact h1{
        margin: 20px auto;
    }
    .contact-pages .contact .contact-main .text-box h5{
        margin: 30px auto;
    }
    .contact-pages .contact .contact-main .text-box p{
        line-height: 30px;
    }
    .in-ditu{
        height: 320px;
        margin: 20px auto;
    }
}
@media screen and  (max-width: 450px){
    .footer .contact .info .text-box p{
        line-height: 30px;
    }
    .about-pages .top ul li {
        width: 48%;
    }
    .service-pages .top ul li {
        width: 48%;
    }
    .case-pages .top ul li {
        width: 48%;
    }
    .product-pages .top ul li {
        width: 48%;
    }
    .case-pages .top ul li {
        width: 48%;
    }

    .news-pages .top ul li {
        width: 48%;
    }
    .case-pages .show .pic-box{
        height: 320px;
    }
    .case-pages .show .intro .intro-top .title{
        font-size: 22px;
    }
    .case-pages .show .intro .intro-top .btns{
        width: 100%;
        height: 45px;
    }
    .case-pages .show .intro .info{
        margin-top: 30px;
    }
    .case-pages .show .intro .intro-top .btns .next-icon{
        width: 13px;
        height: 13px;
    }
    .case-pages .show .intro .intro-top .btns .pre-icon{
        width: 13px;
        height: 13px;
    }
    .case-pages .show .main{
        padding-left: 20px;
        padding-right: 20px;
    }
    .case-pages .show{
        padding-top: 30px;
    }

    .news-pages .list .news-list li .info h1{
        font-size: 14px;
        margin-bottom: 10px;
    }
    .news-pages .list .news-list li .info .content{
        line-height: 20px;
    }
    .product-pages .feature .main{
        padding: 20px;
    }
    .product-pages .feature h1{
        margin-bottom: 30px;
    }
    .product-pages .pic-box{
        height: 320px;
    }
    .product-pages .gallery-thumbs .swiper-wrapper{
        height: 120px;
    }
    .product-pages .gallery-top{
        height: calc(100% - 150px);
    }
    .product-pages .pic-box .swiper-button-next, .product-pages .pic-box .swiper-button-prev{
        top: 50%;
    }
}
@media screen and  (max-width: 400px){

    .inner-banner .main .en{
        font-size: 20px;
    }
    .inner-banner .main .cn{
        font-size: 18px;
    }
}
@media screen and  (max-width: 380px){
    .case-pages .list .product-list li{
        width: 99%;
    }
    .news-pages .list .news-list li{
        width: 90%;
        float: none;
        padding-left: 15px;
    }
    .news-pages .list .news-list li .pic{
        width: 100%;
        margin-bottom: 20px;
        float: none;
    }
    .news-pages .list .news-list li .pic img{
        display: block;
        margin: 0px auto;
    }
    .news-pages .list .news-list li .info{
        width: 90%;
        float: none;
        margin: 0px auto;
    }
}
@media screen and  (max-width: 360px){
    .index-product-main h1 .l{
        width: 60px;
        height: 9px;
        background-size: 100% auto;
    }
    .index-product-main h1 .r{
        width: 60px;
        height: 6px;
        background-size: 100% auto;
    }
}