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



@media(max-width: 1800px) {
/* head */
	.header{box-sizing: border-box; padding: 0 20px;}
	.header > .hd_sub .hd_nav .gnb > li > a{width: 13vw;}
	.header > .hd_sub .hd_nav{padding-right: 3vw;}
	.header > .hd_sub .hd_nav .gnb > li > a{font-size: 16px;}

/* main */
	.main_wrap{width: 100%; overflow: hidden;}
	.mv_sec .m_txt{padding-left: 20px; padding-right: 20px;	}
	.mcnt1{padding: 12vw 20px; box-sizing: border-box;}
	.mcnt1 > .rbx{padding-left: 40px;}
	.mcnt1 > .rbx .tab-box ul > li.on:before, .mcnt1 > .rbx .tab-box ul > li:hover:before{width:100px; left: -122px;}
	.mcnt1 > .rbx .tab-box ul > li:after{left: -22px;}
	.main-tit-h3{font-size: 35px; line-height: 1.5;}
	.mcnt2_wrap {padding: 12vw 20px; box-sizing: border-box;}
	.mcnt3_wrap{padding: 12vw 20px; box-sizing: border-box;}
	.mcnt4{padding: 12vw 20px; box-sizing: border-box;}

/* footer */
	.footer{box-sizing: border-box; padding: 5vw 20px 3vw;}
}


