#calendar-container .leftarrow,
#calendar-container .rightarrow { cursor: pointer; }

#calendar-table a,
#calendar-table td > span {
	display: flex;
	justify-content: center;
	align-items: stretch;
	text-decoration: none;
}

@media only screen and (min-width:769px) {
	#event .ocCalendar td { padding: 0 !important; }
	#calendar-table td span {
		padding: 30px 15px;
	}
}

#calendar-table th {
    background-color: #f4f4f4;
}

#calendar-table thead th { 
	color: #fff; 
	background: #808080;
	padding: 1em 0;
}
#calendar-table thead tr th:first-child { background: #c1807f; }
#calendar-table thead tr th:last-child { background: #507f99; }

#calendar-table tbody tr td:first-child { color: #c1807f; }
#calendar-table tbody tr td:last-child { color: #507f99; }
#calendar-table tbody tr td.holiday {
    color: #c1807f;
}

#calendar-table tbody tr td.event-day {
    background-color: #fff0e6;
    cursor: pointer;
}

#calendar-table tbody tr td.event-day:hover {
    background-color: #ff9999;
}

#calendar-table .prev-month,
#calendar-table .next-month {
	color: #ccc !important;
}

#event-reset-button { 
	width: 100%;
	font-size: 100%; 
    font-size: 100%;
    vertical-align: baseline;
	cursor: pointer;
    margin: 0;
    padding: 0;
}

#event .specialLiWrap .heldDateWrap dd span.continued,
#event .ocLiBaseWrap .ocLiBaseBox .heldDateWrap dd span.continued  {
    border-color: #fff;
}

/* ↓ style-event.css と同等に */
.ocLiBaseWrap .ocLiBaseBox .heldDateWrap dd p { 
	text-align: left;
	line-height: 1.6 !important;
}

/* Overwrite */
@media only screen and (max-width: 768px) {
	.ocLiBaseWrap .ocLiBaseBox .heldDateWrap dd p { 
		font-size: 16px;
		font-size: clamp(0.6rem, 2vw + 0.25rem, 1rem) !important;
	}
}
@media only screen and (min-width: 769px) {
	.ocLiBaseWrap .ocLiBaseBox .heldDateWrap {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.ocLiBaseWrap .ocLiBaseBox .heldDateWrap dt { min-height: 62px; }
	
	.ocLiBaseWrap .ocLiBaseBox .heldDateWrap dd p { 
		font-size: var( --16px );
	}
}
/* ↑ style-event.css と同等に */

/* 色 borderはcolorと同じ */
:root {

	/* ocDeptlGc */
	--game-color: #3b82c5;
	--game-bg: #e2ecf6;

	/* ocDeptlCg */
	--cg-color: #389100;
	--cg-bg: #e7f2e0;

	/* ocDeptlAn */
	--anim-color: #db4a86;
	--anim-bg: #f5dbdc;

	/* ocDeptlCh */
	--ill-color: #e69000;
	--ill-bg: #fde599;

	/* ocDeptlVa */
	--voice-color: #c50040;
	--voice-bg: #f9dee7;

	/* ocAllDeptlLiWrap (orange / cream) */
	--all-color: #ff7500;
	--all-bg: #f2f1e9;

	/* ocDeptlDark (none) */
	--none-dark: #4d4d4d;
	--none-darkbg: #f2f1e9;

}

/* none (ocDeptlDark) 2025.07.06 */
/* デフォcssにないため追加。その他はoc.css参照値 */
#calenderEventList .ocDeptlLiBox.ocDeptlDark .heldDateWrap dt,
#event .ocDeptlLiWrap .ocDeptlDark .heldDateWrap dt {
  color: var( --none-dark );
  background: var( --none-darkbg );
}
#calenderEventList .ocDeptlLiBox.ocDeptlDark .heldDateWrap dd span,
#event .ocDeptlLiWrap .ocDeptlDark .heldDateWrap dd span {
  color: var( --none-dark );
  border-color: var( --none-dark );
}
#calenderEventList .ocDeptlLiBox.ocDeptlDark .horixzonHead,
#calenderEventList .ocDeptlLiBox.ocDeptlDark .ocTtl,
#calenderEventList .ocDeptlLiBox.ocDeptlDark .ocMoreBtn,
#event .ocLiBaseWrap .ocLiBaseBox.ocDeptlDark .horixzonHead,
#event .ocDeptlLiWrap .ocDeptlDark .ocTtl,
#event .ocDeptlLiWrap .ocDeptlDark .ocMoreBtn {
  color: var( --none-dark );
}

