@charset "utf-8";

/* -----------------------------------------------------------------------------------------------
	웹폰트 
--------------------------------------------------------------------------------------------------*/
/* 나눔바른고딕 

@import url(https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css); 
  200, 300, 400, 700 */

/* 본고딕 */
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
 /*100, 300, 400, 500, 700, 900 */

@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

@import url(https://fonts.googleapis.com/earlyaccess/notosanssc.css);


/* 중국어 (간체) */
:lang(zh-Hans) {
  font-family: 'Noto Sans SC', sans-serif;
}


/* -----------------------------------------------------------------------------------------------
	초기화 CSS
--------------------------------------------------------------------------------------------------*/
body,div,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,a,button,select{margin:0;padding:0;box-sizing:border-box;}
body,input,textarea,select,button,table{font-family:"Noto Sans KR",“Apple SD Gothic Neo”,"맑은 고딕",“Malgun Gothic”,"돋움",dotum,sans-serif;font-size:18px;color:#333;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;text-size-adjust:none;}
body{min-width:320px;line-height:1.5;word-break:break-all; overflow:auto;}
h1,h2,h3,h4,h5,h6 {font-weight:normal;font-size:18px;}
a {color:#333;text-decoration:none;}
/*a:link {color:#333;text-decoration:none;}
a:visited {color:#333;text-decoration:none;}
a:active {color:#333;text-decoration:none;}
a:hover {color:#333;text-decoration:none;}*/
a:focus {outline:none;}
span, a, em, button {display:inline-block;}
img,fieldset,iframe{border:0;}
img{max-width:100%;vertical-align:top;}
li{list-style:none;}
em,address{font-style:normal;}
input,select,button{vertical-align:middle;margin:1px;}
input[type="checkbox"]{padding:1px;}
caption,
legend,
.blind{overflow:hidden;position:absolute;top:0;left:-9999px;width:0;height:0;font-size:0;line-height:0;text-align:left;}
input[type=text],
input[type=password],
input[type=email],
input[type=tel],
input[type=number]{width:100%;height:36px;/*padding:0 10px;/*border:1px solid #999;*/font-size:14px;color:#333;vertical-align:middle;-webkit-appearance:none;}
input[type=password],input[type=email]{ime-mode:disabled;}
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
select:focus,
textarea:focus{border:1px solid #999;}
input[type=file]{width:99.5%;height:30px;border:1px solid #d2d2d2;background:#fff;}
/*input[type=radio]{*width:13px;*height:13px;}*/
select{height:36px;padding-left:5px;border:1px solid #999;font-size:14px;color:#333;vertical-align:middle;}
textarea{width:100%;padding:10px;border:1px solid #999;font-size:14px;color:#333;resize:none;}
table{width:100%;border-collapse:collapse;border-spacing:0;}
table th {font-weight:normal;}
hr{display:none;}
label {cursor:pointer;}

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

.ir-pm {display:block;overflow:hidden;font-size:0px;line-height:0;text-indent:-9999px;} /* 사용된 이미지내 의미있는 텍스트의 대체텍스트를 제공할때 */
.screen-out {overflow:hidden;position:absolute;width:0;height:0;line-height:0;text-indent:-9999px;} /* 대체텍스트가 아닌 접근성을 위한 숨김텍스트를 제공할때 */

.f-l {float:left !important;}
.f-r {float:right !important;}
.dis-block {display:block !important;}
.dis-none {display:none !important;}
.ta-c {text-align:center !important;}
.ta-l {text-align:left !important;}
.ta-r {text-align:right !important;}
.vt-t {vertical-align:top !important;}
.vt-m {vertical-align:middle !important;}
.vt-b {vertical-align:bottom !important;}
.bg-none {background:none !important;}
.border-none {border:none !important;}
.ov-h {overflow:hidden !important;}
.clear-fix:after {content:"";display:block;clear:both;}

.pdt12 {padding-top:12px !important;}
.pdl40 {padding-left:40px !important;}

/* -----------------------------------------------------------------------------------------------
	기본 레이아웃
--------------------------------------------------------------------------------------------------*/
.container {position:relative; width:100%; max-width:1310px; margin:0 auto; padding:0px; /*padding:0 28px;*/}

/* 메뉴 건너뛰기 */
#skip-navigation a {position: absolute;width:100%;left:-9999px;color:#7f7e7e;text-decoration: none;font-size:18px;background:#000;background:rgba(0,0,0,.4);padding:.10px 12px 10px;text-shadow:0px 0px 5px #313131;}
#skip-navigation a:focus {left: 0;z-index:100;color: #fff;}



/* gnb, 푸터 */
#header {position:fixed;left:0;top:0;z-index:999;width:100%;}
#util-wrap {width:100%;height:34px;background:#f08300;}
.util-wrap-inner {position:relative;max-width:1310px;margin:0 auto;}
.social {position:absolute;top:7px;right:210px;font-size:0;}
.social a {width:20px;height:20px;background:url(../img/social-icon.png) no-repeat 0 0;}
.social a + a {margin-left:14px;}
.social .fb {background-position:0 0;}
.social .tw {background-position:0 -20px;}
.social .ut {background-position:0 -40px;}
.lang-wrap {position:absolute;top:5px;right:10px;font-size:0;}
.lang-wrap a {color:#ccc;font-size:12px;font-family:"돋움", dotum;}

.lang img{padding-top:3px !important;}


.lang:after {content:"";display:inline-block;width:1px;height:9px;margin:0 12px;background:#666;}
.med:before {content:"";display:inline-block;width:16px;height:16px;position:relative;top:2px;background:url(../img/icon_med.png) no-repeat 0 50%;}
.med:after {content:"";display:inline-block;width:1px;height:9px;margin:0 12px;background:#666;}
/*
.vet:before {content:"";display:inline-block;width:16px;height:16px;position:relative;top:2px;background:url(../img/lang-icon.png) no-repeat 0 0;}
*/


#gnb-wrap {width:100%;height:80px;background: rgba(255,255,255,1.0);border-bottom:1px solid rgba(204,204,204,.3);}
.gnb-wrap-inner {max-width:1310px;margin:0 auto;padding:32px 0px 0;}
.gnb-wrap-inner:after {content:"";display:block;clear:both;}
.gnb-wrap-inner h1 {float:left;font-size:0;margin-top:-30px;}



.gnb {float:right;margin-top:-2px; /*margin-left:250px;*/}
.gnb a {color:#000;text-decoration: none;}
.gnb .depth1:after {content:"";display:block;clear:both;}
.gnb .depth1 > li > a {position:relative;/*width:140px;*/height:50px;text-align:center;}
.gnb .depth1 > li.on > a:after {content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:#f08300;}
.gnb .depth1 > li {float:left;}
.gnb .depth1 > li + li {margin-left:80px;}
/*.gnb .depth2 {position:absolute;top:114px;left:0;right:0;height:60px;background:url(../img/gnb_depth2_bg.png) repeat-y 0 0;display:none;}*/
.gnb .depth2 {position:absolute;top:114px;left:0;right:0;height:80px;background:rgba(71,71,71,.9); display:none;}


.gnb .depth2-inner {position:relative;max-width:1310px;margin:0 auto;}

.gnb .depth2-inner > ul {position:absolute;z-index:10;margin-left:400px;}

.gnb .depth2-inner > ul > li {display:inline-block; padding:15px 0; text-align:center; line-height:52px; margin-right:50px;}

.gnb .depth2-inner > ul > li {position:relative;}
.gnb .depth2-inner > ul > li a {color:#fff;}
.gnb .depth2-inner > ul > li:hover:after {content:"";position:absolute;bottom:13px;left:0;right:0;height:1px;background:#fff;}


.gnb .m1 .depth2-inner > ul { left:-100px;}
.gnb .m3 .depth2-inner > ul { left:265px;}
.gnb .m4 .depth2-inner > ul { left:400px;}
.gnb .m5 .depth2-inner > ul { right:0px;}
.gnb .m6 .depth2-inner > ul { right:-50px;}


.sitemap-go {float:right;font-size:12px !important;}



.mobile-lang-wrap {display:none; position:absolute; top:20px; right:70px;}
.mobile-lang-wrap a {color:#fff;}
.mobile-lang-wrap .lang:after {display:none;}
.hamburger {display:none; position:relative; float:right; width:30px; height:30px; margin-top:-8px; text-indent:999999px; background:url('../img/btn_hamburger.png') 0 0 no-repeat; overflow:hidden;}
.hamburger.active {background-position:0 -30px;}
.mobile-gnb-panel {position:absolute; top:70px; left:100%; width:70%; max-width:475px; height:calc(100% - 70px); background:#474747; overflow-y:auto; z-index:999;}
.mobile-gnb > ul.accordion > li > a.toggle {position:relative; display:block; padding:20px; background:#474747; border-bottom:1px solid rgba(255,255,255,.1); font-family:'Noto Sans KR'; font-size:20px; color:#fff; line-height:40px;}
.mobile-gnb > ul.accordion > li > a.toggle .icon {position:absolute; top:50%; right:20px; width:24px; height:24px; margin:-12px 0; background:url('../img/icon_accordian.png') 0 0 no-repeat;}
.mobile-gnb > ul.accordion > li > a.toggle.on .icon {background-position:0 -24px;}
.mobile-gnb > ul.accordion .inner {display:none; background:#fff; overflow:hidden;}
.mobile-gnb > ul.accordion .inner a {position:relative; display:block; padding:20px; background:#fff; border-bottom:1px solid #ccc; font-family:'Noto Sans KR'; color:#333;}
.mobile-gnb > ul.accordion .inner a.toggle.on {border-color:transparent; color:#0057a4;}
.mobile-gnb > ul.accordion .inner a.toggle .icon {position:absolute; top:50%; right:20px; width:24px; height:24px; margin:-12px 0; background:url('../img/icon_accordian.png') 0 -48px no-repeat;}
.mobile-gnb > ul.accordion .inner a.toggle.on .icon {background-position:0 -72px;}
.mobile-gnb > ul.accordion .sub-inner {padding:0 0 15px 15px;}
.mobile-gnb > ul.accordion .sub-inner.show {border-bottom:1px solid #ccc;}
.mobile-gnb > ul.accordion .sub-inner a {padding:5px; border:none; color:#666;}
.mobile-gnb > ul.accordion .sub-inner a:before {display:inline-block; margin-right:5px; content:'-';}
.mobile-util-wrap {margin:20px 0; font-size:0; text-align:center;}
.mobile-util-wrap li {display:inline-block; margin:0 8px;}
.mobile-util-wrap li a {display:block; font-size:16px; color:#ccc; line-height:40px;}
.mobile-util-wrap li .icon {display:inline-block; width:40px; height:40px; margin-top:-5px; background:url('../img/icon_mobile_util.png') no-repeat; vertical-align:middle;}
.mobile-util-wrap li .icon.fb {background-position:0 0;}
.mobile-util-wrap li .icon.tw {background-position:0 -40px;}
.mobile-util-wrap li .icon.ut {background-position:0 -80px;}
.mobile-util-wrap li .icon.vet {margin-right:5px; background-position:0 -120px;}
.mobile-util-wrap li .icon.vet:before, .mobile-util-wrap li .icon.vet:after {display:none;}
.mobile-util-wrap li .icon.med2 {margin-right:5px; background-position:0 -160px;}
.dimd-gnb-panel {display:none; position:fixed; top:70px; left:0; width:100%; height:calc(100% - 70px); background:#000; opacity:.7; filter:alpha(opacity=70); z-index:998;}  
footer {position:relative; padding:20px 0; background:#000;}
footer:after {display:block; clear:both; content:'';}
footer .logo {display:block; float:left;  margin-top:20px;margin-right:60px;margin-bottom:10px;}
footer .logo img {width:150px; vertical-align:middle;}
.footer-body {position:absolute; width:auto; margin:0 300px;}

.footer-menu {width:100%; margin:0; line-height:1;text-align: center; padding-bottom: 20px;}


.info {width:100%; margin:0; line-height:1;}
.footer-menu li, .info li {display:inline-block;}
.footer-menu li+li:before, .info li:nth-child(2):before, .info li:nth-child(4):before {display:inline-block; padding:0 5px 0 0; font-size:15px; color:#eee; content:'|';}
.info li:nth-child(3):before {display:inline-block; padding:0 5px 0 0; content:'';}
.footer-menu li a, .info li, .info li a {font-size:14px; color:#eee;font-weight:300;}
.copyright {display:block; clear:both; margin-left:300px; font-size:14px; color:#ccc; line-height:2;}
.fm-wrap {position:relative; float:right;margin-top: 30px;}
.fm-wrap .fm-btn {display:block;width:210px; margin-top:10px; padding:10px; border:1px solid #999; font-size:12px; color:#999;}
.fm-wrap .fm-btn:after {content:""; position:absolute; top:27px; right:10px; width:13px; height:7px; background:url(../img/family_site_arr.png) no-repeat 0 -7px;}
.fm-wrap .fm-btn.on:after {background-position:0 0;}
.fm-wrap .fm-list {position:absolute; left:0; bottom:39px; width:210px; border:1px solid #999; background:#000; display:none;}
.fm-wrap .fm-list a {display:block;padding:10px;font-size:12px; color:#999;}

/* 사이트맵 */
#siteMap .layer-top {position:relative; height:60px;}
#siteMap .layer-cont {padding:0; height:485px;}
#siteMap .depth1 {display:block; width:100%; height:100%;}
#siteMap .depth1 > li {display:block; float:left; width:16.6%; height:100%; padding:20px 25px; -webkit-box-sizing:border-box; box-sizing:border-box;}
#siteMap .depth1 > li + li {border-left:1px solid #ccc;}
#siteMap .depth1 > li .tit {padding-bottom:20px; font-family:'Noto Sans KR'; color:#0a69c8; background:url(../img/dot_underline.png) bottom repeat-x;}
#siteMap .depth2 > li {padding:20px 0;}
#siteMap .depth2 > li + li {background:url(../img/dot_underline.png) top repeat-x; color:#0a69c8;}
#siteMap .depth3 > li {font-size:16px;}
#siteMap .depth3 > li:before {display:inline-block; margin-right:5px; content:'-';}
#siteMap .depth3 > li:first-child {margin-top:10px;}
#siteMap .external {padding-right:30px; background:url('../img/icon_external.png') right 50% no-repeat;}

/* ios */
a[x-apple-data-detectors] {
  color:inherit !important;
  text-decoration:none !important;
  font-size:inherit !important;
  font-family:inherit !important;
  font-weight:inherit !important;
  line-height:inherit !important;
  white-space:nowrap;
}

/* -----------------------------------------------------------------------------------------------
	공통 컨텐츠 미디어 쿼리
--------------------------------------------------------------------------------------------------*/

/* tablet & pc - 768px 이상 해상도 */
@media (min-width:768px){
	
}

/* Tablet – 768px~1024px 해상도에서 해석하는 코드 */
@media (min-width:768px) and (max-width:1024px){
	/* gnb */
	.gnb-list>li {margin:0 10px;}
}
@media (max-width:1290px){
	/* common */
	.container {padding:0 15px;}
}
@media (max-width:1023px){
	/* gnb */
	#util-wrap {display:none;}
	#gnb-wrap {height:70px;}
	.gnb-wrap-inner {padding:25px 15px 0;}
    .gnb-wrap-inner h1 {}

	.gnb, .sitemap-go {display:none;}
	.mobile-lang-wrap {display:inline-block;}

    .lang img{padding-top:8px !important;}

	.hamburger {display:block;}

	/* footer */
	.footer-body {position:relative; width:100%; margin:0 0 10px 0;}
	.footer-menu, .info {width:80%; margin:0 auto; text-align:center;}
	.info {margin:10px auto;}
	footer .logo {width:170px; height:40px !important; margin:0 0 5px 10%;border:0px solid red}
	.fm-wrap {margin:0 10% 0 0;}
	.fm-wrap .fm-btn {margin-top:0;}
	.fm-wrap .fm-btn:after {top:18px;}
	.copyright {margin:0; padding-top:10px; line-height:1.5; text-align:center;}
}
/* 모바일 – 320px~767px 해상도에서 해석하는 코드 */
@media (max-width:767px){
	/* footer */
	footer {padding:20px 0;}
	footer .logo img {max-width:170px;}
}
@media (max-width:533px){
	#gnb-wrap {height:50px;}
	.gnb-wrap-inner {padding-top:18px;}
	.mobile-lang-wrap {top:13px;}

    .lang img{padding-top:8px !important;}

	.mobile-gnb-panel {top:50px; height:calc(100% - 50px);}
	.dimd-gnb-panel {top:50px; height:calc(100% - 50px);}
	.gnb-wrap-inner h1 a {width:60%;padding-top:11px;}
	.mobile-gnb > ul.accordion > li > a.toggle {padding:10px; font-size:18px;}
	.mobile-gnb > ul.accordion > li > a.toggle .icon {width:16px; height:16px; margin:-8px 0; background-size:16px 64px;}
	.mobile-gnb > ul.accordion > li > a.toggle.on .icon {background-position:0 -16px;}
	.mobile-gnb > ul.accordion .inner a {padding:10px;}
	.mobile-gnb > ul.accordion .inner a.toggle .icon {width:16px; height:16px; margin:-8px 0; background-position:0 -32px; background-size:16px 64px;}
	.mobile-gnb > ul.accordion .inner a.toggle.on .icon {background-position:0 -48px;}
	.mobile-gnb > ul.accordion .sub-inner a {padding:5px;}
	.mobile-util-wrap li {margin:0 5px;}
	.mobile-util-wrap li a {line-height:30px;}
	.mobile-util-wrap li .icon {width:30px; height:30px; background-size:30px auto;}
	.mobile-util-wrap li .icon.tw {background-position:0 -30px;}
	.mobile-util-wrap li .icon.ut {background-position:0 -60px;}
	.mobile-util-wrap li .icon.vet {background-position:0 -90px;}
	.mobile-util-wrap li .icon.med2 {background-position:0 -120px;}
	footer .logo {width:80%; text-align:center;}
	.fm-wrap {width:80%;}
	.fm-wrap .fm-btn, .fm-wrap .fm-list {width:100%;}
	.copyright {width:270px; margin:0 auto;}
}
@media (max-width:400px){
	.mobile-util-wrap li {margin:0 3px;}
	.mobile-util-wrap li a {line-height:24px;}
	.mobile-util-wrap li .icon {width:24px; height:24px; background-size:24px auto;}
	.mobile-util-wrap li .icon.tw {background-position:0 -24px;}
	.mobile-util-wrap li .icon.ut {background-position:0 -48px;}
	.mobile-util-wrap li .icon.vet {background-position:0 -72px;}
	.mobile-util-wrap li .icon.med2 {background-position:0 -96px;}
}



/* 부트스트랩 관련 */

.close {
  float: right;
  font-size: 21px;
  font-weight: bold;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  filter: alpha(opacity=10);
  opacity: 100;
}

a:hover, a:focus {text-decoration: none;}