@charset "utf-8";
/* 
|----------------------
|   全局设置
|----------------------
*/

* {
	transition: all .3s;
}


@font-face {
    font-family: "sourcehansans"; 
    src: url("../fonts/sourcehansans.eot"); 
    src: url("../fonts/sourcehansans.eot?#iefix") format("embedded-opentype"),
    url("../fonts/sourcehansans.woff") format("woff"),
    url("../fonts/sourcehansans.ttf") format("truetype"),
    url("../fonts/sourcehansans.svg#YourWebFontName")
     format("svg"); 
   
  }

  @font-face {
    font-family: "sourcehansans_light"; 
    src: url("../fonts2/SourceHanSansCN-Light.otf") format("truetype"); 
   
  }




body {
	font-size: 16px;
	font-family: 'sourcehansans';

}


.flex {
	display: flex;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
}

.position {
	position: relative;
}

.overflow {
	overflow: hidden;
}

.background {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.container {
	margin: 0 auto;
	width: 1600px;
	padding: 0 50px;
}

@media (max-width:1700px) {
	.container {
		padding-left: 50px;
		padding-right: 50px;
	}
}

@media (max-width:768px) {
	.container {
		padding-left: 15px;
		padding-right: 15px;
	}
	.container{
		width: auto!important
	}

}

.padding {
	padding-top: 100px;
	padding-bottom: 100px;
}

@media (max-width:768px) {
	.padding {
		padding-top: 50px;
		padding-bottom: 50px;
	}
}


.padding-top {
	padding-top: 100px;
}

@media (max-width:1600px) {
	.padding-top {
		padding-top: 60px;
	}
}

@media (max-width:768px) {
	.padding-top {
		padding-top: 40px;
	}
}

/* 
|----------------------
|   主题色设置
|----------------------
*/
:root {
	/* 主色调 */
	--default: #003f80;
	/* 辅助色 */
	--fuColor: #008CD6;
}

a:hover{
	text-decoration:none!important;
}

@font-face {
    font-family: "sourcehansans"; 
    src: url("../fonts/sourcehansans.eot"); 
    src: url("../fonts/sourcehansans.eot?#iefix") format("embedded-opentype"),
    url("../fonts/sourcehansans.woff") format("woff"),
    url("../fonts/sourcehansans.ttf") format("truetype"),
    url("../fonts/sourcehansans.svg#YourWebFontName")
     format("svg"); 
   
  }
.header{position: absolute; top: 0; left: 0; z-index: 10; width: 100%; padding: 25px 0;}
.header-wrapper{justify-content:space-between; align-items:center;}

.logo img{height: 85px;}
@media (max-width:768px) {
	.header{ padding: 15px 0;}
    .logo img{height: 20px;}
}

.header-right{align-items: center;}

.nav ul{align-items: center;}
.nav ul li a{ display:block; margin-left:45px; color:#fff;font-size: 19px;}
@media (max-width:1200px) {
    .nav ul li a{ margin-left:35px; }
}

@media (max-width:1000px) {
	.nav{margin-right: 30px;}
    .nav ul li a{ margin-left:25px; }
}

@media (max-width:768px) {
    .nav ul li a{display: none;}
}

.header-tools{align-items: center;}

.nav-chat-online a{display: inline-block; padding: 0 10px; line-height: 26px; font-size: 16px; border-radius: 60px; border: 1px solid #fff; background-color:#fff; color: var(--default);}
.nav-chat-online a:hover{ background-color: #E50011; border-color: #E50011; color: #fff;}
@media (max-width:1000px) {
	.nav-chat-online a{ padding: 0 15px; line-height: 30px; font-size: 12px; }
}

@media (max-width:768px) {
	.nav-chat-online a{ padding: 0 10px; line-height: 28px; transform: scale(.8);}
}

.navbar{display:none;margin-left:10px;width:20px;cursor:pointer}
.navbar span{display:block;width:100%;height:2px;background-color:#fff;}
.navbar span:nth-child(2){position:relative;margin:6px 0}
.navbar-active span{background-color: var(--default);}
@media(max-width:768px){
	.navbar{display:block}
}


/* footer */
.footer-bg{position: relative; background-color: #e5e5e6; overflow: hidden;}
/* .footer-bg::before{ position: absolute; top: 0; left: 0; z-index: 0; content: ''; width: 50%; height: 100%; background-color: var(--default);} */

/* left */
.footer-left{position: relative; width: 50%; padding: 120px 50px 120px 0 ; }

.footer-say{margin-top: 50px; color: #333;}
.footer-say h3{line-height: 1.4; font-size: 45px; color: #595858;font-family: 'PingFang';font-weight: lighter;}
.footer-say h3 span{display: block;}
.footer-say p{ margin-top: 25px; font-size: 21px; line-height: 1.6;color: #595858;font-weight: lighter; font-family: 'sourcehansans_light';}

.footer-address{margin: 45px 0;}
.footer-address ul li{position: relative; padding-left: 44px; margin-top: 20px;margin-bottom: 20px;}
.footer-address ul li span{ position: absolute; top: 0; left: 0; font-size: 18px; color: #595858;font-weight: lighter; font-family: 'sourcehansans_light';}
.footer-address ul li p{font-size: 18px; color: #595858;font-weight: lighter; font-family: 'sourcehansans_light';}

.footer-qrcode ul li span{max-width: 185px;display:inline-block;}
.footer-qrcode ul li img{width:100%;}
.footer-qrcode ul li h3{ margin-top: 20px; font-size: 21px; color: #595858;text-align: center; font-weight: lighter; font-family: 'sourcehansans_light';}


/* right */
.footer-right{ position: absolute; top: 0; right: 0; width: 50%; height: 100%; z-index:1; }
.footer-right img{display: none;}


@media (max-width:1600px) {
	.footer-left{ padding: 90px 0;}
	.footer-qrcode ul li span{max-width: 150px;}
	.footer-qrcode ul li h3{ margin-top: 10px; font-size: 14px; text-align: center;}
	
}

@media (max-width:1400px) {
	
	.footer-address ul li{position: relative;}
	.footer-address ul li i{ top: 1px; left: 0; font-size: 16px; color: #fff;}
	.footer-address ul li p{line-height: 1.2; font-size: 14px;}
	
	.footer-qrcode ul li span{max-width: 140px;}
	.footer-qrcode ul li h3{ margin-top: 15px; font-size: 14px;}
}


@media (max-width:1200px) {
	
	.footer-say{margin-top: 50px; max-width:100%;}
	
	.footer-address{margin-bottom: 30px;}
	.footer-address ul li{position: relative; margin-top: 15px;}
	.footer-address ul li i{  font-size: 16px; }
	.footer-address ul li p{line-height: 1.2; font-size: 14px;}
	
	.footer-qrcode ul li h3{ margin-top: 10px; font-size: 12px;}
	.footer-address ul li span{
		font-size: 14px;
	}
}

@media (max-width:1000px) {
	.footer-left{ padding: 100px 0; width: 100%;}
	.footer-right{ position: relative; width: 120%; padding-bottom: 0; margin-left: -50px; margin-right: 50px; background: none;}
	.footer-right img{width: 100%; display: block;}
	
	.footer-address ul li{position: relative; margin-top: 10px;}
	.footer-address ul li i{ font-size: 14px;}
	
	.footer-qrcode ul li h3{ margin-top: 10px; font-size: 12px;}
 
	
}

@media (max-width:768px) {
	.footer-left{ padding: 0px 0 50px;}
	.footer-say{ font-size: 32px;}


}

.footer-address ul li{
	margin-bottom: 0;
}
.comma-online{ position:absolute; bottom: 50px; left: 0; width: 100%; z-index: 3;}
.creating-online{width: 55%; margin: 0 auto 130px;}
.creating-online ul{
	justify-content: center;
    width: 100%;
    background-color: #94000d;
	padding: 2% 0;
	padding-bottom: 3%;
	text-align: center;
}
.creating-online ul li{cursor: pointer;}
.creating-online ul li h3{ margin-top: 13px; font-size: 18px; color: #fff; font-weight: lighter; font-family: 'sourcehansans_light';}
.creating-online ul li a{ margin-top: 25px; max-width: 120px; align-items: center; color: #fff; font-weight: lighter; font-family: 'sourcehansans_light';}
.creating-online ul li a svg{ margin-left: 10px; width: 25px;}


.creating-online ul li:hover a svg{ animation:shake 1s .2s ease both;}

.copyright{justify-content: space-between; line-height: 30px;}
.copyright p:last-child svg{width: 28px; vertical-align: middle;}
.copyright p:last-child .st1{fill:none;stroke: #E50011;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}

.copyright p:last-child svg{
    width: 28px; 
    vertical-align: middle;
}

.copyright p:last-child svg .red {
	fill: none;
	stroke: red;
	stroke-width: 1;
}


.animate-line {
	animation: dash .8s infinite;
}

@keyframes dash {
	0 {
		transform: translateX(-3px);
	}

	50% {
		transform: translateX(3px);
	}

	100% {
		transform: translateX(-3px);
	}
}

@media (max-width:1700px) {
	.comma-online{ padding: 0 50px;}
	.creating-online{width: 60%; margin-bottom: 75px;}
	.creating-online ul li{ padding: 20px 30px; }
}

@media (max-width:1600px) {
	.comma-online{ padding: 0 50px;}
	.creating-online{width: 60%; margin-bottom: 75px;}
	.creating-online ul li{ padding: 20px 30px; }
}

@media (max-width:1400px) {
	.creating-online ul li h3{ font-size: 20px;}
}

@media (max-width:1200px) {
	.creating-online{ margin-bottom: 60px;}
	.creating-online ul li{ padding: 15px 20px;}
	.creating-online ul li h3{ font-size: 18px;}
}

@media (max-width:1000px) {
	.footer-site{ padding-bottom: 50px;}
	.comma-online{padding: 0 50px;}
	.creating-online{width: 100%; margin: 0 auto 70px;}
}

@media (max-width:768px) {
	.footer-site{padding-bottom: 180px; background-color: #eee;}
	.comma-online{padding: 0 15px;}
	.creating-online{width: 100%; margin: 0 auto 20px;}
	.creating-online ul li{width: 100%; }
	.creating-online ul li h3{ font-size: 14px;}
	.copyright{ flex-direction: column-reverse;}
	.copyright p:last-child{ margin: 20px 0 30px; text-align: center;}
	.creating-online ul{
		padding: 0;
	}
}

@media (max-width:640px) {
	.footer-site{background-color: #eee;}
	.creating-online{width: 100%; margin: 0 auto 20px;}
	.creating-online ul li{width: 100%; }
	
	.copyright{ flex-direction: column-reverse;}
	.copyright p{text-align: center; font-size: 12px; line-height: 1.4;}
	.copyright p a{display: block;}
	.copyright p:last-child{ text-align: center; font-size: 18px;}
	
	.creating-online ul li a{ margin-top: 15px; }
}

@keyframes creatSiteLeft {
	0%,
	100% {
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
	50% {
		-webkit-transform: translateX(6px);
		transform: translateX(6px);
	}
	80% {
		-webkit-transform: translateX(3px);
		transform: translateX(3px);
	}
}


#animation{
-webkit-animation:shake 1s .2s ease both;
-moz-animation:shake 1s .2s ease both;}
@-webkit-keyframes shake{
	0%,100%{-webkit-transform:translateX(0);}
	10%,30%,50%,70%, 90%{-webkit-transform:translateX(-10px);}
	20%,40%,60%,80%{-webkit-transform:translateX(10px);}
}
@-moz-keyframes shake{
	0%,100%{-moz-transform:translateX(0);}
	10%,30%,50%,70%, 90%{-moz-transform:translateX(-10px);}
	20%,40%,60%,80%{-moz-transform:translateX(10px);}
}



/*  */
.fix-online {position: fixed;top: 60%;right: 0;z-index: 99;width: 70px;opacity: 0;transition: opacity .3s, transform .3s;transform: translateX(100%);}
.fix-online-active {opacity: 1;transform: translateX(0);}
.fix-online-item {display: block;margin-bottom: 1px;background-color: #94000d;border-radius: 6px 0 0 6px;color: #fff;text-align: center;transition: transform .4s;}
.fix-online-main {width: 70px;height: 70px;background-color: #94000d;border-radius: 6px 0 0 6px;margin-bottom: 3px;}
.fix-online-main .fix-online-ico {width: 50px;}
.fix-online-main p {font-size: 14px;color: #fff;}
.fix-online-tel {display: flex;width: 260px;flex-wrap: wrap;align-items: center;margin-bottom: 3px;}
.fix-online-tel .fix-online-main {border-right: 1px solid rgba(0, 0, 0, .2);}
.fix-online-number {flex: 1;font-size: 20px;color: #fff;}
.fix-online-wx-img {position: absolute;bottom: 50%;margin-bottom: -70px;right: 75px;opacity: 0;visibility: hidden;transition: all .3s;}

.fix-online-wx-img img {width: 140px;}

.fix-online-item.gotop .fix-online-main .fix-online-ico {width: 40px;padding-top: 5px;}
.fix-online .fix-online-item:hover {transform: translateX(-10px)}
.fix-online .fix-online-item.fix-online-wx:hover .fix-online-wx-img{opacity: 1;visibility: visible;}
.fix-online .fix-online-tel:hover {transform: translateX(-180px)}
.fix-online .fix-online-tel:hover .fix-online-main {padding-right: 0;width: 80px;}

@media (max-width:768px) {
	.fix-online{display: none;}
}

/*  */
.fix-online-mb{position: fixed;bottom: 15px;right: 10px;z-index: 99; display: none;}
.chat-mb-ico{ position: relative; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; padding: 10px; background-color: #fff; border-radius: 50%; box-shadow: 0 0 5px rgba(0, 0, 0, .2);}
.chat-mb-ico img{width: 100%;}
.chat-mb-ico span{position: absolute; top: -14px; right: -5px; display: block; width: 22px; height: 22px; line-height: 22px; text-align: center; background-color: #E50011; color: #fff; border-radius: 50%; font-size: 12px;}

.chat-mb-msg{position: absolute; top: -20px; right: 0; text-align: right;}
.chat-mb-msg span{ position: absolute; bottom: 0px; right: 0; display: inline-block; padding: 10px 15px; white-space: nowrap; background-color: #fff; border-radius: 6px; opacity: 0; visibility: hidden; color: #003f80; font-size: 12px; box-shadow: 0 0 5px rgba(0, 0, 0, .2);}
.chat-mb-msg span::before{position: absolute; bottom: -8px; right: 20px; content: ''; border-top: 0 solid transparent; border-bottom: 8px solid transparent; border-right: 14px solid #fff;}
.chat-mb-msg span:nth-child(1){bottom: 10px;opacity: 1; visibility: visible;}
@media (max-width:768px) {
	.fix-online-mb{display: block;}
}




.burger-bg{position:fixed;top:0;left:0;z-index:3378;padding:60px 15px 20px;width:100%;
	height:100%;background-color:#000;transition:all .3s}
.burger-scroll{overflow-y:auto;height:100%}
.burger-logo{position:fixed;top:15px;left:15px}
.burger-logo img{height:40px}
.close-burger{position:fixed;top:10px;right:15px;width:34px;height:29px}
.close-burger span{position:absolute;top:17px;left:6px;width:25px;height:1px;background-color:#fff}
.close-burger span:first-child{transform:rotate(45deg)}
.close-burger span:last-child{transform:rotate(-45deg)}
.burger-bg-active{visibility:hidden;opacity:0;transform:translateX(120px)}
.burger-nav{position:relative;padding-top:20px;height:100%}
.burger-nav-lists>li{position:relative;border-bottom:1px solid #ccc;}
.burger-nav-lists>li>a{color:#fff;font-size:18px;line-height:45px}
.burger-nav-f1{display:none;transition:none}
.burger-nav-f1 ul>li{position:relative;padding-left:20px;border-bottom:1px solid #eee}
.burger-nav-f1 ul>li:last-child{border-bottom:none}
.burger-nav-f1 ul>li a{color:#999;font-size:16px;line-height:45px}
.burger-nav-f2{display:none;transition:none}
.burger-nav-f2 li{border-color:#6196bb;background-color:#d6e6f1}
.burger-nav-f2 li a{padding-left:20px;color:#316a91;font-size:16px}
.burger-nav-lists li span{position:absolute;top:12px;right:15px;width:12px;height:12px;border-top:1px solid #333;border-right:1px solid #333;transform:rotate(135deg)}