.bgBoxs {
    width: 100%;
    min-height: 100vh;
    background-color: #FFFFFF;
}
.topImgs{
    width: 100%;
    height: 8.39rem;
}


.formBox {
    overflow: hidden;
    background-color: #fff;
    border-radius: .18rem;
    width: 100%;
    margin: 0 auto;
    padding: 0 .71rem;
   
}

.create-form .form-input {
    display: flex;
}

.create-form .form-input input {
    height: 0.97rem;
    border-radius: 0.07rem;
    border: 0.02rem solid rgba(231, 231, 231, 1);
    box-sizing: border-box;
    padding-left: .29rem;
    color: #333;
    font-size: .3533rem;
    width: 100%;
}
.create-form .form-input input::placeholder{
    color: #D7D7D7;
    font-size: .3533rem;
}

.create-form .form-input {
    margin-top: 0.5rem;
    display: flex;
    width: 100%;
}


input[type=text],
input[type=submit],
input[type=number],
select {
    height: 1rem;
    outline: none;
}
.create-form .form .code-input  input{
    position: relative;
   width: 4.18rem!important;
}


.create-form .submit {
    height: 1.1rem;
    background: url('./img/btnImg.png') no-repeat center;
    background-size: 100% 100%;
    border-radius: 0.7rem;
    text-align: center;
    line-height: 1.1rem;
    font-size: .35rem;
    color: #fff;
    margin-top: .55rem;
    margin-bottom: 0.55rem;
}

/* .create-form .form-input .phone {
    background: url(../img/phonePink.png) no-repeat left .33rem center;
    background-size: .38rem .46rem;

}

.create-form .form-input .code {
    width: 4.1rem;
    background: url(../img/emailPink.png) no-repeat left .33rem center;
    background-size: .38rem .46rem;

} */

.create-form .code-input .getcode {
    flex: 1;
    height: 0.97rem;
    border-radius: .11rem;
    border: .02rem solid #FF6B6B;
    box-sizing: border-box;
    line-height: .95rem;
    text-align: center;
    margin-left: .13rem;
    color: #FF6B6B;
    font-size: 0.31rem;
}

.textImg{
    width: 100%;
    height: 7.51rem;
}
.botImg{
    width: 100%;
    height: 4.1rem;
}
.evaluateTitle{
    width: 100%;
    padding-bottom: .12rem;
    background-color:#FbFbFb ;
}

.exampleBox  {
    width: 100%;
    margin-top: .29rem;
    background-color: #fff;

}

.sonBox {
    width: 7.62rem;
    margin: 0 auto;

}

.sonBox:last-child .content:last-child {
    border-bottom: none;
}

.sonBox .userBox {
    width: 100%;
    display: flex;
    padding-top: .35rem;
}

.sonBox .user {
    display: flex;
    width: 50%;
    height: .53rem;

}

.sonBox .user img {
    width: .53rem;
    height: .53rem;
}

.sonBox .user .username {
    font-size: .35rem;
    line-height: .58rem;
    color: #444;
    margin-left: .18rem;
}

.sonBox .dateBox {
    height: .53rem;
    display: flex;
    flex-direction: row-reverse;
    width: 50%;
  
}

.sonBox .dateBox .icon {
    display: block;
    width: .27rem;
    height: .27rem;
    margin-right: .07rem;
    margin-top: .15rem;
}

.dateBox .date {
    font-size: .27rem;
    color: #999;
    line-height: .58rem;
    
}

.exampleBox .tagBox {
    display: flex;
    width: 7.62rem;
    margin: 0 auto;
    margin-top: .22rem;
}

.exampleBox .tagBox .tag {
    width: fit-content;
    font-size: .27rem;
    padding: 0 .22rem;
    height: .4rem;
    border: solid .02rem #ECF1F1;
    line-height: .38rem;
    color: #999999;
    border-radius: .2rem;
    margin-left: .13rem;
}

.exampleBox .tagBox .tag:first-child {
    margin-left: 0;
}




.sonBox .content {
    position: relative;
    width: 7.62rem;
    display: flex;
    margin-top: .22rem;
    padding-bottom: .42rem;
    border-bottom: .02rem solid #F3F3F3;
}

