@font-face {
	font-family: 'Nanum Gothic';
	font-style: normal;
	font-weight: 700;
	src: url(/css/font/NanumGothic-Bold.eot);
	src: url(/css/font/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
	url(/css/font/NanumGothic-Bold.woff2) format('woff2'),
	url(/css/font/NanumGothic-Bold.woff) format('woff'),
	url(/css/font/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
	font-family: 'Nanum Gothic';
	font-style: normal;
	font-weight: 400;
	src: url(/css/font/NanumGothic-Regular.eot);
	src: url(/css/font/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
	url(/css/font/NanumGothic-Regular.woff2) format('woff2'),
	url(/css/font/NanumGothic-Regular.woff) format('woff'),
	url(/css/font/NanumGothic-Regular.ttf) format('truetype');
}
body {color:#222; background: #eee; font-weight:bold; font-size: 15px; font-family: 'Nanum Gothic', 'malgun gothic', Dotum, 돋움, sans-serif;  letter-spacing: -0.2px;}
.vod_wrap {width:100%; margin:0 auto; }

.member_info .desc ul {display: inline-block;}
.vod_wrap .sns{display: inline-block; padding:7px 0 0 0; vertical-align:bottom;}
.vod_wrap .sns a{float:left; width:27px; height:25px; font-size:0; text-indent:-9999px; background:#4db2f3 url(/images/common/ico_sns.png) no-repeat -28px 4px;}
.vod_wrap .sns .home{background:#7c48ab url(/images/kr/member/ico_w_home.png) no-repeat 6px 5px;}
.vod_wrap .sns .fb{background-color:#254da9; background-position:9px 4px;}
.vod_wrap .sns .bl{background-color:#24c000; background-position:-65px 4px;;}
.vod_wrap .sns .kko{background-color:#fbc000; background-position:-142px 4px;}
.vod_wrap .sns .insta{background-color:#c536a4; background-position:-103px 4px;}
.vod_wrap .sns .off{background-color:#aaa;}

.arrow_icon {width: 18px; height: 100%;position: absolute; top: 0; right: 15px;}
.arrow_icon.rotate { transform: rotate(0deg);}
.arrow_icon .arrow {display:inline-block;width: 10px; display: inline-block; height: 2px; background: #fff; position: absolute; top: 45%; }
.arrow_icon .arrow.first {transform: rotate(45deg);}
.arrow_icon .arrow.second {transform: rotate(-45deg); left:6px;}

.head {position: relative; height:65px; line-height:65px; padding:0 24px 0 78px; background: #1c4799 url(/images/view/title_bg_texture.png) no-repeat right bottom;}
.head .tit {display: inline-block;}
.head .tit img {vertical-align: middle; margin-right: 5px;}
.head .tit strong {display:inline-block; line-height:140%; font-size: 21px; color:#fff; margin-right:15px; vertical-align: middle;}
.head .tit span {font-size: 18px; color:#c3f6ff; vertical-align: middle;}

.menu_btn {position: absolute; top: 0; left: 0px; display: block; width: 65px; height: 65px;}
.menu_btn .bar {display: block; width: 20px; margin: 0 auto; height: 2px; margin-top: 5px; background: #fff; }
.menu_btn .bar:first-child {margin-top: 0;}


.close_btn {
	position: absolute; top: 50%; right: 25px;
	-webkit-transform: translate(0,-50%);
	-moz-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	-o-transform: translate(0,-50%);
	transform: translate(0,-50%);
	display: inline-block; width: 30px; height: 30px; background: url(/images/vodpopup/close_btn.png) no-repeat center;
}

.lnb {position: fixed; top: 0; left: 0; width: 300px; height: 100%; background: #343434;}
.lnb {
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0);
}
.lnb_top {position: absolute; width: 100%; height: 65px; line-height:65px;}
.lnb_top .council {color: #fff; font-weight: 400; font-size: 18px; text-align: center;}
.lnb_top .council .ward {position: relative; padding-left: 50px; display: inline-block;}
.lnb_top .council .ward:before {position: absolute; top: 50%; margin-top: -20px; left: 0; content: ""; display: inline-block; width: 49px; height: 40px; background: url(/images/common/ico_council.png) no-repeat center; background-size: 41.5px 40px; vertical-align: middle;}

.lnb_bottom {padding-top: 65px; box-sizing:border-box; height: 100%;; overflow-y: auto;}

.list_area .tit {display: block; position: relative; padding:0 15px 0 45px; height: 50px; line-height: 50px;background: #635a4d; cursor:pointer; font-size: 16px; font-weight: 400;color: #fff;}
.list_area .tit:before {position: absolute; top: 50%; margin-top: -7px; left: 20px; content:""; display: inline-block; width: 16px; height: 16px; overflow: hidden;}
.list_area .tit.icon1:before {background: url(/images/vodpopup/view_icon_pack.png) no-repeat 0 0;}
.list_area .tit.icon2:before {background: url(/images/vodpopup/view_icon_pack.png) no-repeat 0 -21px;}
.list_area .cont {padding:0 15px; overflow-y:auto}
.list_area .cont .order {padding:15px 0 23px;}
.list_area .cont .order a {display: block; width: 100%; margin-bottom: 9px; color: #fff; font-weight: 400; }

.lnb.toggle {
	-webkit-transform: translate(-235px, 0);
	-ms-transform: translate(-235px, 0);
	-o-transform: translate(-235px, 0);
	transform: translate(-235px, 0);
}
.lnb.toggle .lnb_top .menu_btn {width: 55px;}
.lnb.toggle .list_area .tit:before {left:auto; right: 25px;}
.lnb.toggle .lnb_bottom .list_area .tit {font-size: 0;}
.lnb.toggle .lnb_bottom .list_area .cont {height: 0;}
.lnb.toggle .lnb_bottom .list_area .cont li a {font-size: 0;}
.lnb.toggle .arrow_icon{display:none;}

.lnb.toggle .lnb_top .council {position: relative;}
.lnb.toggle .lnb_top .council .ward {position: static; text-indent:-999em; }
.lnb.toggle .lnb_top .council .ward:before {right: 7px; left: auto;}

.wrap {padding-left: 300px; width: 100%; box-sizing:border-box; height: 100%; background: #ebecee; overflow-y:auto; z-index:800;}
.wrap.toggle {padding-left: 65px;}


.content {height: auto; padding:15px; background-color: #ebecee;}
.content .cont_tit {display: inline-block; padding:12px 22px; color:#fff;}
.cont_top {}
.cont_bottom {margin-top: 1%;}

.clx::after {content:""; display: block; clear: both;}

/* 플레이어 */
.vod_player {position: relative; float: left; width:49.5%; height:414.34px;overflow: hidden; background: #343434 url(/images/vodpopup/video_thumb.png) no-repeat center; background-size: 100% auto;}
.vod_player .video-js .vjs-tech {position: static;}
#mediaplayer {height: 100%;}
.vod_player .video-js.vjs-16-9 {padding-top: 0; height: 100%}

/* 정보 */
.vod_info {float: right; width:49.5%;}
.vod_info .info_box {position: relative; margin-top:1.5%; padding:48px 17px 14px; background-color: #fff; box-sizing:border-box; min-height:165px;}
.vod_info .info_box:first-child {margin-top: 0;}
.vod_info .cont_tit {position: absolute; top: 0; left: 0;}

.vod_info .info_box.noimg {background: #fff url(/images/vodpopup/mark.png) no-repeat center;background-size: 104px 100px }

/* 정보 > 발언자 정보 */
.member .cont_tit {background-color: #1472b9;}
.member_info {display:none; /*overflow: hidden;*/ position: relative; box-sizing:border-box; padding-left: 101px; }
.member_info.on{ display: block;}
.member_info .pic {position: absolute; top: 0; left: 0;}
.member_info .pic .img_wrap {width: 81px; height: 102px;}
.member_info .pic .img_wrap img {width: 100%; height: 100%;}

.member_info .desc {position: relative;}
.member_info .desc .desc_item {margin-top: 8px;}
.member_info .desc .desc_item:first-child {margin-top: 0px;}
.member_info .desc .btn {display: inline-block; padding: 5px 14px 7px; margin-top: 10px; border: 1px solid #1472b9; color: #1472b9; font-size: 13px; margin-right:5px;}

#speakerNoN {padding-left: 0;}

/* 정보 > 부의된 안건 */
.angun .cont_tit {background-color: #14adb9;}
.angun_info {padding:3px; padding-right:10px; height: 179px; overflow:hidden; overflow-y: auto;}
.angun_info .desc {
	display: table; width: 100%; table-layout: fixed;
	position: relative; font-size: 13px; margin-top: 8px; box-sizing:border-box; cursor:pointer;
	padding-left:75px;
	padding-right: 71px;
	min-height:24px;
}

.angun_info .desc.on {outline:1px solid #00aed2;}
.angun_info .desc .tit {
	display: block;
	position: relative;
	width:100%; padding-left: 28px; box-sizing:border-box;
	vertical-align: middle;
	line-height:150%;
}
.url_copy{
	margin-right: 4px;
	width: 10px;
	font-size: 11px;
	font-weight: bold;
	line-height: 1.3em;
	padding: 3px 5px;
	border: 1px solid #666;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;

	word-break: break-all;
	text-align: center;
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
}

.state {
	margin-right:4px;
	width: 62px; font-size: 11px; font-weight: bold; line-height: 1.3em; color: #fff;
	padding:3px 5px; border:1px solid #666; -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px; background: #999;
	word-break:break-all;
	text-align: center;
	display: block; position: absolute; top: 0px; left: 25px;
}

.state.type.R{color:#666}
.state.type.A{border-color:#a60;background-color:#fa3;}
.state.type.P{border-color:#195;background-color:#2c6;}
.state.type.E{border-color:#660;background-color:#bc0;}
.state.type.N{background-color:#666;}
.state.type.M{border-color:#146;background-color:#05a;}
.state.type.Q{border-color:#816;background-color:#c9f;}
.state.type.S{border-color:#068;background-color:#2bf;}
.state.type.O{border-color:#a40;background-color:#f60;}
.state.type.Z{border-color:#a40;background-color:#483D8B;}

.angun_info .desc.on .tit {color:#ef6f0b;}
.angun_info .desc .time {
	/*display:table-cell;*/
	position: absolute; top: 2px; right: 0;
	display: inline-block;
	width: 70px;
	text-align: right;
	font-weight: 400;
	vertical-align: top;
}

/* 회의록보기 */
.minutes .cont_tit {background-color: #e3731c;}
.minutes .minutes_text {height:400px; padding:15px 17px 16px; background-color: #fff; box-sizing:border-box;}
.minutes .minutes_text .text {height:100%; font-size: 13px; line-height:21px; overflow:hidden; overflow-y:auto; }

.minutes ul{margin:0;padding:0;list-style:none;list-style-type:none;}

.minutes #assembly{position:relative; overflow-y:scroll; height:360px; background:#fff;}
.minutes #assembly .none{padding-top:15%; text-align:center;}
.minutes #assembly li.timeblock {margin:0 0 10px;border:1px solid #fff;border-radius:3px;padding:0px;list-style:none;list-style-type:none;}
.minutes #assembly li.timeblock:hover {cursor:pointer;}
.minutes #assembly li.timeblock.on {border-color:#2f56b4;color:#2f56b4;}
.minutes #assembly li.timeblock.on:hover {cursor:default;}
.minutes #assembly li.timeblock .speech {margin:0 0 15px;}
.minutes #assembly li.timeblock .speech .speaker {display:inline-block;border:1px solid #999;border-left-width:3px;border-radius:3px;padding:3px;font-weight:bold;background:#fff}
.minutes #assembly li.timeblock .speech:first-child .speaker {border-color:#2f56b4;border-radius:20px 3px 3px 20px;color:#000}
.minutes #assembly li.timeblock.on .speech .speaker {border:1px solid #2f56b4;border-radius:0 3px 3px 0;color:#fff;background:#2f56b4}
.minutes #assembly li.timeblock .speech .lines {margin:10px;}
.minutes #assembly li.timeblock .speech .lines p {line-height:1.5em}

.minutes #assembly li.timeblock .speecno {margin:0 0 15px;}
.minutes #assembly li.timeblock .speechno .speaker {display:inline-block;border:1px solid #999;border-left-width:3px;border-radius:3px;padding:3px;font-weight:bold;background:#fff}
.minutes #assembly li.timeblock .speechno:first-child .speaker {border-color:#2f56b4;border-radius:20px 3px 3px 20px;color:#000}
.minutes #assembly li.timeblock .speechno .lines {margin:10px;}
.minutes #assembly li.timeblock .speechno .lines p {line-height:1.5em}
.minutes #assembly li.timeblock .speechno:first-child .speaker,
.minutes #assembly li.timeblock .speechno .speaker{border:1px solid #666;border-radius:3px;color:#333;}





@media screen and (max-width:1100px) {
	#vod_wrap {width: 100%; min-width:320px;}
	.head {height:auto; line-height:30px; padding:15px 0; background-size: auto 100%;}
	.head .tit {display: block; text-align: center;}
	.head .tit img {margin-bottom: 5px;}
	.head .tit strong {display: block; font-size: 17px; margin: 0;}
	.head .tit span {display: block; font-size: 15px; margin-left: 0;}

	.arrow_icon {display:none;}
	.lnb {
		-webkit-transform: translate(-245px, 0);
		-ms-transform: translate(-245px, 0);
		-o-transform: translate(-245px, 0);
		transform: translate(-245px, 0);
	}
	.lnb.toggle {
		-webkit-transform: translate(0, 0);
		-ms-transform: translate(0, 0);
		-o-transform: translate(0, 0);
		transform: translate(0, 0);
	}

	.lnb_top .menu_btn {width: 55px; right: 0;}
	.list_area .tit:before {left:auto; right: 20px;}
	.lnb_bottom .list_area .tit {font-size: 0;}
	.lnb_bottom .list_area .cont {display: none; height:0;}


	.lnb.toggle .arrow_icon{display:block;}
	.lnb.toggle .lnb_top .menu_btn {width: 55px;}
	.lnb.toggle .list_area .tit:before {position: absolute; top: 50%; margin-top: -7px; left: 20px; content:""; display: inline-block; width: 16px; height: 16px; overflow: hidden;}
	.lnb.toggle .lnb_bottom .list_area .tit {display: block; position: relative; padding:0 15px 0 45px; height: 50px; line-height: 50px;background: #635a4d; cursor:pointer; font-size: 16px; font-weight: 400;color: #fff;}
	.lnb.toggle .lnb_bottom .list_area .cont {display: block; padding:0 15px; overflow-y:auto}
	.lnb.toggle .lnb_bottom .list_area .cont {height: auto;}
	.lnb.toggle .lnb_bottom .list_area .cont li a {font-size: 1em;}

	.lnb_top .council .ward {text-indent:-999em;}

	.lnb.toggle .lnb_top .council {position: static;}
	.lnb.toggle .lnb_top .council .ward {position: relative; text-indent:0; }
	.lnb.toggle .lnb_top .council .ward:before {right: auto; left: 0;}




	.wrap {padding-left: 55px;}
	.wrap.toggle {padding-left: 300px;}

	.menu_btn {width: 55px; left: -55px;}
	.wrap.toggle .menu_btn {left: 0;}


	.close_btn { margin-top: -20px; right: 10px;}
	.content {padding:10px 10px; height: auto;}
	.cont_bottom {margin: 10px 0 34px 0;}

	/* 플레이어 */
	.vod_player {float: none; width:100%;height: auto;}

	/* 정보 */
	.vod_info {float: none; width:100%; margin-top: 10px;}
	.vod_info .info_box {margin-top:10px; padding:48px 12px 14px;}
	.angun_info {height: 140px;}

	/* 회의록 보기 */
	.minutes .minutes_text {height:auto; min-height:179px;}



}
@media screen and (max-width:797px) {
	.lnb {
		-webkit-transform: translate(-300px, 0);
		-ms-transform: translate(-300px, 0);
		-o-transform: translate(-300px, 0);
		transform: translate(-300px, 0);
	}
	.lnb_top {height: 55px; line-height: 55px;}
	.lnb_bottom {padding-top: 55px;}



	.wrap {position: fixed; width: 100%; left: 0; top: 0; padding-left: 0; min-width:320px;}
	.wrap.toggle {left: 300px; padding-left: 0;}

	.head {padding: 0;}
	.head .tit {padding:10px 60px;}
	.btn_wrap {width: 100%; background: #fff;}
	.btn_wrap .close_btn {width: 55px; height: 55px;  top: 0; right: 0; margin: 0; transform:none;}
	.btn_wrap .menu_btn {width: 55px; height: 55px;  top: 0; left: 0; margin: 0;}

}

@media screen and (max-width:360px) {
	.member_info .desc {font-size: 13px;}
}

/* sns*/
.sbcont_sns {width:100%; padding:10px 0 0 15px; font-size:0; box-sizing:border-box;}
.sbcont_sns > li {position:relative; display:inline-block; vertical-align:top; margin-bottom:2px;}
.sbcont_sns > li + li {margin-left:2px;}
.sbcont_sns > li > a {display:block; width:30px; height:30px; border:1px solid #d6d6d6; border-radius:50%; background-repeat:no-repeat; background-position:center; background-size:65%;}
.sbcont_sns > li > a.top_face {background-image:url("/images/common/sbcont_face.png");}
.sbcont_sns > li > a.top_twitt {background-image:url("/images/common/sbcont_twitt.png");}
.sbcont_sns > li > a.top_blog {background-image:url("/images/common/sbcont_blog.png");}
.sbcont_sns > li > a.top_kakao {background-image:url("/images/common/sbcont_kakao.png");}
.sbcont_sns > li > a.top_insta {background-image:url("/images/common/sbcont_insta.png");}
.sbcont_sns > li > a.top_band {background-image:url("/images/common/sbcont_band.png");}
.sbcont_sns > li > a.top_url {background-image:url("/images/common/sbcont_url.png"); background-size:100%;}
.sbcont_sns > li:hover a {background-color: #f8f8f8;}
.sbcont_sns > li:hover a.top_face {border-color:#254DA9;}
.sbcont_sns > li:hover a.top_twitt {border-color:#4DB2F3;}
.sbcont_sns > li:hover a.top_blog  {border-color:#24C000;}
.sbcont_sns > li:hover a.top_kakao {border-color:#fac518;}
.sbcont_sns > li:hover a.top_insta {border-color:#CF5FB5;}
.sbcont_sns > li:hover a.top_band {border-color:#02d12b;}
.sbcont_sns > li:hover a.top_url {border-color:#fac518;}

.lnb.toggle .sbcont_sns{float:right; width:50px; padding:10px 17px 0 0;}

@media screen and (max-width:797px) {
	.lnb.toggle .sbcont_sns{float:none; width:100%; padding:10px 0 0 15px;}
}