span {
    vertical-align: baseline;
}
@font-face {
    font-family: "HYQiHei";
    src: url("https://res.zulong.com/cms/mystyle/fonts/HanQiHei.otf");
}

.red {
    color: red;
}

.loading {
    width: 100vw;
    height: 100vh;
    position: fixed;
    background: rgba(0, 0, 0, 0.8);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
}

.loading img {
    width: 2rem;
}

.dialog {
    font-family: "HYQiHei";
    width: 100vw;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 999;
    box-sizing: border-box;
}

.dialog-main {
    width: 5.47rem;
    height: 7.36rem;
    border-radius: 0.04rem;
    border: 0.23rem solid rgba(255, 255, 255, 0.55);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.2rem;
    /* overflow: auto; */
}

.dialog-main-con {
    background: #fff;
    width: 100%;
    height: 100%;
    border: 0.03rem dotted #5163B8;
    border-radius: 0.04rem;
}

.dialog-close {
    width: 0.2rem;
    height: 0.2rem;
    position: absolute;
    right: 0.2rem;
    top: 0.2rem;
    background: url(../../img/mo/pop_close.png) no-repeat top center;
    background-size: 100%;
}

.dialog-q-content {
    width: 100%;
    display: flex;
}

.dialog-q-content img {
    width: 100%;
}

.dialog-q .dialog-main {
    height: 6.81rem;
}

.dialog-q .dialog-close {
    right: -0.21rem;
    top: -0.21rem;
}

.dialog-rule .dialog-main-con {
    padding: 0.35rem 0.3rem;
    line-height: 0.27rem;
    box-sizing: border-box;
    overflow: auto;
}

.dialog-info .dialog-main {
    text-align: center;
    height: 2rem;
    /* line-height: 2rem; */
    overflow: initial;
    font-size: 0.24rem;

}

.dialog-info .dialog-main-con {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0.5rem;
    /* text-align: center;
    box-sizing: border-box;
    padding-top: 0.6rem; */
}

.dialog-info .dialog-main span {
    /* word-break: break-all; */
}

.dialog-code .dialog-main {
    height: 5.47rem;
}

.dialog-code-title {
    font-size: 0.4rem;
    text-align: center;
    margin-top: 0.4rem;
}

#qrcode {
    width: 3.6rem;
    height: 3.6rem;
    margin: 0 auto;
    margin-top: 0.4rem;
}

#qrcode img {
    width: 100%;
    height: 100%;
}

.zfb-code {
    color: #1677FF;
}

.wx-code {
    color: #09BB07;
}

.pay-success-con {
    text-align: center;
}

.pay-success-img {
    width: 35%;
    margin-top: 0.8rem;
}

.pay-success-info {
    font-size: 0.4rem;
    color: #000;
    margin-top: 0.4rem;
}

.zfb-code .pay-success-info>span {
    color: #1677FF;
    cursor: pointer;
}

.wx-code .pay-success-info>span {
    color: #09BB07;
    cursor: pointer;
}

.dialog-inPayment .dialog-main {
    height: 5.47rem;

}

.dialog-inPayment .dialog-main-con {
    width: 100%;
    height: 100%;
}

.dialog-inPayment-img {
    width: 2.84rem;
    height: 1.56rem;
    background: url(../../img/pc/in_payment.png) no-repeat top center;
    background-size: 100%;
    margin: 0 auto;
    margin-top: 0.79rem;
}

.dialog-inPayment-info1 {
    font-weight: bold;
    font-size: 0.27rem;
    text-align: center;
    color: #2F2F2F;
    margin-top: 0.28rem;
}

.dialog-inPayment-info2 {
    font-size: 0.22rem;
    text-align: center;
    color: #2F2F2F;
    line-height: 0.48rem;
    width: 4.04rem;
    margin: 0 auto;
    margin-top: 0.5rem;
}

/* 登录 */
.dialog-sign-in .dialog-main {
    width: 10.45rem;
    height: 8.72rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url(../../img/pc/pop/pop_box.png) no-repeat top center;
    background-size: 100% 100%;
    padding: 2.6rem 1.5rem 0 1.5rem;
    box-sizing: border-box;
    border: none;
}

.dialog-close2 {
    width: 0.98rem;
    height: 0.83rem;
    background: url(../../img/pc/pop/login_close.png) no-repeat top center;
    background-size: 100%;
    position: absolute;
    right: 0.65rem;
    top: -0.94rem;
    cursor: pointer;
}

.dialog-sign-in .account-form {
    margin: 0.5rem 0;
}

.backAccountLogin {
    text-decoration: underline;
    cursor: pointer;
    text-align: center;
    margin-top: 0.8rem;
    color: #000;
    font-size: 0.22rem;
}

