body {background:#000000;}

.header .logo {background:url(../images/common/logo_w.svg) no-repeat left center;background-size:150px auto;}
.header .nav {background:rgba(0,0,0,0);border-bottom:1px solid rgba(255,255,255,0.1)}
.header .nav .nav_list .nav_item .nav_item_link {color:#ffffff;}
.header .nav .nav_list .nav_item .nav_item_link::after {background:#ffffff;}
.header .nav .nav_list .nav_item:hover .nav_item_link {color:#ffffff;}

.header .navsub_bg {background:rgba(0,0,0,0);border-top:1px solid rgba(0,0,0,0.1);}
.header .nav .navsub .navsub_item_link {color:#ffffff;}
.header .nav .navsub .navsub_item_link:hover {background:#e9e9e9;color:#353794;}

.btn_link_wrap {position:fixed;bottom:160px;left:40px;right:40px;display:flex;justify-content:center;align-items:center;z-index:999;}
.btn_link_wrap a {display:flex;flex:none;justify-content:center;align-items:center;font-size:20px;font-weight:300;color:#ffffff;padding:30px 100px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.2)}
.btn_link_wrap a:nth-child(1) {margin-right:10px;}
.btn_link_wrap a:nth-child(2) {margin-left:10px;}

footer {position:fixed;bottom:0;left:0;right:0;margin-top:0;background:rgba(0,0,0,0);border-top:1px solid rgba(255,255,255,0.03);z-index:999;}
footer p span {color:rgba(255,255,255,0.4)}
footer p:nth-child(1) span {color:rgba(255,255,255,0.4)}
footer p:nth-child(1) span + span {color:rgba(255,255,255,0.4)}
footer p:nth-child(2) span {color:rgba(255,255,255,0.4)}
footer p:nth-child(2) span + span {color:rgba(255,255,255,0.4)}


.container {position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;}
.photo {position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;
    -webkit-animation:bgAnimation 40s  infinite;
    -moz-animation:bgAnimation 40s  infinite;
    -o-animation:bgAnimation 40s  infinite;
    -ms-animation:bgAnimation 40s  infinite;    
    animation:bgAnimation 40s  infinite;
}
@-webkit-keyframes bgAnimation {
    25% {opacity:1;transform:scale(1);}
    40% {opacity:0;}
    80% {transform:scale(2) rotate(20deg);}
}
@-moz-keyframes bgAnimation {
    25% {opacity:1;transform:scale(1);}
    40% {opacity:0;}
    80% {transform:scale(2) rotate(20deg);}
}
@-o-keyframes bgAnimation {
    25% {opacity:1;transform:scale(1);}
    40% {opacity:0;}
    80% {transform:scale(2) rotate(20deg);}
}
@-ms-keyframes bgAnimation {
    25% {opacity:1;transform:scale(1);}
    40% {opacity:0;}
    80% {transform:scale(2) rotate(20deg);}
}
@keyframes bgAnimation {
    25% {opacity:1;transform:scale(1);}
    40% {opacity:0;}
    80% {transform:scale(2) rotate(20deg);}
}
.photo:nth-child(1) {background:url(../images/main/main_img01.png) no-repeat center center;background-size:cover;
    -webkit-animation-delay:0s;
    -moz-animation-delay:0s;
    -o-animation-delay:0s;
    -ms-animation-delay:0s;
    animation-delay:0s;
}
.photo:nth-child(2) {background:url(../images/main/main_img02.png) no-repeat center center;background-size:cover;
    -webkit-animation-delay:10s;
    -moz-animation-delay:10s;
    -o-animation-delay:10s;
    -ms-animation-delay:10s;
    animation-delay:10s;
}
.photo:nth-child(3) {background:url(../images/main/main_img03.png) no-repeat center center;background-size:cover;
    -webkit-animation-delay:20s;
    -moz-animation-delay:20s;
    -o-animation-delay:20s;
    -ms-animation-delay:20s;
    animation-delay:20s;
}
.photo:nth-child(4) {background:url(../images/main/main_img04.png) no-repeat center center;background-size:cover;
    -webkit-animation-delay:30s;
    -moz-animation-delay:30s;
    -o-animation-delay:30s;
    -ms-animation-delay:30s;
    animation-delay:30s;
}

.text_ani, .text_ani:after {position:fixed;width:100%;height:100%;top:-20px;left:0px;z-index:2;}
.text_ani li{position:absolute;top:50%;left:0px;width:100%;text-align:center;opacity:0;margin-top:-80px;
    -webkit-animation:textAnimation 40s linear infinite 0s;
    -moz-animation:textAnimation 40s linear infinite 0s;
    -o-animation:textAnimation 40s linear infinite 0s;
    -ms-animation:textAnimation 40s linear infinite 0s;
    animation:textAnimation 40s linear infinite 0s;
}
.text_ani li:nth-child(1) {margin-top:-100px;}
.text_ani li:nth-child(1) p {font:300 50px 'NanumBarunGothic';}
.text_ani li:nth-child(1) p strong {font-weight:500;}
.text_ani li:nth-child(4) p {font:100 120px 'Roboto';}
.text_ani li p {font-size:40px;padding:0;font:100 160px 'Roboto';color:#ffffff;}
.text_ani li p + p {padding-top:10px;}
.text_ani li:nth-child(2){
    -webkit-animation-delay:10s;
    -moz-animation-delay:10s;
    -o-animation-delay:10s;
    -ms-animation-delay:10s;
    animation-delay:10s;
}
.text_ani li:nth-child(3){
    -webkit-animation-delay:20s;
    -moz-animation-delay:20s;
    -o-animation-delay:20s;
    -ms-animation-delay:20s;
    animation-delay:20s;
}
.text_ani li:nth-child(4) {
    -webkit-animation-delay:30s;
    -moz-animation-delay:30s;
    -o-animation-delay:30s;
    -ms-animation-delay:30s;
    animation-delay:30s;
}

/* Animation for the text */
@-webkit-keyframes textAnimation {
    0% {opacity:0;transform:translateY(60px);}
    10% {opacity:1;transform:translateY(0px);}
    20% {opacity:1;transform:scale(1);}
    30% {opacity:0}
    36% {opacity:0;transform:scale(1.2);}
    100% {opacity:0}
}
@-moz-keyframes textAnimation {
    0% {opacity:0;transform:translateY(60px);}
    10% {opacity:1;transform:translateY(0px);}
    20% {opacity:1;transform:scale(1);}
    30% {opacity:0}
    36% {opacity:0;transform:scale(1.2);}
    100% {opacity:0}
}
@-o-keyframes textAnimation {
    0% {opacity:0;transform:translateY(60px);}
    10% {opacity:1;transform:translateY(0px);}
    20% {opacity:1;transform:scale(1);}
    30% {opacity:0}
    36% {opacity:0;transform:scale(1.2);}
    100% {opacity:0}
}
@-ms-keyframes textAnimation {
    0% {opacity:0;transform:translateY(60px);}
    10% {opacity:1;transform:translateY(0px);}
    20% {opacity:1;transform:scale(1);}
    30% {opacity:0}
    36% {opacity:0;transform:scale(1.2);}
    100% {opacity:0}
}
@keyframes textAnimation {
    0% {opacity:0;transform:translateY(60px);}
    10% {opacity:1;transform:translateY(0px);}
    20% {opacity:1;transform:scale(1);}
    30% {opacity:0}
    36% {opacity:0;transform:scale(1.2);}
    100% {opacity:0}
}

.header .btn_mo_nav span {background:#ffffff;}

@media screen and (max-width:1024px){
    .header {background:rgba(0,0,0,0);border-bottom:1px solid rgba(255,255,255,0.1)}  
    .header .logo {top:0;left:20px;height:60px;background-size:110px auto;}
    .btn_link_wrap {display:flex;}
    .btn_link_wrap a {flex:1;padding:20px 0;font-size:16px;}
    .text_ani, .text_ani:after {top:-60px;}
}

@media screen and (max-width:800px){
    .text_ani li p {font:100 70px 'Roboto';}
    .text_ani li:nth-child(1) p {font:300 43px 'NanumBarunGothic';}
    .text_ani li:nth-child(4) p {font:100 60px 'Roboto';}
}