body {
	font-family: "microsoft yahei", sans-serif;
	background: #F6F9FD;
}

ui li {
	list-style: none;
}

#header{
	background: url(../img/home_bg.jpg) no-repeat;
	background-size: cover;
}

#header .logo{
	width: 99px;
	height: 38px;
}

.navbar-default {
	background-color: transparent;
	border: none;
	/* box-shadow: 0px 1px 6px 0px rgba(50, 50, 50, 0.25); */
}

.navbar-default .navbar-toggle {
	margin-top: 19px;
}

#header .navbar .container{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.navbar-nav>li>a {
	height: 88px;
	line-height: 55px;
	font-size: 16px;
	color: #fff;
	margin-right: 20px;
}

a.current:hover {
	color: #0030A0;
}

.navbar-nav>li>a:hover {
	color: #0030A0;
	border-bottom: 3px solid #0030A0;
	/* padding-bottom: 3px; */
}

#home {
	/* margin-top: 50px; */

	color: #FFFFFF;
	height: 861px;
	text-align: center;
	width: 100%;
}

#home h1 {
	font-size: 60px;
	margin-top: 146px;
	margin-bottom: 50px;
}

#home i {
	font-style: normal;
	font-size: 30px;
}

#home .col-md-4 {
	font-size: 50px;
	border-right: 1px solid #6F7BAC;
}

#home .col-md-4:last-child {
	border-right: none;
}

#home p {
	font-size: 20px;
}

#platform{
	width: 100%;
	position: relative;
	top: -65px;
}

#platform .container {
	display: flex;
	gap: 40px;
}

#platform .container .box{
	flex: 1;
	background-color: #fff;
	border-radius: 8px;
	display: flex;
	align-items: center;
	padding: 20px 40px;
	box-sizing: border-box;
	gap: 32px;
}
#platform .container .box .left{
	flex-shrink: 0;
	width: 90px;
	height: 90px;
}
#platform .container .box:nth-child(1) .left{
	background: url('../img/platform_wx.png') no-repeat 0 0 / cover;
}
#platform .container .box:nth-child(2) .left{
	background: url('../img/platform_pay.png') no-repeat 0 0 / cover;
}
#platform .container .box:nth-child(3) .left{
	background: url('../img/platform_mini.png') no-repeat 0 0 / cover;
}
#platform .container .box:nth-child(4) .left{
	background: url('../img/platform_data.png') no-repeat 0 0 / cover;
}
#platform .container .box .right{
	display: flex;
	flex-direction: column;
	gap: 10px;
}
#platform .container .box .right .name{
	color: #333;
	font-weight: bold;
	font-size: 20px;
}
#platform .container .box .right .des{
	color: #aaa;
}

#about {
	width: 100%;
	padding: 35px 0;
	text-align: center;
	position: relative;
}

#about a {
	color: black;
	text-decoration: none;
}

#about p {
	line-height: 35px;
	color: #fff;
	font-size: 20px;
}

#about .subtitle{
	color: #aaa;
}

#about .title p{
	margin-bottom: 50px;
}

#about .intro{
	height: 390px;
	padding: 60px 90px 60px 0;
	background: url('../img/intro_bg.png') no-repeat center / cover;
}

#about .intro p{
	text-align: left;
	text-indent: 2em;
	color: #333;
	margin-bottom: 0;
}

#about .intro p strong{
	color: #0033A0;
}

#about .other{
	margin-top: 60px;
	display: flex;
	justify-content: space-between;
}
#about .other p {
	text-align: left;
}
#about .other div p:first-child {
	font-size: 24px;
}
#about .other div{
	padding: 40px;
	border-radius: 10px;
}
#about .other div:nth-child(1){
	background: linear-gradient(to right, #1474C4, #2B5DBA);
}
#about .other div:nth-child(2){
	background: linear-gradient(to right, #3BD8ED, #08B7E7);
}
#about .other div:nth-child(3){
	background: linear-gradient(to right, #5E79A2, #4A6382);
}

#about .about-img-info {
	height: 861px;
	width: 100%;
	margin-left: -20px;
}

#about .about-info {
	width: 553px;
	height: 512px;
	background-color: #FFFFFF;
	box-shadow: 0 2px 5px 2px rgba(0, 0, 0, 0.1);
	z-index: 2;
	position: absolute;
	top: 250px;
	right: 200px;
	padding: 50px;
	text-align: left;
}

#about .cm12-span {
	text-align: left;
	font-size: 20px;
	font-weight: bold;
	color: #0033A0;
	margin-bottom: 50px;
}

#about .cm12-span span {
	border-bottom: 3px solid #0033A0;
}

