*{margin: 0;padding: 0;box-sizing:border-box;}
body, button, input, select, textarea{font: 14px/1.5 tahoma,"微软雅黑","\5FAE\8F6F\96C5\9ED1", Arial, Helvetica,sans-serif;}
body {background:#fff;-webkit-text-size-adjust:100%;overflow: hidden;}
:-moz-placeholder {color:#ababab;font-size: 14px;}
::-moz-placeholder {color:#ababab;font-size: 14px;}
input:-ms-input-placeholder{color:#ababab;font-size: 14px;}
input::-webkit-input-placeholder{color:#ababab;font-size: 14px;}
*::before, *::after{box-sizing:border-box;}
.clearFix {*zoom:1}
.clearFix:before, .clearFix:after {display:table;content:""}
.clearFix:after {clear:both}
ul, ol{list-style-type: none;}
ul, ol ,li{list-style: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%;font-weight: normal;overflow: visible;line-height: 1.1em;}
/* ======================================================== */
.login{width: 100%;position: relative;overflow: hidden;}
.login-img{width: calc(100% - 440px);float: left;}
.login-img img{width: 100%;height: 100vh;object-fit: cover;}
.login-item{width: 440px;float: right;padding: 8vh 40px 0;height: 100vh;position: relative;}
.login-logo{width: 100%;text-align: center;}
.login-title{width: 100%;margin-top: 9vh;text-align: center;}
.login-title h4{font-size: 18px;color: #333;letter-spacing: 0.1em;}
.login-code{position: absolute;width: calc(100% - 80px);text-align: center;bottom: 8vh;left: 40px;}
.login-code h6{width: 100%;position: relative;}
.login-code h6::after{content: "";width: 100%;height: 1px;position: absolute;background: #ccc;left: 0;top: 50%;}
.login-code h6 span{position: relative;z-index: 2;font-size: 16px;color: #666;display: inline-block;background: #fff;padding: 0 10px;}
.login-code img{width: 122px;margin-top: 20px;}
.login-form{width: 100%;margin-top: 2vh;}
.login-form li{display: block;width: 100%;position: relative;margin-top: 2px;}
.login-form li:first-child{margin-top: 20px;}
.login-form-hint{display: block;width: 100%;font-size: 12px;color: #d7120b;height: 18px;opacity: 0;transition: all .4s ease;}
.login-form li input{width: 100%;height: 44px;font-size: 14px;color: #666;background-color: #fff;background-repeat: no-repeat;background-position: left 12px center;border: 1px solid #c3c2c7;border-radius: 3px;padding: 0 12px 0 36px;outline: none;transition: all .4s ease;}
.login-form li input.error{border: 1px solid #d7120b;}
#username{background-image: url('../login/icon1.png');}
#username.error{background-image: url('../login/icon1H.png');}
#password{background-image: url('../login/icon2.png');padding-right: 56px;}
#password.error{background-image: url('../login/icon2H.png');}
#authcode{background-image: url('../login/icon2.png');padding-right: 112px;}
#authcode.error{background-image: url('../login/icon2H.png');}
.login-form-eye{position: absolute;font-style: normal;z-index: 2;right: 0;top: 0;width: 44px;height: 44px;cursor: pointer;background: url('./eye.png') no-repeat center/18px auto;}
.login-form-eye.show{background-image: url('../login/eyeH.png');}
.login-form-code{position: absolute;z-index: 2;right: 2px;top: 1px;height: 42px;width: 100px;display: flex;cursor: pointer;align-items: center;justify-content: center;}
.login-form-code img, .login-form-code canvas{max-width: 100%;height: 100%;}
.login-form-handle{width: 100%;margin-top: 6px;user-select: none;overflow: hidden;}
.login-form-remember{float: left;}
.login-form-remember span{font-size: 14px;color: #ababab;padding-left: 24px;position: relative;line-height: 14px;cursor: pointer;display: inline-block;}
.login-form-remember span::before{content: "";width: 14px;height: 14px;position: absolute;left: 0;top: 0;border: 1px solid #c3c2c7;}
.login-form-remember span.ontrue::before{content: "";background: #d7120b url('../login/icon3.png') no-repeat center /12px auto;border: 1px solid #d7120b;}
.login-form-forget{float: right;}
.login-form-forget a{display: inline-block;line-height: 14px;color: #ababab;transition: all .4s ease;}
.login-form-forget a:hover{color: #d7120b;}
.login-form-submit{width: 100%;height: 44px;font-size: 16px;color: #fff;border-radius: 3px;background: #d7120b;margin-top: 24px;border: none;outline: none;cursor: pointer;transition: all .4s ease;}
.login-form-submit:hover{box-shadow: 0 4px 12px 0 #f9b4b2;}
.login-form-result{display: none;width: 100%;position: relative;padding: 10px 12px;background-color: #f2dede;border: 1px solid #ebccd1;margin-top: 2vh;border-radius: 3px;color: #d7120b;font-size: 14px;}
.login-form-result span{position: absolute;height: 24px;line-height: 24px;width: 24px;text-align: center;right: 4px;top: 50%;margin-top: -12px;z-index: 1;cursor: pointer;background: url('../login/close.png') no-repeat center/24px auto;}
.login-form-result.success{background-color: #dbecd7;border: 1px solid #a6d8b0;color: #086d0c;}

@media all and (max-width:1599px) {
    .login-item {padding: 5vh 40px 0;}
    .login-title {margin-top: 4vh;}
    .login-code img {margin-top: 12px;}
    .login-code{bottom: 3vh;}
    .login-form-submit{margin-top: 18px;}
}

@media all and (max-width:1000px) {
    .login-img{display: none;}
    .login-item{width: 100%;padding: 4.5vh 24px 0;}
    .login-code {bottom: 2vh;}
}