﻿@charset "utf-8";

.sec {
    position: relative;
    padding:25px 0;
}	

#popupcontent {width:590px; margin:auto; border:solid 1px #ccc; }
@media (max-width:768px){
	#popupcontent {width:100%; margin:auto; border:solid 1px #ccc; }
}
a.cover {display:block;position:absolute;top:0;left:0;width:100%;height:100%;z-index:90}

.main_cont {}
.main_cont .container-xl { padding:0;}
.container-main {position:relative; margin:0 auto; width:100%;max-width:1720px; }

@media (max-width:1024px){
		.container-main {width:100%;max-width:100%;padding-left:20px;padding-right:20px;}
	}


.main_cont .container-xl #visual {padding-right:450px;}

#visual {position:relative;margin:0 auto;width:100%;height:720px;overflow:hidden;background:#000;background-size:100% 100%;}

.slick-slide,
.slick-list,
.slick-track {position:relative;height:100%}
#visual .visual-slider {position:relative;height:100%} 

#visual .txtbox {position:absolute;top:35%;left:5%;z-index:90;}
#visual .txtbox.txtbox2 {position:absolute;top:45%;left:5%;z-index:90; width:90%; text-align: center;}
#visual .txtbox .tit1 {color:#fff;font-size:20px; line-height:25px; padding:0 15px; border:solid 3px #f1f1f1; border-width:0 3px 0 3px; display:inline-block; }
#visual .txtbox .tit2 {color:#fff;font-size:66px;font-weight:300; margin-top:30px;}
#visual .txtbox .tit3 {color:#fff;font-size:24px;font-weight:300;  margin-top:20px; line-height:1.3}
#visual .txtbox .tit4 {color:#fff;font-size:48px;font-weight:300;  margin-top:20px; line-height:1.3}

#visual .txtbox .date {color:#fff;font-size:24px; margin-top:20px;}
#visual .txtbox .arr { display:inline-block; margin-top:30px;}
/*
					<a href="/kor/artyboard/mboard.asp?Action=view&strBoardID=5035_TBML&intPage=1&intCategory=0&strSearchCategory=|s_name|s_subject|&strSearchWord=&intSeq=3044">
					<p class="tit1">개막작 | World Premiere</p>
					<p class="tit2 mt10">사막을 건너 호수를 지나(Let's Peace!)</p>
					<p class="tit3 mt10">2017년 가을, 다양한 노동 현장에서 일을 하던 청년들이 자립을 고민하며 통일창업아이디어공모전에서 덜컥 통일부장관상을 받았다.</p>
					</a>
*/



#visual .visual-slider .visual-slider-1 { background:url(/kor/img/main/2020vis-02.jpg) no-repeat top center;height: 100%; }
#visual .visual-slider .visual-slider-2 { background:url(/kor/img/main/vis002.jpg ) no-repeat top center;height: 100%; }
#visual .visual-slider .visual-slider-3 { background:url(/kor/img/main/mvis20200605.png) no-repeat top center;height: 100%; }
#visual .visual-slider .visual-slider-4 { background:url(/kor/img/main/vis20200805.png) no-repeat top center;height: 100%; }
#visual .visual-slider .visual-slider-x { background-repeat:no-repeat;background-position:top center; height: 100%; background-size: cover; }

.visual-slider .slick-arrow {position:absolute;z-index:10;margin-top:-56px;display:inline-block;width:56px;height:56px;background:transparent;z-index:20; text-indent:-9999px;}
.visual-slider:hover .slick-arrow {}
.visual-slider .slick-arrow.slick-next {bottom:30px;right:23px;background:url(/kor/img/main/ico_film_next.png) no-repeat 50% 50%}
.visual-slider .slick-arrow.slick-prev {bottom:30px;right:80px;background:url(/kor/img/main/ico_film_prev.png) no-repeat 50% 50%}

