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

1. Auto-Hiding Navigation - Simple

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

#header_m {display: none !important}

.headerwrap {
  display: block !important ;
  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;}
	

/* 시술과목 더보기 버튼 */
.menubt_more {clear: both; width: 100%; border : 1px solid #e9e9e9; float: left; padding: 8px 0; margin-top: 8px}
.menubt_more p { text-align: center ;font-size: 0.85rem; overflow: hidden ; color: #181818; font-family: 'notokr-regular';  letter-spacing: normal; }
.menubt_more span { color: #1f4392; font-family: 'notokr-bold'}
.menubt_more img{ width: 10px; padding: 6px 0 0 5px}
.hidden_shortcut {display:none;}
.menu_shortcut {display:none;}


.header { width:1300px; height:134px; background:#fff; z-index:21; margin: 0 auto !important}

/*로고*/
.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}

.gnb_contain {
  position: relative;
  z-index: 31;
  clear: both;
  width: 100%;
  height: 55px;
  background-color: #000000;
  /* 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; text-decoration:none; line-height: 52px; font-weight: 600}
.gnb ul li a:hover { color:#fff;  }


#snb { display: none; width:100%; height:300px; background:#f3f3f3;}
#submenuw {width:100%; margin:0 auto; height:320px; background:#f3f3f3;}
#submenu {width:1300px; height:320px; margin:0 auto; padding-top:10px}
#submenu1 { float:left; text-align:left; width:132px;}
#submenu2 { float:left; text-align:left; width:155px;}
#submenu3 { float:left; text-align:left; width:137px;}
#submenu4 { float:left; text-align:left; width:149px;}
#submenu5 { float:left; text-align:left; width:155px;}
#submenu6 { float:left; text-align:left; width:166px;}
#submenu7 { float:left; text-align:left; width:157px;}
#submenu8 { float:left; text-align:left; width:156px;}
#submenu9 { float:left; text-align:left;  height:320px}
#submenu a { color:#323232; font-size:0.88em; text-align:left; text-decoration:none; line-height:32px; font-weight:500; letter-spacing:-1px}
#submenu a:hover { color:#0088d0}



@media all and (max-width:1300px) and (min-width:768px) {
	
.headerwrap { display: none !important}
#header_m {display: block !important}
	
/*주메뉴_모바일*/
#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; display: block; position: absolute; cursor: pointer;}
#header_m h2.seem img {width: 50px}
#header_m .top_tel { right: 15px; top: 15px;display: block; position: absolute; cursor: pointer !important}
#header_m .top_tel img {width: 38px}
	
/* 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: #ffffff; left: 0; top: 0px; width: 200px; z-index: 999999; height:100%; position: fixed; overflow-y : auto; overflow-x: hidden !important}
	
.accordion {list-style-type:none;padding:0;margin:0; clear: both; background: #ffffff;}
.accordion ul {padding:0;margin:0;width: 100%;}
.accordion li {cursor:pointer;list-style-type:none; margin:0;width:100%; padding: 0; color: #333333; border-bottom: 1px solid #dbdbdb;}
.accordion li.active > a { background: url('/images/n_common/minus.png') no-repeat 94% 50%; background-size: 10px; color: #333333; letter-spacing: -1px; font-weight: 600}
.accordion li div {padding:0px;clear:both;float:left;width:100%;}
.accordion a { font-size:1.1rem ;color:#333333;padding: 20px; display:block;cursor:pointer;background:url('/images/n_common/plus.png') no-repeat 94% 50%; background-size: 10px;  letter-spacing: -1px; font-weight: 600}
.accordion a:visited { font-size:1.1rem ;color:#333333;padding: 20px; display:block;cursor:pointer;background:url('/images/n_common/plus.png') no-repeat 94% 50%; background-size: 10px;  letter-spacing: -1px; font-weight: 600}

.accordion li ul li {background: #ffffff; font-size:0.95rem; color: #333333; border-bottom: 1px dashed #dbdbdb; }
.accordion li ul li:last-child { border: none}
.accordion li ul li a{background:#ffffff ; padding : 15px 15px 15px 30px; color: #333333; letter-spacing: -1px; font-size:0.95rem; font-weight: 400}	
.accordion li ul li a:visited { background:#ffffff ;padding : 15px 15px 15px 30px; color: #333333;  letter-spacing: -1px ; font-size:0.95rem; font-weight: 400}
.accordion li ul li.active > a {color:#333333; letter-spacing: -1px ; background: none; font-weight: 400; font-size:0.95rem }
	

#header_m .menupop{ position:fixed; left:0; top: 0; background:#ffffff; max-width:600px; width:100%; padding:0; z-index:999999; overflow-y: scroll; height: 100%}	
#header_m .menupop_close {top: 23px; right: 20px; display: block; position: absolute; width: 20%; }
#header_m .menupop_close img {width: 18px; float: right}
	
#header_m .login_w {width: 100%; float: left}
	
#header_m .login_bg { background:#1f4392; padding:22px 22px 20px 22px; color:#ffffff;  width: 100%; text-align:left; font-size: 1.1rem;   box-sizing: border-box}
#header_m .login_bg a { color:#ffffff; padding-left: 42px}
#header_m .login_bg img {top: 16px; left: 20px; display: block; position: absolute; width: 35px;}
	
#header_m .join_bg {float: left; width: 100%; background: #f5f5f5;}
#header_m .join_bg ul { float: left; width: 100%; border-bottom: 1px solid #dbdbdb; padding:12px 0}	
#header_m .join_bg li { width: 50%; float: left; color: #333333; text-align: center; }
#header_m .join_bg li:nth-child(1)::after{content: '|'; float: right; color: #dbdbdb}
#header_m .join_bg li a:link { color: #333333}
#header_m .join_bg li a:visited { color: #333333}

#header_m .menupop_menu_sns {width: 100%; float: left; padding: 0.5rem 0}
#header_m .menupop_menu_sns h2 { width: 90%; padding: 20px 5% 0 5%; text-align: left; font-size: 1.1rem; font-weight: 400}
#header_m .menupop_menu_sns ul {width: 90%; float: left; margin: 0 auto; padding: 15px 5%; }
#header_m .menupop_menu_sns li { width: 25%; float: left; text-align: center; font-size: 0.85rem ; color: #333333}
#header_m .menupop_menu_sns li:hover {cursor: pointer}
#header_m .menupop_menu_sns li img {width: 80%; margin-bottom: 5px}

#header_m .menu_tel {width: 90%; padding: 20px 5% 0 5%; float: left;}
#header_m .menu_tel h2 { text-align: left; font-size: 1.2rem; font-weight: 600; color: #333333; background: url("/images/n_common/icon_tel_black.png") no-repeat left 50%; padding: 0.5rem 0 0.5rem 2.5rem; background-size: 1.8rem}
#header_m .menu_tel h3 { font-size: 3rem; font-weight: 900; color: #1f69ff; line-height: 3.5rem}
#header_m .menu_tel h3 a:link { color: #1f69ff}
#header_m .menu_tel p { font-size: 1rem; font-weight: 400; color: #333333; padding-left: 0.3rem}
	
#header_m .menu_txt {width: 90%; padding: 20px 5% 2rem 5%; float: left; border-top: 1px solid #dbdbdb}
#header_m .menu_txt li { font-size: 1rem; font-weight: 400; color: #333333; float: left; width: 100%; padding: 0.3rem 0}
#header_m .menu_txt li:hover { cursor: pointer}
}

	
@media all and (max-width:767px) and (min-width:0px) {	
	
.headerwrap { display: none !important}
#header_m {display: block !important}
	
/*주메뉴_모바일*/
#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; display: block; position: absolute; cursor: pointer;}
#header_m h2.seem img {width: 50px}
#header_m .top_tel { right: 15px; top: 15px;display: block; position: absolute; cursor: pointer !important}
#header_m .top_tel img {width: 38px}
	
/* 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: #ffffff; left: 0; top: 0px; width: 200px; z-index: 999999; height:100%; position: fixed; overflow-y : auto; overflow-x: hidden !important}
	
.accordion {list-style-type:none;padding:0;margin:0; clear: both; background: #ffffff;}
.accordion ul {padding:0;margin:0;width: 100%;}
.accordion li {cursor:pointer;list-style-type:none; margin:0;width:100%; padding: 0; color: #333333; border-bottom: 1px solid #dbdbdb;}
.accordion li.active > a { background: url('/images/n_common/minus.png') no-repeat 94% 50%; background-size: 10px; color: #333333; letter-spacing: -1px; font-weight: 600}
.accordion li div {padding:0px;clear:both;float:left;width:100%;}
.accordion a { font-size:1.1rem ;color:#333333;padding: 20px; display:block;cursor:pointer;background:url('/images/n_common/plus.png') no-repeat 94% 50%; background-size: 10px;  letter-spacing: -1px; font-weight: 600}
.accordion a:visited { font-size:1.1rem ;color:#333333;padding: 20px; display:block;cursor:pointer;background:url('/images/n_common/plus.png') no-repeat 94% 50%; background-size: 10px;  letter-spacing: -1px; font-weight: 600}

.accordion li ul li {background: #ffffff; font-size:0.95rem; color: #333333; border-bottom: 1px dashed #dbdbdb; }
.accordion li ul li:last-child { border: none}
.accordion li ul li a{background:#ffffff ; padding : 15px 15px 15px 30px; color: #333333; letter-spacing: -1px; font-size:0.95rem; font-weight: 400}	
.accordion li ul li a:visited { background:#ffffff ;padding : 15px 15px 15px 30px; color: #333333;  letter-spacing: -1px ; font-size:0.95rem; font-weight: 400}
.accordion li ul li.active > a {color:#333333; letter-spacing: -1px ; background: none; font-weight: 400; font-size:0.95rem }
	

#header_m .menupop{ position:fixed; left:0; top: 0; background:#ffffff; max-width:600px; width:100%; padding:0; z-index:999999; overflow-y: scroll; height: 100%}	
#header_m .menupop_close {top: 23px; right: 20px; display: block; position: absolute; width: 20%; }
#header_m .menupop_close img {width: 18px; float: right}
	
#header_m .login_w {width: 100%; float: left}
	
#header_m .login_bg { background:#1f4392; padding:22px 22px 20px 22px; color:#ffffff;  width: 100%; text-align:left; font-size: 1.1rem;   box-sizing: border-box}
#header_m .login_bg a { color:#ffffff; padding-left: 42px}
#header_m .login_bg img {top: 16px; left: 20px; display: block; position: absolute; width: 35px;}
	
#header_m .join_bg {float: left; width: 100%; background: #f5f5f5;}
#header_m .join_bg ul { float: left; width: 100%; border-bottom: 1px solid #dbdbdb; padding:12px 0}	
#header_m .join_bg li { width: 50%; float: left; color: #333333; text-align: center; }
#header_m .join_bg li:nth-child(1)::after{content: '|'; float: right; color: #dbdbdb}
#header_m .join_bg li a:link { color: #333333}
#header_m .join_bg li a:visited { color: #333333}

#header_m .menupop_menu_sns {width: 100%; float: left; padding: 0.5rem 0}
#header_m .menupop_menu_sns h2 { width: 90%; padding: 20px 5% 0 5%; text-align: left; font-size: 1.1rem; font-weight: 400}
#header_m .menupop_menu_sns ul {width: 90%; float: left; margin: 0 auto; padding: 15px 5%; }
#header_m .menupop_menu_sns li { width: 25%; float: left; text-align: center; font-size: 0.85rem ; color: #333333}
#header_m .menupop_menu_sns li:hover {cursor: pointer}
#header_m .menupop_menu_sns li img {width: 80%; margin-bottom: 5px}

#header_m .menu_tel {width: 90%; padding: 20px 5% 0 5%; float: left;}
#header_m .menu_tel h2 { text-align: left; font-size: 1.2rem; font-weight: 600; color: #333333; background: url("/images/n_common/icon_tel_black.png") no-repeat left 50%; padding: 0.5rem 0 0.5rem 2.5rem; background-size: 1.8rem}
#header_m .menu_tel h3 { font-size: 3rem; font-weight: 900; color: #1f69ff; line-height: 3.5rem}
#header_m .menu_tel h3 a:link { color: #1f69ff}
#header_m .menu_tel p { font-size: 1rem; font-weight: 400; color: #333333; padding-left: 0.3rem}
	
#header_m .menu_txt {width: 90%; padding: 20px 5% 2rem 5%; float: left; border-top: 1px solid #dbdbdb}
#header_m .menu_txt li { font-size: 1rem; font-weight: 400; color: #333333; float: left; width: 100%; padding: 0.3rem 0}
#header_m .menu_txt li:hover { cursor: pointer}
}