@charset "utf-8";
/* @import url('http://fonts.googleapis.com/earlyaccess/nanumgothic.css'); */
/* @import url('https://fonts.googleapis.com/earlyaccess/nanumgothic.css'); */

@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: url(../../webfont/NanumGothic-Regular.eot);
  src: url(../../webfont/NanumGothic-Regular2.eot) format('embedded-opentype'),
       url(../../webfont/NanumGothic-Regular.woff2) format('woff2'),
       url(../../webfont/NanumGothic-Regular.woff) format('woff'),
       url(../../webfont/NanumGothic-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url(../../webfont/NanumGothic-Bold.eot);
  src: url(../../webfont/NanumGothic-Bold2.eot) format('embedded-opentype'),
       url(../../webfont/NanumGothic-Bold.woff2) format('woff2'),
       url(../../webfont/NanumGothic-Bold.woff) format('woff'),
       url(../../webfont/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 800;
  src: url(../../webfont/NanumGothic-ExtraBold.eot);
  src: url(../../webfont/NanumGothic-ExtraBold2.eot) format('embedded-opentype'),
       url(../../webfont/NanumGothic-ExtraBold.woff2) format('woff2'),
       url(../../webfont/NanumGothic-ExtraBold.woff) format('woff'),
       url(../../webfont/NanumGothic-ExtraBold.ttf) format('truetype');
}

.constrain {
    max-width: 993px;
    margin: 0 auto;
    padding: 0px;
}

.maindiv {
    width: 993px;
    margin: 0 auto;
    height: 100%;
    text-align: center;
}

.dialog {;}
.dialog h2 {position:relative;font-family:Dotum,돋움;color:#0e8adb;font-weight:bold;font-size:24px;letter-spacing:-2px;z-index:5;}
.dialog h2 span.title {display:inline;position:relative;vertical-align:baseline;color:#959595;font-weight:bold;font-size:16px;letter-spacing:-2px;}
.dialog h3 {margin-top:20px;position:relative;font-family:Dotum,돋움;color:#686767;font-weight:bold;font-size:13px;letter-spacing:-2px;z-index:5;background:url(images/icon_stitle.gif) no-repeat 0 4px;padding:0 13px 5px;}

/* Top menu Nav */
#top-nav {
    white-space: nowrap;
    background: #319Ac4 url(images/topMenu.png)
        50% 50% repeat-x;
}

#top-nav nav {
    height: 38px;
}

#topMenu {
    height: 38px;
    background: #319Ac4 url(images/topMenu.png) 50% 50% repeat-x;
    padding: 0;
}

#top-nav nav ul {
    text-align: left;
    display: inline;
    float: left;
    margin: 0;
    list-style: none;
}

#top-nav nav ul.projects {
    float: left;
    padding-left: 0px;
}

#top-nav nav ul li {
    font: bold 19px/21px "Dotum", Helvetica, Arial, Geneva, sans-serif;
    display: inline-block;
    float: left;
    position: relative;
    top: 0px;
    cursor: pointer;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    padding: 0px;
    font-weight: bold;
    color: #ffffff;
}

.mainTopAdminFont {
    text-decoration: blink;
    font-weight: bold;
    color: #555555; 
}

.ie #top-nav nav ul li {
    top: 2px;
}

#top-nav nav ul li:hover {
    background: #488b35 url(images/topMenuOver.png)
        50% 50% repeat-x;
    color: #ffffff;
}

#top-nav nav ul li:hover a {
    color: #ffffff;
}

#top-nav nav ul li i {
    height: 1em;
}

#top-nav nav ul li a {
    color: #ffffff;
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    display: block;
    padding: 0px;
}

#top-nav nav ul li ul {
    padding: 0;
    position: absolute;
    top: 38px;
    left: 0px;
    min-width: 100%;
    width: auto;
    display: none;
    visibility: hidden;
    z-index: 400;
    background: #319Ac4;
    opacity:0.75;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}

#top-nav nav ul li ul li {
    font: bold 13px/17px "Dotum", Helvetica, Arial, Geneva, sans-serif;
    background: #319Ac4;
    display: block;
    color: #fff;
    float: none;
    padding: 0;
    border: 0px;
}

#top-nav nav ul li ul li a {
    color: #ffffff;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    display: block;
    padding: 4px 6px;
}

#top-nav nav ul li ul li:hover {
    background: #319Ac4 url(images/subTopMenuOver.png)
        50% 50% repeat-x;
    color: #ffffff;
}

#top-nav nav ul li ul li a:hover {
    background: #319Ac4 url(images/subTopMenuOver.png)
        50% 50% repeat-x;
    color: #ffffff;
}

