body {
    position: relative;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}
.isHide {
    display: none;
}
.modal {
    width: 100%;
}

.modal .modal-mask {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    /* height: 100vh; */
    z-index: 100;
    background-color: rgba(0, 0, 0, 0.7);
}
.modal .modal-mask .modal-close {
    width: 2.25rem;
    height: 2.25rem;
    position: absolute;
    top: 0.75rem;
    right: 19%;
    cursor: pointer;
}
.modal .modal-mask .modal-content {
    width: 75rem;
    height: 50rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /* background: url(../img/loginModalImg/loginModalBg.png) no-repeat center/ */
    /* 100%; */
    border-radius: 1rem;
}
.modal .modal-mask .content-top {
    display: flex;
    align-items: center;
    position: absolute;
    top: 5.8125rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9;
}

.modal .modal-mask .modal-content .modal-bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.modal .modal-mask .modal-content .modal-form-box {
    width: 34.375rem;
    height: 31.25rem;
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, 0.6);
    border: 0.125rem solid #ffffff;

    box-shadow: 0px 0.5rem 1.25rem 0px rgba(40, 120, 255, 0.1);
    position: absolute;
    top: 11rem;
    left: 50%;
    transform: translateX(-50%);
    padding: 0px 6.8125rem;
    box-sizing: border-box;
}
.modal .modal-mask .modal-content .modal-form-box .form-box-top {
    width: 6.9375rem;
    height: 6.375rem;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}
.modal .modal-mask .modal-content .modal-form-box .form-box-top img {
    width: 100%;
    height: 100%;
    position: absolute;
}
/* 顶部tab部分start */
.modal .modal-mask .modal-content .modal-form-box .formTab {
    display: flex;
    gap: 1.875rem;
    justify-content: center;
    margin-bottom: 1.9375rem;
}
.modal .modal-mask .modal-content .modal-form-box .formTab .tabText {
    font-family: 思源黑体;
    font-size: 1.25rem;
    font-weight: 500;
    color: #333333;
    cursor: pointer;
}
.modal .modal-mask .modal-content .modal-form-box .formTab .tabActive {
    font-weight: bold;
    padding-bottom: 0.625rem;
    border-bottom: 0.25rem solid #2878ff;
}
/* 顶部tab部分end */

