body{
    font-size:16px;
    font-family: "Helvetica Neue", Arial, "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

header{
    color:#9e9e9f;
    font-size: 0.8em;
    position: absolute;
    z-index: 100;
}

header a img{
    width: 5.82em;
    margin-top:1em;
    margin-left:1em;
}



body footer{
    color:#666;
    display:flex;
    width: 100%;
    justify-content: space-between;
    position: absolute;
    bottom:0;
    left:0;
}

.footer__discription{
    font-size:0.68em;
    margin-bottom: 0.6rem;
    margin-left: 1rem;
    transform: scale(0.8);
    transform-origin: left bottom;
}
.footer__copyright{
    font-size:0.5em;
    position: absolute;
    bottom:1em;
    right:1rem;
    transform: scale(0.8);
    transform-origin: right bottom;
}

@media screen and (max-aspect-ratio: 1/1){
    body header{
         font-size: 4vw; 
    }
}

@media screen and (max-width: 500px) {
    header a img{
        width: 25vw;
        margin-top:4vw;
        margin-left:4vw;
    }
}


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

    body footer{
        display: block;
        font-size:3vw;
        width: 94vw;
        margin-left: 3vw;
    }

    body footer br{
        display:none;
    }


    .footer__discription{
        transform:none;
        position: relative;
        margin:0;
        margin-bottom: 0.5rem;
        line-height: 1.5;
        text-align: justify;
    }

    .footer__copyright{
        transform:none;
        position: relative;
        bottom:auto;
        right:auto;
        
        margin-bottom:0.6rem;
    }

}

@media screen and (max-width: 500px) {
     body footer{
        font-size:5vw;

     }
}