.page{width:100vw;height:100vh;background-repeat:no-repeat;background-size:cover;padding:0;align-items:center;--elevation-high-shadow:0 4px 32px 0 rgba(0,0,0,0.08),0 1px 4px 0 rgba(0,0,0,0.04);--color-shadow-border:rgba(0,0,0,0.02)}.page,.page .login-box{display:flex;justify-content:center}.page .login-box{border-radius:10px;height:80vh;width:65vw;margin:0 auto;box-sizing:border-box;--radius:20px;background-color:#fff;box-shadow:0 0 10px 0 rgba(0,0,0,.1)}.page .login-box .left{position:relative;flex:2;border-top-left-radius:var(--radius);border-bottom-left-radius:var(--radius);padding:40px 40px;box-sizing:border-box}.page .login-box .left .logo{width:40px;height:40px}.page .login-box .left .title{font-weight:700;font-size:28px;text-align:center;margin-top:40px;margin-bottom:10px}.page .login-box .left .desc{font-size:14px;text-align:center;color:#7d7f81;margin-bottom:20px}.page .login-box .left .input{background-color:#f5f7f9;margin-bottom:10px}.page .login-box .left .sms-btn{background:#000;font-size:10px;border-radius:6px;border:none}.page .login-box .left .login-btn{margin-top:20px;background:#000;border-radius:6px;padding:20px 10px;font-size:12px;font-weight:700;border:none;height:32px}.page .login-box .left .qrcode-tips{margin-top:20px;font-size:12px;color:#afb3b6;position:absolute;bottom:30px;width:100%;left:0;text-align:center}.page .login-box .left .qrcode-box{width:100px;height:100px;margin:0 auto;margin-top:4px;position:absolute;bottom:60px;left:calc(50% - 50px);box-shadow:var(--elevation-high-shadow);border:2px solid var(--color-shadow-border);display:flex;justify-content:center;align-items:center;border-radius:10px}.page .login-box .left .qrcode-box .qrcode-mask{background-color:#000;width:100%;height:100%;position:absolute;top:0;left:0;border-radius:6px;opacity:.9;border-radius:4px;color:#fff;text-align:center;font-size:10px;line-height:100px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.page .login-box .right{flex:3;border-top-right-radius:var(--radius);border-bottom-right-radius:var(--radius)}.page .login-box .right .right-bg{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:100%;object-position:100%;background-color:#d2d3d7;border-top-right-radius:calc(var(--radius) - 6px);border-bottom-right-radius:calc(var(--radius) - 6px)}@media screen and (max-width:768px){.page .login-box{width:85vw}.page .login-box .left .qrcode-box,.page .login-box .left .qrcode-tips,.page .login-box .right{display:none}}@media screen and (min-width:1920px){.page .login-box{width:60vw}.page .login-box .left .qrcode-box{width:200px;height:200px;bottom:80px;left:calc(50% - 100px)}.page .login-box .left .qrcode-box .qrcode-mask{line-height:200px;font-size:18px}.page .login-box .left .qrcode-box .login-btn{padding:20px 10px}}