@font-face {
    /* ① ここにfont-familyで指定したい名前を書く*/
    font-family: "myfont";

    /* フォントが置かれているパスを書く */
    src: url("/assets/fonts/Krungthep.ttf") format("truetype")
}

body {
    font-family: "myfont";
    color: white;
    background-color: black;
}

.container {
    min-height: 100vh;
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    overflow: hidden;
}

.title {
    width: 40vw;
}

.title {
    margin: 2rem auto;
}

.logo-container {
    display: flex;
    flex-flow: column nowrap;
}

.logo {
    width: 25%;
    height: auto;
    font-size: 1.8rem;
    padding: 2rem 1rem;
    opacity: 1;
    transition: opacity 0.3s ease;
}

@media (max-width: 768px) {
    .logo {
        width: 40%;
    }

    .title {
        width: 70%;
    }
}

@media (max-width: 560px) {
    .logo {
        width: 60%;
    }

    .title {
        width: 90%;
    }
}

.logo:hover {
    opacity: 0.5;
}

.wolf-inc {
    text-align: end;
}

.wolf-inc:hover {
    opacity: 1;
}

.wolf-inc>*:hover {
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.bottom-line-box {
    height: 2px;
    background-color: white;
}

.footer-container {
    text-align: center;
}