@charset "utf-8";

/*
* File       : layout.css
* Author     : B-WORKER
* Dependency : css/reset.css
*      
 * SUMMARY:
 * 레이아웃 관련만 선언합니다.
 *
 * 01) GLOBAL BODY
 * 02) HEADER 
 * 03) FOOTER
 * 04) SCROLL TOP
 * 05) 404        
*/

/* **************************************** *
 * GLOBAL
 * **************************************** */
/* body{overflow-x:hidden;overflow-y:overlay;} */
body.scroll-hide{overflow-y:hidden;}
body.scroll-hide #header{position: fixed;}
body::after{content:"";position: fixed;opacity:1;top:0;left:0;z-index:9999;width:100%;height:100%;background:#fff;transition: all 0.7s ease;}
body:has(#main)::after{display: none;}
body.motion-on::after{opacity:0; visibility:hidden;}

/*body.fixed{overflow:hidden; top:0; right:0; bottom:0; left:0; width:100%; height:100%;}*/

body[data-bg="dark"]::after{background:#111;}

a.btn-adm{padding:5rem 14rem;background:var(--c-primary);font-size:14rem;color:#fff;border-radius:30rem;position: absolute;left: 0;bottom: -29rem;}

/* scroll set */
::selection{background: var(--c-primary);color:#fff;}

/* 스크롤바 커스텀 */
*::-webkit-scrollbar{width:12rem;background-color:#ebebeb; border-radius: 10rem;}
*::-webkit-scrollbar-thumb:hover{background-color: #a7a7a7;}
::-webkit-scrollbar-thumb{background-color:#C1C1C1; border-radius: 10rem;}

@media (max-width:860px){
	*::-webkit-scrollbar{display:none !important; width:0; height:0;}
}

/* **************************************** *
 * HEADER
 * **************************************** */
#header{position: fixed; top: 0; z-index:100;width:100%; transition: background-color .4s, padding .4s, border-bottom-color .3s, transform .4s;/* transform:translateY(-100rem); */border-bottom: 1px solid var(--op-b10); background: var(--w);}
#header * {font-family: var(--lang-ko) !important;}
#header.hide{transform: translateY(-100%) !important;}
#header h1{font-size:0;}
#header:has(#site-map.active){position:fixed;}

.motion-on #header{/* transform:translateY(0rem); */}

.header-inner{display:flex;align-items:center; height: 90rem; padding: 20rem 0;}
#header .header-inner > div {width: auto; height: auto; overflow: inherit;}

#logo {position:relative;float: none;z-index:81;margin-right: 48rem;padding: 0 !important;z-index: 9999;}
#logo a{display:block;width: 121rem;height: 57rem;background-size: 100%;background-position:50% 50%;background-repeat:no-repeat;background-image:url(../img/layout/logo.svg);}

/* #header.on{background-color: #fff;padding:20rem 0;border-bottom-color: #eee;} */

/* basic gnb */
.gnb-container{display:inline-block;}
.gnb-full-cover{position:absolute; opacity:0; visibility:hidden; top:0; left:0; z-index:-1; width:100%; height:100%; background:#fff; box-shadow:15rem 20rem 29rem 0rem rgba(0, 0, 0, 0.23); transition:var(--trans-01);}

#gnb{text-align:center;position: relative; max-width: none; margin-bottom: 0 !important; background: transparent; border: 0 !important;}
#gnb .gnb-item{display:inline-block;position:relative;padding: 0 12rem;transition:var(--trans-01);}
#gnb .gnb-item:last-child:after{background:none;}
#gnb .gnb-item > a{display:inline-block; padding: 20rem 0; font-family: var(--lang-ko) !important; font-weight:600;color:var(--b-title);transition:var(--trans-01);}
#gnb .gnb-item .sub-menu > li.on > a{color: var(--c-primary) !important;font-weight: 700 !important;}
#gnb .gnb-item > a.on{color: var(--c-primary) !important;}

.sub-menu-depth{display: none;} /* 3차메뉴 숨김 */

#header.color-on::before{opacity:1;}
#header:is(.color-on, .on) #logo a{background-image:url(../img/layout/logo.svg);}
#header.color-on .gnb-full-cover{opacity:1;visibility:visible;height: 750rem;}
#header:is(.color-on, .on) #gnb .gnb-item > a{color:#111;}
#header.color-on #gnb .gnb-item{/*padding: 0 35rem;*/}

.btn_close{opacity:0; font-size:0;}

/* util */
.gnb-util {margin-left: auto;}
.gnb-util__item {position: relative; margin:0 3rem;}
.gnb-util__item a {display: block; width: 40rem;}
.gnb-util__item a img {max-width: 100%;}
.gnb-util__item p {display: none; position: absolute; left: 50%; top: 20rem; padding:5rem 12rem; text-align: center; background: var(--w); border-radius: 100rem; border: 1px solid var(--c-primary); transform: translateX(-50%); transition: var(--trans-01);}
.gnb-util__item p::before {position: absolute; left: 50%; top: -2rem; content:''; width: 7rem; height: 7rem; background: var(--w); border: 1px solid var(--c-primary); border-right: 0; border-bottom: 0; transform: rotate(45deg) translateX(-50%);}
.gnb-util__item p span {display: inline-block; position: relative; font-size: var(--font-13); font-weight: 500; color: var(--b-title); white-space: nowrap;}
.gnb-util__item.active p {display: block; top: 45rem;}

#header.hide .gnb-util__item.active p {display: none;}


/* **************************************** *
 * MOBILE MENU
 * **************************************** */
.gnb-mobile-btn{display:none; position:relative; z-index:80; padding:10rem 0rem; cursor:pointer;}
.gnb-mobile-btn span{display:block; position:relative; width:100%; height:3px; background:#fff; transition:all 0.4s ease;}
.gnb-mobile-btn .inner{display:grid;width: 32rem;height: 11rem;align-content:space-between;}
.gnb-mobile{position:fixed;opacity:0;visibility:hidden;overflow:hidden;top:0;right: 0;width:100%;height:100vh;background:#fff;transition:all 0.3s ease;overflow-y: scroll;}
.gnb-mobile:has(.menu--st01){max-width: 550rem;}
.gnb-mobile-btn.active span:nth-child(1){top: 8rem;transform:rotate(45deg);}
.gnb-mobile-btn.active span:nth-child(2){transform:rotate(-45deg);}
.gnb-mobile-btn.active span{background:#222;}
.gnb-mobile.active{opacity:1; visibility:visible;}
.gnb-mobile-menu .gnb-item > a{display:inline-flex;align-items:center;position:relative;font-weight:700;font-size:27rem;color: var(--b-01);}
.gnb-mobile-menu{position:absolute;top:20vh;width:100%;box-sizing:border-box;padding:0rem 30rem;text-align:center;overflow: auto;}
.gnb-mobile-menu .gnb-item:not(:first-child){margin-top: 30rem;}
.gnb-mobile-menu .sub-menu{display:none; margin-top:22rem;}
.gnb-mobile-menu .sub-menu li a.on{color: var(--c-primary);}
.gnb-mobile-menu .gnb-item.active{padding-bottom:15rem;}
.gnb-mobile-menu .sub-menu li a{font-size:18rem;display: block;}
.gnb-mobile-menu .sub-menu li:not(:first-child){margin-top:12rem;}
.gnb-mobile-menu .gnb-item:has(li:nth-child(2)){}
.gnb-mobile-menu .gnb-item > a::after{content:"";display:none;position:absolute;right: -30rem;width: 26rem;height: 26rem;/* margin-left: 22rem; */background: url(../img/board/arrow-select.svg) no-repeat 50% 50%;/* transform: rotate(90deg); */background-size: 16rem;}
.gnb-mobile-menu .gnb-item.active:has(li:nth-child(2)) > a::after{transform: rotate(180deg);}
.gnb-mobile-menu .gnb-item:has(li:nth-child(2)) > a::after{display:block;}
.gnb-mobile__copy{position:absolute; opacity:0.3; bottom:30rem; width:100%; font-weight:800; text-align:center;}
.gnb-mobile-menu .gnb-item{opacity:0; transition:all 0.7s ease; transform:translateY(30rem);}
.gnb-mobile.active  .gnb-item{opacity:1; transform:translateY(0rem);}
.gnb-mobile.active  .gnb-item:nth-child(1){transition-delay:100ms;}
.gnb-mobile.active  .gnb-item:nth-child(2){transition-delay:200ms;}
.gnb-mobile.active  .gnb-item:nth-child(3){transition-delay:300ms;}
.gnb-mobile.active  .gnb-item:nth-child(4){transition-delay:400ms;}
.gnb-mobile.active  .gnb-item:nth-child(5){transition-delay:500ms;}
.gnb-mobile.active  .gnb-item:nth-child(6){transition-delay:600ms;}
.gnb-mobile.active  .gnb-item:nth-child(7){transition-delay:700ms;}
.gnb-mobile.active  .gnb-item:nth-child(8){transition-delay:800ms;}

/* st 1 */
.gnb-mobile-menu.menu--st01{top:auto; bottom:0; height:calc(100% - 100rem); border-top:1px solid #f3f3f3; text-align:left;}
.gnb-mobile-menu.menu--st01::before{content:""; position:absolute; top:0; right:0; width:50%; height:100%; background:#f7f7f7;}
.gnb-mobile-menu.menu--st01 .gnb-item{width:50%;}
.gnb-mobile-menu.menu--st01 .sub-menu{position:absolute; top:0; left:100%; width:100%; box-sizing:border-box; margin-top:0;}
.gnb-mobile-menu.menu--st01 .gnb-item.active{padding:0;}
.gnb-mobile-menu.menu--st01 .gnb-item > a{font-size:20rem;}
.gnb-mobile-menu.menu--st01 .gnb-item:nth-child(1){margin-top:40rem;}
.gnb-mobile-menu.menu--st01 .gnb-item > a{display:flex;}
.gnb-mobile-menu.menu--st01 .gnb-item > a::after{right:25rem; width:12rem; height:12rem; transform:rotate(-90deg) !important;}
.gnb-mobile-menu.menu--st01 .gnb-item:not(:first-child){margin-top:23rem;}
.gnb-mobile-menu.menu--st01 .gnb-item.active > a{color:var(--c-primary);}
.gnb-mobile-menu.menu--st01 .gnb-item.active > a::after{background-image:url(../img/common/arrow-basic_c.svg);}
.gnb-mobile-menu.menu--st01 .sub-menu.active{opacity:1; visibility:visible; transform:translateY(0rem);}
.gnb-mobile-menu.menu--st01 .sub-menu{display:block; opacity:0; visibility:hidden; transition:var(--trans-01); transform:translateY(15rem);}

@media (max-width:1480px){
	#gnb .gnb-item > a{}
}

@media (min-width: 1024px){
	#gnb .gnb-item .sub-menu{display:none;position:absolute;opacity:0;visibility:hidden;top: 60rem; left: 50%; width:100%; min-width: 120rem; padding:10rem 12rem;background:var(--w); border-radius: 10rem; border:1px solid var(--op-b10);box-shadow:15rem 20rem 29rem 0rem var(--op-b10);transition:all 0.4s ease-out;transition-property: opacity, transform, visibility;transition-delay:0s, 0s, 0s;transform: translate(-50%, -20rem); box-shadow: 10rem 10rem 20rem 0 rgba(0, 0, 0, 0.25);}
	#gnb .gnb-item .sub-menu{display:block; transition-delay:0.1s;}	
	#gnb .gnb-item .sub-menu > li > a{display:block;position:relative; font-family: var(--lang-ko); font-size: var(--font-15); padding:7rem 0rem; text-align: center !important; color:var(--op-b40);text-align:left;transition:var(--trans-01);}
	#gnb .gnb-item .sub-menu > li > a:hover{color:var(--b-title);}
	#gnb .gnb-item .sub-menu > li:first-child > a{border-top-width:0rem;}
	#gnb .gnb-item.active .sub-menu{opacity:1;visibility:visible;z-index:10;transition-delay:0s, 0s, 0s;transform: translate(-50%, 0);}	
}

@media all and (max-width:1023px){
	#header .gnb-full-cover,
	#header::before{display:none;}
	#header:not(:has(.gnb-mobile-menu.menu--st01)).color-on #logo a{background-size:100%; background-image:url(../img/layout/logo.svg);}

	.gnb-container-wrap{display:none;}
	.gnb-mobile-btn{display:block;}
	.gnb-mobile-btn.active .inner{width:35rem;}
	.gnb-mobile-btn.active{top: -4rem;}

	.gnb-mobile-menu .gnb-item:has(li:nth-child(2)) > a{margin-left: -13rem;}	
	.gnb-mobile-menu.menu--st01 .gnb-item:has(li:nth-child(2)) > a{margin-left:0;}
	.gnb-mobile-menu.menu--st01 .sub-menu li a{display:block; padding:4rem 20rem; font-size:16rem;}
	
	.sub-menu-depth{display:none;}

	.gnb-util__item p {display: none !important;}

	.lang-menu{position:absolute;right: 50rem;}
	.lang-menu .select-link{width:50rem;}
}

@media (max-width: 540px){
	.header-inner{height: 60rem; padding: 0;}
	#header.color-on #logo a, .scroll-hide #logo a{background-image: url(../img/layout/logo.svg) !important;}
	#logo a{width: 89rem;height: 45rem;}

	.gnb-util__list li:not(:last-child) {display: none;}
	.gnb-util__item {margin: 0;}
	.gnb-util__item a {height: 40rem;}
	.gnb-util__item a i {display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%;}

	.gnb-mobile-menu{top:19vh;padding-bottom: 7vh;}
	.gnb-mobile-btn .inner{width: 26rem;height: 11rem;}
	.gnb-mobile-btn.active .inner{width:26rem;}
	.gnb-mobile-btn.active span:nth-child(1){top: 8rem;}
	.gnb-mobile-menu .gnb-item:not(:first-child){margin-top: 19rem;}
	.gnb-mobile-menu .gnb-item > a{font-weight: 700;font-size:21rem;}
	.gnb-mobile-menu .gnb-item > a::after{width: 18rem;height: 18rem;background-size: 12rem;margin-left: 8rem;right: -23rem;}
	.gnb-mobile-menu .sub-menu li a{font-size:16rem;}
	.gnb-mobile-menu .sub-menu li:not(:first-child){margin-top: 12rem;}	
	.gnb-mobile-menu .sub-menu{display:none; margin-top:18rem;}

	.gnb-mobile-menu.menu--st01{height: calc(100% - 80rem); padding:0rem 20rem;}
	.gnb-mobile-menu.menu--st01 .gnb-item > a{font-size:16rem;}
	.gnb-mobile-menu.menu--st01 .gnb-item > a::after{right:20rem; width:10rem; height:10rem;}
	.gnb-mobile-menu.menu--st01 .sub-menu li a{padding:2rem 18rem; font-size:14rem;}
	.gnb-mobile-menu.menu--st01 .gnb-item:nth-child(1){margin-top:25rem;}

	.lang-menu{right: 30rem;margin-top: -1rem;}
	.lang-menu .select-link{width:50rem;}
	.lang-menu .select-link > ul{margin-top:7rem; padding:7rem 0rem;}
	.lnag-menu__icon{margin-right: 7rem;min-width:15rem;}
	.lang-menu .select-link > ul a{font-size:12rem;}	
	.lang-menu i{font-size: 12rem;}
}

/* 모바일에서 사용되는 메뉴 */
#gnb-mob-wrap {border-top: 1px solid var(--op-b10);}
#gnb-mob-wrap .wrap {margin-right: 0 !important;}
.gnb-mob__nav {display: flex; align-items: center; height: 60rem;}
.gnb-mob__nav .gnb-item {margin-right:30rem; font-weight: 600; color: var(--b-title);}
.gnb-mob__nav .gnb-item > a {display: block; padding: 20rem 0;}
.gnb-mob__nav .gnb-item .sub-menu {display: none;}

@media (max-width:1023px){
	.gnb-mob__nav .gnb-item:not(:last-child) {margin-right: 25rem;}
}

@media (max-width:540px){
	.gnb-mob__nav {height: 45rem;white-space: nowrap;overflow-x: scroll;}
	.gnb-mob__nav .gnb-item:not(:last-child) {margin-right: 17rem;}
	.gnb-mob__nav .gnb-item > a {padding: 0;}
	.gnb-mob__nav::-webkit-scrollbar{display:block !important; height:3rem; border-radius: 5rem;}
} 

/* 헤더 검색 */
.gnb-search {inset: auto; top: 95rem; right: calc((100vw - 1280rem) / 2); max-width: 330rem; border-radius: 20rem; background: var(--w); border: 1px solid var(--op-b10); box-shadow: 10rem 10rem 20rem 0 rgba(0, 0, 0, 0.1);}
.gnb-search .popup-layer-inner {position: relative; left: auto; top: auto; width: 100%; min-width: auto; height: auto; min-height: auto; padding: 22rem 20rem 20rem; transform: none; box-shadow: none; background: transparent;}
.gnb-search .search_box {width: 100%; height: auto;}
.gnb-search h6 {color: var(--b-title);}
.gnb-search form {position: relative; width: 100%; margin: 14rem 0;}
.gnb-search input[type="text"] {width: 100%; height: 45rem; padding: 0 15rem; padding-right: 50rem; font-size: var(--font-15); border-radius: 100rem; border: 1px solid var(--op-b10);}
.gnb-search input[type="text"]::placeholder {font-size: 13rem; color: var(--op-b30);}
.gnb-search input[type="text"]:focus {box-shadow: none !important;}
.gnb-search .btn-search {position: absolute; right: 0; top: 0; width: 50rem; height: 45rem; background: url(../img/layout/ic-search.svg) no-repeat center 45% / 35rem;}
.gnb-search .btn-search i {display: none;}
.gnb-search__tag {flex-wrap: wrap; justify-content: center; width: 100%; gap: 4rem;}
.gnb-search__tag li {padding: 5rem 10rem; font-size: 13rem; color: var(--op-b30); border-radius: 100rem; background: var(--bg-default);}
.gnb-search .popup-layer-close {top: 11rem; right: 12rem; width:40rem; height: 40rem;}
.gnb-search .popup-layer-close::after {transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.gnb-search .popup-layer-close::after, .gnb-search .popup-layer-close::before {width: 16rem; height: 2rem; border-radius: 10rem; background: var(--b-title);}
.gnb-search .popup-layer-close span {display: none;}

html.is-popup-open:has(.gnb-search), body.is-popup-open:has(.gnb-search) {position: relative !important; overflow: visible !important; touch-action: auto !important;}
body.is-popup-open:has(.gnb-search)  {top: auto !important;}

@media (max-width:1680px){
	.gnb-search {right: 60rem;}
}

@media all and (max-width:1023px){
	.gnb-search {right: 40rem;}
}

@media (max-width: 540px){
	.gnb-search {z-index: 10000; top: 0; right: 0; inset: 0; max-width: none; width: 100%; height: 100%; border-radius: 0; border: none; box-shadow: none;}
	.gnb-search .popup-layer-inner {width: 100%; height: 100%; padding: 20rem;}
	.gnb-search .popup-layer-close {top: auto; right: auto; left: 0; width: 100%; height: auto; padding: 15rem 0;}
	.gnb-search .popup-layer-close span {display: block; font-size: 14rem; font-weight: 500;}

	html.is-popup-open:has(.gnb-search), body.is-popup-open:has(.gnb-search) {position: fixed !important; overflow: hidden !important; touch-action: none !important;}
	body.is-popup-open:has(.gnb-search)  {top: auto !important;}

}

/* **************************************** *
 * full page gnb site map 
 * **************************************** */
 #site-map{position:absolute;opacity:0;visibility:hidden;top:95rem;right:0;z-index:51; display: block; transition: none;transition-delay:0.1s;}
 #site-map.active{opacity:1;visibility:visible;transition-delay:0s;transition: all 0.5s ease;}
 #site-map.active .gnb-item{opacity:1;transform:translateY(0rem);transition: all 0.7s 
ease;}
 #site-map.active .gnb-item:nth-child(1){transition-delay:100ms;}
 #site-map.active .gnb-item:nth-child(2){transition-delay:200ms;}
 #site-map.active .gnb-item:nth-child(3){transition-delay:300ms;}
 #site-map.active .gnb-item:nth-child(4){transition-delay:400ms;}
 #site-map.active .gnb-item:nth-child(5){transition-delay:500ms;}
 #site-map.active .gnb-item:nth-child(6){transition-delay:600ms;}
 #site-map.active .gnb-item:nth-child(7){transition-delay:700ms;} 
 #site-map.active .gnb-item:nth-child(8){transition-delay:800ms;} 

/* 꽉 차지않는 메뉴 */
#site-map {display:flex; justify-content:flex-end; right:0; left:auto;}
#site-map .site-map-inner {width:330rem; height: auto; margin:0; padding:20rem 20rem 30rem; border-radius: 20rem; border: 1px solid var(--op-b10); background:var(--w); box-shadow: 10rem 10rem 20rem 0 rgba(0, 0, 0, 0.1);}
#site-map .site-map-inner > div {height: auto !important;}

 .site-map-inner{display:flex; flex-direction: column; align-items:center;height:auto;padding: 0 60rem;background: var(--w);}
 .site-map-list .gnb-item > a {display: block; width: 100%; padding: 10rem 0; font-weight:600; color: var(--b-title);}
 .site-map-list .gnb-item:has(.sub-menu) > a::after {position: absolute; right: 0; top: 13rem; content:''; width: 14rem; height: 14rem; background: url(../img/layout/arrow-basic.svg) no-repeat center / 11rem; transform: rotate(90deg);}
 .site-map-list .gnb-item:has(.sub-menu) > a.active::after {transform: rotate(-90deg);}
 .site-map-list.site-map--colum{display:grid; width:100%; text-align:center; grid-template-columns:repeat(6, 1fr);}
 .site-map-list.site-map--colum .sub-menu li:not(:first-child){margin-top:13rem;}
 .site-map-list.site-map--colum .sub-menu{margin-top:30rem;}
 .site-map-list.site-map--row{display:grid;}
 .site-map-list.site-map--row :is(.gnb-item, .sub-menu){display:flex; align-items:center;}
 .site-map-list.site-map--row .sub-menu li:not(:first-child){/* margin-left:30rem; */}
 .site-map-list.site-map--row .sub-menu{margin-bottom: 10rem;}
 .site-map-list .sub-menu a{transition:var(--trans-01);}
 .site-map-list .sub-menu a:hover,
 .site-map-list .sub-menu a.on{color:var(--c-primary);}
 .site-map-list.site-map--row.row-drap .gnb-item{display:flex; align-items:flex-start; flex-direction:column;}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu{display:none; margin-left:0;}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li {display: inline-block; margin-right: 0; margin-bottom: 4rem;}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li a {display: inline-block; padding: 6rem 10rem; font-size: 14rem; color: var(--op-b50); border-radius: 3rem; background: var(--bg-default); transition: var(--trans-01);}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li:last-child {margin-right: 0;}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li:not(:first-child){/* margin-left:20rem; */}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li{/* display:inline-block; */}
 .site-map-list .gnb-item{opacity:0;/* transition:all 0.7s ease; */transform:translateY(30rem);}

 .site-map-list.row-drap .gnb-item > a.active{color: var(--c-primary);}
.site-map__cancle{position:absolute; top:40rem; right:40rem;}
.site-map--close {z-index: 1; position: absolute; right: 15rem; top: 17rem; width: 22rem; height: 22rem;}
.site-map--close span {position: absolute; left: 50%; top: 50%; width: 16rem; height: 2rem; border-radius: 2rem; background: var(--b-title); transform: translate(-50%, -50%) rotate(45deg);}
.site-map--close span:last-child {transform: translate(-50%, -50%) rotate(-45deg);}
.site-list-wrap {width: 100%;}
.site-list-wrap strong {display: block; margin-bottom: 10rem; padding-bottom: 12rem; font-size: var(--font-13); font-weight: 600; color: var(--op-b40); border-bottom: 1px solid var(--op-b10);}

.site-map__bottom {width: 100%; margin-top: 30rem; padding-top: 20rem; gap: 10rem; border-top: 1px solid var(--op-b10);}
.site-map__bottom span {display: block; font-size: 14rem; color: var(--op-b50); text-align: center; transition: var(--trans-01);}
.site-map__bottom i {display: flex; align-items: center; justify-content: center; width: 50rem; height: 50rem; margin: 0 auto; margin-bottom: 10rem; border-radius: 10rem; background: var(--bg-default);}
.site-map__bottom i img {width: 22rem;}

@media (hover: hover) and (pointer: fine){
	.site-map-list .gnb-item > a:hover {color: var(--c-primary);}
	.site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li a:hover {background: var(--b-title); color: var(--w);}
	.site-map__bottom a:hover span {color: var(--b-title); text-decoration: underline; text-underline-offset: 3rem;}
}

@media all and (max-width:1023px){
	.site-map__bottom {grid-template-columns: repeat(4, 1fr);}
}

@media (max-width:860px){
	#site-map {right: -20rem;}
} 

@media (max-width:540px){
	#site-map {z-index: 1000; position: fixed; top: 0; right: 0; width: 100%; height: 100vh;}
	#site-map .site-map-inner {width: 100%; border: 0; border-radius: 0; box-shadow: none;}
	.site-map__user {height: auto !important;margin-top: 72rem;margin-bottom: 40rem;}
	.site-map__user ul {grid-template-columns: repeat(3, 1fr); gap: 12rem;}
	.site-map__user ul:has(li:nth-child(4)) {grid-template-columns: repeat(4, 1fr);}
	.site-user__item a {display: block; text-align: center;}
	.site-user__item i {width: 70rem;aspect-ratio: 1/1;display: flex;align-items: center;justify-content: center;margin: 0 auto;margin-bottom: 6rem;border-radius: 10rem;background: var(--bg-default);}
	.site-user__item i img {width: 42rem;}
	.site-user__item i.mypage img {width: 40rem;}
	.site-user__item a p {padding: 0 10rem; font-size: 12rem;font-weight: 500;line-height: 1.25; word-break: keep-all;}
	.site-map-list .gnb-item > a {padding: 11rem 0;font-size: 15rem;}
} 

 .gnb-full-btn-wrap .gnb-full-icon{position:relative; width:20rem; height:14rem;}
 .gnb-full-btn-wrap .gnb-full-icon > span{display:inline-block; position:absolute; left:0; width:100%; height:2rem; background:var(--b-title); border-radius: 2rem; transition:all 0.3s;}
 .gnb-full-btn .border-01{top:0;}
 .gnb-full-btn .border-02{top:0; bottom:0; margin:auto;}
 .gnb-full-btn .border-03{bottom:0px;}
 .gnb-full-btn .text{display:inline-block; width:100%; font-size:11rem; color:#FFF; text-align:center; transition:all 0.3s;}
 
 .gnb-full-btn-wrap{position:relative; z-index:100;}
 .gnb-full-btn.active .gnb-full-icon > span{background:var(--b-01);}
 .gnb-full-btn-wrap .gnb-full-btn{display:flex;align-items:center;flex-direction:column; justify-content: center; cursor: pointer; width: 40rem; height: 40rem;}


@media (max-width:1023px){
	.gnb-full-btn-wrap{display: none;}
	.gnb-full-btn-wrap.mob{display:block;}
	body:has(.gnb-full-btn-wrap.mob) .gnb-mobile-btn{display:none;}
}

@media (max-width:540px){
	.site-map-inner{padding: 0 20rem;}
	.gnb-full-btn-wrap.mob {margin-left: 0rem;margin-right: -5rem;}
	.gnb-full-btn-wrap .gnb-full-btn {width: 30rem; height: 30rem;}
	/* .gnb-full-btn-wrap:has(.gnb-full-btn.active) {right: 20rem; top: 23rem;} */
} 

/* **************************************** *
 * footer
 * **************************************** */
 #footer {z-index: 10; position: relative; font-family: var(--lang-ko); padding: var(--space60) 0; background: var(--bg-default);}
 #footer .wrap div {height: auto;}
 .footer-top {align-items: flex-start;}
 .footer-nav {gap: 30rem;}
 #footer a {transition: var(--trans-01);}
 .copyright {color: var(--op-b20);}

 .footer-con {margin-top: 60rem;}
 .footer-info h2 {margin-bottom: 23rem;}
 .footer-info h2 a {display: inline-block;}
 .footer-info h2 a img {height: 50rem;}
 .footer-info address p:not(:last-child) {margin-bottom: 6rem;}
 .footer-info address span {position: relative; margin-right: 8rem; padding-right: 13rem; color: var(--op-b50);}
 .footer-info address span:not(:last-child)::after {position: absolute; right: 0; top: 50%; content:''; width: 1px; height: 14rem; background-color: var(--op-b10); transform: translateY(-50%);}
 .footer-info address a {color: var(--op-b50);}

 .footer-customer {min-width: 40%; align-items: flex-end; justify-content: space-between; width: auto !important;}
 .footer-customer ul {gap: 12rem;}
 .footer-customer ul a {display: block; width: 30rem; height: 30rem;}  
 .footer-customer ul img {max-width: 100%;}
 .footer-tel {width: auto !important; }
 .footer-tel a {position: relative; align-items: center; padding: 25rem; background: var(--w); white-space: nowrap;}
 .footer-tel p {position: relative; margin-right: 23rem; padding-right: 25rem; color: var(--op-b50);}
 .footer-tel p::after {position: absolute; right: 0; top: 50%; content:''; width: 1px; height: 40rem; background: var(--op-b10); transform: translateY(-50%);}
 .footer-tel p span {display: block; margin-top: 4rem; font-weight: 400;}
  .footer-tel strong {font-weight: 800;}


  @media (hover: hover) and (pointer: fine){
	.footer-nav a:hover {color: var(--c-primary);}
	.footer-info address a:hover {color: var(--b-title); text-decoration: underline;}
  }

  @media (max-width:1023px){
	.footer-info address p:not(:last-child) {margin-bottom: 0;}
	.footer-info address p:not(:first-child) span {display: block;}
	.footer-info address span {line-height: 1.8;}
	.footer-info address p:not(:first-child) span:not(:last-child)::after {display: none;}
	
	 .footer-customer {min-width: 30%;}
 	.footer-tel {width: 100% !important; }
	.footer-tel a {flex-direction: column; justify-content: center;  text-align: center;}
	.footer-tel a * {width: 100%;}
	.footer-tel p {margin-right: 0; padding-right: 0; padding-bottom: 15rem; margin-bottom: 15rem; border-bottom: 1px solid var(--op-b10);}
	.footer-tel p::after {display: none;}
  }


@media (max-width: 540px){
	#footer{padding-top: 30rem; padding-bottom:30rem;background-position:0 0;}
	.footer-nav {width: 100%; justify-content: center; gap: 20rem;}
	.footer-con {flex-direction: column; margin-top: 40rem; text-align: center;}
	.footer-info h2 {margin-bottom: 15rem;}
	.footer-info h2 a img {height: 45rem;}
	.footer-info address p:first-child span {margin-right: 5rem; padding-right: 9rem;}
	.footer-info address p:first-child span:last-child {margin-right: 0; padding-right: 0;}
	.footer-info address span:not(:last-child)::after {height: 12rem;}

	.footer-customer {min-width: auto; margin-top: 20rem;}
	.footer-customer ul {width: 100%; justify-content: center; margin-bottom: 25rem;}
	.footer-tel p span {margin-top: 1px;}
	.footer-tel a {padding: 20rem 20rem 22rem;}
	.copyright {margin-top: 12rem; text-align: center;}

}

/* **************************************** *
 * SCROLL TOP
 * **************************************** */
.quick-wrap {z-index: 1000;position: fixed;bottom: 50rem;right:30rem;visibility: visible;opacity: 1;width: 85rem;transform: translateY(0);transition: var(--trans-01);}
.quick-wrap.fixed.active{position:fixed;opacity:1;visibility:visible;top:auto;bottom:50rem; transform: translateY(0);}
.quick-wrap.active{position:absolute; opacity:1; visibility:visible; top:-50rem; bottom: auto; transform: translateY(-100%);}
.quick-wrap a {display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1/1; text-align: center;}

.quick-menu {overflow: hidden !important; position: relative; margin-bottom: 10rem; border-radius: 100rem;}
.quick-menu__btn {position: absolute; left: 0; bottom: 0; z-index: 31; background: var(--c-primary); border-radius: 100%;}
.quick-menu__btn span {font-size: var(--font-15); font-weight: 600; color: var(--w);}
.quick-menu__btn i {width: 22rem; height: 22rem; margin-bottom: 5rem;}
.quick-menu__btn i img {display: inline-block; max-height: 100%;}

.quick-menu__list {opacity: 0; visibility: hidden; padding: 20rem 0; padding-bottom: 95rem; border-radius: 100rem; background: var(--b-title); transform: translateY(100%); transition: var(--trans-01);}
.quick-menu.active .quick-menu__list {opacity: 1; visibility: visible; transform: translateY(0);}
.quick-menu__item span {font-size: var(--font-13); line-height: 1.3; color: var(--op-w50); transition: var(--trans-01);}
.quick-menu__item i {opacity: .4; width: 20rem; height: 20rem; margin-bottom: 10rem; transition: var(--trans-01);}
.quick-menu__item i img {display: inline-block; max-height: 100%;}

a.btn-top {font-size: 0; border-radius: 100%; border: 1px solid var(--b-title); background: var(--w); transition: var(--trans-01);}
a.btn-top::before{content:"";display:block; width: 20rem; height:20rem; background-image:url(../img/layout/arrow-top.svg); background-repeat: no-repeat; background-position: center; background-size: contain; transition: var(--trans-01);}

@media (hover: hover) and (pointer: fine){
	.quick-menu__item:hover i {opacity: 1;}
	.quick-menu__item:hover span {color: var(--w);}

	a.btn-top:hover {background: var(--b-title);}
	a.btn-top:hover::before {background-image: url(../img/layout/arrow-top_w.svg);}
}

@media (max-width:1023px){
	.quick-wrap {width: 75rem;}
	.quick-menu__list {padding-bottom: 85rem;}
	.quick-menu__item:first-child {margin-bottom: 5rem;}
	.quick-menu__btn span {font-size: 12rem;}
}

@media (max-width:540px){
	.quick-wrap{right: 12rem;bottom: 16rem;width: 60rem;}
	.quick-wrap.fixed.active{bottom: 20rem;}
	.quick-wrap.active{top: -20rem;}

	.quick-menu {margin-bottom: 5rem;}
	.quick-menu.hide {display: none;}
	.quick-menu__list {padding-bottom: 70rem;}
	.quick-menu__item:nth-child(1), .quick-menu__item:nth-child(2) {margin-bottom: 12rem;}
	.quick-menu__item i {margin-bottom: 7rem;}
	.quick-menu__store {display: flex !important; margin-bottom: 5rem; border: 1px solid var(--b-title); border-radius: 100%; background: var(--w);}
	.quick-menu__store i {width: 22rem; height: 22rem; margin-bottom:5rem; background: url(../img/layout/symbol.svg) no-repeat center / contain;}
	.quick-menu__store span {font-size: var(--font-13); font-weight: 500; color: var(--b-title);}
	.quick-menu__btn i {width: 17rem; height: 17rem; margin-bottom: 3rem;}
	.quick-menu__btn span {font-size: var(--font-13); font-weight: 500;}

	a.btn-top {width:60rem; height:60rem; background: var(--b-title);}
	a.btn-top::before {width: 14rem; height: 14rem; background-image: url(../img/layout/arrow-top_w.svg);}	
}