@charset "UTF-8";

/* ==================== 메인페이지 유튜브 모듈 ==================== */

#_youtubeBbs{padding: 20px 0 70px;}
.m-video-inner{position: relative; width: 100%;}

/* ------------------ .m-video-head ------------------ */
.m-video-head{position: relative; margin-bottom: 20px;}
.m-video-head h2{display: inline-block; padding-right: 60px; font-size: 28px; font-weight: 500; color: #000; background: url('../images/icon_youtube.png') no-repeat center right / auto;}
.m-video-h-b{color: #126144; font-weight: 600;}

/* ------------------ .m-video-cont ------------------ */
.m-video-cont{display: grid; grid-template-columns: 50% 48%; justify-content: space-between;}
.m-video-cont img{border: 1px solid #ddd; box-sizing: border-box; border-radius: 10px;}
.m-video-thumb:hover,.video-link-li:hover{cursor: pointer;}

/* .m-video-col1 */
.m-video-thumb{height: 100%; display: grid;}
.m-video-thumb img{width: 100%; height: auto;}
.m-video-thumb-txt{display: flex; flex-direction: row; justify-content: space-between; /*align-items: center; margin-top: 5px;*/}
.m-video-thumb-txt .th-tit{font-size: 22px; font-weight: 500; line-height: 1.5; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.m-video-thumb-txt .th-date{font-size: 14px; color: #666; min-width: 68px;}

/* .m-video-col2 */
.m-video-slider-item-inner{display: grid;grid-template-columns: repeat(2, 49%);grid-column-gap: 2%;grid-template-rows: 1fr 1fr;grid-row-gap: 1vw;}
.video-link-li{height: 100%;}
.video-link-li .li-img{height: calc(100% - 36px);}
.slide-video-link img{width: 100%; height: 100%; max-height: 196px;}
.video-link-li .li-tit{height: 36px;}
.slide-video-link .tit{font-size: 18px; font-weight: 400; line-height: 2; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/* ------------------ .m-video-controller ------------------ */
.m-video-controller{display: flex; position: absolute; top: 0; right: 48px;}
.m-video-controller input{width: 48px; height: 48px; border: 0; border-radius: 50%; margin-right: 10px; cursor: pointer; text-indent: -9999px;}
.m-video-controller .prev{background: #ff8500 url('../images/icon_left.png') no-repeat center;}
.m-video-controller .next{background: #ff8500 url('../images/icon_right.png') no-repeat center;}

.m-video-moreBtn{position: absolute; top: 0; right: 0; width: 48px; height: 48px;}
.m-video-moreBtn a{display: block; width: 100%; height: 100%; border-radius: 50%; cursor: pointer; background: #252e2b url('../images/icon_plus.png') no-repeat center;}

/* ------------------ popup #yt-popup ------------------ */
/* #yt-popup{display: none; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.9); transition: all 0.4s cubic-bezier(0.5, 0, 0.3, 1);}
#yt-popup .youtube{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);} */






/* ==================== media query ==================== */
@media only screen and (min-width:861px){
  .m-video-controller input:hover{opacity: .7;}
  .m-video-moreBtn:hover a{transform: rotate(-180deg);}
}

@media only screen and (max-width:1280px){
  #_youtubeBbs{padding: 20px 0 40px 0;}
}
@media only screen and (max-width:860px){
  /* .m-video-cont */
  .m-video-cont{grid-template-columns: 1fr; gap: 30px;}
  .m-video-thumb-txt{margin-top: 10px;}
  .m-video-slider-item-inner{grid-template-columns: repeat(2, calc(50% - 10px)); grid-column-gap: 20px; grid-row-gap: 15px;}

  /* .m-video-controller */
  .m-video-controller{top: 8px; right: 40px;}
  .m-video-controller input{width: 40px; height: 40px; margin-right: 8px;}
  .m-video-moreBtn{top: 8px; width: 40px; height: 40px;}
  .m-video-controller .prev,
  .m-video-controller .next,
  .m-video-moreBtn a{background-size: 50%;}
}
@media only screen and (max-width:620px){
  .m-video-head h2{font-size: 26px;}
  .m-video-controller{display: none;}
  .m-video-moreBtn{top: 6px;}
}
@media only screen and (max-width:480px){

}
@media only screen and (max-width:380px){

}