@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: #133065;color:#fff;}

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

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

/* **************************************** *
 * HEADER
 * **************************************** */
#header{position: fixed;z-index:51;width:100%;padding: 38rem 0;transition: background-color .4s, padding .4s, border-bottom-color .3s, transform .4s;/* transform:translateY(-100rem); */background-color: transparent;border-bottom: 1px solid transparent;}
#header.hide{transform: translateY(-100%) !important;}
#header h1{font-size:0; text-indent: -99999px; position: absolute; }
#header:has(#site-map.active){position:fixed;}

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

.header-inner{display:flex;justify-content:space-between;align-items:center;}

#logo{position:relative; z-index:81;}
#logo a{display:block;width: 186rem;height: 43rem;background-size: 100%;background-position:50% 50%;background-repeat:no-repeat;background-image:url(../img/layout/logo_w.svg);}
#logo img{height:47rem;}

#header.on{background-color: rgba(0, 0, 0, 0.25); backdrop-filter: blur(10rem);  border-bottom-color: var(--op-w10);}

/* global btn */
.lang-menu{gap:10rem;}
.lang-menu a{opacity: 0.5 !important;color:#fff;font-weight: 800;}
.lang-menu li.on a{opacity: 1 !important;}
.lang-menu .select-link{width: auto !important;}
.lang-menu img{height:24rem;}
.lang-menu i{/* display:none; */color: var(--w);}
.lang-menu .select-link__btn::after{/*display:none;*/background-image: url(../img/board/arrow-select_w.svg);position: relative;background-size: 12rem;}
.lang-menu .select-link__btn{display:flex; justify-content:center;}
.lang-menu .select-link > ul{width: 48rem; left: -10rem;}
.lang-menu .select-link > ul a{padding:0 15rem; font-size:13rem; text-align:center;}
.lnag-menu__icon{min-width: 20rem;height: 20rem;background-position:50% 50%;background-image:url(../img/common/ic-lang_w.svg);background-repeat:no-repeat;}

#header:is(.color-on, .on) .lang-menu a{color:#aaa;}
#header:is(.color-on, .on) .lang-menu li.on a{color:var(--c-primary);}
#header:is(.color-on, .on) .lnag-menu__icon{background-image:url(../img/common/ic-lang.svg);}
#header:is(.color-on, .on) .lang-menu i{color: var(--b-01);}
#header:is(.color-on, .on) .lang-menu .select-link__btn::after{background-image: url(../img/board/arrow-select.svg);}

/* 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;top: 10rem;}
#gnb .gnb-item{display:inline-block;position:relative;padding: 0 25rem;transition:var(--trans-01);}
#gnb .gnb-item:last-child:after{background:none;}
#gnb .gnb-item > a{display:inline-block;padding-bottom: 25rem;font-weight:500;color:#fff;font-size:18rem;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차메뉴 숨김 */

/* full gnb */
#gnb.gnb-full{top: 0;}
#gnb.gnb-full .gnb-item > a{position:relative; padding-bottom:0;}
#gnb.gnb-full .gnb-item .sub-menu{top:80rem; padding:0; background:none; border:0; box-shadow:none; transition:none;}
#gnb.gnb-full .gnb-item .sub-menu > li > a{padding:8rem 0rem; background:none; border:0; color:#666; text-align:center;}
#gnb.gnb-full .gnb-item.active .sub-menu{transition:all 0.4s ease-out; transition-delay:0.2s;}
#gnb.gnb-full .gnb-item > a::after{content:""; position:absolute; bottom:-41rem; left:0; width:100%; height:3px; background:var(--c-primary); transition:var(--trans-01); transform:scaleX(0);}
#gnb.gnb-full .gnb-item > a{position:static;}
#gnb.gnb-full .gnb-item:hover > a::after{transform:scaleX(1);}

#header::before{content:""; position:absolute; opacity:0; top:120rem; width:100%; height:1px; background:#eee; transition:var(--trans-01);}
#header.color-on::before{opacity:1;}
#header:is(.color-on, .on) #logo a{background-image:url(../img/layout/logo_w.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;*/}

/* inline gnb */
#header.color-on:has(.gnb-inline) .gnb-full-cover{height:185rem;}
#header:has(.gnb-inline) .gnb-full-cover{transition:all 0.3s ease;}
#gnb.gnb-inline .gnb-item .sub-menu{display:flex; left:0; width:auto; padding:0; background:none; border:0; white-space:nowrap;}
#gnb.gnb-inline .gnb-item .sub-menu > li > a{padding:0; background:none; border:0;}
#gnb.gnb-inline .gnb-item .sub-menu > li:not(:last-child){margin-right:20rem;}
#gnb.gnb-inline .gnb-item .sub-menu{display:flex; justify-content:center; top:85rem; box-shadow:none; transform:translateY(0rem); transform:translateX(-20rem);}
#gnb.gnb-inline .gnb-item > a{padding-bottom:0;}
#gnb.gnb-inline .gnb-item.active .sub-menu{transform:translateX(0rem);}

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

/* **************************************** *
 * 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 (max-width:1200px){

}

@media (min-width: 1024px){
	#gnb .gnb-item .sub-menu{display:none;position:absolute;opacity:0;visibility:hidden;top: 35rem; left: 50%; width: 100%; min-width: 170rem; padding:8rem 17rem;background: var(--op-b60);border:1rem solid #444;border-radius: 5rem;backdrop-filter: blur(12rem);box-shadow:15rem 20rem 29rem 0rem rgba(0, 0, 0, 0.23);transition:all 0.4s ease-out;transition-property: opacity, transform, visibility;transition-delay:0s, 0s, 0s;transform: translate(-50%,-20rem);}
	#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);padding:10rem 0rem;/* background:#fff; */border-top: 1rem solid var(--op-w10);color: var(--w);text-align:left;transition:var(--trans-01);font-size: 16rem;line-height: 1.4;}
	#gnb .gnb-item .sub-menu > li > a:hover{opacity:0.5;}
	#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{padding: 30rem 0;}
	#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;}

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

