.LoginScanCode {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    gap: 20px
}

.LoginScanCode .scan-img {
    width: 181px;
    height: 181px;
    border-radius: 10px 10px 10px 10px;
    opacity: 1;
    border: 1px solid #e4e7ee;
    margin-top: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative
}

.LoginScanCode .scan-img img {
    width: 100%;
    height: 100%
}

.LoginScanCode .scan-img .after {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-size: cover;
    border-radius: 4px;
    border: 1px solid #cfcfcf;
    padding: 1px;
    box-shadow: 0 0 0 3px #fff
}

.LoginScanCode .scan-img .count-down {
    width: 181px;
    height: 181px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
    background-color: hsla(0, 0%, 100%, .8);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer
}

.LoginScanCode .scan-img .count-down i {
    font-size: 20px
}

.LoginScanCode .tips {
    text-align: center;
    color: #000;
    font-weight: 400
}

.LoginScanCode .tips .pink {
    color: #fe2c81
}

.LoginScanCode .footer-tips {
    position: absolute;
    bottom: 0;
    width: 100%;
    border-top: .5px solid #ececec;
    height: 57px;
    display: flex;
    align-items: center;
    justify-content: center
}

.LoginScanCode .footer-tips span {
    color: #209bff;
    font-weight: 400;
    cursor: pointer
}

.LoginCode {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.LoginCode .login-form {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column
}

.LoginCode .login-form .form-item {
    margin-top: 18px;
    width: 294px;
    height: 52px;
    border: 1px solid #d0d5de;
    border-radius: 10px 10px 10px 10px;
    opacity: 1;
    padding: 0 19px;
    position: relative
}

.LoginCode .login-form .form-item input {
    outline: none;
    width: 100%;
    height: 100%;
    background: transparent;
    border: none;
    font-size: 14px
}

.LoginCode .login-form .form-item .position {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%)
}

.LoginCode .login-form .form-item .send-code {
    color: #209bff;
    font-weight: 500;
    font-size: 14px;
    cursor: pointer
}

.LoginCode .login-form .form-item .count-down {
    color: #acb2b8;
    cursor: default
}

.LoginCode .login-form .focus {
    border-color: #209bff
}

.LoginCode .login-form .form-agreement {
    margin-top: 18px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: #333;
    font-size: 14px
}

.LoginCode .login-form .form-agreement span {
    font-weight: 400;
    color: #209bff;
    margin: 0 2px;
    cursor: pointer
}

.LoginCode .login-form .form-agreement .choose {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1px solid #d0d5da;
    margin-right: 2px;
    cursor: pointer
}

.LoginCode .login-form .form-agreement .active {
    background-image: url(../images/chooseIn.svg);
    background-size: cover;
    border: none
}

.LoginCode .login-form .submit-btn {
    margin-top: 18px;
    width: 298px;
    height: 48px;
    background: #209bff;
    border-radius: 10px 10px 10px 10px;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    color: #fff;
    font-size: 20px;
    cursor: pointer
}

.LoginCode .login-form .loading {
    background: rgba(32, 155, 255, .5);
    cursor: wait
}

.LoginCode .login-form .other-login {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: -20px
}

.LoginCode .login-form .other-login .other-login-title {
    color: #333;
    font-weight: 400;
    font-size: 16px;
    position: relative;
    margin-top: 12px
}

.LoginCode .login-form .other-login .other-login-title:after {
    content: "";
    width: 112px;
    height: 2px;
    background: #d0d5da;
    position: absolute;
    top: 50%;
    right: 90px;
    transform: translateY(-50%);
    display: block
}

.LoginCode .login-form .other-login .other-login-title:before {
    position: absolute;
    display: block;
    content: "";
    width: 112px;
    height: 2px;
    background: #d0d5da;
    top: 50%;
    left: 90px;
    transform: translateY(-50%)
}

.LoginCode .login-form .other-login .other-login-content {
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: center
}

.LoginCode .login-form .other-login .other-login-content img {
    width: 40px;
    height: 40px;
    cursor: pointer
}

