.nav-toggle{display: none;}
.grid{display: none;}
.shadow{display: none;position:absolute;width:100%;height:100%;z-index:2;background:#000;top:0px;left:0px;filter:alpha(opacity=50);-moz-opacity:0.5;opacity:0.5;}
@media only screen and (max-width: 1440px) {
    .env-productDetails .detail-cont .text{max-width: 800px;}
    .join,.contact,.recruit,.environmental{max-width: 960px;}
    .join .list-item3 ul li{width: 180px;margin: 0 10px 10px;}
    .contact,.recruit,.environmental{margin:0 auto; }
    .organ-structure .company img{max-width: 600px;}

}
@media only screen and (max-width:1200px) {
    .solutions .solutions-list{margin: 0;}
    .solutions .solutions-list li{
        width: 29.333333333%;
    }
    .homeTechnique ul{
        margin: 0;
    }

    .homeTechnique ul li{width:21%;}
    .page-environmental .environmental,.page-cen{max-width: 960px;margin: 0 auto;padding-left: 10px;padding-right: 10px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;}
    .header .page-cen{max-width: 1100px;}
    .header .logo{width: 160px;}
    .news .news-info{padding-top: 10px;}
    .news .news-info .news-link{padding-top: 1%;}
    .news.news-list .news-imgage{ width: 250px;height: 160px;}
    .news.news-list .news-info{width: 640px;}
    .env-item .env-image, .env-item p{width: 420px;}
    .advantage-list li{margin: 0 50px 20px;}
    .contact .contact-us{width: 48%}
    .contact .map{width: 50%}
    .wf_select{right: 1px;}
    .home-technique .page-cen{
        max-width: 1200px
    }
    .page-advantage .advantage .page-text{padding:  0 10px;}

    .banner-slider li .ban-text{width:1100px;margin-left: auto;margin-right: auto;}
    .env-productDetails .detail-cont .equipment{width: 960px;}
    .env-productDetails .detail-cont .detail-imageList li{width: 272px;}
    .company-item{width: 100%}
    .company-item ul li{text-align: center;}
    .company-item ul .company-info{float: none;}
    .company-item ul li img{float: none;display: block;margin:0 auto;}
    .case-list li .list-image{width: 300px;height: 200px;}
    .case-list li .list-text{width: 600px;}
    .case-list li .list-text .list-info{height:80px; }
    .culture ul li {margin: 0 30px 20px;display: block;float: none;overflow: hidden; }
}
@media only screen and (max-width: 960px) {
    .hearder_nav ul{
        display: none;
    }
     .pageinner {
        float:left;
        width: 100%;
        z-index:100;
        -webkit-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: -webkit-transform 500ms cubic-bezier(0.77,0,0.175,1);
        -moz-transition: -moz-transform 500ms cubic-bezier(0.77,0,0.175,1);
        -ms-transition: -ms-transform 500ms cubic-bezier(0.77,0,0.175,1);
        transition: transform 500ms cubic-bezier(0.77,0,0.175,1);
        position:relative;
    }
    .sideopen .pageinner {
        -webkit-transform: translateX(-280px);
        -moz-transform: translateX(-280px);
        -ms-transform: translateX(-28px);
        transform: translateX(-280px);

    }
    body.sideopen .shadow{display: block}
    .sideopen .grid {
        position:fixed;
        width:280px;
        top:0px;
        right:0px;
        height:100%;
        display: block;
        background: #fff;
        z-index: 999;
    }
    .grid > li { width: 100%; height: 100%; overflow: hidden;  position: relative; }
    .sidenav { position: absolute; top: 0; left: 0; bottom: 0;  width: 330px; overflow: hidden; padding-top: 20px;}
    li.laug{font-size: 16px;}
    li.laug a{display: inline-block;text-indent: 0px;color:#333;  font-size: 16px;}
    body.sideopen .sidenav {background:#fff;}
    .three{
        -webkit-transform: translateX(280px);
        -moz-transform: translateX(280px);
        -ms-transform: translateX(280px);
        transform: translateX(280px);
        -webkit-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: -webkit-transform 500ms cubic-bezier(0.77,0,0.175,1);
        -moz-transition: -moz-transform 500ms cubic-bezier(0.77,0,0.175,1);
        -ms-transition: -ms-transform 500ms cubic-bezier(0.77,0,0.175,1);
        transition: transform 500ms cubic-bezier(0.77,0,0.175,1);
    }
    body.sideopen .three{
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        transform: translateX(0px);
        
        list-style:none
    }
    .sidenav li { _overflow: hidden; width: 100%;  
/*                 text-indent: 40px; */
    }
    .sidenav a { 
        text-decoration: none; 
/*        color: #eee;  */
        display: block; 
        line-height: 48px;  
    }
    .sidenav b { display: block; color: #333333;font-size:18px; line-height: 4; font-weight:normal; }
    .sidenav b .en{   color: #bdbdbd;}
    .sidenav a:hover b{  color: #3f853f;}
    .sidenav a.active b{  color: #3f853f;}
    .nav-toggle {
        display: block;
        right:0;
        top:20px;
        width: 60px;
        height: 60px;
        z-index: 2;

        position: absolute;
        cursor: pointer;
        -webkit-transition-duration: 0.66s;
        transition-duration: 0.66s;
        -webkit-transition-timing-function: swing;
        transition-timing-function: swing;
    }
    .nav-toggle .icon {
        width: 30px;
        height: 4px;
        background-color:  #1ea3e5;
        border-radius: 2px;
        position: absolute;
        top: 28px;
        left: 15px;
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
        transiting-timing-function: swing;
    }
    .nav-toggle .icon:before, .nav-toggle .icon:after {
        width: 30px;
        height: 4px;
        background-color:  #1ea3e5;
        border-radius: 2px;
        content: "";
        position: absolute;
        left: 0;
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
        -webkit-transition-timing-function: swing;
        transition-timing-function: swing;
    }
    .indexheader .nav-toggle .icon{
        background-color: #1ea3e5;
    }
    .indexheader .nav-toggle .icon:before,.indexheader  .nav-toggle .icon:after{
        background-color: #1ea3e5;
    }
    .nav-toggle .icon:before {
        top: -9px;
    }
    .nav-toggle .icon:after {
        top: 9px;
    }
    body.sideopen .nav-toggle .icon {
        width: 0;
    }
    body.sideopen .nav-toggle .icon:before {
        -webkit-transform: translateY(9px) rotate(45deg);
        -ms-transform: translateY(9px) rotate(45deg);
        transform: translateY(9px) rotate(45deg);
    }
    body.sideopen .nav-toggle .icon:after {
        -webkit-transform: translateY(-9px) rotate(-45deg);
        -ms-transform: translateY(-9px) rotate(-45deg);
        transform: translateY(-9px) rotate(-45deg);
    }
    .header{
        width: 100%;
        padding-left: 2%;
        padding-right: 2%;
        box-sizing: border-box;
    }
    .grid ul{
        width: 100%;
        padding-top: 20px;
    }
    .grid ul li{
        padding-top: 10px;
        padding-bottom: 10px;
        border-bottom: 1px solid #ccc;
    }
    .grid ul li.nav-li{
        background: url(../images/chevron-right.png) 230px 20px no-repeat;
        transition: background .3s ease-in;
       -moz-transition: background .3s ease-in;
       -webkit-transition: background .3s ease-in;
        

    }
    .grid ul li.nav-li.menu{
         background: url(../images/chevron-down.png) 230px 20px no-repeat;
    }
    .grid ul li a{
        display: inline-block;
        line-height: 45px;
        width: 100%;
        text-indent: 40px;
        font-size: 20px;
        color: #666;
    }
    .grid ul li p a{
        width: 30%;
        text-indent: 40px;
    }
    .grid ul li p a.aactive{
        color: #1ea3e5;
    }
    .grid ul li a:hover{
        color: #1ea3e5;
    }
    .grid ul li.active a{
        color: #1ea3e5;
    }
    .grid ul li.active .subnav a{
        color: #666;
    }
    .grid ul li .subnav{
        display: none;
        padding-left: 40px;
    } 
    .grid ul li .subnav a{
        font-size: 22px;
    }
/*    .grid ul li a.active{
        color: #3f853f;
    }*/
    .search-result{
        width: 100% !important;
    }
    .grid ul li a{
        font-size: 26px;
    }
    .grid ul li p a{
        width: 40%;
    }
    /*------------*/
    .page-title{padding:50px; }
    /*.home-vision{padding-bottom: 50px;}*/
    .solutions .solutions-list li{
        width:46%;padding:0 2%;
    }
    .homeTechnique ul li{width: 46%;height: 180px;}
    .homeProduct ul li{width: 50%;}
    .homeNews-item ul{margin: 0;padding: 10px;}
    .homeNews-item ul li{width: 50%;}
    .homeNews-item ul li .li-con {
        width: 90%;
        margin: 0 auto;
    }
    .company{padding:0 10px 100px;}
    .news .news-imgage,.news .news-info,.news.news-list .news-imgage,.news.news-list .news-info{float: none;width: 90%;margin: 0 auto;}
    .env-item .env-image, .env-item p{float: none;width: 100%;}
    .footer-nav-left .link-left,.footer-nav-left .link-right{float: none;text-align: center;line-height: 40px;}
    .copyright .copyright-text{float: none;text-align: center;}
    .copyright-icon{float: none;width: 144px;margin: 0 auto;overflow: auto;padding-bottom: 10px;}
    .copyright-icon .item{margin:0 18px;}
    .advantage-list li{display: block;width: 100%;margin: 0 auto 20px;text-align: center;}
    .advantage-list li p,.advantage-list li .list-icon{text-align: center;}
    .contact .contact-us,.contact .map{width:100%}
    /*-------------footer---------*/
    .footer-nav-right{margin-top: 20px;margin-bottom: 50px;}
    .footer-nav-right ul li{float: none;margin-bottom: 10px;width: auto;}
    .footer-nav-right ul li .foot-title{ padding: 0 10px 10px;margin-bottom: 0;}
    .footer-nav-right ul li .foot-list{padding: 10px;border-top: 1px dashed #434343;border-bottom: 1px solid #434343;}

    .footer-nav-right ul li .foot-list a{display:inline;width: auto;margin: 0 20px 0 0;}
    .select_box{display: none;}
    .homeTechnique ul li .li-left{width:18%;}
    .homeTechnique ul li .li-right{width: 80%;}
    .development-slider{margin: 0}
    .development-slider li{width: 48%;margin:20px 1%;}
    .banner-slider li .ban-text{width:940px;}
    .env-productDetails .detail-cont .equipment{width:100%;}
    .env-productDetails .detail-cont .detail-imageList {margin: 0;}
    .env-productDetails .detail-cont .detail-imageList li{width:46%;margin: 0 2% 24px;}
    .case-list li .list-image{width:30%;height: 160px;}
    .case-list li .list-text{width:65%;}
    .case-list li .list-text .list-title{margin:15px 0 10px; }
    .case-list li .list-text .list-info{height:60px; }
    .news.news-list .news-imgage{height: auto;}
    .news.news-list .news-imgage img{height: auto;}
}
@media only screen and (max-width: 640px){
    body,.company p,.solutions .solutions-list .solution-title,.join .list-item3 ul li h4{font-size: 24px;}
    .hbanner-nav .nav-list a{font-size: 20px;}
    .home-index-bg{height: 100%;top:0;margin-top: 0;overflow: hidden;}
    .home-index-bg img{height: 100%;}
    .footer-nav-right ul{margin: 0}
    .wf_select{right: 10px;}
    .culture-box{padding: 0}

    .company-item ul li{height: 174px;}
    .banner-slider li .ban-text{width:620px;}
    .banner-slider li .ban-text h3{font-size: 40px;}
    .banner-slider li .ban-text h4{font-size: 24px;}
    .banner-slider li .ban-text .slide_line{height: 6px;}
    .banner-slider li .ban-text .item{margin-right: 36px;}
    .banner-slider li .ban-pic img{height: 100%;}
    .homeNews-item ul li .li-title h2{height: 64px;display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
    .homeNews-item ul li .li-text{height: 150px;}
    .homeNews-item ul li .li-text p{display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 5;-webkit-box-orient: vertical;}
    .culture .culture-icon{height: 110px;}
    .sider-pre{left: -8px;}
    .sider-next{right: -8px;}
    .page-title h2{font-size: 34px;}
    .homeNews-nav a{font-size: 24px;}
    .case-list li .list-text .list-title{margin: 0 0 10px;}
    .join .list-item3 ul li{margin: 0 0 20px;}
    .case-list li .list-text .list-info{height: 90px;display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp:3;-webkit-box-orient: vertical;}
    .homeTechnique ul li .li-right h3,.homeNews-item ul li .li-title h2,.homeNews-more a,.homeVison-more a,.footer-nav-right ul li .foot-title a,.culture-info h2,.page-text p,.join-info p
        ,.contact .contact-us p,.page-form .submit_btn button
    {font-size: 22px;line-height: 32px;}
    .footer-nav-left .link-left a,.qualification p,.news .news-info .news-title,.news.news-list .news-info .news-title,.advantage-list li .list-icon .text h4,.case-list li .list-text .list-title
        ,.join .list-item3 ul li p,.contact .contact-us li,.recruit-description
    {font-size: 20px;line-height: 30px;}
    .container,.homeNews-item ul li .li-text p,.footer-nav-right ul li .foot-list a,.about-slider li h4,.culture-text,.culture-info p,.advantage-list li,.case-list li .list-text .list-info
    {font-size: 18px;line-height: 30px;}
    .homeTechnique ul li .li-right h4,.homeTechnique ul li .li-right p,.company-item ul .company-info p,.advantage-list li .list-icon .text span
    {font-size: 16px;line-height: 28px;}
    .sy_profile .left{display: none;}
    .footer-nav-right{display: none;}
    .news.news-list .news-info .news-title{padding: 20px 0;}
    .env-productDetails .detail-cont .text p img{max-width: 100%;}
}
