@charset "utf-8";
/* CSS Document */

#container													{ position:relative;overflow:hidden;margin-top:151px;padding-bottom:9em; }
#content													{z-index:3;margin-top:clamp(2em, 2vw + 1em, 4em);}

@media all and (max-width:1568px){
    #container														{ margin-top:138px; padding-bottom:8em;}
}


@media all and (max-width:1268px){
    #container														{ margin-top:90px;padding-bottom:7em; }
}

@media all and (max-width:868px){
    #container														{ margin-top:80px;padding-bottom:6em;  }
}


@media all and (max-width:468px){
    #container														{ margin-top:60px; padding-bottom:5em;}
}

.conts_tab										{ display:none; }
.conts_tab.active								{ display:block; }

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

 								비주얼 

**********************************************************************/
.visual																				{ position:relative; width:100%; background:var(--color-white); }
.visual .con_inner																	{position:relative;padding: 3em 0 2em;border-bottom: 1px solid var(--color-base);}
.visual .text_wrap																	{display:flex; flex-flow:column; width:100%;justify-content:center; align-items:center;margin-top:0 !important;}
.visual .text_wrap .visual_title													{ position:relative; line-height:1; font-size:clamp(2em, 2vw + 1em, 2.81em);color:var(--color-base);font-weight:700; }

/* 위치 */
.visual .text_wrap .location														{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center;gap:3px 0; --sizeHig:clamp(30px, 2vw + 20px, 40px); margin-top:clamp(0.5em, 1vw + 0.2em, 0.95em);  margin-left: calc((var(--sizeHig) - 15px) / -2); }
.visual .text_wrap .location>li													{ position:relative; font-size:clamp(0.9em, 1vw + 0.4em, 0.98em); font-weight:300;color:var(--color-base);}
.visual .text_wrap .location [data-location="home"] a								{ display:flex; font-size:0px; width:var(--sizeHig); height:var(--sizeHig);}
.visual .text_wrap .location [data-location="home"] a::before						{ content:''; display:block; width:100%; height:100%; background:url(/resource/www/images/sub/icon_home.svg) no-repeat 50% 50%; background-size:auto 15px; }
.visual .text_wrap .location>li:nth-child(2)										{ margin-left:-3px; }
.visual .text_wrap .location>li+li													{ padding-left:15px; margin-left:9px; }
.visual .text_wrap .location>li+li::before											{ position:absolute; width:8px; height:1px; content:''; left:0; top:50%; background: rgba(0, 0, 0, .6); transform:translateY(-50%); }


