.joinBanner {
	width: 100%;
	height: 400px;
	background-image: url(../images/joinBanner.png);
	background-size: 100% 100%;
	position: relative;
}
.baiyi-common-nav {

	background: #020421 !important;
}

.B-common-home-topbar-menu {
	background: #020421 !important;

}
.bannerWord {
	position: absolute;
	top: 25%;
	left: 13%;
	color: #fff;
	z-index: 10;
}

.arrowLine{
	position: absolute;
	bottom: 14%;
    right: 30%;
    height: 0%;
    width: 0%;
	background: url(../img/group.png) no-repeat right bottom;
	-webkit-transition: all 6s;
	-moz-transition: all 6s;
	-o-transition: all 6s
}
#joinBanner .addMove{
	height: 73%;
    width: 32%;
}

.bannerWord h1 {
	font-size: 42px;
	font-weight: 600;
	margin-bottom: 0;
}

.bannerWord span {
	width: 84px;
	height: 8px;
	background-color: rgb(82, 135, 220);
	display: inline-block;
	/*margin-bottom: 4px;*/
}

.bannerWord p {
	font-size: 36px;
	margin-bottom: 0;
	line-height: 30px;
	margin-top: 22px;
}

.joinReason {
	width: 60%;
	margin: 0 auto;
	height: 600px;
}

.joinReason img {
	height: 450px;
	width: 340px
}

.reason {
	margin-left: 3%;
	margin-top: 70px;
}

.reason h1 {
	margin-top: 70px;
	font-size: 30px;
	color: #202A4D;
	font-weight: 600;
	margin-bottom: 20px;
}

.reason p {
	font-size: 14px;
	color: #666666;
	/*letter-spacing: 1px;*/
}
.reason p span{
	display: block;
	margin-bottom: 10px;
}

.wayBox h2 {
	font-size: 30px;
	color: #202A4D;
	text-align: center;
	font-weight: 600;
	margin-bottom: 30px;
}

.chooseWay {
	width: 60%;
	margin: 0 auto;
	color: #666666;
}

.chooseWay img {
	width: 50px;
	height: 50px;
}

.chooseWay p {
	margin-bottom: 10px;
	font-weight: 600;
	font-size: 16px;
}

.chooseWay li {
	border-bottom: 2px solid #fff;
}

.chooseWay ul .active {
	border-bottom: 2px solid #5989D6;
	color: #5989D6;
}

.chooseWay li:hover {
	border-bottom: 2px solid #5989D6;
	color: #5989D6;
}

.showWays {
	background-color: #F6F8FF;
}

.eachWay,
.condition {
	width: 60%;
	margin: 0 auto;
}

.wayMiddle h3,
.applyLine h3 {
	color: #333333;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	letter-spacing: 1px;
	line-height: 120px;
}

.wayMiddle li {
	width: 32%;
	height: 220px;
	background-color: #fff;
}

.wayMiddle li img {
	height: 80px;
	width: 80px;
}

.wayMiddle li p {
	width: 80%;
	height: 30%;
	font-weight: 600;
	letter-spacing: 0.5px;
	margin: 0 auto;
	color: #333333;
	font-size: 14px;
	line-height: 18px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
	overflow: hidden;
}

.applyLine h3 {
	color: #333333;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	letter-spacing: 1px;
	line-height: 80px;
	padding-bottom: 40px;
}

.applyDetail {
	position: relative;
	height: 127px;
}

.applyDetail ul {
	position: absolute;
	width: 100%;
	top: -40px;
}

.applyDetail hr {
	/*position: absolute;*/
	top: 40px;
	height: 0px;
	border: 1px dashed #B1C3DD;
}

.circle {
	height: 80px;
	width: 80px;
	border-radius: 50%;
	border: 1px solid #5CCCFE;
}

.smallC {
	font-size: 30px;
	color: #fff;
	height: 68px;
	width: 68px;
	border-radius: 50%;
	background: -webkit-gradient(linear, 0 100%, 0 0, from(rgba(92, 204, 254, 1)), to(rgba(105, 83, 183, 1)));
	background: -webkit-linear-gradient(90deg, rgba(92, 204, 254, 1) 0%, rgba(105, 83, 183, 1) 100%);
	background: -moz-linear-gradient(90deg, rgba(92, 204, 254, 1) 0%, rgba(105, 83, 183, 1) 100%);
	background: -o-linear-gradient(90deg, rgba(92, 204, 254, 1) 0%, rgba(105, 83, 183, 1) 100%);
	background: linear-gradient(90deg, rgba(92, 204, 254, 1) 0%, rgba(105, 83, 183, 1) 100%);
	box-shadow: 1px 1px 30px #5CCCFE;
}

.applyDetail li {
	width: 0;
}

.applyDetail li p {
	color: #1A3E62;
	font-size: 12px;
	font-weight: 600;
	margin-top: 8px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	padding: 0 8px;
}

