#bbs_container {
	font-family: 'Noto Sans KR', 'Malgun Gothic', dotum, Sans-serif, AppleGothic;
}

/* 갤러리 기본 스킨 */
#bbs_container UL.bbsVideoZone {
	border:0;
	border-top:3px solid #222;
	border-bottom:1px solid #222;
	padding:2rem 0;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;

}
#bbs_container .bbsDivsion + UL.bbsVideoZone {
	border-top-width:1px;
}
#bbs_container UL.bbsVideoZone::after {
	display:block;
	content:'';
	clear:both;
}
#bbs_container UL.bbsVideoZone > li {

	position: relative;
	width: calc(100% / 3 );
	padding:3rem 1.5rem 1rem;
}

@media (max-width: 768px) {
	#bbs_container UL.bbsVideoZone > li {
		width: calc(100% / 2 );
		padding:3rem 0.75rem 1rem;
	}
}



#bbs_container UL.bbsVideoZone > li > .bbsVideoEdge {
	position: relative;
	width:100%;
	height: 0;
	padding-bottom: calc(56.25% + 5rem);
}
#bbs_container UL.bbsVideoZone > li > .bbsVideoEdge > .bbsVideoContainer {
	content:'';
	display:block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;

}

#bbs_container UL.bbsVideoZone > li .bbsVideoPic {
	position: relative;
	display:block;
	border:1rem solid #fff;
	box-shadow:0 0 0 1px #ccc;
	background-color:#fff;
	overflow:hidden;
	width:100%;
	height: calc(100% - 5rem);
}
#bbs_container UL.bbsVideoZone > li .bbsVideoPic img {
	width:100%;
	height:100%;
	object-fit:cover;
	transform: scale(1);
	transition: all ease .5s 0s !important;
}

#bbs_container UL.bbsVideoZone > li .bbsVideoPic:hover img {
	transform: scale(1.25);
}

#bbs_container UL.bbsVideoZone .subject {
/* #bbs_container UL.bbsVideoZone .bbsVideoPlay_youtube {*/
	width: 100%;
    display: block;
	margin-top:1.5rem;

	font-size:1.65rem;
	font-weight:600;
	color:#2E313D;
	background:transparent;
	border:0;

	overflow:hidden;
	word-wrap: normal;
	white-space:nowrap;
	text-overflow:ellipsis;
}


/* 갤러리 공지사항 */
#bbs_container UL.bbsVideoZone > li.cell_notice {
	float:none;
	padding:0;
	width: 100%;
}
#bbs_container UL.bbsVideoZone > li.cell_notice::after {
	display:block;
	content:'';
	clear:both;
}
#bbs_container UL.bbsVideoZone > li.cell_notice:first-of-type {
	/* margin-top:-1.6rem; */
}

#bbs_container .bbsDivsion + UL.bbsVideoZone {

	padding-top:0;

}





.bbsVideoBase {

	position:fixed;
	top:50%;
	left:50%;
	width:0;
	height:0;
    z-index: 10000;
    background: rgba(0,0,0,.45);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	opacity: 0;
	transition: all .5s;
}
.bbsVideoBase.active {
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity: 1;
}
.bbsVideoBase.active > .btn-close {
	/* margin-left:60rem; */
    position: absolute;
    top: 1rem; 
    right: 1rem;

}

.bbsVideoBase .bbsVideoEdge {

    position: relative;
	z-index:10100;
	width: 100%;
    max-width: 80%; 
	max-height:80%;
	border:2px solid #000;
	background-color:#000;
	box-shadow: 1rem 1rem 2rem 0rem rgba(0,0,0,0.35);
    margin: 1rem auto 0; 

}

.bbsVideoBase .bbsVideoEdge::after {
	content:'';
	display:block;
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; 
}

.bbsVideoBase .bbsVideoEdge #bbsVideoPlayer {
    position: relative;
    width: 100%;
    height: 100%; 
}

.bbsVideoBase .bbsVideoEdge #bbsVideoPlayer IFRAME {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%; 
} 


.bbsVideoBase .bbsVideoEdge #bbsVideoPlayer > DIV ,
.bbsVideoBase .bbsVideoEdge #bbsVideoPlayer > video {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%; 

} 

#bbs_container .video-js .vjs-big-play-button {
	background-color: rgba(43, 51, 63, 1);
	border-radius: 5rem;
}
#bbs_container .video-js:hover .vjs-big-play-button, .video-js .vjs-big-play-button:focus {
	background-color: rgba(43, 51, 63, 0.3);
	color: #000;
	border-color:rgba(0,0,0,.5);
}















/* LIST */
#bbs_container UL.bbsVideoZone > li.cell_notice > table {
	width:100%;
	margin:auto;
	border-spacing:0;
	padding:0;
	border:0;
	border-collapse:collapse;
	table-layout:fixed;

}

#bbs_container UL.bbsVideoZone > li.cell_notice > table > thead > tr > th ,
#bbs_container UL.bbsVideoZone > li.cell_notice > table > tbody > tr > th ,
#bbs_container UL.bbsVideoZone > li.cell_notice > table > thead > tr > td ,
#bbs_container UL.bbsVideoZone > li.cell_notice > table > tbody > tr > td {

	text-align:center;
	vertical-align:middle;
	padding:1rem 0.5rem;
	border:0;
	border-bottom:1px solid #ccc;
	cursor:default;
	font-size:1.6rem;
}
#bbs_container UL.bbsVideoZone > li.cell_notice > table > thead > tr > th ,
#bbs_container UL.bbsVideoZone > li.cell_notice > table > tbody > tr > th {
	background-color:#f5f5f5;
	color:#444;
	letter-spacing:0;
}

#bbs_container UL.bbsVideoZone > li.cell_notice > table > tbody > tr:hover > td {
	background:#fafafa;
}
#bbs_container UL.bbsVideoZone > li.cell_notice > table td.cell_subject {
	text-align:left;
	overflow:hidden;
	word-wrap: normal;
	white-space:nowrap;
	text-overflow:ellipsis;
}
#bbs_container UL.bbsVideoZone > li.cell_notice > table td.cell_subject > a:hover {
	text-decoration: underline;
}
#bbs_container UL.bbsVideoZone > li.cell_notice > table td.cell_subject .comment {
	margin-left:0.8rem;
	font-size:1.2rem;
	color:#4A89DC;
}
#bbs_container UL.bbsVideoZone > li.cell_notice > table > tbody td.cell_date {
	text-align:right;
}







/* VIEW */
.videoContent {
	width:100%;
	height:auto;
	text-align:center;
	margin:5rem 0 10rem;
}