@media (max-width: 540px){
	#header{padding: 20rem 0;}
	#header.color-on #logo a, .scroll-hide #logo a{background-image: url(../img/layout/logo.svg) !important;}
	#logo a{width: 144rem;height:35rem;background-size: 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;}
}

/* **************************************** *
 * full page gnb site map
 * **************************************** */
#site-map{position:fixed;opacity:0;visibility:hidden;top:0;left:0;z-index:51;width:100%; height: 100dvh; transition: none;transition-delay:0.1s; background-color: var(--op-b60); backdrop-filter: blur(10rem);}
 #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;padding: 30rem 0;border-top: 1px dashed var(--op-b10);}
 #site-map.active .gnb-item:nth-child(1){transition-delay:100ms; border-top: 0;}
 #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:has(.non-full){display:flex; justify-content:flex-end; right:0; left:auto; width:100%;}
#site-map:has(.non-full) .site-map-inner{display:flex;width:100%;margin:0;padding: 35rem 45rem;background:var(--w);max-width: 974rem;border-radius: 5rem;height: 581rem;position: relative;top: 98rem;right: 50rem;justify-content: space-between;}

 .site-map-inner{display:flex;align-items:center;height:100%;padding: 0 60rem;background: var(--w);}
 .site-map-list .gnb-item > a{font-weight:700;font-size: 27rem;color: var(--b-01);font-family: var(--lang-ko); position: relative; transition: var(--trans-01);}
 .site-map-list .gnb-item > a::before{content: ""; opacity: 0; transition: var(--trans-01); width: 8rem; height: 8rem; background-color: var(--c-primary); position: absolute; left: 0; top: 8rem;}
 .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;max-width: 440rem; width: 100%;}
 .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-left:30rem;}
 .site-map-list .sub-menu a{transition:var(--trans-01);padding: 5rem 0rem;font-size: 16rem;}
 .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-top:15rem; margin-left: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;margin-right: 23rem;}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li:last-child{margin-right: 0;}
 .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); */padding-left: 20rem;}
 .site-map-list.row-drap .gnb-item > a.active::before{opacity: 1;}