.condition {
	padding-top: 50px;
}

.condition ul li {
	width: 31%;
	background-color: #fff;
	padding: 0 20px 0 20px;
	color: #333333;
	font-weight: 600;
	font-size: 14px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
	line-height: 18px;
}

.joinCon {
	width: 80px;
	height: 80px;
	margin-right: 8px;
	text-align: center;
	font-size: 16px;
	color: #fff;
	letter-spacing: 8px;
	background-color: rgb(144, 184, 255);
}

.applyJoin {
	background-color: #fff;
}

.applyTitle {
	height: 80px;
}

.applyTitle hr {
	height: 0px;
	border: 1px dashed #B1C3DD;
}

.applyTitle p {
	width: 18%;
	font-weight: 600;
	color: rgba(32, 42, 77, 1);
	font-size: 30px;
	text-align: center;
	margin-bottom: 0;
}

.applyStep {
	width: 60%;
	margin: 0 auto;
}

.applyStep li {
	height: 80px;
}

.applyStep li img {
	width: 40px;
	height: 40px;
	margin-right: 6px;
}

.applyStep li p {
	color: #333333;
	margin-bottom: 0;
	font-size: 16px;
	/*font-weight: 600;*/
}

.applyStep li p span,
.applyStep li p a {
	color: #007CC3;
	font-weight: 600;
}

.submitApply {
	background-color: #F6F8FF;
	padding-bottom: 20px;
}

.submitDetail {
	height: 300px;
	width: 60%;
	margin: 0 auto;
	padding-top: 20px;
	margin-bottom: 20px;
}

.submitDetail ul li>div:nth-child(1) {
	text-align: right;
	margin-right: 12px;
	color: #333333;
}

.submitDetail ul li>div:nth-child(2) input {
	height: 30px;
	width: 100%;
}

.submitDetail ul li>div:nth-child(2) select {
	height: 30px;
	width: 100%;
	padding-left: 8px;
	color: #666666;
}

.submitButton,
.buttonMask {
	position: relative;
	width: 100px;
	text-align: center;
	height: 32px;
	font-size: 14px;
	color: #fff;
	line-height: 32px;
	border-radius: 16px;
	margin: 0 auto;
	background: -webkit-linear-gradient(270deg, rgba(156, 80, 178, 1) 0%, rgba(52, 111, 249, 1) 100%);
	background: -moz-linear-gradient(270deg, rgba(156, 80, 178, 1) 0%, rgba(52, 111, 249, 1) 100%);
	background: -o-linear-gradient(270deg, rgba(156, 80, 178, 1) 0%, rgba(52, 111, 249, 1) 100%);
	background: linear-gradient(270deg, rgba(156, 80, 178, 1) 0%, rgba(52, 111, 249, 1) 100%);
}

.submitButton:hover {
	opacity: 0.8;
}

.icon-spinner {
	display: inline-block;
	transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	/* IE 9 */
	-webkit-transform: rotate(90deg);
	/* Safari and Chrome */
	-o-transform: rotate(90deg);
	/* Opera */
	-moz-transform: rotate(90deg);
	-webkit-animation: spin 1s linear 1s 5 alternate;
	animation: spin 1s linear infinite;
}

@-webkit-keyframes spin {
	from {
		-webkit-transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
	}
}

@keyframes spin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

.d_left textarea {
	height: 90%;
	resize: none;
}

.mask {
	width: 20%;
	position: fixed;
	/*display: none;*/
	opacity: 0;
	font-size: 14px;
	top: -20%;
	left: 40%;
	line-height: 30px;
	z-index: 5;
	text-align: left;
	padding-left: 10px;
	background-color: rgba(240, 249, 235);
	border: 1px solid #E9F6E8;
	border-radius: 6px;
	color: rgb(103, 194, 58);
}

.wayMiddle ul,.condition ul{
	flex-wrap: wrap;
	justify-content: space-between;

}
.condition ul{
	align-items: stretch !important;

}

.wayMiddle ul li,.condition ul li{
	margin-bottom: 11px;

}
.condition ul li{
	height: 80px;
}
.wayMiddle ul li{
	text-align: center;
	width: 300px;
	margin-left: 11px;
	padding: 20px;
}

.wayMiddle ul{
	justify-content: center;
	margin-left: -40px;
}
.join-circle{
	height:15px;
	width:15px;
	background: #00a2ff;
	border-radius:50px;
	margin:6px auto;
}
.join-reason span{
	line-height: 24px;
	color: #666666;
	font-size: 15px;
}
.join-reason {
	margin-bottom: 20px;
}
.join-title{
	text-align: center;
	margin-top: 40px;
	/*font-size: 30px !important;*/
	color: #202A4D;
	font-weight: 600;
	margin-bottom: -30px;

}
.join-title h1{

	font-size: 30px !important;

}