@charset "utf-8";

/* List */
.list-item .tack-check { right: 10px; bottom: 10px; z-index: 1; position: absolute;	font-weight:normal; }
.list-item .tack-check-left { left: 10px; bottom: 10px; z-index: 1; position: absolute;	font-weight:normal; }
.list-item h2 { display:block; font-size:16px; line-height:22px; margin:10px 5px; text-align:center; }
.list-item .list-img { position:relative; overflow:hidden; }
.list-item .list-img img { width:100%; height:auto; }
.list-item .list-date { position:absolute; bottom:10px; padding:0px 10px; font-size:12px; line-height:23px; }
.list-item .list-date.left { left:0px; }
.list-item .list-date.right { right:0px; }
.list-item .list-details { padding:0 3%; }
.list-item .list-details .member, .list-item .list-details .guest { color:#787878 !important; }
.list-row.clearfix { float:none !important; padding:0 !important; margin:0 !important; width:100% !important }

/* Responsive */
@media all and (max-width:767px) {
	.responsive .list-row { width:50% !important }
}
@media all and (max-width:480px) {
	.responsive .list-row { width:100% !important }
}



/****기본 end******************************************************************************************************************/

/*리스트*/
.list-wrap .list-row .img-wrap img{width:100.5%;height:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);}
.list-wrap .list-item {position:relative;}
.list-container .list-item .edit_btn {display:inline-block; width:50px; height:30px; line-height:30px; font-size:14px; background-color:#c80b16; color:#fff; text-align:center; position:absolute; top:0; left:0; z-index:900;}
.list-container .list-item .list_box {position:relative;}
.list-container .list-item .list_box b.cate {
	font-size:18px; color:#fff; font-weight:500; width:120px; padding:10px 0 18px; background-image:url("/thema/Basic/img/category_tag.png"); background-repeat:no-repeat; background-size:contain;
	position:absolute; top:20px; right:-9px; z-index:10;-webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;
}
.list-container .list-item .list_box:focus b.cate,
.list-container .list-item .list_box:hover b.cate {background-image:url("/thema/Basic/img/category_tag_hover.png");}
.list-container .list-item .list_box .hover_box {}
.list-container .list-item .list_box .hover_box::after {
	content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.7); opacity:0; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;
	background-image:url("/thema/Basic/img/video_hover.png"); background-repeat:no-repeat; background-position:center;
	}
.list-container .list-item .list_box:focus .hover_box::after,
.list-container .list-item .list_box:hover .hover_box::after {opacity:1;}
.list-container .list-item .list_box h3.list_title {text-align:left; font-size:20px; line-height:130%; font-weight:600; margin-top:25px; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;}
.list-container .list-item .list_box:focus h3.list_title,
.list-container .list-item .list_box:hover h3.list_title {color:#c80b16; text-decoration:underline;}

/*유튜브 모달*/
.youtube_btn{width:100%;}
.youtube_dummy{  display:none; z-index:99; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); }
#youtube_modal{ display:none; z-index:9999; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); width:90%; max-width:1200px; }
#youtube_modal:focus{outline-color:#0000FF;}
#youtube_modal #youtube_modal_close{ position:absolute; bottom:100%; right:0; width:60px; height:60px; font-size:0px; background-color:#333;; border:0px;}
#youtube_modal #youtube_modal_close .bar{ position:absolute; top:50%; left:50%;  width:20px; height:1px; background:#fff;
transform:translate(-50%,-50%) rotate(45deg); -webkit-transform:translate(-50%,-50%) rotate(45deg); -moz-transform:translate(-50%,-50%) rotate(45deg); 
}
#youtube_modal #youtube_modal_close .bar2{ transform:translate(-50%,-50%) rotate(-45deg); -webkit-transform:translate(-50%,-50%) rotate(-45deg); -moz-transform:translate(-50%,-50%) rotate(-45deg); }
#youtube_modal .inner_box{ overflow:hidden; }
#youtube_modal .inner_box .apms-autowrap{ margin:0px; max-width:1200px;}
#youtube_modal .video_caption{position: fixed; top: -99px; left: -99px; opacity: 0; font-size: 0px; padding: 0px; margin: 0px;}


@media all and (max-width:1024px){
	body .list-wrap .list-container {margin-right:-15px;}
	body .list-wrap .list-item {margin-right:15px; margin-bottom:40px;}
	.list-container .list-item .list_box h3.list_title {font-size:18px; margin-top:15px;}
	.list-container .list-item .list_box .hover_box::after {background-size:50px;}
	#youtube_modal #youtube_modal_close {width:50px; height:50px;}
}

@media all and (max-width:768px){
	body .list-wrap .list-container {margin-right:-10px;}
	body .list-wrap .list-item {margin-right:10px; margin-bottom:35px;}
	.list-container .list-item .list_box h3.list_title {font-size:16px; margin-top:10px;}
	.list-container .list-item .list_box .hover_box::after {background-size:45px;}
	#youtube_modal #youtube_modal_close {width:40px; height:40px;}
	#youtube_modal #youtube_modal_close .bar {width:15px;}
}

@media all and (max-width:480px){
	.list-container .list-item .list_box h3.list_title {font-size:15px;}
	#youtube_modal #youtube_modal_close {width:30px; height:30px;}
	#youtube_modal #youtube_modal_close .bar {width:10px;}
}