@charset 'utf-8';
/* common */
:root {
    --baseFont: 'Pretendard', 'Malgun Gothic', 'verdana', sans-serif;
	--man : "Manrope", sans-serif;
	--cor : "Cormorant Garamond", serif;
	--mainC: #140AD9;
	--subC: #;
}

.man{ font-family: var(--man);}

sup{ font-size:12px; }

body.scrollN{ height: 100vh !important; overflow: hidden !important;}
body.scrollN{ -ms-overflow-style:none scrollbar-width:none }
body.scrollN::-webkit-scrollbar { display: none; }

.flex-box{ display:flex;}
.flex-box.center{ display:flex; justify-content:center; align-items:center; }

.fit-box{ position: relative; width: 100%; height: 100%; overflow: hidden;}
.fit-box img{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width: 100%; min-height:100%; object-fit: cover;}

.w1300{ max-width:1300px; margin: 0 auto; width: 100%; }
.w1600{ max-width:1600px; margin: 0 auto; width: 100%; }

img{ transition:all 0.7s; }

#dimmed{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10001; background: rgba(0,0,0,0.5); display:none; }

#side-dots{ display:none; }
.dots-wrap{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
.dots-wrap #side-dots{ display:block; position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.dots-wrap #side-dots span{ display:block; width: 10px; height: 10px; background: var(--mainC); }
.dots-wrap #side-dots span.tl{ position: absolute; top: -5px; left: -5px; } 
.dots-wrap #side-dots span.tr{ position: absolute; top: -5px; right: -5px; } 
.dots-wrap #side-dots span.bl{ position: absolute; bottom: -5px; left: -5px; } 
.dots-wrap #side-dots span.br{ position: absolute; bottom: -5px; right: -5px; } 

#viewbtn{ display:inline-flex; align-items:center; color: #111; letter-spacing: -0.42px;}
#viewbtn span{ position: relative; display:block; width: 15px; overflow: hidden; display:flex; align-items:center; margin-left: 15px; }
#viewbtn span svg{ position: relative; transition:all 0.5s; }
#viewbtn span .off{ position: absolute; transform:translateY(-50%); top: 50%; left: -110%; }
#viewbtn:hover span .on{ position: relative; transform:translateX(50px); }
#viewbtn:hover span .off{ left: 0; }

.move-box{ display:flex; align-items:center; }
.move-box #viewbtn{ color:#fff; font-family: var(--man); font-weight: 500;} 
.move-box #viewbtn svg path{ stroke:#fff; }
.move-box .slide-arrow{ margin-left: 40px; }

.slide-arrow{ display:flex; align-items:center; }
.slide-arrow span{ width: 2px; height: 25px; background: rgba(255,255,255, 0.2); margin: 0 20px; }
.slide-arrow button{ display:flex; justify-content:center; align-items:center; opacity: 0.2; transition:all 0.5s; }
.slide-arrow button:hover{ opacity: 1; }

.scroll-mobile-txt{ display:none; }

.mb120{ margin-bottom: 120px;}

.depth4{ display:none; }

#mobile{ display:none; }

/* header */
header{ position: relative;  position: absolute; top: 0; left: 0; padding: 0 60px; width: 100%; height: 100px; z-index: 10000; transform:translateY(-110%); transition:all 1.2s; }
header .header-box{ display:flex; justify-content:space-between; align-items:center; width: 100%; height: 100%; }
header .header-box .side-box{ height: 100%; display:flex; align-items:center; }
header .header-box .side-box .contactbtn a{ display:flex; justify-content:center; align-items:center; border: 1px solid #0C00FF; background: rgba(20, 10, 217, 0.65); backdrop-filter: blur(10px);
padding: 10px 35px; color:#fff; letter-spacing: -0.32px; font-family: var(--man);}
header .header-box nav,
header .header-box nav #gnb,
header .header-box nav #gnb > li{ height: 100%; }
header .header-box nav #gnb{ display:flex; }
header .header-box nav #gnb > li{ position: relative; display:flex; justify-content:center; align-items:center; padding: 0 40px; cursor:pointer; }
header .header-box nav #gnb > li:first-child{ z-index: 5;}
header .header-box nav #gnb > li > a{ position: relative; display:flex; align-items:center; font-size:18px; font-weight: 500; color:#fff;  }
header .header-box nav #gnb > li > a:before{ content:''; display:block; width: 0; height: 1px; position: absolute; bottom: -8px; left: 0; background: #fff; transition:all 0.5s; }
header .header-box nav #gnb > li > a:after{ content:''; display:block; width: 10px; height: 6px; background: url(/img/common/linkArrow.png) no-repeat 50% 50%; margin-left: 15px; 
transition:all 0.5s; }
header .header-box nav #gnb .depth2{ position: relative; position: absolute; top: 100%; left: 0; padding: 20px 40px; border: 1px solid #0C00FF; background: rgba(20, 10, 217, 0.65); backdrop-filter: blur(10px); transition:all 0.7s; opacity: 0; visibility: hidden; pointer-events:none; }
header .header-box nav #gnb .depth2 li{ white-space:nowrap; display:flex; }
header .header-box nav #gnb .depth2 li a{ display:block; padding: 10px 0; color:#fff; font-weight: 500; letter-spacing: -0.34px; font-size:17px; }
header .header-box nav #gnb .depth2 > li > a{ min-width:130px; }
header .header-box nav #gnb .depth3{ position: relative; display:flex; align-items: center; margin-left: -13px; }
header .header-box nav #gnb .depth3:before{ content:''; display:block; width: 13px; height: 14px; background: url(/img/common/linkArrow2.png) no-repeat 50% 50%; margin-right: 40px;}
header .header-box nav #gnb .depth3 li a{ min-width:195px; color:rgba(255,255,255,0.7); } 
header .header-box nav #gnb > li:hover > a:before{ width: calc(100% - 25px); }
header .header-box nav #gnb > li:hover .depth2{ opacity: 1; visibility:visible; pointer-events:auto; }
header .header-box nav #gnb > li:hover > a:after{ transform:rotate(180deg); }
header .header-box .lang-box{ display:flex; align-items:center; margin-right: 20px; }
header .header-box .lang-box li{ display:flex; align-items:center; }
header .header-box .lang-box li:first-child:after{ content:''; display:block; width: 1px; height: 15px; background: rgba(255,255,255,0.3); margin: 2px 10px 0;}
header .header-box .lang-box li a{ font-family: var(--man); color:rgba(255,255,255,0.3); font-weight: bold; letter-spacing: -0.32px;}
header .header-box .lang-box li.on a{ color:#fff; }
header .header-box .menu-btn{ display:none; }

header.down{ transform:translateY(0); }
header.bg{ background: rgba(0,0,0,0.8); }

#allmenu{ position: relative; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10001; background: #000; width: 100%; height: 100%; display:none; }
#allmenu .close{ position:absolute; top: 20px; right: 20px; z-index: 5;}
#allmenu .side-box{ padding: 15px 20px 70px; display:flex; flex-wrap:wrap; height: 100%; }
#allmenu .side-box nav{ width: 100%; height: 100%; order:2; margin-top: 50px;}
#allmenu .side-box #gnb > li{ position: relative; }
#allmenu .side-box #gnb > li:not(:last-child){ margin-bottom: 30px;}
#allmenu .side-box #gnb > li > a{ display:flex; justify-content:space-between; align-items:center; font-size:28px; color:#fff; font-weight: 500; }
#allmenu .side-box #gnb > li > a:after{ content:''; display:block; background: url(/img/common/allArrow.png) no-repeat 50% 50%; width: 16px; height: 10px; transition:all 0.7s; }
#allmenu .side-box #gnb > li .depth2{ position: relative; margin-top: 10px; padding: 25px; display:none; }
#allmenu .side-box #gnb > li .depth2 > li{}
#allmenu .side-box #gnb > li .depth2 > li:not(:last-child){ margin-bottom: 20px; }
#allmenu .side-box #gnb > li .depth2 > li.dots-wrap{ top: 5px; left: 5px; width: calc(100% - 10px); height: calc(100% - 10px); border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.1); z-index: 5; pointer-events:none; margin: 0; }
#allmenu .side-box #gnb > li .depth2 > li > a{ font-size:20px; color:#fff; font-weight: 500; }
#allmenu .side-box #gnb > li .depth3 { margin-top: 10px; margin-bottom: -10px;}
#allmenu .side-box #gnb > li .depth3 li{ display:inline-block; margin-bottom: 10px;}
#allmenu .side-box #gnb > li .depth3 li:not(:last-child){ margin-right: 15px; }
#allmenu .side-box #gnb > li .depth3 li a{ font-size:16px; color:rgba(255,255,255,0.8); }
#allmenu .side-box .flex-box{ width: 100%; }
#allmenu .side-box .lang-box{ display:flex; align-items:center; margin-right: 20px;}
#allmenu .side-box .lang-box li{ display:flex; align-items:center; }
#allmenu .side-box .lang-box li:first-child:after{ content:''; display:block; width: 1px; height: 15px; background: rgba(255,255,255,0.3); margin: 2px 10px 0;}
#allmenu .side-box .lang-box li a{ font-family: var(--man); color:rgba(255,255,255,0.3); font-weight: bold; letter-spacing: -0.32px;}
#allmenu .side-box .lang-box li.on a{ color:#fff; }
#allmenu .side-box .contactbtn a{ display:flex; justify-content:center; align-items:center; border: 1px solid #0C00FF; background: rgba(20, 10, 217, 0.65); backdrop-filter: blur(10px);
padding:7px 20px; color:#fff; letter-spacing: -0.32px; font-family: var(--man);}

#allmenu .side-box #gnb > li a.on:after{ transform:rotate(180deg); }

/* footer */
footer{ padding: 0 60px 60px;}
footer .footer-inner{ background: #000; padding: 60px; }
footer .footer-inner > *{ display:flex; justify-content:space-between; }
footer .footer-inner .dots-wrap{ display:none; }
footer .footer-inner .menu-box{ justify-content:space-between; margin-bottom: 140px;}
footer .footer-inner .menu-box .footer-gnb #gnb{ display:flex; }
footer .footer-inner .menu-box .footer-gnb #gnb > li{ width: 200px; }
footer .footer-inner .menu-box .footer-gnb #gnb > li > a{ display:inline-block; font-size:21px; font-weight: 500; letter-spacing: -0.42px; color:#fff; margin-bottom: 20px; }
footer .footer-inner .menu-box .footer-gnb #gnb > li:first-child{ width: 400px; display:flex; flex-wrap:wrap; overflow: hidden;}
footer .footer-inner .menu-box .footer-gnb #gnb > li:first-child a{ width: 100%; }
footer .footer-inner .menu-box .footer-gnb #gnb > li:first-child .depth2:first-of-type > li.type2,
footer .footer-inner .menu-box .footer-gnb #gnb > li:first-child .depth2:nth-of-type(2) > li:not(.type2){ display:none; }
footer .footer-inner .menu-box .footer-gnb #gnb .depth2:first-of-type{ width: 200px; margin-right: 20px;}
footer .footer-inner .menu-box .footer-gnb #gnb .depth2 > li:not(:last-child){ margin-bottom: 10px;}
footer .footer-inner .menu-box .footer-gnb #gnb .depth2 > li > a{ font-size:18px; color:#aaa; letter-spacing: -0.36px; }
footer .footer-inner .menu-box .footer-gnb #gnb .depth3{ margin-top: 10px;}
footer .footer-inner .menu-box .footer-gnb #gnb .depth3 li:not(:last-child){ margin-bottom: 10px; }
footer .footer-inner .menu-box .footer-gnb #gnb .depth3 li a{ color:#888; font-weight: 300; letter-spacing: -0.34px; }
footer .footer-inner .btn-box{ align-items:flex-end; }
footer .footer-inner .btn-box .info-box ul{ display:flex; align-items:center; margin-bottom: 15px; }
footer .footer-inner .btn-box .info-box ul li{ color:#888; letter-spacing: -0.36px; font-size:18px; }
footer .footer-inner .btn-box .info-box ul li:not(:last-child){ font-family: var(--man); margin-right: 40px; }
footer .footer-inner .btn-box .info-box ul li span{ display:inline-block; margin-right: 20px; font-weight: 600; color:#fff;}
footer .footer-inner .btn-box .info-box .copy{ color:#555; font-family: var(--man); font-weight: 500; letter-spacing: -0.34px; }
footer .footer-inner .btn-box .link-box { display:flex; align-items:center; }
footer .footer-inner .btn-box .link-box p a{ color:#fff; font-weight: 500; letter-spacing: -0.38px; margin-right: 45px;}

/* privacy */
#privacy { color:#333; width: 100%; box-sizing:border-box; font-size:18px; line-height: 1.66; word-break:break-all; }
#privacy p:not(:last-child){ margin-bottom: 20px; }
#privacy .sTxt{ margin-top: 30px; }
#privacy .sTxt h3{ margin-bottom: 5px; }
#privacy .title-box { margin-bottom: 50px; }
#privacy .title-box .title{ color:#222; font-size:20px; font-weight: 600; letter-spacing: -0.6px; margin-bottom: 30px; line-height: 1.3; }
#privacy .title-box p:not(.title){ letter-spacing: -0.54px; }
#privacy dl:not(:last-child) { padding-bottom:30px;}
#privacy dl dt{ color:#111; font-weight:500; line-height: 1.3; margin-bottom: 10px; }
#privacy dl dd{ color:#333; font-weight: 300; }
#privacy .prev-box{ margin-top: 100px; display:flex; align-items:center; }
#privacy .prev-box .txt{ color:#222; font-weight: 500; letter-spacing: -0.6px; margin-right: 60px; }
#privacy .prev-box .list-box{ position: relative; width: 400px; }
#privacy .prev-box .list-box button{ width: 100%; height: 70px; display:flex; justify-content:space-between; align-items:center; border: 1px solid #DDD; padding: 0 30px; 
color: #666; font-weight: 300; letter-spacing: -0.54px; }
#privacy .prev-box .list-box button img{ filter:invert(1); --webkit-filter:invert(1); width: 14px; transition:all 0.5s; }
#privacy .prev-box .list-box button.on img{ transform:rotate(180deg); }
#privacy .prev-box .list-box .scroll-box{ width: 100%; background: #fff; padding: 10px; position: absolute; transform:translateX(-50%); left: 50%; top: calc(100% - 1px);  border:1px solid #ddd; 
display:none; }
#privacy .prev-box .list-box ul{ width: 100%; max-height: 150px; }
#privacy .prev-box .list-box ul li a{ display:block; width: 100%; padding: 10px 20px; color:#666; font-weight: 300; letter-spacing: -0.54px;  display:flex; justify-content:space-between; align-items:center; background: #fff;}

/* paging */
.paging{ display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center; margin-top: 80px; }
.paging .arr{ display:flex; }
.paging .arr a.last,
.paging .arr a.first{ letter-spacing:-10px; }
.paging .arr.right a{-webkit-transform:rotate(180deg); transform: rotate(180deg);}
.paging a{ display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center; font-size:18px; 
color:#ccc; }
.paging ul{ display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 15px; }
.paging ul li:not(:last-child),.paging .arr a:first-child{ margin-right: 15px;}
.paging ul li a{ width: 35px; height: 35px; font-family: var(--man); font-variant-numeric: lining-nums proportional-nums; font-weight: 500; }
.paging ul li.on a { color:#fff; background: var(--mainC); border-color: var(--mainC); }