@charset "utf-8";
@import "guide.css";
@import "info.css";

/* default */
*{margin:0; padding:0; }
body {height:100%; width:100%; text-align:left; margin:0; padding:0; font-size:13px; font-family:'NanumGothic'; color:#334456; line-height:160%;  background:#fff;}

@font-face {
    font-family:'NanumGothic';
    src: url('font/NanumGothic-Regular.eot');
    src: url('font/NanumGothic-Regulard41d.eot?#iefix') format('embedded-opentype'),
         url('font/NanumGothic-Regular.woff') format('woff'),
         url('font/NanumGothic-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family:'NanumBarunGothic';
    src: url('font/NanumBarunGothic.eot');
    src: url('font/NanumBarunGothicd41d.eot?#iefix') format('embedded-opentype'),
         url('font/NanumBarunGothic.woff') format('woff'),
         url('font/NanumBarunGothic.html') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html, body, blockquote, caption, dd, div, dl, dt, fieldset, form, frame, h1, h2, h3, h4, h5, h6, hr,
iframe, input, legend, li, object, ol, p, pre, q, select, table, textarea, tr, td, ul {margin:0; padding:0; vertical-align:middle;}
ol, ul, li {list-style:none;}
fieldset, img {border:0 none;}
img {vertical-align:middle; border:0;}
h1, h2, h3, h4, h5, h6 {font-style:normal; font-size:13px;}
table {border-collapse:collapse; border:0; empty-cells:show; table-layout:fixed; word-break: break-all;}
textarea {resize:none;}
hr,legend {position:absolute; width:0; height:0; font-size:0; line-height:0; overflow:hidden;}
caption {width:0; height:0; font-size:0; line-height:0; overflow:hidden;}
button {background: none repeat scroll 0 0 transparent; border: 0 none; cursor: pointer; display: inline-block; padding: 0 1px 1px 0; text-align: center; vertical-align: middle; white-space: nowrap;}

a {text-decoration: none; color:#334456;}
a:link, a:visited {text-decoration: none; color:#334456;}
a:hover, a:active, a:focus {text-decoration: underline; color:#334456;}

/* 숨김 텍스트 */
.none {font-size: 1px; height: 0; line-height: 0; overflow: hidden; position: absolute; top: -999em; width: 0;}

/* margin padding */
.mr30 {margin-right: 30px; }
.mb10 {margin-bottom: 10px; }
.mb20 {margin-bottom: 20px; }
.mb25 {margin-bottom: 25px; }
.mb30 {margin-bottom: 30px; }
.mmt27 {margin-top: -27px; }

.pl15 {padding-left: 15px; }
.pt10 {padding-top: 10px; }
.pt20 {padding-top: 20px; }

/* 동영상 */
.video_sample {    
    height: 138px;    
    width: 750px;
	margin-left: 7px;
}

/* float */
.fLeft{ float:left;}
.fright{ float:right;}
.con_square{background: url('../img/common/bu_dd.gif') no-repeat 0 6px; padding-left:10px;}



/* header */
#header_wrap {position: relative; width: 100%; min-width: 1000px; border-bottom: 1px solid #86909a;}
#header {position: relative; width: 1000px; height: 102px; margin: 0 auto; padding-top: 18px; }
#header h1 {float: left; width: 195px; padding-left: 10px; }
#header>ul>li {float: left;}
.nav_skip {float: right; padding-right: 0; margin:12px 5px 20px 0;}
.nav_skip li {padding-left: 15px; margin-left: 0px; }
.nav_skip li:first-child {padding-left: 25px; background: url('../img/common/ico_skip.png') no-repeat 0 2px;}
.nav_skip li span {margin-left: 15px; }
.gnb {position: absolute; right:0; top: 70px; width: 795px; padding-left: 15px; height:20px; z-index: 5;}
.gnb>li>a {display: block; padding: 0 16px; margin-bottom: 35px; font-family: 'NanumBarunGothic'; font-size: 18px; font-weight: bold; }
/*.gnb {position: absolute; right:0; top: 70px; width: 825px; padding-left: 15px; height:20px; z-index: 5;}
.gnb>li>a {display: block; padding: 0 13px; margin-bottom: 35px; font-family: 'NanumBarunGothic'; font-size: 18px; font-weight: bold; text-align:center}*/
.gnb .lnb_last a {width:100%; padding-right: 0; padding-left: 16px;}
/* 2depth menu */
.gnb_bg {position: absolute; top: 70px; width: 100%; min-width: 1000px; height: 199px; border-bottom: 1px solid #dbdde0; background:url('../img/common/gnb_bg.gif') bottom repeat-x; background-size: 2px 149px; z-index: 3;}
.gnb li ul {height: 133px; padding: 10px 5px 0px; font-size: 13px; border-left: 1px solid #dbdde0; text-align: center; letter-spacing:-1px; z-index: 4;}
.gnb li:first-child ul {border-left: 0; z-index: 4;}
.gnb li ul li { line-height:14px; margin-bottom:8px; }

/* 페이지 경로 */
#path {width:100%; min-width: 1000px; height: 28px; padding-top: 9px; background-color: #f1f2f3; border-bottom: 1px solid #b7bcc1; }
#path p {width:1000px; margin: 0 auto; text-align: right; font-size: 12px;}
#path p a {padding-right: 8px;}

/* 본문 영역 전체*/
#container {overflow: hidden; width: 1000px; padding-top: 50px; margin: 0 auto 100px;}
/* 서브메뉴 */
.snb {float: left; width: 190px; }
.snb h2 {margin-bottom: 20px; color: #334456; font-family: 'NanumBarunGothic'; font-size: 22px; font-weight: bold;}
.snb ul {border-top: 2px solid #4a5c6d; border-bottom: 1px solid #4a5c6d; }
.snb li a {display: block; height: 34px; padding-top: 11px; padding-left: 10px; border-top: 1px solid #b7bcc1; }
.snb li:first-child a {border-top: none; }
.snb a:link, .snb a:visited {color: #334456; font-size: 14px; font-weight: bold;}
.snb a:hover, .snb .on {color: #334456; font-size: 14px; font-weight: bold; background: url('../img/common/bu_snb.gif') no-repeat 175px 19px #f1f2f3; }
/* 본문 콘텐츠 영역 */
#content {float: left; width: 760px; padding-left: 50px; }
#content h3 {height: 35px; padding-top: 5px; margin-bottom: 30px; font-size:30px; color:#334456; font-weight:bold; font-family:'NanumBarunGothic'; border-bottom: 1px solid #b7bcc1;}
#content h4 {background: url('../img/common/bu_h4.gif') no-repeat 0 5px; font-family: 'NanumBarunGothic'; font-size: 16px; font-weight: bold;}
#content .em {font-family: 'NanumBarunGothic'; font-size: 16px; font-weight: bold; text-align: justify; }
#content .subs {text-align: justify;}
#content .dotLine{padding:20px 0; border-top:dashed 1px #334456; margin-top:20px;}
/* 게시물 총 수 */
#content .total {float: left; }
/* 게시판 리스트 */
.online_list {clear: both; width: 100%; margin-bottom: 30px;}
.online_list th {height: 40px; border-top: 2px solid #4a5c6d; border-bottom: 1px solid #4a5c6d; text-align: center;}
.online_list td {height: 40px; border-bottom: 1px solid #b7bcc1; text-align: center;}
.online_list .td_title {height: 40px; border-bottom: 1px solid #b7bcc1; padding-left: 10px; text-align: left;}
.online_list .re {padding-left: 20px; background: url('../img/common/ico_re.png') no-repeat 0 3px; font-weight: bold; color: #e21c1c}

/* 페이지 네비게이션 */
.nav_page {text-align: center; position: relative;}
.nav_page a {display: inline-block; width: 25px; height: 23px; margin-left: -4px; padding-top: 2px; background: url('../img/common/line_page.gif') no-repeat 0 8px; font-size: 12px; text-align: center; }
.nav_page div+a {margin-left: 0}
.nav_page div+a, .nav_page .page_on, .nav_page .page_on+a {background: none #fff}
.nav_page .page_on {background-color: #334456; color: #fff; }
.nav_page .btn_first {background: url('../img/common/btn_first.gif') no-repeat; }
.nav_page .btn_pre {background: url('../img/common/btn_pre.gif') no-repeat; }
.nav_page .btn_next {background: url('../img/common/btn_next.gif') no-repeat; }
.nav_page .btn_last {background: url('../img/common/btn_last.gif') no-repeat; }
.nav_page .page_btn {display: inline-block; height: 25px; }
.nav_page .page_btn a {margin: 0px 1px; }


.navWrap{ float:left; width:520px; height:30px; padding:2px 0 0 120px;}
.btnbox{ float:left; width:120px; }


/* 게시물 상세 내용 레이아웃 */
#content .h4_online {width: 740px; background: none; border-top: 2px solid #4a5c6d; border-bottom: 1px dotted #dddddd; padding: 20px 10px 15px 10px; font-size: 22px; line-height:120%;}
#content .h4_info {position: relative; height: 30px; padding-top: 10px; border-bottom: 1px solid #b7bcc1; }
#content .h4_info p {position: absolute; right: 30px; }
#content .h4_info p span {float: left; margin-left: 105px; }
#content .subs_wrap {padding: 30px;}
.t_wrap {overflow: hidden; border-top: 1px solid #b7bcc1; }
.t_wrap dt, .t_wrap dd {float: left; border-bottom: 1px solid #b7bcc1; padding-top: 10px; }
.t_wrap .t_pre {width: 50px; height: 30px; padding-left: 30px; background: url('../img/online/bu_pre.html') no-repeat 10px 18px; }
.t_wrap .t_next {width: 50px; height: 30px; padding-left: 30px; background: url('../img/online/bu_next.html') no-repeat 10px 18px; }
.t_wrap dd {width: 665px; height: 30px; padding-left: 15px; }
/* 글쓰기 양식 */
.w_form dl {display: block; overflow: hidden; width: 760px; border-bottom: 1px solid #b7bcc1; font-family: 'NanumBarunGothic'; font-size: 14px; background-color: #f1f2f3; }
.w_form dl:first-child {border-top: 2px solid #4a5c6d; }
.w_form dl dt {float: left; width: 160px; padding-top: 14px; padding-left: 30px; }
.w_form dl dd {float: left; width: 554px; padding: 8px; background-color: #fff; }
.w_form dl dd textarea {width: 550px; height: 155px; border: 1px solid #b7bcc1; font-family: 'NanumGothic'; font-size: 14px; }
.w_form input[type=text] {width: 220px; height: 28px; border: 1px solid #b7bcc1; line-height: 28px; font-family: 'NanumGothic'; font-size: 14px; }
.w_form input[type=file] {width: 220px; height: 28px; border: 1px solid #b7bcc1; line-height: 28px; font-family: 'NanumGothic'; font-size: 14px; }
.w_form input[type=password] {width: 220px; height: 28px; border: 1px solid #b7bcc1; line-height: 28px; font-family: 'NanumGothic'; font-size: 14px; }
.w_form input[type=radio] {height: 28px; margin-right: 5px; line-height: 28px; font-family: 'NanumGothic'; font-size: 14px; }
.w_form input.w_file {width: 365px; height: 28px; border: 1px solid #b7bcc1; background-color: #e6e6e6; line-height: 28px; font-family: 'NanumGothic'; font-size: 14px; }
.w_form input.btn_file {width: 90px; height: 30px; border: 1px solid #b7bcc1; background-color: #e6e6e6; line-height: 28px; font-family: 'NanumGothic'; font-size: 13px; margin-left: 4px;}

/* 버튼모양 및 정렬 */
.btn_c {text-align: center;}
.btn_r {text-align: right;}
#content .btn_a {display: inline-block; min-width: 30px; height: 25px; padding: 5px 15px 0; margin: 0 0 0 10px; background-color: #334456; font-family: 'NanumGothic'; color: #fff; text-align: center;}



/* 본문 콘텐츠 탭 메뉴 */
.tab_menu {overflow: hidden; background: url('../img/accessibility/line_tab.gif') repeat-x bottom; margin-bottom: 40px;}
.tab_menu li a {display: block; float: left; border: 1px solid #b7bcc1; padding: 7px 20px; background-color: #f1f2f3; }
.tab_menu li+li a {border-left: 0}
.tab_menu li a.tab_on {border: 1px solid #334456; background-color: #334456; color: #fff; font-weight: bold;}
.tab_menu li a.tab_on {border-right:1px solid #b7bcc1;}
.tab_menu .tab_last a.tab_on {border-right:0;}



/* 게시판 검색 */
.search {float: right; margin-bottom: 15px;}
.search select {width: 100px; height: 28px; border: 1px solid #b7bcc1; padding: 4px 0; font-family: 'NanumGothic'; }
.search input {width: 160px; height: 18px; border: 1px solid #b7bcc1; padding: 4px 0; }
.search button {width: 60px; height: 28px; background-color: #334456; font-family: 'NanumGothic'; font-weight: bold; color: #fff;}

/* 하단 사이트맵 */
#nav_sitewrap {width: 100%; min-width: 1000px; height: 340px; padding-top: 30px; background-color: #657482; }
.nav_site {overflow: hidden; width: 1000px; height:330px; padding: 5px 0 5px 0; margin: 0 auto; position:relative; }
.nav_site div {float: left; line-height: 150%; border-left: 1px solid #75828f;}
.nav_site div a {color: #d8dce0; font-size: 12px; line-height: 150%;}
.nav_site div h3 {margin-bottom: 20px;}
.nav_site div h3 a {font-size: 13px; font-weight: bold; line-height: 100%; margin-bottom: 20px;}
.nav_site ul li {padding-left: 8px; background: url('../img/common/bu.gif') no-repeat 0 8px;}
.nav_site ul li ul li {padding-left: 0px; background: none;}
.site1 {width: 184px; height: 255px; padding: 0 10px 0 20px; }
.site2 {width: 189px; height: 170px; padding: 0 10px 0 15px; }
.site3 {width: 104px; height: 100px; padding: 0 0px 0 15px; }
.site4 {width: 159px; height: 100px; padding: 0 0px 0 15px; }
.site5 {width: 139px; height: 100px; padding: 0 0px 0 15px; }
.site6 {width: 104px; height: 100px; padding: 0 0px 0 15px; }
.mg {margin-bottom: 5px;}

/* TOP 위로가기 */
.nav_site .btTop{ position:absolute; right:0; bottom:22px; width:49px; height:24px;  border-left:none;}
.nav_site .btTop a{ display:block; width:49px; height:24px; padding-top:22px; font-weight:bold; font-size:13px; line-height:13px; color:#b7bcc0; text-align:center; background:url(../img/common/btn_top.png) no-repeat;}

/* 하단 푸터 */
#footer {width: 100%; min-width: 1000px; padding:20px 0; background-color: #101010;}
#footer .ftinner{width: 980px; margin: 0 auto; padding-left:20px; font-size: 12px; color:#888888; line-height: 140%;position:relative;}
#footer address, #footer p a {color:#888888; font-style:normal;}
#footer .fweclogo{display: inline-block;float:left;position:absolute; top:0px; right:0; }
#footer .fweclogo img{float:left;}
#footer .swlogo{display: inline-block;float:left;position:absolute; top:0px; right:80px; }




/* 관리자 로그인 */
#login_wrap{ position:relative; width:680px; height:390px; margin:200px auto 0 auto; background:url(../img/login/login_bg.jpg) no-repeat;}
#login_wrap .ws_tit{ position:absolute; top:17px; right:21px;}
#login_wrap .login_tit{ position:absolute; top:88px; right:113px;}
#login_wrap fieldset{position:absolute; top:148px; right:82px; width:235px; height:135px; background:url(../img/login/fieldset_bg.gif) no-repeat;}
#login_wrap fieldset label{ float:left;}
#login_wrap fieldset input.txt{ float:left; border:0; width:180px; height:22px; margin:6px 0 0 10px; font-size:14px; font-weight:bold; }
#login_wrap .login_copy{ position:absolute; top:349px; left:227px;}

/*main*/
#visualbg{position:relative; }
#visualwrap {width:100%;  position:relative; }
#visualwrap .visualr100{ width:100%; height:319px;  background:#272e3e; border-bottom:1px solid #b7bcc1; }
#visualwrap .visuall50{position:absolute; width:50%; height:319px;  background:#f2f2f2; float:left; top:0; left:0;}
#visualbg {width:100%; position:relative; }

#visual {width:100%; height:319px; position:absolute; top:0;}

#visual .visualimg{ background:url(../img/main/bg_main.jpg) no-repeat center; width:1300px; height:319px; margin:0 auto; position:relative;}
#visual .visualimg p {position:absolute; left:649px; top:91px;}
#visual .visualimg p img{ margin-bottom:12px;}


/* 플러스bg*/
#wrap .mainpage{position:relative; padding:40px 0 20px 0; margin:0 auto;}
#container {position:relative;}
#container .ourwork { font-size:22px; font-weight:bold; }

#container  a.morebg { background:url(../img/main/btn_plus.gif) no-repeat;  position:absolute; top:40px; left:122px ; display:block; width: 21px; height:21px}

#container ul.oneourwork{float:left; width:1000px; margin-bottom:30px;}
#container ul.oneourwork li{font-size:14px; width: 235px; float:left; margin-left:20px;}
#container ul.oneourwork li:first-child{margin-left:0;}
#container ul.oneourwork li img{ border:1px solid #e2e4e6;}
#container ul.oneourwork li p{ float:left; font-size:13px; margin-bottom:6px; line-height:140%; }
#container ul.oneourwork li .pmark{ float:right; height:22px; }
#container ul.oneourwork li .pmark img{ padding-left:5px; border:0; }
#container ul.oneourwork li span{ float:left; width:100%; font-size:12px; color:#999; line-height:12px;}
#container ul.oneourwork li .workTit{width: 235px; height:22px; font-size:14px; font-weight:bold; color:#334456; margin:15px 0 5px 0;}

#notice_wrap{position:relative;}
#notice_wrapbg{ position:relative; width: 100%;}
#notice_wrapbg .bg100{ width:100%; height: 190px; background: #e9ebec; }
#notice_wrapbg .bg50{width:50%; height:190px; background:#c2d0de; position:absolute; float:left; top:0; left:0;}

#notice_wrap div {  line-height: 180%; }
#notice{width:100%; height:190px; position:absolute; top:0;}
#notice .noticesort{   width: 1000px;  margin: 0 auto; }

.noticesort h2{ margin-bottom: 20px; font-size:14px; font-weight:bold;}
.noticesort ul li{padding-left: 8px; background: url('../img/common/bu_m.gif') no-repeat 0 10px; }

.noticesort .news{ width:308px;  height: 165px; background-color: #c2d0de; padding:25px 30px 0 0 ;  float:left; position:relative;}
.noticesort .data{ width:376px; height: 165px; background-color: #dde3ea; padding:25px 0 0 30px;  float:left; position:relative;}
.noticesort .qna{ width:220px; height: 165px; background-color: #e9ebec; padding:25px 0 0 35px;  float:left;}



#notice h2{font-family:'NanumBarunGothic'; font-size:18px ; font-weight:bold; letter-spacing:-1px; }
#notice li{font-size:13px; line-height:180%;}
/*전화번호이미지 */
#notice .qna ul li{font-family:'NanumBarunGothic';}
#notice .qna ul li:first-child{ background:url(../img/main/ico_tel.png) no-repeat; font-size:22px;font-weight:bold; letter-spacing:-1px;padding-left:40px; height:32px; line-height:32px; margin-bottom:14px; }



/*플러스bg*/
 .news .morebg{position:absolute; background:url(../img/main/btn_plus.gif) 0 -21px no-repeat; top :25px; right:30px;display:block; width: 21px; height:21px}
 .data .morebg{position:absolute; background:url(../img/main/btn_plus.gif) 0 -42px no-repeat; top:25px; right:30px; display:block; width: 21px; height:21px}



/*여백*/
.mb15{ margin-bottom:15px;}
.mt15{margin-top:15px;}
.mt50{margin-top:50px;}
.mb30{ margin-bottom:30px;}
.pl20{ padding-left:20px;}
.pt30{ padding-top:30px;}
.pt15{ padding-top:15px;}
.pb25{ padding-bottom:25px;}
.pb30{ padding-bottom:30px;}
.pb35{ padding-bottom:35px;}


/*웹사이트 구축 사례*/
ul.webwork{float:left; width:760px; margin-bottom:20px;}
ul.webwork li{font-size:14px; width: 235px; float:left; margin-left:27px;}
ul.webwork li:first-child{margin-left:0;}
ul.webwork li img{ border:1px solid #e2e4e6;}
ul.webwork li p{width: 235px; font-size:14px; font-weight:bold; color:#334456; padding-top:10px;}