@charset "utf-8";
@import url('default.css'); 

/* Layout */
	/*#### 레이아웃은 상시 높이 100%로 푸터영역이 항상 아래쪽에 위치하도록 만들어 졌으며
		   본문은 왼쪽 고정 오른쪽 100% 형식으로 코딩 되었습니다. 
		   이후 넓이를 풀어서 사용하실 경우 가로의 넓이만 풀어주시면 됩니다. 
		   현재는 최대 1330px 최소 1004px로 유동 레이아웃으로 만들어져 있습니다. ####*/

/* Btn */
	/*#### 버튼에 대한 css 입니다. 수정이 가능하실 경우 아래 css를 수정 하시고
		   만약 어렵다면 새로 퍼블리셔가 들어온 후에 다른 방안을 구하시기 바랍니다. ####*/
.tnb a, .tnb a > span,
.btn_area a, .btn_area a > span,
table a.btn, table a.btn > span {display:inline-block; background:url('../images/btn/bg_btn.gif') no-repeat}
.btn_area a,
table a.btn {padding-right:15px}
.btn_area a > span,
table a.btn > span {padding-left:15px; white-space:nowrap}
.btn_area {text-align:right}
.btn_area a {height:26px; background-position:right -48px}
.btn_area a > span {height:26px; color:#fff; font-weight:bold; line-height:25px; background-position:0px -48px}
.btn_area a:hover > span,
.btn_area a:focus > span {color:#e7ffaf}

/* Table */
	/*#### 모든 테이블은 아래의 클래스가 적용됩니다.
		   단, tablelist 클래스 안에서 테이블을 추가 해주시고
		   테이블 작성시 반드시 thead, tbody, th, td 를 구분해서 코딩해 주세요. ####*/
.tablelist {clear:both; padding-bottom:20px; *zoom:1}
.tablelist:after {content:""; display:block; clear:both}
.tablelist > table {margin-top:10px; table-layout:fixed; width:100%; border-collapse:collapse; border:0px; border-top:1px solid #000; border-right:1px solid #c6c6c6}
.tablelist > table th,
.tablelist > table td {border-left:1px solid #c6c6c6; border-bottom:1px solid #c6c6c6}
.tablelist > table th {color:#414141; background:#f6f6f6}
.tablelist > table thead th {height:25px; line-height:24px; white-space:nowrap; overflow:hidden}
.tablelist > table td {padding:0px 3px; height:25px; line-height:140%; text-align:center; white-space:normal !important; word-break:break-all}
.tablelist > table td,
.tablelist > table td > a {color:#666}
.tablelist > table td > a:hover,
.tablelist > table td > a:focus {color:#2aa1ff}
.tablelist > table tbody th {padding-left:10px; text-align:left}
.tablelist > table tbody th + td {padding-left:5px; text-align:left}
.tablelist > table a.btn {padding-right:10px; height:18px; background-position:right 0px}
.tablelist > table a.btn > span {padding-left:10px; height:18px; font-size:11px; color:#005596; line-height:16px; background-position:0px 0px}
.tablelist > table a.btn:hover > span {color:#2aa1ff; text-decoration:none}
.tablelist > table img,
.tablelist > table input,
.tablelist > table select {vertical-align:middle}

/* Align */
	/*#### 모든 테이블의 기본정렬은 가운데 정렬입니다.
		   수정이 필요할 경우 아래의 클래스를 추가 해주세요.
		   이 클래스는 테이블만이 아닌 모든 레이아웃에 적용 됩니다. ####*/
.aln_left {text-align:left !important}
.aln_center {text-align:center !important}
.aln_right {text-align:right !important}

/* Input */			
	/*#### input의 길이는 50~150까지 있으며 추가 필요시 html에서 
		   style로 <input type="text" style="width:96%" /> 식으로 사용하세요. ####*/
input[type=text] {min-width:50px; height:18px; line-height:17px; border:1px solid #aeb0b6}
input[type=text].input_50 {width:50px}
input[type=text].input_60 {width:60px}
input[type=text].input_70 {width:70px}
input[type=text].input_80 {width:80px}
input[type=text].input_90 {width:90px}
input[type=text].input_100 {width:100px}
input[type=text].input_110 {width:110px}
input[type=text].input_120 {width:120px}
input[type=text].input_130 {width:130px}
input[type=text].input_140 {width:140px}
input[type=text].input_150 {width:150px}
/* Text Area */
textarea {border:1px solid #aeb0b6; overflow:auto; resize:none}
table td > textarea {margin:3px 0px; width:99%}

	/* Search Form */
.search_form {position:relative; margin:16px 0px 15px; padding:8px 0px; border:1px solid #c6c6c6; background:#fbfbfc; *zoom:1}
.search_form:after {content:""; display:block; clear:both}
.search_form table,
.search_form .btn_area {vertical-align:middle}
.search_form table {table-layout:fixed; width:85%; border-collapse:collapse; float:left}
*:first-child+html .search_form table {display:inline} /* IE7 Hack 추가 */
.search_form table th,
.search_form table td {padding:2px 0px}
.search_form table th {font-weight:normal}
.search_form .btn_area {position:absolute; top:50%; right:2%; margin-top:-11px; width:13%; height:22px}
*:first-child+html .search_form .btn_area {display:inline} /* IE7 Hack 추가 */
.search_form .btn_area a,
.search_form .btn_area a > span {height:22px}
.search_form .btn_area a {background-position:right -22px}
.search_form .btn_area a > span {line-height:21px; background-position:0px -22px}
.search_form input,
.search_form img,
.search_form select {vertical-align:middle}
.item{position:relative}
.i_label{display:block; position:absolute; top:3px; left:5px; z-index:10}
.i_text{display:block; position:relative; border:1px solid #b7b7b7; border-right-color:#e1e1e1; border-bottom-color:#e1e1e1; background:#fff; height:14px; z-index:1}

	/* paginate */
.paginate {margin-top:10px; width:100%; line-height:150%; text-align:center}
.paginate a {display:inline; margin:0px 3px 0px 3px}
.paginate strong {margin:0px 3px 0px 3px; color:#005596; font-weight:bold}

	/* Header*/
#header {position:relative; min-width:1004px; height:120px; background:url('../images/header/bg_header.gif') 0px 70px repeat-x; z-index:10}
#header .header_wrap {margin:0px auto; width:96%; max-width:1330px; min-width:1004px}
#header h1 {display:inline; margin:10px 0px 0px 10px; float:left}
#header li {float:left}
		/* TNB */
#header ul.tnb {display:inline; margin:43px 10px 0px 0px; width:auto; float:right}
#header ul.tnb li {margin-left:4px; color:#888}
#header ul.tnb li:first-child {margin-left:0px}
#header ul.tnb li:first-child +li {margin-left:11px}
#header ul.tnb em {font-style:normal; color:#005596; font-weight:bold}
#header ul.tnb a,
#header ul.tnb a span {height:18px}
#header ul.tnb a {padding-right:10px; background-position:right 0px}
#header ul.tnb a span {padding-left:10px; line-height:17px; font-size:11px; white-space:nowrap; background-position:0px 0px}
		/* GNB */
			/*#### 대메뉴의 활성화 필요시 li에 con 클래스를 삽입해 주세요. ####*/
#header ul.gnb {clear:both; margin-right:10px; float:right}
#header ul.gnb li {display:inline}
#header ul.gnb li:first-child {margin-left:0px}
#header ul.gnb li a {display:block; margin-top:12px; padding:0px 25px; height:47px; line-height:45px; font-size:16px; text-decoration:none; white-space:nowrap}
#header ul.gnb li.con a,
#header ul.gnb li a:hover,
#header ul.gnb li a:focus {font-weight:bold; color:#fff; background:url('../images/popup/bg_title.gif')}

	/* Container */
#container {margin:-120px auto -73px; width:96%; max-width:1330px; min-width:1004px; min-height:100%; _height:100%}
#container .contents {position:relative; padding:120px 0px 73px}

	/* SNB */
.snb {position:absolute; left:0px; margin-right:-250px; *margin-right:0px; width:250px; *zoom:1}
.snb dl {display:inline; margin:40px 0px 0px 10px; width:200px; float:left}
.snb dl dt {padding:0px 0px 4px 10px; width:190px; height:34px; font-size:20px; color:#005596; background:url('../images/bg_snb.gif') 0px bottom no-repeat}
.snb dl dd {margin-top:20px}
.snb dl dd > ul {width:200px}
.snb dl dd li > a {display:block; padding-left:10px; width:190px; height:24px; line-height:23px; color:#333; text-decoration:none; overflow:hidden}
.snb dl dd li > a:hover,
.snb dl dd li > a:focus,
.snb dl dd li.selected > a {color:#fff; font-weight:bold; background:url('../images/popup/bg_title.gif')}
.snb dl dd li > ul {display:none}
.snb dl dd li.selected > a + ul {display:block; padding:0px 0px 10px 10px; width:170px !important; overflow:hidden}
.snb dl dd li.selected > a + ul li > a {color:#666; background:none}
.snb dl dd li.selected > a + ul li > a:hover,
.snb dl dd li.selected > a + ul li > a:focus,
.snb dl dd li.selected > a + ul li > a:active,
.snb dl dd li.selected > a + ul li.con > a {font-weight:bold; color:#2aa1ff}

	/* Substance */
.substance {position:relative; margin-left:250px; padding:39px 10px 40px 0px; *zoom:1}
.substance:after {content:""; display:block; clear:both}
.substance h2 {padding-bottom:3px; width:100%; height:34px; line-height:28px; font-size:20px; font-weight:bold; border-bottom:1px dotted #7499c4}
.substance h3 {margin-top:25px; padding-left:20px; height:20px; line-height:19px; font-size:16px; font-weight:bold; color:#005596; background:url('../images/icon/bul_h3.gif') 0px center no-repeat}
.substance .page_title {position:absolute; top:57px; right:10px}
.substance .page_title > li {margin-left:10px; padding-left:15px; font-size:11px; color:#888; background:url('../images/bg_pageTitle.gif') 0px center no-repeat; float:left}
.substance .page_title > li > em {font-style:normal; font-size:11px; color:#000}
.substance .page_title > li:first-child {margin-left:0px; background:url('../images/icon/icon_home.gif')0px center no-repeat}

	/* Twin Layout */
.twin_layout {*zoom:1}
.twin_layout:after {content:""; display:block; clear:both}
.twin_layout .search_form {margin-top:10px}
.twin_layout .search_form .btn_area {display:inline-block; margin-right:1%; width:13%}
.twin_layout .left {width:49%; float:left}
.twin_layout .right {width:50%; float:right}
.twin_layout .btn_area {padding-top:15px}
.twin_layout .search_form .btn_area {padding-top:0px}
	
	/* Footer */
#footer {height:73px; color:#8a8a8a; background:#fff}
#footer .footer_wrap {margin:0px auto; width:96%; max-width:1330px; min-width:1004px; height:73px; background:url('../images/footer/bg_footerRight.gif') right 0px no-repeat}
#footer .footer_wrap .footer_contents {width:100%; height:73px; background:url('../images/footer/bg_footerLeft.gif') left 0px no-repeat}
#footer .footer_wrap img,
#footer .footer_wrap address {display:inline; float:left}
#footer .footer_wrap img {margin:23px 0px 0px 73px}
#footer .footer_wrap address {margin:25px 0px 0px 60px; padding-left:27px; width:380px; font-size:11px; color:#888; font-style:normal; border-left:1px solid #e0e0e0}
#footer .footer_wrap address span:first-child + span {margin-left:20px}
#footer .footer_wrap address span:first-child + span + span {color:#bbb}

	/* Tab Area */
.tab_area {position:relative; margin:10px 0px 15px; padding-bottom:30px; z-index:1; *zoom:1}
.tab_area:after {content:""; display:block; clear:both}
.tab_area h4 {position:absolute; top:0px; left:0px; width:150px; height:29px; text-indent:0px !important; border-top:1px solid #d9d9d9; border-left:1px solid #d9d9d9; border-bottom:1px solid #11609d; background:none !important; z-index:20}
.tab_area h4.selected {border-top:1px solid #11609d; border-left:1px solid #11609d}
.tab_area h4 a {position:relative; display:block; padding-left:0px !important; width:150px; height:29px; font-size:12px; text-align:center; line-height:30px; text-decoration:none; background:#f2f2f4}
.tab_area h4 a:active, .tab_area h4 a:focus, .tab_area h4 a:hover, .tab_area h4.selected a {background:#fff}
.tab_area h4.selected a {border-bottom:1px solid #fff}
.tab_area h4#Tab1 {top:0px; left:0px}
.tab_area h4#Tab2 {top:0px; left:151px; border-right:1px solid #d9d9d9}
.tab_area h4#Tab3 {top:0px; left:302px; border-right:1px solid #d9d9d9}
.tab_area h4.selected {border-right:1px solid #11609d !important; z-index:100}
.tab_area div.tabcontent {display:none; position:relative; top:30px; padding:0px 10px; min-height:100px; _height:100px; border-top:1px solid #11609d; *zoom:1}
.tab_area:after,
.tab_area div.tabcontent:after {content:""; display:block; clear:both}
	/* Easy UI Tab */
.easyui-tabs {margin-top:8px; padding-bottom:20px}

	/* Layer Popup */
.layer_pop {display:none; position:fixed; top:0px; left:0px !important; width:100%; height:100%; z-index:200}
.layer_pop .shadow {position:absolute; top:0px; left:0px; width:100%; height:100%; background:#393939; opacity:0.2; filter:alpha(opacity=20); z-index:100}
.layer_pop .pop_body {position:relative; top:50%; margin:0px auto; margin-top:-250px; padding-bottom:15px; width:45%; background:#fff; z-index:200; *zoom:1; opacity:1.0; filter:alpha(opacity=100)}
.layer_pop .pop_body:after {content:""; display:block; clear:both}
.layer_pop .pop_body h4 {height:45px; line-height:43px; text-indent:20px; white-space:nowrap; font-size:16px; color:#fff; background:url('../images/popup/bg_title.gif')}
.layer_pop .pop_body h5 {margin:15px auto 0px; width:96%; text-indent:16px; height:18px; line-height:15px; white-space:nowrap; font-size:12px; color:#444; background:url('../images/popup/bul_pop.gif') 0px 8px no-repeat}
.layer_pop .pop_body .pop_contents {min-height:300px; max-height:300px; background:#fff; overflow-x:hidden; overflow-y:auto; *zoom:1}
.layer_pop .pop_body .pop_contents:after {content:""; display:block; clear:both}
*:first-child+html .layer_pop .pop_body .pop_contents {padding-top:15px}	 /* IE7 Hack 추가 */
.layer_pop .pop_body .tablelist,
.layer_pop .pop_body .btn_area {margin:15px auto 0px; width:96%}
.layer_pop .pop_body .tablelist {margin-top:8px; padding-bottom:0px}
.layer_pop .pop_body .tablelist table th,
.layer_pop .pop_body .tablelist table td {color:#666}
.layer_pop a.close_pop {position:absolute; top:15px; right:15px}

	/* Window Popup */
.pop_wrap {height:100%; color:#888; *zoom:1}
.pop_wrap:after {content:""; display:block; clear:both}
.pop_wrap h1,
.pop_wrap h2 {white-space:nowrap; overflow:hidden}
.pop_wrap h1 {position:relative; padding-left:2%; width:98%; height:45px; line-height:43px; font-size:16px; color:#fff; background:url('../images/popup/bg_title.gif'); z-index:10}
.pop_wrap h2 {margin-top:15px; height:14px; line-height:13px; text-indent:15px; font-size:12px; color:#444; background:url('../images/popup/bul_pop.gif') 0px 6px no-repeat}
.pop_container {margin:-45px auto -40px auto; width:96%; min-height:100%; _height:100%}
.pop_container .pop_contents {padding:45px 0px 40px 0px}
.pop_container .pop_contents .btn_area {}
.pop_container .pop_contents .pop_section {padding:10px 15px}
.pop_wrap .btn_area {margin:0px auto; width:96%; height:40px}

	/* Login */
.login_wrap {position:relative; top:50%; margin-top:-237px; height:474px; *zoom:1}
.login_wrap:after,
.login_wrap .login_container:after,
.login_wrap .login_form:after,
.login_wrap .login_list:after {content:""; display:block; clear:both}
.login_wrap h1 {margin:0px auto; width:1004px; height:75px}
.login_wrap h1 img {display:inline; margin-left:140px}
.login_wrap .login_container {height:337px; background:#ecefed; *zoom:1}
.login_wrap .login_form {margin:0px auto; width:1004px; height:337px; background:#fff url('../images/login/bg_loginLeft.gif') no-repeat; *zoom:1}
.login_wrap .login_list {position:relative; width:1004px; height:337px; background:url('../images/login/bg_loginRight.jpg') right 0px no-repeat; *zoom:1}
.login_wrap .login_list h2 {position:absolute; top:151px; left:476px}
.login_wrap .login_list h3 {display:inline; margin:30px 0px 0px 154px; padding-bottom:20px; width:230px; height:40px; line-height:40px; font:40px gulim; color:#444; letter-spacing:-3px; border-bottom:1px solid #dfdfdf; float:left}
.login_wrap .login_list form {clear:both}
.login_wrap .login_list ul,
.login_wrap .login_list li {width:230px; float:left}
.login_wrap .login_list ul {clear:both; margin:33px 0px 0px 154px; float:left}
.login_wrap .login_list ul.regist_infomation {margin-top:32px}
.login_wrap .login_list ul.regist_infomation li {margin-top:7px}
.login_wrap .login_list ul.regist_infomation li:first-child {margin-top:0px}
.login_wrap .login_list ul.regist_infomation li:first-child + li + li {margin-top:16px}
.login_wrap .login_list ul.regist_infomation label {display:inline-block; width:60px; height:25px; line-height:24px; color:#444; float:left}
.login_wrap .login_list ul.regist_infomation input[type=text] {width:166px; height:23px; line-height:22px}
.login_wrap .login_list ul.regist_infomation button[type=submit] {width:230px; height:48px; line-height:47px; text-align:center; font-size:18px; color:#000; cursor:pointer; background:url('../images/btn/bg_btn.gif') no-repeat; background-position:0px -78px}
.login_wrap .login_list ul.regist_infomation button[type=submit]:hover,
.login_wrap .login_list ul.regist_infomation button[type=submit]:focus {color:#fff; background-position:0px -130px}
.login_wrap .login_list ul.etc_option {margin-top:10px}
.login_wrap .login_list ul.etc_option li:first-child + li {color:#4d9ff0}
.login_wrap .footer {margin:0px auto; width:1004px; height:60px; background:url('../images/login/bg_footer.gif') 104px 0px no-repeat}
.login_wrap .footer p {height:60px; line-height:59px; text-indent:145px; font-size:11px; color:#bbb}
