 
/* Top Banner */
 

/* Header */
#header_wrap { }

h1 {white-space:nowrap; font-family:'思源黑体 Regular' !important}

 header#header {
	position: fixed;
	left:0; top:0;
	z-index: 9999999999999999999999999999999999999;
	width: 100%; height:75px;
	padding: 0;	margin: 0px auto;
	
 	box-sizing: border-box;
	border-bottom:1px solid #ddd
 }

header#header .in  {max-width:100%; padding:0 3%; box-sizing:border-box;   position:relative; display:flex; align-items:center; height:100%}
header#header h1 {
	text-align: right; font-size:21px; color:#111;
	display:flex; align-items:center;  line-height:0;   
	 
}
header#header h1 img.color {display:inline-block}
header#header h1 img.w {display:none}
header#header h1 img { margin-right:10px }





header#header nav#gnb {margin-left:6vw}
header#header nav#gnb > ul { overflow: hidden; display:flex; }
header#header nav#gnb > ul > li { display:inline-block;  box-sizing:border-box; margin-right:3vw }
  
header#header nav#gnb > ul > li > a {
	width:100%; height:75px;
	white-space:nowrap; 
	font-size:1rem;
	display:flex; align-items:center; justify-content:Center; 
	color: #333;
	position:relative; text-align:center;
	text-shadow: 2px 2px 3px rgba(0,0,0,.1);
}
 
 
 
 header#header nav#gnb > ul > li > ul {
	display:none;
  	padding-top:38px;
	width:20%;  
	height:255px; 
	box-sizing:border-box; 
	left:0; position:absolute;
	text-align:left; padding-left:30px;
	border-right:1px solid #ddd;
	border-bottom:1px solid #ddd; top:75px
  	 
}


header#header nav#gnb > ul > li:first-child > ul {border-left:1px solid #ddd}
header#header nav#gnb > ul > li:nth-child(2) > ul {left:20%}
 header#header nav#gnb > ul > li:nth-child(3) > ul {left:calc(20% * 2)}
 header#header nav#gnb > ul > li:nth-child(4) > ul {left:calc(20% * 3)}
 header#header nav#gnb > ul > li:nth-child(5) > ul {left:calc(20% * 4)}
 header#header nav#gnb > ul > li:nth-child(6) > ul {left:calc(20% * 5)}
 header#header nav#gnb > ul > li  > ul:before {position:relative; z-index:99; content:'HOME'; font-size:1.3em; font-weight:600; width:100%; display:inline-block; padding-bottom:15px}
 header#header nav#gnb > ul > li:nth-child(2) > ul:before {content:'About US';  }
 header#header nav#gnb > ul > li:nth-child(3) > ul:before {content:'Service';  }
 header#header nav#gnb > ul > li:nth-child(4) > ul:before {content:'News Center';  }
 header#header nav#gnb > ul > li:nth-child(5) > ul:before {content:'Contact US';  }
 

 
header#header nav#gnb > ul > li ul li:after    {content:''; width:100%; height:100%; position:absolute; left:0; top:0; background-color:#fff; transition: all 0.2s ease-out;  }
header#header nav#gnb > ul > li:hover ul li:after    { background-color:var(--main_c);  }
header#header nav#gnb > ul > li:hover  > ul  {border-right:1px solid var(--main_c) }
header#header nav#gnb > ul > li:first-child:hover > ul {border-left:1px solid var(--main_c)}
header#header nav#gnb > ul > li:hover > ul {border-bottom:1px solid var(--main_c)}

header#header nav#gnb > ul > li > ul > li {  background:none;   width:100%; padding:4.5px 0; margin:0 }
header#header nav#gnb > ul > li > ul > li > a {
	position: relative;
	color: #333;
	line-height:1.3;
	font-size:1em;
	 padding:0; 
	font-weight: 400;
	z-index:99
	 
}

 

header#header nav#gnb > ul > li:hover > ul:before {  color:#fff}
header#header nav#gnb > ul > li:hover > ul > li > a {  color:#fff}
header#header nav#gnb > ul > li > ul > li > a:hover {text-decoration:underline;  }
  
 
.menu-fixed {
      
	  position: fixed;
     width:100%; display:inline-block; 
	  top: 0px; width:100%;  height:54px;
     text-align:center;
	  left:0px;  background-color:#fff; 
    z-index:9999999999999999999999999999999999999999; 
	}

.menu-fixed li {font-size:19px; color:#555;  font-weight:500; display:inline-block; padding:0 50px; line-height:54px; }

.main-menu {display:none}
.menu-fixed  { display:inline}

.scroll header#header { background-color:#fff;  border-bottom:1px solid #fff;   height:75px  }
.scroll header#header .in {  border-bottom:none}
.scroll header#header nav#gnb > ul > li > a  {color:#333}
.scroll header#header div.last_div a { color:#333; }
.scroll header#header div.last_div i { color:#333; }
.scroll header#header h1 img.color {display:block}
.scroll header#header h1 img.w {display:none}
.scroll header#header h1 {color:#111}

header#header:hover { background-color:#fff;  border-bottom:1px solid #ddd;  height:75px  }
header#header:hover .in {  border-bottom:none}
header#header:hover nav#gnb > ul > li > a  {color:#333}
header#header:hover div.last_div a { color:#333; }
header#header:hover div.last_div i { color:#333; }
header#header:hover h1 img.color {display:block}
header#header:hover h1 img.w {display:none}
header#header:hover h1 {color:#111}



#header div.last_div {position:relative; width:50px; margin-left:auto;   height:100%; display:flex; align-items:center; justify-content:flex-end; width:100px; }
#header div.last_div p { position:absolute;  width:100%;  left:0; top:0; height:70px; display:flex; align-items:center; justify-content:center; color:#333; }
header#header div.last_div i {font-size:21px;  margin-right:7px}

#header div.last_div .down_div { background-color:#fff; border-radius:10px; box-shadow: 0px 3px 20px 1px rgba(0, 0, 0, 0.10);  padding:10px 0;  width:100%;  left:0; top:60px; font-size:15px; display:none; position:absolute; z-index:9999}
#header div.last_div p:hover + .down_div {display:block; }
#header div.last_div  .down_div:hover {display:block; }

#header div.last_div .down_div a {display:inline-block; width:100%; text-align:center; padding:3px 0; color:#999;  }
#header div.last_div .down_div a:hover  {color:var(--main_c)}




#m_top {width:100%; height:60px; display:flex; justify-content:space-between; align-items:center; background:rgba(255,255,255,1); position:fixed; top:0; left:0; z-index:99999999999;  padding:0 4%; box-sizing:border-box}
#m_top h1 {font-size:18px; letter-spacing:0;  color:#333;  height:100%; display:flex; align-items:center;  font-weight:700 }
#m_top h1 img {margin-right:10px} 
#m_top.nav-up {top:-80px; }

 @media all and (max-width:1400px) {
  header#header nav#gnb {margin-left:4vw}

}

 
@media all and (min-width:1200px) {
   #m_top {display:none} 
}

 @media all and (max-width:1200px) {
		header {display:none}
		.logo { text-align: right; font-size:18px; color:#333;  font-weight:700; display:flex; align-items:center; letter-spacing:0; }
		a.logo {color:#333}
		.logo img { margin-right:10px }

} 