/*网站基本定义*/

.clearfix:after{visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
.clearfix{*zoom:1;}

.bannerbox{width:1400px; height:414px;position:relative;overflow:hidden; margin:0px auto 0 auto;}

.Homebanner{width:100%;position:relative;height:414px;overflow:hidden;}
.Homebanner ul{width:100%;position:absolute;height:414px;}
.Homebanner ul li{width:100%;height:414px;position:absolute;overflow:hidden;}
.Homebanner ul li p{width:100%;height:414px;position:absolute;top:0px;display:block;}

.Homeleft,.Homeright{background:#000;font-family:"宋体";width:50px;height:50px;line-height:50px;text-align:center;font-size:40px;color:#fff;position:absolute;top:45%;cursor:pointer;transition:all .2s ease;opacity:0;z-index:899999}
.Homeleft{left:-60px;}
.Homeright{right:-60px;}

.bannerbox:hover .Homeleft{left:0px;opacity:1}
.bannerbox:hover .Homeright{right:0px;opacity:1}


.Homebannertext{left:0px;top:0px;width:1400px;height:414px; margin:0 auto; overflow:hidden;}
.Homebannertext li p{ background-size:100% 100%;}
.Homebannertext .ban1con1{ color:#fa5e21; font-size:24px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold; margin:50px 0 0 30px;}
.Homebannertext .ban1con2{ color:#000; font-size:20px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:10px 0 0 30px;}
.Homebannertext .ban1con3{ color:#000; font-size:20px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:10px 0 0 30px;}
.Homebannertext .ban1con4{ color:#c31212; font-size:24px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:150px 30px 0 0; float:right;}

.Homebannertext .ban2con1{ color:#fa5e21; font-size:24px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold; margin:50px 30px 0 0; text-align:right;}
.Homebannertext .ban2con2{ color:#000; font-size:20px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:10px 30px 0 0;text-align:right;}
.Homebannertext .ban2con3{ color:#000; font-size:20px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:10px 30px 0 0; text-align:right;}
.Homebannertext .ban2con4{ color:#c31212; font-size:24px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:150px 30px 0 0; text-align:right;}

.Homebannertext .ban3con1{ color:#fa5e21; font-size:24px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold; margin:50px 0 0 30px; text-align:left;}
.Homebannertext .ban3con2{ color:#000; font-size:20px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:10px 0 0 30px;text-align:left;}
.Homebannertext .ban3con3{ color:#000; font-size:20px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:10px 0 0 30px; text-align:left;}
.Homebannertext .ban3con4{ color:#c31212; font-size:24px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:150px 30px 0 0; text-align:right;}

.Homebannertext .ban4con4{ color:#c31212; font-size:24px; text-shadow:-2px 0 white,0 2px white,2px 0 white,0 -2px white; font-weight:bold;margin:320px 0 0 0; text-align:center;}

@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-500px);
	}	
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}
 
@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(-500px);
	}	
	100% {
		opacity: 1;
		transform: translateX(0);
	}
} 
/*右到左*/
@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(50px);
	}	
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}
 
@keyframes fadeInRight {
	0% {
		opacity: 0;
		transform: translateX(50px);
	}	
	100% {
		opacity: 1;
		transform: translateX(0);
	}
} 

/*上到下*/
@-webkit-keyframes fadeupdow {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-100px);
	}	
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}
 
@keyframes fadeupdow {
	0% {
		opacity: 0;
		transform: translateY(-100px);
	}	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
} 
/*下到上*/
@-webkit-keyframes fadedowup {
	0% {
		opacity: 0;
		-webkit-transform: translateY(100px);
	}	
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}
 
@keyframes fadedowup {
	0% {
		opacity: 0;
		transform: translateY(100px);
	}	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
} 
/*调用animation属性，从而让按钮在载入页面时就具有动画效果 以-webkit为例，请为不同的浏览器添加前缀 */
.Homebannertext .ban1con1{ 
    -webkit-animation-name: "fadeupdow"; /*动画名称，需要跟@keyframes定义的名称一致*/
    -webkit-animation-duration: 7s;/*动画持续的时间长*/
    -webkit-animation-iteration-count: infinite;/*动画循环播放的次数为1 infinite为无限次*/
} 
.Homebannertext .ban1con2{ -webkit-animation:'fadeInLeft' 6s infinite} /* 简写 */
.Homebannertext .ban1con3{ -webkit-animation:'fadeInLeft' 7s infinite}
.Homebannertext .ban1con4{ -webkit-animation:'fadeInRight' 6s infinite}

.Homebannertext .ban2con1{ -webkit-animation:'fadeupdow' 17s infinite}
.Homebannertext .ban2con2{ -webkit-animation:'fadeInRight' 15s infinite}
.Homebannertext .ban2con3{ -webkit-animation:'fadeInRight' 17s infinite}
.Homebannertext .ban2con4{ -webkit-animation:'fadedowup' 17s infinite}

.Homebannertext .ban3con1{ -webkit-animation:'fadeupdow' 25s infinite}
.Homebannertext .ban3con2{ -webkit-animation:'fadeInLeft' 20s infinite}
.Homebannertext .ban3con3{ -webkit-animation:'fadeInLeft' 20s infinite}
.Homebannertext .ban3con4{ -webkit-animation:'fadeInRight' 27s infinite}

.Homebannertext .ban4con4{ -webkit-animation:'fadedowup' 28s infinite}