
#top_wrap {
	position:relative; left:0; top:0; z-index: 50; width:100%; height:120px; 
}
#top_wrap .top_grid {
	top: 0px; left:0; width: 100%; padding:0 5%; border-bottom:1px solid #fff; display:inline-block;
	box-shadow: 0px 2px 3px rgba(0,0,0,0.0); opacity: 1; z-index:30;
	background-color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s ease-out; transition:0.4s ease-out;  }
#top_wrap .on.top_grid {
	margin-top: -40px; padding:0 5%;
	box-shadow: 0px 2px 3px rgba(0,0,0,0.1); background-color: rgba(255, 255, 255, 1); 
	left:0; position: fixed;
}
#top_wrap .top_grid::after {
	left: 0px; top: 40px; width: 100%; height: 1px; background:#eee; position: absolute; z-index: 0; content: "";
}

@media screen and (max-width:1400px) {
#top_wrap .top_grid {
 padding:0 3%;}
 #top_wrap .on.top_grid {
	padding:0 3%;}
}

@media (max-width:991px){
#top_wrap {
height:70px;}
#top_wrap .top_grid {
	background-color: rgb(255, 255, 255); padding:0;}
#top_wrap .on.top_grid {
	margin-top: 0px; padding:0;}
#top_wrap .top_grid::after {display:none;}
}



.top_util {
	margin: 0px auto; border: 0px solid rgb(170, 170, 170); height: 40px; 
	font-size: 0.8em; line-height:1.6em; position: relative; z-index:20;
}
.top_util .cell {}


.top_util .button {
height:21px; border:1px solid #ccc; border-radius:3px; font-size: 1em;  
margin-top:0; padding:0px 10px; overflow:hidden; } 


