@charset "utf-8";
/* NHN > UIT Center > Open UI Technology Team > Jeong Chan Myeong(dece24@nhncorp.com) */

/* Element Reset */
html,
body{ height:100%; margin:0; font-family:Tahoma, Sans-serif; font-size:12px;}
fieldset{ border:0; margin:0; padding:0;}
img{ border:0;}

a{ text-decoration:none;}
a:hover,
a:active,
a:focus{ text-decoration:underline;}

/* Common Class */
.skipToContent { position:absolute; left:-1000%; display:block; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden; text-decoration:none; white-space:nowrap;}
.skipToContent:hover,
.skipToContent:active,
.skipToContent:focus{ position:relative; left:0; width:98%; height:auto; padding:5px 1%; font-size:12px; line-height:1;}

.inputText{ font-size:12px;}
.hr{ display:none;}

/* Layout */
#content,
.extension.e1{ margin-bottom:30px;}
.extension.e2{ display:block !important; clear:both;}

#content h3.title{text-align:center}

/* Header */
#header .header{ background-image:url(../img/); background-repeat:no-repeat;}
#header{ padding:26px 0 0 0; margin:0px 0 30px 0; background-position:left top;}
#header .header{ padding:0 0 26px 0px; background-position:left bottom;}
#header h1{ margin:0; font-size:24px; line-height:1;}
#header h1 a{ color:#224e67; text-decoration:none; font-family:NanumGothic, 나눔고딕, "Malgun Gothic", "맑은 고딕", AppleGothic, Dotum, 돋움, Tahoma, Sans-serif;}
#header h1 a:hover,
#header h1 a:active,
#header h1 a:focus{ color:#000;}
#header h1 a img{ _behavior:url(./common/js/iePngFix.htc);}
#header .url{ margin:0;}
#header .url a{ color:#999; font-size:10px; line-height:1; text-decoration:none;}
#header .url a:hover,
#header .url a:active,
#header .url a:focus{ color:#666;}
#header .search{ position:absolute; bottom:20px; right:30px; text-align:right;}
#body .extension .search .inputText{ border:1px solid #888888; width:140px; height:16px; background:#ffffff;}
#header .search .inputText:focus{ border-width:2px; height:12px; width:158px; background:#f8f8f8;}
#header .topMenu { position:absolute; top:230px;right:0px; padding:0; margin:0;}
#header .topMenu li { display:block; float:left;margin:0 0 0 15px;}
#header .topMenu li.blog { width:136px;height:49px;cursor:pointer;}
#header .topMenu li.smallshop { width:136px;height:49px;cursor:pointer;}
#header .topMenu li.setup { padding:2px 0 2px 18px; background:url(../img/icon_management.gif) no-repeat left 1px; }
#header .topMenu li a { color:#8682AE; }

/* Footer */
#footer{ padding:15px 0 50px 0; border-top:1px dotted #ccc; *zoom:1;}
#footer address{ position:absolute; top:15px; left:0; height:16px; padding:0 0 0 20px; text-align:left; font-style:normal; font-size:10px; line-height:16px; color:#999; z-index:2; background:url(../img/iconXE.gif) no-repeat left center;}
#footer address a{ color:#666; font-weight:bold;}
#footer div{ position:relative; overflow:visible !important; z-index:1; text-align:right;}
#footer .widgetLanguage{ position:relative; *zoom:1;}
#footer .widgetLanguage:after{ content:""; display:block; clear:both;}
#footer .widgetLanguage p{ margin:0;}
#footer .language_selector{ font-size:11px; font-family:Dotum, 돋움; color:#767676;}
#footer .langList{ display:none; position:absolute; top:auto !important; bottom:20px !important; right:0 !important; list-style:none; border:1px solid #ddd; background:#fff; margin:0; padding:10px;}
#footer .langList a{ font-size:11px; white-space:nowrap; color:#767676;}

/* Extension E1 */