.dialog-sign-in input {
    width: 100%;
    height: 0.8rem;
    box-shadow: 0px 1px 3px 0px rgba(184, 183, 201, 0.43);
    border: none;
    margin-bottom: 0.2rem;
    color: #b8b7c9;
    font-size: 0.3rem;
    padding-left: 0.2rem;
    box-sizing: border-box;
}

.dialog-sign-in .code-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: top;
}

.dialog-sign-in .sign-in-btn,
.dialog-sign-in .code-btn {
    width: 3.1rem;
    height: 0.8rem;
    color: #fff;
    background-color: #A64643;
    margin: 0.3rem auto 0;
    font-size: 0.42rem;
    line-height: 0.9rem;
    text-align: center;
    cursor: pointer;
    border-radius: 0.06rem;
}

.dialog-sign-in .code-btn {
    width: 2.4rem;
    height: 0.8rem;
    margin: 0 0 0 0.2rem;
    border: none;
    line-height: 0.8rem;
}

.dialog-sign-in .code-btn.disabled-btn {
    font-size: 0.26rem;
}

.dialog-sign-in .tool-bars {
    display: flex;
    justify-content: space-between;
    font-size: 0.36rem;
    text-align: center;
    margin-top: 0.26rem;
    margin-bottom: 0.2rem;
}

.dialog-sign-in .tool-bars .psw,
.dialog-sign-in .tool-bars .apple {
    width: 3.52rem;
    height: 0.8rem;
    line-height: 0.8rem;
    background: url(../../img/pc/pop/pop_btn1.png) no-repeat top center;
    background-size: 100%;
    color: #e1e1e1;
    position: relative;
    cursor: pointer;
}

.dialog-sign-in .tool-bars .apple {
    background: url(../../img/pc/pop/pop_btn2.png) no-repeat top center;
    background-size: 100%;
}

.dialog-sign-in .tool-bars .psw>span,
.dialog-sign-in .tool-bars .apple>span {
    position: relative;
    left: 0.2rem;
}

.dialog-sign-in .tips {
    text-align: center;
    line-height: 0.32rem;
    color: #424243;
}

.dialog-sign-in .protocol {
    display: flex;
    justify-content: center;
}

.dialog-sign-in .protocol a {
    color: #424243;
    text-decoration: underline;
}

.dialog-sign-in .checkbox-btn,
.dialog-sign-in .checkbox-btn.checked {
    width: 0.32rem;
    height: 0.32rem;
    background: url(../../img/pc/pop/pop_select.png) no-repeat top center;
    background-size: 100%;
    margin-right: 0.12rem;
    cursor: pointer;
}

.dialog-sign-in .checkbox-btn.checked {
    background: url(../../img/pc/pop/pop_select1.png) no-repeat top center;
    background-size: 100%;
}

.dialog-confirm-exchange .dialog-main3,
.dialog-confirm-coupon .dialog-main3 {
  padding-top: 1.4rem;
}
.dialog-confirm-exchange .msg,
.dialog-success-exchange .msg,
.dialog-confirm-coupon .msg {
  font-size: 0.32rem;
  color: #171717;
  text-align: center;
}
.dialog-confirm-exchange .confirm-btn,
.dialog-confirm-coupon .confirm-btn,
.dialog-success-exchange .btn-group > div {
  width: 3.1rem;
  height: 0.94rem;
  background: url(../../img/pop_btn4.png) no-repeat top center;
  background-size: 100%;
  margin: 0.5rem auto 0;
  font-size: 0.3rem;
  color: #eadfce;
  text-align: center;
  line-height: 0.7rem;
  cursor: pointer;
}

/* 角色 */

.dialog-roles .dialog-main {
    width: 16.51rem;
    height: 8.09rem;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url(../../img/pc/pop/pop_box1.png) no-repeat top center;
    background-size: 100%;
    border: none;

}

.dialog-roles .dialog-close2 {
    top: -0.9rem;
}

.dialog-roles .dialog-main-con2 {
    padding: 0.47rem 0 0 1.4rem;
}

.dialog-roles .role-title {
    width: 2.62rem;
    height: 0.8rem;
    background: url(../../img/pc/pop/pop_btn3.png) no-repeat top center;
    background-size: 100%;
}

.dialog-roles .role-list {
    margin-top: 0.4rem;
    width: 13.5rem;
    height: 4.6rem;
    display: flex;
    flex-wrap: wrap;
    overflow-y: auto;
}

.dialog-roles .role-item {
    width: 4.43rem;
    height: 1.57rem;
    background: url(../../img/pc/pop/pop_boxbg.png) no-repeat top center;
    background-size: 100%;
    padding: 0.2rem 0 0 0.36rem;
    box-sizing: border-box;
    cursor: pointer;
}

