@charset "UTF-8";
.dialog_reservation_filed{
    background-color: var(--body--block-color-2);
    color: var(--font--color-1);
    position: relative;
    width: fit-content;
    margin: auto;
}

.dialog_reservation_selects{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 3em;
    gap: 0.5em;
    flex: 1;
}.dialog_reservation_selects > div{
    border-radius: 3px;
    background-color: var(--button--reservation-button);
    border: 1px solid rgb(121, 121, 121);
}

.dialog_reservation_textarea{
    width: 100%;
    height: 7em;
    padding: 0.5em;
    border-radius: 3px;
    border: 1px solid rgb(121, 121, 121);
    resize: none;
}
/* PC */
@media (min-width: 768px) {
    .dialog_reservation_filed{
        height: 80vh;
        width: 60vw;
        max-height: 40em;
        min-width: 50em;
    }

    .dialog_reservation_selects{
        grid-template-columns: repeat(2, 1fr);
        padding: 0.5em 0;
    }
}
/* SP */
@media (max-width: 767px) {
    .dialog_reservation_filed{
        height: 90vh;
        width: 90vw;
        max-height: 35em;
    }

    .dialog_reservation_selects{
        grid-template-columns: repeat(1, 1fr);
    }
}