@charset "utf-8";

/* CSS Document */
html,body,div,span,p,dl,dt,dd,ul,li {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-family: 'PingFang SC', 'Microsoft YaHei', 'Droid Sans', 'Droid Sans Fallback', 'Heiti SC', Helvetica, sans-self;
	vertical-align:baseline
}

.main_section {
	background-color: white;
	overflow: hidden;
}

.header {
	display: none;
}

.banner {
    background: url('/images/blur_bg.jpg') no-repeat center top;
    -moz-background-size: auto 100%;
    -webkit-background-size: auto 100%;
    -o-background-size: auto 100%;
    background-size: auto 100%;
    padding: 2rem 0 1.5rem;
    height: 18rem;
    color: white;
    overflow: hidden;
}

.banner .layout {
	position: relative;
    top:50%;
    transform:translateY(-50%);
}

.banner .banner_main {
	text-align: center;
}

.banner .banner_phone img {
	display: none;
}

.banner .logo img {
	width: 6.48rem;
}

.banner .title {
	font-size: 1.8rem;
	font-weight: bold;
	margin-top: 10px;
}

.banner .desc {
	font-size: 0.8rem;
	font-weight: 350;
	margin-top: 0.8rem;
	margin-bottom: 1.6rem;
}

#download-app {
	color: white;
	display: block;
	margin: 0 auto;
	width: 188px;
	height: 2.56rem;
	font-size: 1rem;
	line-height: 2.56rem;
	font-weight: 500;
	border-radius: 10px;
	background-color: #E51923;
	text-decoration: none;
	box-shadow: 0px 4px 8px 0px #E519234D;
}

.main_content .odd_bg {
	background: #f7f7f7;
}

.main_content .odd_item .layout {
	display: block;
	justify-content: center;
	align-items: center;
	margin:1.6rem auto;
}

.main_content .odd_bg .layout {
	display: block;
	padding-top: 1.6rem;
	padding-bottom: 1.6rem;
}

.main_content .img_wrap {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.main_content .img_wrap img {
	width:100%;
	max-height: 280px;
	max-width: 300px;
}

.main_content .odd_bg_content {
	display: block;
	height: auto;
}

.main_content dl {
	text-align: center;
}

.main_content dl dt {
	font-size: 1.286rem;
	font-weight: 600;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.main_content dl dd {
	font-size: 0.8rem;
	line-height: 1.12rem;
	font-weight: 400;
	color:#333;
	margin-left: 0;
}

.main_content .block ul {
	list-style: none;
}

.main_content .block li {
	color:#333;
	font-size: 0.8rem;
	line-height: 1.12rem;
	font-weight: 400;
	margin-left: 0;
}

.footer {
	text-align: center;
	font-size: 0.5rem;
	background-color: #f7f7f7;
	padding-top: 20px;
	padding-bottom: 40px;
}

.footer p {
	color: #bbb;
	padding-top: 0.15rem;
}

@media (min-width:1280px) {
	.header {
		display: flex;
		width: 1180px;
		height: 80px;
		align-items: center;
		margin: auto;
	}

	.header .logo {
		height: 50px;
	}

	.banner {
        padding: 0;
        height: 640px;
        -moz-background-size: auto;
	    -webkit-background-size: auto;
	    -o-background-size: auto;
	    background-size: auto;
    }

    .banner .layout {
        width: 1180px;
        height: 640px;
        position: relative;
        margin: 0 auto;
    }

    .banner .title {
		font-size: 2.24rem;
	}

    .banner .banner_main {
    	float: left;
    	display: inline;
    	margin-left: 55px;
    	position: relative;
    	top: 50%;
    	transform:translateY(-50%);
    }

	.banner .banner_phone {
		display: block;
		position: absolute;
		vertical-align: bottom;	
		right: 40px;
		width: auto;
		height: 500px;
	}

	.banner .banner_phone img {
		display: block;
	}

	.main_content .layout {
		width: 1180px;
		height:640px;
	}

	.main_content .odd_item .layout {
		display: flex;
		margin: 0 auto;
		align-items: center;
		justify-content: space-between;
	}

	.main_content .odd_bg .layout {
		display: block;
		margin: 0 auto;
		padding-top: 0;
		padding-bottom: 0;
	}

	.main_content .odd_item .img_wrap {
		float:left;
		margin-left: 0;
	}

	.main_content .odd_bg .img_wrap {
		align-items: center;
		justify-content: center;
		margin-left: auto;
		margin-right: 40px;
		float: right;
		width: auto;
	}

	.main_content .img_wrap img {
		margin-left: 0;
		max-width: 600px;
		max-height: 100%;
		height: auto;
	}

	.main_content .odd_bg_content {
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
	}

	.main_content .block dl {
		float:left;
		width: 18.5rem;
		text-align: left;
	}

	.main_content dl dt {
		margin-top: 0;
		margin-bottom: 1.2rem;
	}

	.main_content .block ul {
		list-style: disc;
		padding-left: 1.1rem;
	}

	.main_content .block li {
		line-height: 1.4rem;
	}
}

@media (min-width:100px) and (max-width:417px) {
	.main_content .img_wrap img {
		max-width: 80%;
		height: auto;
		max-height: 100%;
	}
}

/* font size adapt */
@media (min-width:321px) and (max-width:360px) { html { font-size:16px; } }
@media (min-width:361px) and (max-width:410px) { html { font-size:18px; } }
@media (min-width:411px) and (max-width:440px) { html { font-size:20px; } }
@media (min-width:441px) and (max-width:520px) { html { font-size:22px; } }
@media (min-width:521px) { html { font-size:25px; } }

@media (min-width:1800px) {
    .banner {
    	-moz-background-size: cover;
	    -webkit-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	}
}
