/*=========================================
  イベント一覧 Step1
=========================================*/

/* 一覧 */
.yoko-event-list{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:32px 24px;
	margin-top:40px;
}

/* カード */
.yoko-event-card{
	background:#fff;
	border:1px solid #e3ece9;
	border-radius:12px;
	overflow:hidden;
	box-shadow:0 4px 16px rgba(0,0,0,.06);
	transition:.3s;
	margin:0;
}

.yoko-event-card:hover{
	transform:translateY(-4px);
	box-shadow:0 10px 24px rgba(0,0,0,.12);
}

/* リンク全体 */
.yoko-event-card__link{
	display:flex;
	flex-direction:column;
	height:100%;
	color:inherit;
	text-decoration:none;
}

/* 画像 */
.yoko-event-card__image{
	aspect-ratio:1 / 1;
	overflow:hidden;
	background:#f3f3f3;
}

.yoko-event-card__image img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

/* 本文 */
.yoko-event-card__body{
	padding:20px;
	display:flex;
	flex-direction:column;
	flex:1;
}

/* タブレット */
@media(max-width:960px){

	.yoko-event-list{
		grid-template-columns:repeat(2,1fr);
	}

}

/* スマホ */
@media(max-width:767px){

	.yoko-event-list{
		grid-template-columns:1fr;
		gap:24px;
	}

}
/*=========================================
  イベント一覧 Step2
=========================================*/

/* カテゴリー */
.yoko-event-card__categories{
	display:flex;
	flex-wrap:wrap;
	gap:6px;
	margin:0 0 12px;
}

.yoko-event-card__category{
	display:inline-block;
	padding:4px 12px;
	border-radius:999px;
	background:#eaf6f3;
	color:#2f5f57;
	font-size:12px;
	font-weight:700;
	line-height:1.5;
}

/* 開催日時 */
.yoko-event-card__date{
	margin:0 0 12px;
	color:#55877e;
	font-size:13px;
	font-weight:500;
	line-height:1.8;
}

/* タイトル */
.yoko-event-card__title{
	margin:0 0 16px !important;
	padding:0 !important;
	border:0 !important;
	background:none !important;
	box-shadow:none !important;
	color:#2f5f57 !important;
	font-size:20px !important;
	font-weight:700;
	line-height:1.5;
}

.yoko-event-card__title::before,
.yoko-event-card__title::after{
	display:none !important;
	content:none !important;
}

/* タグ */
.yoko-event-card__tags{
	display:flex;
	flex-wrap:wrap;
	gap:6px 10px;
	margin:0 0 14px;
}

.yoko-event-card__tag{
	color:#d89a5b;
	font-size:12px;
	font-weight:600;
}

/* 説明文 */
.yoko-event-card__excerpt{
	margin:0 0 20px;
	color:#555;
	font-size:14px;
	line-height:1.8;
}

/* 詳細ボタン */
.yoko-event-card__button{
	display:block;
	width:100%;
	margin-top:auto;
	padding:12px 16px;
	border:1px solid #4C8F82;
	border-radius:6px;
	background:#fff;
	color:#4C8F82;
	font-size:14px;
	font-weight:700;
	text-align:center;
	transition:
		background-color .3s ease,
		color .3s ease,
		border-color .3s ease;
}

.yoko-event-card__button::after{
	content:" →";
}

/* ホバー時 */

.yoko-event-card:hover .yoko-event-card__button{
	border-color:#4C8F82;
	background:#4C8F82;
	color:#fff;
}

/* カード本文内の不要な余白を調整 */
.yoko-event-card__body > :last-child{
	margin-bottom:0;
}

/* スマホ微調整 */
@media(max-width:767px){

	.yoko-event-card__body{
		padding:18px;
	}

	.yoko-event-card__title{
		font-size:18px !important;
	}

}
/*=========================================
  イベント一覧 Step3｜最終仕上げ
=========================================*/

/* カード内のタイトル領域を揃える */
.yoko-event-card__title{
	min-height:3em;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
	overflow:hidden;
}

