@charset "utf-8";
/*班级筛选*/
.grade-filter {
	position: absolute;
	top: 0;
	right: 0;
	display: none;
	z-index: 10;
	width: 100%;
	height: 200%;
	overflow:hidden;
}
.filter-mask {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0);
	transition: all .3s;
	-moz-transition: all .3s;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
}
.right0 .filter-mask {
	transition-delay: .5s;
	-moz-transition-delay: .5s;
	-webkit-transition-delay: .5s;
	-o-transition-delay: .5s;
	background-color: rgba(0,0,0,.6);
}
.grade-filter-box {
	z-index: 10;
	position: absolute;
	right: -150%;
	width: 85%;
	height: 100%;
	background-color: #fff;
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
}
.right0 .grade-filter-box {
	right: 0;
}
.grade-filter-btn {
	height: 65px;
	padding-top: 32px;
	box-sizing: border-box;
}
.grade-filter-btn span {
	position: relative;
	display: block;
	padding-right: 10px;
	text-align: right;
}
.grade-filter-btn span a {
	display: inline-block;
	width: 55px;
	font-size: 1.7em;
	text-align: center;
	color: #a5a5a5;
}
.grade-filter-btn a.close {
	position: absolute;
	display: block;
	left: 10px;
	top: -8px;
	height: 22px;
	width: 50px;
	text-indent: -5000px;
	box-sizing: border-box;
	background: url(../images/pic-arrow-left-gray.png) no-repeat left center;
	background-size: auto 70%;
}
.grade-filter-btn span a:last-child {
	color: #f2524f;
}
.grade-filter-check {
	padding: 20px 0;
	background-color: #f3f4f6;
	border-bottom: 1px solid #ececed;
	border-top: 1px solid #e1e1e1;
}
/*grade-filter-no*/
.grade-filter-no {
	padding-left: 10px;
	padding-top: 15px;
	border-top: 1px solid #eeeeef;
	border-bottom: 1px solid #eeeeef;
	background-color: #fff;
}
.grade-filter-no li {
	position: relative;
	margin-bottom:15px;
	padding-left: 23px;
	margin-right: 20px;
	font-size: 1.5em;
}
.grade-filter-no li:before {
	position: absolute;
	width: 25px;
	height: 25px;
	/*border: 1px solid #ededed;
	border-radius: 50%;*/
	left: 0;
	top: 0;
	display: block;
	content: '';
	background: url(../images/pic-check-bg-1.png) no-repeat 0 3px;
	background-size:auto 60%;
}
.grade-filter-no li:last-child {
	margin-right: 0;
}
.grade-filter-no li.on:before {
	color: #1d7ad9;
	background: url(../images/pic-check-bg-2.png) no-repeat 0 3px;
	background-size:auto 60%;
}
/*grade-filter-switch*/
.grade-filter-switch {
	position: relative;
	display: block;
	margin-top: 20px;
	padding: 10px 0 10px 10px;
	border-top: 1px solid #eeeeef;
	border-bottom: 1px solid #eeeeef;
	font-size: 1.5em;
	background-color: #fff;
}
.grade-filter-switch:after {
	position: absolute;
	top: 0;
	right: 20px;
	width: 50px;
	height: 100%;
	display: block;
	background: url(../images/pic-btn-off.png) no-repeat left center;
	background-size:auto 75%;
	content: '';
}
.grade-filter-switch.on:after {
	background: url(../images/pic-btn-on.png) no-repeat left center;
	background-size:auto 75%;
}
/*grade-filter-morelist */
.grade-filter-morelist {
	padding-top: 10px;
}
.grade-filter-morelist li {
	position: relative;
	padding-left: 10px;
	height: 40px;
	line-height: 40px;
	font-size: 1.5em;
	border-bottom: 1px solid #e1e1e1;/*f1f1f1*/
}
.grade-filter-morelist li.on {
	background-color: #f0f0f0;
}
.grade-filter-morelist li span {
	position: absolute;
	top: 0;
	right: 12px;
	padding-right: 13px;
	display: block;
	font-size: .85em;
	color: #9c9c9c;
	background: url(../images/pic-arrow-next-gray.png) no-repeat 100% center;
	background-size:auto 30%;
}
.grade-filter-more {
	position: absolute;
	top: 0;
	right: -100%;
	width: 45%;
	height: 100%;
	border-left: 1px solid #ddd;
	background-color: #fff;
	transition: all .3s;
	-moz-transition: all .3s;
	-o-transition: all .3s;
	-webkit-transition: all .3s;
}
.grade-filter-more.right0 {
	right: 0;
}
.grade-filter-more h2 {
	height: 65px;
	line-height: 65px;
	font-size: 1.7em;
	text-align: center;
	border-bottom: 1px solid #efefef;
}
.grade-filter-more h2 span.close {
	position: absolute;
	display: block;
	left: 10px;
	top: 23px;
	height: 22px;
	width: 50px;
	text-indent: -5000px;
	box-sizing: border-box;
	background: url(../images/pic-arrow-left-gray.png) no-repeat left center;
	background-size: auto 70%;
}
.grade-filter-more li {
	height: 35px;
	line-height: 35px;
	text-align: center;
	font-size: 1.5em;
}
.grade-filter-more li.on {
	background:#f0f0f0 url(../images/pic-yes.png) no-repeat 15px center;
	background-size:auto 30%;
}