@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,input,table,tbody,p,th,td,em{-webkit-text-size-adjust:none;margin:0;padding:0;border:none;-webkit-tap-highlight-color:rgba(0,0,0,0);font-size:12px;font-family:"Microsoft Yahei","微软雅黑",Tahoma,Arial,Helvetica,STHeiti;}
html,body{height:100%;}
img,input,button,a,select,textarea{margin:0;padding:0;resize:none;border:none;outline:none;} 
ol,ul{list-style:none;} 
h1,h2,h3,h4,h5,h6,p,em,i,b,em{font-size:100%;word-wrap:break-word;font-weight:normal;font-style:normal;}
a:active, a:focus{outline:none;}
button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0;}
*html{background-image:url(about:blank);background-attachment:fixed;} /* 修正IE6振动bug */

/* slide */
.slide-main{height:500px;position:relative;}
.prev,.next{display:block;width:44px;height:44px;position:absolute;z-index:222;top:230px;overflow:hidden;cursor:pointer;opacity:0.6;-moz-opacity:0.6;filter:alpha(opacity=60);_border:1px solid none;}
.prev{left:70px;}
.next{right:70px;}
.prev:hover,.next:hover,.nav-main a:hover,.nav-main a.cur{opacity:1;-moz-opacity:1;filter:alpha(opacity=100);}
.item{display:block;width:100%;height:5px;position:absolute;z-index:124;top:520px;left:0;text-align:center;}
.item a{display:inline-block;width:24px;height:5px;margin-right:11px;background:#999;-moz-opacity:0.3;filter:alpha(opacity=30);overflow:hidden;}
.item a.cur{background:#358ff0;}
.slide-box,.slide{display:block;width:100%;height:500px;overflow:hidden;}
.slide-box{position:relative;}
.slide{display:none;height:500px;position:relative;position:absolute;z-index:8;}
#bgstylea{background-image: url(../images/banner2.jpg); background-size: cover; background-position: center;}
#bgstyleb{background-image: url(../images/banner3.jpg); background-size: cover; background-position: center;}
#bgstylec{background-image: url(../images/banner1.jpg); background-size: cover; background-position: center;}

/* 响应式设计 - 轮播图部分 */
@media screen and (max-width: 768px) {
    .slide-main {
        height: 300px;
    }
    
    .slide-box, .slide {
        height: 300px;
    }
    
    .prev, .next {
        top: 130px;
        width: 34px;
        height: 34px;
    }
    
    .prev {
        left: 20px;
    }
    
    .next {
        right: 20px;
    }
    
    .item {
        top: 320px;
    }
}

@media screen and (max-width: 480px) {
    .slide-main {
        height: 200px;
    }
    
    .slide-box, .slide {
        height: 200px;
    }
    
    .prev, .next {
        top: 80px;
        width: 30px;
        height: 30px;
    }
    
    .prev {
        left: 10px;
    }
    
    .next {
        right: 10px;
    }
    
    .item {
        top: 220px;
    }
    
    .item a {
        width: 18px;
        height: 4px;
        margin-right: 8px;
    }
}