body {
    width: 100%;
    height: 100%;
    margin: auto;
    overflow-x: hidden;
    overflow-y: hidden;
}

main {
    max-width: 1200px;
    margin: auto;
    position: relative;
}

#logo {
    width: 147px;
    height: 265px;
    text-align: center;
    text-indent: -9999px;
    background: url(../images/index_logo.png)no-repeat;
    margin: auto;
}

body {
    font-size: 62.5%;
    font-style: Arial;
}

.animation-box {
    width: 75%;
    height: 35rem;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

.animation-container {
    width: 1000rem;
    height: 35rem;
}

@keyframes topFadeOut {
    0% {
        position: absolute;
        top: -3rem;
        opacity: 0;
    }
    75% {
        position: absolute;
        top: 25%;
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }
    45% {
        opacity: 1;
    }
    100% {
        opacity: 0%;
    }
}

.first-text {
    font-size: 2.2rem;
    position: absolute;
    top: 9rem;
    opacity: 0;
    animation-name: topFadeOut;
    animation-duration: 6s;
}

.second-text {
    font-size: 2.5rem;
    position: absolute;
    top: 10rem;
    opacity: 0;
    animation-name: fadeInOut;
    animation-delay: 5.5s;
    animation-duration: 8s;
    text-align: right;
    right: 0;
}

.third-text {
    position: absolute;
    top: 8rem;
    display: none;
}

.logo_a {
    display: block;
    width: 147px;
    height: 265px;
}

.homeBt {
    position: absolute;
    top: 50px;
    right: 50px;
    font-size: 1.5em;
}

.homeBt a {
    color: #a8a7a7;
}

.homeBt a:hover {
    color: #000;
    text-decoration: underline;
}


/*일반 PC : width : 1000px 이상*/

@media screen and (min-width:980px) {
    main {
        padding-top: 10%
    }
    .third-text {
        left: 50%;
        transform: translateX(-50%);
    }
}


/*테블릿 PC - width : 960px 이상 999px 이하*/

@media screen and (min-width:640px) and (max-width:979px) {
    main {
        padding-top: 15%;
    }
    .first-text {
        font-size: 1.8rem;
    }
    .second-text {
        font-size: 1.7rem;
    }
    .third-text {
        left: 50%;
        transform: translateX(-50%);
    }
    .homeBt {
        font-size: 1.2em;
    }
}


/*mobile - width :639px 이하 */

@media screen and (max-width:639px) {
    main {
        padding-top: 13%;
    }
    .first-text {
        font-size: 1rem;
    }
    .second-text {
        font-size: 0.8rem;
    }
    .third-text {
        left: 50%;
        transform: translateX(-50%);
    }
    .homeBt {
        font-size: 1.2em;
    }
}