.login-body {
    position: relative;
    width: 100%;
    height: 100vh;
    .login-body-bg-box {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0;
        z-index: 0;
        display: flex;
        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    .login-container {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        .login-sign {
            position: relative;
            width: 1200px;
            .title-img {
                position: relative;
                text-align: center;
                img {
                    width: 470px;
                }
                .login-title {
                    position: absolute;
                    text-align: center;
                    width: 100%;
                    top: 75px;
                    font-size: 28px;
                }
            }
        }
        .login-sign .login-tab {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            top: -120px;
            .login-tab-img {
                display: flex;
                align-items: center;
                justify-content: center;
                width: 466px;
                height: 466px;
                animation: tab-img-loop 5s linear infinite;
                img {
                    width: 466px;
                }
            }
            .login-tab-form {
                position: relative;
                margin-left: 24px;
                img {
                    width: 530px;
                }
                .form-box {
                    position: absolute;
                    top: 120px;
                    bottom: 50px;
                    left: 10px;
                    right: 6px;
                    padding: 40px;
                }
            }
        }
        .login-sign .login-tab .login-tab-form .form-box {
            .form-input-box {
                position: relative;
                width: 100%;
                img {
                    width: 100%;
                }
                input {
                    position: absolute;
                    left: 5px;
                    top: 5px;
                    bottom: 10px;
                    right: 5px;
                    font-size: 18px;
                    color: white;
                    padding: 0 24px;
                    border: none;
                    background: transparent;
                }
            }
            .form-input-box + .form-input-box {
                margin-top: 40px;
            }
            .form-btn-box {
                position: relative;
                cursor: pointer;
                width: 100%;
                margin-top: 60px;
                user-select: none;
                img {
                    width: 100%;
                    transition: opacity .3s;
                }
                .btn-text {
                    position: absolute;
                    left: 5px;
                    top: 5px;
                    bottom: 10px;
                    right: 5px;
                    font-size: 30px;
                    color: white;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    background: transparent;
                }
                &:hover img {
                    opacity: .6;
                }
            }
        }
    }
}

@keyframes tab-img-loop {
    from { transform: rotate(0deg);}
    50%  { transform: rotate(180deg);}
    to   { transform: rotate(360deg);}
}