/* カード全体のホバーを滑らかに */
.yoko-event-card{
	transition:
		transform .3s ease,
		box-shadow .3s ease,
		border-color .3s ease;
}

.yoko-event-card:hover{
	border-color:#b9d5cf;
	transform:translateY(-5px);
	box-shadow:0 12px 28px rgba(47,95,87,.14);
}

/* 画像を少し拡大 */
.yoko-event-card__image img{
	transition:transform .45s ease;
}

.yoko-event-card:hover .yoko-event-card__image img{
	transform:scale(1.04);
}

/* カテゴリーバッジ共通 */
.yoko-event-card__category{
	border:1px solid transparent;
	transition:
		transform .25s ease,
		background-color .25s ease;
}

/* 個別相談：オレンジ */
.yoko-event-card__category[data-category="consultation"]{
	background:#fff0dc;
	border-color:#f2c98d;
	color:#9a5a00;
}

/* 学校説明会：ピンク */
.yoko-event-card__category[data-category="setsumeikai"]{
	background:#fce8ed;
	border-color:#edbdc8;
	color:#9b5061;
}

/* オンライン説明会：ブルー */
.yoko-event-card__category[data-category="online-briefing"]{
	background:#e3f3fa;
	border-color:#aad5e7;
	color:#35748f;
}

/* 入学試験：グリーン */
.yoko-event-card__category[data-category="exam"]{
	background:#e4f3ed;
	border-color:#add7c8;
	color:#327762;
}

/* 体験入学：パープル
   作成時のスラッグ候補に対応 */
.yoko-event-card__category[data-category="trial-event"],
.yoko-event-card__category[data-category="trial-class"],
.yoko-event-card__category[data-category="trial"]{
	background:#eee8f8;
	border-color:#cbb9e7;
	color:#70549a;
}

/* ボタンの仕上げ */
.yoko-event-card__button{
	position:relative;
	overflow:hidden;
	letter-spacing:.04em;
}

.yoko-event-card__button::after{
	display:inline-block;
	margin-left:6px;
	content:"→";
	transition:transform .3s ease;
}

.yoko-event-card:hover .yoko-event-card__button::after{
	transform:translateX(4px);
}

/* キーボード操作時にも分かりやすくする */
.yoko-event-card__link:focus-visible{
	outline:3px solid rgba(127,175,162,.55);
	outline-offset:4px;
	border-radius:10px;
}

/* タブレット */
@media(max-width:960px){

	.yoko-event-list{
		gap:28px 20px;
	}

	.yoko-event-card__title{
		font-size:19px !important;
	}

}

/* スマホ最終調整 */
@media(max-width:767px){

	.yoko-event-list{
		margin-top:28px;
	}

	.yoko-event-card{
		border-radius:10px;
	}

	.yoko-event-card__image{
		aspect-ratio:1 / 1;
	}

	.yoko-event-card__date{
		font-size:12px;
	}

	.yoko-event-card__title{
		min-height:auto;
		font-size:18px !important;
	}

	.yoko-event-card__button{
		padding:11px 14px;
	}

}

/* 動きを減らす設定の端末に配慮 */
@media(prefers-reduced-motion:reduce){

	.yoko-event-card,
	.yoko-event-card__image img,
	.yoko-event-card__button::after{
		transition:none;
	}

	.yoko-event-card:hover{
		transform:none;
	}

	.yoko-event-card:hover .yoko-event-card__image img{
		transform:none;
	}

}
/*=========================================
  イベント説明文
=========================================*/

.yoko-event-card__excerpt{
	display:-webkit-box;
	min-height:3.6em;
	margin:0 0 18px;
	overflow:hidden;
	color:#666;
	font-size:13px;
	line-height:1.8;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}

/* スマホ */
@media(max-width:767px){

	.yoko-event-card__excerpt{
		min-height:auto;
		font-size:13px;
	}

}
/*=========================================
  近日開催イベント｜通常版
=========================================*/

.yoko-next-event{
	max-width:760px;
	margin:32px auto 0;
}

.yoko-next-event .yoko-event-card{
	width:100%;
}

