@charset "utf-8";
#wrap{background: #f1f1f1;}
#header .menu ul li.nav2{color: #fff; background: #bc292f; }

#banner{ width: 100%; min-width: 1200px; height: 5rem; margin-top: 0; min-height: 500px; position: relative;}

#main{	position: relative; z-index: 1; }
#main .nav{
	overflow: hidden;
	width: 1200px;
	margin: 0 auto;
	box-shadow: 0 0 25px rgba(0,0,0,.2);
	position: relative;
	top: -40px;
}
#main .nav a{
	position: relative;
	background: #f1f1f1;
	display: block;
	float: left;
	height: 80px;
	line-height: 80px;
	text-align: center;
	width: 400px;
	color: #bc292f;
	font-size: 24px;
}
#main .nav a span{
	display: none;
}
#main .nav a.on{
	background: #BC292F;
	color: #fff;
}
#main .nav a.on span{
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	text-align: center;
	width: 100%;
	opacity: .1;
	color: #fff;
	font-size: 90px;
}

#main .box{padding: .5rem 0; line-height: 1.8em; margin: 0 -22px; overflow: hidden;}
#main .box .list{ display: block; background: #fff; width: 370px; margin: 0 22px; float: left;}
#main .box .list .play_video{position: relative;}
#main .box .list .icon{
	text-indent: -999em;
	opacity: 0;
	display: block;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.6) url(../img/play.png) no-repeat center center;
	background-size: 60px;
	transition: all 0.2s ease-out; 
}
#main .box .list:hover .icon{opacity: 1;}
#main .box .list img{ display: block; width: 100%;}
#main .box .list video{width: 100%; position: absolute; top: 0;}
#main .box .list h2{padding: 12px; font-size:.18rem; font-weight: normal;}

@media screen and (max-width: 768px) {
	

	#header .menu ul li.nav2{color: #bc292f; border-top: 0; background:none;}
	#banner{ width: 100%; min-width: 100%; height: 50vw; margin-top: 50px; min-height: 50vw; position: relative;}
	
	#main{	position: relative; z-index: 1; }
	#main .nav{
		overflow: hidden;
		width: 100%;
		margin: 0 auto;
		box-shadow: 0 0 25px rgba(0,0,0,.2);
		position: relative;
		top: 0px;
	}
	#main .nav a{
		position: relative;
		background: #f1f1f1;
		display: block;
		float: left;
		height: 2rem;
		line-height: 2rem;
		text-align: center;
		width: 33.3%;
		color: #bc292f;
		font-size: .7rem;
	}
	#main .nav a span{
		display: none;
	}
	#main .nav a.on{
		background: #BC292F;
		color: #fff;
	}
	#main .nav a.on span{
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		text-align: center;
		width: 100%;
		opacity: .1;
		color: #fff;
		font-size: 90px;
	}
	
	#main .box{padding: 20px; line-height: 1.8em; margin: 0 ; overflow: hidden;}
	#main .box .list{ display: block; background: #fff; width: 100%; margin: 0 0 15px; float: none;}
	#main .box .list .play_video{position: relative;}
	#main .box .list .icon{
		text-indent: -999em;
		opacity: 0;
		display: block;
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.6) url(../img/play.png) no-repeat center center;
		background-size: 60px;
		transition: all 0.2s ease-out; 
	}
	#main .box .list:hover .icon{opacity: 1;}
	#main .box .list img{ display: block; width: 100%;}
	#main .box .list video{width: 100%; position: absolute; top: 0;}
	#main .box .list h2{padding: 12px; font-size:.8rem; font-weight: normal;}
	
}