@charset "utf-8";

/* 기본폰트 정의 */
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 300;
    font-style: normal;
    src: url('../font/NanumSquareNeoTTF-aLt.eot');
    src: url('../font/NanumSquareNeoTTF-aLt.eot?#iefix') format('embedded-opentype'),
         url('../font/NanumSquareNeoTTF-aLt.woff2') format('woff2'),
         url('../font/NanumSquareNeoTTF-aLt.woff') format('woff'),
         url('../font/NanumSquareNeoTTF-aLt.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 400;
    font-style: normal;
    src: url('../font/NanumSquareNeoTTF-bRg.eot');
    src: url('../font/NanumSquareNeoTTF-bRg.eot?#iefix') format('embedded-opentype'),
         url('../font/NanumSquareNeoTTF-bRg.woff2') format('woff2'),
         url('../font/NanumSquareNeoTTF-bRg.woff') format('woff'),
         url('../font/NanumSquareNeoTTF-bRg.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 700;
    font-style: normal;
    src: url('../font/NanumSquareNeoTTF-cBd.eot');
    src: url('../font/NanumSquareNeoTTF-cBd.eot?#iefix') format('embedded-opentype'),
         url('../font/NanumSquareNeoTTF-cBd.woff2') format('woff2'),
         url('../font/NanumSquareNeoTTF-cBd.woff') format('woff'),
         url('../font/NanumSquareNeoTTF-cBd.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 700;
    font-style: normal;
    src: url('../font/NanumSquareNeoTTF-dEb.eot');
    src: url('../font/NanumSquareNeoTTF-dEb.eot?#iefix') format('embedded-opentype'),
         url('../font/NanumSquareNeoTTF-dEb.woff2') format('woff2'),
         url('../font/NanumSquareNeoTTF-dEb.woff') format('woff'),
         url('../font/NanumSquareNeoTTF-dEb.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 800;
    font-style: normal;
    src: url('../font/NanumSquareNeoTTF-eHv.eot');
    src: url('../font/NanumSquareNeoTTF-eHv?#iefix') format('embedded-opentype'),
         url('../font/NanumSquareNeoTTF-eHv.woff2') format('woff2'),
         url('../font/NanumSquareNeoTTF-eHv.woff') format('woff'),
         url('../font/NanumSquareNeoTTF-eHv.ttf') format("truetype");
    font-display: swap;
} 


/* reset */
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0}
body, input, textarea, select, button, table{
font-family:'NanumSquareNeo'; font-weight:normal; color:#6b6b6b;
}
img, fieldset{border:0;}
img{vertical-align:top;}
input, select{vertical-align:middle;}
ul, ol{list-style:none;}
em, address, caption, th{font-style:normal;}
a{text-decoration:none; color:#6b6b6b;}
a:hover, a:active, a:focus{text-decoration:none; color:#6b6b6b;}
button{cursor:pointer;}
form{margin:0; padding:0;}
p{line-height:150%;}


/* 공통관련 */
.clfix:after {content: "."; display: block; height: 0px; clear: both; visibility: hidden;}
.clfix {display: inline-block; }
.clfix {display: block;}
* html .clfix {height: 1%;} /* Hides from IE-mac */
.clfix { *zoom:1; } /*for IE 5.5-7*/

.hidden { visibility:hidden; width:0px; height:0px; overflow:hidden; font-size:0px; line-height:0; position:absolute;}
.show { display:block !important; }
.pre {white-space:pre;}
.fl { float:left !important; }
.fr { float:right !important; }
.cl {clear:both; }
.at { vertical-align:top }
.ab { vertical-align:bottom }
.am { vertical-align:middle }
.ac { text-align:center !important; }
.ar { text-align:right; }

.chk,.radio { width:13px; height:13px; }


/* 개발쪽 기본 css */
input { height:22px; line-height:22px; border:1px solid #cacaca; color:#555; font-family:dotum !important; padding-left:3px;}
input.focus { color:#d1d1d1; font-weight:bold; font-family:'NanumGothic'; font-size:15px;}
input.focus.focus-txt { color:#555; font-size:12px;font-family:'NanumGothic'; }
input.ipt { border-top:1px solid #8b8b8b; border-left:1px solid #8b8b8b; border-right:1px solid #d3d3d3; border-bottom:1px solid #d3d3d3; height:20px; line-height:20px; padding-left:5px; color:#555; font-size:12px; }
input.ipt.ac { text-align:center; padding-left:0; }
textarea.textarea {text-align:left; border-top:1px solid #8b8b8b; border-left:1px solid #8b8b8b; border-right:1px solid #d3d3d3; border-bottom:1px solid #d3d3d3; line-height:16px; font-size:12px; font-family:'NanumGothic'; padding:5px; color:#555; overflow-x:hidden; overflow-y:auto; }
textarea.textarea.bg-gray { background:#fbfbfb !important;}
select { height:24px; line-height:24px; border:1px solid #cacaca; color:#555; color:#555;padding-left:3px;}


/* padding & margin 정렬관련 css */
.pt0 { padding-top:0px !important; }
.pt10 { padding-top:10px !important; }
.pl0 { padding-left:0px !important; }
.pl10 { padding-left:10px !important; }
.pl15 { padding-left:15px !important; }
.pl35 { padding-left:35px !important; }
.pr20 { padding-right:20px !important; }
.pb20 { padding-bottom:20px !important; }
.p30 { padding:30px; }
.mt0 { margin-top:0px !important; }
.mt5 { margin-top:5px !important; }
.mt10 { margin-top:10px !important; }
.mt15 { margin-top:15px !important; }
.mt20 { margin-top:20px !important; }
.mt25 { margin-top:25px !important; }
.mt30 { margin-top:30px !important; }
.mt40 { margin-top:40px !important; }
.mt50 { margin-top:50px !important; }
.mt75 { margin-top:75px !important; }
.mt84 { margin-top:84px !important; }
.mt35 { margin-top:35px !important; }
.mmt25 { margin-top:-25px !important; }
.mmt30 { margin-top:-30px !important; }
.mmt40 { margin-top:-40px !important; }
.mb0 { margin-bottom:0px !important; }
.mb5 { margin-bottom:5px !important; }
.mb10 { margin-bottom:10px !important; }
.mb20 { margin-bottom:20px !important; }
.mb25 { margin-bottom:25px !important; }
.mb30 { margin-bottom:30px !important; }
.mb35 { margin-bottom:35px !important; }
.mr10 { margin-right:10px; }
.f12 { font-size:12px !important; line-height:16px !important; }
.f13 { font-size:13px !important; line-height:16px !important; }
.f16 { font-size:16px !important; }
.f24 { font-size:24px !important; }
.lh20 { line-height:20px !important; }
.lh23 { line-height:23px !important; }
.p-red { color:#da1f3d !important; }
.p-gray { color:#999 !important; }
.b { font-weight:bold !important; }
.lh16 { line-height:16px; }
.lh20 { line-height:20px; }
.ls-m1 { letter-spacing:-1px; }
.bbnone { border-bottom:none !important; }
.bgnone { background:none !important; }
.ofhidden { overflow:hidden; }
.t-line { border-top:1px solid #d7d7d7; }
.w100 {width:100% !important;} 
.rel { position:relative }
.p-blue { color:#30758d !important; }
.p-pink { color:#338fe1 !important; }



/* 메인 layout */
#wrap { width:100%; position:relative; background:#fff;}

#header { width:100%; background:#fff; overflow:hidden; box-sizing:border-box;}
#header h1 a {display:block; font-size:20px; color:#333; letter-spacing:-1px;}
#header h1 span  {display:inline-block; vertical-align:top;}
#header .main {display:flex; justify-content:space-between; align-items:center; padding:20px;}
#header .menuBtn {display:block;}
#header .menuBtn img { width:30px; height:22px;}
#header .menuBtn img { filter : opacity(0.5) drop-shadow(0 0 0 #000000);}

#header .header_top {100%; background:#f2f2f2;}
#header .header_top ul {display:flex;}
#header .header_top ul li {width:calc(100%/3); border-left:1px solid #fff; text-align:center;}
#header .header_top ul li:first-child {border-left:0;}
#header .header_top ul li a {display:block; padding:10px; font-size:.8rem;}

/*
.mainSlide {position:relative; width:100%; max-height:300px; min-height:300px; max-height:300px; overflow:hidden;}
.mainSlide img {width:100%; height:100%; object-fit:cover;}
*/
.mainSlide {width:100%; float:left;margin:0 auto; padding:0; overflow:hidden; }
.mainSlide img {width:180%; left:50%; margin-left:-90%; padding:0; position:relative;}
.mainSlide .slidesjs-navigation { display: none; }

 #slides { display: none; }
/* .swiper-slide {height:300px;}*/
.slidesjs-pagination { position:absolute; right:2%; top:24%; width:98%; z-index:100; display: none; }
.slidesjs-pagination li { display:inline-block; float:right;}
.slidesjs-pagination li a { display:block; width:8px; height:8px; margin:0 3px; background:#fff; text-indent:-9999px; overflow:hidden; font-size:0px;}
.slidesjs-pagination li a.active { display:block; width:8px; height:8px; margin:0 3px; background:#d13d5e; text-indent:-9999px; overflow:hidden; font-size:0px;}
.slidesjs-navigation { width:100%; z-index:100; text-indent:-9999px; font-size:0px; overflow:hidden; position:absolute; right:2%; top:14px; padding:0; margin:0;}
.slidesjs-previous { width:20px; height:20px; background:url(/images/mobile/images/btn_news_next.png) no-repeat; float:right;}
.slidesjs-next { width:20px; height:20px; background:url(/images/mobile/images/btn_news_prev.png) no-repeat; float:right; margin-right:17px;}

.jp-video-play {position:absolute; z-index:9999; top:50%; left:50%; transform:translate(-50%,-50%);}
.jp-video-play button {background:rgba(255,255,255,.4); border:0; border-radius:100%; width:100px; height:100px;}
.jp-video-play button img {max-width:25px; max-height:40px;}

#mainCon { float:left; width:100%; height:auto; padding:0; margin:0 auto; position:relative;}

.QuickWrap { float:left; width:100%; overflow:hidden; position:relative;}
.QuickWrap ul { overflow:hidden; background:#168e73; }
.QuickWrap ul li {float:left;padding:2% 3% 2% 5%; background:url('../images/quickwrap_arrow.png') no-repeat 10px 15px; background-size:4px;border-right:1px solid rgba(255,255,255,.3);border-bottom:1px solid rgba(255,255,255,.3);color:#FFF;display:block}
.QuickWrap ul li a{color:#fff; font-size:15px;}
.QuickWrap ul li:first-child {width:42%; }
.QuickWrap ul li:nth-child(2) { width:41%;border-right:0px solid #ef9186; }
.QuickWrap ul li:nth-child(3) {width:42%; }
.QuickWrap ul li:nth-child(4) { width:41%;border-right:0px solid #ef9186; }
.QuickWrap ul li:nth-child(5) {width:42%; }
.QuickWrap ul li:nth-child(6) { width:41%;border-right:0px solid #ef9186; }
.QuickWrap ul li:nth-child(7) {width:42%; }
.QuickWrap ul li:last-child { width:41%;border-right:0px solid #ef9186; }

.noticeWrap {margin:20px 0 0 0; padding:0 3%; overflow:hidden; position:relative;}
.noticeWrap .title,.galleryWrap .title {display:flex; justify-content:space-between; align-items:center; margin-top:20px;}
.noticeWrap h3,.galleryWrap h3 {font-size:1.2em; color:#333;}
.noticeWrap ul {margin-top:12px; overflow:hidden;}
.noticeWrap ul li {float:left; width:100%; color:#727272; padding-bottom:10px; font-size:0.85em;}

.galleryWrap {margin:20px 0; padding:0 3%; overflow:hidden; position:relative;}
.galleryWrap span.galleryBtn,.noticeWrap span.noticeBtn {display:block; text-align:right; }
.galleryWrap span.galleryBtn a,.noticeWrap span.noticeBtn a {display:inline-block; width:40px; height:40px;}
.galleryWrap span.galleryBtn a img,.noticeWrap span.noticeBtn a img {width:100%;}
.galleryWrap ul {margin-top:12px; overflow:hidden;}
.galleryWrap ul li {float:left; width:46%; color:#727272; padding:0 2% 10px 2%; text-align:center; font-size:0.85em; line-height:24px;}
.galleryWrap ul li img {width:100%;}


#footer { width:100%; background:#FFF; position:relative; overflow:hidden; letter-spacing:-0.3px; background:#333; padding:20px; box-sizing:border-box;} 
#footer ul {width:100%; background:#333; display:flex; text-align:center;}
#footer ul li {width:calc(100%/3); text-align:center; border-right:1px solid #666; padding:2% 0; display:block; }
#footer ul li:last-child { border-right:0px solid #d0d1d2; }
#footer ul li a {font-size:.9rem; color:#FFF; }
#footer p { padding:15px 0; color:#ffffff; line-height:20px; float:left; font-size:12px; text-align:center; }
#footer p.copy {width:100%; letter-spacing:-0.5px;}
#footer span {display:block; color:#fff; padding-top:5px; width:100%;}
#footer span:last-child {opacity:.3;}


/* 서브컨텐츠 css */
.categoryTxt { width:100%; padding:7px; background:#003c7f; border-bottom:1px solid #003179; overflow: hidden; position:relative; box-sizing:border-box; margin-bottom:15px;}
.categoryTxt ul { float:left; width:100%;}
.categoryTxt ul li { float: left; line-height:28px; display: block; padding:0 4%; color:#bfd7f3; font-size:13px; border-right:1px solid #002966; border-left:1px solid #0050a0; }
.categoryTxt ul li:first-child {border-left:0px solid #0050a0;}
.categoryTxt ul li:last-child {border-right:0px solid #0050a0; background:url("../images/bullet01.png") no-repeat 15px 8px; padding-left:25px; color:#fff;}

/* tabmenu css */
ul.tab { overflow:hidden; width:100%; padding:0 0 12px 0; display:block;}
ul.tab li { float:left; width:16.5%; text-align:center; font-weight:bold; font-size:11px; color:#555;}
ul.tab li a { display:block; height:31px; line-height:32px; border-left:1px solid #dbdbdb; border-top:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; background:#f2f2f2;} 
ul.tab li:last-child { border-right:1px solid #dbdbdb;}
ul.tab li a.active {font-weight:bold; color:#1058a8; background:#fff; border-left:1px solid #338fe1; border-right:1px solid #338fe1; border-top:1px solid #2f6cc0; border-bottom:0px solid #2f6cc0; height:32px; line-height:32px;}
ul.tab li a.selected {font-weight:bold; color:#2a2a2a; background:#fff; height:32px; line-height:32px;}

ul.tab_map { overflow:hidden; width:100%; padding:0 0 12px 0; display:block;}
ul.tab_map li { float:left; width:32%; text-align:center; font-weight:bold; font-size:12px; color:#555;}
ul.tab_map li:nth-child(1) {border-bottom:0px solid #dbdbdb;}
ul.tab_map li:nth-child(2) {border-bottom:0px solid #dbdbdb;}
ul.tab_map li:nth-child(3) { border-right:1px solid #dbdbdb; border-bottom:0px solid #dbdbdb;}
ul.tab_map li:last-child { border-right:1px solid #dbdbdb;}
ul.tab_map li a { display:block; height:31px; line-height:32px; border-left:1px solid #dbdbdb; border-top:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; background:#f2f2f2;} 
ul.tab_map li a.active {font-weight:bold; color:#1058a8; background:#fff; border-left:1px solid #338fe1; border-right:1px solid #338fe1; border-top:1px solid #2f6cc0; border-bottom:0px solid #2f6cc0; height:32px; line-height:32px;}
ul.tab_map li a.selected {font-weight:bold; color:#2a2a2a; background:#fff; height:32px; line-height:32px;}


/*로그인*/
.login_wrap{text-align:center !important;margin:50px 0 !important;}
.login_wrap .login_top{font-size:1.5rem;margin:50px 0 30px 0;letter-spacing:-0.5px;font-weight:300; line-height:1.8rem;}
.login_wrap .login_top span{font-weight:500;}
.login_wrap .login_body{border:1px solid #eaeaea;/* margin: 0; */padding:50px 0;/* width: 49.5%; *//* display:inline-block; */box-sizing: content-box;/* vertical-align:top; *//* min-height: 354px; */}
.login_wrap .login_body:nth-child(2){background:#f9f9f9;}
.login_wrap .login_body .login_input{background:#f3f3f3;border:1px solid #ddd}
.login_wrap .login_body h3{font-size:24px;margin-bottom:15px;}
.login_wrap .login_body input[type=text], .login_wrap .login_body input[type=password]{font-weight:300;width:400px;}
.login_wrap .login_body .login_btn{background:#333 !important;width:420px;margin-top:15px;}
.login_wrap .txt{width:400px;margin: 10px auto; text-align:left;font-size:.9rem !important;}

.login_wrap .pwc a{color:#007c6d;text-decoration:underline; font-size:.9rem}
.login_wrap .pwc a:hover{color:#07524a;transition: 0.3s ease;}


#subCon { width:94%; height:auto; padding:18px 3% 40px 3%; margin:0 auto; min-height:300px; overflow:hidden; line-height:170%; font-size:0.85em; position:relative; border-bottom:1px solid #d8d9da; word-break:keep-all; }
/* #subCon h1 {float:left; width:100%; font-size:1.6em; color:#101010; padding-bottom:8px; border-bottom:1px solid #e1e1e1;} */
#subCon h6.h6Title { float:left; width:100%; background:url(/images/mobile/images/navi_topbg.png) no-repeat left top; margin-bottom:15px; font-size:13px; font-weight:normal; padding-top:6px; color:#777;}
#subCon span.total {float:left; font-weight:normal; padding-top:12px; line-height:170%; font-size:0.95em; margin-bottom:10px; color:#101010;}
#subCon .pagingWrap {float:right; position:absolute; top:13px; right:3%;}
#subCon .pagingWrap img {width:25px; vertical-align:bottom; padding:0; }
/* #subCon h3 { float:left; width:100%; height:24px; background:url("/images/mobile/images/bullet02.png") no-repeat left 4px; background-size:10px; padding:0 0 0 14px; color:#000000; font-size:16px;} */
.searchBox {float:left; border:1px solid #EAEAF2; background:#F4F5F9; padding:12px 2%; margin-bottom:12px; width:95%; margin-right:1%;}
.searchBox select { float:left; font-size:14px; width:25%; height:26px; line-height:26px; background:#fff; padding-left:5px; border:1px solid #c6c6c6; margin-left:8px;}
.searchBox input { float:left; font-size:14px; width:50%; height:24px; line-height:24px; background:#fff; padding-left:5px; border:1px solid #c6c6c6; margin-left:4px;}
.searchBox span.searchBtn { float:left; text-align:center; margin-left:5px; width:15%; height:24px; line-height:24px; background:#666; border-radius:2px; margin-top:1px;}
.searchBox span.searchBtn a { color:#fff; display:block; font-size:0.9em; font-weight:bold;}


.sub01_01 { width:100%; overflow:hidden; color:#555;}
.sub01_01 img {float:left; width:100%; margin-bottom:10px;}
.sub01_01 h2.h2Title { float:left; line-height:160%; width:100%; font-weight:normal; color:#101010; }
.sub01_01 h2.h2Title strong {font-weight:bold; font-size:15px; line-height:170%;}
.sub01_01 h6 {float:left; font-size:15px; color:#101010; line-height:150%; width:97%; padding:9px 0 8px 2%; margin-bottom:5px; margin-top:15px; background:#f4f5f9; border:1px solid #eaeaf1; border-radius:5px;}
.sub01_01 h4.h4Title { float:left; width:100%; height:24px; background:url("/images/mobile/images/bullet02.png") no-repeat left 3px; background-size:10px; padding:0 0 0 14px; color:#000000; font-size:16px;}
.sub01_01 p {color:#555;}
.sub01_01 .sub01_01_sign img {float:right; width:240px; margin-top:20px;}

/* 상단전체메뉴 css */
.cssmenu { width:0px; overflow:hidden; position:fixed; height:2000px; background:#4a4a4a; right:0; top:0;}
#cssmenu,#cssmenu ul,#cssmenu li,#cssmenu a { font-weight: normal; text-decoration: none; line-height: 1; font-size:14px; position: relative;}
#cssmenu a { line-height: 1.3;}
#cssmenu {width:179px; border-left:1px solid #4a4a4a; overflow:hidden; }
#cssmenu > ul > li > a {font-size: 24px; font-weight: bold;display: block;text-transform: uppercase;position: relative;}
#cssmenu > ul > li > a > span {background: #4a4a4a url(/images/mobile/images/gnb_all_bg_on.png) no-repeat 155px center; padding:14px 15px; border-bottom:1px solid #3a3a3a; color:#fff; display: block; font-size:15px; font-weight:normal; }
#cssmenu > ul > li > a:hover {text-decoration: none;}
#cssmenu > ul > li.active {border-bottom: none;}
#cssmenu > ul > li.active > a {color: #fff;}
#cssmenu > ul > li.active > a span {background: #338fe1 url(/images/mobile/images/gnb_all_bg_off.png) no-repeat 152px center; border-bottom:1px solid #2875ba; color:#fff;}
#cssmenu span.cnt {position: absolute;top: 8px;right: 15px;padding: 0;margin: 0;background: none; display:none;}
#cssmenu ul ul {display: none;}
#cssmenu ul ul li {border-bottom:1px solid #e1e1e1;border-top: 0; }
#cssmenu ul ul li:last-child { border-bottom:0;}
#cssmenu ul ul a {padding: 12px 30px;display: block; color: #4a4a4a; font-weight: normal; font-size: 13px;}
#cssmenu ul ul a:hover {color: #338fe1;}
#cssmenu ul ul li.odd {background: #fafafa url(/images/mobile/images/gnb_all_snb_bg.png) no-repeat 15px center;}
#cssmenu ul ul li.even {background: #fafafa url(/images/mobile/images/gnb_all_snb_bg.png) no-repeat 15px center;}

/*210824*/
.login_wrap .left{
	float:none !important;
	width: 100% !important;
}
.login_wrap .right{float:none;width: 100% !important;text-align: center;}
.login_input {
    background: #fff !important;
    width: 85% !important;
    border: 1px solid #e2e2e2 !important;
    margin: 3px auto !important;
    height: 50px !important;
}
.login_btn {
    background: #535353 !important;
    width: 85% !important;
}

.login_wrap .txt{ 
	width: 85% !important; 
	margin:10px auto;
	text-align: left !important;
	
	}
.login_wrap a {
	width: 85% !important; 
}
.login_wrap a b{
	display:block;
	text-align:left;
}

@media (min-width:640px) and (max-width:990px){
/* #header h1 img { width:60%; margin-top:13px; margin-left:10px;} */
}
