/* FullCalendar カスタムスタイル */

/* カレンダーヘッダー（タイトル＋凡例） */
.cal-header-wrap {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.cal-legend {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.2rem;
	align-items: center;
}

.cal-legend li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 1.2rem;
	color: #333;
}

.cal-legend li span {
	display: inline-block;
	width: 1.4rem;
	height: 1.4rem;
	border-radius: 2px;
	flex-shrink: 0;
}

/* row_secTitBox内の凡例（page-kouen-low用） */
.row_secTitBox .cal-legend {
	align-self: flex-end;
	margin-bottom: 0.5rem;
}

@media screen and (max-width: 768px) {
	.cal-header-wrap {
		flex-direction: column;
		align-items: flex-start;
	}
	.cal-legend {
		gap: 0.5rem 1rem;
	}
	.cal-legend li {
		font-size: 1.1rem;
	}
}

#event-calendar {
	max-width: 100%;
	margin: 0 auto 2rem;
}

/* ヘッダーツールバー */
.fc .fc-toolbar-title {
	font-size: 1.8rem;
	font-weight: bold;
}

.fc .fc-button-primary {
	background-color: #004B9E;
	border-color: #004B9E;
}

.fc .fc-button-primary:hover {
	background-color: #006fa3;
	border-color: #006fa3;
}

.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
	background-color: #005580;
	border-color: #005580;
}

/* 今日のセル */
.fc .fc-daygrid-day.fc-day-today {
	background-color: #FFF8E1;
}

/* イベントブロック */
.fc .fc-daygrid-event-harness {
	margin-bottom: 3px !important;
}

.fc .fc-event {
	background-color: #004B9E;
	border-color: #004B9E;
	border-radius: 3px;
	padding: 3px 4px;
	font-size: 1.2rem;
	line-height: 1.5;
	cursor: pointer;
}

.fc .fc-event:hover {
	background-color: #E72E78;
	border-color: #E72E78;
}

.fc .fc-event .fc-event-title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* 日付セル */
.fc .fc-daygrid-day-number {
	font-size: 1.4rem;
	color: #333;
}

/* 日曜 */
.fc .fc-day-sun .fc-daygrid-day-number {
	color: #E72E78;
}

/* 土曜 */
.fc .fc-day-sat .fc-daygrid-day-number {
	color: #004B9E;
}

/* もっと見るリンク */
.fc .fc-daygrid-more-link {
	color: #004B9E;
	font-size: 0.75rem;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
	.fc .fc-toolbar {
		flex-direction: column;
		gap: 0.5rem;
	}

	.fc .fc-toolbar-title {
		font-size: 1.8rem;
	}

	.fc .fc-daygrid-event-harness {
		margin-bottom: 3px !important;
	}

	.fc .fc-event {
		font-size: 1.2rem;
		padding: 3px 4px;
		line-height: 1.5;
	}

	.fc .fc-event .fc-event-title {
		white-space: normal;
		overflow: visible;
		text-overflow: unset;
	}

	.fc .fc-daygrid-day-number {
		font-size: 1.2rem;
	}
}

/* SP 週ごとの縦スクロールカレンダー */
#event-calendar-sp {
	display: none;
}

@media screen and (max-width: 768px) {
	#event-calendar {
		display: none;
	}
	#event-calendar-sp {
		display: block;
		margin: 0 auto 2rem;
		border: 1px solid #ddd;
		border-radius: 4px;
		height: 42rem;
		overflow-y: scroll;
	}
	.sp-week-group {
		border-bottom: 6px solid #f2f2f2;
	}
	.sp-week-group:last-child {
		border-bottom: none;
	}
	.sp-week-label {
		position: sticky;
		top: 0;
		z-index: 1;
		background-color: #004B9E;
		color: #fff;
		font-size: 1.2rem;
		font-weight: bold;
		padding: 0.6rem 1rem;
	}
	.sp-cal-row {
		display: flex;
		align-items: flex-start;
		border-bottom: 1px solid #ddd;
		padding: 1rem;
		min-height: 4rem;
	}
	.sp-week-group .sp-cal-row:last-child {
		border-bottom: none;
	}
	.sp-cal-date {
		width: 7rem;
		min-width: 7rem;
		color: #333;
		padding-right: 1rem;
	}
	.sp-cal-md {
		display: block;
		font-size: 1.5rem;
		font-weight: bold;
		line-height: 1.4;
	}
	.sp-cal-week {
		display: block;
		font-size: 1.2rem;
	}
	.sp-cal-date.is-sun .sp-cal-md,
	.sp-cal-date.is-sun .sp-cal-week {
		color: #E72E78;
	}
	.sp-cal-date.is-sat .sp-cal-md,
	.sp-cal-date.is-sat .sp-cal-week {
		color: #004B9E;
	}
	.sp-cal-date.is-today .sp-cal-md {
		background-color: #FFF8E1;
		border-radius: 3px;
		padding: 0 4px;
	}
	.sp-cal-events {
		flex: 1;
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
	}
	.sp-cal-event {
		display: block;
		color: #fff;
		border-radius: 3px;
		padding: 5px 8px;
		font-size: 1.2rem;
		line-height: 1.5;
		text-decoration: none;
	}
}