@charset "utf-8";

/* CSS Document */
/***** 全体設定 *****/
html .category_calendar,
html .calendar_switcher a {
	color: var(--MAIN_BLACK, #222);
}

main #com_content_wrapper .calendar_note {
	display: flex;
	padding-bottom: 1.6rem;
	align-items: flex-start;
	gap: 1rem;
}

main #com_content_wrapper .calendar_switcher {
	position: relative;
	left: -2.5rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

main #com_content_wrapper .kbn_area {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.8rem;
	flex: 1 0 0;
}

main #com_content_wrapper .calendar_icon {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.8rem;
}

main #com_content_wrapper .category_calendar .com_content {
	padding: 4rem 2.5rem 6.4rem 2.5rem;
	border-radius: 1.6rem;
}

.category_calendar .calendar {
	padding-bottom: 1.6rem;
}

.category_calendar .calendar .cal_html[data-display="false"] {
	display: none;
}

/* 月選択メニュー */
.calendar_switcher .banner {
	width: 21.7rem;
	height: 5.6rem;
}

.calendar_switcher .month_box {
	position: absolute;
}

.calendar_switcher .month_box_year {
	position: absolute;
	color: var(--MAIN_WHITE, #FFF);
	font-size: 1.6rem;
	font-weight: 700;
	padding: 3.1rem 13.3rem 1.3rem 2.5rem;
}

.calendar_switcher .month_box_month {
	position: absolute;
	color: var(--MAIN_WHITE, #FFF);
	text-align: right;
	font-size: 4rem;
	font-weight: 700;
	padding: 1.4rem 4rem 1.3rem 10.5rem;
}

.calendar_switcher .month_box_month .month_txt {
	font-size: 3.2rem;
	letter-spacing: 0.0192rem;
}

.calendar_switcher .par-tab {
	display: flex;
	height: 1.8rem;
}

.calendar_switcher .par-tab_li {
	padding: 0 1.6rem;
	border-left: 0.1rem solid var(--BASE_LINE, #D9D9D9);
	color: var(--MAIN_BLACK, #222);
	font-size: 1.2rem;
	font-weight: 700;
	letter-spacing: 0.0072rem;
}

.calendar_switcher .par-tab_li.not-yet {
	color: #D9D9D9;
}

.calendar_switcher .par-tab_li:last-child {
	border-right: 0.1rem solid var(--BASE_LINE, #D9D9D9);
}

.calendar_switcher .par-tab .selected .par-tab_item .par-tab_item_cell {
	color: var(--MAIN_PINK, #F15A7E);
}

/* グレード説明 */
.cal_explanatory_note {
	display: flex;
	align-items: flex-start;
	gap: 0.8rem;
}

.cal_explanatory_note li {
	display: flex;
	height: 2.4rem;
	justify-content: center;
	font-size: 1.4rem;
	text-align: center;
	letter-spacing: 0.04rem;
}

.cal_explanatory_note li.ico_grade {
	width: 6.4rem;
	padding: var(----margin_xxs, 0.2rem) var(----margin_xs, 0.4rem);
	gap: var(----margin_xl, 3.2rem);
	border-radius: 1.2rem;
	color: #FFF;
	text-align: center;
	font-weight: 700;
}

.cal_explanatory_note li.ico_time {
	padding: var(----margin_xxs, 0.2rem) 0rem;
	align-items: center;
	gap: var(----margin_xs, 0.4rem);
	line-height: 2rem;
	/* 142.857% */
}

.cal_explanatory_note li.ico_time img {
	width: 2rem;
	height: 2rem;
}

.cal_explanatory_note>li.ico_grade.sg {
	background: var(--GRADE_SG, #FF7774);
}

.cal_explanatory_note>li.ico_grade.g1 {
	background: var(--GRADE_G1, #FF9A12);
}

.cal_explanatory_note>li.ico_grade.g2 {
	background: var(--GRADE_G2, #77C889);
}

.cal_explanatory_note>li.ico_grade.g3 {
	background: var(--GRADE_G3, #67C2DF);
}

.cal_explanatory_note>li.ico_grade.ip {
	background: var(--GRADE_IPPAN, #6D8895);
}

/******************
     全体設定 
*******************/
.style-cal {
	/* border-collapse: separate; */
	border-bottom: 0.1rem solid var(--BASE_LINE, #D9D9D9);
	font-weight: 400;
	text-align: center;
}

.style-cal th,
.style-cal td {
	font-size: 1.2rem;
	color: var(--MAIN_WHITE, #FFF);
	border-right: 0.1rem solid var(--BASE_LINE, #D9D9D9);
	border-top: 0.1rem solid var(--BASE_LINE, #D9D9D9);
	line-height: 1.5rem;
}

.style-cal th {
	width: 6.5rem;
	vertical-align: middle;
	background: var(--MAIN_NAVY, #113952);
	padding: var(----margin_s, 0.7rem);
}

.style-cal th span {
	display: block;
	font-size: 1rem;
	padding: var(----margin_s, 0.4rem);
	line-height: 1.1rem;
}

.style-cal td {
	padding: var(----margin_s, 0.8rem) var(----margin_xs, 0.4rem);
	vertical-align: middle;
}

/* td セル内リンク */
.style-cal td a,
.style-cal td span {
	color: inherit;
	word-break: break-all;
}

.style-cal .calendar_td .kaisai_info a {
	width: 1.6rem;
	height: 1.6rem;
}

.style-cal .calendar_td .cal_td_wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(----margin_xs, 0.4rem);
	flex-wrap: wrap;
}

.style-cal .style-cal__honjo .calendar_td .cal_td_wrap {
	display: flex;
	flex-direction: column;
}

.style-cal .calendar_td .cal_td_wrap .str_name {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	gap: 0.4rem;
	align-self: stretch;
	flex-wrap: wrap;
}

.style-cal .style-cal__honjo .calendar_td .cal_td_wrap .str_name {
	display: flex;
	flex-direction: column;
}

.style-cal .calendar_td .kaisai_kbn,
.style-cal .calendar_td .kaisai_info {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(----margin_xs, 0.4rem);
}

.style-cal .style-cal__honjo .kaisai_kbn img {
	display: block;
}

/**一般 背景、文字**/
.style-cal td.calendar-grade {
	background: var(--GRADE_IPPAN, #6D8895) !important;
}

/**SG 背景**/
.style-cal td.calendar-grade.SG {
	background: var(--GRADE_SG, #FF7774) !important;
}

/**G1 背景**/
.style-cal td.calendar-grade.G1 {
	background: var(--GRADE_G1, #FF9A12) !important;
}

/**G2 背景**/
.style-cal td.calendar-grade.G2 {
	background: var(--GRADE_G2, #77C889) !important;
}

/**G3 背景**/
.style-cal td.calendar-grade.G3 {
	background: var(--GRADE_G3, #67C2DF) !important;
}

/* 休館日・中止 */
.style-cal td.calendar-grade.CD {
	/* background-color: #d02424!important; */
	background: var(--MAIN_WHITE, #FFF) !important;
	color: var(--BASE_ERROR, #CD1400);
	font-size: 1.2rem;
	line-height: 1.5rem;
	/* 125% */
}

.style-cal td.calendar-grade.NG {
	background-color: #E32510 !important;
}

.style-cal td.calendar-grade.CD * {
	/* color: #fff; */
}

.style-cal td.calendar-grade.NG * {
	color: #fff;
}

.style-cal td.calendar-grade.NG[colspan="1"],
.style-cal td.calendar-grade.CD[colspan="1"] {
	padding: 0 0.5rem;
	line-height: 1.3;
}

.style-cal .tbody_sotomuke td.calendar-grade img.icon-time-morning,
.style-cal .tbody_sotomuke td.calendar-grade img.icon-time-day,
.style-cal .tbody_sotomuke td.calendar-grade img.icon-time-nighter,
.style-cal .tbody_sotomuke.line-morning td.calendar-grade img.icon-time-summer,
.style-cal .tbody_sotomuke.line-night td.calendar-grade img.icon-time-summer,
.style-cal .tbody_sotomuke.line-morning td.calendar-grade img.icon-time-midnight,
.style-cal .tbody_sotomuke.line-day td.calendar-grade img.icon-time-midnight {
	display: none;
}

.style-cal td.calendar-grade img {
	width: 1.6rem;
	height: 1.6rem;
	vertical-align: middle;
}


/**************
/  日付エリア 
***************/
.style-cal .month_cell {
	background: var(--MAIN_WHITE, #FFF);
	border-left: 0.1rem solid var(--BASE_LINE, #D9D9D9);
}

.style-cal .style-cal__date td {
	width: 3.5rem;
	height: 5.8rem;
	padding: var(----margin_s, 0.8rem) 0rem;
	color: var(--MAIN_BLACK, #222);
	font-weight: 700;
}

.style-cal .cell-day,
.style-cal .cell-week_day {
	display: block;
	font-size: 1.4rem;
}

.style-cal .cell-week_day {
	line-height: 2rem;
}

.style-cal .cell-day {
	line-height: 2.1rem;
}

.style-cal .cell-day.font-days-state-6,
.style-cal .cell-day.font-days-state-0 {
	color: inherit !important;
}

.style-cal .week_day.font-days-state-6 {
	color: var(--MAIN_BLUE, #00AFDC) !important;
}

.style-cal .week_day.font-days-state-0 {
	color: var(--BASE_ERROR, #CD1400) !important;
}

/******************
/      本場 td 
*******************/
.style-cal .style-cal__honjo td {
	min-height: 6.6rem;
}

/******************
/      JLC tr
*******************/
.style-cal .tbody_jlc {
	border-bottom: 0.4rem solid var(--BASE_LINE, #D9D9D9);
}

/******************
/      JLC td 
*******************/
.style-cal .tbody_jlc .calendar_td {
	background: var(--BASE_BACKGROUND, #F7F5F2);
	color: var(--MAIN_BLACK, #222);
}

/******************
/      場外 td 
*******************/
.style-cal .tbody_jogai .cal_td_wrap {
	min-height: 2.9rem;
}

/******************
/      外向 td 
*******************/
.style-cal .tbody_sotomuke .cal_td_wrap {
	min-height: 3.1rem;
}


/*********************
/    テレビ放送
***********************/
.category_calendar .tv_broadcast_area {
	display: flex;
	align-items: center;
	gap: 1.6rem;
}

.category_calendar .tv_broadcast_area .broadcast_title {
	display: flex;
	width: 11.5rem;
	padding: var(----margin_s, 0.8rem) 0rem;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	background: var(--MAIN_NAVY, #113952);
	color: #FFF;
	font-size: 1.2rem;
	font-weight: 700;
}

.category_calendar .tv_broadcast_area .broadcast_note {
	display: flex;
	align-items: flex-start;
	gap: 1.6rem;
}

.category_calendar .tv_broadcast_area .broadcast_box {
	display: flex;
	font-size: 1.2rem;
}

.category_calendar .tv_broadcast_area .channel-icon {
	display: flex;
	padding: var(----margin_xxs, 0.2rem) var(----margin_s, 0.8rem);
	gap: 1rem;
	background: var(--BASE_BACKGROUND, #F7F5F2);
	color: var(--MAIN_NAVY, #113952);
}

.category_calendar .tv_broadcast_area .channel {
	display: flex;
	padding: var(----margin_xxs, 0.2rem) var(----margin_xs, 0.4rem);
	gap: 1rem;
	font-weight: 700;
}