html,body,#loginbg {
    width:100%;
    height:100%;
}
body{padding:0;margin:0;
    min-height: 800px;}
*:focus{outline:none;}
#bg_content_img{background:url("../../static/image/bglogo.png");background-repeat: repeat-x; background-positon: 100%,100%;}
#loginbg{
    background-positon: 100%;
    display: flex;
    background-size: 100% 100%;
}
@media screen and (max-width: 1200px) {
    #loginbg {
        background-size: cover;
    }
}
#login{position:relative;margin-left:auto;margin-right:auto;width:460px;height:280px;}
.ele{position:absolute;left:126px;width:309px;height:44px;line-height:46px;font-size:24px;color:#999;text-indent:5px;border:1px solid #ccc;border-left:0;}
#username{top:24px;left:97px;}
#password{top:91px;left:97px;}

#forgetPwd{border:0;top:142px;left:100px;text-align:left;font-size:14px;font-weight:bold;font-family:'微软雅黑'}
#submitBtn{border:0;top:198px;left:45px;width:363px;height:46px;background:url("../../static/image/loginBt_bg.jpg") -5px -68px no-repeat;font-size:18px;color:#ffffff;font-family:'微软雅黑';font-weight:bold;}
#submitBtn:hover{background-position: -5px -2px;}

.info, .errors, .success {clear:both; margin:18px 0; padding:10px 20px 10px 100px; font-size:10px; line-height:1.5; }
.errors {border:1px dotted #d21033; background:#fed url(../../static/image/error.gif) no-repeat 20px 2px; color:#d21033; position:absolute;width:180px; height:30px;top:10px;left:40%;}
.tipsShow{
    width: 100%;
    height: 45px;
    background: rgba(255, 85, 85, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFF;

}
.tipsShowBg{
    position: absolute;
    display: none;
    width: 100%;
    height: 45px;
    z-index: 1;
}
.loading1,
.loading1 > div {
  position: relative;
  box-sizing: border-box;
}

.loading1 {
  display: block;
  font-size: 0;
  color: #000;
  position: absolute;
}

.loading1.la-dark {
  color: #333;
}

.loading1 > div {
  display: inline-block;
  float: none;
  background-color: currentColor;
  border: 0 solid currentColor;
}

.loading1 {
  width: 32px;
  height: 32px;
  animation: ball-spin-fade-rotate 6s infinite linear;
}

.loading1 > div {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  margin-left: -4px;
  border-radius: 100%;
  animation: ball-spin-fade 1s infinite linear;
}

.loading1 > div:nth-child(1) {
  top: 5%;
  left: 50%;
  animation-delay: -1.125s;
}

.loading1 > div:nth-child(2) {
  top: 18.1801948466%;
  left: 81.8198051534%;
  animation-delay: -1.25s;
}

.loading1 > div:nth-child(3) {
  top: 50%;
  left: 95%;
  animation-delay: -1.375s;
}

.loading1 > div:nth-child(4) {
  top: 81.8198051534%;
  left: 81.8198051534%;
  animation-delay: -1.5s;
}

.loading1 > div:nth-child(5) {
  top: 94.9999999966%;
  left: 50.0000000005%;
  animation-delay: -1.625s;
}

.loading1 > div:nth-child(6) {
  top: 81.8198046966%;
  left: 18.1801949248%;
  animation-delay: -1.75s;
}

.loading1 > div:nth-child(7) {
  top: 49.9999750815%;
  left: 5.0000051215%;
  animation-delay: -1.875s;
}

.loading1 > div:nth-child(8) {
  top: 18.179464974%;
  left: 18.1803700518%;
  animation-delay: -2s;
}

.loading1.la-sm {
  width: 16px;
  height: 16px;
}

.loading1.la-sm > div {
  width: 4px;
  height: 4px;
  margin-top: -2px;
  margin-left: -2px;
}

.loading1.la-2x {
  width: 64px;
  height: 64px;
}

.loading1.la-2x > div {
  width: 16px;
  height: 16px;
  margin-top: -8px;
  margin-left: -8px;
}

.loading1.la-3x {
  width: 96px;
  height: 96px;
}

.loading1.la-3x > div {
  width: 24px;
  height: 24px;
  margin-top: -12px;
  margin-left: -12px;
}

@keyframes ball-spin-fade-rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes ball-spin-fade {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: 0.25;
    transform: scale(0.5);
  }
}

.loading,
.loading > div {
  position: relative;
  box-sizing: border-box;
}

.loading {
  font-size: 0;
  color: #FFF;
  display: none;
}

.loading.la-dark {
  color: #FFF;
}

.loading > div {
  display: inline-block;
  float: none;
  background-color: currentColor;
  border: 0 solid currentColor;
}

.loading {
  width: 120px;
  height: 10px;
  font-size: 0;
  text-align: center;
}

.loading > div {
  display: inline-block;
  width: 10px;
  height: 10px;
  white-space: nowrap;
  border-radius: 100%;
  animation: ball-elastic-dots-anim 1s infinite;
}

@keyframes ball-elastic-dots-anim {
  0%,
  100% {
    margin: 0;
    transform: scale(1);
  }

  50% {
    margin: 0 5%;
    transform: scale(0.65);
  }
}
.login_flex{
    height: 575px;
    margin: auto;
    border-radius: 8px;
    display: flex;
}
.login_flex_left{
    width: 400px;
    height: 100%;
    background-positon: 100%,100%;
    border-radius: 8px 0px 0px 8px;
}
@media screen and (max-width: 1200px) {
    .login_flex_left {
        display: none;
    }
}
.login_flex_right{
    width: 540px;
    height: 100%;
    display: flex;
}
@media screen and (max-width: 600px) {
    .login_flex_right {
        width: 400px;
    }
}
@media screen and (min-width: 800px) and (max-width: 1200px) {
    .login_flex_right {
        width: 700px;
    }
}
.login_flex_right_div1{
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    border-radius: 0px 8px 8px 0px;
    position: relative;
}
.login_flex_title{
    margin-top: 60px;
    margin-left: 70px;
    font-size: 30px;
    font-family: Source Han Sans;
    font-weight: bold;
    opacity: 1;
    color: #FFF;
}
.login_user_title{
    margin-left: 70px;
    margin-top: 60px;
    font-size: 16px;
    font-family: Source Han Sans;
    font-weight: 400;
    color: #333333;
    opacity: 1;
}
.login_input_box{
    margin-left: 70px;
    margin-right: 70px;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    position: relative;
}
.login_input_box_label{
    position: absolute;
    font-size: 16px;
    font-family: Source Han Sans;
    font-weight: 400;
    color: #FFF;
    opacity: 1;
    top: 20px;
    right: 20px;
    cursor: pointer;
}
.login_password_title{
    display: flex;
    position: relative;
    margin: 16px 70px 0;
}
.login_password_label1{
    font-size: 16px;
    font-family: Source Han Sans;
    font-weight: 400;
    color: #333333;
    opacity: 1;
}
.login_password_label2{
    position: absolute;
    right: 0;
    font-size: 14px;
    font-family: Source Han Sans;
    font-weight: 400;
    opacity: 1;
    cursor: pointer;
}
.login_btn_div{
    height: 60px;
    margin: 15px 70px 0;
}
.login_btn_progress{
}
.login_btn{
    height: 60px;
    border-radius: 8px;
    font-size: 16px;
    font-family: Source Han Sans;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.login_flex_scan{
     height:50px;width:50px;
     position: absolute;
     top: 8px;
     right: 10px;
     cursor: pointer;
}
.triangle{
    width: 0;
    height: 0;
    border-bottom: 50px solid #FFF;
    border-right: 50px solid transparent;
    position: absolute;
    right: 8px;
    top: 10px;
    cursor: pointer;
}
.triangle2{
    width: 0;
    height: 0;
    border-bottom: 40px solid #FFF;
    border-right: 40px solid transparent;
    position: absolute;
    right: 14px;
    top: 14px;
    cursor: pointer;
}
.login_flex_scan2{
     height:50px;width:50px;
     position: absolute;
     top: 5px;
     right: -2px;
     cursor: pointer;
}
.login_demo{
    position: absolute;
    width: 107px;
    height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    font-size: 12px;
    font-family: Source Han Sans;
    font-weight: 400;
    top: 10px;
    right: 66px;
    border-radius: 4px;
    color: #FFF;
}

.login_demo:after{
    content: "";
    position: absolute;
    top: 7px;
    left: 106px;
    border: 4px solid transparent;
    border-left-color: #fff;
}
.login_input_btn{
    line-height: 56px;
    height:56px;
    font-size: 18px;
    color: #333;
    text-indent: 5px;
    border: 1px solid #EBEEF8;
    border-radius: 8px;
    padding-left: 5px;
    background: rgba(250, 251, 252, 0.39);
}

.login_flex_right_div2{
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    border-radius: 0px 8px 8px 0px;
    position: relative;
    display: none;
}
.login_flex_right_div3{
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    border-radius: 0px 8px 8px 0px;
    position: relative;
    display: none;
}
.login_flex_right_div4{
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    border-radius: 0px 8px 8px 0px;
    position: relative;
    display: none;
}
.login_forget_password_title{
    font-size: 32px;
    font-family: Source Han Sans;
    font-weight: bold;
    color: #333333;
    opacity: 1;
    margin-left: 70px;
    margin-top: 60px
}
.login_forget_password_text{
    margin-left: 70px;
    margin-top: 20px;
    font-size: 16px;
    font-family: Source Han Sans;
    font-weight: 400;
    color: #666666;
    opacity: 1;
    margin-bottom: 24px;
}
.login_forget_input_title{
    margin-left: 70px;
    margin-top: 16px;
    font-size: 16px;
    font-family: Source Han Sans;
    font-weight: 400;
    color: #333333;
    opacity: 1;
}
.login_forget_scan_title{
    width: 100%;
    font-size: 32px;
    font-family: Source Han Sans;
    font-weight: bold;
    color: #333333;
    opacity: 1;
    display: flex;
    justify-content: center;
    margin-top: 72px;
}
.login_forget_scan_text{
    width: 100%;
    font-size: 16px;
    font-family: Source Han Sans;
    font-weight: 400;
    color: #666666;
    opacity: 1;
    display: flex;
    justify-content: center;
    margin-top: 20px;
}
.login_forget_scan_imgDiv{
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 30px;
}
.login_forget_scan_border{
    width: 320px;
    height: 320px;
    border: 1px solid #E2E2E2;
    opacity: 1;
    border-radius: 11px;
}
.login_forget_scan_img{
    width: 260px;
    height: 260px;
    margin: 60px 30px auto 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.scan_demo_img{
    width:260px;height:260px;
    opacity: 0.2;
}
.login_forget_scan_img1{
    width: 260px;
    height: 260px;
    margin: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
#code {
	top: 150px;
    width: 40%;
    right: 53px;
    left: inherit;
    height: 30px;
    line-height: 30px;
    border-left: 1px solid #ccc;
}
#imgVerify_a {
	position: absolute;
	top: 153px;
    left: 50px;
}
::-webkit-input-placeholder {
	font-size: 10px;
}
::-moz-placeholder {
	font-size: 10px;
}
::-ms-input-placeholder {
	font-size: 10px;
}

.forget-password {
    position: absolute;
    top: 150px;
    right: 53px;
    text-decoration: underline;
    color: #00AF8E;
}
.forget-password:hover {
    cursor: pointer;
}

.forget-password-dialog-wrapper {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 10;
    background-color: rgba(0,0,0,0.4);
}

.forget-password-dialog {
    position: absolute;
    width: 460px;
    height: 350px;
    transform: translate(-50%, -50%);
    background-color: #fff;
}

.reset-password-dialog{
    height: 286px;
}

.forget-password-dialog-title {
    font-size: 18px;
    font-weight: bold;
    text-align: left;
    line-height: 18px;
    padding: 12px 0px 0px 12px;
}

.forget-password-dialog-close {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 12px;
    font-size: 20px;
    line-height: 20px;
    font-weight: bold;
}

.forget-password-reset-btn {
    width: 318px;
    height: 46px;
    line-height: 46px;
    font-size: 18px;
    text-align: center;
    color: #39EED0;;
    background-color: #00576C;
    border-radius: 5px;
}

.forget-password-input {
    height: 46px;
    width: 310px;
    font-size: 24px;
    margin-top: 25px;
    padding: 0px 5px;
}

.verification-code {
    width: 155px;
}

.verification-code-btn {
    display: inline-block;
    margin-left: 15px;
    width: 140px;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    text-align: center;
    color: #39EED0;
    background-color: #00576C;
    border-radius: 5px;
}

.verification-code-btn.count-down {
    background-color: #cccccc;
}
.simulation-btn:hover{
    cursor: pointer;
    box-shadow:1px 1px 1px 1px #39EED0;
}
.simulation-btn:hover .progress{
    background-color: #39EED0;
}
.simulation-btn:hover .progress-text{
    color: #00576C;
}
input::-webkit-input-placeholder {
    /* 修改字体颜色 */
    color: #333;
    /* 修改字号，默认继承input */
    font-size: 14px;
    font-family: "Microsoft YaHei";
}
.forget-password-reset-btn:hover{
    width: 318px;
    height: 46px;
    line-height: 46px;
    font-size: 18px;
    text-align: center;
    color: #00576C;
    background-color: #39EED0;
    border-radius: 5px;
}
.tips{
    text-align: left;
    padding-left: 2px;
    padding-top: 2px;
    height: 14px;
    font-size: 14px;
    font-family: Source Han Sans;
    font-weight: 400;
    color: #FF5555;
    opacity: 1;
    margin-top: 10px;
}
