.login-body { position: relative; background-color: #F0FBFF; width: 100%; height: 100vh; .login-body-bg-box { position: absolute; bottom: 0; left: 0; right: 0; top: 0; z-index: 0; display: flex; img { width: 100%; height: 100%; object-fit: cover; } } .login-container { position: relative; display: flex; justify-content: center; align-items: center; height: 100vh; .hc-login-sign { position: relative; width: 420px; .logo-img { position: relative; text-align: center; img { height: 44px; } } .login-title { font-size: 38px; text-align: center; margin-top: 20px; margin-bottom: 32px; color: white; } .sign-list { position: relative; background: rgba(255,255,255,0.99); padding: 40px 50px; width: 100%; border-radius: 16px; box-shadow: 0 21.2px 31.8px 0 rgba(26,26,26,0.12); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); .welcome { position: relative; font-size: 24px; color: #101010; font-weight: bold; text-align: center; margin-bottom: 50px; top: -4px; &::before { position: absolute; display: block; content: ""; height: 1px; width: 96px; bottom: -5px; background: var(--el-color-primary); left: calc(50% - ( 96px / 2 )); } } .form-box { position: relative; .el-input--large { --el-input-height: 48px; --el-input-border-radius: 8px; font-size: 16px; .el-input__wrapper { padding: 1px 16px; } } .el-button--large { --el-button-size: 48px; height: 48px; padding: 12px 19px; font-size: 18px; border: 0; border-radius: 6px; //background: linear-gradient(90deg, #4fa8ff, #0081ff 100%); } } } } } }