@charset "utf-8";
*{
	margin: 0;
	padding: 0;
}
#app{
	font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,\\5FAE\8F6F\96C5\9ED1,Arial,sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    color: #2c3e50;
    width: 100%;
    height: 100vh;
    background: #f7f7f5 url(../img/bg1.png) no-repeat;
    background-size: 100% 50%;
    overflow: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#login_box{
	height: 70%;
    width: 90%;
    text-align: center;
}
#input_box{
	width: 100%;
    padding: 20px;
    border-radius: 18px;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.input_box_item{
    position: relative;
    line-height: normal;
    display: inline-table;
    width: 100%;
    border-collapse: separate;
    position: relative;
    font-size: 14px;
    margin: 10px 0px;
}
.input_icon_box{
	background-color: #f5f7fa;
    color: #909399;
    vertical-align: middle;
    position: relative;
    border: 1px solid #dcdfe6;
    border-radius: 4px 0px 0px 4px;
    padding: 0 20px;
    width: 1px;
    white-space: nowrap;
    display: table-cell;
    border-right: none;
}
.input_icon{
	display: inline-block;
    width: 20px;
    height: 20px;
    margin: 10% 0;
}
#idcard_icon{
	background: url(../img/idcard.png) no-repeat;
     background-size: 100% 100%;
}
#pwd_icon{
	background: url(../img/pwd_icon.png) no-repeat;
	 background-size: 100% 100%;
}
#yzm_icon{
	background: url(../img/yzm_icon.png);
	background-size: 100% 100%;
}
.input_content{
	-webkit-appearance: none;
    background-color: #fff;
    background-image: none;
    border-radius: 4px;
    border: 1px solid #dcdfe6;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #606266;
    display: table-cell;
    font-size: inherit;
    height: 40px;
    line-height: 40px;
    outline: 0;
    padding: 0 15px;
    -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
    transition: border-color .2s cubic-bezier(.645,.045,.355,1);
    width: 100%;
        border-top-left-radius: 0;
    border-bottom-left-radius: 0;
        vertical-align: middle;
}
#yzm_show{
	    background-color: #f5f7fa;
    color: #909399;
    vertical-align: middle;
    display: table-cell;
    position: relative;
    border: 1px solid #dcdfe6;
    border-radius: 0px 4px 4px 0px;
    padding: 0 20px;
    width: 1px;
    white-space: nowrap;
    border-left: none;
}
#yzm{
	border-radius: 0px;
}
#check_box{
	text-align: left;
    padding: 0.5em 6px;
}
#login_btn{
	    color: #f9f9f9;
    letter-spacing: 4px;
    background-color: #b0b747;
    border: 0;
    margin-top: 10px;
    width: 96%;
    height: 38px;
}
::-webkit-scrollbar{
	width: 0;
}
.input_content:hover{
	border-color: rgb(64,158,255);
}

#alert{
	position: absolute;
	margin: auto;
	width: 90%;
	height: 50px;
	background: rgb(254,240,240);
	top: -70px;
	left: 5%;
	text-align: center;
	border-radius: 4px;
	line-height: 50px;
	color:rgb(245,108,108);
	opacity: 0;
	display: inline-table;
	
}
#alert_box{
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.5);
	display: none;
}
#loding{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -25px;
	margin-left: -25px;
	width: 50px;
	height: 50px;
	display: none;
}