@charset "utf-8";

/* root */
:root{
	--c-bs:#666;
	--c-bd:#0b0b0b;
	--c-01:#235cf2;
	--ani-bs:all 0.4s ease;
	--ani-lz:all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); 
	--font-k:"Pretendard";
	--font-e:'Teko';
}

/* motion */
[data-motion]:not([data-motion="trans"]):not(.area_sns){opacity:0;transition:transform 1600ms ease, opacity 1300ms ease;transform-style:preserve-3d;}
[data-motion]:not([data-motion="trans"]).motion_in{opacity:1; transform:none;}
[data-motion="scrollTop"]{transform:translate(0%, 40%) matrix3d(1, 0, 0, 0, 0, 0.997564, 0.0697565, -0.00028, 0, -0.0697565, 0.997564, -0.00249391, 0, 0, 40, 0.9);}
[data-motion="top"]{transform: translateY(-70rem);transition-delay:0.1s;}
[data-motion="right"]{transform:translateX(140rem); transition-delay:0.1s;}
[data-motion="scale"]{opacity:1 !important; transform:scale(1.15); transition-delay:0.1s;}
[data-motion="txt"].motion_in > *{transform:translateY(0);display: block;}
[data-motion="txt"] > *{opacity:1; transition:all 0.9s ease; transform:translateY(-100%);}
[data-motion="txt"]{/* opacity:1 !important; */overflow:hidden;}

[data-delay="100"]{transition-delay: 0.1s !important;}
[data-delay="200"]{transition-delay: 0.2s !important;}
[data-delay="300"]{transition-delay: 0.3s !important;}

/* common style */
html{-ms-text-size-adjust:none; -webkit-text-size-adjust:none; -moz-text-size-adjust:none; text-size-adjust:none;}
html{font-size:6.25%;}

