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

/* font-family: 'NanumGothicLight';
font-family: 'NanumGothic';
font-family: 'NanumGothicBold';
font-family: 'NanumGothicExtraBold'; */

/* width */
::-webkit-scrollbar {
  width: 3px;
}

/* Track */
::-webkit-scrollbar-track {
  background: transparent;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #555;
  opacity: 0.5
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

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

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

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

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

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



#fixed {}
#fixed.on {position: fixed; display: block; top:-87px; width: 100%; height: 87px; background: #000; z-index: 9999}
	#fixed.on .main_down {display:block; animation: none;}
	#fixed.on .sns {top: 33px;}
	#fixed.on .main_down {top: 28px;}
	#fixed.on .main_down img {transform: rotate(180deg);}
  .main .main_down{display:block; z-index: 1}
  .main_down {display:none;position: absolute; left: 50%; bottom: 45px; transform: translateX(-50%);cursor: pointer; 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;}
  }

  .sns {position: absolute; left: 36px; bottom: 30px; z-index: 1}
  .sns a {display: inline-block; margin-right: 15px;}

  #fixed.on .menu {position: absolute; right: 40px; top: 30px; display: block;}

.menu_wrap {}
  .menu_open .close {position: absolute; right: 42px; top: 30px;}
  .menu {position: absolute; right: 40px; top: 30px; display: none;}
  .main .menu { display: block; z-index: 1}
  .menu_open {position: fixed; left: 0; top: 0; width: 100%; height: 100%; padding-bottom: 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: 1240px; width: 100%; height: 130px; margin: 0 auto; display: flex; justify-content: space-between; align-items:flex-end; border-bottom:2px solid #212121}
  .menu_open dl a {color:#fff;}
  .menu_open dl dt {font-size: 78px; font-family: 'Rising_CHAI_Extra_Bold';}
  .menu_open dl dd { font-family: 'Rising_CHAI_Light'; line-height: 240%}
  .menu_open dl dd a {display: inline-block; padding-left: 50px; color:#909090; font-size: 25px;}
  .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 .cha {position: absolute; right: 70px; bottom: 64px;}

@media (max-width: 1800px) {
  .menu_open .chaWrap {width: 100%; padding: 30px; text-align: right;}
  .menu_open .cha {position: static;}
}


aside {position: fixed; width: 370px; height: calc(100% - 90px); padding: 55px 0 55px 38px; color:#fff; background: #212121; box-sizing: border-box; z-index: 2; top:0; overflow-y: auto;}
  aside h1 {font-size: 65px;  color:#fff; letter-spacing: -0.05em; font-family: 'Rising_CHAI_Extra_Bold';}
  aside h1 p {padding: 15px 0 30px; font-size: 15px; color:#909090; line-height: 180%; letter-spacing: 0em; font-family: 'NanumGothic'; font-weight: normal;}

  aside nav div {padding: 20px 0 0px; font-size: 35px; color:#434343;  line-height: 120%; letter-spacing: -0.03em; cursor: pointer; border-top: 0 solid #383838;}
  aside nav div a {color:#434343;}
  aside nav div strong { font-family: 'Rising_CHAI_Extra_Bold';}
  aside nav div span {font-family: 'dotum'}
  aside nav div span::before {content: "-"}
  aside nav div p, aside div ul {display: none}

  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: "+";animation: mbar 0.5s ;}
  aside div.on p {padding: 10px 0; font-size: 15px; color:#909090; line-height: 180%}

  aside div.on {}

  @keyframes slider {
    0% {
      display: none;
      opacity: 0;
      transform: scaleY(0.5);
      transform-origin: top;
    }
    100% {
      opacity: 1;
      display: block;
      transform: scaleY(1);
      transform-origin: top;

    }
  }

  @keyframes mbar {
     0% {
      content: "-"
    }
    70% {
      content: "+"
  }
}

  aside ul {padding-bottom: 15px}
  aside ul li a {display: block; color:#fff; font-size: 18px; padding-top: 10px; line-height: 150%; }

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

  #news ul div {display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; width: 100%}
  #news ul div dt img {width:100%; object-fit: cover; margin-bottom: 5px;}
  #news ul div dd {color:#909090; font-size: 13px; line-height: 19px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;word-wrap:break-word; }
  #news ul div dd a {display: inline; font-size: 12px; color:#fff; background: #494949; border-radius: 2px; padding:1px 5px 2px;}

  #careers div dl, #careers div a.btn {display: none}
  #careers div.on dl {display: block;}
  #careers div.on a.btn {display: inline-block;}
  #careers div dl dd {position: relative; font-size: 13px; line-height: 30px; color: #909090;}
  #careers div dl dd * {vertical-align: top}
  #careers div dl dd a {display: inline-block;  color: #909090; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; width: calc(100% - 120px); overflow:hidden;}
  #careers div dl dd em {display: inline-block; padding-right: 5px; font-weight: bold; color:#fff;}
  #careers div dl dd i {position: absolute; right:0; top: 8px; width: 67px; height: 22px; font-size: 12px; color: #dbdbdb; background: #494949; display: flex; justify-content: center; align-items: center; font-style:normal; border-radius: 2px; display: none;}
  #careers div a.btn {margin-left: 0}


aside div.logo {position: fixed; left:0 ; bottom: 0; display: flex; width:370px; margin-top: 0; padding: 32px; justify-content: space-between; background: #212121; box-sizing: border-box;}

section {position: relative; width:1200px; min-height: calc(100% - 90px - 140px - 50px); padding: 140px 50px 50px 420px; margin: 0 auto; box-sizing: content-box; z-index: 1}

footer {display: flex; justify-content: center; align-items: center; flex-direction: column;  gap : 10px; min-width: 1670px; width: 100%; height: 90px; padding: 0 0 0 370px; background: #000000; text-align: center; color:#fff;  box-sizing: border-box;}
  footer p {display: flex; justify-content: center; align-items: center; gap : 10px;}
  footer a {color:#fff; text-decoration: underline; font-size: ;}
  footer a.btn {margin: 0 0 0 0; background: #494949; font-size: 13px; text-decoration: none; line-height: 21px; height: 23px; vertical-align: 1px;}
  footer span {font-size: 14px; padding: 0 15px; color:#9b9b9b}

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

h2.page_tit {font-size: 90px; line-height: 108px; color: #212121; font-family: 'Rising_CHAI_Extra_Bold' !important; }
h2.page_tit span {font-family: 'Rising_CHAI_Extra_Bold' !important;}
p.page_txt {padding: 240px 0 130px; font-size: 18px; line-height: 32px; color: #212121;font-family: 'Rising_CHAI_Extra_Bold' !important;}

i {font-style: normal; }

h2.page_tit i,
p.page_txt i {font-style: normal; display: inline-block; animation-name: tit_move;  animation-duration: 0.5s;}

@keyframes tit_move {
  0% {transform: translateY(-20px); opacity: 0.5}
  100% {transform: translateY(0);  opacity: 1}
}

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

/* 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;}