@charset "UTF-8";
html {font-size:10px}
/* @media screen and (max-width:640px) {html {font-size: 85.33px;}}
@media screen and (max-width:590px) {html {font-size: 78.66px;}}
@media screen and (max-width:540px) {html {font-size: 72px;}}
@media screen and (max-width:480px) {html {font-size: 64px;}}
@media screen and (max-width:410px) {html {font-size: 54.66px;}}
@media screen and (max-width:375px) {html {font-size: 50px;}}
@media screen and (max-width:320px) {html {font-size: 42.66px;}} */

body,h1,h2,h3,h4,h5,h6,p,ul,li{
	margin:0;
	padding:0;
	font-weight: normal;
}
body{
	position: relative;
	font-size:1.4rem;
}
ul,li{
	list-style: none;
}
a{
	color:#333;
	text-decoration: none;
}
img{
	width:100%;
	display: block
}
video{
	width:100%;
	display: block
}
video::-internal-media-controls-download-button {
    display:none;
}
video::-webkit-media-controls-enclosure {
    overflow:hidden;
}
video::-webkit-media-controls-panel {
    width: calc(100% + 50px); 
}
.center{
	width:140rem;
	margin:0 auto;
	box-sizing: border-box;
}
.clear{
	clear:both;
}
.header{
	position: fixed;
	width:100%;
	top:0;
	z-index:3;
	background-image: linear-gradient(rgba(19,28,36,1),rgba(19,28,36,0.8),rgba(19,28,36,0.5), rgba(19,28,36,0));

}
.header .logo{
	width:26rem;
	float:left;
	padding-top:1rem;
}
.header .logo h1{
	height:0;
	width:0;
	overflow: hidden;
}
.header .nav{
}
.header .nav a{
	color:#fff;

}
.header .nav .active{
	color: #6bbbb8;
}

.header .nav span{
	padding:0 1rem;
	padding-bottom:0.7rem;
	position: relative;

}
.header .nav span:after{
	content:"";
	width:0;
	height:0.2rem;
	background: #2b908c;
	position: absolute;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	transition: all 0.2s;
}
.header .nav li:hover span:after{
	width:100%;
}

.header .nav .level1>li{
	float:left;
	margin-right:5rem;
	line-height:8rem;
	position: relative;
	font-size:1.6rem;
}
.header .nav .level1>li:last-child{
	margin-right:0
}
.header .nav .level2{
	display: none;
	position: absolute;
	width:100%;
	background: #000;
	height:auto;
	overflow: hidden;
	text-align: center;
	padding:0.5rem 0;
}
.header .nav .level2 li{
	line-height: 3.4rem;
	font-size:1.4rem
}
.header .nav .level2 li:hover {
	background: #2b908c;
}

.header .nav i{
	font-size:1.2rem;
	
}
.footer{
	color:#999;
	padding-top:6rem;
	background: rgba(19,28,36,1);
}
.footer a{
	color:#999
}
.footer .links {
	line-height: 2.4rem;
	padding-bottom: 3rem;
}
.footer .links span{
	float:left;
	margin-right:1rem;
}
.footer .links ul{
	overflow: hidden;
}
.footer .links li{
	font-size:1.4rem;
	float: left;
	margin-right:2rem;
}
.footer .contact{
	float:right;
	width:45rem;
	font-size:1.2rem;
	line-height: 2rem;
	padding-left: 10rem;
	box-sizing: border-box;
}
.footer .contact .code{
	width:25%;
	margin:1rem 0;
}
.footer .guide{
	padding-bottom: 2rem;
}
.footer .guide .list{
	overflow: hidden;
	display: flex;
	padding-bottom:3rem;
	justify-content:space-between;
}
.footer .guide ul{
	float:left;
	padding-bottom: 2rem;
	line-height: 3.4rem;
	text-align: center;
}
.footer .guide h3 a{
}
.footer .copyright{
	text-align: center;
	line-height: 4rem;
	border-top:0.1rem solid rgba(255,255,255,0.15);
}
.btn{
	border:0.1rem solid rgba(255,255,255,0.3);
	padding:1rem 2rem;
	color:#fff;
	font-size:1.4rem;
	margin-top:2rem;
	display: inline-block;
}
.btn i{
	font-size:1.4rem;
	margin-left:0.3rem;
}
.foot_banner {
	position: relative;
	padding-top:2rem;
	/* background: #2b908c; */
	overflow: hidden;
	height: 18.2rem;
	background: url(../images/footer_bg.png);
	background-size: cover;
	background-position: center;
	color:#fff;
	font-size:2.6rem;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	text-align: center;
}
.foot_banner:after{
	content:'';
	position:absolute;
	bottom: 0rem;
	left: 50%;
	z-index: 10;
	margin-left: -6.4rem;
	width: 10rem;
	height: 10rem;
	background: url(../images/fly2.png);
	background-size:100%;
	z-index:0;
	animation: bubble-animate-1 linear 15s infinite;
}