.site-map__cancle{position:absolute; top:40rem; right:40rem;}

 .gnb-full-icon{position:relative; width:30rem; height:17rem;}
 .gnb-full-icon > span{display:inline-block; position:absolute; left:0; width:100%; height:3rem; background:#FFF; 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 .text::after{content:"MENU"; display:block; margin-top:6rem; font-weight:700;}
 .gnb-full-btn.active .text::after{content:"CLOSE";}
 .gnb-full-btn.active .border-01{transform:translateX(0) translateY(9rem) rotate(45deg) !important;}
 .gnb-full-btn.active .border-02{opacity:0;}
 .gnb-full-btn.active .border-03{transform:translateX(0px) translateY(-5rem) rotate(-45deg) !important;}
 .gnb-full-btn-wrap{position:relative; z-index:100;}
 .gnb-full-btn.active .gnb-full-icon > span{background:var(--b-01);}
 .gnb-full-btn{display:flex;align-items:center;flex-direction:column;cursor: pointer;}
 .gnb-full-btn.active .text,
 #header:is(.color-on, .on) .gnb-full-btn .text{color:var(--b-01);}
 .gnb-full-btn.active .gnb-full-icon > span,
 #header:is(.color-on, .on) .gnb-full-icon > span{background:var(--b-01);}
 #header:has(#site-map.active):not(:has(.non-full)) #logo a{background-size:100%; background-image:url(../img/layout/logo.svg);}
  .gnb-full-btn-wrap:has(.gnb-full-btn.active){/* z-index:1; */position: fixed;right: 50rem;top: 23rem;}

.site-map--video{width: 349rem; height: 100%; overflow: hidden; border-radius: 11rem; position: relative;}
.site-map--video strong{color: var(--w);font-size: 30rem;font-family: var(--lang-en);font-weight: 600;position: absolute;bottom: 33rem;left: 33rem;line-height: 1.3;}
.site-map--video video{width: 100%; height: 100%; object-fit: cover;}
  
@media (max-width:1023px){
	.gnb-full-btn-wrap{display: none;}
	.gnb-full-btn-wrap.mob{display:block;}
    body.fixed #header .header-inner{position: fixed; top: 0; left: 0; z-index: 100; width: 100%;}
	body:has(.gnb-full-btn-wrap.mob) .gnb-mobile-btn{display:none;}
	.site-map-list, .site-map-list a, .sub-menu, .sub-menu > li a { width: 100%;  display: block;}
	.site-map-list.site-map--colum{display:flex; flex-direction:column; text-align:left;}
	.site-map-list.site-map--row{max-width: inherit}
	#site-map:has(.non-full) .site-map-inner{max-width:100%; right:0; top:0; height:100dvh; border-radius:0; flex-direction:column; justify-content:flex-start; padding:80rem 30rem 40rem; overflow-y:auto;}

    .site-map--video{width: 100%; height: 29dvh;}
    .site-map--video strong{font-size:22rem; bottom:22rem; left:22rem;}
    .site-map-inner{flex-direction: column; justify-content: center;  justify-self: unset;color: #000; padding: 60rem;}

    .gnb-full-btn-wrap:has(.gnb-full-btn.active){right: 20rem; top: 13rem;}
    .header__toggle{width: 44rem; height: 44rem;}
}

@media (max-width:1023px) and (orientation:landscape){
    #site-map:has(.non-full) .site-map-inner{flex-direction:row; padding:60rem 20rem 20rem; gap:24rem;}
    .site-map-inner{flex-direction:row;  gap: 60rem;}

    .site-map--video{min-width:380rem; height:100%; flex:1;}
    .site-map--video strong{font-size:20rem; bottom:18rem; left:18rem;}
}

@media (max-width:540px){
	.site-map-inner{padding: 68rem 20rem 20rem; justify-content: flex-start;}
    .gnb-full-btn-wrap:has(.gnb-full-btn.active){position: relative;}
	.gnb-full-btn-wrap:has(.gnb-full-btn.active) {right: 0;top: 0}
    .site-map--video{height: 20dvh;}
    #site-map.active .gnb-item{padding: 20rem 0;}
    .site-map-list .sub-menu a{padding: 2rem 0;}
    .site-map-list .gnb-item > a{font-size: 20rem;}
    .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li{display: block; margin-right: 0;}
    
}

/* **************************************** *
 * footer
 * **************************************** */
#footer *{color:#fff;}

#footer{position:relative; border-top: 1px solid var(--br-light); z-index:50; background:#111723;  padding:78rem 50rem 32rem; margin-top:0;}
#footer > *:not(img){z-index: 1;}

.footer-logo{margin-bottom: 82rem; display: inline-block; position: relative;}
.footer-logo img{height: 37rem;}
.footer-tel{font-size: 38rem; font-family: var(--lang-en); font-weight:600;  display: block; margin-bottom: 17rem;}
.footer-info{position: absolute; right: 249rem; top: 91rem; text-align: right;}
.footer-info address *{font-size: 15rem;  font-family: var(--lang-ko); color: var(--op-w50) !important; position: relative;}
.footer-info address span + span{margin-left: 36rem;}
.footer-info address span + span::before{content: ""; width: 1px; height: 12rem; background-color: var(--op-w10); position: absolute; left: -18rem; top: 4rem;}

.footer-menu__list{gap: 19rem;}
.footer-menu__list a{font-size:14rem; color: var(--op-w50) !important;}
.footer-menu__list li{}

.footer-bottom{justify-content: space-between; margin-top: 185rem; position: relative;}
.footer-copyright{color: var(--op-w50) !important; font-size:14rem; font-family: var(--lang-en);}

.footer-mark{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);z-index: -1;}

@media (hover: hover) and (pointer: fine){
	.footer-menu a:hover{opacity:0.6;}
}

/* footer sitemap */
.footer-gnb{padding-bottom: 30rem;}
.footer-gnb__menu{display:inline-flex; text-align: left; gap:54rem; }
.footer-gnb__menu .sub-menu{display: none;}
.footer-gnb__menu .gnb-item > a{display:block; position: relative; font-weight:400;font-size: var(--default); font-family: var(--lang-ko); }
.footer-gnb__menu .gnb-item:nth-child(1) > a::before{display: none;}
.footer-gnb__menu .gnb-item > a::before{content: "";width: 1px;height: 12rem;background-color: var(--op-w10);position: absolute;left: -28rem;top: 8rem;}
.footer-gnb__menu .gnb-item .sub-menu a{display:block;opacity:0.5;padding:6rem 0rem;font-weight:400;transition: var(--trans-01);}
.footer-gnb__menu .gnb-item .sub-menu a:hover{opacity: 1;}
.footer-gnb__menu .sub-menu-depth{display:none;}


/* ============================== UTi FOOTER ============================== */
.footer__inner{display:flex; justify-content:space-between; align-items:flex-start; padding:78rem 0 60rem; position:relative;}
.footer__left{display:flex; flex-direction:column;}
.footer__logo{display:block; width:131rem; height:41rem; background-image:url(../img/common/logo_w.svg); background-size:contain; background-repeat:no-repeat;}
.footer__tel{font-family:var(--lang-en); font-size:38rem; font-weight:700; line-height:1; margin-top:30rem; color:var(--w);}
.footer__desc{font-size:17rem; line-height:28rem; color:var(--w); margin-top:12rem;}
.footer__right{display:flex; flex-direction:column; align-items:flex-end; gap:30rem;}
.footer__nav ul{display:flex; align-items:center;}
.footer__nav li{position:relative;}
.footer__nav li+li{padding-left:26rem;}
.footer__nav li+li::before{content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:12rem; background:rgba(255,255,255,0.2);}
.footer__nav a{font-size:17rem; font-weight:500; font-family:var(--lang-ko); color:var(--w);}
.footer__address{display:flex; flex-direction:column; gap:8rem; align-items:flex-end;}
.footer__address-row{display:flex; align-items:center; gap:20rem; font-size:15rem; color:rgba(255,255,255,0.3); font-family:var(--lang-ko); font-weight:500; font-style:normal;}
.footer__address-row li+li{position:relative; padding-left:20rem;}
.footer__address-row li+li::before{content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:12rem; background:rgba(255,255,255,0.2);}
.footer__scroll-top{position:absolute; right:0; top:89rem; display:flex; align-items:center; justify-content:center; width:52rem; height:52rem; border:1px solid rgba(255,255,255,0.16); border-radius:5rem; background:transparent; cursor:pointer;}
.footer__scroll-top::after{content:""; display:block; width:9rem; height:9rem; border-top:1.5rem solid rgba(255,255,255,0.6); border-right:1.5rem solid rgba(255,255,255,0.6); transform:rotate(-45deg); margin-top:4rem;}
.footer__bottom{border-top:1px solid rgba(255,255,255,0.05);}
.footer__bottom-inner{display:flex; justify-content:space-between; align-items:center; padding:22rem 0;}
.footer__copy{font-size:14rem; color:rgba(255,255,255,0.5);}
.footer__policy{display:flex; align-items:center; gap:19rem;}
.footer__policy a{font-size:14rem; color:rgba(255,255,255,0.5);}

/* footer 반응형 */
@media (max-width:1600px){
    #footer{padding:70rem 50rem 30rem;}
    .footer-info{right:180rem;}
    .footer__inner{padding:70rem 0 55rem;}
}

@media (max-width:1480px){
    #footer{padding:60rem 50rem 28rem;}
    .footer-info{right:160rem; top: 50rem;}
    .footer-gnb__menu{gap:40rem;}
    .footer__inner{padding:60rem 0 50rem;}
}

@media all and (max-width:1200px){
    #footer{padding:60rem 40rem 28rem;}
    .footer-logo{margin-bottom: 52rem;}
    /* position absolute → static으로 전환 — 콘텐츠 겹침 방지 */
    .footer-info{position:static; text-align:left; margin-top:50rem;}
    .footer-info address span + span{margin-left:24rem;}
    .footer-gnb__menu{gap:30rem;}
    .footer-bottom{margin-top:100rem;}
    .footer__inner{padding:60rem 0 44rem;}
    .footer__tel{font-size:30rem;}
}

@media all and (max-width:1023px){
    #footer{padding:50rem 40rem 24rem;}
    .footer-info{margin-top:16rem;}
    .footer-gnb__menu{gap:24rem; flex-wrap:wrap;}
    .footer-bottom{margin-top:80rem;}
    .footer__inner{padding:50rem 0 40rem; flex-direction:column; gap:40rem;}
    .footer__right{align-items:flex-start;}
    .footer__address{align-items:flex-start;}
    .footer__scroll-top{top:50rem;}
    .footer-mark{max-width: 100%;}
}

@media (max-width:860px){
    #footer{padding:44rem 30rem 20rem;}
    .footer-logo{margin-bottom:40rem;}
    .footer-tel{font-size:28rem; margin-bottom:12rem;}
    .footer-gnb{padding-bottom:20rem;}
    .footer-gnb__menu{gap:20rem;}
    .footer-bottom{margin-top:60rem;}
    .footer__tel{font-size:28rem;}
    .footer__desc{font-size:15rem;}
    .footer__nav a{font-size:15rem;}
    .footer__address-row{font-size:14rem; gap:14rem;}
    .footer__scroll-top{width:44rem; height:44rem; top:44rem;}
}

@media (max-width:540px){
    #footer{padding:36rem 20rem 16rem;}
    .footer-logo{margin-bottom:24rem;}
    .footer-logo img{height: 23rem;}
    .footer-tel{font-size:24rem;}
    .footer-gnb{display: none;}
    .footer-bottom{margin-top:28rem;}
    .footer__inner{padding:40rem 0 30rem; gap:30rem;}
    .footer__tel{font-size:24rem;}
    .footer__address-row{flex-wrap:wrap; gap:8rem;}
    .footer__bottom-inner{flex-direction:column; align-items:flex-start; gap:10rem;}
    .footer__scroll-top{display:none;}
    .footer-info address * {font-size: 13rem;}
    .footer-info address span + span{margin-left: 14rem;}
    .footer-info address span + span::before{left: -9rem; top: 3rem;}
    .footer-bottom{flex-direction: column;}
    .footer-bottom *{font-size: 13rem;}
    
    .footer-menu__list li:last-child{display: none;}
    .footer-info address br{display: none;}
}


/* **************************************** *
 * SCROLL TOP
 * **************************************** */
.btn-top-wrap{position: fixed;bottom: 50rem;right:50rem;visibility: hidden;opacity: 0;transition: var(--trans-01);}
.btn-top-wrap.fixed.active{position:fixed;opacity:1;visibility:visible;top:auto;bottom:50rem;}
.btn-top-wrap.fixed{}
.btn-top-wrap.active{position:absolute; opacity:1; visibility:visible;  top: 89rem;}
a.btn-top{display:flex;align-items:center;flex-direction:column;transition: var(--trans-01);width: 65rem;height: 65rem;justify-content: center;border-radius: 5rem;border:1px solid rgba(255,255,255,0.16);position: relative;}

@media (hover: hover) and (pointer: fine){
    a.btn-top:hover{border-color: var(--c-primary);}
    a.btn-top:hover svg path{stroke: var(--c-primary);}
}

@media (max-width:1480px){
    .btn-top-wrap{right:30rem; bottom:40rem;}
    .btn-top-wrap.fixed.active{bottom:40rem;}
    a.btn-top{width:60rem; height:60rem;}
      a.btn-top svg{width:12rem;}
}

@media (max-width:1023px){
    .btn-top-wrap.active{top:40rem}
    .btn-top-wrap{right:20rem; bottom:30rem;}
    .btn-top-wrap.fixed.active{bottom:30rem;}
    a.btn-top{width:56rem; height:56rem;}
  
}

@media (max-width:540px){
    .btn-top-wrap.active{top: 30rem;}
    .btn-top-wrap{right:16rem; bottom:20rem;}
    .btn-top-wrap.fixed.active{bottom:20rem;}
    a.btn-top{width:50rem; height:50rem;}
    a.btn-top svg{width:11rem;}
}


/* ==============================
   UTi HEADER
============================== */
#header{padding:0; border-bottom-color:rgba(255,255,255,0.1);}
#header .header-inner{padding:23rem 50rem;}

/* 헤더 좌우 그룹 */
.header__left{display:flex; align-items:center; gap:26rem;}
.header__right{display:flex; align-items:center; gap:36rem;}

/* 로고 */
#logo a{width:110rem; height:34rem; background-image:url(../img/layout/logo_w.svg);}
#header:is(.color-on, .on) #logo a{background-image:url(../img/layout/logo_w.svg);}

/* PC GNB */
#gnb{top:0;}
#gnb .gnb-item{padding:0 31.5rem;}
#gnb .gnb-item > a{font-size:18rem; font-weight:700; color:var(--w); padding-bottom:0;}
/* #header.on #gnb .gnb-item > a,
#header.color-on #gnb .gnb-item > a{color:#111;} */


/* 다국어 — 아이콘만 표시 */
#header .lang-menu i{display:none;}
#header .lang-menu .select-link__btn::after{display:none;}
#header .lnag-menu__icon{width:26rem; height:26rem; background: #fff; mask:url(../img/common/ic-lang_w.svg); mask-size: cover;}
#header:is(.on,.color-on) .lnag-menu__icon{background:var(--w)}

/* UTi 커스텀 토글 버튼 */
.header__toggle{transition: var(--trans-01); display:flex; flex-direction:column; align-items:center; justify-content:center; width:54rem; height:54rem; background:var(--c-primary); border-radius:2rem; gap:8rem; border:none; cursor:pointer;}
.header__toggle *{transition: var(--trans-01);}
.header__toggle-row{display:flex; align-items:center; gap:3rem; width:24rem; height:3rem;}
.header__toggle-row em{display:block; height:3rem; background:#fff;}
.header__toggle-row em:not(.dot){flex:1 0 0;}
.header__toggle-row em.dot{width:3rem; min-width:3rem;}

.header__toggle.active{gap: 0;}
.header__toggle.active .header__toggle-row{gap: 0;}
.header__toggle.active .header__toggle-row em.dot{width: 0; min-width: 0;}
.header__toggle.active .header__toggle-row--1{margin-top: 3rem;}
.header__toggle.active .header__toggle-row--2{margin-top: -3rem;}


@media (max-width:1023px){
    #header .header-inner{padding:15rem 20rem;}
    /* base의 .lang-menu{position:absolute} 오버라이드 — header__right flex 유지 */
    #header .lang-menu{position:static;}
    .header__right{gap:20rem;}
}

@media (max-width:540px){
    #header .header-inner{padding:12rem 12rem;}
    #logo a{width:80rem; height:25rem;}
    .header__right{gap:15rem;}
    .header__toggle{width:44rem; height:44rem;}
}