﻿
.banner{width:100%; text-align:center; text-align:center;position:relative; z-index:1;}
.slideBox{ width:100%; height:auto; overflow:hidden; position:relative; z-index:1;}
.slideBox .hd{ height:16px; overflow:hidden; position:absolute; right:49%; bottom:20px; z-index:1;}
.slideBox .hd ul{ overflow:hidden; zoom:1; float:left;}
.slideBox .hd ul li{ float:left; margin-right:10px;  background:#fff; width:12px; height:12px; text-align:center;cursor:pointer;}
.slideBox .hd ul li.on{ background:#0772a4;}
.slideBox .bd{ position:relative; height:100%; z-index:0; width:100%;}
.slideBox .bd ul{width:100%;}
.slideBox .bd li{ zoom:1; vertical-align:middle;  -webkit-transform: translateZ(0); width:100%;max-height: 600px;}
.slideBox .bd ul li img{ width:100%; height:100%; display:block; max-height: 600px;}
.slideBox .prev{ position:absolute; left:50px; top:50%; margin-top:-37px; float:left;display:block; width:70px; height:70px; background:url(../images/s_banner_l.png)  no-repeat; filter:alpha(opacity=50);opacity:0.5;}
.slideBox .next{ position:absolute; right:50px; top:50%; margin-top:-37px; float: right; display:block; width:70px; height:70px; background:url(../images/s_banner_r.png) no-repeat; filter:alpha(opacity=50);opacity:0.5;}
.slideBox .prev:hover,.slideBox .next:hover{ filter:alpha(opacity=100);opacity:1;}
.slideBox .prevStop{ display:none;}
.slideBox .nextStop{ display:none;}

@media screen and (max-width: 768px) {
    .slideBox { height: 50vw; overflow: visible;}
    .slideBox .bd li { width: 100%; max-height: none;  height: auto; line-height: 0;}
    .slideBox .bd ul li img { width: 100%;  height: 50vw;  display: block; max-height: none;}
    .slideBox .prev, 
    .slideBox .next { display: none;}
    .slideBox .hd { bottom: 10px; width: 100%; right: 0;  text-align: center;}
    .slideBox .hd ul { float: none; display: inline-block; padding: 0;}
    .slideBox .hd ul li { width: 8px; height: 8px;  margin: 0 4px;}
}