@charset "utf-8";
/*웹진형*/

/*공통*/
.gx_ptop_webzDiv{position:relative;}
.gx_ptop_webzULa{position:relative; margin:0; padding:0; list-style:none;}
.gx_ptop_webzULa:after{content:""; display:block; clear:both;}
.gx_ptop_webzULa li{position:relative; margin-bottom:20px;} /* 하단간격 */
.gx_ptop_webzULa li p{margin:0; padding:0;}
.gx_ptop_webzULa li .thumbArea{position:relative; display:table-cell; vertical-align:top; padding-right:15px;} /* 썸네일 영역 */
.gx_ptop_webzULa li .thumbArea .thumb{position:relative; display:inline-block; overflow:hidden; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px;} /*이미지 영역*/
.gx_ptop_webzULa li .thumbArea .thumb:hover{}
.gx_ptop_webzULa li .thumbArea .thumb.noimg{background-color:#f0f0f0;}
.gx_ptop_webzULa li .thumbArea .thumb img{transition:all .4s;}
.gx_ptop_webzULa li .thumbArea .thumb:hover img{transform:scale(1.06);}
.gx_ptop_webzULa li .thumbArea .thumb .fa-picture-o{position:absolute; top:50%; left:50%; transform:translateX(-50%); margin-top:-10px; font-size:30px; color:#ccc;} /*이미지 없음시 아이콘*/
.gx_ptop_webzULa li .thumbArea .thumb .comment{position:absolute; right:8px; bottom:8px; padding:5px 10px; background-color:rgba(0,0,0,0.3); font-weight:700; color:#fff; border-radius:15px;}
.gx_ptop_webzULa li .thumbArea .thumb .comment i{vertical-align:top; margin-top:1px; color:#ccc;}
.gx_ptop_webzULa li .titconArea{position:relative; display:table-cell; vertical-align:top;} /* 내용 영역 */
.gx_ptop_webzULa li .titconArea .title{display:inline-block; line-height:32px; font-weight:700; color:#000; font-size:14px;}
.gx_ptop_webzULa li .titconArea .conten{line-height:24px; color:#5c5c5c;}
.gx_ptop_webzULa li .titconArea .date{line-height:26px; color:#5c5c5c;}
.gx_ptop_webzULa li .titconArea .date i{vertical-align:middle;}
.gx_ptop_webzULa li .thumbArea .hot{position:absolute; top:8px; left:8px; padding:6px; background-color:#ff0000; color:#fff; border-radius:50%; z-index:3;}
.gx_ptop_webzULa li .thumbArea .new{color:#fff; vertical-align:middle;}
.gx_ptop_webzULa li .titconArea .new{color:#ff0000; vertical-align:middle;}
.gx_ptop_webzULa li.empty_li{width:100%; height:200px; line-height:200px; background-color:#f0f0f0; text-align:center; border-radius:8px;}
.gx_ptop_webzULa.tapyes{padding-top:10px;} /*tap 있을때 상단간격*/

/*2타입+3타입 공통*/
.gx_ptop_webzULa li.type2, .gx_ptop_webzULa li.type3{float:left; margin-left:20px; vertical-align:top;}
.gx_ptop_webzULa li.type2:first-child, .gx_ptop_webzULa li.type3:first-child{margin-left:0;}
.gx_ptop_webzULa li.type2 .thumbArea, .gx_ptop_webzULa li.type3 .thumbArea{display:block; padding-right:0;}
.gx_ptop_webzULa li.type2 .titconArea, .gx_ptop_webzULa li.type3 .titconArea{display:block;}

/*3타입*/
.gx_ptop_webzULa li.type3:nth-child(1n){margin-right:0;}
.gx_ptop_webzULa li.type3:nth-child(1n+1){/* clear:both; */} /* 열갯수 지정 */

.gx_ptop_webzULa li.type3 .thumbArea .thumb .type3_bg{position:absolute; display:block; top:0; left:0; width:100%; height:100%; background:linear-gradient(to bottom, rgba(20, 20, 20, 0) 25%, rgba(20, 20, 20, 0.05) 60%, rgba(20, 20, 20, 0.50) 80%, rgba(20, 20, 20, 0.80) 100%);}
.gx_ptop_webzULa li.type3 .thumbArea .thumb .comment{right:20px; bottom:75px;}
.gx_ptop_webzULa li.type3 .thumbArea .thumb .title{position:absolute; left:20px; bottom:75px; color:#fff; font-size:17px; font-weight:700;}
.gx_ptop_webzULa li.type3 .thumbArea .thumb .conten{position:absolute; left:0; bottom:15px; width:100%; padding:0 20px; line-height:22px; color:#fff;}