@charset "utf-8";


@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@500&display=swap");

@import url("https://fonts.googleapis.com/css?family=Lato:900&display=swap");

@import url('https://fonts.googleapis.com/css2?family=Alegreya:wght@400;800&display=swap');



.morphing {
    position: relative;
    font-size: 80px;
    background-color: #0b1642;
    color: #fff;
    min-height: 100vh;
    filter: contrast(100) blur(1px);
    line-height: 0.6;
}



.morp-jp {
    font-size: 30px;
    white-space: nowrap;
    line-height: 0.5;
    letter-spacing: 0;
}

.line {
    positon: relative;
    padding-left: 1rem;
    padding-right: 1rem;
}

.line::before {
    position: absolute;
    background: #fff;
    height: 4px;
    width: 100%;
    left: 0;
    top: 69%;
    content: '';
}

.word {
    font-family: 'Noto Serif JP', serif;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-animation: word 8s infinite ease-in-out;
    animation: word 8s infinite ease-in-out;
}

.word:nth-child(1) {
    -webkit-animation-delay: -8s;
    animation-delay: -8s;
}

.word:nth-child(2) {
    -webkit-animation-delay: -4s;
    animation-delay: -4s;
}


@-webkit-keyframes word {

    18%,
    42% {
        filter: blur(0px);
        opacity: 1;
    }

    0%,
    5%,
    56%,
    100% {
        filter: blur(1em);
        opacity: 0;
    }
}

@keyframes word {

    18%,
    42% {
        filter: blur(0px);
        opacity: 1;
    }

    0%,
    5%,
    56%,
    100% {
        filter: blur(1em);
        opacity: 0;
    }
}





.movlogotitle_upper {
    display: flex;
    overflow: hidden;
    color: #fff;
}


.movlogotitle_upper span {
    font-family: 'Noto Serif JP', serif;
    font-size: 3rem;
    display: block;
    transform: translate(0, 105%);
    transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) .8s;

}


.movlogotitle_lower {
    display: flex;
    overflow: hidden;
    color: #fff;


}

.movlogotitle_lower span {
    font-family: 'Noto Serif JP', serif;
    font-size: 1rem;
    letter-spacing: 1px;
    line-height: 1;
    display: block;
    transform: translate(0, -105%);
    transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) .8s;
}










.movlogotitle_upper.-visible span {
    transform: translate(0, 0);
}

.movlogotitle_upper span:nth-child(2) {
    transition-delay: 0.03s;
}

.movlogotitle_upper span:nth-child(3) {
    transition-delay: 0.09s;
}

.movlogotitle_upper span:nth-child(4) {
    transition-delay: 0.12s;
}

.movlogotitle_upper span:nth-child(5) {
    transition-delay: 0.15s;
}

.movlogotitle_upper span:nth-child(6) {
    transition-delay: 0.18s;
}

.movlogotitle_upper span:nth-child(7) {
    transition-delay: 0.21s;
}


.movlogotitle_lower.-visible span {
    transform: translate(0, 0);
    transition-delay: 0.24s;
}

.movlogotitle_lower span:nth-child(2) {
    transition-delay: 0.27s;
}

.movlogotitle_lower span:nth-child(3) {
    transition-delay: 0.30s;
}

.movlogotitle_lower span:nth-child(4) {
    transition-delay: 0.33s;
}

.movlogotitle_lower span:nth-child(5) {
    transition-delay: 0.36s;
}

.movlogotitle_lower span:nth-child(6) {
    transition-delay: 0.39s;
}

.movlogotitle_lower span:nth-child(7) {
    transition-delay: 0.42s;
}







.border {
    content: '';
    position: absolute;
    top: 53.5%;
    left: 50%;

    transform: translateX(-50%);
    transform: translate(-50%, -50%);
    border-bottom: solid 3px #fff;
    animation: border_anim .8s linear forwards;

}

@keyframes border_anim {
    0% {
        width: 0%;
        opacity: 0;
    }

    69% {
        width: 0%;
        opacity: 0;
    }

    70% {
        width: 0%;
        opacity: 1;
    }


    100% {
        width: 200px;
    }
}




.site-logo .bgLRextend::before {
    height: 60px;
    margin-top: -15px;
}




.footer-logo img {
    width: 180px;
}


#vegas {
    width: 100vw;
    height: 100vh;

    position: fixed;
    left: 0;
    top: 0;
}

#vegas-sp {
    display: none;
}


@media screen and (max-width:500px) {

#vegas {
    display: none;
}


#vegas-sp {
    display: block;
    width: 100vw;
    height: 100vh;

    position: fixed;
    left: 0;
    top: 0;
}

}