*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-size: 16rem;
	font-weight: 500;
}
html,body{
	font-size: 100px;
	min-width: 320px;
	max-width: 750px;
	margin: 0 auto;
	position: relative;
}
li{
	list-style: none;
}
a{
	text-decoration: none;
	color: #000;
}
button{
	border: none;
	background: none;
}
button:hover{
	cursor: pointer;
}
input{
	outline: none;
	background: none;
}
.hidden{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp:1;
}





.header{
	width: 100%;
	height: 110rem;
	background-color: #B92521;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 32rem;
	position: relative;
	z-index: 10; /* 给header设置基础z-index */
}
.header .logoimg{
	width:68rem;
	vertical-align:middle;
	margin-right: 20rem;
}
.header>p{
	font-size: 38rem;
	color: #fff;
}
.header .iconbox1{
	width: 56rem;
	height: 56rem;
	background-color: #FFFFFF;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: left;
	position: absolute;
	right: calc(32rem + 56rem + 20rem);
	top: 50%;
	transform: translateY(-50%);
}
.header .iconbox1 img{
	width: 56rem;
	height: 57rem;
}
.header .iconbox{
	width: 56rem;
	height: 56rem;
	background-color: #FFFFFF;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	right: 32rem;
	top: 50%;
	transform: translateY(-50%);
}
.header .iconbox img{
	width: 28rem;
	height: 28rem;
}
.header .menu{
	position: absolute;
	top: 76rem;
	right: 0;
	width: 210rem;
	background-color: #fff;
	box-shadow: 0px 8px 20px 0px rgba(0,0,0,0.34);
	border-radius: 8rem;
	z-index: 10;
	padding: 10rem 0;
	/* animation: appear 1s; */
	display: none;
}
@keyframes appear {
	0%{
		height: 0;
		/* padding: 0; */
		opacity: 0;
	}
	20%{
		opacity: 0;
	}
	100%{
		height: 196rem;
		opacity: 1;
		/* padding: 0 10rem; */
	}
}
.header .menu::before{
	content: '';
	position: absolute;
	top: -26rem;
	right: 16rem;
	width: 0;
	height: 0;
	border: 14rem solid;
	border-color: rgba(0,0,0,0) rgba(0,0,0,0) #fff rgba(0,0,0,0);
	z-index: 10;
}
.menu li{
	display: flex;
	align-items: center;
	width: 100%;
	height: 88rem;
	justify-content: space-between;
	padding: 0 22rem;
	border-bottom: #E6E6E6 1px solid;
	position: relative;
	z-index: 10;
}
.menu li:last-child{
	border-bottom: none;
}
.menu li:active{
	background-color: #F7F7F7;
}
.menu li p{
	font-size: 28rem;
	color: #333333;
}
.menu li img{
	width: 28rem;
	height: 28rem;
}
.iitem{
	width: 717rem;
	height: 271rem;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 17rem;
	margin-top: 10rem;
}
.iitem:first-child{
	margin-top: 10rem;
}
.iitem>img{
	position: absolute;
	width: 100%;
	height: 100%;
}
.iitem>p{
	position: absolute;
	font-size: 50rem;
	color: #fff;
}
.box{
	position: relative;
	width: 100%;
	min-height: 100vh;
}
.footer{
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 55rem;
	font-size: 26rem;
	color: #8F8F9B;
}
.box>.ft{
	position: absolute;
	width: 100%;
	height: 325rem;
	bottom: 0;
	left: 0;
	z-index: -1;
}
.state>div{
	display: none;
}
.state{
	text-align: center;
	padding-top: 158rem;
}
.state img{
	width: 144rem;
	height: 144rem;
}
.state p{
	font-size: 48rem;
	color: #333333;
	margin-top: 50rem;
}
.state button{
	width: 400rem;
	height: 88rem;
	background-color: #B92521;
	border-radius: 44rem;
	color: #fff;
	font-size: 34rem;
	display: block;
	margin: 155rem auto 0;
}
.state1 .state1box{
	display: block;
}
.state2 .state2box{
	display: block;
}
.search{
	display: flex;
	justify-content: space-between;
	width: 100%;
	height: 100rem;
	background-color: #fff;
	padding: 14rem 32rem;
}
.searchbox{
	width: 560rem;
	height: 72rem;
	background-color: #F4F4F4;
	border-radius: 36rem;
	display: flex;
	align-items: center;
	padding: 0 20rem;
}
.searchbox img{
	width: 28rem;
	height: 28rem;
	margin-right: 20rem;
}
.search input{
	height: 26rem;
	line-height: 26rem;
	border: none;
	font-size: 28rem;
	padding-left: 20rem;
	width: calc(100% - 120rem);
	padding-right: 20rem;
}
.searchbox button{
	font-size: 28rem;
	color: #333333;
	height: 100%;
}
.sxbox{
	display: flex;
	align-items: center;
}
.sxbox img{
	width: 29rem;
	height: 29rem;
	margin-right: 10rem;
}
.sxbox span{
	font-size: 30rem;
	color: #B92521;
}


