@charset "utf-8";

/**  =================== 登录的样式 ===================  **/
body, a, dl, dt, dd, li, img, button { cursor: url("../images/cursor.cur"), auto !important; }
body {
    min-height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../images/bg-login.jpg);
}
body::before { position: fixed; top: 0; right: 0; bottom: 0; left: 0; content: ""; }
.login-wrapper { display: flex; justify-content: space-around; align-items: center; position: absolute; top: 50%; right: 0; left: 0; margin: -317px auto 0; width: 100%;  z-index: 2; padding: 20px; max-width: 1000px; box-sizing: border-box; }
.login-wrapper .layui-btn { border-color: currentcolor !important; }
.login-wrapper > .layui-form { padding: 25px 30px; border-radius: 4px; background-image: url(../images/login.png); box-sizing: border-box; }
.login-wrapper > .layui-form > h2 { position: relative; margin-bottom: 25px; font-size: 18px; display: inline-block; margin-left: 57px; color: #4d70ff; }
.login-wrapper > .layui-form > h2::after {
    position: absolute;
    left: 50%;
    bottom: -7px;
    transform: translate(-50%, 0);
    content: '';
    width: 16px;
    height: 4px;
    background-color: #4d70ff;
    border-radius: 10px;
}
.layui-input, .layui-select, .layui-textarea {
    border-width: 0px;
}
.layui-form-checked[lay-skin=primary]>i {
    border-color: #4d70ff!important;
    background-color: #4d70ff;
    color: #fff;
}
.login-wrapper > .layui-form > .layui-form-item { position: relative; margin-bottom: 12px; }
.login-wrapper > .layui-form > .layui-form-item:last-child { margin-bottom: 0; }
.login-wrapper > .layui-form > .layui-form-item > .layui-input { height: 46px; line-height: 46px; border-radius: 2px !important; background: #f4f8fb;}
.login-wrapper .layui-input-icon-group > .layui-input { padding-left: 16px; }
.login-wrapper .layui-input-icon-group > .layui-icon { position: absolute; top: 0; left: 0; width: 46px; height: 46px; font-size: 20px; text-align: center; color: #909399; line-height: 46px; }
.login-wrapper > .layui-form > .layui-form-item.login-captcha-group { padding-right: 135px; }
.login-wrapper > .layui-form > .layui-form-item.login-captcha-group > .login-captcha { position: absolute; top: 0; right: 0; width: 120px; height: 46px; border: 1px solid #e6e6e6;  background-color: #4d70ff; color: #fff; border-radius: 2px !important; cursor: pointer; box-sizing: border-box; }
.login-wrapper > .layui-form > .layui-form-item > .layui-form-checkbox { margin: 0 !important; padding-left: 25px; }
.login-wrapper > .layui-form > .layui-form-item > .layui-form-checkbox > .layui-icon { width: 15px !important; height: 15px !important; }
.login-wrapper > .layui-form .layui-btn-fluid { height: 48px; line-height: 48px; font-size: 16px; border-radius: 2px !important; }
.login-wrapper > .layui-form > .layui-form-item.login-oauth-group > a > .layui-icon { font-size: 26px; }
.login-copyright { position: relative; z-index: 1; padding-bottom: 20px; text-align: center; color: #eeeeee; }
.layui-btn { border-color: #5fb878; background-color: #5fb878; }
.layui-link { color: #5fb878 !important; }
.layui-btn-gloomy { background-color: #444c69; }
.layui-btn-danger { background-color: #f56c6c; }
.layui-btn-default { background-color: #4d70ff }
.layui-btn-forbid,
.layui-btn-forbid:hover { cursor: not-allowed; opacity: 0.65; pointer-events: none; }
.last-item {
    margin-bottom: 140px !important;
}
.login-left h1{
    font-size: 50px;
    color: #4d70ff;
}
.login-left h1:first-child{
    font-weight: unset;
}
.xmnn {
    position: absolute;
    bottom: 26px;
    left: 50%;
    transform: translate(-50%, 0);
    text-align: center;
}
@media screen and (max-width: 640px) {
    .login-wrapper { flex-direction: column; margin: -29rem auto 0; }
    .login-copyright { position: absolute; right: 0; bottom: 0; left: 0; }
    .login-left {
        margin-left: -10rem;
        margin-bottom: 2rem;
    }
    .login-left h1 {
        font-size: 2rem;
    }
    .last-item {
        margin-bottom: 5rem !important;
    }
    .login-wrapper > .layui-form > .layui-form-item{
        margin-bottom: .8rem;
    }
}
@media screen and (max-width: 375px) {
    .login-wrapper {
        margin: -25rem auto 0;
    }
    .login-wrapper > .layui-form > .layui-form-item > .layui-input {
        height: 36px;
        line-height: 36px;
    }
    .login-wrapper > .layui-form > .layui-form-item.login-captcha-group > .login-captcha {
        height: 36px;
    }
    .login-wrapper > .layui-form .layui-btn-fluid{
        height: 42px;
        line-height: 42px;
    }
}