/* 공유 */
.visual .page_util																	{ display:flex; justify-content:center; align-items:center; --sizeHig:clamp(30px, 2vw + 20px, 40px); gap:6px;padding-top: .375em;  }
.visual .page_util>li																{ position:relative; }
.visual .page_util>li>button														{ display:flex; width:var(--sizeHig); height:var(--sizeHig); border-radius:100%; }
.visual .page_util>li>button:before													{ content:''; flex:none; display:block; width:100%; height:100%; margin:0 auto; background-repeat:no-repeat; background-position:50% 50%;}
.visual .page_util>li .share_bt:before												{ background-image:url(/resource/www/images/sub/ico_share.svg); background-size:16px; margin-top:-.5px}
.visual .page_util>li>button.copy:before											{ background-image:url(/resource/www/images/sub/ico_copy_link.svg);}
.visual .page_util>li>button.print:before											{ background-image:url(/resource/www/images/sub/ico_print.svg); background-size:17px 16px;}
.visual .page_util>li>button.braille:before											{ background-image:url(/resource/www/images/sub/ico_bx_link.svg); background-size:19px 10px;}
.visual .page_util>li>button.braille_down:before									{ background-image:url(/resource/www/images/sub/ico_bx_down.svg); background-size:21px 13px; background-position:50% 55%}
.visual .page_util>li.share .share_drop												{ display:none; position:absolute; top:-1px; left:-3px; z-index:10; width:calc(var(--sizeHig) + 6px); box-sizing:border-box; background-color:var(--color-white);
    border:1px solid #e5e5e5;  text-align:center; z-index:1 ; border-radius:25px;}


.visual .page_util>li.share .share_drop ul											{ padding-top:10px; display:flex; flex-flow:column; gap:7px; }
.visual .page_util>li.share .share_drop ul > li a									{ display:flex; justify-content:center; align-items:center; width:100%; height:100%;}
.visual .page_util>li.share .share_drop ul > li[data-share] a:before				{ content:''; display:block; width:30px; height:30px; background-repeat:no-repeat; background-position:50% 50%; background-size:auto 100%; border-radius:100%; }
.visual .page_util>li.share .share_drop ul > li[data-share="blog"] a:before			{ background-image:url(/resource/www/images/sub/icon_blog.svg); background-color:#32b44a;}
.visual .page_util>li.share .share_drop ul > li[data-share="youtube"] a:before		{ background-image:url(/resource/www/images/sub/icon_youtube.svg); background-color:#e03232;}
.visual .page_util>li.share .share_drop ul > li[data-share="facebook"] a:before		{ background-image:url(/resource/www/images/sub/icon_facebook.svg); background-color:#385691;}
.visual .page_util>li.share .share_drop ul > li[data-share="instar"] a:before		{ background:url(/resource/www/images/sub/icon_instar.svg) no-repeat 50% 50% / cover, linear-gradient(to bottom right, #4a48e8 20% , #ee3183 60%, #f0c05c 100%);}
.visual .page_util>li.share .share_drop ul > li[data-share="kakao"] a:before		{ background-image:url(/resource/www/images/sub/icon_kakaoch.svg); background-color:#ffde00; }
.visual .page_util>li.share .share_drop ul > li[data-share="twitter"] a:before		{ background-image:url(/resource/www/images/sub/icon_twitter.png); background-color:#000;}
.visual .page_util>li.share .share_drop ul > li[data-share="band"] a:before			{ background-image:url(/resource/www/images/sub/icon_band.png); background-color:#50b748;}
.visual .page_util>li.share .share_drop ul > li[data-share="copy"] a:before			{ background-image:url(/resource/www/images/sub/icon_copy.svg); background-color:#555555;}
.visual .page_util>li.share .share_close											{ position:relative; width:30px; height:30px; margin-top:10px; margin-bottom:5px; background:#e5e5e5; border-radius:100%;}
.visual .page_util>li.share .share_close::before									{ position:absolute; width:1px; height:11px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(45deg); content:''; background:var(--color-base); }
.visual .page_util>li.share .share_close::after										{ position:absolute; width:1px; height:11px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-45deg); content:''; background:var(--color-base);}
.visual .page_util>li.share .share_close:hover										{ transform:rotate(90deg); }


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

 								location 

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

/* 위치 */
.location_wrap																	{ width:100%; border-style:solid; border-width:1px 0 1px 0; border-color:#e5e5e5; }
.location_wrap .con_inner														{ display:flex; align-items:center; justify-content:space-between; --sizeHig:53px; height:var(--sizeHig) }
.location_wrap .lco																{ display:flex; align-items:center; border-left:1px solid #e5e5e5 }
.location_wrap .lco>li															{ position:relative; min-width:200px;border-right:1px solid #e5e5e5; padding:0 20px }
.location_wrap .lco [data-location="home"] a									{ display:flex; font-size:0px; width:var(--sizeHig); height:var(--sizeHig); opacity:.7 }
.location_wrap .lco [data-location="home"] a::before							{ content:''; display:block; width:100%; height:100%; background:url(/resource/www/images/sub/icon_home.svg) no-repeat 50% 50%; background-size:auto 14.5px; opacity:1; }
.location_wrap .lco>li>button													{ display:flex; height:var(--sizeHig); align-items:center; padding-right:3.75em; opacity:.7; }
.location_wrap .lco>li:last-child>button										{opacity:1;}
.location_wrap .lco>li>button::before											{ position:absolute; right:0; top:50%; width:7px; height:7px; border-style:solid; border-width:0 1px 1px 0; border-color:#575757; transform:translateY(-80%) rotate(45deg); transition:var(--trans-ani); content:''; vertical-align:middle;  top:50%; right:30px; }
.location_wrap .lco>li.active>button::before									{ transform:translateY(-40%) rotate(225deg); }
.location_wrap .lco>li:not(:has(button))										{ padding:0;min-width:auto; }
.location_wrap .lco>li .loc_wrap												{ position:absolute; display:none; left:-1px; z-index:112; width:calc(100% + 2px); padding:1.25em; background:var(--color-white); border:1px solid #e5e5e5; border-radius:0 0 10px 10px }
.location_wrap .lco>li .loc_wrap li > a											{ display:inline-flex; justify-content:flex-start; align-items:center; padding:5px 0px; color:var(--color-base); transition:var(--trans-ani); opacity:.64; line-height:1.2; word-break: break-all; }
.location_wrap .lco>li .loc_wrap li a[target='_blank']::after					{ content:""; display:inline-block; opacity:.8; transition:all .4s; margin-left:7px; vertical-align:middle; width:11px; height:10px; background:url(/resource/www/images/common/icon_blank.svg) no-repeat 50% 50% / auto 10px; }
.location_wrap .lco>li .loc_wrap li > a:hover,
.location_wrap .lco>li .loc_wrap li > a:focus									{ opacity:1; color:var(--color-point);}


@media all and (max-width:1468px) {
    .visual .con_inner															{padding:2.5em 0 1.5em;}
}

@media all and (max-width:1268px) {
  	.visual .con_inner															{padding:2em 0 1.25em;}
}


@media all and (max-width:768px) {
    .visual > .con_inner														{padding:1.5em 0 1em;}
    .visual .page_util>li .share_bt:before,
    .visual .page_util>li>button.print:before									{ background-size:auto 14px; }
    .visual .page_util>li>button.braille:before									{ background-size:auto 9px; }
    .visual .page_util>li>button.braille_down:before							{ background-size:auto 12px; }
}

@media all and (max-width:368px) {
    .visual .text_wrap .location>li+li													{padding-left: 11px;margin-left: 5px;}
}



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

 								내용 

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

/* 타이틀 */
h3.h3_title														{ position:relative; font-size:clamp(1.9em, 1vw + 1.5em, 2.38em); line-height:1; padding-top:clamp(1.5em, 1vw + 1.5em, 2.11em); text-align:center; font-weight:700;  }
h4.h4_title														{ position:relative; font-size:clamp(1.6em, 1vw + 1.3em, 2em); margin-bottom:.5em; margin-top:clamp(1.5em, 1vw + 1.3em, 2.19em)}
h4.h4_title::after												{ display:inline-block; margin-left:10px; width:clamp(2.5em, 1vw + 1.3em, 4.69em); height:1px; background:#000; content:''; }



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

 								lnb

**********************************************************************/
.menu											{margin-bottom:2em;}
.lnb_wrap										{ position:relative; display:flex; justify-content:center;margin-top:2em; overflow-y:hidden }
.lnb_wrap .list									{ display:flex;gap:0 .5em; }
.lnb_wrap .list>li								{flex:1 1 auto;}
.lnb_wrap .list>li>a							{ position:relative; display:flex; align-items:center; justify-content:center;min-width:128px;border: 1px solid #e5e5e5;padding:.75em 1.875em; color:#555;font-size:1.125em; font-weight:500; transition:var(--trans-ani); }
.lnb_wrap .list>li.active>a,
.lnb_wrap .list>li>a:hover,
.lnb_wrap .list>li>a:focus						{ color:var(--color-white);background:var(--color-base);font-weight:700;}


@media all and (max-width:1468px){
  	.menu										{margin-bottom:1.875em;}
    .lnb_wrap									{margin-top:1.875em;}
}
@media all and (max-width:1068px){
    .lnb_wrap .list>li>a						{ padding: .75em 1.625em; }
}

@media all and (max-width:668px){
  	.menu										{margin-bottom:1.5em;}
    .lnb_wrap									{ --sizeHig:50px;margin-top:1.5em;}
    .lnb_wrap .list>li>a						{ height:var(--sizeHig); padding:0 1.5em;min-width:auto;font-size:1.063em; }
}

@media all and (max-width:468px){
    .lnb_wrap									{ --sizeHig:45px;display:block; }
    .lnb_wrap .list								{gap:.25em;flex-wrap:wrap;}
    .lnb_wrap .list>li>a						{ padding:0 1.25em; font-size:1em; }
}

@media all and (max-width:368px){
    .lnb_wrap .list>li>a						{ padding:0 1em;}
}




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

 								snb

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

.snb_wrap,
.control_tab										{ position:relative; display:flex;justify-content: center;border-bottom:1px solid #e5e5e5;overflow-y:hidden;margin-top:2em;}
.snb_wrap .list,
.control_tab .list									{ display:flex; gap:0 1em; }
.snb_wrap .list>li,
.control_tab .list>li									{position:relative;flex:1 1 auto;}
.snb_wrap .list>li>a,
.control_tab .list>li>button							{ position:relative; display:flex; align-items:center; justify-content:center;background:#fff;padding:.75em 1.1em; color:#585858;font-size:1.125em; font-weight:600; transition:var(--trans-ani); }
.snb_wrap .list>li>a::before,
.control_tab .list>li>button::before					{ position:absolute; width:0; height:3px; background:var(--color-base); content:''; left:50%; bottom:0; transition:var(--trans-ani); transform:translateX(-50%)}
.snb_wrap .list>li.active>a,
.snb_wrap .list>li>a:hover,
.snb_wrap .list>li>a:focus,
.control_tab .list>li>button.active,
.control_tab .list>li>button:hover,
.control_tab .list>li>button:focus						{ color:var(--color-base);font-weight:700; }
.snb_wrap .list>li.active>a::before,
.snb_wrap .list>li>a:hover::before,
.snb_wrap .list>li>a:focus::before,
.control_tab .list>li>button.active::before,
.control_tab .list>li>button:hover::before,
.control_tab .list>li>button:focus::before			{width:100%;}

@media all and (max-width:1468px){
  .snb_wrap,
  .control_tab									{ margin-top:1.875em;}
}

@media all and (max-width:1068px){
    .snb_wrap .list>li>a,
	.control_tab .list>li>button						{ padding: .75em .88em; }
}

@media all and (max-width:668px){
    .snb_wrap,
	.control_tab									{ --sizeHig:50px; margin-top:1.5em;}
    .snb_wrap .list>li>a,
	.control_tab .list>li>button						{ height:var(--sizeHig); padding:0 .75em;min-width:max-content;font-size:1.063em; }

}

@media all and (max-width:468px){
    .snb_wrap,
	.control_tab									{ width:100%; height:var(--sizeHig); overflow-x:scroll; --sizeHig:40px;}
    .snb_wrap::-webkit-scrollbar,
	.control_tab::-webkit-scrollbar				{ display:none }
    .snb_wrap .list,
	.control_tab .list									{ position:absolute; top:0; left:0;overflow-x:scroll; display:flex; gap: 0 .25em; }
    .snb_wrap .list::-webkit-scrollbar,
	.control_tab .list::-webkit-scrollbar 			{ display:none }
    .snb_wrap .list>li>a,
	.control_tab .list>li>button						{ height:var(--sizeHig); font-size:1em; }

}


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

 								공통 

**********************************************************************/
[data-subarea]													{overflow:hidden;}
.mt10															{ margin-top:10px !important;}
.mt0															{ margin-top:0 !important;}