*{outline:none}a{color:#000;text-decoration:none}html,body,.main{margin:0;padding:0;width:100%;height:100%}.main{display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0) url("../images/login.jpg") no-repeat center center;background-size:cover}.login-box{display:flex;flex-direction:row;width:1000px;height:600px;border-radius:8px;overflow:hidden}.login-box .left-box{width:calc(50% - 64px);height:calc(100% - 64px);background-color:rgba(78,72,255,.5);color:#fff;padding:32px}.login-box .left-box .login-title{font-weight:400;font-size:32px}.login-box .left-box .login-sub-title{line-height:32px}.login-box .right-box{width:50%;height:100%;background-color:#fff}.login-box .right-box .login-form{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:calc(100% - 100px);padding-top:100px}.login-box .right-box .login-form :nth-child(n){margin-bottom:24px}.login-box .right-box .login-form input[type=text],.login-box .right-box .login-form input[type=password]{width:400px;height:50px;font-size:20px;border:none;border-bottom:1px solid #c8c8c8;transition:border .5s}.login-box .right-box .login-form input[type=text]:focus,.login-box .right-box .login-form input[type=password]:focus{border-bottom:1px solid #4e48ff}.login-box .right-box .login-form .check-box{display:flex;justify-content:space-between;width:400px}.login-box .right-box .login-form .check-box div{display:flex}.login-box .right-box .login-form .check-box div input[type=checkbox]{position:relative;width:16px;height:16px;margin-right:8px;cursor:pointer}.login-box .right-box .login-form .check-box div input[type=checkbox]:after{content:"";position:absolute;width:13px;height:14px;color:#fff;background-color:#fff;border:1px solid #767676;padding-left:3px;padding-bottom:2px;border-radius:2px}.login-box .right-box .login-form .check-box div input[type=checkbox]:checked:after{content:"✔";font-size:12px;background-color:#4e48ff;border:1px solid #4e48ff}.login-box .right-box .login-form .login-button{width:200px;height:50px;color:#fff;font-size:18px;background-color:#4e48ff;border:1px solid #4e48ff;border-radius:4px;cursor:pointer;transform:translateX(100px);transition:opacity .5s}.login-box .right-box .login-form .login-button:hover{opacity:.8}.login-box .right-box .login-form .link{display:flex;flex-direction:column;align-items:flex-end;width:100%;padding-right:100px}.login-box .right-box .login-form .link p{margin:0;margin-bottom:8px}.login-box .right-box .login-form .link p a{color:#4e48ff;transition:opacity .5s}.login-box .right-box .login-form .link p a:hover{opacity:.5}