﻿

.mo-leftmenu{background:#F5F5F5;position:fixed;top:0;left:0;bottom:0;overflow-x:hidden;box-sizing:content-box;width:70%;max-width:350px;-webkit-overflow-scrolling:touch;z-index:105!important;-webkit-transition:all .4s cubic-bezier(0.7,0,0.2,1);-ms-transition:all .4s cubic-bezier(0.7,0,0.2,1);transition:all .4s cubic-bezier(0.7,0,0.2,1);box-shadow:0 0 40px rgba(82,85,90,0.1);-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%)}
.mo-leftmenu .tit{height:50px;background:#353535;display:flex;justify-content:space-between;align-items:center;}
.mo-leftmenu .tit h6{color:#fff;padding:0 0 0 15px;font-size:18px;font-weight:bold;}
.mo-leftmenu .tit span{cursor:pointer;display:block;width:40px;height:40px;line-height:40px;text-align:center;}
.mo-leftmenu .tit span i{color:#fff;font-size:16px;}
.mo-leftmenu > ul{}
.mo-leftmenu > ul > li{line-height:50px;font-size:15px;border-top:2px solid #e5e5e5;position:relative;}
.mo-leftmenu > ul > li > a{padding:0 0 0 15px;}
.mo-leftmenu > ul > li > i {position:absolute;color:#333;font-size:12px;top:10px;right:5px;z-index:1;width:30px;line-height:30px;text-align:center;cursor:pointer;}
.mo-leftmenu > ul > li.active{}
.mo-leftmenu ul li a{color:#333;display: block;}
.mo-leftmenu ul li a:hover{text-decoration: none;}
.mo-leftmenu ul li ul{display:none;padding-bottom:10px;padding-left:15px;}
.mo-leftmenu ul li ul li{line-height:22px;position:relative;}
.mo-leftmenu ul li ul li i {position:absolute;color:#333;font-size:12px;top:1px;right:0;z-index:1;width:30px;line-height:30px;text-align:center;cursor:pointer;}
.mo-leftmenu ul li ul li a{padding:5px 0;margin-right:30px;}

.menu-transitioning{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}

/*---header---*/

.sitetop{margin-top: 15px;}
.sitetop > .wp{display:flex;justify-content:space-between;align-items:center;}
.sitetop .logo{display: none;}
.sitetop .logo img {width: auto}
.sitetop span{width:50px;height:50px;line-height:50px;font-size:24px;text-align:center;display: none;}
.sitetop span i{font-size:24px;line-height:50px;}

.sitetop-left{display: flex;align-items: center;}
              
.sitetop-right{display:flex;align-items:center;position:relative;z-index:20;}

.sitetop-left p{font-size:15px;color:#111;}
.sitetop-left p:not(:last-of-type)::after{content:"|";font-size:16px;color:#111;margin:0 8px;}

.sitetop-right .share{font-size:0;margin:0 20px;}
.sitetop-right .share a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;}
.sitetop-right .share a:nth-child(1){background:#f14b17;}
.sitetop-right .share a:nth-child(2){background:#397AB2;}
.sitetop-right .share a:nth-child(3){background:#E60029;}
.sitetop-right .share a:nth-child(4){background:#f14b17;}
.sitetop-right .share a+a{margin-left:12px;}
.sitetop-right .share a i{font-size:16px;color:#fff;}


.sitetop-right .head-searchbg {
  float: left;
  width: 204px;
  height: 34px;
  /* margin-top: 11px; */
  border-radius: 50px;
  background: rgb(2 98 178 / 17%);
  margin-right: 20px;
}

.sitetop-right .head-searchbg input {
  float: left;
  width: 160px;
  height: 34px;
  padding-left: 14px;
  font-size: 13px;
  color: #fff;
  border: none;
  outline: none;
  background: 0 0;
  outline: none;
  
}

.sitetop-right .head-searchbg button {
  float: right;
  width: 44px;
  height: 34px;
  background: 0 0;
  border-top-right-radius: 16px;
  border-bottom-right-radius: 16px;
  outline: none;
  background: var(--active-color);
  line-height: 24px;
}

.sitetop-right .head-searchbg button::before {
  /* content: '\e727'; */
  font-size: 22px;
  color: #fff;
  opacity: 0.7;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  transition: 0.3s all;
}

.sitetop-right .head-searchbg button:hover::before {
  opacity: 1;
}

.header-lang{position:relative;z-index:20;}
.header-lang .box{height:34px;cursor:pointer;display:flex;align-items:center;padding:0 7px;border:1px solid #CECECE;}
.header-lang .box img{height:16px;}
.header-lang .box em{margin:0 7px;line-height:16px;font-size:14px;color:#666;text-transform:uppercase;}
.header-lang .box i{line-height:16px;font-size:14px;color:#666;}
.header-lang .lang-box{width:200px;padding:15px;position:absolute;right:0;top:42px;z-index:200;background:#fff;transform:translate3d(0,10px,0);-webkit-transform:translate3d(0,10px,0);opacity:0;visibility:hidden;transition:all .4s ease 0s;box-shadow:0 0 10px rgba(63,62,62,0.2);}
.header-lang .lang-box::before{content:'';position:absolute;right:37px;top:-8px;overflow:hidden;border-right:8px solid transparent;border-bottom:8px solid #fff;border-left:8px solid transparent;display:block;}
.header-lang ul{max-height:160px;overflow-y:scroll;padding:0;display:flex;flex-wrap:wrap;}
.header-lang ul li{padding:5px 0;border-bottom:1px solid #f5f5f5;width:50%;}
.header-lang ul li:last-child{border:none;}
.header-lang ul li a{color:#333;font-size:14px;display:block;}
.header-lang ul li a:hover{color:#015198;}
.header-lang ul li img{height:16px;vertical-align:middle;margin-right:7px;}

.header-lang:hover .lang-box{opacity:1;visibility:visible;transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);}


.header{height:80px;}
.header > .wp{height:100%;display:flex;justify-content:space-between;align-items:center;}
.header .logo img{height:40px; width:auto}

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

.nav{margin-top:5px;position:relative;z-index:15;}
.nav > ul{display:-webkit-flex;display:flex;}
.nav > ul > li{position:relative;}
.nav > ul > li+li{margin-left:40px;}
.nav > ul > li > a{display:block;font-size:18px;color:#333333;height:50px;line-height:50px;position:relative;z-index:20;}
.nav > ul > li > a > i{display:inline-block;font-size:14px;vertical-align:middle;transition:all 0.3s ease 0s;}

.nav > ul > li ul{position:absolute;width:220px;height:auto;left:-20px;text-align:left;top:58px;z-index:100;padding:10px;background:#fff;transform:rotate3d(1,0,0,-90deg);-webkit-transform: rotate3d(1,0,0,-90deg);-o-transform:rotate3d(1,0,0,-90deg);-webkit-transform-origin:0 0 0;-moz-transform-origin:0 0 0;transform-origin:0 0 0;-khtml-opacity:0;-moz-opacity:0;opacity:0;transition: transform 0.5s, opacity 0.3s;-webkit-transition: -webkit-transform 0.5s, opacity 0.3s;box-shadow:rgba(0,0,0,0.14) 0px -6px 9px 0px;}
.nav > ul > li:nth-child(5) ul{width:160px;}
.nav > ul > li > ul::before{content:'';position:absolute;left:40px;margin:0;top:-8px;overflow:hidden;display:inline-block;border-right:8px solid transparent;border-bottom:8px solid #fff;border-left:8px solid transparent;}
.nav > ul > li > ul li{border-bottom:1px solid #EDEDED;position:relative;}
.nav > ul > li > ul li:last-child{border:none;}
.nav > ul > li > ul li > a{display:block;border-radius:4px;padding:10px 8px;color:#333333;font-size:15px;line-height:21px;text-transform:capitalize;}
.nav > ul > li > ul > li > a{padding-right:20px;}
.nav > ul > li > ul li > a i{position:absolute;right:10px;top:10px;font-size:11px;}
.nav > ul > li > ul li:hover > a{background:#0271B7;color:#fff;}

.nav > ul > li:hover > a,.nav > ul > li.active > a{color:#0271B7;}
.nav > ul > li:hover > a > i{transform:rotate(180deg);-o-transform: rotate(180deg);-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);}

.nav > ul li:hover > ul{-moz-opacity:1;-khtml-opacity:1;opacity:1;transform:rotate3d(0,0,0,0);-webkit-transform:rotate3d(0,0,0,0);-o-transform:rotate3d(0,0,0,0);}
.nav > ul > li > ul li ul{left:210px;top:0;}

.header-right > span{width:40px;height:40px;text-align:center;color:#333;display:none;}
.header-right > span i{font-size:24px;line-height:40px;}

.search-box{display:none;position:absolute;z-index:9999;width:100%;left:0;right:0;top:80px;background:rgba(0,0,0,0.6);padding:22px 0;}
.search-box .close{position:absolute;right:30px;top:calc(50% - 11px);line-height:22px;height:22px;}
.search-box .close i{font-size:21px;color:#fff;}
.search-box .serchbox{width:700px;margin:0 auto;position:relative;}
.search-box .serchbox .submit_text{background:#fff;width:100%;height:47px;line-height:47px;float:left;color:#111;padding:0 90px 0 15px;font-size:15px;}
.search-box .serchbox .submit_btn{position:absolute;right:0;top:0;width:70px;height:47px;line-height:47px;background:var(--active-color);text-align:center;display:block;cursor:pointer;}
.search-box .serchbox .submit_btn i{font-size:25px;color:#fff;}

.search span {cursor: pointer;}

@media screen and (max-width:1441px) {
.nav > ul > li+li{margin-left:30px;}
  .sitetop-left p{font-size: 14px;}
  .sitetop-right .share a{width: 25px;height: 25px;}
  .sitetop-right .share a i{font-size: 14px;}
}


@media screen and (max-width:1367px) {
.nav > ul > li+li{margin-left:25px;}
.sitetop-left p{font-size: 13px;}
  .sitetop-right .share a{width: 25px;height: 25px;}
  .sitetop-right .share a i{font-size: 14px;}
   .sitetop-right .head-searchbg{width: 160px;}
   .sitetop-right .head-searchbg input{width: 80px;}
}

@media screen and (max-width:1281px){
.header .logo img{height:35px;}
.nav > ul > li+li{margin-left:20px;}
.nav > ul > li > a{font-size:17px;}
  .sitetop-left p{font-size: 13px;}
  .sitetop-right .share a{width: 22px;height: 22px;}
  .sitetop-right .share a i{font-size: 12px;}
  .sitetop-right .head-searchbg{width: 145px;}
}

@media screen and (max-width:1171px){
.nav > ul > li+li{margin-left:15px;}
.nav > ul > li > a{font-size:16px;}
.sitetop-right p{display:none;}
  .nav > ul > li > a{font-size:15px;}
  .sitetop-left p{font-size: 11px;}
  .sitetop-right .share a{width: 22px;height: 22px;}
  .sitetop-right .share a i{font-size: 12px;}
  .sitetop-right .head-searchbg{width: 125px;}
  .sitetop-right .share{margin: 0 8px 0 0;}
  .sitetop-right .share a + a{margin-left: 5px;}
  
}

@media screen and (max-width:992px){
.header{display:none;}
.head-searchbg{display: none;}
  .sitetop-right .share a{width: 25px;height: 25px;}
  .sitetop-right .share a i{font-size: 15px;}  
  .sitetop-left{display: none;}
  .sitetop .logo{display: block;}
  .sitetop .logo img{height: 35px;}
  .sitetop{padding: 15px 0;margin-top:0;}
  .sitetop span{display: block;}
  .search-box .close {display: none;}
.search-box .serchbox{width:90%;}
.search-box .serchbox .submit_text{height:42px;line-height:42px;padding:0 75px 0 15px;}
.search-box .serchbox .submit_btn{width:60px;height:42px;line-height:42px;}
.search-box .serchbox .submit_btn i{font-size:22px;}
}

@media screen and (max-width:768px){
	
.sitetop .logo img{height:30px;}

}

@media screen and (max-width:576px) {
.sitetop-right .share,.header-right span.mo-header-menu{display:none;}
.sitetop .logo img{height:20px;}

}

@media screen and (max-width:480px) {
.search-box .serchbox .submit_text{height: 38px;line-height: 38px;padding:0 60px 0 10px;}
.search-box .serchbox .submit_btn{width:50px;height:38px;line-height:38px;}
.search-box .serchbox .submit_btn i{font-size:20px;}
  .search-box{padding: 10px 0;}
}	


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


}

