/**
 * スケジュール表 縦タイムライン
 *
 * 子育て支援ページ (/supports/) の
 *   - 親子あかちゃん広場 2026 年度スケジュール
 *   - 親子クラス もこもこ広場 2026 年度スケジュール
 * の 2 表を縦タイムライン形式で表示。
 *
 * カラー: コーラル (#ff8a65 / #ff7043) + ミント (#26c6da / #b2ebf2)
 *         共通パレット (design-refactor.css と揃える)
 *
 * 更新日: 2026-04-24
 * バージョン: 1.0.0
 */

.schedule-timeline {
    list-style: none;
    padding: 0;
    margin: 1.5em 0;
    position: relative;
}

/* 左縦ライン（グラデ） */
.schedule-timeline::before {
    content: '';
    position: absolute;
    left: 80px;
    top: 8px;
    bottom: 8px;
    width: 3px;
    background: linear-gradient(to bottom, #26c6da, #b2ebf2);
    border-radius: 3px;
}

.schedule-timeline__item {
    position: relative;
    padding: 10px 0 10px 110px;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
}

/* 月の節目ドット（コーラル） */
.schedule-timeline__item::before {
    content: '';
    position: absolute;
    left: 74px;
    top: 50%;
    transform: translateY(-50%);
    width: 15px;
    height: 15px;
    background: #ff8a65;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #ff8a65;
}

.schedule-timeline__month {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 64px;
    text-align: right;
    font-weight: 700;
    font-size: 18px;
    color: #ff7043;
}

.schedule-timeline__dates {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.schedule-timeline__date {
    display: inline-block;
    background: #e0f7fa;
    color: #00695c;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 500;
}

.schedule-timeline__empty {
    color: #b0b0b0;
    font-style: italic;
    font-size: 14px;
}

/* スマホ */
@media (max-width: 640px) {
    .schedule-timeline::before { left: 60px; }
    .schedule-timeline__item { padding-left: 84px; }
    .schedule-timeline__item::before { left: 54px; }
    .schedule-timeline__month { width: 48px; font-size: 15px; }
    .schedule-timeline__date { font-size: 13px; padding: 3px 9px; }
}