@charset "utf-8";

/* CSS Document */
html,
body {
	height: auto;
	padding: 0;
	margin: 0;
	font-size: 16px;
	font-family: 'Poppins', sans-serif;
	color: #0b0b0b;
	line-height: 1.5;
	text-align: center;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	background-color: #f4f4f4;
}

input,
textarea {
	font-family: 'Poppins', sans-serif;
	color: #0b0b0b;
	outline: none;
}

input:focus,
textarea:focus {	outline: none;}

ul,
li {
	list-style: none;
	padding: 0;
	margin: 0;
}

h1,h2,h3,h4,h5,h6,p,dl,dd,dt {
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
	color: #0b0b0b;
}

a:hover {
	color: #104aa7;;
	text-decoration: none;
}

a img {
	border: 0;
}

input::-webkit-input-placeholder {	color: #838383;}

input::-moz-placeholder {	color: #838383;}

input:-ms-input-placeholder {	color: #838383;}

.font60 { font-size: 60px;}
.font50 { font-size: 50px;}
.font40 { font-size: 40px;}
.font25 { font-size: 25px;}
.font24 {
	font-size: 24px;
}
.font20 {
	font-size: 20px;
}
.font18 {
	font-size: 18px;
}
.font16 {
	font-size: 16px;
}
.font14 {
	font-size: 14px;
}

.font12 {
	font-size: 12px;
}

.con {
	max-width:1350px;
	margin: 0 auto; width: 96%;
}


@media only screen and (max-width:1180px) {
	.font60 {
		font-size: 46px;
	}
}

@media only screen and (max-width:828px) {
	.font60 {
		font-size: 42px;
	}
	.font50 {
		font-size: 30px;
	}
	.font40 {
		font-size: 25px;
	}
	.font25 {
		font-size: 22px;
	}
	.font24 {
		font-size: 20px;
	}
	.font20 {
		font-size: 16px;
	}

	.font18 {
		font-size: 14px;
	}

	.font16 {
		font-size: 12px;
	}

	.font14 {
		font-size: 12px;
	}
	.con {
		margin: 0 1.2em;
		width: auto;
	}
}

@media only screen and (max-width:780px) {
	.font60 {
		font-size: 36px;
	}
	}

/*页面元素入场动画*/
.anim {
-webkit-transform: translateY(50px);
-ms-transform: translateY(50px);
transform: translateY(50px);
-webkit-transition: opacity 1s,-webkit-transform 1s;

transition: opacity 1s,-webkit-transform 1s;
-o-transition: transform 1s,opacity 1s;

transition: transform 1s,opacity 1s;
transition: transform 1s,opacity 1s,-webkit-transform 1s;

filter:alpha(opacity=0);-moz-opacity:0; opacity:0;
}
.anim.on {
-webkit-transform: none;
-ms-transform: none;
transform: none;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
}

.animLeft {
-webkit-transform: translateX(-30px);
-ms-transform: translateX(-30px);
transform: translateX(-30px);
-webkit-transition: opacity 1s,-webkit-transform 1s;

transition: opacity 1s,-webkit-transform 1s;
-o-transition: transform 1s,opacity 1s;

transition: transform 1s,opacity 1s;
transition: transform 1s,opacity 1s,-webkit-transform 1s;

filter:alpha(opacity=0);-moz-opacity:0; opacity:0;
}
.animLeft.on {
-webkit-transform: none;
-ms-transform: none;
transform: none;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
}

.animRight {
-webkit-transform: translateX(50px);
-ms-transform: translateX(50px);
transform: translateX(50px);
-webkit-transition: opacity 1s,-webkit-transform 1s;

transition: opacity 1s,-webkit-transform 1s;
-o-transition: transform 1s,opacity 1s;

transition: transform 1s,opacity 1s;
transition: transform 1s,opacity 1s,-webkit-transform 1s;

filter:alpha(opacity=0);-moz-opacity:0; opacity:0;
}
.animRight.on {
-webkit-transform: none;
-ms-transform: none;
transform: none;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
}

.animBig {
	-ms-transform:scale(1.6,1.6); /* IE 9 */
	-webkit-transform: scale(1.6,1.6); /* Safari */
	transform: scale(1.6,1.6); /* 标准语法 */
	
	-webkit-transition: opacity 1s,-webkit-transform 1s;
	
	transition: opacity 1s,-webkit-transform 1s;
	-o-transition: transform 1s,opacity 1s;
	
	transition: transform 1s,opacity 1s;
	transition: transform 1s,opacity 1s,-webkit-transform 1s;
	
	filter:alpha(opacity=0);-moz-opacity:0; opacity:0;
}
.animBig.on {
-ms-transform:scale(1,1); /* IE 9 */
	-webkit-transform: scale(1,1); /* Safari */
	transform: scale(1,1); /* 标准语法 */
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
}

.animFade {

-webkit-transition: opacity 1s,-webkit-transform 1s;
transition: opacity 1s,-webkit-transform 1s;
-o-transition: transform 1s,opacity 1s;

transition: transform 1s,opacity 1s;
transition: transform 1s,opacity 1s,
-webkit-transform 1s;

filter:alpha(opacity=0);-moz-opacity:0; opacity:0;
}
.animFade.on {
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
}

.moveDown{
	animation: move 6.5s linear infinite; 
	-webkit-animation: move 6.5s linear infinite; 
}

@-webkit-keyframes move {
	0% {
		transform: translateY(0px); 
	}
	50% {
		transform: translateY(25px); 
	}
	100% {
		transform: translateY(0px); 
	} 
}
@-moz-keyframes move {
	0% {
		transform: translateY(0px); 
	}
	50% {
		transform: translateY(25px); 
	}
	100% {
		transform: translateY(0px); 
	} 
}
@-o-keyframes move {
	0% {
		transform: translateY(0px); 
	}
	50% {
		transform: translateY(25px); 
	}
	100% {
		transform: translateY(0px); 
	} 
}
@keyframes move {
	0% {
		transform: translateY(0px); 
	}
	50% {
		transform: translateY(25px); 
	}
	100% {
		transform: translateY(0px); 
	}  
}

/*头部*/
.headerW {
	position: fixed;
	z-index: 500;
	left: 0;
	top: 0;
	width: 100%;
	height: 90px;}
.headerA {background-color: #000;}
.headerB {background-color: rgba(0,0,0,0.55);}
.header {margin: 0 auto; height: 100%;}

.header .con {
	position: relative;
	z-index: 0;
	height: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center; width: 85%; margin: 0 auto; max-width: initial;
}

.header .logo img {
	display: block;
	width: auto;
	height: 40px;
}
.header .btn {color: #000; display: inline-block; vertical-align: middle;
     font-size: 14px;
     background-color: #ececec;
     border-radius: 15px;
     width: 110px;
     height: 35px;
     display: inline-block;
     line-height: 35px;
     text-align: center; margin-right: 25px;}

@media only screen and (max-width:828px) { 
	.headerW {background-color: #000; height: 66px;}
	.headerI {background-color: rgba(0,0,0,0.55);}
	.headerB {background-color: rgba(0,0,0,0.55);}
	.header .con { width: auto; margin: 0 1em;}
	.header .logo img { height: 30px;}
	.header .btn { margin-right: 10px;}
}

/*头部导航*/
.navW { position: fixed; z-index: 9999; right: -427px; top: 0; height: 100vh;  min-height: 700px;
 max-width: 427px; width: 100%;
	font-size: 15px; 
	
	transition: all 1s;
	-webkit-transition:all 1s;}
.navW.show { right: 0;}
.navW .close { position: absolute; z-index: 10; left: 44px; top: 25px; width: 25px; height: 25px;
background: url(../images/close.png) center center no-repeat;
background-size:contain; cursor: pointer;}
.navW .picBg {position: relative; z-index: 0; width: 100%; height: 100%; overflow: hidden;

 background: url(../images/menubg.webp) center center no-repeat;
 background-size:cover;
 -moz-border-bottom-left-radius:48px; 
 -webkit-border-bottom-left-radius:48px; 
 border-bottom-left-radius:48px;
 
 -moz-border-top-left-radius:48px;
 -webkit-border-top-left-radius:48px; 
 border-top-left-radius:48px;
 
}
.nav { position: absolute; left: 0; top: 0; width: 100%; overflow-y: auto;
 height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column;
}
.nav .logos { }
.nav .logos img { display: block; margin: 0 auto; width: 50%; height: auto;}
.nav>ul {width: 40%; margin: 0 auto;}

.nav>ul>li { line-height: 2.6; border-bottom: 1px solid #54595f; font-weight: bold;
 font-weight: bold;
}
.nav>ul>li a { display: block;}




.header .c-switch { display: inline-block; vertical-align: middle;
	width: 40px; overflow: hidden;
	height:40px; background-color: #ececec;
	cursor: pointer;
	/* position: absolute; left: 15px; top: 50%; margin-top: -10px; */
	-moz-border-radius:9px; -webkit-border-radius:9px; border-radius:9px;
}

.header .c-switch i {
	position: relative;
	display: block; width: 18px; margin: 0 auto;
	height: 2px;
	background: #000;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}

.header .c-switch i:nth-child(1) {
 margin-top: 12px;
}
.header .c-switch i:nth-child(2) {
 margin-top: 3px;
}
.header .c-switch i:nth-child(3) {
 margin-top: 3px;
}
.header .c-switch i:nth-child(4) {
 margin-top: 3px;
}

.header .c-switch i:nth-child(2) {
	margin: 3px auto; background-color: #000;
}

.header .c-switch.show i:nth-child(2) {
	opacity: 0;
}

.header .c-switch.show i:nth-child(1) {
	top: 4px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.header .c-switch.show i:nth-child(3) {
	bottom: 4px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/*banner*/
.banner {
	position: relative;
	z-index: 0;
	height: 1010px;
	width: 100%;
	overflow: hidden;
	background: #000; color: #fff;
}
.banner .videoBox { position: absolute; z-index: 0; left: 0; top: 0;
 width: 100%; height: 100%; }
 .banner .videoBox .video {position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; object-fit: cover;}
.banner .videoBox::after { z-index: 1; display: block; content: ""; position: absolute; left: 0; top: 0;
 width: 100%; height: 100%; background-color: rgba(0,0,0,0.4); }
.banner .txtb { position: absolute; z-index: 3;  left: 0; top: 0;
 width: 100%; height: 100%; 
display: flex; justify-content: center; align-items: flex-start;
}
.banner .txtb .txtc { max-width: 656px; margin: 193px auto 0; width: 90%;}
.banner .txtb .txtc .list { margin-top: 1em; padding: 20px 20px 30px;
    background-color: rgba(0,0,0,0.3);
    border: 1px solid #333;
    border-radius: 20px;
    position: relative;}
.banner .txtb .txtc .list .txt { color: #ff0000; font-weight: bold;}
.banner .txtb .txtc .list li { display: flex; justify-content: space-between; align-items: flex-start;
font-size: 14px;
    padding: 10px 0 10px 10px;
    border-bottom: 1px solid #333; color: #fff;}
.banner .txtb .txtc .list .ts { text-align: left;}
.banner .txtb .txtc .list .t1 { color: #0bc82a; margin-right: 20px;}
.banner .txtb .txtc .list .arrow { color: #c4c4c4;  margin-right: 20px;}
.banner .txtb .txtc .list .t2 { color: #fff;}
.banner .txtb .txtc .list .t2:hover { color: #ff0000; text-decoration: underline;}
.banner .txtb .txtc .list .btn {color: #fff;
    font-size: 14px;
    background-color: #1389E1;
    border-radius: 25px;
    width: 94px;
    height: 30px;
    display: inline-block;
    line-height: 30px;
    text-align: center;}
.banner .txtb .txtc .list .btn:hover { background-color: #ff0000;}
.banner .name img { width: 100%; max-width: 500px; margin: 0 auto;}
.banner .btnPlay {border: 4px solid #ff8f00; 
 padding: 0 1.8em; overflow: hidden;
	line-height: 3em; height: 3em; background-color: #fff; display: inline-block; cursor: pointer;
-moz-border-radius:1.9em; -webkit-border-radius:1.9em; border-radius:1.9em;
transition: all 0.5s;
-webkit-transition:all 0.5s;
	
}
.banner .btnPlay img { height: 3em; width: auto; display: block;}
.banner .btnPlay:hover {border: 4px solid #ff8f00;
-moz-box-shadow: 0 3px 0 rgba(255, 143, 0, 1);
-webkit-box-shadow: 0 3px 0 rgba(255, 143, 0, 1);
box-shadow: 0 3px 0 rgba(255, 143, 0, 1);
}

@media only screen and (max-width:828px) {
	.banner { height: auto; padding-bottom: 4em;}
	.banner .txtb { position: relative;}
	.banner .txtb .txtc { margin-top:6em;}
	.banner .txtb .txtc .list .txt { font-size: 12px;}
	.banner .txtb .txtc .list ul { margin-top: 1em;}
	.banner .txtb .txtc .list { border: 0; padding: 16px 10px 10px;}
	.banner .name img { width: 70%; max-width: 500px; margin: 0 auto;}
	.banner .txtb .txtc .list .btn { font-size: 12px; width: 75px;
    height: 22px; line-height: 22px;}
	.banner .txtb .txtc .list .t1 {  margin-right: 6px;}
	.banner .txtb .txtc .list .arrow { font-size: 12px; margin-right: 3px;}
	.banner .txtb .txtc .list li  { border-bottom: 0; padding: 9px 0;}
}

/*底部*/
.footer {padding: 6.1em 0 4.5em; background: #f4f4f4;
	text-align: center;
	color: #000;}
.footer a {	color: #fff;}
.footer a:hover {color: #eee;}
.footer .info { display: flex; justify-content: space-between; align-items: flex-start;}
.footer .info .about {font-size: 15px; width: 40%; text-align: left;}
.footer .info .about img { display: block; width: 25%; height: auto;
margin: 0 auto 0.5em 0;}
.footer .info .links { font-size: 15px; width: 60%; border-top:1px solid #000 ;}
.footer .info .links ul { margin-top: 4.7em; width: 100%; text-align: right;}
.footer .info .links ul li { width: 5em; display: inline-block; text-align: center;}
.footer .info .links img { width: 3em; height: 3em; object-fit: contain;
display: block; margin: 0 auto;}
.footer .copyright { padding: 4.2em 0 0; font-size: 12px;}
.footer .copyright .red { color: #ff0000;}
.footer .copyright .blue { color: #0000ff;}

.footerM { display: none; z-index: 1000;
position: fixed; bottom: 0; left: 0; right: 0; background-color: #fff;

box-shadow: 0 0 10px 0 rgba(0, 0, 0, .5);
border-radius: 40px 40px 0 0; font-weight: bold; color: #333;
}
.footerM ul { display: flex; justify-content: space-around; align-items: flex-start;}
.footerM ul img { display: block; width: 3em; height: 3em; object-fit: contain;
margin: 0 auto;}
.footerM ul  li { flex: 1;}
.footerM ul a{ padding: 0.7em 0 0.5em; display: block; cursor: pointer; color: #333;}

@media only screen and (max-width: 828px) {
	.footer .info { display: block;}
	.footer .info .about { width: auto;}
	.footer .info .links { width: auto; margin-top: 3em;}
	.footer .info .links ul {margin-top: 2em;}
	.footer .info .links ul { text-align: center;}
	
	.footerM { display: block;}
}

.pIframeBox { position: fixed; z-index: 5000; left: 0; top: 0; width: 100%; height: 100%;
display: flex; justify-content: center; align-items: center;
background-color: rgba(0,0,0,0.5);}
.pIframeBox .pIframeCon { width: 90%; max-width: 1000px; border: 5px solid #fff;}
.pIframeBox .conB { padding-top: 50%; position: relative; z-index: 0;
}
.pIframeBox .conC { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
 background-color: #fff;}
.pIframeBox .close { position: absolute; z-index: 100; top: 25px; right: 25px;
 width: 25px; height: 25px; cursor: pointer;
 background: url(../images/close.png) center center no-repeat;
 background-size:contain ;}
.pIframeBox .iframe { width: 100%; height: 100%; margin: 0; padding: 0; border: 0;}

@media only screen and (max-width: 420px) {

	html,
	body {
		font-size: 14px;
	}
}

@media only screen and (max-width: 360px) {

	html,
	body {
		font-size: 12px;
	}
}

.kf {
    position: fixed; z-index: 2000;
    right: 30px;
    bottom: 50px; width: 60px;
}
.kf img { display: block; width: 100%; height: auto;}
@media only screen and (max-width: 828px) {
	.kf { display: none;}
}