@charset "utf-8";
.font-20{
    font-size: 20px
}
.zone-content{
    height: 190px;
    margin-top: 45px;
    width: 100%;
}
.zone-detail{
    width: 394px;
    height: 100%;
    background-color: #fff;
    cursor: pointer;
    transition: all .2s linear;
}
.zone-detail>img{
    width: 100%;
    height: 100%;
}
.zone-detail:hover{
    margin-top: -3px;
    box-shadow: 0 15px 50px 0px rgb(220, 220, 220) ;
}
.time-img>img{
    height: 26px;
    vertical-align: middle;
}
.zone-time{
    margin-top: 65px;
    width: 100%;
    line-height: 35px;
}
.detail-time{
    margin-left: 10px;
    color: #a8a39f;
}
.detail-time>span{
    
    height: 32px;
    width: 35px;
    margin: 0 5px;
    border-radius: 5px;
    display: inline-block;
    background: #ec0404;
    color: #fff;
    font-size: 18px;
    line-height: 32px;
   text-align: center;
    justify-content: center;
}
.time-right{
    color: #3d3d3c;
    vertical-align: middle;
}
.zone-good{
    width: 100%;
    height: 380px;
    margin-top: 25px;
  
    padding-bottom: 10px;
}
.hover{
    transition: all .2s linear;
}
.hover:hover{
    margin-top: -2px;
    box-shadow: 0 15px 50px 0px rgb(220, 220, 220) ;
}
.zone-box{
    width: 293px;
    height: 100%;
    background: #fff;
    margin-right: 8px;
}

.zone-box-top{
    width: 100%;
}
.zone-box-top>img{
    width: 172px;
    height: 172px;
   margin-top: 40px;
}
.zone-box-bottom>p{
    margin-bottom: 20px;
}
.zone-box-bottom>p+p+p{
    color: #f51f1f;
}
.zone-kill{
    color: #4a4a4a; 

}
.zone-head{
    color: #333333;
}
.zone-box-bottom>p>span+span{
    color: #acacac;
}
.now-price{
    font-size: 22px;
}
.middle-line{
    text-decoration-line: line-through;
}
.hot-zone{
    width: 100%;
}
.hot-good{
    height: 511px;
    width: 100%;
}
.zone-name{
    height: 87px;
    padding: 38px 0 25px;
    font-size: 24px;
}
.hot-box{
    height: 100%;
    width: 392px;

    background: #fff;
    margin-right: 8px;

}
.hot-box-top>img{
    width: 230px;
    height: 230px;
   margin-top: 58px;
}
.zone-head{
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hot-desc{
    color: #4a4a4a; 
    padding:8px 50px 35px ;
    color: #333;
    line-height: 18px;
    margin: 0 0 23px;
    height: 15px;
    width: 350px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.jp-box{
    width: 594px;
    height: 100%;
    margin-right: 8px;
}
.jp-box>img{
    height: 100%;
}
.jp-good{
    height: 380px;
    flex-wrap: wrap;
    width: 100%;
 
}
.jp-good>.zone-box:nth-child(n+4){
    position: relative;
    bottom: -10px;
}
.jp-good>.zone-box:nth-child(3),
.jp-good>.zone-box:nth-child(7)
{
    margin-right: 0;
}
.acce-zone{
        width: 100%;
        height: 870px;
        margin-top: 400px;
}
.acce-zone .zone-box:nth-child(3),
.acce-zone .zone-box:nth-child(7){
    margin-right: 8px;
}
.acce-zone .zone-box:nth-child(4)
{
    margin-right: 0;
    top: 0px;
}
.acce-zone .zone-box:nth-child(8){
    margin-right: 0;
}
.acce-zone .zone-name>p a{
    color: #000;
}
.acce-zone .zone-name>p a:hover{
    color: #f63a3a;
}
.acce-zone .zone-name>p:nth-child(3){
    width: 280px;
}
.acce-zone .zone-name>p:nth-child(1){
    width: 280px;
    opacity: 0;
}
.smallGoods{
    width: 100%;
    flex-wrap: wrap;
}
.smallGoods>li{
    width: 30%;
    
}
.smallGoods a{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color: #4a4a4a;
    
}
.smallImg{
    width: 40px;
}
.pj-good{
    height: 380px;
    flex-wrap: wrap;
    width: 100%;
}

.pj-good>.zone-box:nth-child(n+4){
    position: relative;
    bottom: -10px;
}
.pj-good>.zone-box:nth-child(3),
.pj-good>.zone-box:nth-child(7)
{
    margin-right: 0;
}