@charset "utf-8";
/*
 * common.css
 * layout등 공통영역
 */
 
body										{ color:var(--color-base); word-wrap:break-word; word-break:keep-all; letter-spacing:-.025em; font-weight:400; color:var(--color-base) }
*:focus										{ outline:2px dotted var(--color-point) !important}
@page										{ size:21cm 29.7cm; margin:15px 0}
@media print {
  #wrap						{ width:1168px; margin:0 }
  .search_quick_wrap		{ width:calc(1168px - 30px); margin:0;  }
}
@font-face {
	font-family:'TENADA';    
	font-style: normal;    
	font-weight:500;
	src: local('TENADA'),
	url('/resource/www/fonts/TENADA.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('/resource/www/fonts/TENADA.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
@font-face {
	font-family:'GongGothic';    
	font-style: normal;    
	font-weight:500;
	src: local('GongGothicMedium'),
	url('/resource/www/fonts/GongGothicMedium.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('/resource/www/fonts/GongGothicMedium.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* root 설정  */
:root{
	--color-base:#222;
	--color-base1:#333;
	--color-base2:#555;
    --color-base3:#444;
    --color-ddd:#ddd;
	--color-point:#005bac;
	--color-white:#fff;
	--color-yellow:#fdd000;
	--color-gray:#e5e5e5;
	--color-pink:#ec4792;
	--color-green:#3eb135;
    --color-green1:#17c057;
	--color-deep-green:#00ac49;
	--color-red:#c7000c;
	--color-mint:#00aca9;
	--color-skyblue:#288fcf;
	--color-light-gray:#f2f2f2;
	--color-purple:#9200ac;
	--color-light-blue:#e4f0fa;
	--color-light-mint:#eafbf3;
  
   --color-point2:#0092ac;
    --color-orange:#f26d0c;
  	--color-line:#d8d9db;
    --color-black:#000;
  
	--font-pretendard:'Pretendard', Sans-serif;
	--font-GongGothic:'GongGothic', Sans-serif;
	--font-tenada:'TENADA', Sans-serif;
	--trans-ani:0.3s ease 0s;
}

/* 색상 */
.color_red											{ color:var(--color-red) !important; }
.color_point										{ color:var(--color-point) !important; }
.color_pink											{ color:var(--color-pink)!important; }
.color_green										{ color:var(--color-green)!important; }
.color_mint											{ color:var(--color-mint)!important; }

img						{ vertical-align:top; max-width:100%; }
.none_list				{ width:100%; text-align:center; padding:1em 0; font-size:1.033em; }
.none_data				{ width:100% !important; text-align:center; padding:5em; border-radius:20px;   }
.none_data a			{ width:100%; display:flex !important; align-items:center !important; justify-content:center}



@keyframes iconShow{
    0%{transform:translateY(0);}
    25%{transform:translateY(-10px);}
    50%{transform:translateY(0);}
    75%{transform:translateY(-5px);}
    100%{transform:translateY(0);}
}
@keyframes updown { 
	0% { transform:translateY(0%) }
	50% { transform:translateY(3%) }
	100% { transform:translateY(0%) }
}
@keyframes img_box {
    0% { left:0; }
    100% { left:100%; }
}

@keyframes slide{
    0%{opacity:1; left:-100%}
    50%{opacity:1; left:0}
    100%{opacity:1; left:100%}
}


.top_banner_wrap .swiper-slide>a:focus::after					{ position:absolute; width:calc(100% - 1%); height:calc(100% - 6%); left:50%; top:50%;  border:2px dotted var(--color-point);  transform:translate(-50%,-50%); content:''; z-index:2 }	
.top_banner_wrap .swiper-slide>a:focus,
.top_banner_wrap .control *:focus								{ outline:none !important; }	
.top_banner_wrap .control *:focus::after						{ position:absolute; width:calc(100% + 6%); height:calc(100% + 6%); left:-3%; top:-3%;  border:2px dotted var(--color-white); content:''; z-index:2 }	


/* 다크모드 */
[data-footer="dark"]						{ position:fixed; left:1.5%; bottom:1em; z-index:20;  }
[data-footer="dark"] button					{ display:block; position:relative; width:40px; height:80px; background:var(--color-white); border-radius:3em; filter:drop-shadow(8px 2px 5px rgba(0,0,0,.15));}
[data-footer="dark"] button::before			{ position:absolute; left:5px; top:5px; content:''; display:inline-block; width:30px; height:30px; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; 
												background-color:var(--color-yellow); border-radius:100%; transition:var(--trans-ani); }
[data-footer="dark"] button::before			{ background-image:url(/resource/www/images/common/icon_light.svg);}
[data-footer="dark"] button.active::before	{ background-image:url(/resource/www/images/common/icon_dark.svg); top:45px; background-color:rgba(0, 0, 0, .7);}



/************************************************************************
	
								상단

************************************************************************/
/* 커튼배너 */
.top_banner_wrap *:focus												{ outline:1px dotted var(--color-white) !important}
.top_banner_wrap .label .check_input:focus + .check_label::before		{ opacity:1; }
.top_banner_wrap .label:has(:focus)	.check_label						{ opacity:1; outline:1px dotted var(--color-white) }						
.top_banner_wrap .label .top_banner_close:has(:focus) .check_label		{ opacity:.74; outline:none !important; }


/*  전자정부 */
.top_util .util															{ display:flex; gap:0 15px; align-items:center;  }
.top_util .util [data-util="korea"] a									{ display:block; width:28px; height:19px; background:url(/resource/www/images/common/icon_korea.svg) no-repeat 50% 50% /cover; border:1px solid #e5e5e5 }
.top_util .util [data-util="gov"]										{ display:flex; align-items:center; }
.top_util .util [data-util="gov"]>.text									{ font-size:.94em; color:#000 }

/*  글자설정 */
.top_util .login [data-util="display_size"]									{ position:relative; margin-right:-20px; }
.top_util .login [data-util="display_size"] .btn_size_text					{ display:flex; align-items:center; height:35px; padding:0 20px; gap:0 10px; background:#ededed; border-radius:25px; font-size:14px; font-weight:500; line-height:1 }
.top_util .login [data-util="display_size"] .btn_size_text .icon			{ position:relative; display:flex; width:16px; height:13px; }
.top_util .login [data-util="display_size"] .btn_size_text .icon::before	{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/www/images/common/icon_type.svg) no-repeat 50% 50% / contain; }
.top_util .login [data-util="display_size"] .display_size_box				{ position:absolute; display:none; top:47px; left:50%; width:150px;  transform:translateX(-50%); z-index:60; }
.top_util .login [data-util="display_size"] .display_size_box::before		{ position:absolute; left:50%; width:15px; height:15px; border:1px solid rgba(0,0,0,.1); background:var(--color-white); transform:translateX(-50%) rotate(45deg); top:-6px;
																				 content:''; z-index:-1;  }
.top_util .login [data-util="display_size"] .display_size_box::after		{ position:absolute; left:50%; width:15px; height:2px; background:var(--color-white); transform:translateX(-50%); top:0px; content:''; z-index:2;   }																			
.top_util .login [data-util="display_size"] .display_size_box>ul			{ position:relative; z-index:2; padding:10px; border:1px solid rgba(0,0,0,.1); border-radius:15px; background:var(--color-white); display:flex; flex-flow:column;}
.top_util .login [data-util="display_size"] .display_size_box>ul>li			{ padding:5px; }
.top_util .login [data-util="display_size"] .display_size_box>ul>li.active	{ background:var(--color-light-blue); border-radius:8px; }
.top_util .login [data-util="display_size"] .btn_size						{ position:relative; display:flex; width:100%; align-items:center; gap:5px; font-size:1.03em }
.top_util .login [data-util="display_size"] .btn_size:before 				{ content:"가"; display:inline-flex; justify-content:center; align-items:center; width:30px; height:30px; color:var(--color-base); 
																				border:0.1rem solid rgba(0,0,0,.1); border-radius:.4rem; font-size:.85rem; background-color:var(--color-white)}
.top_util .login [data-util="display_size"] .btn_size.md:before		 							{ font-size:1rem;}
.top_util .login [data-util="display_size"] .btn_size.lg:before									{ font-size:1.2rem;}
.top_util .login [data-util="display_size"] .btn_size.xlg:before 								{ width:40px; height:40px; font-size:1.4rem; }
.top_util .login [data-util="display_size"] .btn_size.xxlg:before 								{ width:40px; height:40px; font-size:1.6rem; } 
.top_util .login [data-util="display_size"] .display_size_box>ul>li.active .btn_size			{ color:var(--color-point); }
.top_util .login [data-util="display_size"] .display_size_box>ul>li.active .btn_size:before 	{ background:var(--color-point); color:var(--color-white); border-color:var(--color-point); }
.top_util .login [data-util="display_size"] .display_size_box>ul>li:last-child					{ margin-top:10px; padding-top:10px; border-top:1px solid rgba(0,0,0,.1); }
.top_util .login [data-util="display_size"] .btn_size_reset										{ display:flex; align-items:center; justify-content:center; gap:7px; width:100%; border-radius:25px; background:var(--color-point); line-height:1; 
																									padding:0 15px; color:var(--color-white); font-size:.9rem; height:35px; }
.top_util .login [data-util="display_size"] .btn_size_reset::before								{ display:inline-flex; justify-content:center; align-items:center; width:13px; height:13px;
																									 background:url(/resource/www/images/common/icon_reset.svg) no-repeat 50% 50% / contain; content:''; }
.top_util .login [data-util="lang"]																{ display:none; }

/* 상단 */
.header															{ position:relative; z-index:50; background:var(--color-white); transition:var(--trans-ani);}
.header.fixed													{ z-index:90; }
.header	.nav_wrap												{ position:relative; border-bottom:1px solid transparent }
.header .inr													{ display:flex; align-items:center; width:94%; max-width:1600px; box-sizing:initial; margin:0 auto; --size:80px; height:var(--size) }
.header h1														{ position:relative; }
.header h1 a													{ display:block; width:169px; height:51px; background:url(/resource/www/images/common/img_logo.png) no-repeat 50% 50% / contain}

.header .area_util												{ display:flex; align-items:center; gap:0 30px; }
.header .area_util [data-util]>a,
.header .area_util [data-util] .btn_lang 						{ position:relative; display:flex; flex-flow:column; gap:5px; align-items:center; font-size:14px; font-weight:500; color:var(--color-base); transition:var(--trans-ani);line-height: inherit; }
.header .area_util [data-util] .icon							{ position:relative; display:flex; width:18px; height:18px; }
.header .area_util [data-util] .icon::before					{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background-size:contain; background-position:50% 50%; background-repeat:no-repeat; transition:var(--trans-ani)}
.header .area_util [data-util] .btn_lang .icon::before			{ background-image:url(/resource/www/images/common/icon_language.svg); }
.header .area_util [data-util="login"] .icon::before			{ background-image:url(/resource/www/images/common/icon_login.svg); }
.header .area_util [data-util="logout"] .icon::before			{ background-image:url(/resource/www/images/common/icon_logout.svg); }
.header .area_util [data-util="sitemap"] .icon::before			{ background-image:url(/resource/www/images/common/icon_sitemap.svg); }
.header .area_util [data-util="lang"]							{ position:relative; }
.header .area_util [data-util] .btn_lang.active,
.header .area_util [data-util]>a:hover,
.header .area_util [data-util] .btn_lang:hover,
.header .area_util [data-util]>a:focus,
.header .area_util [data-util] .btn_lang:focus					{ color:var(--color-point); }
.header .area_util [data-util] .btn_lang.active .icon::before,
.header .area_util [data-util]>a:hover .icon::before,
.header .area_util [data-util] .btn_lang:hover .icon::before,
.header .area_util [data-util]>a:focus .icon::before,
.header .area_util [data-util] .btn_lang:focus .icon::before	{ filter:invert(21%) sepia(90%) saturate(1622%) hue-rotate(191deg) brightness(102%) contrast(101%); }
.header .area_util .lang_box									{ position:absolute; display:none; width:100%; min-width:100px; left:50%; transform:translatex(-50%); border:1px solid #e5e5e5; border-radius:10px; top:45px; padding:5px; z-index:60; 
																	background:#fff; }
.header .area_util .lang_box>ul									{ display:flex; flex-flow:column; align-items:center; }
.header .area_util .lang_box>ul>li>a							{ display:block; text-align:center; position:relative; padding:10px; transition:all ease 0.2s; font-size:14px; font-weight:400; line-height:1; color:var(--color-base); letter-spacing:0 }
.header .area_util .lang_box>ul>li>a::before					{ position:absolute; width:0; height:2px; background:var(--color-point); left:50%; bottom:0; content:''; transform:translateX(-50%); transition:all ease 0.2s}
.header .area_util .lang_box>ul>li>a:hover,
.header .area_util .lang_box>ul>li>a:focus						{ color:var(--color-point);  }
.header .area_util .lang_box>ul>li>a:hover::before,
.header .area_util .lang_box>ul>li>a:focus::before				{ width:100%; }



/* gnb */
.header nav																{ margin-left:auto; margin-right:auto;}
.header nav .gnb														{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:stretch; margin-top:30px;}
.header nav .gnb a														{ display:inline-flex; justify-content:flex-start; align-items:center; line-height:1.15em; word-break:keep-all; }
.header nav .gnb a[target="_blank"]::after								{ content:''; opacity:0.8; display:inline-block; width:8px; height:8px; margin-left:7px; background:url(/resource/common/images/common/icon_top_family_blank.svg) no-repeat 50% 50%;
    																		background-size:100%; vertical-align:middle; margin-top:-1px}


.header nav .gnb > li > a												{ padding:0 40px; font-size:20px; font-weight:600; transition:var(--trans-ani); transition:transform var(--trans-ani); color:var(--color-base) }
.header nav .gnb > li > a span											{ display:inline-block; position:relative; padding-bottom:30px; }
.header nav .gnb > li > a span:after									{ content:''; display:block; position:absolute; bottom:10px; left:50%; width:6px; height:6px; background-color:var(--color-point); transform:translateX(-50%); 
																			transition:transform var(--trans-ani); opacity:0; border-radius:100%; z-index:1 }
.header nav .gnb > li.active > a span:after,
.header nav .gnb > li > a:hover span:after,
.header nav .gnb > li > a:focus span:after								{ opacity:1  }
.header nav .gnb > li.active > a,
.header nav .gnb > li > a:hover,
.header nav .gnb > li > a:focus											{ color:var(--color-point); }


.header nav .gnb > li .box												{ opacity:0; visibility:hidden; display:flex; justify-content:space-between; align-items:flex-start; position:absolute; left:50%; width:98%; --sizeWidth:300px; 
																			max-width:1860px; min-height:30em; transform:translateX(-50%); transition:opacity 0.2s ease-in-out 0s, visibility 0.1s linear 0s; box-sizing: border-box;
																			background:var(--color-white); border-radius:20px; padding:2em 2em 2em calc(var(--sizeWidth) + 2em); box-shadow:1px 1px 15px rgba(0,0,0,.1);}
.header nav .gnb > li .gnb_title										{ position:absolute; width:var(--sizeWidth); height:102%; left:0; top:0; flex:none; display:flex; flex-flow:column nowrap; justify-content:flex-start; 
																			align-items:flex-start; box-sizing:border-box; padding:2em; background:var(--color-point); border-radius:20px; overflow:hidden}
.header nav .gnb > li .gnb_title::before								{ position:absolute; right:0; width:calc(var(--sizeWidth) - 30px); height:calc(var(--sizeWidth) - 30px); bottom:0; content:''; background-size:contain; 
																			background-position:50%; background-repeat:no-repeat; }																		
.header nav .gnb > li.gnb1 .gnb_title::before							{ background-image:url(/resource/www/images/common/bg_gnb1.png); }																		
.header nav .gnb > li.gnb2 .gnb_title::before							{ background-image:url(/resource/www/images/common/bg_gnb2.png); }	
.header nav .gnb > li.gnb3 .gnb_title::before							{ background-image:url(/resource/www/images/common/bg_gnb3.png); }	
.header nav .gnb > li.gnb4 .gnb_title::before							{ background-image:url(/resource/www/images/common/bg_gnb4.png); }	
.header nav .gnb > li.gnb5 .gnb_title::before							{ background-image:url(/resource/www/images/common/bg_gnb5.png); }	
.header nav .gnb > li.gnb6 .gnb_title::before							{ background-image:url(/resource/www/images/common/bg_gnb6.png); }	
.header nav .gnb > li.gnb7 .gnb_title::before							{ background-image:url(/resource/www/images/common/bg_gnb7.png); }	
.header nav .gnb > li .gnb_title h2										{ position:relative; font-size:2.19em; color:var(--color-white); font-weight:700; padding-bottom:.25em}
.header nav .gnb > li .gnb_title h2:before,
.header nav .gnb > li .gnb_title h2:after								{ position:absolute; bottom:0; left:0; content:''; display:block; width:6px; height:6px; background-color:var(--color-white); border-radius:100%;}
.header nav .gnb > li .gnb_title h2:after								{ left:12px; opacity:.3}
.header nav .gnb > li .gnb_title p										{ margin-top:1.5em; font-size:1.06em; color:var(--color-white); word-break:keep-all; line-height:1.4em;}
.header nav .gnb > li .box > .gnb_2dep									{ position:relative; display:flex; width:100%; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; max-height:30em; overflow-y:auto; overflow-x:hidden; gap:1em; 
																				padding:0 5px  }
.header nav .gnb > li .box > .gnb_2dep::-webkit-scrollbar 				{ -webkit-appearance:none; width:4px; } 
.header nav .gnb > li .box > .gnb_2dep::-webkit-scrollbar-thumb 		{ background-color:var(--color-point); border-radius:5px; } 
.header nav .gnb > li .box > .gnb_2dep::-webkit-scrollbar-track 		{ border-radius:5px; background-color:rgba(0,0,0,.2); }
.header nav .gnb > li .box > .gnb_2dep > li								{ flex:0 1 calc((100% - 5em) / 6); display:flex; flex-flow:column; box-sizing:border-box; }
.header nav .gnb > li.gnb6 .box > .gnb_2dep > li						{ flex:0 1 calc((100% - 3em) / 4); }
.header nav .gnb > li .box > .gnb_2dep > li > a							{ position:relative; display:flex; align-items:center; width:100%; height:100%; padding:.83em; font-size:1.067em; font-weight:600; transition:color var(--trans-ani);
    																		border:1px solid var(--color-gray); border-radius:5px; transition:var(--trans-ani); color:var(--color-base);}
.header nav .gnb > li .box > .gnb_2dep > li:hover > a,
.header nav .gnb > li .box > .gnb_2dep > li:focus > a,
.header nav .gnb > li .box > .gnb_2dep > li > a:hover,
.header nav .gnb > li .box > .gnb_2dep > li > a:focus 					{ color:var(--color-white); background:var(--color-point); }
.header nav .gnb > li .box > .gnb_2dep > li > a[target="_blank"]::after							{ width:10px; height:10px; min-width:10px; }
.header nav .gnb > li .box > .gnb_2dep > li > a[target="_blank"]:hover::after,
.header nav .gnb > li .box > .gnb_2dep > li > a[target="_blank"]:focus::after					{ filter:invert(1); opacity:1 }


.header nav .gnb > li .box > .gnb_2dep > li > a::before					{ content:''; position:absolute; right:.83em; top:50%; width:7px; height:7px; border-style:solid; border-width:1px 1px 0 0; border-color:var(--color-base); 
																			transform:translateY(-65%) rotate(135deg); opacity:.5;  }
.header nav .gnb > li .box > .gnb_2dep > li.only > a::before			{ transform:translateY(-50%) rotate(45deg); }
.header nav .gnb > li .box > .gnb_2dep > li:hover > a::before,
.header nav .gnb > li .box > .gnb_2dep > li:focus > a::before,
.header nav .gnb > li .box > .gnb_2dep > li > a:hover::before,
.header nav .gnb > li .box > .gnb_2dep > li > a:focus::before			{ opacity:1; border-color:var(--color-white); transition:var(--trans-ani); }
.header nav .gnb > li .box > .gnb_2dep > li > ul						{ display:flex; flex:100%; flex-flow:column; margin-top:.75em; }
.header nav .gnb > li .box > .gnb_2dep > li > ul > li					{ line-height:1 }
.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a				{ position:relative; display:block; padding:4px 0px 4px 12px; color:#444; font-size:.98em; transition:color var(--trans-ani); font-weight:500 }
.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a:before		{ content:''; opacity:0.2; display:block; position:absolute; left:0px; top:10px; width:4px; height:4px; background-color:var(--color-base); border-radius:100%;
    																		transition:var(--trans-ani);}
.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a:hover,
.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a:focus						{ color:var(--color-base); font-weight:700;}
.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a:hover:before,
.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a:focus:before				{ opacity:1; background-color:var(--color-point);}
.header nav .gnb > li .box > .gnb_2dep > li > ul a[target="_blank"]:hover::after,
.header nav .gnb > li .box > .gnb_2dep > li > ul a[target="_blank"]:focus::after	{ filter:invert(14%) sepia(78%) saturate(7493%) hue-rotate(198deg) brightness(92%) contrast(101%); opacity:1 }
.header nav .gnb > li .box > .gnb_2dep > li > ul > li > ul							{ display:none;}
.header nav .gnb > li.active .box													{ opacity:1; visibility:visible; transition-delay:0.1s, 0.1s;}

/* 분야별 메뉴 */
.header nav .gnb > li.gnb4 .gnb_2dep									{ gap:2.5em 1em; }
.header nav .gnb > li.gnb4 .gnb_2dep>li>ul								{ display:none; }
.header nav .gnb > li.gnb4 .gnb_2dep>li,
.header nav .gnb > li.gnb6 .gnb_2dep>li									{ padding:4px 0; }
.header nav .gnb > li.gnb4 .gnb_2dep>li>a								{ padding:0; border:none; border-radius:0; justify-content:center; }
.header nav .gnb > li.gnb4 .gnb_2dep>li>a>span							{ display:flex; flex-flow:column; justify-content:center; gap:10px; align-items:center}
.header nav .gnb > li.gnb4 .gnb_2dep>li>a>span::before					{ position:relative; display:flex; width:110px; height:110px; border-radius:100%; content:''; background-size:contain; background-position:50% 50%; background-repeat:no-repeat; 
																			content:''; }
.header nav .gnb > li.gnb4 .gnb_2dep>li>a>span::after					{ position:absolute; width:110px; height:110px; border-radius:100%; top:0; left:50%; content:''; content:''; background:var(--color-light-gray); transform:translateX(-50%); z-index:-1 }																										
.header nav .gnb > li.gnb4 .gnb_2dep>li>a::before						{ display:none; }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(1)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu01.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(2)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu02.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(3)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu03.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(4)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu04.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(5)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu05.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(6)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu06.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(7)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu07.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(8)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu08.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(9)>a>span::before		{ background-image:url(/resource/www/images/common/icon_menu09.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(10)>a>span::before	{ background-image:url(/resource/www/images/common/icon_menu10.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(11)>a>span::before	{ background-image:url(/resource/www/images/common/icon_menu11.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li:nth-child(12)>a>span::before	{ background-image:url(/resource/www/images/common/icon_menu12.svg); }
.header nav .gnb > li.gnb4 .gnb_2dep>li>a:hover,
.header nav .gnb > li.gnb4 .gnb_2dep>li>a:focus 						{ background:none; color:var(--color-point)}
.header nav .gnb > li.gnb4 .gnb_2dep>li>a:hover>span::before,
.header nav .gnb > li.gnb4 .gnb_2dep>li>a:focus>span::before			{ animation:iconShow 0.7s ease-in-out 1 forwards; } 
.header nav .gnb > li.gnb4 .gnb_2dep>li>a[target="_blank"]::after		{ display:none; }


/* 메뉴 배경 */
.gnb_bg																	{ display:none; visibility:hidden }


/* 상단 고정시 */
.header.fixed													{ position:fixed; width:100%; top:50px; left:0;  }
.header.fixed .nav_wrap											{ border-bottom-color:#e5e5e5  }
.header.fixed .inr												{ width:94%; max-width:inherit; transition:var(--trans-ani); --size:80px; }
.header.fixed  h1 a												{ width:136px; height:41px; transition:var(--trans-ani); }

.header.fixed nav .gnb > li > a									{ font-size:19px; transition: var(--trans-ani); }
.header.fixed nav .gnb > li > a span:after						{ transition:var(--trans-ani); }
.header.fixed .area_util [data-util]							{ transition:var(--trans-ani); }
.top_util.fixed													{ position:fixed; top:0; left:0; width:100%; z-index:91; background:var(--color-white)}
.top_util.fixed	 .con_inner										{ max-width:inherit; transition:var(--trans-ani); }

/* 모바일 메뉴 */
.mob_gnb_control												{ display:none; width:50%; --size:50px; height:var(--size); background-color:var(--color-point);}
.mob_gnb_control ul												{ display:flex; align-items:center; height:100%;}
.mob_gnb_control ul > li										{ display:flex; align-items:center;}
.mob_gnb_control ul > li a										{ display:inline-flex; justify-content:center; align-items:center; min-width:100px; height:var(--size); box-sizing:border-box; padding:0 15px;
    																border-right:1px solid rgba(255,255,255,0.1); color:var(--color-white); font-size:14px; text-align:center;}
.mob_gnb_control ul > li[data-util] a:before					{ content:''; display:inline-block; --size:18px; width:var(--size); height:var(--size); margin-right:5px; background-repeat:no-repeat; background-position:50% 50%; background-size:100%;}
.mob_gnb_control ul > li[data-util="login"] a:before			{ background-image:url(/resource/www/images/common/img_util_login_w.svg);}
.mob_gnb_control ul > li[data-util="logout"] a:before			{ background-image:url(/resource/www/images/common/img_util_login_w.svg);}
.mob_gnb_control ul > li[data-util="dark"]						{ display:none; }
.mob_gnb_control ul > li[data-util="dark"] a:before				{ background-image:url(/resource/www/images/common/img_util_dark_w.svg);}
.mob_gnb_control  > ul > li[data-util="dark"] a.on				{ background-color:#003d73;}
.mob_gnb_control  > ul > li[data-util="dark"] a.on:before		{ background-image:url(/resource/www/images/common/img_util_dark_on.svg);}
.btn_menu_open													{ display:none; position:absolute; right:3%; top:50%; --size:25px; width:var(--size); height:var(--size); transform:translateY(calc(-50% + 0.5px));}
.btn_menu_open:before											{ content:''; display:block; width:var(--size); height:var(--size); background-image:url(/resource/www/images/common/icon_sitemap.svg);background-repeat:no-repeat; 
																	background-position:50% 50%; background-size:18px;}
.btn_menu_open.active											{ position:fixed; }




/* 날씨 */
.weather_wrap													{ display:flex; align-items:center; flex-wrap:wrap; justify-content:end; gap:20px; }
.weather_wrap>li												{ flex:auto; display:flex; flex-flow:column; align-items:flex-start; line-height:1; color:var(--color-base); }
.weather_wrap>li .day											{ font-size:.94rem; font-weight:400; margin-top:3px; opacity:.84; line-height:1; }
.weather_wrap>li .tem											{ font-size:1rem; font-weight:100; line-height:1;}
.weather_wrap>li .tem>i											{ font-size:2.19rem; font-weight:900; margin-right:5px; }
.weather_wrap>li:last-child										{ gap:12px; font-size:1rem; font-weight:600;  align-items:end; opacity:.9; }
.weather_wrap>li:last-child span								{ display:flex; align-items:center; gap:0 10px; }
.weather_wrap .icon												{ display:inline-block; text-indent:-9999em; font-size:0; }
.weather_wrap .icon::before										{ content:''; display:block; background-position:50% 50%; background-repeat:no-repeat; background-size:contain; /*animation:weatherAni 1.5s linear 0s infinite;*/}
.weather_wrap .icon1::before									{ width:56px; height:57px; background-image:url(/resource/www/images/weather/weather_sun.png);  }

.weather_wrap .icon2::before									{ width:74px; height:57px; background-image:url(/resource/www/images/weather/weather_suncloud.png);  }
.weather_wrap .icon3::before									{ width:74px; height:57px; background-image:url(/resource/www/images/weather/weather_cloud.png);  }
.weather_wrap .icon4::before									{ width:69px; height:57px; background-image:url(/resource/www/images/weather/weather_rain.png); }
.weather_wrap .icon5::before									{ width:70px; height:57px; background-image:url(/resource/www/images/weather/weather_snowRain.png); }
.weather_wrap .icon6::before									{ width:54px; height:56px; background-image:url(/resource/www/images/weather/weather_snow.png); }
.weather_wrap .dust												{ display:inline-block; text-indent:-9999em; font-size:0; margin-top:-2px }
.weather_wrap .dust::before										{ content:''; display:block; width:19px; height:19px; background-position:50% 50%; background-repeat:no-repeat; background-size:contain; }
.weather_wrap .dust1::before									{ background-image:url(/resource/www/images/weather/icon_good.svg);  }
.weather_wrap .dust2::before									{ background-image:url(/resource/www/images/weather/icon_usually.svg); }
.weather_wrap .dust3::before									{ background-image:url(/resource/www/images/weather/icon_bad.svg); }
.weather_wrap .dust4::before									{ background-image:url(/resource/www/images/weather/icon_verybad.svg); }


/* 검색 */
.search_wrap													{ flex:0 1 calc(100% - 52%); max-width:710px;}
.search_wrap .searchForm										{ width:100%; position:relative; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; }
.search_wrap .searchForm::before								{ position:absolute; width:calc(100% - 30px); height:65px; left:0; bottom:0; border-radius:50px; background:linear-gradient(to right, #00aca9, #005bac); content:''; pointer-events:none;}
.search_wrap .searchForm .img									{ position:absolute; left:35px; bottom:3px; width:100px; height:93px; background:url(/resource/www/images/common/img_search.svg) no-repeat 50% 50% / contain; z-index:2 }
.search_wrap .searchForm .text									{ position:absolute; width:100%; text-align:center; left:50%; bottom:12px; font-size:1.56rem; font-family:var(--font-tenada); background:linear-gradient(to right, #00aca9, #005bac); 
																	pointer-events:none; letter-spacing:-.045em;
																	-webkit-background-clip:text; -webkit-text-fill-color:transparent; font-weight:bold; z-index:2; transform:translateX(-50%); opacity:1; transition:var(--trans-ani);  line-height:1.25;}
.search_wrap .searchForm .total_search							{ position:relative; width:calc(100% - 36px); height:59px; border-radius:50px;  margin:3px; padding:0 40px 0 145px; border:none; font-size:1rem }
.search_wrap .searchForm .search_btn,
.search_wrap .searchForm .btn_voice_search						{ position:relative; width:65px; height:65px; border-radius:100%; background:linear-gradient(to right, #005bac, #288fcf); margin-left:-39px }
.search_wrap .searchForm .search_btn::before					{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/www/images/common/icon_search.svg) no-repeat 50% 50% / 21px; }
.search_wrap .searchForm:has(.total_search:focus) .text			{ opacity:0;  }
.search_wrap .searchForm .total_search:focus					{ outline:2px dotted var(--color-white) !important}
.search_wrap .searchForm:has(.total_search:not(:placeholder-shown)) .text {
    opacity: 0;
}
/* sns */
.area_sns														{ display:flex; flex-wrap:wrap; gap:10px; }
[data-sns]														{ position:relative; display:flex; width:46px; height:46px; font-size:0; text-indent:-9999em  }
.area_sns a														{ position:relative; display:flex }
[data-sns]::before												{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background-size:contain; background-position:50%; background-repeat:no-repeat; }
[data-sns="youtube"]::before									{ background-image:url(/resource/www/images/common/icon_youtube.svg); }
[data-sns="blog"]::before										{ background-image:url(/resource/www/images/common/icon_blog.svg); }
[data-sns="facebook"]::before									{ background-image:url(/resource/www/images/common/icon_facebook.svg); }
[data-sns="instagram"]::before									{ background-image:url(/resource/www/images/common/icon_instagram.svg); }		




@keyframes weatherAni{
    0%{opacity:1; transform:scale(1, 1);}
    50%{opacity:1;}
    100%{opacity:0; transform:scale(1.1, 1.1);}
}




/* 하단 */
.footer .flex													{ position:relative; display:flex; flex-wrap:wrap; gap:10px 2em; margin-top:2em }
.footer .flex .f_logo											{ display:block; width:169px; height:51px; background:url(/resource/www/images/common/img_logo.png) no-repeat 50% 50% / contain}
.footer .flex .wa_mark											{ position:absolute; right:0; bottom:-.25em; width:100px; height:auto;  }
.footer .flex .wa_mark[target='_blank']::after					{ display:none; }
.footer .copyright .list										{ margin-top:6px; gap:5px 35px; }
.footer .copyright .list>li:last-child							{ flex:100%; }
.footer .copyright .link>.copy									{ flex:auto; display:flex; justify-content:end; margin-top:0; }






@media all and (max-width:1668px){
	/* 전자정부 */
	.top_util .login [data-util="display_size"]							{ margin-right:-10px; }
	
	/* 날씨 */
	.weather_wrap>li .tem,
	.weather_wrap>li:last-child										{ font-size:.98rem; }
	.weather_wrap>li .tem>i											{ font-size:2.09rem; }
	.weather_wrap>li .day											{ font-size:.93rem; }
	.weather_wrap .icon1::before									{ width:54px; height:55px; }
	.weather_wrap .icon2::before									{ width:71.5px; height:55px; }
	.weather_wrap .icon3::before									{ width:71.5px; height:55px; }
	.weather_wrap .icon4::before									{ width:66.5px; height:55px; }
	.weather_wrap .icon5::before									{ width:67.5px; height:55px; }
	.weather_wrap .icon6::before									{ width:53px; height:54px; }	
	
	/* 검색 */
	.search_wrap .searchForm .text									{ font-size:1.5rem; bottom:14px; }
	
	/* 메뉴 */
	.header nav .gnb > li .box											{ --sizeWidth:280px; padding:2em 1.5em 2em calc(var(--sizeWidth) + 1.5em) }
	.header nav .gnb > li .gnb_title h2									{ font-size:2.1em; }	
	.header nav .gnb > li .box > .gnb_2dep								{ gap:1em .5em; }	
	.header nav .gnb > li .box > .gnb_2dep > li							{ flex:0 1 calc((100% - 2.5em) / 6); }
	.header nav .gnb > li.gnb6 .box > .gnb_2dep > li					{ flex:0 1 calc((100% - 1.5em) / 4); }
	.header nav .gnb > li .box > .gnb_2dep > li > a						{ font-size:1em; padding:.83em .73em;}	
	.header nav .gnb > li .box > .gnb_2dep > li > a::before				{ right:.73em; transform:translateY(-90%) rotate(135deg); }
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a			{ font-size:.95em; }	
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a:before	{ top:9px; }
	/* 분야별 */
	.header nav .gnb > li.gnb4 .gnb_2dep								{ gap:2.5em .5em; }
	.header nav .gnb > li.gnb4 .gnb_2dep>li>a							{ padding:0; }
	
}
@media all and (max-width:1568px){
	/* 전자정부 */
	.top_util .util [data-util="gov"]>.text								{ font-size:.9em; }
	
	/* 날씨 */
	.weather_wrap>li .tem,
	.weather_wrap>li:last-child										{ font-size:.95rem; }
	.weather_wrap>li .tem>i											{ font-size:2rem; }
	.weather_wrap>li .day											{ font-size:.9rem; margin-top:0; }
	.weather_wrap .icon1::before									{ width:52px; height:53px; }
	.weather_wrap .icon2::before									{ width:69px; height:53px; }
	.weather_wrap .icon3::before									{ width:69px; height:53px; }
	.weather_wrap .icon4::before									{ width:64px; height:53px; }
	.weather_wrap .icon5::before									{ width:65px; height:53px; }
	.weather_wrap .icon6::before									{ width:51px; height:52px; }	
	
	/* 검색 */
	.search_wrap .searchForm .text									{ font-size:1.45rem; bottom:13.5px }
	.search_wrap .searchForm::before								{ height:63px; }
	.search_wrap .searchForm .total_search							{ height:57px;}
	.search_wrap .searchForm .search_btn,
	.search_wrap .searchForm .btn_voice_search						{ width:63px; height:63px; margin-left:-38px }
	
	/* sns */
	[data-sns]														{ width:44px; height:44px; }
	
	/* 메뉴 */
	.header nav .gnb > li > a											{ padding:0 35px; }
	.header nav .gnb > li .gnb_title h2									{ font-size:2em; }	
	.header nav .gnb > li .gnb_title p									{ font-size:1.03em; }
}
@media screen and (max-width:1468px){
	/* 전자정부 */
	.top_util .util														{ gap:0 10px }
	.top_util .login [data-util="display_size"] .btn_size_text			{ height:32px; padding:0 15px; gap:0 7px; }
	.top_util .login [data-util="display_size"] .btn_size				{ font-size:1em; }
	.top_util .login [data-util="display_size"] .btn_size:before		{ font-size:.8rem; width:28px; height:28px; }
	.top_util .login [data-util="display_size"] .btn_size.md:before		{ font-size:.95rem; }
	.top_util .login [data-util="display_size"] .btn_size.lg:before		{ font-size:1.15rem; }
	.top_util .login [data-util="display_size"] .btn_size.xlg:before	{ width:38px; height:38px; font-size:1.3rem; }
	.top_util .login [data-util="display_size"] .btn_size.xxlg:before	{ width:38px; height:38px; font-size:1.5rem; }
	.top_util .login [data-util="display_size"] .btn_size_reset			{ font-size:.88rem; height:33px; }
	
	/* 날씨 */
	.weather_wrap>li .tem,
	.weather_wrap>li:last-child										{ font-size:.93rem; }
	.weather_wrap>li:last-child										{ gap:7px; }
	.weather_wrap>li .tem>i											{ font-size:1.95rem; }
	.weather_wrap>li .day											{ font-size:.88rem; }
	.weather_wrap .icon1::before									{ width:50px; height:51px; }
	.weather_wrap .icon2::before									{ width:66px; height:51px; }
	.weather_wrap .icon3::before									{ width:66px; height:51px; }
	.weather_wrap .icon4::before									{ width:61.5px; height:51px; }
	.weather_wrap .icon5::before									{ width:62.5px; height:51px; }
	.weather_wrap .icon6::before									{ width:49px; height:50px; }	
	
	/* 검색 */
	.search_wrap .searchForm .img									{ width:89px; height:83px; }
	.search_wrap .searchForm .text									{ font-size:1.4rem; bottom:12px;  }
	.search_wrap .searchForm::before								{ height:60px; }
	.search_wrap .searchForm .total_search							{ height:54px;  padding:0 40px 0 125px }
	.search_wrap .searchForm .search_btn,
	.search_wrap .searchForm .btn_voice_search						{ width:60px; height:60px; margin-left:-35px }
	
	/* sns */
	[data-sns]														{ width:42px; height:42px; }
	
	/* 메뉴 */
	.header nav .gnb > li > a										{ padding:0 30px; }
	
	/* 하단 */
	.footer .copyright .link										{ gap:0 30px; }
}
@media screen and (max-width:1368px){
	/* 주요 누리집 */
	.top_util .login [data-util="link"]									{ display:none; }
	
	/* 날씨 */
	.weather_wrap													{ gap:15px; }
	.weather_wrap>li .tem,
	.weather_wrap>li:last-child										{ font-size:.9rem; }
	.weather_wrap>li:last-child										{ gap:5px; }
	.weather_wrap>li .tem>i											{ font-size:1.85rem; }
	.weather_wrap>li .day											{ font-size:.85rem; }
	.weather_wrap .icon1::before									{ width:48px; height:49px; }
	.weather_wrap .icon2::before									{ width:63px; height:49px; }
	.weather_wrap .icon3::before									{ width:63px; height:49px; }
	.weather_wrap .icon4::before									{ width:59px; height:49px; }
	.weather_wrap .icon5::before									{ width:60px; height:49px; }
	.weather_wrap .icon6::before									{ width:47px; height:48px; }	
	
	/* 검색 */
	.search_wrap .searchForm .img									{ width:81px; height:75px; left:25px; }
	.search_wrap .searchForm .text									{ font-size:1.33rem;  }
	.search_wrap .searchForm::before								{ height:58px; }
	.search_wrap .searchForm .total_search							{ height:52px;  padding:0 30px 0 115px }
	.search_wrap .searchForm .search_btn,
	.search_wrap .searchForm .btn_voice_search						{ width:58px; height:58px; margin-left:-33px }
	
	/* sns */
	.area_sns														{ gap:7px; }
	[data-sns]														{ width:40px; height:40px; }
	
	
	
	/* 메뉴 */


	.header nav .gnb > li .box											{ --sizeWidth:260px; padding:1.5em 1.5em 1.5em calc(var(--sizeWidth) + 1.5em); }
	.header nav .gnb > li .gnb_title h2									{ font-size:1.9em; }	
	.header nav .gnb > li .gnb_title p									{ font-size:1em; }




	.header nav .gnb > li .box > .gnb_2dep > li							{ flex:0 1 calc((100% - 1.5em) / 4); }
	.header nav .gnb > li.gnb6 .box > .gnb_2dep > li					{ flex:0 1 calc((100% - 1.5em) / 4); }
	/* 분야별 */

	.header nav .gnb > li.gnb4 .gnb_2dep>li								{ flex:0 1 calc((100% - 2.5em) / 6); }
	
	/* 하단 */
	.footer .copyright .link										{ gap:0 20px; }
}
@media screen and (max-width:1268px){
	/* 날씨 */
	.weather_wrap>li .tem>i											{ font-size:1.8rem; }
	.weather_wrap .icon1::before									{ width:46px; height:47px; }
	.weather_wrap .icon2::before									{ width:60.5px; height:47px; }
	.weather_wrap .icon3::before									{ width:60.5px; height:47px; }
	.weather_wrap .icon4::before									{ width:56.5px; height:47px; }
	.weather_wrap .icon5::before									{ width:57.5px; height:47px; }
	.weather_wrap .icon6::before									{ width:45px; height:46px; }	
	
	/* 검색 */
	.search_wrap .searchForm .img									{ width:79px; height:73px; }
	.search_wrap .searchForm .text									{ font-size:1.3rem; bottom:10px; }
	.search_wrap .searchForm::before								{ height:56px; }
	.search_wrap .searchForm .total_search							{ height:50px;  padding:0 30px 0 115px }
	.search_wrap .searchForm .search_btn,
	.search_wrap .searchForm .btn_voice_search						{ width:56px; height:56px; }
	
	
	
	/* 상단 */
    .header .inr							{ --size:80px; }
	.header h1 a							{ width:136px; height:41px; }
    .header .area_util						{ margin-right:35px }
	.area_util [data-util="sitemap"]		{ display:none; }
	.header .area_util						{ gap:10px; }
	.header .area_util [data-util] .txt		{ display:none;}
	.header .area_util [data-util] .btn_lang,
	.header .area_util [data-util="login"] a,
	.header .area_util [data-util="logout"] a	{ width:25px; }
	.header .area_util .lang_box				{ top:30px; }
	.top_util .login [data-util="display_size"] .btn_size				{ font-size:.98em; }
	.top_util .login [data-util="display_size"] .btn_size:before		{ font-size:.78rem; width:26px; height:26px; }
	.top_util .login [data-util="display_size"] .btn_size.md:before		{ font-size:.9rem; }
	.top_util .login [data-util="display_size"] .btn_size.lg:before		{ font-size:1.1rem; }
	.top_util .login [data-util="display_size"] .btn_size.xlg:before	{ width:36px; height:36px; font-size:1.2rem; }
	.top_util .login [data-util="display_size"] .btn_size.xxlg:before	{ width:36px; height:36px; font-size:1.5rem; }
	.top_util .login [data-util="display_size"] .btn_size_reset			{ font-size:.85rem; }
	
	.header.fixed .inr													{ --size:70px; }
	
    /* gnb */
    .header nav																{ margin-right:0px;}
    .header nav .area_menu_all												{ display:none; opacity:0; visibility:hidden; flex-flow:column nowrap; justify-content:flex-start; align-items:flex-end; position:fixed; left:0px; top:0px; z-index:50;
        																		width:100%; height:100%; padding:0; background:rgba(0,0,0,0.6); border-width:0px; transition:0.3s ease 0.3s;}
    .mob_gnb_control														{ width:90%; max-width:500px; }
    .header nav .area_menu_all .menu_all									{ position:relative; width:90%; max-width:500px; height:calc(100vh - 45px); box-sizing:border-box; padding-left:10px; background-color:var(--color-white);}
    .header nav .area_menu_all .menu_all:before								{ content:''; display:block; position:absolute; left:0px; width:150px; height:100%; background:#f2f7fd;}
    .header nav > .gnb														{ display:none;}
    .header nav .area_menu_all .gnb											{ display:block;}
    .header nav .gnb a														{ display:flex; word-break:normal; }
    .header nav .gnb > li													{ --sizeGnb:150px;}
    .header nav .gnb > li > a												{ position:relative; z-index:10; width:var(--sizeGnb); height:60px; box-sizing:border-box; font-size:18px; padding:0 15px; }
    .header nav .gnb > li > a span											{ padding-bottom:0px;}
	.header nav .gnb > li > a span:after									{ display:none; }
    /*.header nav .gnb > li > a.active,*/
	.header nav .gnb > li.active > a										{ color:var(--color-white); box-shadow:0 20px 30px rgba(0,0,0,0.15); background:var(--color-point); border-radius:8px 8px 15px 8px; }
    /*.header nav .gnb > li > a.active::before,*/
	.header nav .gnb > li.active  > a::before								{ position:absolute; width:6px; height:6px; right:15px; top:50%; content:''; background:var(--color-white); border-radius:100%; transform:translateY(-50%);}
    .header nav .gnb > li .box												{ overflow-y:auto; left:var(--sizeGnb); top:0px; width:calc(100% - var(--sizeGnb)); height:100%; box-sizing:border-box; padding:0; transform:translateX(0); border-radius:0}
    .header nav .gnb > li .gnb_title										{ display:none; }
    .header nav .gnb > li .box > .gnb_2dep									{ display:block; width:100%; box-sizing:border-box; padding:32px 20px; max-height:inherit; overflow:inherit }
    .header nav .gnb > li .box > .gnb_2dep > li								{ flex-wrap:wrap; padding:0; width:100%; padding:0px; margin-bottom:0px; border-right-width:0px;}
	.header nav .gnb > li .box > .gnb_2dep > li+li							{ margin-top:5px; }
    .header nav .gnb > li .box > .gnb_2dep > li>a							{ position:relative; min-width:inherit; width:100%; min-height:55px; border-bottom:1px solid #ddd; font-size:16px; padding:0 20px; line-height:1.2 }
	.header nav .gnb > li .box > .gnb_2dep > li.active>a					{ color:var(--color-white); background:var(--color-point);}
	
	
	
	.header nav .gnb > li .box > .gnb_2dep > li a.open						{ padding-right:40px;}
    .header nav .gnb > li .box > .gnb_2dep > li>a::before					{ display:none; }
	.header nav .gnb > li .box > .gnb_2dep > li>a>i							{ opacity:0.8; display:block; width:20px; height:20px; position:absolute; right:20px; top:50%; font-size:0px; transition:var(--trans-ani); transform:translateY(-50%);}
    .header nav .gnb > li .box > .gnb_2dep > li>a>i::before					{ position:absolute; width:7px; height:7px; top:50%; left:50%; border-style:solid; border-width:0 1px 1px 0; border-color:var(--color-base); content:''; 
																				transition:var(--trans-ani); transform:translate(-50%,-70%) rotate(45deg); opacity:.5 }
    .header nav .gnb > li .box > .gnb_2dep > li>a.active i::before,
    .header nav .gnb > li .box > .gnb_2dep > li>a:hover i::before,
    .header nav .gnb > li .box > .gnb_2dep > li>a:focus i::before,
	.header nav .gnb > li .box > .gnb_2dep > li.active > a i::before		{ border-color:var(--color-white); opacity:1 }
    .header nav .gnb > li .box > .gnb_2dep > li>a.open.active::after,
	.header nav .gnb > li .box > .gnb_2dep > li.active>a.open::after		{ opacity:1; right:10px; }
    .header nav .gnb > li .box > .gnb_2dep > li>a.open.active i::before,
	.header nav .gnb > li .box > .gnb_2dep > li.active>a.open i::before		{ transform:translate(-50%,-30%) rotate(225deg);}
    .header nav .gnb > li .box > .gnb_2dep > li > ul						{ display:none;flex:0 1 100%; margin-left:0; margin-top:5px; padding:10px 15px; background:#f5f5f5; border-radius:5px;}
	.header nav .gnb > li .box > .gnb_2dep > li > ul>li						{ flex:0 1 100%; }
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a				{ font-size:15px; padding:7px 0 7px 12px }
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li > a:before		{ top:13px; }
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li.active > a:before	{ opacity:1; background-color:var(--color-point); }
    .header nav .gnb > li .box > .gnb_2dep > li > ul > li a.open,
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li.active > a		{ padding-right:20px; }
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li.active > a		{ color:var(--color-point); }
    .header nav .gnb > li .box > .gnb_2dep > li > ul > li>a>i				{ right:5px; opacity:0.8; display:block; width:20px; height:20px; position:absolute;  top:50%; font-size:0px; transition:var(--trans-ani); transform:translateY(-50%);}
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li>a>i::before,
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li>a>i::after		{ position:absolute; right:0; top:50%; content:''; transition:var(--trans-ani); background:#757575; transform:translateY(-50%) rotate(0deg) }
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li>a>i::before		{ width:9px; height:1px; }
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li>a>i::after		{ width:1px; height:9px; right:4px; }
    .header nav .gnb > li .box > .gnb_2dep > li > ul > li>a.open.active i::after{ transform:translateY(-50%) rotate(90deg); transition:var(--trans-ani); }
    .header nav .gnb > li .box > .gnb_2dep > li > ul ul 					{ display:none; padding:10px 15px; margin:5px 0px 10px; background:var(--color-white); border-radius:5px; }
    .header nav .gnb > li .box > .gnb_2dep > li > ul > li > ul > li > a		{ display:block; padding:4px 0px; font-size:14.5px;}
	.header nav .gnb > li .box > .gnb_2dep > li > ul > li > ul > li.active>a	{ color:var(--color-point); }
	.header nav .area_menu_all.active										{ display:flex; opacity:1; visibility:visible;}
    .header nav .area_menu_all .gnb > li .box.active						{ opacity:1; visibility:visible;}
    .mob_gnb_control														{ display:block;}
    .btn_menu_open															{ display:block;}
    .btn_menu_open.active													{ z-index:60; width:50px; height:50px; right:0px; top:0px; transform:translateY(0);}
    .btn_menu_open.active:before											{ width:50px; height:50px; background-image:url(/resource/common/images/common/icon_close.svg); background-position:50%; filter:invert(1);}
	.btn_menu_open.active:focus												{ outline-offset:-4px; outline:2px dotted var(--color-white) !important }
	
	
	
	/* 분야별 */
	.header nav .gnb > li.gnb4 .gnb_2dep>li									{ padding:0; }
	.header nav .gnb > li.gnb4 .gnb_2dep>li>a								{ justify-content:revert; border:1px solid var(--color-gray); border-radius:5px; }
 	.header nav .gnb > li.gnb4 .gnb_2dep>li>a>span::before,
	.header nav .gnb > li.gnb4 .gnb_2dep>li>a>span::after					{ display:none; }
	.header nav .gnb > li.gnb4 .gnb_2dep>li>a:hover, 
	.header nav .gnb > li.gnb4 .gnb_2dep>li>a:focus							{ border-color:var(--color-point); background:var(--color-point); color:var(--color-white); }
	.header nav .gnb > li.gnb4 .gnb_2dep>li>a[target="_blank"]::after		{ display:inline-block; }
	
	/* 하단 */
	.footer .copyright .link												{ gap:10px 20px; }
	.footer .copyright .link>li.copy										{ justify-content:flex-start; flex:100%;}
}
@media screen and (max-width:1168px){
	/* 검색 */
	.search_wrap														{ flex: 0 1 100%; margin-top:2em; width:100%; max-width:inherit;  }
	
	/* 날씨 */
	.weather_wrap .icon1::before										{ width:43px; height:44px; }
	.weather_wrap .icon2::before										{ width:57px; height:44px; }
	.weather_wrap .icon3::before										{ width:57px; height:44px; }
	.weather_wrap .icon4::before										{ width:53px; height:44px; }
	.weather_wrap .icon5::before										{ width:54px; height:44px; }
	.weather_wrap .icon6::before										{ width:42px; height:43px; }	
	
	/* sns  */
	.search .area_sns													{ position:absolute; right:0; top:2px; }
}
@media screen and (max-width:1024px){
	.header.fixed														{ top:45px; }
	
	/* 전자정부 */
	.top_util .util														{ gap:0 8px; }
	.top_util .util [data-util="gov"]>.text								{ font-size:.88rem; }
	.top_util .login [data-util="display_size"]							{ display:none; }
	
	/* 날씨 */
	.weather_wrap>li .tem>i												{ font-size:1.7rem; }
	.weather_wrap>li:last-child											{ font-size:.88rem; }
	.weather_wrap .icon1::before										{ width:39px; height:40px; }
	.weather_wrap .icon2::before										{ width:52px; height:40px; }
	.weather_wrap .icon3::before										{ width:52px; height:40px; }
	.weather_wrap .icon4::before										{ width:48px; height:40px; }
	.weather_wrap .icon5::before										{ width:49px; height:40px; }
	.weather_wrap .icon6::before										{ width:39px; height:40px; }	
	
	/* sns  */
	.area_sns															{ gap:5px; }
	[data-sns]															{ width:35px; height:35px; }
	[data-main="search"] .area_sns										{ top:2.5px; }
}
@media screen and (max-width:868px){
	/* 날씨 */
	.weather_wrap>li .tem>i												{ font-size:1.65rem; }
	.weather_wrap>li:last-child											{ font-size:.85rem; }
	.weather_wrap .icon1::before										{ width:36px; height:37px; }
	.weather_wrap .icon2::before										{ width:48px; height:37px; }
	.weather_wrap .icon3::before										{ width:48px; height:37px; }
	.weather_wrap .icon4::before										{ width:44px; height:37px; }

	.weather_wrap .icon5::before										{ width:45px; height:37px; }
	.weather_wrap .icon6::before										{ width:36px; height:37px; }	
	
	/* sns  */
	[data-main="search"] .area_sns										{ top:1px; }
	
	/* 검색 */
	.search_wrap .searchForm::before									{ height:52px; }
	.search_wrap .searchForm .img										{ width:71px; height:65px; left:21px; }
	.search_wrap .searchForm .text										{ font-size:1.2rem; bottom:9.5px; }
	.search_wrap .searchForm .total_search								{ height:46px; padding:0 30px 0 100px}
	.search_wrap .searchForm .search_btn, 
	.search_wrap .searchForm .btn_voice_search							{ width:52px; height:52px; }
	
    /* 상단 */
    .header.fixed .inr													{ --size:70px; }
    .header.fixed h1 a													{ width:118px; height:36px; }
	
	/* 하단 */	
	.footer .flex .f_logo												{ width:118px; height:36px; }
	.footer .flex .wa_mark												{ bottom:inherit; top:-.1em; max-width:60px; right:inherit; left:138px; margin-top:0 }
	.footer .copyright .link											{ gap:5px 15px; }
}
@media screen and (max-width:668px){
	/* 상단 */
	.header nav .gnb > li .box > .gnb_2dep > li>a>i::before				{ transform:translate(-50%, -85%) rotate(45deg); }
	.header nav .gnb > li .box > .gnb_2dep > li>a>i						{ right:12px; }

}
@media screen and (max-width:568px){
	/* 날씨 */
	.weather_wrap														{ width:100%; justify-content:center; align-items:end; gap:10px; }
	.weather_wrap>li													{ flex:inherit; flex-flow:row wrap; align-items:baseline; gap:0 5px; }
	.weather_wrap>li .tem												{ line-height:1; }
	.weather_wrap>li:last-child											{ width:100%; justify-content:center; gap:0 10px; }
	.weather_wrap>li:last-child span									{ gap:0 5px; }
	
	/* 검색 */
	.search_wrap														{ margin-top:1em; }
	.search_wrap .searchForm::before									{ height:46px; }
	.search_wrap .searchForm .img										{ width:63px; height:58px; left:22px; }
	.search_wrap .searchForm .text										{ font-size:1.067rem; }
	.search_wrap .searchForm .total_search								{ padding-left:85px; height:40px; padding-right:25px; }
	.search_wrap .searchForm .search_btn, 
	.search_wrap .searchForm .btn_voice_search							{ width:46px; height:46px; }
	
	/* sns */
	.search .area_sns													{ position:initial; width:100%; justify-content:center; margin-top:1em }
	
    /* 상단 */
    .header .inr								{ --size:70px; }
    .header h1 a								{ width:118px; height:36px; }
`	.header.fixed h1 a							{ width:103px; height:31px; }

    /* gnb */
    .mob_gnb_control,
    .header nav .area_menu_all .menu_all								{ width:98%; }
	.header nav .gnb													{ margin-top:15px; }
    .header nav .gnb > li												{ --sizeGnb:125px; }
    .header nav .area_menu_all .menu_all:before							{ width:125px; }
    .header nav .gnb > li > a											{ height:50px; font-size:17px; padding:0 12px }
    .header nav .gnb > li > a.active::before							{ right:12px; }
    .header nav .gnb > li .box > .gnb_2dep								{ padding:15px; }
    .header nav .gnb > li .box > .fieldmenu > li>a >i					{ width:60px; height:60px; padding:10px }
    .header nav .gnb > li .box > .gnb_2dep > li > a						{ font-size:15.5px; padding:12px 30px 12px 15px;  }
    .header nav .gnb > li .box > .gnb_2dep > li > ul					{ width:100%; }
    .header nav .gnb > li .box > .gnb_2dep > li > ul > li > a			{ word-break:initial; padding:7px 0; }
    .header nav .gnb > li .box > .gnb_2dep > li > ul > li > a::before	{ display:none; }
	.header nav .gnb > li .box > .gnb_2dep > li>a>i						{ right:10px; }

    .header nav .gnb > li .box > ul > li > ul							{ padding:10px; }
    .header nav .gnb > li .box > ul > li>a>i							{ right:10px; transform: translateY(-63%); }
    .header nav .gnb > li .box > ul > li > ul > li>a>i					{ right:0; }
    .header nav .gnb > li .box > ul > li>a.open.active i::before		{ transform: translate(-50%, -5%) rotate(225deg); }
	
	
}
@media screen and (max-width:468px){
	.top_util .util														{ max-width:calc(100% - 9em); }
	.top_util .util [data-util="gov"]									{ width:calc(100% - 30px); }
	.top_util .util [data-util="gov"]>.text								{ display:block; width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden }
   
   /* 검색 */
   .search_wrap .searchForm .img										{ display:none; }
   .search_wrap .searchForm .text										{ width:calc(100% - 3em); padding:0 20px; left:0;  transform:initial; }
   .search_wrap .searchForm .total_search								{ padding:0 25px; }
    
	/* 상단 */
    .header h1 a														{ width:103px; height:31px; }
	.header nav .gnb > li .box > .gnb_2dep > li > a						{ font-size:15px; padding:12px 30px 12px 12px; min-height:inherit; }

	.header nav .gnb > li .box > .gnb_2dep > li > a[target="_blank"]	{ padding:12px; }
    .header.fixed .inr							{ --size:60px; }
    .header.fixed  h1 a							{ width:92px; height:28px; }


	/* 날씨 */
  
}
@media screen and (max-width:368px){
    div, ul, li, ol, dl, dd, dt, p				{ font-size:14px; }
	
	/* 검색 */
	.search_wrap .searchForm .text				{ font-size:.98rem; bottom:10.5px; padding:0 16px; }
	
	/* 메뉴 */
	.header nav .area_menu_all .menu_all		{ padding-left:5px; }
	.header nav .gnb > li						{ --sizeGnb:115px; }
	.header nav .area_menu_all .menu_all:before	{ width:115px; }

}
@media screen and (max-width:320px){
	.search_wrap .searchForm .text				{ font-size:.95rem; }
}


/* 접근성용 */
.top_util .family_box .family_nav .menu>li button:focus,
.top_util .family_box .family_con .list>li>a:focus	{outline-offset:-4px; outline:2px dotted var(--color-point); }