@charset "utf-8";

.parallax-left{-webkit-transition-property: transform, opacity; transition-property: transform, opacity; opacity: 0; }
.parallax-left-show{-webkit-transition-duration : 1s; transition-duration : 1s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; }
.parallax-left-hide{-webkit-transition-duration : 1s; transition-duration : 1s; -webkit-transform: translate3d(-30px, 0, 0); transform: translate3d(-30px, 0, 0); opacity: 0; }

.parallax-right{-webkit-transition-property: transform, opacity; transition-property: transform, opacity; opacity: 0; }
.parallax-right-show{-webkit-transition-duration : 1s; transition-duration : 1s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; }
.parallax-right-hide{-webkit-transition-duration : 1s; transition-duration : 1s; -webkit-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 0, 0); opacity: 0; }

.parallax-top{-webkit-transition-property: transform, opacity; transition-property: transform, opacity; opacity: 0; }
.parallax-top-show{-webkit-transition-duration : 1.3s; transition-duration : 1.3s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; }
.parallax-top-hide{-webkit-transition-duration : 1.3s; transition-duration : 1.3s; -webkit-transform: translate3d(0, -45px, 0); transform: translate3d(0, -45px, 0); opacity: 0; }

.parallax-bottom{-webkit-transition-property: transform, opacity; transition-property: transform, opacity; opacity: 0; }
.parallax-bottom-show{-webkit-transition-duration : 1.3s; transition-duration : 1.3s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; }
.parallax-bottom-hide{-webkit-transition-duration : 1.3s; transition-duration : 1.3s; -webkit-transform: translate3d(0, 45px, 0); transform: translate3d(0, 45px, 0); opacity: 0; }

.parallax-zoom{-webkit-transition-property: transform, opacity; transition-property: transform, opacity; opacity: 0; }
.parallax-zoom-show{-webkit-transition-duration : 0.7s; transition-duration : 0.7s; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); opacity: 1; }
.parallax-zoom-hide{-webkit-transition-duration : 0.7s; transition-duration : 0.7s; -webkit-transform: scale3d(0.8, 0.8, 0.8); transform: scale3d(0.8, 0.8, 0.8); opacity: 0; }

.video-show{
    -webkit-transition-duration : 0.5s;
    transition-duration : 0.5s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
}
.video-hide{
    -webkit-transition-duration : 1.3s;
    transition-duration : 1.3s;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    opacity: 0;
}



/* 딜레이 */
.ef-delay200{opacity: 0; animation-delay: 200ms; -webkit-animation-delay: 200ms; }
.ef-delay400{opacity: 0; animation-delay: 400ms; -webkit-animation-delay: 400ms; }
.ef-delay600{opacity: 0; animation-delay: 600ms; -webkit-animation-delay: 600ms; }
.ef-delay800{opacity: 0; animation-delay: 800ms; -webkit-animation-delay: 800ms; }
.ef-delay1000{opacity: 0; animation-delay: 1000ms; -webkit-animation-delay: 1000ms; }
.ef-delay1200{opacity: 0; animation-delay: 1200ms; -webkit-animation-delay: 1200ms; }
.ef-delay1400{opacity: 0; animation-delay: 1400ms; -webkit-animation-delay: 1400ms; }
.ef-delay1600{opacity: 0; animation-delay: 1600ms; -webkit-animation-delay: 1600ms; }
.ef-delay1800{opacity: 0; animation-delay: 1800ms; -webkit-animation-delay: 1800ms; }
.ef-delay2000{opacity: 0; animation-delay: 2000ms; -webkit-animation-delay: 2000ms; }
.ef-delay2200{opacity: 0; animation-delay: 2200ms; -webkit-animation-delay: 2200ms; }
.ef-delay2400{opacity: 0; animation-delay: 2400ms; -webkit-animation-delay: 2400ms; }
@-webkit-keyframes ef_basic {
    from{-webkit-transform: translate3d(0, 6%, 0); transform: translate3d(0, 6%, 0); opacity: 0; }
    50%{-webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); }
    to{opacity: 1; }
}
@keyframes ef_basic {
    from{-webkit-transform: translate3d(0, 6%, 0); transform: translate3d(0, 6%, 0); opacity: 0; }
    50%{-webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); }
    to{opacity: 1; }
}
.ef-basic{-webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-name: ef_basic; animation-name: ef_basic; }




/* 그라데이션 */
@-webkit-keyframes gradients {
    50%{background-position: 100% 0; }
}
@keyframes gradients {
    50%{background-position: 100% 0; }
}
@-webkit-keyframes gradients2 {
    100%{background-position: 100% 0; }
}
@keyframes gradients2 {
    100%{background-position: 100% 0; }
}