.LoginCode .login-form .other-login .other-login-content img:hover {
    transform: scale(110%)
}

.LoginCode .login-form .other-login .other-login-content img:first-child {
    margin-right: 27px
}

.LoginCode .login-form .other-login .other-login-content img:last-child {
    margin-left: 27px
}

.LoginCode .footer-tips {
    position: absolute;
    bottom: 0;
    width: 100%;
    border-top: .5px solid #ececec;
    height: 57px;
    display: flex;
    align-items: center;
    justify-content: center
}

.LoginCode .footer-tips span {
    color: #209bff;
    font-weight: 400;
    cursor: pointer
}

.FindPass {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%
}

.FindPass .login-form {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    margin-top: 34px
}

.FindPass .login-form .form-item {
    margin-top: 18px;
    width: 298px;
    height: 48px;
    border: 1px solid #d0d5de;
    border-radius: 10px 10px 10px 10px;
    opacity: 1;
    padding: 0 19px;
    position: relative
}

.FindPass .login-form .form-item input {
    outline: none;
    width: 100%;
    height: 100%;
    background: transparent;
    border: none;
    font-size: 16px
}

.FindPass .login-form .form-item .position {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%)
}

.FindPass .login-form .form-item .send-code {
    color: #209bff;
    font-weight: 500;
    font-size: 16px;
    cursor: pointer
}

.FindPass .login-form .form-item .count-down {
    color: #acb2b8;
    cursor: default
}

.FindPass .login-form .focus {
    border-color: #209bff
}

.FindPass .login-form .submit-btn {
    background: #209bff;
    border-radius: 10px 10px 10px 10px;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    margin-top: 21px;
    width: 298px;
    height: 48px
}

.FindPass .login-form .back {
    margin-top: 20px;
    font-weight: 400;
    color: #209bff;
    font-size: 16px;
    cursor: pointer
}

.FindPass .login-form .back:hover {
    transform: scale(110%)
}

.success-modal {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 300px
}

.success-modal .title {
    width: 100%;
    font-size: 15px
}

.success-modal .table-box {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid #e0e0e0
}

.success-modal .table-box .table-item {
    width: 100%;
    height: 40px;
    display: flex
}

.success-modal .table-box .table-item:last-child .label,
.success-modal .table-box .table-item:last-child .value {
    border-bottom: none
}

.success-modal .table-box .table-item .label {
    width: 100px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f6f6f6;
    border-bottom: 1px solid #e0e0e0
}

.success-modal .table-box .table-item .value {
    width: 200px;
    height: 100%;
    display: flex;
    align-items: center;
    padding-left: 10px;
    border-left: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0
}

.login {
    width: 100%;
    height: 100vh;
    background: rgba(51, 51, 51, .3);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000
}

.login .login-box {
    position: absolute;
    top: 38%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: linear-gradient(180deg, #dff4fe, #fff);
    background-size: cover;
    border-radius: 10px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 480px;
    height: 570px;
    padding-bottom: 30px;
    padding-top: 90px
}

.login .login-box .before {
    display: block;
    white-space: nowrap;
    font-weight: 550;
    color: #333;
    position: absolute;
    top: 28px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 24px
}

.login .login-box:after {
    display: block;
    width: 100%;
    height: 100%;
    content: "";
    background-image: url(../images/login_img_bg.b742dd88.png);
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    z-index: 1
}

.login .login-box .el-icon-close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 20px;
    font-weight: 700;
    color: #525252;
    z-index: 2;
    cursor: pointer
}

.login .login-box .el-icon-close:hover {
    transform: scale(110%)
}

.login .login-box .login-box-content {
    background: #fff;
    box-shadow: 0 6px 16px 0 #eaf7ff;
    border-radius: 15px 15px 15px 15px;
    z-index: 2;
    width: 404px;
    height: 100%;
    position: relative
}

.login .login-box .login-box-content .type-title {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e4e7ee;
    height: 77px;
    padding: 0 62px
}

.login .login-box .login-box-content .type-title span.item {
    font-weight: 400;
    color: #333;
    cursor: pointer;
    font-size: 18px
}

