.banner ul, .banner ol { padding: 0;}
.banner { position: relative; overflow: auto; text-align: center;}
.banner li { list-style: none; }
.banner ul li { float: left; height:500px}

#b04 .dots { position: absolute; left: 0; right: 0; bottom:0px; background:url(../img/btnbg.png); line-height:32px;}
#b04 .dots li 
{ 
	display: inline-block; 
	width: 15px; 
	height: 15px; 
	margin: 0 0; 
	text-indent: -999em;  
	cursor: pointer;
	background:url("../img/btn.png") no-repeat -15px 0;
	-webkit-transition: .5s cubic-bezier(0.760, 0.010, 0.370, 1.615);
    -moz-transition: .5s cubic-bezier(0.760, 0.010, 0.370, 1.615);
    -o-transition: .5s cubic-bezier(0.760, 0.010, 0.370, 1.615);
    -ms-transition: .5s cubic-bezier(0.760, 0.010, 0.370, 1.615);
    transition: .5s cubic-bezier(0.760, 0.010, 0.370, 1.615);
	margin:0 5px;
}
#b04 .dots li.active 
{
	opacity: 1;
	background:url("../img/btn.png");
	
}
#b04 .arrow { position: absolute; top: 100px;}
#b04 #al { left: 15px;}
#b04 #ar { right: 15px;}
#b00 .arrow { position: absolute; top: 40%;}
#b00 #al { left: 15px;}
#b00 #ar { right: 15px;}

@media (min-width:1200px) {
.banner ul li { float: left; height:500px}
}

@media (min-width:992px) and (max-width:1199px) {
.banner ul li { float: left; height:420px}
#b04 .dots { line-height:28px;}
}

@media (min-width:768px) and (max-width:991px) {
.banner ul li { float: left; height:350px}
#b04 .dots { line-height:24px;}
}


@media (max-width:767px) {
.banner ul li { float: left; height:120px}
#b04 .dots { line-height:20px;}
}