/* geme */
#calenderEventList .ocDeptlLiBox.ocDeptlGc .heldDateWrap dt {
  color: var( --game-color );
  background: var( --game-bg );
}
#calenderEventList .ocDeptlLiBox.ocDeptlGc .heldDateWrap dd span {
  color: var( --game-color );
  border-color: var( --game-color );
}
#calenderEventList .ocDeptlLiBox.ocDeptlGc .horixzonHead,
#calenderEventList .ocDeptlLiBox.ocDeptlGc .ocTtl,
#calenderEventList .ocDeptlLiBox.ocDeptlGc .ocMoreBtn {
  color: var( --game-color );
}

/* cg */
#calenderEventList .ocDeptlLiBox.ocDeptlCg .heldDateWrap dt {
  color: var( --cg-color );
  background: var( --cg-bg );
}
#calenderEventList .ocDeptlLiBox.ocDeptlCg .heldDateWrap dd span {
  color: var( --cg-color );
  border-color: var( --cg-color );
}
#calenderEventList .ocDeptlLiBox.ocDeptlCg .horixzonHead,
#calenderEventList .ocDeptlLiBox.ocDeptlCg .ocTtl,
#calenderEventList .ocDeptlLiBox.ocDeptlCg .ocMoreBtn {
  color: var( --cg-color );
}

/* anime */
#calenderEventList .ocDeptlLiBox.ocDeptlAn .heldDateWrap dt {
  color: var( --anim-color );
  background: var( --anim-bg );
}
#calenderEventList .ocDeptlLiBox.ocDeptlAn .heldDateWrap dd span {
  color: var( --anim-color );
  border-color: var( --anim-color );
}
#calenderEventList .ocDeptlLiBox.ocDeptlAn .horixzonHead,
#calenderEventList .ocDeptlLiBox.ocDeptlAn .ocTtl,
#calenderEventList .ocDeptlLiBox.ocDeptlAn .ocMoreBtn {
  color: var( --anim-color );
}

/* ill */
#calenderEventList .ocDeptlLiBox.ocDeptlCh .heldDateWrap dt {
  color: var( --ill-color );
  background: var( --ill-bg );
}
#calenderEventList .ocDeptlLiBox.ocDeptlCh .heldDateWrap dd span {
  color: var( --ill-color );
  border-color: var( --ill-color );
}
#calenderEventList .ocDeptlLiBox.ocDeptlCh .horixzonHead,
#calenderEventList .ocDeptlLiBox.ocDeptlCh .ocTtl,
#calenderEventList .ocDeptlLiBox.ocDeptlCh .ocMoreBtn {
  color: var( --ill-color );
}

/* voice */
#calenderEventList .ocDeptlLiBox.ocDeptlVa .heldDateWrap dt {
  color: var( --voice-color );
  background: var( --voice-bg );
}
#calenderEventList .ocDeptlLiBox.ocDeptlVa .heldDateWrap dd span {
  color: var( --voice-color );
  border-color: var( --voice-color );
}
#calenderEventList .ocDeptlLiBox.ocDeptlVa .horixzonHead,
#calenderEventList .ocDeptlLiBox.ocDeptlVa .ocTtl,
#calenderEventList .ocDeptlLiBox.ocDeptlVa .ocMoreBtn {
  color: var( --voice-color );
}

/* all */
#calenderEventList .ocDeptlLiBox.ocDeptlAll .horixzonHead {
  color: var( --all-color );
}
#calenderEventList .ocDeptlLiBox.ocDeptlAll .ocTtl {
  color: var( --all-color );
}
#calenderEventList .ocDeptlLiBox .heldDateWrap dd span.continued {
  border-color: #fff !important;
}

#event .ocDeptlLiWrap .heldDateWrap dd span.continued {
  border-color: #fff !important;
}

/* アイコン */
@media only screen and (min-width: 769px) {
	#event .ocDeptLiWrap li img {
		width: 65%;
		min-width: 87px;
		display: block;
		margin: 0 auto 10px;
	}
}