@charset "utf-8";

/* 모든 디바이스 기준. 단, 스마트폰(portrait)을 제외 */
@media only screen and (min-width:769px) {
/* 전체메뉴 */
.allMenuNav {display:table; table-layout:fixed;}
	/* 메뉴 속성 및 사이즈 조정 */
	.allMenuNav .depth1m {display:table-cell;width:14.25%;padding-left:20px;border-right:1px solid rgba(255, 255, 255, .10);}
	.allMenuNav .depth1m > button {font-size:28px;line-height:37px;}
	.allMenuNav .depth2m > li {margin-bottom:15px;}
	.allMenuNav .depth2m > li:last-child{margin-bottom:0 !important;}
	.allMenuNav .depth2m > li > a{display:block; margin-bottom:10px; line-height:1.23;}
	.allMenuNav .depth2m > li > p a, .allMenuNav .depth2m li > a {font-size:15px;}
	.allMenuNav .depth3m {margin-left:4px; display:flex; flex-direction:column;}	
	.allMenuNav .depth3m li {line-height:1.23; display:flex; align-items:center; justify-content:flex-start; margin-bottom:5px;}
	.allMenuNav .depth3m li:last-child{margin-bottom:0;}
	.allMenuNav .depth3m li p a, .allMenuNav .depth3m li > a {font-size:14px; height:auto; line-height:1.23;}
	.allMenuNav a:focus {border:1px dotted #fff;}
	.allMenuNav li.depth1m_sns {width:0; border:0; padding:0;}
	.allMenuNav li.depth1m_sns button{position:absolute; left:87%; top:380px; text-align:left; cursor:pointer; line-height:34px; word-break:keep-all;}
	.moVer {display:none;}
	/* 메뉴창 닫기 버튼 */
	#mainNav button.menuClose {top:31px;left:50%;margin-left:-20px;opacity:.7;}
	#mainNav button.menuClose:hover,
	#mainNav button.menuClose:focus {opacity:1;}
	/* 외부연결 메뉴 - 국정지표, 국가상징, 어린이, 영문 */
	.linkNav {z-index:10;width:100%;margin-top:20px;}
	.linkNav > div:nth-child(1) {float:left;}
	.linkNav > div:nth-child(2) {float:right;}
	.linkNav a {width:80px;font-size:13px;color:#fff;text-align:center;opacity:.35;transition:all .3s ease;}
	/* 국정지표, 국가상징, 어린이, 영문 */
	.govLink {position:absolute;top:36px;right:30px;overflow:hidden;}
	.govLink a {line-height:30px;padding:0 15px;opacity:.7;}
	a.pipr_link {opacity:.7;}
	.govLink a:hover, .govLink a:focus,
	a.pipr_link:hover, a.pipr_link:focus {opacity:1;}
	/* 페이스북, 블로그, 트위터, 유튜브 */
	.hrdSocial {bottom:22px;right:30px;}
	.hrdSocial a {width:65px;font-size:13px;color:#444;text-align:center;opacity:.6;transition:all .3s ease;}
	/* 주소 */
	.hrdAddr {bottom:37px;left:30px;}
	
}

/* 패드 전용. 단, iPads pro는 제외시킴 */
@media only screen and (min-width:768px) and (max-width:1024px) {
/* 전체메뉴 */
	/* 메뉴 속성 및 사이즈 조정 */
	.allMenuNav .depth1m {padding-left:10px;}
	.allMenuNav .depth1m > button {font-size:19px;}
	.allMenuNav .depth2m > li > p a, .allMenuNav .depth2m li > a {font-size:13px;}
	.allMenuNav .depth3m {margin-left:5px;}	
	.allMenuNav .depth2m > li > p a, .allMenuNav .depth3m li > a {font-size:11px;}
	.allMenuNav li.depth1m_sns button{top:360px; line-height:22px;}
	/* 메뉴창 닫기 버튼 */
	#mainNav button.menuClose {transform:scale(.75, .75);}
}

/* 스마트폰(portrait) 디바이스 기준 */
@media only screen and (max-width:768px) {
	#mainNav {padding:80px 0;}
	
/* 전체메뉴 */
	.allMenuNav {display:block;padding:0 15px 20px 15px;}
	.allMenuNav .depth1m {display:block;width:100%;padding:10px 0;border-right:none;}
	.allMenuNav .depth1m > button {font-size:23px; line-height:1;}
	.allMenuNav li.depth1m_sns button{text-align:left; line-height:1.15;}
	.allMenuNav .depth1m > span {position:absolute;top:0;right:0;display:none;}
		/* 메뉴아이콘 */
		.allMenuNav .depth1m .icoMenu1 {background-position: -160px 0;}
		.allMenuNav .depth1m .icoMenu2 {background-position:-160px -40px;}
		.allMenuNav .depth1m .icoMenu3 {background-position:-160px -80px;}
		.allMenuNav .depth1m .icoMenu4 {background-position:-160px -120px;}
		.allMenuNav .depth1m .icoMenu5 {background-position:-160px -160px;}
		.allMenuNav .depth1m .icoMenu6 {background-position:-160px -200px;}
		.allMenuNav .depth1m .icoMenu7 {background-position:-160px -240px;}
	.allMenuNav .depth1m ul {height:1px;opacity:0;transition:all .3s ease-out;}
	.allMenuNav .depth1m > ul {position:absolute;top:0;left:135px;min-width:180px;}
	.allMenuNav .depth2m {display:none;margin-top:0;overflow:hidden;opacity:0;transition:all .5s;}	
	.allMenuNav .depth2m.on {display:block;height:inherit;padding:8px 0;opacity:1;transition:all .5s;}
	.allMenuNav .depth2m > li {line-height:36px;}
		/* 3Level 메뉴가 존재할 경우 */
		.allMenuNav .depth2m .down > a:after {
			display:inline-block;content:'';width:15px;height:15px;
			margin-left:10px;vertical-align:middle;
			background-image:url('../../images/2022/icoNav.png');
			background-repeat:no-repeat;
			background-position:-177px -294px;
		}
		.allMenuNav .depth2m .down.open > a:after {
			background-position:-177px -333px;
		}
	.allMenuNav .depth2m > li > p a, .allMenuNav .depth2m > li > a,
	.allMenuNav .depth2m > li > p a:hover, .allMenuNav .depth2m > li > a:hover{font-weight:600;font-size:18px;color:#333;padding-left:15px;}
	.allMenuNav .depth3m {display:none;margin-top:0;overflow:hidden;opacity:0;transition:all .5s;}
	.allMenuNav .depth3m.on {display:block;height:inherit;padding:5px 0;opacity:1;transition:all .5s;}
	.allMenuNav .depth3m li {line-height:30px;}
	.allMenuNav .depth3m li:before {margin:0 5px 0 25px;}
	.allMenuNav .depth3m li > a,
	.allMenuNav .depth3m li > a:hover {font-size:16px;color:#666;}
	/* 새창으로 열리는 메뉴 */	
	.allMenuNav .nwin a {color:#fff;}
	/* 외부연결 메뉴 - 국정지표, 국가상징, 어린이, 영문 */
	.linkNav {position:absolute;bottom:20px;width:100%;text-align:center;padding:10px 0;}
	.linkNav > div:nth-child(1) {display:none;}	
	.linkNav .social a {width:50px;opacity:.45;}
	.linkNav .social a span {display:block;color:#fff;text-align:center;}
	/* 메뉴창 닫기 버튼 */
	#mainNav button.menuClose {width:25px; height:25px; top:18px;right:15px;}
	/* 국정지표, 국가상징, 어린이, 영문 */
	.govLink {top:18px;left:10px;}
	.govLink a,
	.hrdAddr a.pipr_link{line-height:26px;padding:0 11px;opacity:.65;}
	/* 페이스북, 블로그, 트위터, 유튜브 */
	.hrdSocial {width:100%;bottom:45px;left:10px;}
	.hrdSocial a {opacity:.5;}
	.hrdSocial a span {display:none;}
	/* 주소 */
	.hrdAddr {bottom:20px;left:10px;font-size:12px;}
	
		/* 메뉴창 닫기 버튼 */
	#mainNav button.Open{width:25px; height:25px; right:15px; }
	
	
}
@media only screen and (max-width:414px) {
	.govLink {top: 4.348vw;left: 2.415vw; /*top:18px;left:10px;*/}
	.govLink a{line-height: 6.280vw;padding: 0 2.657vw;font-size: 2.657vw;  /* line-height: 26px; padding: 0 11px; font-size: 13px; */}
	.hrdAddr a.pipr_link{line-height: 6.280vw;padding: 0 2.657vw;font-size: 2.657vw;  /* line-height: 26px; padding: 0 11px; font-size: 13px; */}
    #mainNav button.Open{width: 6.039vw;height: 6.039vw;right: 4.286vw; top: 3.623vw;/*  width:25px; height:25px; right:15px;*/}
    #mainNav{ padding: 19.324vw 0; /*padding: 80px 0;*/ }
    .allMenuNav{ padding: 0 4.286vw 4.831vw 4.286vw; /*     padding: 0 15px 20px 15px; */}
    .allMenuNav .depth1m{padding: 2.415vw 0;/* padding:10px 0; */line-height: 1;}
    .allMenuNav .depth1m > button{font-size:5.556vw;/* font-size:23px; */line-height: 1;}
    .allMenuNav .depth1m > ul{left: 32.609vw;min-width: 43.478vw;/*left: 135px;min-width: 180px;*/}
    .allMenuNav .depth2m.on{padding:5px 0;}
    .allMenuNav .depth2m > li{ /* line-height:32px; */}
    .allMenuNav .depth2m > li > p a, 
    .allMenuNav .depth2m > li > a,
    .allMenuNav .depth2m > li > p a:hover, 
    .allMenuNav .depth2m > li > a:hover{/*font-size:15px;padding-left:15px;*/}
	.allMenuNav .depth3m.on {padding:1.208vw 0; /* padding:5px 0; */}
	.allMenuNav .depth3m li {/* line-height:30px; */}
	.allMenuNav .depth3m li:before {margin:0 1.208vw 0 6.039vw; /* margin:0 5px 0 25px; */}
	.allMenuNav .depth3m li > a,
	.allMenuNav .depth3m li > a:hover {/* font-size:14px; */}
	.allMenuNav .depth2m li > a.menuOn,
	.allMenuNav .depth3m li > a.menuOn{position:relative; display:inline-flex;align-items:flex-start;justify-content: flex-start;}
	.allMenuNav .depth2m li > a.menuOn:before,
	.allMenuNav .depth3m li > a.menuOn:before{content:'';position:absolute;width:auto;height:1px;background: #fff;display:block;opacity: .3;bottom: 1.208vw;right: 2.657vw; /* bottom: 5px;right: 11px; */}
	.allMenuNav .depth2m li > a.menuOn:before{left:4.286vw; /*left:15px;*/}
	.allMenuNav .depth3m li > a.menuOn:before{left:0;}
	.allMenuNav .depth2m li > a.menuOn:after,
	.allMenuNav .depth3m li > a.menuOn:after{content:''; display:block; background:#1da1f2; border-radius:100%; width:1.208vw; height:1.208vw; margin-top:1.691vw; margin-left:1.691vw; /*  width:5px; height:5px; margin-top:7px; margin-left:7px; */}
	
	/* 페이스북, 블로그, 트위터, 유튜브 */
	.hrdSocial {bottom:20.870vw;left:2.415vw; /* bottom:45px;left:10px; */}
	/* 주소 */
	.hrdAddr { bottom:4.831vw;left:2.415vw;font-size:2.899vw; /* bottom:20px;left:10px;font-size:12px; */}
}