#about .about-info p {
	color: #333333;
}

#about .about-info span:last-child {
	font-weight: bold;
	font-size: 20px;
}

#composition {
	width: 100%;
	text-align: center;
	position: relative;
	margin-bottom: 80px;
}

#composition .subtitle{
	color: #aaa;
	margin-bottom: 60px;
}

#composition .inner{
	width: 100%;
	height: 792px;
	background: url('../img/composition_bg.png') no-repeat 0 0 / 1250px 100%;
	color: #fff;
	text-align: left;
	position: relative;
}
#composition .inner .list{
	margin-top: 190px;
}
#composition .inner .right{
	width: 1250px;
	height: 792px;
	background: transparent;
	padding-bottom: 75px;
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	background: url('../img/composition_bg_r.png') no-repeat 0 75px / 1250px 642px;
}
#composition .inner .right .control{
	position: absolute;
	top: 0;
	right: 170px;
	display: flex;
}

#composition .inner .right .control div{
	width: 55px;
	height: 55px;
	cursor: pointer;
	transition: all 0.3s ease;
}
#composition .inner .right .control .pre{
	background: url('../img/arrow_left.png') no-repeat center / 100%;
}
#composition .inner .right .control .next{
	background: url('../img/arrow_right.png') no-repeat center / 100%;
}
#composition .inner .right .control .pre:hover{
	background: url('../img/arrow_left_hover.png') no-repeat center / 100%;
}
#composition .inner .right .control .next:hover{
	background: url('../img/arrow_right_hover.png') no-repeat center / 100%;
}
#composition .inner .right .content{
	margin-top: 135px;
	margin-left: 153px;
}
#composition .inner .right .content .title{
	color: #2D5BB1;
	text-align: right;
	margin-right: 170px;
	font-weight: bold;
	font-size: 24px;
}
#composition .inner .right .content img{
	width: 1063px;
	height: 457px;
}
#composition p {
	margin-bottom: 46px;
}
#composition .active{
	font-size: 28px;
}

#introduction {
	width: 100%;
	text-align: center;
	position: relative;
}

#introduction .subtitle{
	color: #aaa;
	margin-bottom: 60px;
}
#introduction .intro{
	height: 580px;
}
#introduction .intro>div:nth-child(1){
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 580px;
	padding: 36px 0;
	box-sizing: border-box;
}
#introduction .intro>div:nth-child(1) p{
	width: 95%;
	color: #777;
	text-align: left;
	text-indent: 2em;
	line-height: 3;
}
#introduction .intro>div:nth-child(1) p strong{
	color: #2D5BB1;
}
#introduction .intro>div:nth-child(1) img{
	width: 95%;
}
#introduction .intro>div:nth-child(2){
	background-color: #fff;
	padding: 70px 170px 70px 90px;

}
#introduction .intro>div:nth-child(2) img{
	width: 660px;
	height: 420px;
}

#marketing {
	width: 100%;
	text-align: center;
	position: relative;
}

#marketing .subtitle{
	color: #aaa;
	margin-bottom: 60px;
}
#marketing .list{
	margin: 30px 0;
	display: flex;
	gap: 60px;
	justify-content: center;
}
#marketing .list div{
	border-radius: 48px;
	border: 1px solid #AAAAAA;
	color: #AAAAAA;
	padding: 14px 24px;
	min-width: 200px;
	text-align: center;
	cursor: pointer;
}
#marketing .list div.active{
	border-color: #2D5BB1;
	color: #2D5BB1;
}
#marketing .list div:hover{
	background-color: #2D5BB1;
	color: #FFFFFF;
}
#marketing .inner{
	height: 600px;
	background: url('../img/marketing_bg.png') no-repeat 0 0 / 100%;
	text-align: center;
	padding: 50px 0;
	box-sizing: border-box;
}
#marketing .inner img{
	width: 1075px;
	height: 500px;
}

#pay {
	width: 100%;
	text-align: center;
	position: relative;
	margin-bottom: 100px;
}

