/* 清除默认标签margin padding */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
}

html {
    width: 100%;
    height: 100%;
}
/*全局属性*/
body {
    width: 100%;
    height: 100%;
    color: #333;
    line-height: 1;
    font-size: 12px;
    font-family: "Segoe UI","Microsoft YaHei";
    background: #f5f5f5;
}
/*清除默认列表前面的属性*/
ol, ul, li {
    list-style: none;
}
/*清除标签默认下划线*/
a, ins {
    text-decoration: none;
}
/*清除img标签边框和默认下的像素*/
img {
    vertical-align: middle;
    border: none;
}
/*清除默认引号*/
blockquote, q {
    quotes: none;
}
/*清除默认倾斜*/
i, em {
    font-style: normal;
}
/*清除默认粗体*/
h1, h2, h3, h4, h5, h6, strong {
    font-weight: normal;
}
/*清除input，textarea点击出点的边框*/
input, textarea, a {
    outline: none;
}
/*清除删除线*/
del {
    text-decoration: line-through;
}
/*清除表格边距等*/
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/*清除浮动*/
.clearfix:after {
    visibility: hidden;
    clear: both;
    display: block;
    content: ".";
    height: 0
}
/* ie6 */
.clearfix {
    *zoom: 1
}

input:-webkit-autofill {
    box-shadow: 0 0 0px 1000px #fff inset !important;
    -webkit-text-fill-color: #333 !important;
    -webkit-background-clip: text;
}


/*登录页面*/
.content_page {
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-flow: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #fff;
    /*header内容信息*/
    /*表单板块信息*/
    /*footer内容信息*/
    /*表单*/
}

    .content_page > div {
        width: 100%;
    }

    .content_page .content_form {
        flex-shrink: 0;
        height: 540px;
        background: url(../images/login_bg.jpg) center center no-repeat;
        -webkit-background-size: cover;
        background-size: cover;
    }

    .content_page .header_logo {
        height: 90%;
    }

    .content_page .footer_copy {
        height: 100%;
    }

    .content_page .header_content {
        width: 62%;
        height: 100%;
        margin: 0 auto;
        display: flex;
        align-items: flex-end;
        justify-content: flex-start;
        padding: 30px 0;
        box-sizing: border-box;
    }

    .content_page .form_box {
        position: relative;
        z-index: 9;
        width: 62%;
        height: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .content_page .footer_content {
        width: 62%;
        height: 100%;
        margin: 0 auto;
        display: flex;
        align-items: flex-start;
        justify-content: center;
    }

        .content_page .footer_content p {
            padding-top: 60px;
            font-family: SourceHanSansCN-Normal;
            font-size: 16px;
            color: #8294a8;
        }

    .content_page .login_form {
        width: auto;
        height: auto;
        padding: 33px 32px 38px;
        background-color: #ffffff;
        box-shadow: 0px 2px 38px 0px rgba(46, 89, 101, 0.51);
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
        overflow: hidden;
        /*端口类型*/
    }

        .content_page .login_form ul {
            width: 100%;
        }

        .content_page .login_form li {
            display: flex;
            align-items: stretch;
            justify-content: space-between;
            width: 267px;
            height: 41px;
            margin-top: 16px;
            position: relative;
            cursor: pointer;
        }

            .content_page .login_form li:after {
                content: '';
                position: absolute;
                left: 0;
                width: 40px;
                height: 41px;
            }

        .content_page .login_form strong {
            display: block;
            padding-bottom: 8px;
            line-height: 1;
            font-size: 18px;
            color: #292929;
            text-align: center;
            font-weight: bold;
        }

        .content_page .login_form input {
            width: 100%;
            height: 100%;
            padding: 0 0 0 40px;
            font-size: 14px;
            background-color: #ffffff;
            border: solid 1px #e5e5e5;
            box-sizing: border-box;
            border-radius: 5px;
        }

        .content_page .login_form .admin {
            background: url(../images/icon_admin.png) 12px center no-repeat;
            -webkit-background-size: 20px auto;
            background-size: 20px auto;
            cursor: pointer;
        }

        .content_page .login_form .user:after {
            background: url(../images/icon_user.png) 12px center no-repeat;
            -webkit-background-size: 20px auto;
            background-size: 20px auto;
        }

        .content_page .login_form .pwd:after {
            background: url(../images/icon_pwd.png) 12px center no-repeat;
            -webkit-background-size: 20px auto;
            background-size: 20px auto;
        }

        .content_page .login_form .qrcode:after {
            background: url(../images/icon_qrcode.png) 12px center no-repeat;
            -webkit-background-size: 20px auto;
            background-size: 20px auto;
        }

        .content_page .login_form span {
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 105px;
            margin-left: 015px;
            font-size: 24px;
            background: #eee;
        }

        .content_page .login_form a.login {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
            height: 40px;
            color: #fff;
            font-size: 16px;
            background-image: linear-gradient(#428eff, #428eff), linear-gradient(#ffffff, #ffffff);
            background-blend-mode: normal, normal;
            cursor: pointer;
            border-radius: 5px;
        }

        .content_page .login_form .admin-list {
            position: relative;
        }

            .content_page .login_form .admin-list:before {
                content: "";
                position: absolute;
                right: 20px;
                width: 13px;
                height: 8px;
                top: 50%;
                margin-top: -4px;
                background: url(../images/icon_sj.png) center center no-repeat;
                -webkit-background-size: 13px 8px;
                background-size: 13px 8px;
                -webkit-transform: rotate(-90deg);
                -moz-transform: rotate(-90deg);
                -ms-transform: rotate(-90deg);
                -o-transform: rotate(-90deg);
                transform: rotate(-90deg);
                -webkit-transition: all 0.5s;
                -moz-transition: all 0.5s;
                -ms-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }

        .content_page .login_form .cur:before {
            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -ms-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
        }

        .content_page .login_form .cur input {
            border-bottom-right-radius: 0;
            border-bottom-left-radius: 0;
        }

        .content_page .login_form .ports-type {
            display: block;
            position: absolute;
            right: 0;
            z-index: 1;
            top: 41px;
            width: 100%;
            height: 0;
            background: #fff;
            overflow-y: auto;
        }

            .content_page .login_form .ports-type li {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                width: 100%;
                margin-top: -1px;
                padding: 0 40px;
                line-height: 1;
                font-size: 14px;
                border: solid 1px #e5e5e5;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
            }

        .content_page .login_form .show-ports-list {
            height: 250px;
        }

        .content_page .login_form .ports-type li:hover {
            background-color: #eee;
        }

        .content_page .login_form a.login:hover {
            opacity: 0.85;
        }
