body{background: url("../img/bg.jpg") no-repeat top center #F5F7FC;width: 100%;font-family:'Microsoft YaHei';margin: 0;padding: 0;}
a{text-decoration: none;}
.header{width: 100%;background-color: #0232CD;}
.header .w1200{width: 1200px;margin: 0 auto;display: flex;justify-content: space-between;height: 62px;align-items: center;}
.header .w1200 .return{padding: 6px 10px;border: 1px solid #BED2FF;border-radius: 4px;color: #FFFFFF;letter-spacing: 3px;font-size: 14px;}
.header .w1200 .return i{margin-right: 3px;}
.header .w1200 .return:hover{background: #4e6fdc;border: 1px solid #bed2ff;}
.header .logo-box{display: flex;align-items: center;}
.header .logo-box .logo{background: url("../img/gh_logo.png") no-repeat;width: 46px;height: 46px;margin-right: 5px;display: block;}
.header .logo-box h1{margin: 0;padding: 0;color: #FFFFFF;font-size: 22px;font-weight: 900;letter-spacing: 1px;}
.header .logo-box h1 span{margin-left: 6px}
.header .logo-box h2{margin: 0;padding: 0;color: #FFFFFF;font-size: 13px;font-weight: 400;}
.login-body{
    height: calc(100vh - 212px);
    display: flex;
    align-items: center;
    justify-content: center;
}
.header .new-logo{
    display: flex;
    align-items: center;
    color: #FFF;
}
.header .new-logo i{
    background: url("../img/gh_logo.png") no-repeat;
    width: 46px;
    height: 46px;
    display: block;
    margin-right: 10px;
}
.header .new-logo span{
    font-size: 26px;
    line-height: 26px;
    font-weight: 800;
    letter-spacing: 3px;
}
.header .new-logo em{
    padding: 10px;
}
.header .new-logo .w1px{
    width: 1px;
    display: block;
    height: 19px;
    background-color: #ffffff;
    margin: 0 10px;
}

.login-wrap{width: max-content;;display: flex;justify-content: space-between;margin: auto;justify-content: center;align-items: center;box-shadow: 0px 2px 12px 0px rgba(87,112,250,0.15), 0px 0px 20px 0px #ffffff inset; }
.login-wrap .login-left{background: url("../img/login_box.png") no-repeat;width: 466px;height: 466px;border-radius: 6px 0 0 6px}
.login-wrap .login-right{display: flex;flex-direction: column;justify-content: space-around;background-color: #FFFFFF;border-radius: 0 6px 6px 0;width: 466px;height: 466px;padding: 39px;box-sizing: border-box;}
.login-wrap .login-right h3{padding: 0;margin: 0;text-align: center;font-weight: 700;font-size: 24px;color: #333}
.login-wrap .login-right input{display: block;width:100%;height:48px;outline: none;border-radius: 3px;padding: 8px 8px 8px 50px;box-sizing: border-box;background: #ffffff;border: 1px solid #E1E1E1;color: #333333;}
.login-wrap .login-right input:hover,.login-wrap .login-right input:focus{border: 1px solid #0232CD;}
.login-wrap .login-right .username,.login-wrap .login-right .password,.login-wrap .login-right .yzm{position: relative;}
.login-wrap .login-right i{position: absolute;top: 16px;left: 20px;color: #D6D6D6}
.login-wrap .login-right>div{margin-top: 24px;width: 100%;}
.login-wrap .login-right>div:hover i{color: #0232CD;}
.login-wrap .login-right .yzm{background: #ffffff;border: 1px solid #E1E1E1;border-radius: 2px;}
.login-wrap .login-right .yzm:hover{border: 1px solid #0232CD;}
.login-wrap .login-right .yzm input{width: 163px;border: 0;}
.login-wrap .login-right .yzm:before{content: '';width: 1px;height: 26px;background-color: #EDEDED;position: absolute;left: 165px;top: 11px;display: block;}
.login-wrap .login-right .yzm img{position: absolute;right: 69px;top: 9px;width: 80px;height: 30px;}
.login-wrap .login-right .yzm a{position: absolute;right: 13px;top: 13px;font-size: 14px;color: #0232CD}
.err-txt{color: #E34D59;font-size: 14px;margin-top: 10px!important;}
.login-btn{background: #0232CD;border-radius: 3px;width: 100%;height: 48px;line-height: 48px;font-size: 14px;letter-spacing: 6px;color: #FFFFFF;border: 0;cursor: pointer;}
.login-btn:hover{background: #98B5FF;transition: all 0.3s;}
.footer{color: #999999;font-size: 14px;width: 100%;text-align: center;background: #fff;
    height: 150px;
    display: flex;
    flex-flow: column;
    justify-content: center;
    position: absolute;
    bottom: 0;}
.footer > div{padding-bottom: 6px;}
.logo-nav{display: flex;margin: 0;justify-content: space-between;padding: 20px 0 0;}
.logo-nav li{list-style: none;color: #999999;font-size: 14px;}
.logo-nav li a{color: #0232CD;}

@media (max-height: 730px){
    /*.footer {*/
    /*    padding: 25px 0;*/
    /*}*/
    .login-wrap {
        transform: scale(0.8);
    }
    /*.footer > div{padding-bottom: 2px;}*/
}

::-webkit-input-placeholder { /* WebKit browsers */
    color: #B8B8B8;
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #B8B8B8;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #B8B8B8;
}
input:-webkit-autofill{
    box-shadow: inset 0 0 0 1000px #ffffff ;
}
::-webkit-scrollbar {
    /*滚动条整体样式*/
    width: 6px !important;
    /*高宽分别对应横竖滚动条的尺寸*/
    height: 6px !important;
    background: #ffffff !important;
    cursor: pointer !important;
}

::-webkit-scrollbar-thumb {
    /*滚动条里面小方块*/
    border-radius: 5px !important;
    -webkit-box-shadow: inset 0 0 5px rgba(240, 240, 240, 0.5) !important;
    background: #B2B6BF !important;
    cursor: pointer !important;
}

::-webkit-scrollbar-track {
    /*滚动条里面轨道*/
    -webkit-box-shadow: inset 0 0 5px rgba(240, 240, 240, 0.5) !important;
    border-radius: 0 !important;
    background: #E1E4EB !important;
    cursor: pointer !important;
}