 @charset "utf-8";
 @media screen and (min-width: 1920px) { 
	#about {
		background-size: 100% 100%;
	}
 }
 @media screen and (max-width: 1500px) { 
 	.newsInfo .main .titleBox .title,.caseInfo .main .titleBox .title{
 		float: none;
 		max-width: 100%;
 	} 
 	.newsInfo .main .titleBox .time,.caseInfo .main .titleBox .time {
 		float: none;
 		width: 100%;
 	}
 } 
 @media screen and (max-width: 1320px) { 
	.topMain .keyword {
		float: none;
	}
	.topMain .search {
		float: none;
		margin: 0 auto;
	}
	.menuBox2{
		float: none;
		margin-top:20px;
	}
 }
 @media screen and (max-width: 1250px) { 
	#about {
		background-size: auto 100%;
	}
	.about .imgList li {
		width: 33.333333%;
	}
 }

 @media screen and (max-width: 1270px) {
	#header {
		line-height: 60px;
	}
	#content { 
		padding-top: 60px; 
	}
	.header {
		padding: 0;
	}
	.header .nav {
		display: none;
	}
	.header .navBtn {
		display: block;
	}
	.header .logo a img {
		height: 40px;
	}
	.header .topPhone {
		display: none;
	}
	.footer1 {
		display: none;
	}
	.productInfo .main .topBox>div {
		width: 100%;
	}
	.productInfo .main .topBox .titleBox .wrap {
		position:static;
		margin: 50px 0 0;
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
	}
	.productInfo .main .topBox .titleBox .title {
		margin-bottom: 0;
	}
}

@media screen and (max-width: 991px) {
	.news .titleBox,.news .menuBox {
		float: none;
	}
	.news .titleBox {
		margin-bottom: 20px;
	}
	.news .menuBox {
		margin-top: 0;
	}
	#about {
		background: url(../images/homeabout.png) no-repeat left top;
		background-size: auto 100%;
	}
	.about .wrap {
		width: 100%;
	}
	.about2 .imgBox,.about2 .textBox {
		margin-top: 20px;
	}
	.newsInfo .main,.caseInfo .main,.productInfo .main{
		width: 100%;
	}
	.sideBar {
		width: 100%;
		margin-top:40px;
	}
}

@media screen and (max-width: 767px) {
	.mobi-bar{
		display: block;
	}
	.mapBox .container1 {
		height: 300px;
	}
	
	
	.productInfo .main .topBox .titleBox {
	position:relative;
	height: auto;
}
	
	
	
	
	#footer {
		padding-bottom: 58px;
	}
	.pageList {
		padding-top: 20px;
	}
	#about2 {
		padding-bottom: 50px;
	}
	.footer1-content,.footer2-content,#topBanner .titleBox,.topMain,.product,.case,.news,.logoBox,
	.about,.about2,.product2,.contact,.news2,.newsInfo,.caseInfo,.productInfo,.zhaopin {
		padding: 0;
	}
	#product,#case,.about .wrap,#newsInfo {
		padding: 50px 0;
	}
	#product2,#news2,#contact,#caseInfo,#productInfo,#newsInfo,#zhaopin {
		padding:20px 0 50px;
	}
	#news {
		padding: 50px 0 20px;
	}
	.moreBtn {
		margin: 20px auto 0;
	}
	.menuBox .option,.menuBox,.menuBox2 .option,.menuBox2{
		float: none;
		display:block;
	}
	.menuBox2{margin-top:0;}
	.menuBox .menu,.menuBox2 .menu {
		display:block !important;
		position: relative;
		top: 0;
		left: 0;
		z-index: 10;
		width: 100%;
		background: #f9f9f9;
		text-align: left;
    	box-shadow: 0px 10px 25px rgba(0,0,0,.16);
	}
	.menuBox .menu a,.menuBox2 .menu a {
		float:left;
		width:29.3333%;
		margin-right: 0;
		padding: 0 2%;
		border-top: 0;
		border-bottom: 1px solid #f1f1f1;
		display: block;
		border-radius: 0;
	  	overflow: hidden;
	  	text-overflow: ellipsis;
	  	display: -webkit-box;
	  	-webkit-line-clamp: 1;
	  	-webkit-box-orient: vertical; text-align:center
	}
	.menuBox .menu a.active,.menuBox2 .menu a.active {
		background: transparent;
		color: #fd8507;
		border-color: #f1f1f1;
	}
	.menuBox .menu a:hover,.menuBox2 .menu a:hover {
		background: #fd8507;
		color: #fff;
		border-color: #f1f1f1;
	}
	.logoBox .c-banner3 {
		margin: 0;
	}
	.news .c-banner2 .slick-dots {
		bottom: -5px;
	}
	#topBanner .wrap .title {
		font-size:18px;
		line-height: 22px;
	}
	#topBanner .wrap .enTitle {
		font-size:16px;
		line-height: 20px;
	}
	#topBanner .site {
		display: none;
	}
	.contact .textBox .title {
		margin:10px 0;
	}
	.c-banner4 .slick-prev {
		left: 10px;
	}
	.c-banner4 .slick-next {
		right: 10px;
	}
	.news2 .pageList {
		padding-top:10px;
	}
	.mt-30 {
		margin-top:-30px;
	}
	.side-bar {
		display: none;
	}
	.sideBar .phoneBox {
		display: none;
	}
}

 
@media screen and (max-width: 479px) {
	.about .imgList li {
		width: 50%;
	}
	.about .titleBox .enTitle {
		font-size: 20px;
	}
	.about .titleBox .title {
		font-size: 20px;
	}
	.about .titleBox .btn {
		margin-top: 12px;
	}
	#about {
		background: url(../images/homeabout.png) no-repeat 0 -110px;
		background-size: auto 120%;
	}
}
