img{max-width:100%;display: block;}
.condition-container{width:800px;background: #ffffff;box-shadow: 0 4px 12px 0 rgba(0,0,0,0.10);border-radius: 8px;padding:10px 20px;margin:0 auto;transform:translateY(-50%);font-size:17px;color: #484848;letter-spacing: 2.34px;position:relative;z-index: 1;}
.condition-container .price-condition{width:40%;padding:0 40px;position:relative;height:40px;line-height:40px;cursor:pointer;border-right: 1px solid rgba(151, 151, 151,0.2);}
.condition-container .price-condition input{cursor:pointer;}
.condition-container .price-condition .price-container{display:none;position:absolute;left:0;right:0;top:54px;background: #fff;z-index:1;padding:20px;text-align: center;box-shadow: 0 4px 12px 0 rgba(0,0,0,0.10);}
.condition-container .price-condition .price-container .price-item{display: block;color: #333333;opacity: 0.6;text-align: center;font-size: 16px;padding: 15px 0;line-height: 1;}    
.condition-container .price-condition .price-container .price-item:hover{color:#e01452;cursor:pointer}
.condition-container .price-condition .icon{position:absolute;top:5px;width:30px;height:30px;}
.condition-container .price-condition .icon-price{left:5px;top:6px;}
.condition-container .price-condition .icon-arrow-down{right:15px;}
.condition-container .phone-condition{width:40%;padding:0 40px;position:relative;height:40px;line-height:40px;border-right: 1px solid rgba(151, 151, 151,0.2);}
.condition-container .phone-condition .icon-phone{position:absolute;width:30px;height:30px;left:5px;top:5px;}
.condition-container .phone-condition .icon-user{position:absolute;width:30px;height:30px;left:5px;top:4px;}
.condition-container .phone-condition input{width:100%;}
.condition-container .search-condition{width:20%;text-align:right;}
.condition-container .search-condition .btn-search{background: #e01452;border-radius: 8px;padding: 10px 20px;line-height:40px;text-align:center;color:#fff;}
.waiter-list .waiter-item{padding:20px;margin:30px 20px auto;background:#ffffff;box-shadow: 0 0 22px 0 rgba(0,0,0,0.10);border-radius: 6px;}
.waiter-list .waiter-item .waiter-avatar{width:20%;text-align:center;}
.waiter-list .waiter-item .waiter-avatar img{width:150px;height:150px;max-width:100%;}
.waiter-list .waiter-item .waiter-basic{width:80%;}
.waiter-list .waiter-item .waiter-basic .waiter-name{font-size: 28px;color: rgba(0,0,0,0.80);letter-spacing: 4.21px;}
.waiter-list .waiter-item .waiter-basic .waiter-price{font-size: 28px;color:#e01452;letter-spacing: 4.21px;}
.waiter-list .waiter-item .waiter-basic .waiter-info{margin-top:10px;opacity: 0.8;font-size:18px;color: rgba(101,101,101,0.80);letter-spacing: 3.04px;}
.waiter-list .waiter-item .waiter-basic .waiter-tag{margin:10px 0 15px;}
.waiter-list .waiter-item .waiter-basic .waiter-tag .tag-item{font-size: 18px;color: #e01452;/* border-radius: 20px; */letter-spacing: 2.57px;/* border:1px solid #e01452; */background:url('../images/waiter_list_tag.png') no-repeat 0 0;background-size:100% 100%;display:inline-block;padding:2px 10px;margin-right:5px;}
.waiter-list .waiter-item .waiter-basic .newest-comment{font-size: 18px;color: rgba(0,0,0,0.80);letter-spacing: 1px;line-height: 40px;}
.waiter-list .waiter-item .waiter-basic .newest-comment .item-content{cursor:pointer;position:relative;}
/*.waiter-list .waiter-item .waiter-basic .newest-comment .item-content .show-more{position:absolute;bottom:0;right:0;}*/
.waiter-list .waiter-item .waiter-basic .newest-comment .item-content span{color:#e01452;}
.waiter-list .waiter-item .waiter-basic .newest-comment .item-content span img{vertical-align:middle;margin-bottom:3px;margin-left:2px;height: 16px;}

.waiter-list .waiter-item .waiter-basic .scan-detail{width:150px;text-align:right;flex-shrink:0;}
.waiter-list .waiter-item .waiter-basic .scan-detail .button{font-size: 20px;color:#ffffff;letter-spacing:3.04px;background: #e01452;border: 1px solid #e01452;border-radius: 12px;padding:6px 20px;}
.open-more{width:20%;margin:20px auto 0;background: #F8F8F8;border-radius: 12px;font-size: 28px;color: #e01452;letter-spacing: 3.74px;height:60px;line-height:60px;text-align:center;cursor:pointer;}

.mask-success{width: 100%;height: 100%;background: rgba(0,0,0,0.6);position: fixed;left: 0;top: 0;z-index:10000;display:none;}
.mask-success .mask-inner{width: 700px;background: #ffffff;margin:0 auto;transform:translateY(50%);border-radius: 10px;padding: 50px 60px;text-align: center;}
.mask-success .mask-inner .success-icon{width:100px;height:100px;margin:0 auto;}
.mask-success .mask-inner .success-title{font-size: 28px;color: #333333;letter-spacing: 5.05px;margin-top:20px;}
.mask-success .mask-inner .success-text{font-size: 18px;color:666;letter-spacing: 2.53px;}
.mask-success .mask-inner .btn-close{background: rgba(255,87,114,0.2);border-radius: 6px;font-size: 18px;color: #e01452;letter-spacing: 2.81px;display:inline-block;margin:20px auto 0;padding:5px 40px;cursor:pointer;}

.mask{width:100%;height:100%;background:rgba(0,0,0,0.6);position:fixed;top:0;left:0;z-index:100000000;display:none;}

.empty{text-align:center;margin:100px auto;}
.empty img{width:200px;}
.empty .text{color:#cccccc;margin:20px 0;font-size:18px;}

ul{
    list-style:none;
}
input {
    border: 0;  
    outline: none; 
    background-color: rgba(0, 0, 0, 0);
}
.yue{
    width: 100%;
    background-color: #fff;
}
.yueContent{
    width: 1350px;
    margin: 0 auto;
    margin-top: 40px;
    display: flex;
    padding-bottom: 60px;
}
.yueList{
    margin-right: 20px;
}
.yueLi{
    width: 883px;
    height: 284px;
    background: #FFFFFF;
    box-shadow: 0 0 22px 0 rgba(0,0,0,0.10);
    border-radius: 6px;
    display: flex;
    padding-top: 19px;
    padding-left: 20px;
    margin-bottom: 30px;
    transition: all 0.1s;
}
/* .yueLi :hover{
    transform: translate(0 ,-10px);
} */
.yueLiImg{
    width: 174px;
    height: 246px;
}
.liRight{
    margin-left: 30px;
}
.yueName{
    margin-top: 35px;
    font-family: PingFang-SC-Medium;
    font-size: 20px;
    color: rgba(0,0,0,0.80);
    letter-spacing: 2.34px;
}
.yueYear{
    opacity: 0.8;
    font-family: PingFang-SC-Regular;
    font-size: 14px;
    color: rgba(101,101,101,0.80);
    letter-spacing: 1.64px;
}
.stars{
    margin-top: 15px;
    font-family: PingFang-SC-Medium;
    font-size: 16px;
    color: rgba(51,51,51,0.80);
    letter-spacing: 1.87px;
}
.yueStars{
    color: #e01452;
}
.introduction{
    width: 535px;
    margin-top: 15px;
    opacity: 0.8;
    font-family: PingFang-SC-Medium;
    font-size: 14px;
    color: rgba(0,0,0,0.80);
    letter-spacing: 1.44px;
    line-height: 30px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}
.yueRight{
    width: 437px;
}


.reservation{
    width: 437px;
    height: 470px;
    background: #FFFFFF;
    box-shadow: 0 0 22px 0 rgba(0,0,0,0.10);
    padding-top: 41px;
}
.resTitle{
    font-family: PingFang-SC-Regular;
    font-size: 22px;
    color: #000000;
    letter-spacing: 2.57px;
    text-align: center;
}
.resName{
    width: 360px;
    height: 50px;
    background: #F8F8F8;
    border: 1px solid #E2E2E2;
    border-radius: 6px;
    margin: 0 auto;
    margin-top: 30px;
    position: relative;
}
.nameImg{
    width: 20px;
    height: 19.9px;
    position: absolute;
    top: 15px;
    left: 15px;
}
.phoneImg{
    width: 15px;
    height: 21px;
    position: absolute;
    top: 15px;
    left: 18px;
}
#name{
    width: 360px;
    height: 50px;
    padding-left: 50px;
    font-family: PingFang-SC-Regular;
    font-size: 14px;
    color: #999999;
    letter-spacing: 1.64px;
    background: #F8F8F8;
    border: 1px solid #E2E2E2;
    border-radius: 6px;
}
#phone{
    width: 360px;
    height: 50px;
    padding-left: 50px;
    font-family: PingFang-SC-Regular;
    font-size: 14px;
    color: #999999;
    letter-spacing: 1.64px;
    background: #F8F8F8;
    border: 1px solid #E2E2E2;
    border-radius: 6px;
}
.submit{
    width: 360px;
    height: 50px;
    margin: 0 auto;
    background: #e01452;
    border-radius: 6px;
    font-family: PingFang-SC-Regular;
    font-size: 20px;
    color: #FFFFFF;
    letter-spacing: 2.34px;
    margin-top: 30px;
    text-align: center;
    line-height: 50px;
}
.prompt{
    font-family: PingFang-SC-Medium;
    font-size: 12px;
    color: #e01452;
    letter-spacing: 1.4px;
    text-align: center;
    margin: 0 auto;
    margin-top: 22px;
    width: 130px;
    
}
.promptImg{
    width: 10px;
    height: 10px;
    margin-bottom: -13px;
    margin-right: 4px;
}

.QR_code{
    width: 437px;
    height: 470px;
    background: #FFFFFF;
    box-shadow: 0 0 22px 0 rgba(0,0,0,0.10);
    margin-top: 20px;
    padding-top: 40px;
    text-align: center;
}
.qrTitle{
    font-family: PingFang-SC-Regular;
    font-size: 22px;
    color: #000000;
    letter-spacing: 2.87px;
    text-align: center;
    line-height: 36px;
}
.qrImg{
    width: 258px;
    height: 258px;
    margin: 0 auto;
    margin-top: 40px;
}
.change{
    font-family: PingFang-SC-Regular;
    font-size: 18px;
    color: #e01452;
    letter-spacing: 2.11px;
    margin: 0 auto;
    width: 88px;
}
.change a:active{color:#000;}
.changeImg{
    width: 16px;
    height: 18.1px;
    display: inline-block;
    margin-bottom: -3px;
}

@media screen and (max-width:768px){
    .yueLi,.yueContent,.introduction{
        width: 100%;
        height: auto;
    }
    .yueContent{
        padding: 0 10px;
    }
    .yueList{
        margin-right: 0;
    }
    .yueLi{
        padding-bottom: 20px;
        align-items: flex-start;
    }
    .yueRight{
        display: none;
    }
    .yueLiImg{
        width: 30%;
        height: auto;
        flex-shrink: 0;
    }
    .yueName{
        font-size: 18px;
        margin-top: 0;
    }
    .yueLi .introduction{
        line-height: 1.4;
    }
}