/* 営業カレンダー フロント表示 */

.ccal-wrap {
	margin: 1.5em auto; /* 中央寄せ（右側だけ余白が空くのを防ぐ） */
	font-size: 14px;
	color: #333;
	line-height: 1.5;
}

/* タイトル
   ※テーマ側の見出し装飾に負けないよう .ccal-wrap を前置して詳細度を上げる。
     （例: 賢威8系の「.contentsInner h2」は詳細度11で .ccal-title の10に勝つため、
      padding や letter-spacing が上書きされてしまう） */
.ccal-wrap .ccal-title {
	text-align: center;
	font-weight: 400;
	letter-spacing: 0.15em;
	margin: 0 0 1em;
	padding: 0;
	background: none;
	border: 0;
	color: inherit;
	line-height: 1.5;
}

/* 横スクロール領域（スマホで横スライド） */
.ccal-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 6px;
	text-align: center; /* 収まる時は月を中央寄せ、あふれる時は左寄せでスクロール */
}

.ccal-months {
	display: inline-flex;
	gap: 24px;
	align-items: flex-start;
	vertical-align: top;
	text-align: left;
}

/* カレンダー本体
   ※テーマ側の「table { margin: 1em 0; }」等が効くと、
     margin:0 の凡例テーブルと上端がズレるため margin を明示的に打ち消す */
.ccal-wrap .ccal-cal {
	border-collapse: collapse;
	table-layout: fixed;
	width: 322px;
	min-width: 322px;
	margin: 0;
	background: #fff;
	border: 1px solid #d9d9d9;
}

.ccal-cal caption {
	font-weight: 700;
	padding: 8px 4px;
	background: #666;
	color: #fff;
	letter-spacing: 0.05em;
}

.ccal-cal th,
.ccal-cal td {
	border: 1px solid #e2e2e2;
	text-align: center;
	width: 14.28%;
}

.ccal-cal thead th {
	padding: 4px 0;
	font-weight: 700;
	background: #666;
	color: #fff;
}

.ccal-day {
	height: 38px;
	vertical-align: top;
	padding: 3px 2px;
	position: relative;
}

.ccal-num {
	display: block;
	font-size: 13px;
	line-height: 1.2;
}

.ccal-event {
	display: block;
	font-size: 10px;
	line-height: 1.15;
	margin-top: 2px;
	word-break: break-all;
	color: inherit; /* その日の状態の文字色に合わせる */
}

.ccal-badge {
	display: inline-block;
	font-size: 9px;
	line-height: 1.2;
	margin-top: 2px;
	padding: 1px 4px;
	border-radius: 3px;
	background: #2e7d32;
	color: #fff;
	white-space: nowrap;
}

.ccal-empty {
	background: #fafafa;
}

/* 凡例（PCでは月と横並びの3カラム目） */
.ccal-legend {
	border-collapse: collapse;
	margin: 0;
	width: 320px;
	border: 1px solid #d9d9d9;
	background: #fff;
	align-self: flex-start;
	flex: 0 0 auto;
}

.ccal-legend caption {
	font-weight: 700;
	padding: 8px 4px;
	background: #666;
	color: #fff;
}

.ccal-legend td {
	border: 1px solid #e2e2e2;
	padding: 6px 8px;
}

.ccal-legend-mark {
	width: 48px;
	text-align: center;
	font-weight: 700;
}

.ccal-legend-desc {
	text-align: left;
}

/* 曜日色（既定。インラインCSSで上書き） */
.ccal-sun { color: #c0392b; }
.ccal-sat { color: #2c6fbb; }

/* スマホ */
@media screen and (max-width: 600px) {
	.ccal-months {
		gap: 16px;
	}
	.ccal-scroll::after {
		content: "›";
		position: sticky;
		right: 4px;
	}
}

/* 凡例内の見学可バッジ */
.ccal-legend-mark .ccal-badge {
	font-size: 12px;
	padding: 2px 8px;
}