/* 타임테이블 (Figma sub_타임테이블 8033:9588) */
#sub_content:has(.tt){padding: 6.25rem 0 10rem; background: #fff;}

.tt{width: 100%; color: #171719;}
.tt *{box-sizing: border-box; word-break: keep-all;}

/* 탭 (Figma sec01_tab 8033:8639) */
.tt_tab{display: flex; align-items: center; justify-content: center; gap: 0.625rem;}
.tt_tab_btn{padding: 0.8125rem 1.75rem; border: 1px solid #E1E2E4; border-radius: 999px; background: #fff; font-family: inherit; font-size: 1.125rem; font-weight: 700; line-height: 1.5; color: #5A5C63; cursor: pointer; transition: color 0.3s, border-color 0.3s;}
.tt_tab_btn.on{border-color: transparent; background: linear-gradient(93.34deg, #89C56D 10.77%, #00B7EE 90.04%); color: #fff;}

/* 날짜별 표 */
.tt_day{display: none;}
.tt_day.on{display: block;}
.tt_date{margin: 2.5rem 0 1.5rem; font-size: 1.75rem; font-weight: 700; line-height: 1.29; letter-spacing: -0.0175rem; color: #171719;}

/* 표 (Figma timetable 8033:8643) : 1px 간격 격자. PC 는 컨테이너 폭에 맞춤, 1024 이하에서만 가로 스크롤 */
.tt_wrap{position: relative; width: 100%;}
.tt_scroll{width: 100%;}
.tt_table{display: flex; flex-direction: column; gap: 1px; width: 100%; border: 1px solid #E1E2E4; border-radius: 1rem; background: #E1E2E4; overflow: hidden;}
/* 스와이프 아이콘 (Figma swipe1 2757:555) : 140px 원형, 넘침 + 스크롤 0 일 때만 노출. 표 세로 범위 안에서 화면 중앙에 고정(sticky) */
.tt_swipe_box{display: none; position: absolute; inset: 0; z-index: 2; align-items: center; pointer-events: none;}
.tt_wrap.is-swipe .tt_swipe_box{display: flex;}
/* 기본은 표 세로 중앙, 표가 화면보다 길면 top/bottom sticky 로 화면 세로 중앙 유지 */
.tt_swipe{position: sticky; top: calc(50vh - 4.375rem); bottom: calc(50vh - 4.375rem); display: flex; flex-direction: column; align-items: center; justify-content: center; width: 8.75rem; height: 8.75rem; margin: 0 auto; border-radius: 50%; background: linear-gradient(91.08deg, rgba(137,197,109,0.9) 10.77%, rgba(0,183,238,0.9) 90.04%); color: #fff;}
.tt_swipe img{width: 3.125rem; height: 2.375rem;}
.tt_swipe span{font-size: 1.361875rem; font-weight: 700; line-height: normal;}
.tt_thead,
.tt_row{display: grid; gap: 1px; width: 100%;}
/* 열 비율은 Figma 1396px 기준 fr 로 고정 → 폭이 줄어도 모든 열이 같은 비율로 축소 */
.tt_thead{grid-template-columns: 200fr 598fr 598fr; min-height: 6rem;}
.tt_row.info,
.tt_row.full{grid-template-columns: 200fr 1196fr;}
.tt_row.pair{grid-template-columns: 200fr 598fr 598fr;}
/* 1일차 (Figma 8033:8643) : 구분 200 / Track 1 498 / Track 2 698 (시간칸 200 + 498) */
.tt_table.day1 .tt_thead{grid-template-columns: 200fr 498fr 698fr;}
.tt_table.day1 .tt_row.split{grid-template-columns: 200fr 498fr 200fr 498fr;}
.tt_row > *{min-width: 0;}

.tt_th{display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1rem 0.5rem; background: #fff; text-align: center; font-size: 1.25rem; font-weight: 700; line-height: 1.45; letter-spacing: -0.00625rem; color: #171719;}
.tt_th.track{background: linear-gradient(96deg, #89C56D 10.77%, #00B7EE 90.04%); color: #fff;}
.tt_th.track span{font-weight: 500;}

.tt_time{display: flex; flex-direction: column; align-items: flex-start; gap: 0.25rem; padding: 1.25rem; background: #F7F7F8;}
.tt_time strong{font-size: 1.375rem; font-weight: 700; line-height: 1.45; letter-spacing: -0.006875rem; color: #171719; white-space: nowrap;}
.tt_time span{font-size: 1rem; font-weight: 500; line-height: 1.5; color: #878A93;}

.tt_info{display: flex; align-items: center; justify-content: center; gap: 0.75rem; padding: 1.5rem 1.25rem; background: #fff; text-align: center; color: #5A5C63;}
.tt_info strong{font-size: 1.25rem; font-weight: 700; line-height: 1.45; letter-spacing: -0.00625rem;}
.tt_info span{font-size: 1rem; font-weight: 400; line-height: 1.5;}
.tt_row.gray .tt_time,
.tt_row.gray .tt_info{background: #F4F4F5;}

.tt_item{display: flex; flex-direction: column; align-items: flex-start; gap: 0.75rem; min-width: 0; padding: 1.25rem; background: #fff;}
.tt_tags{display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem;}
.tt_tag{display: inline-flex; align-items: center; padding: 0.25rem 0.75rem; border-radius: 999px; background: #EAEBEC; font-size: 0.875rem; font-weight: 700; line-height: 1.43; color: #2E2F33; white-space: nowrap;}
.tt_tag.gra{padding: 0.3125rem 0.75rem; background: linear-gradient(95deg, #89C56D 10.77%, #00B7EE 90.04%); color: #fff;}
.tt_tag.ai{background: #DCE8FD; color: #1F5FD6;}
.tt_tag.global{background: #FDF1C8; color: #8A6400;}
.tt_tag.indie{background: #FFE4D6; color: #D9541A;}
.tt_txt{display: flex; flex-direction: column; gap: 0.25rem; width: 100%;}
.tt_title{font-size: 1.125rem; font-weight: 700; line-height: 1.5; color: #171719;}
.tt_speaker{font-size: 1rem; font-weight: 500; line-height: 1.5; color: #5A5C63;}
.tt_meta{display: flex; flex-direction: column; gap: 0.5rem; width: 100%; margin: 0;}
.tt_meta > div{display: flex; align-items: flex-start; gap: 0.75rem; font-size: 1rem; line-height: 1.5;}
.tt_meta dt{flex-shrink: 0; width: 1.875rem; margin: 0; font-weight: 700; color: #171719;}
.tt_meta dd{margin: 0; font-weight: 400; color: #2E2F33;}


@media screen and (max-width: 1024px){
	#sub_content:has(.tt){padding: 2.5rem 0 4rem;}

	.tt_tab{gap: 0.5rem;}
	.tt_tab_btn{padding: 0.625rem 1.25rem; font-size: 0.9375rem;}
	.tt_date{margin: 1.5rem 0 1rem; font-size: 1.375rem; letter-spacing: -0.01375rem;}

	/* 표 : PC 레이아웃 유지 + 가로 스크롤, 폰트·여백 축소 (구분 140 / 1일차 Track1 350 / 최소 폭 980) */
	.tt_wrap{margin: 0 -1.25rem; width: auto;}
	.tt_scroll{padding: 0 1.25rem; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; cursor: grab;}
	.tt_scroll::-webkit-scrollbar{display: none;}
	.tt_scroll.dragging{cursor: grabbing; user-select: none;}
	.tt_scroll.dragging *{pointer-events: none;}
	.tt_table{min-width: 61.25rem; border-radius: 0.75rem;}   /* 980px : 열 비율은 fr 그대로 (구분 140) */
	.tt_thead{min-height: 4.25rem;}
	.tt_th{padding: 0.75rem 0.5rem; font-size: 1rem;}
	.tt_time{gap: 0.125rem; padding: 0.875rem;}
	.tt_time strong{font-size: 1rem; letter-spacing: 0;}
	.tt_time span{font-size: 0.8125rem;}
	.tt_info{gap: 0.5rem; padding: 1rem 0.875rem;}
	.tt_info strong{font-size: 1rem;}
	.tt_info span{font-size: 0.8125rem;}
	.tt_item{gap: 0.5rem; padding: 0.875rem;}
	.tt_tags{gap: 0.25rem;}
	.tt_tag{padding: 0.1875rem 0.625rem; font-size: 0.75rem;}
	.tt_tag.gra{padding: 0.25rem 0.625rem;}
	.tt_title{font-size: 0.9375rem;}
	.tt_speaker{font-size: 0.8125rem;}
	.tt_meta{gap: 0.375rem;}
	.tt_meta > div{gap: 0.5rem; font-size: 0.8125rem;}
	.tt_meta dt{width: 1.625rem;}
	.tt_swipe{width: 7rem; height: 7rem; top: calc(50vh - 3.5rem); bottom: calc(50vh - 3.5rem);}
	.tt_swipe img{width: 2.5rem; height: 1.9rem;}
	.tt_swipe span{font-size: 1.09rem;}
}