.dialog-roles .role-item>div {
    max-width: 90%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.dialog-roles .role-name {
    font-size: 0.3rem;
    color: #2b2826;
}

.dialog-roles .role-id {
    font-size: 0.26rem;
    color: #2b2826;
}

.dialog-roles .role-server {
    font-size: 0.2rem;
    color: #fff;
    margin-top: 0.26rem;
    text-align: right;
}

/* 优惠卷 */
.dialog-coupon .dialog-main {
    width: 10.45rem;
    height: 9.43rem;
    background: url(../../img/pc/pop/pop_box3.png) no-repeat top center;
    background-size: 100%;
    border: none;
    padding: 0.9rem 1.23rem 0 1.3rem;
    box-sizing: border-box;
    transform: translate(-50%, -50%) scale(0.8);
}

.dialog-coupon .dialog-close {
    width: 0.98rem;
    height: 0.93rem;
    background: url(../../img/pc/pop/login_close.png) no-repeat top center;
    background-size: 100%;
    position: absolute;
    right: 0.8rem;
    top: -0.98rem;
    cursor: pointer;
}

.dialog-coupon .tips {
    font-size: 0.36rem;
    color: #A64643;
    line-height: 0.48rem;
}

.dialog-coupon .main-list {
    height: 5.7rem;
    overflow-y: auto;
    padding: 0 0.2rem;
    margin: 0 auto;
    margin-top: 0.09rem;

}

.dialog-coupon .coupon-item {
    margin-top: 0.16rem;
    width: 7.3rem;
    height: 1.25rem;
    background: url(../../img/pc/pop/pop_boxbj.png) no-repeat top center;
    background-size: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.74rem;
    box-sizing: border-box;
    font-size: 0.18rem;
}

.dialog-coupon .left {
    color: #A64643;
    font-size: 0.22rem;
}

.dialog-coupon .price {
    vertical-align: baseline;
}

.dialog-coupon .price>span:nth-child(1) {
    font-size: 0.36rem;
    position: relative;
    top: 0.15rem;
    font-weight: bold;
}

.dialog-coupon .price>span:nth-child(2) {
    font-size: 0.6rem;
}

.dialog-coupon .right>p:nth-child(1) {
    font-size: 0.36rem;
    line-height: 0.46rem;
    margin-top: 0.1rem;
    color: #424243;
}

.dialog-coupon .right>p:nth-child(2) {
    font-size: 0.22rem;
    color: #424243;
    margin-top: 0.1rem;
}

.dialog-coupon .rule-btn {
    font-size: 0.28rem;
    color: #A64643;
    float: right;
    margin: 0.12rem 0 0.13rem 0;
    cursor: pointer;
}

.dialog-coupon .use-btn {
    width: 3.1rem;
    height: 0.94rem;
    background: url(../../img/pc/pop/pop_btn4.png) no-repeat top center;
    background-size: 100%;
    margin: 0.65rem auto;
    cursor: pointer;
}

.dialog-coupon-rule .dialog-main {
    width: 6.44rem;
    height: 7.12rem;
    background: url(../../img/pc/pop/pop_rulebox.png) no-repeat top center;
    background-size: 100%;
    border: none;
    padding: 0.71rem 0.57rem;
    box-sizing: border-box;
}

.dialog-coupon-rule .dialog-close {
    width: 0.17rem;
    height: 0.19rem;
    background: url(../../img/pc/pop/coupon_close.png) no-repeat top center;
    background-size: 100%;
    position: absolute;
    right: 0.4rem;
    top: 0.4rem;
    cursor: pointer;
}

.dialog-coupon-rule .dialog-coupon-rule-title {
    font-size: 0.5rem;
    margin: 0 auto;
    font-weight: bold;
    color: #A64643;
    text-align: center;
    margin-bottom: 0.4rem;
}


.dialog-coupon-rule .rule-list {
    font-size: 0.22rem;
    color: #171717;
    line-height: 0.34rem;
    margin-top: 0.2rem;
}

.dialog-coupon-rule .close-btn {
    width: 2.73rem;
    height: 0.7rem;
    background: url(../../img/coupon/pc/pop_rulebtn.png) no-repeat top center;
    background-size: 100%;
    cursor: pointer;
    margin: 0.2rem auto;
}


.dialog-confirm-coupon .dialog-main3 {
    width: 10.45rem;
    height: 6.38rem;
    background: url(../../img/pay_tip_pop.png) no-repeat top center;
    background-size: 100%;
    border: none;
    padding: 2rem 1rem; 
    box-sizing: border-box;
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
}