@charset "utf-8";
@import url(media_sub.css);

/**** Media Query *********************************/

@media (max-width:1800px){
/* header */
	
/* main */
	.main_wrap{width: 100%; }
}

@media (max-width:1600px){

/* main */
	.main_wrap{padding-right: 25.37vw;}
	
	.mv_sec .item .img{height: calc(100vh - 129px ); }
	.right_hd{max-width:410px;}
	.right_wrap{width: 17.81vw; }	
	.hd_quick{width: 7.56vw;}
	.hd_quick li{height: 6.31vw; font-size: 13px; word-break: keep-all;} 
	.right_comu li{padding-left: 10px;}
	.mv_sec .active .mv03 .mv_slog p .mvslog_3_4{margin-left: -13px; display: block; top: 10px;}
	

	
/* footer */
	.footer{width: 64vw;}

	.mv_sec .item .mv_slog img{}
	.right_comu li strong{font-size: 16px;}
	.right_comu li b{font-size: 13px;}
	
}

@media (max-width:1400px){
.pop_video iframe {width: calc(90% - 60px);left: calc(50%- 60px);}
.pop_video button {left:calc(5% - 30px)}
}

@media (max-width:1200px){
/* main */
	.main_wrap{padding-right: 25.56vw;}

/* right_hd */
	.right_wrap{width: 19vw}

}

