@media screen and (max-width: 479px) {
.w1200{width: 100%}
.main-box{position: relative; top:0; left: 0; box-shadow: 1px 1px 1px #fff; transition: all .4s; -webkit-transition: all .4s }
.mobile-left{left: 260px}
/*----header----*/
.header{width: 100%; height: 50px; background: #291b20}
.header .logo{width: 170px; height: 50px; background: none; margin: 0 auto; padding: 0; float: none;}
.header .logo{transform: scale(0.8); -webkit-transform: scale(0.8)}
.mini .logo img{transform: none}
/*----nav----*/
.nav{width: 260px; height: 100%; position: fixed; left: -260px; top: 50px; background: #1b1b1b; z-index: 99}
.nav .nav_bar{margin: 60px 0 0 0; padding: 0}
.nav .nav_bar li{float: none; margin: 0; border-bottom: 1px solid #333; padding-bottom: 0}
.nav .nav_bar li a{width: auto; padding: 10px 0 10px 50px; line-height: 32px; color: #999; text-align: left; border-radius: 0}
.nav .nav_bar li a:hover{background: transparent; color: #ed7b00}
.nav .nav_bar li a.on{background: transparent; color: #ed7b00}
.nav .nav_sub{position: relative; top: 0; left: 0; margin-left: 0; width: 100%; display: none}
.nav .nav_sub li{border-bottom: 1px solid #333; background: #1b1b1b}
.nav .nav_sub li:nth-child(1){border-top: 1px solid #333}
.nav .nav_sub li a{width: auto; padding: 8px 0 8px 60px}
.mini .nav .nav_bar{padding: 0; margin-right: 0}
.mobile-left{left: 0}
.header .btn-nav{display: block }
/*----banner----*/
#banner{height: 320px}
.banner .my-video{display: none}
.banner .my-video .video-list{display: none}
.swiper-slide .detail{width: 80%; height: 90px; position: absolute; top: 26%; left: 8%;}
.swiper-slide .detail h3{font-size: 20px; width: 100%; margin: 15px 0}
.swiper-slide .detail p{font-size: 10px; width: 100%; margin: 5px 0; opacity: .6}
/*----content----*/
/*----ms-server----*/
.ms-server{height: auto}
.ms-server ul{margin-left: 0}
.ms-server li{float: none; width: 90%; margin: 10px auto; background: #000; box-shadow: 0 8px 16px rgba(0,0,0,.3)}
.ms-server li .img{width: 220px; height: 100px; margin: 20px auto 0 auto}
.ms-server li .img img{width: 100%}
.ms-server h3{font-size: 15px; margin-bottom: 14px}
.ms-server p{font-size: 12px; padding: 0 20px 20px 20px; margin-bottom: 0}
/*----ms-product----*/
.ms-product .title{margin-bottom: 10px}
.ms-product .title h3{font-size: 18px; letter-spacing: 2px; }
.ms-product li{width: 48.4%; margin-bottom: 50px; overflow: visible}
.ms-product .img:hover img{transform: none; -webkit-transform: none}
.ms-product .product-info:hover{background:transparent}
.ms-product .product-info .product-info-text{height: 50px; bottom: -50px; padding-left: 6px; background: transparent; color: #333;}
.ms-product .product-info:hover .product-info-text{bottom: -50px}
.ms-product .product-info .product-info-text h3{font-size: 14px; padding-top: 6px }
.ms-product .product-info .product-info-text p{font-size: 12px; padding-top: 6px; color: #666}
/*----banner-one----*/
.banner-one{display: none}
/*----about----*/
.ms-about .title{margin-bottom: 20px}
.ms-about .title h3{font-size: 18px; letter-spacing: 2px}
.ms-about .title p{margin-bottom: 20px; }
.ms-about .img{width: 100%; overflow: hidden; position: relative; background: url("../image/about_mob.jpg") no-repeat center top; background-size: cover}
.ms-about .img img{display: none}
.ms-about .img .about_con{position: relative; top: 0; width: 90%; margin: 0 auto; height: 320px; padding: 100px 0 40px 0 ; box-sizing: border-box }
.ms-about .img .about_con p{font-size: 12px}
/*----news----*/
.ms-news{height: auto}
.ms-news .title{padding-bottom: 30px}
.ms-news .title h3{font-size: 18px; letter-spacing: 2px}
.ms-news .title p{font-size: 13px}
.ms-news li{padding-top: 20px; border-bottom: 1px solid #e0e0e0;}
.ms-news li i{display:none}
.ms-news ul{width: 92%}
.ms-news ul a{width: 100%; height: 150px; padding-left: 0; padding-bottom: 10px}
.ms-news .date{float: none; width: 90px; height: 30px; margin-right: 0; padding-left: 10px; position: relative}
.ms-news .date h1{font-size: 24px; text-align: left}
.ms-news .date p{position: absolute; top: 9px; left: 92px;}
.ms-news .news-content{float: none; width: 96%; margin: 0 auto; height: auto}
.ms-news .news-content h3{font-size: 15px; padding-bottom: 10px; padding-top: 6px}
.ms-news .news-content p{font-size: 12px; line-height: 24px}
/*----contact----*/
.ms-contact{width: 92%; margin: 0 auto; padding-top: 30px}
.ms-contact .title{padding-bottom: 20px}
.ms-contact .title h3{font-size: 14px; font-weight: normal}
.ms-contact .net_list{margin-top: 20px; padding-bottom: 40px;}
.ms-contact .net_list ul{margin-right: -1%}
.ms-contact .net_list li{width: 24%; margin-right: 1%; margin-bottom: 8px}
/*--------------------------page-------------------------------------*/
/*----page-content----*/
.banner-bg{display: none}
.banner-bg-mob{display: block; width: 100%; height: 180px; padding-top: 20px; position: relative; z-index: 1}
.banner-bg-mob .img{background-color: #39383e; background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 180px}
.banner-bg .banner-bg-join{background-position: -300px 0}
/*--------about-page--------*/
.title_list{width: 98%; margin: 0 auto; text-align: center}
.title_list .list_link{font-size: 13px; color: #888; padding: 2px 3px 10px 3px; margin: 0 5px; font-weight: normal;}
/*----pinpai_page----*/
.page_pinpai{width: 92%; margin: 40px auto 0 auto}
.pin_pai{padding-bottom: 20px}
.pin_pai .img{width: 100%;}
.pin_pai .txt{width: 100%; margin-left: 0; margin-top: 20px}
.pin_pai .txt h3{font-size: 16px; margin-bottom: 20px}
.pin_pai .txt p{padding-right: 0}
.pin02 .txt{margin-left: 0; margin-right: 0}
.pin02 .img{float: none}
.pin02 .img img{float: none}
.page_about{width: 92%; margin: 0 auto; padding-top: 40px;}
.page_about .about_left{width: 100%; margin-right: 0}
.page_about .about_left h3{font-size: 16px}
.page_about .about_left p{padding-right: 0; margin-bottom: 16px}
.page_about .about_right{width: 100%}
/*----culture-page----*/
.page_culture{width: 92%; margin: 0 auto; padding-top: 40px}
.page_culture .culture_left{width: 100%; margin-right: 0}
.page_culture .culture_left h3{font-size: 16px}
.page_culture .culture_left p{padding-right: 0; margin-bottom: 16px;}
.page_culture .culture_right{width: 100%; margin-left: 0}
/*----page_honor----*/
.page_honor{width: 94%; margin: 0 auto; padding-top: 40px}
.page_honor h3{font-size: 16px}
.page_honor .honor_list{list-style: none; margin-right: 0}
.page_honor .honor{padding-bottom: 20px; margin-bottom: 20px}
.page_honor .honor_list li{width: 100%; margin-right: 0}
/*---------news-page-----------------*/
.news-page{padding-top: 40px; padding-bottom: 40px}
.news-page li{padding-top: 20px; border-bottom: 1px solid #e0e0e0;}
.news-page li i{display:none}
.news-page ul a{width: 100%; height: 170px; padding-left: 0; padding-bottom: 10px}
.news-page .date{float: none; width: 90px; height: 30px; margin-right: 0; padding-left: 10px; position: relative}
.news-page .date h1{font-size: 24px; text-align: left}
.news-page .date p{position: absolute; top: 9px; left: 92px;}
.news-page .news-content{float: none; width: 96%; margin: 0 auto; height: auto}
.news-page .news-content h3{font-size: 15px; padding-bottom: 10px; padding-top: 6px}
.news-page .news-content p{font-size: 12px; line-height: 24px}
/*-------------news-show-page----------------------*/
.news-show-page .news-show-content{width: 90%;}
.news-show-page .news-show-content .title{font-size: 16px;}
.news-show-page .news-show-content .time{position: relative; margin-bottom: 40px}
.news-show-page .news-show-content .time h4{font-size: 18px}
.news-show-page .news-show-content .time small{left: 120px}
.news-show-page .news-show-content .news-txt img{width: 100%}
.preNext{width: 92%}
.preNext .text li{margin: 5px 0}
.preNext .text li:nth-child(2){float:left}
/*-----------contact-page-------------*/
.contact{width: 90%; padding-top: 60px; margin: 0 auto}
.contact .word{float: none; width: 90%; margin: 0 auto}
.contact .word img{float: none; width: 100% }
.contact .contact-us{width: 100%; float: none; padding-top: 40px}
.contact .contact-us .list1{padding-bottom: 20px}
.contact .contact-us .list1 h3{font-size: 16px}
.contact .contact-us .list1 p{font-size: 12px; line-height: 20px;}
.contact .contact-us .list2 h3{font-size: 15px}
.contact .contact-us .list2 span{width: 100%; border-bottom: 1px solid #999; margin-bottom: 20px}
.contact .contact-us .list2 p{font-size: 13px; line-height: 22px}
.contact .contact-us .list2 .p1{padding-bottom: 20px}
/*--------products-page--------*/
.product{width: 98%; padding-top: 30px}
.product-li .product-li-box a{display: inline-block; padding: 4px 12px; font-size: 13px; margin-bottom: 4px}
.product .product-box li{width: 48%; margin-right: 1%}
.product .product-box .img span{display: none}
.product .product-box li:hover .img img{transform: none; -webkit-transform: none;}
.product .product-box li:hover .product-info{transform: translateY(0); -webkit-transform: translateY(0);}
.product .product-box .product-info .product-info-text h3{padding-top: 20px; padding-left: 10px; font-size: 14px; color: #717171}
.product .product-box li:hover .product-info .product-info-text h3{color: #717171}
.product .product-box li:hover .product-info .product-info-text p{color: #8c8c8c}
/*---------product-show-page--------------------*/
.product-show{width: 98%; padding-top: 40px}
.product-show .title{float: none; width: 100%; text-align: center }
.product-show .title h3{font-size: 16px; padding-bottom: 6px}
.product-show .title p{font-size: 12px; padding-bottom: 30px}
.product-show .title span{display: none}
.product-show .title .product-list{display: none}
.product-show .product-content{float: none; width:100%; margin-right: 0}
.product-show .product-content .product-content-nu{font-size: 12px}
.product-show .product-title{display: none}
/*----top----*/
.top{right: 10px; bottom: 20px;}
}
@media screen and (min-width: 480px) and (max-width: 1199px) {
/*----nav----*/
.header .nav .nav-main a{width: 50px; padding: 4px 26px}
.header .nav_sub{margin-top: 20px; left: -22px}
.header .nav .nav_sub a{padding: 10px 50px}
.header .nav .nav_sub li i{top: 14px; right: 20px}
/*----banner-one----*/
.banner-one .list1 .txt{margin: 0 40px}
/*----news----*/
.ms-news{height: 816px}
/*----contact----*/
.ms-contact{height: 1200px;}
.ms-contact .contact-w{width: 960px; margin: 0 auto}
.ms-contact .contact-box .left{ width: 500px; padding-left: 20px; padding-top: 140px; background-position:-120px 0}
.ms-contact .contact-box .right{float: right; width: 420px}
/*--------------------------page-------------------------------------*/
/*----page-content----*/
.banner-bg{position: relative; height: 280px }
.banner-bg .img{background-position: -200px 0; position: relative; height: 280px}
/*--------about-page--------*/
.about-title{padding-top: 60px}
.about-title h2{font-size: 18px; padding-bottom: 20px}
.about-title p{font-size: 16px;}
.about-title img{float: none; margin-bottom: 50px}
.about-txt{width: 80%; font-size: 14px}
/*-----------contact-page-------------*/
.contact{width: 90%; padding-top: 100px; margin: 0 auto}
.contact .word{float: left; width: 320px; margin-right: 10%}
.contact .word img{float: none; width: 100%}
/*--------products-page--------*/
.product{width: 90%; padding-top: 30px}
.product ul{list-style: none; width: 100%; margin-left: 1%; }
/*----------product-show-page-------------------*/
}
@media screen and (max-width: 479px){
.s_max{widh:100%; float:left; display:none;}
.s_mobile{widh:100%; float:left; display:block;}
}
@media screen and (min-width: 480px) and (max-width: 1199px){
.s_max{widh:100%; float:left; display:block;}
.s_mobile{widh:100%; float:left; display:none;}
}