#top-nav nav ul li:hover ul {
    display: block;
    visibility: visible;
}

#top-nav nav ul li:hover ul li a {
    color: #ffffff;
}

#top-nav nav ul li:hover ul li:hover a {
    color: #ffffff;
}

#top-nav nav ul.projects li.project {
    width: 42px;
    padding: 0px;
    height: 33px;
    text-indent: -9999px;
    z-index: 10;
}

#top-nav nav ul.projects li.project a {
    display: block;
    height: 33px;
}

#top-nav nav ul.projects li.jquery-ui {
    background-position: -57px 0px;
}

#top-nav nav ul.projects li.jquery-mobile {
    background-position: -107px 0px;
}

#top-nav nav ul.projects li.sizzlejs {
    background-position: -155px 0px;
}

#top-nav nav ul.projects li.qunitjs {
    background-position: -204px 0px;
}

/* leftMenu */
#leftMenu h3 {
    font-size: 17px;
    padding: 10px 5px;
    height:12px;
    color:#0283AC;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    margin-top:10px;
    margin-left:7px;
    margin-right:5px;
    border-bottom: 2px solid #49ABCD;
}

#leftMenu ul {
    padding: 5px;
    margin: 0px;
}

#leftMenu li {
    padding-left: 16px;
    list-style-type: none;
    background: url(images/left_menu_icon.png) no-repeat 0 12px;
    text-shadow: 0 1px 0 #ffffff;
}

#leftMenu li a {
    color: #4d4d4d;
    text-decoration: none;
    padding: 11px 0;
    display: block;
    font-weight: bold;
    white-space: nowrap;
}

#leftMenu li ul li {
    padding-left: 14px;
    line-height: 15px;
    list-style-type: none;
    background: url(images/left_menu_icon_down.png) no-repeat 0 7px;
    text-shadow: 0 1px 0 #ffffff;
}

#leftMenu li ul li a {
    color: #4d4d4d;
    text-decoration: none;
    padding: 5px 0;
    display: block;
    font-weight: bold;
    white-space: nowrap;
}

#leftMenu nav#secondary li {
    background-image: none;
    padding-left: 0;
}

#leftMenu nav#secondary li.current {
    background-color: #eee;
    margin-left: -35px;
    margin-right: -20px;
    padding-left: 35px;
    font-weight: bold;
}

.container-right h2 {
    background: url(images/sub_title_icon.png) no-repeat;
    position: relative;
    font-family: Dotum;
    color: #2779aa;
    font-weight: bold;
    font-size: 18px;
    letter-spacing: -2px;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    margin-top:20px;
    height: 22px;
    padding-left: 10px;
    padding-top: 3px;
}

.container-right h2 span.title {
    display: inline;
    position: relative;
    vertical-align: baseline;
    color: #959595;
    font-weight: bold;
    font-size: 16px;
    letter-spacing: -2px;
}

.container-right h2 span.navy {
    position: absolute;
    right: 3px;
    top: -10px;
    color: #a2a2a2;
    letter-spacing: -0.5px;
    font-size: 12px;
}

.container-right h2 span.navy em {
    color: #494949;
    font-style: normal;
}

.condition {
    width: 770px;
    overflow: hidden;
    margin-top: 20px;
    border: 1px solid #dfdfdf;
    padding: 9px;
    background: #f7f7f7;
}

.condition table {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
    padding: 0px;
}

.condition table tbody th {
    height: 22px;
    padding: 2px 0 0 0px;
    font-weight: bold;
    font-size: 12px;
    text-align: left;
    letter-spacing: -1px;
}

.condition table tbody td {
    height: 22px;
    padding: 0 0 0 5px;
    font-size: 12px;
    letter-spacing: -1px;
}

.condition table tbody td.list {
    width: 100px;
    height: 22px;
    padding: 5px 0 0 5px;
    vertical-align: baseline;
    font-weight: bold;
    font-size: 12px;
    letter-spacing: -1px;
}

.condition table tbody td input {
    height: 14px;
    vertical-align: middle;
}

.condition table tbody td span img {
    vertical-align: middle;
}


/* 페이징 */
/* .paging {clear:both;text-align:center;padding-top:10px;}
.paging span {margin:0 3px;}
.paging a {margin:0 3px;}
.paging a.img {margin:0 1px;vertical-align:middle;}
.paging a.img img {margin-top:3px;} */

.btn {position:relative;width:100%;height:18px;}
.btnL {float:left;position:relative;}
.btnR {float:right;position:relative;padding:5px 0;}
.btnC {position:relative;padding-top:20px;text-align:center;}

