@import "../../styles/mixin";

.loginContainer{
  padding-top: 1.95rem;
  p, span, input{
    font-family: Helvetica Neue,Tahoma,Arial;
  }
}
.change_login{
  position: absolute;
  @include ct;
  right: 0.75rem;
  @include sc(.7rem, #fff);
}

.loginForm{
  background-color: #fff;
  margin-top: .6rem;
  .input_container{
    display: flex;
    justify-content: space-between;
    padding: .6rem .8rem;
    border-bottom: 1px solid #f1f1f1;
    input{
      @include sc(.7rem, #666);
    }
    button{
      @include sc(.65rem, #fff);
      font-family: Helvetica Neue,Tahoma,Arial;
      padding: .28rem .4rem;
      border: 1px;
      border-radius: 0.15rem;
    }
    .right_phone_number{
      background-color: #4cd964;
    }
  }
  .phone_number{
    padding: .3rem .8rem;
  }
  .captcha_code_container{
    height: 2.2rem;
    .img_change_img{
      display: flex;
      align-items: center;
      img{
        @include wh(3.5rem, 1.5rem);
        margin-right: .2rem;
      }
      .change_img{
        display: flex;
        flex-direction: 'column';
        flex-wrap: wrap;
        width: 2rem;
        justify-content: center;
        p{
          @include sc(.55rem, #666);
        }
        p:nth-of-type(2){
          color: #3b95e9;
          margin-top: .2rem;
        }
      }
    }
  }
}
.login_tips{
  @include sc(.5rem, #999);
  padding: .4rem .6rem;
  line-height: .7rem;
  a{
    color: #3b95e9;
  }
}
.login_container{
  margin: 0 .5rem 1rem;
  @include sc(.7rem, #fff);
  background-color: #4cd964;
  padding: .5rem 0;
  border: 1px;
  border-radius: 0.15rem;
  text-align: center;

}
.button_switch{
  background-color: #ccc;
  display: flex;
  align-items: center;
  justify-content: space-between;
  @include wh(2rem, .7rem);
  padding: 0 .2rem;
  border: 1px;
  border-radius: 0.5rem;
  position: relative;
  transition: all .3s;
  .circel_button{
    transition: all .3s;
    position: absolute;
    z-index: 1;
    @include wh(1.2rem, 1.2rem);
    left: -.1rem;
    box-shadow: 0 0.026667rem 0.053333rem 0 rgba(0,0,0,.1);
    background-color: #f1f1f1;
    border-radius: 50%;

  }
  .trans_to_right{
    transform: translateX(1.3rem);
  }
  span{
    @include sc(.45rem, #fff);
    transform: translateY(.05rem);
    line-height: .6rem;
  }
  span:nth-of-type(2){
    transform: translateY(-.08rem);
  }
}
.change_to_text{
  background-color: #4cd964;
}
.to_forget{
  float: right;
  @include sc(.6rem, #3b95e9);
  margin-right: .3rem;
}
