@charset "utf-8";
/* CSS Document */
body,html{ background-color:#fafbfc;font-size:100%; font-size:16px; color:#333; padding:0; margin:0;font-family: Roboto,"Helvetica Neue", Arial, sans-serif, sans-serif,"苹方";}
img{border:none; outline:none;}
*{ padding:0; margin:0;}
body,html{color:#333;}
a,a:visited{ color:inherit; text-decoration:none;}
input,button,select,option{ outline:none;border: none;}
h1,h2,h3,h4,h5,h6,ul,li,dl,dd,dt,p{ padding:0; margin:0; list-style:none;}
button{
	cursor: pointer;
}
textarea{
	 resize: none;
}
::-webkit-input-placeholder { /* WebKit browsers */ 
color: #999; 
} 
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
color: #999; 
} 
::-moz-placeholder { /* Mozilla Firefox 19+ */ 
color: #999; 
} 
:-ms-input-placeholder { /* Internet Explorer 10+ */ 
color: #999; 
}
input,select{-webkit-appearance:none;}
select{
	background: url(../images/down.png) no-repeat 97% center;
	background-size: 18px auto
}
.main{margin: 0 auto; overflow: hidden; width: 100%; }
/*以上为全局*/
.bg {
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    position: fixed;
    background-image: url(../images/bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.top {    width: 100vw;
    height: 33px;
    float: left;
    margin-top: 20px;
}
.last, .next {
    background-color: #063785;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/arrow.png) ;
    background-size: 10px auto;
    width: 55px;
    height: 33px;
    float: left;
    border-radius: 4px;
}
.last {
    margin-left: 16px;
}
.current {

    height: 33px;
    
    background: #063785;
    color: #fff;
    line-height: 33px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin: 0 80px;
    border-radius: 4px;
}
.next {
    transform: scaleX(-1);
    float: right;
    margin-right: 16px;
}
.wrapper {
    width: 100vw;
    height: 100vh;
    position: absolute;
    top:0vh;
    left: 0;
    overflow: auto;

}
#container {
    position: relative;
    min-width: 320px;
    max-width: 640px;
    width: 100%;
    margin: 0 auto;

}



.list{
    overflow: hidden;
    position: relative;
    margin-bottom: 10px;
}
.list img{
    width: 100%;
}
.text{
    height: 40px;
    line-height: 40px;
    color: #fff;
    padding: 0 5%;
    position: absolute;left: 0; bottom: 0;
    width: 90%;
    background-color: rgba(0,0,0,0.6);
    overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}



















@media only screen and (min-width:321px) and (max-width:828px) {
.main{ width: 100%;}