@charset "UTF-8";
@media (max-width:1440px){
	.footer_wrap .wa{right:12rem}
}
@media (max-width:1200px){
	
	.site-map,
	#gnb1 {display:none}
	#gnb2 {display:block; top:0 !important}
	#main {padding-top:10rem}
	#quick{display:none}
	.gnbNavi .etc{display:none}
	.gnbNavi{padding:2rem 0}
	
	
	/*전체메뉴*/
	#gnb2 .control {position:absolute; right:-1rem; top:2rem; right: 1rem; display:block; width:5rem; height:5rem; line-height:5rem; overflow:hidden; text-align:center}
	#gnb2 .control:before {color:#333; display:block; font-family:'xeicon'; font-size:3.2rem; width:100%; height:100%; line-height:inherit; transition:all .3s}
	#gnb2 .open:before {content:''}
	#gnb2 .close {display:none}
	#gnb2 .close:before {content:''}
	#head_menu_all {display:none; visibility:hidden; opacity:0; height:0; position:fixed; left:1rem; top:11rem; width:calc(100% - 2rem); z-index:1}
	#head_menu_all:before {content:''; background-color:#edf7ff; width:200%; height:calc(100% - 10rem); position:fixed; left:0; top:10rem; z-index:-1}
	#head_menu_all:after {content:''; background:#edf7ff url('/kor/img/layout/menu-bg.jpg') repeat left -5rem bottom -3rem; width:100%; height:40%; position:fixed; left:0; bottom:0; z-index:-1}
	#head_menu_all > li {border-bottom:1px solid #ddd}
	#head_menu_all > li > a {color:#333; display:block; font-size:2rem; padding:2rem 3rem 1.5rem; position:relative; z-index:1}
	#head_menu_all > li > a:after {content:''; font-family:'xeicon'; font-size:2.4rem; position:absolute; right:2rem; top:1.5rem; transition:all .3s}
	#head_menu_all .submenu {visibility:hidden; opacity:0; height:0}
	#head_menu_all .submenu > ul > li > a {color:#fff; display:block; font-size:1.8rem}
	#head_menu_all .submenu > ul > li + li {margin-top:2rem}
	#head_menu_all .submenu div a {color:rgba(255,255,255,0.8); position:relative; padding-left:1rem}
	#head_menu_all .submenu div a:before {content:''; background-color:rgba(255,255,255,0.8); width:2px; height:2px; position:absolute; left:0; top:6px}

	#gnb2.active .open {display:none}
	#gnb2.active .close {display:block}
	#gnb2.active #head_menu_all {display:block; visibility:visible; opacity:1; overflow-y:scroll; height:calc(100% - 14rem); margin-top:15rem; }
	#head_menu_all > li.active {border-bottom:0; border-radius:1.5rem 1.5rem 0 0; background-color:#317bb5}
	#head_menu_all > li.active > a {background-color:#182346; border-radius:1rem; color:#fff}
	#head_menu_all > li.active > a:before {content:''; background:url('/kor/img/sub/snb-bg.jpg') no-repeat center; background-size:contain; width:10rem; height:4rem; position:absolute; bottom:-6px; left:2rem; opacity:0.35; z-index:-1}
	#head_menu_all > li.active > a:after {transform:rotate(180deg)}
	#head_menu_all > li.active .submenu {visibility:visible; opacity:1; height:100%; padding:3.5rem 3rem 3rem}
	
	#header {position:absolute; top:0 !important}
	#wrap.head-on #header {position:fixed}
	#wrap.head-on .menuM{display:block; position:absolute; width:100%; padding:2rem 1rem; top:10rem; background-color: #b6d5f0 ; z-index:4}
	#wrap.head-on .menuM .section{padding:0}
	#wrap.head-on .menuM .etc{top:0; right:0; display:flex; z-index:3; position: relative; justify-content:center}
	#wrap.head-on .menuM .etc li{margin:0 1.5rem}
	#wrap.head-on .menuM #quickM{display:block; transform:none; top:0; position: relative; width: 100%; margin-top:2rem}
	#wrap.head-on .menuM #quickM .list{display:flex; border-radius:1rem; overflow: hidden; background-color:#fff; justify-content:space-around;}
	#wrap.head-on .menuM #quickM li{display:block; background-color:#fff; width:33.333%; line-height: 4rem; border-radius:0; text-align:center; position:relative}
	#wrap.head-on .menuM #quickM li::after{display:block; content:'|'; color:#ddd; position:absolute; right:0; top:50%; transform: translateY(-50%)}
	#wrap.head-on .menuM #quickM li:nth-last-of-type(1)::after{content:''}
	
	
}

@media (max-width:768px){

	#quick{display:none}
	.etc li a { display: block; width: 80%;}
		
	#wrap.head-on .menuM #quick li{background:#fff; padding: 0; word-break: keep-all}
	#wrap.head-on .menuM #quick li span{margin:0}
	
	.footer_wrap {padding:4rem 0 8rem 0}
	.footer_wrap .siteinfo{text-align:center}
	.footer_wrap .info span{display:block}
	.footer_wrap .info span:after {display:none}
	.footer_wrap .siteinfo .mail {display:block}
	#footer .btn-top {right:1.5rem; top:-3rem}
	
	.footer_wrap{flex-flow: wrap;justify-content: center;width: 100%;flex-direction: column; align-items: center;}
	.footer_wrap .wa{right:50%;transform: translateX(50%);bottom: 1rem;top: auto;}	
}