@keyframes  bubble-animate-1{
	0% {
	    bottom: 0rem;
		left: 80%;
		transform:rotate(-15deg)
	}
	45%{
		transform:rotate(-15deg);
		left: 24%;
	}
	47%{
		left: 22%;
	}
	50% {
		bottom: 0rem;
    	left: 20%;
		transform:rotate(15deg)
	}
	95%{
		transform:rotate(15deg);
		left: 76%;
	}
	97%{
		left: 78%;
	}
	100% {
		bottom: 0rem;
    	left: 80%;
		transform:rotate(-15deg)
	}
}

.foot_banner .words{
	text-align: center;
	position: absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	margin:auto;
	color:#fff;
	font-size:2.6rem;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	z-index:2;

}

.foot_banner p{
	width:100%;
}
.foot_banner a{
	color:#fff;
	display: inline-block;
	font-size:1.6rem;
	border:0.1rem solid #fff;
	padding:1rem 6rem;
	margin-top:1rem;
}
.superiority{
	background: #fff
}
.superiority_list{
	overflow: hidden;
	display: flex;
	justify-content: space-around;
	padding:2rem 0 5rem 0;
}
.superiority_list li{
	text-align: center;
}
.superiority_list .num{
	margin-bottom: 1.6rem;
	font-size: 3.8rem;
	color: #333333;
	font-weight: bold;
	transform: scale(1,1.2);
	letter-spacing: -0.1rem;
}
.superiority_list .num span{
	transform: scale(1,0.8);
	display: inline-block;
}
.superiority_list li  p{
	font-size: 1.8rem;
	color: #999999;
}



.superiority_list li .icon{
	position: relative;
	width:15rem;
	height:15rem;
	margin:0 auto;
}
.superiority_list li .icon div{
	position: absolute;
}

.superiority_list .li1 .block1{
    z-index: 9;
    top: 80px;
    left: 22px;
    width: 91px;
    height: 75px;
    background: url(../images/animate_01_small_white.png) no-repeat center;
}
.superiority_list .li1 .block2{
    z-index: 1;
    top: 29px;
    left: 71px;
    width: 91px;
    height: 109px;
    background: url(../images/animate_01_big_white.png) no-repeat center;
}


.superiority_list .li1 .block3 {
    z-index: 6;
    top: 32px;
    left: 45px;
    width: 91px;
    height: 109px;
    background: url(../images/animate_01_big_blue.png) no-repeat center;
}
.superiority_list .li1:hover .block3 {
	animation: adv .9s both;
}
@keyframes adv{
	0% {
	    opacity: 0;
	    transform: translateY(-30px);
	}
	75% {
	    opacity: 1;
	}
	100% {
	    transform: translateY(0);
	}
}
.superiority_list .li1:hover .block4{
	animation: adv .5s .9s both;
}
.superiority_list .li1 .block4 {
    z-index: 6;
    top: -2px;
    left: 19px;
    width: 91px;
    height: 75px;
    background: url(../images/animate_01_small_blue.png) no-repeat center;
}
.superiority_list .li2 .block1{
	z-index: 1;
	top: 27px;
	left: 21px;
	width: 52px;
	height: 69px;
	background: url(../images/animate02_white_01.png) no-repeat center;
}
.superiority_list .li2 .block2{
	z-index: 6;
	top: 63px;
	left: 67px;
	width: 102px;
	height: 91px;
	background: url(../images/animate02_white_02.png) no-repeat center;
}
.superiority_list .li2 .block3{
	z-index: 3;
	top: 3px;
	left: 42px;
	width: 127px;
	height: 138px;
	background: url(../images/animate02_big_blue.png) no-repeat center;
}
.superiority_list .li2:hover .block3{
	animation: adv .9s both;
}

