@charset "utf-8";

.floatLeft{ float:left;}
.floatRight{ float:right;}
.clearLeft{ clear:left;}
.clearRight{ clear:right;}

.widgetContainer .open{ display:block !important;} 
.widgetContainer a{ text-decoration:none;}
.widgetContainer a:hover,
.widgetContainer a:active,
.widgetContainer a:focus{ text-decoration:underline;}
.widgetContainer img{ border:0;}
.widgetContainer sup{ position:relative; line-height:1; display:inline-block; margin:-5px 0; *padding:0 1px;}
.widgetContainer form{ margin:0; padding:0;}
.widgetContainer fieldset{ border:0; margin:0; padding:0;}

.widgetTabA{ position:relative; margin:0 0 10px 0; padding:0; *zoom:1; border-bottom:2px solid;}
.widgetTabA:after{ content:""; display:block; clear:both;} 
.widgetTabA li{ float:left; margin-right:1px; list-style:none; background-repeat:no-repeat; background-position:0 0;}
.widgetTabA li.active{ background-position:0 -30px;} 
.widgetTabA li a{ position:relative; left:2px; float:left; height:auto; padding:7px 11px 3px 11px; text-decoration:none; font-size:12px; background-repeat:no-repeat; background-position:right 0;}
.widgetTabA li.active a{ background-position:right -30px; font-weight:bold; letter-spacing:0px;}

ul.widgetA { margin:0; padding:0; list-style:none; }
ul.widgetA li { margin:0; padding:0; list-style:none; }
ul.widgetA li a { font-size:0.75rem}
.widgetTableA { width:100%; font-size:12px; position:relative; border:0;}
.widgetTableA td{ border:0; line-height:1.5; white-space:nowrap; vertical-align:top; padding:1px 5px 1px 5px;}
.widgetTableA td.title{ width:100%; white-space:nowrap;}
.widgetTableA td .board{ padding-right:5px;} 
.widgetTableA td .notice{ padding-right:5px;}
.widgetTableA td .category{ padding-right:5px; font-weight:normal;}
.widgetTableA td .replyNum a{ font:10px Arial, Helvetica, sans-serif;}
.widgetTableA td .trackbackNum a{ font:10px Arial, Helvetica, sans-serif;}
.widgetTableA td.author{}
.widgetTableA td.time{ font-size:11px; font-family:Arial, Helvetica, sans-serif;} 


.widgetTabC{ margin:0; padding:0; font-size:12px; border-top:1px solid;}
.widgetTabC li{ list-style:none; border-bottom:1px solid; *zoom:1; margin-bottom:1px;}
.widgetTabC li a{ display:block; padding:7px 0 6px 10px; text-decoration:none; *zoom:1;}

dl.widgetDivider{ margin:0;}
dl.widgetDivider dt{ position:absolute; width:0; height:0; overflow:hidden; font-size:0; line-height:0;}
dl.widgetDivider dd{ display:none; margin:0;} 

