@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css);
@import url(//fonts.googleapis.com/earlyaccess/nanumpenscript.css);
@import url('https://fonts.googleapis.com/css?family=Gochi+Hand');

/* 초기화 */
html {overflow-y:scroll}
body {max-width: 640px;  margin:0 auto;padding:0;font-size:0.95em;font-family:'Noto Sans KR', 'Nanum Barun Gothic', 'Nanum Gothic', 'dotum', 'Malgun Gothic', 'Verdana', 'AppleGothic', sans-serif;background:#fff}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul,ol,dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-size:1em}
input[type="submit"]{cursor:pointer}
button {cursor:pointer}

textarea, select {font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
/* 링크 */
a, a:link	{color:#222; text-decoration:none;} 
a:visited	{color:#222; text-decoration:none;}
a:hover		{color:#222; text-decoration:none;}
a:active	{color:#222; text-decoration:none;} 
a:focus		{color:#222; text-decoration:none;}
.sub_wrap {padding:10px 10px 50px 10px;}
.img_responsive {max-width:100%;margin:0 auto;display:block;}
.ir-pm {display:block;overflow:hidden;font-size:0px;line-height:0;text-indent:-9999px} /* 사용된 이미지내 의미있는 텍스트의 대체텍스트를 제공할때 */
.ir-wa {display:block;overflow:hidden;position:relative;width:100%;height:100%;z-index:-1} /* 중요한 이미지 대체텍스트로 이미지off시에도 대체 텍스트를 보여주고자 할때 */
.screen-out {display:block;overflow:hidden;position:absolute;left:-9999px;width:1px;height:1px;font-size:0;line-height:0;text-indent:-9999px} /* 대체텍스트가 아닌 접근성을 위한 숨김텍스트를 제공할때 */
.screen-hide {font-size:0;line-height:0;visibility:hidden} /* screen_out클래스를 사용할 수 없으며, 해당 텍스트를 숨겨야 할때 */
.blind {overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}


.header,
.content,
.footer
{
}
.header,
.footer
{
	position: relative;
	background: #fff;
	font-size: 16px;
	font-weight: bold;
	color: #000;
	text-align : center;
	border-bottom: 1px solid #d7d7d9;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	width: 100%;
	height: 50px;
	padding: 0px;
}
.header.fixed
{
	position: fixed;
	top: 0;
	left: 0;
}
.footer.fixed
{
	position: fixed;
	bottom: 0;
	left: 0;
}
.header div.top_line{
	position:absolute;bottom:0;
	height: 3px;
	min-width: 320px;
	width: 100%;
	background-image: url("../images/top_line.jpg");
	background-size: 100% 3px;
	background-position : center center;
}

footer{
	color:#777;
	background:#fff;
	clear: both;
	position: relative;
	padding:10px;
	border-top:1px solid #777;
}
.header .ham_menu
{
	display: block;
	position: absolute;
	top: 0;
	padding: 0;
}

.header .logo {width:142px;left:50%;margin-left:-71px;}
.header .logo img {max-width: 100%;max-height: 49px;    vertical-align: top;}

.header .ham_menu.left
{
	left:10px;
	width:29px;
}
.header .ham_menu.left i {line-height:50px;color:#174383;}
.header .ham_menu.right
{
	right:10px;
}
.header .ham_menu.right i {line-height:40px;color:#174383;}

.header a span
{
	background: #fff;
	display: block;
	height: 2px;
	margin: 6px 0;
}




footer div.bottom_line{
	position:absolute;top:0;
	height: 3px;
	min-width: 320px;
	width: 100%;
	background-image: url("../images/top_line.jpg");
	background-size: 100% 3px;
	background-position : center center;
}

footer .goTop {position: absolute;top:0;right:0;width:40px;height:40px;}
footer .goTop a {display: block;background:#848f04;text-align: center;}
footer .goTop a i {color:#fff;}
footer h2 {font-size:1.4em;margin-bottom:10px;}

footer address {
	padding: 0;
	color: #777;
	font-weight: normal;
	font-style: normal;
	font-size: 12px;
}
footer address strong {font-size:12px;color:#777;font-weight: normal;font-style: normal;}
footer .copy_by	{position: relative;text-align:left;padding-left:10px;}
footer .copy_by img {}
.copy_iso {position: relative;width: 185px;height: 89px;clear:both;padding:10px 0 10px 10px;}
.copy_iso div.left {float:left;}
.copy_iso div.right {float:right;}



#device_change {display:block;margin:5px auto 0;width:300px;padding:5px 0;color:#fff;font-size:1em;text-decoration:none;text-align:center; background-color: #777;}
.viewPC {position:absolute;top:10px;right:5px;}
.viewPC a,
.viewPC span {font-size:13px;color:#ffffff !important;}
.koreaind {width:127px;position:absolute;bottom:10px;right:10px;}





#lang_bg{
	position :fixed;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.7);
	left: 0px;
	top : 0px;
	z-index: 999;
	display: block;
}
.lang_wrap{
	min-width: 32px;
	width:100%;
	border-bottom: 1px solid #174383;
	position : relative;display:none;
	
}

.lang_nemo {
	width: 100%;
	background-color: #fff;
	position : relative;
	
}
.lang_semo{
	width: 0; 
	height: 0; 
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	border-bottom: 15px solid #fff;
	position : relative;
	margin : 0 auto;
	top : -15px;
}
.lang_nemo a{
	position : relative;
	padding: 5px 30px;
	font-size: 16px;
	color: #666;
	display: block;
	text-align: left;
	
}
.lang_nemo a span{
	content : "";
	display: none;
	position : absolute;
	width: 30px;
	height: 1px; right: 30px;
	background-color: #174383;
	top : 16px;
}
.lang_active {
	color : #174383 !important;
}
.lang_active span{
	display: block !important;
}


/*모바일메뉴*/
.m_menu_h {position: fixed; top: 0; right: 0; z-index: 99999; width: 210px; height: 100%;overflow-y: auto;}
.nav-top {border-bottom: 1px solid #848f04;background: #fff;}
.btn-x {text-align: right; padding:10px;}
.btn-x i {color:#454545;}
.m-nav > li {border-bottom: 1px solid #848f04; padding:0;}
.m-nav > li.mmli_up {}
.m-nav > li > a {color: #454545; font-size: 16px; font-weight: bold;display:block;line-height:57px;padding-left:20px; position:relative; }
.m-nav > li > a.on {background: #848f04;color: #ffffff;}
.m-nav > li > a i {position: absolute;top:50%;right:10px;margin-top:-8px;}

.sub_menu {margin-top: 0;display: none;background:#fff;opacity: 0.7;}
.sub_menu > li {}
.sub_menu > li > a {font-size:14px;color: #848f04;display:block;line-height: 35px;padding-left:20px; }
.sub_menu > li > a:hover {color:#ffffff;text-decoration: none;background:#6298db;}
.m_lang {padding: 0 20px; margin-top: 40px;}
.m_lang ul {overflow: hidden; width: 100%; border: 1px solid #163f8c;}
.m_lang ul li {width: 50%; float: left; text-align: center; }
.m_lang ul li a {background: #fff;color:#454545; font-size: 14px; padding: 12px 0; display: block; width: 100%; }
.m_lang ul li a.on  {background: #163f8c;color:#fff; }

.m_menu_h p {color: #163f8c; font-size: 13px; letter-spacing: 0; padding-left: 20px; margin-top: 20px;}
.dim {position: fixed; width: 100%; max-width: 996px; height: 100%; background: #000; opacity: 0.5; top: 0;z-index: 999;}
.m_menu_bg {position: fixed; width: 100%; width: 210px; height: 100%; background: #fff; top: 0;right: 0;z-index: 1000;}
.m_menu_wrap {position: fixed; display: none; top: 0; left: 0; right: 0; max-width: 996px; width: 100%; height: 100%; margin: 0 auto; z-index: 9999; overflow-y: auto;}      

.lang_area {background-color:#fff;position:relative;right:auto;top:auto;zoom: 1;padding:0;margin:0;list-style:none;}
.lang_area:after{display:block;clear:both;content:''}
.lang_area li{position:relative;float:left;padding-left:20px}
.lang_area li:before{content:'';position:absolute;left:10px;top:18px;width:1px;height:7px;background-color:#cccccc}
.lang_area li:first-child:before{display:none}
.lang_area li a {height:40px;line-height:40px;font-size:14px;color:#333;}

.invisible { visibility: hidden; overflow: hidden; position: absolute; left:-1000em; width: 0; height: 0; font-size: 0; line-height: 0 }
.copy_link {width: 166px;padding:0;margin:10px 0;    overflow: hidden; }
.copy_link span.sel_area { display:block;clear:both;}
.copy_link span.sel_area select {float:left; outline: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; display:inline-block;padding-left:5px; height:26px; width:134px; border:0 none; font-size:12px; border-radius:0; color:#ffffff; background:url('../images/bg_sel.jpg') 115px 50% #005fc1 no-repeat; vertical-align:top; }
.copy_link span.sel_area a {float:left; display:inline-block; width:32px; height:26px; line-height:24px; font-size:12px; text-align:center; background-color:#16497f; color:#8ba4bf; }
.responsive_tbl {overflow-x:auto;}




/* 비쥬얼그래픽 */

.vg_wrap {position: relative;min-width:100%;margin:0 auto;height:200px;padding:0;}
.vg_inner {width:100%;height:100%;position: relative;clear:both;}
.vg_title {width:100%;position: absolute;top:30%;left:0;z-index: 555;}
.vg_title h4 {font-size:1.1em;color:#ffffff;margin:0;text-align:center;font-family: 'Nanum Pen Script', sans-serif;}
.vg_title h2 {font-size:1.0em;color:#ffffff;margin:0;text-align:center;font-weight:900;}
.vg_title p {font-size:0.8em;color:#ffffff;letter-spacing: -1px;text-align:center;margin-top:10px;}


.bg_info {background: url(../images/bg_info.png); background-repeat: no-repeat;background-position: center center;background-size: cover;}
div.business_wrap {width:100%;overflow:hidden;position: relative;margin:0 auto;}
div.business_inner {position: relative;clear:both;width:100%;margin:0;padding:0;overflow: hidden;}
div.business_inner div.inner {height:200px;width:50%;float:left;background:transparent;}
div.business_inner div.inner a.banner {display: block;height: 100%;position: relative;}
div.business_inner div.inner a.banner h4.title {font-weight:bold;font-size: 1.0em;color:#ffffff;width:100%;text-align:center;position:absolute;top:10%;margin: 0;}
div.business_inner div.inner a.banner p.content {font-size:0.8em;color:#ffffff;text-align:center;position:absolute;top:30%;width: 100%;padding:10px 0;}
div.business_inner div.inner a.banner div.btnn {width:138px;height:40px;line-height:40px;position:absolute;bottom:25px;left:50%;margin-left:-85px;border:1px solid #ffffff;color:#ffffff;font-size:0.9em;padding-left:30px;background: url(../images/btn_more.png); background-repeat: no-repeat;background-position:118px center;}
div.business_inner div.inner a.banner:hover div.btnn {color:#3c3c3c;background:#ffffff url(../images/btn_more_ov.png); background-repeat: no-repeat;background-position:118px center;}

@media (max-width:420px) {
	.bg_info {background: none;}
	div.business_inner div.inner {width:100%;float:none;background: url(../images/bg_info.png); background-repeat: no-repeat;background-position: 0 0;background-size: cover;}
	div.business_inner div.inner:nth-child(2) {background: url(../images/bg_info.png); background-repeat: no-repeat;background-position: right center;background-size: cover;}
}


div.bg_lt {background: #f5f5f5;}
div.lt_wrap {overflow:hidden;position: relative;margin:0;padding:10px;}
div.lt_wrap div.lt_header_bar {width:2px;height:10px;margin:0 auto;background: #000000;}
div.lt_wrap div.lt_header {}
div.lt_wrap div.lt_header h4 {font-size:1.0em;color:#131313;text-align: center;font-weight: bold;margin:5px 0;}
div.lt_wrap div.lt_header p {font-size:0.8em;color:#939393;letter-spacing: -1px;text-align: center;}
div.lt_wrap div.lt_inner {width:100%;height:auto;clear:both;overflow: hidden;position: relative;margin-top:10px;}
div.lt_wrap div.lt_inner div.lt_box {background:#ffffff;margin-bottom:10px;}


.mapBox {width:100%; height:400px; padding:10px 0;position: relative;}
.mapBox iframe { border:none; width:100%; height:100%; margin:0px; padding:0px; }
.mapBox .map_info {position: absolute;top:10px;right:0;width:40%;height:400px;background: #255bab;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";opacity: 0.9;filter: alpha(opacity=90);zoom:1;}
.mapBox .map_info .map_info_inner {padding:5px;}
.mapBox .map_info .map_info_inner dl {}
.mapBox .map_info .map_info_inner dl dt {font-weight:bold;font-size:1.0em;color:#ffffff;margin-bottom:10px;}
.mapBox .map_info .map_info_inner dl dd {margin:0;font-size:0.8em;color:#ffffff;letter-spacing: -1px;margin-bottom:10px;padding-left:30px;}
.mapBox .map_info .map_info_inner dl dd.addr {background: url(../images/ico_location.png); background-repeat: no-repeat;}
.mapBox .map_info .map_info_inner dl dd.tel {background: url(../images/ico_phone.png); background-repeat: no-repeat;}
.mapBox .map_info .map_info_inner dl dd.fax {background: url(../images/ico_fax.png); background-repeat: no-repeat;}
.mapBox .map_info .map_info_inner dl dd.how{color:#f9f9f9; padding-left:0; margin-top:10px; letter-spacing: 0px;}

@media (max-width:360px) {
	.mapBox .map_info {display: none}
}


.sub_vg { position : relative;width: 100%;background-image: url("../images/sub_vg.jpg"); background-repeat: no-repeat;    background-size: cover; background-position: center; height: 80px; }
div#vg_con {}
div#vg_con h2 {width: 100%;   text-align: center;    color: #ffffff;    font-size: 1.2em;    font-weight: bold;margin:0;padding:15px 0 0;}
div#vg_con p {width: 100%;     text-align: center;    color: #ffffff;    font-size: 0.9em;}


#m_breadcrumbs_wrap {display: none}
@media all and (max-width:640px){
	#m_breadcrumbs_wrap {display: block;}
	.m_breadcrumbs {position: relative;padding: 10px 0;text-align: right;margin:0;}
	.m_breadcrumbs li.breadcrumb_item {padding-bottom: 0;display: inline-block;}
	.m_breadcrumbs li.breadcrumb_item a {position : relative;display: inline-block;padding: 0 .8em;font-size: .8em;font-weight: 400;line-height: 1;letter-spacing: .1em;    color: #101010;    text-transform: uppercase;}
	.m_breadcrumbs li.breadcrumb_item a:after {content:'>';position:absolute;top:1px;right:-5px;}
	.m_breadcrumbs li.breadcrumb_item.last a:after {width:0;height:0;top:0;left:0;font-size:0;line-height:0}
}


.jssorb01 {
    position: absolute;
}
.jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
    position: absolute;
    /* size of bullet elment */
    width: 12px;
    height: 12px;
    filter: alpha(opacity=70);
    opacity: .7;
    overflow: hidden;
    cursor: pointer;
    border: #999 1px solid;
}
.jssorb01 div { background-color: #fff; }
.jssorb01 div:hover, .jssorb01 .av:hover { background-color: ##04426D; opacity: 0.7; }
.jssorb01 .av { background-color: #04426D; opacity: 1;}
.jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }


.main_notice_box{
	background-color: #9B999A;
	position :relative;
	padding:10px;
}

.main_youtube_text{
	text-align: center; color: #fff; font-weight: bold;font-size: 9pt;
}


.main_notice_box .box_more_btn2{
	background-image: url("../images/more_btn2.jpg");
	background-repeat: no-repeat;
	font-size: 9pt;
	background-position : 15px 24px;
	color: #eee;
	display :inline-block;
	position:absolute;top:10px;right:10px;
}


.main_notice_a {width: 50%; float: left;}
.main_notice_a img {max-width:100%}