.gridHeader {position:relative;padding:5px 0; width:300px;}

.invisible {clear:none;border: 0px none;float:none;background-color:#ffffff;overflow:hidden;readonly:true;}
.srch_invisible {clear:none;border: 0px none;float:none;background-color:#f7f7f7;overflow:hidden;}
.readonly {height:16px;border:1px solid #d7d7d7;vertical-align:middle;}
.txtCal {width:80px;text-align:center;}

.viewDiv {
    width: 790px;
    margin-top: 20px;
}

.viewDiv table {
    border: 1px solid #ececec;
    width: 100%;
}

.viewDiv table tbody th {
    text-align: left;
    vertical-align: middle;
    border-left: 1px solid #ececec;
    border-right: 1px solid #ececec;
    background-color: #f7f7f7;
    padding-top: 5px;
    padding: 3px 0px 0px 3px;
}

.viewDiv table tbody td {
    vertical-align: middle;
    color: #595959;
    height: 24px;
    padding: 0 5px;
    border-bottom: 1px dotted #ececec;
}

.viewDiv table tbody td.inner {vertical-align:middle;color:#595959;height:24px;padding:0;border:0px;}

.viewDivI table {
    border: 1px solid #ececec;
    width: 100%;
}

.viewDivI table tbody th {
    text-align: left;
    vertical-align: middle;
    border-left: 1px solid #ececec;
    border-right: 1px solid #ececec;
    border-bottom: 1px solid #ececec;
    background-color: #f7f7f7;
    padding-top: 5px;
    padding: 3px 0px 0px 3px;
}

.viewDivI table tbody td {
    vertical-align: middle;
    color: #595959;
    height: 24px;
    padding: 0 5px;
    border-bottom: 1px dotted #ececec;
}

/* 리뉴얼 */



*{ margin:0; padding:0;}
ul, li {
    list-style-image: none;
    list-style-type: none;
}
img{ border:0; }
a {  text-decoration:none ; color: #45547b;}
html,body{ height:100%;  }
/* body{ font: 13px/1.6 'Nanum Gothic', Dotum, "돋움", sans-serif; color: #45547b;background:#eef2f5; } */
body{ font: 13px/1.6 'Nanum Gothic', Dotum, "돋움", sans-serif; color: #45547b;background:#ffffff; }

#header{  width:100%; border-top:7px solid #efefef; background:#fff; }
#header .logo{ width:1072px; margin:0 auto; margin-top:15px; margin-bottom:17px;  }
#header #navBg{ width:100%; background:#1e62aa;  }
#header #navBg #nav{ width:1072px; margin:0 auto;}
#header>#navBg>#nav>li { float:left;}
#header>#navBg>#nav>li>a{display:block; width:178.666px; text-align:center; color:#fff; font: 19px/1 'Nanum Gothic', Dotum, "돋움" ; padding:18px 0 19px 0;  }
#header>#navBg>#nav>li>a:hover{ background:url(../../images/main/menu_bg.gif) repeat-x /*linear-gradient(to bottom, #354874, #1e62aa, #1e62aa)*/; }
#header>#navBg>#nav:after{content:""; display:block; clear:both;}
#header:after{content:""; display:block; clear:both;}


#m1,#m2,#m3,#m4,#m5,#m6{ position:absolute; width:178.666px; margin:0 auto; display:none; background:#ffffff;/*rgba(255,255,255,0.8)*/ /* url(../../images/main/topmenu_bg.png) */ height:200px; border-top:4px solid #7ba5e2;  padding-top:10px; padding-left:15px; box-sizing:border-box; border-right:1px solid #ddd;border-bottom:1px solid #ddd;  z-index:20;}
#m1{ border-left:1px solid #ddd; }
#nav>li>ul>li>a {color:#1e62aa; font:15px/1.5  'Nanum Gothic', Dotum, "돋움", sans-serif; }
#nav>li>ul>li>a:hover { text-decoration:underline; }
#nav>li>ul:hover>li>a {color:#fff;}


    
#imageBg{ width:100%; border-bottom:1px solid #7799b7; background:url(../../images/main/mainimagebg.jpg);}
#imageBg .mainImage{ width:1072px; height:365px; margin:0 auto; display:block;}
#imageBg:after{content:""; display:block; clear:both;}

#container{ width:100%; background:#fff;overflow:hidden; padding-bottom:70px;}
#container #content{ width:1054px; margin:0 auto;background:#fff;  margin-top:19px;}
#container:after{content:""; display:block; clear:both;}


#container #content #list2{ display:block; }
#container #content #list3,#container #content #list1{ display:none; }

#container #content .bbsList{ width:756px; float:left;}
#container #content .bbsList .bbsBox{ height: 203px;}
#container #content .bbsList .bbsMenuTop{ width:756px;}
#container #content .bbsList .bbsMenuTop li{ width:252px; float:left;position:relative; }
#container #content .bbsList .bbsMenuTop li a{ font-size:17px; font-weight:bold; display:block; color:#8d9aaa; padding-left:12px; padding-top:8px; border-bottom:solid #7799b7 1px; padding-bottom:10px; background:#e4e7ea;}
#container #content .bbsList .bbsMenuTop li a.mOn{ color:#354874; border-top:solid #7799b7 1px; border-left:solid #7799b7 1px;border-right:solid #7799b7 1px;border-bottom:none; background:#fff;}
#container #content .bbsList .bbsMenuTop li  .iconMore{  display:block; position:absolute;top:0; right:0; padding:12px;margin:2px;  font-size:10px; font-weight:bold; color:#b5c8d9; background:#354874 url(../../images/main/icon_arrow1.gif) no-repeat 90% center; border:none;}
#container #content .bbsList .bbsMenuTop:after{content:""; display:block; clear:both;}

#container #content .bbsList .bbsBox{ width:756px; border:solid #7799b7 1px; border-top:none; box-sizing:border-box; }
#container #content .bbsList .bbsBox:after{content:""; display:block; clear:both;}
#container #content .bbsList .bbsBox .bbsBoxArea{  padding-top:11px;padding-bottom:10px; }
#container #content .bbsList .bbsBox .bbsBoxArea:after{content:""; display:block; clear:both;}
#container #content .bbsList .bbsBox .bbsBoxArea .bbsBoxIcon{ margin-bottom:7px; }
#container #content .bbsList .bbsBox .bbsBoxArea>li{ width:30%;float:left;  margin-left:3%;}
.boxArea{  }
.boxArea li{ background:url(../../images/main/icon_arrow2.gif) no-repeat left 50%; padding-left:15px; color:#355674; font:13px/2.3  'Nanum Gothic', Dotum, "돋움", sans-serif;  }
.boxArea li a:hover{  text-decoration:underline; }

#container #content #bannerGroup{ width:264px; float:left; margin-left: 30px; }
#container #content #bannerGroup .bannerG{ border:1px solid #96acc6; height:50px; box-sizing:border-box;margin-bottom:5px; padding-left:150px; padding-top:17px; }
#container #content #bannerGroup .ba1{ background:url(../../images/main/mainbicon1.gif) no-repeat  15px; }
#container #content #bannerGroup .ba2{ background:url(../../images/main/mainbicon2.gif) no-repeat  15px; }
#container #content #bannerGroup .ba3{ background:url(../../images/main/mainbicon3.gif) no-repeat  15px; }
#container #content #bannerGroup a{ color:#2f567f; font: bold 17px/1 'Nanum Gothic', Dotum, "돋움", sans-serif; }

#container #content #gong{ width:264px; float:left; margin-left: 30px; margin-top:9px; }
#container #content #gong .gongTitle{ color:#2f567f; font: bold 14px/1 'Nanum Gothic', Dotum, "돋움", sans-serif; margin-bottom:5px; padding-bottom:5px; border-bottom:#6989b5 solid 3px; overflow:hidden; padding-top:1.5px;} 
#container #content #gong .gongList{  }
#container #content #gong .gongList li a{ color:#355674; font:12px/1.3  'Nanum Gothic', Dotum, "돋움", sans-serif;  }
#container #content #gong .gongList li a:hover{ text-decoration:underline; }

#footer{ width:100%; border-top:3px solid #7799b7;  }
#footer #footerContent{ width:1000px; margin:0 auto; margin-top:28px;padding-left:265px; box-sizing:border-box; background:url(../image/blogo.png) no-repeat 76px 25px; margin-bottom:20px;}
#footer #footerContent .btmNav{font:11px/2.6  'Nanum Gothic', Dotum, "돋움", sans-serif; color:#405b72}
#footer #footerContent .btmNav a{ font:11px/3  'Nanum Gothic', Dotum, "돋움", sans-serif;color:#405b72 }
#footer #footerContent .btmNav a:hover{ text-decoration:underline; }
#footer #footerContent .address{font:11px/1.5  'Nanum Gothic', Dotum, "돋움", sans-serif; color:#405b72}



#slideshow {
    position:relative;
    height:365px;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:1;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:5;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:2;
}