@charset "utf-8";
/*갤러리형*/

/*
part patch_v1 = 15줄, 34줄
*/

/*공통*/
.gx_ptop_gallDiv{position:relative;}
.gx_ptop_gallULa{position:relative; margin:0; padding:0; list-style:none;}
.gx_ptop_gallULa:after{content:""; display:block; clear:both;}
.gx_ptop_gallULa li{position:relative; float:left; margin-left:10px; margin-bottom:25px; vertical-align:top;} /*갤러리 좌측,하단간격*/
.gx_ptop_gallULa li:first-child{margin-left:0;}
.gx_ptop_gallULa li p{margin:0; padding:0;}
.gx_ptop_gallULa li .thumb{
	/*이미지 영역*/
	position:relative; display:block; overflow:hidden; cursor:pointer;
	border-radius:6px;
		-moz-border-radius:6px;
		-webkit-border-radius:6px;
}
.gx_ptop_gallULa li .thumb:hover{}
.gx_ptop_gallULa li .thumb.noimg{background-color:#f0f0f0;}
.gx_ptop_gallULa li .thumb img{/* width:100%; */ transition:all .4s;}
.gx_ptop_gallULa li .thumb:hover img{transform:scale(1.06);}
.gx_ptop_gallULa li .thumb .fa-picture-o{position:absolute; top:50%; left:50%; transform:translateX(-50%); margin-top:-10px; font-size:30px; color:#ccc;} /*이미지 없음시 아이콘*/
.gx_ptop_gallULa li .comment{position:absolute; right:6px; bottom:5px; padding:1px 6px; background-color:rgba(0,0,0,0.3); font-size:12px; font-weight:700; color:#fff; border-radius:15px; transition:all .4s;}
.gx_ptop_gallULa li .comment i{vertical-align:top; margin-top:3px; font-size:12px; color:#ccc;}
.gx_ptop_gallULa li .thumb:hover .comment{/* bottom:35px; */}/* 오버 */
.gx_ptop_gallULa li .title{position:absolute; width:100%; left:0; bottom:-30px; padding:0 10px; height:24px; line-height:24px; background-color:rgba(0,0,0,0.1); font-size:12px; font-weight:700; color:#000; visibility:hidden; transition:all .4s, visibility 0.2s;}
.gx_ptop_gallULa li .thumb:hover .title{bottom:0; background-color:rgba(0,0,0,0.4); color:#fff; visibility:visible;} /* 오버 */
.gx_ptop_gallULa li .hot{position:absolute; top:8px; left:8px; padding:4px 3px 3px 4px; background-color:#ff0000; font-size:10px; color:#fff; border-radius:50%; z-index:3;}
.gx_ptop_gallULa li .caName{
	position:absolute; top:0; left:0; font-size:12px; color:#fff; padding:3px 4px; background-color:rgba(0,0,0,0.60); z-index:3;
	border-radius:0 0 6px 0;
		-moz-border-radius:0 0 6px 0;
		-webkit-border-radius:0 0 6px 0;
}
.gx_ptop_gallULa li .title .profile_img img{
	margin-top:-2px; width:17px; height:auto;
	border-radius:2px;
		-moz-border-radius:2px;
		-webkit-border-radius:2px;
}
.gx_ptop_gallULa li.empty_li{width:100%; height:200px; line-height:200px; background-color:#f0f0f0; text-align:center; border-radius:8px;}
.gx_ptop_gallULa.tapyes{padding-top:10px;} /*tap 있을때 상단간격*/
.gx_ptop_gallULa .xi-new-o.new{color:#ff0000; vertical-align:top; margin-top:3px;}

/*2타입*/
.gx_ptop_gallULa li.type2 .comment, .gx_ptop_gallULa li.type2 .thumb:hover .comment{bottom:auto;}
.gx_ptop_gallULa li.type2 .comment{top:10px;}
.gx_ptop_gallULa li.type2 .title, .gx_ptop_gallULa li.type2 .thumb:hover .title{bottom:0; background-color:rgba(0,0,0,0.4); color:#fff; visibility:visible;}

/*3타입*/
.gx_ptop_gallULa li.type3 .thumb{border-radius:50%;} /*이미지*/
.gx_ptop_gallULa li.type3 .comment{right:auto; left:50%; transform:translateX(-50%);}
.gx_ptop_gallULa li.type3 .thumb:hover .comment{bottom:55px;}
.gx_ptop_gallULa li.type3 .title{height:48px; line-height:48px; text-align:center;}
.gx_ptop_gallULa li.type3 .title .sv_member{color:#fff;} /* .sv_member 는 닉네임변수에 클래스 */


/*4타입*/
.gx_ptop_gallULa li.type4{margin-bottom:17px;}
.gx_ptop_gallULa li .titleType4{
	display:block; margin-top:6px; padding-left:2px; font-size:13px; color:#5c5c5c; font-weight:700;
	/* 한줄... */ 
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
}
.gx_ptop_gallULa li .titleType4:hover{color:#222;}
.gx_ptop_gallULa li.type4 .thumb:hover .comment{/* bottom:10px !important; */}/* 오버 */
.gx_ptop_gallULa li.type4 .title, .gx_ptop_gallULa li.type4 .thumb:hover .title{display:none;}
.gx_ptop_gallULa li:nth-child(n+15){display:none !important;}/*15개 이후로 삭제*/


/* 리셋css 
.gxcon_area .skinDiv:nth-of-type(1) .gx_ptop_gallULa li:nth-child(n+2),
.gxcon_area .skinDiv:nth-of-type(2) .gx_ptop_gallULa li:nth-child(n+2),
.gxcon_area .skinDiv:nth-of-type(3) .gx_ptop_gallULa li:nth-child(n+2){
	margin-left:10px;
}
*/