

@charset "utf-8";


/* -------------------
	vod_pop_viewer 
---------------------- */

.wrap { width:100%; margin:0 auto; height:100%; background-image: linear-gradient(to left, #485572, #46738b);}

/* lnb */
.lnb { transition-duration:0.3s; position:fixed; top:0; left:0; width:300px; height:100%; background:#fff;}
.lnb .logo { position:relative; text-align:center; height:80px; line-height:80px;}
.lnb .logo img { width:90%; vertical-align:middle;}
.lnb .lnb_list { padding:10px; padding-top:0px;}
.lnb .list_area { position:relative;}
.lnb .list_area .menu_btn { cursor: pointer ; height:56px; line-height:56px; background:url('../img/pop/bg_tit.png') no-repeat center; cursor:pointer; font-size:24px; text-align:center; color: #fff; border-radius:5px; font-family:'NanumGothicBold', sans-serif; margin-bottom:6px;}
.lnb .list_area .cont { display:block; border:1px #ccc solid; border-radius:5px; overflow:hidden; font-family:'NanumBarunGothic', sans-serif; /*max-height:823px;*/ height:84vh;  overflow-y:auto;}
.lnb .list_area .cont a { background-color:#fff; display:block; padding-left:13px; height:48px; line-height:48px; color:#444; border-bottom:1px #ccc solid; border-top:0px; font-size:17px; letter-spacing:-0.08em;}
.lnb .list_area .cont a:hover { color:#3d4da5;}
.lnb .list_area .cont a.select { background:#ecedf4 url('../img/pop/icon_select.png') no-repeat right center; color:#3d4da5;}
.lnb .list_area .cont a:last-child { }
.lnb .arrow_icon { display:inline-block; width:30px; height:30px; position:absolute; top:13px; right:15px;}
.lnb .arrow_icon .arrow { display:inline-block; width:10px; display:inline-block; height:1px; background:#fff; position: absolute; top:45%; }
.lnb .arrow_icon .arrow.first {transform: rotate(-45deg);}
.lnb .arrow_icon .arrow.second {transform: rotate(45deg); left:8px;}
/* toggle */.lnb.toggle {
	-webkit-transform: translate(-220px, 0);
    -ms-transform: translate(-220px, 0);
    -o-transform: translate(-220px, 0);
    transform: translate(-220px, 0);
	transition-duration:0.3s;
}
.lnb.toggle .logo { overflow:hidden; background:url('../img/pop/icon_council.png') no-repeat 237px center;}
.lnb.toggle .logo img { display:none; }
.lnb.toggle .arrow_icon { display:none;}
.lnb.toggle .list_area .menu_btn { background:#433b8f url('../img/pop/icon_movie.png') no-repeat center; background-size:28px; position:absolute; top:80; right:0px; display:block; width:60px; height:60px; cursor:pointer; font-size:0px; border-radius:30px;}
.lnb.toggle .list_area .cont { display:none; border:0px;}
.lnb.toggle .list_area .cont a { display:none; border:0px;}

/* pop_container ------------------------------------ */
.pop_container { padding-left:300px; width:100%; height:100%; overflow-y:auto; z-index:800; transition-duration:0.3s;}
.pop_container.toggle { padding-left:80px; transition-duration:0.3s; width:100%;}

/* head */
.head {position:relative; min-height:80px; padding:0 70px;}
.head .logo { display:none;}
.head .tit { height:auto; padding-top:10px; padding-bottom:10px;}
.head .tit .title { font-size:22px; font-family: "NanumBarunGothic"; font-weight:normal; line-height:34px; display:inline-block; color:#00ffff; margin-right:15px;}
.head .tit .agenda { font-size:17px; font-family: "NanumGothic"; font-weight:normal; line-height:24px; color:#fff; letter-spacing:-0.02em;}
.head .tit .agenda span { font-size:13px; font-weight:bold; padding:2px 10px 3px; margin-right:7px; color:#333; background-color:#fff; border-radius:5px;}
.head .btn_wrap { position: absolute; left:10px; top:10px;}
.head .menu_btn { position:absolute; top:0; left:0px; display:block; width:70px; height:80px; padding-top:33px; cursor:pointer;}
.head .menu_btn .bar {display:block; width:20px; margin:0 auto; height:1px; margin-top:5px; background:#fff; }
.head .menu_btn .bar:first-child {margin-top: 0;}
.head .player_down { cursor:pointer; position:absolute; top:24px; right:60px; display:inline-block; height:30px; line-height:28px; background:#fff url('../img/pop/btn_down01.png') no-repeat 12px center; border-radius:2px; padding:0 10px 0 36px;}
.head .player_down:hover { color:#FF6600;}
.head .close_btn { cursor:pointer; position:absolute; top:40px; right:20px; display:inline-block; width:45px; height:45px; background:#fff url('../img/pop/btn_close01.png') no-repeat center;
    -webkit-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%); border-radius:5px;
	}

/* content */
.content { height:auto; padding:0 15px 15px; position:relative; transition-duration:0.3s;}
.content.toggle { max-width:; transition-duration:0.3s;}

/* vod_player */
.vod_player { position:relative; float:left; width:54%; max-height:481px; background-color:#fff; overflow:hidden; border-radius:5px;}
.vod_player .player { height:481px; background:#333 url('../img/pop/bg_vod_player.png') no-repeat center; background-size:100% auto; font-size:0px;}
.vod_player.toggle { width:47%; transition-duration:0.3s;}

/* ai_text */
.ai_text { position:relative; clear:both; padding:5px 0; width:100%; border-bottom:1px #ccc dashed; margin-bottom:10px;}
.ai_text button { display:inline-block; height:30px; line-height:28px; padding:0 15px 0 33px; border:0px; color:#666; border-radius:5px; font-size:15px; cursor:pointer; font-family: "NanumGothicBold"; border:1px #666 solid; background:#fff url("../img/main/icon_ai.png") no-repeat 10px center; background-size:17px;}
.ai_text .text_area { position:relative; display:none; margin-top:-30px; border-radius:5px; background-color:#fff; padding:50px 0 20px;}
.ai_text .btn_open {}
.ai_text .btn_close {position:absolute; left:7px; top:7px; background-color:#67588b; color:#fff; padding:0 15px; background-image:none;}
.ai_text .view_aitxt { overflow-y:auto; height:200px; padding:0 20px;}
.ai_text .view_aitxt p { font-size:15px; background:url('../img/pop/icon_AIlist.png') no-repeat left 11px; padding:5px 0 5px 10px;}
.ai_text .view_aitxt .name { font-size:13px; padding:4px 10px; margin-right:5px; line-height:28px; border-radius:3px; color:#fff; background-color:#3366CC; font-family: "NanumGothicBold"; }
.ai_text .view_aitxt .speak { display:inline-block; background:#f5f5f5 url('../img/pop/icon_AIspeak.png') no-repeat 10px 11px; padding:5px 20px; color:#ff6600;} 

/* vod_info */
.vod_info { position:absolute; top:0px; left:55%; width:44%; transition-duration:0.3s;}
.vod_info.toggle { left:47.9%; width:51.3%; transition-duration:0.3s;}

/* member_info */
.member_info { height:130px; color:#fff;}
.member_info .cont_tit { background:url('../img/pop/icon_mike.png') no-repeat left center; background-size:17px; margin-left:117px; color:#fff; font-size:24px; line-height:36px; padding-left:25px; border-bottom:1px #8a95a7 dashed; margin-bottom:3px;}
.member_info .photo_box { position:absolute; left:0px; top:0px; width:100px; height:129px; background:#d3d6db url('../img/pop/pop_default.png') no-repeat center; font-size:0px; overflow:hidden; border-radius:5px}
.member_info .photo_box img { width:100%;}
.member_info dl { clear:both; padding:7px 10px 3px 0; margin-left:120px; font-size:14px; letter-spacing:-0.02em;}
.member_info dt { float:left; background: url('../img/pop/icon_mendot.gif') no-repeat left center; padding-left:10px; font-size:16px; font-family: "NanumBarunGothic"; font-weight:normal;}
.member_info dd { padding-left:90px; color:#ddd; font-size:16px;}

/* info_box */
.info_box { clear:both; margin-top:10px; overflow:hidden; background-color:#fff; border-radius:5px; border:5px #fff solid;}
.info_box .box_tit { display:none; background:url('../img/pop/stitle_view.png') no-repeat 5px center; color:#000; font-size:20px; line-height:34px; padding-left:25px; border-bottom:1px #4e6d9a solid; margin-bottom:5px; font-family:'NanumBarunGothic', sans-serif;}
.info_box .box_area { height:330px; padding:0px 5px; overflow-y:auto;}
.info_box .box_area li a { position:relative; padding:5px 80px 5px 110px; display:block; line-height:22px; font-size:15px; border-bottom:1px #ddd dashed;}
.info_box .box_area li p { position:absolute; left:0px; top:5px; width:100px; color:#fff; text-align:center; margin-right:8px; padding:2px 0; border-radius:3px; line-height:20px; font-size:13px;}
.info_box .box_area li .date { position:absolute; right:0px; top:5px;}
.info_box .box_area li .name { font-size:14px; color:#3366CC;}
.info_box .box_area .bg_clo01 { background-color:#7d8e97;}
.info_box .box_area .bg_clo02 { background-color:#318cbd;}
.info_box .box_area .bg_clo03 { background-color:#ff9724;}
.info_box .box_area .bg_clo04 { background-color:#47b3a1;}
.info_box .box_area .bg_clo05 { background-color:#8f7400}
.info_box .box_area .bg_clo06 { background-color:#03b120}
.info_box .box_area li.select a { color:#FF6600;}

/* 회의록보기 */
.minutes {}
.minutes .min_title { background-color:#339933 ; color:#fff; font-size:18px; line-height:36px; width:150px; text-align:center; display:inline-block; border-radius:5px 5px 0 0;}
.minutes .min_print { float:right;}
.minutes .btn_print { background:#fff url('../img/pop/pic_print.png') no-repeat 13px center; display:block; color:#666; padding:5px 13px 6px 38px; border:1px #dbdbdb solid; font-size:13px; border-radius:3px;}
.minutes .btn_print:hover { color:#FF6600;}
.minutes .min_list { font-size:15px; border-top:10px #fff solid; border-bottom:10px #fff solid; background-color:#fff; height:32.2vh; overflow-y:auto; padding:0px 30px; line-height:25px; border-radius:0 5px 5px 5px;}
.minutes .min_list .num { color:#339933; font-family:'NanumGothicBold', sans-serif; font-size:16px; }




@media all and (max-width:1024px) and (min-width:768px){

.wrap {width:100%; min-width:300px;}

/* lnb */
.lnb {
	-webkit-transform: translate(-220px, 0);
	-ms-transform: translate(-220px, 0);
	-o-transform: translate(-220px, 0);
	transform: translate(-220px, 0);
	}
.lnb .logo { background:url('../img/pop/icon_council.png') no-repeat 238px center;}
.lnb .logo img { display:none; }
.lnb .list_area .menu_btn { background:#433b8f url('../img/pop/icon_movie.png') no-repeat center; background-size:28px; position:absolute; top:80; right:0px; display:block; width:60px; height:60px; cursor:pointer; font-size:0px; border-radius:30px;}
.lnb .arrow_icon { display:none;}
.lnb .list_area .cont { display:none; border:0px; max-height:78vh !important;}
.lnb .list_area .cont a { display:none; border:0px;}

/*toggle*/.lnb.toggle {
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0);
}
.lnb.toggle .logo { background-image:none;}
.lnb.toggle .logo img { display:inline-block;}
.lnb.toggle .lnb_list { padding:10px; padding-top:0px;}
.lnb.toggle .list_area .menu_btn { cursor:text; position:relative; width:280px; height:56px; line-height:56px; background:url('../img/pop/bg_tit.png') no-repeat center; cursor:pointer; font-size:24px; text-align:center; color: #fff; border-radius:5px; font-family:'NanumGothicBold', sans-serif; margin-bottom:6px;}
.lnb.toggle .list_area .cont { display:block; border:1px #ccc solid; }
.lnb.toggle .list_area .cont a { display:block; background-color:#fff; display:block; padding-left:15px; height:50px; line-height:50px; color:#444; border-bottom:1px #ccc solid; border-top:0px; font-size:17px; letter-spacing:-0.03em;}
.lnb.toggle .list_area .cont a.select { background-color:#ecedf4; color:#3d4da5;}
.lnb.toggle .list_area .cont a:last-child { border-bottom:0px;}
.lnb.toggle .arrow_icon { display:inline-block; width:30px; height:30px; position:absolute; top:13px; right:15px;}
.lnb.toggle .arrow_icon .arrow {  display:inline-block; width:10px; display:inline-block; height:1px; background:#fff; position: absolute; top:45%;}
.lnb.toggle .arrow_icon .arrow.first {transform: rotate(-45deg);}
.lnb.toggle .arrow_icon .arrow.second {transform: rotate(45deg); left:8px;}




/* pop_container ------------------------------------ */
.pop_container { padding-left:80px;}
.pop_container.toggle {padding-left:300px;}

/* head */
.head .close_btn { width:35px; height:35px; top:30px; right:15px;}

/* content */
.content { padding:0 10px 15px;}

/* vod_player */
.vod_player { float:none; max-width:853px; width:100%; height:48vw; max-height:481px; transition-duration:0.2s;}
.vod_player .player { height:48vw; max-height:481px; background:#333 url('../img/pop/bg_vod_player.png') no-repeat center; background-size:100%;}
.vod_player.toggle { height:38vw; width:100%; max-height:380px;}
.vod_player.toggle .player { height:38vw; max-height:380px;}

/* ai_text */
.ai_text { max-width:853px; width:100%;}

/* vod_info */
.vod_info { position: relative; left:0px; max-width:853px; width:100%; background-color:#fff; padding:10px; border-radius:5px; margin-bottom:20px;}
.vod_info.toggle { width:100%; left:0px;}

/* member_info */
.member_info { color:#333; height:150px; border-bottom:2px #ddd dashed;}
.member_info .cont_tit { color:#485572; padding-top:15px; background:url('../img/pop/icon_mike2.png') no-repeat left 20px; background-size:17px; margin-left:137px;}
.member_info .photo_box { left:20px; top:20px;}
.member_info dl { margin-left:140px;}
.member_info dt { background: url('../img/pop/icon_mendot2.gif') no-repeat left center;}
.member_info dd { color:#666;}

/* info_box */
.info_box { margin-top:0px;}
.info_box .box_tit { font-size:18px; line-height:32px;}
.info_box .box_area { height:260px;}
.info_box .box_area li a { padding:3px 80px 3px 110px;}

/* 회의록보기 */
.minutes { max-width:853px; width:100%;}


}





@media all and (max-width:767px){

.lnb {
	-webkit-transform: translate(-300px, 0);
	-ms-transform: translate(-300px, 0);
	-o-transform: translate(-300px, 0);
	transform: translate(-300px, 0);
}
/*toggle*/.lnb.toggle {
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0);
}


.lnb.toggle .logo { background-image:none;}
.lnb.toggle .logo img { display:inline-block;}
.lnb.toggle .lnb_list { padding:10px; padding-top:0px;}
.lnb.toggle .list_area { position:relative;}
.lnb.toggle .list_area .menu_btn { width:280px; height:56px; line-height:56px; background:url('../img/pop/bg_tit.png') no-repeat center; cursor:pointer; font-size:24px; text-align:center; color:#fff; border-radius:5px; font-family:'NanumGothicBold', sans-serif; margin-bottom:6px;}
.lnb.toggle .list_area .cont { border:1px #ccc solid; position:absolute; top:62px; width:100%; max-height:80vh !important; display:block;}
.lnb.toggle .list_area .cont a { background-color:#fff; display:block; padding-left:15px; height:50px; line-height:50px; color:#444; border-bottom:1px #ccc solid; border-top:0px; font-size:17px; letter-spacing:-0.03em;}
.lnb.toggle .list_area .cont a.select { background-color:#ecedf4; color:#3d4da5;}
.lnb.toggle .list_area .cont a:last-child { border-bottom:0px;}

.lnb.toggle .arrow_icon { display:inline-block; width:30px; height:30px; position:absolute; top:13px; right:15px;}
.lnb.toggle .arrow_icon .arrow { display:inline-block; width:10px; display:inline-block; height:1px; background:#fff; position: absolute; top:45%; }
.lnb.toggle .arrow_icon .arrow.first {transform: rotate(-45deg);}
.lnb.toggle .arrow_icon .arrow.second {transform: rotate(45deg); left:8px;}





/* pop_container ------------------------------------ */	
.pop_container {position: fixed; width: 100%; left: 0; top: 0; padding-left: 0; min-width:320px;}
.pop_container.toggle {left: 300px; padding-left: 0;}

/* head */
.head { padding:70px 10px 0px;}
.head .logo { position:relative; height:70px; display:block; background-color:#fff; position:absolute; width:100%; left:0px; top:0px; text-align:center;}
.head .logo img { margin-top:14px; width:230px;}
.head .tit .title { font-size:17px; line-height:30px; margin-right:0px;}
.head .tit .agenda { font-size:15px;}
.head .menu_btn { height:70px; width:70px; padding-top:30px; border-left:1px #485a76 solid;}
.head .menu_btn .bar { background:#333;}
.head .close_btn { width:35px; height:35px; top:35px; right:15px; border:1px #ccc solid;}

/* content */
.content { padding:0 10px 15px;}

/* vod_player */
.vod_player { float:none; max-width:853px; width:100% !important; height:52.5vw; max-height:410px; transition-duration:0.2s;}
.vod_player .player { height:52.5vw; max-height:410px; background:#333 url('../img/pop/bg_vod_player.png') no-repeat center; background-size:100%;}
.vod_player .player toggle { width:100%; left:0px; }

/* ai_text */
.ai_text { max-width:853px; width:100%;}
.ai_text .text_area { padding:40px 0 20px;}
.ai_text .view_aitxt { padding:0 10px;}
.ai_text .view_aitxt p { font-size:14px;}

/* vod_info */
.vod_info { position:relative; left:0px; width:100%; background-color:#fff; padding:5px; border-radius:5px; margin-bottom:20px;}
.vod_info.toggle { width:100%; left:0px;}

/* member_info */
.member_info { color:#333; height:125px; border-bottom:2px #ddd dashed; /* */}
.member_info .cont_tit { color:#485572; padding:0px 0 0 22px;; background:url('../img/pop/icon_mike2.png') no-repeat left center; background-size:15px; margin-left:100px; font-size:20px; line-height:34px; font-family:'NanumGothicBold', sans-serif; margin-bottom:0px;}
.member_info .photo_box { left:5px; top:5px; width:90px; height:116px; border-radius:3px;}
.member_info dl { margin-left:100px; font-size:13px;}
.member_info dt { font-size:15px; background: url('../img/pop/icon_mendot2.gif') no-repeat left center;}
.member_info dd { color:#666; font-size:14px; padding-left:80px;}

/* info_box */
.info_box { margin-top:0px; border:0px;}
.info_box .box_tit { font-size:18px; line-height:32px;}
.info_box .box_area { height:260px; padding:0px;}
.info_box .box_area li a { padding:5px 60px 5px 0px; font-size:13px; line-height:20px;}
.info_box .box_area li p { font-size:12px; width:90px; position:static; line-height:20px;}
.info_box .box_area li .name { position:absolute; left:100px; top:7px;}
.info_box .box_area li .no_br { display:none;}

/* 회의록보기 */
.minutes { max-width:853px; width:100%;}
.minutes .min_title { text-align:left; padding-left:15px;line-height:33px;}
.minutes .min_list { font-size:14px;line-height:20px; padding:0px 10px;}



}
















