/* 登录表单部分start */
/* 输入框部分 */
.modal .modal-mask .modal-content .modal-form-box .loginFormInps {
    /* height: 210px; */
    /* margin-top: 3.625rem; */
    /* display: flex;
	flex-direction: column;
	justify-content: space-between; */
}
.modal .modal-mask .modal-content .modal-form-box .loginFormInps .formInpsItem {
    width: 100%;
    /* height: 3.125rem; */
    position: relative;
    padding-bottom: 1.875rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .formInput {
    width: 100%;
    height: 3.125rem;
    border-radius: 0.25rem;
    background: #ffffff;
    border: 0.0625rem solid #c5c5c5;
    box-sizing: border-box;
    padding: 0 2.5rem;
    outline: none;
    color: #333333;
    font-size: 0.875rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .formInput::placeholder {
    color: #999999;
    font-size: 0.875rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .inpIcon {
    width: 1.5rem;
    height: 1.5rem;
    /* display: inline-block; */
    position: absolute;
    top: 0.75rem;
    /* transform: translateY(-50%); */
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .inpIconBefore {
    left: 0.4375rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .inpIconAfter {
    right: 0.4375rem;
    cursor: pointer;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .loginFirst {
    background: url(../img/loginModalImg/user.png) no-repeat center;
    background-size: 1.5rem 1.5rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .loginPhone {
    background: url(../img/loginModalImg/phone.png) no-repeat center;
    background-size: 1.5rem 1.5rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .phoneNumber {
    font-family: 思源黑体;
    font-size: 0.875rem;
    font-weight: normal;
    color: #9e9e9e;
    right: .4375rem;
    padding-right: 1.0625rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .loginPass {
    background: url(../img/loginModalImg/password.png) no-repeat center;
    background-size: 1.5rem 1.5rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .loginInvita {
    background: url(../img/loginModalImg/invitationCode.png) no-repeat center;
    background-size: 1.5rem 1.5rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .passLook {
    background: url(../img/loginModalImg/showPass.png) no-repeat center;
    background-size: 1.5rem 1.5rem;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .formInpsItem
    .passNoLook {
    background: url(../img/loginModalImg/hidePass.png) no-repeat center;
    background-size: 1.5rem 1.5rem;
}
/* 登录表单部分end */

/* 按钮部分start */
.modal .modal-mask .modal-content .modal-form-box .formBtn {
    margin: 0 0 0.6875rem;
}
.modal .modal-mask .modal-content .modal-form-box .formBtn .loginBtn {
    width: 100%;
    height: 3.125rem;
    border-radius: 0.25rem;
    background: #2878ff;
    font-family: 思源黑体;
    font-size: 1.25rem;
    font-weight: 500;
    color: #ffffff;
    border: 0px;
    cursor: pointer;
    letter-spacing: 0.0625rem;
}
/* 按钮部分end */

/* 勾选框、提示部分start */
.modal .modal-mask .modal-content .modal-form-box .loginFormInps .checkLogin {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .checkLogin
    .sevenFreeLogin {
    font-family: 思源黑体;
    font-size: 0.875rem;
    font-weight: normal;
    color: #b0b0b0;
    display: flex;
    align-items: center;
}
/* .sevenFreeLogin input {
	color: #3a69f9;
} */
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .checkLogin
    .sevenFreeLogin
    input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    width: 0.875rem; /* 微调尺寸更易点击 */
    height: 0.875rem;
    background-color: #fff;
    border: 0.0625rem solid #dcdfe6; /* 更柔和的边框色 */
    border-radius: 0.1875rem;
    outline: none;
    margin-right: 0.5rem; /* 优化间距比例 */
    cursor: pointer; /* 鼠标悬浮提示可点击 */
    position: relative; /* 用于定位对勾图标 */
    transition: all 0.2s ease; /* 平滑过渡效果 */
}

/* hover 状态：增强交互反馈 */
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .checkLogin
    .sevenFreeLogin
    input[type="checkbox"]:hover {
    border-color: #3a69f9; /* 悬浮时边框变色 */
    background-color: #f5f7ff; /* 轻微背景色变化 */
}

/* 选中状态：添加对勾图标 */
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .checkLogin
    .sevenFreeLogin
    input[type="checkbox"]:checked {
    background-color: #3a69f9;
    border-color: #3a69f9; /* 选中时边框与背景色一致 */
}

/* 用伪元素实现对勾图标 */
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .checkLogin
    .sevenFreeLogin
    input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 0.1875rem; /* 对勾水平定位 */
    top: 0px; /* 对勾垂直定位 */
    width: 0.25rem; /* 对勾宽度 */
    height: 0.5rem; /* 对勾高度 */
    border: 0.125rem solid #fff; /* 对勾颜色（白色） */
    border-top: none; /* 隐藏上边框 */
    border-left: none; /* 隐藏左边框 */
    transform: rotate(45deg); /* 旋转45度形成对勾 */
}

/* 聚焦状态：优化可访问性（适配键盘导航） */
.modal
    .modal-mask
    .modal-content
    .modal-form-box
    .loginFormInps
    .checkLogin
    .sevenFreeLogin
    input[type="checkbox"]:focus-visible {
    outline: 0.125rem solid #3a69f940; /* 柔和的聚焦轮廓 */
    outline-offset: 0.125rem;
}
.existAccount {
    text-align: center;
    font-family: 思源黑体;
    font-size: 0.875rem;
    font-weight: normal;
}

.existAccount .account {
    color: #999999;
}

.existAccount .goto {
    color: #2878ff;
    cursor: pointer;
}
/* 勾选框、提示部分end */

/* 底部条款部分start */
.modal .modal-mask .modal-content .modal-form-box .loginRightBoxBot {
    width: 100%;
    text-align: center;
    /* margin-top: 7.8125rem; */
    position: absolute;
    bottom: 2.3125rem;
    left: 50%;
    transform: translate(-50%);
}
.modal .modal-mask .modal-content .modal-form-box .loginRightBoxBot .botYes {
    font-family: Source Han Sans;
    font-size: 0.75rem;
    font-weight: normal;
    color: #9e9e9e;
}
.modal .modal-mask .modal-content .modal-form-box .loginRightBoxBot .botTerms {
    font-family: Source Han Sans;
    font-size: 0.75rem;
    font-weight: normal;
    color: #2a5ee8;
    cursor: pointer;
}
/* 底部条款部分end */

/* 条款弹窗部分start */
/* 蒙层 */
.maskLayer {
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
/* 用户协议弹窗 */
.userAgreeModal {
    width: 50rem;
    height: 28.125rem;
    border-radius: 0.625rem;
    background: linear-gradient(180deg, #eaefff 0%, #ffffff 100%);
    position: fixed;
    top: 20%;
    left: 50%;
    transform: translate(-50%);
    z-index: 1;
}
.modalTitle {
    height: 3.75rem;
    border-bottom: 0.0625rem solid #d4dbee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1.25rem;
    font-size: 1.125rem;
    font-weight: bold;
}
.modalCont {
    max-height: 18.75rem;
    padding: 1.25rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    overflow-y: auto;
}
.modalbtn {
    text-align: right;
    padding-right: 1.25rem;
}
.modalbtn button {
    width: 5.25rem;
    height: 2rem;
    background: #3a69f9;
    color: #ffffff;
    border: 0rem;
    border-radius: 0.25rem;
    cursor: pointer;
    font-size: 0.875rem;
}
/* 条款弹窗部分end */

/* 扫码登录start */
.scanToLoginTitle {
    font-family: Source Han Sans;
    font-size: 2.25rem;
    font-weight: 500;
    line-height: 2.875rem;
    text-align: center;
    margin-bottom: 2.625rem;
}
/* 扫码登录end */
/* 输入框报错样式 */
.errorMsg {
    color: #f5222d;
    font-size: 0.75rem;
    font-weight: normal;
    position: absolute;
	margin-top: .25rem;
	letter-spacing: .0156rem;
}
.yzmCodeStyle {
    font-family: 思源黑体;
    font-size: 0.875rem;
    text-align: center;
    color: #2878ff;
    position: absolute;
    top: .625rem;
    right: 0;
    cursor: pointer;
    border-left: .0625rem solid #c5c5c5;
    padding: .3125rem 1.25rem;
    /* margin: 0.4375rem; */
}