.login .login-box .login-box-content .type-title span.item:hover {
    color: #209bff
}

.login .login-box .login-box-content .type-title span.active {
    font-weight: 500;
    position: relative;
    color: #209bff
}

.login .login-box .login-box-content .type-title span.active:after {
    position: absolute;
    display: block;
    content: "";
    width: 100%;
    height: 4px;
    background: #209bff;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 4px;
    bottom: -28px
}

.el-notification {
    width: 400px
}

.el-notification .el-icon-close {
    right: 19px
}

.success-modal {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 300px
}

.success-modal .title {
    width: 100%;
    font-size: 15px
}

.success-modal .table-box {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid #e0e0e0
}

.success-modal .table-box .table-item {
    width: 100%;
    height: 40px;
    display: flex
}

.success-modal .table-box .table-item:last-child .label,
.success-modal .table-box .table-item:last-child .value {
    border-bottom: none
}

.success-modal .table-box .table-item .label {
    width: 100px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f6f6f6;
    border-bottom: 1px solid #e0e0e0
}

.success-modal .table-box .table-item .value {
    width: 200px;
    height: 100%;
    display: flex;
    align-items: center;
    padding-left: 10px;
    border-left: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0
}

.login-mask {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .3);
    z-index: 1000
}

.login-mask .login-form {
    background: #fff;
    width: 800px;
    border-radius: 10px;
    color: #6c6c6c;
    position: relative;
    padding-top: 100px;
    padding-bottom: 80px
}

.login-mask .login-form .login-box {
    width: 100%;
    display: flex
}

.login-mask .login-form .login-box .wechat-login {
    width: 340px;
    height: 297px;
    margin-top: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

.login-mask .login-form .login-box .wechat-login .login-blocks {
    text-align: center;
    margin: 0
}

.login-mask .login-form .login-box .wechat-login .login-blocks .qrcode-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 22px;
    text-align: center;
    letter-spacing: 0;
    color: #1a1a1a
}

.login-mask .login-form .login-box .wechat-login .qrcode-img {
    margin-top: 40px;
    margin-bottom: 0;
    width: 195px;
    height: 195px;
    border: 1px solid #e5e8ec;
    border-radius: 10px;
    box-shadow: none;
    background-color: #fff;
    overflow: hidden;
    position: relative
}

.login-mask .login-form .login-box .wechat-login .qrcode-img .qrcode {
    width: 100%;
    height: 100%
}

.login-mask .login-form .login-box .wechat-login .qrcode-img .after {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-size: cover;
    border-radius: 4px;
    border: 1px solid #cfcfcf;
    padding: 1px;
    box-shadow: 0 0 0 3px #fff;
    z-index: 2
}

.login-mask .login-form .login-box .wechat-login .qrcode-img .code-error {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .4);
    color: #fff;
    cursor: pointer;
    z-index: 3
}

.login-mask .login-form .login-box .wechat-login .tips {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    color: #7c889c;
    font-size: 12px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0;
    text-align: center;
    margin-top: 25px
}

.login-mask .login-form .login-box .wechat-login .tips .having {
    color: #1890ff
}

.login-mask .login-form .login-box .wechat-login:after {
    content: "";
    position: absolute;
    display: inline-block;
    top: 0;
    right: 0;
    height: 316px;
    width: 1px;
    background: #f2f2f2
}

.login-mask .login-form .login-box .base-login {
    width: 350px;
    margin: 0 auto
}

.login-mask .login-form .login-box .base-login .login-switch-tab {
    display: flex;
    justify-content: center
}

.login-mask .login-form .login-box .base-login .login-switch-tab .item {
    width: 120px;
    height: 16px;
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #1a1a1a;
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center
}

.login-mask .login-form .login-box .base-login .login-switch-tab .item:first-child:after {
    content: "";
    position: absolute;
    display: inline-block;
    top: 0;
    right: 1px;
    width: 1px;
    height: 20px;
    background: #e5e8ec
}