.widgetNavigator{ margin:0; padding:0; text-align:right; clear:both;}
.widgetNavigator li{ list-style:none; display:inline;}
.widgetNavigator li button{ width:16px; height:16px; padding:0; background-color:transparent; background-image:url(../img/white/buttonWidgetNavigation.gif); border:1px solid #999; cursor:pointer;}
.widgetNavigator li button.prev{ background-position:left center; *background-position:-1px center;}
.widgetNavigator li button.next{ background-position:right center; *background-position:13px center;}
.widgetNavigator li button span{ position:absolute; display:block; width:0; height:0; overflow:hidden; visibility:hidden;}

.widgetGalleryA{ position:relative; margin:0; padding:0; font-size:12px; line-height:1.5; *zoom:1; _margin-right:-100%;}
.widgetGalleryA:after{ content:""; display:block; clear:both;}
.widgetGalleryA li { float:left; overflow:hidden; width:100px; margin-right:28px; margin-bottom:15px; padding-bottom:0; white-space:nowrap; list-style:none;}
.widgetGalleryA li.clearRight{ margin-right:0;}
.widgetGalleryA li .thumb{ display:block; position:relative; width:100px; height:75px; margin-bottom:10px; overflow:hidden; text-decoration:none;}
.widgetGalleryA li .thumb img{ display:block; position:relative; width:100%;}
.widgetGalleryA li .thumb .imgNone{ display:block; position:relative; width:100%; height:70%; padding-top:30%; background:#eee; text-align:center; cursor:pointer; color:#000;}
.widgetGalleryA li .thumb .board{ display:block; position:absolute; width:100%; top:0; left:0; padding:2px 0 0 0 !important; cursor:pointer; text-align:center; font-weight:normal; background:#000; color:#fff; opacity:0.6;  filter:alpha(opacity=60); -ms-filter:alpha('opacity=60'); }
.widgetGalleryA li .thumb .category{ display:block; position:absolute; width:100%; bottom:0; left:0; padding:2px 0 0 0 !important; cursor:pointer; text-align:center; font-weight:normal; background:#000; color:#fff; opacity:0.6;  filter:alpha(opacity=60); -ms-filter:alpha('opacity=60'); }
.widgetGalleryA li .author{ display:block;}
.widgetGalleryA li .replyNum a{ font:10px Arial, Helvetica, sans-serif; margin:0 -1px;}
.widgetGalleryA li .trackbackNum a{ font:10px Arial, Helvetica, sans-serif; margin:0 -1px;}
.widgetGalleryA li .date{ font:11px Arial, Helvetica, sans-serif;}
.widgetGalleryA li .hour{ font:11px Arial, Helvetica, sans-serif;}

/* widgetThumb */
.widgetThumb{ position:relative; margin:0; text-align:center; font-size:12px; line-height:1.5;}
.widgetThumb .thumb{ display:block; margin-bottom:5px; position:relative; *zoom:1; text-decoration:none; _float:left;}
.widgetThumb .thumb img{ display:block; width:100%;}
.widgetThumb .thumb .imgNone{ display:block; position:relative; width:100%; padding-top:30px; padding-bottom:50px; background:#eee; text-align:center; cursor:pointer; color:#000;}
.widgetThumb .thumb .category{ display:block; position:absolute; width:100%; bottom:0; left:0; padding:2px 0 0 0 !important; cursor:pointer; text-align:center; font-weight:normal; background:#000; color:#fff; opacity:0.6;  filter:alpha(opacity=60); -ms-filter:alpha('opacity=60'); }
.widgetThumb .title{ display:block;}
.widgetThumb .author{ display:block;}
.widgetThumb .date{ font-size:11px; font-family:Arial, Helvetica, sans-serif;}
.widgetThumb .hour{ font-size:11px; font-family:Arial, Helvetica, sans-serif;}

.widgetZineA{ position:relative; margin:0; padding:0; font-size:12px; line-height:1.5; *zoom:1;}
.widgetZineA:after{ content:""; display:block; clear:both;}
.widgetZineA li { list-style:none; clear:both; margin-bottom:7px; padding-bottom:7px; *zoom:1; overflow:hidden; }
.widgetZineA li:last-child {margin: 0;padding: 0;}
.widgetZineA li p{ margin:0; padding:0;}
.widgetZineA li p.thumbArea{ position:relative; float:left; width:100px; margin-right:-100px; border:1px solid #ddd;overflow:hidden;}
.widgetZineA li p.titleArea{ margin-left:120px; margin-bottom:4px;}
.widgetZineA li p.titleArea .board{ padding-right:5px;}
.widgetZineA li p.text{ margin-left:120px; margin-bottom:4px;}
.widgetZineA li p.authorArea{ margin-left:120px;}
.widgetZineA li .thumb{ display:block; position:relative; width:100px; height:75px; text-decoration:none; overflow:hidden;}
.widgetZineA li .thumb img{ position:relative; width:100%;}
.widgetZineA li .thumb .imgNone{ display:block; position:relative; width:100%; height:80%; padding-top:20%; background:#eee; text-align:center; cursor:pointer; color:#000;}
.widgetZineA li .thumb .category{ display:block; position:absolute; width:100%; bottom:0; left:0; padding:2px 0 0 0 !important; cursor:pointer; text-align:center; font-weight:normal; background:#000; color:#fff; opacity:0.6;  filter:alpha(opacity=60); -ms-filter:alpha('opacity=60'); }
.widgetZineA li .category{ padding-right:5px; font-weight:normal;}
.widgetZineA li .title{ font-weight:bold;}
.widgetZineA li .replyNum a{ font:10px Arial, Helvetica, sans-serif; margin:0px;}
.widgetZineA li .trackbackNum a{ font:10px Arial, Helvetica, sans-serif; margin:0 -1px;}
.widgetZineA li .author{ margin-right:10px;}
.widgetZineA li .date{ font:11px Arial, Helvetica, sans-serif;}
.widgetZineA li .hour{ font:11px Arial, Helvetica, sans-serif;}

.z-widgetZineA{ position:relative; margin:0; padding:0; font-size:12px; line-height:1.5; *zoom:1;}
.z-widgetZineA:after{ content:""; display:block; clear:both;}
.z-widgetZineA li { list-style:none; clear:both; margin-bottom:7px; padding-bottom:7px; *zoom:1; overflow:hidden; }
.z-widgetZineA li:last-child {margin: 0;padding: 0;}
.z-widgetZineA li p{ margin:0; padding:0;}
.z-widgetZineA li p.thumbArea{ position:relative; float:left; width:100px; overflow:hidden;}
.z-widgetZineA li p.titleArea{ margin-bottom:4px;}
.z-widgetZineA li p.titleArea .board{ padding-right:5px;}
.z-widgetZineA li p.text{ margin-bottom:4px;}
.z-widgetZineA li p.authorArea{ margin:0}
.z-widgetZineA li .thumb{ display:block; position:relative; width:100px; height:75px; text-decoration:none; overflow:hidden;}
.z-widgetZineA li .thumb img{ position:relative; width:100%;}
.z-widgetZineA li .thumb .imgNone{ display:block; position:relative; width:100%; height:80%; padding-top:20%; background:#eee; text-align:center; cursor:pointer; color:#000;}
.z-widgetZineA li .thumb .category{ display:block; position:absolute; width:100%; bottom:0; left:0; padding:2px 0 0 0 !important; cursor:pointer; text-align:center; font-weight:normal; background:#000; color:#fff; opacity:0.6;  filter:alpha(opacity=60); -ms-filter:alpha('opacity=60'); }
.z-widgetZineA li .category{ padding-right:5px; font-weight:normal;}
.z-widgetZineA li .title{ font-weight:bold;}
.z-widgetZineA li .replyNum a{ font:10px Arial, Helvetica, sans-serif; margin:0px;}
.z-widgetZineA li .trackbackNum a{ font:10px Arial, Helvetica, sans-serif; margin:0 -1px;}
.z-widgetZineA li .author{ margin-right:10px;}
.z-widgetZineA li .date{ font:11px Arial, Helvetica, sans-serif;}
.z-widgetZineA li .hour{ font:11px Arial, Helvetica, sans-serif;}
p.z-titleArea {margin-bottom:4px}
p.z-text {margin-bottom:4px}

.widgetTabC{ border-color:#e5e5e5;}
.widgetTabC li{ border-color:#e5e5e5; background:#f8f8f8;}
.widgetTabC li a{ color:#333;}
.widgetTabC li a:hover, 
.widgetTabC li a:active,
.widgetTabC li a:focus{ background:#eee;}
.widgetTabA{ border-color:#666;}
.widgetTabA li,
.widgetTabA li a{ background-image:url(../img/white/buttonWidgetTab.gif);}
.widgetTabA li a{ color:#333;}

.widgetA a.board { color:#888; padding-right:5px; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetA .notice{ color:#ff1a1a; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetA .category{ color:#333; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetA .replyNum a{ color:#ff1a1a;}
.widgetA .trackbackNum a{ color:#66c;}
.widgetA .author { color:#888;}
.widgetA .date{ color:#888;}
.widgetA .hour{ color:#888;}

.widgetTableA td.title a{ color: #666666; font-family:"돋음",Dotum,"맑은 고딕","Malgun Gothic","Apple SD Gothic Neo Medium","Nanum Gothic","HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif
}
.widgetTableA td .board{ color:#666; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetTableA td .notice{ color:#ff1a1a; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetTableA td .category{ color:#888; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetTableA td .replyNum a{ color:#ff1a1a; font-family:Arial, Helvetica, sans-serif ; font-size:10px }
.widgetTableA td .trackbackNum a{ color:#66c;}
.widgetTableA td .author { color:#888;}
.widgetTableA td .date{ color:#333;}
.widgetTableA td .hour{ color:#888;}

.widgetGalleryA li .title{ color:#333;}
.widgetGalleryA li .replyNum a{ color:#ff1a1a;}
.widgetGalleryA li .trackbackNum a{ color:#66c;}
.widgetGalleryA li .author{ color:#333;}
.widgetGalleryA li .date{ color:#333;}
.widgetGalleryA li .hour{ color:#888;}

.widgetThumb{ color:#333;}
.widgetThumb a{ color:#333;}
.widgetThumb .hour{ color:#888;}

.widgetZineA li .board{ color:#333; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetZineA li .title{ color:#666;}
.widgetZineA li .replyNum a{ color:#ff1a1a;}
.widgetZineA li .trackbackNum a{ color:#66c;}
.widgetZineA li .author{ color:#333;}
.widgetZineA li .category{ color:#333; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.widgetZineA li .date{ color:#333;}
.widgetZineA li .hour{ color:#888;}
.widgetZineA li .text{ color:#888;}

.z-widgetZineA li .board{ color:#333; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.z-widgetZineA li .title{ color:#666;}
.z-widgetZineA li .replyNum a{ color:#ff1a1a;}
.z-widgetZineA li .trackbackNum a{ color:#66c;}
.z-widgetZineA li .author{ color:#333;}
.z-widgetZineA li .category{ color:#333; background:url(../img/white/lineTextDiv.gif) no-repeat right center;}
.z-widgetZineA li .date{ color:#333;}
.z-widgetZineA li .hour{ color:#888;}
.z-widgetZineA li .text{ color:#888;}

.widgetContainer.black .widgetTabC{ border-color:#7f7f7f;}
.widgetContainer.black .widgetTabC li{ border-color:#7f7f7f; background:#222;}
.widgetContainer.black .widgetTabC li a{ color:#999;}
.widgetContainer.black .widgetTabC li a:hover,
.widgetContainer.black .widgetTabC li a:active,
.widgetContainer.black .widgetTabC li a:focus{ background:#333;}
.widgetContainer.black .widgetTabA{ border-color:#999;}
.widgetContainer.black .widgetTabA li, 
.widgetContainer.black .widgetTabA li a{ background-image:url(../img/black/buttonWidgetTab.gif);}
.widgetContainer.black .widgetTabA li a{ color:#999;}

.widgetContainer.black .widgetTableA td.title a{ color:#999;}
.widgetContainer.black .widgetTableA td .board{ color:#999; background:url(../img/black/lineTextDiv.gif) no-repeat right center;}
.widgetContainer.black .widgetTableA td .notice{ color:#ff1a1a; background:url(../img/black/lineTextDiv.gif) no-repeat right center;}
.widgetContainer.black .widgetTableA td .category{ color:#999; background:url(../img/black/lineTextDiv.gif) no-repeat right center;}
.widgetContainer.black .widgetTableA td .replyNum{ color:#ff1a1a;}
.widgetContainer.black .widgetTableA td .trackbackNum{ color:#66c;}
.widgetContainer.black .widgetTableA td .author { color:#999;}
.widgetContainer.black .widgetTableA td .date{ color:#999;}
.widgetContainer.black .widgetTableA td .hour{ color:#888;}

.widgetContainer.black .widgetGalleryA li .title{ color:#999;}
.widgetContainer.black .widgetGalleryA li .replyNum a{ color:#ff1a1a;}
.widgetContainer.black .widgetGalleryA li .trackbackNum a{ color:#66c;}
.widgetContainer.black .widgetGalleryA li .author{ color:#999;}
.widgetContainer.black .widgetGalleryA li .date{ color:#999;}
.widgetContainer.black .widgetGalleryA li .hour{ color:#888;}

.widgetContainer.black .widgetThumb{ color:#999;}
.widgetContainer.black .widgetThumb a{ color:#999;}
.widgetContainer.black .widgetThumb .hour{ color:#888;}

.widgetContainer.black .widgetZineA li .board{ color:#999; background:url(../img/black/lineTextDiv.gif) no-repeat right center;}
.widgetContainer.black .widgetZineA li .title{ color:#999;}
.widgetContainer.black .widgetZineA li .replyNum a{ color:#ff1a1a;}
.widgetContainer.black .widgetZineA li .trackbackNum a{ color:#66c;}
.widgetContainer.black .widgetZineA li .author{ color:#999;}
.widgetContainer.black .widgetZineA li .category{ color:#999; background:url(../img/black/lineTextDiv.gif) no-repeat right center;}
.widgetContainer.black .widgetZineA li .date{ color:#999;}
.widgetContainer.black .widgetZineA li .hour{ color:#888;}
.widgetContainer.black .widgetZineA li .text{ color:#888;}
/* time forum */
.tf-wrapper .widgetTableA td{border:0;  line-height:1.6; white-space:nowrap; vertical-align:top; padding:1px 0; font-family:"돋음",Dotum,"맑은 고딕","Malgun Gothic","Apple SD Gothic Neo Medium","Nanum Gothic","HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;}
/* Magazine Main */
.widgetMagazine{ position:relative; margin:0; padding:0; width:100%;font-size:12px; line-height:1.5; *zoom:1; _margin-right:-100%; color:#999999}
.widgetMagazine:after{ content:""; display:block; clear:both;}
.widgetMagazine li { float:left; overflow:hidden; margin:0; padding:0; white-space:nowrap; list-style:none;}
.widgetMagazine li.clearRight{ margin-right:0;}
 .widgetMagazine li .thumb-wrap {margin:0 20px 20px 0;background-color:#fff;}
 .widgetMagazine  .thumb-wrap-inner {margin:0; padding:0px 10px 10px 10px;}
 /* .widgetMagazine li:nth-child(3) .thumb-wrap,.widgetMagazine li:nth-child(6) .thumb-wrap{margin:0 0 20px 0} */
.widgetMagazine li .thumb{ display:block; position:relative; width:100%; height:auto; margin-bottom:10px; overflow:hidden; text-decoration:none;}
.widgetMagazine li .thumb img{ display:block; position:relative; width:100%;height:auto;}
.widgetMagazine li .thumb .imgNone{ display:block; position:relative; width:100%; height:70%; padding-top:30%; background:#eee; text-align:center; cursor:pointer; color:#000;}
.widgetMagazine li .thumb .board{ display:block; position:absolute; width:100%; top:0; left:0; padding:2px 0 0 0 !important; cursor:pointer; text-align:center; font-weight:normal; background:#000; color:#fff; opacity:0.6;  filter:alpha(opacity=60); -ms-filter:alpha('opacity=60'); }
.widgetMagazine li .thumb .category{ display:block; position:absolute; width:100%; bottom:0; left:0; padding:2px 0 0 0 !important; cursor:pointer; text-align:center; font-weight:normal; background:#000; color:#fff; opacity:0.6;  filter:alpha(opacity=60); -ms-filter:alpha('opacity=60'); }
.widgetMagazine li .title{ color: #666666;font-weight:bold;white-space:normal ; line-height:100% ; letter-spacing:-1px}
.widgetMagazine li .author{ display:block; color:#888;}
.widgetMagazine li .replyNum a{ color:#fc0000;font:10px Arial, Helvetica, sans-serif; margin:0 -1px;}
.widgetMagazine li .date{ font:11px Arial, Helvetica, sans-serif ; color:#888}
.widgetMagazine li .hour{ font:11px Arial, Helvetica, sans-serif; color:#888}
.widgetMagazine li .summary {white-space:normal;margin: 0;}
/*wook */
/* weekly best */
.tm-right-right .widgetA li a {color:#666666;font-size:0.75rem; padding: 3px 0}
.hotclick .widgetA li a {color:#333;font-size:0.75rem; padding: 3px 0 ; color:#666666}
/** General page styling **/
#main {position: relative;padding:0 20px;overflow: hidden;}
/** * Grid container */
#tiles {list-style-type: none;position: relative;margin: 0;padding: 0;}
/** * Grid items */
#tiles li {background-color: #ffffff;display: none; /** Hide items initially to avoid a flicker effect **/}
#tiles li.inactive {visibility: hidden;opacity: 0;}
#tiles li img {display: block;width:100%;height: auto;}
/** * Grid item text */
#tiles li p {color: #666;font-size: 12px;}
/** * Placerholder css */
.wookmark-placeholder {border-radius: 2px; -moz-border-radius: 2px;-webkit-border-radius: 2px;background-color: #eee;border: 1px solid #dedede;z-index: -1;}
/* style */
/** * Grid items animation */
#tiles li {-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
#tiles li .caption {padding:0;margin:0;}
.wookmark-placeholder {-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
/** * Filters */
#filters {list-style-type: none;text-align: center;margin: 0;}
#filters li {font-size: 12px;float: left;padding: 0 6px;cursor: pointer;-webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; -o-transition: all 0.15s ease-out;transition: all 0.15s ease-out;-webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;}
#filters li:hover {background: #dedede;}
#filters li.active a,#filters li.active {background: #333333;color: #ffffff;}
/* total */
#total {float:left;list-style-type: none;text-align: center;margin: 0;}
#total li {font-size: 12px;float: left;padding: 0 6px;cursor: pointer;-webkit-transition: all 0.15s ease-out;-moz-transition: all 0.15s ease-out;-o-transition: all 0.15s ease-out;transition: all 0.15s ease-out;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
#total li:hover {background: #dedede;}
#total li a {color: #444;text-decoration:none;}
 #tiles li {-moz-box-sizing: border-box; box-sizing: border-box;}

#tiles li span.icon img{display:inline;max-width:100%!important}

#main .overlay {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 15px 20px;
  width: 100%;
  z-index: auto;
  background: rgba(0, 0, 0, 0);
  overflow: hidden;
  transition: all 0.5s;
  line-height:150%;
}
#main #tiles li:hover .overlay {
display:block;height:100%; background: rgba(0, 0, 0, 0.8);
}
#main .overlay a {color:#fff;text-decoration:none ; }
#main .overlay p.summary {color:#fff;}
#main .item-main:hover .overlay p.summary,#main .item-sub:hover .overlay p.summary {display:block}
#main .overlay span {color: #666}
#main .overlay .author .date {font-size:12px}


.tf-wrapper .widgetTabA {
position: relative;
margin: 0 0 10px 0;
padding: 0;
border-bottom: 2px solid #666;
}
#main #tiles .img-none {padding:15px 20px ; line-height:150%}
#main #tiles .img-none a,#main #tiles .img-none a:hover {color:#333}

