*{
	padding:0;
	margin:0;
}
ul, li {
    list-style: none;
}
.lf{
	float: left;
}
.rf{
	float: right;
}
.clearFix:before,.clearFix:after {
    content: "";
    display: block;
    clear: both;
}
.clearFix {
    zoom: 1;
}
html,body{
	width: 100%;
	height: 100%;
}
.login{ width:100%; height:100%; position:relative; background:linear-gradient(to right, #44d1ae, #1bb9bc);}
.login .warn{ width:200px; line-height:28px; min-height:28px; padding-left:30px;box-sizing: border-box; transition:all .5s; background:5px 4px no-repeat; background-size:20px;}
.login .warn.success{ background-image:url('../images/index/login_success.png'); color:green;}
.login .model{width: 85%;position: absolute;top: 50%;margin-left: 3%;margin-top: -317px;z-index: 999;border-radius: 10px;padding-bottom: 30px;box-sizing: border-box;overflow: hidden;}
.login .model .bg_img{ float:left; width:52%; background:url('../images/login/login.png') center no-repeat; background-size:contain; position:absolute; top:-10px; left:-10px; bottom:-10px; border-radius:7px;}
.login .model .content{ float:right; width:36%;background: #fff;padding: 20px 35px 70px;box-sizing: border-box;border-radius: 15px;}
.login .model .content .warn.total{ margin-top:20px;}
.login .model .content .scan{ position:absolute; top:0; right:0; z-index:2; cursor:pointer;}
.login .model .content .title{ font-size:30px; line-height:70px;}
.login .model .content .list{ margin:10px 0 40px;}
.login .model .content .list li{ padding:5px 0 5px 45px;box-sizing: border-box; line-height:35px; border-bottom:1px solid #E5E5E5; background:15px 12px no-repeat; background-size:18px; position:relative;}
.login .model .content .list li.user{ background-image:url('../images/login/login_user.png');}
.login .model .content .list li.pwd, .login .model .content .list li.repwd{ background-image:url('../images/login/login_pwd.png');}
.login .model .content .list li.code{ background-image:url('../images/login/login_yzm.png');}
.login .model .content .list li .warn{ position:absolute; top:9px; right:0;}
.login .model .content .list li .eye{ width:30px; height:30px; position:absolute; top:9px; right:10px; background:url('../images/index/login_hide.png') 5px 4px no-repeat; background-size:20px; cursor:pointer; z-index:5;}
.login .model .content .list li .eye.show{ background-image:url('../images/index/login_show.png');}
.login .model .content .list input{ width:75%; font-size:14px; line-height:35px; color:#555; border:0; vertical-align:top;}
.login .model .content .list .code .verifycode_btn{ display:inline-block; vertical-align:middle; cursor:pointer; user-select: none; text-indent:12px;}
.login .model .content .list .code .verifycode{ display:inline-block;position: relative; width:100px; height:35px; vertical-align:middle; background-color:#ddd;}
.login .model .content .list .code .verifycode img{ height:100%; vertical-align:top;position: absolute;left: 0;}
.login .model .content .list .code input{ width:20%; vertical-align:middle;}
.login .model .content .btn_group{ max-width:328px; margin:0 auto;}
.login .model .content .btn_group a{ opacity:.7; transition:all .5s;}
.login .model .content .btn_group .btn{ width:100%; height:45px; line-height:35px; background-color:#44d1ae; border-radius:10px; margin:0 auto 10px; color:#eee; text-align:center; font-size:24px; border:2px solid #44d1ae; cursor:pointer; transition:all .5s;}
.login .model .content .btn_group .btn:hover, .login .model .content .btn_group .btn:active{ background-color:transparent; color:#44d1ae;}
.login .model .content .btn_group .blue{ color:#2866e9;}
.login .model .content .btn_group a:hover{ opacity:1;}
@media screen and (max-width:1260px){
	.login .model .content {
	    width: 45%;
	}
}
@media screen and (max-width:900px){
	.login .model .bg_img{display: none;}
	.login .model .content {
	    float: none;
	    width: 60%;
	    margin:0 auto;
	}
}
@media screen and (max-width:950px){
	.login .model .content .list input{width:68%;}
}
@media screen and (max-width:710px){
	.login .model .content{width:80%;}
	.login .model{left: 50%;margin-left: -44%;}
}
@media screen and (max-width:550px){
	.login .model .content{width:100%;}
}
@media screen and (max-width:420px){
	.login .model{width:90%;margin-left: -45%;margin-top: 0;top:20%;}
	.login .warn{display: none;}
	.login .model .content .title {
	    font-size: 24px;
	    line-height: 50px;
	    text-align: center;
	}
	.login .model .content .list {
	    margin: 10px 0 25px;
	}
	.login .model .content {padding: 20px 15px 25px;}
	.login .model .content .list li{padding: 5px 0 5px 20px;}
	.login .model .content .list .code .verifycode_btn {width: 39%;font-size: 12px;}
}