@media (max-width:800px){
/* header */	
	.header{z-index: 10005;}
	.m_manu{display: block; z-index: 1000000; width: 35px; height: 25px; position: fixed;	}
	.gnb {position: absolute; width: 30%; background: #f4f4f4; right: -50%; transition:.3s; height: 100vh; }
	.gnb.on{right: 0;}
	.gnb > li > a{pointer-events: none;}
	.header nav .gnb li .dep2{left: auto; right: 100%; padding-top: 0; width: 160%;}
	.header{width: 100%; height: 80px;}
	.nav_box{height: 80px; width: 100%; box-sizing: border-box; padding: 0 20px;}
	.header nav .hd_logo{display: inline-block; box-sizing: border-box; width: 90px; }
	.header nav .hd_logo a{display: block; height: 80px; padding: 0;}	
	.header nav .hd_logo a img{width: 100%; margin-top: 6px;}
	.hd_cnt_box{display: none;}


/* main */
	.main_wrap{margin-top: 80px !important;}
	.main_wrap{padding: 0;}
	.mv_sec .item .img{height: 64vw; background-size: auto 64vw;}
	
	.mv_sec .mv01 .mv_slog{top: 13vw; left: auto; right: 20px; text-align: right;}
	.mv_sec .active .mv01 .mv_slog{right: 20px; left: auto; }

	.mv_sec .mv02 .mv_slog{top: 13vw;}
	.mv_sec .mv01 .mv_slog img{width: 70%; display: inline-block;}
	.mv_sec .mv02 .mv_slog{right: auto; left: 20px;}
	.mv_sec .mv02 .mv_slog .mvslog_2_1 img{width: 17vw;}
	.mv_sec .mv02 .mv_slog .mvslog_2_2 img{width: 25vw;}
	.mv_sec .mv02 .mv_slog .mvslog_2_3 img{width: 26vw;}
	.mv_sec .mv02 .mv_slog h3 img{width: 32vw;}

	.mv_sec .mv03 .mv_slog{right: auto; left: 20px; top: 13vw;} 
	.mv_sec .mv03 .mv_slog h3 img{width: 33vw;}
	.mv_sec .mv03 .mv_slog .mvslog_3_1 img{width: 12vw;}
	.mv_sec .mv03 .mv_slog .mvslog_3_2 img{width: 14vw;}
	.mv_sec .mv03 .mv_slog .mvslog_3_3 img{width: 7.5vw;}
	.mv_sec .active .mv03 .mv_slog p .mvslog_3_4{display: inline-block; top: 0; margin-left: 0;}
	.mv_sec .mv03 .mv_slog .mvslog_3_4 img{width: 26vw; }

	.mv_sec .owl-nav [class*=owl-]{top: 48%; left: 20px; }
	.mv_sec .owl-nav .owl-next{left: auto; right: 20px;}

/* right_hd */	
	.right_wrap{width: 100%;}
	.right_hd {position: static; max-width:100%; height: auto; }
	.right_hd:after,
	.right_slider:after{display: block; content: ''; clear: both;}
	.right_slider{padding: 3vw 10px; box-sizing: border-box;}
	.right_slider > li{float: left; width: 49%; margin-right: 2%; margin-bottom: 1vw;}
	.right_slider > li:nth-child(2n+2){margin-right: 0;}
	.right_slider li.video_type a:after{top: 11vw;}
	.right_comu li{height: auto; padding: 10px 3vw;}
	.right_comu li h5{font-size: 18px; }
	.right_comu li b{font-size: 15px;}
	.right_comu li strong{font-size: 18px;}
	.right_news{padding: 5vw 10px;}
	.right_news h5{font-size: 18px;}
	.right_news ul li a span.tab_date{width: 60px;}



	.hd_quick{float: none; position: fixed; right: 10px; top: 45%; transform:translate(0%,-50%);  z-index: 10008; height: auto; width: auto; background: none; opacity: 0.8; transition:.3s; cursor: pointer;}
	.hd_quick li {background: #323f50; width: 85px; height: 80px; float: left;  display: none; transition:0s;}
	.hd_quick li:first-child{display: block; height: 60px; width: 60px; display: block; float: none;}
	.hd_quick li:first-child div{display: block; text-align: center; padding-top: 13px;}
	.hd_quick li h4{font-size: 13px; text-align: center;line-height: 1.3;  display: block; } 
	.hd_quick li a{font-size: 12px; text-align: center; display: block;}
	.hd_quick li:nth-child(5),
	.hd_quick li:nth-child(8){clear: both;}
	.hd_quick li .icon{padding-top: 0 !important; min-height:50px }
	.hd_quick li .icon img{width: 30px; padding-top: 10px;}
	.hd_quick li:nth-child(5) .icon img,
	.hd_quick li:nth-child(6) .icon img{padding-top: 15px;}
	.hd_quick li:nth-child(7) .icon img{padding-top: 25px;}
	.hd_quick li:nth-child(8) .icon img{padding-top: 18px;}

	.hd_quick.on{opacity: 1;}
	.hd_quick.on li{display: block;}
	.hd_quick.on li:first-child{width: 255px;}

/* footer */
	.footer{position: static; width: 100%; height: auto; padding: 2vw 20px;}
	.ft_wrap > div{display: block; }
	.ft_wrap > .ft_logo{margin-right: 0;}
}

@media (max-width:460px){
/* head */

	.gnb{width: 40%;}
	.header nav .gnb li a{font-size: 3.6vw;}
	.header nav .gnb .dep3{padding: 2vw 0;}
	.header nav .gnb .dep3 li a{font-size: 3.2vw; line-height: 2;}
	.header nav .gnb li .dep2{width: 150%;}


/* right_hd */
	.right_slider li h4 span{font-size: 3vw; line-height: 1.3;}
	.right_slider li h4{font-size: 3.4vw; right: 10px !important; top: 10px !important; width: 25vw; display: inline-block;}
	.right_slider .owl-nav{top: auto; bottom: 4vw; right: 10px; height: 10px; }
	.right_slider li.video_type a:after{width: 35px; height: 35px; margin-left: -17px; 	background-size: 100%;}
	.right_comu li h5,
	.right_news h5{font-size: 4vw;}
	.right_comu li b{font-size: 3.4vw; line-height: 1.3;}
	.right_comu li strong{font-size: 4vw;}
	.right_news ul li a span{font-size: 3.2vw; }


/* main */
	.mv_sec .owl-nav [class*=owl-]{width: 25px; background-size: 100% !important; height: 10px;}
	.mv_sec .active .mv02 h3{top: 0;}
	.mv_sec .mv03 h3{margin-bottom: 0px;}

/* footer */
	.footer{padding: 4vw 10px; left: 0; top: 0;}
	.ft_wrap > .ft_logo{margin-bottom: 2vw;}
	.ft_wrap > .ft_logo img{width: 150px;}
	.ft_cnt ul li{line-height: 1.3;}
	.ft_cnt ul li *,
	.ft_cnt .copy{font-size: 3vw; }
	.ft_cnt ul li span{width: 16vw; font-size: 3vw; margin-right: 1vw;}
	.ft_cnt ul li span:after{height: 1em; top: 0.3em;}
	.ft_cnt ul li p.paddingright{padding-right: 8.5vw;}
}