*{
    padding: 0;margin: 0;
}
html,body{
    font-family:"Microsoft YaHei",sans-serif;color: #333;font-size: 14px;
}
li{
    list-style: none;
}
a{
    text-decoration: none;color: #666;
}

/**************/
.box{
    
}
.all{
	width: 300px;
	height: auto;
	margin: 0px auto;
	overflow: hidden;
	padding:10px;
	
}
.top-img{
    width: 300px;height: auto;font-size: 0;position: relative; overflow:hidden;
}
.activeimg{
    overflow: hidden;height: 450px;position: relative;
}
.top-img .activeimg img{
    width: 300px;height: 450px;
}
.top-img .left{
    width: 80px;height: 450px;background: rgba(0,0,0,0.4);position: absolute;left: 0;top: 0;text-align: center;line-height: 450px;
    cursor: pointer;
}
.top-img .right{
    width: 80px;height: 450px;background: rgba(0,0,0,0.4);position: absolute;left:300px;top: 0;text-align: center;line-height: 450px;
    cursor: pointer;
}
.top-img .left:hover,.top-img .right:hover{
    background: rgba(0,0,0,0.5);
}

.bot-img{
    height: 90px;width: 300px;margin-top: 15px; margin-bottom:10px;
}
.bot-img ul{
    width: 100%;height: 100px;
}
.bot-img ul li{
    width: 30px;margin-right: 20px;float: left;border: 1px solid #DEDEDE;cursor: pointer;font-size: 0;
}
.bot-img ul li.active{
    border: 1px solid #999999;
}
.bot-img ul li img{
    width: 100%;
}
.bot-img ul li:last-child{
    margin-right: 0;
}