* {
	margin: 0;
	padding: 0;
}

html,
body {
	height: 100%;
}

body { 
	font-family: "microsoft yahei";
}

.swiper{
	width: 100%;
	height: 100%;
}

.swiper-slide{
	display: flex;
	justify-content: center;
	align-items: center;
}

.fadeInFirst,.fadeInSecond,.fadeInThird{
	display: none;
}

.header-section{
	width: 100%;
	height: 100%;
	background-image: url('../images/bg.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
}

.header-content{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.header-title{
	font-size: 40px;
	font-weight: bold;
	color: #fff;
	display: flex;
	align-items: center;
}

.header-subheading{
	font-size: 30px;
	color: #fff;
	margin: 32px;
}

.down-group{
	
	display: flex;
	align-items: center;
}

.down-img{
	width: 158px;
	height: auto;
	display: block;
	cursor: pointer;
}

.about-section{
	width: 100%;
	height: auto;
	
	box-sizing: border-box;
	position: relative;
}

.erback{
	width: 100%;
	height: 100%;
	position: absolute;
}

.about-list{
	width: 70%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: auto;
	font-size: 14px;
	color: #555555;
	position: relative;
	z-index: 1;
	padding: 50px 0;
}

.about-item{
	display: none;
	width: calc(100% / 2 - 20px);
	height: auto;
	padding:32px;
	background-color: #fff;
	box-sizing: border-box;
}

.about-title{
	font-size: 28px;
	color: #262626;
	margin-bottom: 16px;
}

.blue-item{
	background-color: #4984FF;
	color: #fff;
}

.blue-item>.about-title{
	color: #fff;
}

.about-content{
	line-height: 24px;
}

.dating-section{
	width: 100%;
	height: 500px;
	box-sizing: border-box;
	position: relative;
}

.dating{
	width: 100%;
	height:500px;
	display: block;
	position: absolute;
	
}

.dating-content{
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 1;
	color: #fff;
	
	animation-name: btnBox; /*关键帧名称*/
	animation-timing-function: ease-in-out; /*动画的速度曲线*/
	animation-iteration-count: infinite; /*动画播放的次数*/
	animation-duration: 3s; /*动画所花费的时间*/
}

@keyframes btnBox {
/*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
	0% {
		transform: scale(1); /*开始为原始大小*/
	}
	25% {
		transform: scale(1.2); /*放大1.1倍*/
	}
	50% {
		transform: scale(1);
	}
	75% {
		transform: scale(1.2);
	}
}

.dating-title{
	font-size: 68px;
	
}

.dating-subheading{
	font-size: 50px;
	text-align: right;
}

.logo{
	width: 60px;
	height: 60px;
	position: absolute;
	top: 30px;
	left: 30px;
	border-radius: 16px;
}

.footer{
	width: 100%;
	padding: 10px 0;
	height: auto;
	color: #fff;
	background-color: #000000;
	box-sizing: border-box;
	position: absolute;
	bottom: 0;
	display: flex;
	justify-content: center;
	font-size: 12px;
}

.footer-info{
	display: flex;
	flex-direction: column;
	
}