.login-mask .login-form .login-box .base-login .login-switch-tab .item-active {
    color: #1890ff
}

.login-mask .login-form .login-box .base-login .login-content {
    margin-top: 40px;
    width: 100%
}

.login-mask .login-form .login-box .base-login .login-content .form-item {
    margin-top: 20px;
    margin-bottom: 0;
    position: relative
}

.login-mask .login-form .login-box .base-login .login-content .form-item .login-input {
    width: 100%;
    padding-left: 20px;
    height: 48px;
    border-radius: 10px;
    opacity: 1;
    border: none;
    background: #f3f6f8;
    font-family: PingFang SC;
    font-size: 16px;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0;
    color: #11192d;
    outline: none
}

.login-mask .login-form .login-box .base-login .login-content .form-item .login-input:-webkit-autofill {
    box-shadow: inset 0 0 0 1000px #f3f6f8
}

.login-mask .login-form .login-box .base-login .login-content .form-item .login-input:active {
    background: #e5e8ec;
    color: #50607a
}

.login-mask .login-form .login-box .base-login .login-content .form-item .login-input:active:-webkit-autofill {
    box-shadow: inset 0 0 0 1000px #e5e8ec
}

.login-mask .login-form .login-box .base-login .login-content .form-item .login-input::-moz-placeholder {
    color: #50607a
}

.login-mask .login-form .login-box .base-login .login-content .form-item .login-input::placeholder {
    color: #50607a
}

.login-mask .login-form .login-box .base-login .login-content .form-item .absolute-link {
    position: absolute;
    top: 50%;
    right: 22px;
    transform: translateY(-50%);
    font-family: PingFang SC;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    letter-spacing: 0;
    color: #a3a3a3
}

.login-mask .login-form .login-box .base-login .login-content .form-item .active-link {
    color: #1890ff;
    cursor: pointer
}

.login-mask .login-form .login-box .base-login .login-content .find-submit {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center
}

.login-mask .login-form .login-box .base-login .login-content .login-btn {
    width: 350px;
    height: 48px;
    border-radius: 10px;
    border-width: 0;
    font-family: PingFang SC;
    font-size: 16px;
    font-weight: 500;
    line-height: 14px;
    text-align: center;
    letter-spacing: 0
}

.login-mask .login-form .login-box .base-login .login-content .loginActive {
    background: #1682e6;
    border-color: #1682e6;
    color: #fff;
    outline: none
}

.login-mask .login-form .login-box .base-login .login-content .footer-tips {
    width: 100%;
    height: 57px;
    display: flex;
    align-items: center;
    justify-content: center
}

.login-mask .login-form .login-box .base-login .login-content .footer-tips span {
    color: #1890ff;
    font-weight: 400;
    cursor: pointer
}

.login-mask .login-form .login-box .base-login .login-content .other-login {
    margin-top: 20px;
    min-height: 19px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: nowrap
}

.login-mask .login-form .login-box .base-login .login-content .other-login .item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    height: 35px;
    background-color: #f7f9fc;
    gap: 5px;
    flex-wrap: nowrap;
    border-radius: 5px;
    color: #000;
    border: 1px solid #ebebeb;
    cursor: pointer
}

.login-mask .login-form .login-box .base-login .login-content .other-login .item img {
    width: 20px;
    height: 20px
}

.login-mask .login-form .login-box .base-login .login-content .other-login .item:hover {
    color: #1890ff
}

.login-mask .login-form .login-box .base-login .login-content .other-login .item:active {
    background-color: #ebebeb
}

.login-mask .login-form .login-title {
    display: block;
    white-space: nowrap;
    font-weight: 550;
    color: #333;
    position: absolute;
    top: 28px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 24px
}

.login-mask .login-form .el-icon-close {
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer
}

.login-mask .login-form .el-icon-close:hover {
    transform: scale(1.2)
}

.plane-type-1 {
    height: 407px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    position: relative
}

