@charset "utf-8";
/* ============================================================
 * login.css —— 登录 / 找回密码 页样式
 * ============================================================ */

* { margin: 0; padding: 0; list-style: none; }
html { height: 100%; width: 100%; }
body.auth-page {
    height: 100%;
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 0;
    position: relative;
    background: url(../images/bg_login.jpg) no-repeat center center #FFFFFF !important;
    background-size: cover !important;
    transition: all ease-out 0.3s;
    color: #555 !important;
    font-family: Arial, "Microsoft YaHei", "微软雅黑", "宋体", serif !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
}
body.auth-page:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.8);
    z-index: 0;
}
body.auth-page.company-list-page {
    background: none !important;
}
body.auth-page.company-list-page:after {
    display: none !important;
}

div, h1, h2, h3, h4, h5, h6,
p, form, label, input, img, span, ul, ol {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
img { border: 0; max-width: 100%; height: auto; }

.spacer { clear: both; font-size: 0; line-height: 0; height: 0; }
.clear:after,
#clear:after {
    content: "";
    display: table;
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0;
}

a:link    { color: #39F; text-decoration: none; transition: all ease-out 0.3s; }
a:visited { text-decoration: none; color: #39F; }
a:hover   { text-decoration: none; color: #39C; }
a:active  { text-decoration: none; color: #39F; }

.txta         { font-size: 14px; padding-left: 30px; }
.paddingTop35 { padding-top: 35px; }
.paddingTop40 { padding-top: 40px; }

.bg_body {
    display: block;
    width: 98%;
    max-width: 500px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.85);
    position: absolute;
    z-index: 99;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 0 30px #333;
}
.bg_body:after { content: ""; clear: both; font-size: 0; height: 0; }


/* ---------- 登录主框 ---------- */
#login_box:after,
#login_left:after,
#login_right:after { content: ""; clear: both; font-size: 0; height: 0; }

#login_box {
    width: 900px;
    position: absolute;
    z-index: 100;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 15px #ccc;
}

#login_left {
    background: rgba(35, 38, 46, 0.75);
    background-size: cover;
    position: absolute;
    top: 0;
    right: 50%;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    padding: 22px 35px;
}
#login_left figure {
    float: left;
    width: 100%;
    text-align: center;
    padding: 80px 0 25px 0;
    font-size: 2em;
    line-height: 1.5;
    color: #FFF;
    font-weight: bold;
}
#login_left figure img { display: block; margin: 0 auto; }
#login_left h2 { width: 100%; text-align: center; font-size: 1.6rem; color: #FFF; font-weight: normal; }
#login_left h3 { width: 100%; text-align: center; font-size: 1.2rem; color: #FFF; font-weight: normal; }
#login_left p {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 15px;
    font-size: 0.8rem;
    color: #ddd;
}
#login_left a       { color: #ddd; }
#login_left a:hover { color: #ccc; }

#login_right {
    float: right;
    width: 50%;
    min-height: 350px;
    background: rgba(255, 255, 255, 0.75);
    box-sizing: border-box;
    padding: 110px 100px 90px 20px;
    position: relative;
}
#login_right h2 {
    width: 100%;
    font-size: 1.6rem;
    line-height: 1;
    padding-bottom: 15px;
    color: #333;
    text-align: center;
    text-indent: 0;
    font-weight: bold;
}

body.auth-page .Sub_mit,
body.auth-page button.Sub_mit {
    border: none !important;
    width: 100%;
    border-radius: 5px;
    font: bold 18px/43px "微软雅黑", "宋体", Arial;
    color: #FFF !important;
    cursor: pointer;
    word-spacing: 2px;
    letter-spacing: 2px;
    background: linear-gradient(to right, #105ead 0%, #105ead 100%) !important;
    transition: box-shadow ease-in-out 0.15s;
}
body.auth-page .Sub_mit:hover,
body.auth-page button.Sub_mit:hover {
    background: linear-gradient(to right, #105ead 50%, #105ead 100%) !important;
}

.forgot_box {
    position: absolute;
    left: 0;
    bottom: 20px;
    right: 0;
    text-align: center;
}


/* ---------- 手机端 ---------- */
@media screen and (max-width: 800px) {
    #login_box {
        width: 94%;
        left: 3%;
        right: 3%;
        top: 50%;
        transform: translate(0, -50%);
    }
    #login_left {
        width: 100%;
        position: static;
        padding: 25px 25px;
    }
    #login_left figure { padding: 0 0 15px 0; }
    #login_left h2     { font-size: 1.4rem; }

    #login_right {
        width: 100%;
        min-height: 50px;
        padding: 50px 50px 50px 0;
    }
    #login_right h2 { padding: 0 0 15px 0 !important; }

    .layui-form-item .layui-form-label { white-space: wrap !important; }
}

/* 分公司信息列表 */
.company_bg {
    width: 100%;
    min-height: 100vh;
    box-sizing: border-box;
    float: left;
    padding: 40px 15px;
    position: relative;
    z-index: 1;
    background: url(../images/bg_login.jpg) no-repeat center center #FFFFFF !important;
    background-size: cover !important;
}
.company_bg:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.8);
}

.company_box {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    box-sizing: border-box;
    position: relative;
    z-index: 10;
}
.company_info {
    width: 100%;
    position: relative;
    float: left;
    margin-bottom: 5px;
    border-radius: 6px;
    overflow: hidden;
    min-height: 72px;
}
.company_info:after {
    content: "";
    display: table;
    clear: both;
}
.company_info dt {
    width: 40%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    background: rgba(35, 38, 46, 0.75);
    color: #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    font-weight: bold;
    padding: 0 8%;
    box-sizing: border-box;
}
.company_info dd {
    width: 60%;
    float: right;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 72px;
    background: rgba(255, 255, 255, 0.75);
    text-align: left;
    box-sizing: border-box;
    padding: 10px;
}
.company_info dd span {
    width: 100%;
    display: block;
    padding: 5px 0;
}