/* Info */
.extension .info{ position:relative; border:1px solid #eee; margin:0 0 15px 0; padding:4px 4px 4px 4px; background:#f8f8f8; *zoom:1; -moz-border-radius:5px; -webkit-border-radius:5px;}
.extension .info .section{ position:static !important;}
.extension .info .tab{ position:absolute; top:4px; height:30px; line-height:30px; border:1px solid #ddd; padding:0; margin:0; overflow:visible; font-family:Tahoma; font-size:12px; cursor:pointer; color:#999; font-weight:bold; background:#f4f4f4; -moz-border-radius-topleft:3px; -webkit-border-top-left-radius:3px; -moz-border-radius-topright:3px; -webkit-border-top-right-radius:3px;}
.extension .info .cafeInfo .tab{ left:4px; width:105px;}
.extension .info .memberInfo .tab{ right:4px; width:106px;}
.extension .info .widgetContainer{ display:none; padding:15px; background:#fff; border:1px solid #ddd; border-top:0; -moz-border-radius-bottomleft:3px; -webkit-border-bottom-left-radius:3px; -moz-border-radius-bottomright:3px; -webkit-border-bottom-right-radius:3px;}
.extension .info.cafe .cafeInfo .widgetContainer,
.extension .info.member .memberInfo .widgetContainer{ display:block;}
.extension .info.cafe .cafeInfo .tab,
.extension .info.member .memberInfo .tab{ color:#333; border-bottom:0; background:#fff;}

.extension .info .button,
.extension .info .button span,
.extension .info .button input{ display:inline-block; position:relative; padding:0; margin:0; border:0; background-color:transparent; background-image:url(../img/buttonAction.gif) !important; background-repeat:no-repeat; font-size:12px; color:#666 !important; font-weight:bold; height:35px; line-height:35px; vertical-align:top !important; overflow:visible; cursor:pointer;}
.extension .info .button{ margin:10px 3px 0 0; background-position:left top;}
.extension .info .button span,
.extension .info .button input{ width:175px; left:3px; background-position:right top; text-align:center; top:0;}

.extension .info .cafeInfo dl{ margin:0; color:#767676;}
.extension .info .cafeInfo dt{ float:left; clear:left; height:20px; margin:0 3px 0 0; padding:0 0 0 15px; background:url(../img/iconInfo.gif) no-repeat left 2px;}
.extension .info .cafeInfo dd{ margin:0; height:20px; color:#999;}

.extension .info .memberInfo dl{ margin:0; color:#767676;}
.extension .info .memberInfo .widgetLogin dt{ position:absolute; width:1px; height:1px; overflow:hidden;}
.extension .info .memberInfo .widgetLastLogin dt{ float:left; margin:0 3px 0 0;}
.extension .info .memberInfo dd{ margin:0 0 2px 0; color:#999;}
.extension .info .memberInfo dd input{ border:1px solid #ddd; padding:3px 4px; width:168px; font:bold 12px Tahoma; height:15px; background:#f4f4f4;}
.extension .info .memberInfo dd input:focus{ border-width:2px; width:166px; height:13px; background:#fff;}
.extension .info .memberInfo p{ margin:10px 0 0 0; color:#767676;}
.extension .info .memberInfo p input{ width:13px; height:13px; margin:0 3px 0 0; vertical-align:middle;}
.extension .info .memberInfo p label{ font:11px Dotum, 돋움;}
.extension .info .memberInfo .help{ margin:10px 0 0 0; padding:0; list-style:none;}
.extension .info .memberInfo .help a{ color:#767676; font:11px Dotum, 돋움;}
.extension .info .widgetMyInfo{ margin:10px 0 0 0; padding:0; list-style:none;}
.extension .info .widgetMyInfo li{ padding:0 0 0 15px; margin:0 0 3px 0; background:url(../img/iconInfo.gif) no-repeat left 2px;}
.extension .info .widgetMyInfo li a{ color:#767676;}

/* Menu */
.cafeMenu{ position:relative; padding:15px; margin:0 0 15px 0; border:1px solid #ddd; background:#fcfcfc url(../img/iconMenu.gif) no-repeat 195px 19px; -moz-border-radius:5px; -webkit-border-radius:5px; *zoom:1;}
.cafeMenu h2{ position:absolute; left:-1000%; width:1px; height:1px; overflow:hidden; font-size:0; line-height:0;}
.cafeMenu ul{ margin:0; padding:0; list-style:none;}
.cafeMenu ul li{ margin:0 0 5px 0; padding:0 0 0 15px; background:url(../img/iconInfo.gif) no-repeat left 2px;}
.cafeMenu ul li ul{ padding:3px 0 0 0;}
.cafeMenu ul li li{ background:url(../img/lineSub.gif) no-repeat 5px 2px;}
.cafeMenu ul li button{ display:none;}
.cafeMenu ul li a{ color:#767676;}
.cafeMenu ul li a.selected{ font-weight:bold;}

/* Visotor Stat */
.visitorStat{ position:relative; padding:10px 15px; border:1px solid #ddd; background:#fdfdfd url(../img/iconVisitorStat.gif) no-repeat 195px 14px; -moz-border-radius:5px; -webkit-border-radius:5px; *zoom:1;}
.visitorStat h2{ position:absolute; left:-1000%; width:1px; height:1px; overflow:hidden; font-size:0; line-height:0;}
.visitorStat dl{ margin:0; color:#767676;}
.visitorStat dt{ float:left; clear:left; height:18px; margin:0 3px 0 0; padding:0 0 0 15px; background:url(../img/iconInfo.gif) no-repeat left 2px;}
.visitorStat dd{ color:#999; height:18px;}

/* Visotor Stat */
.latestDocument, .latestComment{ position:relative;margin-bottom:10pt; padding:0px 15px 10px 15px; border:1px solid #ddd; background:#fdfdfd url(../img/iconMenu.gif) no-repeat 195px 14px; -moz-border-radius:5px; -webkit-border-radius:5px; *zoom:1;}
.latestDocument h2, .latestComment h2{border-bottom:#bdbdbd 1px dotted;font-size:10pt;*line-height:200%;color:#767676;}
.latestDocument ul li, .latestComment ul li{ }
.latestDocument ul li a{ color:#767676;}
.latestDocument ul li a.selected{ font-weight:bold;}

/* Extension E2 */
.extension.e2{ padding:15px 0 0 0; margin:0 0 15px 0; border-top:1px dotted #ddd;}
.extension.e2 .section{ width:188px; float:left; *display:inline; padding:15px; margin:0 26px 0 0; border:1px solid #eee; background-color:#fcfcfc; -moz-border-radius:5px; -webkit-border-radius:5px; *zoom:1;}
.extension.e2 h2{ font-size:12px; color:#555; margin:0 0 10px 0;}
.extension.e2 ul{ margin:0; padding:0; list-style:none;}
.extension.e2 ol{ margin:0 0 0 22px; padding:0; color:#767676;}
.extension.e2 li{ margin:0 0 4px 0;}
.extension.e2 li a{ color:#767676;}
.extension.e2 li sup{ color:#999;}

.extension.e2 .newMember{ background-image:url(../img/iconMemberNew.gif); background-repeat:no-repeat; background-position:195px 16px;}
.extension.e2 .newMember li{ padding:0 0 0 8px; background:url(../img/iconList.gif) no-repeat left 6px;}
.extension.e2 .docRank{ background-image:url(../img/iconDocument.gif); background-repeat:no-repeat; background-position:195px 16px;}
.extension.e2 .replyRank{ background-image:url(../img/iconReply.gif); background-repeat:no-repeat; background-position:195px 16px;}
.extension.e2 .onMember{ float:right; margin:0; background-image:url(../img/iconMemberOn.gif); background-repeat:no-repeat; background-position:195px 16px;}
.extension.e2 .onMember li{ padding:0 0 0 8px; background:url(../img/iconList.gif) no-repeat left 6px;}

/* Widget Reset */
.simpleWidgetStyle{ margin:0 0 30px 0 !important;}
.simpleWidgetStyle h2{ padding:5px 0 5px 20px !important; margin:0 0 10px 0 !important; font-size:12px !important; font-family:Tahoma !important; border-bottom:2px solid #eee !important; background:url(../img/boxicony.gif) no-repeat 0px 2px;}
.widgetGalleryA li{ _position:relative;}