@charset "utf-8";
/* 
|----------------------
|   全局设置
|----------------------
*/
* {transition: all .3s;}
body {font-size: 14px; font-family: Arial,"Open Sans","PingFang SC","Microsoft YaHei","Helvetica Neue","Hiragino Sans GB","WenQuanYi Micro Hei",sans-serif;line-height: 1;}
.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; max-width: 1260px; padding-left: 30px; padding-right: 30px; }
.padding {padding-top: 100px;padding-bottom: 100px;}

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

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

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

/* 
|----------------------
|   主题色设置
|----------------------
*/
:root {
	/* 主色调 */
	--default: #00CAFF;
	/* 辅助色 */
	--deputy: #E47C13;
}

/* 
|----------------------
|   字体图标
|----------------------
*/
@font-face {
  font-family: 'iconfont';  /* Project id 3203687 */
  src: url('//at.alicdn.com/t/font_3203687_wazxf8avz09.woff2?t=1646995326533') format('woff2'),
       url('//at.alicdn.com/t/font_3203687_wazxf8avz09.woff?t=1646995326533') format('woff'),
       url('//at.alicdn.com/t/font_3203687_wazxf8avz09.ttf?t=1646995326533') format('truetype');
}

.iconfont {
	font-family: "iconfont" !important;
	font-size: 16px;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'iconpublic';  /* Project id 2997381 */
  src: url('//at.alicdn.com/t/font_2997381_6boj0xyn4wh.woff2?t=1642737382187') format('woff2'),
       url('//at.alicdn.com/t/font_2997381_6boj0xyn4wh.woff?t=1642737382187') format('woff'),
       url('//at.alicdn.com/t/font_2997381_6boj0xyn4wh.ttf?t=1642737382187') format('truetype');
}

