@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Noto+Sans:400,700);

/* common */
* { margin:0; padding:0; }
html, body, button, div, p, ul, li, table, th, td, textarea, input, span, form, h1, h2, h3, h4, h5, h6, dt, dl, dd, em { color:#666; font-family:Noto Sans,Helvetica,AppleGothic,Sans-serif,Dotum,'돋움'; }
ul, ol, dl, dd, dt, li { list-style:none; }
html { width:100%; height:100%; }
body { position:relative; height:100%; background:url(/images/bg_line_ccc180.png) repeat-y; }
body.popup { overflow:hidden; height:100%; background:none; }
table { width:100%; table-layout:fixed; }

.h10 { height:10px; }
.h20 { height:20px; }
.h30 { height:30px; }
.h40 { height:40px; }
.h50 { height:50px; }
.w30 { width:30px; }
.w40 { width:40px; }
.w50 { width:50px; }
.w60 { width:60px; }
.w70 { width:70px; }
.w80 { width:80px; }
.w100 { width:100px; }
.w200 { width:200px; }
.w250 { width:250px; }
.w300 { width:300px; }
.w400 { width:400px; }
.w450 { width:450px; }
.w500 { width:500px; }
.w600 { width:600px; }
.w700 { width:700px; }
.w800 { width:800px; }
.full { width:99%; }
/* font */
.fp { color:#39f; } 
.fb { font-weight:bold; }
select.sel_list { width:180px; height:240px; }
input[type=file].upload { height:25px; border:1px solid #ccc; font-size:12px; }

/* gnb_wrap */
.gnb_wrap { z-index:3; position:relative; width:100%; padding:5px 0px; background-color:#000; display:inline-block; min-width:1200px; }
.gnb_wrap .logo { float:left; width:180px; text-align:center; }
.gnb_wrap .gnb { position:absolute; left:190px; bottom:7px; color:#fff; letter-spacing:-1px; font-weight:bold; }
.gnb_wrap .gnb a,
.gnb_wrap .gnb span { color:#ccc; font-size:14px; text-decoration:none; margin-right:20px; cursor:pointer; }
.gnb_wrap .gnb a.on,
.gnb_wrap .gnb span.on { color:#fff; }
.gnb_wrap .util { text-align:right; position:absolute; left:-10px; top:5px; color:#fff; font-size:11px; line-height:16px; width:1200px; letter-spacing:-0.5px; }
.gnb_wrap .util a { color:#fff; text-decoration:none; }


/* lnb_wrap */
.lnb_wrap { position:absolute; top:0px; left:0px; width:179px; height:100%; background-color:#fff; overflow:hidden; }
.lnb_wrap .lnb { margin-top:50px; }
.lnb_wrap .lnb h3 { font-size:13px; text-decoration:none; background:1px solid #eee; border-top:1px solid #eee; border-bottom:1px solid #eee; padding:10px 0px 8px 10px; background-color:#f0f0f0; }
.lnb_wrap .lnb h3.on { background-color:#e0e0f0; }
.lnb_wrap .lnb h3 a { color:#666; font-size:12px; letter-spacing:-0.5px; font-weight:bold; }
.lnb_wrap .lnb ul li { padding:3px 0px 3px 0px; }
.lnb_wrap .lnb ul li.on { background-color:#f8f8ff; font-weight:bold; }
.lnb_wrap .lnb ul li a { display:inline-block; margin:9px 0px 7px 0px; color:#666; padding-left:25px; font-size:11px; text-decoration:none; }


/* JqueryUI */
div.ui-datepicker { font-size:12px; }


/* 본문 */
.wrap { z-index:1; margin:10px 10px 10px 190px; text-align:left; width:1000px; }
.wrap .top_info { position:relative; height:33px; margin-top:30px; }
.wrap .top_info .tit { float:left; font-size:18px; font-weight:bold; color:#010101; letter-spacing:-1px; padding:5px 0 0 5px; }
.wrap .top_info .nav { float:right; font-size:18px; font-weight:bold; color:#010101; letter-spacing:-1px; padding:5px 0 0 5px; }
.wrap .top_info ul { position:absolute; right:0; }
.wrap .top_info ul li { float:left; margin:0 2px; }
.wrap .top_info input { height:23px; border:1px solid #ccc; font-size:12px; }
.wrap .top_info select { height:25px; border:1px solid #ccc; font-size:12px; }

.wrap .btn { position:relative; height:30px; }
.wrap .btn ul li { float:left; margin:0 2px; }
.wrap .btn ul.left { position:absolute; left:0; }
.wrap .btn ul.right { position:absolute; right:0; }

.wrap .info { padding:8px 15px 0 15px; background-color:#eee; border-top:1px solid #ddd; height:25px; margin:20px 0 50px 0; }
.wrap .path { float:left; font-size:11px; }
.wrap .time { float:right; font-size:11px; }

.wrap_pop { margin:10px; text-align:left; }
.wrap_pop .top_info { position:relative; height:33px; }
.wrap_pop .top_info .tit { float:left; font-size:18px; font-weight:bold; color:#010101; letter-spacing:-1px; padding:5px 0 0 5px; }
.wrap_pop .top_info ul { position:absolute; right:0; }
.wrap_pop .top_info ul li { float:left; margin:0 2px; }
.wrap_pop .top_info input { height:23px; border:1px solid #ccc; font-size:12px; }
.wrap_pop .top_info select { height:25px; border:1px solid #ccc; font-size:12px; }

.wrap_pop .btn { position:relative; height:30px; }
.wrap_pop .btn ul li { float:left; margin:0 2px; }
.wrap_pop .btn ul.left { position:absolute; left:0; }
.wrap_pop .btn ul.right { position:absolute; right:0; }

/* 집계 */
.top_info_box { padding:10px; background-color:#fff; border-radius:5px 5px 5px 5px; border:2px solid #666; margin-bottom:10px; }
.top_info_box ul { width:100%; display:table; }
.top_info_box ul li { display:table-cell; padding:5px 0px 3px 10px; color:#999; font-size:12px; font-weight:bold; border-left:3px solid #ccc; letter-spacing:-0.5px; }
.top_info_box ul li.on { cursor:pointer; }
.top_info_box ul li span { color:#000; font-size:20px; font-weight:bold; }
.top_info_box ul li:hover { color:#ddd; background-color:#010101; }
.top_info_box ul li:hover span { color:#fff; }


/* 검색 */
.search_box { padding:10px; background-color:#ddd; border-radius:5px 5px 5px 5px; margin-bottom:10px; clear:both; }
.search_box input { height:23px; border:1px solid #ccc; font-size:12px; }
.search_box input.date { text-align:center; width:80px; }
.search_box select { height:25px; border:1px solid #ccc; font-size:12px; }
.search_box ul { width:100%; display:table; }
.search_box ul li { display:table-cell; width:50%; height:27px; color:#666; padding-left:20px; }
.search_box ul li span { width:80px; display:inline-block; font-size:12px; font-weight:bold; letter-spacing:-0.5px; }
.search_box .btn { margin-top:10px; border-top:1px solid #ccc; padding-top:10px; text-align:center; }

/* list */
table.tb_list { width:100%; table-layout:fixed; border-collapse:collapse; margin-bottom:10px; border-top:3px solid #010101; }
table.tb_list caption { display:none; }
table.tb_list thead { background:url(/images/bg_line.gif) 0 -700px repeat-x; }
table.tb_list th { text-align:center; font-size:12px; font-weight:normal; letter-spacing:-0.5px; height:30px; background-image:url(/images/bg_line.gif), url(/images/bg_line.gif); background-position:0 -750px, 0 -700px; background-repeat:no-repeat, repeat-x; }
table.tb_list th:first-child { background:url(/images/bg_line.gif) 0 -700px repeat-x; }
table.tb_list tr td { color:#888; height:30px; text-align:center; font-size:12px; font-weight:normal; letter-spacing:-0.5px; border-bottom:solid 1px #eee; }
table.tb_list tr.on td { background-color:#ddd; }
table.tb_list tr td.al { padding-left:5px; text-align:left; }
table.tb_list tr td.date { letter-spacing:0px; }
table.tb_list tbody tr:hover { background-color:#f9f9f9; }
table.tb_list tbody tr:last-child td { border-bottom:1px solid #999; }
table a { color:#444; text-decoration:none; }

/* edit */
table.tb_edit { width:100%; table-layout:fixed; border-collapse:collapse; margin-bottom:10px; border-top:3px solid #010101; }
table.tb_edit.disabled { background-color : #f0f0f0; }
table.tb_edit caption { display:none; }
table.tb_edit th { text-align:left; font-size:12px; font-weight:bold; letter-spacing:-0.5px; padding-left:20px; }
table.tb_edit th.chk { background:url(/images/icon_black_check.png) 3px no-repeat; }
table.tb_edit td { position:relative; text-align:left; color:#888; font-size:12px; font-weight:normal; letter-spacing:-0.5px; padding:5px; height:25px; }
table.tb_edit td li { float:left; }
table.tb_edit td li input[type=checkbox] { margin:-3px 3px 0px 0px; }
table.tb_edit td .help { position:absolute; color:#999; font-weight:normal; right:5px; }
table.tb_edit tbody th, table.tb_edit tbody td { border-bottom:solid 1px #eee; }
table.tb_edit.disabled tbody th, table.tb_edit tbody td { border-bottom:solid 1px #ddd; }
table.tb_edit tbody tr:last-child th, table.tb_edit tbody tr:last-child td { border-bottom:1px solid #999; }
table a { color:#444; text-decoration:none; }
table.tb_edit input { height:23px; border:1px solid #ccc; font-size:12px; }
table.tb_edit input.hold { background-color:#eee; }
table.tb_edit input.date { text-align:center; width:100px; padding-right:20px; background:url(/images/icon_calendar.png) 83px  no-repeat; }
table.tb_edit select { height:25px; border:1px solid #ccc; font-size:12px; padding:3px 10px 3px 10px; }
table.tb_edit select.multiple { height:100px; }
table.tb_edit textarea { width:99%; height:100px; border:1px solid #ccc; font-size:12px; }
table.tb_edit img { max-width: 100%; }

table.tb_edit td div.pop_select { float:left; margin-right:10px; }
table.tb_edit td div.pop_select #sel_list_old { width:180px; height:240px; }
table.tb_edit td div.pop_select #sel_list_new { width:180px; height:240px; }
table.tb_edit td .item { display:inline-block; width:20px; height:20px; border:1px solid #000; margin:0px 2px 2px 0px; cursor:pointer; }

table.tb_edit td #PREVIEW_BOX { margin-top:5px; border:1px solid #ccc; height:250px; display:none; }
table.tb_edit td #IMG_LIST { margin-top:5px; border:1px solid #ccc; }
table.tb_edit td #IMG_LIST .data_img { display:inline-block; position:relative; padding:4px; text-align:center; margin:6px 0 0 6px; border:1px solid #ccc; }
table.tb_edit td #IMG_LIST .data_img img { margin-bottom:4px; }
table.tb_edit td #IMG_LIST .data_img .data_tit { position:absolute; top:-1px; left:-1px; color:#fff; background-color:#000; font-weight:normal; padding:1px 5px 3px 5px; }
table.tb_edit td #IMG_LIST .data_img.on { background-color:#999; border:1px solid #000; }

/* portfolio */
ul.portfolio { width:100%; position:relative; display:inline-block; border-bottom:1px solid #999; margin-bottom:10px; }
ul.portfolio li { position:relative; border:1px solid #ddd; background-color:#fff; width:240px; height:230px; float:left; margin-right:10px; margin-bottom:10px; }
ul.portfolio li.on { border:1px solid #ddd; background-color:#ddd; }
ul.portfolio li:hover { border:1px solid #D42224; }
ul.portfolio li:nth-child(4n+0) { margin-right:0px; }
ul.portfolio li img { margin:10px 0px 0px 10px; width:220px; height:144px; border-bottom:1px solid #ccc; }
ul.portfolio li h4 { margin:10px 0px 5px 10px; font-size:13px; }
ul.portfolio li h4 a { color:#666; letter-spacing:-0.5px; text-decoration:none; }
ul.portfolio li span.project_name { margin-left:10px; width:170px; display:inline-block; text-overflow:ellipsis; overflow:hidden; font-size:12px; letter-spacing:-0.5px; color:#555; text-decoration:none; }
ul.portfolio li span.project_info { margin-left:10px; bottom:0px; width:170px; display:inline-block; text-overflow:ellipsis; overflow:hidden; font-size:11px; letter-spacing:-0.5px; color:#888; text-decoration:none; }
ul.portfolio li span.code1 { position:absolute; bottom:10px; left:10px; font-size:11px; letter-spacing:-0.5px; color:#999; }
ul.portfolio li span.code2 { position:absolute; bottom:10px; right:10px; font-size:11px; letter-spacing:-0.5px; color:#999; }

/* gall */
ul.gall { width:100%; position:relative; display:inline-block; border-bottom:1px solid #999; margin-bottom:10px; }
ul.gall li { position:relative; border:1px solid #ddd; background-color:#fff; width:190px; height:200px; float:left; margin-right:10px; margin-bottom:10px; }
ul.gall li.on { border:1px solid #ddd; background-color:#ddd; }
ul.gall li:hover { border:1px solid #D42224; }
ul.gall li:nth-child(5n+0) { margin-right:0px; }
ul.gall li img { margin:10px 0px 0px 10px; width:100px; height:100px; }
ul.gall li h4 { margin:10px 0px 5px 10px; font-size:13px; }
ul.gall li h4 a { color:#666; letter-spacing:-0.5px; text-decoration:none; }
ul.gall li span.url a { margin-left:10px; width:170px; display:inline-block; text-overflow:ellipsis; overflow:hidden; font-size:11px; letter-spacing:-0.5px; color:#999; text-decoration:none; }
ul.gall li span.code1 { position:absolute; bottom:10px; left:10px; font-size:11px; letter-spacing:-0.5px; color:#999; }
ul.gall li span.code2 { position:absolute; bottom:10px; right:10px; font-size:11px; letter-spacing:-0.5px; color:#999; }
ul.gall li div.color { position:absolute; top:10px; right:10px; }
ul.gall li div.color .item { width:16px; height:16px; margin-bottom:2px; }

a.mini { color:#39f; font-size:11px; letter-spacing:-0.5px; text-decoration:none; }

/* calender */
table.tb_list.calender { margin-bottom:0; }
table.tb_list.calender caption a { color:#fff; }

ul.calender { width:1000px; display:table; margin-bottom:10px; border-bottom:1px solid #999; }
ul.calender li { display:table-cell; border-top:1px solid #ddd; border-right:1px solid #f5f5f5; width:122px; height:100px; float:left; padding:10px; font-size:12px; color:#999; line-height:16px; }
ul.calender li span { font-size:13px; font-weight:bold; }
ul.calender li a { display:inline-block; width:100%; text-decoration:none; letter-spacing:-0.5px; color:#555; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
ul.calender li a span { text-decoration:none; font-weight:normal; font-size:11px; letter-spacing:-0.5px; color:#333; }

ul.calender li:nth-child(-n+7) { border-top:0; }
ul.calender li:nth-child(7n) { background-color:#f9f9ff; border-right:0; }
ul.calender li:nth-child(7n) span { color:#36f; }
ul.calender li:nth-child(7n+1) { background-color:#fff9f9; clear:both; }
ul.calender li:nth-child(7n+1) span { color:#f63; }

/* page */
.page { text-align:center; margin-bottom:10px; }
.page a { color:#999; font-size:12px; display:inline-block; width:25px; height:20px; padding-top:5px; border:1px solid #fff; text-decoration:none; margin:0px; }
.page a:hover, .page .on { border:1px solid #999; color:#333;  }
.page .back, .page .back:hover, .page .next, .page .next:hover { width:35px; font-size:11px; font-weight:bold; letter-spacing:-0.5px; border:1px solid #fff; }


/* 버튼 */
.btn_list {
	color:#333;
	font-size:11px;
	text-decoration:none;
	letter-spacing:-0.5px;

	display:inline-block;
	height:20px;
	padding:1px 5px 0 5px;
	background-color:#ddd;
	border-radius:2px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	-ms-border-radius:2px;
	-o-border-radius:2px;
}
.btn_txt {
	color:#eee;
	font-size: 12px;
	text-shadow:0px 0px 3px #1e272f;
	text-decoration:none;
	letter-spacing:-0.5px;

	display:inline-block;
	height:22px;
	padding:1px 8px 0px 5px;
	background-color:#010101;
	border:1px solid #1e272f;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-ms-border-radius:3px;
	-o-border-radius:3px;
}
.btn_txt.on span {  }
.btn_txt.off { background-color : #aaa; }
.btn_txt span {
	position:relative;
	top:3px;
	display:inline-block;
	margin-right:3px;
	width:14px;
	height:14px;
	background-image:url(/images/icon_default_group_white.png);
	background-repeat:no-repeat;
}

.btn_txt span.none { width:0px; }

/* ROW1 */
.btn_txt span.glass { background-position:0px 0px; }
.btn_txt span.music { background-position:-24px 0px; }
.btn_txt span.search { background-position:-48px 0px; }
.btn_txt span.mail { background-position:-72px 0px; }
.btn_txt span.heart { background-position:-96px 0px; }
.btn_txt span.star1 { background-position:-120px 0px; }
.btn_txt span.star2 { background-position:-144px 0px; }
.btn_txt span.human { background-position:-168px 0px; }
.btn_txt span.film { background-position:-192px 0px; }
.btn_txt span.t2x2 { background-position:-216px 0px; }
.btn_txt span.t3x3 { background-position:-240px 0px; }
.btn_txt span.t2x3 { background-position:-264px 0px; }
.btn_txt span.check { background-position:-288px 0px; }
.btn_txt span.cancel { background-position:-312px 0px; }
.btn_txt span.sizeup { background-position:-336px 0px; }
.btn_txt span.sizedn { background-position:-360px 0px; }
.btn_txt span.power { background-position:-384px 0px; }
.btn_txt span.wifi { background-position:-408px 0px; }
.btn_txt span.setup { background-position:-432px 0px; }
.btn_txt span.trash { background-position:-456px 0px; }

/* ROW2 */
.btn_txt span.house { background-position:0px -24px; }
.btn_txt span.new { background-position:-24px -24px; }
.btn_txt span.clock { background-position:-48px -24px; }
.btn_txt span.way { background-position:-72px -24px; }
.btn_txt span.download { background-position:-96px -24px; }
.btn_txt span.arrowdn { background-position:-120px -24px; }
.btn_txt span.arrowup { background-position:-144px -24px; }
.btn_txt span.folder { background-position:-168px -24px; }
.btn_txt span.play { background-position:-192px -24px; }
.btn_txt span.reload { background-position:-216px -24px; }
.btn_txt span.refresh { background-position:-240px -24px; }
.btn_txt span.list { background-position:-264px -24px; }
.btn_txt span.lock { background-position:-288px -24px; }
.btn_txt span.flag { background-position:-312px -24px; }
.btn_txt span.hphone { background-position:-336px -24px; }
.btn_txt span.mute { background-position:-360px -24px; }
.btn_txt span.voldn { background-position:-384px -24px; }
.btn_txt span.volup { background-position:-408px -24px; }
.btn_txt span.qrcode { background-position:-432px -24px; }
.btn_txt span.barcode { background-position:-456px -24px; }

/* ROW3 */
.btn_txt span.label { background-position:0px -48px; }

/* ROW4 */
.btn_txt span.write { background-position:0px -72px; }
.btn_txt span.arrowlt { background-position:-432px -72px; }
.btn_txt span.arrowrt { background-position:-456px -72px; }

/* ROW5 */
.btn_txt span.plus { background-position:0px -96px; }
.btn_txt span.plus2 { background-position:-408px -96px; }

/* ROW6 */
.btn_txt span.point { background-position:0px -120px; }

/* ROW7 */
.btn_txt span.point2 { background-position:0px -144px; }

/* input_chk */
.input_chk { position:relative; padding:2px 0 2px 15px; }
.input_chk input[type=radio] { position:absolute; top:1px; left:0; }
.input_chk input[type=checkbox] { position:absolute; top:1px; left:0; }
.input_chk label { color:#000; font-weight:bold; }
	
	body.contents.category.list	input.contentsGroup,
	body.contents.category.list	input.categoryName,
	body.contents.category.list	input.categorySeqNo
	{
		width		: 90%;
	}
	
	body.contents.category.list	.addButtonBox
	{
		text-align	: center;
	}

	.splitter
	{
		margin		: 0px 10px 0px 10px;
	}
	
	.adminLogo
	{
		padding-left:26px; background:url(/images/logo_icon_32.png) left center / 16px 16px no-repeat;
	}
	
	input	~ .comment 
	{
		margin-top	: 5px;
	}
	
	/********************	overlay		********************/
	.fullOverlay
	{
		position	: fixed;
		width		: 100%;
		height		: 100%;
		top			: 0px;
		left		: 0px;
		z-index		: 200;
		background-color	: rgba(0,0,0,0.5);
	}
	.fullOverlay.close
	{
		display		: none;
	}
	.fullOverlay	> .box
	{
		text-align	: center;
		width		: 100%;
		height		: 100%;
	}
	.fullOverlay	> .box:before
	{
		content		: "";
		display		: inline-block;
		height		: 100%;
		vertical-align	: middle;
	}
	.icon.loading
	{
		display		: inline-block;
		vertical-align	: middle;
		background-size		: cover;
		background-position	: center;
		background-repeat	: no-repeat;
		width	: 40px;
		height	: 40px;	
		background-image	: url(/images/icon.loading.630.gif);
	}