* {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-family: Microsoft Yahei;
}
.login-container {
  background-color: #fff;
  color: #333;
}
.login-container .header {
  background-color: #fff;
  line-height: 74px;
  height: 74px;
}
.login-container .header .logo {
  background: url(images/LOGO-BaiLing.png) no-repeat center;
  background-size: cover;
  vertical-align: middle;
  display: inline-block;
  position: relative;
  margin-right: 10px;
  width: 135px;
  height: 55px;
}
.login-container .header .font28 {
  display: inline-block;
  vertical-align: middle;
  font-size: 28px;
  color: #2751A3;
}
.login-group {
  background-color: #f1f1f1;
  position: absolute;
  width: 100%;
  bottom: 70px;
  top: 74px;
  min-height: 460px;
  overflow: hidden;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.login-group .login-wrap {
  position: relative;
  height: 460px;
  width: 1200px;
  border: none;
  padding: 0;
  background: url(images/bg-erp.png) no-repeat center;
  background-size: contain;
}
.login-group .login-wrap .login-content {
  float: right;
  padding: 30px 30px 20px 30px;
  border-radius: 4px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  background: #FFFFFF;
}
.login-group .login-wrap .login-content .login-content-title {
  margin: 0 0 10px 0;
  line-height: 18px;
  font-size: 18px;
  color: #333333;
  font-family: PingFangSC-Regular;
  letter-spacing: 0;
}
.login-group .login-wrap .login-content .login-content-title span {
  line-height: 12px;
  font-size: 12px;
  color: #999999;
  font-family: PingFangSC-Regular;
  letter-spacing: 0;
}
.login-group .login-wrap .login-content .login-content-form {
  width: 360px;
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item {
  margin-top: 20px;
  width: 100%;
  height: 50px;
  line-height: 50px;
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item .login-content-form-item-input {
  padding-left: 50px;
  height: 100%;
  border: 1px solid #E1E1E1;
  background: no-repeat 16px center;
  background-size: 18px 18px;
  border-radius: 2px;
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item .login-content-form-item-input input {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item.login-content-form-username .login-content-form-item-input {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAJKADAAQAAAABAAAAJAAAAAAqDuP8AAACj0lEQVRYCe2Xz0sbQRTHu+uGEAgVexBCT1UUxGsghxaVakggCXjSk/SUP0EE6bF48U/w2FM8CUkgIWqa0h4KuZZCS72FgIeWNoEQEhO/T2aCrOvkze6ql8xldt+8932ffZlfMZ65bPl8fh2h28PhcAX9SyHTMAzjM55zmUzmTNi0OkPLG84AWUB3BJBVVSzAahjPAuyXys8+pgVULBZXBoPBCWBm7EJO74D6a5rmZiqVoqqxGhtIVOYbF0ZmJyg8x7iVMmUgo6efiVWZ21oi5ui2TfXMAioUChsQVs4ZVRKKJQ2VjxxjAUFwSwa47bkaXCBa2p4agFgaLCCQyH3GCxRLgwvkBUQrlgvU0FJ1dmZpsIDEceCchmnlanCBjpl5VW451aAc09mpP9F+IgN1elSnhp16jRPDqpAQyopjgKM78hEx2ZFhzAMbiM4iOih1oMiXYrjnGLGygchZnNoxJKKrhbIJn5jOSU+C7Dlkzy7Oty2xA8tN7+aCBpjjdDp9ao+ZvE8q8BgVcDWpK5XKdKfTWcSSnscd+wUm8XOCxQT/D9sf2H6HQqGf8Xj8n+5HsIBKpdJyv99/i0RvkPw1EstVpcwH3wZ8vwLyi2VZ58lk8rsyAIP3AmFZz0FsBz7032tpnBBnHIA/4JdD/xHbwoVTzB0gqkav19sHxDYCppyCfLBdASoXCAQO7FUbAdXr9UCz2fyAZLuAGdl9SH6vBKCGGDyMRCLvo9FojxxvEpfL5dlut1vEe5SMT9DqwWAwlUgkLo1qtWq12+1TVMXV1cIveFSrFg6HN6xWq7UH0SeFoY+ighCLCbJ3fn2lVx1iMUE251XIx/hXdB96qKWtzYniWFoXNO0MLgImQOOKdg3OK+Me3ramYQAAAABJRU5ErkJggg==);
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item.login-content-form-password .login-content-form-item-input {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAkCAYAAACaJFpUAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAHKADAAQAAAABAAAAJAAAAAD17AflAAADJUlEQVRIDe2XzWsTQRjG3W20QupBQoVaBYlSkRwEySn4B0iatFKp9aB4KYjoUQQrVsGLgngQEY+i1YuI0C9Kqy3Fmxe/KCgaIUj9B5JaTfPh742ZdTbNZmeR9OTA9P165nl2JjOzXWuTQZuenm4vFospy7IGgB+qVCrdWELrO/YN/XkkEhlPJBKr+E2b1bRKcWJiYgiBG7h7mmERX6Y+kk6nHzbFeRUXFhZCKysrd8vl8hkvTKM8wo+i0ehwLBYrNKqHGiUll8/nx5jZkF6HrEIsS/i5lt+HlSV2Vgr/VCaT2Y7tB1+u4RzjAJ0MDst4kQE39Rz+g7a2tmu9vb1ZPc/vu6tUKo2SG9aFEbvO8kre1dYJIiYb4guDt9aQZdu2T6dSqTHXyLpgcnJykDFP6NVVQ3CNBzyQTCYzOtTWg5p/SROT1B0/MQGBeYq5Jb40ODYz8yt/or9/XYKAbPqgKvOUX+mXVexnZcnBf1Q4uAaWlpa2qFisS5BliZPboQFu8zv80OKmLsv3C0FnloC3ZbPZw/oglyAF2XVOY/C8Exg6zPKlDuVYuThdggh06eBwOPxNj038zs7OZXjk+FQby+ridAmCaK/hlPmpHFMbj8fXENHPn9rtVQrnWHAcDgIcIXtckfOkZ/FLKja18NwHW50MHOP4o+yFdzLekouZ7fsY0DFJtKoh/Kyjo+NkiLeA3AYtFZNJyIRyudwnG2XXfdmqGQovWifkoO9tpYjOjVa0fpfq9Zb4QQVzLMv5UCi0WzpPdI6eC/Jk1ZvdZABCrEiF3Z1e1PD3uA4/kF+kO0dMq69zjWcI4Yu+vj5drErGW+IVztw6Zo+EsSAzfO/BIbvPs1Y/xliQga47USdi9p41HSd+EMH+qampnnqCWu5ofd4rNhZkFmFeNfOzs7M7FdnMzEyX5KSmcn7WWFCIIO4uFAr7FSl+j+RUbGIDCZoQ+mH+C/qtUOC68dWmMSf570C9YWTTaCV/N7Agx+CCP603Ql7Agf9R8qbzrazKLpWvoQ1pTO4t3yn21Q1RQ0S0bD6/5nCOoP6aXMOPyH98oIJwi4Zo/QYf1h74EXpLwwAAAABJRU5ErkJggg==);
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item.login-content-form-captcha .login-content-form-item-input {
  display: inline-block;
  width: 240px;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAkCAYAAACe0YppAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAHqADAAQAAAABAAAAJAAAAAAh0JciAAADe0lEQVRYCe1XS2gTURTNTEKSJqQ0VJQERBFxoSAuiuhCJPaHTVOtLmylIERQUBAJqJSWgm6kChY3QlGxlOpOKGnTNLUf/CDdWTddCOqmKCgl9ZP/z3NLXnkTZyaTD12IAzf33fvuPef95r6JTlfmMzEx0e/3+wfKTNcJpSZOTU3VZjKZoVwu583njtTU1Fxtbm7+UQqWZmIizGazXkgvCLbyJIIgfMdA7thstkcul2uN71NqqxLPzs5ui8VijQA9DvBOaKsSUN4fgx6HBM1m81xLS8sXpXgBe3UfnQmIHmIjAYETRHuht8Cu5FkFzjIAaAA/Ib9gZ4FrNODnihwy/HLuUn31wDnCJzFckXduZvs/8aat9r+11HhlqIpdg36itIRVnzHInoJsN/QDaEmF4wdRTWIqFp0ej6fHbrdTQQrhnXXzZHzbwBvltkH4Vq/Xn2lra1sJhULWcDhMpIfV8ComBulDh8NxuaGhIYWLxJRIJPwgVCWlARVb6t8AXlIYeRZ+H5b2ApFihgKuyxH4jinES9yKxCD8aDQaD2E2B9G+C+GLd1IUxa6Ojo4hhjY5OXkL5F3MLqbVljrQ2tq6nCe8HggE5nEXjwLQCtKTbrf7BQPHDedBu4/ZWrSAzxd+JoU5Y06n00tLSR3T09MOkO/AIVpkgcFgcGcqlXoHu475tOhixDrMeA4n9hTI6D6VPLSvWOI5aJekQ4MhAjiiFgfQxnQ6/XpmZsZZGAfSi+WQEqeIxG+FgDL2/ng8voil3sf6sK/0dTLI7FI0cdKM32tM2p5MJt/gTByleCT3QWo15krCiJOI5yVedaMO8SHM1oewS+qhyr3EKeBLsj4ajdLHmFE5tKo9SYvF4hSbmppWATtcVWh1sGHiXK9cBoOhH9P/qh5feS9xEBchrRPTO4qD0o2OeOXw8giETWWW1YONWo26+xIp3ZCMfGpFXsLsRpl9xVA2iMmBm2YcozqBpqb/PwykiF4jTMLm42T/O6Ei7cLSP4cc4INLbWN5lyCn29vbPxXmyhJT0MLCgjkSifSC/AbEVJioZoMsARm0Wq238e9R9twoEjNgmj1upJuwz0IkW8NiOE0fB89MJtMArtTPnP+vZlFiloH7eA9m7oOcg5iZP69j2MdRzPIeDtCHgj5ZUzMxy8YK2NHuAfl58oHsMdQY9jFMttbnD0mOVCFLtiMXAAAAAElFTkSuQmCC);
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item .login-content-form-captcha-img {
  float: right;
  width: 104px;
  height: 50px;
  border-radius: 2px;
  cursor: pointer;
}
.login-group .login-wrap .login-content .login-content-form .login-content-form-item .login-content-form-captcha-img img {
  width: 100%;
  height: 100%;
}
.login-group .login-wrap .login-content .login-content-forget-button {
  margin: 16px 0 20px;
  line-height: 14px;
  text-align: right;
  font-size: 14px;
  font-family: PingFangSC-Regular;
  color: #2751A3;
  cursor: pointer;
}
.login-group .login-wrap .login-content .login-content-login-button {
  width: 100%;
  height: 50px;
  line-height: 18px;
  font-size: 18px;
  font-family: PingFangSC-Regular;
  color: #FFFFFF;
  background: #2751A3;
  border-radius: 2px;
}
.login-group .login-wrap .login-content .login-content-recommend {
  position: relative;
}
.login-group .login-wrap .login-content .login-content-recommend .login-content-recommend-p .login-content-recommend-line {
  position: absolute;
  top: 7px;
  width: 100%;
  background: #e1e1e1;
  height: 1px;
}
.login-group .login-wrap .login-content .login-content-recommend .login-content-recommend-p p {
  position: relative;
  margin: 15px auto;
  width: 90px;
  line-height: 14px;
  font-size: 14px;
  font-family: PingFangSC-Regular;
  color: #999999;
  background: #fff;
  text-align: center;
}
.login-group .login-wrap .login-content .login-content-recommend .login-content-recommend-img {
  margin: 0 auto;
  width: 28px;
  height: 28px;
  background: url(images/icon-chrome.png) no-repeat center;
  background-size: contain;
}
@media (min-width: 576px) {
  .login-wrap {
    width: 540px;
  }
}
@media (min-width: 768px) {
  .login-wrap {
    width: 720px;
  }
}
@media (min-width: 992px) {
  .login-wrap {
    width: 960px;
  }
}
@media (min-width: 1200px) {
  .login-wrap {
    width: 1200px;
  }
}