html,body{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}
.container{
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	/* background-color: #eef0f5; */
	background-image: linear-gradient(to bottom, #B380D2, #7A5ACD);
	
	/* border: 1px solid red; */
}
.loginBox{
	width: 22rem;
	height: fit-content;
	border-radius: .3rem;
	/* background-color: white; */
	box-shadow: 0 0 .5rem gray;

	background-color: rgba(255, 255, 255, 0.7); /* 使用半透明的背景颜色 */
	backdrop-filter: blur(5px); /* 添加毛玻璃效果，可以根据需要调整模糊程度 */
		
	/* border: 1px solid black; */
}
.loginBox input {
	background-color: transparent; /* 设置输入框背景色为透明 */
	border: none; /* 可选：去除输入框边框 */
}
.topBox{
	height: 4rem;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	/* align-items: center; */
	
	/* border: 1px solid greenyellow; */
}
.topLeftBox{
	display: flex;
	align-items: center;
	font-size: 1rem;
	font-weight: bold;
}
.leftImg{
	width: 2rem;
	height: 2rem;
	margin-left: 1rem;
	margin-right: .5rem;
	border-radius: .3rem;
}
.rightImg{
	height: 3rem;
	width: 3rem;
	margin-top: .1rem;
	margin-right: .1rem;
	border-radius: 0 .5rem 0 0;
	
	/* border: 1px solid red; */
}
.rightImg:hover{
	cursor: pointer;
}
.midBox{
	height: fit-content;
	display: flex;
	flex-direction: column;
	align-items: center;
	/* justify-content: center; */
	/* margin-top: 1rem; */
	/* margin-bottom: 1rem; */
	/* font-size: 1.1rem; */
	
	/* border: 1px solid blue; */
}
.midBox p{
	color: gray;
	margin: .3rem;
	font-size: .9rem;
}
.contentBox{
	width: 19rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	
	/* border: 1px solid red; */
}
.contentBox h1{
	font-size: 1.1rem;
	font-weight: 500;
}
.inputBox{
	display: flex;
	width: 100%;
	align-items: center;
	margin-top: .5rem;
	border-radius: .2rem;
	
	border: 1px solid #e2e2e2;
}
.inputBox:hover{
	border: 1px solid #0055ff;
}
.inputIcon{
	width: 1rem;
	height: 1rem;
	margin: .75rem;
}
.inputDiv{
	height: 2.5rem;
	border: none;
	width: 16rem;
	/* flex-grow: 1; */
	margin-right: .5rem;
	font-size: 1rem;
	
	/* border: 1px solid orange; */
}
.inputDiv:focus{
	outline: none;
}
.loginBtn{
	width: 100%;
	height: 2.5rem;
	margin-top: 1rem;
	margin-bottom: 1rem;
	border: none;
	border-radius: .2rem;
	color: white;
	background-color: #5555ff;
}
.loginBtn:hover{
	cursor: pointer;
}
.xieyi{
	text-decoration: none;
	color: #0055ff;
}
.xieyi:hover{
	cursor: pointer;
}
.findPwd_p{
	align-self: flex-end;
}
.toFindPwd{
	margin-right: .5rem;
	text-decoration: none;
	color: #0055ff;
}
.toFindPwd:hover{
	cursor: pointer;
}
.qrcode{
	width: 50%;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	
	/* border: 1px solid red; */
}
.qrcode img{
	width: 100%;
	height: 100%;
}
.bottomBox{
	height: 2.5rem;
	width: 22rem;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 1rem;
	font-size: 1rem;
	color: gray;
	border-top: 1px solid #e2e2e2;
	
	/* border: 1px solid red; */
}
.bottom_a{
	text-decoration: none;
	color: #0055ff;
}
.bottom_a:hover{
	cursor: pointer;
}
.sendCheck{
	width: 7.8rem;
	height: 2.5rem;
	border-radius: .2rem;
	border: none;
	/* border-left: 1px solid #e2e2e2; */
	color: white;
	background-color: #5555ff;
	font-size: .9rem;
}
.sendCheck:hover{
	cursor: pointer;
}
.inputDiv_img_check{
	height: 2.5rem;
	border: none;
	width: 9rem;
	/* padding-left: .8rem; */
	/* margin: 0 .5rem 0 0; */
	font-size: 1rem;
	
	border-right: 1px solid #e2e2e2;
	
	/* border: 1px solid orange; */
}
.inputDiv_img_check:focus{
	outline: none;
}
.inputDiv_phone_check{
	border: none;
	width: 9rem;
	height: 2.5rem;
	/* padding-right: .5rem; */
	font-size: 1rem;
	
	/* border: 1px solid orange; */
}
.inputDiv_phone_check:focus{
	outline: none;
}
.inputBox_img_check{
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-top: .5rem;
	border-radius: .2rem;
	border: 1px solid #e2e2e2;
}
.inputBox_img_check:hover{
	border: 1px solid #0055ff;
}
.canvasBox{
	border-radius: .2rem;
}
.zhezhao {
	width: 100%;
	height: 100%;
	background-color: #000;
	filter: alpha(opacity=30);
	-moz-opacity: 0.5;
	opacity: 0.3;
	position: absolute;
	left: 0px;
	top: 0px;
	/* display: none; */
	z-index: 1000;
}
.xieyi_Div{
	width: 100%;
	height: 100%;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	/* display: none; */
	
	/* border: 1px solid red; */
}
.xieyi_box{
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	width: 30rem;
	height: 25rem;
	position: fixed;
	/* background-color: white; */
	border-radius: .2rem;
	align-items: center;
	justify-content: space-between;
	z-index: 1500;

	background-color: rgba(255, 255, 255, 0.7); /* 使用半透明的背景颜色 */
	backdrop-filter: blur(5px); /* 添加毛玻璃效果，可以根据需要调整模糊程度 */
}
.xieyi_label{
	font-size: 1.1rem;
	margin-top: 1rem;
	margin-bottom: .5rem;
}
.xieyi_txt{
	overflow-x: hidden;
	width: 27rem;
	height: 17rem;
	resize: none;
	border-radius: .2rem;
	border: 1px solid #ebebeb;
	outline-color: #ebebeb;
}
.know_btn{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 5rem;
	height: 2rem;
	margin-top: .5rem;
	margin-bottom: 1rem;
	border-radius: .2rem;
	color: white;
	background-color: royalblue;
	border: none;
	cursor: pointer;
}