.stulist{
	border-top: #F4F4F4 10px solid;
	min-width: 100%;
	text-align: center;
}
.stulist th{
	height: 90rem;
	background-color: #B92521;
	color: #fff;
	font-size: 30rem;
	border-bottom: rgba(255,255,255,.6) 1px solid;
	border-left: rgba(255,255,255,.6) 1px solid;
}
.stulist td{
	height: 100rem;
	color: #333333;
	font-size: 30rem;
	border-bottom: #CCCCCC 1px solid;
	border-left: #CCCCCC 1px solid;
}
.stulist td:first-child,
.stulist th:first-child{
	border-left: none;
}


.lh{
	width: 100%;
	height: 460rem;
	background: url('../img/bg3.png');
	background-size: 100% 100%;
	padding: 1px;
	text-align: center;
}
.lh .bt{
	font-size: 46rem;
	color: #ffffff;
	font-weight: bold;
	text-align: center;
	height: 220rem;
	line-height:  120rem;
}
.lh img{
	width: 126rem;
	height: 126rem;
	margin-top: 50rem;
}

.lh p{
	font-size: 42rem;
	color: #fff;
	margin-top: 10rem;
}
.lc{
	width: 100%;
	min-height: 100rem;
	background-color: #fff;
	border-radius: 40rem 40rem 0 0;
	margin-top: -50rem;
	padding: 60rem 56rem;
}
.lc li{
	margin-top: 30rem;
}
.lc li p{
	font-size: 32rem;
	color: #333333;
	font-weight: bold;
}
.lc li input{
	font-size: 26rem;
	border: none;
	margin-top: 20rem;
	width: 100%;
	border-bottom: #D9D9D9 1px solid;
	padding-bottom: 16rem;
}
.login .yzmrow{
	display: flex;
	align-items: center;
}
.login .yzmbox{
	min-width: 182rem;
	height: 70rem;
}
.login .yzmbox img{
	width: 100%;
	height: 100%;
}
.login .yzmrow span{
	display: block;
	color: #109CE4;
	font-size: 24rem;
	min-width: 150rem;
	text-decoration: underline;
}
.lc button{
	width: 100%;
	height: 88rem;
	font-size: 34rem;
	color: #fff;
	text-indent: 34rem;
	letter-spacing: 34rem;
	border-radius: 8rem;
	background-color: #B92521;
	margin-top: 50rem;
}
.lc>a{
	display: inline-block;
	color: #999999;
	font-size: 30rem;
	margin-top: 250rem;
	position: absolute;
	right: 56rem;
}


.psd{
	padding: 80rem 56rem;
}
.psd h1{
	font-size: 48rem;
	color: #333333;
	font-weight: bold;
	margin-bottom: 100rem;
}
.psditem{
	width: 100%;
	height: 98rem;
	background-color: #F6F6F6;
	border-radius: 8rem;
	margin-bottom: 40rem;
	display: flex;
	align-items: center;
	padding: 0 28rem;
}
.psditem img{
	width: 40rem;
	height: 40rem;
	margin-right: 22rem;
}
.psditem input{
	height: 36rem;
	line-height: 36rem;
	border: none;
	border-left: #CCCCCC 1px solid;
	padding-left: 22rem;
	font-size: 32rem;
	width: 100%;
}
.psditem button{
	font-size: 32rem;
	color: #B92521;
	min-width: 160rem;
}
.psd>button{
	width: 100%;
	height: 88rem;
	font-size: 34rem;
	color: #fff;
	text-indent: 34rem;
	letter-spacing: 34rem;
	border-radius: 8rem;
	background-color: #B92521;
	margin-top: 100rem;
}

.role{
	text-align: center;
	padding: 1px;
}
.role p{
	font-size: 50rem;
	color: #333;
	font-weight: bold;
	margin-top: 200rem;
}
.role select{
	width: 500rem;
	height: 100rem;
	font-size: 36rem;
	outline: none;
	padding-left: 20rem;
	border-radius: 8rem;
	margin-top: 100rem;
}
.role select option{
	font-size: 32rem;
}
.role button{
	width: 500rem;
	height: 88rem;
	font-size: 34rem;
	color: #fff;
	text-indent: 34rem;
	letter-spacing: 34rem;
	border-radius: 8rem;
	background-color: #B92521;
	margin-top: 100rem;
}

.pwdh1{
	font-size: 30px;
    color: #8d7c87;
    margin: 20rem 0 20rem 0;
}

.pwd button{
	width: 250rem;
	height: 88rem;
	font-size: 34rem;
	color: #fff;
	text-indent: 34rem;
	letter-spacing: 24rem;
	border-radius: 8rem;
	background-color: #B92521;
	margin-top: 10rem;
}