.visual-slider .slick-arrow.slick-prev:after {content:'';position:absolute;top:20px;right:0;width:1px;height:15px;background:#aaa}
.alllink { display: block; width: 100%; height: 100%; position: absolute; z-index: 91;top:0;left:0;}

.main_cont .container-xl .mbanner { position:absolute;right:0; top:0; width:450px; color:#fff;}
.main_cont .container-xl .mbanner .mbox {height:240px; padding:50px; position:relative;}
.main_cont .container-xl .mbanner:after {content:""; clear:both; float:none; height:0; display:block;}
.main_cont .container-xl .mbanner .mbox .t2 { font-size:16px; margin:15px 0px; line-height:1.5}
.main_cont .container-xl .mbanner .mbox1 {background:url(/kor/img/main/b1bg.jpg) no-repeat; background-size: cover;}
.main_cont .container-xl .mbanner .mbox2 {background:url(/kor/img/main/b2bg.jpg) no-repeat; background-size: cover;}
.main_cont .container-xl .mbanner .mbox3 {background:url(/kor/img/main/b3bg_ds.jpg) no-repeat; background-size: cover;}
.main_cont .container-xl .mbanner .mbox .t2 .db168 {display:block;}

.boardbox { position:relative;  margin:35px 0;}
.board1, .board2 { width:50%; float:left; border-left:solid 1px #dce3e9; height:70px; line-height:70px;  }
.board2 { border-right:solid 1px #dce3e9; }
.boardbox:before, .boardbox:after {display: table; content: " "; clear: both;}
.boardbox .board1 .t1 { font-size:18px; line-height:70px; padding:0 30px; position:absolute; }
.boardbox .board1 .board1list {padding:0 30px 0  130px;}
.boardbox .board1  a { display:block; position:relative; width:100%; z-index:1;}
.boardbox .board1  a .brd_tit {padding-right:130px; display:block; white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#666}
.boardbox .board1  a .date { position:absolute; right:30px; top:0   }

.boardbox .board2 .t1 { font-size:18px; line-height:70px; padding:0 30px; position:absolute; }
.boardbox .board2 .board2list {padding:0 30px 0  130px;}
.boardbox .board2  a { display:block; position:relative; width:100%; z-index:1;}
.boardbox .board2  a .brd_tit {padding-right:130px; display:block; white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#666}
.boardbox .board2  a .date { position:absolute; right:30px; top:0   }


.industrybox { background:url(/kor/img/main/industrybg.jpg) no-repeat top center; height:620px; padding:90px 70px; color:#fff; }
.industrybox .t1 { font-size:48px;}
.industrybox .t2 { font-size:18px;}
.industrybox ul {}
.industrybox ul li {  text-align:center; padding:0 2px; box-sizing: border-box;}
.industrybox ul li a { line-height:100px; background-color: rgba(0, 0, 0, 0.5); display:block; color:#fff; font-size:18px;}
.industrybox ul li a:hover { background-color: rgba(255, 255, 255, 1); color:#0f63a2;}
.qbannerbox {border:solid 1px #ddd; height:620px; box-sizing: border-box;line-height:1.6}
.qbanner1, qbanner2 {height:310px; position:relative; } 
.qbanner1 .btn_more, .qbanner2 .btn_more { position:absolute; top:35px; right:35px;}
.qbannerbox .qbanner1 .bgs { background:url(/kor/img/main/ms_230201.jpg); background-size: cover; height:310px;}
.qbannerbox .qbanner1 .tbox {padding:50px 45px;position:absolute; top:0; right:0; height:310px; min-width:400px; background:#fff;}
.qbannerbox .qbanner1 .tbox .t1 { font-size:16px; color:#666;}
.qbannerbox .qbanner1 .tbox .t2 { font-size:32px; color:#000;line-height:1.2}
.qbannerbox .qbanner1 .tbox .t3 { font-size:18px; color:#666;}
.qbannerbox .qbanner1 .tbox .t4 { font-size:18px; color:#666;}
.qbannerbox .qbanner2 { height:310px; position:relative;}
.qbannerbox .qbanner2 .bgs { background:url(/kor/img/main/c22.jpg); background-size: cover; height:310px;float:right;}
.qbannerbox .qbanner2 .tbox {padding:50px 45px; position:absolute; top:0; left:0; height:310px; min-width:400px; background:#efefef; }
.qbannerbox .qbanner2 .tbox .t1 { font-size:16px; color:#666;}
.qbannerbox .qbanner2 .tbox .t2 { font-size:32px; color:#000;line-height:1.2}
.qbannerbox .qbanner2 .tbox .t3 { font-size:18px; color:#666;}
.qbannerbox .qbanner2 .tbox .t4 { font-size:18px; color:#666;}

.tit_sec { text-align:center; font-size:40px; font-weight:300;}

.tit_sec span.tit_icon {display:inline-block;width:40px;height:40px;	background-image:url(/kor/img/main/icon_title.png);background-position:0 0;background-repeat:no-repeat; vertical-align: bottom;}
.tit_sec span.tit_icon1 {}
.tit_sec span.tit_icon2 { background-position:-40px 0; }


.tit_sec2 { font-size:33px; font-weight:300; letter-spacing:-1px;}
.tit_sec2 span {display:inline-block;width:40px;height:40px;	background-image:url(/kor/img/main/icon_title.png);background-position:0 0;background-repeat:no-repeat; vertical-align: bottom;}
.tit_sec2 span.tit_icon3 { background-position:-80px 0; }
.tit_sec2 span.tit_icon4 { background-position:-120px 0; }
.tit_sec2 span.tit_icon5 { background-position:-160px 0; }


/* cont_movie_tab */
.cont_movie_tab { position:relative;}
.cmvarr { width:100%; }
.cmvarr .cmvarr-p {position:absolute; left:25px; top:0}
.cmvarr .cmvarr-n {position:absolute; right:25px; top:0}
/*
				<div class="cmvarr">
					
					<a href="javascript:prenextbtn('next');" class="cmvarr-p"><img src="/kor/img/main/pg-slide-prev2.png"></a>
					<a href="javascript:prenextbtn('pre');" class="cmvarr-n"><img src="/kor/img/main/pg-slide-next2.png"></a>
				</div>
				*/

/* contents list */
.cont_list:before,
.cont_list:after {clear:both;display:block;content:'';}
.cont_list .con_it .thumb {display:block;position:relative;background:#444;overflow:hidden;}
.cont_list .con_it .thumb img {width:100%;max-width:none; /*height:100%;min-height:250px;*/ transform-origin:center center;transform:scale(1.05);opacity:.9;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
.cont_list .con_it:hover .thumb img {opacity:1;transform:scale(1);}
.cont_list .con_it .info .category {margin-bottom:6px}
.cont_list .con_it .info .tit {white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-weight:500}
.cont_list .con_it .info .desc {color:#777;}
.cont_sub .cont_list.type-a .con_it {width:25%;float:left;padding-bottom:60px;}

.dmzyoutube .cont_list .con_it .thumb img  { /* min-height:280px; */}

/* type-a */
.cont_list.type-a {position:relative;margin-left:-15px;margin-right:-15px}
.cont_list.type-a .con_it {position:relative;padding-left:15px;padding-right:15px;}
.cont_list.type-a .con_it .thumb {position:relative;width:100%;height:0;padding-bottom: 56.25%; overflow:hidden;}

.cont_list.type-a .con_it .info {padding:30px; border:solid 1px #dedede; border-top:none; margin-top:-1px; }
.cont_list.type-a .con_it .info .desc {display:block;margin-top:12px;height:48px;text-overflow:ellipsis;overflow:hidden;}

.cont_list.type-a .con_it .info .tit {display:block;font-size:28px;line-height:160%;color:#222;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cont_list.type-a .con_it .info .mv_dir {font-size:16px;margin-bottom:5px;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }

.cont_list.type-a .con_it .info .film_info { white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.cont_list.type-a .con_it .info .film_info span {display:inline-block;position:relative;padding:0 10px;font-size:13px;color:#666;line-height:160%;word-break:break-all;letter-spacing:0}
.cont_list.type-a .con_it .info .film_info span:after {content:'';position:absolute;top:5px;right:0;width:1px;height:12px;background:#aaa}
.cont_list.type-a .con_it .info .film_info span:last-child:after {content:none;}
.cont_list.type-a .con_it .info .film_info span:first-child { padding-left:0;}

.cont_list.type-a .con_it .info .desc {
    font-size: 15px;
    line-height: 160%;
    color: #888;
    letter-spacing: -0.5px;
    margin-top: 10px;
    height: 68px;
    overflow: hidden;
}




.slide-yt .btn_wrap {position:absolute;right:50%;bottom:50%; padding:0; margin-right:-25px; margin-bottom:-25px; z-index:91}
.slide-yt .btn_wrap .btn_mv_trailer {display:inline-block;width:50px;height:50px;background:url(/kor/img/main/ico_play_trailer_s.png) no-repeat 50% 50% rgba(0,0,0,.5); border-radius:50%; border:dotted 2px #ccc; }
.slide-yt .btn_wrap .btn_mv_trailer:hover {background-color:rgba(0,0,0,1.0); }

@media (max-width:1024px){
		
		.cont_sub .cont_list.type-a .con_it {width:33.3333%}

		.cont_list.type-a {margin-left:-10px;margin-right:-10px;}

		.recommend .cont_list.type-a .con_it,
		.cont_list.type-a .con_it {padding-left:10px;padding-right:10px;width:380px}
		
}



	@media (max-width:768px){
		
		.cont_list .con_it .thumb img { /*min-height:220px*/ }

		.cont_sub .cont_list.type-a .con_it {width:50%}
		
		.recommend .cont_list.type-a .con_it,
		.cont_list.type-a .con_it {width:340px}
		.cont_list.type-a .con_it .thumb {/*height:220px*/}
		
	}

	@media (max-width:414px){

		.cont_sub .cont_list .con_it .info .tit {font-size:18px;white-space:normal}
				
		.cont_sub .cont_list.type-a .con_it {width:100%;padding-bottom:25px}


		.cont_list.type-a {margin-left:-6px;margin-right:-6px;}
		.recommend .cont_list.type-a .con_it,
		.cont_list.type-a .con_it {padding-left:6px;padding-right:6px;width:280px}
		.cont_list.type-a .con_it .thumb {height:150px;}
		/*.cont_list.type-a .con_it .thumb img { min-height: auto; height: auto;}*/
		.cmvarr .cmvarr-p {top:50px; z-index:999}
		.cmvarr .cmvarr-n {top:50px; z-index:999}
		.cmvarr .cmvarr-p img,
		.cmvarr .cmvarr-n img {width:50%;}
		
		.dmzyoutube .cont_list .con_it .thumb img  { min-height:auto; height:auto; width:100% }
		.dmzyoutube .cont_list.type-a .con_it .thumb {}
}



/*
.main-slick-arrow {position:absolute;top:-65px;display:inline-block;width:40px;height:29px;text-indent:-9999px;
				opacity:0.3;}
.main-slick-arrow.main-slick-prev {right:60px;background:url(/kor/img/main/ico_film_prev.png) no-repeat 50% 50%}
.main-slick-arrow.main-slick-next {right:20px;background:url(/kor/img/main/ico_film_next.png) no-repeat 50% 50%}
.main-slick-arrow:hover {opacity:1}
.main-slick-arrow.main-slick-prev:after {content:'';position:absolute;top:7px;right:0;width:1px;height:15px;background:#aaa}
*/
.pg-slide .main-slick-arrow {position:absolute;z-index:10;margin-top:-56px;display:inline-block;width:56px;height:56px;background:#fff;z-index:20;opacity:0;
					border-radius:50%;-webkit-border-radius:50%;text-indent:-9999px;box-shadow:1px 3px 13px rgba(46,116,117,.5);-webkit-box-shadow:1px 3px 13px rgba(46,116,117,.5);
					-moz-transition: all 0.2s ease-in;
					-o-transition: all 0.2s ease-in;
					-webkit-transition: all 0.2s ease-in;
					transition: all 0.2s ease-in;}
.pg-slide:hover .main-slick-arrow {opacity:1}

.pg-slide .main-slick-arrow.main-slick-next {top:50%;right:-15px;background:url(/kor/img/main/ico_film_next.png) no-repeat 50% 50% #fff}
.pg-slide .main-slick-arrow.main-slick-prev {top:50%;left:-15px;background:url(/kor/img/main/ico_film_prev.png) no-repeat 50% 50% #fff}

.dmzyoutube .main-slick-arrow {position:absolute;z-index:10;margin-top:-56px;display:inline-block;width:56px;height:56px;background:#fff;z-index:20;opacity:0;
					border-radius:50%;-webkit-border-radius:50%;text-indent:-9999px;box-shadow:1px 3px 13px rgba(46,116,117,.5);-webkit-box-shadow:1px 3px 13px rgba(46,116,117,.5);
					-moz-transition: all 0.2s ease-in;
					-o-transition: all 0.2s ease-in;
					-webkit-transition: all 0.2s ease-in;
					transition: all 0.2s ease-in;}
.dmzyoutube:hover .main-slick-arrow {opacity:1}

.dmzyoutube .main-slick-arrow.main-slick-next {top:50%;right:-15px;background:url(/kor/img/main/ico_film_next.png) no-repeat 50% 50% #fff}
.dmzyoutube .main-slick-arrow.main-slick-prev {top:50%;left:-15px;background:url(/kor/img/main/ico_film_prev.png) no-repeat 50% 50% #fff}


.quickmenus { background:#000 url(/kor/img/main/quickmenubg.jpg) no-repeat top center; height:350px; text-align:center; color:#fff; display:table; width:100%; padding:30px;  }
.quickmenus .quickmenubox { display:table-cell; max-width:1920px;  vertical-align: middle; border:solid 1px rgba(255, 255, 255, .3);; height:100%;}
.quickmenus .quickmenubox .container-xl { }
.quickmenus .tit {font-size:40px; color:#eee; }
.quickmenus ul {font-size:18px; text-align:center; }
.quickmenus ul li{ display:inline; padding:0 10px 0 5px; position:relative;}
.quickmenus ul li:after {content:'';position:absolute;top:8px;right:0;width:1px;height:12px;background:#aaa}
.quickmenus ul li:last-child:after {content:none;}
.quickmenus ul li a { color:#fff;}
/*
	<div class="quickmenus mt50">
		
		<p>자주 찾는 DMZ국제다큐멘터리영화제</p>
		
		<ul>
<li><a href="#">공간안내</a></li>
<li><a href="#">셔틀버스</a></li>
<li><a href="#">기념품</a></li>
<li><a href="#">개폐막식</a></li>
<li><a href="#">DMZ 투어</a></li>
<li><a href="#">프레스가이드</a></li>
<li><a href="#">카탈로그 다운로드</a></li>
		</ul>
		
	</div>
*/


@media (max-width:1680px){ 
	.main_cont .container-xl #visual {padding-right:0;}
	.main_cont .container-xl .mbanner {position:relative;left:0; clear:both; width:100%; }
	.main_cont .container-xl .mbanner .mbox { float:left; width:33.33%; padding:30px 35px;}
	.main_cont .container-xl .mbanner .mbox .t2 .db168 {display:inline-block;}
}

@media (max-width:1480px){ 
	
}

@media (max-width:1024px) {
	.industrybox {background-size: cover; margin-bottom:50px;}
	.board1, .board2 { width:100%; border:none;}
	#visual {height:720px !important;}
}


@media (max-width:768px) {
	.industrybox {padding:30px 60px;}
	.board1, .board2 { width:100%; border:none;}
	.main_cont .container-xl .mbanner .mbox { float:none; clear:both; width:100%; padding:50px;}
	#visual .visual-slider .visual-slider-1, #visual .visual-slider .visual-slider-3, #visual .visual-slider .visual-slider-2,
	#visual .visual-slider .visual-slider-x {background-size: 100% 100%;}

	
}

@media (max-width:414px) {
	.industrybox {padding:30px;}
	.qbannerbox .qbanner1 .tbox, .qbannerbox .qbanner2 .tbox {min-width:100%; padding:30px;}
	.qbanner1 .btn_more, .qbanner2 .btn_more { top:20px; right:20px;}
	#visual {height:28vh !important;}
	#visual .txtbox .tit1 {color:#fff;font-size:15px; line-height:25px; padding:0 15px; border:solid 3px #f1f1f1; border-width:0 3px 0 3px; display:inline-block; }
	#visual .txtbox .tit2 {color:#fff;font-size:28px;font-weight:300; margin-top:30px;}
	#visual .txtbox .tit3 {color:#fff;font-size:18px;font-weight:300; margin-top:20px; line-height:1.3}
	#visual .txtbox .tit4 {color:#fff;font-size:20px;font-weight:300; margin-top:30px;line-height:1.3}
	#visual .txtbox { top:15%; width:90%;  }
	.quickmenus .tit {font-size:25px; padding:0 15px; }
	.quickmenus ul {font-size:16px; text-align:center;  padding:0 15px;}
	.board1, .board2 { height:100px; }
	.boardbox .board1 .t1 { font-size:18px; line-height:25px; padding:0; position:relative; }
	.boardbox .board1 .board1list {padding:0}
	.boardbox .board2 .t1 { font-size:18px; line-height:25px; padding:0; position:relative; }
	.boardbox .board2 .board2list {padding:0}
}


/*
@media (max-width:1024px){
	#visual {height:720px !important;}
	#visual .txtbox {top:45%}
	#visual .txtbox.txtbox2 {top:30%}
}

@media (max-width:768px){
	.cmlb .con_it .thumb img {height: auto; width: 100%;}
	
	#visual .txtbox { top:40%; width:80%;  }
	#visual .visual-slider .visual-slider-1, #visual .visual-slider .visual-slider-3, #visual .visual-slider .visual-slider-2 {background-size: cover;}
}

@media (max-width:414px){
	.cmlb .con_it .info .tit { font-size:18px; line-height:26px;}
	#visual .txtbox { top:30%; width:90%;  }
	#visual {height:50vh !important;}
	#visual .txtbox .tit1 {font-size:26px;}
	#visual .txtbox .tit2 {font-size:32px;}
	#visual .txtbox .date {font-size:20px;}
	.cont_movie { margin:0px 0; }
}

@media (max-width:414px) and (orientation:portrait) {
	#visual {height:50vh !important;}
	#visual .txtbox .tit1 {font-size:26px;}
	#visual .txtbox .tit2 {font-size:32px;}
	#visual .txtbox .date {font-size:20px;}
	.cont_movie { margin:0px 0 50px; }
}

@media (max-width:768px) and (orientation:landscape) {
	#visual {height:90vh !important;}
	#visual .txtbox .tit1 {font-size:28px;}
	#visual .txtbox .tit2 {font-size:36px;}
	#visual .txtbox { top:25%; width:80%;  }
}
*/