@charset "utf-8";

@media (max-width: 1680px) {
/* main */
	main2 .mcnt3 .top-text:before{right: 40px; ;}
}


@media (max-width: 1500px) {
/* main */
	main2 .mcnt2 .mcnt2-slider{padding: 0 50px;}
	main2 .mcnt2 .owl-nav > *{top: 45%;}
	main2 .mcnt3 .top-text{margin-top: -50px; width: 107%; background: #fff; 	border-radius: 0 20px 0 0; margin-left: -100px; padding-left: 60px;}
	main2 .mcnt3 .top-text:before{display: none;}
	main2 .mcnt3 .top-text dl{padding: 30px 20px 0; gap:40px; }
	main2 .mcnt3 > figure img{width: 100%; height: 300px; object-fit:cover;}
	main2 .mcnt3 .top-text dl dt h4{font-size: 32px;}
	main2 .mcnt3 .top-text dl dt p{font-size: 20px;}
	main2 .mcnt3 .top-text dl dd p{font-size: 18px;}
	main2 .mcnt3 .cnt > ul{gap:20px;}
	main2 .mcnt3 .cnt > ul > li{flex:1;}
	main2 .mcnt6 .cnt > ul > li{flex:1 1 40%}
	
	
	
}

@media (max-width: 1330px) {
/* header */
	#header #gnb>ul>li>a{padding: 0 18px; font-size: 16px;}
	#header .mems{margin-left: 10px;}
	.sitemap-btn{margin-left: 15px;}
	
/* main */
	main2 .mcnt3 .cnt > ul > li > a .tbx{gap:15px; padding: 20px;}
	main2 .mcnt3 .cnt > ul > li > a .tbx h4{font-size: 24px;}
	main2 .mcnt3 .cnt > ul > li > a .tbx h4 span{font-size: 18px;}
	main2 .mcnt3 .cnt > ul > li > a .tbx p{font-size: 16px; line-height: 1.5; word-break: keep-all;}
	main2 .mcnt3 .cnt > ul > li > a .tbx p br{display: none;}
	main2 .mcnt4 .cnt > ul > li > a .tbx p{font-size: 16px; line-height: 1.5;}
	main2 .mcnt4 .cnt > ul > li > a .tbx p br{display: none;}
	main2 .mcnt4 .cnt > ul > li > a{height: 320px;}
	
	
}

@media (max-width: 1024px) {
/* header */
	#header .contain{padding: 0px clamp(15px, 2.92vw, 30px);}
	#header{height: clamp(60px, 16vw, 80px); }
	#header #gnb{display: none;}
	#header .mems{margin-left: auto;}

/* main */
	main2 .main-visual{margin-top: clamp(60px, 16vw, 80px); }
	main2 .main-visual,
	main2 .main-visual .mv_owl,
	main2 .main-visual .mv_owl .item{max-height:80vw; height: 80vw;}
	main2 .main-visual .mv_owl .m_txt h3{font-size: clamp(28px, 5.5vw, 50px);}
	main2 .main-visual .mv_owl .m_txt p{font-size: clamp(14px, 2.8vw, 24px);}
	main2 .main-visual .mv_owl .m_txt .box{padding: 0 20px 30px;}
	main2 .main-tit{gap:8px;}
	main2 .main-tit h3{font-size: clamp(28px, 4.2vw, 46px);}
	main2 .main-tit > p{font-size: clamp(14px, 2.2vw, 20px);}
	main2 .mcnt2{margin-top: clamp(40px, 10vw, 100px); padding-bottom: clamp(80px, 20vw, 200px);}
	main2 .mcnt2 .mcnt2-slider{padding: 0; margin-top: 30px;}
	main2 .mcnt2 .item a{gap:15px; padding: 10px 10px 15px;	}
	main2 .mcnt2 .item a .tbx p{font-size: 16px; line-height: 1.5;}
	main2 .mcnt2 .big-text{bottom: -30px;}
	main2 .mcnt2 .big-text p{font-size: clamp(40px, 14vw, 140px);}	
	main2 .mcnt3 .top-text dl{gap:20px; padding-left: 40px;}
	main2 .mcnt3 .top-text dl dt{padding-left: 0;}
	main2 .mcnt3 .top-text dl dt h4{font-size: clamp(28px, 4.5vw, 36px);}
	main2 .mcnt3 .top-text dl dt p{font-size: 16px;}
	main2 .mcnt3 .top-text dl dd{padding-top: 0; gap:15px}
	main2 .mcnt3 .top-text dl dd p{font-size: 14px; }
	main2 .mcnt3 .top-text dl dd .link-box > a{width: auto; display: inline-flex; padding: 0 20px; font-size: 16px; height: 40px;}
	main2 .mcnt3 .cnt > ul{flex-direction: column; }
	main2 .mcnt3 .cnt > ul > li{width: 100%;}
	main2 .mcnt3 .cnt > ul > li > a .tbx{padding: 40px;}
	main2 .mcnt3 .cnt > ul > li > a figure img{width: 100%;}
	main2 .mcnt4{padding: 60px 0 80px;  margin-top: 80px;}
	main2 .main-tit2{gap:10px; margin-bottom: 30px;}
	main2 .main-tit2 h3{	font-size: clamp(28px, 4.2vw, 46px);}
	main2 .main-tit2 p{font-size: 16px; word-break: keep-all;}
	main2 .main-tit2 p br{display: none;}
	main2 .mcnt4 .cnt > ul > li{flex:1 1 40%}
	main2 .mcnt4 .cnt > ul > li > a .tbx b{font-size: 22px;}
	main2 .mcnt5{padding: 60px 0 80px;}
	main2 .mcnt5 .cnt ul{gap:15px;}
	main2 .mcnt5 .cnt ul > li figure:after{width: 46px; height: 46px; background-size: 100%;		}
	main2 .mcnt5 .cnt ul > li .tbx{font-size: 18px; line-height: 1.5; padding-top: 10px;}
	main2 .mcnt6{padding: 60px 0 80px;	}
	main2 .mcnt6 .main-tit3 h3{font-size: clamp(28px, 4.2vw, 46px);}
	main2 .mcnt6 .main-tit3 h3 small{font-size: 16px;}
	main2 .mcnt6 .main-tit3 p{font-size: 16px; line-height: 1.5; word-break: keep-all;}
	main2 .mcnt6 .main-tit3 p br{display: none;}
	main2 .mcnt6 .cnt > ul{gap:15px;}
	main2 .mcnt6 .cnt > ul > li > a{padding: 20px;}
	main2 .mcnt6 .cnt > ul > li > a .tbx{height: 60px; font-size: 16px; }
	main2 .mcnt7{padding: 60px 0 80px; }
	main2 .mcnt7 .wrap2{flex-direction: column;}
	main2 .mcnt7 .lbx{width: 100%;}
	main2 .mcnt7 .lbx .sticky{position: static; top: 0px;	}
	
	main2 .mcnt7 .lbx h3{font-size: clamp(28px, 4.2vw, 46px); margin-bottom: 10px;}
	main2 .mcnt7 .lbx p{font-size: 16px; margin-bottom: 10px;}
	main2 .mcnt7 .lbx .link-box > a{width: 46px; height: 46px;}
	main2 .mcnt7 .rbx{max-width:100%;}
	main2 .mcnt7 .rbx ul > li > a .cnt{height: 40px; padding-right: 0;}
	main2 .mcnt7 .rbx ul > li > a .date{font-size: 14px;}
	main2 .mcnt7 .rbx ul > li > a .cnt p{font-size: 18px;}
	
	main2 .mcnt6{max-width:100%; overflow: hidden;}
}


@media (max-width: 640px) {
/* main */
	main2 .mcnt4 .cnt > ul > li > a{padding: 30px 20px; height: auto;}
	main2 .mcnt4 .cnt > ul > li > a i{width: 60px; height: 60px; padding: 10px;}
	main2 .mcnt4 .cnt > ul > li > a i img{width: auto; max-width:100%; max-height:95%}
	main2 .mcnt4 .cnt > ul > li > a .tbx b{font-size: 20px;}
	main2 .mcnt4 .cnt > ul > li > a .tbx p{font-size: 14px;}
	main2 .mcnt6 .cnt > ul > li{flex:100%;}
	main2 .mcnt6 .cnt > ul > li > a .tbx{height: auto;}
	
/* footer */	
	#footer .ft-cnt{ padding: 40px 0;}
	#footer .ft-cnt .ft-left ul > li > a{padding: 4px 10px; font-size: 14px;}
	#footer .ft-cnt .ft-left ol > li{font-size: 16px;}
	#footer .ft-cnt .ft-left ol > li.copy{margin-top: 15px; font-size: 14px;}
	#footer .ft-cnt .ft-right ul{justify-content: flex-start; margin-top: 40px; gap:7px; margin-top: 20px;}		
	#footer .ft-cnt .ft-right ol{margin-top: 30px; width: 80%;}
	body:not(.fp-viewing-Visual) .ft_wrap .scroll-top{top: -24px; right: 20px;} 
	body:not(.fp-viewing-Visual) .ft_wrap .scroll-top img{width: 46px; height: 46px;}

}

@media (max-width: 480px) {
/* header */
	#header{max-width:100%; overflow: hidden;}
	#header .sitelogo a{width: clamp(60px, 35.62vw, 171px) ;}
	#header .sitelogo a img{width: 100%;}
	#header .mems > ul > li > a{font-size: clamp(10px, 3.3vw, 15.84px);}
	.sitemap-btn{gap: 6px 6px; width: 31px;}
	
/* main */	

	main2{max-width:100%; overflow: hidden;}
	main2 .main-visual .owl-dots{bottom: 30px; margin-left: -30px;}
	main2 .main-visual .owl-dots .owl-dot{width: 24px;}
	main2 .main-visual .owl-nav {translate: calc(-50% + 77px) 0;bottom: 17px;}
	main2 .main-visual .owl-nav > *{width: 30px; height: 30px;}
	main2 .mcnt2 .big-text{bottom: 0;}
	main2 .main-tit h3 a{width: 30px; height: 30px;}
	main2 .mcnt3 .top-text{width: 123%; padding-bottom: 30px;}
	main2 .mcnt3 .top-text dl dd p{word-break: keep-all;}
	main2 .mcnt3 .top-text dl dd p br{display: none;}
	main2 .mcnt3 .cnt > ul > li > a .tbx h4{font-size: 22px;}
	main2 .mcnt3 .cnt > ul > li > a .tbx h4 span{font-size: 16px;}
	main2 .mcnt3 .cnt > ul > li > a .tbx p{font-size: 14px; line-height: 1.5;}
	main2 .mcnt4 .cnt > ul > li {flex:100%;}
	main2 .mcnt5 .cnt ul{flex-direction: column;}
	
} 



/* 폴더블... 280까지  */
@media (max-width: 340px) {
/* header */
	.sitemap-btn{gap:3px 4px}
	#header .mems > ul > li > a{padding: 2px 6px; }
	#header .sitelogo a{width: clamp(60px, 28vw, 171px);}

/* main */
	main2 .mcnt3 .cnt > ul > li > a .tbx{padding: 30px 20px;}
	main2 .mcnt3 .cnt > ul > li > a .tbx h4 i{width: 30px; height: 30px;}
	
}