@media(max-width: 1024px) {
/* head */
	.header,
	.header > .hd_sub .hd_logo{height: 70px;}
	.header > .hd_sub .hd_logo{width: 150px;}
	.header > .hd_sub .hd_logo > a{background-size: 100%;}
	.header > .hd_sub .hd_nav{display: none;}
	.header:hover > .hd_sub .hd_logo{top: 0;}
	.header .hd_sub .btn_sitemap{top: 10px !important; }

/* main */
	.mv_sec,
	.mv_sec .item{height: 80vw;}
	.mv_sec .m_txt{padding-bottom: 0;}
	.mv_sec .m_txt h3{font-size: clamp(20px, 4.6vw, 40px); line-height: 1.5; margin-bottom: 5vw;}
	.mv_sec .m_txt p{font-size: clamp(14px, 2.6vw, 20px); line-height: 1.5;}
	.mv_sec .owl_b{width: auto; padding: 5vw 15px; height: 60px;}

	.mcnt1{   }
	.mcnt1 > .lbx{width: 100%;}
	.mcnt1 > .lbx .box .img-box img{width: 100%;}
	.mcnt1 > .rbx{width: 100%; display: flex; flex-direction: column-reverse;}
	.mcnt1 > .rbx{padding: 0; margin-top: 5vw;}
	.mcnt1 > .rbx .tab-box ul{display: flex; margin-top: 0; margin-bottom: 5vw;}
	.mcnt1 > .rbx .tab-box ul > li{width: 33.33%; text-align: center; margin-bottom: 0; font-size: clamp(16px, 3vw, 20px); line-height: 1.5;}
	.mcnt1 > .rbx .tab-box ul > li.on:before, .mcnt1 > .rbx .tab-box ul > li:hover:before{display: none;}
	.mcnt1 > .rbx .tab-box ul > li:after{left: 50%; top: 0; margin-left: -3px;}
	.main-tit-p{font-size: clamp(16px, 3vw, 20px); line-height: 1.5; margin-bottom: 2vw;}
	.main-tit-h3{font-size: clamp(20px, 4.6vw, 40px); line-height: 1.5; }
	.main-tit-h3 br{display: none;}
	.mcnt1 > .lbx .box .tbx{padding: 0 20px; bottom: 20px;}
	.mcnt1 > .lbx .box .tbx h4{font-size: clamp(20px, 4.6vw, 40px); line-height: 1.5}
	.mcnt1 > .lbx .box .tbx p{font-size: clamp(16px, 2.8vw, 20px); line-height: 1.3; }
	.col3-block > li{width: 100%; margin-bottom: 4vw;}
	.col3-block > li figure img{width: 100%; border-radius: 60px 60px 0 0;}
	.mcnt2-tit-box a{margin-top: 4vw; width: auto; font-size: 16px; padding-right: 20px;line-height: 3;}
	.col3-block{margin-top: 6vw;}
	.col3-block > li .tbx{padding: 3vw 10px;}
	.col3-block > li .tbx p{font-size: clamp(14px, 3.2vw, 20px); line-height: 1.5; margin-bottom: 1vw;}
	.col3-block > li .tbx h5{font-size: clamp(18px, 4vw, 30px); line-height: 1.5}
	.table-design dl{margin-top: 6vw;}
	.table-design ul > li{height: 60px; }
	.table-design ul > li span{font-size: 14px; line-height: 1.5;}
	.table-design dd ul > li{height: 60px;}
	.table-design dd ul > li span{font-size: 14px; line-height: 1.5;}
	.mcnt4 .main-board-wrap .bd-tab{margin-top: 4vw; margin-bottom: 8vw; margin-right: 0;}
	.mcnt4 .main-board-wrap .bd-tab > li span{font-size: clamp(14px, 3.2vw, 20px); line-height: 1.5; }
	.mcnt4 .main-board ul > li{width: 49%; margin-bottom: 4vw; height: auto;}
	.mcnt4 .main-board ul > li > a{padding: 3vw 20px;}
	.mcnt4 .main-board ul > li > a small{font-size: clamp(14px, 2.6vw, 20px); line-height: 1.5; margin-bottom: 2vw;}
	.mcnt4 .main-board ul > li > a p{font-size: clamp(16px, 3.2vw, 20px); line-height: 1.5; height: 4.4em; margin-bottom: 3vw;}
	.mcnt4 .main-board ul > li > a span{font-size: 13px;}
	.mcnt4 .more{margin-top: 2vw; line-height: 0.5;}
	.mcnt5{height: 45vw; background-size: cover;}
	.mcnt5 .box{padding-top: 0;}
	.mcnt5 .box h4{font-size: clamp(20px, 4.4vw, 35px); line-height: 1.5; }
	.mcnt5 .box p{font-size: clamp(16px, 3vw, 22px); line-height: 1.5; margin: 1vw 0 3vw;}
	.mcnt5 .box a{width: auto; padding: 0 15px; font-size: 16px; line-height: 3; height: auto; }
	
	.mcnt3 {position: relative;}
	.mcnt3:after{display: block; content: '※ 좌우 스크롤 해주세요.'; margin-top: 10px;}
/* footer */
	.footer{padding-bottom: 6vw;}
	.footer .ft_wrap > .ft-lbx{width: 100%; margin-bottom: 3vw;}
	.footer .ft_wrap > .ft-rbx ul > li, .footer .ft_wrap > .ft-rbx .copy{font-size: 12px; line-height: 1.5;}
	.ft-r-bottom {flex-direction: column;}
	.footer .ft_wrap > .ft-rbx{width: 100%;}
	.footer .ft_wrap > .ft-rbx .ft-r-bottom ol{margin-top: 2vw;}
	.footer .ft_wrap > .ft-rbx .ft-r-bottom ol > li{margin-left: 0; margin-right: 20px;}
	.footer .ft_wrap > .ft-rbx .ft-r-bottom ol > li > a{font-size: 14px;}
	.scroll-top{right: 20px;}
	.mcnt1{flex-direction: column-reverse; }
	.mcnt1 > .rbx{display: flex;     flex-direction: column; margin-bottom: 5vw;}
	.mcnt1 > .rbx .tab-box ul > li:after{top: -5px;}
	.mcnt1 > .rbx .tab-box{margin-top: 9vw;}
}	

@media(max-width: 800px) {
	.header .hd_sub .btn_sitemap ul {background: rgba(233,231,231,1);}
	.header .hd_sub .btn_sitemap ul > li{background: #333;}


	.table-design{width: 100%; overflow-x: auto;	}
	.table-design > dl{width: 800px;}

	

}