@charset "utf-8";
@import url("../default_/style.css");
@import url("../gallery/style.css");


#content:has(#xb_list) .md_top_cont { display:block; }
#content:has(#xb_view) .md_top_cont { display:none; }
#content:has(#xb_view) #xb_list { display:none; }


.media_search { position:relative; width:100%; background:#f6f6f6; padding:24px 15px; display:flex; align-items:center; justify-content:center; box-sizing:border-box; flex-wrap:wrap; margin-bottom:30px; }
.media_search #xb_select { border-radius:5px; position:relative; height:45px; line-height:45px; box-sizing:border-box; border:1px solid #dddddd; font-size:12px; color:#888; padding:0 25px 0 12px; -webkit-appearance:none; /* for chrome */

   -moz-appearance:none; /*for firefox*/

   appearance:none; background:#fff url(./img/select_arrow.png) no-repeat; background-position:right 10px top 15px; }
   
.media_search .input1 { background:#fff; border:1px solid #dddddd; height:45px; line-height:43px; font-size:16px; box-sizing:border-box; color:#333333; padding:0 15px; border-radius:5px; margin:0 9px; }
.media_search .list_search_btn { border:0 none; display:flex; width:80px; height:45px; line-height:45px; background:#333840 url(./img/all_sic.png) right 15px center no-repeat; border-radius:5px; cursor:pointer; font-size:16px; color:#fff; text-align:left; padding:0 0 0 15px; box-sizing:border-box;  }





.board_gallery_default ul li { float:none !important; }

.comment_write_sm { margin-top:20px; }
table.board_write td .custom_file input { opacity:0; }
table.board_write td .custom_file input {  }
.sum_list { 
    box-sizing: border-box;
    background: #f7f7f7;
	width: 100%;
    padding-left: 12px;
    min-height: 28px;
    margin-bottom: 5px;
}
.sum_list p {line-height: 24px;
    padding: 10px 0 10px 0; display:none; }
.sum_list p.sum_on { display:block; }
 	
	
.sum_list .f_del { position:relative; padding:0 0 0 26px; z-index:1;  vertical-align:top; display:inline-block; font-size:13px; text-indent:-99999px; width:35px; box-sizing:border-box; margin-right:8px; border-right:1px dashed #aaa; cursor:pointer;}
.sum_list .f_del::before { content:""; display:block; width:21px; height:21px; position:absolute; left:0; top:2px; box-sizing:border-box; border:1px solid #aaa; border-radius:5px; transition:all 0.4s; border-radius:50%; border-color:#fd6180; background:#fd6180; box-shadow:1px 1px 2px rgba(0,0,0,0.3);}
.sum_list .f_del::after { content:""; display:block; width:9px; height:10px;  background:url(./img/cross2.png) left top no-repeat; position:absolute; left:6px; top:8px; transition:all 0.4s;  }

.sum_list .f_del:hover::before { -webkit-animation: animOnTransform 1s 1 forwards;
          animation: animOnTransform 1s 1 forwards;   }
.sum_list .f_del:hover::after { -webkit-animation: animOnTransform 1s 1 forwards;
          animation: animOnTransform 1s 1 forwards; }
		  
/*리스트*/
.new_mvdef { margin:0px 0 40px;  background:#fff; padding:0px 0; position:relative; }
.new_mvdef .titlebox { position:relative; z-index:1; box-sizing:border-box;  padding:12px 0px 13px 0px; display:flex; align-items:center; border-bottom:1px dashed #ddd; margin-bottom:17px;  }
.new_mvdef .titlebox .category_title { font-size:23px; font-weight:bold; color:#111; padding:0px 0 0 0; }
.new_mvdef .titlebox .now_leng { font-size:14px;  font-weight:400; color:#555; margin:0 0 0 auto; }
.new_mvdef .titlebox .now_leng span { color:#1c69f6; }
.new_mvdef .main_btn {  display:flex; margin:0 0 0 10px; }
.new_mvdef .main_btn li {   }
.new_mvdef .main_btn li a{display: block;width: 36px;height: 36px;border-radius: 50%;text-indent: -99999px; box-sizing:border-box; border:1px solid #ddd; }
.new_mvdef .main_btn li.gbtn01 a{background:#fff url(./img/q_btn03.png)center center no-repeat;margin-right: 8px;}
.new_mvdef .main_btn li.gbtn03 a{background:#fff url(./img/q_btn04.png)center center no-repeat;}

.new_mvdef .new_mvslick { box-sizing:border-box; width:100%;  position:relative; z-index:1;}
.new_mvdef .slick-track { float:left; text-align:center; margin-left: auto;
  margin-right: auto; }

.new_mvdef .slick-slide {  border:0 none;  text-align:center; margin:0 0px 0 0; padding:0 8px; box-sizing:border-box; }


.new_mvitem { position:relative; overflow:hidden; border-radius:0px; background:#fff; display:block !important;}
.new_mvitem a { display:block; position:relative; }
.new_mvitem .media_pic { height:210px; overflow:hidden; width:100%; position:relative; border-radius:10px; }
.new_mvitem .media_pic img { height:210px; width:100%; transition:all 0.5s; transform:scale(1); object-fit: fill;}
.new_mvitem a:hover .media_pic img { transform:scale(1.1); }
.new_mvitem .media_pic span { content:""; display:block; width:48px; height:48px; background:#fff url(./img/media_search.png) center center no-repeat; position:absolute; right:11px; bottom:10px; z-index:2; border-radius:50%; box-shadow:0 2px 2px rgba(0,0,0,0.3);}
.new_mvitem a:hover .media_pic span::before { content: "";
	display:block;
	 box-sizing:border-box;
	  
  position: absolute;
  border-radius: 50%;
  padding: 19px;
  border: 5px solid #ff585d;
  opacity: 1;
  left:0px;
    top:0px;
  animation-name: pulse-border;
  animation-duration: 1.5s;
  animation-timing-function: ease-out;
 animation-fill-mode:forwards;  }

@keyframes pulse-border {
  0% {
    padding: 19px;
    opacity: 0.75;
	left:0px;
    top:0px;
  }
  75% {
    padding: 38px;
    opacity: 0;
	left:-19px;
    top:-19px;
  }
  100% {
    opacity: 0;
	
  }
}



.new_mvdef dl {  border-top:0 none; padding:8px 0 0; }
.new_mvdef .mvtitle input { position:absolute; left:10px; top:10px; z-index:1; width:15px; height:15px; }
.new_mvdef .mvtitle { font-weight:600; color:#333; display:block; box-sizing:border-box; padding:0px 0px; font-size:16px; text-align:left; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.new_mvdef dd.info { text-align:left; padding:0 0px; margin-top:3px;  }
.new_mvdef dd.info p { display:inline-block; vertical-align:top; position:relative; overflow:hidden; font-size:14px; color:#777; line-height:20px; }

.new_mvdef dd.info p.gal_ic1 { padding:0 15px 0 20px; }

.new_mvdef dd.info p.gal_ic2 { padding:0 0 0 0px; }


.new_media_board div.no_images { height:75px; line-height:75px;  width:100%; display:block; width:100%; position:relative; border:1px solid #ddd; box-sizing:border-box; text-align:center; font-size:16px; border-left:0 none; border-right:0 none;}


/*보기화면*/
.media_board_view { display:flex; flex-wrap:wrap; align-items:flex-start; }
.media_board_view .new_mov_cont { width:calc(100% - 430px); }
.media_board_view .new_mov_cont .board_mov_view { width:100%; height:500px; position:relative; }
.media_board_view .new_mov_cont .board_mov_view::before { content:"등록된 영상이 없습니다"; display:block; width:100%; height:100%; box-sizing:border-box; position:absolute; left:0; top:0; text-align:center; background:#f9f9f9 url(./img/mov_none.png) no-repeat center 150px; font-size:24px; font-weight:600; box-sizing:border-box; padding:310px 0 0 0; color:#aaa; }

.media_board_view .new_mov_cont .board_mov_view:has(video)::before,
.media_board_view .new_mov_cont .board_mov_view:has(iframe)::before { display:none; }

.media_board_view .new_mov_cont .board_mov_view video,
.media_board_view .new_mov_cont .board_mov_view iframe { display:block; margin:0px auto 6px; width:100%; height:500px; border:0 none; position:relative; z-index:1; }

.media_board_view .new_mov_cont .mov_info { }
.media_board_view .new_mov_cont .mov_info h4 { overflow:hidden; line-height:24px; font-size:20px; color:#333; font-weight:bold;  /* 여러 줄 자르기 추가 스타일 */
    white-space: normal;
    max-height: 48px;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; margin:15px 0 7px; }
.media_board_view .new_mov_cont .mov_info .v_info { display:flex; flex-wrap:wrap; }
.media_board_view .new_mov_cont .mov_info .v_info li { margin:3px 12px 3px 0; font-size:14px; color:#333; font-weight:500; position:relative; padding:0 0px 0 12px; }
.media_board_view .new_mov_cont .mov_info .v_info li::after { content:""; display:block; width:1px; height:12px; background:#ddd; position:absolute; left:0; top:calc(50% - 6px); }
.media_board_view .new_mov_cont .mov_info .v_info li:first-child { padding:0 0 0 0; }
.media_board_view .new_mov_cont .mov_info .v_info li:first-child::after { display:none; }
.media_board_view .new_mov_cont .mov_info .v_info li > span:first-child { margin-right:10px; color:#777; }

.media_board_view .new_board_view .board_img_view_box { box-sizing:border-box; padding:0 0 15px 0; word-break:break-all; margin-top:15px; line-height:24px; font-size:15px; color:#333; border-bottom:1px solid #ddd;  }
 .media_board_view .new_board_view .board_img_view_box .con_height {height: 48px;
  overflow: hidden;
  transition: height 0.4s ease; }
.media_board_view .new_mov_cont .mov_info .vmore {  }

.media_board_view #otherbox { width:400px; margin:0px 0 0 auto; height:580px; overflow-y:scroll; box-sizing:border-box; padding:0 10px 0 0; }
/* 스크롤바의 폭 너비 */
.media_board_view #otherbox::-webkit-scrollbar {
    width: 8px;
	border-radius: 20px;   
}

.media_board_view #otherbox::-webkit-scrollbar-thumb {
    background: #707070; /* 스크롤바 색상 */
    border-radius: 20px; /* 스크롤바 둥근 테두리 */
}

.media_board_view #otherbox::-webkit-scrollbar-track {
    background: #f3f3f3;  /*스크롤바 뒷 배경 색상*/
}


.media_board_view #otherbox .new_mvitem { padding:8px 10px; border-radius:10px; box-sizing:border-box; height:116px; border:2px dashed #fff; }
.media_board_view #otherbox .new_mvitem.active { background:#f9f9f9; border:2px dashed #ff595d; }
.media_board_view #otherbox .new_mvitem.active .media_pic span { display:none; }
.media_board_view #otherbox .new_mvitem.active .media_pic::before { content:"현재 게시물"; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0.8); position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; font-size:15px; color:#fff; font-weight:500; }

.media_board_view #otherbox .new_mvitem a { display:flex; width:100%; }
.media_board_view #otherbox .new_mvitem a .photo { width:170px; height:96px; overflow:hidden; }
.media_board_view #otherbox .new_mvitem a .photo img { display:block; width:100%; height:96px; object-fit:fill; }

.media_board_view #otherbox .new_mvitem a dl { margin:8px 0 0 auto; width:calc(100% - 180px); }
.media_board_view #otherbox .new_mvitem a dl input { display:none !important; }
.media_board_view #otherbox .new_mvitem a dl dt { line-height:20px; font-size:15px; color:#333; font-weight:500;  /* 여러 줄 자르기 추가 스타일 */
    white-space: normal;
    height: 60px;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical; }
.media_board_view #otherbox .new_mvitem a dl dd { font-size:13px; color:#555; }
.media_board_view .new_board_view .board_content p:last-child { margin-bottom:0px; }

/*내용더보기*/
.media_board_view .new_board_view .data_box { margin-top:0px; border-bottom:1px solid #ddd; padding-bottom:15px; }
.media_board_view .new_board_view .data_box dt { border-top:0 none;  }

.media_board_view .new_board_view { width:100%; margin:30px 0 0; position:relative; }
.media_board_view .view_more { padding:25px 0 0; width:100%; text-align:center; margin:0px 0 0; display:none; }
.media_board_view .view_more a { margin:0 auto 0; display:block; width:135px;  height:40px; line-height:38px; box-sizing:border-box; border-radius:150px; border:1px solid #222; text-align:center; font-size:16px; color:#222; font-weight:500; padding:0 15px; }
.media_board_view .view_more a::after { content:"▼"; display:inline-block; vertical-align:top; margin:0 0 0 5px; transform:rotate(0deg); transition:all 0.5s; }
.media_board_view .view_more a.a_on::after { transform:rotate(180deg);  }
.media_board_view .board_img_view_box img { max-width:800px; display:block; margin:0 auto 0; }
.media_board_view .board_img_view_box .board_img_view_con { margin-bottom:20px; font-size:15px; color:#333; }



@media all and (max-width:1024px) {
	
.media_search * { margin-top:4px; margin-bottom:4px; }
.media_search .input1 { width:calc(100% - 100px); }


/*보기화면*/
.media_board_view { display:block; }
.media_board_view .new_mov_cont { width:100%; }
.media_board_view .new_mov_cont .board_mov_view { width:100%; height:350px; }
.media_board_view .new_mov_cont .board_mov_view video,
.media_board_view .new_mov_cont .board_mov_view iframe {  height:350px; }

.media_board_view #otherbox { width:100%; margin:15px 0 0 0; height:232px; }


.media_board_view .new_mov_cont .board_mov_view::before {  background:#f9f9f9 url(./img/mov_none.png) no-repeat center 120px / 120px; font-size:18px; padding:260px 0 0 0; }

.media_board_view .new_mov_cont .board_mov_view:has(video)::before,
.media_board_view .new_mov_cont .board_mov_view:has(iframe)::before { display:none; }



}


@media all and (max-width:560px) {
.new_mvitem .media_pic { height:150px;   }
.new_mvitem .media_pic img { height:150px; }


}

@media all and (max-width:555px) {
.media_board_view .new_mov_cont .board_mov_view { width:100%; height:250px; }
.media_board_view .new_mov_cont .board_mov_view video,
.media_board_view .new_mov_cont .board_mov_view iframe {  height:250px; }

.media_board_view .new_mov_cont .board_mov_view::before {  background:#f9f9f9 url(./img/mov_none.png) no-repeat center 80px / 80px; font-size:18px; padding:160px 0 0 0; }

}


@media all and (max-width:392px) {
.new_mvitem .media_pic { height:120px;   }
.new_mvitem .media_pic img { height:120px; }


}