/* -------------------------------- 

1. Auto-Hiding Navigation - Simple

-------------------------------- */
.headerwrap {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 138px;
  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: 38px;
  background-color: #f3f3f3;
	}
	
.gatewrapper .gate {  width: 1300px;  margin: 0 auto;  *zoom: 1;}
.gatewrapper .gate:after {  content: "";  display: block;  clear: both;}	

.gatewrapper .rightgate ul {  border-right: 1px solid #e4e4e4;  *zoom: 1;}
.gatewrapper .rightgate ul li {  float: left; border-left: 1px solid #e4e4e4; padding: 0 8px 0 28px; }
.gatewrapper .rightgate ul li:last-child { border-right: 1px solid #e4e4e4;}
.gatewrapper .rightgate ul li a {  display: block;  padding-top: 10px;  height: 28px;  text-align: center;  font-size: 13px;  line-height: 18px;  color: #777;}
.gatewrapper .rightgate ul li a:hover {  background: #eff1f4;}
.gatewrapper .rightgate ul .icon01 { background: url("/images/common/gate_icon01.png") no-repeat 5% 47%}
.gatewrapper .rightgate ul .icon02 { background: url("/images/common/gate_icon02.png") no-repeat 5% 47%}
.gatewrapper .rightgate ul .icon03 { background: url("/images/common/gate_icon03.png") no-repeat 5% 47%}
.gatewrapper .rightgate ul .icon04 { background: url("/images/common/gate_icon04.png") no-repeat 5% 47%}
.gatewrapper .rightgate ul .icon05 { background: url("/images/common/gate_icon05.png") no-repeat 5% 47%}
.gatewrapper .rightgate ul .icon06 { background: url("/images/common/gate_icon06.png") no-repeat 5% 47%}

.gate .state {float: left; margin-left: 10px}
.gate .state ul li {  float: left; padding: 0 5px}
.gate .state ul li img { width: auto}
.gate .state ul li:hover { cursor: pointer}

.header {width:100%; background:#fff; z-index:21; margin:0 auto; padding: 26px 0; overflow: hidden; text-align:center }

/*로고*/
.header h1 {width:100%; margin: 0 auto !important; text-align:center !important; overflow: hidden;}
.header h1 img { margin: 0 auto !important; text-align:center !important; overflow: hidden; width: auto}
.header h1:hover { cursor: pointer}

	
@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: #7000d8;
  /* 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 ;  box-sizing: border-box ; padding-right: 95px}
.gnb ul li:last-child { padding-right: 0}
.gnb ul li a{color:#ffffff; font-size:18px; font-weight:600;  text-decoration:none; line-height: 52px; letter-spacing:-1px}
.gnb ul li a:hover { color:#fff;  }

#snb { display: none; width:100%; background:#fff; box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px}
#submenuw {width:1300px; margin:0 auto;  background:#fff; overflow: hidden; padding:10px 0 20px 0}
#submenu {width:100%; margin:0 auto; float: left}
#submenu1 { float:left; text-align:left; width:205px;}
#submenu2 { float:left; text-align:left; width:210px;}
#submenu3 { float:left; text-align:left; width:172px;}
#submenu4 { float:left; text-align:left; width:170px;}
#submenu5 { float:left; text-align:left; width:134px;}
#submenu6 { float:left; text-align:left; width:155px;}
#submenu7 { float:left; text-align:left; width:174px;}
#submenu8 { float:left; text-align:left; }
#submenu a { color:#363636; font-size:14px; text-align:left; text-decoration:none; line-height:28px; font-weight:500; letter-spacing:-1px}
#submenu a:hover { color:#7000d8}
#submenu .submenutitle { background: #7000d8; color:#ffffff; font-size:18px; font-weight:600; padding: 12px 10px; letter-spacing:-1px; margin: 10px 20px 5px 0}
#submenu .submenubar { margin: 5px 0; border: 1px dashed #dedede; margin-right: 20px}	
#submenu .submenubar2 { margin: 5px 0; border: 1px dashed #dedede; width:112px }