.sonBox .content .leftBox {
    width: 4.33rem;
    color: #444;
    font-size: .31rem;
    line-height: .46rem;
}

.sonBox .content .leftBox .textBox {
    height: 1.39rem;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.sonBox .content .leftBox p {
    line-height: .39rem;
    overflow: hidden;
    /* 溢出部分进行隐藏 */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    /* 盒模型元素从顶部向底部垂直排列子元素 */
    -webkit-line-clamp: 3;
    /* 显示两行 */
    text-overflow: ellipsis;

}

.sonBox.content .leftBox .setMeal {
    width: 3.31rem;
    height: .53rem;
    color: #444;
    font-size: .27rem;
    line-height: .54rem;
    background-color: #F5F5F5;
    border-radius: .04rem;
    text-align: center;
}

.sonBox .content .rightBox {
    position: absolute;
    width: 3.14rem;
    margin-left: .154rem;
    right: 0;
    clip: rect(0px, 3.14rem, 2.01rem, 0px)
}

.content .leftBox .audioBox {

    position: relative;
    height: 0.84rem;
    background: rgba(243, 255, 254, 1);
    border-radius: 0.09rem;
    border: 1px solid rgba(6, 193, 174, 1);
    padding-left: .35rem;
    color: #06C1AE;
    margin-bottom: .32rem;
    display: flex;
    margin-top: .32rem;

}

.leftBox .audioBox .left {
    left: 1.04rem;
    top: .17rem;
    position: absolute;

}

.audioBox .iconBox {
    width: .49rem;
    display: flex;
    height: 0.33rem;
    margin-top: .22rem;
    overflow: hidden;

}

.audioBox img:nth-child(1) {
    width: .29rem;
    height: .33rem;

}

.audioBox img:nth-child(2) {
    width: .07rem;
    height: .15rem;
    margin-top: .09rem;
    margin-left: .02rem;


}

.audioBox img:nth-child(3) {
    width: .07rem;
    height: .24rem;
    margin-top: .045rem;
    margin-left: .02rem;

}






.leftBox .curr .iconBox {

    animation: horn 1.3s linear infinite;

}

audio:not([controls]) {
    display: none;
    height: 0;
}

@keyframes horn {

    0% {
        width: .29rem;
    }

    50% {
        width: .38rem;
    }

    60% {
        width: .49rem;
    }

    100% {
        width: .49rem;
    }

}

.spillPop {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(0, 0, 0, .8);
    top: 0;
    left: 0;
}

.spillBox {
    position: relative;
    width: 6.63rem;
    margin: 0 auto;
    background-color: #fff;
    margin-top: 6.23rem;
    border-radius: .22rem;


}

.spillBox .topBox {
    display: flex;
    line-height: .53rem;
    padding: .35rem;
    padding-bottom: .18rem;

}

.spillBox .topBox img {
    width: .53rem;
    height: .53rem;

}

.spillBox .topBox p {
    margin-left: .18rem;
    color: #444;
    line-height: .60rem;
}

.spillBox .text {
    font-size: .31rem;
    padding: .35rem;
    padding-top: 0rem;
    line-height: .49rem;
    color: #444;

}

.spillBox .close {
    width: 0.88rem;
    position: absolute;
    height: 0.88rem;
    border: 2px solid #FFFFFF;
    background: url(../../../../images/guanbi@2x.png) no-repeat center;
    background-size: 0.5rem 0.5rem;
    top: 100%;
    left: 50%;
    margin-top: 0.4rem;
    margin-left: -0.44rem;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


.soneMore {
    padding: .35rem 0;
    display: flex;
    width: 7.62rem;
    margin: 0 auto;
    text-align: center;
    justify-content: center;
}

.soneMore p {
    font-size: .35rem;
    color: #06C1AE;
}

.soneMore a {
    font-size: .35rem;
    color: #06C1AE;
}

.soneMore img {
    width: .24rem;
    height: .13rem;
    margin-top: .17rem;
    margin-left: .16rem;
}

.copyRight {
    width: 100%;
    height: .97rem;
    line-height: .97rem;
    text-align: center;
    color: #999;
    font-size: .27rem;
    margin-bottom: 1.08rem;
}