.yoko-next-event__empty{
	margin:32px 0;
	text-align:center;
}

@media(min-width:768px){

	.yoko-next-event:not(.yoko-next-event--mini)
	.yoko-event-card__link{
		display:grid;
		grid-template-columns:48% 52%;
	}

	.yoko-next-event:not(.yoko-next-event--mini)
	.yoko-event-card__image{
		height:100%;
		aspect-ratio:auto;
	}

	.yoko-next-event:not(.yoko-next-event--mini)
	.yoko-event-card__body{
		padding:26px;
	}

}


/*=========================================
  近日開催イベント｜TOPミニ版
=========================================*/

.yoko-next-event--mini{
	width:100%;
	max-width:none;
	margin:0;
}

.yoko-next-event--mini .yoko-event-card{
	width:100%;
	height:100%;
}

.yoko-next-event--mini .yoko-event-card__link{
	display:flex;
	flex-direction:column;
	height:100%;
}

.yoko-next-event--mini .yoko-event-card__image{
	width:100%;
	aspect-ratio:16 / 10;
}

.yoko-next-event--mini .yoko-event-card__body{
	padding:14px;
}

.yoko-next-event--mini .yoko-event-card__categories{
	margin-bottom:8px;
}

.yoko-next-event--mini .yoko-event-card__category{
	padding:3px 9px;
	font-size:10px;
}

.yoko-next-event--mini .yoko-event-card__date{
	margin-bottom:7px;
	font-size:11px;
	line-height:1.6;
}

.yoko-next-event--mini .yoko-event-card__title{
	min-height:3em;
	margin-bottom:12px !important;
	font-size:16px !important;
	line-height:1.5;
}

.yoko-next-event--mini .yoko-event-card__button{
	padding:9px 10px;
	font-size:12px;
}


/* スマホ */
@media(max-width:767px){

	.yoko-next-event{
		margin-top:24px;
	}

	.yoko-next-event:not(.yoko-next-event--mini)
	.yoko-event-card__link{
		display:flex;
		flex-direction:column;
	}

	.yoko-next-event--mini .yoko-event-card__body{
		padding:16px;
	}

	.yoko-next-event--mini .yoko-event-card__title{
		min-height:auto;
		font-size:17px !important;
	}

}


/*=========================================
  TOP カレンダーの横スクロール調整
=========================================*/

/* PC・タブレット */
@media (min-width:768px){

	.home .oc-calendar-scroll{
		overflow-x:visible !important;
	}

	.home .oc-calendar-scroll .eo-fullcalendar,
	.home .oc-calendar-scroll .fc,
	.home .oc-calendar-scroll .fc-view,
	.home .oc-calendar-scroll table{
		width:100% !important;
		min-width:0 !important;
		max-width:100% !important;
	}

	.home .oc-calendar-scroll .fc-daygrid-day-frame{
		min-width:0 !important;
	}
}

/* スマホでは横スクロール可能 */
@media (max-width:767px){

	.home .oc-calendar-scroll{
		overflow-x:auto;
		-webkit-overflow-scrolling:touch;
	}

}
/*=========================================
  TOP 最新イベント 最終調整
=========================================*/

.home .yoko-next-event--mini .yoko-event-card{
    height:auto !important;
    min-height:0 !important;
}

.home .yoko-next-event--mini .yoko-event-card__link{
	display:flex !important;
	flex-direction:column !important;
	height:100% !important;
}

.home .yoko-next-event--mini .yoko-event-card__image{
	height:205px !important;
min-height:205px !important;
flex:0 0 205px !important;
aspect-ratio:auto !important;
}

.home .yoko-next-event--mini .yoko-event-card__image img{
	width:100% !important;
	height:100% !important;
	object-fit:cover !important;
}

.home .yoko-next-event--mini .yoko-event-card__body{
	display:flex !important;
	flex-direction:column !important;
	flex:1 !important;
	padding:14px !important;
}

.home .yoko-next-event--mini .yoko-event-card__button{
	margin-top:auto !important;
}