.input{
    display: block;

    background-color: var(--grey);

    width: 100%;

    margin: 2% auto;

    box-sizing: border-box;
    padding: 4% 5%;

    border-style: none;

    font-family: 'Gotham';
    font-size: calc(10px + (20 - 10) * ((100vw - 320px) / (1080 - 320)));

    letter-spacing: 0.05rem;

    color: var(--white);
}
.input::placeholder{
    font-family: 'Gotham';
    font-size: calc(10px + (20 - 10) * ((100vw - 320px) / (1080 - 320)));

    letter-spacing: 0.01rem;

    color: var(--white);
}
@media only screen and (orientation: landscape) {
    .input{
        font-size: calc(6px + (20 - 6) * ((100vw - 320px) / (1920 - 320)));
    }
    .input::placeholder{
        font-size: calc(6px + (20 - 6) * ((100vw - 320px) / (1920 - 320)));
    }
}