@charset "UTF-8";


/* default.css - Type Selector Definition */
body { margin:0;padding:0; font-size:.75em;}

img { border:none; }
label { cursor:pointer; }
form { margin:0; padding:0; }

/* Special Class Selector */
.fr { float:right; }
.fl { float:left; }
.clear { clear:both; }
.fwB { font-weight:bold;}
.tCenter { text-align:center; }
.tRight { text-align:right; }
.tLeft { text-align:left; }
.gap1 { margin-top:.8em; }
.nowrap { white-space:nowrap; }

.iePngFix { behavior:url("./common/js/iePngFix.htc"); } 
.zbxe_info { vertical-align:middle; behavior:url("./common/js/iePngFix.htc"); }

/* Input Style Definition */
.inputTypeText { border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; height:1.4em; padding:.2em 0 0 .3em; background:#ffffff; font-size:1em; _font-size:9pt; }
*:first-child+html .inputTypeText { font-size:9pt; }
.inputTypeText:hover,
.inputTypeText:focus { background:#f4f4f4; }
.inputTypeTextArea { border:1px solid !important; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6 !important; background:#ffffff; font-size:1em; _font-size:9pt; height:100px;}
*:first-child+html .inputTypeTextArea { font-size:9pt; }

.w40 { width:40px; }
.w60 { width:60px; }
.w70 { width:70px; }
.w80 { width:80px; }
.w90 { width:90px; }
.w100 { width:100px; }
.w110 { width:110px; }
.w120 { width:120px; }
.w130 { width:130px; }
.w140 { width:140px; }
.w150 { width:150px; }
.w160 { width:160px; }
.w170 { width:170px; }
.w180 { width:180px; }
.w190 { width:190px; }
.w200 { width:200px; }
.w210 { width:210px; }
.w220 { width:220px; }
.w230 { width:230px; }
.w240 { width:240px; }
.w250 { width:250px; }
.w260 { width:260px; }
.w270 { width:270px; }
.w280 { width:280px; }
.w290 { width:290px; }
.w300 { width:300px; }
.w400 { width:400px; }

/* editor style */
a.bold { font-weight:bold; }

.editor_blue_text { color: #145ff9 !important; text-decoration:underline !important; }
.editor_blue_text a { color: #145ff9 !important; text-decoration:underline !important; }
.editor_red_text { color: #f42126 !important; text-decoration:underline !important; }
.editor_red_text a { color: #f42126 !important; text-decoration:underline !important; }
.editor_yellow_text { color: #c9bd00 !important; text-decoration:underline !important; }
.editor_yellow_text a { color: #c9bd00 !important; text-decoration:underline !important; }
.editor_green_text { color: #08830B !important; text-decoration:underline !important; }
.editor_green_text a { color: #08830B !important; text-decoration:underline !important; }

.folder_opener { display: block; }
.folder_closer { display: none; }
.folder_area { display: none; }

.xe_content { line-height:1.6; overflow:hidden; }

.zbxe_widget_output { background:url("/xe/common/tpl/images/widget_text.gif") no-repeat center bottom; display:block;}

/* xe layer */
#waitingforserverresponse { border:2px solid #444444; font-weight:bold; color:#444444; padding: 7px 5px 5px 25px; background:#FFFFFF url("/xe/common/tpl/images/loading.gif") no-repeat 5px 5px; top:40px; left:40px; position:absolute; z-index:100; visibility:hidden; }

#popup_menu_area{ position:absolute; background:#fff; border:2px solid #eee; -moz-border-radius:5px; -webkit-border-radius:5px; margin:0; padding:0;}
#popup_menu_area *{ margin:0; padding:0; list-style:none; font-size:12px; line-height:normal;}
#popup_menu_area ul{ border:1px solid #ddd; -moz-border-radius:5px; -webkit-border-radius:5px; padding:10px 10px 5px 10px;}
#popup_menu_area li{ padding:2px 0 2px 20px; background-repeat:no-repeat; background-position:left center; margin-bottom:3px; white-space:nowrap;}
#popup_menu_area li a{ text-decoration:none; color:#000;}
#popup_menu_area li a:hover,
#popup_menu_area li a:active,
#popup_menu_area li a:focus{ font-weight:bold; letter-spacing:-1px;}

/* xe faceoff */
.faceOffManager { position:fixed; _position:absolute; right:3px; top:3px;  height:23px; }
 
/* NHN > UIT Center > Open UI Platform Team > Jeong Chan Myeong(dece24@nhncorp.com) */

/* Anchor Button */
a.button,
a.button span { position:relative; display:inline-block; text-decoration:none !important; background:url("/xe/common/tpl/images/buttonWhite.gif") no-repeat; cursor:pointer; white-space:nowrap; vertical-align:middle;}
a.button { padding:0; background-position:left top; overflow:visible;}
a.button span { left:2px; padding:6px 10px 5px 8px; color:#000; font:12px/12px Sans-serif; background-position:right top; *vertical-align:top;}
/* Large Size */
a.button.large { background-position:left -30px; }
a.button.large span { padding:7px 10px 6px 8px; font:16px/16px Sans-serif; background-position:right -30px;}
/* xLarge Size */
a.button.xLarge { background-position:left -65px; }
a.button.xLarge span { padding:8px 10px 7px 8px; font:20px/20px Sans-serif; background-position:right -65px;}
/* Small Size */
a.button.small { background-position:left -107px; }
a.button.small span { padding:4px 6px 3px 4px; font:11px/11px Sans-serif; background-position:right -107px;}

/* Control Button + Submit Button */
span.button,
span.button button,
span.button input { position:relative; margin:0; display:inline-block; border:0; font:12px Sans-serif; white-space:nowrap; background:url("/xe/common/tpl/images/buttonWhite.gif") no-repeat; vertical-align:middle;}
span.button { padding:0; background-position:left top;}
span.button button,
span.button input { height:23px; left:2px; *vertical-align:top; padding:0 10px 0 8px; line-height:24px; background-position:right top; cursor:pointer; *overflow:visible;}
/* Large Size */
span.button.large { background-position:left -30px;}
span.button.large button,
span.button.large input { height:30px; padding:0 10px 0 8px; font:16px/30px Sans-serif; background-position:right -30px;}
/* xLarge Size */
span.button.xLarge { background-position:left -65px;}
span.button.xLarge button,
span.button.xLarge input { height:35px; padding:0 10px 0 8px; font:20px/36px Sans-serif; background-position:right -65px;}
/* Small Size */
span.button.small { background-position:left -107px;}
span.button.small button,
span.button.small input { height:18px; padding:0 6px 0 4px; font:11px/18px Sans-serif; background-position:right -107px;}

/* Strong Button */
a.button.strong *,
span.button.strong * { font-weight:bold !important;}

/* Icon Add */
a.button .icon { position:relative; border:0; vertical-align:middle;}
span.button .icon { position:relative; left:10px; margin-right:8px; vertical-align:middle;}

/* Color Preset */
a.button.green,
a.button.green span,
span.button.green,
span.button.green button,
span.button.green input { background-image:url("/xe/common/tpl/images/buttonGreen.gif"); color:#fff;}
a.button.black,
a.button.black span,
span.button.black,
span.button.black button,
span.button.black input { background-image:url("/xe/common/tpl/images/buttonBlack.gif"); color:#fff;}
a.button.red,
a.button.red span,
span.button.red,
span.button.red button,
span.button.red input { background-image:url("/xe/common/tpl/images/buttonRed.gif"); color:#fff;}
a.button.blue,
a.button.blue span,
span.button.blue,
span.button.blue button,
span.button.blue input { background-image:url("/xe/common/tpl/images/buttonBlue.gif"); color:#fff;}

/* Offset Debug */
a.button,
span.button{ margin-right:2px;}

/* Button Set */
.buttonSet{ width:16px; height:16px; background-image:url("/xe/common/tpl/images/buttonSet.gif"); background-repeat:no-repeat; border:0; background-color:transparent; vertical-align:middle; display:inline-block; text-decoration:none;}
.buttonSet span{ z-index:-1; font-size:0; line-height:0; visibility:hidden;}
.buttonSet.buttonUp{ background-position:0 0;}
.buttonSet.buttonDown{ background-position:0 -16px;}
.buttonSet.buttonLeft{ background-position:0 -32px;}
.buttonSet.buttonRight{ background-position:0 -48px;}
.buttonSet.buttonInfo{ background-position:0 -64px;}
.buttonSet.buttonCopy{ background-position:0 -80px;}
.buttonSet.buttonSetting{ background-position:0 -96px;}
.buttonSet.buttonActive{ background-position:0 -112px;}
.buttonSet.buttonDisable{ background-position:0 -128px;}
.buttonSet.buttonDelete{ background-position:0 -144px;}
.buttonSet.buttonHomepage{ background-position:0 -160px;}
.buttonSet.buttonBlog{ background-position:0 -176px;}
.buttonSet.buttonCalendar{ background-position:0 -192px;}
.buttonSet.buttonLayoutEditor{ background-position:0 -208px;}
.buttonSet.buttonAddWidget{ background-position:0 -224px;}
.buttonSet.buttonAddContent{ background-position:0 -240px;}

/* NHN | dece24@nhncorp.com */
#loginAccess{ position:relative; width:384px; border:2px solid #757575; margin:30px auto; padding:20px 0 0 0; background:#fff; font-size:12px; font-family:Tahoma; line-height:normal;}
#loginAccess form{ margin:0; padding:0;}
#loginAccess fieldset{ border:0; margin:0; padding:0;}
#loginAccess h1{ margin:0 28px 20px 28px; font-size:12px; color:#e77161;}
#loginAccess ul{ margin:0; padding:0; list-style:none;}
#loginAccess .mLogin{ display:none;}
#loginAccess .idpw{ margin:0 28px 20px 28px;}
#loginAccess .oid{ margin:0 28px 20px 28px;}
#loginAccess .idpw li{ margin:0 0 5px 0;}
#loginAccess .inputText{ font-size:12px; height:22px; color:#767676; font-weight:bold; border:1px solid #b7b7b7; border-right-color:#e1e1e1; border-bottom-color:#e1e1e1;}
#loginAccess .idpw .inputText{ width:316px; padding:8px 0 0 10px;}
#loginAccess .oid .inputText{ width:291px; padding:8px 0 0 35px; background:url("/xe/modules/message/skins/default/images/openid_login_bg.gif") no-repeat 10px center;}
#loginAccess .inputCheck{ width:13px; height:13px; margin:0; padding:0; vertical-align:middle;}
#loginAccess label{ vertical-align:middle;}
#loginAccess #warning{ display:none; margin:0 0 20px 0;}
#loginAccess #warning.open{ display:block;}
#loginAccess #warning p{ margin:0;}
#loginAccess .buttonArea{ position:relative; margin:0 28px; padding:0; color:#767676; *zoom:1;}
#loginAccess .buttonArea .keeping{ position:relative; margin:0 0 20px 0; height:32px; line-height:32px;}
#loginAccess #gLogin .buttonArea .buttonAccount{ position:absolute; top:0; right:0;}
#loginAccess #oLogin .buttonArea{ text-align:center; margin-bottom:20px;}
#loginAccess .buttonAccount,
#loginAccess .buttonAccount a,
#loginAccess .buttonAccount input{ position:relative; display:inline-block; margin:0; padding:0; overflow:visible; height:32px; line-height:32px; font-size:12px; font-weight:bold; color:#fff; vertical-align:middle; cursor:pointer; border:0; text-decoration:none !important; background:transparent url("/xe/modules/message/skins/default/images/buttonAction.gif") no-repeat;}
#loginAccess .buttonAccount{ margin:0 4px 0 0; background-position:left top;}
#loginAccess .buttonAccount a,
#loginAccess .buttonAccount input{ left:4px; background-position:right top; *vertical-align:top; padding:0 24px 0 36px;}
#loginAccess .help{ position:relative; padding:15px 0; background:#fafafa; border-top:1px solid #d9d9d9; text-align:center;}
#loginAccess .help li{ display:inline; border-left:1px solid #c3c3c3; padding:0 0 0 10px; margin:0 6px 0 0; line-height:1;}
#loginAccess .help li.first{ border:0; padding:0;}
#loginAccess .help a{ text-decoration:none; color:#333;}
#loginAccess .help a:hover,
#loginAccess .help a:active,
#loginAccess .help a:focus{ text-decoration:underline;}
#loginAccess .logOut{ text-align:left; margin:0 28px; padding:0 0 20px 0;}
.gLogin #gLogin,
.oLogin #oLogin{ display:block;}

/* 
공통적으로 적용되는 스타일 
상단의 1차메뉴와 우측 서브메뉴의 설정은 각각의 CSS파일에서 설정
*/

body  {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	background-color: #f9f9f8;
	background-image: url("/xe/layouts/final_tj/images/bg-repeat.png");
	background-repeat: repeat-x;
	background-position: top center;
	font-family: "맑은 고딕", "verdana", "tahoma", "돋움";
}

#background {
	background:url("/xe/layouts/final_tj/images/bg-top.png") top center no-repeat;
	width:100%;
}

.thrColFixHdr #container {
	width: 658px;
	text-align: left; /* this overrides the text-align: center on the body element. */
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
} 
.thrColFixHdr #header {
	text-align: center;
	width: 654px; /* padding keeps the content of the div away from the edges */
	height: 168px;
} 



/* 로고 타이틀, 이미지 위치 */
.thrColFixHdr #logo {
	z-index: 100;
	position:absolute;
	width:125px;
	height:125px;
	margin-bottom:10px;
	overflow: hidden;
	top: 120px;
}

.thrColFixHdr #menu {
	background: #262626;
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding-top: 0;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 100px;
	padding-bottom: 0px;
	height: 50px;
} 
.thrColFixHdr #header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
.thrColFixHdr #maincontent {
	float: left; /* since this element is floated, a width must be given */
	width: 760px; /* padding keeps the content of the div away from the edges */
	height: auto;
	padding-top: 30px;
	padding-right: 5px;
	padding-bottom: 10px;
}
.thrColFixHdr #sidebar2 {
	float: right; /* since this element is floated, a width must be given */
	width: 200px; /* padding keeps the content of the div away from the edges */
	height: 100%;
	padding-top: 5px;
	padding-bottom: 10px;
	overflow: hidden;
}

#lnb { 
	margin-top:5px; 
	margin-bottom:10px; 
	background:url("/xe/layouts/final_tj/images/subnavbox_top_bg.gif") top right no-repeat;
	width:190px;
	margin:10px 0 0 0;
	padding: 10px 0 10px 0;
	float:left;
	display:inline;
}
#lnb li { margin-bottom:1px; list-style:none; font-weight:bold; font-family:Arial, Helvetica, sans-serif;}
#lnb li a { 
	font-family: "맑은 고딕", "verdana", "tahoma", "돋움";
	font-weight:bold;
	color:#000;
	text-transform:uppercase;
	text-decoration:none;
	padding:10px 24px 10px 44px;
	margin:0;
	width:186px;
	float:left;
	display:inline; 
	}
#lnb li a:hover,
#lnb li a:focus { 
	text-decoration:underline;
	 }
	 
#lnb li.on a { 
	background:url("/xe/layouts/final_tj/images/subnav_item_over_bg.gif") top left no-repeat;
	color:#fcfcfc;
	padding:10px 24px 16px 44px;
	height:11px; 
	}
	
#lnb li.on a:hover { text-decoration:none; }
#lnb li.on a:focus {  }
#lnb li ul { display:block; position:relative; overflow:hidden; }
#lnb li.on ul { display:block; margin-top:1px; }
#lnb li ul li { margin-bottom:1px; background:#47546e; font-weight:normal;}
#lnb li ul li a {  padding:7px 0 0 44px; height:19px; color:#919db5 !important; border:none; background:none !important; border:none !important;}
#lnb li ul li a:hover,
#lnb li ul li a:focus { font-weight:normal !important; color:#ffffff !important;}
#lnb li.on ul li.on a { 
	background:url("/xe/layouts/final_tj/images/subnav_item_over_bg.gif") top left no-repeat;
	color:#fcfcfc;
	padding:10px 24px 16px 44px;
	height:11px; 
	}

.thrColFixHdr #mainContent { 
	margin: 0 200px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the sidebar spaces when the content in each sidebar ends. */
	padding: 0 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
} 
.thrColFixHdr #footer {
	background-image: url("/xe/layouts/final_tj/images/bottom_bg.png");
	width: 990px;
	height: 150px;
	background-repeat: no-repeat;
	padding:.6em .6em 0 .1em;
} 
.thrColFixHdr #footer ul{
	clear:both;
}
.thrColFixHdr #footer ul.sites{
	height: 40px;
	padding:5px 5px 0 15px;
	overflow:hidden;
}
.thrColFixHdr #footer ul.sites li{
	overflow:hidden;
	float:left;
	margin-right: 5px;
}