.superiority_list .li3 .block1{
	z-index: 9;
    top: 8px;
    left: 20px;
    width: 36px;
    height: 32px;
    background: url(../images/animate03_white_01.png) no-repeat center;
}
.superiority_list .li3:hover .block1{
	animation: adv .9s .5s both;
}

.superiority_list .li3 .block2{
	z-index: 9;
	    top: 16px;
	    left: 56px;
	    width: 32px;
	    height: 38px;
	    background: url(../images/animate03_white_02.png) no-repeat center;
}
.superiority_list .li3:hover .block2{
	animation: adv .5s .2s both;
}

.superiority_list .li3 .block3 {
    z-index: 9;
    top: 40px;
    left: 12px;
    width: 39px;
    height: 46px;
    background: url(../images/animate03_white_03.png) no-repeat center;
}
.superiority_list .li3:hover .block3 {
    animation: adv .5s both;
}

.superiority_list .li3 .block4 {
    z-index: 1;
    top: 23px;
    left: 20px;
    width: 154px;
    height: 125px;
    background: url(../images/animate03_big_blue.png) no-repeat center;
}
.superiority_list .li4 .block1 {
    z-index: 9;
    top: 76px;
    left: 48px;
    width: 77px;
    height: 63px;
    background: url(../images/animate04_white_01.png) no-repeat center;
}
.superiority_list .li4 .block2 {
	z-index: 1;
    top: 22px;
    left: 77px;
    width: 102px;
    height: 101px;
    background: url(../images/animate04_white_02.png) no-repeat center;
}
.superiority_list .li4 .block3 {
	z-index: 2;
    top: 14px;
    left: 52px;
    width: 91px;
    height: 118px;
    background: url(../images/animate04_big_blue.png) no-repeat center;
}
.superiority_list .li4:hover .block3{
	animation: adv .7s both;
}
.superiority_list .li4 .block4 {
	z-index: 2;
    top: 62px;
    left: 28px;
    width: 78px;
    height: 76px;
    background: url(../images/animate04_small_blue.png) no-repeat center;
}
.superiority_list .li4:hover .block4{
	animation: adv .7s .5s both;
}

.superiority_list .li4 .block5 {
	z-index: 10;
    top: 48px;
    left: 32px;
    width: 9px;
    height: 15px;
    background: url(../images/animate04_arrow_blue_01.png) no-repeat center;
}
.superiority_list .li4:hover .block5{
	animation: adv .5s 1.2s both;
}
.superiority_list .li4 .block6 {
	z-index: 10;
    top: 76px;
    left: 12px;
    width: 13px;
    height: 21px;
    background: url(../images/animate04_arrow_blue_02.png) no-repeat center;
}
.superiority_list .li4:hover .block6{
	animation: adv .5s 1.7s both;
}
.superiority_list .li4 .block7 {
	z-index: 10;
	top: 72px;
	left: 99px;
	width: 10px;
	height: 23px;
	background: url(../images/animate04_arrow_blue_03.png) no-repeat center;
}
.superiority_list .li4:hover .block7{
	animation: adv .5s 2s both;
}
.partner{
	background: #fff
}
.partner ul{
	padding:3rem 0 5rem 0;
	overflow: hidden;
}
.partner li{
	width:12.28%;
	border:0.1rem solid #ececec;
	padding:1rem;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	margin:0 1%;
	float:left;
	margin-bottom: 1rem;
}