.top_util .side_menu {float:left; margin-top:1px; }
.top_util .side_menu a {margin:0 10px;}
.top_util .side_menu .lab {font-weight:700;}
.top_util .side_menu .lab:hover {color:#aaa;}


.top_util .social {
	margin-top: 0px; float: left;}
.top_util .social ul {
	overflow: hidden; 
}
.top_util .social li {
float: left; margin:0 3px; border-radius: 3px; text-align:center;
	border:1px solid #bbb; transition:0.2s ease-out; width: 25px; height: 21px; overflow: hidden; 
	opacity: 1; -webkit-transition: all 0.2s ease-out; font-size:1.1em; line-height:1.4em;
}
.top_util .social li:hover {opacity:0.7;} 
.top_util .social li a {width:100%; height:100%; display:inline-block;}
.top_util .social li img { display:none; width:100%;}



.top_util .top_login { 
	float: left; margin-top:0px;
}
.top_util .top_login li {
	margin-left: 3px; float: left;
}
.top_util .top_login li a {
	border:1px solid #ccc; transition:0.2s ease-out; width: 60px;  text-align: center; color: rgb(85, 85, 85);
	display: block; background-color: rgba(255, 255, 255, 0.6); -webkit-transition: all 0.2s ease-out;
	padding:0;
}
.top_util .top_login .button {
	background:#eee;
}


.top_util .falldown { 
	 float: left; position: relative;
}
.top_util .falldown .button { 
	width: 110px; text-align: center; color: #fff; 
	background:#83a1bd; border-color: transparent; transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;  
}
.top_util .falldown:hover .button {}
.top_util .falldown ul {
	border: 1px solid #ccc; left: 0px; top: 22px; width: 110px; display: none; position: absolute; z-index: 10; 
	background-color: rgb(255, 255, 255);
}
.top_util .falldown ul li {width:100%;}
.top_util .falldown ul li a {
	text-align: center; line-height: 35px; font-size: 1em; 
	border-bottom-color: rgb(221, 221, 221); border-bottom-width: 1px; border-bottom-style: solid; display: block; 
	transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;
}
.top_util .falldown ul li:hover a {
	color: rgb(102, 102, 102);  position: relative; background:#eee;
}
.top_util .falldown ul li:hover a::before {
	left: 5px; top: 19px; height: 1px; position: absolute; content: ""; background-color: rgb(51, 51, 51);
}
.top_util .falldown ul li:last-child a {
	border-bottom-color: currentColor; border-bottom-width: medium; border-bottom-style: none;
}


.dropdown {
	position:relative; display:inline-block; z-index:10; float:left;}
.dropdown .button {
	min-width:100px; height:21px; border:1px solid #f67575; 
	font-size: 1em; text-transform:uppercase; background-color: #f67575; color:#fff;
	margin-top:0 !important; padding:0px 20px 0; 
}
.dropdown .button:hover {
	 color:#fff;}
	 .dropdown.open .button {
	 background:#666; border:1px solid transparent;}
.dropdown-menu {
  position: absolute; top: 100%; left: 0;
  z-index: 10; 
  display: none;
  min-width: 100px;
  padding: 5px 0; margin: -7px 0 0 !important;
  background-color: #fff; border: 1px solid #ccc; border-radius: 1px;
    text-align:center;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, .0);
          box-shadow: 0 3px 6px rgba(0, 0, 0, .0);
}
.dropdown-menu > li {width:100%;}
.dropdown-menu > li > a {
  display: block;
  padding: 5px 10px;
  clear: both;
  font-family:'open sans','nanum gothic',sans-serif;
    font-size: 1em;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-color: #eee;
}
.dropdown-menu > li:first-child > a {
padding: 5px 0px;}


.top_util .lang { 
	float: left; }
.top_util .lang li.button {
	margin: 0 3px; float: left; line-height:0; border:1px solid #aaa; border-radius:0; padding:0; 
	opacity:0.5;}
.top_util .lang li:hover {
	opacity: 0.5;}
.top_util .lang li.on {
	opacity: 0.5;}


@media screen and (max-width:991px){
#top_wrap .top_util { display:none;
	padding: 5px 0px 0px; width: 100%;
}
#top_wrap .top_util .container {padding:0;}
.top_util .social {
	display: none;
}
.top_util .top_login {
	margin-right: 5px;
}
}




#top_wrap .nav_wrap {
	margin: 0px auto; padding: 0px ; 
}
#top_wrap .nav_wrap .logo_grid {
	 width: 25%; overflow: hidden; float: left; position: relative; background-color: transparent;
}
#top_wrap .nav_wrap .nav_grid {
	width: 75%; float: right; position: relative;
}

@media screen and (max-width:991px){
#top_wrap .nav_wrap {
	padding: 0px; width: 100%; background-color: transparent;
}
#top_wrap .nav_wrap .container {padding:0;}
.nav_wrap .grid { 
	display:block !important;
}
#top_wrap .nav_wrap .logo_grid { 
	width: 100%; height:70px;
}
#top_wrap .nav_wrap .nav_grid {
	width: 100%;
}
}



.logo_grid .logo {
	 width:210px;}
.logo_grid .logo img {
max-width:100%;
}
.logo_grid .logo a {
	text-align: center; display: inline-block; position: relative; max-width: 100%; background-color: transparent;
}

.logo-light {display:none;}

.dual .logo-dark {display:none;}
.dual .logo-light {display:inline-block;}

.on.dual .logo-dark {display:inline-block;}
.on.dual .logo-light {display:none;}

.logo_grid .m_button {display: none; 
	width: 35px; height: 35px; text-align: center; color: rgb(255, 255, 255); 
	cursor: pointer; background-color: rgb(17, 17, 17);
}

@media screen and (max-width:991px){
.logo_grid .logo {
	width:170px; margin: 20px 0 0 20px; }
.logo_grid .m_button {
	border-radius: 2px; top: 18px; right: 20px; display: block; position: absolute; 
	}
.logo_grid .m_button i { font-size:1.1em; line-height:2.2em;}
.logo_grid .on.m_button {
	color: rgb(255, 255, 255); background-color: #777;
}
}




/* main menu */
.main_nav {
	margin: 0px auto; line-height:0; transition:0.4s ease-out; -webkit-transition: all 0.4s ease-out;
}
.on.main_nav {
}
.main_nav > ul {
	float: right; }
