
/* ==========================================================================
   head
   ========================================================================== */
.headerpc {
  position: fixed; top: 0; line-height: 100px; height: 100px; z-index: 999; width: 100%;
  background:url(../images/headbg.png) center top repeat-x;
  -webkit-transition: background 0.4s ease-in-out, -webkit-box-shadow 0.4s ease-in-out;
  -moz-transition: background 0.4s ease-in-out, -moz-box-shadow 0.4s ease-in-out;
  -ms-transition: background 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
  -o-transition: background 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
  transition: background 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
}

.headerpc.active {background: #fff; 
  -webkit-box-shadow: 0px 3px 10px #ccc;
  -moz-box-shadow: 0px 3px 10px #ccc;
  box-shadow: 0px 3px 10px #ccc;}
.index_w .headerpc {display: none; }
.global_w .headerpc {background: #00070b; }
.indeustry_w .headerpc {background: rgba(40, 40, 40, 0.5); }
.headerpc_inner {height: 100px; line-height: 100px; } 
.headerpc .wrapper{position: relative;}
.headerpc.mini_top{background:#fff;}
.headerpc .logo {float: left;width: 15%;height: 100px; line-height:100px; overflow: hidden;}
.headerpc .logo img {height: 60px; display: inline-block;}
.headerpc .topbar{ float: right;font-size: 18px; }
.headerpc .topbar a{width: 30px; height: 30px; line-height: 30px;display: inline-block; text-align: center;
  border:1px solid #b8c2d1; color: #7d828b;font-size: 12px;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  -ms-border-radius:50%;
  -o-border-radius:50%;
  border-radius:50%;
}
.headerpc .topbar a.on{background: #040000;color: #fff;border-color:#040000;}
.headerpc .topbar span{margin-left: 20px;}
.headerpc_inner.wrapper{max-width: 1520px;}


.serchinco{display: none; position: absolute;width:48px; height: 40px; right:0; top:0; font: 300 12px/40px microsoft yahei;cursor: pointer;z-index: 999; text-align: center;}
.serchinco .fa{font-size: 16px;}
.globalsearch{display: block;}
.globalsearch{position: absolute; top:37px; right:70px;width: 200px;padding:0;z-index: 99;}
.globalsearch .warp{background: #fff;border:1px solid #323333;padding:0 10px;overflow: hidden;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  -ms-border-radius: 40px;
  -o-border-radius: 40px;
  border-radius: 40px;
}
.globalsearch #q{ float: left;   border: 0 none; }
.globalsearch .search-btn { float: right;   border: 0 none; }
.globalsearch #q { width: calc(100% - 50px); height: 18px; padding:5px; line-height: 18px; background: #fff;border:1px solid #fff;font: 300 12px/18px microsoft yahei;  }
.globalsearch .search-btn { width:30px;padding:0;margin:0; height: 30px; cursor: pointer; background: url(../images/search.png) no-repeat center;}


.headerpc ul {float: left;display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
.headerpc ul li {margin: 0 30px; }
.headerpc ul li a {color: #000; font-size: 18px; line-height: 100px; height: 100px; display: inline-block; position: relative; }
.headerpc.active ul li a {color: #666; }
.headerpc ul li a::after {content: ''; position: absolute; left: 0; right: 0; bottom: 10px; margin: auto; width: 0px; height: 2px; 
background-color: #ea5404;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
}
.headerpc ul li:hover a::after,
.headerpc ul li.active a::after {width: 100%; }

.headerpc_inner > ul > li > ul {
  display: none;
  position: fixed;
  top: 100px;
  left: 0;
  background: rgba(0, 0, 0, 0.2);
  width: 100%;
  height: 50px;
  line-height: 50px;
  font-size: 0;
  letter-spacing: 0;
}
.headerpc.active .headerpc_inner > ul > li > ul {
  background: #efefef;
}

.headerpc_inner > ul > li > ul > li {
  width: auto;
  display: inline-block;
  line-height: 50px;
  margin: 0 40px 0 0;
  text-align: center;
}
.headerpc_inner > ul > li:nth-child(1) > ul > li:first-child {
  margin-left: 18px;
}
.headerpc_inner > ul > li:nth-child(2) > ul > li:first-child {
  margin-left: 10px;
}
.headerpc_inner > ul > li:nth-child(3) > ul > li:first-child {
  margin-left: 24px;
}
.headerpc_inner > ul > li:nth-child(4) > ul > li:first-child {
  margin-left: 48px;
}
.headerpc_inner > ul > li:nth-child(5) > ul > li:first-child {
  margin-left: 248px;
}
.headerpc_inner > ul > li:nth-child(6) > ul > li:first-child {
  margin-left: 160px;
}

.headerpc_inner > ul > li > ul > li a {
  text-align: center;
  color: #fff;
  font-size: 14px;
  line-height: 50px;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  height: 50px;
}
.headerpc.active .headerpc_inner > ul > li > ul > li a {
  color: #666;
}
.headerpc_inner > ul > li > ul > li a::after {
  display: none;
}

.headerpc.active .headerpc_inner > ul > li > ul > li a:hover,
.headerpc_inner > ul > li > ul > li a:hover {
  color: #ea5404;
}




.headerSJ {display: none; }



/* header_menu */

.header_menu {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; overflow: hidden; }

.header_menu .menu_bg {position: absolute; background: #000; opacity: 0.1; left: 0; top: 0; width: 100%; height: 100%; }

.header_menu_con {position: absolute; left: 0; width: 36%; background: #424141; height: 100%; -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-transition: -webkit-transform 0.6s ease-in-out 0.2s;
  -moz-transition: -moz-transform 0.6s ease-in-out 0.2s;
  -ms-transition: -ms-transform 0.6s ease-in-out 0.2s;
  -o-transition: -o-transform 0.6s ease-in-out 0.2s;
  transition: transform 0.6s ease-in-out 0.2s;
}

.header_menu.active .header_menu_con {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}

.header_menu_top {padding: 20px; border-bottom: 1px solid #565555; position: relative; }

.header_menu_top ul {display: flex; }

.header_menu_top ul li {margin-right: 40px; }

.header_menu_top ul li a {display: flex; width: 100%; height: 100%; }

.header_menu_top ul li a:hover {text-decoration: underline; color: #fff; }

.header_menu_ico {  width: 24px; margin-right: 5px; }

.header_menu_ico img {width: 100%; }
.header_menu_tit1 h4 {margin: 3px 0 0; font-size: 14px; color: #fff; }

.header_menu_tit h4 {margin: 0; color: #fff; font-size: 18px; line-height: 20px; }
.header_menu_tit h6 {margin: 0; color: #fff; font-weight: normal; font-size: 13px; letter-spacing: 2px; }

.header_menu_top .menu_close {position: absolute; width: 24px; right: 20px; top: 0; bottom: 0; margin: auto; height: 24px; cursor: pointer; }

.header_menu_top .menu_close img {width: 100%; }

.header_menu_bot {height: calc(100% - 65px); }

.header_menu_bot .header_menu_bot_l {width: 50%; float: left; height: 100%; }
.header_menu_bot .header_menu_bot_r {width: 50%; float: left; height: 100%; border-left: 1px solid #565555; box-sizing: border-box; }

.header_menu_bot .header_menu_bot_l li {width: 100%; height: 20%; border-bottom: 1px solid #565555; position: relative;}
.header_menu_bot .header_menu_bot_l li .bg {position: absolute; width: 100%; height: 100%; left: 0; top: 0; opacity: 0; -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.header_menu_bot .header_menu_bot_l li:nth-child(1) .bg {background: url(../images/menu_bg1.jpg) center / cover no-repeat; }
.header_menu_bot .header_menu_bot_l li:nth-child(2) .bg {background: url(../images/menu_bg2.jpg) center / cover no-repeat; }
.header_menu_bot .header_menu_bot_l li:nth-child(3) .bg {background: url(../images/menu_bg3.jpg) center / cover no-repeat; }
.header_menu_bot .header_menu_bot_l li:nth-child(4) .bg {background: url(../images/menu_bg4.jpg) center / cover no-repeat; }
.header_menu_bot .header_menu_bot_l li:nth-child(5) .bg {background: url(../images/menu_bg5.jpg) center / cover no-repeat; }
.header_menu_bot .header_menu_bot_l li:hover .bg {opacity: 1; }
.header_menu_bot .header_menu_bot_l li a {
  padding: 28px 20px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  position: relative;
  z-index: 1;
}
.header_menu_bot .header_menu_bot_r li a {display: block; padding: 25px 20px; color: #fff; font-size: 18px; background: transparent;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.header_menu_bot .header_menu_bot_r li a:hover {background: #333 }
.header_menu_bot ul li .header_menu_ico {width: 28px; }
.header_menu_bg {width: 100%; height: 100%; opacity: 0; position: absolute; left: 0; top: 0; -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.header_menu_bot ul li:hover .header_menu_bg {opacity: 1; }


@media only screen and (max-width:1440px) {
.headerpc .logo{width: 100px;}
}

@media only screen and (max-width:1220px) {
.headerpc .topbar { font-size: 16px;}
.headerpc ul li a{font-size: 16px;}
.headerpc ul{margin-left: 50px;}
.headerpc ul li{margin:0 20px;}
.headerpc .topbar span{font-size: 14px;margin-left: 10px;}
.headerpc .topbar a{font-size: 14px; height: 30px; width: 30px;line-height: 30px;}
}


/* header_menu */

@media only screen and (max-width:920px) {
  .back_top {display: none!important; }
 .headerpc {display: none!important; }

  .headerSJ {display: block; position: fixed; left: 0px; top: 0px; z-index: 9999; width: 100%; background-color: #fff; padding: 0px 0px; }

  .headerSJ .headerSC {padding: 0px 25px; height: 60px; }

  .headerSJ .logo {float: left; line-height: 60px; }

  .headerSJ .logo img {height: 32px; }

  .headerSJ .navbar {position: relative; float: right; margin-top: 22px; margin-right: 0px; margin-bottom: 8px; 
    background-color: transparent; background-image: none; border: none; outline: none; padding: 0; }

  .headerSJ .navbar .icon-bar {display: block; width: 18px; height: 2px; border-radius: 1px; background-color: #000; }

  .headerSJ .navbar .icon-bar + .icon-bar {margin-top: 4px; }

  .headerSJ .navwrap {position: fixed; top: 0px; left: -50%; width: 50%; height: 100%; z-index: 1100; background-color: #000; opacity: 0; }

  .headerSJ .navwrap .nav {padding: 10px 5% 0px 5%; }

  .headerSJ .navwrap .nav li {line-height: 42px; border-bottom: 1px solid #232530; padding: 0px 5%; }

  .headerSJ .navwrap .nav li a {display: block; color: #fff; font-size: 16px; }

  .headerSJ .navbg {position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 1001; display: none; }

  .headerSJ .navbg .closeSJ { position: absolute; width: 28px; height: 28px; background: #000; text-align: center; right: 22px; top: 18px;  }

  .headerSJ .navwrap .nav .SJbod {display: none; }

  .headerSJ .navwrap .nav .SJbod dd a {height: 36px; line-height: 36px; font-size: 14px; }

  .headerSJ .navwrap .nav .plus a {background: url(../images/plus.png) right center no-repeat; }

  .headerSJ .navwrap .nav .minus a {background: url(../images/minus.jpg) right center no-repeat; }

  .headerSJ .navwrap .nav .lan .SJtit a {display: inline-block; }

  .headerSJ .navwrap .nav .lan .SJtit span {color: #fff; font-size: 16px; display: inline-block; padding: 0px 5px; }
}



