body {position:relative;font-family: "Nanum Gothic", sans-serif;letter-spacing: -0.7px;max-width: 1024px;margin: 0 auto}
.rp_img {width: 100%;height: auto}
.hf_img {width: 50%;height: auto}
.d_b {display: block}
.mb20 {margin-bottom: 20px}

.clearfix:before, .clearfix:after{content:" ";display:table;}
.clearfix:after{clear:both;}
.clearfix{*zoom:1;}

#header {position: fixed;top:0;width: 100%;max-width: 950px;height:60px;z-index: 9992;transition:.5s;background-color:#141f34}
#header #mn_btn {position: absolute;top:21px;left:15px; padding-top:22px;cursor: pointer; color:#fff;font-size: 11px;}
#header #mn_btn span {position: absolute;width:22px;height:1px;background: #fff;display: block;-webkit-transition: .3s;transition: .3s}
#header #mn_btn span:nth-child(1) {top: 0px}
#header #mn_btn span:nth-child(2) {top: 8px;width:18px}
#header #mn_btn span:nth-child(3) {top: 16px}
#header h1 {text-align: center;height:inherit;font-size: 0}
#header h1:before {content: '';display: inline-block;height: 100%;vertical-align: middle}
#header h1 a {width:35%;display: inline-block;vertical-align: middle}
#header h1 a img {width: 100%;height: auto}
#header .consultBtn {position:absolute;right:15px;top:18px;height: 25px;}
#header .consultBtn img {height:100%; position: absolute; right: 0; top: 0;}
#header .consultBtn img.consultClose {display:none;height: 75%;top: 12%;}


#nav {overflow: scroll;position: fixed;top: 0;padding-top:60px;background: #141f34;width:100%;height: 100%;z-index:9991;-webkit-box-sizing: border-box;box-sizing: border-box;margin-left: -1000px;-webkit-transition: margin .6s;transition: margin .6s;display: none}
#nav .lang {height:55px;line-height:52px;border-top:1px solid #666d7b;border-bottom:1px solid #666d7b}
#nav .lang > div {width: 120px;margin:0 auto}
#nav .lang a {float:left;margin:0 5px;width:30px}
#nav .lang a img {width:100%}

#nav .login {padding:25px 0 10px;margin:0 15px;border-bottom:1px solid #eee}
#nav .login a {color:#fff;margin-right: 8px;}

#nav .nav_con > li {position:relative;float:left;width:48%}
#nav .nav_con > li:nth-child(2n-1) {margin-right:4%}

#nav .nav_con > li:after {content:'>';position:absolute;right:5px;top:50%;transform:translateY(-50%);font-size:16px;color:#fff;display:block;font-weight:300}

#nav .nav_con > li h3 {position:relative;font-weight:500;font-size: 15px;display: block;border-bottom: 1px solid #ccc;padding:12px 0 12px 10px;-webkit-transition: background .3s , color .3s;transition: background .3s , color .3s;cursor: pointer}
/*#nav .nav_con > li h3:before {content:'·';position:absolute;left:0;top:50%;transform:translateY(-55%);font-size:25px;color:#fff;display:block;font-weight:500}*/
#nav .nav_con > li h3 a {display:block;color:#fff}

#head_wrap.on #nav {margin-left: 0;/*max-width: 360px;*/min-width: 280px;width:100%;}
#head_wrap.on .dark_bg {position: fixed;width: 100%;height: 100%;-webkit-transition: .4s;transition: .4s;background: rgba(0,0,0,0.7);z-index: 400;}
#head_wrap.on #mn_btn span:nth-child(1) {top: 10px;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
#head_wrap.on #mn_btn span:nth-child(2) {-webkit-transform: rotate(90deg);transform: rotate(90deg);opacity: 0}
#head_wrap.on #mn_btn span:nth-child(3) {top: 10px;-webkit-transform: rotate(135deg);transform: rotate(135deg);}


/*메뉴 뉴버전 추가*/
#nav .navBest {padding:13px 15px 10px;background-color:#345798;width:100%}
#nav .navBest a {float:left;width:19%;margin-right:1.25%}
#nav .navBest a:last-child {margin-right:0}
#nav .navBest a img {width:100%;}
#nav .navBest a h3 {display:block;text-align:center;color:#fff;font-size: 12px;margin-top: 5px;font-weight: 400;}
#nav .nav_con {padding:0 15px}

#nav .navSlideWrap {padding:25px 15px 50px;}
#nav #navSlide {width:100%;}
.swiper-slide img {width:100%}
#nav #navSlide .swiper-pagination-bullet {background-color:#999;opacity:1;margin:0 3px}
#nav #navSlide .swiper-pagination-bullet-active {width:18px;border-radius:15px;background-color:#222}

