* {
  box-sizing: border-box;
}
img {
  max-width: 100%;
  display: block;
}
body {
  max-width: 500px;
  margin: 0 auto;
}
.login_wrap {
  width: 100%;
  padding: 1rem .64rem;
}
.login_title {
  font-weight: bold;
  font-size: .44rem;
}
.login_form {
  padding-top: .8rem;
}
.login_col {
  width: 100%;
  margin-bottom: .5rem;
  padding: .2rem 0;
  border-bottom: 1px solid rgb(214, 215, 217);
}
.login_col_label {
  font-size: .3rem;
  font-weight: bold;
  color: #333;
  margin-bottom: .2rem;
}
.login_col_inp {
  width: 100%;
  display: flex;
  align-items: center;
  padding: .06rem 0;
}
.login_col_inp > input {
  width: 1px;
  flex: 1;
  display: block;
  outline: none;
  border: none;
}
.login_col_inp .getcode {
  text-align: center;
  color: #3659f1;
  font-size: .28rem;
  width: 1.8rem;
}

.login_agree {
  display: flex;
  align-items: center;
  font-size: .26rem;
  color: #333;
  padding-top: .2rem;
}
.login_agree > img {
  width: .32rem;
  height: .32rem;
  margin-right: .08rem;
}
.login_agree > img:nth-of-type(2) {
  display: none;
}
.login_agree > a {
  color: #3659f1 !important;
}
.login_agree.active > img:nth-of-type(1) {
  display: none;
}
.login_agree.active > img:nth-of-type(2) {
  display: block;
}

.login_btn {
  background: #3659f1;
  color: #fff;
  width: 100%;
  height: .8rem;
  font-size: .28rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  cursor: pointer;
  margin-top: .3rem;
  border-radius: .06rem;
}