.sub-banner{height: 400px;background-color: #fff;background-repeat: no-repeat;background-position: center top;position: relative}
.sub-banner h2{
	font-family: 'dincond-medium';
	font-size: 60px;
	color:#fff;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 2px;
	position:absolute;
	bottom: 30px;}
.sub-banner .container{position: relative;height: 400px;}

/*sub-nav*/
.sub-nav{position:absolute;height: 45px;bottom: -30px;left:50%;background-color: #fff;
-webkit-box-shadow: 0 12px 40px 6px rgba(0, 176, 211, 0.1);
box-shadow: 0 12px 40px 6px rgba(0, 176, 211, 0.1);}
.sub-nav li{float: left}
.sub-nav li a{display: block;line-height: 45px;text-align: center;font-size: 16px;color: #333;padding: 0 30px;border-right: 1px solid #efefef;text-decoration: none;}
.sub-nav li a:hover,.sub-nav li a.cur{
	color: #fff;
	-webkit-background-image: linear-gradient(30deg, #0180b4 0%, #3abfc4 100%);
    background-image: linear-gradient(30deg, #0180b4 0%, #3abfc4 100%);}

/*index-ai*/
.index-ai{background-color: #f8f8f8; padding: 80px 0 80px 0;background-image: url(../images/bg2.jpg);background-repeat: no-repeat;background-position: center bottom;}
.index-vr{background-color: #fff; padding: 80px 0 80px 0;}
.ai-ul{padding: 30px 0 30px 0;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	-ms-justify-content:space-between;
	-o-justify-content:space-between;
	justify-content:space-between;
}
.ai-ul li{width: 32%;margin-right: 2%;margin-bottom: 2%;background-color: #fff;border-radius: 6px;overflow: hidden;position: relative;}
.ai-ul li:hover{
	-webkit-box-shadow: 0 10px 30px rgba(0,0,0,0.15);
	box-shadow: 0 10px 30px rgba(0,0,0,0.15);
	-webkit-transform:translate3d(0, -10px, 0);
	transform:translate3d(0, -10px, 0);
	-moz-transform:translate3d(0, -10px, 0);
	-ms-transform:translate3d(0, -10px, 0);
	-o-transform:translate3d(0, -10px, 0);
}
.ai-ul li:nth-child(3){margin-right: 0;}
.ai-ul li .ico{text-align: center;}
.ai-ul li .ico img{width: 100%;}
.ai-ul li .ico i{}
.ai-ul li .info{padding: 0 20px;position: absolute;width: 100%;bottom: 0;height: 35%;background-color: rgba(0,0,0,0.4);overflow: hidden;}
.ai-ul li .info p{font-size: 16px;line-height: 22px;color: #fff;padding: 10px 0;letter-spacing: 1px;}

.ai-pro-list{padding: 30px 0 30px 0;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	-ms-justify-content:space-between;
	-o-justify-content:space-between;
	justify-content:space-between;
}
.ai-pro-list li{width: 23.5%;margin-right: 2%;margin-bottom: 2%;background-color: #fff;border-radius: 6px;padding: 10px 0;}
.ai-pro-list li:hover{
	-webkit-box-shadow: 0 20px 40px rgba(0,0,0,0.1);
	box-shadow: 0 20px 40px rgba(0,0,0,0.1);
	-webkit-transform:translate3d(0, -10px, 0);
	transform:translate3d(0, -10px, 0);
	-moz-transform:translate3d(0, -10px, 0);
	-ms-transform:translate3d(0, -10px, 0);
	-o-transform:translate3d(0, -10px, 0);
}
.ai-pro-list li:nth-child(4){margin-right: 0;}
.ai-pro-list li .ico{text-align: center;height: 150px;}
.ai-pro-list li .ico img{width: 40%;margin: 20px auto;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	filter: gray;
	opacity:0.5;
}
.ai-pro-list li .ico i{}
.ai-pro-list li .info{padding: 0 20px;text-align: center;margin: 0 0 20px 0}
.ai-pro-list li .info a{width: 50%;margin: 10px auto;display: block;border-radius: 4px;background-color: #0180b4;color: #fff;line-height: 32px;}
.ai-pro-list li .info a:hover{color: #fff;text-decoration: none;background-color: #3abfc4;}
.ai-pro-list li .info h4{font-size: 18px;color:#555;}
.ai-pro-list li:hover .info h4{color:#0180b4}
.ai-pro-list li .info p{font-size: 14px;line-height: 22px;height: 70px;overflow: hidden;color: #999}

.index-ai .more{display: block;width: 140px;line-height: 35px;border-radius: 4px;background-color: #009cd5;text-align: center;font-size: 14px;color: #fff;margin:0  auto}
.index-ai .more:hover{text-decoration: none;background-color: #3abfc4}

.vr-ul{padding: 30px 0 30px 0;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	-ms-justify-content:space-between;
	-o-justify-content:space-between;
	justify-content:space-between;
}
.vr-ul li{width: 30.66%;margin-right: 4%;margin-bottom: 2%;background-color: #fff;border-radius: 6px;overflow: hidden;position: relative;}
.vr-ul li:hover{
	-webkit-box-shadow: 0 10px 30px rgba(0,0,0,0.15);
	box-shadow: 0 10px 30px rgba(0,0,0,0.15);
	-webkit-transform:translate3d(0, -10px, 0);
	transform:translate3d(0, -10px, 0);
	-moz-transform:translate3d(0, -10px, 0);
	-ms-transform:translate3d(0, -10px, 0);
	-o-transform:translate3d(0, -10px, 0);
}
.vr-ul li:nth-child(3){margin-right: 0;}
.vr-ul li .ico{text-align: center;}
.vr-ul li .ico img{width: 100%;}
.vr-ul li .ico i{}
.vr-ul li .info{padding: 0 20px;position: absolute;width: 100%;bottom: 0;height: 20%;background-color: rgba(0,0,0,0.4);overflow: hidden;}
.vr-ul li .info h4{font-size: 18px;line-height: 25px;color: #fff;padding: 5px 0;letter-spacing: 2px;}
.index-vr .more{display: block;width: 140px;line-height: 35px;border-radius: 4px;background-color: #009cd5;text-align: center;font-size: 14px;color: #fff;margin:0  auto}
.index-vr .more:hover{text-decoration: none;background-color: #3abfc4}

.vr-text-ul{
	padding: 30px 0 30px 0;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	-ms-justify-content:space-between;
	-o-justify-content:space-between;
	justify-content:space-between;
	border-top: 1px solid #ddd;
}
.vr-text-ul li{width: 25%;}
.vr-text-ul li .info{width: 80%;margin: 0 auto;}
.vr-text-ul li .info h4{font-size: 22px;font-weight: 600;color: #444;margin-bottom: 20px;}
.vr-text-ul li .info p{font-size: 14px;color: #999;line-height: 25px;}