/* タイムテーブル全体のコンテナ設定 */
.expo-tt-container {
width: 100%;
}
.expo-tt-day-section {
margin-bottom: 60px;
}
/* DAYヘッダー固定 */
.expo-tt-day-title {
position: sticky;
top: 0;
z-index: 200;
background: #000;
padding: 16px 0;
margin: 0;
text-align: center;
font-size: 2rem;
font-weight: 500;
border-bottom: 1px solid rgba(255,255,255,0.5);
}
.expo-tt-day-title span:nth-child(1) {
border: 1px solid #fff;
border-radius: 100px;
padding: 0.2em 1em;
font-size: 0.6em;
margin-right: 1em;
position: absolute;
left: 16px;
top: 18px;
}
.expo-tt-day-title:after{
content: 'TIME TABLE';
position: absolute;
right: 16px;
font-size: .5em;
top: 26px;
}
.expo-tt-day-title span:nth-child(1) b {
font-size: 0.8em;
margin-right: 0.4em;
}
.expo-tt-day-title span:nth-child(2) {
font-size: 0.6em;
}
.expo-tt-day-title span:nth-child(2) b {
font-size: 1.7em;
}


/* グリッド本体：10:30から19:00までの全34行分を定義 */
.expo-tt-grid {
display: grid;
/* 時刻列(70px) | ALPHA(1fr) | OMEGA(1fr) */
grid-template-columns: 70px 1fr 1fr;
/* 1行目(ステージヘッダー) + 34行分(10:30-19:00) */
grid-template-rows: 50px repeat(34, minmax(40px, auto));
width: 100%;
}
/* ステージ名ヘッダー固定 */
.expo-tt-sticky-header {
position: sticky;
top: 65px; /* .expo-tt-day-titleの高さに合わせる */
background: #fff;
color: #000;
font-size: 1.6em;
font-weight: 500;
z-index: 150;
display: flex;
align-items: center;
justify-content: center;
border-bottom: 1px solid rgba(255,255,255,0.5);
border-left: 1px solid rgba(0,0,0,0.5);
}
.expo-tt-header-empty {
position: sticky;
z-index: 150;
border-bottom: 1px solid rgba(255,255,255,0.5);
}
/* 時刻ラベル：境界線上に配置 */
.expo-tt-time-label {
grid-column: 1;
display: flex;
justify-content: center;
align-items: center;
height: 0;
transform: translateY(-1px);
z-index: 20;
}
/* 最上部(10:30)のラベルを非表示 */
.expo-tt-time-label.hidden-first {
visibility: hidden;
}
/* 背景セル（グリッド線を構成） */
.expo-tt-bg-cell {
border-bottom: 1px dashed rgba(255,255,255,0.5);
border-left: 1px solid rgba(255,255,255,0.5);
}
/* 出演コマ（スロット） */
.expo-tt-slot {
z-index: 10;
padding: 1px;
}
.expo-tt-slot-inner {
background-color: rgba(0, 0, 0, 1);
height: 100%;
font-size: 0.85rem;
box-sizing: border-box;
display: flex;
flex-direction: column;
line-height: 1.4;
padding: 0; /* 修正：画像が枠に密着するように全体のパディングを削除 */
text-decoration: none;
overflow: hidden;
}
.expo-tt-slot-inner:hover {
background-color: rgba(0, 0, 0, 0.6);
}
/* セッション内部テンプレートのスタイル */
.tt-session-thumbnail {
width: 100%;
aspect-ratio: 16 / 9;
margin-bottom: 0; /* 修正：画像の下側の余白も削除 */
overflow: hidden;
display: block;
}
.tt-session-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover; /* 枠に合わせて綺麗に埋める */
display: block;
}
/* テキスト要素には個別に左右パディングを持たせて読みやすくする */
.tt-session-time,
.tt-session-title,
.tt-session-creator {
padding-left: 12px;
padding-right: 12px;
}
.tt-session-time {
padding-top: 10px; /* 画像のすぐ下の余白 */
font-size: 0.75rem;
font-weight: 500;
margin-bottom: 4px;
}
.tt-session-title {
font-size: 1rem;
font-weight: 500;
line-height: 1.3;
margin-bottom: 4px;
}
.tt-session-creator {
font-size: 0.8rem;
padding-bottom: 12px; /* 最下部の余白 */
margin-top: auto;    /* 情報を下に寄せる */
}
/* カラム位置定義 */
.col-alpha { grid-column: 2; }
.col-omega { grid-column: 3; }






@media(max-width:736px){
.expo-tt-day-title{
  font-size: 1.3em;
}
.expo-tt-grid {
grid-template-columns: 36px 1fr 1fr;
grid-template-rows: 22px repeat(34, minmax(50px, auto));
}
.expo-tt-time-label {
font-size: 11px;
}
.expo-tt-sticky-header {
font-size: 0.8em;
height: 22px;
}
.expo-tt-day-title {
padding: 28px 0 8px;
}
.expo-tt-day-title:after {
top: 37px;
}
.expo-tt-day-title span:nth-child(1) {
top: 29px;
}
.expo-tt-sticky-header{
top: 58px;
}
.tt-session-title {
font-size: 0.8rem;
}
.tt-session-time, .tt-session-title, .tt-session-creator {
padding-left: 6px;
padding-right: 6px;
}
.tt-session-creator {
font-size: 0.6rem;
padding-bottom: 6px;
}

}/* @media */