#head_wrap.on #header {}

#snb {display:none}/*pc서브메뉴*/
#m_snb {margin-top:60px;}
#m_snb:after {content: '';display: block;clear: both;}
#m_snb .snb_lr {position:relative;float:left;width: 50%;border-right: 1px solid #aaa;-webkit-box-sizing: border-box;box-sizing: border-box;z-index:10}
#m_snb .snb_lr ul {display: none;padding:5px!important;position:absolute;width:100%!important;background:#effffb;border:1px solid #eee;-webkit-box-sizing:border-box;box-sizing:border-box;z-index: 999;}
#m_snb .snb_l ul {background: #eee}
#m_snb .snb_lr ul li {border-bottom: 1px solid #ddd}
#m_snb .snb_lr ul li:first-child {border-top: 1px solid #ddd}
#m_snb .snb_lr ul a {display: block;font-size:14px;padding:11px 0}

#m_snb > .snb_3deps{
    position: relative;
    display: none;
}
#m_snb .snb_3deps ul {
    position:absolute; 
    top:40px; 
    left: 0px;
    display: none; 
    padding:5px;
    width:100%;
    background:#effffb;
    border:1px solid #eee;
    z-index: 999;
}
#m_snb .snb_3deps ul li {border-bottom: 1px solid #ddd}
#m_snb .snb_3deps ul li:first-child {border-top: 1px solid #ddd}
#m_snb .snb_3deps ul a {display: block;font-size:14px;padding:11px 0}

#m_snb .snb_on1,
#m_snb .snb_on2, 
#m_snb .snb_on3 {
    display: flex;
    align-items: center;
    font-size:13px;
    padding: 6px;
    font-weight: 500;
    height:40px;
    width:100%; 
}
#m_snb .snb_on1 {
    color: #333;
    background: #eee;
}
#m_snb .snb_on2 {
    color: #fff;
    background: #03a4b2;
}
#m_snb .snb_on3 {
    position: relative;
    width: 100%;
    color: #fff;
    background: #5bbda5;
}

#m_snb .snb_on2:after, 
#m_snb .snb_on3:after {
    content: '';
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #fff;
    -webkit-transition: .3s;
    transition: .3s; 
    position:absolute; 
    top:17px; 
    right:5%; 
} 
#m_snb .snb_on2.on:after,
#m_snb .snb_on3.on:after{
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

#m_snb.depth03On .snb_lr,
#m_snb.depth03On .snb_3deps{
    width: 33.3%;
}
#m_snb.depth03On .snb_3deps{
    float: left;
    display: block;
}

#footer {}
#footer .ft1 {font-size: 0}
#footer .ft1 a img {width:25%}
#footer .ft2 {text-align: center;background: #171717;padding:30px 15px 70px}
#footer .ft2 p {font-size: 12px;line-height: 20px;color: #fff;word-break: keep-all}
#footer .ft2 p.copy {padding: 10px 0 0;font-size:11px}



