@charset "utf-8";

/* @import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css); */

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0;}
fieldset{border:0 none;}
img{border:0 none;vertical-align:top;}
dl,ul,ol,menu,li {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
input,select,textarea,button {vertical-align:middle}
input, select, option, textarea {font-family:'NanumGothic', 'Rising_CHAI_Extra_Bold', 'Noto Sans KR', sans-serif; font-weight:300;}
button {background:none;cursor:pointer; font-family:'NanumGothic', 'Rising_CHAI_Extra_Bold', 'Noto Sans KR', sans-serif; cursor:pointer; outline:none;}
body {background:#fff}
body,th,td,input,select,textarea,button { font-family:'NanumGothic',  'Rising_CHAI_Extra_Bold', 'Noto Sans KR', sans-serif; font-size:17px; color:#000; letter-spacing:0; font-weight:300; }
a {color:#000;text-decoration:none}
address,caption,cite,code,dfn,var {font-style:normal;font-weight:normal}
em{font-style:normal;}
.blind,legend,caption,#accessibility {width:0px; height:0px; position:absolute; overflow:hidden; font-size:0px; line-height:0px; z-index:-1; visibility:hidden;}
.hidden{visibility:hidden;}


html, body{min-height:100%;}

@font-face {
  font-family: 'Rising_CHAI_Extra_Bold';
  src: url(/css/font/Rising_CHAI_Extra_Bold_.eot);
  src: url(/css/font/Rising_CHAI_Extra_Bold_.eot?#iefix) format('embedded-opentype'),
      url(/css/font/Rising_CHAI_Extra_Bold_.woff2) format('woff2'),
      url(/css/font/Rising_CHAI_Extra_Bold.ttf) format('truetype');
}

@font-face {
  font-family: 'Rising_CHAI_Light';
  src: url(/css/font/Rising_CHAI_Light_.eot);
  src: url(/css/font/Rising_CHAI_Light_.eot?#iefix) format('embedded-opentype'),
      url(/css/font/Rising_CHAI_Light_.woff2) format('woff2'),
      url(/css/font/Rising_CHAI_Light.ttf) format('truetype');
}

.chaiFont {font-family: 'Rising_CHAI_Extra_Bold' !important;}

html, body {min-height: 100%;height: 100%; color:#fff; }
body.main {overflow:hidden}

body.keyboard-on {position: fixed; overflow:hidden; background: #000}

.geo_primary {
  font-size: 12px;
  font-weight: 400;
  color: #666;
  margin-top: 6px;
  letter-spacing: 0.02em;
  opacity: 0.2;
}

.ir_text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.dim {
  opacity: 1;
  pointer-events: initial;
}

::-webkit-scrollbar{
  display: none;
  width: 0;  /* Remove scrollbar space */
  height: 0;
  background: transparent;  /* Optional: just make scrollbar invisible */
  -webkit-appearance: none;
  }

/* #fixed.on {top:0 !important} */
#fixed {position: fixed; width: 720px; left: 50%; margin-left: -360px; display: block; top: -150px; height: 82px; background: #000; z-index: 9999}
  #fixed .logo {position: absolute; left: 40px; top: 24px; display: block;}
  .main #fixed .menu {position: fixed; display: block; right: 40px; top: 100px; z-index: 9999}
  #fixed.on .menu {position: absolute; top: 24px; display: block;}
  #fixed .main_down{display: none}
  .main #fixed .main_down {position: fixed; display: block; left: 50%; bottom: 30px; transform: translateX(-50%); z-index: 1; animation: maindownAni 1.3s ease-in-out infinite;}

  #fixed .cha3 {position: absolute; right: 50px;; bottom: -58px;; z-index: 9;}

  @keyframes maindownAni {
    0% {bottom: 45px; opacity: 1;}
    100% {bottom: 25px; opacity: .4;}
  }


.menu_wrap {}
  .menu_open .close {position: fixed; right: 40px; top: 60px;}
  .menu {position: absolute; right: 40px; top: 30px;}

  .menu_open {position: fixed; left: 0; top: 0; width: 100%; height: 100%; overflow-y: auto; padding:148px 0 20px; background: url(/images/m_bg.gif) repeat left top; display: flex; justify-content: center; flex-direction: column; align-items: center; box-sizing: border-box;   z-index: 9999;}
  .menu_open dl {max-width: 720px; width: 100%; margin: 0 auto 50px; display: flex; flex-direction: column; justify-content: space-between; align-items:flex-start; padding:0 40px;}
  .menu_open dl a {color:#fff;}
  .menu_open dl dt {padding-bottom: 10px; font-size: 95px; font-family: 'Rising_CHAI_Extra_Bold';}
  .menu_open dl dd {font-family: 'NanumGothic'; line-height: 55px; font-size: 28px;}
  .menu_open dl dd a {display: inline-block; padding-right: 36px; color:#bbb;}
  .menu_open dl dd a strong {font-family: 'Rising_CHAI_Extra_Bold';}
  .menu_open dl.fdat dd a.on, .menu_open dl.fdat dd a:hover { color: #fe0000;}
  .menu_open dl.work dd a.on, .menu_open dl.work dd a:hover {color: #00ff0c}
  .menu_open dl.pride dd a.on, .menu_open dl.pride dd a:hover {color: #00ffcc}
  .menu_open dl.news dd a.on, .menu_open dl.news dd a:hover {color: #8401ff}
  .menu_open dl.careers dd a.on, .menu_open dl.careers dd a:hover {color: #ff5d32}
  .menu_open dl.contact dd a.on, .menu_open dl.contact dd a:hover {color: #32a1ff}

  .menu_open dl.pride dd a {width: 190px;}

aside {position: absolute; width: 720px; padding: 60px 0 0; margin:0 auto; color:#fff; background: #212121; box-sizing: border-box; left: 50%; margin-left: -360px; z-index: 2;}
  aside h1 {padding: 0 40px; font-size: 95px;  color:#fff; font-family: 'Rising_CHAI_Extra_Bold';}
  aside h1 p {padding: 15px 0 30px; font-size: 25px; color:#909090; line-height: 33px; letter-spacing: 0em; font-family: 'NanumGothic'; font-weight: normal;}

  aside nav.on {position: fixed;top: 80px;width: 720px;background: #212121; box-sizing: border-box;}
  aside nav.on div.on ul {position: fixed; top: 234px; width: 720px; left:50%; margin-left:-360px; background: #000;}

  aside nav {display: flex; justify-content: space-between; padding: 0 40px 0 0; overflow-x :scroll; overflow-y: hidden;}
  aside nav div {padding: 0 0 0 40px; font-size: 45px; color:#434343; line-height: 100%; letter-spacing: -0.03em; cursor: pointer; border-top: 0 solid #383838;}
  aside nav div>a {display: inline-flex; color:#434343; padding: 55px 0;}
  aside nav div strong { font-family: 'Rising_CHAI_Extra_Bold'; text-wrap: nowrap;}
  aside nav div span {font-family: 'dotum';padding-left: 10px;}
  aside nav div span::before {content: "-"}

  aside div.on p, aside div.on ul, aside div.on dl {display: block; animation: slider 0.2s ;}
  aside div.on span {font-family: 'dotum'}
  aside div.on span::before {content: "+";}
  aside div.on p {padding: 10px 0; font-size: 15px; color:#909090; line-height: 180%}

  aside div ul {position: absolute; min-width: 720px; height: 100px; left: 0; top: 495px; display: none; box-sizing: border-box; background: #000000}
  aside div.on ul {display: flex; justify-content:; padding: 0 40px 0 0; overflow-x :auto; overflow-y: hidden;}
  aside div ul li a {display: block; color:#fff; font-size: 28px; margin: 0 0 0 40px; line-height: 100px; height: 100px;}
  /* aside div ul li a.on {line-height: 95px; height: 95px;} */

  aside.work div.on strong, aside.work div.on span, aside.work ul li a.on {color:#00ff0c;}
  aside.pride div.on strong, aside.pride div.on span, aside.pride ul li a.on {color:#00ffcc;}
  aside.news div.on strong, aside.news div.on span, aside.news ul li a.on {color:#8d31ff;}
  aside.careers div.on strong, aside.careers div.on span, aside.careers ul li a.on {color:#ff5d32;}
  aside.contact div.on strong, aside.contact div.on span, aside.contact ul li a.on {color:#32a1ff;}

  aside.pride div ul li a.on {border-bottom: 5px solid #00ffcc;}
  aside.news div ul li a.on {border-bottom: 5px solid #8d31ff;}

  aside a.btn {display: inline-block; padding:0 15px; margin-left: 14px; font-size: 15px; line-height: 23px; height: 25px; background: #ffffff; border-radius: 12px;}
  aside a.box_btn {display: inline-block; padding:0 50px; font-size: 16px;  line-height: 45px; height: 47px; margin-top: 10px; color: #ffffff; border:1px solid #fff; border-radius: 2px;}
  aside a.box_btn em {font-style: normal; font-size: 12px; display: inline-block; margin-left: 5px; vertical-align: middle}

section {position: relative; width:720px; margin: 0 auto; padding: 707px 40px 0; box-sizing:border-box; background: #fff; color: #212121; z-index: 1}

footer {position: relative; display: flex; justify-content: center; align-items: center;  flex-direction: column;  gap : 20px; width:720px; margin: 0 auto; height: 200px; background: #000000; text-align: center; font-size: 22px; color:#fff;  box-sizing: border-box;}
  footer p:last-child {display: flex; justify-content: center; align-items: center; flex-direction: column; gap : 10px;}
  footer img {position: absolute;  bottom: 0; right: 0;  width: 32%;}
  footer a {color:#fff; text-decoration: underline; font-size: ;}
  footer a.btn {margin: 0 0 0 0; background: #494949; font-size: 18px; text-decoration: none; line-height: 28px; height: 28px; vertical-align: 1px;}
  footer span {font-size: 14px; padding: 0 15px; color:#9b9b9b}

.category {padding-bottom: 50px; display: none}

h2.page_tit {font-size: 85px; color: #212121; font-family: 'Rising_CHAI_Extra_Bold'; letter-spacing: -0.05em}
p.page_txt {padding: 25px 0 130px; font-size: 28px; font-family: 'Rising_CHAI_Light'; line-height: 32px; color: #212121; }

a.more {display: flex; padding-bottom:45px; flex-direction: column; align-items: center; line-height: 47px;}

.paging {text-align: center; font-size: 25px;}
.paging a, .paging span {display: inline-block; margin: 0 20px; color: #939393;}
.paging a.prev, .paging a.next {margin: 0 10px; font-size: 15px; vertical-align: 4px}

.gotop {position: fixed; bottom: 220px; right: 40px; z-index: 2}
/* .main .gotop {display: none} */

/* layer */
.pop{position:absolute;top:0;left:0;width:100%;height:100%;display:none;z-index:1000;}
.pop .bg{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;opacity:.8;filter:alpha(opacity=80);z-index:1000;}
.pop .close{position: absolute; right: 20px; top: 20px;}

/* loading */
.loading {opacity: 0.6; pointer-events: none;}
.loading .loading-spinner {display: block;}
.loading-spinner {display: none; position: absolute; left: 50%; top: 53%; transform: translate(-50%, -50%);}
.loading-spinner .spinner-border {width: 2.3rem; height: 2.3rem;}

@-webkit-keyframes spinner-border {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes spinner-border {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.spinner-border {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: text-bottom;
  border: 0.25em solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  -webkit-animation: spinner-border .75s linear infinite;
          animation: spinner-border .75s linear infinite; }

.spinner-border-sm {
  width: 1rem;
  height: 1rem;
  border-width: 0.2em; }

@-webkit-keyframes spinner-grow {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  50% {
    opacity: 1; } }

@keyframes spinner-grow {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  50% {
    opacity: 1; } }

.spinner-grow {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: text-bottom;
  background-color: currentColor;
  border-radius: 50%;
  opacity: 0;
  -webkit-animation: spinner-grow .75s linear infinite;
          animation: spinner-grow .75s linear infinite; }
