@charset "utf-8";
/* CSS Document */
*{ margin:0 auto; padding:0;}
html{overflow-x:hidden;}
body{ width:100%; height:auto !important; max-width:640px !important; margin:auto !important; background-color: #fff !important;}
.sb_zc{ text-align:center; height:auto; overflow:auto;}
ol,ul,li{ list-style:none;}
.hero-gallery{ margin-top: 50px; }
.sb_zc ul{ width:100%; overflow:auto;padding: 10px 0;}
.sb_zc ul li{ width:47%; float:left; margin:0 0 15px 2%;max-height:210px;box-shadow: 0 2px 8px 0 #dadee3; padding: 20px 0; border-radius:10px;}
.sb_zc ul li h3{margin:5px 0px;color: #444;font-size: 16px;font-weight: 600;}
.sb_zc ul li p{ margin:5px 10px; color:#3d3d3d;} 
.title{ color:#3d3d3d; font-size:24px; margin:10px 0; text-align:center}
.nav{ width:100%; height:auto; overflow:auto;}
.nav ul{ overflow:auto; height:auto; margin:10px 5px 30px; height:32px; line-height:30px;}
.nav ul li{ float:left; width:33.3%; text-align:center}
.nav ul li img{ width:20px; margin-left:5px;vertical-align: middle;}
.nav ul li span{ font-size:12px; line-height:30px;color: #444;}
	.container{
		max-width: 800px;
		margin: 0 auto 80px;
		height:auto;
		
	}
	.slide{
		width: 100%;
		min-height: 180px;
		position: relative;
		overflow: hidden;
	}
	.slide .img{
		overflow: hidden;
		position: absolute;
		transition: width 0.4s,height 0.4s,top 0.4s,left 0.4s,z-index 0.4s;
		background-color:#fff;
		box-shadow: 0 2px 12px 0 #dadee3;
		text-align:center;
	}
	.slide .img img{
		width:20%;
		margin:20px 40% 5px;
		/*width: calc(100% - 14px);
		height: calc(100% - 14px);
		margin: 7px;*/
	}
	.slide .img1{
		width: 40%;
		height: 40%;
		top: 30%;
		left: -50%;
		z-index: 1;
	}
	.slide .img2{
		width: 30%;
		height: 200px;
		top: 20%;
		left: 5%;
		z-index: 2;
	}
	.slide .img3{
		width: 40%;
		height: 240px;
		top: 10%;
		left: 30%;
		z-index: 3;
	}
	.slide .img4{
		width: 30%;
		height:200px;
		top: 20%;
		left: 65%;
		z-index: 2;
	}
	.slide .img4{font-size:12px;}
	.slide .img4 h2{font-size:14px;}
	.slide .img2 h2{font-size:14px;}
	
	.slide .img2{font-size:12px;}
	.slide .img5{
		width: 40%;
		height: 40%;
		top: 30%;
		left: 110%;
		z-index: 1;
	}
	.slide-bt{
		position: absolute;
		left: 50%;
		bottom: 0%;
		z-index: 10;
	}
	.slide-bt span{
		width: 24px;
		height: 8px;
		background: #c9caca;
		float: left;
		margin: 5px;
		border-radius: 4px;
	}
	.slide .slide-bt .on{
		background: #ffd200;
	}
	button{
		width: 50px;
		margin: 20px;
	}
.img h2{color:#3d3d3d; font-size:18px; margin-bottom:5px;}
.img p{font-size:12px;text-overflow:ellipsis;overflow:hidden;word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */ font-weight:500;font-size: 12px;color: #000;}
.img a{border-radius:5px; width:60%; font-size:12px; margin:15px 20%; display:block; background-color:#3479f7; color:#fff;}
.img3 a{ margin-top:15px;}
.mb{ margin-bottom:30px}
.mt{ margin-top:30px}
.bg{ background-color:#3479f7;}
.sh{ color:#FFF; font-size:18px; font-weight:800; float:left; margin:10px 10px;border-left:1px solid #FFF; border-right:1px solid #FFF; padding:5px;}
.sh_rx{ color:#FFF; font-size:14px; text-align:left; display:block; margin-top:10px; line-height:20px;}
.yw { width:100%;}
.yw ul li{ width:90%; padding:0; margin:10px 5% 0; border:solid 1px #3479f7; border-radius:0;}
.yw ul li p{ float:left; color:#3479f7; font-size:18px;  }
.yw ul li span{height:39px; float:left; line-height:39px;}
.yw ul li a{ float: right; color:#FFF; display:block; height:30px ; margin:4.5px 10px; padding:3px; display: inline-block; border:solid 1px #3479f7; background-color:#2b86f7;}
.zxdh{ width:80%; margin:30px 10%;border:solid 1px #3479f7; height:30px; line-height:30px;}
.zxdh p{ float:left; color:#2b86f7; margin-left:10px;}
.zxdh a{ height:30px; background-color:#2b86f7; color:#FFF; padding:0 5px; float:right;}


@charset "utf-8";
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;text-decoration:none;}
body{font:12px/180% Arial, Helvetica, sans-serif ,"新宋体";}

.clearfix:after{content:".";display:block;height:0;visibility:hidden}
.clearfix{display:inline-block}
* html .clearfix{height:1%}
.clearfix{display:block}
.clearfix:after,.fix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{zoom:1}

.mr20{margin-right:20px}

.zq-icon{display:inline-block;background:url(../yk/images/icon.png) no-repeat;}
.icon40x40{width:40px;height:40px}
.crad-area-icon1{background-position:0 0}
.crad-area-icon2{background-position:-40px 0}
.crad-area-icon3{background-position:-80px 0}
.crad-area-icon4{background-position:-120px 0}

.card-area{
	margin: 82px auto 0;
	height: 560px;
	width: 100%;
	position: relative;
	max-width: 640px;
	background-color: red;
	padding:0 10px;
}
.card-area .bg-e8e8e8{background:#e8e8e8}
.card-area .bg-e1e1e1{background:#e1e1e1}
.card-area .card-item{z-index:4;transition:all .3s cubic-bezier(.4,0,.2,1),z-index 0s .12s;position:relative;float:left;width:25%;height:521px;background-color:transparent}
/*.card-area .card-item+.card-item{margin-left:-1px}*/
.card-area .card-item .card{transition:all .3s cubic-bezier(.4,0,.2,1),z-index 0s .12s;width:100%;height:100%;text-align:center;background:#fff}
.card-area .card-item .card .card-content{width:100%;line-height:2}
.card-area .card-item .card .card-content.content-first{transition:all .12s cubic-bezier(.4,0,.2,1) .18s;z-index:3;opacity:1;filter:alpha(opacity=100);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(100))}
.card-area .card-item .card .card-content.content-second{transition:all .12s cubic-bezier(.4,0,.2,1) 0s;z-index:2;opacity:0;filter:alpha(opacity=0);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(0));line-height:2}
.card-area .card-item .card .card-content.content-second li{float:left;width:50%}
.card-area .card-item .card .card-content,.card-area .card-item .card .card-title{position:absolute;left:0;right:0;z-index:1}
.card-area .card-item .card .card-title{padding-top:1px;transition:all .3s cubic-bezier(.4,0,.2,1),z-index 0s .12s;height:145px;line-height:26px;font-size:14px;top:0;background:#1b77b9;border-left:1px solid #3285c0}
.card-area .card-item .card .card-title .content{position:absolute;bottom:-2px;width:100%}
.card-area .card-item .card .card-title h1{font-size:22px;font-weight:700;color:#d9efff;margin-bottom:0}
.card-area .card-item .card .card-title .short-info{color:#8dbbdc;font-size:14px;margin-top:0;margin-bottom:20px}
.card-area .card-item .card .card-title .zq-product-img{width:40px;height:40px;margin:10px auto;position:relative}
.card-area .card-item .card .card-title .zq-product-img img{position:absolute;left:0;width:100%}
.card-area .card-item .card .card-title .zq-product-img .un-hover{z-index:1;opacity:1;filter:alpha(opacity=100);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(100))}
.card-area .card-item .card .card-title .zq-product-img .with-hover{z-index:2;opacity:0;filter:alpha(opacity=0);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(0))}
.card-area .card-item .card .card-title .short-info,.card-area .card-item .card .card-title .zq-product-img img,.card-area .card-item .card .card-title h1{transition:all .15s cubic-bezier(.4,0,.2,1) 0s}
.card-area .card-item .card .card-content{height:376px;position:absolute;top:145px}
.card-area .card-item .card .card-content.content-first .content-first-list{width:100%;max-width:250px;font-size:16px;color:#373d41;margin-top:47px;margin-bottom:47px}
.card-area .card-item .card .card-content.content-first .content-first-list li{margin-bottom:30px}
.card-area .card-item .card .card-content.content-second{width:90%;left:25px;font-size:14px;color:#a9b0b4;text-align:left;padding-top:26px}
.card-area .card-item .card .card-content.content-second .main-head{color:#3db1ea;font-size:18px;line-height:28px;margin-bottom:10px}
.card-area .card-item .card .card-content.content-second p{margin:5px 0}
.card-area .card-item .card .card-content.content-second .main-tip{color:#232933}
.card-area .card-item .card .card-content.content-second .main-desc{color:#8c8c8c;font-size:12px;line-height:22px}
.card-area .card-item .card .card-content.content-second .main-btn{cursor:pointer;width:160px;height:38px;font-size:16px!important;color:#fff;margin-top:22px;margin-bottom:33px;border-radius:19px;background:#3db1ea;border:none;transition:color .3s ease-in-out,background .3s ease-in-out}
.card-area .card-item .card .card-content.content-second .main-btn:hover{color:#fff;background:#1b77b9}
.card-area .card-item .card .card-content.content-second .main-white-btn{cursor:pointer;width:160px;height:36px;border:1px solid #3db1ea;font-size:16px!important;color:#3db1ea;margin-top:22px;margin-bottom:33px;border-radius:19px;background:#fff;transition:color .3s ease-in-out,background .3s ease-in-out}
.card-area .card-item .card .card-content.content-second .main-white-btn:hover{color:#fff;background:#3db1ea}
.card-area .card-item .card .card-content .other-info{width:105%;height:70px;overflow:hidden;line-height:22px;padding-top:20px;font-size:12px}
.card-area .card-item .card .card-content .other-info .other-info-list{width:27%;height:70px;background:#f2f2f2;margin-right:25px;padding:0 0 0 10px;position:relative}
.card-area .card-item .card .card-content .other-info .other-info-list .c-a-arrow{position:absolute;right:10px;top:15px;background-position:-200px 0}
.card-area .card-item .card .card-content .other-info .other-info-list:hover{background:#3db1ea}.card-area .card-item .card .card-content .other-info .other-info-list:hover .c-a-arrow{background-position:-200px -17px}
.card-area .card-item .card .card-content .other-info .other-info-list:hover .other-desc,.card-area .card-item .card .card-content .other-info .other-info-list:hover .other-head{color:#fff}
.card-area .card-item .card .card-content .other-info .other-info-list .list-context{color:#00c1de}
.card-area .card-item .card .card-content .other-info .other-head{font-size:16px;font-weight:400;color:#000;margin:13px 0 0 0;}
.card-area .card-item .card .card-content .other-info .other-desc{margin-top:2px;font-size:12px;color:#999}
.card-area .card-item.active{z-index:6;box-shadow:0 0 30px rgba(0,0,0,.2);width:50%;height:535px}
.card-area .card-item.active .card .card-title{background-color:#3db1ea;height:159px;top:-15px;border:none}
.card-area .card-item.active .card .card-title .short-info{color:#9ed8f5}
.card-area .card-item.active .card .card-title h1{color:#fff}
.card-area .card-item.active .card .card-content.content-first{transition:all .12s cubic-bezier(.4,0,.2,1) 0s;z-index:2;opacity:0;filter:alpha(opacity=0);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(0))}
.card-area .card-item.active .card .card-content.content-second{transition:all .12s cubic-bezier(.4,0,.2,1) .18s;z-index:3;opacity:1;filter:alpha(opacity=100);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=(100))}



.sb-hot .item{
	background-color: #34aefb;
	height: 120px;
	padding: 15px 0;
	color: #fff;
	border-radius: 3px;
}
.sb-hot .item h2{color: #fff;font-size: 14px;}
.sb-hot .item span {
    height: 3px;
    width: 20%;
    margin: 10px auto;
    background-color: #fff;
    display: block;
}
.sb-hot .item img{
	width: 50px;
	height: 50px;
}

.bg-fff{
	background-color: #f5f5f5 !important;
}


.mt30{
	margin-top: 30px;
}


.text h2{
	font-weight: 800;
	font-size: 20px;
}

.ul-col-3{
	width: 100%;
}
.ul-col-3 li{
	width: 25% !important;
	float: left;
	text-align: center;
	margin-top:20px;
}
.ul-col-3 li span{
	display: block;
	color: #707070;
}
.ul-col-3 li img{
	width: 50%;
}
.button{
	width: 60%;
	background-color: red;
	border-radius: 28px;
	display: inline-block;
	margin: 20px 20%;
	padding: 5px;
	text-align: center;
	color: #fff;
}
.about{
	color: #010101;
	padding-bottom: 0;
}