body{background:#f4f7f5;}
*{box-sizing:border-box}
.layui-login{background-image:url(../image/background.jpg);width:100vw;height:100vh;background-size:cover;box-sizing:border-box;overflow: hidden;position: relative;}
.layui-login-box{width:800px;height:485px;background: hsla(0,0%,100%,.7);position: absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:4px;box-shadow: 6px 6px 12px 4px #0000001a;overflow: hidden;transition:all .3s}
.layui-login-left{width:calc(100% - 400px);height:100%;background:#009688;padding:40px 20px;transition:all .3s}
.layui-login-back{width:100%;height:100%;color: #fff;background-image: url(../image/loginimage.svg);background-repeat: no-repeat;background-position: bottom;background-size: contain;text-align: center;}
.layui-login-back h1{font-family:'华文琥珀';font-weight:300;letter-spacing:1px;line-height:40px;font-size:30px}
.layui-login-tips{width:100%;line-height:24px;margin-top:15px;letter-spacing:1px;font-size:16px}
.layui-login-right{width:400px;padding:20px;overflow: hidden;transition:all .3s}
.layui-login-info{width: 100%;height:30px;line-height:30px;overflow: hidden;font-size:22px;color:#666;letter-spacing:1px;transition:all .3s}
.layui-login-field{width:100%;height:1px;padding:15px 0;position: relative;}
.layui-login-field:after{position: absolute;content: '';left:0;top:50%;width: calc(100%);height: 1px;opacity: .5;background: #999;-webkit-transform: scaleY(.5);-webkit-transform-origin: 0 0;}
.layui-login-field legend{position: absolute;top:50%;left:50%;transform: translate(-50%,-50%);line-height:30px;padding:0 10px;background:#f3f4f9;z-index: 1;letter-spacing:1px;color:#999}
.layui-login-other{width:100%;height:auto;margin-top:15px;transition:all .3s}
.layui-login-other a{width:25%;display: block;text-align: center;}
.layui-login-other span{display: block;width:100%;height:25px;line-height:25px;}
.layui-login-other span:last-child{height:20px;line-height:20px;margin-top:5px}
.layui-login-other .layui-icon{font-size:25px;transition:all .3s;}
.layui-login-other a:hover .layui-icon{opacity:.8;}
.layui-login .layui-tab-content{padding-bottom:0}
.layui-login .layui-form-item:last-child{margin-bottom:0}
.layui-login .layui-btn{height:40px;line-height:40px;}
.layui-login-captcha{width:100%;height:38px;padding-left:15px;overflow: hidden;box-sizing:border-box;}
.layui-login-captcha img{display: block;width:100%;height:100%;object-fit:cover;cursor:pointer}
.layui-login .layui-tab{margin-bottom:15px;transition:all .3s}
.layui-login-pass{float: right;line-height:25px;color:#999}
.layui-login-code{display: block;width:200px;height:200px;margin:0 auto;margin-top:10px}
.layui-login-code img{width:100%;height:100%}
.layui-login-recode{width:100%;height:20px;line-height:20px;overflow: hidden;text-align: center;margin-top:9px;}
@media all and (max-width:800px){
    .layui-login-box{width:calc(100% - 30px);}
    .layui-login-left{width:calc(100% - 350px);}
    .layui-login-right{width:350px;}
}
@media all and (max-width:760px){
    .layui-login-box{max-width:360px;height:455px}
    .layui-login-left{display: none;}
    .layui-login-right{width:100%;padding:15px;}
    .layui-login-info{height:20px;line-height:20px;font-size:18px;}
    .layui-login .layui-tab{margin-bottom:10px}
    .layui-login-other{margin-top:10px}
}