﻿@charset "utf-8";
.wrapSet{position: relative;width: 100%;float: left; text-align: center;}
#wrap{width:100%;}
.contentWith{max-width: 1000px;margin:0 auto;}
.global {height:30px;background:#f9f9f9;border-bottom:1px solid #ddd; }
.global li { display: inline-block;float:left; text-align: center;list-style: none; margin:0 10px;}
.global li a{display: inline-block;padding: 0;line-height:24px;margin: 0;text-align: center}
.global li a.tag{display: inline-block; line-height: 20px;margin-top:4px;}

#header{position: relative;text-align: left;height: 150px;}
#header .headerSet{float: none;width: 100%;}
#header .contentWith{position: relative;padding: 0;}
#header .logo a{display: inline-block;margin: 0;padding: 0;background: url(/static/img/portal/common/logo.gif) no-repeat;background-size:100% 100%;}
/* search word */
.t_sh{float:left;width:378px;height:36px;background:#000;position:absolute;left:50%;top:23px;margin-left:-180px;z-index:110; border-radius:5px;display:none;}
.t_sh .input_txt{ width:315px;height:30px;line-height:30px;float:left;margin:3px 0 0 3px;ime-mode: active;}
.t_sh .input_submit{ width:50px;height:29px;/*background:url(/static/img/portal/common/btn_search.png) no-repeat 0 0;*/text-indent:-999px;border:none}
.t_sh .sh_submit{ width:50px;height:29px;margin-top:3px}
.t_sh .acArrow { position: absolute; top: 9px; right: 68px; }
.t_sh a{display:block;float: left;}
.t_sh ul{ width:177px;float:left}
.t_sh ul li{ float:left;padding:8px 4px 0}
.t_sh ul li a{ color:#2d3740;font-size:0.92em}
.t_sh dl{ font-size:0.92em;padding-top:8px}
.t_sh dl dt{ float:left;color:#ab223e;font-weight:bold;/*background:url(/static/img/portal/common/bg_issue.gif) no-repeat right 2px;*/padding-right:10px}
.t_sh dl dd{ float:left;padding-left:10px}
.t_sh dl dd .num{ background-color:#ab223e;color:#fff;padding:2px 4px;font-weight:bold}
.goSearch{background:url(/static/img/portal/common/goSearch.png) no-repeat 50% 50%;width:60px;}
.headingBanner{position:absolute;right:0;top:0}
.headingBanner a { display: block; height:73px;padding-top:10px; background:none; }

.gnbBg {position: absolute; z-index:90;width: 100%; left: 0;top: 163px;background:url(/static/img/portal/common/gnbBg.png) repeat-x 0 100%;}
.gnbBorder{border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1;height:58px;clear:both;position: relative;z-index:91}
.gnbSet{height:59px;overflow:hidden;margin:0 auto;}
.gnb{position: relative;  left: 0; top: 0; z-index: 100;height: 358px;}
.gnb>ul>li>a,
.lnb a{font-family: 'Nanum Gothic', 'NanumGothicWeb', "나눔고딕", "맑은고딕", "malgun gothic", "AppleGothic", "Segoe UI", Arial, sans-serif}
/* 'notokr-bold',  */
.gnb ul{max-width: 1000px; margin: 0 auto;}
.gnb li{float: left}
.gnb>ul>li{position: relative;float: left;width: 25%;}
.gnb>ul>li:last-child>a{border-right: none;}
.gnb>ul>li>a{display: block;white-space: nowrap;height: 56px;line-height:56px;font-size:20px;padding: 0 31px;margin:0;font-weight: bold;color: #000;border-right: 1px solid #ddd;text-align: center;}
.gnb>ul>li>a.btn>span{height:46px;line-height: 46px;}
.gnb>ul>li>a.btn{height:46px;line-height: 46px;margin-top: 5px;}
.gnb>ul>li>a>span{display: inline-block;line-height:56px;height: 57px;}
.gnb>ul>li>a:hover,
.gnb>ul>li>a:focus,
.gnb>ul>li>a:active,
.gnb>ul>li.on>a{text-decoration: underline; text-underline-position: under; color: #666; }
.gnb>ul>li>a:hover>span, .gnb>ul>li>a:focus>span, .gnb>ul>li>a:active>span,
.gnb>ul>li.on>a>span{border-bottom:6px solid #666;}
/* .gnb .sub30 a, .gnb .sub40 a{border-right:none;} */

.gnb>ul>li>ul>li.on>a{text-decoration:underline}

.gnb>ul>li>ul{width:100%;display: none;position: absolute;left: 0;top:74px;border-right: 1px solid #ddd;overflow: hidden;}
.gnb>ul>li.on>ul{display:block}
.gnb>ul>li>ul>li{display: block;width: 100%;}
.gnb>ul>li>ul>li a{display: block;padding: 8px 0 8px 15px;line-height:20px;font-size: 15px;letter-spacing: -1px;}
.gnb>ul>li>ul>li a:focus,
.gnb>ul>li>ul>li a:active,
.gnb>ul>li>ul>li a:hover{color:#00263E}
.gnb .sub50{position: fixed;right:10px;top:350px;}
.gnb .sub50>ul{position: static;right: 0;top: 90px;width: 200px;border: 2px solid #f00;}

#container{min-height:700px;max-width: 1000px;margin:0 auto;z-index: 1;}
#content{float:right;text-align:left;width:743px;color:#444;}
.main #content{width:100%;}

.sidebar{float:left;width:217px;margin-right: 40px;}
.sidebar h2 {text-align: center;color: #333;font-size:24px;line-height: 1;margin:50px 0 20px 0;}
.lnb { float: left;border-top: 2px solid #d7d7d7;width: 100%;}
.lnb ul {width: 100%;float: left;}
.lnb>ul>li {line-height: 1;display: block;width: 100%;border-bottom: 1px solid #b3b3b3;}
.lnb>ul>li a{display:block;text-align: left;padding:8px 0 8px 20px;}
.lnb>ul>li>a {color:#444;font-size: 18px;font-weight: 600;line-height:30px;padding-right: 24px;letter-spacing:-1px}
.lnb>ul>li:first-child a{border: none;}
.lnb>ul>li.on{ position: relative;z-index: 1; background: #fff url(/static/img/portal/common/lnbOnBg.gif) 100% 50%; }
.lnb>ul>li.on>a{border: none;color:#fff;}/* background: url(/static/img/portal/common/lnbOnArr.png) no-repeat 100% 50%; */
.lnb>ul>li>a:hover,
.lnb>ul>li>a:focus,
.lnb>ul>li>a:active{}
.lnb>ul>li>ul{margin-left: 4px;display: none;}
.lnb>ul>li.on>ul{display: block;width: 170px;margin-bottom: 1px;}
.lnb>ul>li>ul>li{margin-top: 2px;}
.lnb>ul>li>ul>li>a{font-size: 14px;font-weight: 600;color: #363c48;padding:8px 28px 7px 17px;line-height: 15px;}
.lnb>ul>li>ul>li.on>a{color: #3f77b2;background:#f1f1f1;}




#quick{position:fixed;right:10px;bottom:10px;z-index:50;width:50px;display: none;}
#quick li{height:44px}
#quick li a{display:block;width:54px;height:44px;/*background:url(/images/mains/quicks.gif) no-repeat*/}
#quick li.sp01 a{}
#quick li.sp02 a{background-position:0 -44px}
#quick li.sp03 a{background-position:0 -88px}
#quick li.sp04 a{background-position:0 -132px}
#quick li.sp05{height:50px}
#quick li.sp05 a{background-position:0 -176px;height:50px}

#footer{position: relative;clear: both;margin: 0 auto;border-top:2px solid #000;}
.serviceLink {width: 100%;background: #fff;}
.serviceLink a{display: block;text-align: left;}
.serviceLink>div>ul{margin:22px auto 20px auto;width:100%;float:left;}
.serviceLink>div>ul>li{list-style: none; width:25%;padding:0 10px;display:block;float:left; white-space:nowrap;}
.serviceLink>div>ul>li:last-child{border:none;}
.serviceLink>div>ul>li>ul{display:block;float:left;margin-left:10px;padding-top:10px;clear:both;border-top:1px solid #ddd;width: 90%}
.serviceLink>div>ul>li>a{padding-left:10px;padding-bottom: 7px;font-size:16px;letter-spacing:-1px}
.serviceLink>div>ul>li>ul>li{display:block;line-height:24px;height:24px;text-align:left;}

.bannerZoneSet{border-top:1px solid #d8d8e0;border-bottom:1px solid #d8d8e0;clear:both;overflow:hidden;margin:0 auto;}
.bannerZone{padding-top:20px}
.banner_ctl { float: left; width: 224px; padding-left:20px;margin-top: -8px;}
.banner_ctl li { float: left; padding-right: 1px }
.banner_ctl button { float: left; border: none; height: 24px; width: 23px; background: url(/static/img/portal/common/btn_banner_ctl.gif) no-repeat 0 0; cursor: pointer }
.banner_ctl button span { visibility: hidden }
.banner_ctl .prev_banner { background-position: 0 0 }
.banner_ctl .next_banner { background-position: -23px 0 }
.banner_ctl .stop_banner { background-position: -46px 0 }
.banner_ctl .play_banner { background-position: -69px 0 }
.bannerZone .banner{overflow:hidden;width:775px;margin:0;position:relative;}
.bannerZone .banner ul{ width:9999em;height:60px;position:relative}
.bannerZone .banner ul li{ float:left;width:278px;}


.footer_bg{clear:both;}
#footer a{}
#footer a strong{color:#000}
#footer .foot, #footer .menu_view{position: relative;padding:0;height: 185px;}
.foot .contentWith{position: relative;}
.f_menu{border-top:1px solid #aaafbb;border-bottom:1px solid #aaafbb;text-align:center;clear:both;}
.f_menu ul{margin:0 auto;}
.f_menu ul li{}
.f_menu ul li a{display: inline-block;color:#333;border-right:1px solid #ddd;padding:0 14px 0 10px;margin:10px 0;line-height:18px}
.f_menu ul li:first-child a{padding-left: 0;}
.f_menu ul li:last-child a{padding-right: 0;}
.f_menu ul li:last-child a{border:none;}

.f_logo{float:left;padding-right: 26px;margin-top:18px;}
.f_add{float:left;padding-top:23px;color:#6f6f6f;text-align: left}
.fInfo{position: absolute;right: 0;top: 27px;width: 266px;text-align: left;}
.fInfo h3{font-size: 16px;line-height: 20px;margin: 0;padding: 0;}
.fInfo .text-red{color:inherit !important;}
.mark{position: absolute;z-index:1;right:-10px;top:0;}


/* Menu button */
.menuButton, .mobileLogout{display: none;}
.menuButton { position:relative; z-index: 1000; width:50px; height:50px;border:none; padding: 0}
.menuButtonCloser{display:none;}

/* 달력 */
.calendarzone { display: inline; position: relative;z-index:1}
.calendarzone .calendarSLayer { display: none; position: absolute;z-index:10; top: 30px; }
.calendarzone input[type="button"] { background:url("/static/img/common/cal.gif") no-repeat scroll 50% 50%; border: medium none; width:36px; height:30px;font-size: 0;line-height: 0; margin-left:5px; padding: 0;vertical-align: middle; }
.calendarzone .calendar-frame { border: 2px solid #3e3a39; height:300px; width:350px; }
.field_area { overflow: visible; }
.calendar_txt { background: #ffffff; color: #8a8a8a; border: 0.08em solid #d1d1d1; height: 1.17em; font-size: 1em; padding: 0.25em 0 0 0.25em; }
.monthGab{display:inline-block;width:32px}

/* modal */
.modalHeader{width: 100%;height:50px;text-align: right;color: #fff; border-radius: 0; border: none;font-size: 2em;}
.modalHeader .close { color: #fff;font-size: 36px;  opacity: 1;}
.modalHeader .close:hover { opacity: 1; }

.modalIframe{width: 100%;height: 600px;float: left;}
.modalIframe iframe{height: 600px;width: 100%;border:none;margin: 0;padding: 0;background: #fff;}
.modalFooter{clear:both; height:70px; padding-top:5px;text-align: center;background:#f5f5f5}

@media only screen and (min-width:250px) and (max-width: 479px)  {
	.contentWith,
	#container,
	#content,
	.gnb ul,
	.bannerZone .banner,
	.gnbSet,
	.serviceLink>div>ul,
	.bannerZoneSet,
	.contentData{max-width:300px}
	.gnbSet{height: 0;}
	.bannerZoneSet{height:180px;}
	.bannerZone .banner ul li,
	.bannerZone .banner ul li img{width: 300px;height:auto;display:block;float: left;}
	#content,
	.serviceLink>div>ul>li{width: 100%;}
}
@media only screen and (min-width: 480px) and (max-width: 767px)  {
	.contentWith,
	#container,
	#content,
	.gnb ul,
	.bannerZone .banner,
	.gnbSet,
	.serviceLink>div>ul{max-width:460px}
	.gnbSet{height: 0 !important;}
	.bannerZone .banner ul li{width:244px;}
	#content,
	.serviceLink>div>ul>li{width: 100%;}
}
@media only screen and (min-width: 768px) and (max-width:1019px) {
	.contentWith,
	#container,
	#content,
	.gnb ul,
	.gnbSet,
	.bannerZone .banner,
	.serviceLink>div>ul{max-width:740px}
	.bannerZone .banner ul li{width:235px;}
	#header h1.logo{width: 151px;height:58px;}
	.headingBanner{width: 175px;}
	.t_sh{width: 35%;margin-left: -130px;top: 10px;}
	.t_sh .input_txt{width: 74%}
}
@media only screen and (min-width:1020px){
	.contentWith,
	#container,
	.gnb ul,
	.gnbSet,
	.serviceLink>div>ul{max-width: 1000px;}
	#header .logo a{width: 216px;height: 84px;}
	.f_add{width: 70%;}
}

@media only screen and (max-width: 1019px){
	.global{height:50px;padding-top:10px;}
	.global li a{line-height: 40px;}
	.global li a.tag{line-height: 20px;margin-top:10px;font-size: 14px;}
	#header .logo a{width:151px;height:58px;}
	.gnbBg {top: 145px;}
	.gnb>ul>li>a{font-size: 16px;line-height:58px;height:58px;}
	.gnb>ul>li>ul>li a{display: block;padding: 8px 10px 8px 15px;line-height:20px;font-size:14px;}
	.sidebar{width:100%;margin-right:0;}
	.lnb>ul>li{width: 50%;float: left;}
	.f_logo{float: none;padding-right: 0;padding-bottom: 0;margin-bottom: 0;}
	.f_add{margin-bottom: 30px;font-size: 14px;text-align: center;width: 100%;}
	.f_menu ul{padding:10px 0;}
	.f_menu ul li a{border:none;line-height: 24px;}
	.fInfo{position: relative;top: 20px;width: 100%;clear:both;text-align: center; height: 80px;}
}

@media only screen and (max-width: 767px){
	#header{text-align: center;-o-box-shadow: 3px 5px 5px #bbb;-moz-box-shadow: 3px 5px 5px #bbb;-webkit-box-shadow: 3px 5px 5px #bbb;
	box-shadow: 3px 5px 5px #bbb;height:60px;}
	#header h1.logo{display: inline-block;width: 32%;height: 50%;margin:5px auto;}
	#header .logo a{width:140px;height:52px; margin:0 auto;}
	#header .headerSet{height:100px;}
	.gnbBorder{position: relative;margin: 0;height: 0;border: none;}
	.headingBanner{width: 40%;}
	.serviceLink>div>ul>li>a{background:#000;color:#fff;margin-top: 10px;padding-top: 6px;}
	.serviceLink>div>ul{background:#f5f5f5}
	.serviceLink>div>ul>li>ul>li{line-height: inherit; height:inherit;}
	.serviceLink>div>ul>li>ul>li>a{padding: 10px 0;border-bottom:1px dashed #ddd;}
	.t_sh{position: relative;top: 0;width: 100%;left: 0;margin-left: 0;clear:both;}
	.t_sh .input_txt{width: 86%;}
	#header .contentWith{padding-bottom: 20px;}
	.gnb{display: none;}

	.heading .menuButton {position: absolute;margin-top: 5px;}
	.heading .mobileLogout {display: block;position: absolute;margin-top: 5px;width: 50px;text-align: center; right: 0;top: 0;font-size: 2em;}
	.menuButton{display: block;}

	.gnbMbOpen{position:fixed;left:0;top:0;z-index:1000;display: block;background:#fff;width:80%;height:100%;overflow-y: auto;}
	.gnbMbOpen{-webkit-box-shadow:9px 1px 18px 0 rgba(86, 86, 86, 0.9); -moz-box-shadow: 9px 1px 18px 0 rgba(86, 86, 86, 0.9); box-shadow:9px 1px 18px 0 rgba(86, 86, 86, 0.9);}
	.gnbMbOpen ul,
	.gnbMbOpen li{display:block;}
	.gnbMbOpen>ul{padding:60px 0 30px 0;text-align: left;}
	.gnbMbOpen>ul>li{padding-left:15px;line-height:34px;margin-bottom:10px;border-top:1px solid #333;}
	.gnbMbOpen>ul>li>a{ font-family: 'notokr-bold', serif;}
	.gnbMbOpen>ul>li>ul>li{line-height:40px;border-bottom:1px solid #eee;}
	.gnbMbOpen>ul>li>ul>li:last-child{border:none;}
	.gnbMbOpen>ul>li>ul>li>a{display: inline-block;padding-left:20px;}
	.gnbMbOpen>ul>li .btn{margin-top: 10px;line-height:26px}
	.gnbMbOpen a{}
	.gnbSetOpen, .gnbSetOpen ul, .gnbSetOpen li{height:auto !important;}
	.lnb>ul>li>a{padding:8px 3px;}

	.menuButtonCloser { position:absolute; z-index: 1000; width:50px; height:50px;right: 0;top: 0;border:none; padding: 0; background:#00adef;cursor: pointer }
	.no-js .menuButtonCloser { display: none; }
	.menuButtonCloser::before, .menuButtonCloser::after, .menuButtonCloser span { background: #ddd; }
	.menuButtonCloser::before, .menuButtonCloser::after { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 2px; -webkit-transition: -webkit-transform 0.25s; transition: transform 0.25s; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; }
	.menuButtonCloser span {}
	.menuButtonCloser::before { --webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); }
	.menuButtonCloser::after { --webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); }
	.menuButtonCloser{display:block;}
	#footer{border-top:2px solid #000;}
	.f_add{margin-bottom: 0;padding-top: 0;}
	.fInfo{position: relative;top: 20px;width: 100%;clear:both;text-align: center; height: 80px;}
}


@media only screen and (max-width: 480px){
	#header h1.logo{width: 40%;height: 50%;}
	#content>#hgroup>h1{font-size:18px;}
	.t_sh .input_txt{width: 79%}
	.headingBanner{width: 40%;}
	.f_menu ul{padding:30px 0;}
	.f_menu ul li{width: 100%;border-bottom:1px solid #f5f5f5;}
	.f_menu ul li a{width: 100%;border:none}
	.t_sh{margin-bottom: 10px;}

}

/*
@media (min-width:901px) and (max-width:1000px)  {
	.contentWith,
	#container,
	.gnb ul{max-width:860px}
	.global{height: 50px;}
	.sidebar { width:100%}
} */

#webcrypto_pfx_file_iframe{border:none;}