*{margin: 0; padding: 0;}
img, input {border: none;padding: 0; margin: 0;outline-style: none;}
input {padding-top: 0; padding-bottom: 0;vertical-align: middle;}
img { border: 0;  vertical-align: middle;}
.login{display: flex;justify-content: center; align-items: center; height: calc(100vh - 0px);background: url("../images/login3.jpg")}
.login>.login_main{width: 712px;height: 530px;box-shadow: 0px 0px 21px #999999;border-radius: 10px;}
.login>.login_main>.main_right{height: 530px; width: 408px;float: right; -moz-border-top-right-radius: 10px;-webkit-border-top-right-radius: 10px; border-top-right-radius: 10px; -moz-border-bottom-right-radius: 10px;background: #ffffff;-webkit-border-bottom-right-radius: 10px;border-bottom-right-radius: 10px;display: flex;justify-content: center;}
.main_con{width:360px;height: 100%;}
.main_t{font-family: PingFangSC-Medium;font-size: 18px; color: #252B3A;line-height: 26px;font-weight: bold;margin-top: 23px;}
.main_red{font-family: PingFangSC-Regular;font-size: 12px;color: #DE504E;margin-bottom: 17px;}
.username>p,.password>p{font-family: PingFangSC-Regular;font-size: 12px;color: #252B3A;line-height: 16px;margin-top: 30px;margin-bottom: 8px;}
.login>.login_main>.main_left{height: 530px; width: 304px;float: left; -moz-border-top-left-radius: 10px; -webkit-border-top-left-radius: 10px; border-top-left-radius: 10px;  -moz-border-bottom-left-radius: 10px; -webkit-border-bottom-left-radius: 10px;border-bottom-left-radius: 10px; background: url("../images/login4.jpg") no-repeat;}
.login>.login_main>.main_right>.main_con>form input:not(.keep_checkbox){background: #FFFFFF;border: 1px solid #ADB0B8;border-radius: 2px;width:97%; height: 48px; font-family: PingFangSC-Regular; font-size: 12px;color: #8A8E99; line-height: 16px;padding-left: 3%}
.login>.login_main>.main_right>.main_con>form input:not(.keep_checkbox):focus{border: 1px solid #999;}
.login>.login_main>.main_right>.main_con>form>.yes_login>a{text-decoration: none;height: 50px;background: #F66F6A; font-family: PingFangSC-Regular;font-size: 12px;color: #FFFFFF;letter-spacing: 0;line-height: 50px;display: block; text-align: center;border-radius: 5px;}
.main_title{background: #F2F5FC; border: 1px solid #5E7CE0; border-radius: 2px;display: flex;padding: 15px;margin-top: 24px;}
.main_title_r>p{font-family: PingFangSC-Regular;font-size: 12px;color: #252B3A;line-height: 18px;}
.main_title_r>p>span{font-family: PingFangSC-Regular;font-size: 12px;color: #526ECC;line-height: 18px;}
.main_title_r>p>a,.help_div>a{font-family: PingFangSC-Regular;font-size: 12px;color: #526ECC;line-height: 18px;cursor: pointer;text-decoration:none;}
.main_title_l{padding-right: 12px;}
.yes_login{margin-top:16px;}
.a ::-webkit-input-placeholder { color:#999999;font-size: 12px;}
.password_error{font-size: 12px;color: red;margin: 10px 0 10px 0;}
.password_error_div{margin: 10px 0 10px 0}
.checkArea_div{font-family: PingFangSC-Regular;font-size: 12px;color: #252B3A;line-height: 16px;}
.checkboxDiv{display: inline-block;margin-left: 4px;}
.checkbox_label{position: relative;cursor: pointer;}
.checkboxDiv label:before {left: -20px;top: 0;width: 12px;height: 12px;border: 1px solid #ADB0B8;border-radius: 2px;transition: all .3s ease;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;}
.checkboxDiv label:after {left: -16px;top: 2px;width: 4px;height: 7px;border: 0;border-right: 2px solid #fff;border-bottom: 2px solid #fff;background: #fff;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);transition: all .3s ease;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;}
.checkboxDiv input[type=checkbox]:checked+label:after {background: #F66F6A;}
.checkboxDiv label:after, .checkboxDiv label:before {position: absolute;content: '';}
.checkboxDiv label {position: relative;cursor: pointer;}
.checkboxDiv input[type=checkbox]:checked+label:before {background: #F66F6A;border-color: #F66F6A;}
.checkboxDiv input[type=checkbox] {opacity: 0;margin: 0;padding: 0;}