.main {
    display: grid;
    grid-template-columns: 1fr 3.9em;    
    grid-gap: 1px;
    max-width: 40em;
    height: 100%;
    margin:0 auto;
}

.ver-90 {
    font-size:1.5em;
    font-weight:bold;
    display: flex;
    writing-mode: vertical-rl;
    align-items: center;
    align-self: center;
    color: #ffffff;
}

.main-2 {
    display: grid;
    grid-template-rows: repeat(5, 1fr);
    text-align: center;    
}

    .main-2 > div {
        background-color: #ffffff;
        font-size: 1.5em;
        align-content: center;
        min-height: 4em;
    }

    .main-2 > div:nth-child(even) {
        background-color: silver;
        color: #000000;
    }

        .main-2 > div > * {
            margin:0.2em 0.1em;
        }

        .main-2 > div > input {
            width: 5em; color:gray;
        }

        .main-2 > div > button {
            padding: 0.5em 0.1em;
            color: red;
        }

.user-id { 
    font-size:0.7em; 
    word-break:break-all;
}

.call2 {
    padding: 1em 0.1em;
    color: red;
    font-size:1em;
    background-color: #dcdcdc;
    border: solid 1px gray;
    box-shadow: 3px 3px gray;
    text-decoration: none;
}

@media only screen and (orientation: landscape) {
    .main {
        max-width: 60em;
    }

    .main-2 {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(3, 1fr);
        grid-gap: 1px;
    }
}