@charset "utf-8";

#youtubeList .top-intro {color:#fff;}
#youtubeList .video-lists-wrapper {margin-top:137px;margin-bottom: 100px;}
#youtubeList .video-lists-wrapper .videos {display: flex;flex-wrap: wrap;}
#youtubeList .video-lists-wrapper .videos li {float: left;width: calc(50% - 20px);text-align: center;margin-bottom: 50px;} 
#youtubeList .video-lists-wrapper .videos li:nth-child(odd) { margin-right: 20px; } 
#youtubeList .video-lists-wrapper .videos li:nth-child(2n) { margin-left: 20px; } 
#youtubeList .video-lists-wrapper .videos li .thumb-wrap { cursor:pointer; position: relative; } 
#youtubeList .video-lists-wrapper .videos li .thumb-wrap:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.4); } 
#youtubeList .video-lists-wrapper .videos li .thumb-wrap:hover:after { background: rgba(0,0,0,0.1); } 
#youtubeList .video-lists-wrapper .videos li .thumb-wrap .video-thumb { display: block; width: 100%; } 
#youtubeList .video-lists-wrapper .videos li .video-title {text-align: left;font-size: 18px;font-weight: bold;word-break: keep-all;margin: 10px 0 0;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} 
#youtubeList .video-lists-wrapper .videos li .video-subs { display:none; } 

#youtubeList .play-ico { position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); width: 80px; height: 80px; display: block; border: 2px solid #fff; border-radius: 50%; padding: 0; margin: 0 auto; z-index:10; } 
#youtubeList .play-ico:after { position: absolute; top: 50%; left: 50%; transform: translate(-40%,-50%); display: block; content: ''; box-sizing: border-box; border-color: transparent transparent transparent #fff; border-style: solid; border-width: 16px 0 16px 24px; } 
#youtubeList .more_view_content { display: block; margin: 0 auto; background: #900020; border: none; color: #fff; cursor: pointer; border-radius: 5px; font-weight: bold; padding: 10px 40px; font-size: 24px; margin-bottom:30px;} 

/* 동영상 재생 레이어팝업 */
#youtubeList .layer_popup_wrap { display: none; } 
#youtubeList .layer_popup_wrap .video-layer-shadow {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.8);z-index: 5001;} 
#youtubeList .layer_popup_wrap .layer_popup {box-sizing:border-box;position: fixed;z-index: 5002;text-align: center;top: 50%;left: 50%;transform: translate(-50%, -50%);color: #fff;} 
#youtubeList .close_layer_popup { position: absolute; left: 50%; top: -50px; transform: translateX(-50%); cursor: pointer; border: 1px solid #fff; width: 40px; height: 40px; transition: 0.2s; opacity: 0.7;} 
#youtubeList .close_layer_popup:hover { opacity: 1; } 
#youtubeList .close_layer_popup:before,
#youtubeList .close_layer_popup:after { position: absolute; left: 19px; top: 3px; content: ""; height: 34px; width: 2px; background-color: #fff; #fff; } 
#youtubeList .close_layer_popup:before { transform: rotate(45deg); } 
#youtubeList .close_layer_popup:after { transform: rotate(-45deg); } 
#youtubeList .layer_popup_wrap .layer_popup .video-and-text { display: flex; margin-top: 30px; } 
#youtubeList .layer_popup_wrap .layer_popup .video-and-text .play-youtube { position: relative; width: 60%; padding-bottom: 44.25%; background:#000; } 
#youtubeList .layer_popup_wrap .layer_popup .video-and-text .play-youtube > iframe { position: absolute; width: 100%; height: 100%; left: 0; top: 0; } 
#youtubeList .layer_popup_wrap .layer_popup .video-and-text .text-cont { width: 40%; background: #fff; padding: 45px 20px; box-sizing: border-box; } 
#youtubeList .layer_popup_wrap .layer_popup .video-and-text .text-cont .tit { color: #333; text-align: left; font-size: 16px; font-weight: bold; padding-bottom: 20px; border-bottom: 1px solid #dbdbdb; } 
#youtubeList .layer_popup_wrap .layer_popup .video-and-text .text-cont .cont { color: #333; text-align: left; font-size: 14px; white-space:pre-line;}