/* --- 1. メインヘッダー --- */
.ps-main-header {
    display: flex; align-items: center; justify-content: center;
    gap: 12px; margin: 20px auto; padding: 0 15px;
}
.ps-header-icon { width: 45px; flex-shrink: 0; }
.ps-header-icon img { width: 100%; display: block; }
.ps-title-top { margin: 0; font-size: 1.4rem; font-weight: 900; line-height: 1.2; }
.ps-title-bottom { margin: 0; font-size: 1.1rem; font-weight: 800; line-height: 1.2; }

/* --- 2. スライダーベース --- */
.ps-schedule-wrapper {
    width: 100%; position: relative; padding: 20px 0 140px; overflow: hidden;
    transform-style: preserve-3d; perspective: 1000px;
}
.ps-main-slider { overflow: visible !important; }
.swiper-slide {
    width: 100% !important; min-height: 320px; padding: 25px 15px; box-sizing: border-box;
    position: relative; opacity: 0; transition: 0.3s; transform-style: preserve-3d;
    border-radius: 12px;
}
.swiper-slide::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
      bottom: 50%;
    height: 2px;           /* 線の太さ */
    background-color: #1c56d3 ; /* 線の色 */
    z-index: -1;
    top: 45px;
}
.swiper-slide-active { opacity: 1; }
.ps-bg-blue { background-color: #eaf2ff !important; }
.ps-bg-red { background-color: #fdf2f0 !important; }
.ps-bg-red.swiper-slide::after{    background-color: #d3381c ;
}
/* --- 3. タイムライン（ズレを物理的にゼロにする設定） --- */
/* 全てのカプセルの「真ん中」から線を左右に伸ばす */
.ps-side-label-box::before, .ps-side-label-box::after,
.ps-small-capsule::before, .ps-small-capsule::after,
.ps-full-capsule::before, .ps-full-capsule::after {
    content: ""; position: absolute; top: 50%; 
	/*width: 100vw;*/ height: 1.5px;
    transform: translateY(-50%) translateZ(-1px); z-index: -1;
}
/* 左側だけに線を伸ばす（時間ボックス用） */
/* 右側だけに線を伸ばす（カプセル用） */
.ps-small-capsule::after, .ps-full-capsule::after { left: 100%; }

/* 青・赤の線の色を強制適用 */
.ps-bg-blue .ps-side-label-box::before, .ps-bg-blue .ps-small-capsule::after, .ps-bg-blue .ps-full-capsule::after { background-color: #1c56d3 !important; }
.ps-bg-red .ps-side-label-box::before, .ps-bg-red .ps-small-capsule::after, .ps-bg-red .ps-full-capsule::after { background-color: #d3381c !important; }

/* --- 4. タイトルエリア（高さを固定して一直線にする） --- */
.ps-flex-container, .ps-top-title-area {
    display: flex !important; align-items: center !important; position: relative !important;
    height: 40px !important; /* 全スライド共通の高さ */
    margin-bottom: 20px !important; transform: translateZ(10px); z-index: 100;
}

/* 時間ボックスとカプセルの共通スタイル（高さを32pxに固定） */
.ps-side-label-box, .ps-small-capsule, .ps-full-capsule {
    background-color: #fff !important; border: 2px solid currentColor !important;
    font-weight: bold; display: inline-flex !important; align-items: center; justify-content: center;
    height: 32px !important; box-sizing: border-box !important; position: relative;
    line-height: 1 !important;
}

.ps-side-label-box {
    min-width: 65px; padding: 0 8px; border-radius: 4px; font-size: 0.9rem; margin-right: 10px; flex-shrink: 0;
}
.ps-bg-blue .ps-side-label-box { background-color: #bcd4f9 !important; color: #1c56d3 !important; }
.ps-bg-red .ps-side-label-box { background-color: #f9bdb3 !important; color: #d3381c !important; }

.ps-small-capsule, .ps-full-capsule {
    padding: 0 15px; border-radius: 50px; font-size: 0.85rem; white-space: nowrap;    margin-bottom: 30px;
    margin-top: 30px;width:100%;
}
.ps-bg-blue .ps-small-capsule, .ps-bg-blue .ps-full-capsule { color: #1c56d3 !important; }
.ps-bg-red .ps-small-capsule, .ps-bg-red .ps-full-capsule { color: #d3381c !important; }

/* --- 5. コンテンツエリア --- */
.ps-main-body { transform: translateZ(5px);}
.ps-content-body { transform: translateZ(5px);margin-top: -54px; height:100%;width:100%;}
.ps-description-list { list-style: none; padding: 0; margin: 0; font-weight: bold; line-height: 1.5; font-size: 0.95rem; text-align: left; }
.ps-description-list li { margin-bottom: 4px; text-indent: -1em; padding-left: 1em; }
.ps-description-list li::before { content: "・"; }

/* --- 6. 矢印ボタン --- */
.ps-nav-btn {
    position: absolute !important; bottom: 30px !important;
    width: 60px !important; height: 60px !important;
    background-color: #fff !important; border-radius: 50% !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important; z-index: 1000 !important;
    transform: translateZ(50px);
}
.ps-nav-btn::after { font-size: 20px !important; font-weight: 900 !important; color: #333 !important; }
.swiper-button-prev.ps-nav-btn { left: calc(10%) !important; }
.swiper-button-next.ps-nav-btn { right: calc(10%) !important; left: auto !important; }

.ps-bottom-icon { position: absolute; bottom: 70px; right: 15px; width: 80px; z-index: 50; }
