body,html,.container,#app{height: 100%;}
.register-container{background: url(/images/user/reg_bg.png) no-repeat center center;width: 100%;height: 100%;text-align: center;min-width: 1024px;}
.register-container::before{content:"";height: 100%;vertical-align: middle;display: inline-block;}
.back-register{position: fixed;left: 60px;top: 60px;color: #1B1B1B;font-size: 14px;font-weight: bold;padding-left: 28px;}
.back-register>i{width: 18px;height: 16px;background: url(/images/common/va.png) no-repeat center left;display: inline-block;transition: all 0.5s;position: absolute;top: 2px;right: 82%;background-size: cover;}
.back-register:hover>i{width: 41px;}
.register-account-box{width: 100%;margin: 0 auto;max-width: 1264px;position: relative;display: inline-flex;margin-left: -9%;vertical-align: middle;}
.account-form{margin: 62px 0;background: #fff;position: relative;right:-9%;width: 42.8%;box-shadow:-11px 11px 16px 0px rgba(145,134,69,0.2);border-radius:10px;padding-bottom: 20px;flex: none;min-width: 416px;z-index: 1;}
.account-form>h2{font-size: 30px;color: #000;padding: 52px 0 59px;}
.account-form>div{width: 76%;margin: 0 auto;position: relative;}
.account-form>div>p.error{position: absolute;width: 100%;height: 32px;background-color: #FFF8DF;border: 1px solid #FFC500;box-sizing: border-box;border-radius: 4px;top: -42px;text-align: left;line-height: 32px;font-size: 12px;color: #646464;display: none;}
.account-form>div>p.error>i{background: url(/images/user/icon.png) no-repeat;width: 14px;height: 14px;display: inline-block;margin: -3px 8px 0 11px;vertical-align: middle;background-size: cover;}
.account-form ul{overflow: hidden;padding-right: 13px;}
.account-form ul>li{width: 100%;position: relative;}
.account-form ul>li.input-section{margin-bottom: 38px;}        
.account-form ul>li div{border-bottom: 1px solid #EDEDED;position: relative;}
.account-form ul>li div::before{content: '';width: 100%;border-bottom: 1px solid #333;position: absolute;bottom: 0;left: -101%;transition: all 0.5s;}
.account-form ul>li div.selected::before{left: 0;}
.account-form ul li input{width: 100%;line-height: 22px;border:none;padding-bottom: 9px;font-size: 16px;}
.account-form ul>li p.msg{position: absolute;font-size: 14px;left: 0;bottom: -25px;color: #ACACAC;display: none;}
.account-form ul>li p>a{color: #1B1B1B;cursor: pointer;}
.account-form ul>li p.red-msg{color: #FF214F;}
.account-form ul>li .input-code{width: 65%;}
.account-form ul>li em{background: url(/images/user/reg_look.png) no-repeat 0 center;width: 18px;height: 19px;position: absolute;right: 0;top: 5px;cursor: pointer;background-size: contain;}
.account-form ul>li em:hover{background: url(/images/user/reg_look2.png) no-repeat 0 center;background-size: contain;}
.account-form ul>li em.close{background: url(/images/user/reg_look1.png) no-repeat 0 center;background-size: contain;}
.account-form ul>li em.close:hover{background: url(/images/user/reg_look3.png) no-repeat 0 center;background-size: contain;}
.account-form ul>li .btn-code{width: 30%;border: 1px solid #1B1B1B;border-radius: 10px;line-height: 42px;position: absolute;right: 0;bottom: 0;color: #1B1B1B;font-size: 14px;cursor: pointer;}
.account-form ul>li .btn-code.gray{border-color: #C5C6CA;color: #C5C6CA;}
.account-form ul>li .btn-code.light{border-color: #fff;box-shadow:0px 0px 6px 0px rgba(255,203,0,1);}
.account-form ul>li .btn-code:hover{border-color: #fff;box-shadow:0px 0px 6px 0px rgba(255,203,0,1);}
.account-form ul>li.next-btn-li{display: flex;margin-top: 35px;}
.account-form ul>li .next-btn{width: 100%;line-height: 60px;background-color: #1B1B1B;color: #fff;font-size: 16px;border-radius: 8px;cursor: pointer;}
.account-form ul>li .next-btn.gray{background-color: #C5C6CA;}
.account-form ul>li .next-btn:hover{background-color: #313131;}
.account-form ul>li .next-btn.gray:hover{background-color: #C5C6CA;}
.account-form ul>li.infor-txt-li{margin-top: 40px;}
.account-form ul>li.infor-agreement-li{margin-top: 20px;}
.account-form ul>li.infor-txt-li>p{font-size: 14px;color: #ACACAC;}
.account-form ul>li.infor-txt-li>p>a{font-size: 14px;color: #2B2B2B;cursor: pointer;}
.account-form ul>li.infor-txt-li>p label{display: inline-block;border:1px solid #ACACAC;width: 16px;height: 16px;border-radius: 4px;vertical-align: -4px;margin-right: 9px;cursor: pointer;}       
.account-form ul>li.infor-txt-li>p label.icon-check{background: url(/images/common/reg_select1.png) no-repeat;border-color: #333;background-size: cover;} 
.account-bg{background: url(/images/user/reg_img.png) no-repeat center top;width: 57.2%;border-radius:10px;background-size: cover;box-shadow: -11px 11px 16px 0px rgba(145,134,69,0.2);min-width: 416px;overflow: hidden;}
.account-bg>div{background-size: 100%;background-repeat: no-repeat;background-position: 50%;width: 100%;height: 100%;}
.account-bg>img{width: 724px;}
@media screen and (max-width:1920px) {
    .account-form{margin: 46px 0;}
    .account-form>h2{font-size: 26px;}
    .account-form ul li input{font-size: 14px;}
    .account-form ul>li p.msg{font-size: 12px;}
    
}

@media screen and (max-width:1200px) {
    .account-bg>img{position: relative;left: -9%;}
    .back-register{top: 20px;}
}

@media screen and (max-width:1024px) {
    .back-register{top: 20px;}
    .account-bg{width: 50%;}
    .account-form ul>li.infor-txt-li>p{font-size: 12px;}
    .account-form ul>li.infor-txt-li>p>a{font-size: 12px;}
    .account-bg>img{position: relative;left: -30%;}
}