#pay .subtitle{
	color: #aaa;
	margin-bottom: 60px;
}
#pay .inner .block{
	display: flex;
	gap: 130px;
	text-align: left;
	width: 100%;
	height: 360px;
}
#pay .inner .block p{
	text-indent: 2em;
}
#pay .inner .block p strong{
	color: #0030A0;
}
#pay .inner .block .title{
	font-weight: 500;
	margin-bottom: 30px;
	font-size: 30px;
}
#pay .inner .line{
	width: 1017px;
	height: 141px;
}
#pay .inner .block:nth-of-type(1){
	background: url('../img/pay_bg_01.png') no-repeat 0 0 / 100%;
	padding: 60px 0 60px 60px;
}
#pay .inner .block:nth-of-type(2){
	background: url('../img/pay_bg_02.png') no-repeat 0 0 / 100%;
	padding: 60px 60px 60px 0;
}
#pay .inner .block:nth-of-type(3){
	background: url('../img/pay_bg_01.png') no-repeat 0 0 / 100%;
	padding: 60px 0 60px 60px;
}
#pay .inner .block:nth-of-type(1) img{
	width: 385px;
	height: 237px;
}
#pay .inner .block:nth-of-type(2) img{
	width: 500px;
	height: 300px;
}
#pay .inner .block:nth-of-type(3) img{
	width: 510px;
	height: 215px;
}


#data {
	width: 100%;
	text-align: center;
	position: relative;
}

#data .subtitle{
	color: #aaa;
	margin-bottom: 60px;
}

#data .data_bg{
	width: 100%;
	background: url('../img/data_bg.png') no-repeat 0 0 / cover;
	padding-bottom: 100px;
}
#data .inner {
	width: 100%;
	height: 473px;
	padding: 110px 60px;
	box-sizing: border-box;
	background: url('../img/data_content_bg.png') no-repeat 0 0 / 100% 100%;
	display: flex;
	gap: 50px;
}
#data .inner .title{
	margin-bottom: 20px;
	text-align: left;
	font-weight: 500;
	font-size: 30px;
	color: #333333;
}
#data .inner p {
	text-indent: 2em;
	line-height: 3;
	text-align: left;
	color: #777777;
}
#data .inner p strong{
	color:#0030A0;
}
#data .inner img{
	width: 510px;
	height: 253px;
}
#professional {
	background: url(../img/professionalservices_bg.png) no-repeat;
	background-size: cover;
	height: 861px;
	padding: 80px 0;

	color: white;
}

#professional h2 {
	text-align: center;
	margin-bottom: 80px;
}

#professional h4 {
	font-weight: bold;
	margin-bottom: 20px;
}

#professional p {
	line-height: 30px;
}

#professional .course {
	background-color: #FFFFFF;
	color: #000000;
	position: relative;
	height: 183px;
	width: 370px;
	margin-bottom: 30px;
	border-radius: 5px;
}

#professional .course img {
	position: absolute;
	top: 30px;
	left: 5px;
}

#professional .course .content {
	position: absolute;
	top: 25px;
	left: 85px;
}

#case {
	background: url(../img/eg_bg.png) no-repeat;
	background-size: cover;
	height: 861px;
	padding: 50px 0;
	text-align: center;
}

#case .col-md-12 {
	margin-bottom: 50px;
}

#case .col-md-4 {
	line-height: 35px;
	margin-top: 30px;
	width: 340px;
	height: 466px;
	margin-right: 50px;
}

#case .ebg1 {
	background: url(../img/eg_img1.png);
	background-size: cover;
	padding: 50px 20px;
	color: #FFFFFF;

}

#case .col-md-4 span {
	font-size: 26px;
	color: #FFFFFF;
	line-height: 10px;
	font-weight: 700;
}

#case .col-md-4 p {}

#case .ebg2 {
	background: url(../img/eg_img2.png);
	background-size: cover;
	padding: 50px 20px;
	color: #FFFFFF;

}

#case .ebg3 {
	background: url(../img/eg_img3.png);
	background-size: cover;
	padding: 50px 20px;

	color: #FFFFFF;

}

#brand {
	background-color: #F4F6F7;
	padding: 30px 0;
	height: 861px;
	text-align: center;
}

#brand p {
	color: #cccccc;
	letter-spacing: 3px;
	font-size: 16px;
	margin-bottom: 50px;
}

#brand .brand1 {
	background-color: #FFFFFF;
	margin-bottom: 20px;
	padding: 10px 0;
	/* 	width: 285px; */
}

#brand .brand1 img {
	height: 100px;
}

#footer {
	background: #F4F6F7 url(../img/address.png) no-repeat right;
	color: white;
	text-align: left;
}

.lvjing {
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.2);
	padding: 58px 0 72px;
	box-sizing: border-box;
	background: rgba(44, 95, 189, 0.9);
}

#footer .myico {
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 20px;
	margin-right: 10px;
	text-align: center;
	border-radius: 50%;
	border: 1px solid #FFFFFF;
}

#footer p {
	font-weight: bold;
	line-height: 50px;
	font-size: 16px;
}

#footer .col-md-12 {
	margin-bottom: 10px;
}

footer {
	font-weight: 400;
	text-align: center;
	padding: 20px 0;
	font-size: 16px;
}

footer a {
	color: #000000;
}