#calendar-main {
    width: min(600px, 100%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: auto;
}

#calendar {
    text-align: center;
    justify-content: center;
    align-items: center;
}

#calendar>table {
    border-collapse: collapse;
    width: min(600px, 100%);
    border: solid 1px #BCBCBC;
}

#calendar th,
#calendar td {
    word-break: keep-all;
    border: solid 1px #BCBCBC;
    padding: 5px 3px;
}
#calendar .Sat { background: #eaf3ff;}
#calendar .Sun { background:rgb(255, 234, 234);}

.not-reservable {
    background-color: #D5D5D5;
    color: #979696;
    cursor: context-menu;
}

.reservable {
    color: #D87A7A;
    cursor: pointer;
}

.gray-background {
    background-color: #F5F5F5;
}

.saturday {
    background-color: #EDF6FA;
    color: #2097ce;
}

.sunday {
    background-color: #FADADA;
    color: #ce2020;
}

#year-month {
    font-weight: bold;
    margin-bottom: 3px;
}

#prev-week,
#next-week,
#close {
    background-color: #EDF6FA;
    border-radius: 10px;
    padding: 8px 15px;
    border: solid 1px #BCBCBC;
    cursor: pointer;
}

#close {
    margin: 25px 0px;
    padding: 8px 15px;
    background-color: #F5F5F5;
}

.calendar-head {
    width: min(540px, 90vw);
    justify-content: space-between;
    margin: 10px 0;
}

h4 {
    margin: 25px 0px;
    padding: 8px 5px;
    color: #494949;
    background: transparent;
}