.boxMask{
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 10;
	display: none;
}
.Mask{
	width: 100%;
	height: 85%;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	border-radius: 24rem 24rem 0 0;
	animation: toTop 1s;
}
@keyframes toTop {
	0%{
		bottom: -85%;
	}
	100{
		bottom: 0;;
	}
}
.mask-title{
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100rem;
	padding: 0 40rem;
}
.mask-title h1{
	font-size: 36rem;
	color: #333333;
}
.mask-title img{
	width: 24rem;
	height: 24rem;
}
.mask-list{
	width: 100%;
	height: calc(100% - 100rem);
	background-color: #F5F5F5;
	overflow: auto;
	padding-bottom: 24rem;
}
.mask-item{
	width: 690rem;
	margin: 24rem auto 0;
	min-height: 100rem;
	background-color: #fff;
	border-radius: 16rem;
}
.mask-num{
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 90rem;
	border-bottom: #DFE1E6 1px solid;
	padding: 0 32rem;
}
.mask-num span{
	font-size: 30rem;
	color: #333333;
}
.mask-num p{
	font-size: 22rem;
	min-width: 134rem;
	height: 38rem;
	line-height: 38rem;
	border-radius: 4rem;
	text-align: center;
}
.mask-num p.type1{
	background-color: #ECF4FF;
	color: #007BFE;
}
.mask-num p.type2{
	background-color: #FCECEC;
	color: #D52828;
}
.mask-num p.type3{
	background-color: #ECFCED;
	color: #22A408;
}
.mask-num p.type4{
	background-color: #F0F0F0;
	color: #797979;
}
.mask-item ul{
	padding: 20rem 0;
}
.mask-item li{
	display: flex;
	align-items: center;
	padding-left: 32rem;
	line-height: 2;
}
.mask-item li span{
	font-size: 28rem;
	color: #888888;
	display: block;
	width: 180rem;
}
.mask-item li p{
	font-size: 28rem;
	color: #333333;
}
.sfzbox {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 15rem;
}
.sfzbox>h1{
	width: 100%;
	font-size: 32rem;
	padding: 50rem 0 0 50rem;
}
.zjitem{
	width: 323rem;
	height: 305rem;
	background-color: #EAF3FF;
	border-radius: 16rem;
	overflow: hidden;
	position: relative;
}
.zjitem img{
	width: 238rem;
	height: 166rem;
	display: block;
	margin: 40rem auto;
}
.zjitem button{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 60rem;
	background-color: #224F90;
	color: #fff;
	line-height: 58rpx;
	text-align: center;
	font-size: 24rem;
}
.submit {
	width: calc(100% - 64rem);
	height: 60rem;
	margin-left: 32rem;
	margin-top: 180rem;
	height: 96rem;
	line-height: 96rem;
	font-size: 32rem;
	background-color: #224F8F;
	color: #fff;
	border-radius: 12rem;
}
.time-container {
	margin: 20rem 15rem;
	display: flex;
	flex-direction: column;
	gap: 15rem;
}
.time-item {
	width: 80%;
	margin: 0 auto;
	min-height: 160rem;
	background: #ffffff;
	border-radius: 12rem;
	padding: 20rem;
	box-shadow: 0 4rem 16rem rgba(0, 0, 0, 0.1);
	border: 2rem solid #e2e8f0;
	transition: all 0.3s ease;
	display: block;
}
.time-item:hover {
	transform: translateY(-2rem);
	box-shadow: 0 8rem 24rem rgba(102, 126, 234, 0.15);
	border-color: #667eea;
}
.time-title {
	font-size: 30rem;
	font-weight: 600;
	color: #2d3748;
	margin-bottom: 8rem;
	text-align: center;
}
.time-details {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 16rem;
	color: #718096;
}
.time-range {
	font-size: 35rem;
	font-weight: 500;
}
@media (min-width:512px) {
	html, body{
		max-width: 100%;
	}

	.submit{
		position: fixed;
		bottom: 160rem;
		left: calc(50% - 200rem);
		margin: 0;
		width: 400rem;
	}
	.sfzbox{
		margin: 0 30rem;
		padding: 0;
	}
	.sfzbox>h1{
		width: 100%;
		font-size: 32rem;
		padding: 15rem 0 0 10rem;
	}
	.iitem{
		margin-left: auto;
		margin-right: auto;
	}
	.role{
		max-width: 750px;
		margin: 0 auto;
	}
	.searchbox{
		width: calc(100% - 150rem);
	}
	.footer{
		width: 100%;
		text-align: center;
		position: absolute;
		bottom: 20rem;
		font-size: 26rem;
		color: #8F8F9B;
	}
	.login{
		width: 100%;
		min-height: 105vh;
		background-color: #b93d3d;
	}
	.lc{
		width: 90%;
		margin-left: 5%;
		border-radius: 40rem;
		position: relative;
		top: -70rem;
	}
	.lc>a{
		margin: 0;
		bottom: 180rem;
	}
	.lh{
		width: 100%;
		height: 400rem;
		background: url('../img/bg3.png');
		background-size: 100% 100%;
		padding: 1px;
		text-align: center;
	}
	.lh .bt{
		font-size: 40rem;
		color: #ffffff;
		font-weight: bold;
		text-align: center;
		height: 220rem;
		line-height:  220rem;
		position: relative;
		top: -70rem;
	}
	.time-container {
		margin: 30rem 30rem;
		gap: 20rem;
	}
	.time-item {
		padding: 25rem 30rem;
	}
	.time-title {
		font-size: 40rem;
	}
	.time-details {
		font-size: 18rem;
	}
}