.thrColFixHdr #footer p.title{
	margin: 10px 0 0 12px;
	color:#aaaaaa;
}
.thrColFixHdr #footer ul li a{
	color:#aaaaaa;
	text-decoration:none;
	padding:0 15px 0 0px;
	float:left;
}
.thrColFixHdr #footer li a:hover {
	text-decoration:underline;
}

.thrColFixHdr #footer address { 
	color:#aaaaaa;
	padding:0 12px 0 12px;
	display:block; font-style:normal; 
	}

.thrColFixHdr #footer address a { 
	color:#aaaaaa;
	text-decoration: none; 
	}

.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
		clear:both;
		width:990px;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.navigation {
	background: #262626;
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding-top: 0;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 155px;
	padding-bottom: 0px;
	height: 50px;
}
.navigation H2 {
	DISPLAY: none
}
.navigation UL {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; RIGHT: 20px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 10px; POSITION: relative; TOP: 0px; z-index: 9000;
}
.navigation UL UL {
	PADDING-RIGHT: 0px; DISPLAY: none; PADDING-LEFT: 0px; FONT-SIZE: 11px; RIGHT: auto; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 145px; PADDING-TOP: 0px; POSITION: absolute; TOP: auto;
}
.navigation UL LI:hover UL {
	DISPLAY: block
}
.navigation LI {
	FLOAT: left; LIST-STYLE-TYPE: none; background: #262626;
}
.navigation UL UL LI {
	FLOAT: none
}
.navigation LI A {
	PADDING-RIGHT: 10px; DISPLAY: block; PADDING-LEFT: 10px; PADDING-BOTTOM: 5px; OVERFLOW: hidden; COLOR: #fff; MARGIN-RIGHT: 5px; PADDING-TOP: 10px; HEIGHT: 15px; TEXT-DECORATION: none
}
* HTML .navigation LI A {
	FLOAT: left
}
* HTML .navigation LI UL {
	CLEAR: left
}
* HTML .navigation LI LI A {
	FLOAT: none
}
.navigation LI.last A {
	MARGIN-RIGHT: 0px
}
.navigation LI.active A {
	BORDER-TOP: #000 3px solid
}
.navigation LI A:hover {
	BORDER-TOP: #000 3px solid
}
.navigation LI:hover A {
	BORDER-TOP: #000 3px solid
}
.navigation LI.active A {
	FONT-WEIGHT: bold
}
.navigation LI A:hover {
	BACKGROUND: #d01a71
}
.navigation LI UL LI A {
	BORDER-TOP: #000 1px solid; MARGIN: 0px; HEIGHT: auto
}
.navigation LI.active UL LI A {
	BORDER-TOP: #000 1px solid; MARGIN: 0px; HEIGHT: auto
}
.navigation LI UL LI A:hover {
	BORDER-TOP: #000 1px solid; MARGIN: 0px; HEIGHT: auto
}
.navigation LI:hover UL LI A {
	BORDER-TOP: #000 1px solid; MARGIN: 0px; HEIGHT: auto
}
* HTML .navigation LI UL LI {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
.navigation UL UL LI.last A {
	BORDER-BOTTOM: #000 1px solid
}