@charset "utf-8";
#header .menu-con>ul>li.nav1>a>span.en::after{display: block;}



.title{ padding: .6rem .8rem 0; width: 100%; overflow: hidden;  margin: 160px auto 0;}
.title .left-box{ display: block; padding-top: 10px; color: #888;}
.title a{display: inline-block; color: #666; margin-bottom: 10px; font-size: 12px;}
.title a img{width: 40px; display: inline-block; vertical-align: middle; margin-right: .05rem;}
.title a span{display: inline-block; vertical-align: middle;}
.title a:hover{color: #D3B264;}
.title a.on{color: #D3B264;}


.main{
	background: url(../img/login-bg.svg) no-repeat center top; background-size: 100%;
}
.main .title h2{
	font-size: .62rem; 
	font-family: AucmaSharpSans;
	text-transform: uppercase; 
	font-weight: bold; 
	letter-spacing: .05rem; 
	display: inline-block;
	line-height: 1.2em; 
	 
}
.main .title p{
	padding-top: .3rem;
}
.module-1 .content{
		position: relative;
		z-index: 2;
		padding: .6rem .8rem;
		border-radius: .3rem;
		background-color: #fff;
		margin-bottom: .7rem;
		margin-top: .3rem;
		line-height: 1.5em;
		box-shadow: 0 0.05rem .3rem rgba(0,0,0,0.02);
	}



.module-2{
}
.module-2 .mainBox{
	position: relative;
}
	.main .form-box{
		position: relative;
		z-index: 2;
		padding: 0 .8rem .6rem .8rem;
		border-radius: .3rem;
		background-color: #fff;
		margin-bottom: .7rem;
		margin-right: 460px;
		margin-top: .3rem;
		box-shadow: 0 0.05rem .3rem rgba(0,0,0,0.02);
	}
	.main .form-box .form-list{
		overflow: hidden;
		margin-bottom: 20px;
	}
	.main .form-box .form-list a:hover{color: #E31111}
	.main .form-box .form-title{
		padding: 15px 0;
		color: #888;
		font-size: .8em;
	}
	.main .form-box .form-content{
		position: relative;
		width: 100%;
	}
	.main .form-box .form-content input{
		width: 100%;
		border: 1px solid #f1f1f1;
		padding: 15px 25px;
		border-radius: 10px;
		position: relative;
		font-size: 1em;
	}
	.main .form-box .form-content select{
		width: 100%;
		background-color: #fff;
		border: 1px solid #f1f1f1;
		padding: 15px 25px;
		border-radius: 10px;
		font-size: 1em;
	}
	.main .form-box .form-content.form-select::before{
		content: "";
		border: 3px solid #333;
		border-radius: 2px;
		border-left: 0;
		border-bottom: 0;
		width: 6px;
		height: 6px;
		position: absolute;
		right:20px;
		top: 50%;
		transform: translate(0,-55%)  rotate(135deg);
		
	}
	.main .form-box .form-info{
		padding: 10px 0 20px 230px;
		color: #888;
	}

	.main .form-box .form-list.checkbox{
		display: flex;
		padding: 5px 0;
	}
	
	
	.main .form-box .form-list.submit{
	}
	.main .form-box .form-list.submit button{width: 208px; overflow: hidden; height: 72px; position: relative; left: 0; margin-top: 50px; line-height: 72px; border: none; text-align: center; display: block; font-size: 16px; color: #fff; border-radius: 115px; cursor: pointer;}
	.main .form-box .form-list.submit button span{width: 300%; height: 72px; position: absolute; z-index: 0; right: 0; line-height: 72px; background-image: linear-gradient(273deg,  #D3B264 0%, #D3B264 33%); border-radius: 115px; transition: all 0.2s ease-in-out;}
	.main .form-box .form-list.submit button b{position: relative;}
	.main .form-box .form-list.submit button:hover span{ right: -400px;}

	
	.checkbox[type="checkbox"] {
	  position: relative;
	  top: -1px;
	  margin-right: 10px;
	  padding: 0;
	  width: 22px;
	  height: 22px;
	  background: #FFF;
	  border: 1px solid #D1D1D1;
	  overflow: hidden;
	  border-radius: 5px;
	  transition: all .3s;
	  -webkit-appearance: none;
	  appearance: none;
	  cursor: pointer;
	}
	
	.checkbox[type=checkbox]:focus {
		border: 1px solid #1D1D1F
	}
	
	.checkbox[type=checkbox]:checked {
		background: #D3B264;
		border-color: #D3B264;
		border: 0;
		-webkit-appearance: none;
		appearance: none
	}
	
	.checkbox[type=checkbox]:checked:after {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 20px;
		height: 15px;
		background-position: center center;
		background-repeat: no-repeat;
		background-image: url(../img/check-white.svg);
		background-size: 70%;
		transform: translate(-50%, -50%);
		content: ''
	}

	




.content-box{
	position: absolute;
	width: 420px;
	background-color: #fff;
	right: 0;
	top: 0;
	padding: .4rem .3rem .7rem;
	border-radius: .3rem;
}
.content-box h2{
	font-size: 1.3em;
	margin-bottom: .2rem;
}
.content-box .con div{
	display: flex;
	align-items: flex-start;
	padding: .1rem 0;
}
.content-box .con div span{
	width: 30px;
	height: 30px;
	border-radius: 20px;
	border: 2px solid #666;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: .1rem;
	position: relative;
	top: -6px;
}
.content-box .con div b{
	font-weight: normal;
	flex: 1;
	font-size: 0.9em;
}
.content-box .con div a:hover{
	color: #D3B264;
}


@media screen and (max-width: 768px) {

	#banner{ width: 100%; height: 50vw; min-width: 100%; overflow: hidden; position: relative; top: 0px;}
	#banner .banner-bg{background-size: cover; height: 50vw; background-position: right -35vw top;}
	#banner a img{width: 100%; display: block;}
	#banner .swiper-slide{box-shadow: 0 0 50px rgba(0,0,0,0.8); position: relative; height: auto !important;}
	#banner .swiper-button-prev, #banner .swiper-button-next{display: none;}
	#banner .swiper-pagination{bottom: 0px;}
	#banner .swiper-pagination-bullet-active{background-color: #1576D1;}
	#banner .banner-con{text-align: center; position: absolute; width: 100%; left: 0%; top: 56%; transform: translate(0,0%); color: #fff;}
	#banner .banner-con h2{font-size: .8rem; padding-left: 0; letter-spacing: 2px; line-height: 1.2em; text-shadow: 0 0 3px rgba(0,0,0,.4);}
	#banner .banner-con h4{font-size: .7rem; padding-left: 0; font-weight: lighter; letter-spacing: 1px; position: relative; top: -2px; text-shadow: 0 0 3px rgba(0,0,0,.4); display: none;}
	
	
	.module-title{padding: 10px 0 0 0; display: block; margin: .5rem 0 0; position: relative; }
	.module-title h2{color: #000; font-size: .7rem; text-align: center; line-height: 1.2em; margin-bottom: .2rem; display: block; position: relative;}
	.module-title span{height: 2px; position: relative; border-radius: 3px; margin:2px auto 10px; width: 1rem; display: block;}
	.module-title .more{ position: relative; right: 0; top: 46px; text-transform: uppercase; box-sizing: border-box; font-size: 12px; color: #888; width: 110px; padding-left: 18px; line-height: 26px; height: 28px;  border: solid 1px #E4E4E4; border-radius: 20px; transition: all 0.3s ease-in-out; background: #fff no-repeat right 115px center;}
	.module-title .more:hover{
		background: #E40012 url(../img/icon-more.png) no-repeat right 15px center;
		border-color: #E40012;
		color: #fff;
		width: 130px;
	}
	

	.main{
		margin: 50px 0 0;
		background: url(../img/login-bg.svg) no-repeat center top; background-size: 100%;
	}
	.main .title{
		padding: .3rem .3rem !important;
	}
	.main .title h2{
		font-size: .62rem; 
		font-family: AucmaSharpSans;
		text-transform: uppercase; 
		font-weight: bold; 
		letter-spacing: .05rem; 
		display: inline-block;
		line-height: 1.2em; 
	}
	.main .title p{
		font-size: .28rem;
		padding-top: .1rem;
		line-height: 1.4em;
	}

	.module-2{
		position: relative;
	}
	.module-2 .mainBox{
		position: relative;
	}
	.main .form-box{
		position: relative;
		z-index: 2;
		padding: .3rem .3rem;
		border-radius: .3rem;
		background-color: #fff;
		margin-bottom: .7rem;
		margin-right: 0;
		margin-top: 0rem;
		box-shadow: 0 0.05rem .3rem rgba(0,0,0,0.02);
	}
	.main .form-box .form-list{
		overflow: hidden;
		margin-bottom: 20px;
	}
	.main .form-box .form-title{
		padding: 0;
		color: #888;
		line-height: 1.2em;
		font-size: .28rem;
	}
	.main .form-box .form-content{
		position: relative;
		width: 100%;
	}
	.main .form-box .form-content input{
		width: 100%;
		border: 1px solid #f1f1f1;
		padding: 10px 15px;
		border-radius: 10px;
		position: relative;
		font-size: .32rem;
	}
	.main .form-box .form-content select{
		width: 100%;
		background-color: #fff;
		border: 1px solid #f1f1f1;
		padding: 10px 15px;
		border-radius: 10px;
		font-size: .32rem;
	}
	.main .form-box .form-content.form-select::before{
		content: "";
		border: 3px solid #333;
		border-radius: 2px;
		border-left: 0;
		border-bottom: 0;
		width: 6px;
		height: 6px;
		position: absolute;
		right:20px;
		top: 50%;
		transform: translate(0,-55%)  rotate(135deg);
		
	}
	.main .form-box .form-info{
		padding: 10px 0 20px 230px;
		color: #888;
	}

	.main .form-box .form-list.checkbox{
		display: flex;
		padding: 5px 0;
	}
	.main .form-box .form-list.checkbox label{
		flex: 1;
		font-size: .28rem;
		line-height: 1.4em;
	}
	
	.main .form-box .form-list.submit{
	}
	.main .form-box .form-list.submit button{width: 208px; overflow: hidden; height: 42px; position: relative; left: 0; margin:0 auto; margin-top: 50px; line-height: 42px; text-align: center; display: block; font-size: 16px; color: #fff; border-radius: 115px; cursor: pointer;}
	.main .form-box .form-list.submit button span{width: 300%; height: 42px; position: absolute; z-index: 0; right: 0; line-height: 42px; background-image: linear-gradient(273deg,  #D3B264 0%, #D3B264 33%); border-radius: 115px; transition: all 0.2s ease-in-out;}
	.main .form-box .form-list.submit button b{position: relative;}
	.main .form-box .form-list.submit button:hover span{ right: -400px;}

	
	.checkbox[type="checkbox"] {
	  position: relative;
	  top: -1px;
	  margin-right: 10px;
	  padding: 0;
	  width: 22px;
	  height: 22px;
	  background: #FFF;
	  border: 1px solid #D1D1D1;
	  overflow: hidden;
	  border-radius: 5px;
	  transition: all .3s;
	  -webkit-appearance: none;
	  appearance: none;
	  cursor: pointer;
	}
	
	.checkbox[type=checkbox]:focus {
		border: 1px solid #1D1D1F
	}
	
	.checkbox[type=checkbox]:checked {
		background: #D3B264;
		border-color: #D3B264;
		border: 0;
		-webkit-appearance: none;
		appearance: none
	}
	
	.checkbox[type=checkbox]:checked:after {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 20px;
		height: 15px;
		background-position: center center;
		background-repeat: no-repeat;
		background-image: url(../img/check-white.svg);
		background-size: 70%;
		transform: translate(-50%, -50%);
		content: ''
	}
	
	.content-box{
		position: relative;
		width: 100%;
		background-color: #fff;
		right: 0;
		top: 0;
		padding: 0rem .3rem .7rem;
		border-radius: .3rem;
	}
	.content-box h2{
		font-size: .42rem; 
		font-family: AucmaSharpSans;
		text-transform: uppercase; 
		font-weight: bold; 
		letter-spacing: .05rem; 
		display: inline-block;
		line-height: 1.2em; 
		margin-bottom: .2rem;
	}
	.content-box .con div{
		display: flex;
		align-items: flex-start;
		padding: .3rem 0;
	}
	.content-box .con div span{
		width: 30px;
		height: 30px;
		border-radius: 20px;
		border: 2px solid #666;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-right: .1rem;
		position: relative;
		top: -4px;
	}
	.content-box .con div b{
		font-weight: normal;
		flex: 1;
		font-size: .28rem;
		line-height: 1.4em;
	}
	.content-box .con div a:hover{
		color: #D3B264;
	}



}