@layer layout {
	.l-open-campus-cont {
		width: 100%;
		gap: 30px;
	}
	.l-features-col {
		width: 100%;
		gap: 20px;
	}

	@media (max-width: 999px) {
		.l-open-campus-cont {
			gap: 20px;
		}
	}
}

@layer page {
	/* --------- FV --------- */
	.open-campus-fv__cont {
		gap: 30px;
	}
	.open-campus-fv__img {
		width: 100%;
		height: auto;
		position: relative;
		z-index: 0;
		overflow: hidden;
		border-radius: 10px;
		aspect-ratio: 940 / 470;
	}
	.open-campus-fv__img > picture {
		width: 100%;
		height: 100%;
	}
	.open-campus-fv__img > picture img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	/* --------- Schedule --------- */
	.c-schedule-list {
		width: 100%;
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.c-schedule-item {
		width: 100%;
		display: grid;
		grid-template-columns: 1fr 180px;
		align-items: center;
	}
	.c-schedule-item__info {
		width: 100%;
		height: 100%;
		display: grid;
		grid-template-columns: 1fr;
		border-right: 1px solid var(--c-gray);
	}
	.c-schedule-item__head {
		width: 100%;
		padding-inline: clamp(15px, 4.1vw, 20px);
		padding-block: 15px;
		border-bottom: 1px dashed var(--c-gray);
	}
	.c-schedule-item__ttl-box {
		width: 100%;
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.c-schedule-item__ttl {
		font-size: clamp(14px, 1.11vw, 16px);
		font-weight: 500;
		position: relative;
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.c-schedule-item__ttl::before {
		content: "";
		width: 20px;
		height: 20px;
		aspect-ratio: 1 / 1;
		display: block;
		background-image: url("../images/common/icon-sparkle-gld-lg.svg");
		background-position: center;
		background-size: contain;
		background-repeat: no-repeat;
		flex-shrink: 0;
	}
	.c-schedule-item__date {
		font-weight: 600;
		font-size: 16px;
		position: relative;
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.c-schedule-item__ttl-box > *::after {
		content: "";
		width: 10px;
		height: 1px;
		display: block;
		background: var(--c-text);
		rotate: -45deg;
		flex-shrink: 0;
		translate: 0 2px;
	}
	.c-schedule-item__ttl-box > .c-schedule-time::after {
		content: none;
	}
	.c-schedule-item__txts {
		width: 100%;
		padding-inline: clamp(15px, 4.1vw, 20px);
		padding-block: 15px;
	}
	.c-schedule-btn {
		width: 100%;
		padding: 20px;
	}

	@media (max-width: 768px) {
		.c-border-wrap.c-schedule-item {
			grid-template-columns: 1fr;
		}
		.c-schedule-item__info {
			height: auto;
			border-bottom: 1px solid var(--c-gray);
			border-right: none;
		}
		.c-schedule-item__ttl-box {
			flex-wrap: wrap;
		}
		.c-schedule-item__ttl {
			width: 100%;
		}
		.c-schedule-item__ttl-box > .c-schedule-item__ttl::after {
			content: none;
		}
		.c-schedule-btn > .c-btn {
			width: 150px;
			margin-inline: auto;
		}
	}

	/* --------- Information --------- */
	.oc-information-head {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		position: relative;
	}
	.c-oc-news-grid-area {
		gap: 30px;
		align-items: center;
	}
	.c-oc-news-grid-area > .c-btn-box {
		display: none;
	}
	.c-oc-news-grid {
		width: 100%;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}

	@media (max-width: 999px) {
		.oc-information-head .c-btn-more {
			display: none;
		}
		.c-oc-news-grid-area > .c-btn-box {
			display: flex;
		}
	}
	@media (max-width: 768px) {
		.c-oc-news-grid {
			grid-template-columns: repeat(1, 1fr);
			max-width: 510px;
			margin-inline: auto;
		}
		.oc-information-head .c-btn-more {
			display: none;
		}
		.c-oc-news-grid-area > .c-btn-box {
			display: flex;
		}
	}

	/* --------- Shuttle Bus --------- */
	.shuttle-bus-cont {
		width: 100%;
		gap: 50px;
		align-items: center;
	}
	.shuttle-bus-item {
		width: 100%;
		gap: 30px;
		overflow: hidden;
	}
	.shuttle-bus-item .c-tbl thead th {
		border-right: none;
	}
	.shuttle-bus-cont > .c-btn-box {
		width: 100%;
		max-width: 510px;
	}
	@media (max-width: 768px) {
		.shuttle-bus-grid {
			gap: 20px;
		}
	}

	/* --------- Seminar --------- */
	.seminar-cont {
		gap: 50px;
		align-items: center;
	}
	.seminar-cont > .c-btn-box {
		width: 100%;
		max-width: 510px;
	}
}