@charset "UTF-8";
/*───────────────────────────────────────────────────────────

	header, footer, main 관련 작성 css 파일입니다.

	** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다.

───────────────────────────────────────────────────────────*/
/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
/** PC 일반 **/
#topBtn { position: fixed; right: clamp(10px, 4vw, 30px); bottom: 70px; z-index: 50; text-indent: -9999px; width: clamp(40px, 5vw, 60px); height: clamp(40px, 5vw, 60px); border-radius: 100px; padding: 10px; box-sizing: border-box; background: url() no-repeat center center/auto; background-color: var(--point-color02); background-image: url("../images/skin/arrow_top.svg"); transition: transform 300ms ease-in-out, opacity 300ms ease-in-out; opacity: 0; transform: translateX(100%); }
#topBtn.show { opacity: 1; transform: translateX(0); }
#wrap { position: relative; height: 100%; width: 100%; margin: 0; padding: 0; overflow: hidden; }
/* #header 와 #container, #footer 전체 감싸는 영역 */
#wrap #header { width: 100%; margin: 0; padding: 30px 0; overflow: visible; transition: background 300ms ease-in, border 300ms ease-in; }
#wrap #container { width: 100%; margin: 0; padding: 0; }
#wrap #footer { width: 100%; margin: 0; }
/* #container 안의 레이아웃 */
#contents_wrap, .w_custom { position: relative; width: calc(100% - 60px); max-width: 1400px; margin: 0 auto; box-sizing: border-box; }
#contents_wrap:has(.main_visual) { width: 100%; max-width: 100%; padding: 0; }
@media screen and (max-width:860px) {
	#contents_wrap, .w_custom { width: calc(100% - 30px); }
}
@media screen and (max-width:320px) {
	#contents_wrap, .w_custom { width: calc(100% - 20px); }
}
/*───────────────────────────────────────────────────────────

HEADER | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
/** PC 일반 **/
.skip_nav { position: relative; z-index: 9999; }
.skip_nav a { display: block; height: 1px; width: 1px; margin-bottom: -1px; overflow: hidden; font-size: 12px; color: #fff; font-weight: bold; white-space: nowrap; text-align: center; }
.skip_nav a:focus, .skip_nav a:active { height: auto; width: 100%; padding: 0; margin-bottom: 0; position: absolute; left: 0; top: 0; }
#header { left: 0; top: 0; height: 100px; border: 0; text-align: center; z-index: 10; width: 100%; box-sizing: border-box; font-size: 0; border-bottom: 0px; background: transparent; position: fixed; }
#header .hd_logo { z-index: 15; width:235px; height: 40px; display: flex; align-items: center; line-height: 80%; font-size: var(--title-40); color: #fff; display: flex; align-items: center; gap: 10px; }
#header .hd_logo a { color: #fff; width:100%;height:100%; text-indent: -9999px; transition: all 300ms ease-in; background: url('../images/skin/hd_logo.png')no-repeat left center;background-size:auto 100% !important;}
#header .hd_logo::before { content: none; }
#header .w_set { width: 100%; box-sizing: border-box; max-width: 1180px; padding: 0; margin: 0 auto; }
#header .w_set2 { position: relative; }
#header .hd_right { width: 20px; height: 20px; flex-shrink: 0; }
#header .hd_right .menu-trigger { display: block; width: 20px; height: 20px; background: url("../images/skin/he_right.svg") no-repeat center center/contain; filter: invert(1); }
#header .hd_right .hd_gnb, #header .hd_right .hd_lang, #header .hd_right .menu-trigger { display: inline-block; vertical-align: middle; }
#header .hd_right .hd_lang { margin-right: 30px; }
#header .hd_right .hd_lang li, #header .hd_right .hd_lang li a { line-height: 1; padding: 0; font-size: 14px; font-weight: 400; color: #888; vertical-align: top; text-align: center; display: inline-block; box-sizing: border-box; }
#header .hd_right .hd_lang li + li a { padding: 0 0 0 30px; }
#header .hd_right .hd_gnb li, #header .hd_right .hd_gnb li a { line-height: 1; padding: 0; font-size: 14px; font-weight: 400; color: #888; vertical-align: top; text-align: center; display: inline-block; box-sizing: border-box; }
#header .hd_right .hd_gnb li + li a { padding: 0 0 0 30px; }
#header .hd_lnb { line-height: 33px; margin: 0; padding: 0; font-size: 0; width: 100%; display: block; vertical-align: top; text-align: center; display: inline-block; box-sizing: border-box; z-index: 10; }
#header .hd_lnb li { padding: 0 41px; position: relative; }
#header .hd_lnb li, #header .hd_lnb li a { padding: 0; line-height: 2; font-size: 16px; font-weight: 400; color: #222; vertical-align: middle; text-align: center; display: inline-block; box-sizing: border-box; transition: all 0.2s; }
#header .hd_lnb li a { padding: 0; position: relative; z-index: 1; }
#header .hd_lnb li a:after { content: ""; display: block; clear: both; transition: 0.5s; width: 0; height: 2px; background: #222; position: absolute; left: 0; bottom: 50%; margin-top: 0; content: ""; display: inline-block; }
#header .hd_lnb li a:hover:after { width: 100%; }
#header .hd_lnb li a.on:after { width: 100%; }
#header .hd_lnb li .lnb_dep2 { z-index: 55; display: none; position: absolute; left: 0; top: 100%; }
#header .header_cont { display: flex; width: 100%; height: 100%; max-width: 1760px; box-sizing: border-box; padding: 0 40px; margin: 0 auto; justify-content: space-between; align-items: center; transition: width 300ms; }
#header.on { background: #fff; border-bottom: 1px solid var(--border-color01); }
#header.on .hd_logo a {background: url('../images/skin/hd_logo_ov.png')no-repeat left center;}
#header.on .hd_right .menu-trigger { filter: invert(1); }
#header .hd_right { width: 20px; height: 20px; flex-shrink: 0; }
#header .hd_right .menu-trigger { display: block; width: 20px; height: 20px; background: url("../images/skin/he_right.svg") no-repeat center center/contain; filter: unset; }
#header .hd_right .hd_gnb, .main_index #header .hd_right .hd_lang, .main_index #header .hd_right .menu-trigger { display: inline-block; vertical-align: middle; }
#header .hd_right .hd_lang { margin-right: 30px; }
#header .hd_right .hd_lang li, .main_index #header .hd_right .hd_lang li a { line-height: 1; padding: 0; font-size: 14px; font-weight: 400; color: #888; vertical-align: top; text-align: center; display: inline-block; box-sizing: border-box; }
#header .hd_right .hd_lang li + li a { padding: 0 0 0 30px; }
#header .hd_right .hd_gnb li, .main_index #header .hd_right .hd_gnb li a { line-height: 1; padding: 0; font-size: 14px; font-weight: 400; color: #888; vertical-align: top; text-align: center; display: inline-block; box-sizing: border-box; }
#header .hd_right .hd_gnb li + li a { padding: 0 0 0 30px; }


@media only screen and (min-width:1024px) {
	#wrap #header:hover, #wrap #header:focus, #wrap #header.on { background: #fff; border-bottom: 1px solid var(--border-color01); }
	#wrap #header:hover .hd_right .menu-trigger, #wrap #header:focus .hd_right .menu-trigger, #wrap #header.on .hd_right .menu-trigger { filter: invert(1); }
	#header:hover, .main_index #header:focus { background: #fff; border-bottom: 1px solid var(--border-color01); }
	#header:hover .hd_logo a, .main_index #header:focus .hd_logo a { background: url('../images/skin/hd_logo_ov.png')no-repeat left center;}
	#header:hover .hd_right .menu-trigger, .main_index #header:focus .hd_right .menu-trigger { filter: invert(1); }
}
.main_index #header .hd_lnb li a { color: #fff; }
.main_index #header .hd_right .hd_lnb li, .main_index #header .hd_right .hd_lnb li a { transition: 0.3s; color: #fff; }
.main_index #header .hd_right .hd_lnb li a:after { background: #fff; }
.main_index #header .hd_right .hd_lang li a { color: #fff; }
.main_index #header .hd_right .hd_gnb li a { color: #fff; }
.main_index #header .hd_right .hd_lnb li a:after { background: #fff; }
.main_index #header .hd_right .menu-trigger span { background: #fff; }

#header .gnb{position: absolute; top:0; left:50%; transform: translateX(-50%); height: 100%; font-size: var(--title-20); display: flex; justify-content: center; text-align: center;}
#header .gnb > li{position: relative; font-size: 90%; height: 100%; }
#header .gnb > li > a{display: flex;height: 100%;align-items: center;padding: 0 clamp(20px, 2vw, 40px);font-weight: 500;color: var(--black-color00);line-height: 1.4;box-sizing: border-box; filter: var(--filter-white); transition: all 0.4s;}
    #header.on .gnb > li > a{filter: none;}
#header .gnb .sub_dep{position: absolute;top: 100%;left:50%;transform: translateX(-50%);width: max-content;min-width: 140px;background: var(--point-white);padding:10px 0;box-sizing: border-box;border: 1px solid var(--border-color01);opacity: 0;pointer-events:  none;transition: all 0.4s;}
#header .gnb .sub_dep > li{font-size: 90%;}
#header .gnb .sub_dep > li > a{display: block;font-weight: 400;color: var(--black-color06);padding: 7px 25px;box-sizing: border-box;}
@media only screen and (min-width:1024px) {
    #header:hover .gnb > li > a{filter: none;}
	#header .gnb > li:hover .sub_dep{opacity: 1; pointer-events: all;}
}
@media only screen and (max-width:1217px) {
	#header .hd_lnb li { padding: 0 30px; left: 3%; position: relative; }
}
@media only screen and (max-width:1024px) {
	#header { height: 75px; }
    #header .gnb{display: none;}
	#header .hd_logo { left: 19px; }
	#header .hd_lnb, #header .hd_right .hd_gnb { display: none; }
	#header .hd_right { right: 19px; }
    
}
@media only screen and (max-width:780px) {
	#header .hd_logo { width: 180px; height: 30px; }
	#header .header_cont { padding: 0 15px; }
}
@media only screen and (max-width:640px) {
	#header { height: 57px; }
	#header .hd_logo { left: 15px; width: 150px; height: 25px; }
	#header .hd_right { right: 15px; }
}
@media only screen and (max-width:320px) {
	#header .hd_logo { left: 10px; }
	#header .hd_right { right: 10px; }
	#header .header_cont { padding: 0 10px; }
}
/*───────────────────────────────────────────────────────────

ASIDE | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
/* PC 일반 */
.aside_bg { width: 20.5%; height: 100%; position: fixed; top: 0; left: -35%; opacity: 0;; /*background: url("../images/skin/okdang_pr_img.png") no-repeat center top*/ background: var(--black-color01);; background-size: cover; z-index: 99; display: flex; align-items: flex-end; padding: 0 0 100px 60px; box-sizing: border-box; }
.aside_bg.on { left: 0%; opacity: 1; }
#aside { top: 0px; right: -79.6%; width: 79.6%; height: 100%; box-sizing: border-box; box-sizing: border-box; position: fixed; background: var(--black-color01); z-index: 99; opacity: 0; }
#aside.on { right: 0%; opacity: 1; }
#aside .aside_logo { z-index: 15; width: 235px; height: 40px; display: flex; align-items: center; font-size:0;display: none; }
#aside .aside_logo::before {content: "";display: none;width: 24px;height: 28px;background: url("../images/skin/logo_symbol.svg") no-repeat center center/contain;flex-shrink: 0;}
#aside .aside_logo a { color: #fff; width:100%; height: 100%; background: url('../images/skin/hd_logo.png')no-repeat left center;background-size:auto 100%;}
@media (width <= 780px) {
	#aside .aside_logo{ width: 180px; height: 30px; }
}
#aside .aside_box {width: 100%;height: 100%;margin: 0;overflow: hidden;position: relative;z-index: 1;box-sizing: border-box;display: block;font-size: 0;padding: 40px 60px 0 60px;border-left: 1px solid var(--black-color02);}
#aside .aside_box .aside_container { width: 100%; height: 100%; position: relative; font-size: 0; }
#aside .aside_right { display: flex; align-items: center; justify-content: flex-end; }
#aside .btn_cate { display: inline-block; box-sizing: border-box; vertical-align: top; width: 40px; height: 40px; position: relative; }
#aside .btn_cate a { display: block; width: 100%; height: 100%; position: relative; }
#aside .btn_cate a span { display: inline-block; width: 100%; height: 2px; background: #fff; position: absolute; top: 50%; left: 0; }
#aside .btn_cate a span:nth-child(1) { transform: rotate(-45deg); }
#aside .btn_cate a span:nth-child(2) { transform: rotate(45deg); }
#aside .slide_container { max-height: calc(100% - 140px); display: block; box-sizing: border-box; vertical-align: top; margin-top: 50px; overflow-y: auto; padding-left: 60px; margin-right: 60px; }
#aside .slide_container::-webkit-scrollbar { background: var(--point-color01); width: 4px; }
#aside .slide_container::-webkit-scrollbar-thumb { width: 4px; border-radius: 2px; background: var(--point-white); box-sizing: border-box; }
#aside .slide_container > ul > li { display: flex; box-sizing: border-box; align-items: flex-start; flex-wrap: wrap; padding-bottom: 20px; padding: 20px; }
/* #aside .slide_container > ul > li + li { border-top: 1px solid rgba(217, 217, 217, 0.2); padding: 40px 0; } */
/* #aside .slide_container > ul > li:has(.sub_dep) { padding-bottom: 0; } */
#aside .slide_container > ul > li.title p { width: 180px; font-size: 55px; color: var(--point-white); font-weight: 500; }
#aside .slide_container>ul>li.title p>span { display: block; font-size: var(--title-17); font-family: "Montserrat", sans-serif; font-weight: 400; letter-spacing: 1.6px; padding-top: 10px; opacity: 0.3; }
#aside .slide_container > ul > li .sub_dep { width: calc(100% - 180px); box-sizing: border-box; padding: 0 30px 0 40px; display: flex; flex-wrap: wrap; padding-top: 23px; }
#aside .slide_container > ul > li .sub_dep > li { margin: 0 20px 20px; margin: 0 20px; }
#aside .slide_container > ul > li .sub_dep > li > a { font-size: var(--title-18); color: var(--point-white); font-weight: 300; flex-shrink: 0; position: relative; }
#aside .slide_container > ul > li .sub_dep > li.group_tit { width: fit-content; display: flex; gap: 15px 40px; align-items: center; }
#aside .slide_container > ul > li .sub_dep > li.group_tit > ul { display: flex; gap: 10px 25px; flex-wrap: wrap; box-sizing: border-box; align-items: center; }
#aside .slide_container > ul > li .sub_dep > li.group_tit > ul li { margin: 0; }
#aside .slide_container > ul > li .sub_dep > li.group_tit > ul li a { font-size: 20px; color: rgba(255, 255, 255, 0.6); font-weight: 300; position: relative; }
#aside .aside_footer {position: absolute;color: #ffffff70;left: 0;bottom: 0;width: 100%;height: 15vw;pointer-events: none;}
#aside .aside_footer .aside_ft_logo { position: absolute; bottom: -32px; right: 1vw; width: 91%; height:100%; opacity: 0.05;background:url('../images/skin/aside_logo.png')no-repeat right center;background-size:100% auto;}

#aside .aside_footer p { font-size: 15px; font-weight: 400; line-height: 100%; color: #ffffff70; position: absolute; top: 50%; left: 136px; }
@media only screen and (max-width:1500px) {
	.aside_bg { padding: 0 0 60px 30px; }
	.aside_bg .aside_logo { padding: 37px 0 0 30px; }
	#aside .aside_box { padding: 40px 30px 0 30px; }
	#aside .slide_container { padding-left: 30px; margin-right: 30px; }
	#aside .slide_container > ul > li.title p { width: 170px; }
	#aside .slide_container > ul > li .sub_dep { width: calc(100% - 170px); gap: 10px 0; }
}
@media only screen and (max-width:1200px) {
	.aside_bg .aside_cs dl dt { width: 68px; font-size: 18px; }
	.aside_bg .aside_cs dl dd { font-size: 22px; margin-left: 20px; }
	#aside .aside_logo { display: flex; margin-right: auto; }
	#aside .aside_box { padding: 32px 30px 0 30px; }
	#aside .btn_cate { width: 32px; height: 32px; }
	#aside .slide_container ul > li.title { width: 100%; }
	#aside .slide_container ul > li.title p { font-size: 24px; margin-bottom: 30px; }
	#aside .slide_container ul > li .sub_dep { padding-left: 0; width: calc(100% + 20px); margin-left: -10px; }
	#aside .slide_container ul > li .sub_dep > li { margin: 0 10px 30px; }
	#aside .slide_container ul > li .sub_dep > li > a { font-size: 20px; }
	#aside .slide_container ul > li .sub_dep > li.group_tit > ul li a { font-size: 16px; }
}
@media only screen and (min-width:1024px) {
	#aside .slide_container > ul > li .sub_dep > li:hover > a:before, #aside .slide_container > ul > li .sub_dep > li.group_tit > ul li:hover > a:before { position: absolute; content: ""; width: 100%; height: 1px; bottom: -1px; background: var(--point-white); }
	#aside .slide_container > ul > li .sub_dep > li.group_tit > ul li a:hover { color: var(--point-white); }
}
@media only screen and (max-width:1024px) {
    #aside .aside_footer p { width: 100%; left: 0; text-align: center; }
	#aside .slide_container > ul > li.title { width: 100%; }
	#aside .slide_container > ul > li.title p { margin-bottom: 20px; }
	#aside .slide_container > ul > li .sub_dep { width: 100%; padding: 0; }
	#aside .slide_container > ul > li .sub_dep > li.group_tit { gap: 15px 35px; }
	#aside .aside_footer .aside_ft_logo{bottom:-16px;}
}
@media only screen and (max-width:860px) {
	.aside_bg .aside_logo img { height: 30px; }
	#aside .slide_container {padding-left: 0;margin-right: 0;margin-top: 40px;padding-bottom: 60px;}
}
@media only screen and (max-width:640px) {
	.aside_bg.on { display: none; }
    
	#aside { top: 0; width: 100%; right: -100%; }
	#aside .aside_box { padding: 30px 15px; }
	#aside .aside_hd { display: flex; align-items: center; justify-content: space-between; }
	#aside .slide_container { max-height: calc(100% - 180px);padding-bottom:0;}
	#aside .slide_container > ul { padding-bottom: 60px; }
	#aside .slide_container > ul > li + li { padding-top: 25px; margin-top: 15px; }
	#aside .slide_container > ul > li.title p { font-size: 25px; margin-bottom: 15px; color: var(--point-white); }
	#aside .slide_container > ul > li .sub_dep { width: calc(100% - 8px); margin-left: 0; gap: 0 20px; }
	#aside .slide_container > ul > li .sub_dep > li { width: 100%; margin: 0 0 15px 0; }
	#aside .slide_container > ul > li .sub_dep > li > a { font-size: 18px; font-weight: 400; }
	#aside .slide_container > ul > li .sub_dep > li.group_tit { gap: 15px 30px; margin-bottom: 15px; }
	#aside .slide_container > ul > li .sub_dep > li.group_tit > ul { gap: 10px 20px; }
	#aside .slide_container > ul > li .sub_dep > li.group_tit > ul li a { color: #ccc; }
    #aside .aside_footer .aside_ft_logo { right: unset; left: 50%; transform: translateX(-50%); background-size: contain; background-position: center; bottom:0;}
    #aside .aside_footer p { width: 80%; left: 10%; line-height: 1.3; top: -40px;  }
}
@media only screen and (max-width:479px) {
	#aside .aside_box { padding: 20px 15px; }
	#aside .aside_logo img { height: 38px; }
	#aside .btn_cate { width: 25px; height: 25px; }
	#aside .slide_container > ul > li.title p { font-size: 18px; }
	#aside .slide_container > ul > li .sub_dep > li > a { font-size: 16px; }
	#aside .slide_container > ul > li .sub_dep > li.group_tit > ul { gap: 10px 15px; }
	#aside .slide_container > ul > li .sub_dep > li.group_tit > ul li a { font-size: 14px; }
	#aside .slide_container > ul > li .sub_dep > li.group_tit { gap: 15px 25px; }
}
/*───────────────────────────────────────────────────────────

FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
/* PC 일반 */
#wrap #footer { margin-top: clamp(70px, 20vw, 140px); background-color: var(--black-color00); }
#footer { padding: 67px 0 25px 0; }
#footer .ft_inner { position: relative; margin: 0 auto; overflow: hidden; font-size: 0; max-width: 1760px; width: 100%; box-sizing: border-box; padding: 0 clamp(20px, 6vw, 40px); }
#footer .ft_inner .ft_area { display: flex; gap: 265px; }
#footer .ft_inner .ft_area .ft_okdang { flex-shrink: 0; min-width: 650px; }
#footer .ft_inner .ft_area .ft_okdang .ft_top { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--title-70); }
#footer .ft_inner .ft_area .ft_okdang .ft_top .ft_logo { z-index: 15; width: 240px; height: 40px; display: flex; align-items: center; line-height: 80%;font-size:0;}
#footer .ft_inner .ft_area .ft_okdang .ft_top .ft_logo::before { content: ""; display: none; width: 24px; height: 28px; background: url("../images/skin/logo_symbol.svg") no-repeat center center/contain; flex-shrink: 0;}
#footer .ft_inner .ft_area .ft_okdang .ft_top .ft_logo a { color: #fff; width:100%;height:100%; background: url('../images/skin/hd_logo.png')no-repeat left center;background-size:auto 100%;}
@media (width <= 780px) {
	#footer .ft_inner .ft_area .ft_okdang .ft_top .ft_logo{ width: 180px; height: 30px; }
}
#footer .ft_inner .ft_area .ft_okdang .ft_top ul { display: flex; align-items: center; gap: 37px; }
#footer .ft_inner .ft_area .ft_okdang .ft_top ul a { font-size: var(--title-14); color: #fff; font-weight: 200; line-height: 142.857%; }
#footer .ft_inner .ft_area .ft_okdang .ft_bot address { margin-top: var(--title-40); }
#footer .ft_inner .ft_area .ft_okdang .ft_bot address p { display: flex; gap: 38px; }
#footer .ft_inner .ft_area .ft_okdang .ft_bot address p span, #footer .ft_inner .ft_area .ft_okdang .ft_bot address p b, #footer .ft_inner .ft_area .ft_okdang .ft_bot address p a { font-weight: 200; font-size: 15px; color: rgba(255, 255, 255, 0.5019607843); line-height: 200%; letter-spacing: normal; }
#footer .ft_inner .ft_area .ft_nav { width: 100%; }
#footer .ft_inner .ft_area .ft_nav ul.ft_lnb { display: flex; gap: clamp(50px, 20vw, 100px); }
#footer .ft_inner .ft_area .ft_nav ul.ft_lnb .menu { font-size: var(--title-18); color: #fff; font-weight: 400; letter-spacing: -0.36px; margin-bottom: 19px; display: block; }
#footer .ft_inner .ft_area .ft_nav ul.ft_lnb .depth a { color: rgba(255, 255, 255, 0.5019607843); line-height: 214.286%; font-weight: 200; font-size: var(--title-14); letter-spacing: -0.28px; }
#footer .ft_inner .copyright { margin-top: 58px; padding-top: 31px; border-top: 1px solid rgba(255, 255, 255, 0.2); letter-spacing: normal; display: flex; align-items: center; flex-wrap: wrap; gap: 2vw 30px; }
#footer .ft_inner .copyright, #footer .ft_inner .copyright span, #footer .ft_inner .copyright a { line-height: 100%; font-size: 15px; font-weight: 200; color: rgba(255, 255, 255, 0.5019607843); }
@media (width <= 1500px) {
	#footer .ft_inner .ft_area { justify-content: space-between; gap: 2vw; }
	#footer .ft_inner .ft_area .ft_nav { width: 100%; max-width: 200px; }
	#footer .ft_inner .ft_area .ft_nav ul.ft_lnb { flex-direction: column; gap: 2vw; width: 100%; }
	#footer .ft_inner .ft_area .ft_nav ul.ft_lnb .depth { display: none; }
	#footer .ft_inner .ft_area .ft_nav ul.ft_lnb .menu { position: relative; }
	#footer .ft_inner .ft_area .ft_nav ul.ft_lnb .menu::after, #footer .ft_inner .ft_area .ft_nav ul.ft_lnb .menu::before { content: ""; background: #777; position: absolute; height: 2px; top: 50%; right: -24px; }
	#footer .ft_inner .ft_area .ft_nav ul.ft_lnb .menu::before { rotate: 45deg; width: 7px; transform-origin: right; top: calc(50% + 1px); }
	#footer .ft_inner .ft_area .ft_nav ul.ft_lnb .menu::after { width: 15px; }
}
@media (width <= 860px) {
	#footer { padding: 9vw 0 6vw 0; }
	#footer .ft_inner .ft_area .ft_nav { display: none; }
	#footer .ft_inner .ft_area .ft_okdang { min-width: unset; flex-shrink: unset; }
	#footer .ft_inner .ft_area .ft_okdang .ft_top { gap: 20px; justify-content: space-between; }
	#footer .ft_inner .ft_area .ft_okdang .ft_top ul a { font-size: 13px; }
	#footer .ft_inner .ft_area .ft_okdang .ft_bot address { display: flex; flex-wrap: wrap; gap: 2vw; }
	#footer .ft_inner .ft_area .ft_okdang .ft_bot address p { flex-wrap: wrap; gap: 2vw 4vw; }
	#footer .ft_inner .ft_area .ft_okdang .ft_bot address p span, #footer .ft_inner .ft_area .ft_okdang .ft_bot address p b, #footer .ft_inner .ft_area .ft_okdang .ft_bot address p a { font-size: 13px; line-height: 130%; }
	#footer .ft_inner .copyright { margin-top: 9vw; padding-top: 4vw; }
	#footer .ft_inner .copyright, #footer .ft_inner .copyright span, #footer .ft_inner .copyright a { font-size: 13px; }
}
@media only screen and (max-width:860px) {
	#footer .ft_inner .info { margin-left: 5%; }
}
@media only screen and (max-width:640px) {
	#footer .ft_inner .logo, #footer .ft_inner .info { display: block; }
	#footer .ft_inner .info { margin-left: 0; margin-top: 12px; }
}
/*───────────────────────────────────────────────────────────

SIDE_BOX | outline/left_bbs.html｜outline/left_goods.html｜outline/left_member.html｜outline/left_service.html

───────────────────────────────────────────────────────────*/
/* PC 일반 */
#side_box { padding-bottom: 1.8%; }
#side_box .sub_menu { width: 100%; padding: 0; margin: 0; z-index: 2; text-align: center; vertical-align: top; }
#side_box .sub_menu dl { position: relative; display: inline-block; margin: 0 auto; z-index: 3; font-size: 0; text-align: center; vertical-align: top; padding: 0; }
#side_box .sub_menu dt, #side_box .sub_menu dd { display: inline-block; margin: 0; padding: 0; }
#side_box .sub_menu dt { display: none; }
#side_box .sub_menu dd { line-height: 31px; height: 32px; padding: 0 12px; border-bottom: 1px #ccc solid; position: relative; z-index: 1; box-sizing: border-box; vertical-align: top; }
#side_box .sub_menu dd a, #side_box .sub_menu dd strong { height: 31px; line-height: 31px; font-size: 15px; font-weight: 600; padding: 0 2px; color: #888; display: inline-block; box-sizing: border-box; vertical-align: top; }
#side_box .sub_menu dd:hover a, #side_box .sub_menu dd.on a, #side_box .sub_menu dd strong { border-color: #333; color: #333; position: relative; }
#side_box .sub_menu dd:hover a:before, #side_box .sub_menu dd.on a:before, #side_box .sub_menu dd strong:before { bottom: -1px; width: 100%; height: 2px; background: #333; left: 50%; transform: translateX(-50%); position: absolute; content: ""; display: block; }
@media only screen and (max-width:860px) {
	#side_box .sub_menu dd { line-height: 29px; height: 30px; padding: 0 8px; }
	#side_box .sub_menu dd a, #side_box .sub_menu dd strong { height: 29px; line-height: 29px; font-size: 14px; padding: 0 2px; }
}
@media only screen and (max-width:640px) {
	#side_box .sub_menu dd { line-height: 27px; height: 28px; padding: 0 8px; }
	#side_box .sub_menu dd a, #side_box .sub_menu dd strong { height: 27px; line-height: 27px; font-size: 14px; padding: 0 2px; }
}
@media only screen and (max-width:479px) {
	#side_box { display: none; }
}
/*───────────────────────────────────────────────────────────

MAIN | index.html

───────────────────────────────────────────────────────────*/
/* *PC 일반 **/
.main_index #container { padding-top: 0 !important; }
.main { width: 100%; overflow: hidden; }
.main .w_set { width: 100%; box-sizing: border-box; max-width: 1290px; padding-left: 15px; padding-right: 15px; margin: 0 auto; }
.main .tit { display: block; font-size: 40px; line-height: 1; color: #333; text-align: center; margin-top: 3em; margin-bottom: 2em; }
.main .btn_more { display: inline-block; padding: 21px 29px; position: relative; vertical-align: middle; font-size: 16px; line-height: 1; border: 1px solid transparent; border-radius: 0px; background: transparent; overflow: hidden; -webkit-transition: color 0.55s cubic-bezier(0.52, 0.08, 0.18, 1); transition: color 0.55s cubic-bezier(0.52, 0.08, 0.18, 1); border: 1px solid #333; background: #fff; }
.main .btn_more span { position: relative; color: #333; transition: all 0.2s; }
.main .btn_more:before { content: ""; display: block; width: 120%; height: 100%; position: absolute; left: 0; top: 0; -webkit-transform-origin: right top; -ms-transform-origin: right top; transform-origin: right top; -webkit-transform: translateX(-101%) skewX(-17.62deg); -ms-transform: translateX(-101%) skewX(-17.62deg); transform: translateX(-101%) skewX(-17.62deg); -webkit-transition: -webkit-transform 0.55s cubic-bezier(0.52, 0.08, 0.18, 1); transition: -webkit-transform 0.55s cubic-bezier(0.52, 0.08, 0.18, 1); transition: transform 0.55s cubic-bezier(0.52, 0.08, 0.18, 1); transition: transform 0.55s cubic-bezier(0.52, 0.08, 0.18, 1), -webkit-transform 0.55s cubic-bezier(0.52, 0.08, 0.18, 1); -webkit-backface-visibility: hidden; backface-visibility: hidden; background: #333; }
.main .btn_more:hover span { color: #fff; }
.main .btn_more:hover:before { -webkit-transform: translateX(0) skewX(-17.62deg); -ms-transform: translateX(0) skewX(-17.62deg); transform: translateX(0) skewX(-17.62deg); -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; }
/* visual */
#wrap .main_visual { position: relative; width: 100%; min-width: 1200px; margin: 0; height: 940px; background: #000; }
/* 메인 영역 */
.main_visual .slick-slide { overflow: hidden; position: relative; text-align: center; height: 940px; border: none; min-height: 100% !important; }
.main_visual .slick-slide img { display: inline-block; height: auto; width: 100%; max-width: 1920px; }
.main_visual .slick-slide a { display: inline-block; height: 100%; width: 100%; max-width: 1920px; margin: 0 auto; text-align: Center; position: absolute; left: 0; top: 0; outline: 0; background-position: center; background-size: cover !important; transition: transform 2s ease-in-out, opacity 2s ease-in-out; transform: rotate(0.003deg); opacity: 0.6; }
.main_visual .txt_box { width: calc(100% - clamp(20px, 6vw, 40px)); text-align: center; transform: translate(-50%, -50%); position: absolute; left: 50%; top: 53%; max-width: 1640px; font-size: 0; }
.main_visual .txt_box p, .main_visual .txt_box b, .main_visual .txt_box span { display: block; text-align: left; color: #fff; font-family: "Pretendard", "Malgun Gothic", "맑은 고딕", dotum, sans-serif; opacity: 0; transform: translateY(-20px); }
.main_visual .txt_box p { font-weight: 500; line-height: 1.18; font-size: var(--title-110); }
.main_visual .txt_box p:first-child { font-weight: 700; }
.main_visual .txt_box span { display: block; font-size: var(--title-20); margin-top: clamp(40px, 5vw, 70px); font-weight: 200; transition-delay: 300ms; }
.main_visual .active .txt_box p, .main_visual .active .txt_box b, .main_visual .active .txt_box span { opacity: 1; transform: translateY(0); transition: all 0.5s; }
.main_visual .active .txt_box b { transition-delay: 0.3s; }
.main_visual .active .txt_box span { transition-delay: 0.6s; }
.main_visual .visual_btn_wrap .play_btn_box { display: inline-block; vertical-align: top; position: relative; width: 16px; height: 16px; text-align: center; }
.main_visual .visual_btn_wrap .play_btn_box .slickPlay { width: auto; height: auto; content: ""; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right: none; border-left: 10px solid #fff; margin-left: 3px; }
.main_visual .visual_btn_wrap .play_btn_box .slickBtn { font-size: 0; width: 100%; height: 100%; cursor: pointer; }
.main_visual .visual_btn_wrap .slickPause { background: url("../images/skin/visual_sld_pause.png") no-repeat center; }
/* main_txt */
.main_txt { text-align: center; }
.main_txt .top_txt { text-align: center; }
.main_txt .top_txt span, .main_txt .top_txt strong { display: block; line-height: 1; }
.main_txt .top_txt span { font-size: 15px; color: #ccc; padding-top: 7em; font-weight: 700; }
.main_txt .top_txt strong { margin: 0.75em 0 1.25em; font-size: 40px; color: #444; }
.main_txt .top_txt p { font-size: 17px; line-height: 2.1; font-weight: 770; }
.main_txt .btm_txt { margin: 80px 0 0; }
.main_txt .btm_txt ul { font-size: 0; }
.main_txt .btm_txt ul li { display: inline-block; vertical-align: top; width: 33.3%; box-sizing: border-box; text-align: center; }
.main_txt .btm_txt ul li + li { border-left: 1px solid #ddd; }
.main_txt .btm_txt ul li strong { padding-top: 7.5em; padding-bottom: 1.2em; font-size: 20px; line-height: 1; color: #444; display: block; }
.main_txt .btm_txt ul li:nth-of-type(1) strong { background: url("../images/skin/main_txt_ico01.png") no-repeat center 7px; }
.main_txt .btm_txt ul li:nth-of-type(2) strong { background: url("../images/skin/main_txt_ico02.png") no-repeat center 7px; }
.main_txt .btm_txt ul li:nth-of-type(3) strong { background: url("../images/skin/main_txt_ico03.png") no-repeat center 7px; }
.main_txt .btm_txt ul li p { font-size: 14px; line-height: 1.7; color: #949494; }
.main_txt .link { display: inline-block; font-size: 12px; line-height: 1; color: #333; background: url("../images/skin/main_txt_more.png") no-repeat right; padding-right: 50px; margin: 7em 0 0; }
@media only screen and (max-width:1380px) {
	.main .w_set { padding-left: 12px; padding-right: 12px; box-sizing: border-box; }
	#wrap .main_visual { min-width: 100%; }
}
@media only screen and (max-width:1217px) {
	.main .tit { font-size: 38px; }
	.main_txt .top_txt span { padding-top: 5em; }
	.main_txt .top_txt strong { font-size: 38px; }
	.main_txt .top_txt p { font-size: 15px; }
	.main_txt .btm_txt ul li strong { font-size: 18px; padding-top: 6em; background-size: auto 80px !important; }
	.main_txt .link { margin: 5em 0 0; }
	/*visual*/
	/* 타입 B */
	#wrap .main_visual .slick-dots { left: 46%; }
	/* main_gallery */
	.main_gallery .board_ul .board_li .txt strong { font-size: 18px; }
	.main_notice .board_ul { margin-bottom: 100px; }
}
@media only screen and (max-width:1024px) {
	#wrap .main_visual, #wrap .main_visual .slick-slide { height: 100vh; overflow: hidden; }
	#wrap .main_visual .txt_box { width: calc(100% - 40px); text-wrap: pretty; }
	#wrap .main_visual .txt_box p, #wrap .main_visual .txt_box b, #wrap .main_visual .txt_box span { text-indent: 0; line-height: 130%; }
	#wrap .main_visual .txt_box span { margin-top: 4vw; }
	#wrap .main_visual .slick-dots { bottom: 6.8%; }
}
@media only screen and (max-width:860px) {
	.main .tit { font-size: 30px; margin-bottom: 1em; }
	.main .tit .btn_more { font-size: 14px; height: 2em; line-height: 2.2em; margin-top: -2px; }
	.main_txt .top_txt strong { font-size: 33px; }
	.main_txt .top_txt p { font-size: 14px; }
	.main_txt .btm_txt { margin: 40px 0 0; }
	.main_txt .btm_txt ul li strong { font-size: 16px; background-size: auto 60px !important; }
	.main_txt .btm_txt ul li p { font-size: 13px; }
	.main_txt .link { margin: 3em 0 0; }
}
@media only screen and (max-width:767px) {
	.main_txt .btm_txt ul { width: 60%; margin: 0 auto; }
	.main_txt .btm_txt ul li { width: 100%; padding: 2em 0; }
	.main_txt .btm_txt ul li + li { border-left: 0; border-top: 1px solid #ddd; }
	.main_bar { height: 250px; }
	.main_bar .txt p { padding: 0 10px; }
	.main_bar .txt p br { display: none; }
}
@media only screen and (max-width:640px) {
	.main .tit { font-size: 28px; }
	.main_notice .tit .btn_more { font-size: 13px; padding: 0 10px; }
	/* visual */
	.main_visual .txt_box p, .main_visual .txt_box b { font-size: var(--title-60); line-height: 130%; }
	.main_visual .txt_box p span br, .main_visual .txt_box b span br { display: none; }
}
@media only screen and (max-width:500px) {
	/*visual*/
	#wrap .main_visual .slick-dots { left: 20%; }
}
@media screen and (max-width:320px) {
	.main .w_set { padding-left: 10px; padding-right: 10px; }
}