.banner{width:100%;height:500px;overflow:hidden;margin-bottom: 25px;}
.bannercon{position:relative;zoom:1;}
.bannercon .main{ width:100%; float:left;}
.bg_colors{ position:absolute; left:0; top:0; width:100%; height:500px;}
.bgs_box{ position:absolute; left:0; top:0; width:100%; height:500px;opacity:0;filter:alpha(opacity=0);}
.bgs_box a{ display:block; height:520px; line-height:10000px; }
.bg_colors .on{opacity:1;filter:alpha(opacity=100)}
.switch_list{ position:relative; left:50%; top:450px; width:50%; height:50px; margin-left:-90px; overflow:hidden; }
.switch_list div{ position:absolute; bottom:10px;}
.switch_list div span{float:left; vertical-align:top; width:16px; height:16px; overflow:hidden; margin:0 5px; background:url(../images/dd1.png) top left no-repeat; cursor:pointer;}
.switch_list div .on{ background:url(../images/dd.png) top left no-repeat;}

.item_img_css3{
	-webkit-animation:img_item .8s ease-out;
	animation:img_item .8s ease-out;

}

@-webkit-keyframes img_item{
	0%{-webkit-transform:translateX(-500px); opacity:0}
	100%{-webkit-transform:translateX(0);  opacity:1}
}

@keyframes img_item{
	0%{transform:translateX(-500px);opacity:0}
	100%{transform:translateX(0); opacity:1}
}

.item_img_css3 .shadow01{

	-webkit-animation:img_item01 .8s ease-out;

	animation:img_item01 .8s ease-out;

}

@-webkit-keyframes img_item01{
	0%{-webkit-transform:translateX(500px); opacity:0}
	100%{-webkit-transform:translateX(0);  opacity:1}
}

@keyframes img_item01{
	0%{transform:translateX(500px);opacity:0}
	100%{transform:translateX(0); opacity:1}
}

.item_txt_css3{

	-webkit-animation:txt_item .8s ease-out;

	animation:txt_item .8s ease-out;

}

@-webkit-keyframes txt_item{
	0%{-webkit-transform:translateX(-500px); opacity:0}
	100%{-webkit-transform:translateX(0);  opacity:1}
}

@keyframes txt_item{
	0%{transform:translateX(-500px);opacity:0}
	100%{transform:translateX(0); opacity:1}
}