.card {
	border-radius: 1.5rem;
	background-color: #fff;
	width: 35rem;
	box-sizing: border-box;
	padding: 1rem;
	padding-bottom: 2rem;
	margin-top: -10rem;
}

body,
html {
	height: 100%;
	width: 100%;
	padding: 0;
	margin: 0;
}
*{font-size: 1.4rem;}
#app {
	height: 100%;
	width: 100%;
	background: url(../images/bg.jpg) left top no-repeat;
	background-size: 100% auto;
	
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.container{
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
}
.poup {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	background: #fff;
	box-sizing: border-box;
	transition: all .3s ease-in
}
.head{background: #f8f8f8;padding: 1rem 0;position: relative;}
.head .close{width: 2rem;height: 2rem;position: absolute;right: 1rem;top: 1rem}
.searchbox{height: 4rem;margin:auto;display: flex; width: 25rem;align-items: center;}
.search {
	width: 20rem;
	height: 3.5rem;
	outline: none;
	background: #fff;
	border-radius:1.7rem;
	border: 1px solid #eee;
	display: block;
	padding: 0 1rem;line-height: 3.5rem;
	font-size: 1.4rem;
	box-sizing: border-box;
	margin: auto;
}

.searchbtn{width: 3rem;height: 3rem;}
.list {height: calc(100% - 12rem); overflow: auto; margin-top: .5rem;}
.list ul{padding-left: 0;}
.list li{ display: flex;align-items: cneter; line-height: 4rem;border-bottom: 1px solid #eee;padding:0 1rem;}
.list li:active,.list .active{color: deepskyblue;}

.show{transform: translate(0%,0%);}
.hide{transform: translate(0%,100%);}
.footer{height: 5rem;width: 100%;position: absolute;left: 0;bottom: 0;display: flex;justify-content: center;align-items: center;}
.btn{display: block; width: 30rem;height: 4rem;border-radius: 2rem;background:deepskyblue;color: #fff;text-align: center;line-height: 4rem;margin: auto;font-size: 1.6rem;}
.red{color:red}
.row{padding: 1rem;border-bottom: 1px solid #eee; display: flex;align-items: center;}
.row input{padding-left: 1rem; border: none;outline: none;line-height: 4rem;;}
.row .label{display: block;width: 4rem;}
.check{background: url('../images/check.svg') center no-repeat;background-size: 2rem; display: block;width: 4rem;height:4rem;margin-left: auto; }
.searchschool{ display: block; width: 3rem;height: 3rem;margin-left: auto;background: url('../images/search.svg') center no-repeat;background-size: 2rem;}
.zz{background: rgba(0,0,0,.5);width: 100%;height: 100%;position: absolute;z-index: 1000; display: flex;justify-content: center;align-items: center;}
.alert{border-radius: 1rem;
	background-color: #fff;
	height: 18rem;
	width: 35rem;
	box-sizing: border-box;
	padding: 1rem;}
.alert .title{font-size: 1.8rem;text-align: center;padding: 1rem;}
.alert .txt{font-size: 1.4rem;padding: 1rem;padding-bottom: 2rem;}
.cardtitle{font-size: 1.8rem;text-align: center}
.sys{width: 100%;height: 100%;background-color: #fff;position: absolute;left: 0;top: 0;z-index: 2000; }
.sysicon{width: 5rem;height: 5rem;margin:auto;margin-top: 8rem;display: block; }
.systxt{text-align: center;}
.input{width:27rem}