/************
 * ¨¦??¨¦????¡¤???
 ************/
/*=============
 * ?????€¨¦??¨¨?¡è??¡¤???
 =============*/
/*2021-05-12*/
.index_about{width:50%;float:left;overflow:hidden;}
.about_content{width:100%;overflow:hidden;padding-bottom:50px}
.index_about video {
	width: 100%;
	overflow: hidden;
	margin: 0;
/*	border: 5px solid red !important;
*/	
	object-fit: fill;
	height:350px;

}
.about_button {width:100%;overflow:hidden}
	.about_button a{height:40px;line-height:40px;background:#4395FF;color:#fff;display:block;width:120px;margin:0 10%; text-align:center;font-size:16px;border-radius:4px}
		.about_button a:hover{background:#2C83F5;color:#fff}
		.index_about div.about_text {
			line-height: 29px;
			height: 120px;
			overflow: hidden;
			display: block;
			margin: 70px 10% 40px 10%;
			font-size: 20px;
			text-indent: 0;
			text-align:justify
		}
			.index_about div.about_text p{text-indent:1.6em !important;}

audio, canvas, progress, video {
	display: inline-block;
	vertical-align: baseline;
}

	#owl-demo {
		position: relative;
	}

	#owl-demo .owl-dots {
		position: absolute;
		width: 100%;
		bottom: 10px;
	}


.item1 a img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate3d(-50%,-50%,0);
	-webkit-transform: translate3d(-50%,-50%,0);
}

#scroll {
	position: fixed;
	bottom: 80px;
	right: 10px;
	z-index:999
}

#toTop {
	background-image: url('/templates/zrweb/static/img/gotop.png');
	background-size: cover;
}

#toBottom {
	background-image: url('/templates/zrweb/static/img/gobottom.png');
	background-size: cover;
}

.scrollItem {
	font-size: 12px;
	width: 40px;
	height: 40px;
	cursor: pointer;
	text-align: center;
	margin-bottom: 5px;
	opacity: 0.6
}

	.scrollItem:hover {
		opacity: 1
	}

/*2021-05-12*/

.logo_con{width:420px;overflow:hidden;height:47px; margin:15px 0;float:left;}
.logo_con img{float:left;overflow:hidden;width:49px;height:45px;}
	.logo_con p {
		float: left;
		overflow: hidden;
		width: 295px;
		color: #454040;
		padding-left: 5px
	}
		.logo_con p span {
			display: block;
			overflow: hidden;
			width: 100%;
			font-size: 12px;
			height: 15px;
			line-height: 15px;
			letter-spacing:1px
		}
.logo_con p strong{display:block;overflow:hidden;width:100%;font-size:22px;height:30px; line-height:30px;letter-spacing:0;font-weight:normal;font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif}
html{
	color: #333;
	min-width: 320px;
	font-size: 100%;
	
	
}
.item a img {
	object-fit: cover !important
}


selection {
	background: #b3d4fc;
	text-shadow: none;
}

ul,h1,h2,h3,p,div,dl,dt,dd,figure,figcaption{
	margin: 0;
	padding: 0;
}
li{list-style: none;}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
img{ max-width: 100%; height: auto; transition: all .5s;}
/*=============
 * ?¡¤??¡­¡¤??¡¤???
 =============*/
.center-block{
	display: block;
	margin-right: 0;
	margin-left: 0;
}
.pull-right{
	float: right !important;
}
.pull-left{
	float: left !important; 
}

.text-right{
	text-align: right !important;
}
.text-left{
	text-align: left !important;
}
.text-center{
	text-align: center !important;
}

.hide{
	display: none !important;
}
.show{
	display: block !important;
}
.invisible{
	visibility: hidden;
}
.text-hide{
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	background-color: transparent;
	border: 0;
}

.clearfix:after,.clearfix:before{
	content: '';
	display: table;
	  }
.clearfix:after{
	clear: both;
	}

*{box-sizing: border-box;}

/*=============
 * ???¨¨¡ì???¡§????¨C¡ã????¡è?
 =============*/
.browerupgrade{
	margin: 0;
	padding: 1rem;
	background: #ccc;
}

/*=============
 * ¨¨???????¡ë¨¦??¨¦????¡¤???
 =============*/
body{
	
	line-height: 1.8;
	background: #fff;
	font-family: Microsoft YaHei;
}