.iconpublic {
	font-family: "iconpublic" !important;
	font-size: 16px;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* 
|----------------------
|   header
|----------------------
*/
/* top */
.site-top{padding: 10px 0; background-color: #00c9ff; color: #ffffff;}
.site-top .container{justify-content: space-between; color: #ffffff;}

.site-top-care{align-items: center; color: #DDDDDD;}
.site-top-care span{ display:block; color: #fff;}
.site-top-care div{margin-left: 3px;}
.site-top-care div a{ display: inline-block; padding-left: 3px; color: #fff;}
.site-top-care div a:hover{color: #00c9ff;}

@media (max-width:786px) {
	.site-top{display: none;}
}
/* header */
.site-header{padding: 15px 0; width: 100%; background-color: #fff;}
.site-header-flex{ justify-content: space-between; align-items: center;}
.active-site-header{ position: fixed; top: 0; left: 0; z-index: 9; padding: 10px 0;}
/*  */
.site-logo img{height: 60px;}
@media (max-width:960px) {
	.site-logo img{height: 40px;}
	
}
/*  */
.site-menus>ul>li{ position: relative; margin-left: 45px;}
.site-menus>ul>li>a{display: block; line-height: 50px; font-size: 18px; border-bottom: 2px solid transparent;}
.site-menus>ul li:hover>a,
.site-menus>ul>li.active>a{border-bottom-color: #00c9ff; color: #00c9ff;}

@media (max-width:1200px) {
	.site-menus>ul>li{margin-left: 25px;}
}

@media (max-width:960px) {
	.site-menus>ul>li{margin-left: 15px;}
	.site-menus>ul>li>a{display: block; line-height: 40px; font-size: 16px; border-bottom: 2px solid transparent;}
}

@media (max-width:786px) {
	.site-menus{display: none;}
}

/* sub */
.site-menus .site-menus-sub{position: absolute; top: 60px; left: 50%; z-index: 4; background-color: #fff; transform: translateX(-50%); opacity: 0; visibility: hidden;}
.site-menus .site-menus-sub ul li a{display: block; padding: 0 15px; line-height: 45px; font-size: 16px; text-align: center; color: #333; white-space: nowrap;}
.site-menus .site-menus-sub ul li a:hover{color: var(--default);}
.site-menus>ul>li:hover .site-menus-sub{  opacity: 1; visibility: visible;}
@media (max-width:960px) {
	.site-menus .site-menus-sub{ top: 42px;}
	.site-menus .site-menus-sub ul li a{ line-height: 40px; font-size: 14px; }
}
@media (max-width:786px) {
	.site-menus-sub{ display: none;}
}

/* navbar */
.navbar { margin-left: 25px; width: 30px; cursor: pointer;display: none;}
.navbar span {display: block;width: 100%;height: 2px;background-color: #00c9ff;}
.navbar span:nth-child(2) {position: relative;margin: 7px 0;}
@media(max-width: 786px) {
    .navbar {display: block;}
}
/* mobile-nav */
.mobile-nav {position: fixed;top: 0;left: 0; z-index: 1071;width: 100%;height: 100%; background-color: rgba(255,255,255,1); visibility: hidden; opacity: 0;}
/* menu */
.mobile-nav-box{ width: 100%; height: 100%;  overflow: hidden; visibility: hidden; opacity: 0; transform: translateX(-120px);}
.mobile-logo {padding: 15px; margin-bottom: 15px; display:block;}
.mobile-logo img{height: 40px;}
.mobile-menu>ul {display: block; padding: 0 15px;}
.mobile-menu>ul>li{position: relative; border-bottom: 1px solid #eee;transform: translateX(10px); transition: .3s;}
.mobile-menu>ul>li>a {display: inline-block; padding: 10px 0 5px; color: #333; font-size: 16px; line-height: 30px;}
.mobile-menu>ul>li>a:hover {color:#000A80;}

/* close */
.close-btn {position: fixed;top: 10px;right: 10px; z-index: 9; width: 35px;height: 35px;}
.close-btn span {position: absolute;top: 17px;left: 6px;width: 25px;height: 2px;background-color: #333;}
.close-btn span:first-child {transform: rotate(45deg);}
.close-btn span:last-child {transform: rotate(-45deg);}

/* active */
.active-mobile-nav {opacity: 1;visibility: visible;}
.active-mobile-nav-box {opacity: 1;visibility: visible; transform: translateX(0);}
.active-mobile-nav .mobile-menu ul li {animation: xssss 1s 1;}
@keyframes xssss {
    from {
        transform: translateX(-56px);
    }
}


/* 语言 */
.lag {position: relative; z-index: 999; margin-left: 50px;}
.lag span{padding: 6px 10px; display: flex; align-items: center; font-size: 16px; cursor: pointer;}
.lag span img{margin-right: 5px;}
.lag span i{
margin-left: 5px;
margin-top: 5px;
display: block;
width: 0px;
　　	height: 0px;
border: 5px solid #000;
border-top-color: #666666;
border-bottom-color: transparent;
border-left-color: transparent;
border-right-color: transparent;
}
.lag .lag-son{position: absolute; top: 28px; left: 20px; width: auto; height: auto; transition: all .3s; display: none; background-color: #ffffff; box-shadow: 0 0 2px rgba(0,0,0,.1);}
.lag a{display: block; padding: 10px; border-bottom: 1px dotted #dddddd; white-space:nowrap; }
.lag a:last-of-type{border: 0;}
.lag a:hover{color: #00c9ff;}
@media(max-width: 786px) {
	.lag {margin-left: 20px;}
    .lag span {font-size: 14px;}
}
@media(max-width: 480px) {
	.lag {margin-left: 5px;}
}

/* footer */
.site-footer{justify-content: space-between;}
.site-footer-bg{ padding: 60px 0;}

.link-footer{margin-top: -10px; margin-bottom: 40px;}
.link-footer div{
	padding-bottom: 15px; 
	border-bottom: 2px solid #e5e5e5; 
	font-size: 16px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.link-footer span{color: #0A3F6F; font-weight: bold; display: block; width: 90px;}
.link-footer p{margin-bottom: -10px; flex: 1;}
.link-footer a{margin: 0 8px 10px 4px; display: inline-block; color: #888888;}
.link-footer a:hover{color: #00c9ff;}
@media(max-width: 768px) {
	.link-footer div{flex-wrap: wrap; font-size: 14px;}
	.link-footer div>*{width: 100%;}
	.link-footer span{margin-bottom: 15px;}
	.link-footer a{margin: 0 8px 10px 0px;}
}
		
		
.site-footer-desc{width: 30%; padding-right: 50px;}
.site-footer-desc img{max-width: 250px; height: 60px; margin-bottom: 25px;}
.site-footer-desc p{ margin-bottom: 5px; line-height: 1.6; font-size: 16px; color: #666;}

.site-footer-menus{ width: 40%;padding-left: 50px; }
.site-footer-menus-item:nth-child(2){margin-top: 50px;}
.site-footer-menus-item h3{ padding: 25px 0; font-size: 20px;} 

.site-footer-menus-item ul{align-items: center;}
.site-footer-menus-item ul li{ width: 50%; margin-top: 15px;}
.site-footer-menus-item ul li a{ display: block; font-size: 16px; color: #666;}
.site-footer-menus-item ul li a:hover,
.site-footer-menus-item ul li.active a{border-bottom-color: #00c9ff; color: #00c9ff;}

.site-footer-dol{width: 25%;}
.site-footer-dol h3{padding: 25px 0; font-size: 20px;}
.site-footer-dol span{color: #00c9ff; font-weight: bold; font-size: 30px; display: flex; align-items: center; width: 100%;}
.site-footer-dol span img{margin-right: 5px;}
/* .site-footer-dol a {position: relative; display: inline-block; padding: 0 35px; line-height: 45px; font-size: 16px; background-color: #00c9ff; border: 1px solid #00c9ff; color: #fff;}
.site-footer-dol a i{font-size: 30px; vertical-align: middle;}
.site-footer-dol a:hover { box-shadow: 0 13px 10px rgba(0, 202, 255,.4);} */

@media (max-width:1200px) {
	.site-footer-menus{padding-left: 0; width: 100%;}
	.site-footer-menus-item ul li{ width: 20%; margin-top: 0px;}
	.site-footer-dol{margin-top: 10px; width: 100%;}
}

@media (max-width: 768px) {
	.site-footer-bg{ padding: 30px 0;}
	
	.site-footer-desc{width: 100%; padding-right: 0; text-align: center;}
	.site-footer-desc p{line-height: 1.2; font-size: 14px; text-align: ;}
	
	.site-footer-menus{ width: 100%; padding-left: 0; text-align: center; margin: 15px 0;}
	.site-footer-menus-item ul{display: block;}
	.site-footer-menus-item ul li{ width: 100%;}
	.site-footer-menus-item ul li a{ display: block; padding-bottom: 10px; margin-top: 10px; font-size: 14px; border-bottom: 1px solid #eee;}
	
	.site-footer-menus-item h3{ padding: 15px 0; font-size: 18px;} 
	
	.site-footer-dol{width: 100%; text-align: center;}
	.site-footer-dol span{justify-content: center; font-size: 20px;}
	.site-footer-dol span img{width: 20px;}
	.site-footer-dol h3{ padding: 15px 0; font-size: 18px;} 
}

/* copyright */
.site-copyright{padding: 18px 0; background-color: #F6F6F6; text-align: center;}
.site-copyright p,
.site-copyright p a{line-height: 1.8; color: #666;}
.site-copyright p a:hover{color: #00c9ff;}

@media (max-width: 640px) {
	.site-copyright p{font-size: 12px;}
}
