@charset "utf-8";

.banner{ width:100%;  position:relative;height:auto; margin: 0 auto;max-width: 1920px; top:0px;left: 0;right:0}
.banner .bd{ width:100%; margin:0 auto; position:relative; z-index:0; overflow:hidden;  }
.banner .bd ul{ width:100% !important;  }
.banner .bd li{ width:100% !important;  height:auto; overflow:hidden; text-align:center;  }
.banner .bd li img{width:100%;height:auto;}
.banner .bd li a{ display:block; height:auto; }
.banner .hd{ width:100%;  position:absolute; z-index:1; bottom:0; left:0; height:50px; line-height:50px;  text-align:center; _background:#000; _filter:alpha(opacity=60); 	}
.banner .hd ul{ text-align:center;  padding-top:5px;  }
.banner .hd ul li{ cursor:pointer; display:inline-block; *display:inline; zoom:1; width:15px; height:15px; margin:5px;  background: #FFFFFF; overflow:hidden;line-height:9999px; 	
transition: all 0.5s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
}
.banner .hd ul .on{ background-position:0 0; background:#38f;width:15px;
transition: all 0.5s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
}
.banner .prev{background:url(../img/sprite.png) left top no-repeat;cursor: pointer;height: 100px;position: absolute;top: 50%; margin-top:-50px; width: 45px;left: 0;opacity:0.2;}
.banner .prev:hover{opacity:0.5;}
.banner .next{background:url(../img/sprite.png) right top no-repeat;cursor: pointer;height: 100px;position: absolute;top: 50%; margin-top:-50px; width: 45px;right: 0;opacity:0.2;}
.banner .next:hover{opacity:0.5; }

 
@media only screen and (max-width : 1200px) {
.banner, .banner .bd li{ /*height:600px;*/}
}

@media only screen and (max-width : 850px) {
.banner, .banner .bd li{ height:auto;}	
}
@media only screen and (max-width : 640px) {
.banner, .banner .bd li{ height:auto;}	
}