#container {
    width: 1300px;
    padding: 5px;
}

.navigation {
    padding-left: 20px;

    & > li {
        font-weight: bold;
        background-color: lightgreen;
        margin: 0 5px;

        &:has(a) {
            background-color: white;
        }
    }
}

.day {
    width: 30px;
    background-color: white;
    vertical-align: top;

    & > div {
        position: sticky;
        top: 0;
        cursor: pointer;
    }
}

.week-day-0 {
    background-color: orangered;
}
.week-day-6 {
    background-color: powderblue;
}

.day-list {
    width: 100%;
    background-color: white;
}

.book-cell {
    width: calc(25% - 17px);
    height: 100%;
    min-height: 130px;
    vertical-align: top;
    border: 1px solid black;
    margin: 5px;
    display: inline-block;
    text-decoration: none;
}

.book-cover {
    min-width: 90px;
    vertical-align: top;

    & > img {
        max-width: 100px;
        max-height: 130px;
    }
}

.book-detail {
    font-size: small;
    word-break: break-all;
}
.book-title {
    vertical-align: top;
}
.book-author {
    height: 22px;
}
.book-publisher {
    height: 22px;
}

/* タブレット */
@media screen and (max-width: 1400px) {
    #container {
        width: 100%;
    }

    #main {
        padding-top: 50px;
    }

    .book-cell {
        width: calc(33% - 14px);
        height: 100%;
        vertical-align: top;
        border: 1px solid black;
        margin: 5px;
        display: inline-block;
        text-decoration: none;
    }
}
/* スマホ */
@media screen and (max-width: 480px) {
    .book-cell {
        width: calc(50% - 15px);
    }
}
