body{
    background-color: #000 !important;
    overflow: hidden;
}
.login-wrap{
	height: 100%;
    background: url('./../../images/loginImg/bg2.png') no-repeat;
    background-size: 100% 100%;
}
/*logoͼ��ʽ*/
.logoImg {
	position: absolute;
	top: 8%;
	left: 4%;
	width: 12%;
	min-width: 120px;
	max-width: 170px;
}
.logoImg img {
	width: 68%;
}
.infoBody{
	padding-top: 24px;
}
.loginMain{
	position: absolute;top: 20%;width: 100%;
}
.infoWarp{
	width: 350px;height:350px;position: absolute;top: 15%;right: 0;
	background-size:contain;
	/*background: rgba(29,64,105,0.5);
	border:2px solid rgb(43,150,180);*/
	
	
}
.infoName{
	width: 98%;
	margin: 0 auto;
	text-align: center;
	/*border-bottom: 1px solid rgb(27,220,255);*/
	line-height: 52px;
	font-size: 22px;
	color:#1BDCFF;
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
}

.infobgimg{
    width: 100%;
    min-height: 350px;
}
.infoBody{
	width: 80%;
	margin: 0 auto;
}
.isrmWarp{
	margin: 20px 0;
}
.rememberText{
	moz-user-select:none;
    -webkit-user-select:none;
    -ms-user-select:none;
    -khtml-user-select:none;
    -o-user-select:none;
    user-select:none;
    margin-left: 0 !important;
    font-weight: normal;color: #347BAE;
}
#kaptchaImage{
    cursor: pointer;
    height: 40px;
    width: 100%;
    position: relative;
    top: -4px;
    vertical-align: bottom;
    margin-left: -5px;
    z-index: 2;
}
.kaptchabg{
    vertical-align: bottom;
    display: inline-block;
    height: 40px;
    width: 33.4%;
    margin-left: 5%;
    position: absolute;
    right: -4px;
    top: 4px;
    /*background: rgba(177,196,211,0.4);*/
}
	.infoItem{
		
	    position: relative;
  		margin: 20px 0;
	}
	.infoItem .iconImg{
        width: 20px;
		position: absolute;
		top: 10px;
		left: 10px;
		 
	}
	.input-val{
		width: 100%;
		height: 40px;
		padding-left:40px !important;
		border: none;
		background: #F5F7F8;
		border-radius: 2px;
	}
	.input-val.captcha{
		width: 60%;
	}
	.infoBody label input[type=checkbox].checkbox:checked+span{
		font-weight: normal;
	}
	.infoBody label input[type=checkbox].checkbox+span:before{
		/*width: 28px;
		height: 28px;
		line-height: 28px;*/
		background: rgb(78,112,160);
		border-color: #18608A;
		border-radius: 3px;
		color: #1cdcff !important;
		margin-top: -4px;
	}
	.loginBtn{
		width: 100%;
		height: 40px;
		border-radius: 3px;
		color: white;
		border: none;
		font-size: 18px;
		background: -webkit-linear-gradient(left,#21a4d7,#26d9eb,#21a4d7); /* Safari 5.1 - 6.0 */
	    background: -o-linear-gradient(right,#21a4d7,#26d9eb,#21a4d7); /* Opera 11.1 - 12.0 */
	    background: -moz-linear-gradient(right,#21a4d7,#26d9eb,#21a4d7); /* Firefox 3.6 - 15 */
	    background: linear-gradient(to right,#21a4d7,#26d9eb,#21a4d7); /* ��׼���﷨������������ */
	}
	.centerBox{
		
		width:80%;margin: 0 auto;position: relative;
	}
	.imgWarp{
			width: 70%;
		}

@media screen and (min-width: 1200px) and (max-width: 1600px) {
	.infoWarp{
	    /*width: 26%;*/
	    top: 5%;
	    min-width: 300px;
	}
	.loginMain{
		position: absolute;top: 30%;
	}
	
	
}
@media screen and (min-width: 900px) and (max-width: 1200px) {
	
	.centerBox{
		width: 96% !important;
	}
	.infoWarp{
	    /*width: 28%;*/
	    top: 0;
	    min-width: 300px;
	}
	.loginMain{
		position: absolute;top: 30%;
	}
	
}
@media screen and (min-width: 768px) and (max-width: 900px) {
	.infoBody{
		padding-top: 0;
	}
	.isrmWarp{
		margin: 0;
	}
	.centerBox{
		width: 96% !important;
	}
	.infoName{
		line-height: 46px;
	}
	.infobgimg{
		min-height: 300px;
	}
	.infoWarp{
	    width: 300px;
	    top: 0;
	    min-width: 300px;
	}
	.loginMain{
		position: absolute;top: 30%;
	}
	
}
@media screen and (min-width: 300px) and (max-width: 768px) {
	.logoImg{
		width: 120px;
	    position: absolute;
	    top: 8%;
	    left: 50%;
	    margin-left: -60px;
	}
	.imgWarp{
		width: 90% !important;
		position: fixed;
    	bottom: 12px;
	}
	.infoWarp{
	    position: fixed;
        margin: 0 auto;
        width: 80%;
        max-width: 400px;
        left:50%;
        transform:translateX(-50%);
        z-index:99;
        top:14%;
	}
		
}


@media screen and (min-width: 300px) and (max-width:340px) {
	.infoName{
		font-size:20px;
	}	
}

.loadingImg {
	bottom: 0;
	left: 50%;
	margin-left: -8px;
	position: absolute;
}
.recordNumber{
    position: absolute;
    bottom: 12px;
    color: white;
    text-align: center;
    width: 100%;
}