@charset "utf-8";
/**
 * Copyright (C) NAVER <http://www.navercorp.com>
 * @file  widget.basic.css
 * @author NAVER (developers@xpressengine.com)
 *
 * Find and create module object by mif, act in Request Argument
 * Set module information
 *
 * @mainpage XpressEngine
 * @section intro introduction
 *
 * XE is an opensource and being developed in the opensource project.
 * For more information, please see the link below.
 * - Official website: http://www.xpressengine.com
 * - Offcial Repository: https://github.com/xpressengine/xe-core
 * 
 * "XpressEngine (XE)" is free software; you can redistribute it and/or 
 * modify it under the terms of the GNU Lesser General Public 
 * License as published by the Free Software Foundation; either 
 * version 2.1 of the License, or (at your option) any later version. 
 * 
 * This library is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
 * Lesser General Public License for more details.
 * 
 * You should have received a copy of the GNU Lesser General Public
 * License along with this library; if not, write to the Free Software
 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
 *
 **/

.widgetContainer .open{display:block !important}
.widgetContainer a{text-decoration:none}
.widgetContainer img{border:0;vertical-align:top}
.widgetContainer em{display:inline-block;position:relative;margin:-5px 0;*padding:0 1px;line-height:1;font-style:normal}
.widgetContainer form{margin:0;padding:0}
.widgetContainer fieldset{margin:0;padding:0;border:0}
.widgetContainer .hover_info_wrap{display:table;position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;filter:alpha(opacity=0)}
.widgetContainer .hover_info{display:table-cell;text-align:center;vertical-align:middle}
.widgetContainer .hover_info a{color:#fff}
.widgetContainer .mask{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000;opacity:0;filter:alpha(opacity=0)}
.widgetContainer .hover_info .btn_show,.widgetContainer .hover_info .btn_move{display:inline-block;width:28px;height:28px;border:1px solid #fafafa;font-size:18px;line-height:28px;text-align:center;vertical-align:top}

.widgetContainer .hover_info .btn_show:hover,.widgetContainer .hover_info .btn_move:hover{background-color:#fafafa}
.widgetContainer .hover_info .btn_show{margin-right:13px}
.widgetContainer .thumb_area{overflow:hidden}
.widgetContainer .thumb_area:hover .hover_info_wrap{opacity:1;filter:alpha(opacity=100)}
.widgetContainer .thumb_area:hover .mask{opacity:0.7;filter:alpha(opacity=70)}

.widgetA{overflow:hidden;margin:0;padding:0;list-style:none}
.widgetA li{position:relative;margin:0;padding:0;border-top:1px solid #e1e1e1;list-style:none}
.widgetA li:first-child{border-top:0}
.widgetA li a:hover .more_info{display:block}
.widgetA li a{display:block;overflow:hidden;padding:20px 24px;font-size:13px;color:#000}
.widgetA .more_info{display:none;position:absolute;top:0;right:0;left:0;padding:17px 23px 18px;background:#eee;line-height:normal;line-height:20px;color:#333}
.widgetA .more_info dt{display:inline-block;overflow:hidden;float:left;width:20px;height:20px;margin-right:8px;line-height:20px;font-size:20px;text-align:center}
.widgetA .more_info dd{float:left;margin-right:18px}
.widgetA .date{float:right;font-size:12px;color:#989898}

.widgetZineA{overflow:hidden;position:relative;margin:0;padding:0;font-size:12px;line-height:1.5;*zoom:1}
.widgetZineA:after{display:block;clear:both;content:''}
.widgetZineA li{overflow:hidden;clear:both;padding:15px 23px 20px;border-top:1px solid #e1e1e1;list-style:none}
.widgetZineA li:first-child{border-top:0}
.widgetZineA li .thumb{display:block;overflow:hidden;position:relative;width:100px;height:75px;text-decoration:none}
.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;color:#000;text-align:center;cursor:pointer}
.widgetZineA .thumb_area{float:left;margin-right:23px}
.widgetZineA .thumb_area img{width:120px;height:100px}
.widgetZineA .cont_area{overflow:hidden}
.widgetZineA .title{margin-bottom:4px;padding:3px 0;font-size:15px;font-weight:normal}
.widgetZineA .author{float:left;margin-right:5px;font-size:12px}
.widgetZineA .author:after{display:inline-block;position:relative;top:1px;width:1px;height:10px;margin:0 0 0 5px;background-color:#999;content:''}
.widgetZineA .date{display:inline-block;font-size:12px}
.widgetZineA .breadcrumb{display:inline-block;margin-bottom:2px;font-size:12px}
.widgetZineA .cont{font-size:13px;line-height:24px}

.widgetBlog{overflow:hidden;position:relative;margin:0;padding:6px 0 0 24px;font-size:12px;line-height:1.5;*zoom:1}
.widgetBlog:after{display:block;clear:both;content:''}
.widgetBlog li{overflow:hidden;float:left;margin:0 15px 30px 0}
.widgetBlog .thumb_area{position:relative;margin-bottom:8px}
.widgetBlog .title{margin-bottom:7px;padding:3px 0;font-size:15px;font-weight:normal}
.widgetBlog .author{float:left;margin:0 5px 8px 0;font-size:12px}
.widgetBlog .author:after{display:inline-block;position:relative;top:1px;width:1px;height:10px;margin:0 0 0 5px;background-color:#999;content:''}
.widgetBlog .date{display:inline-block;margin-bottom:8px;font-size:12px}
.widgetBlog .breadcrumb{display:inline-block;margin:4px 0 2px;font-size:12px}
.widgetBlog .cont{clear:both;font-size:13px;line-height:25px}

.widgetGalleryA{position:relative;margin:0;padding:6px 0 0 24px;font-size:12px;line-height:1.5;*zoom:1}
.widgetGalleryA:after{display:block;clear:both;content:''}
.widgetGalleryA li{overflow:hidden;float:left;margin:0 10px 10px 0}
.widgetGalleryA .thumb_area{position:relative}
.widgetGalleryA .thumb_area .hover_info_wrap .breadcrumb{display:block;margin-bottom:18px;padding:0 10px;font-size:12px;color:#fafafa;text-align:center}
.widgetGalleryA .thumb_area .hover_info_wrap .title{margin-bottom:9px;padding:0 10px;font-size:15px;color:#fafafa}
.widgetGalleryA .thumb_area .hover_info_wrap .title a{font-size:15px;color:#fafafa}
.widgetGalleryA .thumb_area .hover_info_wrap .title a:hover{color:#fafafa}

.widgetGalleryA .cont_area .author,
.widgetGalleryA .cont_area .date{display:inline-block;margin:6px 0 8px}
.widgetGalleryA .author:after{display:inline-block;position:relative;top:1px;width:1px;height:10px;margin:0 0 0 5px;background-color:#999;content:''}

.widgetBlog .thumb_area:hover img,
.widgetGalleryA .thumb_area:hover img{-webkit-transform:scale(1.3);-moz-transform:scale(1.3);transform: scale(1.3)}
.widgetBlog .thumb_area img,
.widgetGalleryA .thumb_area img{-webkit-transition: all .2s ease-in-out;-moz-transition: all .2s ease-in-out;-ms-transition: all .2s ease-in-out;-o-transition: all .2s ease-in-out;transition: all .2s ease-in-out}

.widgetContainer .title a,.widgetContainer .author a{color:#333}
.widgetContainer .cont{color:#888}
.widgetContainer .author,.widgetContainer .date{color:#999}

/* Color set */
/* Default - Royal Classic */
.widgetA .more_info dt,
.widgetContainer .breadcrumb,
.widgetContainer .title a:hover,
.widgetContainer .author a:hover,
.widgetContainer .hover_info .btn_show:hover,
.widgetContainer .hover_info .btn_move:hover{color:#3f51b5}

/* Grape Fruit */
.color_grape_fruit .widgetA .more_info dt,
.color_grape_fruit .widgetContainer .breadcrumb,
.color_grape_fruit .widgetContainer .title a:hover,
.color_grape_fruit .widgetContainer .author a:hover,
.color_grape_fruit .widgetContainer .hover_info .btn_show:hover,
.color_grape_fruit .widgetContainer .hover_info .btn_move:hover{color:#ed5565}

/* Hot Pink */
.color_hot_pink .widgetA .more_info dt,
.color_hot_pink .widgetContainer .breadcrumb,
.color_hot_pink .widgetContainer .title a:hover,
.color_hot_pink .widgetContainer .author a:hover,
.color_hot_pink .widgetContainer .hover_info .btn_show:hover,
.color_hot_pink .widgetContainer .hover_info .btn_move:hover{color:#ff4081}

/* Orchid */
.color_orchid .widgetA .more_info dt,
.color_orchid .widgetContainer .breadcrumb,
.color_orchid .widgetContainer .title a:hover,
.color_orchid .widgetContainer .author a:hover,
.color_orchid .widgetContainer .hover_info .btn_show:hover,
.color_orchid .widgetContainer .hover_info .btn_move:hover{color:#ab47bc}


/* Blue Jeans */
.color_blue_jeans .widgetA .more_info dt,
.color_blue_jeans .widgetContainer .breadcrumb,
.color_blue_jeans .widgetContainer .title a:hover,
.color_blue_jeans .widgetContainer .author a:hover,
.color_blue_jeans .widgetContainer .hover_info .btn_show:hover,
.color_blue_jeans .widgetContainer .hover_info .btn_move:hover{color:#455ede}

/* Mint  */
.color_mint .widgetA .more_info dt,
.color_mint .widgetContainer .breadcrumb,
.color_mint .widgetContainer .title a:hover,
.color_mint .widgetContainer .author a:hover,
.color_mint .widgetContainer .hover_info .btn_show:hover,
.color_mint .widgetContainer .hover_info .btn_move:hover{color:#00bfa5}

/* Sunflower  */
.color_sunflower .widgetA .more_info dt,
.color_sunflower .widgetContainer .breadcrumb,
.color_sunflower .widgetContainer .title a:hover,
.color_sunflower .widgetContainer .author a:hover,
.color_sunflower .widgetContainer .hover_info .btn_show:hover,
.color_sunflower .widgetContainer .hover_info .btn_move:hover{color:#f9a825}

/* Bitter Sweet */
.color_bitter_sweet .widgetA .more_info dt,
.color_bitter_sweet .widgetContainer .breadcrumb,
.color_bitter_sweet .widgetContainer .title a:hover,
.color_bitter_sweet .widgetContainer .author a:hover,
.color_bitter_sweet .widgetContainer .hover_info .btn_show:hover,
.color_bitter_sweet .widgetContainer .hover_info .btn_move:hover{color:#ff684d}

/* Java Coffee */
.color_java_coffee .widgetA .more_info dt,
.color_java_coffee .widgetContainer .breadcrumb,
.color_java_coffee .widgetContainer .title a:hover,
.color_java_coffee .widgetContainer .author a:hover,
.color_java_coffee .widgetContainer .hover_info .btn_show:hover,
.color_java_coffee .widgetContainer .hover_info .btn_move:hover{color:#795548}

/* Gray  */
.color_gray .widgetA .more_info dt,
.color_gray .widgetContainer .breadcrumb,
.color_gray .widgetContainer .title a:hover,
.color_gray .widgetContainer .author a:hover,
.color_gray .widgetContainer .hover_info .btn_show:hover,
.color_gray .widgetContainer .hover_info .btn_move:hover{color:#e00032}