::selection{background: #1d3b89bd;color:#fff;}

body{overflow-y:overlay;}
.wrap{position:relative; width:1520rem; margin:0 auto;}

[data-flex]{display:flex;}
[data-flex="center"]{align-items:center;}

.wrap-wide{position:relative; width:1680rem; margin:0 auto;}

p{font-family:var(--font-k);}

a.btn-basic{position:relative; height:65rem; line-height:1; line-height:69rem; box-sizing:border-box; padding:0px 77rem 0 30rem; background:var(--c-bd); font-weight:700; font-size:16rem; color:#fff; letter-spacing:-0.5rem; border-radius:40rem;}
a.btn-basic.blue{background-color:var(--c-01);}
a.btn-basic::before,
a.btn-basic::after{content:""; display:block; position:absolute; top:26rem; right:30rem; width:14rem; height:12rem; background-position:50% 50%; transition:all 0.3s ease; background-image:url(../img/common/arr_basic02_w.svg); background-repeat:no-repeat;}
a.btn-basic::before{opacity:0; right:40rem;}
a.btn-basic:hover::before{opacity:1; right:30rem;}
a.btn-basic:hover::after{opacity:0; right:20rem;}
a.btn-basic.white{background:#fff; color:var(--c-01);}
a.btn-basic.white::before,
a.btn-basic.white::after{background-image:url(../img/common/arr_basic02_c.svg);}

/* header */
#logo{position:relative; top:5rem; z-index:99;}
#logo svg *{fill:#fff;}
#logo svg{height: 34rem;}

#hd{position:absolute;position:fixed;top:0;left:0;z-index:999;width:100%;padding-top:0;padding-top: 38rem;background:transparent;transition: all 0.5s ease;}
#hd.hide{transform:translateY(-100%);}
#hd_wrapper > div{display:flex; justify-content:space-between; align-items:center;}
#hd_h1{font-size:0;}
#hd .btn_close{position:fixed; opacity:0; visibility:hidden; top:0rem; left:0rem; z-index:99; width:-webkit-calc(100% - 320px); width:100%; height:-webkit-calc(100vh - -0rem * 1); height:calc(100vh - -0rem * 1); background:#000; font-size:0; transition:all 0.3s ease-out 0s;}
#hd::after{content:""; position:absolute; opacity:0; visibility:hidden; top:112rem; left:0; width:100%; height:355rem; background:#fff; transition:all 400ms ease;}
#hd.on{padding: 5rem 0rem;background: rgb(11 11 11);}

.list_lang{display:flex;position:absolute;left: 274rem;z-index: 55;}
.list_lang a{position:relative;opacity:0.5;line-height: 32rem;padding: 0rem 14rem;font-weight:500;font-size: 18rem;color:#fff;border-radius:20rem;height: 29rem;display: block;}
.list_lang li.on a{opacity:1; background:var(--c-01);}

#hd .btn_menu{display:block;z-index:100;width: 33rem;height: 18rem;margin-top:0;font-size:0px;transition:all 0.3s ease 0s;}
#hd .btn_menu > span{display:block;position:absolute;left:0px;width:100%;height: 3px;background: #fff;}
#hd .btn_menu > span:nth-of-type(1){top: 0;}
#hd .btn_menu > span:nth-of-type(2){top:50%;margin-top: -2px;transition:background 0.3s ease 0s;}
#hd .btn_menu > span:nth-of-type(3){bottom: 0;}
#hd .btn_menu > span:nth-of-type(1),
#hd .btn_menu > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#hd .btn_menu.active > span:nth-of-type(1){top:10px; transform:rotate(-45deg);}
#hd .btn_menu.active > span:nth-of-type(2){background:transparent;}
#hd .btn_menu.active > span:nth-of-type(3){top:10px; transform:rotate(45deg);}
#hd .btn_menu.active > span:nth-of-type(1),
#hd .btn_menu.active > span:nth-of-type(3){transition-delay:0s, 0.3s;background: #111;}
#hd .btn_close{position:fixed; opacity:0; visibility:hidden; top:0px; left:0px; z-index:99; width:-webkit-calc(100% - 320px); width:100%; height:-webkit-calc(100vh - -0px * 1); height:calc(100vh - -0px * 1); background:#000; font-size:0; transition:all 0.3s ease-out 0s;}
#hd_pop{font-size:0;}
#hd.on #gnb .gnb__link{padding:58rem 55rem 26rem;}

#gnb{position:absolute; top:-38rem; right:0rem; margin-right:227rem;}
#gnb .gnb > li > a::after{content:""; display:none; position:absolute; opacity:0; bottom:0rem; left:50%; width:5rem; height:5rem; background:#07b6f3; transform:translate(-50%, 0);}
#gnb .gnb > li:hover > a::after{opacity:1;}
#gnb .gnb > li.active .gnb__link{background:var(--c-01); color:#fff;}

.gnb > li > a{padding: 57rem 55rem 25rem;color:#fff;}
#en a.btn-basic.white,
#en .wrap-wide a.btn-basic{font-weight:500; font-size:18rem; letter-spacing: 1rem;}

/* footer */
#footer{position:relative;padding:100rem 0rem;z-index: 10;}
#footer > div{display:flex; justify-content:space-between;}
#footer *{color:#fff;}
#footer a.footer_top{position:absolute; top:60rem; right:50rem; z-index: 50;}

.footer__bg{position:absolute; top:0; left:0; width:100%; height:100%; background:url(../img/common/bg_footer.jpg) no-repeat 50% 50%; background-size:cover;}
.footer_top img{height:54rem;}
.footer__txt svg *{fill:#fff;}
.footer__txt svg{position:relative; left:5rem; height:24rem;}
.footer__txt{display:flex; align-items:flex-start; flex-direction:column;}
.footer__txt  > a{margin-top:27rem;}
.footer__txt strong{line-height:1.3; margin-top:37rem; font-size:50rem; font-style:italic;}
.footer__info{padding-top:220rem;}
.footer__menu li{position:relative;}
.footer__menu{display:flex;}
.footer__menu li:not(:last-child)::after{content:"/"; display:inline-block; opacity:0.9; margin:0 20rem; font-weight:100;}
.footer__menu li a{font-weight:500; font-size:17rem;}
.footer__contact img{position:relative; top:-3rem; height:34rem; margin-right:10rem;}
.footer__contact{display:flex; align-items:center; margin-top:66rem; gap:40rem;}
.footer__contact a{display:flex; align-items:center; font-size:40rem;}

#en .footer__menu li a{font-family:var(--font-k)}

#footer address span{margin-right:19rem; font-weight:300; font-style:normal;}
#footer address p:last-child{margin-top:15rem;}
#footer address{margin-top:34rem;}
#footer address p:first-child span:first-child{font-weight:700;}

#en .footer__txt strong{font-weight:600; font-size: 45rem;}

/* mobile gnb style */
#hd .nav_open{display:none;}
#gnb .gnb{display:flex; justify-content:center; zoom:1;}
#gnb .gnb__list{align-items:center;position:absolute;opacity:0;visibility:hidden;overflow:hidden;top: 111rem;left:0;width:100%;box-sizing:border-box;padding:13px 0px;background:#fff;text-align:center;transition:all 300ms ease;gap:56px;border-bottom-left-radius:10rem;border-bottom-right-radius:10rem;transition: all 0.3s ease;}
#gnb .gnb > li{position:relative;z-index:10;transition: all 0.3s ease;}

#en #gnb .gnb__list{top: 116rem;}

@media (max-width:1680px){
	.wrap-wide,
	.wrap{width:auto; margin:0 60rem;}
	
	#logo svg{height:31rem;}
	
	.gnb > li > a{padding:57rem 45rem 25rem;}
	.list_lang{left:248rem;}
}

@media (max-width:1600px){
	.wrap-wide,
	.wrap{margin:0 40rem;}	
}

@media (min-width:1023px){
	#gnb .gnb:after{content:""; display:block; visibility:hidden; clear:both;}
	#gnb .gnb__link{display:inline-block;position:relative;z-index:5;box-sizing:border-box;font-weight: 700;font-size: 20rem;color: #fff;transition: all 300ms ease;text-decoration:none;font-style: italic;background: transparent;}
	#gnb .gnb__link span{display:none;}
  
	#gnb .gnb__list > li{padding: 9rem 0;transition: all 0.3s ease !important;}
	#gnb .gnb__list > li.active a{color:#005dad}
	#gnb .gnb__list .gnb__list > li:last-child{border-bottom:none;}
	#gnb .gnb__list > li > a{display:block;width:100%;box-sizing:border-box;border-bottom:0;font-weight:300;font-size: 16rem;color:#aaaaaa;letter-spacing:-.3px;text-decoration:none;transition: all 0.3s ease;}
    
	#gnb .gnb > li:hover,
    #gnb .gnb > li:focus .gnb__list,
	#gnb .gnb > li.active .gnb__list{opacity:1; visibility:visible;}

	#gnb .gnb__list > li > a:focus,
	#gnb .gnb__list > li > a:hover{font-weight:400; color:#005dad; transition: all 0.3s ease;}	
	
	#en #gnb .gnb__link{font-weight:600; font-size:24rem; }
	#en #gnb .gnb__list > li > a{ font-family: var(--font-k);}
	#en #gnb .gnb__list > li > a:hover{font-weight:300; transition: all 0.3s ease;}
}

@media (max-width:1023px){
	.wrap-wide,
	.wrap{margin:0 30rem;}
	
	#hd nav{opacity:0; visibility:hidden; overflow:hidden;}
	#hd nav{position:fixed; opacity:0; visibility:hidden; overflow:hidden; top:0px; right:0; z-index:9; width:100%; height:100%; margin-right:0; background:#fff; transition:all 0.5s ease 0s;}
	#hd nav.active{opacity:1; visibility:visible; overflow:visible; right:0px;}
	#hd nav .gnb{display:flex; justify-content:flex-start; position:absolute; opacity:1; top:135rem; left:0; z-index:999; width:100%; background:#fff; overflow-y:auto; flex-direction:column;}
	#hd nav .gnb > li{padding:0; transition:all 0.3s ease !important;}
	#hd nav .gnb > li > a{display:block; position:relative; line-height:1.4em; margin-left:0; padding:13rem 40rem; font-family:var(--font-k); font-weight:900; font-size:24rem; color:#333; text-align:left; transition:all 0.3s ease; font-style:italic;}
	#hd nav .gnb > li ul{display:none; text-align:left;}
	#hd nav .gnb > li ul.gnb__list{position:relative; opacity:1; visibility:visible; top:0; left:0; box-sizing:border-box; padding-top:0; padding-bottom:20rem; padding-left:9rem; border:none; transition:none; transform:none;}
	#hd nav .gnb > li ul > li > a{display:block; padding:6rem 32rem; border-bottom:none; font-weight:500; font-size:16rem; color:#111;}
	#hd nav .gnb > li ul > li:hover a{color:#005dad;}
	#hd nav .gnb > li ul li.active a{color:var(--swiper-theme-color);}
	#hd nav .gnb > li > a.on{color:var(--swiper-theme-color);}
	#hd nav .gnb > li > a.active:after{transform:rotate(-180deg); -webkit-transform:rotate(-180deg);}
	#hd nav .gnb > li > a:after{content:""; position:absolute; top:25px; right:0; width:9px; height:4px; transition:all 0.4s ease-out 0s;}
	#hd nav .gnb > li:nth-child(2) > a:after{display:none;}
	#hd .nav_open{display:block; position:absolute; opacity:1; right:0; z-index:95; transform:translateY(-17%);}
	
	#en #hd nav .gnb > li > a{    font-family: var(--font-e);}
	#en #hd nav .gnb > li ul > li > a{font-size:18rem; font-family: var(--font-k);}

	a.btn-basic{height:55rem; line-height:59rem; padding:0px 62rem 0 25rem; font-size:14rem;}
	a.btn-basic::before,
	a.btn-basic::after{top:21rem; right:24rem;}
	
	#logo svg{height:26rem; transition:all 0.5s ease 0s;}
	
	#hd{padding-top:32rem;}
	#hd a.btn-basic{margin-right:55rem;}

	.list_lang{left:208rem;}	
	
	body.active #logo svg *{fill:var(--c-01);}
	body.active .list_lang li:not(.on) a{color:#888;}
	
	.footer__txt strong{font-size:29rem; word-break:keep-all;}
	.footer__menu li a{font-size:14rem;}
	
	#footer{padding:80rem 0rem;}
	#footer address span{margin-right:10rem; font-size:14rem;}
	#footer address p:last-child{margin-top:5rem;}
	#footer > div{display:flex; align-items:flex-start; flex-direction:column;}
	
	.footer__txt svg{height:21rem;}	
	.footer__info{padding-top:70rem;}
	.footer__contact{margin-top:45rem;}
	.footer__contact a{font-size:33rem;}
	.footer__contact img{height:30rem;}

	#bo_gall .gall_img{height:227rem;}
}

@media (max-width:860px){
	#hd{padding-top:28rem;}
}

@media (max-width:540px){
	
	#en #gnb .gnb__list{top: auto}
	
	#en #hd nav .gnb > li ul > li > a{font-size:16rem;}

	#hd.on{padding:11rem 0rem;}
	#hd .nav_open{margin-top:2rem;}
	#hd{padding-top:23rem;}
	#hd .btn_menu{width:29rem; height:16rem;}
	#hd .btn_menu > span:nth-of-type(2){margin-top:-1px;}
	#hd nav .gnb > li > a{padding:11rem 40rem;}
	#hd nav .gnb > li ul.gnb__list{padding-bottom:14rem;}

	#logo svg{height:22rem;}
	a.btn-basic{padding:0px 56rem 0 24rem; font-size:14rem;}
	
	#hd a.btn-basic{display:none;}
	#hd .btn_menu > span{height:2px;}
	
	.wrap-wide,
	.wrap{margin:0 20rem;}
	
	.list_lang{left:172rem; margin-top:-1rem;}
	.list_lang a{height:25rem; line-height:28rem; padding:0rem 12rem; font-size:17rem;}	
	
	#footer{padding:80rem 0rem 40rem;}
	#footer a.footer_top{top:25rem; right:20rem;}
	#footer address p{display:inline;}
	#footer address{margin-top:19rem;}

	.footer_top img{height:34rem;}
	.footer__menu li:not(:last-child)::after{margin:0 8rem;}	
	.footer__contact a{font-size:25rem;}
	.footer__contact img{top:-1rem; height:23rem;}
	.footer__contact{margin-top:35rem; gap:25rem;}	
	.footer__txt svg{height:15rem;}
	.footer__txt strong{font-size:25rem; word-break:keep-all;}
	
	#en .footer__txt strong{font-size:25rem}

}