/* 基本設定 */
body, html {
    margin: 0;
    padding: 0;
    min-height: 100%;
    background-color: #000; 
    color: #fff;
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
}

.header-image-container {
    width: 100%;
    line-height: 0;
}

.main-image {
    width: 100%;
    height: auto;
    display: block;
}

/* メインコンテナ：横並びを維持 */
.container {
    max-width: 900px; /* 少し広げて余裕を持たせます */
    margin: 0 auto;
    padding: 30px 15px 100px 15px; /* 上下の余白を微調整 */
}

/* 横並びの固定設定 */
.flex-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px; /* 隙間を少し詰めてスマホでの幅を確保 */
}

/* 左側メニュー：残りの幅をすべて使う */
.menu-list {
    flex: 1;
}

.menu-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu-list li {
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(255,255,255,0.15);
    padding-bottom: 10px;
}

.menu-list a {
    color: #fff;
    text-decoration: none;
    font-size: clamp(0.85rem, 3vw, 1.3rem); /* スマホで文字が溢れないよう最小サイズを調整 */
    transition: 0.3s ease;
    display: block;
    cursor: pointer;
}

.menu-list a span {
    font-size: 0.75em;
    opacity: 0.7;
    margin-left: 5px;
    display: inline-block; /* 改行しにくくする */
}

.menu-list li:not(.is-pending) a:hover {
    color: #b39ddb;
    padding-left: 10px;
}

.menu-list li.is-pending a {
    color: rgba(255, 255, 255, 0.4);
    cursor: default;
}

/* 右側書籍情報：幅を固定せず比率で維持 */
.book-info {
    width: 30%; /* 画面の3割を書籍エリアにする */
    max-width: 180px;
    min-width: 110px; /* スマホで小さくなりすぎない限界 */
    text-align: left;
}

.book-info a {
    text-decoration: none;
    color: #fff;
}

.book-image {
    width: 100%;
    height: auto;
    box-shadow: 0 5px 15px rgba(255,255,255,0.1);
    margin-bottom: 10px;
}

.book-text {
    font-size: clamp(0.65rem, 2vw, 0.85rem); /* テキストも画面幅に合わせて縮小 */
    line-height: 1.4;
    letter-spacing: 0.02em;
}

/* スマホ用の微調整：縦並びへの切り替えを廃止 */
@media (max-width: 480px) {
    .container {
        padding-top: 20px;
    }
    .flex-container {
        gap: 15px; /* さらに隙間を詰める */
    }
}