* {
    box-sizing: border-box;
}
body, html{
    font-size: 58.26px;
}
body{
    background: url("./bg2.webp");
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover;
    padding: 0;
    margin: 0;
}
.bd{
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    min-height: 100vh;
    overflow: hidden;
}
@media (max-width: 414px) {
    .bd{
        padding-top: 3rem;
    }
}
.login-bd{
    width: 100%;
}
.loggg{
    width: 100%;
    display: flex;
    padding: 0 .2rem;
}
.login-fm{
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-flow: row nowrap;
    transition: left 10s ease-in-out;
}
.login-reg{
    width: 100%;
    margin: 0 auto;
    display: none;
    flex-flow: row nowrap;
    transition: right 10s ease-in-out;
}
.login-card{
    border-radius: .2rem 0 0 .2rem;
    background-color: rgba(159, 163, 164, .24);
    flex: 1;
    padding: 0 .4rem .4rem .4rem;
    transition: left 10s ease-in-out;
}
.login-card-reg{
    border-radius: 0 .2rem .2rem 0;
    background-color: rgba(159, 163, 164, .24);
    flex: 1;
    padding: 0 .4rem .4rem .4rem;
}
.title{
    margin: .5rem;
    font-size: .36rem;
    color: #fee21a;
    font-weight: 600;
    display: flex;
    justify-content: center;
}
.logo{
    position: absolute;
    top: 0;
    width: 100%;
    margin: 1rem 0;
}
.logo img{
    width: 2.3rem;
    margin: 0 auto;
    display: block;
    height: auto;
}
.login-left{
    flex: 0 0 1rem;
    border-radius: 0 .2rem .2rem 0;
    background-color: rgba(32, 32, 32, .5);
    font-size: .32rem;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    color: white;
}
.login-right{
    flex: 0 0 1rem;
    border-radius: .2rem 0 0 .2rem;
    background-color: rgba(32, 32, 32, .5);
    font-size: .32rem;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    color: white;
}
.login-u-bg{
    background: url("./ulo.webp");
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: contain;
    width: .56rem;
    height: .56rem;
}
.login-u-bg2{
    background: url("./ulogin.webp");
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: contain;
    width: .56rem;
    height: .56rem;
}
.login-u-text{
    writing-mode: vertical-rl;
    letter-spacing: .2rem;
    font-weight: 600;
    text-align: center;
    margin-top: .1rem;
}
.login-in-m img{
    width: .5rem;
    height: .5rem;
}
.login-dd{
    width: 100%;
}
.login-in{
    width: 100%;
    display: flex;
    flex-flow: row;
    justify-content: left;
    background-color: hsla(0, 0%, 85.9%, .8);
    padding: .2rem;
    border-radius: .18rem;
}
.login-input{
    width: 100%;
    font-size: .28rem;
    background-color: unset !important;
    background: none;
    outline: 0;
    border: none;
    padding: 0;
    line-height: normal;
    padding-left: .1rem;
}
.login-mt{
    margin-top: .32rem;
}
.login-btn{
    width: 100%;
    display: flex;
    flex-flow: row;
    justify-content: center;
    margin-top: .64rem;
}
.login-bb{
    width: 100%;
    background-color: #fee21a;
    color: #333;
    background-image: none;
    height: .9rem;
    line-height: .9rem;
    border: none;
    border-radius: .18rem;
    font-weight: 700;
    font-size: .32rem;
    opacity: .5;
    text-align: center;
}
.login-ff{
    width: 100%;
    text-align: center;
    margin-top: .32rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.login-fff{
    background: url("./ihome.webp");
    background-repeat: no-repeat;
    background-size: contain;
    width: .5rem;
    height: .4rem;
    filter: brightness(0) saturate(100%) invert(93%) sepia(0) saturate(6675%) hue-rotate(183deg) brightness(111%) contrast(102%);
    margin-right: .2rem;
}
.login-f4{
    font-size: .24rem;
    color: #fff;
    font-weight: 600;
    line-height: .4rem;
}
.tips, .tips2{
    display: none;
    font-size: .25rem;
    color: red;
    margin: .1rem .2rem .2rem .2rem;
}
.login-fc{
    display: flex;
    flex-flow: row nowrap;
    
}