@charset "UTF-8";

.p-layout-course{
	display:grid;
	gap:20px;
}

.p-layout-course__cell{
	& > :first-child{
		margin-top:0 !important;
	}

	& > :last-child{
		margin-bottom:0 !important;
	}
}

.p-list-timetable__item, .p-list-timetable__box, .p-list-timetable__titleLegend, .p-list-timetable__data{
	& > :first-child{
		margin-top:0 !important;
	}

	& > :last-child{
		margin-bottom:0 !important;
	}
}

.p-list-timetable{
	--main-color:#c41b1f;
	--bg-color:#fdf9f4;

	margin:40px 0;

	.p-course-confectionary &, &.of-confectionary{
		--main-color:#ff84a0;
		--bg-color:#fff9fa;
	}

	.p-course-cookery-2 &, &.of-cookery-2{
		--main-color:#ff9a39;
		--bg-color:#fef7f3;
	}

	.p-course-cookery-1 &, &.of-cookery-1{
		--main-color:#50c7a9;
		--bg-color:#50c7a9;
	}
}

.p-list-timetable__item{
	& + &{
		margin-top:10px;
	}
}

.p-list-timetable__box{
	padding:25px 20px 30px;
	background-color:var(--bg-color);
	color:var(--main-color);
}

.p-list-timetable__title{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:10px;
	font-size:2rem;
	gap:5px;
}

.p-list-timetable__titleLegend{
	min-width:76px;
	flex-shrink:0;
	line-height:1;
}

.p-box-student-1{
	min-height:274px;
}

.p-box-student-1__layoutAreaImage{
	padding-right:96px;
}

.p-box-student-1__viewport{
	right:-50px;
	width:150px;
}

@media (width > 767px){
	.p-layout-course{
		grid-template-columns:minmax(270px, 360px) minmax(400px, 580px);
	}

	.p-layout-course__cell{
		> *{
			height:100%;
		}
	}
	.p-list-timetable{
		margin-top:60px;
	}

	.p-list-timetable__item{
		& + &{
			margin-top:15px;
		}
	}

	.p-list-timetable__box{
		padding:30px 20px 50px;
	}

	.p-list-timetable__title, .p-list-timetable__data{
		max-width:720px;
		margin-inline:auto;
	}

	.p-list-timetable__title{
		font-size:2.4rem;
		gap:10px;

		&::before{
			display:inline-block;
			min-width:82px;
			content:"";
		}
	}

	.p-list-timetable__titleLegend{
		min-width:82px;
	}
	.p-box-student-1{
		min-height:228px;
	}

	.p-box-student-1__layoutAreaImage{
		padding-right:160px;
	}

	.p-box-student-1__viewport{
		right:0;
		width:180px;
	}
}