@charset "utf-8";

/* ------------------ tags ------------------ */
body {
//  background-color:#00b6c9;
  background-color:#b3f2fc;
}

/* ------------------ content ------------------ */
/* ------------------ loging_left ------------------ */
.loging_left {
  width:45%;
  height:100vh;
  background-color:#fff;
}
.loging_left_top {
}
.loging_left_head {
  height:calc(100vh/2 - 160px);
  width:100%;
}
.loging_left_bottom {
  height:30px;
  width:100%;
}
.login_top_outer {
  height:80px;
  width:100%;
}
.login_top {
  margin:0;
}
.login_top_logo {
  width: 140px;
  margin:0 auto 0 auto;
  height: 140px;
  overflow:hidden;
  text-align:center;
}
.login_top_logo_img {
  width: 100px;
  height: 100px;
}
.login_top_label {
  white-space:nowrap;
  overflow:hidden;
  margin:0 auto 0 auto;
  color:#555;
  font-size:18px;
  font-weight:bold;
  text-align:center;
}
.login_top_icon_box {
  padding:200px 0 0 10%;
}
.login_top_icon {
  width:100px;
}

/* ------------------ loging_right ------------------ */
.loging_right {
  width:55%;
  height:100vh;
}
.loging_right_top {
  height: calc(100vh - 40px);
}
.loging_right_head {
  height:22vh;
  width:100%;
}
.description {
  color: #777;
  padding: 0 30px;
}
.errors {
  width:100%;
  min-height:80px;
  min-height:80px;
  overflow:hidden;
}
.errors_line {
  color:#f00;
  width:100%;
  line-height:40px;
  vertical-align:top;
  text-align:center;
  height:40px;
  font-weight:bold;
  color:#f41f51;
}
.login_box {
  width:100%;
  height:300px;
  margin:0 auto;
  overflow:hidden;
}
.login_box_inner {
  width:300px;
  margin:0 auto;
}
.login_box_inner {
  margin-bottom:20px;
  text-align:center;
}
.login_box_line {
}
.login_box_line_icon_box {
  padding:5px 10px;
  background-color:#fff;
  border-top-left-radius: 3px;
  -moz-border-top-left-radius: 3px;
  -webkit-border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  -moz-border-bottom-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
}
.login_box_line_icon_box span.glyphicon {
//  color:#9baab5;
  color: #777;
  font-size:12px;
}
.login_box_line_input_box {
  padding:4px 6px 4px 0;
  background-color:#fff;
  border-top-right-radius: 3px;
  -moz-border-top-right-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  -moz-border-bottom-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
}
.login_input {
//  font-size:16px;
  width:310px;
  border:solid 1px #eee;
  padding:3px 3px;
}
.login_button {
  width:300px;
  height:38px;
  margin:0 auto;
  border:solid 1px #c1dcf1;
}
.login_button:hover {
  border:solid 1px #9fcbed;
}
.login_button:active {
  border:solid 1px #9fcbed;
}
.login_button:selected {
  border:solid 1px #9fcbed;
}
a.password_remind_link {
//  color:#fff;
  color:#605e79;
}
.footer {
  height: 40px;
  background-color: transparent;
  padding: 10px;
  border-top: solid 1px #fff;
//  border-top: solid 1px #777;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
}
.footer a {
  color: #fff;
//  color: #777;
}
.footer a:hover {
  opacity: 0.8;
}



@media screen and (min-width: 0px) and (max-width: 720px) {

  /* ------------------ content ------------------ */
  /* ------------------ loging_left ------------------ */
  .loging_left {
    width:100%;
//    height:200px;
    height: calc(100vh * 0.4);
  }
  .loging_left_head {
//    height:70px;
    height: calc(100vh * 0.1);
  }
  .loging_left_bottom {
    height:30px;
  }

  /* ------------------ loging_right ------------------ */
  .loging_right {
    width:100%;
//    height:calc(100vh - 200px);
    height:calc(100vh * 0.6);
  }
  .loging_right_top {
      height:calc(100vh * 0.6 - 40px);
  }
  .loging_right_head {
    height:30px;
  }
  .errors {
    min-height:0;
    height:40px;
  }
  .login_box {
    width:100%;
    height:210px;
  }
  .login_box_inner {
//    width:90%;
  }
  .login_input {
    width:80vw;
  }
  .login_button {
    width:100%;
  }
  .login_top_icon_box {
    height:100px;
    padding:0 0 0 10%;
  }
  .footer {
//    margin-top:calc(100vh - 200px - 30px - 40px - 210px - 100px - 40px);
    border-top:solid 1px #fff;
  }
}