/* =========================================
	 GRM Holiday Calendar / フロント表示
========================================= */

/* ---- 凡例 ---- */
.grm-holiday-legend{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:8px;
	max-width:1000px;
	margin:16px auto 0;
}

.grm-holiday-legend-swatch{
	display:inline-block;
	width:16px;
	height:16px;
	border-radius:4px;
	background:#f6ddd0;
}

.grm-holiday-legend-label{
	font-size:14px;
	color:#4a4a4a;
}

.grm-holiday-calendar-wrap{
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	gap:60px;
	max-width:1000px;
	margin:0 auto;
}

@media(max-width:767px){
	.grm-holiday-calendar-wrap{
		grid-template-columns:1fr;
		gap:40px;
	}
}

.grm-holiday-month-title{
	text-align:center;
	font-size:20px;
	font-weight:700;
	margin:0 0 20px;
	letter-spacing:.05em;
}

.grm-holiday-week-row{
	display:grid;
	grid-template-columns:repeat(7, 1fr);
	gap:6px;
	margin-bottom:8px;
}

.grm-holiday-week-cell{
	text-align:center;
	font-weight:700;
	font-size:15px;
	color:#333;
	padding:6px 0;
}

.grm-holiday-week-cell.is-sun{
	color:#e2493c;
}

.grm-holiday-week-cell.is-sat{
	color:#3f7fd1;
}

.grm-holiday-grid{
	display:grid;
	grid-template-columns:repeat(7, 1fr);
	gap:6px;
}

.grm-holiday-cell{
	aspect-ratio:1;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	border-radius:8px;
	background:#f4f4f4;
	color:#4a4a4a;
	font-size:18px;
	overflow:hidden;
	padding:2px;
	box-sizing:border-box;
}

.grm-holiday-cell.is-blank{
	background:transparent;
}

.grm-holiday-cell.is-closed{
	background:#f6ddd0;
	font-weight:700;
}

/* ---- 定休日ルールに当てはまるが、臨時営業として休業日を解除した日 ---- */
.grm-holiday-cell.is-open-override{
	background:#e1f3e6;
	font-weight:700;
}

.grm-holiday-open-note{
	font-size:9px;
	line-height:1.2;
	font-weight:400;
	color:#2f7a44;
	text-align:center;
	max-width:100%;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

@media(max-width:480px){
	.grm-holiday-open-note{
		display:none;
	}
}

/* ---- 日本の祝日ラベル ---- */
.grm-holiday-cell.is-jp-holiday .grm-holiday-num{
	color:#c0392b;
}

.grm-holiday-jp-name{
	font-size:9px;
	line-height:1.2;
	font-weight:400;
	color:#c0392b;
	text-align:center;
	max-width:100%;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

@media(max-width:480px){
	.grm-holiday-jp-name{
		display:none;
	}
}