.plane-type-1 .left {
    height: 100%;
    width: 252px;
    border-radius: 10px;
    background: linear-gradient(135deg, #2db1ff, #1479ff);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative
}

.plane-type-1 .left .item {
    height: 82px;
    padding: 17px 17px 9px 17px;
    border-bottom: 1px solid hsla(0, 0%, 100%, .14);
    display: flex;
    flex-direction: column;
    gap: 8px;
    cursor: pointer
}

.plane-type-1 .left .item:last-child {
    border: none
}

.plane-type-1 .left .item .item-title {
    font-size: 14px;
    height: 19px;
    font-family: Alibaba PuHuiTi-Medium, Alibaba PuHuiTi;
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    position: relative
}

.plane-type-1 .left .item .item-title .icon {
    width: auto;
    height: 15px;
    margin-right: 6px
}

.plane-type-1 .left .item .item-title:after {
    content: "";
    width: 5px;
    height: 5px;
    transform-origin: center center;
    border: 1px #fff;
    border-style: solid solid none none;
    position: absolute;
    top: 50%;
    right: 0;
    transform: rotate(45deg) translateY(-50%);
    display: block
}

.plane-type-1 .left .item .item-list {
    font-size: 14px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #fff
}

.plane-type-1 .left .item .item-list .link {
    cursor: pointer
}

.plane-type-1 .left .item .item-list .link:hover {
    color: #d9dade
}

.plane-type-1 .left .item .item-list .link:after {
    content: "/"
}

.plane-type-1 .left .item .item-list .link:last-child:after {
    content: ""
}

.plane-type-1 .left .item .item-child-box {
    display: none
}

.plane-type-1 .left .item:hover .item-child-box {
    display: grid;
    grid-template-columns: repeat(5, 170px);
    justify-content: center;
    justify-items: center;
    align-content: start;
    height: 407px;
    background: #fff;
    box-shadow: 0 2px 7px 2px rgba(220, 224, 227, .8);
    border-radius: 10px;
    position: absolute;
    left: 245px;
    top: 0;
    z-index: 5;
    width: calc(var(--centerA, 1600px) - 566px)
}

.plane-type-1 .left .item:hover .item-child-box .goods-box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    height: 135px;
    cursor: pointer
}

.plane-type-1 .left .item:hover .item-child-box .goods-box:hover .goods-name {
    color: #1990ff
}

.plane-type-1 .left .item:hover .item-child-box .goods-box .img-box {
    width: 60px;
    height: 60px;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 5px 15px rgba(0, 184, 255, .2);
    display: flex;
    align-items: center;
    justify-content: center
}

.plane-type-1 .left .item:hover .item-child-box .goods-box .goods-name {
    font-size: 14px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #252525
}

.plane-type-1 .left .item:hover .item-child-box .juju {
    position: absolute;
    width: 17px;
    height: 17px;
    background-color: #fff;
    border: 1px solid rgba(220, 224, 227, .8);
    clip-path: polygon(0 0, 100% 0, 0 100%, 0 0);
    transform: rotate(315deg);
    transform-origin: center;
    top: 0;
    left: -8px
}

.plane-type-1 .left .more {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 82px
}

.plane-type-1 .left .more .left-btn {
    width: 170px;
    height: 40px;
    background: hsla(0, 0%, 100%, .18);
    border-radius: 4px 4px 4px 4px;
    border: none;
    font-size: 14px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none
}

.plane-type-1 .left .more .left-btn:hover {
    opacity: .9;
    cursor: pointer
}

.plane-type-1 .left .more .left-btn:active {
    background: hsla(0, 0%, 100%, .384)
}

.plane-type-1 .left .active .item-list .link:after {
    color: hsla(0, 0%, 100%, .8)
}

.plane-type-1 .banner {
    flex: 1;
    width: auto
}

.plane-type-1 .right {
    height: 100%;
    width: 314px;
    border-radius: 10px;
    background-color: #fff;
    padding: 0 13px
}

.plane-type-1 .right .user-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 186px;
    border-bottom: 1px dashed #e4e4e4;
    gap: 12px
}

.plane-type-1 .right .user-info .avatar {
    width: 65px;
    height: 65px;
    border-radius: 50%
}

