@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;}

/* scroll set */
::selection{background:#af212d;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: 35rem 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;}
#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:200rem;height:25rem;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: #fff;padding:20rem 0;border-bottom-color: #eee;}

.sub #header{border-color:#eee; padding:13.5rem 0; background:#fff;}

/* 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: 60rem;}
.lang-menu img{height:24rem;}
.lang-menu i{/* display:none; */color: var(--f-01);}
.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 a{padding:3rem 15rem; font-size:13rem; text-align:center;}
.lnag-menu__icon{width: 35rem;height: 35rem;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-01);}
#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-container-wrap {margin-left: auto;margin-right: 50rem;}
.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:20rem 0; box-sizing:border-box; font-weight:500; color:#fff; font-size:18rem; transition:var(--trans-01);}
#gnb .gnb-item .sub-menu > li.on > a{color: var(--c-01) !important; }
#gnb .gnb-item > a.on{color: var(--c-01) !important;}

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

/* full gnb */
#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-01); 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,
.sub #header #logo a{background-image:url(../img/layout/logo.svg);background-size: 100%;}
#header.color-on .gnb-full-cover{opacity:1;visibility:visible;height: 750rem;}
#header:is(.color-on, .on) #gnb .gnb-item > a,
.sub #header #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 .border-wrap{display:grid; grid-template-columns: 1fr 1fr; gap:5rem;}
.gnb-mobile-btn div > span{display:inline-block;width:4px; height:4px; background:#000; border-radius:100rem;; transition:all 0.3s;}
.gnb-mobile-btn div > span:nth-child(5){position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); opacity:0;}
/*.gnb-mobile-btn span{display:block; position:relative; width:100%; height:3px; background:#fff; transition:all 0.4s ease;}*/
.gnb-mobile-btn .inner{display:flex; flex-direction: column; justify-content: center; align-items: center; width:40rem;height:40rem; background:#fff; border-radius:50rem; transform: rotate(0); transition: all 0.4s ease;}
#header.on .gnb-mobile-btn .inner{background:#111;}
#header.on .gnb-mobile-btn div > span{background:#fff;}
.sub .gnb-mobile-btn .inner{background:#111;}
.sub .gnb-mobile-btn div > span{background:#fff;}
.gnb-mobile{position:fixed;opacity:0;visibility:hidden;overflow:hidden;top:0;right: 0;width:100%;height:100vh; padding:10rem; box-sizing:border-box; background:rgba(0, 0, 0, 0.7); backdrop-filter: blur(5.5rem); 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:25rem;color: var(--b-01);}
.gnb-mobile-menu{width:100%; height:100%; box-sizing:border-box; padding:65rem 40rem 30rem 40rem; border-radius:15rem; background:#fff; text-align:left; 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-01);}
.gnb-mobile-menu .gnb-item.active{padding-bottom:15rem;}
.gnb-mobile-menu .sub-menu li a{font-size:18rem;display: block; color:#888;}
.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:none;}
.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-01);}
.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:1800px){
	.gnb-container-wrap{margin-right:30rem;}
	#gnb .gnb-item{padding: 0 20rem;}
}
@media (max-width:1700px){
	#header .wrap-wide{margin:0 40rem;}
	.gnb-container-wrap{margin-right:20rem;}
	#gnb .gnb-item{padding: 0 15rem;}
}
@media (max-width:1600px){
	#gnb .gnb-item > a{font-size:17rem;}
}
@media (max-width:1480px){
	#header .wrap-wide{margin:0 30rem;}
	#gnb .gnb-item{padding: 0 10rem;}
	#gnb .gnb-item > a{font-size:16rem;}
}

@media (max-width:1200px){
	#logo a{width:170rem;}
	.gnb-container-wrap{margin-right:10rem;}
	#gnb .gnb-item{padding: 0 6rem;}
	#gnb .gnb-item > a{font-size:16rem;}
}

@media (min-width: 1024px){
	#gnb .gnb-item .sub-menu{display:none;position:absolute;opacity:0;visibility:hidden;top:55rem; left:50%; width:100%; min-width:160rem; padding:8rem 17rem;background:#fff; border-radius:15rem; 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:8rem 0rem;background:#fff; color:#404040; text-align:center;transition:var(--trans-01);}
	#gnb .gnb-item .sub-menu > li > a:hover{color:var(--c-01);}
	#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: 20rem 0;}
	#header.on{padding:8rem 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{background:var(--c-01); transform: rotate(180deg);}
	.gnb-mobile-btn.active span{background:#fff;}
	.gnb-mobile-btn.active{top:0; right:15rem;}
	.gnb-mobile-btn.active div > span:nth-child(5){opacity: 1;}
	
	.gnb-mobile{display: flex; justify-content: flex-end;}
	.gnb-mobile-menu{width:450rem; border-radius:20rem;}
	.gnb-mobile__copy{width:450rem;}
	/*.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:5rem 0;}
	#header.on{padding:0;}
	.sub #header{padding:0;}
	#header.color-on,
	.sub #header.color-on{padding:10rem 0;}
	

	#header .wrap-wide{margin:0 20rem;}
	#header.color-on .wrap-wide{margin:0 30rem;}
	#header.color-on #logo a, .scroll-hide #logo a{background-image: url(../img/layout/logo.svg) !important;}
	#logo a{width:130rem; background-size: 100%;}

	.gnb-mobile{padding:5rem;}
	.gnb-mobile-menu{border-radius:15rem; padding: 85rem 20rem 30rem 20rem;}
	.gnb-mobile__copy{width:100%;}
	.gnb-mobile-btn .border-wrap{gap:3rem; }
	.gnb-mobile-btn .inner{width:30rem;height:30rem;}
	.gnb-mobile-btn.active{right:0;}
	.gnb-mobile-btn.active .inner{}
	.gnb-mobile-btn div > span{width:3px; height:3px;}
	.gnb-mobile-btn.active .border-wrap{gap:5rem;}
	/*
	.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:19rem;}
	.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: 10rem;}	
	.gnb-mobile-menu .sub-menu{display:none; margin-top:14rem; padding-left:10rem;}

	.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:100vh; padding:10rem; box-sizing:border-box; background:rgba(0, 0, 0, 0.7); backdrop-filter: blur(5.5rem); transition:var(--trans-01); transition-delay:0.1s;}
 #site-map.active{opacity:1; visibility:visible; transition-delay:0s;}
 #site-map.active .gnb-item{opacity:1; transform:translateY(0rem);}
 #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-inner{ height:100%; position: relative; background-color:#fff; margin-left: auto; border-radius:30rem ; width: 100%; max-width:500rem; padding:100rem 70rem;}
 .site-map-list .gnb-item > a{font-weight:700; font-size:21rem; color:#222;}
 .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; gap:40rem;}
 .site-map-list.site-map--row :is(.gnb-item, .sub-menu){display:flex; align-items:center;}
 .site-map-list.site-map--row .sub-menu{margin-left:30rem;}
 .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-01);}
 .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-top:10rem;}
 .site-map-list.site-map--row.row-drap .gnb-item .sub-menu > li{display: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-01);}
 
 .gnb-full-icon{position:relative; width:46rem; height:46rem; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 50rem; background:#fff; transform:rotate(0); transition:all 0.4s ease;}
 .gnb-full-icon div{gap:5rem;}
 .gnb-full-icon div > span{display:inline-block;width:4px; height:4px; background:#000; border-radius:100rem;; transition:all 0.3s;}
 .gnb-full-btn .border-05{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); opacity:0;}
 /*.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.active .gnb-full-icon{transform:rotate(180deg); background:var(--c-01);}
 .gnb-full-btn.active .gnb-full-icon > div{gap:8rem;}
 .gnb-full-btn.active .gnb-full-icon div > span{background:#fff;}
 .gnb-full-btn.active .border-05{opacity:1;}
 .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) #logo a{background-size:100%; background-image:url(../img/layout/logo.svg);}
  
 #header.on .gnb-full-icon,
 .sub #header .gnb-full-icon{background:#111;}
 #header.on .gnb-full-icon div > span,
 .sub #header .gnb-full-icon div > span{background:#fff;}


 .btn-cs{display: flex; margin-right:5rem; width: 130rem; height: 46rem; padding: 1rem 10rem; justify-content: center; align-items: center; gap: 10rem; border-radius: 45px; border:1px solid transparent; background: var(--c-01); transition:all 0.3s ease;}
 .btn-cs span{ color: var(--f-01); font-size: 15rem; font-style: normal; font-weight: 600; line-height: normal; text-transform: capitalize; transition:all 0.3s ease;}
 .btn-cs:hover{background:transparent; border:1px solid #fff;}
 .btn-cs:hover span{color:#fff;}
 .sub .btn-cs:hover{border:1px solid var(--c-01);}
 .sub .btn-cs:hover span{color:var(--c-01);}

 .btn-pd{display:flex; margin-right:5rem; width:160rem; height:55rem;  border:1px solid transparent; }
 .btn-pd a{display:flex; align-items: center; width:100%; height:100%; padding: 1rem 22rem; border-radius: 45px; overflow:hidden; background: var(--c-01); transition:all 0.3s ease;}
 .btn-pd span{position:relative; display:block; width:100%; color: var(--f-01); font-size: 15rem; font-style: normal; font-weight: 600; line-height: normal; text-transform: capitalize; transition:all 0.3s ease;}
 .btn-pd span:before{content:''; position:absolute; top:0; right:0; width:14rem; height:14rem; background:url(../img/sub/ic-cs.svg)no-repeat center; background-size:contain;}
 .btn-pd:hover a{background:#222;}


@media (max-width:1200px){
	.btn-cs{width:110rem; height:40rem;}
	.gnb-full-icon{width:40rem; height:40rem;}
}
@media (max-width:1023px){
	.gnb-full-btn-wrap{display: none;}
	.btn-cs{margin-left:auto;}
}
@media (max-width:540px){
	.btn-cs{width:84rem; height:30rem;}
	.btn-cs span{font-size:12rem;}

	.btn-pd{width:100rem; height:35rem;}
	.btn-pd a{padding:1rem 15rem;}
	.btn-pd span{font-size:12rem;}
	.btn-pd span:before{top:3rem; width:10rem; height:10rem;}
}

/* **************************************** *
 * footer
 * **************************************** */

#footer{position:relative;z-index: 50; padding:100rem 0 60rem; margin-top:100rem; width:100%; background:url(../img/layout/bg-ft.jpg)no-repeat center; background-size:cover; box-sizing:border-box;}
.sub01_01:not(.policy) #footer{margin:0;}
#footer .txt{position:relative; text-align:center; padding-bottom:130rem;}
#footer .txt > h3{display:block; font-size:var(--font-55); font-weight:700; color:#fff; line-height:1.3em; word-break:keep-all;}
#footer .txt .btn-basic{margin:30rem 0 0;}



.logo-txt{position:absolute; left:0; right:0; bottom:-65rem; font-size: 180rem; font-weight: 700; line-height:1em; background: linear-gradient(0deg, rgba(255, 255, 255, 0.00) 29.55%, rgba(255, 255, 255, 0.4) 122.73%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 0 4px 15px rgba(0, 0, 0, 0.10); cursor:default;}


.footer-box{position:relative; margin:0 78rem; padding-top:60rem; background:#fff; border-radius:30rem; box-sizing:border-box;}
.footer-box:before{content:''; width:100%; height:106rem; background:url(../img/layout/ft-txt.svg)no-repeat center; background-size:contain; z-index:2;}
.footer-box__top{display:flex; height:260rem;}
.footer-box__top > div{position:relative; flex:1;}
.footer-box__top > div:before{content:''; position:absolute; top:0; left:0; width:1px; height:100%; background:#eee;}
.footer-info{display:flex; flex-direction: column; justify-content: space-between;}
.footer-info:before{display:none;}
.footer-info .footer-logo img{height:25rem;}
.footer-info .footer-cs{}
.footer-info .footer-cs > em{display:inline-block; margin-bottom:10rem; font-size:var(--font-16); font-weight: 700; color: var(--c-01); line-height:1em;}
.footer-info .footer-cs > a{display:block; font-size:var(--font-43); font-weight: 700; color:#111; line-height:1em;}
.footer-info .footer-cs > p{display:block; margin-top:14rem; font-size:var(--font-15); font-weight:400; color:#555; line-height:1em; word-break:keep-all;}
.footer-addr{display:flex; flex-direction: column; justify-content: space-between;}
.footer-addr em{display:inline-block; font-size:var(--font-16); font-weight: 700; color: var(--c-01); line-height:1em;}
#footer address{padding-left:50rem; font-family: var(--lang-ko);font-size:var(--font-16);font-weight: 300; color:#111; box-sizing:border-box;}
#footer address p{margin-top:22rem;}
#footer address p span{display:block; line-height:1em; margin-bottom:20rem;}
#footer address p span:last-child{margin:0;}
.footer-menu{padding-left:50rem; box-sizing:border-box;}
.footer-menu a{font-size:14rem; color:#8a8a8a;  font-weight:600; transition: all 0.3s ease;}
.footer-menu li{position:relative; margin-right:20rem;}
.footer-menu li:after{content:''; position:absolute; top:11rem; right:-12rem; width:2px; height:2px; border-radius:10rem; background:#8a8a8a;}
.footer-menu li:last-child:after{display:none;}


.footer-sns{position:absolute; top:0; right:0; gap:10rem;}
.footer-sns > li{width:35rem; height:35rem; transition:all 0.3s ease;}
.footer-sns > li > a{display:flex; justify-content: center; align-items: center; width:100%; height:100%; background:#e9e9e9; border-radius:50rem; box-sizing:border-box;}
.footer-sns > li.youtube > a:hover{background:#E7211B;}
.footer-sns > li.insta{background:url(../img/common/bg-insta.jpg)no-repeat center; background-size:cover;}


.footer-box__bottom{display:flex; align-items: center; justify-content: center; text-align:center; border-top:1px solid #eee; margin-top:40rem; height:80rem;}
.footer-copyright{font-size:var(--font-16); color:#999; font-weight:400;}
.footer-copyright i{color:#111; font-weight:700;}

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

/* footer sitemap */
.footer-gnb{}
.ft-menu{padding-left:50rem; box-sizing:border-box; text-align: left;}
.ft-menu li a{display:block;margin-bottom:26rem;font-weight:600;font-size:var(--font-16); color:#111;}
.footer-gnb__menu .sub-menu{display:none;}
.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;}

@media (max-width: 1200px){
	.footer-addr{padding:0 0 0 30rem;}
	#footer address,
	.footer-menu{padding-left:0;}
	.ft-menu{padding-left:30rem;}
	.logo-txt{font-size:145rem; bottom:-50rem;}

}
@media (max-width: 1023px){
	.footer-box{margin:0 40rem;}
	.footer-gnb{display:none;}
	.logo-txt{font-size:120rem; bottom:-50rem;}
}
@media (max-width:860px){
	#footer{padding:60rem 0 30rem; margin-top:60rem;}
	#footer .txt{padding-bottom:75rem;}
	#footer .txt .btn-basic{margin:20rem 0 0;}
	.logo-txt{font-size:90rem; bottom:-25rem;}
	.footer-box{padding-top:45rem; margin:0 30rem; border-radius:25rem;}
	.footer-info .footer-logo img{height:20rem;}
	.footer-box__bottom{height:70rem;}
}
@media (max-width: 540px){
	#footer{padding:40rem 0 20rem; margin-top:40rem;}
	#footer .txt{padding-bottom:45rem;}
	#footer .txt .btn-basic{margin-top:12rem;}
	.footer-box{padding-top:20rem; margin:0 15rem; border-radius:15rem;}
	.footer-box__top{display:block; height:auto;}
	.footer-box__top > div:before{width:100%; height:1px;}
	.footer-info .footer-logo img{height:17rem;}
	.footer-info .footer-cs{margin-top:20rem;}
	.footer-info .footer-cs > em{margin-bottom:5rem;}
	.footer-info .footer-cs > p{margin-top:7rem;}
	.footer-addr{padding:15rem 0 0; margin-top:15rem;}
	#footer address p{margin-top:15rem;}
	#footer address p span{margin-bottom:10rem;}
	.footer-menu{margin:14rem 0 0;}
	.footer-menu li{margin-right:10rem;}
	.footer-menu a{font-size:11rem;}
	.footer-menu li:after{top:10rem; right:-6rem;}

	.logo-txt{font-size:46rem; bottom:-13rem;}

	.footer-box__bottom{margin-top:15rem; height:40rem;}
}

/* **************************************** *
 * SCROLL TOP
 * **************************************** */
a.btn-top{display:flex;align-items:center;position: fixed;bottom:30rem; right:30rem; font-family:var(--lang-en);font-size: 12rem;flex-direction:column;align-content:center;visibility: hidden;opacity: 0;transition: var(--trans-01);background: var(--c-01);bottom: 50rem;width:63rem;height:63rem;justify-content: center;border-radius: 100%;font-weight: 700; z-index:10;}
a.btn-top i{position:relative; margin-bottom:10rem;}
a.btn-top.fixed.active{position:fixed;opacity:1;visibility:visible;top:auto;right:30rem; bottom:30rem;}
a.btn-top.active{position:absolute; opacity:1; visibility:visible; right:30rem;}
a.btn-top::before{content:"";display:block; width:15rem; height:15rem; background:url(../img/common/ic-top-arr.svg) no-repeat 50% 50%; background-size:contain; }

@media (max-width: 860px){
	a.btn-top{width:53rem; height:53rem; bottom:15rem;}
	a.btn-top.active{right:15rem;}
	a.btn-top.fixed.active{right:20rem; bottom:20rem;}
}

@media (max-width:540px){
	a.btn-top{right:10rem; bottom:10rem; width:36rem; height:36rem; font-weight:700; font-size:10rem; }
	a.btn-top::before{background-size:10rem;margin-bottom: 2rem;}
	a.btn-top.active{top:15rem; right:15rem; bottom:unset;}
	a.btn-top.fixed.active{right:10rem; bottom: 10rem;	}
}