@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-layout-student{
	display:flex;
	flex-direction:column;
	gap:30px 40px;
}

.p-layout-student__areaMedia, .p-layout-student__areaText{
	flex-grow:1;

	& > :first-child{
		margin-top:0 !important;
	}

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

.p-layout-student__areaMedia{
	flex-shrink:0;
	margin-inline:-20px;
}

.p-text-studentNamePlate{
	--main-color:#50c7a9;

	display:flex;
	align-items:center;
	justify-content:center;
	font-feature-settings:"palt";
	gap:10px;
}

.p-text-studentNamePlate__course{
	display:inline-flex;
	min-height:22px;
	align-items:center;
	justify-content:center;
	padding:0 10px 2px;
	border-radius:9em;
	background-color:var(--main-color);
	color:#fff;
	font-size:1.4rem;
	font-weight:400;
	line-height:1;
	text-align:center;
}

.p-text-studentNamePlate__profile{
	display:flex;
	flex-direction:column;
}

.p-text-studentNamePlate__name{
	font-size:1.4rem;
	font-weight:700;
}

.p-text-studentNamePlate__school{
	font-size:1.2rem;
	font-weight:400;
}

.p-list-qa{
	--bg-color:#e2f7f2;
	--main-color:#50c7a9;

	display:grid;
	gap:20px;
	margin-block:30px;
}

.p-list-qa__item{
	display:grid;
	gap:25px;
}

.p-list-qa__title{
	display:flex;
	padding:20px;
	border-radius:10px;
	background-color:var(--bg-color);
	font-weight:700;
	gap:10px;
}

.p-list-qa__titleInitial, .p-list-qa__answerInitial{
	font-size:1.8rem;
	font-weight:700;
	line-height:1;
	transform:translateY(3px);
}

.p-list-qa__titleInitial{
	color:var(--main-color);
}

.p-list-qa__answer{
	display:flex;
	padding:0 20px;
	gap:10px;
}

.p-list-qa__titleText, .p-list-qa__answerText{
	flex-grow:1;
}

.p-box-student-1__viewport{
	width:145px;
	margin-right:-45px;
}

.p-box-student-1__layoutAreaText{
	padding-right:100px;
}

.p-box-student-1__q, .p-box-student-1__a{
	position:relative;
	padding-left:12px;
}

.p-box-student-1__q::before, .p-box-student-1__a::before{
	left:0;
  position:absolute;
}

.p-box-student-1__q::before{
	content:"Q.";
}

.p-box-student-1__a::before{
	content:"A.";
}

@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-layout-student{
		flex-direction:row;
	}

	.p-layout-student__areaMedia{
		width:100%;
		max-width:48.78049%;
		margin-inline:0;
	}
	.p-text-studentNamePlate__course{
		min-height:24px;
		font-size:1.6rem;
	}

	.p-text-studentNamePlate__name{
		font-size:1.6rem;
	}

	.p-text-studentNamePlate__school{
		font-size:1.4rem;
	}
	.p-list-qa__titleInitial, .p-list-qa__answerInitial{
		font-size:2rem;
		transform:translateY(4px);
	}
	.p-box-student-1__q, .p-box-student-1__a{
		padding-left:16px;
	}
	.p-box-student-1__viewport{
		width:254px;
		margin-right:0;
	}
	.p-box-student-1__layoutAreaText{
		padding-right:190px;
	}
}