.plane-type-1 .right .user-info .user-name {
    font-size: 14px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #252525
}

.plane-type-1 .right .login-enjoy {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

.plane-type-1 .right .login-enjoy .title {
    margin-top: 13px;
    font-size: 17px;
    font-family: Alibaba PuHuiTi-Medium, Alibaba PuHuiTi;
    font-weight: 500;
    color: #252525;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 17px;
    gap: 7px
}

.plane-type-1 .right .login-enjoy .title .befor {
    position: relative;
    width: 47px;
    height: 7px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
    flex-direction: column
}

.plane-type-1 .right .login-enjoy .title .befor:after {
    content: "";
    width: 100%;
    height: 2px;
    background: linear-gradient(270deg, #1990ff, rgba(25, 144, 255, 0));
    border-radius: 2px;
    display: block
}

.plane-type-1 .right .login-enjoy .title .befor:before {
    content: "";
    width: 36px;
    height: 2px;
    background: linear-gradient(270deg, #1990ff, rgba(25, 144, 255, 0));
    border-radius: 2px;
    display: block
}

.plane-type-1 .right .login-enjoy .title .after {
    width: 47px;
    height: 7px;
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 3px;
    flex-direction: column
}

.plane-type-1 .right .login-enjoy .title .after:after {
    content: "";
    width: 100%;
    height: 2px;
    background: linear-gradient(270deg, rgba(25, 144, 255, 0), #1990ff);
    border-radius: 2px;
    display: block
}

.plane-type-1 .right .login-enjoy .title .after:before {
    content: "";
    width: 36px;
    height: 2px;
    background: linear-gradient(270deg, rgba(25, 144, 255, 0), #1990ff);
    border-radius: 2px;
    display: block
}

.plane-type-1 .right .login-enjoy .icon-show {
    margin-top: 17px;
    width: 158px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 28px
}

.plane-type-1 .right .login-enjoy .icon-show .item {
    width: 50px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 3px
}

.plane-type-1 .right .login-enjoy .icon-show .item .icon {
    width: 45px;
    height: 45px;
    border-radius: 50%
}

.plane-type-1 .right .login-enjoy .icon-show .item .name {
    font-size: 12px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #252525
}

.plane-type-1 .sz-image {
    width: 70px;
    height: 70px;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 5px 15px rgba(0, 184, 255, .2);
    display: flex;
    align-items: center;
    justify-content: center
}

.plane-type-2 {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 20px 0
}

.plane-type-2 .category-list {
    width: 100%;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1
}

.plane-type-2 .category-list .category-item {
    width: calc(25% - 10px);
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
    background: hsla(0, 0%, 100%, .1)
}

.plane-type-2 .category-list .category-item .title {
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    color: #fff
}

.plane-type-2 .category-list .category-item .category-warp {
    width: 100%;
    height: 80px;
    padding: 0 10px 10px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px
}

.plane-type-2 .category-list .category-item .category-warp .cate-name {
    width: 100%;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 12px;
    color: #fff;
    background: hsla(0, 0%, 100%, .1);
    border-radius: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: .3s;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.plane-type-2 .before {
    display: block;
    position: absolute;
    height: 100%;
    top: 0;
    left: 50%;
    transform: translateX(-3000px);
    width: 6000px;
    z-index: 0
}

.banner {
    width: 100%;
    border-radius: 10px;
    background-color: #fff;
    position: relative
}

.banner .indicator {
    position: absolute;
    z-index: 4;
    height: 19px;
    background: hsla(0, 0%, 100%, .3);
    box-shadow: inset 0 -1px 1px 0 #d0d4db, inset 0 1px 1px 0 #fff;
    border-radius: 14px;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: 17px;
    left: 50%;
    transform: translate(-50%);
    gap: 10px;
    padding: 0 8px
}

.banner .indicator .item {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #c8ced7;
    cursor: pointer
}

.banner .indicator .active {
    background-color: #1890ff
}

.banner .banner-item {
    width: 100%;
    height: 100%;
    cursor: pointer
}

.banner .banner-item .banner-item-img {
    width: 100%;
    height: 100%;
    border-radius: 0
}

.notice-container {
    width: 100%;
    border-radius: 10px;
    height: 50px;
    background-color: #fff;
    display: flex;
    align-items: center;
    gap: 20px
}

.notice-container:before {
    margin-left: 16px;
    content: "";
    background-image: url(../images/notice.5b666047.svg);
    width: 90px;
    height: 90px;
    background-size: cover;
    background-repeat: no-repeat
}

.notice-container .name {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 20px
}

.notice-container .name:before {
    content: "";
    width: 1px;
    height: 20px;
    background-color: #ccc;
    display: block
}

.notice-container .name .notice-show {
    flex-shrink: 0;
    width: 1190px;
    height: 50px;
    overflow: hidden
}

.notice-container .name .notice-show .notice-item {
    width: 100%;
    height: 50px;
    background-color: #fff;
    display: flex;
    align-items: center;
    color: #333;
    overflow: hidden
}

.notice-container .name .notice-show .notice-item .link {
    white-space: nowrap;
    cursor: pointer
}

.notice-container .name .notice-show .notice-item .scroll-text {
    overflow: auto
}

.notice-container .name .notice-show .notice-item .scroll-text::-webkit-scrollbar {
    width: 0;
    height: 0
}

.quick-link {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px
}

.quick-link .link-item {
    height: 130px;
    cursor: pointer;
    border-radius: 10px;
    overflow: hidden
}

.category-container-mode {
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    background: #fafdff;
    border-radius: 10px;
    border: 1px solid #dbe9f8
}

.category-container-mode .space {
    width: 100%;
    height: .41rem;
    background-color: #f2f6fa
}

.category-container-mode .item {
    width: 100%;
    height: auto;
    border-radius: 10px;
    background-color: #fff;
    padding: 20px 16px
}

.category-container-mode .item .title {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .16rem;
    position: relative;
    margin-bottom: 20px
}

.category-container-mode .item .title img {
    width: 212px;
    height: 24px
}

.category-container-mode .item .content {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    border-radius: 0 0 20px 20px
}

.category-container-mode .item .content .scroll-box {
    width: 100%;
    padding: 3px 0;
    overflow: auto
}

.category-container-mode .item .content .scroll-box::-webkit-scrollbar {
    width: 7px;
    height: 0
}

.category-container-mode .item .content .scroll-box .scroll-container {
    width: 100%;
    height: 100%;
    display: flex;
    gap: 10px
}

.category-container-mode .item .content .scroll-box .scroll-container .goods-item {
    background: linear-gradient(180deg, #fff, #e7f3ff);
    border: 1px solid #dbe9f8;
    border-radius: 10px;
    color: #41435d;
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    font-size: 14px;
    line-height: 1.4;
    padding: 20px 10px 10px 10px;
    width: 110px;
    gap: 10px;
    cursor: pointer
}

.category-container-mode .item .content .scroll-box .scroll-container .goods-item:hover {
    box-shadow: 0 0 5px #f2f2f2
}

.category-container-mode .item .content .scroll-box .scroll-container .goods-item .sz-image {
    width: 70px;
    height: 70px;
    border-radius: 10px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    flex-shrink: 0
}

.category-container-mode .item .content .scroll-box .scroll-container .goods-item .name-show {
    width: 70px;
    height: 70px;
    border-radius: 10px;
    background-color: #000;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px
}

.category-container-mode .item .content .scroll-box .scroll-container .goods-item .goods-name {
    width: 100%;
    color: #41435d;
    text-align: center;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.advantage-box {
    background-color: #fff;
    border-radius: 10px;
    padding: 32px 23px 36px
}

.advantage-box .title-img {
    height: 70px;
    margin: 0 auto;
    display: block;
    margin-bottom: 40px
}

.advantage-box .company-tag {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 56px 0
}

.advantage-box .company-tag .company-tag__item {
    align-items: center;
    color: #9d9fb8;
    display: flex;
    flex-direction: row;
    flex-direction: column;
    font-size: 12px;
    justify-content: center;
    line-height: 1.6;
    text-align: center
}

.advantage-box .company-tag .company-tag__item .company-tag__icon {
    width: 80px;
    height: 80px;
    -o-object-fit: cover;
    object-fit: cover
}

.advantage-box .company-tag .company-tag__item .company-tag__strong {
    color: #41435d;
    font-size: 18px;
    font-weight: 500;
    margin: 10px 0 2px
}

.advantage-box .company-tag .company-tag__item .company-tag__desc {
    word-break: break-all;
    font-size: 12px;
    max-height: 6em;
    width: 16em
}

.advantage-box .install-btn {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px
}

.advantage-box .install-btn .el-button {
    width: 152px;
    height: 50px;
    font-size: 18px;
    border-radius: 40px
}

.nice-goods-box {
    width: 100%;
    overflow: hidden;
    border-radius: 10px
}

.nice-goods-box .title {
    width: 100%;
    height: 60px;
    border-radius: 10px 10px 0 0;
    background: linear-gradient(90deg, #209bff, #32baff);
    display: flex;
    justify-content: space-between;
    padding-left: 17px;
    cursor: pointer
}

.nice-goods-box .title p {
    flex: 1;
    line-height: 52px;
    font-size: 14px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #fff
}

.nice-goods-box .title:before {
    content: "";
    background-image: url(../images/title_before.svg);
    width: 96px;
    height: 23px;
    background-size: cover;
    display: block;
    margin-right: 15px;
    margin-top: 16px
}

.nice-goods-box .title:after {
    content: "";
    background-image: url(../images/title_after.svg);
    width: 314px;
    height: 74px;
    background-size: cover;
    display: block
}

.nice-goods-box .content {
    background: #fff;
    box-shadow: 0 2px 7px 0 #dddede;
    height: auto;
    transform: translateY(-8px);
    border-radius: 10px
}

.nice-goods-box .content .menu {
    height: 53px;
    width: 100%;
    border-bottom: 1px solid #e4e4e4;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 40px
}

.nice-goods-box .content .menu .item-out-box {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.nice-goods-box .content .menu .item-out-box:hover .item {
    background-image: linear-gradient(180deg, #59f, #1ba4ff);
    color: #fff;
    box-shadow: 0 3px 13px rgba(85, 153, 255, .5);
    padding: 5px 10px;
    border-radius: 50px;
    font-size: 14px
}

.nice-goods-box .content .menu .item {
    font-size: 14px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center
}

.nice-goods-box .content .menu .active {
    background-image: linear-gradient(180deg, #59f, #1ba4ff);
    color: #fff;
    box-shadow: 0 3px 13px rgba(85, 153, 255, .5);
    padding: 5px 10px;
    border-radius: 50px;
    font-size: 14px
}

.nice-goods-box .content .detail-list {
    height: 600px;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 210px));
    justify-content: center;
    justify-items: center;
    align-content: start;
    overflow: hidden;
    padding: 0 18px
}

.nice-goods-box .content .detail-list .item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    flex-direction: column;
    height: 150px;
    cursor: pointer
}

.nice-goods-box .content .detail-list .item:hover .goods-name {
    color: #1990ff
}

.nice-goods-box .content .detail-list .item .goods-name {
    font-size: 13px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #252525
}

.nice-goods-box .content .footer {
    height: 52px;
    background: #f7f7f7;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 17px;
    padding-right: 56px;
    font-size: 13px;
    font-family: Alibaba PuHuiTi-Regular, Alibaba PuHuiTi;
    font-weight: 400;
    color: #5b5b5b
}

.nice-goods-box .content .footer .link {
    color: #1990ff;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500
}

.nice-goods-box .sz-image {
    width: 70px;
    height: 70px;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 5px 15px rgba(0, 184, 255, .2);
    display: flex;
    align-items: center;
    justify-content: center
}

.home {
    margin: 0 auto;
    width: var(--centerA, 1600px);
    display: flex;
    flex-direction: column;
    gap: 10px
}