.main_nav > ul.cell > li {
}
.main_nav > ul > li {
	border-left-color: rgb(255, 255, 255); border-left-width: 0px; border-left-style: solid; 
	float: left; position: relative; background-color: transparent;
}
.main_nav > ul > li:first-child {
	border: currentColor;
}
.main_nav > ul > li:hover {
	background-color: transparent;
}
.main_nav > ul > li > a {
	margin: 0px; padding:0 24px; height: 80px; text-align: center; color: #222; 
	line-height: 85px; font-size: 1.1em; font-weight: 600; text-transform:uppercase;
	border-right-color: rgb(68, 68, 68); border-right-width: 0px; border-right-style: solid; display: block; 
	background-color: transparent; transition:0.2s ease-out; -webkit-transition: all 0.2s ease-out;
}
.main_nav > ul > li:hover > a {
	color: #888; }

.dual .on.main_nav > ul > li > a {
color: #222; }
.dual .on.main_nav > ul > li:hover > a {
	color: #888; }

.main_nav .social {
	margin: 32px 20px 0; }
.main_nav .social ul {
	overflow: hidden;}
.main_nav .social li {
float: left; margin:0 3px; border-radius: 3px; text-align:center;
	border:1px solid #bbb; transition:0.2s ease-out; width: 25px; height: 21px; overflow: hidden; 
	opacity: 1; -webkit-transition: all 0.2s ease-out; font-size:0.9em; line-height:1.5em;
}
.main_nav .social li a {width:100%; height:100%; display:inline-block;}
.main_nav .social li:hover a {color:#888;} 
.main_nav .social li img { display:none; width:100%;}

.main_nav .add a {color:#555;}

@media screen and (min-width:992px)
{
#top_wrap .top_grid .nav_wrap .main_nav {
	display: block !important; position: relative;
}
}

@media (max-width:1400px) {
.main_nav > ul > li > a {}
}

@media (max-width:1199px){
.main_nav > ul > li > a {
padding:0 18px; font-size:1.05em;}
.main_nav .social {
display:none;}
}

@media (max-width: 991px){
#top_wrap .nav_wrap .main_nav {
	width: 100%; right: 0px; padding-top: 0px; display: none; position: absolute; opacity: 1;
	box-shadow:0px 1px 3px rgba(0, 0, 0, 0.3);  background:#fff;
}
#top_wrap .nav_wrap .main_nav > ul {
	overflow: auto; margin-top: 0px; max-height: 500px; width:100%; 
}
#top_wrap .nav_wrap .main_nav > ul > li {
	width: 100%; border-top:1px solid #ddd;
}
#top_wrap .nav_wrap .main_nav > ul > li:last-child {
	border-bottom-color: #fff; border-bottom-width: 1px; border-bottom-style: solid;
}
#top_wrap .nav_wrap .main_nav > ul > li > a {
	margin: 0px; height: 50px; line-height: 50px; display: block; background-color: rgba(255,255,255, 1);
}
#top_wrap .main_nav {
	transition:none; -webkit-transition: none;
}
#top_wrap .on.main_nav {
	transition:none; padding-right: 0px; -webkit-transition: none;}
}



.sub_nav {
	left: 0px; width: 100%; padding-top: 0px; border:1px solid #ddd; border-top-width:0; 
	display: none; position: absolute; box-sizing: border-box; background-color: transparent;
}
.sub_nav a {
	padding: 0px 10px; 	height: 50px; text-align: center; color: rgb(85, 85, 85); 
	line-height: 50px; font-size: 0.85em; 
	display: block; position: relative; background-color: rgba(255, 255, 255, 1);
}
.sub_nav a:hover {
	color: rgb(0, 0, 0); font-weight: 500; background-color:#eee;
}

@media screen and (max-width:1199px){
.sub_nav a {
font-size: 0.8em;}
}

@media screen and (max-width:991px){
#top_wrap .nav_wrap .main_nav > ul > li > .sub_nav {display:none !important;
	padding: 0px; left: 0px; top: 0px; position: relative;
}
}




