.detail-box{
    width: 100%;
    height: auto;
    padding-bottom: 1vw;
}
.detail{
    display: inline-block;
    width: 17.7vw;
    height: 24.2vw;
    border: 1px solid #E1E1E1;
    border-radius: .4vw;
    background: #fff;
    margin-top: 1vw;
    overflow: hidden;
    cursor: pointer;
}
.detail-l{
    margin-left: calc(1.5vw - 3px);
}
.detail-pic{
    display: block;
    position: relative;
    top: 0px;
    left: 0px;
    width: 17.7vw;
    height: 20.1vw;
}
.detail-info-box{
    width: 17.7vw;
    height: 4.2vw;
}
.detail-name{
    width: 17.7vw;
    font-size: .9vw;
    padding :.3vw .7vw;
    color: #646464;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.detail-btn-packet{
    width: 17.7vw;
    height: 1.6vw;
    padding: 0 .7vw;
}
.detail-check,.detail-check-label,.detail-check-without-login,.fava-check{
    float: left;
}
.detail-check-without-login{
    width: .9vw;
    height: .9vw;
}
.detail-check,.fava-check{
    width: .9vw;
    height: .9vw;
}
.detail-uncheck{
    background: url(../img/checkbox.png) no-repeat;
    background-size: 100% 100%;
}
.fava-uncheck{
    background: url(../img/checkbox.png) no-repeat;
    background-size: 100% 100%;
}
.detail-checked{
    background: url(../img/check-ischeck.png) no-repeat;
    background-size: cover;
}
.fava-checked{
    background: url(../img/fava-checked.png) no-repeat;
    background-size: 100% 100%;
}
.detail-btn{
    float: right;
}
.detail-check-label{
    height: 1.6vw;
    line-height: 1.6vw;
    font-size: .9vw;
    color: #7D7C7C;
    margin-left: .3vw;
}
.detail-btn{
    color: #37C9B3;
    border:1px solid #37C9B3;
    border-radius: .3vw;
    font-size: .9vw;
    background: #fff;
    padding: .1vw .5vw;
}
.page-box{
    position: relative;
    width: 60vw;
    height: 2.4vw;
    position: relative !important;
    margin: 0 auto;
    left: 0px;
    right: 0px;
    top: 1vw;
}
.cate-pagination{
    width: auto;
    height: 2.4vw;
    display: inline;
    margin: 0px auto ;
}
.cate-pagination li{
    display: inline-block;
    height: 2.4vw;
    line-height: 2.4vw;
    background: #F7F7F7;
    border-radius: 2px;
    font-size: 12px;
    cursor: pointer;
    color:#C1C1C1;
    margin-right: .4vw;
}
.cate-pagination a{
    display: block;
    height: 2.4vw;
    line-height: 2.4vw;
    padding: 0px 1vw;
    color:#C1C1C1;
    text-decoration: none;
}
.cate-pagination li:hover{
    background: #37C9B3;
    
}
.cate-pagination .active,.cate-pagination .disabled{
    padding: 0px 1vw;
}
.cate-pagination .active {
    background: #37C9B3;
    color: #fff;
}
.cate-pagination li:hover a{
    color: #fff;
}
.cate-pagination .disabled:hover{
    background: #F7F7F7;

}
.detail-btn:hover{
    color: #fff;
    background: #37C9B3;
}
.detail-btn:active{
    opacity: .5;
    background: #37C9B3;
    box-shadow:inset03px5px0rgba(0,0,0,0.2);
    outline:0;
}
.detail-btn:focus{
    outline:0;
}
.base-no-result{
    position: relative;
    top: 20%;
    left: 0px;
    right: 0px;
    margin:0 auto;
    z-index: 4;
    width: 19vw;
    height: 15vw;
}
.base-no-result img{
    position: relative;
    left:50%;
    transform: translateX(-50%);
    width: 16.8vw;
    margin:0 auto;
}
.base-notfound-info{
    position: relative;
    color: #A8A8A8;
    font-size: 1.1vw;
    width: 100%;
    text-align: center;
    top: 2vw;
}
.base-notfound-info span{
    color: #588EF1;
    cursor: pointer;
}