.m_menu_icon{
	color:#fff;
	display: none;
	position: absolute;
	height:100%;
	top:0;
	bottom:0;
	right:3rem;
}
.m_menu_icon i{
	font-size:3.8rem;
}
.menu{
	position: fixed;
	bottom:0;
	width:100%;
	height:5.5rem;
	background: #fff;
	z-index: 3;
	text-align: center;
	font-size:1.6rem;
	line-height: 5.5rem;
	box-shadow: 0 0 1rem #3c454c;
	display: none
}
.menu ul{
	display: flex;
	justify-content: space-between;
}

.menu li:nth-child(2){
	background: #2b908c;
	width:40%
}
.menu li a{
	color:#fff
}
.menu li:nth-child(1){
	width:60%;
	background: #131c24
}
.menu li:nth-child(1) span{
	margin-right: 1rem;
}
.kefu{
	position:fixed;
	width:160px;
	height:290px;
	top:50%;
	margin-top:-163px;
	right:20px;
	background:#666;
	border-radius: 5px;
	z-index:12;
}
.kefu .content{
	width:100%;
	height:232px;
	margin:0px auto;
	background:#fff;
	text-align: center;
	padding:10px 15px;
	position: relative;
	z-index:10;
	box-sizing: border-box;
	border: 1px solid #ccc;
}
.kefu .fixed_up h6{
	color:#fff;
	font-size:18px;
	font-weight:normal;
	line-height:60px;
	margin-left:10px;
	text-align: center;
    background: url(../images/icon1.png) no-repeat;
    background-size:22px;
    background-position: 10px 19px;
}
.kefu .fixed_down{
	text-align: center;
	background: #2b908c;
	border-radius:0 0 5px 5px;
	height: 70px;
	position: relative;
	z-index: 9;
}
.kefu .fixed_down .tel{
	color:#fff;
	font-size:14px;
	line-height: 20px;
	padding-top:15px;
    padding-bottom:5px;
    font-family: 'arial';
}
.kefu .tel span{
	font-size:20px;
}
.kefu .qq{
	background: url(../images/icon1.png) no-repeat;
    background-size: 14px;
    background-position: 19px 8px;
    line-height: 28px;
}
.kefu .qq a{
	color: #888;
	font-size:14px;
	line-height: 10px;
	padding:5px 0px 15px 0px;
}
.kefu img{
	display:block;
	width:100px;
	margin:0px auto;
	margin-top:10px;
}
.kefu .code span{
	display:block;
	color:#888;
	font-size:8px;
}
.kefu .close{
    color: #fff;
    font-size: 26px;
    position: absolute;
    top: -4px;
    right: 10px;
    cursor: pointer;
}
.kefu .open{
	position: absolute;
    width: 30px;
    padding: 20px 0px;
    border-radius: 5px;
    background: #676b70;
    left: 10px;
    top: 50%;
    z-index: 8;
    color: #fff;
    font-size: 20px;
    font-family: é»‘ä½“;
    text-align: center;
    cursor: pointer;
}
.kefu .QQ{
	background: url(../images/QQ.png) no-repeat;
    background-size: 14px;
    background-position: 19px 8px;
    line-height: 28px;
}
.kefu .QQ a{
	color: #888;
	font-size:14px;
	line-height: 10px;
	padding:5px 0px 15px 0px;
}
@media (max-width:1420px){
	.center{
		width:100%;
		padding-left:3rem;
		padding-right:3rem;

	}
	.foot_banner{
		height:16rem;
	}
}
@media (max-width:1200px){
	.header .nav .level1>li{
		margin-right:3rem;
	}
	.foot_banner{
		height:14rem;

	}
	.foot_banner .words{
		font-size: 2.2rem;
	}
	.foot_banner a{
		    padding: 0.7rem 4rem;
	}
	.footer .contact{
		padding-left: 5rem;
		    width: 32rem;
	}
}
@media (max-width:1100px){
	.header{
		height:6rem;
	}
	.header .center{
		padding:0;
	}
	.header .logo{
		position: absolute;
		padding-top:0;
		height:80%;
		top:10%;
		    z-index: 2;
	}
	.header .logo img{
		width:auto;
		height:100%;
	}
	.header .nav{
		display: none;
		position: absolute;
		top:0;
		border-top: 6rem solid rgba(19,28,36,1);
	    height: 100vh;
	    width: 100%;
	    background: rgba(19,28,36,1);
		overflow: auto;
		box-sizing: border-box;
	}
	.header .nav span:after{
		background:none
	}
	.header .nav .level1>li{
		float:none;
	}
	.header .nav .level2{
		display: block!important;
		position: relative;
		text-align: left;
		background: none
	}
	.header .nav li{
		padding:0 2rem;
	}
	.header .nav span{
		padding:0;
	}
	.m_menu_icon{
		display: flex;
		align-items: center;
	}
}

