@charset "utf-8";

/*
 * combine_sub.css
 * 상하단 공통영역 + 본청 외 사이트 스타일가이드
 * root 설정은 각각의 common에서
 */


.con_inner											{ width:94%; max-width:1600px; margin-left:auto; margin-right:auto; }
body.mobShow										{ overflow:hidden; position:fixed; width:100%;}
*													{ -webkit-text-size-adjust:none; }
#boardWrap											{ font-family:var(--font-pretendard); }
#boardWrap .view_con								{ font-family:inherit; }
body.noneSCroll										{ overflow:hidden; }

/* 지도 */
.wrap_btn_zoom										{ z-index:1 !important; }
/* 게시판 달력 */
#ui-datepicker-div									{ z-index:9999 !important; }


/* 이미지 */
img,
#content img										{ max-width:100%; }
picture												{ display:block;}


/* 색상 */
.color_red											{ color:#c7000c; }


/* 텍스트 정렬 */
.tar						{ text-align:right !important;}
.tal						{ text-align:left !important;}
.tac						{ text-align:center !important;}
.inline_flex				{ display:inline-flex; }							
.basic_table.tac tbody td 	{ text-align:center !important; }


/* 여백 */
.mt0						{ margin-top:0px !important;}
.mt10						{ margin-top:10px !important;}
.mt20						{ margin-top:20px !important;}
.mt30						{ margin-top:30px !important;}
.mt40						{ margin-top:40px !important;}
.ml25						{ margin-left:25px !important; }
.ml20						{ margin-left:20px !important; }
.ml10						{ margin-left:10px !important; }
.ml0						{ margin-left:0 !important; }
.mb0						{ margin-bottom:0 !important; }
.mb10						{ margin-bottom:10px !important; }
.mb20						{ margin-bottom:20px !important; }
.mb40						{ margin-bottom:40px !important; }
.pl20						{ padding-left:20px; }
.pb10						{ padding-bottom:10px; }
@media all and (max-width:668px){
	.mt20					{ margin-top:15px !important;}
	.mt30					{ margin-top:20px !important;}
	.mt40					{ margin-top:30px !important;}
    .mb40					{ margin-bottom:30px !important; }
}

/* 점자이미지노출예시 */
.box_layer_img							{ position:fixed; top:0px; left:0px; z-index:90; width:100%; height:100%; background:rgba(0,0,0,0.4);}
.box_layer_img > div					{ position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}


/***************************************************************************

							상단 공통 영역

***************************************************************************/
/* 커튼 배너 */
.top_banner_wrap													{ position:relative; width:100%; margin:0; --sizeHig:170px; height:var(--sizeHig);}
.top_banner_wrap .swiper-slide										{ position:relative; width:100%; height:var(--sizeHig); }
.top_banner_wrap .swiper-slide img									{ object-fit:cover; width:100%; height:100%; }
.top_banner_wrap .swiper-slide a span[data-alt]						{ opacity:0; overflow:hidden; display:block; position:absolute; top:50%; left:50%; z-index:2; width:98%; height:95%; border:2px solid #000;  outline:1px solid #fff; text-indent:100%; 
																		white-space:nowrap; transform:translate(-50%, -50%);}
.top_banner_wrap .swiper-slide a:focus span[data-alt]				{ opacity:1; }
.top_banner_wrap .swiper_prev,
.top_banner_wrap .swiper_next										{ position:relative; width:30px; height:30px; filter:inherit; display:flex; justify-content:center; align-items:center; z-index:3; }
.top_banner_wrap .swiper_prev.swiper-button-disabled,
.top_banner_wrap .swiper_next.swiper-button-disabled				{ opacity:.5; }
.top_banner_wrap .swiper_prev::before,
.top_banner_wrap .swiper_next::before								{ position:absolute; width:8px; height:8px; border-style:solid; background:none; border-width:2px 2px 0 0; border-color:#fff; transform:rotate(45deg); content:''; }
.top_banner_wrap .swiper_next::before								{ margin-left:-4px; }
.top_banner_wrap .swiper_prev::before								{ border-width:0 0 2px 2px; margin-right:-2px }
.top_banner_wrap .control											{ position:absolute; min-width:188px; bottom:5px; background:rgba(0,0,0,.8); left:calc(50% + 800px - 188px); padding:0 7px 0 5px; border-radius:30px; height:30px; display:flex;
    																	align-items:center; justify-content:center; z-index:3; width:max-content; }
.top_banner_wrap .control .swiper_page								{ width:auto; display:flex; justify-content:center; align-items:center; font-size:.8rem; margin:0; line-height:1; color:#fff; gap:5px; padding-top:2px;}
.top_banner_wrap .control .swiper-pagination-current				{ font-weight:bold; color:var(--color-white) }
.top_banner_wrap .control .swiper-pagination-total					{ font-weight:300; opacity:.9 }
.top_banner_wrap .control .swiper_page i							{ position:relative; display:inline-block; width:3px; height:3px; background:rgba(255,255,255,.5); vertical-align:middle; border-radius:100%; margin-top:-2px }
.top_banner_wrap .control .swiper_page i::after						{ display:none; }
.top_banner_wrap .label												{ position:relative; display:flex; align-items:center; font-size:.75rem; gap:10px; font-weight:300; letter-spacing:-.025em; color:#fff; line-height:30px; margin-right:10px; }
.top_banner_wrap .label .check_label								{ position:relative;  padding-left:22px; cursor:pointer; color:#fff; opacity:.7 }
.top_banner_wrap .label .check_input 								{ position:absolute; width:1px; height:1px; opacity:0; }
.top_banner_wrap .label .check_label::before 						{ content: ""; position:absolute; top:50%; left:0; width:20px; height:20px; background:url(/resource/common/images/common/icon_check.svg) no-repeat 50% 50% / auto 7px !important; 
																		transform:translateY(-50%); 
																		z-index:2; filter:invert(1); opacity:.5 }
.top_banner_wrap .label .check_input:checked + .check_label::before,
.top_banner_wrap .label .check_input:checked + .check_label			{ opacity:1 }

.top_banner_wrap .top_banner_close									{ position:relative; width:20px; height:20px; background:#fff; border-radius:100%; }			
.top_banner_wrap .top_banner_close::before							{ content: ""; position:absolute; top:0; left:0; width:100%; height:100%; background:url(/resource/common/images/common/icon_close.svg) no-repeat 50% 50% / auto 8px; }
@media all and (max-width:1668px){
	.top_banner_wrap .control										{ left:inherit; right:1.5%; }
}
@media all and (max-width:1024px){
	.top_banner_wrap												{ --sizeHig:120px; }
}
@media all and (max-width:668px){
	.top_banner_wrap												{ --sizeHig:100px; }
	.top_banner_wrap .control										{ bottom:3px; height:28px; padding:0 5px}
	.top_banner_wrap .swiper_prev, 
	.top_banner_wrap .swiper_next									{ width:25px; height:25px; }
}
@media all and (max-width:668px){
	.top_banner_wrap												{ --sizeHig:80px; }
}


/* 공통 상단 */
.top_util														{ position:relative; display:flex; align-items:center; border-bottom:1px solid #e5e5e5; --size:50px; height:var(--size); }
.top_util>.con_inner											{ display:flex; align-items:center; justify-content:end; }
.top_util>.con_inner.between									{ justify-content:space-between; }
.top_util .login												{ display:flex; gap:0 30px; align-items:center; font-size:.9rem }
.top_util .login [data-util="lang"]								{ position:relative; margin-right:-20px;}
.top_util .login [data-util="link"] .list						{ display:flex; align-items:center; color:#555}
.top_util .login [data-util="link"] .list>li+li					{ position:relative; padding-left:14px; margin-left:12px; }
.top_util .login [data-util="link"] .list>li>a					{ display:block; transition:var(--trans-ani); font-size:.97rem; font-weight:600 }
.top_util .login [data-util="link"] .list>li:first-child>a,
.top_util .login [data-util="link"] .list>li>a:hover,
.top_util .login [data-util="link"] .list>li>a:focus			{ color:var(--color-point); }
.top_util .login [data-util="link"] .list>li+li::before			{ position:absolute; width:4px; height:4px; border-radius:100%; content:''; left:0; top:9px; background:#ccc; }
.top_util .login [data-util="link"] .list>li.farm				{ display:none; }
.top_util .login .btn_family									{ display:flex; align-items:center; gap:0 10px; line-height:1; height:35px; padding:0 20px; color:var(--color-white); background:var(--color-point); 
																	font-size:14px; font-weight:500; border-radius:25px; }
.top_util .login .btn_family .icon								{ position:relative; width:15px; height:15px; }
.top_util .login .btn_family .icon::before						{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/common/images/common/icon_top_family.svg) no-repeat 50% 50% / contain; filter:invert(1); }
.top_util .login .btn_lang										{ 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 .btn_lang::after								{ display:inline-block; vertical-align:middle; width:7px; height:7px; border-style:solid; border-width:0 1px 1px 0; border-color:rgba(0,0,0,.74); 
																	transform:translateY(-40%) rotate(45deg); content:''; transition:all ease 0.2s }
.top_util .login .btn_lang.active::after						{ transform:translateY(20%) rotate(225deg); }
.top_util .login .btn_lang .icon								{ position:relative; width:15px; height:15px; font-size:0; text-indent:-9999em; }
.top_util .login .btn_lang .icon::before						{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/common/images/common/icon_language.svg) no-repeat 50% 50% / contain; opacity:.74 }


/* 언어선택 */
.top_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:calc(var(--size) - 10px); 
																	padding:10px; z-index:60; background:#fff; }
.top_util .lang_box>ul											{ display:flex; flex-flow:column; align-items:center; }
.top_util .lang_box>ul>li>a										{ display:inline-block; text-align:center; position:relative; padding:5px 10px; transition:all ease 0.2s }
.top_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}
.top_util .lang_box>ul>li>a:hover,
.top_util .lang_box>ul>li>a:focus								{ color:var(--color-point); font-weight:bold; }
.top_util .lang_box>ul>li>a:hover::before,
.top_util .lang_box>ul>li>a:focus::before						{ width:100%; }



/* 주요누리집 모달 */
.top_util .family_box 											{ display:none; position:fixed; top:0; left:0; z-index:200; width:100%; z-index:70; --sizeBtn:350px; }
.top_util .family_box.active									{ display:flex; align-items:center; justify-content:center; height:100%; }
.top_util .family_box:before 									{ display:block; position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0, 0, 0, .5); content: '';}
.top_util .family_box .con_inner								{ display:flex; position:relative; z-index:2; max-height:90svh; background:#fff; border-radius:30px; --sizeHig:35em; }
.top_util .family_box .family_nav								{ flex:none; width:var(--sizeBtn); box-shadow:15px 0px 30px rgba(0,49,92,.2); padding:50px 30px; border-radius:28px; min-height:var(--sizeHig);
																	background:url(/resource/common/images/common/bg_family_nav_bottom.png) no-repeat bottom center / contain, url(/resource/common/images/common/bg_family_nav_top.png) no-repeat 50% 5% / contain #005bac;  }
.top_util .family_box .family_nav h2							{ display:block; width:169px; height:51px; margin:0 auto; background:url(/resource/common/images/common/img_family_box_logo.png) no-repeat 50% 50% / contain; }
.top_util .family_box .family_nav .menu							{ margin-top:60px; }
.top_util .family_box .family_nav .menu>li+li					{ margin-top:5px; }
.top_util .family_box .family_nav .menu>li button				{ position:relative; width:100%; height:55px; display:flex; align-items:center; font-size:1.167rem; font-weight:600; color:#fff; padding:20px; border-radius:10px; 
																	background:transparent; transition:all ease 0.2s }
.top_util .family_box .family_nav .menu>li button::before		{ position:absolute; width:14px; height:10px; right:20px; top:50%; background:url(/resource/common/images/common/icon_diagram.svg) no-repeat 50% 50% / auto 10px; content:''; transform:translateY(-50%);
																	filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(310deg) brightness(100%) contrast(200%); transition:all ease 0.2s }
.top_util .family_box .family_nav .menu>li button:hover,
.top_util .family_box .family_nav .menu>li button:focus,
.top_util .family_box .family_nav .menu>li button.active		{ background:#fff; color:#005bac }

.top_util .family_box .family_nav .menu>li button:hover::before,
.top_util .family_box .family_nav .menu>li button:focus::before,
.top_util .family_box .family_nav .menu>li button.active::before	{ filter:inherit; }																
.top_util .family_box .family_con								{ display:none; flex:auto; max-width:calc(100% - var(--sizeBtn)); padding:50px; gap:30px; }
.top_util .family_box .family_con.active						{ display:flex; flex-flow:column }
.top_util .family_box .family_con .tit_box						{ display:flex; gap:0 15px; align-items:center; min-height:80px; background:#f1f1f1; border-radius:10px; padding:0 40px; }
.top_util .family_box .family_con .tit_box h3					{ font-size:1.63em; font-weight:900; color:var(--color-point) }
.top_util .family_box .family_con .tit_box h3>em				{ color:var(--color-base); }
.top_util .family_box .family_con .tit_box .sub_txt				{ font-size:1.03em; color:var(--color-base); opacity:.84; padding-top:8px; }
.top_util .family_box .family_con .list_wrap					{ height:100%; background:#f1f1f1; border-radius:10px; padding:40px 35px 40px 40px; max-height:52svh;  }
.top_util .family_box .family_con .list							{ display:flex; width:100%; flex-flow:row wrap; gap:10px; padding-right:5px; height:100%; overflow-y:auto; align-content:flex-start; }
.top_util .family_box .family_con .list>li						{ width:calc((100% - 20px) / 3);}
.top_util .family_box .family_con .list>li>a					{ display:flex; align-items:center; gap:10px; height:50px; justify-content:center; font-size:1.067rem; font-weight:500; color:var(--color-base); transition:all ease 0.2s; 
																	border:1px solid #e7e7e7; background:#fff; border-radius:10px; word-break:normal; text-align:center; }
.top_util .family_box .family_con .list>li>a:hover,
.top_util .family_box .family_con .list>li>a:focus						{ border-color:#005bac; color:#005bac }

.top_util .family_box .family_con .list>li>a[target="_blank"]::after	{ content:''; display:inline-block; width:9px; height:9px; background:url(/resource/common/images/common/icon_top_family_blank.svg) no-repeat 50% 50%; transition:all ease 0.2s;
    																		background-size:100%; vertical-align:middle; margin-top:-2px; }
.top_util .family_box .family_con .list>li>a:hover[target="_blank"]::after,
.top_util .family_box .family_con .list>li>a:focus[target="_blank"]::after	{ filter: invert(14%) sepia(78%) saturate(7493%) hue-rotate(198deg) brightness(92%) contrast(101%); }
.top_util .family_box .family_con .list::-webkit-scrollbar 				{ -webkit-appearance:none; width:5px;} 
.top_util .family_box .family_con .list::-webkit-scrollbar-thumb 		{ background-color:var(--color-point); border-radius:5px; } 
.top_util .family_box .family_con .list::-webkit-scrollbar-track 		{ border-radius:5px; background-color:rgba(0,0,0,.2); }
.top_util .family_box .btn_family_close									{ position:absolute; width:52px; height:52px; right:64px; top:64px; background:#005bac; border-radius:10px; }
.top_util .family_box .btn_family_close::before							{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/common/images/common/icon_close.svg) no-repeat 50% 50% / auto 16px; 
																			filter:invert(1); transition:all ease 0.2s}
.top_util .family_box .btn_family_close:hover::before,
.top_util .family_box .btn_family_close:focus::before					{ transform:rotate(180deg); }

@media all and (min-width:1368px) and (min-height:830px){
    /* 웹일경우 움직이기 */
    .family_box .con_inner										{ transition:all .5s;  overflow:hidden; }
	.top_util .family_box .family_con .list_wrap				{ max-height:42svh;  }
    .family_box .con_inner:has(#familyTab01.tabcont.active)		{ height:62vh; }
    .family_box .con_inner:has(#familyTab02.tabcont.active)		{ height:66vh; }
    .family_box .con_inner:has(#familyTab03.tabcont.active)		{ height:62vh; }
	.family_box .con_inner:has(#familyTab04.tabcont.active)		{ height:66vh; }
    .family_box .con_inner:has(#familyTab05.tabcont.active)		{ height:66vh; }
    .family_box .con_inner:has(#familyTab06.tabcont.active)		{ height:62vh; }
	
}


/* 음석인식 */
.btn_voice_search												{ display:none; --sizeBtn:40px; width:var(--sizeBtn); height:var(--sizeBtn);  z-index:2}
.btn_voice_search:before										{ content:''; display:block; width:21px; height:23px; margin:0 auto; background:url(/resource/common/images/common/icon_voice.svg) no-repeat 50% 50%;
   																	 background-size:100%; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); z-index:2}
.btn_voice_search .ani											{ display:block; position:absolute; top:0px; left:0px; display:block; width:var(--sizeBtn); height:var(--sizeBtn);}
.btn_voice_search .ani:before									{ content:''; opacity:0.1; display:block; position:absolute; z-index:-1; width:100%; height:100%; background:#ffd3d9; border-radius:100%;}
.btn_voice_search .ani:before									{ animation:voiceAni 2.5s linear 0s infinite;}
.btn_voice_area													{ opacity:0; visibility:hidden; position:fixed; top:0px; left:0px; z-index:90; width:100%; height:100%; background:rgba(0,0,0,0.5);
    																transition:0.5s easae 0s; transition-property:opacity, visibility;}
.btn_voice_area.active											{ opacity:1; visibility:visible;}
.btn_voice_area .cont											{ position:absolute; top:50%; left:50%; width:94%; max-width:600px; box-sizing:border-box; padding:30px 50px 50px; background-color:var(--color-white); --size:initial !important;
   																		 border:4px solid var(--color-point); border-radius:20px; box-shadow:0 20px 50px rgba(0,0,0,0.3); transform:translate(-50%, calc(-50% - 0.5px)); text-align:center}
.btn_voice_area .cont>strong									{ display:block; font-size:1.5em; font-weight:600  }
.btn_voice_area .cont .text										{ margin-top:1em; line-height:1.4; font-size:1.067em;}
.btn_voice_area .cont .text>em									{ font-weight:500; color:var(--color-point); }
.btn_voice_area .btn_voice_search								{ position:relative; right:inherit; top:inherit; margin:3em auto; background:var(--color-point); border-radius:100%; --sizeBtn:85px; transform:initial; }
.btn_voice_area .btn_voice_search:after							{ display:none; }
.btn_voice_area .btn_voice_search .ani:before,
.btn_voice_area .btn_voice_search .ani:after					{ background:var(--color-point); }
.btn_voice_area .spinner										{ position:relative; display:flex; justify-content:center; align-items:center; margin:3em auto; background:var(--color-point); width:85px; height:85px;  border-radius:100%; }
.btn_voice_area .spinner:before									{ content:''; opacity:0.2; display:block; position:absolute; z-index:-1; width:120%; height:120%; left:-10%; top:-10%; background:var(--color-point); border-radius:100%; }
.btn_voice_area .spinner:after									{ content:''; opacity:0.1; display:block; position:absolute; z-index:-1; width:140%; height:140%; left:-20%; top:-20%; background:var(--color-point);  border-radius:100%; }
.btn_voice_area .spinner > span									{ display:inline-block; margin:0 4px; border-radius:50%; background:#fff; padding:6px; animation:sk-bouncedelay 1.5s infinite ease-in-out both;}
.btn_voice_area .spinner .bounce1								{ animation-delay:-0.2s; }
.btn_voice_area .spinner .bounce2								{ animation-delay:-0.1s; }

@keyframes sk-bouncedelay{
    0%,80%,100%{-webkit-transform:scale(0);transform:scale(0);}
    40%{-webkit-transform:scale(1.0);transform:scale(1.0);}
}
@keyframes voiceAni{
    0%{opacity:0.2; transform:scale(1, 1);}
    50%{opacity:0.2;}
    100%{opacity:0; transform:scale(2, 2);}
}
@media all and (max-width:1668px) {
	.top_util .login											{ gap:0 20px; }
	.top_util .login [data-util="link"] .list>li+li				{ padding-left:12px; margin-left:10px; }	
	.top_util .login [data-util="lang"]							{ margin-right:-10px; }
}
@media all and (max-width:1568px) {
	.top_util .login											{ gap:0 15px; }
	.top_util .login [data-util="link"] .list>li+li				{ padding-left:10px; margin-left:7px; }	
	.top_util .login [data-util="link"] .list>li>a				{ font-size:.92rem; }
	
	.top_util .family_box 										{ --sizeBtn:320px; }
	.top_util .family_box .family_nav							{ padding:45px 25px; }
	.top_util .family_box .family_nav h2						{ width:150px; height:45px; }
	.top_util .family_box .family_con							{ padding:45px; gap:25px; }

	.top_util .family_box .family_con .tit_box					{ min-height:75px; padding:0 35px; }
	.top_util .family_box .family_con .tit_box h3				{ font-size:1.53em; }
	.top_util .family_box .family_nav .menu						{ margin-top:50px; }
	.top_util .family_box .family_con .list_wrap				{ padding:35px 30px 35px 35px; }
	.top_util .family_box .btn_family_close						{ width:50px; height:50px; right:58px; top:58px; }
}
@media all and (max-width:1468px){
	.top_util .login .btn_family,								
	.top_util .login .btn_lang									{ height:32px; padding:0 15px; gap:0 7px; }
}
@media all and (max-width:1368px) {
	.top_util .family_box 										{ --sizeBtn:300px; }
	.top_util .family_box .con_inner							{ border-radius:25px; }
	.top_util .family_box .family_nav							{ padding:40px 20px; border-radius:15px; box-shadow:5px 0px 10px rgba(0, 49, 92, .2); }
	.top_util .family_box .family_nav h2						{ width:136px; height:41px; }
	.top_util .family_box .family_con							{ padding:35px; gap:25px; }
	.top_util .family_box .family_con .tit_box					{ min-height:70px; padding:0 25px; }
	.top_util .family_box .family_con .tit_box h3				{ font-size:1.43em; }
	.top_util .family_box .family_nav .menu>li button			{ font-size:1.1rem; }
	.top_util .family_box .family_con .list_wrap				{ padding:25px 20px 25px 25px; }
	.top_util .family_box .family_con .list						{ gap:8px; }
	.top_util .family_box .family_con .list>li					{ width:calc((100% - 8px) / 2); }
	.top_util .family_box .family_con .list>li>a				{ font-size:1rem; height:48px; }
	.top_util .family_box .btn_family_close						{ right:45px; top:45px; }
	.top_util .family_box .btn_family_close::before				{ background-size:auto 14px; }
}
@media all and (max-width:1068px) {
	.top_util .family_box 										{ --sizeBtn:280px; }
	.top_util .family_box .con_inner							{ border-radius:15px; min-height:62vh; }
	.top_util .family_box .family_nav							{ padding:40px 15px; border-radius:15px }
	.top_util .family_box .family_con							{ padding:20px; gap:20px; }
	.top_util .family_box .family_con .tit_box					{ min-height:60px; padding:0 20px; border-radius:8px }
	.top_util .family_box .family_con .tit_box h3				{ font-size:1.33em; }
	.top_util .family_box .family_con .tit_box .sub_txt			{ display:none }
	.top_util .family_box .family_nav .menu						{ margin-top:40px; }
	.top_util .family_box .family_nav .menu>li button			{ padding:0 10px; height:50px; font-size:1.067rem }
	.top_util .family_box .family_nav .menu>li button::before	{ right:10px; }
	
	.top_util .family_box .family_con .list_wrap				{ padding:15px 10px 15px 15px; border-radius:8px; max-height:46svh; }
	.top_util .family_box .family_con .list>li>a				{ height:45px; }
	.top_util .family_box .btn_family_close						{ width:45px; height:45px; right:27px; top:28px; border-radius:8px;}
	.top_util .family_box .btn_family_close::before				{ background-size:auto 12px; }
}
@media all and (max-width:1024px) {
	.top_util													{ --size:45px; }
	.top_util .login>[data-util="link"]							{ display:none; }
	.top_util .login .btn_family,
	.top_util .login .btn_lang									{ height:30px; padding:0 12px; gap:0 5px; font-size:13px; }
	.top_util .login .btn_family .icon,
	.top_util .login .btn_lang	.icon							{ width:13px; height:13px; }
	.top_util .login .btn_lang::after							{ margin-left:3px; }
}
@media all and (max-width:968px) {
	.top_util .family_box .family_con .list						{ gap:5px; }
	.top_util .family_box .family_con .list>li					{ width:calc((100% - 5px) / 2); }
}
@media all and (max-width:868px) {
	.top_util .family_box .con_inner							{ flex-flow:column; min-height:inherit; max-height:94svh; padding-bottom:10px; }
	.top_util .family_box .family_nav							{ width:100%; padding:20px; border-radius:10px; min-height:inherit; }
	.top_util .family_box .family_nav .menu						{ margin-top:20px; display:flex; flex-flow:row wrap; gap:10px; }
	.top_util .family_box .family_nav .menu>li					{ width:calc((100% - 20px) / 3) }
	.top_util .family_box .family_nav .menu>li+li				{ margin-top:0; }
	.top_util .family_box .family_nav .menu>li button			{ border:1px solid rgba(255,255,255,.3); font-size:1rem; height:45px; padding:0 15px }
	.top_util .family_box .family_nav .menu>li button::before	{ right:15px; }
	.top_util .family_box .family_con							{ max-width:inherit; padding:10px; gap:10px; padding-bottom:0;}
	.top_util .family_box .family_con .list						{ max-height:40svh }
	.top_util .family_box .btn_family_close						{ background:var(--color-white); top:20px; right:20px }
	.top_util .family_box .btn_family_close::before				{ filter:invert(24%) sepia(92%) saturate(1597%) hue-rotate(191deg) brightness(90%) contrast(102%); }
	
	
	/* 음성인식 */
	.search_wrap .searchForm .search_btn						{ display:none; }
	.btn_voice_search											{ display:flex;  position:relative; }
	.btn_voice_area .cont>strong								{ font-size:1.3em; }
}
@media all and (max-width:768px) {
	.top_util .family_box .family_nav .menu>li					{ width:calc((100% - 10px) / 2) }
	.top_util .family_box .family_con .list						{ max-height:30vh; }
	.top_util .lang_box											{ left:inherit; transform:inherit; }
}
@media all and (max-width:668px){
	.top_util .login .btn_family,
	.top_util .login .btn_lang								{ height:28px; font-size:12.5px; }
	.top_util .login .btn_family .icon,
	.top_util .login .btn_lang	.icon						{ width:13px; height:13px; }
}
@media all and (max-width:568px) {
	.top_util .family_box .family_nav							{ padding:15px 10px; }
	.top_util .family_box .btn_family_close						{ top:15px; right:10px; width:40px; height:40px; }
	.top_util .family_box .family_nav .menu						{ gap:5px; }
	
	.top_util .family_box .family_nav .menu>li button			{ font-size:.88rem; padding:0 10px; }
	.top_util .family_box .family_nav .menu>li button::before	{ right:10px; }
	.top_util .family_box .family_con .tit_box					{ display:none; }
	.top_util .family_box .family_con .list						{ max-height:39vh; }	
	.top_util .family_box .family_con .list>li					{ width:100%; }
	.top_util .family_box .family_con .list>li>a				{ font-size:.88rem; height:42px; }
	
	
	/* 음성인식 */
	.btn_voice_search											{ --sizeBtn:35px; }
	.btn_voice_area .cont										{ padding:20px 30px 30px; }
}
@media all and (max-width:414px) {
	.top_util .family_box .family_nav h2						{ display:none; }
	.top_util .family_box .family_nav .menu						{ margin-top:0; }
	.top_util .family_box .family_nav .menu>li button			{ justify-content:center; }
	.top_util .family_box .family_nav .menu>li button::before	{ display:none; }
	
	.top_util .family_box .btn_family_close						{ top:-45px; right:0; }
	
	
	/* 음성인식 */
	.btn_voice_search											{ --sizeBtn:35px; }
	.btn_voice_area .cont										{ padding:20px; }
}
/***************************************************************************

							컨텐츠 공통 영역

***************************************************************************/
/* 제목 */
.title_h4									{ position:relative; margin-top:1.92em; margin-bottom:.77em; font-size:1.63em; color:var(--color-base); font-weight:bold; line-height:1.28; padding-top:.58em;}
.title_h4:first-child                     	{ margin-top:0; }
.title_h4:before,
.title_h4:after								{ content:''; display:block; position:absolute; top:0px; width:7px; height:7px; left:0; background:var(--color-point); border-radius:100%;}
.title_h4:after								{ left:10px; background:#eb6101;}
.title_h5									{ position:relative; margin-top:1.5em; margin-bottom:.75em; padding-left:23px; font-size:1.25em; color:var(--color-base); font-weight:bold; line-height:1.28;}
.title_h5:before							{ content:''; display:block; position:absolute; width:10px; height:10px; top:4px; border:3px solid var(--color-point); left:0px;  box-sizing:initial;  border-radius:100%; }
.title_h6									{ position:relative; margin-top:.81em; margin-bottom:.54em; padding-left:23px; font-size:1.15em; color:var(--color-base); font-weight:bold; line-height:1.28;}
.title_h6:before,
.title_h6:after								{ content:''; display:block; position:absolute; left:3px; top:7px; width:7px; height:7px; box-sizing:initial; background:var(--color-point); transform:rotate(45deg); }
.title_h6:after								{ background:#eb6101; left:9px; }

/* 기본 텍스트 */
.basic_p									{ font-size:1.06em; font-weight:400; color:var(--color-base3); line-height:1.6; }


/* 아이콘 박스 */
.box_info_top							{ position:relative; display:flex; justify-content:flex-start; align-items:center; margin-bottom:35px; padding:30px; background:#fff; border-radius:20px; border:1px solid #e5e5e5}
.box_info_top::before,
.box_info_top::after					{ content:''; position:absolute; width:103px; height:78px; background:url(/resource/common/images/common/img_box_info.svg) no-repeat 50% 50% / cover; z-index:2; pointer-events:none; }
.box_info_top::before					{ top:-1px; left:-1px; }
.box_info_top::after					{ bottom:-1px; right:-1px;transform:rotate(180deg); }
.box_info_top.tac						{ justify-content:center; }
.box_info_top .ico						{ overflow:hidden; flex:none; display:flex; justify-content:center; align-items:center; width:120px; height:120px; box-sizing:border-box; margin-right:50px; padding:8px; background:#fff8da url(/resource/common/images/common/icon_info_default.svg) no-repeat 50% 50%; background-size:cover; border-radius:100%;}
.box_info_top .ico img					{ max-width:100%;}
.box_info_top h4,
.box_info_top h5                        { margin:0 0 20px 0; font-size:1.5em; font-weight:bold; color:var(--color-base); line-height:1.3}
.box_info_top p							{ line-height:1.6; font-size:1.13em; color:var(--color-base3); font-weight:400; word-break:keep-all;}
.box_info_top strong					{ font-weight:bold; color:var(--color-base)}
.box_info_top .ico:has(img)				{ background-image:none; }
.box_info_top:has(.map_box)             { padding:30px; }
.box_info_top .map_box                  { border-radius:15px; }

/* 단순 박스 스타일 */
[class*="box_text_"]					{ margin-top:15px; padding:20px; border-radius:10px;}
.box_text_gray							{ background:#efefef; font-size:1.06em; color:var(--color-base3); line-height:1.6; font-weight:400}
.box_text_line							{ border:1px solid #dddddd; font-size:1.06em; color:var(--color-base3); line-height:1.6; font-weight:400 }


/* 단순 박스 정렬 */
.box_flex								{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; }
.box_flex.between						{ justify-content:space-between; align-items:center; }
.box_flex.titleh4						{ margin-top:40px; margin-bottom:20px; align-items:baseline; gap:10px; }
.box_flex.titleh4:has(.basic_btn)		{ align-items:flex-start; }
.box_flex.titleh5						{ margin-top:15px; margin-bottom:15px; align-items:baseline; gap:10px; }
.box_flex.titleh6						{ margin-top:10px; margin-bottom:10px; align-items:baseline; gap:10px; }
.box_flex h4,
.box_flex h5,
.box_flex h6							{ margin-top:10px; margin-bottom:0px; }
.box_flex h4 + p,
.box_flex h5 + p,			
.box_flex h6 + p						{ display:flex; align-items:baseline; gap:5px; font-size:1.06em; color:#767676; line-height:1.3  } 
.box_flex h4 + p::before,
.box_flex h5 + p::before,
.box_flex h6 + p::before				{ display:inline-block; width:8px; height:2px; background:#959595; content:''; vertical-align:middle;  }
.box_flex.between h4 + p::before,
.box_flex.between h5 + p::before,
.box_flex.between h6 + p::before		{ display:none; }



/* 컨텐츠 안 탭메뉴 */
.area_tab										{ position:relative; margin-bottom:30px; padding:0 20px 20px 20px; }
.area_tab::before								{ position:absolute; width:100%; height:calc(100% - 30px); border:1px solid #ebebeb; border-radius:10px; content:''; left:0; bottom:0; }
.area_tab .list									{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:stretch; gap:9px}
.area_tab .list > li							{ display:flex; flex:auto;  justify-content:center; align-items:center;}
.area_tab .list > li > a,
.area_tab .list > li > button					{ display:flex; justify-content:flex-start; align-items:center; position:relative; width:100%; box-sizing:border-box; padding:20px 40px 20px 20px; border-radius:10px 20px 10px 10px; 
													line-height:1.15; color:#565656; text-align:center; transition:var(--trans-ani); font-size:1.03em; font-weight:400; background:#efefef; letter-spacing:-.045em }
.area_tab .list > li > a:after,
.area_tab .list > li > button:after				{ content:''; display:block; position:absolute; width:7px; height:7px; right:20px; top:50%; border-style:solid; border-color:#4d4d4d; border-width:1px 1px 0 0; 
													transform:translateY(-50%) rotate(45deg); transition:var(--trans-ani);}
.area_tab .list > li > a.active,
.area_tab .list > li > button.active			{ background:var(--color-point); color:var(--color-white);  }
.area_tab .list > li > a.active:after,
.area_tab .list > li > button.active:after		{ border-color:#fff; }
.conts_tab										{ display:none; }
.conts_tab.active								{ display:block; }




/* list text */
.basic_ul									{ margin-top:10px;}
.basic_ul>li								{ position:relative; padding-left:12px; line-height:1.28; font-size:1.13rem; color:var(--color-base)}
.basic_ul>li+li								{ margin-top:10px; }
.basic_ul>li strong							{ font-weight:bold;}
.basic_ul>li:before							{ content:''; display:block; position:absolute; left:0px; top:8px; width:5px; height:5px; background:var(--color-point); border-radius:100%;}
.basic_ul>li>ul,
.line_dot									{ margin-top:10px;}
.li_none:before,
.none:before{background:none !important;}
.basic_ul>li>ul>li+li,
.line_dot>li+li								{ margin-top:7px; }
.basic_ul>li>ul>li,
.line_dot>li								{ position:relative; padding-left:12px; font-size:1.06rem;}
.basic_ul>li>ul>li::before,
.line_dot>li::before						{ content:''; display:block; position:absolute; left:0; top:9px; width:6px; height:2px; background:var(--color-base); opacity:.7  }
.basic_ul>li>ul>li>ul,
.small_dot									{ margin-top:10px; }
.basic_ul>li>ul>li>ul>li+li,
.small_dot>li+li							{ margin-top:5px; }
.basic_ul>li>ul>li>ul>li,
.small_dot>li								{ position:relative; padding-left:12px; font-size:1rem; }
.basic_ul>li>ul>li>ul>li::before,
.small_dot>li::before						{ content:''; display:block; position:absolute; left:0; top:7px; width:4px; height:4px; background:var(--color-base); border-radius:100%; opacity:.3 }

/*
.small_dot>li li,
.small_dot>li li li                         { position:relative; padding-left:10px; margin-top:5px}
.small_dot>li li::before					{ content:''; display:block; position:absolute; left:0; top:9px; width:6px; height:1px; background:var(--color-base2); opacity:.7  }
.small_dot>li li li::before					{ content:''; display:block; position:absolute; left:0; top:7px; width:3px; height:3px; background:var(--color-base2); border-radius:100%; opacity:.3 }
*/

/* list number */
.list_num									{ counter-reset:title; margin-top:15px; color:var(--color-base)}
.list_num>li								{ position:relative; font-size:1.13rem; font-weight:400; padding-left:31px; line-height:1.28;}
.list_num>li+li								{ margin-top:10px;}
.list_num>li:before							{ counter-increment:title; content:counter(title) " "; display:flex; justify-content:center; align-items:center; position:absolute; left:0px; top:.5px; width:23px; height:23px; 
												box-sizing:border-box; border-radius:100%; border:1px solid var(--color-base); line-height:23px; font-size:.8rem; font-weight:400; text-align:center; color:var(--color-base); opacity:.8}
.list_num.point>li:before					{ border-color:var(--color-point); color:var(--color-point); }

.list_num.flex 								{ display:flex; flex-wrap:wrap;gap:.5em 1em; margin-bottom:15px; }
.list_num.flex>li+li						{ margin-top:0; }
.box_text_line .list_num					{ margin-top:0 }
.box_text_line .list_num.flex				{ margin-bottom:0; }

/* list imgTitle */
.list_imgTitle								{ margin-top:15px;}
.list_imgTitle > li							{ position:relative; display:flex; justify-content:flex-start; align-items:flex-start; --sizeMargin:50px;}
.list_imgTitle > li::before					{ position:absolute; width:calc(100% - var(--sizeMargin)); height:calc(100% - (var(--sizeMargin) * 1.4)); border:1px solid #ddd; border-radius:10px 30px 10px 10px; right:0; bottom:-30px; content:''; z-index:-1 }
.list_imgTitle > li+li						{ margin-top:60px; }
.list_imgTitle .img							{ flex:1 0 var(--imgSize); overflow:hidden; display:block; border-radius:10px 30px 10px 10px;}
.list_imgTitle .txt							{ flex:auto; width:100%; box-sizing:border-box; margin-left:var(--sizeMargin); padding-right:calc(var(--sizeMargin) * 1.5);}
.list_imgTitle .txt>h5						{ margin-bottom:var(--sizeMargin); margin-top:var(--sizeMargin); }

/* 이미지리스트 3개 기본, 4개 col04 */
.image_list									{ display:flex; flex-wrap:wrap; gap:2em; }
.image_list li								{ width:calc(100% / 3 - 1.34em); position:relative; }
.image_list li:before						{ display:block; content:""; width:100%; height:100%; border:1px solid var(--color-gray); position:absolute; bottom:0; left:0; border-radius:10px 30px 10px 10px; }
.image_list img								{ width:100%; border-radius:10px 30px 10px 10px; position:relative; }
.image_list li:has(figcaption) img			{ border-radius:10px 30px 0 0; }
.image_list figcaption						{ text-align:center; font-weight:bold; font-size:1.1em; padding:1em 0; }
.image_list.col04 li						{ width:calc(100% / 4 - 1.5em); position:relative; }
@media all and (max-width:768px) {
    .image_list								{ gap:1em; }
    .image_list li							{ width:calc(100% / 2 - .5em) !important; }
}
@media all and (max-width:560px) {
    .image_list li							{ width:100% !important; }
}



/* 테이블 */
table													{ border-spacing:0; border-collapse:collapse; color:var(--color-base);}
table.basic_table										{ width:100%; margin-top:20px; border-top:2px solid var(--color-point);}
table.basic_table.ml25									{ width:calc(100% - 25px); }
table.basic_table thead th								{ padding:15px 10px; background:#f3f3f3; border:1px solid #ddd; font-weight:600;  font-size:1.06em}
table.basic_table thead tr:nth-of-type(1) th			{ border-top-width:0px; }
table.basic_table thead tr.none th						{ border-bottom-width:0px;}
table.basic_table thead tr.none + tr th					{ border-top:1px solid #ddd;}
table.basic_table thead th[rowspan]						{ border-right:1px solid #ddd;}
table.basic_table tbody th								{ background-color:#f8f9fa; border:1px solid #ddd; }
table.basic_table th,
table.basic_table td									{ padding:15px 10px; letter-spacing:-0.5px; line-height:1.4; word-break:keep-all; }
table.basic_table td small								{ font-size:.75em; }
table.basic_table td.bg_light_blue						{ background:var(--color-light-blue); }
table.basic_table td strong								{ font-weight:bold }
table.basic_table th									{ text-align:center; }
table.basic_table * + textarea							{ margin-top:.5em }

/* tbody */
table.basic_table thead + tbody tr td					{ text-align:center;}
table.basic_table tbody td								{ background:#fff; border:1px solid #ddd;text-align:left; border-top:none}
table.basic_table tbody tr td:nth-of-type(1),
table.basic_table tbody tr th:nth-of-type(1),
table.basic_table thead tr th:nth-of-type(1)			{ border-top-width:0px; border-left-width:0;}
table.basic_table tbody tr td:nth-last-of-type(1),
table.basic_table tbody tr th:nth-last-of-type(1),
table.basic_table thead tr th:nth-last-of-type(1)		{ border-right-width:0;}
table.basic_table tbody th								{ background:#fafafa; font-weight:400 }
table.basic_table tbody tr th:nth-of-type(1)			{ border-right-width:1px; }
table.basic_table tbody tr th:nth-of-type(2):nth-last-of-type(1) { border-right-width: 1px; }


/* table total */
table.basic_table .total th,
table.basic_table .total td								{ background-color:#f6fbff; font-weight:600;}
table.basic_table .total th								{ font-weight:700;}


table.basic_table .basic_ul								{ margin-top:0;}
table.basic_table .basic_ul>li							{ font-size:1rem; }

table.basic_table .basic_ul>li+li						{ margin-top:5px; }
table.basic_table .basic_ul>li>ul,
table.basic_table .line_dot,
table.basic_table .basic_ul>li>ul>li>ul,
table.basic_table .small_dot 							{margin-top:7px;}
table.basic_table .basic_ul>li>ul>li,
table.basic_table .line_dot>li							{font-size:.94rem;}
table.basic_table .basic_ul>li>ul>li+li,
table.basic_table .line_dot>li+li						{margin-top:5px;}
table.basic_table .basic_ul>li:before					{ top:6px; }
table.basic_table .ul_center							{ display:flex; justify-content:center; align-items:center; }
.basic_table + p,
#content .scrollTable + p								{ margin-top:10px; }

/* table scroll mobile */
#content .scrollTable									{ width:100%;}
#content .mob_info										{ display:none; position:relative; width:100%; box-sizing:border-box; margin-top:10px; padding:5px 0 5px 22px; font-size:.9rem;}
#content .mob_info:before								{ content:''; display:block; position:absolute; top:8px; left:0px; width:15.5px; height:15px; background:url(/resource/common/images/common/img_drag.svg) no-repeat 50% 0; background-size:100%; opacity:.64}

/* 내용이 긴 table */
table.basic_table.break-all thead th,
table.basic_table.break-all tbody td					{word-break:break-all;}



/* button */
.basic_btn												{ margin-top:20px;}
.basic_btn.center										{ margin-top:40px; text-align:center;}
.basic_btn.flex											{ display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center;}
.basic_btn a,
.basic_btn button                               		{ overflow:hidden; display:inline-flex; position:relative; min-width:130px; height:50px; box-sizing:border-box; margin:2px; padding:0 20px; border:1px solid transparent; border-radius:8px 20px 8px 8px;
    														background-color:var(--color-point); color:#fff; vertical-align:middle; transition:var(--trans-ani); font-weight:500; align-items:center; justify-content:center;}
.basic_btn span											{ display:flex; flex-flow:row wrap; justify-content:center; align-items:center; position:relative; z-index:2; height:100%; line-height:1.2em; color:var(--color-white); transition:var(--trans-ani);}
.basic_btn .lg											{ min-width:195px; height:60px; font-size:1.13em;}
.basic_btn .sm											{ min-width:110px; height:40px; font-size:.88rem; border-radius:5px 15px 5px 5px;}
.basic_btn .sm02										{ min-width:110px; height:30px; font-size:.88rem; border-radius:5px 15px 5px 5px;}
.basic_btn>*:hover,
.basic_btn>*:focus										{ box-shadow:0 5px 5px rgba(0,0,0,0.15);}
.basic_btn .white										{ background-color:#fff; border-color:#dddddd;}
.basic_btn .white span									{ color:var(--color-base);}
.basic_btn .white:hover,
.basic_btn .white:focus									{ border-color:#222;}
.basic_btn .black										{ background:#222; border-color:#222;}
.basic_btn .gray										{ background:#efefef;  font-weight:500;}
.basic_btn .gray span									{ color:var(--color-base);}
.basic_btn .gray:hover,
.basic_btn .gray:focus									{ border-color:#999}
.basic_btn a[target="_blank"] span:after,
.basic_btn button[target="_blank"] span:after,
.basic_btn a[target="body"] span:after,
.basic_btn button[target="body"] span:after		   		{ content:''; opacity:1; display:inline-block; width:13px; height:11px; margin-left:7px; background:url(/resource/common/images/common/icon_newtab.svg) no-repeat 50% 50%; background-size:100%;
   															vertical-align:middle; transition:opacity var(--trans-ani); filter:invert(100%) sepia(98%) saturate(0%) hue-rotate(356deg) brightness(102%) contrast(103%); margin-top:-.5px;}
.basic_btn .download span:after							{ content:''; opacity:1; display:inline-block; width:14px; height:13px; margin-left:7px; background:url(/resource/common/images/common/icon_dowload.svg) no-repeat 50% 50%; background-size:100%; 
															vertical-align:middle; transition:opacity var(--trans-ani);   filter:invert(100%) sepia(98%) saturate(0%) hue-rotate(356deg) brightness(102%) contrast(103%);}
.basic_btn .white[target="_blank"] span:after,
.basic_btn .gray[target="_blank"] span:after,
.basic_btn a[target="body"] span:after,
.basic_btn button[target="body"] span:after,
.basic_btn .download.white span:after,
.basic_btn .download.gray span:after					{ filter:inherit; }
.basic_btn a.view[target="_blank"] span:after			{ background-image:url(/resource/common/images/bbs/icon_search.svg); width:11px; filter: invert(18%) sepia(74%) saturate(3670%) hue-rotate(196deg) brightness(94%) contrast(101%); }


/* 다이어그램 */
.area_diagram									{ margin-top:15px; }
.area_diagram .list								{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:stretch; --sizePadding:25px; margin-right:calc(var(--sizePadding) * -1);}
.area_diagram .list > li						{ position:relative; flex:0 1 20%; box-sizing:border-box; position:relative; margin-top:0px; margin-bottom:10px; padding-right:var(--sizePadding); }
.area_diagram .list > li span					{ position:relative; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; min-height:140px; height:100%; box-sizing:border-box; padding:var(--sizePadding); background:#fff;
    												border:1px solid var(--color-point); border-radius:10px; text-align:center; font-size:1.08em; font-weight:600; word-break:keep-all; color:var(--color-base) }
.area_diagram .list > li span:before			{ position:absolute; width:calc(100% + 2px); height:100%; background:var(--color-point); content:''; bottom:-6px; left:-1px; border-radius:10px; z-index:-1 }	
.area_diagram .list > li span small				{ font-size:.9rem; font-weight:500; line-height:1.3; color:var(--color-base); opacity:.8}
.area_diagram .list > li span i					{ line-height:1.3em;}
.area_diagram .list > li:last-child:before,
.area_diagram .list > li:last-child:after		{ display:none; }
.area_diagram .list > li:before					{ width:8px; height:8px; border:2px solid var(--color-point); background:#fff; border-radius:100%; transform:translateY(-50%); right:22px; z-index:2}
.area_diagram .list > li:after					{ width:23px; height:11px; background:url(/resource/common/images/common/icon_diagram.svg) no-repeat 50% 50% / contain; transform:translateY(-50%); right:7px; }
.area_diagram .list > li:before,
.area_diagram .list > li:after					{ content:''; display:block; position:absolute; top:50%; }

/* 한줄 갯수 4개 6개 */
.area_diagram .list.col03 > li					{ flex:0 1 33%; }
.area_diagram .list.col04 > li					{ flex:0 1 25%; }
.area_diagram .list.col06 > li					{ flex:0 1 calc(100% / 6); }

/* 한줄 5개로 두줄처리 */
.area_diagram .list.row							{ margin-right:0px; }



/* 다이어그램 디자인 다른타입 */
.area_diagram_type02								{ margin-top:15px;}
.area_diagram_type02 .list							{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:stretch; --sizePadding:40px; gap:1em 0; }
.area_diagram_type02 .list:has(> li:nth-child(3):last-child):not(:has(> li:nth-child(4))),
.area_diagram_type02 .list.col05                    { margin-right: calc(var(--sizePadding) * -1); }
.area_diagram_type02 .list > li						{ flex:none; width:calc(100% / 3); box-sizing:border-box; position:relative; padding-right:var(--sizePadding);}
.area_diagram_type02 .list > li:after,
.area_diagram_type02 .list > li:before				{ content:''; display:block; position:absolute; top:50%; right:calc(var(--sizePadding) / 2 - 0px); width:8px; height:8px; border-style:solid; border-width:1px 1px 0 0; border-color:var(--color-point); 
														transform:translateY(-50%) rotate(45deg);}
.area_diagram_type02 .list > li:before				{ right:calc(var(--sizePadding) / 2 - 4px); }
.area_diagram_type02 .list > li dl					{ overflow:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; min-height:150px; height:100%; border:1px solid var(--color-point); border-radius:10px; 
														background-color:var(--color-point); }
.area_diagram_type02 .list > li dt					{ flex:0 1 100%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; box-sizing:border-box; padding:10px 25px; margin-bottom:auto; min-height:75px; 
														font-size:1.06em; font-weight:bold; color:#fff; word-break:keep-all; text-align:center }
.area_diagram_type02 .list > li dd					{ flex:0 1 100%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; box-sizing:border-box; padding:10px 25px; margin-bottom:auto; min-height:100px; 
														background-color:#fff; word-break:keep-all; text-align:center; border-radius:10px; color:var(--color-base) }
.area_diagram_type02 .list > li dd small            { display:flex; flex-wrap:wrap; flex:0 1 100%; text-align:center; background:#f4f4f4; border-radius:10px;  display:flex; align-items:center; justify-content:center; padding:.5em; font-size:.9em; margin-top:.5em }
.area_diagram_type02 .list > li:last-child:before,
.area_diagram_type02 .list > li:last-child:after	{ display:none;}


/* 다이어그램 디자인 다른타입 - 4개 출력 */
.area_diagram_type02 .list.col04 > li				{ width:calc(100% / 4); }
.area_diagram_type02 .list.col05 > li				{ width:calc(100% / 5); }



/* 공공누리, 담당자정보 */
#aside											{  box-sizing:initial; margin-top:60px; padding:20px 15px 18px 15px; border:1px solid #ddd; border-radius:20px; }
.open_license									{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; gap:10px 0 }
.open_license > p								{ margin-bottom:5px;}
.open_license .license_mark						{ margin-right:15px; }
.open_license .license_mark a					{ display:inline-block;}
.open_license .license_mark img					{ max-width:100%;}
.open_license .license_txt						{ display:flex; flex-flow:row wrap; gap:5px; align-items:center; color:var(--color-base);  font-weight:400 }
.open_license .license_txt a					{ display:inline-block; padding:7px 10px; border:1px solid #e0e0e0; border-radius:8px; line-height:1.1; color:var(--color-point); font-weight:bold;}
.box_foot_divz									{ margin-top:15px; background:#f3f3f3; border-radius:15px; padding:20px 15px; font-size:.94rem;}
.box_foot_divz #satibox							{ position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; border-bottom:1px solid #dadada; padding-bottom:15px; margin-bottom:15px; gap:15px }
.box_foot_divz #satibox	.icon::before			{ content:''; background-position:center; background-repeat:no-repeat; background-size:contain; }
.box_foot_divz #satibox ul,
.box_foot_divz .sati_form						{ display:flex; flex-wrap:wrap; flex-flow:row wrap; justify-content:flex-start; align-items:center;}
.box_foot_divz #satibox ul > li					{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; }
.box_foot_divz #satibox ul > li:first-child		{ min-width:140px; display:flex; flex-flow:row wrap; gap:10px; align-items:center; line-height:1}
.box_foot_divz #satibox ul > li strong			{ font-weight:bold; color:var(--color-base) }
.box_foot_divz .icon::before					{ content:''; display:inline-block; background-position:center; background-repeat:no-repeat; background-size:contain; }
.box_foot_divz #satibox ul > li .icon::before	{ width:20px; height:18px; background-image:url(/resource/common/images/common/icon_sati_info.svg); margin-top:1px; }
.box_foot_divz #satibox ul > li dl,
.box_foot_divz #satibox .mod					{ display:flex; flex-wrap:wrap; flex-flow:row wrap; justify-content:flex-start; /*align-items:center;*/ margin-right:50px;  font-weight:400 }
.box_foot_divz #satibox ul > li dl>dt,
.box_foot_divz #satibox .mod dt					{ font-weight:bold; color:var(--color-base);  margin-right:12px; }
.box_foot_divz #satibox ul > li dl>dd,
.box_foot_divz #satibox .mod dd					{ position:relative; padding-left:16px; color:#535353; }
.box_foot_divz #satibox ul > li dl>dd::before,
.box_foot_divz #satibox .mod dd::before			{ position:absolute; width:5px; height:5px; top:8px; left:0; border-radius:100%; background:#c2c2c2; content:'';  }
.box_foot_divz #satibox .mod					{ margin-right:0; }
.box_foot_divz #satibox .mod dt					{ display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; gap:10px; }
.box_foot_divz #satibox .mod dt .icon::before	{ width:20px; height:18px; background-image:url(/resource/common/images/common/icon_sati_mod.svg); margin-bottom:-2px; }

.box_foot_divz .sati_form>strong				{ min-width:140px; display:flex; flex-flow:row wrap; gap:10px; align-items:center; line-height:1; font-weight:bold; color:var(--color-base) }
.box_foot_divz .sati_form>strong .icon::before	{ width:18px; height:18px; background-image:url(/resource/common/images/common/icon_sati.svg); margin-top:1px; }
.box_foot_divz .sati_form ul					{ display:flex; gap:0 40px; flex-wrap:wrap;}
.box_foot_divz .sati_form ul>li					{ display:flex;  align-items:center; color:var(--color-base); font-weight:400 }
.box_foot_divz .sati_form ul>li.basic_btn		{ margin-top:0; margin-left:10px; }
.box_foot_divz .sati_form input					{ width:22px; height:22px; margin-right:10px;  }


@media all and (max-width:1568px) {
	/* 아이콘 박스 */
	.box_info_top .ico						{ margin-right:40px; }
	.box_info_top h4,
    .box_info_top h5                        { font-size:1.45em; }
	.box_info_top p							{ font-size:1.1em; }
	
	/* 다이어그램 */
	.area_diagram .list						{ --sizePadding:20px; }
	.area_diagram .list > li span,
	.area_diagram_type02 .list > li dt		{ font-size:1.03em; line-height:1.3 }
	.area_diagram .list > li:after			{ right:0; }
	.area_diagram .list > li:before			{ right:17px; }

	.area_diagram_type02 .list				{ --sizePadding:30px; }
	.area_diagram_type02 .list.col04 > li,
	.area_diagram_type02 .list.col05 > li   { width:calc(100% / 3); }	
	.area_diagram_type02 .list > li dt br,
	.area_diagram_type02 .list > li dd:not(.tal) br	{ display:none; }
	
	/* 공공누리, 담당자정보 */
	.box_foot_divz #satibox ul > li dl			{ margin-right:25px; }
	.box_foot_divz .sati_form ul				{ gap:0 25px }
	.box_foot_divz .sati_form ul>li.basic_btn	{ margin-left:5px; }
}
@media all and (max-width:1368px) {
	/* 제목 */
	.title_h4								{ font-size:1.53em; }
	.title_h5								{ font-size:1.2em; }
	.title_h5:before						{ width:9px; height:9px; top:3px;  }
	
	/* 단순 박스 정렬 */
	.box_flex h4 + p, 
	.box_flex h5 + p, 
	.box_flex h6 + p						{ font-size:1em; }
	
	/* 기본 텍스트 */
	.basic_p								{ font-size:1.03em;  }
	
	
	/* 아이콘 박스 */
	.box_info_top .ico						{ width:110px; height:110px; margin-right:30px;  }
	.box_info_top h4,
    .box_info_top h5                        { margin:0 0 15px 0; font-size:1.35em; }
	.box_info_top p							{ font-size:1.067em; }
	
	/* 단순 박스 스타일 */
	[class*="box_text_"]					{ margin-top:10px; padding:15px; }
	.box_text_gray,							
	.box_text_line							{ font-size:1.03em;}
	
	/* 컨텐츠 안 탭메뉴 */
	.area_tab										{ margin-bottom:20px; padding:0 15px 15px 15px; }
	.area_tab::before								{ height:calc(100% - 20px); }
	.area_tab .list > li > a,
	.area_tab .list > li > button					{ padding:15px 30px 15px 15px; border-radius:8px 15px 8px 8px;   }
	.area_tab .list > li > a:after,
	.area_tab .list > li > button:after				{ right:15px; transform:translateY(-60%) rotate(45deg); }
	
	
	/* list text */
	.basic_ul>li								{ font-size:1.1rem; }
	.basic_ul>li:before							{ top:7.5px; }
	.line_dot>li,
	.basic_ul>li>ul>li							{ font-size:1rem;}
	.line_dot>li::before,
	.basic_ul>li>ul>li::before					{ top:8.5px; }
	.small_dot>li,
	.basic_ul>li>ul>li>ul>li					{ font-size:.95rem; }
	.small_dot>li::before,
	.basic_ul>li>ul>li>ul>li::before			{ top:6px; }
	
	
	/* list number */
	.list_num>li								{ font-size:1.1rem; padding-left:28px; }
	.list_num>li:before							{ width:20px; height:20px; line-height:20px; font-size:.75rem; padding-right:1px}

	
	
	/* list imgTitle */
	.list_imgTitle > li							{ --sizeMargin:40px; }
	.list_imgTitle .txt							{ padding-right:calc(var(--sizeMargin) * 1);}
	
	
}
@media all and (max-width:1068px) {
	/* 공공누리, 담당자정보 */
	.box_foot_divz #satibox						{ flex-flow:column; }
	.box_foot_divz #satibox .mod				{ gap:10px 0; }
	.box_foot_divz #satibox .mod dt				{ min-width:140px; margin-right:0; }
	.box_foot_divz #satibox .mod dd				{ padding-left:0; }
	.box_foot_divz #satibox .mod dd::before		{ display:none;}
}
@media all and (max-width:1024px) {
	/* 제목 */
	.title_h6:before, 
	.title_h6:after								{ top:7px; }
	
	/* 아이콘 박스 */
	.box_info_top p								{ word-break:break-all }
	
	/* list text */
	.basic_ul>li								{ font-size:1.03rem; }
	.basic_ul>li:before							{ top:6.5px; width:5px; height:5px; }
	.basic_ul>li>ul>li,
	.line_dot>li								{ font-size:.98rem;}
	.basic_ul>li>ul>li::before,
	.line_dot>li::before						{ top:7.5px;  }
	.small_dot>li,
	.basic_ul>li>ul>li>ul>li					{ font-size:.9rem; }
	.small_dot>li::before,
	.basic_ul>li>ul>li>ul>li::before			{ top:5px; }
	
	
	/* list number */
	.list_num>li								{ font-size:1.03rem; padding-left:25px; }
	.list_num>li:before							{ font-size:.7rem;  }

	
	
	/* list imgTitle */
	.list_imgTitle > li							{ --sizeMargin:30px;}
	.list_imgTitle > li::before					{ height:calc(100% - (var(--sizeMargin) * 1.5)); bottom:-20px; }
	.list_imgTitle > li+li						{ margin-top:40px; }
	.list_imgTitle .img							{ border-radius:10px 20px 10px 10px;}
	.list_imgTitle .txt							{ padding-right:calc(var(--sizeMargin) * .8);}
	
	/* 테이블 */
	table.basic_table tbody th, 
	table.basic_table td						{ font-size:.92rem; }
    #content .scrollTable						{ overflow:auto;}
    #content .scrollTable .basic_table,
  	#boardWrap .view_table .view_con table		{ width:1024px; margin-top:0px;}
    #content .mob_info							{ display:block; margin-bottom:5px;}
    table.basic_table thead th					{ padding:13px 9px;}
	
	table.basic_table .basic_ul>li				{ font-size:.92rem; }
	table.basic_table .basic_ul>li+li			{ margin-top:5px; }
	table.basic_table .basic_ul>li:before		{ top:6px; }
}
@media all and (max-width:968px) {
	/* 다이어그램 */
    .area_diagram .list									{ width:100%; }
    .area_diagram .list > li							{ flex:0 1 33.333% }
	
	/* 한줄 갯수 4개 6개 */
	.area_diagram .list.col03 > li						{ flex:0 1 33%; }
	.area_diagram .list.col04 > li						{ flex:0 1 33%; }
	.area_diagram .list.col06 > li						{ flex:0 1 calc(100% / 3); }
	.area_diagram_type02 .list:has(> li:nth-child(3):last-child):not(:has(> li:nth-child(4))),
	.area_diagram_type02 .list.col05                    { margin-right:0; }
	.area_diagram_type02 .list > li,
	.area_diagram_type02 .list.col04 > li,

	.area_diagram_type02 .list.col05 > li               { width:calc(100% / 2); }

	
	
	/* 버튼 */
	.basic_btn .lg										{ min-width:175px; height:55px; font-size:1.067em }
	.basic_btn a, 
	.basic_btn button									{ min-width:110px; height:45px; }
	.basic_btn .sm										{ min-width:80px; }
	
	
}

@media all and (max-width:868px) {
	.title_h4								{ font-size:1.43em; }
	.title_h4:before,
	.title_h4:after							{ width:6px; height:6px; }
	.title_h4:after							{ left:9px; }
	
	/* 단순 박스 정렬 */
	.box_flex h4 + p, 
	.box_flex h5 + p, 
	.box_flex h6 + p						{ font-size:.95em; }


	
	/* 아이콘 박스 */
	.box_info_top							{ margin-bottom:30px; padding:20px; flex-flow:column; gap:15px; align-items:flex-start; }
	.box_info_top::before,
	.box_info_top::after					{ width:103px; height:78px;  }
	.box_info_top .ico						{ width:80px; height:80px; margin-right:20px; }
	.box_info_top h4,
    .box_info_top h5                        { font-size:1.25em; }
    .box_info_top:has(.map_box)             { padding:20px; }
	
	/* 컨텐츠 안 탭메뉴 */
	.area_tab .list > li > a,
	.area_tab .list > li > button					{ padding:12px 20px 12px 12px; }
	.area_tab .list > li > a:after,
	.area_tab .list > li > button:after				{ right:12px; }
	
	/* list text */
	.basic_ul>li								{ font-size:1rem; }
	.basic_ul>li:before							{ top:6px; }
	.basic_ul>li>ul>li,
	.line_dot>li								{ font-size:.95rem;}
	.basic_ul>li>ul>li>ul>li,
	.small_dot>li								{ font-size:.88rem; }
	.basic_ul>li>ul>li>ul>li::before,
	.small_dot>li::before						{ top:6px; }
	.list_num>li								{ font-size:1rem; }
	
	/* list imgTitle */
	.list_imgTitle > li							{ --sizeMargin:10px; flex-flow:column; }
	.list_imgTitle > li::before					{ height:calc(100% - (var(--sizeMargin) * 5)); }
	.list_imgTitle .img							{ flex:100%; --imgSize:100%; width:calc(100% - (var(--sizeMargin) * 5)) }
	.list_imgTitle .img img						{ width:100%; }
	.list_imgTitle .txt							{ padding:15px 30px 15px 20px;}
	
	
	/* 공공누리, 담당자정보 */
	#aside										{ position:relative; }
	.box_foot_divz #satibox ul,
	.box_foot_divz .sati_form					{ flex-flow:column; align-items:flex-start; gap:10px; }
	.box_foot_divz .sati_form					{ gap:3px 0; }
	.box_foot_divz #satibox .mod				{ gap:0; position:absolute; right:0; top:0; }
	.box_foot_divz #satibox .mod dt				{ min-width:inherit; margin-right:12px; }
	.box_foot_divz #satibox .mod dd				{ padding-left:16px; }
	.box_foot_divz #satibox .mod dd::before		{ display:block;}
	.box_foot_divz								{ padding:15px; font-size:.9rem;}
	.box_foot_divz #satibox ul > li dl			{ margin-right:20px; }
	.box_foot_divz .sati_form ul				{ gap:5px 20px; }
	.box_foot_divz .sati_form ul>li.basic_btn	{ margin-left:0; }
}
@media all and (max-width:668px) {
	/* list imgTitle */
	.list_imgTitle > li::before					{ height:calc(100% - (var(--sizeMargin) * 5)); border-radius: 10px 20px 10px 10px; }
	.list_imgTitle .img							{ width:calc(100% - (var(--sizeMargin) * 3)) }
	
	/* 버튼 */
	.basic_btn .lg								{ min-width:155px; height:50px; font-size:1.067em }
	.basic_btn a, 
	.basic_btn button							{ min-width:100px; height:inherit; min-height:40px; padding:7px 15px 5px 15px; border-radius: 8px 15px 8px 8px;}
	.basic_btn .sm								{ min-width:70px; height:36px; }
	.basic_btn span								{ flex-flow:row; line-height:1.3 }
	.basic_btn a[target="_blank"] span:after,
	.basic_btn button[target="_blank"] span:after,
	.basic_btn a[target="body"] span:after,
	.basic_btn button[target="body"] span:after,	   		
	.basic_btn .download span:after				{ min-width:13px; }
	
	/* 다이어그램 */
    .area_diagram .list > li					{ flex:0 1 50% }
	
	/* 한줄 갯수 4개 6개 */
	.area_diagram .list.col03 > li				{ flex:0 1 50%; }
	.area_diagram .list.col04 > li				{ flex:0 1 50%; }
	.area_diagram .list.col06 > li				{ flex:0 1 calc(100% / 2); }
	
	.area_diagram_type02 .list					{ --sizePadding:20px; }
}
@media all and (max-width:468px) {
	/* 다이어그램 */
    .area_diagram .list > li					{ flex:100%; padding-right:0; padding-bottom:var(--sizePadding); }
	.area_diagram .list > li:before, 
	.area_diagram .list > li:after				{ top:inherit; bottom:0; right:inherit; left:50%; transform: translateX(-50%) rotate(90deg); }
	.area_diagram .list > li:before				{ right:inherit; bottom:12px; }
	.area_diagram .list > li span				{ min-height:inherit; }

	
	/* 한줄 갯수 4개 6개 */
	.area_diagram .list.col03 > li				{ flex:100%; }
	.area_diagram .list.col04 > li				{ flex:100%; }
	.area_diagram .list.col06 > li				{ flex:100%; }
	
	.area_diagram_type02 .list > li, 
	.area_diagram_type02 .list.col04 > li,
	.area_diagram_type02 .list.col05 > li       { width:100%; }
	.area_diagram_type02 .list > li				{ padding-right:0; padding-bottom:var(--sizePadding); }
	.area_diagram_type02 .list > li:after, 
	.area_diagram_type02 .list > li:before		{ top:inherit; bottom:1px; right:inherit; left:50%; transform:translate(-50%, -50%) rotate(135deg)}
	.area_diagram_type02 .list > li:before		{ bottom:-4px; }
	.area_diagram_type02 .list > li dl			{ min-height:inherit; height:auto; }
	.area_diagram_type02 .list > li dt,			
	.area_diagram_type02 .list > li dd			{ min-height:inherit; padding:25px 10px; }
	
	/* 공공누리, 담당자정보 */
	.box_foot_divz #satibox .mod				{ position:initial; }
}
@media all and (max-width:368px) {
	/* list imgTitle */
	.list_imgTitle > li::before					{ height:calc(100% - (var(--sizeMargin) * 4)); }
	.list_imgTitle .img							{ width:calc(100% - (var(--sizeMargin) * 2)) }
}






/************************************************************

							 하단
 
************************************************************/
.footer															{ position:relative; }


/* 배너모음 */
.footer	.slide_banner											{ display:flex; align-items:center; border-top:1px solid #e7e7e7; border-bottom:1px solid #e7e7e7; --sizeHig:85px; width:100%;  }
.footer	.slide_banner .con_inner								{ position:relative; display:flex;  height:var(--sizeHig); justify-content:space-between; align-items:center; overflow:hidden; z-index:1 }
.footer	.slide_banner .con_inner::before						{ content:''; display:block; position:absolute; right:0; top:0px; z-index:10; width:185px; height:100%; background-image:linear-gradient(270deg, #fff 80%, rgba(255,255,255,0));}
.footer	.slide_banner .con_inner em								{ position:relative; width:137px;  font-size:1.13em; font-weight:900; color:var(--color-base)  } 
.footer	.slide_banner .mySwiper									{ width:calc(100% - 147px); margin:0 -25px; }
.footer .slide_banner .swiper-slide								{ display:flex; width:auto; padding:0 25px; height:var(--sizeHig); align-items:center;}
.footer .slide_banner .swiper-slide	a							{ display:block; font-weight:500; color:#666; line-height:1.4; }
.footer .slide_banner .swiper-slide	a:hover,
.footer .slide_banner .swiper-slide	a:focus						{ color:var(--color-point); }
.footer .slide_banner .swiper_control							{ position:relative; z-index:10; display:flex; justify-content:flex-end; align-items:center; }
.footer .slide_banner .swiper_next::before,						
.footer .slide_banner .swiper_prev::before,						
.footer .slide_banner .swiper_auto::before,						
.footer .slide_banner .swiper_auto.paused::before				{ filter:invert(.3); }
.footer .slide_banner .swiper_prev::before						{ display:inline-block; width:8px; height:14px; background:url(/resource/common/images/common/icon_sb_prev.svg) no-repeat 50% 50% / auto 14px; content:''; }	
.footer .slide_banner .swiper_next::before						{ display:inline-block; width:8px; height:14px; background:url(/resource/common/images/common/icon_sb_next.svg) no-repeat 50% 50% / auto 14px; content:''; }	
.footer .slide_banner .swiper_auto.paused::before				{ background-image:url(/resource/common/images/common/icon_sb_play.svg); background-size:8px 11px; }		
.footer .slide_banner .swiper_auto::before						{ background-image:url(/resource/common/images/common/icon_sb_stop.svg); background-size:8px 11px; }	
.footer .slide_banner .swiper_prev								{ width:25px; height:25px; display:flex; cursor:pointer; align-items:center; justify-content:center; }
.footer .slide_banner .swiper_next								{ width:25px; height:25px; display:flex; cursor:pointer; align-items:center; justify-content:center; }
.footer .slide_banner .swiper_auto								{ position:relative; display:flex; width:25px; height:25px;  }
.footer .slide_banner .swiper_auto::before						{ content:''; position:absolute; width:100%; height:100%; left:0; top:0; background-position:center; background-repeat:no-repeat; background-size:8px 10px; }
.footer .slide_banner .swiper_control .more						{ position:relative; display:block; width:35px; height:35px; border-radius:100%; background:#eeeeee; margin-left:10px; transition:var(--trans-ani);}
.footer .slide_banner .swiper_control .more::before				{ position:absolute; width:100%; height:100%; background:url(/resource/common/images/common/icon_family_btn.svg) no-repeat 50% 50% / auto 11px; content:''; right:0; top:0; 
																	transition:var(--trans-ani); opacity:.8;  }
.footer .slide_banner .swiper_control .more:hover,
.footer .slide_banner .swiper_control .more:focus				{ border-color:var(--color-point); background:var(--color-point) }
.footer .slide_banner .swiper_control .more:hover::before,
.footer .slide_banner .swiper_control .more:focus::before		{ filter:invert(100); transform:rotate(180deg); }

/* 카피라이터 */
.footer																		{ padding-bottom:4em; }
.footer .family_list														{ position:relative; display:flex; gap:0 13px; }
.footer .family_list>li														{ position:relative; flex:auto; }
.footer .family_list>li .family_btn											{ position:relative; display:flex; width:100%; height:60px; align-items:center; padding:0 30px; background:#eeeeee; border-radius:5px; font-size:1em; font-weight:500; z-index:1; }
.footer .family_list>li .family_btn span									{ position:relative; width:100%; display:flex; align-items:center; color:var(--color-base) }
.footer .family_list>li .family_btn span::before							{ position:absolute; width:9px; height:9px; border-style:solid; border-width:1px 1px 0 0; border-color:#505050; content:''; right:0; top:50%; 
																				transform:translateY(-20%) rotate(-45deg); transition:var(--trans-ani); }
.footer .family_list>li .family_box											{ position:absolute; display:none; width:100%; left:0; bottom:61px; padding:1.25em; border:1px solid #e7e7e7; border-radius:10px; background:var(--color-white); z-index:20;
																				max-height:17em; overflow-y:scroll }
.footer .family_list>li .family_btn.active span::before						{ transform:translateY(-80%) rotate(-225deg); }
.footer .family_list>li .family_box ul										{ display:flex; gap:5px 20px; flex-flow:column; }
.footer .family_list>li .family_box ul>li a									{ position:relative; display:flex; padding-left:10px; font-size:.9rem; opacity:.94; align-items:center; color:var(--color-base)}
.footer .family_list>li .family_box ul>li a::before							{ position:absolute; left:0; top:.6rem; width:3px; height:3px; background:rgba(0,0,0,.5); border-radius:100%; content:''; transition:var(--trans-ani);}
.footer .family_list>li .family_box ul>li a[target='_blank']::after			{ content:""; display:inline-block; opacity:.8; transition:all .4s; margin-left:7px; vertical-align:middle; width:11px; height:10px; transition:var(--trans-ani);
																				background:url(/resource/common/images/common/icon_newtab.svg) no-repeat 50% 50% / auto 10px; filter:invert(0%) sepia(100%) saturate(0%) hue-rotate(310deg) brightness(100%) contrast(150%);}
.footer .family_list>li .family_box ul>li a:hover,
.footer .family_list>li .family_box ul>li a:focus							{ color:var(--color-point); opacity:1;}
.footer .family_list>li .family_box ul>li a[target='_blank']:hover::after,
.footer .family_list>li .family_box ul>li a[target='_blank']:focus::after	{ filter:inherit;}
.footer .family_list>li .family_box ul>li a:hover::before,
.footer .family_list>li .family_box ul>li a:focus::before					{ background:var(--color-point); }

.footer .copyright															{ display:flex; flex-flow:column; margin-top:2em; letter-spacing:0; color:var(--color-base);  position:relative; z-index:2 }
.footer	.copyright .link													{ display:flex; gap:0 40px; flex-wrap:wrap; margin-top:2em; border-top:1px solid #e5e5e5; padding-top:1.5em  }
.footer	.copyright .link a													{ display:block; font-size:.94rem; opacity:.9;}
.footer	.copyright .link strong												{ font-weight:bold;  color:var(--color-point);}
.footer	.copyright .list													{ display:flex; gap:0 35px; flex-wrap:wrap; margin-top:1.88em; font-size:.94rem}
.footer	.copyright .list>li													{ display:flex; gap:0 5px; flex-wrap:wrap; }
.footer	.copyright .list>li strong											{ font-weight:bold; }
.footer	.copyright .copy													{ position:relative; margin-top:2.25em; letter-spacing:.025em; color:#919191; font-size:.88rem;}
.footer .copyright .wa_mark													{ position:absolute; right:0; bottom:-1em; width:100px; height:auto;  }
.footer .copyright .wa_mark[target='_blank']::after							{ display:none; }


/* 맨위로 */
#btn_top																	{ opacity:0; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; align-content:center; position:fixed; right:60px; bottom:40px; z-index:5;
																				 width:60px; height:60px; background-color:var(--color-point); border-radius:100%; font-size:13px; font-weight:300; color:#fff; transition:var(--trans-ani); }
#btn_top:before																{ content:''; display:block; width:11px; height:7px; margin-bottom:5px; background:url(/resource/common/images/common/icon_top.svg) no-repeat 50% 50%; background-size:auto; 
																				transform:translateY(0px) rotate(0deg); transition:all 0.3s;  }
#btn_top span																{ display:block; width:100%; text-align:center; line-height:1em;}
#btn_top:hover:before														{ opacity:1; transform:translateY(-5px) rotate(0deg);}
#btn_top.active																{ opacity:1;}




@media all and (max-width:1768px){
	.footer .slide_banner										{ --sizeHig:75px; }
	.footer .slide_banner .con_inner em							{ font-size:1.067em; }
	.footer .slide_banner .swiper-slide							{ font-size:.98rem; }
	.footer .family_list>li .family_btn							{ height:55px; padding:0 25px; }
  .footer .family_list>li .family_box							{ bottom:56px; }
	#btn_top													{ width:55px; height:55px; right:1%; }
}
@media all and (max-width:1368px){
	.footer														{ padding-bottom:3em; }
	.footer .slide_banner										{ --sizeHig:70px; }
	.footer .slide_banner .con_inner::before					{ width:165px; }
	.footer .slide_banner .con_inner em							{ font-size:1.03em; }
	.footer .slide_banner .swiper-slide							{ font-size:.95rem; }
	.footer .family_list										{ gap:0 8px; }
	.footer .family_list>li .family_btn							{ height:50px; padding:0 20px; font-size:.9rem }
	.footer .family_list>li .family_box							{ bottom:51px; padding:1em 1.25em }
	.footer .copyright .link									{ gap:0 20px; margin-top:1.5em; }
	.footer .copyright .link a									{ font-size:.9rem; }
	.footer .copyright .list									{ gap:0 30px; margin-top:1.5em; font-size:.9rem }
	.footer .copyright .copy									{ margin-top:1.5em; }
	.footer .copyright .wa_mark									{ width:70px; bottom:-.5em }
}
@media all and (max-width:968px) {
	.footer														{ padding-bottom:2.5em; }
	.footer .slide_banner										{ --sizeHig:60px; }
	.footer .slide_banner .con_inner::before					{ width:145px; }
	.footer .slide_banner .con_inner em							{ font-size:1em; width:107px; }
	.footer .slide_banner .mySwiper								{ width:calc(100% - 117px);  margin: 0 -20px; }
	.footer .slide_banner .swiper-slide							{ font-size:.9rem; padding:0 20px }
	.footer .slide_banner .swiper_prev,							
	.footer .slide_banner .swiper_next,							
	.footer .slide_banner .swiper_auto							{ width:22px; height:22px; }
	.footer .slide_banner .swiper_control .more					{ width:30px; height:30px; }
	.footer .slide_banner .swiper_control .more::before			{ background-size:auto 9px; }												
																	
	.footer .family_list										{ gap:8px; }
	.footer .family_list>li .family_btn							{ height:45px; padding:0 15px; }
	.footer .family_list>li .family_box							{ bottom:46px; }
	.footer .family_list>li:nth-child(5)						{ display:none; }
	.footer .copyright .list									{ margin-top:1.25em;}
	.footer .copyright .copy									{ margin-top:1.25em; }
}
@media all and (max-width:668px) {
	.footer .slide_banner .con_inner em							{ width:97px; }
	.footer .slide_banner .mySwiper								{ width:calc(100% - 107px); }
	.footer .family_list										{ flex-wrap:wrap; }
	.footer .family_list>li										{ flex:0 1 calc((100% - 8px) / 2); }
	.footer .family_list>li .family_btn span::before			{ width:7px; height:7px; transform:translateY(-25%) rotate(-45deg); }
	.footer .family_list>li .family_btn.active span::before		{ transform:translateY(-65%) rotate(-225deg); }
	#btn_top													{ width:45px; height:45px; bottom:10px; }
	#btn_top span												{ font-size:.8rem; }
	#btn_top:before												{ width:10px; height:6px; }
	#btn_top:hover:before										{ transform:translateY(-3px) rotate(0deg); }
}
@media all and (max-width:468px) {
	.footer .slide_banner .con_inner em							{ display:none }
	.footer .slide_banner .mySwiper								{ width:100%; }
	.footer .slide_banner .swiper-slide							{ font-size:.85rem; }
	.footer .family_list										{ gap:5px; }
	.footer .family_list>li										{ flex:100%; }
	.footer .family_list>li .family_btn							{ padding:0 15px; font-size:.85rem }
	.footer .copyright .link									{ gap:0 20px; }
	.footer .copyright .link a,
	.footer .copyright .list									{ font-size:.85rem; }
	.footer .copyright .copy									{ font-size:.8rem; }
	.footer .copyright .wa_mark									{ position:initial; display:flex; margin-top:1em}
}

.rdiv2, .rdiv3{display:flex;gap:1%;justify-content: space-around;align-items: start;}
.rdiv_con{flex:1 1 auto}
@media all and (max-width:768px) {
  .rdiv2, .rdiv3{display:block;}
}




/* 단일 레이어 팝업 */
#popup_layer 																{ position:fixed; top:0; left:0; z-index:10000; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.4);}
.popup_box																	{ position:relative; top:50%; left:50%; width:max-content; max-width:700px; transform:translate(-50%, -50%); z-index:1002; box-sizing:border-box; background:#fff; 
																				box-shadow:2px 5px 10px 0px rgba(0,0,0,0.35); -webkit-box-shadow:2px 5px 10px 0px rgba(0,0,0,0.35); -moz-box-shadow: 2px 5px 10px 0px rgba(0,0,0,0.35); }
.popup_box .popup_cont 														{ line-height:1.4rem; font-size:14px; word-break: break-word; overflow-y:auto; max-height: calc(100svh - 100px);}
.popup_box .popup_btn 														{ display:flex; flex-wrap:wrap; width:100%; height:3em;word-break:break-word; }
.popup_box .popup_btn>li													{ position:relative; width:calc(100% / 2) }
.popup_box .popup_btn .closePop 											{ position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:#fff; font-size:.987em; text-align:center; 
																				vertical-align:middle; text-decoration:none; background:var(--color-point);}
.popup_box .popup_btn .closePop:before										{ content:''; display:block; position:absolute; top:.8em; right:29px; width:1px; height:21px; background:#fff; -moz-transform:rotate(-45deg); -webkit-transform:rotate(-45deg);
    																			-ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg);}
.popup_box .popup_btn .closePop:after										{ content:''; display:block; position:absolute; top:.8em; right:29px; width:1px; height:21px; background:#fff; -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg);
   															 					-ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg);}
.popup_box .popup_btn>li input[type="checkbox"]								{ position:absolute; width:100%; height:100%; opacity:0; }
.popup_box .popup_btn>li .close_day											{ position:relative; width:100%; height:100%; cursor:pointer; color:#fff; display:flex; align-items:center; justify-content:center; font-size:.987em; }
.popup_box .popup_btn>li:has(.close_day) 									{ background:#222;}
.popup_box .popup_btn>li .closePop:focus									{ outline-offset:-2px; outline:2px dotted var(--color-white) !important}	
.popup_box .popup_btn > li:has(input[type="checkbox"]:focus) .close_day 	{ outline-offset:-2px; outline:2px dotted var(--color-white) !important;}
.popup_box .popup_btn > li:focus-within .close_day 							{ outline-offset:-2px; outline:2px dotted var(--color-white) !important; }
.popup_overlay																{ position:fixed;top:0px;right:0;left:0;bottom:0;z-index:1001;background:rgba(0,0,0,0.5); }
.popup_box .popup_btn>li .close_day::before									{ content:""; display:inline-block; width:25px; height:25px; overflow:hidden; background:url(/resource/common/images/common/icon_check.svg) no-repeat 50% 50% / auto 10px; 
																				opacity:.74; margin-right:5px; filter:invert(1);  }
.popup_box .popup_btn>li input[type="checkbox"]:checked + .close_day::before{ opacity:1; }
.popup_box .popup_btn>li input[type="checkbox"]:focus + .close_day::before	{ outline-offset:2px; outline:2px dotted #000 !important}



/* 슬라이드 */
.layer_popup_wrap																{ position:fixed; top:0; left:0; right:0; bottom:0; z-index:2000; color:#fff}
.layer_popup_cont 																{ position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:1000; max-height:calc(100svh - 5em); overflow:hidden }
.layer_popup_cont .tit 															{ font-size:1.563rem; font-weight:700; position:relative; display:inline-flex; padding-top:15px; line-height:1 }
.layer_popup_cont .tit:before 													{ content:''; position:absolute; top:8px; right:-10px; width:8px; height:8px; border-radius:100%; background-color:var(--color-point); }
.layer_popup_cont .layerPopSwiper												{ width:calc(100% + 30px); margin-left:-15px; margin-right:-15px; margin-top:15px; }
.layer_popup_cont .layerPopSwiper .swiper-slide									{ width:33.333%; }
.layer_popup_cont .layerPopSwiper .swiper-slide>a								{ display:flex; width:calc(100% - 30px); margin-left:15px; margin-right:15px; }
.layer_popup_cont .layerPopSwiper .swiper-slide .img							{ position:relative; width:100%; height:0; padding-top:100%; overflow-y:auto; overflow-x:hidden }
.layer_popup_cont .layerPopSwiper .swiper-slide .img::-webkit-scrollbar 		{ -webkit-appearance:none; width:4px;} 
.layer_popup_cont .layerPopSwiper .swiper-slide .img::-webkit-scrollbar-thumb 	{ background-color:var(--color-white); border-radius:5px; } 
.layer_popup_cont .layerPopSwiper .swiper-slide .img::-webkit-scrollbar-track 	{ border-radius:5px; background-color:rgba(255,255,255,.5); }
.layer_popup_cont .layerPopSwiper .swiper-slide .img img						{ position:absolute; top:0; left:50%; min-width:100%; min-height:100%; transform:translateX(-50%); -ms-transform:translateX(-50%);
   																	 				-webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); object-fit:cover; -o-object-fit:cover;}
.layer_popup_cont .swiper_bottom												{ position:absolute; right:0; top:0; display:flex; justify-content:center; align-items:center; gap:20px; }
.layer_popup_cont .swiper_bottom .control button								{ position:relative; width:30px; height:30px; display:flex; justify-content:center; align-items:center;}
.layer_popup_cont .swiper_bottom .control										{ display:flex; justify-content:center; align-items:center; height:40px; background:var(--color-point); border-radius:40px; padding:0 10px 0 20px; }
.layer_popup_cont .swiper_bottom  .swiper_prev::before,
.layer_popup_cont .swiper_bottom  .swiper_next::before							{ position:absolute; width:8px; height:8px; border-style:solid; background:none; border-width:2px 2px 0 0; border-color:#fff; transform:rotate(45deg); content:'';filter: inherit; }
.layer_popup_cont .swiper_bottom  .swiper_next::before							{ margin-left:-4px; }
.layer_popup_cont .swiper_bottom  .swiper_prev::before							{ border-width:0 0 2px 2px; margin-right:-2px }
.layer_popup_cont .swiper_bottom .swiper_page									{ width:auto; display:flex; justify-content:center; align-items:center; font-size:.9rem; margin:0; line-height:1; color:#fff; gap:7px; margin-right:10px;}
.layer_popup_cont .swiper_bottom .swiper-pagination-current						{ font-weight:bold; color:var(--color-white);}
.layer_popup_cont .swiper_bottom .swiper-pagination-total						{ font-weight:300; opacity:.9;color:var(--color-white);}
.layer_popup_cont .swiper_bottom .swiper_page i									{ position:relative; display:inline-block; width:4px; height:4px; background:rgba(255,255,255,.5); vertical-align:middle; border-radius:100%;  }
.layer_popup_cont .swiper_bottom .swiper_page i::after							{ display:none; }
.layer_popup_cont .swiper_bottom .swiper_auto::before							{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background-position:50% 50%; background-repeat:no-repeat; background-size:auto 10px; filter:invert(1); }
.layer_popup_cont .swiper_bottom .swiper_auto::before							{ background-image:url(/resource/common/images/bbs/icon_stop.svg); }
.layer_popup_cont .swiper_bottom .swiper_auto.paused::before					{ background-image:url(/resource/common/images/bbs/icon_play.svg); }
.layer_popup_cont .layer_popup_btn												{ display:flex; justify-content:center; align-items:center; gap:10px;}
.layer_popup_cont .layer_popup_btn>li											{ position:relative; display:flex; justify-content:center; align-items:center;}
.layer_popup_cont .layer_popup_btn>li input[type="checkbox"]					{ position:absolute; width:100%; height:100%; opacity:0; }
.layer_popup_cont .layer_popup_btn>li label										{ position:relative; padding-left:35px; cursor:pointer; font-size:.95rem; }
.layer_popup_cont .layer_popup_btn>li input 									{ position:absolute; width:1px; height:1px; opacity:0; }
.layer_popup_cont .layer_popup_btn>li label::after								{ position:absolute; width:22px; height:22px; border:1px solid var(--color-white); border-radius:100%; content:''; left:0; top:0; }
.layer_popup_cont .layer_popup_btn>li label::before 							{ content: ""; position:absolute; top:4px; left:8px; width:6px; height:10px; overflow:hidden; border-style:solid; border-width:0 2px 2px 0;
																					 border-color:var(--color-white); opacity:0; transform:rotate(45deg);}
.layer_popup_cont .layer_popup_btn>li input:checked + label::before 			{ opacity:1; }
.layer_popup_cont .layer_popup_btn .popup_close_button 							{ display:flex; position: relative; width:46px; height:46px; transition:all ease 0.3s }
.layer_popup_cont .layer_popup_btn .popup_close_button::before					{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:var(--color-point); opacity:.5; border-radius:100%; }
.layer_popup_cont .layer_popup_btn .popup_close_button::after					{ position:absolute; width:calc(100% - 16px); height:calc(100% - 16px); left:8px; top:8px; content:''; background:var(--color-point); border-radius:100%; }
.layer_popup_cont .layer_popup_btn .popup_close_button>em						{ position:relative; width:100%; height:100%; transition:all ease 0.3s }
.layer_popup_cont .layer_popup_btn .popup_close_button>em::before				{ position:absolute; width:2px; height:14px; left:50%; top:50%; background:var(--color-white); transform:translate(-50%,-50%) rotate(45deg); content:''; z-index:3}
.layer_popup_cont .layer_popup_btn .popup_close_button>em::after				{ position:absolute; width:2px; height:14px; left:50%; top:50%; background:var(--color-white); transform:translate(-50%,-50%) rotate(-45deg); content:''; z-index:3}
.layer_popup_cont .layer_popup_btn .popup_close_button:hover					{ transform:rotate(180deg); }	
.layer_popup_bg 																{ position:absolute; top:0; left:0; right:0; bottom:0; background:rgb(0, 0, 0, 0.9); }
@media all and (max-width:1368px){
	.layer_popup_cont .layerPopSwiper											{ width:calc(100% + 20px); margin-left:-10px; margin-right:-10px;  }
	.layer_popup_cont .layerPopSwiper .swiper-slide>a							{ width:calc(100% - 20px); margin-left:10px; margin-right:10px; }
}
@media all and (max-width:1024px){
	.layer_popup_cont .layerPopSwiper .swiper-slide								{ width:50%;  }
	.layer_popup_cont .swiper_bottom .control									{ height:36px; }
	.layer_popup_cont .layer_popup_btn .popup_close_button 						{ width:42px; height:42px; }
	.layer_popup_cont .layer_popup_btn>li label									{ padding-left:30px; font-size:.9rem; }
	.layer_popup_cont .tit														{ padding-top:10px; }
	.layer_popup_cont .tit:before												{ width:6px; height:6px; right:-8px; top:4px; }
}
@media all and (max-width:768px){
	.layer_popup_cont															{ padding-bottom:52px; }
	.layer_popup_cont .swiper_bottom											{ position:initial; }
	.layer_popup_cont .swiper_bottom .control									{ position:absolute; right:0; top:2px; }
	.layer_popup_cont .layer_popup_btn											{ position:absolute; width:max-content; left:50%; bottom:0; transform:translateX(-50%); }
	.layer_popup_cont .tit														{ padding-top:8px; }
	.layer_popup_cont .tit:before												{ width:6px; height:6px; right:-8px; top:0; }
}
@media all and (max-width:568px){
	.layer_popup_cont .layerPopSwiper .swiper-slide								{ width:100%;  }
}
@media all and (max-width:468px){
	.layer_popup_cont .tit 														{ font-size:1.363rem; }
	.layer_popup_cont .swiper_bottom .control									{ height:32px; padding:0 5px 0 15px }
	.layer_popup_cont .swiper_bottom .swiper_page								{ font-size:.85rem; margin-right:5px; }
	.layer_popup_cont .swiper_bottom .control button							{ width:25px; height:25px; }
	.layer_popup_cont .layerPopSwiper											{ margin-top:15px; }
} 
@media all and (max-width:320px){
	.layer_popup_cont .tit>span													{ display:none; }

}