.all{
    width: 400px;height: auto;overflow: hidden; margin-left:22px;
}
.top-img{
    width: 400px;height: auto;font-size: 0;position: relative;
}
.activeimg{
    overflow: hidden;height: 300px;position: relative;
}
.top-img .activeimg img{
    width: 400px;height:300px;
}
.top-img .left{
    width: 20px;height: 300px;background: rgba(0,0,0,0);position: absolute;left: 0;top: 0;text-align: center;line-height: 310px;
    cursor: pointer;opacity:0.5;
}
.top-img .right{
    width: 20px;height: 300px;background: rgba(0,0,0,0);position: absolute;left:380px;top: 0;text-align: center;line-height: 310px;
    cursor: pointer; opacity:0.5;
}
.top-img .left:hover,.top-img .right:hover{
    background: rgba(0,0,0,0.1);
}

.bot-img{
    height: 60px;width: 400px; margin-top:18px;;
}
.bot-img ul li{
    width: 64px; height:48px; margin: 0px 7px;float: left;border: 1px solid #fff;cursor: pointer;font-size: 0;
}
.bot-img ul li.active{
    border: 1px solid #000;
}
.bot-img ul li img{
    width: 100%; height:100%
}
.bot-img ul li:last-child{
    margin-right: 0;
}