@import "../fonts/iconfont.css";
ul,li{list-style-type: none}
input{outline: none;-webkit-appearance: none}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset !important;}
input::-ms-clear,::-ms-reveal{display:none;}
a{text-decoration: none}
p {margin: 0;}


html,body{margin:0;padding:0;height: 100%;background-position: center center;background-size: auto 100%}
.fl{float: left}
.fr{float: right}
.clear:after{content:'';display: table;clear: both}

/* 复选框 */
.checkbox-skin{padding-left: 25px;position: relative;cursor: pointer;font-size: 12px;}
.checkbox-skin .checkbox-icon{width:16px;height:16px;display: inline-block;border:1px solid #e6e6e6;box-sizing: border-box;border-radius: 2px;overflow: hidden;position: absolute;left: 0;top: 0;}
.checkbox-skin input[type=checkbox]{display: none}
.checkbox-skin input[type=checkbox]:checked + .checkbox-icon{border:none;background-color: #0078ff;}
.checkbox-skin input[type=checkbox]:checked + .checkbox-icon:before{content:'\e631';position: absolute;display:block;width: 16px;line-height:16px;color:#fff;text-align: center;top:0;left: 0;border-radius: 2px;font-size: 14px}
.checkbox-skin input[type=checkbox][disabled] ~ *{color:#e6e6e6;cursor: no-drop}
.checkbox-skin input[type=checkbox][disabled] + .checkbox-icon:before{background-color: #c9c9c9 ;}

/*弹窗样式覆盖*/
.layui-layer-msg{border:0 !important;box-shadow: 0 0 15px #bfd8fa !important;border-radius: 6px !important;}
.layui-layer-msg .layui-layer-padding{padding:20px !important;text-align: center !important;line-height: 30px !important;}
.layui-layer-msg .layui-layer-ico{position: static !important;margin-right: 10px !important;}


/*登录*/
.login:before{content:'';height:460px;display:block;background-image: url(../images/login-bg.jpg);background-position: center center;background-size: auto 100%;}
.logi-header{text-align: center;margin-bottom: 20px}
.login-item{margin-top: -300px}
.login-item ul{background-color:#fff;width: 500px;margin:0 auto;box-shadow: 0 0 30px rgba(88,138,247,.1);border-radius: 4px;padding:40px 30px;box-sizing: border-box}
.login-item li{position: relative;margin-bottom: 25px}
.login-item li.forget {margin-bottom: 11px;}
.login-item li.forget {margin-bottom: 7px;text-align: right;line-height: 1;}
.login-item li:last-child{margin-bottom: 0;}
.login-item li i{position: absolute;right:15px;top: 0;font-size:22px;color:#b1caec;line-height: 52px;}
.login-item input[type=text],.login-item input[type=password],.login-item input[type=number]{width: 100%;height: 52px;border:1px solid #d5e3f5;border-radius: 4px;padding:0 20px;box-sizing: border-box}
.login-item input[type=text]:focus,.login-item input[type=password]:focus,.login-item input[type=number]:focus{border:1px solid #4d82fa}
.login-item input[type=text]:focus + i, .login-item input[type=password]:focus + i{color:#4d82fa}
.login-item li.yzm input{width: 285px;}
.login-item li.yzm img{float: right;width: 130px;height: 52px;border-radius: 4px}
.btn{display:block;line-height: 54px;width: 100%;text-align: center;background-color: #477ef8;color:#fff;border-radius: 4px;font-size: 16px;}
.btn-link{font-size:12px;vertical-align:top;color:#477ef8}
.login-item li.clear .btn-link{position: relative;}
.login-item li.clear .btn-link::after{ content: ""; position: absolute; top: -11px; left: -5px; width: 28px; height: 28px; opacity: 0; border-radius: 50%; border-width: 1px; border-style: solid; box-sizing: border-box; transition: opacity 0.3s ease-in-out; }
.login-item li.clear .btn-link:hover::after{ opacity: 1; }

/* 找回密码 */
.container {position: relative;}
.forget-box {font-size: 12px;}
.forget-box .tab-box {margin-bottom: 20px;}
.forget-box .tab-box span {cursor: pointer;position: relative;display: inline-block;padding-bottom: 10px;margin-right: 20px;}
.forget-box .tab-box span.active {color: #0078ff;}
.forget-box .tab-box span.active::after {content: '';position: absolute;left: 0;bottom: 0; width: 100%;height: 2px;background-color: #0078ff;}
.forget-box .tab-box span:hover {color: #0078ff;}
.forget-box input {margin-bottom: 20px;}
.forget-box .code input[type='number'] {width: 70%;}
.forget-box .code input[type='button'] {width: 29%;cursor: pointer; height: 52px;text-align: center;background-color: #477ef8;color:#fff;border-radius: 4px;border: none;}
.forget-box .code input[type='button']:disabled {background-color: #d7d7d7;}
.forget-box .btn {margin-bottom: 20px;}
.tips {color: #999;margin: 0;line-height: 1;}

/*滑动验证码 - 20191106补充*/
.sliding-img-check-box{visibility: hidden;position:absolute;bottom:40px;left:46%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);text-align:center;background-color: #ffffff;-webkit-box-shadow: 0 5px 20px rgba(14,106,231,0.15);box-shadow: 0 5px 20px rgba(14,106,231,0.15);-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;border: 1px solid #ffffff;z-index: 10;line-height: normal;}
.sliding-img-check-box>div:last-child{margin-bottom: 10px;}
.sliding-img-check-box>.close{position: absolute;right:16px;top: 16px;cursor: pointer;font-size: 14px;z-index: 1;color: rgb(190, 195, 201);}
.sliding-img-display{position:relative;padding: 10px 20px 0;border-radius:16px;overflow:hidden;margin:auto;}
.sliding-img-display>p{text-align: left;line-height: 35px;font-size: 12px;color: #000;}
.sliding-img-cnt{position:relative;width: 320px;height: 160px}
.sliding-img-src,.sliding-img-fragment-hollow{position:absolute;left:0;top:0;z-index:10}
.sliding-img-src{position:static !important;width: 100% !important;;height: 100% !important;;border-radius: 0 !important;}
.sliding-img-fragment-cnt{top:0;left:0;position:absolute;width: 100% ;height: 100%;width: 38px;height: 42px;border-radius: 0;top: 50px; -webkit-filter: drop-shadow(rgb(255, 255, 255) 0px 0px 2px); filter: drop-shadow(rgb(255, 255, 255) 0px 0px 2px); }
.sliding-img-fragment-cnt .sliding-img-fragment-content,.sliding-img-fragment-cnt .sliding-img-fragment{position:absolute;left:0;z-index:20}
.sliding-smooth-cnt{position:relative;width:320px;height: 40px;margin: 0 auto;border-radius:24px;}
.sliding-smooth-bar,.sliding-smooth-circle{position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}
.sliding-smooth-bar{width:100%;height:10px;background-color:#e4e4e4;border-radius:24px}
.sliding-smooth-circle{position:absolute;width: 52px;height:30px;background-color: #306af4;border-radius: 30px;-webkit-box-shadow: 0 0 6px 0 #306af4;box-shadow: 0 0 6px 0 #306af4;cursor:pointer;padding: 10px 14px;-webkit-box-sizing: border-box;box-sizing: border-box;}
.sliding-smooth-circle span{float: left;display: block;width: 2px;height: 10px;background-color: #fff;margin: 0 3px;}
.sliding-smooth-circle span:last-child{margin-right: 0}
.sliding-icon-refresh{display:block;position:relative;cursor:pointer;font-size: 12px;color: #333;margin-top: 5px;}
.sliding-icon-refresh span{position: relative;top:1px }
.sliding-loadding{background-color: #ffffff;position: absolute;top:0;left:0;width: 100%;height: 100%;display: none;z-index: 99;padding:60px 0;-webkit-box-sizing: border-box;box-sizing: border-box;color:#000}
.sliding-loadding img{position: static !important;width: 32px !important;height: 32px !important;border-radius: 0;margin: auto;}

.sliding-btn{height: 42px;background-color: rgba(64,81,128,0.7);border-radius: 20px;position: relative;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.sliding-btn:before{content:'向右拖动滑块';display:block;line-height: 42px;text-align: center;color: #3083f4;font-size: 14px;}
.sliding-btn.success{background-color: #44cb77;color:#fff}
.sliding-btn.success >*{display: none}
.sliding-btn.success:before{content:'验证成功';color:#fff;padding-left: 20px;}
.sliding-btn.success:after{content:'\e61c';color:#fff;display:block;width: 100%;font-family: iconfont;font-size: 20px;position: absolute;top:-1px;line-height: 45px;text-align: center;margin-left: -35px;}
.sliding-btn.error:before{content:'验证失败';color:#f4583f;padding-left: 20px;}
.sliding-btn.error:after{content:'\e6b2';color:#f4583f;display:block;width: 100%;font-family: iconfont;font-size: 20px;position: absolute;top:-1px;line-height: 45px;text-align: center;margin-left: -35px;}
.sliding-btn .sliding-smooth-bar{width:0;height: 36px;position: absolute;left: 3px;bottom:3px;background-color: #4a8ff9;border-radius:25px;z-index: 9}
.sliding-btn .sliding-smooth-circle{width: 50px;height: 36px;border-radius: 20px;-webkit-box-shadow: 0 0 10px rgba(14,106,231,0.15);box-shadow: 0 0 10px rgba(14,106,231,0.15);background-color: #3083f4;z-index: 9;left: 3px;}
.sliding-btn .sliding-smooth-circle i{position: absolute;left: 15px;top: 11px;color:#d4d9dc;font-size: 14px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.sliding-btn .sliding-smooth-circle i:nth-child(2){left: 22px;}
.sliding-btn .sliding-smooth-circle.moving{background-color: #fff}
.sliding-btn .sliding-smooth-circle.moving i{color:#8bb8ff;-webkit-animation: moving 1s infinite;animation: moving 1s infinite}
.sliding-btn .sliding-smooth-circle.moving i:nth-child(2){-webkit-animation-delay: 1s;animation-delay: 1s}

.sliding-btn[data-disabled=true]{opacity: .6}
.sliding-btn[data-disabled=true]:before{content:'暂不可拖动';color:#d6d5d5}
.sliding-btn[data-disabled=true]:after{display: none}
.sliding-btn[data-disabled=true] .sliding-smooth-circle{opacity: .6}

@media screen and (max-width: 540px) {
    .login-item{margin-top: -400px}
    .login-item ul{width: 90%}
    .login-item li.yzm input{width: calc(100% - 130px)}
    .login-item input[type=text], .login-item input[type=password],.login-item li.yzm img{height: 40px}
    .login-item li i{top: -5px;}
    .login-item li.yzm img{width: 110px}
}

