@charset "utf-8";
.menu ul li.sy{
	border-bottom: 2px solid #0da5ba;
}
/*banner-pc*/
.banner-pc{
	width: 100%;
	height: 463px; 
	overflow: hidden;
}       
	.banner-pc .index{
		width: 100%;
		overflow: hidden;
	}
		.Switch {
			width:100%; 
			overflow: hidden;			
			position: relative;
		}
			.Switch ul.Switch-index{
				position: relative; 
				width: 1920px; 
				height: 463px; 
				left: 50%;
				margin-left: -960px; 
			}
				.Switch ul.Switch-index li a img{
					display: block;
					width: 1920px;
					height:463px;
				}
			/*数字按钮样式*/
			.Switch .num {
				width: 85px; height: 15px; overflow:hidden; 
				position: absolute; bottom:12px; left: 50%; margin-left: -42px; zoom:1; z-index:3; }
				.Switch .num li {
					width: 15px; 
					height: 15px;
					cursor:pointer; 
					float: left;
					text-indent: -99999px;
					background: #fff; 
					margin: 0 5px; 
					border-radius:100%;
					transition: all 0.5s ease;
				}
				.Switch .num li.on{width: 25px; background: #0da5ba;border-radius:8px;}
			/*上一个 下一个*/
			.Switch .prev,
			.Switch .next {
				display: block; width: 45px; height: 100px; 
				background: url(../images/Switch-btn.png) no-repeat; position: relative; z-index: 1;}
			.Switch .prev {float: left; margin-top: -284px; margin-left: 25px;}		
			.Switch .next {float: right; background-position: right; margin-top: -284px; margin-right: 25px;}
@media only screen and (min-width: 640px) {
	.banner-phone {
		display: none;
	}
}
@media only screen and (max-width: 640px) {
	.banner-pc{
		display: none;
	}
	/*banner-phone*/	
	.banner-phone{
		width: 100%;
		margin-top: 60px;
	}
	.box_swipe {
		overflow: hidden;
		position: relative;
		visibility: visible;
	}
		/*ul li*/
		.box_swipe ul {
			overflow: hidden;
			position: relative;
			width: 640px; 
		}
			.box_swipe ul> li {
				float: left;
				width: 100%;
				position: relative;
				display: table-cell; 
				vertical-align: top;
			}
			.box_swipe ul> li a {
				color: #FFF;
				text-decoration: none;
			}
				.box_swipe ul> li a img{
					display: block;
					width: 100%;
				}
		/*ol li*/
		.box_swipe>ol {
			height: 20px;
			position: absolute;
			z-index: 0;
			bottom: 5px;
			width: 100%;
			text-align: center;
		}
			.box_swipe>ol>li {
				display: inline-block;
				margin-bottom: 1px;
				border-radius: 8px;
				width: 10px;
				height: 10px;
				background-color: #fff;
			}
			.box_swipe>ol>li.on {
				width: 20px;
				border-radius: 8px;
				background-color: #0da5ba;
			}
}





/*row*/
.row{
	width: 100%;
	overflow: hidden;
	margin-top:30px;
}
	.row .index{
		width: 1240px;
		overflow: hidden;
		margin: 0 auto;
	} 	
@media only screen and (max-width: 640px) {
/*row*/
.row{
	margin: 40px 0;
}
	.row .index{
		width: 100%;
		overflow: hidden;
		padding: 0 4%;
	} 		
}
	
	
/*list*/
.list{}
	.list ul{}
	.list ul li{
		float: left;
		width: 33.33333333%;
		overflow: hidden;
	}	
		.list ul li a{
			display: block;
			width: 92%;
			margin: 0 auto;
			position: relative;
		}
			.list ul li a .picture{
				width: 100%;
				overflow: hidden;
			}
				.list ul li a .picture img{
					display: block;
					width: 100%;
				}
			.list ul li a .layer{
				display: none;
				width: 100%;
				height: 100%;
				background: #000;
				opacity: 0.8;
				position: absolute;
				left: 0; top: 0; z-index: 1;
			}
			.list ul li a h1{
				width: 100%;
				height: 35px;				
				text-align: center;
				padding: 0 10px;
				color: #fff;
				font-size: 20px;
				line-height: 30px;
				position: absolute;
				left: 0;top: -35px;z-index: 2;
				-webkit-transition: all 1s ease 0s;
				-moz-transition: all 1s ease 0s;
				-ms-transition: all 1s ease 0s;
				-o-transition: all 1s ease 0s;
				transition: all 1s ease 0s;
			}
			.list ul li a p{
				width: 100%;
				height: 88px;
				overflow: hidden;
				padding: 0 40px;
				color: #fff;
				font-size: 14px;
				text-align: center;
				line-height: 22px;
				position: absolute;
				left: 0; bottom: -88px; z-index: 2;
				-webkit-transition: all 1s ease 0s;
				-moz-transition: all 1s ease 0s;
				-ms-transition: all 1s ease 0s;
				-o-transition: all 1s ease 0s;
				transition: all 1s ease 0s;
			}
			.list ul li:hover a .picture img{
				-webkit-transform: scale(1.1,1.1); 
			    -o-transform: scale(1.1,1.1);
			    transition: all 1s;
			    -webkit-transition: all 1s;
			}
			.list ul li:hover a .layer{
				display: block;
			}
			.list ul li:hover a h1{
				top:35%;
			}
			.list ul li:hover a p{
				bottom:5%;
			}
@media only screen and (max-width: 640px) {
	.list ul li{
		width: 100%;
		margin-bottom: 20px;
	}
		.list ul li a{
			width: 100%;
		}
		.video img
		{
		    display:block;
		    width:100%;
		    } 
}

	
	
/*product*/
.product{}
	.product h2{
		display: block;
		color: #0095df;
		font-size: 20px;
		line-height: 35px;
		text-align: center;
		margin-bottom: 10px;
	}
	.product ul{}
	.product ul li{
		float: left;
		width: 25%;
		overflow: hidden;
	}	
		.product ul li a{
			display: block;
			width: 89%;
			margin: 0 auto;
			position: relative;
		}
			.product ul li a .picture{
				width: 100%;
				overflow: hidden;
			}
				.product ul li a .picture img{
					display: block;
					width: 100%;
				}
			.product ul li a h1{
				width: 100%;
				height: 35px;				
				text-align: center;
				padding: 0 10px;
				color: #fff;
				font-size: 14px;
				line-height: 35px;
				position: absolute;
				left: 0;bottom: -35px;z-index: 2;
				background: url(../images/product-bg.png);
				-webkit-transition: all 0.5s ease 0s;
				-moz-transition: all 0.5s ease 0s;
				-ms-transition: all 0.5s ease 0s;
				-o-transition: all 0.5s ease 0s;
				transition: all 0.5s ease 0s;
			}
			.product ul li:hover a .picture img{
				-webkit-transform: scale(1.1,1.1); 
			    -o-transform: scale(1.1,1.1);
			    transition: all 1s;
			    -webkit-transition: all 1s;
			}
			.product ul li:hover a h1{
				bottom: 0;
			}
@media only screen and (max-width: 640px) {
	.product ul li{
		width: 100%;
		margin-bottom: 20px;
	}	
		.product ul li a{
			width: 100%;
		}
}



/*news*/
.row .news{
	width: 1200px;
	overflow: hidden;
	padding: 20px 5px;
	background: #f7f7f7;
}
	.row .news h2{
		display: block;
		color: #0095df;
		font-size: 20px;
		line-height: 35px;
		text-align: center;
		margin-bottom: 10px;
	}
	.newBox{
		width: 50%;
		float: left;
		padding: 0 25px;
		overflow: hidden;
	}
		.newBox .title{
			width: 100%;
			height: 30px;
			overflow: hidden;
			position: relative;
			background: url(../images/news-title-bg.png) repeat-x;
		}
			.newBox .title h3{
				position: absolute;
				left: 0; top: 0;
				width: 75px;
				height: 30px;
				color: #0095df;
				font-size: 16px;
				line-height: 30px;
				background: #f7f7f7;
			}
			.newBox .title a{
				position: absolute;
				right: 0; top: 0;
				width: 45px;
				height: 30px;
				color: #000;
				font-size: 14px;
				text-align: right;
				line-height: 30px;
				background: #f7f7f7;
			}
		.newBox h4{
			color: #000;
			font-size: 14px;
			line-height: 30px;
		}
		.newBox .newsPic{
			width: 255px;
		}
			.newBox .newsPic img{
				display: block;
				width: 255px;
				height:191px;
			}
		.newBox .newsText{
			width: 273px;
		}
			.newBox .newsText p,.newBox .newsText i{
				color: #000;
				font-size: 12px;
				line-height: 25px;
			}
			.newBox .newsText p{
			    height:150px;
			    overflow: hidden;
			}			
			.newBox .newsText i{
				display:block;
				margin-top:20px;
				font-style:normal;
			}
		.newBox .newsText:hover p{
			color: #0095df;
		}
@media only screen and (max-width: 640px) {
.row .news{
	width: 92%;
	margin: 0 auto;
}
	.row .news h2{
		text-align: left;
		padding: 0 10px;
	}
	.newBox{
		width: 100%;
		padding: 0 10px;
		margin-bottom: 15px;
	}
		.newBox .newsPic,.newBox .newsText{
			width: 100%;
		}
		.newBox .newsPic img{
		    width: 100%;
			height:auto;
		}
		.newBox .newsText p{
		    height:auto;
		    overflow: inherit;
		}	
}



/*boxCon*/
.row .boxCon{
	width: 1200px;
	overflow: hidden;
	padding: 20px 5px;
	background: #f7f7f7;
}
/*case*/
.case{
	width:60%;
	overflow: hidden;
}
	.case h2{
		display: block;
		color: #0095df;
		font-size: 20px;
		line-height: 35px;
		margin-bottom: 10px;
		padding-left: 25px;
	}
	.case .caseBox{
		width: 100%;
		overflow: hidden;
	}
	    .case .caseBox table tr td{
	        width: 50%;
			float: left;
			overflow: hidden;
	    }
		.case .caseBox ul{		    
		}
		.case .caseBox ul li{
			width: 100%;
		}
			.case .caseBox ul li a{
				display: block;
				width: 96%;
				height: 30px;
				overflow: hidden;
				color: #000;
				font-size: 14px;
				line-height: 30px;
				margin-left: 25px;
				white-space:nowrap;
				text-overflow:ellipsis;
			}
				.case .caseBox ul li a i{
					color: #0095df;
					margin-right: 5px;
					font-style:normal;
				}
		.case .caseBox ul li:hover a{
			color: #0095df;
		}
/*program*/
.program{
	width:36%;
	overflow: hidden;
	padding-right: 25px;
}
	.program h2{
		display: block;
		color: #0095df;
		font-size: 20px;
		line-height: 35px;
		margin-bottom: 10px;
	}
	.program .programBox{
		width: 100%;
		overflow: hidden;
		position: relative;
	}
		.program .programBox img{
			display: block;
			width: 100%;
		}
		.program .programBox .layerBox{
			display:none;
			width: 100%;
			overflow:hidden;
		}
		.program .programBox .layerBox ul{
			width: 100%;
			height: 105%;
			margin-left: -1px;
			margin-top: -1px;
			position: absolute;
			left: 0; top: 0; z-index: 1;			
		}
		.program .programBox .layerBox ul li{
			width: 50%;
			float: left;
			overflow: hidden;
			border-left: 1px solid #fff;
			border-top: 1px solid #fff;
		}
			.program .programBox .layerBox ul li a{
				display: block;
				width: 100%;
				height: 105px;
				color: #fff;
				font-size: 14px;
				line-height: 102px;
				text-align: center;
				background: url(../images/product-bg.png);
				-webkit-transition: all 0.5s ease 0s;
				-moz-transition: all 0.5s ease 0s;
				-ms-transition: all 0.5s ease 0s;
				-o-transition: all 0.5s ease 0s;
				transition: all 0.5s ease 0s;
			}
			.program .programBox .layerBox ul li:hover a{
				color: #0095df;
			}
		.program .programBox:hover .layerBox{
			display:block;
		}
@media only screen and (max-width: 640px) {
.row .boxCon{
	width: 92%;
	margin: 0 auto;
}
	/*case*/
	.case{
		width:100%;
		margin-bottom: 20px;
	}
		.case h2{
			padding:0 10px;
		}
		.case .caseBox ul li{
			width: 100%;
		}
			.case .caseBox ul li a{
				margin-left: 10px;
			}
	/*program*/
	.program{
		width:100%;
		padding-right: 0;
	}
		.program h2{
			padding:0 10px;
		}
		.program .programBox{
			margin: 0 10px;
		}		
		.program .programBox .layerBox{
			display: none;
		}
}			
		
		
/*link*/
.row .link{
	width: 1200px;
	overflow: hidden;
	padding: 20px 25px;
	margin-bottom: 30px;
	background: #f7f7f7;
}
	.link h2{
		display: block;
		color: #0095df;
		font-size: 20px;
		line-height: 35px;
	}
	.link .linkBox{
		width: 100%;
		overflow: hidden;
	}
		.link .linkBox ul{}
		.link .linkBox ul li{
			float: left;
			margin-right: 10px;
			margin-top: 10px;
		}
			.link .linkBox ul li a{
				color: #000;
				font-size: 14px;
				line-height: 25px;
			}
@media only screen and (max-width: 640px) {
.row .link{
	width: 92%;
	padding: 20px 10px;
	margin: 0 auto;
}
}


		
video.video{
	width: 100%;
	display: block;
	max-width: 800px;
	margin: 0 auto;
}	
.window_hide{
	display: none;
  	position: fixed;
  	top: 0;
  	left: 0;
  	z-index: 10;
  	width: 100%;
  	height: 100%;
  	background: rgba(0,0,0,0.7);
}
	.window_hide .content{
		position: absolute;
		top: 50%;
		left: 50%;
		width: 800px;
		height: 500px;
		margin-top: -250px;
		margin-left: -400px;
		border-radius: 10px;
	}
		.window_hide a.close{
			position: absolute;
		  	top: 5px;
		  	right: 10px; z-index:9;
		  	color: #CC0000;
		  	font-size: 40px;
		  	filter:alpha(opacity=75); 
		  	opacity:0.75;
		  	-webkit-transition: all 0.1s ease-in;
		  	-moz-transition: all 0.1s ease-in;
		  	transition: all 0.1s ease-in;
		}
		.window_hide a.close:hover{
		  	filter:alpha(opacity=100); 
		  	opacity:1;
		}
@media only screen and (max-width: 800px) {
	.window_hide .content{
		left: 5%;
	  	width: 90%;
	  	height: 300px;
	  	margin-top: -150px;
	  	margin-left: 0;
	}
}