@media (max-width:1000px){
	.banner .center{
		padding-left:10rem!important;
	}
}
@media (max-width:950px){
	.service_list ul{
		flex-wrap: wrap;
		margin-bottom: 0!important;
	}
	.service_list li{
		width:49%!important;
		margin-bottom: 2rem;
	}
	.service_list li .text{
		    background: rgba(0,0,0,0.4);
	}
	.service_list li .intro {
	    margin-bottom: 0!important;
	    opacity: 1!important;
	}
	.service_list li .box {
	    top: 20%!important;
	}
	.foot_banner{
		height:12rem;
	}
}
@media (max-width:900px){
	.superiority_list{
		    flex-wrap: wrap;
	}
	.superiority_list li{
		width:50%;
		margin-bottom: 3rem;
	}
	.partner li{
		width: 18%;
	}
	.partner li:nth-child(5n+1){
		clear:both
	}

}
@media (max-width:850px){
	.footer .guide .list{
		display: none
	}
	.footer .guide{
		padding-bottom: 0
	}

}
@media (max-width:750px){
	.foot_banner{
		height:9rem;
		background-size: 130% auto;
		background-position: bottom center;
		background-repeat: no-repeat;
		background-color: #2b908c
	}
	.foot_banner .words{
			font-size:1.6rem;
	}
	.foot_banner a{
		    padding: 0.6rem 2.6rem;
			font-size:1.4rem;
	}
	.foot_banner:after{
		width:6rem;
		height:6rem;
	}
	.superiority_list{
		padding-bottom:2rem
	}
	.superiority_list li{
		margin-bottom: 2rem;
	}
	.superiority_list li .icon{
		transform: scale(0.6);
		    margin-bottom: -2rem;
	}
	.superiority_list .num{
		font-size:2.6rem;
		line-height: 2.6rem;
	}
	.superiority_list li p{
		font-size:1.4rem;
	}
	.service_list.center{
		padding-right:1.5rem;
		padding-left:1.5rem;
	}


}
@media (max-width:700px){
	.footer{
		padding-top: 3rem;
	}
	.footer .contact{
		float: none;
		width:100%;
		overflow: hidden;
		margin-bottom: 2rem;
		text-align: center;
		padding-left:0
	}
	.footer .contact .code{
		float:none;

		width:25%;
		margin:0 auto;
		margin-bottom:1rem;
	}
	.footer .contact p{
		line-height: 2rem;
	}
	.footer .copyright{
		font-size:1.2rem;
		white-space: nowrap;
		overflow: hidden;
	}
	.footer .links{
		font-size:1.2rem;
	}
	.footer .links li{
		font-size:1.2rem;
	}
	.btn{
		    padding: 0.6rem 1.2rem;
	}
	.header .nav .level1>li{
		line-height: 4rem;
	}
	.location{
		display: none
	}
	.menu{
		display: block;
	}
	.kefu{
		display: none
	}
	.header{
		height:5rem;
	}
}
@media (max-width:650px){

	.banner .center {
	    padding-left: 5rem!important;
	}
	.partner li {
	    width: 23%;
	}
	.partner li:nth-child(5n+1){
		clear:none
	}
	.partner li:nth-child(4n+1){
		clear:both
	}
	.partner ul{
		padding:0 0 3rem 0
	}

}
