@charset 'utf-8';

/* common */
* { box-sizing: border-box; margin: 0;padding: 0;}
input, input:focus, textarea, textarea:focus, button, button:focus { border: none; outline: none; resize: none; }
html, body { width: 100%; max-width: 100%;  box-sizing: border-box; -webkit-overflow-scrolling: touch; overflow-x: hidden;}
button { border: none; background: transparent; cursor:pointer;}
input, input:focus, textarea, textarea:focus { border: none; outline: none; appearance: none; }
.w1000{ max-width:1000px; margin: 0 auto; width: 100%; height: 100%;}
.w1200{ max-width:1200px; margin: 0 auto; width: 100%; height: 100%;}
.w1400{ max-width:1400px; margin: 0 auto; width: 100%; height: 100%;}
.w1400.new{max-width: none;}
.w1600{ max-width:1600px; margin: 0 auto; width: 100%; height: 100%;}
.w1700{ max-width:1700px; margin: 0 auto; width: 100%; height: 100%;}
span.bar{ font-family: 'Noto Sans KR', sans-serif; }
button.learnmore{ color:#fff; font-weight: 300; display:flex; align-items:center; position: relative; font-size:14px; }
button.learnmore:after{ position: absolute; content:''; width: 100%; height: 1px; background: #fff; display:block;  bottom: -9px; }
button.learnmore img{ margin-left: 16.5px;}
.noto{ font-family: 'Pretendard', sans-serif !important; }

/*header*/
header{ position: relative; position: fixed; height: 145px; top:0; left: 0; z-index: 100; width: 100%; transition:all 0.5s; }
header .headerBox{ display:flex; justify-content:space-between; align-items: center; padding: 46px 0 0;}
header .headerBox .sidewrap{ display:flex; align-items: center;}
header .headerBox nav #gnb{ display:flex; margin-right: 50px;}
header .headerBox nav #gnb a{ color:#fff; font-weight: 500; padding: 0 50px; height: 50px; display: flex; justify-content: center; align-items: center;}
header .headerBox #lang{ position: relative; }
header .headerBox #lang p{ display:flex; justify-content: center; align-items: center; color:#fff; cursor:pointer; font-size:12px; }
header .headerBox #lang p img{ margin-left: 9px; transition:all 0.5s; }
header .headerBox #lang .langBox{ position: absolute;  transform: translateX(-50%); bottom: -100px; left: 50%; width: 60px; padding: 15px 0; display:none; }
header .headerBox #lang .langBox a{ text-align: center; display:block; width: 80%; line-height: 1.5; color:#000; font-weight: 700; padding: 5px 0; background: rgba(255,255,255,0.8); border-radius:30px; }
header .headerBox #lang .langBox li:hover a,header .headerBox #lang .langBox li.on a{ background:#fff; }
header .headerBox #lang .langBox a:first-child{ margin-bottom: 10px;}
header .headerBox #lang.on p img{ transform:rotate(-180deg)}
header .headerBox #menubar{ display:none; }
header.fix{ position: fixed; }
header.bg{ background: rgba(30,30,30,0.8); height: 100px;}
header.bg .headerBox{ padding: 0; height: 100%;}
header.bg .headerBox #lang .langBox a{ box-shadow: 0 0 10px rgba(0,0,0,0.5);}

/*allmenu*/
#allMenu{ position: relative; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; background: #1E1E1E; display:none; }
#allMenu .allMenu_gnb{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50% ;}
#allMenu .allMenu_gnb #gnb li{ text-align: center;  }
#allMenu .allMenu_gnb #gnb li:not(:last-child){ margin-bottom: 25px;}
#allMenu .allMenu_gnb #gnb li a{ font-size:7rem; font-weight: 500; color:#fff; text-align: center; position: relative;}
#allMenu .allMenu_gnb #gnb li a:before{ position: absolute; top: 10px; left: -30px; font-size:1.4rem;  font-weight: 300;}
#allMenu .all_bottom{ position: absolute; bottom: 40px; width: 100%;}
#allMenu .all_bottom > div{ display:flex; justify-content:space-between; align-items: center; }
#allMenu .all_bottom .copy{ color:#999; }

/*footer*/
footer{}
footer .footer_in{ background: #000; padding: 100px 0 55px; position: relative; }
footer .footer_in .logo{ text-align: center; margin-bottom: 23px;}
footer .footer_in .f_bottom{ display:flex; justify-content:space-between; }
footer .footer_in .f_bottom * { font-family: "Noto Serif", serif; }
footer .footer_in .f_bottom .f_left{ margin-top: 15px; }
footer .footer_in .f_bottom .f_left .infoBox{ margin: 40px 0 50px;}
footer .footer_in .f_bottom .f_left .infoBox li{ color:#999; display:flex; gap:35px; }
footer .footer_in .f_bottom .f_left .infoBox li span{ width: 65px; display:inline-block; color:#fff; white-space:nowrap; font-weight: 500;}
footer .footer_in .f_bottom .f_left .infoBox li:last-child span{ margin-right: 30px;}
footer .footer_in .f_bottom .f_left .infoBox li:not(:last-child){ margin-bottom: 20px; }
footer .footer_in .f_bottom .f_left .infoBox .copy{ color:#999; }
footer .footer_in .f_bottom .f_right .menuBox li{ text-align: right; } 
footer .footer_in .f_bottom .f_right .menuBox li a{ color:#fff; line-height: 2.7; } 
footer .footer_in .f_bottom .f_right .linkBox{ display:flex; margin-top: 35px;}
footer .footer_in .f_bottom .f_right .linkBox li a{ color:#fff; }
footer .footer_in .f_bottom .f_right .linkBox li:not(:last-child):after{ content:'|'; margin: 0 20px; color:#333 ; font-size:12px; }
footer .footer_in #topBtn{ position: absolute; top: 55px; right: 1.5%; cursor:pointer; }

/*cursor*/
#cursor{ position: relative; width: 110px; height: 110px; border-radius:50%; background:#fff;  position: absolute;  z-index: 50; pointer-events: none; overflow: hidden; transform-origin: center center; 
animation: cursorS 0.5s ease forwards; opacity: 0;  display: flex;  align-items: center; justify-content: center;}
#cursor img{ animation: rotate 5s infinite linear;  transform-origin: center;}
#cursor .arrows{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; color:#000; font-size:17px; }
#cursor.fade{ animation:cursorB 0.5s ease forwards; opacity: 1; }

/*dim*/
#dim{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 102; display:none; }

@keyframes cursorB{
	0%{ transform: scale(0); }
	100%{ transform: scale(1); }
}
@keyframes cursorS{
	0%{ transform: scale(1); }
	100%{ transform: scale(0); }
}

/* privacy */
.privacy { color:#333; width: 100%; overflow: hidden; box-sizing:border-box; font-size:1.8rem;	line-height: 1.7; word-break:break-all; padding:  0 0 70px 0; }
.privacy  p { margin:15px 0; font-size:1.9rem; }
.privacy  p span.name{ font-weight: 900;}
.privacy  p a.email{ color:#1C4D9A; font-weight: 600; font-size:1.9rem; }
.privacy > p+dl { margin-top: 30px; }
.privacy > dl { padding-bottom:20px;}
.privacy > dl > dt{ font-size:2rem;color:#222; font-weight:800; padding-bottom:5px; }
.privacy > dl > dd{ padding-bottom:10px;text-align:justify; font-size:18px; line-height:140%;}
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ line-height:1.5; margin-top: 10px; text-indent:-10px; margin-left: 10px;}
.privacy > dl > dd ul li:before{ content:'·'; font-size:2.4rem; font-weight: 900; margin-right: 5px;}
.privacy > dl > dd ul li:first-child { margin-top: 0; }
.privacy > dl > dd ul li p { margin:0 10px 5px; line-height: 140%; }

/*animation*/
@keyframes txtUp {
  from {
    -webkit-transform:translate3d(0, 250%, 0);
    transform:translate3d(0, 250%, 0);
    visibility:visible;
    opacity:0;
  }
  to {
    -webkit-transform:translate3d(0, 0, 0);
    transform:translate3d(0, 0, 0);
    opacity:1;
  }
}
@keyframes fadeLeft {
  from {
    -webkit-transform: translate3d(-30%, 0, 0);
    transform: translate3d(-30%, 0, 0);
    visibility: visible;
    opacity:0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity:1;
  }
}
@keyframes rotate{
	0% {
		transform: rotate(-360deg); 
	} 
	100% { 
		transform: rotate(0deg);
	} 
}