@charset "UTF-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

@import url(font.css);
@import url(https://maxcdn.icons8.com/fonts/line-awesome/1.1/css/line-awesome.min.css);
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900');
@import url('https://fonts.googleapis.com/css?family=Nanum+Myeongjo:400,700,800|Noto+Sans+KR:100,300,400,500,700,900|Play:400,700|Nanum+Gothic:400,700,800&subset=korean');

@import url(aos.css);
@import url(html5_reset.css);
:root {
  --body:#444;
  --block: #181818;
  --fff:#fff;
  --bg: #EDE8E1;
  --color_main: #8460a9;
  --point_1: #D3B188;
  --point_2: #9B7E62;
  --point_3: #7a5f4b;
  --point_4: #f9f5f1;
  --point_5: #24160C;
  --dark_gray: #4D4D4D;
  --line: #8d8d8d;
 }
html {font-family: 'Pretendard', sans-serif;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;overflow-y: scroll;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: auto;}

body {font-size: 16px;
  font-smooth: always;-webkit-font-smoothing: antialiased;-moz-font-smoothing: unset;-moz-osx-font-smoothing: grayscale; font-smoothing: antialiased;
  -webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;backface-visibility: hidden;min-width: 1260px; }

img {max-width: 100%;}
button {outline: none;}
p b {font-weight: 600;}
.mobile {display: none;}
.mobile_s {display: none;}
.pc {display: ;}
.box{-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}


input[type="text"],input[type="tel"], input[type="password"], textarea {padding: 5px 10px;border:1px solid #d3d3d3;color: #888;height: 25px;font-family: 'Pretendard', sans-serif;font-size : 16px;vertical-align: top;}
input[type="image"] {max-width: 100% !important; height: auto !important;}
select {padding: 5px 1px 5px 10px;border:1px solid #d3d3d3;color: #888;height: 37px;vertical-align: top;min-width: 150px;background: #fff;position:  relative;z-index:  1;background:  none;}
.select {text-align: center;}
.select::after {content: "\e826";font-family: "snarane";position: absolute;margin-left: -42px;background:  #fff;line-height: 37px;width: 37px;margin-top:  1px;color: #bdbdbd;}
select::-ms-expand {
  /* for IE 11 */
  display: none;
}
input[type="tel"] {width: 22%;max-width: 140px;}
textarea {min-height: 80px;}

input[type=checkbox] { display:none; } /* to hide the checkbox itself */
input[type=checkbox] + label{padding-left:25px;position:relative;display: inline-block;text-align: justify;}
input[type=checkbox] + label:before {display: inline-block;vertical-align: text-bottom;content: "";margin-right: 8px;line-height: 20px;position: absolute;left: 0;border: 1px solid #777;width: 12px;height: 12px;vertical-align: middle;top: 7px;margin-left:3px;} /* unchecked icon */
input[type=checkbox]:checked + label:before {font-family: 'LineAwesome';top: 4px;content: "\f17f";color: #8461a9;margin-right: 5px;left: 0;font-size: 19px;border:0;margin-left:0;}

.filebox input[type="file"] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip:rect(0,0,0,0);
	border: 0;
}

.filebox label {
	display: inline-block;
	padding: 4px 10px;
	color: #999;
	font-size: inherit;
	line-height: normal;
	vertical-align: middle;
	background-color: #fdfdfd;
	cursor: pointer;
	border: 1px solid #ebebeb;
	border-bottom-color: #e2e2e2;
	/* border-radius: .25em; */
}

/* named upload */
.filebox .upload-name {
	display: inline-block;
	padding: 4px 10px;
	font-size: inherit;
	font-family: inherit;
	line-height: normal;
	vertical-align: middle;
	background-color: #ffffff;
	border: 1px solid #d3d3d3;
	/* border-bottom-color: #e2e2e2; */
	/* border-radius: .25em; */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.filebox.bs3-primary label {
  color: #fff;
  background-color: #8461a9;
  border-color: #8461a9;
}

 /* checked icon */
button:active {outline: none;border: none;}

hr {clear: both;float: none;border: 0;border-bottom: 1px solid #ccc;margin: 80px 0;}

h1, h2, h3, h4, h5, h6 {font-family: 'NanumSquare';}

/* float & align */
.left{ float: left !important;}
.right{ float: right !important;}
.left_align {text-align: justify !important;}
.center {text-align: center !important;}
.right_align {text-align: right !important;}
.vertical_middle {vertical-align: middle;}
.border_none {border: none !important;}

/* CURSOR */
.cursor {cursor:pointer;}

/* MARGIN */
.m_0 {margin: 0 !important;}
.m_10{margin:10px !important;}
.m_20{margin:20px !important;}
.m_30{margin:30px !important;}

.m_lr_10{margin-left:10px !important; margin-right:10px !important; }
.m_lr_20{margin-left:20px !important; margin-right:20px !important;}
.m_lr_30{margin-left:35px !important; margin-right:30px !important;}

.m_tb_10{margin-top:10px !important; margin-bottom:10px !important; }
.m_tb_20{margin-top:20px !important; margin-bottom:20px !important;}
.m_tb_30{margin-top:30px !important; margin-bottom:30px !important;}


.m_t_0 {margin-top: 0 !important;}
.m_t_10{margin-top:10px !important;}
.m_t_20{margin-top:20px !important;}
.m_t_30{margin-top:30px !important;}
.m_t_40{margin-top:40px !important;}
.m_t_50{margin-top:50px !important;}
.m_t_60{margin-top:60px !important;}
.m_t_80{margin-top: 80px !important; }
.m_t_100{margin-top: 100px !important; }

.m_r_0 {margin-right: 0 !important;}
.m_r_10{margin-right:10px !important;}
.m_r_20{margin-right:20px !important;}
.m_r_30{margin-right:30px !important;}

.m_b_0 {margin-bottom: 0 !important;}
.m_b_10{margin-bottom:10px !important;}
.m_b_20{margin-bottom:20px !important;}
.m_b_30{margin-bottom:30px !important;}
.m_b_40{margin-bottom:40px !important;}
.m_b_50{margin-bottom:50px !important;}
.m_b_60{margin-bottom:60px !important;}

.m_l_0 {margin-left: 0 !important;}
.m_l_10{margin-left:10px !important;}
.m_l_20{margin-left:20px !important;}
.m_l_30{margin-left:30px !important;}
.m_l_40{margin-left:40px !important;}
.m_l_50{margin-left:50px !important;}
.m_l_60{margin-left:60px !important;}


/* PADDING */
.p_0 {padding:0px !important;}
.p_10{padding:10px !important;}
.p_20{padding:20px !important;}
.p_30{padding:30px !important;}

.p_tb_0 {padding-top:0px !important; padding-bottom:0px !important;}
.p_tb_10{padding-top:10px !important; padding-bottom:10px !important;}
.p_tb_20{padding-top:20px !important; padding-bottom:20px !important;}
.p_tb_30{padding-top:30px !important; padding-bottom:30px !important;}
.p_tb_50{padding-top:50px !important; padding-bottom:50px !important;}
.p_tb_100{padding-top:100px !important; padding-bottom:100px !important;}

.p_t_0 {padding-top:0px !important;}
.p_t_10{padding-top:10px !important;}
.p_t_20{padding-top:20px !important;}
.p_t_30{padding-top:30px !important;}
.p_t_50{padding-top:50px !important;}
.p_t_100{padding-top:100px !important;}

.p_r_0 {padding-right:0px !important;}
.p_r_10{padding-right:10px !important;}
.p_r_20{padding-right:20px !important;}
.p_r_30{padding-right:30px !important;}

.p_b_0 {padding-bottom:0px !important;}
.p_b_10{padding-bottom:10px !important;}
.p_b_20{padding-bottom:20px !important;}
.p_b_30{padding-bottom:30px !important;}
.p_b_50{padding-bottom:50px !important;}
.p_b_100{padding-bottom:100px !important;}

.p_l_0 {padding-left:0px !important;}
.p_l_10{padding-left:10px !important;}
.p_l_20{padding-left:20px !important;}
.p_l_30{padding-left:30px !important;}



/* font size + weight + color */
.font_18 {font-size: 18px !important;}
.font_20 {font-size: 21px !important;}
.font_22 {font-size: 22px !important;}
.font_24 {font-size: 24px !important;}
.font_30 {font-size: 30px !important;}
.myeongjo {font-family: 'Nanum Myeongjo';}
.notosan {font-family:  "Noto Sans Korean";}
.Pretendard {font-family:  "Pretendard";}

.fontw_100 {font-weight: 100 !important;}
.fontw_300 {font-weight: 300 !important;}
.fontw_400 {font-weight: 400 !important;}
.fontw_500 {font-weight: 500 !important;}
.fontw_600 {font-weight: 600 !important;}
.fontw_700 {font-weight: 700 !important;}
.fontw_800 {font-weight: 800 !important;}

.color_000 {color:#000 !important;}
.color_222 {color:#222 !important;}
.color_444 {color:#444 !important;}
.color_fff {color:#fff !important;}
.color {color: #5c4a8c !important;font-weight: 600;/* transform: rotate(0.04deg); */}

/* li */
ul:after{content: ""; display:block; clear:both;*zoom:1; }
ul.two > li {width:50% !important; float: left; }
ul.three > li {width:33.333% !important; float: left; }
ul.four > li {width:25% !important;  float: left;}
ul.five > li {width: 20% !important;  float: left;}
ul.six > li {width: 16.666% !important;  float: left;}
ul.seven > li {width: 14.285% !important;  float: left;}
ul.eight > li {width: 12.5% !important;  float: left;}
ul.nine > li {width:11.1111% !important; float: left; }



#wrap {min-width: 1260px; width: 100%;}

/* title */
.title {width:1200px;margin:0 auto;position: relative;}
.title:before {border-bottom:2px solid #e1e1e1;width:100%;display:block;content:'';position: absolute;top: 38px;}
.title h2 {color: #603988;font-size: 40px;font-weight: 100;background:#fff;display: inline-block;padding: 0 20px;position: relative;}
.title h2 > span {background: #603988;color: #fff;font-size: 82px;font-weight: 800;letter-spacing: -7px;padding: 0px 9px 0 4px;vertical-align: middle;line-height: 1em;margin-right: 10px;}
.title h2 > span > em {font-size: 40px;letter-spacing: 0;font-weight: 100;}
.tit_en {color: #bfbfbf;font-family: 'Spoqa Han Sans';font-weight: 100;letter-spacing: 12px;margin: 10px 0 70px;text-transform:uppercase;font-size: 16px;}
.section_title .tit_en{
    margin-bottom: 0;
}

.bottom_line{font-size: 30px;color: #222;}
.bottom_line span {/* color:#876537; */}
.bottom_line em {font-size:20px; display:block}
.bottom_line::after {display: block;width: 50px;height: 2px;background: #8461a9;content: '';margin: 10px auto;}

/* background */
  .bg {position: relative; overflow: hidden;}
/*   .bg::before, .bg::after {content: "";width: 380px;height: 380px;border: 50px solid #f9f7fb;display: block;position: absolute;border-radius: 500px;top: 100px;z-index: -5;position: fixed;top: 50%;margin-top: -190px;}
  .bg::before{left: -240px;}
  .bg::after {right:-240px}
  .bg > div::before, .bg > div::after {content: "";width: 140px;height: 140px;border: 50px solid #f9f7fb;display: block;position: absolute;border-radius: 500px;top: 220px;z-index: -5;position: fixed;top: 50%;margin-top: -70px;}
  .bg > div::before{left: -120px;}
  .bg > div::after {right:-120px}
  .bg.bg_grey::before, .bg.bg_grey::after {border:50px solid #fff;}
  .bg.bg_grey > div::before, .bg.bg_grey > div::after {border:50px solid #fff;} */




/* layer_pop */

/* .layer_pop {position: fixed; width: 100%; height: 100%;z-index: 10; display: none;top:160px}
.layer_pop > .dim_bg {display: block; top:0}

#pop {position: absolute;left: 50%;top: 330px;z-index:310;display: none;margin-left: -630px;}
#pop img {display: block;float: left;max-height: 520px;}
#pop .cont {overflow: hidden;}
#pop .close {background: #787878;border: 5px solid #787878;color: #fff;text-align: right;padding-right: 5px;}
#pop .close label { cursor: pointer; }
#pop .close #check input[type=checkbox] + label:before {border:1px solid #fff; top:5px; }
#pop .close #check input[type=checkbox]:checked + label:before{color:#fff; top:2px; border:0}
#pop .close #close span {border: 1px solid #717171;border-radius: 3px;padding: 3px;font-size: .7em;background: #fff;color: #777;cursor: pointer;}
#pop .close #close{ cursor: pointer;}
#popdim {position:fixed;left:0;top:0;right:0;bottom:0;z-index:300;width: 100%;background: rgba(0, 0, 0, .6); display: none; cursor: pointer;} */



.layer_pop, .charge_layer_pop {position: fixed;z-index: 120;display: none;top: 174px;left: 50%;margin-left: -350px;width: 700px;}
.layer_pop > .dim_bg, .charge_layer_pop > .dim_bg {display: block;top:0;left: 0;}
#new_pop {position: absolute;left: 0;top: 150px;z-index:310;display: none;right: 0;text-align: center;}
#new_pop img {/* max-width: 470px; */max-height: 500px;}
#new_pop .cont {overflow: hidden;}
#new_pop .close {color: #fff;text-align: center;padding-top: 30px;padding-right: 18px;}
#new_pop .close label { cursor: pointer; }
#new_pop .close #check input[type=checkbox] {display:none;}
#new_pop .close #check input[type=checkbox] + label{padding-left: 30px;position:relative;display: inline-block;text-align: justify;margin-right: 10px;}
#new_pop .close #check input[type=checkbox] + label:before {display: inline-block;vertical-align: text-bottom;content: "";margin-right: 8px;line-height: 20px;position: absolute;left: 0;border: 2px solid #fff;width: 14px;height: 14px;vertical-align: middle;top: 3px;}
#new_pop .close #check input[type=checkbox]:checked + label:before {font-family: 'LineAwesome';content: "\f17f";color: #fff;margin-right: 5px;left: 0;font-size: 24px;border:0;margin-left:0;top: 2px;}
#new_pop .close #close{ cursor: pointer;}
#new_pop .close #close i{position:absolute;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;/* margin-top: 3px; */}
#new_pop .close #close i:hover {-webkit-transform: rotate(180deg);transform: rotate(180deg); }

#popdim {position:fixed;left:0;top:0;right:0;bottom:0;z-index:300;width: 100%;background: rgba(0, 0, 0, .6); display: none; cursor: pointer;}
.dim_bg {width:100%;height:100%;position: fixed;display:none;background:rgb(0,0,0);background: transparent\5;background: rgba(0,0,0,0.5);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000,endColorstr=#b2000000);display: none;z-index: 110;cursor: pointer;top: 0;}

@media (max-width: 767px) {
  hr {margin: 30px 0;}
.color{font-weight:700;}

  .layer_pop {top: 100px;position: fixed;width: 100%;height: 100%;z-index: 200;left: auto;margin: 0;    }
  #new_pop {position: absolute;width: 300px;height: 300px;left: 50%;margin-left: -150px;top: 110px;margin-top: 0;z-index:310;display: none;}
  #new_pop .cont {overflow: inherit;}
  #new_pop .owl-nav{color: #fff;position: absolute;left: 0;right: 0;top: 130px;font-size: 4em;font-family: 'Montserrat';}
  #new_pop .owl-carousel .owl-nav button.owl-prev{left: -30px;position: absolute;background: none;}
  #new_pop .owl-carousel .owl-nav button.owl-next{right:-30px;position: absolute;background: none;}
  #new_pop .owl-dots{position:absolute;top: -40px; left:0; right:0 }
  #new_pop .owl-carousel button.owl-dot{ background:#fff; width:15px; height:15px; border-radius:100px; margin:0 3px; opacity:.5; }
  #new_pop .owl-carousel button.active {opacity:1;}
  #new_pop .close {padding-top:10px;padding-right: 14px;}
  #new_pop .close #check input[type=checkbox] + label{padding-left:25px;margin-right: 5px;}
  #new_pop .close #check input[type=checkbox] + label:before {border:1px solid #fff;width:12px;height:12px;top: 3px;}
  #new_pop .close #check input[type=checkbox]:checked + label:before {font-size: 19px;top: 0px;}



}

@media only screen and (max-width: 600px) {

}


@media only screen and (max-width: 320px) {
  #new_pop .owl-carousel .owl-nav {display:none;}
}



/* quick_menu */
.quick_menu {position:relative;top: 93px;right:0;width: 450px;position:fixed;z-index: 20;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;margin-right: -380px;}
.quick_menu > ul {width: 70px;float: left;}
.quick_menu > ul > li {background: rgba(140, 106, 174, 0.5);-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}

.quick_menu > ul > li.hover {background: rgba(125, 125, 125, 0.5)}

.quick_menu > ul > li > a {padding: 10px 0;color: #fff;width: 70px;text-align: center;display:block;font-size: .75em;border-bottom: 1px solid #b3b0a8;cursor: pointer;}
.quick_menu > ul > li a::before{display: block;font-size: 40px;font-family: 'snarane';line-height: 1;margin-bottom: 5px;}
.quick_menu > ul > li:nth-child(1) a::before{content: '\e843';  }
.quick_menu > ul > li:nth-child(2) a::before{content: '\e813'; }
.quick_menu > ul > li:nth-child(3) a::before{content: '\e811'; }
.quick_menu > ul > li:nth-child(4) a::before{content: '\E808'; }
.quick_menu > ul > li:nth-child(5) a::before{content: '\E801'; }
.quick_menu > ul > li:nth-child(6) a::before{content: '\e828'; }
.quick_menu > ul > li:nth-child(7) a::before{content: '\e809'; }
.quick_menu > ul > li:nth-child(8) a::before{content: '\e900'; }
.quick_menu > ul > li:nth-child(9) a::before{content: '\E900'; }
.quick_menu > div {width: 380px; float: right;}

.quick_menu.f_nav {top: 79px;}
.quick_menu.open {margin-right: 0;}
/* .quick_menu.open > ul > li{background: rgba(125, 125, 125, 0.5)} */
.quick_menu.open > ul > #quick_counsel {background: #8461a9;}



.layerwrite{text-align:left;/* height: 533px; */background: #fff;border-bottom: 1px solid #d3cfc8;}
.layerwrite h2, .layerwrite .widget-title{padding: 10px 20px 8px;background: #8461a9;color:#fff;font-size: 1.4em;font-weight: 400;}
.layerwrite h2 i, .layerwrite .widget-title i {float: right; cursor: pointer;}
.layerwrite .wraper {padding:30px 25px; }
.layerwrite .wraper > iframe {width: 330px; height: 360px; }
.layerwrite .quick_counsel table {width: 100%;border: 1px solid #e2e2e2;margin: 20px 0 10px;}
.layerwrite .quick_counsel table th {border: 1px solid #d3cfc8;background: #f8f8f8;color: #6f6453;font-weight: 400;width: 100px;text-align: center;vertical-align:  middle;}
.layerwrite .quick_counsel table td {border: 1px solid #d3cfc8;padding: 0;background: #fff;}
.layerwrite .quick_counsel form input[type="text"] {border:0;font-size: 1em;padding: 10px 15px;margin: 0;width: 207px;}
.layerwrite .quick_counsel form   textarea {border:0;width: 217px;min-height: 263px;}
.layerwrite .quick_counsel form p {margin-bottom: 16px;}
.layerwrite .quick_counsel form input[type="submit"] {width: 100%;background: #8461a9;border: 0;color: #fff;font-size: 1.4em;padding: 10px 0;cursor: pointer;/* margin-bottom: 20px; */}
.layerwrite img {display: block;}




/* header */
header {position: fixed;width: 100%;z-index: 90;/* top: 50px; */text-align: center;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;/* max-width: 1920px; */overflow: hidden;}
header > .inwrap:hover {border-bottom: 1px solid #eee;background: #fff;}
header > .inwrap {margin: 0 auto;/* margin: 0 90px; */position: relative;/* background: rgba(36, 36, 39,.95); */filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000,endColorstr=#b2000000);padding-top: 30px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}

header > .inwrap:before {content:'';/* background:#fff; */width:100%;height: 78px;display:block;position:absolute;top: 0;}
header > .inwrap:hover:before{border-bottom: 1px solid #eee;height: 107px;background: #fff;}
 header.f_nav > .inwrap:before{border-bottom: 1px solid #eee;height: 76px;background: #fff;}
 header .logo {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;position: absolute;font-size: 1.5em;left: 50px;z-index: 1;text-align: left;margin-top: 14px;}
header .logo img {position: absolute;width: 130px;}
 header #logo{opacity: 0}
 header.f_nav #logo{opacity: 1}
 header.f_nav #logo_w{opacity: 0}
header > .inwrap:hover #logo{opacity: 1}
 header > .inwrap:hover #logo_w{opacity: 0}
 header .logo > a {display: block;width: 250px;position: absolute;z-index: 1;}

 header > .inwrap:hover .logo > a, header.f_nav > .inwrap .logo > a {color: #444;}
 header > .inwrap:hover .logo > a:hover {color:#444;}

header nav {position: relative;}
header nav:after {/* content:'\E83E'; */font-family:'icon_font';position:absolute;right: 50px;bottom: 10px;font-size: 15em;opacity: .1;z-index: 0;color: #fff;animation: rotate_360 5s linear infinite;transform-origin: 50% 50%;}
header nav:after div > ul > li:hover {}
header .lnb {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;display: inline-block;/* padding-bottom: 20px; *//* margin-left: 100px; */}
/* header .lnb:before {content:'';border-bottom: 1px solid #ddd;display:block;position:absolute;width: 100%;left: 0;margin-top: 48px;z-index: 100;} */
header .lnb > li > a {font-weight: 500;font-size: 22px;padding: 28px 40px 27px 40px;display: block;color: #fff;line-height: 1em;font-family: 'GowunBatang';font-weight: 700;}
header:hover .lnb > li > a, header.f_nav .lnb > li > a{color:#444}
header .lnb > li > ul {display: none}
header .lnb > li > a:after{content:'\E83E';font-family:'icon_font';/* margin-right: 10px; */-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;font-size: 12px;position: absolute;opacity: 0;margin-top: -12px;color: #e82491;animation: rotate_360 2s linear infinite;transform-origin: 50% 50%;}
header .lnb > li:hover > a:after {/* opacity:1 */}

/* header .logo .text::before{content: '\E8C1';font-family:'icon_font';font-size: 3em;font-weight: 100;vertical-align: middle;float: left;margin: -5px 10px 0 0;color: #b39d88;} */

/* header .logo .text {font-weight: 400;left: 50px;position: absolute;font-family: 'NanumSquare';font-size: 18px;line-height: 1.2;} */
header.open .lnb {float: none;text-align: center;width:100%;max-width: 1400px;margin: 80px auto;position: relative;z-index: 101;}
header.open .lnb > li{display: block;width: 200px;}
header.open .lnb > li > a {margin-left: 0;}

header.f_nav {/* margin-top: -30px; */}
header.f_nav > .inwrap{margin: 0;padding: 0;}
header.f_nav > .inwrap:after{content:'';width:100%;position:absolute;/* border-bottom:1px solid #ddd; */left: 0;top: 78px;}
header.f_nav.open {height: auto;background: none;}
header.f_nav.open .lnb{margin-top: 20px;}
header.f_nav.open .logo{/* margin-top: 100px; */}
header.f_nav.open .logo img {height: auto;}

header .top_call {position: absolute;right: 50px;top: 50px;/* font-size: 30px; */position: absolute;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;width: 151px;letter-spacing: 0;text-align: right;display: block;}
header .top_call .tel{/* font-family: 'Barlow'; */font-weight:600;color: #fff;border: 1px solid #fff;border-radius: 100px;padding: 5px 20px;}
header > .inwrap:hover .top_call .tel, header.f_nav > .inwrap .top_call .tel{color:#444; border-color:#444;}
header.f_nav .top_call {top: 21px;}
/* header .top_call .tel span:before {content:'\E865';font-family:'icon_font';margin-right: 10px;color: #d89294;font-size: 1.2em;} */
header .top_call a {position: absolute;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
header .top_call .active {opacity: 1}
header .top_call > div {position: absolute;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
header .top_call > div.add {font-size: 20px;line-height:2;margin-top: 0px;font-weight:400;text-align: center;width: 100%;font-weight:600;}




header nav .lnb > li{font-size: 20px;font-weight: 800;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;/* border-left: 1px solid #ddd; */-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;display: inline-block;vertical-align: top;/* min-width: 150px; */}
header nav .lnb > li:last-child {/* border-right:1px solid #ddd; */}
header nav .lnb > li:hover > a {color: var(--color_sub);}
header nav .lnb > li > ul {display: none;width: 100%;position: relative;z-index: 11;padding: 20px 0 30px;border-left: 1px solid rgba(237, 239, 241, .1);/* height: 330px; */}
header nav .lnb > li:first-child > ul {border:0}
header nav .lnb > li > ul > li{font-size: 16px;font-family: 'Noto Sans KR', sans-serif;}
header nav .lnb > li > ul > li > a {color: #888;padding: 6px;display: block;font-weight: 400;vertical-align: middle;position: relative;/* padding-left: 20px; *//* font-family: 'NanumSquare'; */font-size: 16px;/* line-height: 1; */-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
header nav .lnb > li:hover{/* background: rgb(0 0 0 / 60%); */}
header nav .lnb > li > ul > li:hover > a {color: var(--color_main);/* padding-left: 20px; */font-weight: 700;}
header nav .lnb > li > ul > li > a:after{content:'\E83E';font-family:'icon_font';/* margin-right: 10px; */-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;font-size: 12px;position: absolute;opacity: 0;margin-top: -7px;color: #fff;/* animation: rotate_360 2s linear infinite; *//* transform-origin: 50% 50%; */}
header nav .lnb > li > ul > li:hover > a:after{/* opacity: 1; *//* animation: rotate_3http://cbrortho.co.kr/html/introduce/sub_05.html60 2s linear infinite; *//* transform-origin: 50% 50%; */}
header nav .lnb > li > ul > li > ul {display:none;position: absolute;background: #fff;border-left:1px solid #eee;border-right:1px solid #eee;left: 50%;margin-top: -38px;margin-left: 110px;}
header nav .lnb > li > ul > li > ul > li {border-bottom: 1px solid #eee;padding: 7px 20px;}
header nav .lnb > li > ul > li > ul > li > a {font-size:16px;font-weight:400;display: block;}
header nav .lnb > li > ul > li > ul > li > a:before {margin-right:5px;}
header nav .lnb > li > ul > li > ul > li:hover > a {}

.sub_lnb {left: 0;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s; transition: all 0.3s; }
.sub_lnb.fix {top: 64px;}




@media (max-width: 1520px) {
}
@media (max-width: 1220px) {
}

@media (max-width: 767px) {
  header{height: 57px;text-align:center;min-width: 320px;z-index: 100;/* border-bottom: 1px solid #ddd; */top: 0;/* background: #fff; */}
 header > .inwrap:hover{border:none;background: none;}
  header > .inwrap:before {display:none;}
  header .inwrap{/* margin:0 15px; */position: relative;/* background: #fff; */padding-top: 0;}
  header .logo{position: fixed;float:none;height: auto;margin: 10px auto 0;width: 100%;padding-bottom: 10px;text-align: center;background: none;left: 0;}
  header .logo > a{width: 140px;display: inline-block;margin-left: -140px;}
  header .logo img{max-width: 150px;margin-top: 3px;width: 140px;height: 34px;position: fixed;}
  header .logo #logo_w{/* display:none; */}
	
  header .logo #logo{/* opacity: 1; */height: 34px;/* margin-top: 6px; */}
  header .text{display: none;}
  header > .header{padding:15px 10px 6px;border-bottom:  0;}
  header .top_call {width:auto;right: 40px;top: -2px;}


  header .top_call .tel{border:0;}
  header .tel a {top: 10px;/* background: var(--body); */color: #fff;border-radius: 100px;right: 10px;width: 38px;height: 38px;margin: 0;line-height: 38px;font-weight:100;text-align: center;font-size: 2em;}
  header .tel a:before{content: '\E82C';vertical-align: text-bottom;font-family: 'snarane';}
  .menu_wrap{position: fixed;left: 15px;top: 30px;}
	.menu_wrap a{}
  .menu_wrap #menu_but span {width:25px;height: 3px;display: block;background: var(--fff);}
  .menu_wrap #menu_but:before, .menu_wrap #menu_but:after{content:'';width:25px;height: 3px;display: block;background: var(--fff);position:absolute;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
  .menu_wrap #menu_but:before {margin-top: -10px;}
  .menu_wrap #menu_but:after {margin-top: 7px;}
  


  header.open{background: var(--fff);}
  header.open .logo #logo_w{opacity: 0;}
  header.open .logo #logo {opacity: 1;}
  header.open .menu_wrap #menu_but span {display: none;}
  header.open .menu_wrap #menu_but:before {margin-top: 0px;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
  header.open .menu_wrap #menu_but:after {margin-top: 0;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}


  header nav {display:none;}
  header .lnb{display:block}
  header .lnb:before{display: none;}
  header nav .lnb > li {display:block;padding: 0;text-align: left;width: auto;border-bottom: .5px solid #ccc;font-size: 16px;}
  header nav .lnb > li > a{font-size:16px;padding: 15px;color: var(--body);}
  header nav .lnb > li.has-sub > a::after {content: "\E826";font-family: 'snarane';font-style: normal;font-weight: normal;text-decoration: inherit;position: absolute;right: 15px;color: #666;left: auto;font-size: 1em;margin: 0;width: 20px;text-align: center;animation: none;opacity: 1;}
  header nav .lnb > li.has-sub.active {background:#ececec;}
  header nav .lnb > li.has-sub.active > a:after {content: "";border:0;line-height: 0;right: 18px;width: 15px;display:block;height: 1.5px;background: #666;margin-top: -10px;}

  header nav .lnb > li > ul{padding: 0 15px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;margin:0 !important;width: 100%;}
  header nav .lnb > li > ul > li:after {display:none !important;}
  header nav .lnb > li > ul > li{display:block;float: none;margin-top: 0;border-top: 1px solid #fff;}
  header nav .lnb > li > ul > li:last-child {}
  header nav .lnb > li > ul > li > ul {position:relative;margin-left: 0;left: 0;margin-top: 0;background: #fff;margin-bottom: 15px;}
  header nav .lnb > li > ul > li > ul > li{padding: 5px 10px;border-top: 1px solid #fff;}
  header nav .lnb > li > ul > li > ul > li:last-child {border:0}
  header nav .lnb > li > ul > li > a{display:block;padding: 8px 0;width: auto;color: #444;}
  header nav .lnb > li > ul > li > a > span{float:right;margin-right: 3px;}
  header nav .lnb > li > ul > li.active > a > span:after{content:'\E876'}

  header nav .lnb > li > ul > li > a > span:after {content: '\E835';font-family: 'icon_font';float: right;margin-top: 5px;}

  header.open nav {position: fixed;min-height: 100%;width: 100%;z-index: 1001;display: block;top: 57px;bottom: 0;left: 0;background: #fff;overflow: auto;}
  header.open nav:before {content:'';display:block;position: fixed;height:2px;background: #444;left:15px;right:15px;z-index: 1000;}
  header.open .lnb{width: auto;background: #fff;margin: 0;border-bottom: 2px solid #666;overflow-y: auto;}
  header.open .lnb > li{width: 100%;}
  header.f_nav{margin-top:0;background: var(--fff);border-bottom: 1px solid #ddd;}
	header.f_nav.open .lnb{
  margin-top: 0;
}
	header.f_nav.open .logo{}
	header.f_nav.open{
  margin-top: 0;
  height: 57px;
  background: var(--fff);
}
  header.f_nav .top_call{top: -2px; }
  header.f_nav .top_call a, header.open .top_call a{color:var(--block);}
  header.f_nav .menu_wrap #menu_but span{background: var(--block);}
  header.f_nav .menu_wrap #menu_but:before,
  header.f_nav .menu_wrap #menu_but:after,
  header.open .menu_wrap #menu_but:before,
  header.open .menu_wrap #menu_but:after
   {background: var(--block);}
  header > .inwrap:hover #logo{
    opacity: 0;
  }
	header > .inwrap:hover #logo_w{
    opacity: 1;
  }
	header.open > .inwrap:hover #logo{
    opacity: 1;
  }
	header.open > .inwrap:hover #logo_w{
    opacity: 0;
  }
	header.f_nav > .inwrap:hover #logo{
    opacity: 1;
  }
	header.f_nav > .inwrap:hover #logo_w{
    opacity: 0;
  }
}

/* footer */
footer .foot_menu{background:#4e4e4e; }
footer .foot_menu ul {max-width:1200px; margin:0 auto; padding:15px 0;}
footer .foot_menu ul li {display:inline-block;  }
footer .foot_menu ul li a{color: rgba(255, 255, 255, 0.8);border-left:1px solid rgba(255, 255, 255, .2);padding:0 15px;height: 14px;line-height: 14px;display: inline-block;font-size: 14px;}
footer .foot_menu ul li:first-child a {border:0;padding-left:0;}
footer .foot_menu ul li:hover a{color: #fff;}
/* 진료의뢰서 다운로드 버튼 */
footer .foot_menu ul li.doc_down {vertical-align: middle;}
footer .foot_menu ul li.doc_down a {border-left: 0; margin-left: 10px; padding: 0 16px; height: 28px; line-height: 26px; border: 1px solid rgba(255, 255, 255, .4); border-radius: 15px; color: #fff; font-size: 13px;}
footer .foot_menu ul li.doc_down a::after {content: ''; display: inline-block; width: 13px; height: 13px; margin-left: 7px; vertical-align: -2px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v11M7.5 10l4.5 4.5L16.5 10M4 20h16'/%3E%3C/svg%3E") no-repeat center; background-size: 13px 13px;}
footer .foot_menu ul li.doc_down:hover a::after {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234e4e4e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v11M7.5 10l4.5 4.5L16.5 10M4 20h16'/%3E%3C/svg%3E");}
footer .foot_menu ul li.doc_down:hover a {background: #fff; border-color: #fff; color: #4e4e4e;}
footer {overflow: hidden;border-top: 1px solid #ddd;}
footer > .inwrap {max-width: 1200px;margin: 0 auto !important;width: 100%; padding:0 !important ;}
footer > .inwrap > ul {margin-top: 60px;overflow: hidden;margin-left: -30px;font-size: 16px;line-height: 1.4; margin-bottom: 60px;}
footer > .inwrap > ul > li {width: 28%;float: left;/* height:  360px; */-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;padding-left: 30px;}
footer > .inwrap > ul > li:first-child, footer > .inwrap > ul > li:nth-child(4) {width:22%;}
footer > .inwrap > ul > li > h4 {font-family:'NanumSquare';font-size: 18px;margin-bottom: 10px;color: #222;}
footer > .inwrap > ul > li > h4 span  {float: right;color: #d6d6d6;font-weight: 100;font-size: 30px;line-height: 26px;}
footer > .inwrap > ul > li table {border-top:1px solid #eee; width:100%; }
footer > .inwrap > ul > li table td {padding:10px 0;border-bottom:1px solid #eee;}
footer > .inwrap > ul > li .phone{font-family: 'Play', sans-serif;font-size: 36px;color: #603988;margin-top: -10px;margin-bottom: 8px;}
footer > .inwrap > ul > li .kakao {background:#3b1f1e;position: relative;padding: 10px 10px 10px 69px;margin-top: 18px;letter-spacing: -1px;height: 44px;}
footer > .inwrap > ul > li .kakao a {color:#fff; }
footer > .inwrap > ul > li .kakao a span {color:#fae300;}
footer > .inwrap > ul > li .kakao::before {background:#fae300;content: "\e843";font-family: "snarane";font-size: 45px;/* vertical-align:  middle; *//* margin-right:  8px; */position: absolute;top: 0;left:  0;height: 64px;display:  block;color: #3b1f1e;padding: 0 10px;}

footer > .inwrap > ul > li > form input, footer > .inwrap > ul > li > form textarea{width: 218px;margin-bottom: 5px;height: 18px;}
footer > .inwrap > ul > li > form button{width: 100%;height: 55px;background:#373737;border:0;color:  #fff;font-size:  18px;}


footer #map {border:1px solid #d3d3d3;margin-top: 10px;height: 165px;margin-bottom: 10px;width: 100%;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}




footer .copy {background: #373737;width: 100%;padding: 20px 0;overflow:  hidden;font-size:  14px;}
footer .copy img {border-radius:0}
footer .copy .inwrap {max-width: 1200px;margin: 0 auto !important;width: 100%;}
footer .copy .inwrap address {color: #d8d8d8;float:  left;}
footer .copy .inwrap address p {display: inline-block; margin-right:15px}
footer .copy .inwrap address span {margin-left:15px}
footer .copy .inwrap ul {float:right;margin-top: 18px;}
footer .copy .inwrap ul li {float:  left;padding-left:  10px;opacity: .5;}

/* vod */
.auto_height {
  /* position: relative; */
  /* width: 100%; */
  /* height: 0; */
  padding-bottom: 56.21%;
  /* margin-bottom: 0; */
  width: 100%;
  /* height: 100vh; */
  position: relative;
  overflow: hidden;
}

.auto_height iframe,
.auto_height embed,
.auto_height video {
  position: absolute;
  /* top: 0; */
  /* left: 0; */
  /* width: 100%; */
  /* height: 100%; */
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 50%;
  /* transform: scale(1.2); */
  /* z-index: -1; */
  transform: translate(0%,-55%);
}

/* 4. 모바일 (해상도 767px 이하) */
@media all and (max-width:767px) {

    .auto_height{
    /* height: calc(100vh - 105px); */
    /* display: block !important; */
}
  .auto_height iframe, .auto_height embed, .auto_height video{
    transform: translate(0%, -66%);
}



  html {font-weight: 400;}
  body {min-width:320px; font-size: 14px;}
  .pc {display: none !important ;}
  .mobile {display: block !important; overflow: hidden ;}
  select {min-width:100px;height: 30px;}
  .select::after{
        line-height: 30px;
        width: 30px;
        margin-left: -30px;
}
  ul.nine li , ul.six > li{width: 33.3333% !important;}
  #wrap {min-width: 320px;}

  input[type="text"], input[type="tel"], input[type="password"], textarea{font-size:  12px;padding: 3px 10px;height: 14px;}
  textarea {min-height: 40px;}
  [data-aos^=fade][data-aos^=fade] {transform: translate3d(0,50px,0);}
[data-aos=fade-up]{}

  /* MARGIN */
  .m_10{margin:5px !important;}
  .m_20{margin:10px !important;}
  .m_30{margin:15px !important;}

  .m_lr_10{margin-left:5px !important; margin-right:5px !important; }
  .m_lr_20{margin-left:10px !important; margin-right:10px !important;}
  .m_lr_30{margin-left:15px !important; margin-right:15px !important;}

  .m_tb_10{margin-top:5px !important; margin-bottom:5px !important; }
  .m_tb_20{margin-top:10px !important; margin-bottom:10px !important;}
  .m_tb_30{margin-top:15px !important; margin-bottom:15px !important;}


  .m_t_10{margin-top:5px !important;}
  .m_t_20{margin-top:10px !important;}
  .m_t_30{margin-top:15px !important;}
  .m_t_40{margin-top:20px !important;}
  .m_t_50{margin-top:25px !important;}
  .m_t_60{margin-top:30px !important;}
  .m_t_80{margin-top: 40px !important;}
  .m_t_100{margin-top:50px !important;}

  .m_r_10{margin-right:5px !important;}
  .m_r_20{margin-right:10px !important;}
  .m_r_30{margin-right:15px !important;}

  .m_b_10{margin-bottom:5px !important;}
  .m_b_20{margin-bottom:10px !important;}
  .m_b_30{margin-bottom:15px !important;}
  .m_b_40{margin-bottom:20px !important;}
  .m_b_50{margin-bottom:25px !important;}
  .m_b_60{margin-bottom:30px !important;}

  .m_l_10{margin-left:5px !important;}
  .m_l_20{margin-left:10px !important;}
  .m_l_30{margin-left:15px !important;}
  .m_l_40{margin-left:20px !important;}
  .m_l_50{margin-left:25px !important;}
  .m_l_60{margin-left:30px !important;}


  /* PADDING */

  .p_10{padding:5px !important;}
  .p_20{padding:10px !important;}
  .p_30{padding:15px !important;}

  .p_tb_0 {padding-top:0px !important; padding-bottom:0px !important;}
  .p_tb_10{padding-top:5px !important; padding-bottom:5px !important;}
  .p_tb_20{padding-top:10px !important; padding-bottom:10px !important;}
  .p_tb_30{padding-top:15px !important; padding-bottom:15px !important;}
  .p_tb_50{padding-top:25px !important; padding-bottom:25px !important;}
  .p_tb_100{padding-top:50px !important; padding-bottom:100px !important;}

  .p_t_10{padding-top:5px !important;}
  .p_t_20{padding-top:10px !important;}
  .p_t_30{padding-top:15px !important;}
  .p_t_50{padding-top:25px !important;}
  .p_t_100{padding-top:50px !important;}

  .p_r_10{padding-right:5px !important;}
  .p_r_20{padding-right:10px !important;}
  .p_r_30{padding-right:15px !important;}

  .p_b_10{padding-bottom:5px !important;}
  .p_b_20{padding-bottom:10px !important;}
  .p_b_30{padding-bottom:15px !important;}
  .p_b_50{padding-bottom:25px !important;}
  .p_b_100{padding-bottom:50px !important;}

  .p_l_10{padding-left:5px !important;}
  .p_l_20{padding-left:10px !important;}
  .p_l_30{padding-left:15px !important;}

  .font_18 {font-size: 14px !important;}
  .font_20 {font-size: 14px !important;}
  .font_22 {font-size: 14px !important;}
  .font_24 {font-size: 16px !important;}
  .font_30 {font-size: 16px !important;}
  input[type=checkbox]:checked + label:before{top:0;}


  /* title */
  .title {width: auto;}
  .title:before {border-bottom: 1px solid #e1e1e1;top: 26px;}
  .title h2 {font-size: 20px;padding: 0 10px;}

  .title h2 > span {font-size: 40px;letter-spacing: -3px;padding: 2px 4px 0 4px;margin-right: 5px;line-height: inherit;}
  .title h2 > span > em {font-size: 20px;}
  .tit_en {margin: 10px 0 25px;letter-spacing: 3px;font-size: 10px;color: #bbb;text-align: center!important;display: block;}

  .bg::before, .bg::after, .bg > div::after, .bg > div::before{display: none;}
  .bg ul::after{font-size: 73px;bottom: -37px;}

  /* .layer_pop {top:20px;}
  #pop {position: absolute;width: 300px;left: 50%;margin-left: -150px;top: 50px;z-index:310;display: none;}
  #pop img  {width: 100%;} */




  
  /* footer */

  footer > .inwrap{padding: 0 15px !important;width:auto;}
  footer > .inwrap > ul{margin-top: 0;margin-left: -20px;text-align: center;margin-bottom: 0;}
  footer > .inwrap > ul > li{padding-left:20px;width: 100%;}
  footer > .inwrap > ul > li:nth-child(4){width:100%;}
  footer > .inwrap > ul > li > form input, footer > .inwrap > ul > li > form textarea{width:100%; -moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; min-height:30px}
  footer > .inwrap > ul > li > form textarea{min-height:100px;}
  footer > .inwrap > ul > li > form button{font-size:14px; height:auto; padding:10px}
  footer > .inwrap > ul > li .phone{font-size: 30px;letter-spacing: -1px;}
  /* footer > .inwrap > ul > li:first-child, footer > .inwrap > ul > li:nth-child(2) {width:50%;} */
  footer > .inwrap > ul > li > h4{font-size:16px;margin-top: 30px;}
  footer > .inwrap > ul > li > h4 span{font-size: 20px;}
  footer > .inwrap > ul > li .kakao{height: 32px;font-size: 13px;padding: 8px 10px 12px 69px;}
  footer > .inwrap > ul > li .kakao::before{font-size: 38px;height: 52px;}
  footer > .inwrap > ul > li:last-child p {font-size:14px;}

  footer .foot_menu{margin-top: 30px;}
  footer .foot_menu ul{padding: 10px; text-align: center;}
  footer .foot_menu ul li a{font-size: 11px;}
  footer .foot_menu ul li:first-child a {display: none;}
  footer .foot_menu ul li:nth-child(2) a {border-left: none;}
  footer .foot_menu ul li.doc_down {display: block; margin-top: 10px;}
  footer .foot_menu ul li.doc_down a {margin-left: 0; font-size: 12px; height: 26px; line-height: 24px; padding: 0 14px;}

  footer .copy {font-size: 11px;text-align: center;padding: 15px 0 90px;}
  footer .copy .inwrap address{float: none;}
  footer .copy .inwrap address br {display: none;}
  footer .copy .inwrap address p{display: block; margin:0 10px }
  footer .copy ul {display: none;}
}

/* 4. 모바일 (해상도 767px 이하) */
@media all and (max-width:320px) {
  .mobile_s {display: block !important; overflow: hidden ;}
}

@media screen and (max-width: 1378px) {
  .quick_menu {/* display: none; */}
}


@media screen and (max-width: 767px) {
  .quick_menu {display: block;top: auto;bottom: -476px;width: 100%;left: 0;right: 0;background: #fff;}
  .quick_menu.f_nav{top:auto}
  .quick_menu > ul{width:100%;margin-bottom: 0;}
  .quick_menu > ul > li{float:left;width:20%;/* height:60px */border-right: 1px solid #ccc;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;background: var(--color_main);}
  .quick_menu > ul > li:nth-child(4),.quick_menu > ul > li:nth-child(5),.quick_menu > ul > li:nth-child(6){display:none;}
  .quick_menu > ul > li.hover {background: #494949;}
  .quick_menu > ul > li > a{/* height:60px; */padding: 6px 0;width: 100%;border-bottom: 0;}
  .quick_menu > ul > li:nth-child(6){border:0;/* border-top: 1px solid #d5d5d5; */-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
  .quick_menu > ul > li > a span{opacity: 1;padding-top: 0;}
  .quick_menu > ul > li a::before {margin-top:0;font-size: 30px;}
  .quick_menu.open{bottom:0;}
  .quick_menu > div{width:100%;height: 475px;}
  .layerwrite .wraper{font-size:1em;}
  .layerwrite .quick_counsel table th{padding: 0 15px;width: 60px;}
  .layerwrite .quick_counsel form input[type="text"]{width: 100%;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;height: 2.5em;}
  .layerwrite .quick_counsel form textarea {width: 100%;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;height: 50px;min-height: 120px;}

}

/*------------------------------ sub -------------------------------------*/


@media screen and (max-width:  767px) {

  
  .content_wrap p.auto_height {margin-bottom:0 }
}


.content_wrap .inwrap {max-width:1200px;margin: 0 auto;padding-bottom: 120px;font-size: 18px;line-height: 1.6;/* font-weight:300; */}

/* sub_title */
#sub .sub_title { text-align: center;}
#sub .sub_title::before {width: 1px;height: 82px;background: none;content: '';display: inline-block;margin-bottom: 30px;}
#sub .sub_title > span.num {font-size: 48px;color: #8461a9;background: #fff;font-family: 'Montserrat', sans-serif;display: inline-block;width: 66px;border: 8px solid #c4addd;font-weight: 700;border-radius: 100px;height: 66px;line-height: 66px;text-align: center;position: relative;z-index: 1;margin:-38px 0 30px 0;}
#sub .sub_title h5{font-size: 1.3em;color:#111;font-weight:400}
#sub .sub_title h2, #sub .sub_title .board-title {font-size: 50px;color: #111;line-height: 50px;}
#sub .sub_title h2 em {font-weight: 300;}
#sub .sub_title h2 span {font-size:30px; display:block; font-weight:400}
#sub  h3 {font-size: 40px;font-weight: 100;color: #111111;margin-bottom: 60px;text-align: center;}
#sub  h3::after{border-bottom: 1px solid #e1e1e1;width: 100%;display: block;content: '';position: relative;top: -34px;z-index: -1;}
#sub  h3 p {background: #fff;display: inline-block; padding: 0 20px;}
#sub  h3 p span {display:block;font-size: 30px;}
#sub  h3 p i:before {font-size: 60px;margin:0;position: relative;}

#sub section.bg_grey .sub_title {background: #f6f6f8 ; color: #333}
#sub section.bg_grey  h3 p {background:#f6f6f8;z-index: 1;position: relative;}
#sub section.bg_grey  h3::after {border-bottom: 1px solid #c3bbbc;z-index: 0;}


#sub .sub_title h4 {font-size: 30px;font-weight: 100;color: #222;margin-bottom: 60px;}
#sub .sub_title h4::after{border-bottom: 1px solid #e1e1e1;width: 100%;display: block;content: '';position: relative;top: -22px;z-index: -1;}
#sub .sub_title h4 p {background: #fff;display: inline-block;padding: 0 20px;line-height: 1.4;}
#sub .sub_title h4 p b {font-weight: 600;color: #8461a9;}

#sub section.bg_grey {background: #f6f6f8;overflow: hidden;}
#sub section.bg_grey .sub_title h4 p {background:#f6f6f8;z-index: 1;position: relative;}
#sub section.bg_grey .sub_title h4::after {border-bottom: 1px solid #c3bbbc;z-index: 0;}

/* SEO: 화면에 안 보이지만 스크린리더/검색엔진엔 노출되는 숨김 텍스트 */
.blind{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0;white-space:nowrap;}
.section_title{text-align:center;margin: 0 auto;max-width: 1200px;padding: 100px 0 80px 0;}
.section_title h1, .section_title h2, .section_title .board-title {font-size: 60px;color: #222;line-height: 1;}
.section_title h1:before, .section_title h2:before, .section_title .board-title:before {width:100px;height:2px;content:'';display: block;background: #8461a9;margin: 0 auto 30px;}
.section_title h1 span, .section_title h2 span, .section_title .board-title span {
    display: block;
    font-size: 30px;
    font-weight: 400;
    margin-bottom: .5em;
}
.section_title h4 {color: #222;font-size: 30px;font-weight: 300;}
/* .section_title h4 p:after {display: block;margin: 70px auto 0;content: '\e82d';font-family: 'snarane';color: #ccc;}
.section_title h4:after {content:'SCROLL';font-size:14px;color:#ccc;height: 16px;} */


.dot_tit{font-size: 36px;font-weight: 400;font-family: 'NanumSquare';line-height: 1.3em;}
.dot_tit::before, .dot_tit::after {content: '\e832';font-family: 'snarane';display: block;font-size: 60px;line-height: 80px;color: #c4addd;}
.dot_tit::after {content: '\e833';}
.dot_tit span {font-size: 24px;display: inline-block;}


/* sub_visual */
.sub_visual {width: 100%;min-width: 1260px;height: 454px;background: url(../images/common/subvisual_bg.jpg) center no-repeat;/* margin-top: 154px; */position: relative;/* margin-bottom: 22px; */background-size: cover;}
.sub_visual .text_wrap {color: #fff;text-align: center;padding-top: 182px;}
.sub_visual .text_wrap h2, .sub_visual .text_wrap .hero-title{font-size: 36px;line-height: 1.3;font-weight:100;letter-spacing: 10px;opacity: .6;}
/* .sub_visual .text_wrap h2 br {display: none;} */
.sub_visual .text_wrap h2 b{font-weight: 600;}
/* .sub_visual .text_wrap h2:after{content: 'NARANE ORTHODONTIC CLINIC';display: block;font-size: 12px;margin-top:10px;font-family: notosan;font-weight: 100;opacity: .5;letter-spacing: 10px;} */
.sub_visual .text_wrap p {font-size: 24px;}

/* .sub_visual .sub_nav {position: absolute;bottom: 18px;left: 0;right: 0;padding: 15px 0 20px 0;text-align: center;z-index: 1;}
.sub_visual .sub_nav li {display:inline-block;margin: 0;background: #383634;padding: 10px 20px;min-width: 110px;}
.sub_visual .sub_nav li a {color: #ccc;font-size: 18px;display: block;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.sub_visual .sub_nav li:hover a, .sub_visual .sub_nav li a.active, .sub_visual .sub_nav li a.active:before {color: #fffcc7;}
.sub_visual .sub_nav li:hover a::before {color: #fffcc7;}
.sub_visual .sub_nav li a::before {font-family:'snarane';content: '';display: block;font-size: 44px;color: #ccc;line-height: 62px;}
 */

.sub_nav {max-width:  1200px;margin: 0 auto;width:  100%;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;position: relative;margin-top: -110px;margin-bottom: 63px;display: flex;}
.sub_nav:after {content:''; display:block;clear:both;}
.sub_nav li {background:#fff;float:left;border-left: 1px solid rgb(197, 192, 184);-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 10px 0;font-size: 18px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;font-weight: 500;flex: 1;}
.sub_nav li a {color:#2e2e2e;display: block;text-align: center;}
.sub_nav li:hover {background: #373539;border-left: 1px solid #373539;}
.sub_nav li:hover a{color: #cac1d3;}
.sub_nav li.active {background: #603988 !important;border-left: 1px solid #603988 !important;}
.sub_nav li.active a{color:#fff !important}
.sub_nav li.active:hover {border-left: 1px solid #b69c71;}


.board_cate {margin: 0 auto 50px;max-width: 1200px;position: relative;z-index: 1;}
.board_cate ul {text-align: center;}
.board_cate li {border:1px solid #ddd;background:#f7f7f7;width: 14.28571428571429%;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;float: left;/* border-bottom: 1px solid #222; */}
.board_cate a {display:block;position:relative;padding: 15px 0px;font-size: 18px;color: #222;text-align:center;line-height:1.2em;font-weight: 400;}
.board_cate .active, .board_cate li:hover {z-index:2;border:1px solid #63533a;background:#fff;font-weight:bold;position: relative;/* border-bottom: 0; */}
.board_cate .active a {color: #8461a9;font-weight: 500;}
.board_cate:after {clear:both;content:''; display:block}



@media screen and (max-width:  767px) {
  #sub .inwrap {margin:0 15px 0 15px;}
	.content_wrap .inwrap{font-weight:400}
  .content_wrap .inwrap{padding-bottom: 40px;font-size: 14px;}

  .section_title{padding: 30px 0;/* padding: 0; */}
  .section_title h1, .section_title h2, .section_title .board-title {font-size: 24px;}
	.section_title h1:before, .section_title h2:before, .section_title .board-title:before{margin-bottom: 15px;width: 50px;}
   .section_title h1 span, .section_title h2 span{font-size:18px}
  .section_title h4 {font-size: 18px;font-weight: 400;}
  .section_title h4 p:after {margin-top: 20px;}
  .section_title h4:after { font-size: 12px;margin-left: -20px;}

  .dot_tit{font-size: 16px;}
  .dot_tit span {font-size: 14px;line-height:18px;display: inline-block;}
  .dot_tit::before, .dot_tit::after {font-size: 24px;line-height: 30px;}


  .sub_visual {/* margin-top: 57px; */min-width: 320px;height: 170px;background-size: cover;}
  .sub_visual .text_wrap {padding-top: 80px;}
  .sub_visual .text_wrap h2, .sub_visual .text_wrap .hero-title{font-size: 16px;margin-bottom: 20px;padding: 0 15px;}
  .sub_visual .text_wrap h2 br {display: block;}
  .sub_visual .text_wrap h2:after{font-size: 10px;letter-spacing: 5px;}
  .sub_nav {padding: 0;margin: 0;}
  .sub_nav.f_nav {position:fixed;z-index: 2;top: 56px;}
  .sub_nav.eight li{width: 33.3333% !important;}
  .sub_nav.eight li:first-child, .sub_nav.eight li:nth-child(2) {width: 50% !important;}
  .sub_nav li{margin: 0;border-bottom: 1px solid rgb(197, 192, 184);display: flex;align-items: center;justify-content: center;}
  .sub_nav li a{font-size: 13px;line-height: 1.2em;}
  .sub_nav li a::before{display: none;}

  .sub_nav li:hover {background: #fff;border-left:1px solid rgb(197, 192, 184);}
  .sub_nav li:hover a{color:#2e2e2e; }


  #sub h3 {margin-bottom: 20px;font-size: 20px;}
  #sub h3 p{padding: 0 10px;font-size: 20px;}
  #sub h3 p span{font-size:15px}
  #sub h3::after{top: -18px;}
  .bottom_line {font-size: 16px;}

  #sub .sub_title::before {height: 50px;margin-bottom: 10px;}
  #sub .sub_title > span.num {width: 40px;height: 40px;line-height: 40px;font-size: 3em;border-width: 4px;margin-bottom: 15px;}
  #sub .sub_title h2, #sub .sub_title .board-title {font-size: 22px;line-height: 28px;letter-spacing: -1px;}
  #sub .sub_title h2 span{font-size:16px}
  #sub .sub_title h3 {font-size: 20PX;margin-bottom: 15px;}
  #sub .sub_title h3 p {padding: 0 5px;}
  #sub .sub_title h3::after {top: 8px;margin-bottom: 30px;}
  #sub .sub_title h4 {font-size: 16px;margin-bottom: 20px;font-weight: 400;}
  #sub .sub_title h4 p{padding: 0;}
  #sub .sub_title h4::after{top: 10px;margin-bottom: 30px;}

  .mobile_left {text-align: justify !important; }


  .board_cate {padding: 0;}
  .board_cate ul {border-left: 1px solid #ddd;overflow: hidden;}
  .board_cate li {width: 33.3333%;border: 1px solid #ddd;margin-top: -1px;border-left: 0;}
  .board_cate li:first-child,.board_cate li:nth-child(2),.board_cate li:nth-child(3) {margin-top:0}
  .board_cate a {font-size: 12px;padding: 10px 0;}
  .board_cate .active, .board_cate li:hover {border: 1px solid #63533a;}

}




.animated {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.delay_2{    -webkit-transition-delay: 2s; /* Safari */
    transition-delay: 2s;}
.delay_4{    -webkit-transition-delay: 4s; /* Safari */
    transition-delay: 4s;}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}


@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}



@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

 50% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
 50% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
      -webkit-transition-delay: 5s;
    -moz-transition-delay: 5s;
    -o-transition-delay: 5s;
    transition-delay: 5s;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}


@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}