/* 스핀 */
@-webkit-keyframes event-spin {
    0% {-webkit-transform: rotate(0deg); transform: rotate(0deg); }
    100% {-webkit-transform: rotate(359deg); transform: rotate(359deg); }
}
@keyframes event-spin {
    0% {-webkit-transform: rotate(0deg); transform: rotate(0deg); }
    100% {-webkit-transform: rotate(359deg); transform: rotate(359deg); }
}
.spin{-webkit-animation: event-spin 40s infinite linear; animation: event-spin 40s infinite linear; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.spin2{-webkit-animation: event-spin 1s infinite linear; animation: event-spin 1s infinite linear; -webkit-animation-fill-mode: both; animation-fill-mode: both; }





/* 타이틀*/
@keyframes title_show {
    from{transform: translate3d(-10%, 0, 0) rotate(25deg); opacity: 0; }
    to{transform: translate3d(0, 0, 0) rotate(45deg); opacity: 1; }
}
@keyframes title_show2 {
    from{transform: translate3d(10%, 0, 0) rotate(50deg); opacity: 0; }
    to{transform: translate3d(0, 0, 0) rotate(65deg); opacity: 1; }
}
.title-bg:before,
.title-bg:after{-webkit-animation-fill-mode: both; animation-fill-mode: both; }
.title-bg:before{-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: title_show; animation-name: title_show; }
.title-bg:after{-webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-name: title_show2; animation-name: title_show2; }





/* 게시글 없을때 */
@-webkit-keyframes nbox_effect {
    from {-webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
    10%, 20% {-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -4deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -4deg); }
    30%, 50%, 70%, 90% {-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 4deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 4deg); }
    40%, 60%, 80% {-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -4deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -4deg); }
    to {-webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
}
@keyframes nbox_effect {
    from {-webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
    10%, 20% {-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -4deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -4deg); }
    30%, 50%, 70%, 90% {-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 4deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 4deg); }
    40%, 60%, 80% {-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -4deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -4deg); }
    to {-webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
}
.nbox > div{-webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-name: nbox_effect; animation-name: nbox_effect; }




/* 팀원 모집 */
@keyframes rot {
    0% {transform: rotate(0deg); }
    100% {transform: rotate(360deg); }
}
@keyframes scl {
    0% {transform: scale(0.96); }
    50% {transform: scale(1); }
    100% {transform: scale(0.96); }
}
@-webkit-keyframes careers_effect1 {
    from, to {opacity: 0.7; }
    50% {-webkit-transform: scale3d(1.05, 1.05, 1) rotate3d(0, 0, 1, -1deg); transform: scale3d(1.05, 1.05, 1) rotate3d(0, 0, 1, -1deg); opacity: 1; }
}
@keyframes careers_effect1 {
    from, to {opacity: 0.7; }
    50% {-webkit-transform: scale3d(1.05, 1.05, 1) rotate3d(0, 0, 1, -1deg); transform: scale3d(1.05, 1.05, 1) rotate3d(0, 0, 1, -1deg); opacity: 1; }
}
@-webkit-keyframes careers_effect2 {
    50% {-webkit-transform: rotate3d(0, 0, 1, -1deg); transform: rotate3d(0, 0, 1, -1deg); }
}
@keyframes careers_effect2 {
    50% {-webkit-transform: rotate3d(0, 0, 1, -1deg); transform: rotate3d(0, 0, 1, -1deg); }
}
@-webkit-keyframes careers_effect3 {
    25% {-webkit-transform: translate3d(10px, 0, 0) skewY(1deg); transform: translate3d(10px, 0, 0) skewY(1deg); }
    75%{-webkit-transform: translate3d(-10px, 0, 0) skewY(-1deg); transform: translate3d(-10px, 0, 0) skewY(-1deg); }
}
@keyframes careers_effect3 {
    25% {-webkit-transform: translate3d(10px, 0, 0) skewY(1deg); transform: translate3d(10px, 0, 0) skewY(1deg); }
    75%{-webkit-transform: translate3d(-10px, 0, 0) skewY(-1deg); transform: translate3d(-10px, 0, 0) skewY(-1deg); }
}
.careers-bg2 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: careers_effect2;
    animation-name: careers_effect2;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.careers-bg3 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: careers_effect3;
    animation-name: careers_effect3;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.careers-bg1 {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-name: careers_effect1;
    animation-name: careers_effect1;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}




/**
 * 메인 private
 */
@-webkit-keyframes private_effect1 {
    50% {-webkit-transform: rotate3d(0, 0, 1, -2deg); transform: rotate3d(0, 0, 1, -2deg); }
}
@keyframes private_effect1 {
    50% {-webkit-transform: rotate3d(0, 0, 1, -2deg); transform: rotate3d(0, 0, 1, -2deg); }
}
@-webkit-keyframes private_effect2 {
    25%{-webkit-transform:skew(5deg, 0deg) rotateZ(-4deg); ​ transform:skew(5deg, 0deg) rotateZ(-4deg); ​ }
    75%{-webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); }
}
@keyframes private_effect2 {
    25%{-webkit-transform:skew(5deg, 0deg) rotateZ(-4deg); ​ transform:skew(5deg, 0deg) rotateZ(-4deg); ​ }
    75%{-webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); }
}
.mprivate-btn{
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: private_effect1;
    animation-name: private_effect1;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.mprivate-btn:before{
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: private_effect2;
    animation-name: private_effect2;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.private-show{
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
    -webkit-transition-duration : 1s;
    transition-duration : 1s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.private-hide{
    -webkit-transform: translate3d(0, 130%, 0);
    transform: translate3d(0, 130%, 0);
}




/**
 * 메인 카운트 다운
 */
@-webkit-keyframes cntdwncolon {
    50% {opacity: 0.2; }
}
@keyframes cntdwncolon {
    50% {opacity: 0.2; }
}
@-webkit-keyframes mcnt_effect {
    from {-webkit-transform: scale3d(1.4, 1.4, 1.4) rotate3d(0, 0, 1, -2deg); transform: scale3d(1.4, 1.4, 1.4) rotate3d(0, 0, 1, -2deg); }
    to {-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg); }
}
@keyframes mcnt_effect {
    from {-webkit-transform: scale3d(1.4, 1.4, 1.4) rotate3d(0, 0, 1, -2deg); transform: scale3d(1.4, 1.4, 1.4) rotate3d(0, 0, 1, -2deg); }
    to {-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg); }
}
.cntdwn-colon{-webkit-animation: cntdwncolon 1.5s ease-in-out infinite; animation: cntdwncolon 1.5s ease-in-out infinite; }
.mcnt{
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-name: mcnt_effect;
    animation-name: mcnt_effect;
}