@charset "utf-8";

body {
    background: url(../images/login/login-bg.png) no-repeat right top #fff;
}

img {
    display: block;
    max-width: 100%;
}

.main {
    padding: 210px 0 0;
}

.login-logo {
    padding: 0 143px;
}

.form-container {
    margin-top: 137px;
    padding: 0 104px;
    overflow: auto;
}

.form-item {
    margin: 39px 0;
}

.form-item.input-item,
.form-item.btn-item {
    height: 130px;
    border-radius: 100px;
}

.form-item.input-item {
    justify-content: space-between;
    background-color: #F5F5F5;
    padding: 0 53px;
}

.form-item.links-item {
    justify-content: space-between;
    font-size: 40px;
}

.form-item input {
    height: 100%;
    border: none;
    padding-left: 100px;
    background: no-repeat left center;
    flex: 1;
    font-size: 40px;
}

.form-item input:focus {
    outline: none;
}

.form-item .username {
    background-image: url(../images/login/icon-username.png);
}

.form-item .userpassword {
    background-image: url(../images/login/icon-userpassword.png);
}

[type=password]::-ms-reveal {
    display: none;
}

.form-r-icon {
    width: 60px;
    height: 100%;
    background: no-repeat center;
}

.form-r-icon.down {
    background-image: url(../images/login/icon-down.png);
}

.form-r-icon.eye {
    background-image: url(../images/login/icon-eye.png);
}

.form-r-icon.eye.close {
    background-image: url(../images/login/icon-eye-close.png);
}

.form-btn {
    display: block;
    height: 100%;
    line-height: 130px;
    text-align: center;
    background: linear-gradient(90deg, #64D8B0, #A4EED5);
    border-radius: 100px;
    font-size: 50px;
    color: #fff;
}

.reg {
    color: #6ADAB4;
}

.other-login {
    padding: 0 30px;
    margin-top: 200px;
}

.other-login .title {
    text-align: center;
    color: #999;
    font-size: 40px;
}

.other-login .title:before,
.other-login .title:after {
    content: "";
    flex: 1;
    height: 2px;
    background: linear-gradient(90deg, transparent, #454445);
    margin: 0 1.6em 0 0;
}

.other-login .title:after {
    transform: rotateY(180deg);
    margin: 0 0 0 1.6em
}

.other-login .items {
    margin-top: 60px;
    justify-content: space-evenly;
}

.other-login .item {
    box-sizing: border-box;
    width: 126px;
    height: 126px;
    border: 2px solid #ddd;
    border-radius: 50%;
    background: no-repeat center;
}

.other-login .item.wechat {
    background-image: url(../images/login/icon-wechat.png);
}

.other-login .item.qq {
    background-image: url(../images/login/icon-qq.png);
}

.other-login .item.weibo {
    background-image: url(../images/login/icon-weibo.png);
}