html, body {
	min-width: 900px;
	width: 100%;
	margin: 0px;
}




.area0 {
	width: 100%;
	height: 72px;
	background-color: #34dda6;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}
.area0 .left {
	display: block;
}
.area0 .left img {
	margin-bottom: 0px;
	margin-right: 8rem;
}

.area0 .right {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-left:2.2rem;
}

.area0 .right .item1 {
	display: flex;
	align-items: center;
	justify-content: center;
}

.area0 .right .item1 .cpLogo {
	width: 35px;
	height: 35px;
}

.area0 .right .item1 .cpName {
	margin-left: 10px;
	font-size: 20px;
	color: #ffffff;
	font-weight: bold;
	letter-spacing: 3px;
}

.area1 {
	width: 100%;
	height: 600px;
	background-color: #0199fe;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}
.area1 .left {
	display: block;
}

.area1 .left img {
	margin-bottom: 0px;
	margin-right: 1.5rem;
}

.area1 .right {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-right:2.5rem;
}

.area1 .right .item1 {
	font-size: 48px;
	color: #ffffff;
	font-weight: bold;
	letter-spacing: 3px;
}

.area1 .right .item2 {
	margin-top: 44px;
	font-size: 22px;
	font-weight: normal;
	line-height: 32px;
	color: #ffffff;
    letter-spacing: 2px;
}

.area1 .right .item3 {
	margin-top: 44px;
}

.area1 .right .qrCode {
	width: 187px;
	height: 187px;
	border-radius: 10px;
	border-color: #000000;
}

.area1 .right .download {
	margin-left: 26px;
	margin-bottom: 65px;
	width: 186px;
	height: 57px;
}

.area2 {
	width: 100%;
	height: 800px;
	background-color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.area2 .left {
	display: flex;
	flex-direction: column;

}

.area2 .left .item1 {
	font-size: 40px;
	color: #282b32;
	font-weight: bold;
	letter-spacing: 3px;
}

.area2 .left .item2 {
	margin-top: 32px;
	font-size: 22px;
	font-weight: lighter;
	line-height: 32px;
	color: #757d8d;
	letter-spacing: 2px;
}

.area2 .middle{
	width: 10%;
}

.area2 .right{
	display: block;
}

.area2 .right img {

	width: 398px;
	height: 551px;
}

.area3 {
	width: 100%;
	height: 800px;
	background-color: #f1f3f6;
	display: flex;
	align-items: center;
	justify-content: center;
}

.area3 .left {
	display: block;
}

.area3 .left img {
	width: 360px;
	height: 551px;
}

.area3 .middle{
	width: 10%;
}

.area3 .right {
	display: flex;
	flex-direction: column;
}

.area3 .right .item1 {
	font-size: 40px;
	color: #282b32;
	font-weight: bold;
	letter-spacing: 3px;
}

.area3 .right .item2 {
	margin-top: 32px;
	font-size: 22px;
	font-weight: lighter;
	line-height: 32px;
	color: #757d8d;
	letter-spacing: 2px;
}

.area4 {
	width: 100%;
	height: 800px;
	background-color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.area4 .left {
	display: flex;
	flex-direction: column;

}


.area4 .left .item1 {
	font-size: 40px;
	color: #282b32;
	font-weight: bold;
	letter-spacing: 3px;
}

.area4 .left .item2 {
	margin-top: 32px;
	font-size: 22px;
	font-weight: lighter;
	line-height: 32px;
	color: #757d8d;
	letter-spacing: 2px;
}

.area4 .middle{
	width: 10%;
}

.area4 .right {
	display: block;
}

.area4 .right img {
	width: 400px;
	height: 551px;
}

.footer  {
   bottom:0;
   width:100%;
   height:3.2rem;
   background:#333333;
   display: flex; 
   flex-direction: column;
   justify-content: center;
   align-items: center;
}

.copyright {
	font-size: 16px;
	color: #fff;
}

.company {
	margin-top: 18px;
	font-size: 16px;
	color: #fff;
}

.icp {
	margin-top: 18px;
	font-size: 16px;
	color: #fff;
 }