/*상단상담신청폼*/
.topConsult {width:100%; height:calc(100vh - 60px); position:fixed; top:-1000px; left:0; background-color:#f9f9f9; transition:.7s; z-index:998}
.topConsult .consultNav ul li {float:left;width:50%;height:50px;line-height:50px;text-align:center}
.topConsult .consultNav ul li a {display:block;color:#222;font-size:13px;border-bottom:1px solid #cccccc}
.topConsult .consultNav ul li a.on {background-color:#ff6773;color:#fff;border-bottom:1px solid #ff6773}

.topConsult .consult01 > img {width:100%}
.topConsult article.counseling{width: 100%;padding:0 15px;}
.topConsult article.counseling > form{display: flex;flex-direction: column;}
.topConsult article.counseling > form input {border:none;background-color:#fff;box-shadow:none;height:35px;padding-left: 8px;box-sizing: border-box;border: 1px solid #ccc}
.topConsult article.counseling > form input.name {width:100%;margin-bottom:10px}
.topConsult article.counseling > form .charTel input {width:32%;float:left;margin-bottom:10px}
.topConsult article.counseling > form .charTel input:nth-child(2) {margin:0 2%}
.topConsult article.counseling > form .counselingSelect select {width:100%;height:35px;background-color: #fff;border: none;border: 1px solid #ccc; padding-left: 3px;}
.topConsult article.counseling > form .conTxt {height:70px;width:100%;border-color: #ccc; margin-top: 10px;padding: 8px;resize: none}
.topConsult article.counseling > form .checkBox {color:#555;margin:10px 0 15px}
.topConsult article.counseling > form .checkBox .agree {margin-right:10px}
.topConsult article.counseling > form .checkBox input {height:auto;margin-right:5px;vertical-align: top;margin-top: 2px;}
.topConsult article.counseling > form .result button {width:100%;border:none;background-color:#141f34;color:#fff;font-size:14px;text-align:center;height:40px;line-height:40px}

/* terms */
#terms {position: fixed;z-index: 1103;width:96%;height:calc(100vh - 150px);background: #fff;top: 105%;left:2%}
#terms .t_group {display: -webkit-box;display: -ms-flexbox;display: flex;height:45px}
#terms .t_group > li {-webkit-box-flex: 1;-ms-flex: 1;flex: 1}
#terms .t_group > li+li .mn {border-left: 1px solid #ddd}
#terms .mn {position: relative;height:45px;line-height:45px;background: #f6f6f6;border-bottom: 1px solid #ddd;text-align: center;font-size:13px;cursor: pointer;outline: none}
#terms .mn.on {background: #fff;border-bottom: 0;font-weight: 500}
#terms .mn.on:before {content: '';position: absolute;left: 0;top: 0;width: 100%;height: 2px;background: #1a3544}
#terms .cont { display: none;position: absolute;top:45px;left: 0;right: 0;bottom: 0;padding: 15px 10px;-webkit-transition: opacity .4s;transition: opacity .4s;}
#terms .mn.on+.cont {display: block;}
#terms h5 {font-size:20px;text-align: center;font-weight: 500;margin: 0 0 20px}
#terms .txt { white-space: pre-line;border: 1px solid #ddd;padding:10px;font-size: 12px;line-height: 25px;overflow: auto;height:calc(100% - 60px);word-break: keep-all}
#terms_bg {display: none;position: fixed;left: 0;top: 0;right: 0;bottom: 0;width: 100%!important;height: 100%!important;z-index: 1102;background: #000;opacity: 0.7}
#terms_close {opacity: 0;-webkit-transform: scale(0);transform: scale(0);position: absolute;right:0;top:-35px;cursor: pointer;width:25px}
#terms_close img {width:100%}

/*하단퀵메뉴*/
#quick_bottom{display:none}
#quick_bottom i{overflow:visible!important;}
#bottom_menu{display:none;}
body #quick_bottom{position:fixed; bottom:50px; right:90px; z-index:97;  animation:bounce 2s ease 0s infinite; transition:bottom 0.3s ease;}
body .share-button, body .share-toggle-button {position: absolute; display: inline-block; left: 50%; top: 50%; border-radius: 110px!important; width:80px;
height:35px; padding:10px!important; background: #ccc; text-align: center; color: #fff; border: none; outline: none; padding:0!important; line-height:41px; }

body .share-toggle-button .quickClose {display:none;margin:16px auto 0;width: 40%;}
  
body .share-items {list-style-type: none; padding: 0; margin: 0;display:none}  
body .share-items .share-item .share-button {width:60px;height:60px;border: none !important;background:none}
body .share-items .share-item .share-button img {width:100%}

body .share-item {display: inline-block;}  
body .share-item i{vertical-align:middle;  position:relative; font-size:22px; margin-right:5px; color:#333; }  
.share-toggle-button > div {
	width: .5rem;
	height: .5rem;
	background-color: #fff;

	border-radius: 100%;
	display: inline-block;
	margin:0 0 0 .2rem;
	-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
	animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.share-toggle-button .bounce1 {
	-webkit-animation-delay: -0.32s;
	animation-delay: -0.32s;
}

.share-toggle-button .bounce2 {
	-webkit-animation-delay: -0.16s;
	animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {

	0%,
	80%,
	100% {
		-webkit-transform: scale(0)
	}

	40% {
		-webkit-transform: scale(1.0)
	}
}

@keyframes sk-bouncedelay {

	0%,
	80%,
	100% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	40% {
		-webkit-transform: scale(1.0);
		transform: scale(1.0);
	}
}

  
body .share-item span{font-size:12px; width:65px; font-weight:500;}      

body .share-toggle-button{line-height:35px!important; z-index: 9; background:linear-gradient(45deg, #ffb77b,#ff6773) }    
body .share-button:hover, 
body .share-toggle-button:hover {color: #fff;}      
body .share-button {font-size:inherit; color: #fff; background: #fff; -webkit-transform: scale(0.95, 0.95); transform: scale(0.95, 0.95);color: #333!important; border:2px solid #c5c5c5!important; display:flex; align-items:center; justify-content: center;}      

body #quick_bottom .share-toggle-button > i{position:absolute; top:5px; height:30px; line-height:30px; top:7.5px; left:20px; font-size:20px; opacity:0; transition:opacity 0.3s ease-out 0s; display:flex; align-items:center; justify-content: center;flex-direction: column;}
body #quick_bottom .share-toggle-button > i:nth-of-type(1){opacity:1;}    
body #quick_bottom .share-toggle-button .icon_off{opacity:0!important;}
body #quick_bottom .share-toggle-button span{display:inline-block;}  
body #quick_bottom.active_quick_bottom .share-toggle-button span{display:none}  
.jello {-webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; transform-origin: center;}
.animated {-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}
  
@-webkit-keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

@keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -7px, 0);
    transform: translate3d(0, -7px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}
  
  @media(max-width:1300px){
    #quick_bottom{display:block}
    body .inquiryBox .def{padding-right:150px!important; padding:10px 0;}
    body .inquiryBox .def footer button{width:140px!important;}
    #doc-wrap .inquiryBox{z-index:98}
  }


/*모바일 상세페이지*/
#sub_container #contents {display:none}
#sub_container #contents.in {display:block}
#sub_container #contents_m img {width:100%}
#sub_container #contents_m #sub_top_m {position: relative;width: 100%;}
#sub_container #contents_m #sub_top_m .subTitleText {opacity: 0;position: absolute;top: 0;left:0;width:100%;animation: subtop_ani1 .8s .3s 1 linear forwards;}
@keyframes subtop_ani1 {
    0% {transform:translateX(-50px);opacity:0}
    100% {transform:translateY(0);opacity:1}
}
#sub_container #contents_m #sub_top_m.no .subTitleText {opacity: 0;position: absolute;top:50%;transform:translateY(-50%);left:0;animation: subtop_ani2 .8s .3s 1 linear forwards;}
@keyframes subtop_ani2 {
    0% {width:0;opacity:0}
    100% {width:100%;opacity:1}
}
#sub_container #contents_m #sub_top_m.bn .subTitleText {opacity:0;position: absolute;top: 50%;left:0;transform:translateY(-50%);animation: subtop_ani4 .8s .3s 1 linear forwards}
@keyframes subtop_ani4 {
    0% {width:100%;opacity:0}
    50% {width:110%;opacity:1}
    100% {width:100%;opacity:1}
}
#sub_container #contents_m #sub_top_m.bd .subTitleText {animation: subtop_ani3 .8s .3s 1 linear forwards}
@keyframes subtop_ani3 {
    0% {opacity:0}
    100% {opacity:1}
}
#sub_container #contents_m #sub_top_m.sk .subTitleText {top:50%;transform:translateY(-50%);animation: subtop_ani2 .8s .3s 1 linear forwards}

/*필러,보톡스 등*/
#contents_m .clickNav {margin-top: 10px; margin-left: 4px;}
#contents_m .clickNav li {float:left;width:25%;border:1px solid #ccc;margin-left: -1px;margin-top: -1px;}
#contents_m .clickNav li a {display:block;width:100%;height:40px;line-height:40px;text-align:center;font-size:13px;color:#222;cursor:pointer}
#contents_m .clickNav li a.on {background-color:#f76b16;color:#fff}
#contents_m .clickImg {padding-bottom:35px}
#contents_m .clickImg img {display:none}
#contents_m .clickImg img.clickImg01 {display:block}

#contents_m .regio_tab {width:70%;margin:0 auto}
#contents_m .regio_tab li {float:left;width:50%;border:1px solid #222;margin-left:-1px}
#contents_m .regio_tab li a {width:100%;display:block;height:35px;line-height:35px;text-align:center;color:#222;cursor:pointer}
#contents_m .regio_tab li a.on {background-color:#f76b16;color:#fff}
#contents_m .tab_cont1 .clickNav li {width:33.333%}
#contents_m .tab_cont2 {padding-bottom:35px}

#contents_m .regio_area {width:100%;margin:0}
#contents_m .regio_area.ba_regio_area .regio_tab {width:90%;padding-top:0;height:auto}
#contents_m .regio_area.ba_regio_area .regio_tab li {width:25%}
#contents_m .regio_area.ba_regio_area .regio_tab li a {border:none;font-size:14px;letter-spacing: -1px;}
#contents_m .regio_area .tab_cont {display:none}
#contents_m .regio_area .tab_cont.tab_cont1 {display:block}