html, body {
    overflow: hidden;
}

#app {
    min-width: 1200px;
    background-color: #645cf8;
    height: inherit;
    position: relative;
    background-image: url('../img/login/login_shadding2.png');
    background-repeat: no-repeat;
    background-size: 85% auto;
    background-position: top left;
}

.content_bgO {
    width: 100%;
    height: 100%;
    background-image: url('../img/login/login_shadding1.png');
    background-repeat: no-repeat;
    background-size: 75% auto;
    background-position: 0px bottom;
}

    .content_bgO .contentbgT {
        width: 100%;
        position: relative;
        height: 100%;
        background-image: url('../img/login/login_shadding3.png');
        background-repeat: no-repeat;
        background-size: 50% auto;
        background-position: right top;
    }

.login_box {
    width: 1200px;
    margin: 0px auto;
    background-color: #ffffff;
    height: 600px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -300px;
    margin-left: -600px;
    border-radius: 16px;
    background-image: url('../img/login/login_bg.png');
    background-repeat: no-repeat;
    background-size: 125% auto;
    background-position: center center;
    box-shadow: 3px 4px 8px rgba(0,0,0,.25);
    z-index: 1;
}

    .login_box .login_header {
        width: calc(100% - 50px);
        margin: 0px auto;
        height: 100px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .login_box .login_header .header_text {
            width: 150px;
            color: #ffffff;
            font-size: 16px;
            text-align: right;
        }

            .login_box .login_header .header_text .button_btn {
                cursor: pointer;
                color: white;
                font-size: 14px;
                font-weight: bold;
                letter-spacing: 1.5px;
                border: 1px solid white;
                padding: 10px 25px;
                border-radius: 4px;
            }

                .login_box .login_header .header_text .button_btn:hover {
                    background-color: rgba(255,255,255,.15);
                }

        .login_box .login_header img {
            width: 180px;
            display: block;
        }

    .login_box .login_details {
        display: flex;
        justify-content: space-between;
    }

        .login_box .login_details .details_boxL {
            width: 540px;
        }

        .login_box .login_details .login_option {
            width: 80%;
            margin: 0px auto;
            display: flex;
            justify-content: space-between;
        }

            .login_box .login_details .login_option .option {
                width: 50%;
                height: 54px;
                text-align: center;
                font-size: 18px;
                color: #a5a5a5;
                letter-spacing: 2px;
                line-height: 40px;
                border-bottom: 1px solid #bbbbbb;
                cursor: pointer;
            }

                .login_box .login_details .login_option .option.active {
                    color: #000000 !important;
                    font-weight: bold;
                    border-bottom: 2px solid #3647ff !important;
                }

        .login_box .login_details .login_mode {
            width: 80%;
            margin: 0px auto;
            margin-top: 35px;
            text-align: center;
        }

            .login_box .login_details .login_mode .err_msg {
                margin-bottom: 25px;
                background-color: #ffe5e5;
                padding: 10px;
                color: #ff6363;
                border-radius: 6px;
                letter-spacing: 1.5px;
            }

            .login_box .login_details .login_mode .login_control {
                width: 100%;
                height: 55px;
                background-color: #f3f4f7;
                border-radius: 30px;
                display: flex;
                align-items: center;
                overflow: hidden;
                margin-bottom: 20px;
                border: 1px solid #e9e9e9;
            }

                .login_box .login_details .login_mode .login_control.focus {
                    box-shadow: 0 0 1px 3px #7e9eff;
                    border-color: #1442cb;
                }

                .login_box .login_details .login_mode .login_control .iconfont {
                    display: block;
                    height: 55px;
                    line-height: 55px;
                    width: 60px;
                    font-size: 26px;
                    color: #b1b1b1;
                }

            .login_box .login_details .login_mode input {
                height: 55px;
                width: calc(100% - 55px);
                padding: 0 10px;
                box-sizing: border-box;
                letter-spacing: 1.5px;
                font-weight: bold;
                font-size: 18px;
            }

                .login_box .login_details .login_mode input::placeholder {
                    color: #a3a3a3;
                    font-weight: normal;
                    font-size: 16px;
                }

            .login_box .login_details .login_mode .tips {
                color: #b6b2ff;
                letter-spacing: 1px;
                font-size: 14px;
                padding-top: 10px;
            }

                .login_box .login_details .login_mode .tips .iconfont {
                    margin-right: 5px;
                    font-size: 14px;
                }

            .login_box .login_details .login_mode .login_btn {
                width: 100%;
                height: 56px;
                background: linear-gradient(to bottom,#6459e8,#3246c2);
                color: #ffffff;
                border-radius: 25px;
                margin-top: 45px;
                font-size: 1.2em;
                letter-spacing: 2px;
                cursor: pointer;
                box-shadow: 3px 3px 5px rgba(54,71,197,.8);
                display: flex;
                align-items: center;
                justify-content: center;
            }

                .login_box .login_details .login_mode .login_btn .ing {
                    display: block;
                    width: 25px;
                    margin-right: 10px;
                }

                .login_box .login_details .login_mode .login_btn:hover {
                    background: linear-gradient(to bottom,#6964f1,#5b5aea);
                }

                .login_box .login_details .login_mode .login_btn[disabled] {
                    background: linear-gradient(to bottom,#aaa3ff,#8996e5);
                }

        .login_box .login_details .scan_code {
            width: 54%;
            margin: 0px auto;
            margin-top: 25px;
            text-align: center;
        }

            .login_box .login_details .scan_code img {
                width: 180px;
                display: block;
                margin: 0px auto;
            }

            .login_box .login_details .scan_code .tips {
                font-size: 1.5em;
                color: #ef7f2c;
                line-height: 50px;
            }

            .login_box .login_details .scan_code .describe {
                color: #a6a6a6;
            }


        .login_box .login_details .details_boxR {
            width: 570px;
            height: 450px;
            background-image: url('../img/login/login_people.png');
            background-repeat: no-repeat;
            background-size: 75% auto;
            background-position: center 0px;
        }

#app .bg_star {
    width: 250px;
    display: block;
    position: absolute;
    top: 0px;
    right: 320px;
}

#app .newbg {
    width: 100%;
    height: 100%;
}

    #app .newbg.left_top_bg {
        background-image: url('../img/login/left_top.png');
        background-repeat: no-repeat;
        background-size: 12% auto;
        background-position: 13% 0;
    }

    #app .newbg.left_bottom_bg {
        background-image: url('../img/login/left_bottom.png');
        background-repeat: no-repeat;
        background-size: 14% auto;
        background-position: 10% bottom;
    }

    #app .newbg.right_top_bg {
        background-image: url('../img/login/right_top.png');
        background-repeat: no-repeat;
        background-size: 10% auto;
        background-position: 92% top;
    }

    #app .newbg.right_bottom_bg {
        background-image: url('../img/login/right_bottom.png');
        background-repeat: no-repeat;
        background-size: 9% auto;
        background-position: 92% bottom;
    }