
/* -------------------------------- 

1. Auto-Hiding Navigation - Simple

-------------------------------- */
.headerwrap {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 168px;
  background-color: #ffffff;
  /* Force Hardware Acceleration */
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  will-change: transform;
  -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s;
  transition: transform .5s;
  transition: transform .5s, -webkit-transform .5s;
}
.headerwrap::after {
  clear: both;
  content: "";
  display: block;
}
.headerwrap.is-hidden {
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
}

/* 상단공통 */
.gatewrapper {
  position: relative;
  z-index: 31;
  clear: both;
  width: 100%;
  height: 33px;
  background-color: #f3f3f3;
  border-bottom: 1px solid #e9edf3;
	}
	
.gatewrapper .gate {  width: 1300px;  margin: 0 auto;  *zoom: 1;}
.gatewrapper .gate:after {  content: "";  display: block;  clear: both;}
	
.gatewrapper .leftgate ul {  border-right: 1px solid #e9edf3;  *zoom: 1;}
.gatewrapper .leftgate ul:after {  content: "";  display: block;  clear: both;}
.gatewrapper .leftgate ul li {  float: left;  width:70px;  border-left: 1px solid #e9edf3;}
.gatewrapper .leftgate ul li a {  display: block;  padding-top: 9px;  height: 24px;  text-align: center;  font-size: 13px;  line-height: 16px;  color: #777; }
.gatewrapper .leftgate ul li a:hover {  background: #eff1f4;}
.gatewrapper .leftgate ul li.current a {  background: #fff;  height: 25px;  color: #0088d0;}

.gatewrapper .rightgate ul {  border-right: 1px solid #e9edf3;  *zoom: 1;}
.gatewrapper .rightgate ul:after {  content: "";  display: block;  clear: both;}
.gatewrapper .rightgate ul li {  float: left;  width: 80px;  border-left: 1px solid #e9edf3;}
.gatewrapper .rightgate ul li:after {  content: "|"; right: 0px; top: 2px; position: absolute}
.gatewrapper .rightgate ul li:after:last-child {display: none}
.gatewrapper .rightgate ul li a {  display: block;  padding-top: 9px;  height: 24px;  text-align: center;  font-size: 13px;  line-height: 16px;  color: #777;  -webkit-transition: all ease .3s;  transition: all ease .3s;}
.gatewrapper .rightgate ul li a:hover {  background: #eff1f4;}
.gatewrapper .rightgate ul li.current a {  background: #fff;  height: 25px;  color: #0088d0;}
	


@media only screen and (min-width: 1400px)and (min-width:1300px){
  .headerwrap { height: 168px;  }
	#header_m {display: none !important}
}

.header {
  width:1300px; height:134px; background:#fff; z-index:21; margin:0 auto;  display: inline-block;
}

/*로고*/
.logo { float:left ; width:921px;}
.logo a { display:block; width:284px; height:39px; margin:0 auto; text-align:center; padding-top:47px; padding-left: 379px}
	
/*전화번호*/
.tel { float:right; width:379px; text-align:right; margin-top:38px}

@media only screen and (min-width: 1px) {
  .header {
    /* vertically align its content */
    display: table;
  }
  

/* -------------------------------- 

2. Auto-Hiding Navigation - with Sub Nav

-------------------------------- */
.gnb_contain {
  position: relative;
  z-index: 31;
  clear: both;
  width: 100%;
  height: 55px;
  background-color: #1c2032;
  /* Force Hardware Acceleration */
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  will-change: transform;
  -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s;
  transition: transform .5s;
  transition: transform .5s, -webkit-transform .5s;
}



.gnb {width:1300px; height:55px; margin:0 auto; cursor:pointer}
.gnb ul{width:1300px; float:left; padding:0;}
.gnb ul li {float:left ; padding-right:4em; }
.gnb ul li:last-child {float:left ; padding-right:0; }
.gnb ul li a{color:#ffffff; font-size:20px; font-weight:600; text-decoration:none;}
.gnb ul li a:hover { color:#fff; font-weight:600;}


#snb { display: none; width:100%; height:300px; background:#f3f3f3;}
#submenuw {width:100%; margin:0 auto; height:360px; background:#f3f3f3;}
#submenu {width:1300px; height:360px; margin:0 auto; padding-top:10px}
#submenu1 { float:left; text-align:left; width:132px;}
#submenu2 { float:left; text-align:left; width:151px;}
#submenu3 { float:left; text-align:left; width:137px;}
#submenu4 { float:left; text-align:left; width:144px;}
#submenu5 { float:left; text-align:left; width:152px;}
#submenu6 { float:left; text-align:left; width:165px;}
#submenu7 { float:left; text-align:left; width:154px;}
#submenu8 { float:left; text-align:left; width:157px;}
#submenu9 { float:left; text-align:left;  height:300px}
#submenu a { color:#323232; font-size:0.88em; text-align:left; text-decoration:none; line-height:32px; font-weight:600; letter-spacing:-1px}
#submenu a:hover { color:#620f0d}

	
/*주메뉴_모바일*/
#header_m {width: 100%; border-bottom: 1px solid #d2d2d2; position: fixed; height: 64px; background: #ffffff; z-index: 99999;  }
#header_m h1 {text-align: center; padding-top:20px; padding-bottom: 20px;}
#header_m h1 img {width: 100px}
#header_m h2.seem {left: 10px; top: 10px; width: 32px; height: 30px; display: block; position: absolute; cursor: pointer;}
#header_m .login { background:#620f0d; padding:10px 0 10px 10px; color:#ffffff;  width: 100%; text-align:left; font-size: 0.95em; margin-top: 50px; box-sizing: border-box}
#header_m .login a { color:#ffffff; padding:0 5px; font-size: 0.95em}
#header_m #gnb_m {margin: 0px; padding: 0px; width: 200px; height: 100%;}
#header_m #gnb_m li.dep1 {margin: 0px; padding: 15px 0px 12px 10px; color: #1f1b1b; border-bottom-color: #3e4151; border-bottom-width: 1px; border-bottom-style: solid;}
#header_m #gnb_m li.on.dep1 {padding-bottom: 0px; margin-top: 0px;}
#header_m #gnb_m li.dep1 a.d1 {color: rgb(255, 255, 255); padding-left: 10px; font-size: 16px; font-weight:600;}
#header_m #gnb_m li.on.dep1 a.d1 {color: #0088d0; font-size: 16px; font-weight:600;}
#header_m #gnb_m li.dep1 ul {background: #f3f3f3; margin: 12px 0px 0px -10px; padding: 5px 0 5px 20px; width: 100%; display: none;}
#header_m #gnb_m li.dep1 ul li.dep2 {padding: 8px 0; color: #1f1b1b; font-size: 0.85rem;  border-bottom-color: currentColor; border-bottom-width: medium; border-bottom-style: none; position: relative;}
#header_m #gnb_m li.dep1 ul li.dep2 ul {background: #f3f3f3; margin: 12px 0px 0px -20px; padding: 0px 17px 3px 20px; width: 173px; display: block;}
#header_m #gnb_m li.dep1 ul li.dep2 ul li.dep3 {padding: 10px 0; color: #1f1b1b; font-size: 0.85rem; border-bottom-color: currentColor; border-bottom-width: medium; border-bottom-style: none; position: relative;}
#header_m #gnb_m li.dep1 ul li.bold.dep2 {font-weight: 600;}
#header_m #gnb_m li.dep1 ul li.dep2 a {color: #1f1b1b;}
#header_m #gnb_m li.dep1 ul li.dep2 a:visited {  color:#1f1b1b !important}
#header_m #gnb_m li.dep1 ul li.on.dep2 a {color: #0088d0;}
#header_m #gnb_m li.dep1 ul li.bold.dep2 ul li.dep3 {font-weight: 600;}
#header_m #gnb_m li.dep1 ul li.dep2 ul li.dep3 a {color: #1f1b1b; font-weight: normal;}
#header_m #gnb_m li.dep1 ul li.on.dep2 ul li.dep3 a {color: #0088d0;}
#header_m .g_close {top: 16px; right: 18px; display: block; position: absolute;}

	#header_m .icon{width: 100%; clear: both; position: relative; bottom: 0; z-index: 9999; padding: 40px 20px 10px 20px; box-sizing: border-box; float: left}
	#header_m .icon ul{ display: block !important}
	#header_m .icon li{float: left; }
	#header_m .icon li:nth-child(1){background: #00c63b url("/images/common/menu_icon01.png") no-repeat left 50%; background-size: 31px 31px; width: 31px; height: 31px; margin-right: 5px; border-radius: 50px}
	#header_m .icon li:nth-child(2){background: #ffffff url("/images/common/menu_icon02.png") no-repeat left 50%; background-size: 31px 31px; width: 31px; height: 31px; margin-right: 20px; border-radius: 50px}
	#header_m .icon li:nth-child(3){background: #34bfe4 url("/images/common/menu_icon03.png") no-repeat right 50%; background-size: 31px 31px; width: 31px; height: 31px; margin-right: 5px; border-radius: 50px}
	#header_m .icon li:nth-child(4){background: #de2910 url("/images/common/menu_icon04.png") no-repeat right 50%; background-size: 31px 31px; width: 31px; height: 31px; margin-right: 5px; border-radius: 50px}

/* sns */
#mask {
  position:absolute;
  left:0;
  top:0;
  z-index:99;
  background-color:#000;
  display:none;
}
  
.window {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  display:none;
  z-index:999;
  padding:0;
}


#gnbw {background-color: #1c2032; left: 0; top: 0px; width: 200px; z-index: 999999; height:100%; position: fixed; overflow-y : auto; overflow-x: hidden;}
	