a{
	color: #666;
	text-decoration: none;
	transition: all .4s; 
}
a:active,a:hover{
	color: #00A8DF;
	text-decoration: none;
}
.container {
	max-width: 77em;
	margin: 0 auto;
/*	padding: 0 10px;
*/}

.navbar{
	background: #fff;
	height:5em;
	box-shadow: 0 2px 10px rgba(0,0,0,.8);
	overflow: hidden;
	position: fixed;
	z-index: 30;
	left: 0;
	top: 0;
	width: 100%;
}

.logo img{
	max-height: 4rem;
	 width: auto;
	 margin-top: .5rem;
}
.nav{text-align: right; font-size: 0;}
.nav li{ display: inline-block; font-size: 1rem;}
.nav li a{ display: block; line-height: 5rem; height: 5rem; padding: 0 1.5rem;}
	.ad {
		text-align: center;
		margin-top: 5rem;
	}
.ad .item{ font-size: 0;background: #535353;}
.owl-theme .owl-controls{ margin-top: -45px !important;}

.ab-btn{ text-align: right;}
.ab-btn a{ display: inline-block;border-radius:1.875rem; height:3.125rem; margin-top: 2rem; width: 18%; line-height: 3.125rem; background: #fff; color: #333;text-align: center;}
.ab-btn a:hover{ background: #00A8DF; color: #fff;}
.title{ padding-top: 3rem; margin-bottom: 1.5rem; text-align: center; }
.title h2{ font-size: 1.875rem; font-weight: 400; padding-bottom: .5rem;}
.title p{ color: #999;margin-bottom: 5px}

.service-list{ font-size: 0; padding-bottom: 2rem;}
.service-list li{padding:0 1rem; font-size: 1rem; text-align: center;  margin-top: 0rem; }
.service-list h3{ font-size: 1.5rem; font-weight: 400;margin-top: 0;}
.service-list i{ font-size:5rem;transition: all .4s;transform: rotate(0deg);}
.service-list li p{ font-size: 0.875rem; color: #999;}
.service-list li:hover i{
	color: #F13A3A;
}

.programme-box{ 
	background: #f1f1f1;
	padding-bottom: 3rem;
}

.ff-list{
	font-size: 0;	
}
.ff-list li{
	 display:inline-block;
	 position: relative;
	 background: #000;
	 overflow: hidden;
}
.ff-list li img{ width: 100%;max-width: 100%;}


.fa-txt{
	font-size: 2rem;
	position: absolute;
	z-index: 10;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	opacity: 0;
	transition: all .4s;
}
.ff-list li a:hover img{ opacity: .3; transform: scale(1.2,1.2);}
.ff-list li a:hover .fa-txt{ opacity: 1; font-size: 1.25rem; }

.advantage-box{ padding-bottom: 3rem;}
.advantage-list{ font-size: 0;}
.advantage-list li{ font-size: 1rem; text-align: center;  margin-top:0;width:300px;height:240px}
.advantage-list li img{ font-size: 1rem; text-align: center;margin-top:0;width:300px;height:210px}

.advantage-list li i{font-size:7rem;transition: all .4s;}
.advantage-list li p{ color: #999;height:30px;line-height:30px;text-align:center;font-size:16px;}
.advantage-list li  h3 p{ font-size: 3rem; color: #00A8DF !important; margin-top:1rem;}

.advantage-list li:hover i{
	 color: #F13A3A;
}

#owl-demo4 .owl-controls,#owl-demo5 .owl-controls,#owl-demo6 .owl-controls{ margin-top: 15px !important;}

.brand-box{ 
	background: url("/templates/zrweb/static/img/ban.jpg") center top;  background-size: cover; 
}/*background-attachment: fixed;*/
.brand-box .box1{padding: 4rem 1rem;margin: 0 auto; }
.brand-box h2{text-align: center; color: #fff; font-size:2rem; background: rgba(0,0,0,.4); padding: 1rem 0;}
.brand-box h2 span{ color: #8b939d; font-size: 4rem;}
.brand-box h2 strong{ font-size:2.5rem;padding:0 6px}

.team-list .item{ position: relative; padding: 0 0.5rem; overflow: hidden;display:block}
.team-list .item img{ width: 100%; height: auto; display: block;}
.team-box{background: #f1f1f1;padding-bottom: 3rem;}
.index_new .item .name-t {
	background: #fff;
	height: 3rem;
	line-height: 3rem;
	text-align: center;
}
.index_new_list .item{width:25%;float:left;overflow:hidden}
.index_new .item .name-t {
	background: #fff;
	height: 10rem;
	line-height: 3rem;
	text-align: center;
}
.index_new .item strong{display:block;width:100%}
.index_new .item span{display:block;width:100%;line-height:1.5rem;text-align:left;padding:0 15px;font-size:14px}
/*.case .list1 .al-abs span{top:35% !important}
.case .list1 .al-abs p{width:96% !important;padding:0 2%}
*/
/*.case .al-list1 {
	width: 100%;
	overflow: hidden;
	position:relative;left:0;top:0;
}
.case .al-list1 li{
	width: 33.3333%;
	overflow: hidden;
	padding:10px ;
}
	.case .al-list1 li a{width:100%;overflow:hidden}
	.case .al-list1 .img_box {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		overflow: hidden
	}
		.case .al-list1 .img_box img{width:100%;}
		.case .al-list1 .al-abs1 {
			position: absolute;
			left: 0;
			top: 293px;
		}
	.team-abs {
		text-align: center;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		background: rgba(0,0,0,0);
		transition: all .4s;
		height: 213px;
	}
*/
.team-abs h3 {
	padding-top: 15%;
	color: hsla(0,0%,100%,0);
	font-size: 3rem;
	font-weight: 400;
	transition: all .4s;
}
.team-abs p{color: hsla(0,0%,100%,0);transition: all .4s; font-size: 2rem; padding:0 1rem }
.team-list .item a:hover .team-abs{background: rgba(0,0,0,.8);}
.team-list .item a:hover .team-abs h3{color: hsla(0,0%,100%,1); font-size: 1.5rem;}
.team-list .item a:hover .team-abs p{color: hsla(0,0%,100%,1);font-size: 1rem;}
#owl-demo7 .owl-controls {
	margin-top: 1.5rem !important;
}
#owl-demo2 .owl-controls {
	margin-top: 1.5rem !important;
}
#owl-demo3 .owl-controls{ margin-top: .5rem !important;}
.value-box{background: url("/templates/zrweb/static/img/about.png") center center no-repeat; background-size: cover;}/*background-attachment: fixed; */
.value-txt {
	width: 50%;
	margin-left: 50%;
	background: rgba(30,39,48,.8);
	padding: 5rem 4rem 5rem 4rem;
	color: #fff;
}
.value-txt h2{ font-size: 2rem; padding-bottom: .5rem; font-weight: 400; }
	.value-txt p {
		width: 100%;
		overflow: hidden;
		text-align: justify;
	}
	.value-txt .ab-btn {
		text-align: center;
	}
.value-txt .ab-btn a{ min-width: 10rem;}
.lx-box{ padding-bottom: 3rem;}
.lx-list {
	font-size: 0;
	color: #999
}

.index_new .item{padding: 0 0.5rem}









.lx-list li {
	display: inline-block;
	width: calc(25% - 0.76rem);
	// border: 1px #ddd solid;
	font-size: 1rem;
	overflow: hidden
}
	.lx-list li:hover i {
		color: #333
	}
	.lx-list li:hover p span {
		color: #333;
	}
	.lx-list li:hover p {
		color: #333 !important
	}
	.lx-list li + li {
		margin-left: 1rem;
	}
	.lx-list li i {
		float: left;
		font-size: 3rem;
		padding: 0 1rem;
		color: #999
	}
	.lx-list li p {
		padding-top: 0;
		display: block;
		overflow: hidden;
		font-size: 14px;
		width:70%
	}
.lx-list li strong{font-weight:normal;padding-top:1rem !important;overflow:hidden;display:block}
	.lx-list li p span {
		display: block;
		font-size: 0.875rem;
		color: #999;
	}

.footer{
	background: #1b252e;
	padding: 2rem 0;
	color: #8b939d;
	font-size: 0.875rem;
	text-align: center;
}
.minbanner {
	width: 100%;
	overflow: hidden;
	position: relative;
	left: 0;
	top: 0;
	margin-top:5rem;
}
	.minbanner img {
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0
	}
	.minbanner .text {
		max-width: 77rem;
		height: 100px;
		position: absolute;
		left: calc(50% - 38.5rem);
		top: calc(100% - 130px);
		color:#fff;
		z-index:80;
		margin:0 auto;
	}
.minbanner .text h1 {
	width: 100%;
	height: 50px;
	line-height: 50px;
	border-left: 5px solid #0099F7;
	padding-left: 20px;
	font-size: 28px;
	font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif
}
		.minbanner .text p {
			font-size: 18px;
			color: #aeb1b3;
			height: 50px;
			line-height: 50px;
			font-family: 'Roboto', sans-serif
		}
		.minbanner .text p a{
			color: #fff;
			margin-right:10px
		}

		.b-nav {
			padding: 1rem 0;
			text-align: center;
			border-top: 1px #313a43 solid;
		}
.b-nav a{ display: inline-block; padding: 0 2rem; color: #8b939d;}
.b-nav a:hover{ color: #00A8DF;}

.page{ padding: 3rem 1rem;}
.page-tit{ text-align: center; font-size: 1.75rem; font-weight: 400;}
.sub-list{ text-align: center; padding-top: 1rem; border-bottom: 1px #dfdfdf solid; padding-bottom: 1.5rem;  font-size: 0;}
.sub-list li{ display: inline-block; font-size: 1rem;}
.sub-list li a{ display: inline-block; padding: .3rem 2rem;    border: 1px solid #dfdfdf; margin: 0 0.5rem; border-radius: 5rem;}
.sub-list li a:hover,.sub-list li.active a{ background: #00A8DF; color: #fff;border-color: #00A8DF;}
.load_more .product_list li {
	display: inline-block;
	width: calc(33% - 10px);
	position: relative;
	transition: all .4s;
	margin:5px;
	padding:0;
	float:left;
	overflow:hidden
}
/*.load_more .product_list{background:red}*/

.load_more .product_list li a {
	width: 100%;
	height: 310px;
	display: block;
	overflow: hidden
}
.load_more .product_list li a img{width:100%;height:292px;display:block;overflow:hidden}
.load_more .product_list li a span{width:100%;height:30px;display:block;overflow:hidden;line-height:30px;text-align:center}
#bottom .list1{width:100%;overflow:hidden}
#bottom .page-ajax {
	width: 100%;
	overflow: hidden
}
/*.load_more .al-list{ padding-top: 2rem; font-size: 0;}
.load_more .al-list li{ display: inline-block; width: calc(33.33% - 10px); position: relative; transition: all .4s; margin:5px}
.load_more .an_list .al-list li{ display: inline-block; width: calc(2); position: relative; transition: all .4s;}
.load_more .al-abs{text-align: center;  position: absolute; 
background: rgba(0,0,0,0); z-index: 10; left: 0;top: 0; bottom: 0; right: 0;
 border: 10px solid hsla(0,0%,100%,0);background-clip: padding-box;transition: all .4s;}
.load_more .al-abs span{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 2rem; top: 50%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);}
.load_more .al-list li a{ display: inline-block; overflow: hidden;}
.load_more .al-list li:hover img{ transform: scale(1.2,1.2);}
.load_more .al-list li:hover .al-abs{background: rgba(0,0,0,.6);border: 10px solid hsla(0,0%,100%,.5) }
.load_more .al-list li:hover span{color: hsla(213,0%,100%,1);font-size: 1.5rem;}
.load_more .al-list li:hover p{color: hsla(213,0%,100%,1);font-size: 1rem;}*/
/*1111111111111*/
/*.load_more .red.al-list li:hover .al-abs{background:#ff0000a3;border: 0px solid hsla(0,0%,100%,.5) }
.load_more .red .al-abs span{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 3rem; top: 35%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);font-weight:normal}
.load_more .red .al-abs p{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 1.5rem; top: 50%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);}*/
/*1111111111111*/
/*2222222*/
/*.load_more .list1 li{ display: inline-block; width: calc(33.33% - 10px); position: relative; transition: all .4s; margin:5px;padding:0}
.load_more .al-abs{text-align: center;  position: absolute; 
background: rgba(0,0,0,0); z-index: 10; left: 0;top: 0; bottom: 0; right: 0;
 border:0px solid hsla(0,0%,100%,0);background-clip: padding-box;transition: all .4s;}
.load_more .al-abs span{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 2rem; top: 50%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);}
.load_more .list1 li a{ display:block; overflow: hidden;}
.load_more .list1 li img{ display: inline-block; overflow: hidden;width:100%;height:100%;border:1px solid #00A8DF; margin:0; padding:0}
.load_more .list1 li:hover img{ transform: scale(1.2,1.2);}
.load_more .list1 li:hover .al-abs{background: rgba(0,0,0,.6);border: 0 solid hsla(0,0%,100%,.5) }
.load_more .list1 li:hover span{color: hsla(213,0%,100%,1);font-size: 1.5rem;}
.load_more .list1 li:hover p{color: hsla(213,0%,100%,1);font-size: 1rem;}*/
/*1111111111111*/
/*.load_more .list1 li:hover .al-abs{background:#ff0000a3;border: 0px solid hsla(0,0%,100%,.5) }
*/
/*2222222222*/
.load_more .al-list {
	padding-top: 2rem;
	font-size: 0;
}
.load_more .list1 li{ display: inline-block; width: calc(33.33% - 10px);  transition: all .4s; margin:0 5px ;display:inline-block;overflow:hidden; margin-bottom:15px;}
.load_more .list1 li a{display:block;position: relative;left:0;top:0; text-align:center; overflow: hidden;}
	.load_more .list1 li a span {
		text-align: left;
		font-size: 18px
	}
	.load_more .list1 li a p {
		text-align: left;
		font-size: 14px;
		text-indent:2em
	}

.load_more .list1 li img{display:block}
/*.load_more .list1 li .al-abs{width:100%;height:100%;position:absolute;left:0;top:0}
*//*.load_more .list1 .al-abs span {
	transition: all .4s ease .2s;
	position: absolute;
	left: 50%;
	font-size: 3rem;
	top: calc(50% - 10px);
	transform: translate(-50%,-50%);
	width: 100%;
	color: hsla(213,0%,100%,0);
	font-weight: normal
}
.load_more .list1 .al-abs p{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 1.5rem; top: 50%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0); padding-top:45px}
*/
/*.load_more .list1 li:hover img{ transform: scale(1.2,1.2);}
*/
/*.load_more .list1 li:hover .al-abs{background: rgba(0,0,0,.6);border: 0 solid hsla(0,0%,100%,.5) }
*/
/*.load_more .list1 li:hover span{font-size: 1.5rem;}
.load_more .list1 li:hover p {
	font-size: 1rem;
}
*//*.img_box {
	position: absolute;
	top: 0;
	left: 0;
	overflow:hidden;border:2px solid red
}
*//*.al-abs1 {
	position: absolute;
	top: 295px;
	left: 0;
	height:50px;
	background:red
}*/
.page-ajax {
	text-align: center;
}
.page-ajax a{ font-size: 1rem; display: inline-block; padding: 1rem 2rem 1rem; position: relative;}
.page-ajax a:hover{ color: #00A8DF;}
.page-ajax a i{ display: inline-block;}
.page-ajax a i:after{
	content: '';
	border: 5px solid transparent;
	border-top-color: #666;
	width: 0;
	height: 0;
	position: absolute;
	left: 50%;
	bottom: 0;
	margin-left: -5px;	
}
.page-ajax a:hover i:after{ border-top-color: #00A8DF;}

.al-tit{ padding: 2rem 0 1rem; text-align: left;}
.al-tit h1{ font-size: 1.75rem;font-weight: 400;}
.al-tit h1 span{ display: inline-block; margin-left: 1rem; font-size: 0.875rem; color: #999; }
.al-dbox{ padding-top: 2rem;}

.l-box{
	width: 100%;
    background: #fff;
    box-shadow: 0 0 6px rgba(0,0,0,.1);
    padding: 1.5rem;
}

.r-box{
	    background: #fff;
    box-shadow: 0 0 6px rgba(0,0,0,.1);
    padding: 1.5rem;
    width: 25%;
}
.r-box .al-list li{ width: 100%; margin-top:15px; margin-bottom:20px}


.product-title {
    font-size: 1rem;
    line-height: 1.875;
    font-weight: 400;
    border-bottom: 1px solid #e4eaec;
    padding: 0 0 .5rem 1rem;
    position: relative;
}
.product-title:before{
	content: '';
	 width: 7rem;
	 height: 2px;
	 background: #333;
	 position: absolute;
	 left: 0;
	 bottom: -1px;
}

.text-box{ padding-top: 1rem; font-size: .875rem;}
	div.text-box p {
		padding: 0 0.2rem !important
	}
.xm-mx{ padding-top: 1rem;}
.mt1{ margin-top: 1rem;}

.new-list{ }
.new-list li{color: #666;  padding: 1.5rem 0; border-bottom: 1px #ddd solid;}
.new-list li span{ margin-right: 1rem; color: #666; text-align: center; background: #f2f2f2;  float: left; width: 5.25rem; height: 5.25rem;}
.new-list li span strong{ font-size: 1.5rem; padding-top: 1rem;}
.new-list li p{ font-size: .875rem; height: 3.125rem; overflow: hidden;text-indent:2em}
.new-list li a{padding-bottom: .3rem;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size: 1.125rem; color: #333; display: block;}
.new-list li a:hover{ color:#00A8DF;}

.n-title{ padding-bottom: 1.2rem; border-bottom: 1px #DFDFDF solid; text-align: center;}
.n-title h1{ font-size: 1.8rem; font-weight: 400;}
.n-title .inf{ color: #999; font-size: .875rem;}

.news-txt{ padding-top: 1.5rem; font-size: 0.875rem;}
.news-txt img{ display: inline-block; margin: .5rem auto;}

.ab-txt .value-box{ background-attachment: inherit; background-size:cover;}
.txt01{ max-width: 50rem; margin: 2rem auto; text-align: left; font-size: .875rem; line-height: 2rem;}
	.map {
		margin: 2rem 0;
	}
.nav-logo{ position: absolute; right: 2rem; top: 1rem; display: none;}
.nav-logo span{ width:30px; height: 4px; background: #333; display: block; margin-bottom: 6px;}

/*.mobile-nav{ height: 100%; background: #242424; position: fixed; right: -200px; top: 3.75rem; width: 200px; overflow: hidden; display: none ;}
.mobile-nav ul{ padding: 15px 0;}
.mobile-nav a{ display: block; border-bottom:1px #666 solid; height: 40px; line-height: 40px; padding-left: 5px; color: #fff; padding: 0 25px; font-size: 15px;}
.mobile-nav a:active{ background: #fff; color: #242424;}*/




@media only screen and (max-width: 50em) {
	.brand-box h2{ font-size: 1.5rem; font-weight: 400;}
	.value-txt{ width: 70%; margin: 0 auto;}
	.lx-list li{ width: calc(50% - .5rem); margin-bottom: 1rem;}
	.lx-list li:nth-child(3){
		margin-left: 0;
	}	
	.ab-btn{text-align: center;}
	.ab-btn a{ width: 50%; max-width: 10rem;}
    .al-list li:hover span{color: hsla(213,0%,100%,1);font-size: 1.2rem;}
.al-list li:hover p{color: hsla(213,0%,100%,1);font-size: 0.8rem;}
/*.red .al-abs span{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 3rem; top: 35%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);font-weight:normal}
.red .al-abs p{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 1.5rem; top: 50%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);}
*/

	.al-list li{ width: calc(50% - 10px);}
	.l-box{ width: 100%;padding: 1rem;}
	.r-box{ width: 100%; margin-top: 1rem;padding: 1rem;}
	/*.al-dbox .al-list li{ width: 50%;}*/
}
@media only screen and (max-width:550px) {
    .al-list li:hover span{color: hsla(213,0%,100%,1);font-size: 1.2rem;}
.al-list li:hover p{color: hsla(213,0%,100%,1);font-size: 0.8rem;}
.red .al-abs span{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 3rem; top: 30%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);font-weight:normal}
.red .al-abs p{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 1.5rem; top: 65%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);}
	.index_new_list .item {
		width: 100%;
		float: left;
		overflow: hidden
	}


	.al-list li{ width: calc(50% - 10px);}
       .load_more .list1 li{width:calc(100% - 10px)}
	.banners .owl-item img {
		width: 100%;
		height: 230px !important;
		object-fit: cover
	}

	.index_new .owl-carousel .owl-item img {
		width: 100%;
		height: 193px !important;
		object-fit: cover;
		overflow: hidden
	}

	.index_new .item {
		height: 355px !important;
		overflow: hidden
	}

}
@media only screen and (min-width:780px) and (max-width: 1050px) {
.red .al-abs span{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 3rem; top: 30%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);font-weight:normal}
.red .al-abs p{transition: all .4s ease .2s; position: absolute; left: 50%;font-size: 1.5rem; top: 60%; transform: translate(-50%,-50%); width: 100%; color: hsla(213,0%,100%,0);}
    .al-list li:hover span{color: hsla(213,0%,100%,1);font-size: 1.2rem;}
	.index_new_list .item {
		width: 50%;
		float: left;
		overflow: hidden
	}

}

@media only screen and (min-width: 30.0625em) and (max-width: 47em) {
	
	.ab-btn{text-align: center;}
	.ab-btn a{ width: 50%;}
	.brand-box h2{ line-height: 3rem;}
	.brand-box h2 span{ display: none;}
	.brand-box h2 strong{ display: inline-block;font-weight: 400;}
	.value-txt{ width: 100%;}
	.value-txt h2{ font-size: 2rem; text-align:center}
	.b-nav a{ padding: 0 1rem;}
	.sub-list li{ width: 50%; margin-bottom: 1rem; }
	.sub-list li a{ width: 80%;}
	/*.nav{ display: none;}
	.nav-logo{ display: block;}
	.navbar{ height: 3.75rem;}*/
	.logo img{ height: 2.75rem;}
	.ad{ margin-top: 5rem;}
/*	.header,.fl,.fl img{height:3.75rem !important;}
*/}

@media only screen and (max-width: 38em) {
	/*.sy-abtxt{ width: 100%;}
	.sy-abtxt{ width: 100%; font-size: .875rem;}*/
	.brand-box h2{ line-height: 3rem;}
	.brand-box h2 span{ display: none;}
	.brand-box h2 strong{ display: inline-block;font-weight: 400;}
	.value-txt{ width: 100%;}
	.value-txt h2{ font-size: 1.5rem;}
	.b-nav a{ padding: 0 .5rem;}
	.value-txt{  padding:3rem 1rem}
	.lx-list li{ width: 100%; margin-left: 0 !important;}
	.lx-box{ padding-bottom: 2rem;}
	.title{ padding-top: 1rem; margin-bottom: 1rem;}
	.title h2{ font-size: 1.4rem; }
	.programme-box,.advantage-box,.team-box{ padding-bottom: 1rem;}
	.brand-box .box1{ padding: 2rem 1rem;}
	.sub-list li{ width: 50%; margin-bottom: 1rem;}
	.sub-list li a{ width: 90%; padding: .3rem 0;}
	.new-list li span{ display: none;}
	.new-list li{ padding: 1rem 0;}
	/*.nav{ display: none;}
	.nav-logo{ display: block;}
	.navbar{ height: 3.75rem;}
	.logo img{ height: 2.75rem;}*/
	.ad{ margin-top: 3.75rem;}
	.service-list li,.advantage-list li{ margin-top: -2.5rem;}
	.logo img{ height: 2.75rem;}
	.ad{ margin-top: 5rem;}
/*	.header,.fl,.fl img{height:3.75rem !important;}
*/}

@media only screen and (max-width: 21em) {
	.b-nav { display: none;}
	.al-list li{ width: 100%;}
	.al-dbox .al-list li{ width: 100%;}

}
.newPage{width:100%;overflow:hidden;text-align:center; padding:0;margin-top:20px}
.newPage strong{display:inline-block;overflow:hidden; padding:0 10px ;height:30px; line-height:30px;margin:5px;font-weight:normal;color:#999;font-size:0.7rem}
.newPage span{display:inline-block;overflow:hidden; padding:0 10px ;border:1px solid #bbb;height:30px; line-height:25px;margin:5px;font-size:0.9rem;color:#888; border-radius:3px;}
.newPage a{display:inline-block;overflow:hidden; padding:0 10px ;border:1px solid #bbb;height:30px; line-height:25px;margin:5px;font-size:0.9rem;color:#888; border-radius:3px;}
.newPage span:hover{background:#00A8DF;color:#fff;border:1px solid #00A8DF}
.newPage a:hover{background:#00A8DF;color:#fff;border:1px solid #00A8DF}
@media screen and (max-width: 1230px) {
	.minbanner .text {
		width: 100%;
		height: 100px;
		position: absolute;
		left: 20px !important;
		top: 20px !important;
		color: #fff;
		z-index: 80;
		margin: 0 auto;
	}

	.minbanner {
		width: 100%;
		overflow: hidden;
		position: relative;
		left: 0;
		top: 0;
		margin-top: 5rem;
		height: 140px !important
	}


.minbanner img {
	width: 100%;
	height: 140px !important;
	position: absolute;
	left: 0;
	top: 0;
	object-fit:cover
}
}

.index_new .item{height:355px !important;}
.index_new .owl-carousel .owl-item img {
	width: 100%;
	height: 193px !important;
	object-fit: cover;
}




@media screen and (max-width: 700px) {

	.banners .owl-item img {
		width: 100%;
		height: 230px !important;
		object-fit: cover
	}
	.index_new .owl-carousel .owl-item img {
		width: 100%;
		height: 193px !important;
		object-fit: cover;
		overflow:hidden
	}
	.index_new .item {
		height: 355px !important;
		overflow:hidden
	}

}
@media screen and (max-width:800px) {

	.load_more .list1 li {
		display: inline-block;
		width: calc(50% - 10px);
		transition: all .4s;
		margin: 0 5px;
		display: inline-block;
		overflow: hidden;
	}
}

@media screen and (max-width: 500px) {
	.load_more .list1 li {
		display: inline-block;
		width: calc(100% - 10px);
		transition: all .4s;
		margin: 0 5px;
		display: inline-block;
		overflow: hidden;
	}

	.banners .owl-item img {
		width: 100%;
		height: 180px !important;
		object-fit: cover
	}

	.index_new .owl-carousel .owl-item img {
		width: 100%;
		height: 193px !important;
		object-fit: cover;
		overflow: hidden
	}

	.index_new .item {
		height: 355px !important;
		overflow: hidden
	}
}

@media screen and (max-width: 1300px) {
	.contacts {
		width: 86%;
		overflow: hidden;
		margin: 0 auto
	}
}
/*@media screen and (max-width: 1230px) {
	.minbanner .text {
		max-width: 100%;
	}
}
*/



/*Ö÷Ò³Ñ¡Ïî¿¨×îÏÈ
*/
#Tab ul{ margin:0; list-style:none; width:100%; overflow:hidden;text-align:center}
#Tab{ overflow:hidden;width:100%;padding-bottom:1.5rem}
#Tab li{display: inline-block;padding: .3rem 2rem;border: 1px solid #dfdfdf;margin: 0 0.5rem;border-radius: 5rem; }
/*#bottom{ padding-left:10px;}
*/
#bottom .tablist tr td{ font-size:12px; line-height:200%; text-align:center; height:30px; line-height:30px; color:#333; border-color:#ccc}
.tablist{ display:none; line-height:30px;border-color:#ccc }
.tab_silde{ width:100%; overflow:hidden}
#Tab li.current{background: #00A8DF;color: #fff;border-color: #00A8DF;}


/*Ö÷Ò³Ñ¡Ïî¿¨¿¢ÊÂ*/
@media screen and (max-width:980px){
	.load_more .product_list li {
		width: calc(50% - 10px) !important
	}
	.load_more .list1 li {
		width: calc(50% - 10px) !important
	}
}
@media screen and (max-width:600px) {
	.tablist .load_more .product_list li {
		width: calc(100% - 10px) !important
	}
	.load_more .list1 li {
		width: calc(100% - 10px) !important
	}
}

@media screen and (max-width:900px) {
	.index_about {
		width: 100%;
		
		overflow: hidden;
	}
		.index_about div.about_text {
			line-height: 30px;
			height: 90px;
			overflow: hidden;
			display: block;
			margin: 20px 10% 20px 10%;
			font-size: 20px;
			text-indent: 2em;
			text-align: justify
		}
	.about_button {
		width: 100%;
		overflow: hidden;
		margin-bottom:30px
	}
		.about_button a {
			height: 40px;
			line-height: 40px;
			background: #4395FF;
			color: #fff;
			display: block;
			width: 120px;
			margin: 0 auto;
			text-align: center;
			font-size: 16px;
			border-radius: 4px
		}

}

@media screen and (max-width:690px) {
	.index_about {
		width: 100%;
		overflow: hidden;
	}

		.index_about div.about_text {
			line-height: 30px;
			height: 120px;
			overflow: hidden;
			display: block;
			margin: 20px 10% 20px 10%;
			font-size: 20px;
			text-indent: 2em;
			text-align: justify
		}

}

@media screen and (max-width:520px) {
	.index_about {
		width: 100%;
		overflow: hidden;
	}

		.index_about div.about_text {
			line-height: 30px;
			height: 160px;
			overflow: hidden;
			display: block;
			margin: 20px 10% 20px 10%;
			font-size: 20px;
			text-indent: 2em;
			text-align: justify
		}
}
@media screen and (max-width:410px) {
	.index_about {
		width: 100%;
		overflow: hidden;
	}

		.index_about div.about_text {
			line-height: 30px;
			height: 190px;
			overflow: hidden;
			display: block;
			margin: 20px 10% 20px 10%;
			font-size: 20px;
			text-indent: 2em;
			text-align: justify
		}
}

@media screen and (max-width:340px) {
	.index_about {
		width: 100%;
		overflow: hidden;
	}

		.index_about div.about_text {
			line-height: 30px;
			height: 230px;
			overflow: hidden;
			display: block;
			margin: 20px 10% 20px 10%;
			font-size: 20px;
			text-indent: 2em;
			text-align: justify
		}
}






















<!--ºÄÊ±1755872431.9264Ãë-->