/* /Pages/Answer.razor.rz.scp.css */
/* */
@media screen and (max-height: 600px) {
	/* answer */
	div.answer_layout[b-d6qngcnfdk] {
		display: grid;
		grid-template-rows: 10px 30px max-content 20px 30px max-content 20px 60px 30px 60px 30px 30px 20px 30px 200px 20px 60px 20px;
		grid-template-columns: 1fr 300px 1fr;
		grid-template-areas:
			". . ."
			". answer_question_title ."
			". answer_question_text ."
			". . ."
			". answer_answer_title ."
			". answer_answer_text ."
			". . ."
			". answer_back ."
			". . ."
			". answer_delete ."
			". . ."
			"answer_message answer_message answer_message"
			". . ."
			". answer_newquestion_title ."
			". answer_newquestion_text ."
			". . ."
			". answer_save ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.answer_question_title[b-d6qngcnfdk] {
		grid-area: answer_question_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.answer_question_text[b-d6qngcnfdk] {
		grid-area: answer_question_text;
		width: 100%;
		border: solid 1px gray;
		padding: 5px;
		text-align: left;
	}

	div.answer_answer_title[b-d6qngcnfdk] {
		grid-area: answer_answer_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.answer_answer_text[b-d6qngcnfdk] {
		grid-area: answer_answer_text;
		width: 100%;
		border: solid 1px gray;
		padding: 5px;
		background-color: #E0FFE0;
		text-align: left;
	}

	div.answer_back[b-d6qngcnfdk] {
		grid-area: answer_back;
		text-align: center;
	}

	button.answer_back_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_back_btn:hover[b-d6qngcnfdk],
		button.answer_back_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.answer_delete[b-d6qngcnfdk] {
		grid-area: answer_delete;
		text-align: center;
	}

	button.answer_delete_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: red;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_delete_btn:hover[b-d6qngcnfdk],
		button.answer_delete_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.answer_message[b-d6qngcnfdk] {
		grid-area: answer_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.answer_newquestion_title[b-d6qngcnfdk] {
		grid-area: answer_newquestion_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.answer_newquestion_text[b-d6qngcnfdk] {
		grid-area: answer_newquestion_text;
		width: 100%;
		height: 100%;
	}

	div.answer_save[b-d6qngcnfdk] {
		grid-area: answer_save;
		text-align: center;
	}

	button.answer_save_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_save_btn:hover[b-d6qngcnfdk],
		button.answer_save_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 1024px) {
	/* answer */
	div.answer_layout[b-d6qngcnfdk] {
		display: grid;
		grid-template-rows: 10px 30px max-content 20px 30px max-content 20px 60px 30px 60px 30px 30px 20px 30px 200px 20px 60px 20px;
		grid-template-columns: 1fr 300px 1fr;
		grid-template-areas:
			". . ."
			". answer_question_title ."
			". answer_question_text ."
			". . ."
			". answer_answer_title ."
			". answer_answer_text ."
			". . ."
			". answer_back ."
			". . ."
			". answer_delete ."
			". . ."
			"answer_message answer_message answer_message"
			". . ."
			". answer_newquestion_title ."
			". answer_newquestion_text ."
			". . ."
			". answer_save ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.answer_question_title[b-d6qngcnfdk] {
		grid-area: answer_question_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.answer_question_text[b-d6qngcnfdk] {
		grid-area: answer_question_text;
		width: 100%;
		border: solid 1px gray;
		padding: 5px;
		text-align: left;
	}

	div.answer_answer_title[b-d6qngcnfdk] {
		grid-area: answer_answer_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.answer_answer_text[b-d6qngcnfdk] {
		grid-area: answer_answer_text;
		width: 100%;
		border: solid 1px gray;
		padding: 5px;
		background-color: #E0FFE0;
		text-align: left;
	}

	div.answer_back[b-d6qngcnfdk] {
		grid-area: answer_back;
		text-align: center;
	}

	button.answer_back_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_back_btn:hover[b-d6qngcnfdk],
		button.answer_back_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.answer_delete[b-d6qngcnfdk] {
		grid-area: answer_delete;
		text-align: center;
	}

	button.answer_delete_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: red;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_delete_btn:hover[b-d6qngcnfdk],
		button.answer_delete_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.answer_message[b-d6qngcnfdk] {
		grid-area: answer_message;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
		color: black;
	}

	div.answer_newquestion_title[b-d6qngcnfdk] {
		grid-area: answer_newquestion_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.answer_newquestion_text[b-d6qngcnfdk] {
		grid-area: answer_newquestion_text;
		width: 100%;
		height: 100%;
	}

	div.answer_save[b-d6qngcnfdk] {
		grid-area: answer_save;
		text-align: center;
	}

	button.answer_save_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_save_btn:hover[b-d6qngcnfdk],
		button.answer_save_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (min-width: 1025px) {
	/* answer */
	div.answer_layout[b-d6qngcnfdk] {
		display: grid;
		grid-template-rows: 10px 40px max-content 20px 40px max-content 20px 60px 30px 30px 20px 40px 200px 20px 60px 20px;
		grid-template-columns: 1fr 250px 100px 250px 1fr;
		grid-template-areas:
			". . . . ."
			". answer_question_title answer_question_title answer_question_title ."
			". answer_question_text answer_question_text answer_question_text ."
			". . . . ."
			". answer_answer_title answer_answer_title answer_answer_title ."
			". answer_answer_text answer_answer_text answer_answer_text ."
			". . . . ."
			". answer_back . answer_delete ."
			". . . . ."
			". answer_message answer_message answer_message ."
			". . . . ."
			". answer_newquestion_title answer_newquestion_title answer_newquestion_title ."
			". answer_newquestion_text answer_newquestion_text answer_newquestion_text ."
			". . . . ."
			". answer_save answer_save answer_save ."
			". . . . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.answer_question_title[b-d6qngcnfdk] {
		grid-area: answer_question_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	div.answer_question_text[b-d6qngcnfdk] {
		grid-area: answer_question_text;
		width: 100%;
		border: solid 1px gray;
		padding: 5px;
		text-align: left;
	}

	div.answer_answer_title[b-d6qngcnfdk] {
		grid-area: answer_answer_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	div.answer_answer_text[b-d6qngcnfdk] {
		grid-area: answer_answer_text;
		width: 100%;
		border: solid 1px gray;
		padding: 5px;
		background-color: #E0FFE0;
		text-align: left;
	}

	div.answer_back[b-d6qngcnfdk] {
		grid-area: answer_back;
		text-align: center;
	}

	button.answer_back_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_back_btn:hover[b-d6qngcnfdk],
		button.answer_back_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.answer_delete[b-d6qngcnfdk] {
		grid-area: answer_delete;
		text-align: center;
	}

	button.answer_delete_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: red;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_delete_btn:hover[b-d6qngcnfdk],
		button.answer_delete_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.answer_message[b-d6qngcnfdk] {
		grid-area: answer_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.answer_newquestion_title[b-d6qngcnfdk] {
		grid-area: answer_newquestion_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	textarea.answer_newquestion_text[b-d6qngcnfdk] {
		grid-area: answer_newquestion_text;
		width: 100%;
		height: 100%;
	}

	div.answer_save[b-d6qngcnfdk] {
		grid-area: answer_save;
		text-align: center;
	}

	button.answer_save_btn[b-d6qngcnfdk] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.answer_save_btn:hover[b-d6qngcnfdk],
		button.answer_save_btn:focus[b-d6qngcnfdk] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}
/* /Pages/Error.razor.rz.scp.css */
button.err_btn[b-dtbjxvxd0b] {
	font-size: 24px;
	text-align: center;
	border: none;
	border-radius: 5px;
	background-color: teal;
	color: white;
	outline: none;
	width: 300px;
	margin: 0px auto;
}

	button.err_btn:hover[b-dtbjxvxd0b],
	button.err_btn:focus[b-dtbjxvxd0b] {
		box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
	}

/* */
@media screen and (max-height: 600px) {
	/* Login */
	div.err_layout[b-dtbjxvxd0b] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.err_title[b-dtbjxvxd0b] {
		grid-area: title;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: red;
	}

	div.err_msg[b-dtbjxvxd0b] {
		grid-area: msg;
		text-align: center;
		font-size: 12px;
		line-height: 15px;
		color: black;
	}

	div.err_btn[b-dtbjxvxd0b] {
		grid-area: btn;
		text-align: center;
	}

}

/* */
@media screen and (max-width: 768px) {
	/* Login */
	div.err_layout[b-dtbjxvxd0b] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 80vw max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.err_title[b-dtbjxvxd0b] {
		grid-area: title;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: red;
	}

	div.err_msg[b-dtbjxvxd0b] {
		grid-area: msg;
		text-align: center;
		font-size: 15px;
		line-height: 18px;
		color: black;
	}

	div.err_btn[b-dtbjxvxd0b] {
		grid-area: btn;
		text-align: center;
	}
}

/* */
@media screen and (max-width: 1024px) {
	div.err_layout[b-dtbjxvxd0b] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.err_title[b-dtbjxvxd0b] {
		grid-area: title;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: red;
	}

	div.err_msg[b-dtbjxvxd0b] {
		grid-area: msg;
		text-align: center;
		font-size: 15px;
		line-height: 18px;
		color: black;
	}

	div.err_btn[b-dtbjxvxd0b] {
		grid-area: btn;
		text-align: center;
	}
}

/* */
@media screen and (min-width: 1025px) {
	/* Login */
	div.err_layout[b-dtbjxvxd0b] {
		display: grid;
		grid-template-rows: 60px 30px 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr max-content 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.err_title[b-dtbjxvxd0b] {
		grid-area: title;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: red;
	}

	div.err_msg[b-dtbjxvxd0b] {
		grid-area: msg;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: black;
	}

	div.err_btn[b-dtbjxvxd0b] {
		grid-area: btn;
		text-align: center;
	}
}
/* /Pages/HowTo.razor.rz.scp.css */
/* */
div.howto_layout[b-q9sucih7ay] {
	display: grid;
	grid-template-rows: 10px max-content max-content 40px 10px;
	grid-template-columns: 1fr;
	width: 100%;
	margin: 0px;
	padding: 0px;
}

img.howto_img[b-q9sucih7ay] {
	max-width: min(1200px, 90vw);
	margin: 10px auto;
}

button.howto_back_btn[b-q9sucih7ay] {
	font-size: 18px;
	text-align: center;
	border: none;
	border-radius: 5px;
	background-color: teal;
	color: white;
	outline: none;
	width: 200px;
	height: 40px;
	margin: auto;
}

	button.howto_back_btn:hover[b-q9sucih7ay],
	button.howto_back_btn:focus[b-q9sucih7ay] {
		box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
	}
/* /Pages/Lesson.razor.rz.scp.css */
/* */
@media screen and (max-height: 600px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 40px 40px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 40px 300px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-iwa717ok79] {
		grid-area: auth_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(120px at 150px 150px);
		z-index: 2;
		width: 300px;
		height: 300px;
	}

	div.lesson_auth_capture[b-iwa717ok79] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-iwa717ok79] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-iwa717ok79],
		button.lesson_auth_capture_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-iwa717ok79] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-iwa717ok79] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-iwa717ok79],
		button.lesson_auth_back_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 100px 100px 1fr 1fr 1fr;
			grid-template-columns: 1fr 100px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg";
				"video_video video_reauth"
				"video_video video_play"
				"video_video video_vol";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-iwa717ok79] {
			width: min(100%, calc((100vh - 40px) / 9 * 16));
			height: min(100%, calc((100vw - 100px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-iwa717ok79] {
				height: calc(min(100%, calc((100vw - 100px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
				font-size: 12px;
				line-height: 15px;
			}

			div.ques_box div.ques button[b-iwa717ok79] {
				font-size: 12px;
				margin: 5px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 40px 40px 40px 1fr;
			grid-template-columns: 1fr 120px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
			font-size: 10px;
			line-height: 12px;
		}

		div.ques_box div.ques button[b-iwa717ok79] {
			font-size: 10px;
			margin: 5px;
		}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/

	}

	div.lesson_video_camera[b-iwa717ok79] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
	}

	div.lesson_video_video[b-iwa717ok79] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-iwa717ok79] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-iwa717ok79] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 12px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-iwa717ok79] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-iwa717ok79] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-iwa717ok79],
		button.lesson_video_reauth_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-iwa717ok79] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-iwa717ok79] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-iwa717ok79],
		button.lesson_video_play_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-iwa717ok79] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-iwa717ok79],
		button.lesson_video_pause_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-iwa717ok79] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 10px 100px 20px 30px 300px 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-iwa717ok79] {
		grid-area: question_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_question_title[b-iwa717ok79] {
		grid-area: question_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-iwa717ok79] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-iwa717ok79] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-iwa717ok79],
		button.lesson_question_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"failure_message failure_message failure_message"
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-iwa717ok79] {
		grid-area: failure_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_failure_finish[b-iwa717ok79] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-iwa717ok79],
		button.lesson_failure_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 768px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 40px 40px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 40px 300px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-iwa717ok79] {
		grid-area: auth_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(120px at 150px 150px);
		z-index: 2;
		width: 300px;
		height: 300px;
	}

	div.lesson_auth_capture[b-iwa717ok79] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-iwa717ok79] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-iwa717ok79],
		button.lesson_auth_capture_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-iwa717ok79] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-iwa717ok79] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-iwa717ok79],
		button.lesson_auth_back_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 100px 100px 1fr 1fr 1fr;
			grid-template-columns: 1fr 100px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg"
				"video_video video_reauth"
				"video_video video_play"
				"video_video video_vol";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-iwa717ok79] {
			width: min(100%, calc((100vh - 40px) / 9 * 16));
			height: min(100%, calc((100vw - 100px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-iwa717ok79] {
				height: calc(min(100%, calc((100vw - 100px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
				font-size: 15px;
				line-height: 18px;
			}

			div.ques_box div.ques button[b-iwa717ok79] {
				font-size: 15px;
				margin: 5px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 40px 40px 40px 1fr;
			grid-template-columns: 1fr 120px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+202510xxJ 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
			font-size: 12px;
			line-height: 15px;
		}

		div.ques_box div.ques button[b-iwa717ok79] {
			font-size: 12px;
			margin: 5px;
		}
		/*//+202510xxJ 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	div.lesson_video_camera[b-iwa717ok79] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
	}

	div.lesson_video_video[b-iwa717ok79] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-iwa717ok79] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-iwa717ok79] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 12px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-iwa717ok79] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-iwa717ok79] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-iwa717ok79],
		button.lesson_video_reauth_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-iwa717ok79] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-iwa717ok79] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-iwa717ok79],
		button.lesson_video_play_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-iwa717ok79] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-iwa717ok79],
		button.lesson_video_pause_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-iwa717ok79] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 10px 100px 20px 30px 300px 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-iwa717ok79] {
		grid-area: question_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_question_title[b-iwa717ok79] {
		grid-area: question_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-iwa717ok79] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-iwa717ok79] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-iwa717ok79],
		button.lesson_question_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"failure_message failure_message failure_message"
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-iwa717ok79] {
		grid-area: failure_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_failure_finish[b-iwa717ok79] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-iwa717ok79],
		button.lesson_failure_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 1024px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 50px 40px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 50px 300px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-iwa717ok79] {
		grid-area: auth_message;
		text-align: center;
		font-size: 18px;
		line-height: 25px;
		color: black;
	}

	div.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(120px at 150px 150px);
		z-index: 2;
		width: 300px;
		height: 300px;
	}

	div.lesson_auth_capture[b-iwa717ok79] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-iwa717ok79] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-iwa717ok79],
		button.lesson_auth_capture_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-iwa717ok79] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-iwa717ok79] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-iwa717ok79],
		button.lesson_auth_back_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 120px 120px 1fr 1fr 1fr;
			grid-template-columns: 1fr 120px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg"
				"video_video video_reauth"
				"video_video video_play"
				"video_video video_vol";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(50px at 60px 60px);
			z-index: 2;
			width: 120px;
			height: 120px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-iwa717ok79] {
			width: min(100%, calc((100vh - 40px) / 9 * 16));
			height: min(100%, calc((100vw - 120px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-iwa717ok79] {
				height: calc(min(100%, calc((100vw - 120px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
				font-size: 21px;
				line-height: 23px;
			}

			div.ques_box div.ques button[b-iwa717ok79] {
				font-size: 21px;
				margin: 5px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 40px 40px 40px 1fr;
			grid-template-columns: 1fr 120px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+202510xxJ 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
			font-size: 15px;
			line-height: 18px;
		}

		div.ques_box div.ques button[b-iwa717ok79] {
			font-size: 15px;
			margin: 5px;
		}
		/*//+202510xxJ 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	div.lesson_video_camera[b-iwa717ok79] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
	}

	div.lesson_video_video[b-iwa717ok79] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-iwa717ok79] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-iwa717ok79] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 12px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-iwa717ok79] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-iwa717ok79] {
		font-size: 12px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 110px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-iwa717ok79],
		button.lesson_video_reauth_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-iwa717ok79] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-iwa717ok79] {
		font-size: 12px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 110px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-iwa717ok79],
		button.lesson_video_play_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-iwa717ok79] {
		font-size: 12px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 110px;
		height: 40px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-iwa717ok79],
		button.lesson_video_pause_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-iwa717ok79] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 10px 125px 20px 30px 400px 20px 60px 10px;
		grid-template-columns: 1fr min(600px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-iwa717ok79] {
		grid-area: question_message;
		text-align: center;
		font-size: 18px;
		line-height: 25px;
		color: black;
	}

	div.lesson_question_title[b-iwa717ok79] {
		grid-area: question_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-iwa717ok79] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-iwa717ok79] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-iwa717ok79],
		button.lesson_question_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr min(600px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"failure_message failure_message failure_message"
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-iwa717ok79] {
		grid-area: failure_message;
		text-align: center;
		font-size: 18px;
		line-height: 25px;
		color: black;
	}

	div.lesson_failure_finish[b-iwa717ok79] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-iwa717ok79],
		button.lesson_failure_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (min-width: 1025px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 60px 140px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 10px 60px 400px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 400px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-iwa717ok79] {
		grid-area: auth_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-iwa717ok79] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(150px at 200px 200px);
		z-index: 2;
		width: 400px;
		height: 400px;
	}

	div.lesson_auth_capture[b-iwa717ok79] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-iwa717ok79] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-iwa717ok79],
		button.lesson_auth_capture_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-iwa717ok79] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-iwa717ok79] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-iwa717ok79],
		button.lesson_auth_back_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 200px 200px 1fr 1fr 1fr;
			grid-template-columns: 1fr 200px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg"
				"video_video video_reauth"
				"video_video video_play"
				"video_video video_vol";
			width: 100%;
			height: calc(100vh - 60px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(70px at 100px 100px);
			z-index: 2;
			width: 200px;
			height: 200px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-iwa717ok79] {
			width: min(100%, calc((100vh - 60px) / 9 * 16));
			height: min(100%, calc((100vw - 200px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-iwa717ok79] {
				height: calc(min(100%, calc((100vw - 200px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
				font-size: 36px;
				line-height: 40px;
			}

			div.ques_box div.ques button[b-iwa717ok79] {
				font-size: 36px;
				margin: 10px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-iwa717ok79] {
			display: grid;
			grid-template-rows: 70px 70px 60px 1fr;
			grid-template-columns: 1fr 200px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 60px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-iwa717ok79] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+202510xxJ 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-iwa717ok79] {
			font-size: 32px;
			line-height: 35px;
		}

		div.ques_box div.ques button[b-iwa717ok79] {
			font-size: 32px;
			margin: 10px;
		}
		/*//+202510xxJ 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	div.lesson_video_camera[b-iwa717ok79] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
	}

	div.lesson_video_video[b-iwa717ok79] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-iwa717ok79] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-iwa717ok79] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 21px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-iwa717ok79] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 150px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-iwa717ok79],
		button.lesson_video_reauth_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-iwa717ok79] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 150px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-iwa717ok79],
		button.lesson_video_play_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 150px;
		height: 60px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-iwa717ok79],
		button.lesson_video_pause_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-iwa717ok79] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 10px 130px 20px 40px 400px 20px 60px 10px;
		grid-template-columns: 1fr 600px 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-iwa717ok79] {
		grid-area: question_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.lesson_question_title[b-iwa717ok79] {
		grid-area: question_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-iwa717ok79] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-iwa717ok79] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-iwa717ok79],
		button.lesson_question_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-iwa717ok79] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr 600px 1fr;
		grid-template-areas:
			". . ."
			". failure_message ."
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-iwa717ok79] {
		grid-area: failure_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.lesson_failure_finish[b-iwa717ok79] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-iwa717ok79] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-iwa717ok79],
		button.lesson_failure_finish_btn:focus[b-iwa717ok79] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}
/* /Pages/Lesson_Test.razor.rz.scp.css */
/* */
@media screen and (max-height: 600px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 40px 40px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 40px 300px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-ms93u7sf4p] {
		grid-area: auth_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(120px at 150px 150px);
		z-index: 2;
		width: 300px;
		height: 300px;
	}

	div.lesson_auth_capture[b-ms93u7sf4p] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-ms93u7sf4p] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_capture_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-ms93u7sf4p] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-ms93u7sf4p] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_back_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 100px 100px 1fr 1fr 1fr;
			grid-template-columns: 1fr 100px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg";
			"video_video video_reauth" "video_video video_play" "video_video video_vol";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-ms93u7sf4p] {
			width: min(100%, calc((100vh - 40px) / 9 * 16));
			height: min(100%, calc((100vw - 100px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-ms93u7sf4p] {
				height: calc(min(100%, calc((100vw - 100px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
				font-size: 15px;
				line-height: 18px;
			}

			div.ques_box div.ques button[b-ms93u7sf4p] {
				font-size: 15px;
				margin: 5px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 40px 40px 40px 1fr;
			grid-template-columns: 1fr 120px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
			font-size: 12px;
			line-height: 15px;
		}

		div.ques_box div.ques button[b-ms93u7sf4p] {
			font-size: 12px;
			margin: 5px;
		}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/

	}

	div.lesson_video_camera[b-ms93u7sf4p] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
		font-size: 10px;
	}

	div.lesson_video_video[b-ms93u7sf4p] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-ms93u7sf4p] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-ms93u7sf4p] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 12px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-ms93u7sf4p] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-ms93u7sf4p] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-ms93u7sf4p],
		button.lesson_video_reauth_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-ms93u7sf4p] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-ms93u7sf4p] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-ms93u7sf4p],
		button.lesson_video_play_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-ms93u7sf4p] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-ms93u7sf4p],
		button.lesson_video_pause_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-ms93u7sf4p] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 10px 100px 20px 30px 300px 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-ms93u7sf4p] {
		grid-area: question_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_question_title[b-ms93u7sf4p] {
		grid-area: question_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-ms93u7sf4p] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-ms93u7sf4p] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_question_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"failure_message failure_message failure_message"
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-ms93u7sf4p] {
		grid-area: failure_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_failure_finish[b-ms93u7sf4p] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_failure_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 768px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 40px 40px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 40px 300px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-ms93u7sf4p] {
		grid-area: auth_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(120px at 150px 150px);
		z-index: 2;
		width: 300px;
		height: 300px;
	}

	div.lesson_auth_capture[b-ms93u7sf4p] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-ms93u7sf4p] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_capture_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-ms93u7sf4p] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-ms93u7sf4p] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_back_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 100px 100px 1fr 1fr 1fr;
			grid-template-columns: 1fr 100px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg"
				"video_video video_reauth"
				"video_video video_play"
				"video_video video_vol";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-ms93u7sf4p] {
			width: min(100%, calc((100vh - 40px) / 9 * 16));
			height: min(100%, calc((100vw - 100px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-ms93u7sf4p] {
				height: calc(min(100%, calc((100vw - 100px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
				font-size: 15px;
				line-height: 18px;
			}

			div.ques_box div.ques button[b-ms93u7sf4p] {
				font-size: 15px;
				margin: 5px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 40px 40px 40px 1fr;
			grid-template-columns: 1fr 120px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+202510xxJ 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
			font-size: 12px;
			line-height: 15px;
		}

		div.ques_box div.ques button[b-ms93u7sf4p] {
			font-size: 12px;
			margin: 5px;
		}
		/*//+202510xxJ 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	div.lesson_video_camera[b-ms93u7sf4p] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
		font-size: 10px;
	}

	div.lesson_video_video[b-ms93u7sf4p] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-ms93u7sf4p] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-ms93u7sf4p] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 12px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-ms93u7sf4p] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-ms93u7sf4p] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-ms93u7sf4p],
		button.lesson_video_reauth_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-ms93u7sf4p] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-ms93u7sf4p] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-ms93u7sf4p],
		button.lesson_video_play_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-ms93u7sf4p] {
		font-size: 10px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 90px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-ms93u7sf4p],
		button.lesson_video_pause_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-ms93u7sf4p] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 10px 100px 20px 30px 300px 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-ms93u7sf4p] {
		grid-area: question_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_question_title[b-ms93u7sf4p] {
		grid-area: question_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-ms93u7sf4p] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-ms93u7sf4p] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_question_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr min(400px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"failure_message failure_message failure_message"
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-ms93u7sf4p] {
		grid-area: failure_message;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.lesson_failure_finish[b-ms93u7sf4p] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_failure_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 1024px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 50px 40px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 50px 300px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-ms93u7sf4p] {
		grid-area: auth_message;
		text-align: center;
		font-size: 18px;
		line-height: 25px;
		color: black;
	}

	div.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(120px at 150px 150px);
		z-index: 2;
		width: 300px;
		height: 300px;
	}

	div.lesson_auth_capture[b-ms93u7sf4p] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-ms93u7sf4p] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_capture_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-ms93u7sf4p] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-ms93u7sf4p] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_back_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 120px 120px 1fr 1fr 1fr;
			grid-template-columns: 1fr 120px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg"
				"video_video video_reauth"
				"video_video video_play"
				"video_video video_vol";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(50px at 60px 60px);
			z-index: 2;
			width: 120px;
			height: 120px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-ms93u7sf4p] {
			width: min(100%, calc((100vh - 40px) / 9 * 16));
			height: min(100%, calc((100vw - 120px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-ms93u7sf4p] {
				height: calc(min(100%, calc((100vw - 120px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
				font-size: 21px;
				line-height: 23px;
			}

			div.ques_box div.ques button[b-ms93u7sf4p] {
				font-size: 21px;
				margin: 5px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 40px 40px 40px 1fr;
			grid-template-columns: 1fr 120px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 40px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+202510xxJ 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
			font-size: 15px;
			line-height: 18px;
		}

		div.ques_box div.ques button[b-ms93u7sf4p] {
			font-size: 15px;
			margin: 5px;
		}
		/*//+202510xxJ 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	div.lesson_video_camera[b-ms93u7sf4p] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
		font-size: 12px;
	}

	div.lesson_video_video[b-ms93u7sf4p] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-ms93u7sf4p] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-ms93u7sf4p] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 12px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-ms93u7sf4p] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-ms93u7sf4p] {
		font-size: 12px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 110px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-ms93u7sf4p],
		button.lesson_video_reauth_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-ms93u7sf4p] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-ms93u7sf4p] {
		font-size: 12px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 110px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-ms93u7sf4p],
		button.lesson_video_play_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-ms93u7sf4p] {
		font-size: 12px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 110px;
		height: 40px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-ms93u7sf4p],
		button.lesson_video_pause_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-ms93u7sf4p] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 10px 125px 20px 30px 400px 20px 60px 10px;
		grid-template-columns: 1fr min(600px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-ms93u7sf4p] {
		grid-area: question_message;
		text-align: center;
		font-size: 18px;
		line-height: 25px;
		color: black;
	}

	div.lesson_question_title[b-ms93u7sf4p] {
		grid-area: question_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-ms93u7sf4p] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-ms93u7sf4p] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_question_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr min(600px, 80vw) 1fr;
		grid-template-areas:
			". . ."
			"failure_message failure_message failure_message"
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-ms93u7sf4p] {
		grid-area: failure_message;
		text-align: center;
		font-size: 18px;
		line-height: 25px;
		color: black;
	}

	div.lesson_failure_finish[b-ms93u7sf4p] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_failure_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (min-width: 1025px) {
	/* lesson */
	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 60px 140px 60px 60px 140px 10px;
			grid-template-columns: 1fr 300px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". auth_camera auth_capture"
				". auth_camera auth_countdown"
				". auth_camera auth_back"
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_auth_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 10px 60px 400px 10px 60px 60px 40px 10px;
			grid-template-columns: 1fr 400px 1fr;
			grid-template-areas:
				". . ."
				"auth_message auth_message auth_message"
				". auth_camera ."
				". . ."
				". auth_capture ."
				". auth_countdown ."
				". auth_back ."
				". . .";
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
	}

	div.lesson_auth_message[b-ms93u7sf4p] {
		grid-area: auth_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		z-index: 1;
	}

	video.lesson_auth_camera[b-ms93u7sf4p] {
		grid-area: auth_camera;
		margin: auto;
		clip-path: circle(150px at 200px 200px);
		z-index: 2;
		width: 400px;
		height: 400px;
	}

	div.lesson_auth_capture[b-ms93u7sf4p] {
		grid-area: auth_capture;
		text-align: center;
	}

	button.lesson_auth_capture_btn[b-ms93u7sf4p] {
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 60px;
		margin: auto;
	}

		button.lesson_auth_capture_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_capture_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_auth_countdown[b-ms93u7sf4p] {
		grid-area: auth_countdown;
		text-align: center;
	}

	div.lesson_auth_back[b-ms93u7sf4p] {
		grid-area: auth_back;
		text-align: center;
	}

	button.lesson_auth_back_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_auth_back_btn:hover[b-ms93u7sf4p],
		button.lesson_auth_back_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	@media (orientation: landscape) {
		/* 横向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 200px 200px 1fr 1fr 1fr;
			grid-template-columns: 1fr 200px;
			grid-template-areas:
				"video_video video_camera"
				"video_video video_msg"
				"video_video video_reauth"
				"video_video video_play"
				"video_video video_vol";
			width: 100%;
			height: calc(100vh - 60px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(70px at 100px 100px);
			z-index: 2;
			width: 200px;
			height: 200px;
		}

		/*//+20251017J 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques[b-ms93u7sf4p] {
			width: min(100%, calc((100vh - 60px) / 9 * 16));
			height: min(100%, calc((100vw - 200px) / 16 * 9));
			aspect-ratio: 16 / 9;
			margin: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

			div.ques_box div.ques div.ques_img[b-ms93u7sf4p] {
				height: calc(min(100%, calc((100vw - 200px) / 16 * 9) / 3)) !important;
			}

			div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
				font-size: 42px;
			}

			div.ques_box div.ques button[b-ms93u7sf4p] {
				font-size: 42px;
				margin: 10px;
			}
		/*//+20251017J 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	@media (orientation: portrait) {
		/* 縦向き */
		div.lesson_video_layout[b-ms93u7sf4p] {
			display: grid;
			grid-template-rows: 70px 70px 60px 1fr;
			grid-template-columns: 1fr 200px 100px;
			grid-template-areas:
				"video_reauth video_msg video_camera"
				"video_play video_msg video_camera"
				"video_vol video_msg video_camera"
				"video_video video_video video_video";
			width: 100%;
			height: calc(100vh - 60px);
			margin: 0px;
			padding: 0px;
		}

		video.lesson_video_camera[b-ms93u7sf4p] {
			grid-area: video_camera;
			margin: auto;
			clip-path: circle(40px at 50px 50px);
			z-index: 2;
			width: 100px;
			height: 100px;
		}

		/*//+202510xxJ 動画途中の問題に対応   ↓↓↓↓↓*/
		div.ques_box div.ques div.ques_msg[b-ms93u7sf4p] {
			font-size: 36px;
		}

		div.ques_box div.ques button[b-ms93u7sf4p] {
			font-size: 36px;
			margin: 10px;
		}
		/*//+202510xxJ 動画途中の問題に対応   ↑↑↑↑↑*/
	}

	div.lesson_video_camera[b-ms93u7sf4p] {
		grid-area: video_camera;
		z-index: 1;
		display: none;
		font-size: 15px;
	}

	div.lesson_video_video[b-ms93u7sf4p] {
		grid-area: video_video;
		background-color: gray;
	}

	iframe.lesson_video_video[b-ms93u7sf4p] {
		width: 100%;
		height: 100%;
	}

	div.lesson_video_msg[b-ms93u7sf4p] {
		grid-area: video_msg;
		text-align: center;
		color: red;
		font-size: 21px;
		line-height: 50px;
	}

	div.lesson_video_reauth[b-ms93u7sf4p] {
		grid-area: video_reauth;
		text-align: center;
	}

	button.lesson_video_reauth_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 150px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_reauth_btn:hover[b-ms93u7sf4p],
		button.lesson_video_reauth_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_video_play[b-ms93u7sf4p] {
		grid-area: video_play;
		text-align: center;
	}

	button.lesson_video_play_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 150px;
		height: 30px;
		margin: auto;
	}

		button.lesson_video_play_btn:hover[b-ms93u7sf4p],
		button.lesson_video_play_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↓↓↓↓↓*/
	button.lesson_video_pause_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 150px;
		height: 60px;
		margin: auto;
	}

		button.lesson_video_pause_btn:hover[b-ms93u7sf4p],
		button.lesson_video_pause_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
	/* //+20240415J Vimeoを契約解除してvideo.jsを使用 ↑↑↑↑↑*/

	div.lesson_video_vol[b-ms93u7sf4p] {
		grid-area: video_vol;
		text-align: center;
	}

	div.lesson_question_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 10px 130px 20px 40px 400px 20px 60px 10px;
		grid-template-columns: 1fr 600px 1fr;
		grid-template-areas:
			". . ."
			"question_message question_message question_message"
			". . ."
			". question_title ."
			". question_text ."
			". . ."
			". question_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_question_message[b-ms93u7sf4p] {
		grid-area: question_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.lesson_question_title[b-ms93u7sf4p] {
		grid-area: question_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	textarea.lesson_question_text[b-ms93u7sf4p] {
		grid-area: question_text;
		width: 100%;
		height: 100%;
	}

	div.lesson_question_finish[b-ms93u7sf4p] {
		grid-area: question_finish;
		text-align: center;
	}

	button.lesson_question_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_question_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_question_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.lesson_failure_layout[b-ms93u7sf4p] {
		display: grid;
		grid-template-rows: 30px max-content 20px 60px 10px;
		grid-template-columns: 1fr 600px 1fr;
		grid-template-areas:
			". . ."
			". failure_message ."
			". . ."
			". failure_finish ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.lesson_failure_message[b-ms93u7sf4p] {
		grid-area: failure_message;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: black;
	}

	div.lesson_failure_finish[b-ms93u7sf4p] {
		grid-area: failure_finish;
		text-align: center;
	}

	button.lesson_failure_finish_btn[b-ms93u7sf4p] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.lesson_failure_finish_btn:hover[b-ms93u7sf4p],
		button.lesson_failure_finish_btn:focus[b-ms93u7sf4p] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}
/* /Pages/List.razor.rz.scp.css */
/* */
@media screen and (max-height: 600px) {
	/* list */
	div.list_layout[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 10px max-content max-content 10px 40px 10px max-content max-content 10px 40px 10px;
		grid-template-columns: 1fr 400px 1fr;
		grid-template-areas:
			". . ."
			". header1 ."
			". list1 ."
			". . ."
			". back1 ."
			". . ."
			". header2 ."
			". list2 ."
			". . ."
			". back2 ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-leqagmsrbr] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 400px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header2_layout[b-leqagmsrbr] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 400px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header_title[b-leqagmsrbr] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-leqagmsrbr] {
		grid-area: header_no;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_btn[b-leqagmsrbr] {
		grid-area: header_btn;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-leqagmsrbr] {
		display: none;
	}

	div.list_header_guide[b-leqagmsrbr] {
		grid-area: header_guide;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_date[b-leqagmsrbr] {
		grid-area: header_date;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_list1_layout[b-leqagmsrbr] {
		grid-area: list1;
		width: 400px;
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-leqagmsrbr] {
		grid-area: list2;
		width: 400px;
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: 400px;
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px teal;
	}

	div.list_item_list_no[b-leqagmsrbr] {
		grid-area: list_no;
		text-align: center;
		font-size: 12px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-leqagmsrbr] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-leqagmsrbr] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-leqagmsrbr] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_date[b-leqagmsrbr] {
		grid-area: list_date;
		text-align: center;
		font-size: 10px;
		line-height: 30px;
	}

	div.list_item_list_time[b-leqagmsrbr] {
		grid-area: list_time;
		text-align: center;
		font-size: 10px;
		line-height: 30px;
	}

	div.list_btn_disable[b-leqagmsrbr],
	button.list_btn_disable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-leqagmsrbr],
		button.list_btn_commit:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.list_btn_enable:focus[b-leqagmsrbr],
		button.list_btn_enable:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-leqagmsrbr],
		button.list_btn_wait:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-leqagmsrbr] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-leqagmsrbr] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-leqagmsrbr] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-leqagmsrbr] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-leqagmsrbr] {
		grid-area: back2;
		text-align: center;
	}

	button.list_back_btn[b-leqagmsrbr] {
		font-size: 15px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-leqagmsrbr],
		button.list_back_btn:focus[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 768px) {
	/* list */
	div.list_layout[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 10px max-content max-content 10px 40px 10px max-content max-content 10px 40px 10px;
		grid-template-columns: 1fr min(600px, 90vw) 1fr;
		grid-template-areas:
			". . ."
			". header1 ."
			". list1 ."
			". . ."
			". back1 ."
			". . ."
			". header2 ."
			". list2 ."
			". . ."
			". back2 ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-leqagmsrbr] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header2_layout[b-leqagmsrbr] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header_title[b-leqagmsrbr] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-leqagmsrbr] {
		grid-area: header_no;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_btn[b-leqagmsrbr] {
		grid-area: header_btn;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-leqagmsrbr] {
		display: none;
	}

	div.list_header_guide[b-leqagmsrbr] {
		grid-area: header_guide;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_date[b-leqagmsrbr] {
		grid-area: header_date;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_list1_layout[b-leqagmsrbr] {
		grid-area: list1;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-leqagmsrbr] {
		grid-area: list2;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: min(600px, 90vw);
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px teal;
	}

	div.list_item_list_no[b-leqagmsrbr] {
		grid-area: list_no;
		text-align: center;
		font-size: 12px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-leqagmsrbr] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-leqagmsrbr] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-leqagmsrbr] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_date[b-leqagmsrbr] {
		grid-area: list_date;
		text-align: center;
		font-size: 12px;
		line-height: 30px;
	}

	div.list_item_list_time[b-leqagmsrbr] {
		grid-area: list_time;
		text-align: center;
		font-size: 12px;
		line-height: 30px;
	}

	div.list_btn_disable[b-leqagmsrbr],
	button.list_btn_disable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-leqagmsrbr],
		button.list_btn_commit:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.list_btn_enable:focus[b-leqagmsrbr],
		button.list_btn_enable:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-leqagmsrbr],
		button.list_btn_wait:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-leqagmsrbr] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-leqagmsrbr] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-leqagmsrbr] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-leqagmsrbr] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-leqagmsrbr] {
		grid-area: back2;
		text-align: center;
	}

	button.list_back_btn[b-leqagmsrbr] {
		font-size: 15px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-leqagmsrbr],
		button.list_back_btn:focus[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 1024px) {
	/* list */
	div.list_layout[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 10px max-content max-content 10px 40px 10px max-content max-content 10px 40px 10px;
		grid-template-columns: 1fr min(600px, 90vw) 1fr;
		grid-template-areas:
			". . ."
			". header1 ."
			". list1 ."
			". . ."
			". back1 ."
			". . ."
			". header2 ."
			". list2 ."
			". . ."
			". back2 ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-leqagmsrbr] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header2_layout[b-leqagmsrbr] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header_title[b-leqagmsrbr] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-leqagmsrbr] {
		grid-area: header_no;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_btn[b-leqagmsrbr] {
		grid-area: header_btn;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-leqagmsrbr] {
		display: none;
	}

	div.list_header_guide[b-leqagmsrbr] {
		grid-area: header_guide;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_date[b-leqagmsrbr] {
		grid-area: header_date;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_list1_layout[b-leqagmsrbr] {
		grid-area: list1;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-leqagmsrbr] {
		grid-area: list2;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: min(600px, 90vw);
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px teal;
	}

	div.list_item_list_no[b-leqagmsrbr] {
		grid-area: list_no;
		text-align: center;
		font-size: 15px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-leqagmsrbr] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-leqagmsrbr] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 11px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-leqagmsrbr] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 11px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_date[b-leqagmsrbr] {
		grid-area: list_date;
		text-align: center;
		font-size: 12px;
		line-height: 16px;
	}

	div.list_item_list_time[b-leqagmsrbr] {
		grid-area: list_time;
		text-align: center;
		font-size: 12px;
		line-height: 30px;
	}

	div.list_btn_disable[b-leqagmsrbr],
	button.list_btn_disable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-leqagmsrbr],
		button.list_btn_commit:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.list_btn_enable:focus[b-leqagmsrbr],
		button.list_btn_enable:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-leqagmsrbr],
		button.list_btn_wait:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-leqagmsrbr] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-leqagmsrbr] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-leqagmsrbr] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-leqagmsrbr] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-leqagmsrbr] {
		grid-area: back2;
		text-align: center;
	}

	button.list_back_btn[b-leqagmsrbr] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-leqagmsrbr],
		button.list_back_btn:focus[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (min-width: 1025px) {
	/* list */
	div.list_layout[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 10px max-content max-content 20px 40px 20px;
		grid-template-columns: 1fr 580px 50px 580px 1fr;
		grid-template-areas:
			". . . . ."
			". header1 . header2 ."
			". list1 . list2 ."
			". . . . ."
			". back1 back1 back1 ."
			". . . . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-leqagmsrbr] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 50px 80px 1fr 100px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 580px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header2_layout[b-leqagmsrbr] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 50px 80px 1fr 100px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 580px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: teal;
		color: white;
	}

	div.list_header_title[b-leqagmsrbr] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-leqagmsrbr] {
		grid-area: header_no;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_btn[b-leqagmsrbr] {
		grid-area: header_btn;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-leqagmsrbr] {
		display: none;
	}

	div.list_header_guide[b-leqagmsrbr] {
		grid-area: header_guide;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_date[b-leqagmsrbr] {
		grid-area: header_date;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_list1_layout[b-leqagmsrbr] {
		grid-area: list1;
		width: 580px;
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-leqagmsrbr] {
		grid-area: list2;
		width: 580px;
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-leqagmsrbr] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 50px 80px 1fr 100px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: 580px;
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px teal;
	}

	div.list_item_list_no[b-leqagmsrbr] {
		grid-area: list_no;
		text-align: center;
		font-size: 18px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-leqagmsrbr] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-leqagmsrbr] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 15px;
		line-height: 15px;
		padding-left: 15px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-leqagmsrbr] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 15px;
		line-height: 15px;
		padding-left: 15px;
		overflow: hidden;
	}

	div.list_item_list_date[b-leqagmsrbr] {
		grid-area: list_date;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_item_list_time[b-leqagmsrbr] {
		grid-area: list_time;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_btn_disable[b-leqagmsrbr],
	button.list_btn_disable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-leqagmsrbr],
		button.list_btn_commit:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.list_btn_enable:focus[b-leqagmsrbr],
		button.list_btn_enable:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-leqagmsrbr],
		button.list_btn_wait:hover[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-leqagmsrbr] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-leqagmsrbr] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-leqagmsrbr] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-leqagmsrbr] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-leqagmsrbr] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-leqagmsrbr] {
		display: none;
	}

	button.list_back_btn[b-leqagmsrbr] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-leqagmsrbr],
		button.list_back_btn:focus[b-leqagmsrbr] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}
/* /Pages/List_Test.razor.rz.scp.css */
/* */
@media screen and (max-height: 600px) {
	/* list */
	div.list_layout[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 10px max-content max-content 10px 40px 10px max-content max-content 10px 40px 10px;
		grid-template-columns: 1fr 400px 1fr;
		grid-template-areas:
			". . ."
			". header1 ."
			". list1 ."
			". . ."
			". back1 ."
			". . ."
			". header2 ."
			". list2 ."
			". . ."
			". back2 ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-zrexycfvwv] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 400px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header2_layout[b-zrexycfvwv] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 400px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header_title[b-zrexycfvwv] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-zrexycfvwv] {
		grid-area: header_no;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_btn[b-zrexycfvwv] {
		grid-area: header_btn;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-zrexycfvwv] {
		display: none;
	}

	div.list_header_guide[b-zrexycfvwv] {
		grid-area: header_guide;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_date[b-zrexycfvwv] {
		grid-area: header_date;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_list1_layout[b-zrexycfvwv] {
		grid-area: list1;
		width: 400px;
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-zrexycfvwv] {
		grid-area: list2;
		width: 400px;
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: 400px;
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px brown;
	}

	div.list_item_list_no[b-zrexycfvwv] {
		grid-area: list_no;
		text-align: center;
		font-size: 12px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-zrexycfvwv] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-zrexycfvwv] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-zrexycfvwv] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_date[b-zrexycfvwv] {
		grid-area: list_date;
		text-align: center;
		font-size: 10px;
		line-height: 30px;
	}

	div.list_item_list_time[b-zrexycfvwv] {
		grid-area: list_time;
		text-align: center;
		font-size: 10px;
		line-height: 30px;
	}

	div.list_btn_disable[b-zrexycfvwv],
	button.list_btn_disable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-zrexycfvwv],
		button.list_btn_commit:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: brown;
		outline: none;
	}

		button.list_btn_enable:focus[b-zrexycfvwv],
		button.list_btn_enable:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-zrexycfvwv],
		button.list_btn_wait:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-zrexycfvwv] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-zrexycfvwv] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-zrexycfvwv] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-zrexycfvwv] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-zrexycfvwv] {
		grid-area: back2;
		text-align: center;
	}

	button.list_back_btn[b-zrexycfvwv] {
		font-size: 15px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-zrexycfvwv],
		button.list_back_btn:focus[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 768px) {
	/* list */
	div.list_layout[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 10px max-content max-content 10px 40px 10px max-content max-content 10px 40px 10px;
		grid-template-columns: 1fr min(600px, 90vw) 1fr;
		grid-template-areas:
			". . ."
			". header1 ."
			". list1 ."
			". . ."
			". back1 ."
			". . ."
			". header2 ."
			". list2 ."
			". . ."
			". back2 ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-zrexycfvwv] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header2_layout[b-zrexycfvwv] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header_title[b-zrexycfvwv] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-zrexycfvwv] {
		grid-area: header_no;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_btn[b-zrexycfvwv] {
		grid-area: header_btn;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-zrexycfvwv] {
		display: none;
	}

	div.list_header_guide[b-zrexycfvwv] {
		grid-area: header_guide;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_date[b-zrexycfvwv] {
		grid-area: header_date;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_list1_layout[b-zrexycfvwv] {
		grid-area: list1;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-zrexycfvwv] {
		grid-area: list2;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: min(600px, 90vw);
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px brown;
	}

	div.list_item_list_no[b-zrexycfvwv] {
		grid-area: list_no;
		text-align: center;
		font-size: 12px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-zrexycfvwv] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-zrexycfvwv] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-zrexycfvwv] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 10px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_date[b-zrexycfvwv] {
		grid-area: list_date;
		text-align: center;
		font-size: 12px;
		line-height: 30px;
	}

	div.list_item_list_time[b-zrexycfvwv] {
		grid-area: list_time;
		text-align: center;
		font-size: 12px;
		line-height: 30px;
	}

	div.list_btn_disable[b-zrexycfvwv],
	button.list_btn_disable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-zrexycfvwv],
		button.list_btn_commit:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: brown;
		outline: none;
	}

		button.list_btn_enable:focus[b-zrexycfvwv],
		button.list_btn_enable:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-zrexycfvwv],
		button.list_btn_wait:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-zrexycfvwv] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-zrexycfvwv] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-zrexycfvwv] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-zrexycfvwv] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-zrexycfvwv] {
		grid-area: back2;
		text-align: center;
	}

	button.list_back_btn[b-zrexycfvwv] {
		font-size: 15px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-zrexycfvwv],
		button.list_back_btn:focus[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 1024px) {
	/* list */
	div.list_layout[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 10px max-content max-content 10px 40px 10px max-content max-content 10px 40px 10px;
		grid-template-columns: 1fr min(600px, 90vw) 1fr;
		grid-template-areas:
			". . ."
			". header1 ."
			". list1 ."
			". . ."
			". back1 ."
			". . ."
			". header2 ."
			". list2 ."
			". . ."
			". back2 ."
			". . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-zrexycfvwv] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header2_layout[b-zrexycfvwv] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: min(600px, 90vw);
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header_title[b-zrexycfvwv] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-zrexycfvwv] {
		grid-area: header_no;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_btn[b-zrexycfvwv] {
		grid-area: header_btn;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-zrexycfvwv] {
		display: none;
	}

	div.list_header_guide[b-zrexycfvwv] {
		grid-area: header_guide;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_header_date[b-zrexycfvwv] {
		grid-area: header_date;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_list1_layout[b-zrexycfvwv] {
		grid-area: list1;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-zrexycfvwv] {
		grid-area: list2;
		width: min(600px, 90vw);
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 35px 80px 1fr 80px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: min(600px, 90vw);
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px brown;
	}

	div.list_item_list_no[b-zrexycfvwv] {
		grid-area: list_no;
		text-align: center;
		font-size: 15px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-zrexycfvwv] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-zrexycfvwv] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 11px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-zrexycfvwv] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 11px;
		line-height: 15px;
		padding-left: 5px;
		overflow: hidden;
	}

	div.list_item_list_date[b-zrexycfvwv] {
		grid-area: list_date;
		text-align: center;
		font-size: 12px;
		line-height: 16px;
	}

	div.list_item_list_time[b-zrexycfvwv] {
		grid-area: list_time;
		text-align: center;
		font-size: 12px;
		line-height: 30px;
	}

	div.list_btn_disable[b-zrexycfvwv],
	button.list_btn_disable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-zrexycfvwv],
		button.list_btn_commit:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: brown;
		outline: none;
	}

		button.list_btn_enable:focus[b-zrexycfvwv],
		button.list_btn_enable:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-zrexycfvwv],
		button.list_btn_wait:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-zrexycfvwv] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-zrexycfvwv] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-zrexycfvwv] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-zrexycfvwv] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-zrexycfvwv] {
		grid-area: back2;
		text-align: center;
	}

	button.list_back_btn[b-zrexycfvwv] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-zrexycfvwv],
		button.list_back_btn:focus[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (min-width: 1025px) {
	/* list */
	div.list_layout[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 10px max-content max-content 20px 40px 20px;
		grid-template-columns: 1fr 580px 50px 580px 1fr;
		grid-template-areas:
			". . . . ."
			". header1 . header2 ."
			". list1 . list2 ."
			". . . . ."
			". back1 back1 back1 ."
			". . . . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.list_header1_layout[b-zrexycfvwv] {
		grid-area: header1;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 50px 80px 1fr 100px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 580px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header2_layout[b-zrexycfvwv] {
		grid-area: header2;
		display: grid;
		grid-template-rows: 40px 30px;
		grid-template-columns: 50px 80px 1fr 100px;
		grid-template-areas:
			"header_title header_title header_title header_title"
			"header_no header_btn header_guide header_date";
		width: 580px;
		height: 70px;
		margin: 5px auto 0px auto;
		padding: 0px;
		background-color: brown;
		color: white;
	}

	div.list_header_title[b-zrexycfvwv] {
		grid-area: header_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		padding-left: 15px;
		border-bottom: solid 1px white;
	}

	div.list_header_no[b-zrexycfvwv] {
		grid-area: header_no;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_btn[b-zrexycfvwv] {
		grid-area: header_btn;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_guide_date[b-zrexycfvwv] {
		display: none;
	}

	div.list_header_guide[b-zrexycfvwv] {
		grid-area: header_guide;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_header_date[b-zrexycfvwv] {
		grid-area: header_date;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
	}

	div.list_list1_layout[b-zrexycfvwv] {
		grid-area: list1;
		width: 580px;
		margin: 0px;
		padding: 0px;
	}

	div.list_list2_layout[b-zrexycfvwv] {
		grid-area: list2;
		width: 580px;
		margin: 0px;
		padding: 0px;
	}

	div.list_item[b-zrexycfvwv] {
		display: grid;
		grid-template-rows: 30px 30px;
		grid-template-columns: 50px 80px 1fr 100px;
		grid-template-areas:
			"list_no list_btn list_guide1 list_date"
			"list_no list_btn list_guide2 list_time";
		width: 580px;
		height: 60px;
		margin: 0px auto;
		padding: 0px;
		background-color: #F0F0F0;
		color: black;
		border-bottom: solid 1px brown;
	}

	div.list_item_list_no[b-zrexycfvwv] {
		grid-area: list_no;
		text-align: center;
		font-size: 18px;
		line-height: 60px;
	}

	div.list_item_list_btn[b-zrexycfvwv] {
		grid-area: list_btn;
		text-align: center;
		line-height: 60px;
	}

	div.list_item_list_guide1[b-zrexycfvwv] {
		grid-area: list_guide1;
		text-align: left;
		font-size: 15px;
		line-height: 15px;
		padding-left: 15px;
		overflow: hidden;
	}

	div.list_item_list_guide2[b-zrexycfvwv] {
		grid-area: list_guide2;
		text-align: left;
		font-size: 15px;
		line-height: 15px;
		padding-left: 15px;
		overflow: hidden;
	}

	div.list_item_list_date[b-zrexycfvwv] {
		grid-area: list_date;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_item_list_time[b-zrexycfvwv] {
		grid-area: list_time;
		text-align: center;
		font-size: 15px;
		line-height: 30px;
	}

	div.list_btn_disable[b-zrexycfvwv],
	button.list_btn_disable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
		padding: 1px 6px;
	}

	button.list_btn_commit[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: orangered;
		outline: none;
	}

		button.list_btn_commit:focus[b-zrexycfvwv],
		button.list_btn_commit:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_enable[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: brown;
		outline: none;
	}

		button.list_btn_enable:focus[b-zrexycfvwv],
		button.list_btn_enable:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_wait[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: saddlebrown;
		outline: none;
	}

		button.list_btn_wait:focus[b-zrexycfvwv],
		button.list_btn_wait:hover[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.list_btn_impossible[b-zrexycfvwv] {
		width: 78px;
		height: 50px;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 5px;
		margin: 5px 0px;
		font-size: 12px;
		position: relative;
		background-color: gray;
		outline: none;
	}


	div.list_btn_icon[b-zrexycfvwv] {
		display: inline-block;
	}

	img.list_btn_icon_img[b-zrexycfvwv] {
		display: block;
		margin: 0px auto;
		width: calc(100% / 2);
		height: calc(100% / 2);
	}

	div.list_btn_icon_title[b-zrexycfvwv] {
		padding: 0px;
		margin: 0px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}

	div.list_back1[b-zrexycfvwv] {
		grid-area: back1;
		text-align: center;
	}

	div.list_back2[b-zrexycfvwv] {
		display: none;
	}

	button.list_back_btn[b-zrexycfvwv] {
		font-size: 18px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: brown;
		color: white;
		outline: none;
		width: 200px;
		height: 40px;
		margin: auto;
	}

		button.list_back_btn:hover[b-zrexycfvwv],
		button.list_back_btn:focus[b-zrexycfvwv] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}
/* /Pages/Login.razor.rz.scp.css */
div.login_login_btn[b-4hp06163je] {
	grid-area: login_btn;
	text-align: center;
	border: none;
}

div.login_err[b-4hp06163je] {
	grid-area: err;
	text-align: center;
	font-size: 15px;
	line-height: 20px;
	color: red;
}
/* */
@media screen and (max-height: 600px) {
	/* Login */
	div.login_layout[b-4hp06163je] {
		display: grid;
		grid-template-rows: max-content 20px 10px max-content 10px 200px 10px max-content;
		grid-template-columns: 100vw;
		grid-template-areas:
			"logo"
			"title"
			"."
			"agree"
			"."
			"login"
			"."
			"err";
		width: 100vw;
		height: 100vh;
		margin: 0px;
		padding: 0px;
	}

	img.login_logo[b-4hp06163je] {
		grid-area: logo;
		width: 80vw;
		margin: 10px 0px;
	}

	div.login_title[b-4hp06163je] {
		grid-area: title;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: teal;
	}

	div.login_title[b-4hp06163je] {
		grid-area: title;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: teal;
	}

	div.login_agree_layout[b-4hp06163je] {
		grid-area: agree;
		display: grid;
		grid-template-rows: 20px 1fr 20px;
		grid-template-columns: 1fr 20px 200px 1fr;
		grid-template-areas:
			"agree_title agree_title agree_title agree_title"
			"agree_sentence agree_sentence agree_sentence agree_sentence"
			". agree_check agree_check_label .";
		width: 100%;
		height: max(300px, 40vh);
		margin: 0px;
		padding: 0px;
	}

	div.login_agree_title[b-4hp06163je] {
		grid-area: agree_title;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 15px;
	}

	div.login_agree_sentence[b-4hp06163je] {
		grid-area: agree_sentence;
		text-align: left;
		font-size: 10px;
		line-height: 12px;
		color: black;
		padding: 5px;
		overflow: scroll;
		border: solid 1px gray;
		white-space: nowrap;
	}

	div.login_agree_check[b-4hp06163je] {
		grid-area: agree_check;
		text-align: center;
		font-size: 12px;
		line-height: 20px;
		color: black;
		padding-top: 2px;
	}

	div.login_agree_check_label[b-4hp06163je] {
		grid-area: agree_check_label;
		text-align: left;
		font-size: 12px;
		line-height: 20px;
		color: teal;
	}

	div.login_login_layout[b-4hp06163je] {
		grid-area: login;
		display: grid;
		grid-template-rows: 20px 30px 10px 20px 30px 20px 50px 20px;
		grid-template-columns: 1fr 200px 1fr;
		grid-template-areas:
			". login_id_title ."
			". login_id ."
			". . ."
			". login_pw_title ."
			". login_pw ."
			". . ."
			". login_btn .";
		width: 100%;
		height: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.login_login_id_title[b-4hp06163je] {
		grid-area: login_id_title;
		font-size: 12px;
		text-align: left;
		color: teal;
	}

	input.login_login_id[b-4hp06163je] {
		grid-area: login_id;
		font-size: 12px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_id:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	div.login_login_pw_title[b-4hp06163je] {
		grid-area: login_pw_title;
		font-size: 12px;
		text-align: left;
		color: teal;
	}

	input.login_login_pw[b-4hp06163je] {
		grid-area: login_pw;
		font-size: 12px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_pw:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	button.login_login_btn[b-4hp06163je] {
		grid-area: login_btn;
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
	}

		button.login_login_btn:hover[b-4hp06163je],
		button.login_login_btn:focus[b-4hp06163je] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

}

/* */
@media screen and (max-width: 768px) {
	/* Login */
	div.login_layout[b-4hp06163je] {
		display: grid;
		grid-template-rows: max-content 30px 10px max-content 10px 200px 20px max-content;
		grid-template-columns: 10vw 80vw 10vw;
		grid-template-areas:
			". logo ."
			". title ."
			". . ."
			". agree ."
			". . ."
			". login ."
			". . ."
			". err .";
		width: 100vw;
		height: 100vh;
		margin: 0px;
		padding: 0px;
	}

	img.login_logo[b-4hp06163je] {
		grid-area: logo;
		width: 80vw;
		margin: 10px auto;
	}

	div.login_title[b-4hp06163je] {
		grid-area: title;
		text-align: center;
		font-size: 18px;
		line-height: 30px;
		color: teal;
	}

	div.login_agree_layout[b-4hp06163je] {
		grid-area: agree;
		display: grid;
		grid-template-rows: 30px 1fr 30px;
		grid-template-columns: 1fr 30px 200px 1fr;
		grid-template-areas:
			"agree_title agree_title agree_title agree_title"
			"agree_sentence agree_sentence agree_sentence agree_sentence"
			". agree_check agree_check_label .";
		width: 80%;
		height: max(300px, 40vh);
		margin: 0px auto;
		padding: 0px;
	}

	div.login_agree_title[b-4hp06163je] {
		grid-area: agree_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.login_agree_sentence[b-4hp06163je] {
		grid-area: agree_sentence;
		text-align: left;
		font-size: 10px;
		line-height: 12px;
		color: black;
		padding: 5px;
		overflow: scroll;
		border: solid 1px gray;
		white-space: nowrap;
	}

	div.login_agree_check[b-4hp06163je] {
		grid-area: agree_check;
		text-align: center;
		font-size: 12px;
		line-height: 30px;
		color: black;
		padding-top: 7px;
	}

	div.login_agree_check_label[b-4hp06163je] {
		grid-area: agree_check_label;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: teal;
	}

	div.login_login_layout[b-4hp06163je] {
		grid-area: login;
		display: grid;
		grid-template-rows: 20px 30px 10px 20px 30px 20px 50px 20px;
		grid-template-columns: 1fr 200px 1fr;
		grid-template-areas:
			". login_id_title ."
			". login_id ."
			". . ."
			". login_pw_title ."
			". login_pw ."
			". . ."
			". login_btn .";
		width: 100%;
		height: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.login_login_id_title[b-4hp06163je] {
		grid-area: login_id_title;
		font-size: 15px;
		text-align: left;
		color: teal;
	}

	input.login_login_id[b-4hp06163je] {
		grid-area: login_id;
		font-size: 15px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_id:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	div.login_login_pw_title[b-4hp06163je] {
		grid-area: login_pw_title;
		font-size: 15px;
		text-align: left;
		color: teal;
	}

	input.login_login_pw[b-4hp06163je] {
		grid-area: login_pw;
		font-size: 15px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_pw:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	button.login_login_btn[b-4hp06163je] {
		grid-area: login_btn;
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
	}

		button.login_login_btn:hover[b-4hp06163je],
		button.login_login_btn:focus[b-4hp06163je] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (max-width: 1024px) {
	/* Login */
	div.login_layout[b-4hp06163je] {
		display: grid;
		grid-template-rows: max-content 40px 10px max-content 10px 200px 20px max-content;
		grid-template-columns: 1fr min(600px, 90vw) 1fr;
		grid-template-areas:
			". logo ."
			". title ."
			". . ."
			". agree ."
			". . ."
			". login ."
			". . ."
			". err .";
		width: 100vw;
		height: 100vh;
		margin: 0px;
		padding: 0px;
	}

	img.login_logo[b-4hp06163je] {
		grid-area: logo;
		width: min(600px, 90vw);
		margin: 10px auto;
	}

	div.login_title[b-4hp06163je] {
		grid-area: title;
		text-align: center;
		font-size: 24px;
		line-height: 40px;
		color: teal;
	}

	div.login_agree_layout[b-4hp06163je] {
		grid-area: agree;
		display: grid;
		grid-template-rows: 40px 1fr 40px;
		grid-template-columns: 1fr 40px 200px 1fr;
		grid-template-areas:
			"agree_title agree_title agree_title agree_title"
			"agree_sentence agree_sentence agree_sentence agree_sentence"
			". agree_check agree_check_label .";
		width: 80%;
		height: max(300px, 40vh);
		margin: 0px auto;
		padding: 0px;
	}

	div.login_agree_title[b-4hp06163je] {
		grid-area: agree_title;
		text-align: left;
		font-size: 18px;
		line-height: 40px;
		color: black;
	}

	div.login_agree_sentence[b-4hp06163je] {
		grid-area: agree_sentence;
		text-align: left;
		font-size: 12px;
		line-height: 14px;
		color: black;
		padding: 5px;
		overflow: scroll;
		border: solid 1px gray;
		white-space: nowrap;
	}

	div.login_agree_check[b-4hp06163je] {
		grid-area: agree_check;
		text-align: center;
		font-size: 12px;
		line-height: 40px;
		color: black;
		padding-top: 12px;
	}

	div.login_agree_check_label[b-4hp06163je] {
		grid-area: agree_check_label;
		text-align: left;
		font-size: 15px;
		line-height: 40px;
		color: teal;
	}

	div.login_login_layout[b-4hp06163je] {
		grid-area: login;
		display: grid;
		grid-template-rows: 20px 30px 10px 20px 30px 20px 50px 20px;
		grid-template-columns: 1fr 200px 1fr;
		grid-template-areas:
			". login_id_title ."
			". login_id ."
			". . ."
			". login_pw_title ."
			". login_pw ."
			". . ."
			". login_btn .";
		width: 100%;
		height: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.login_login_id_title[b-4hp06163je] {
		grid-area: login_id_title;
		font-size: 15px;
		text-align: left;
		color: teal;
	}

	input.login_login_id[b-4hp06163je] {
		grid-area: login_id;
		font-size: 15px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_id:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	div.login_login_pw_title[b-4hp06163je] {
		grid-area: login_pw_title;
		font-size: 15px;
		text-align: left;
		color: teal;
	}

	input.login_login_pw[b-4hp06163je] {
		grid-area: login_pw;
		font-size: 15px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_pw:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	button.login_login_btn[b-4hp06163je] {
		grid-area: login_btn;
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
	}

		button.login_login_btn:hover[b-4hp06163je],
		button.login_login_btn:focus[b-4hp06163je] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}

/* */
@media screen and (min-width: 1025px) {
	/* Login */
	div.login_layout[b-4hp06163je] {
		display: grid;
		grid-template-rows: max-content 40px 10px max-content 10px 200px 20px max-content;
		grid-template-columns: 1fr 600px 1fr;
		grid-template-areas:
			". logo ."
			". title ."
			". . ."
			". agree ."
			". . ."
			". login ."
			". . ."
			". err .";
		width: 100vw;
		height: 100vh;
		margin: 0px;
		padding: 0px;
	}

	img.login_logo[b-4hp06163je] {
		grid-area: logo;
		width: min(600px, 80vw);
		margin: 10px auto;
	}

	div.login_title[b-4hp06163je] {
		grid-area: title;
		text-align: center;
		font-size: 30px;
		line-height: 40px;
		color: teal;
	}

	div.login_agree_layout[b-4hp06163je] {
		grid-area: agree;
		display: grid;
		grid-template-rows: 40px 1fr 40px;
		grid-template-columns: 1fr 40px 200px 1fr;
		grid-template-areas:
			"agree_title agree_title agree_title agree_title"
			"agree_sentence agree_sentence agree_sentence agree_sentence"
			". agree_check agree_check_label .";
		width: 80%;
		height: max(300px, 40vh);
		margin: 0px auto;
		padding: 0px;
	}

	div.login_agree_title[b-4hp06163je] {
		grid-area: agree_title;
		text-align: left;
		font-size: 24px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	div.login_agree_sentence[b-4hp06163je] {
		grid-area: agree_sentence;
		text-align: left;
		font-size: 12px;
		line-height: 14px;
		color: black;
		padding: 5px;
		overflow: scroll;
		border: solid 1px gray;
		white-space: nowrap;
	}

	div.login_agree_check[b-4hp06163je] {
		grid-area: agree_check;
		text-align: center;
		font-size: 12px;
		line-height: 40px;
		color: black;
		padding-top: 12px;
	}

	div.login_agree_check_label[b-4hp06163je] {
		grid-area: agree_check_label;
		text-align: left;
		font-size: 15px;
		line-height: 40px;
		color: teal;
	}

	div.login_login_layout[b-4hp06163je] {
		grid-area: login;
		display: grid;
		grid-template-rows: 20px 30px 10px 20px 30px 20px 50px 20px;
		grid-template-columns: 1fr 200px 1fr;
		grid-template-areas:
			". login_id_title ."
			". login_id ."
			". . ."
			". login_pw_title ."
			". login_pw ."
			". . ."
			". login_btn .";
		width: 100%;
		height: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.login_login_id_title[b-4hp06163je] {
		grid-area: login_id_title;
		font-size: 15px;
		text-align: left;
		color: teal;
	}

	input.login_login_id[b-4hp06163je] {
		grid-area: login_id;
		font-size: 24px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_id:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	div.login_login_pw_title[b-4hp06163je] {
		grid-area: login_pw_title;
		font-size: 15px;
		text-align: left;
		color: teal;
	}

	input.login_login_pw[b-4hp06163je] {
		grid-area: login_pw;
		font-size: 24px;
		text-align: left;
		border: none;
		border-bottom: solid 2px teal;
		background-color: #F0F0F0;
		outline: none;
	}

		input.login_login_pw:focus[b-4hp06163je] {
			border: solid 1px teal;
			border-bottom: solid 2px orangered;
		}

	button.login_login_btn[b-4hp06163je] {
		grid-area: login_btn;
		font-size: 24px;
		text-align: center;
		border: none;
		border-radius: 5px;
		background-color: teal;
		color: white;
		outline: none;
	}

		button.login_login_btn:hover[b-4hp06163je],
		button.login_login_btn:focus[b-4hp06163je] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}
}
/* /Pages/Menu.razor.rz.scp.css */
/* */
@media screen and (max-height: 600px) {
	/* menu */
	div.menu_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: 10px max-content max-content max-content 20px min(200px, 40vw) 20px min(200px, 40vw) 20px;
		grid-template-columns: 1fr min(200px, 40vw) 20px min(200px, 40vw) 1fr;
		grid-template-areas:
			". . . . ."
			". guide guide guide ."
			". caution caution caution ."
			". answer answer answer ."
			". . . . ."
			". btnlesson . btntraining ."
			". . . . ."
			". btnhelp . btntest ."
			". . . . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.menu_guide_layout[b-ses5m3eg2d] {
		grid-area: guide;
		display: grid;
		grid-template-rows: 20px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"guide_title"
			"guide_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_guide_title[b-ses5m3eg2d] {
		grid-area: guide_title;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 15px;
	}

	div.menu_guide_list[b-ses5m3eg2d] {
		grid-area: guide_list;
		border: solid 1px gray;
		background-color: #F0F0F0;
	}

	div.menu_caution_layout[b-ses5m3eg2d] {
		grid-area: caution;
		display: grid;
		grid-template-rows: 20px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"caution_title"
			"caution_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_caution_title[b-ses5m3eg2d] {
		grid-area: caution_title;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 15px;
	}

	div.menu_caution_list[b-ses5m3eg2d] {
		grid-area: caution_list;
		border: solid 1px gray;
		background-color: #FFE0E0;
	}

	div.menu_answer_layout[b-ses5m3eg2d] {
		grid-area: answer;
		display: grid;
		grid-template-rows: 20px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"answer_title"
			"answer_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_answer_title[b-ses5m3eg2d] {
		grid-area: answer_title;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 15px;
	}

	div.menu_answer_list[b-ses5m3eg2d] {
		grid-area: answer_list;
		border: solid 1px gray;
		background-color: #E0FFE0;
	}

	div.menu_list_item_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: max-content max-content;
		grid-template-columns: 100px 1fr 50px;
		grid-template-areas:
			"list_item_date list_item_title list_item_btn"
			"list_item_msg list_item_msg list_item_msg";
		width: 100%;
		height: max-content;
		margin: 0px;
		padding: 5px 0px;
		border-bottom: solid 1px teal;
	}

	div.menu_list_item_date[b-ses5m3eg2d] {
		grid-area: list_item_date;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.menu_list_item_title[b-ses5m3eg2d] {
		grid-area: list_item_title;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 0px;
	}

	div.menu_list_item_msg[b-ses5m3eg2d] {
		grid-area: list_item_msg;
		text-align: left;
		font-size: 12px;
		line-height: 20px;
		color: black;
		padding-left: 30px;
		padding-right: 30px;
	}

	button.menu_list_item_btn[b-ses5m3eg2d] {
		grid-area: list_item_btn;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		background-color: teal;
		outline: none;
		color: white;
	}

		button.menu_list_item_btn:focus[b-ses5m3eg2d],
		button.menu_list_item_btn:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnlesson[b-ses5m3eg2d] {
		grid-area: btnlesson;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnlesson:focus[b-ses5m3eg2d],
		button.menu_btnlesson:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntraining[b-ses5m3eg2d] {
		grid-area: btntraining;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntraining:focus[b-ses5m3eg2d],
		button.menu_btntraining:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnhelp[b-ses5m3eg2d] {
		grid-area: btnhelp;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnhelp:focus[b-ses5m3eg2d],
		button.menu_btnhelp:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntest[b-ses5m3eg2d] {
		grid-area: btntest;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntest:focus[b-ses5m3eg2d],
		button.menu_btntest:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.menu_btn_icon[b-ses5m3eg2d] {
		display: inline-block;
	}

	img.menu_btn_icon_img[b-ses5m3eg2d] {
		display: block;
		margin: auto auto 8px auto;
		width: calc(100% / 2 - 8px);
		height: calc(100% / 2 - 8px);
	}

	div.menu_btn_icon_title[b-ses5m3eg2d] {
		line-height: 20px;
		padding: 0px;
		margin: 0px;
		height: 40px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}
}

/* */
@media screen and (max-width: 768px) {
	div.menu_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: 10px max-content max-content max-content 20px min(300px, 40vw) 20px min(300px, 40vw) 20px;
		grid-template-columns: 1fr min(300px, 40vw) 20px min(300px, 40vw) 1fr;
		grid-template-areas:
			". . . . ."
			". guide guide guide ."
			". caution caution caution ."
			". answer answer answer ."
			". . . . ."
			". btnlesson . btntraining ."
			". . . . ."
			". btnhelp . btntest ."
			". . . . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.menu_guide_layout[b-ses5m3eg2d] {
		grid-area: guide;
		display: grid;
		grid-template-rows: 30px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"guide_title"
			"guide_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_guide_title[b-ses5m3eg2d] {
		grid-area: guide_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.menu_guide_list[b-ses5m3eg2d] {
		grid-area: guide_list;
		border: solid 1px gray;
		background-color: #F0F0F0;
	}

	div.menu_caution_layout[b-ses5m3eg2d] {
		grid-area: caution;
		display: grid;
		grid-template-rows: 30px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"caution_title"
			"caution_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_caution_title[b-ses5m3eg2d] {
		grid-area: caution_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.menu_caution_list[b-ses5m3eg2d] {
		grid-area: caution_list;
		border: solid 1px gray;
		background-color: #FFE0E0;
	}

	div.menu_answer_layout[b-ses5m3eg2d] {
		grid-area: answer;
		display: grid;
		grid-template-rows: 30px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"answer_title"
			"answer_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_answer_title[b-ses5m3eg2d] {
		grid-area: answer_title;
		text-align: left;
		font-size: 15px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.menu_answer_list[b-ses5m3eg2d] {
		grid-area: answer_list;
		border: solid 1px gray;
		background-color: #E0FFE0;
	}

	div.menu_list_item_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: max-content max-content;
		grid-template-columns: 100px 1fr 50px;
		grid-template-areas:
			"list_item_date list_item_title list_item_btn"
			"list_item_msg list_item_msg list_item_msg";
		width: 100%;
		height: max-content;
		margin: 0px;
		padding: 5px 0px;
		border-bottom: solid 1px teal;
	}

	div.menu_list_item_date[b-ses5m3eg2d] {
		grid-area: list_item_date;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.menu_list_item_title[b-ses5m3eg2d] {
		grid-area: list_item_title;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 0px;
	}

	div.menu_list_item_msg[b-ses5m3eg2d] {
		grid-area: list_item_msg;
		text-align: left;
		font-size: 12px;
		line-height: 20px;
		color: black;
		padding-left: 30px;
		padding-right: 30px;
	}

	button.menu_list_item_btn[b-ses5m3eg2d] {
		grid-area: list_item_btn;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 12px;
		background-color: teal;
		outline: none;
		color: white;
	}

		button.menu_list_item_btn:focus[b-ses5m3eg2d],
		button.menu_list_item_btn:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnlesson[b-ses5m3eg2d] {
		grid-area: btnlesson;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnlesson:focus[b-ses5m3eg2d],
		button.menu_btnlesson:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntraining[b-ses5m3eg2d] {
		grid-area: btntraining;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntraining:focus[b-ses5m3eg2d],
		button.menu_btntraining:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnhelp[b-ses5m3eg2d] {
		grid-area: btnhelp;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnhelp:focus[b-ses5m3eg2d],
		button.menu_btnhelp:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntest[b-ses5m3eg2d] {
		grid-area: btntest;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntest:focus[b-ses5m3eg2d],
		button.menu_btntest:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.menu_btn_icon[b-ses5m3eg2d] {
		display: inline-block;
	}

	img.menu_btn_icon_img[b-ses5m3eg2d] {
		display: block;
		margin: auto auto 8px auto;
		width: calc(100% / 2 - 8px);
		height: calc(100% / 2 - 8px);
	}

	div.menu_btn_icon_title[b-ses5m3eg2d] {
		line-height: 20px;
		padding: 0px;
		margin: 0px;
		height: 40px;
		font-size: 12px;
		line-height: 20px;
		color: white;
	}
}

/* */
@media screen and (max-width: 1024px) {
	/* menu */
	div.menu_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: 10px max-content max-content max-content 20px min(300px, 40vw) 20px min(300px, 40vw) 20px;
		grid-template-columns: 1fr min(300px, 40vw) 20px min(300px, 40vw) 1fr;
		grid-template-areas:
			". . . . ."
			". guide guide guide ."
			". caution caution caution ."
			". answer answer answer ."
			". . . . ."
			". btnlesson . btntraining ."
			". . . . ."
			". btnhelp . btntest ."
			". . . . .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.menu_guide_layout[b-ses5m3eg2d] {
		grid-area: guide;
		display: grid;
		grid-template-rows: 30px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"guide_title"
			"guide_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_guide_title[b-ses5m3eg2d] {
		grid-area: guide_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.menu_guide_list[b-ses5m3eg2d] {
		grid-area: guide_list;
		border: solid 1px gray;
		background-color: #F0F0F0;
	}

	div.menu_caution_layout[b-ses5m3eg2d] {
		grid-area: caution;
		display: grid;
		grid-template-rows: 30px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"caution_title"
			"caution_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_caution_title[b-ses5m3eg2d] {
		grid-area: caution_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.menu_caution_list[b-ses5m3eg2d] {
		grid-area: caution_list;
		border: solid 1px gray;
		background-color: #FFE0E0;
	}

	div.menu_answer_layout[b-ses5m3eg2d] {
		grid-area: answer;
		display: grid;
		grid-template-rows: 30px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"answer_title"
			"answer_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_answer_title[b-ses5m3eg2d] {
		grid-area: answer_title;
		text-align: left;
		font-size: 18px;
		line-height: 30px;
		color: black;
		padding-left: 15px;
	}

	div.menu_answer_list[b-ses5m3eg2d] {
		grid-area: answer_list;
		border: solid 1px gray;
		background-color: #E0FFE0;
	}

	div.menu_list_item_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: max-content max-content;
		grid-template-columns: 100px 1fr 50px;
		grid-template-areas:
			"list_item_date list_item_title list_item_btn"
			"list_item_msg list_item_msg list_item_msg";
		width: 100%;
		height: max-content;
		margin: 0px;
		padding: 5px 0px;
		border-bottom: solid 1px teal;
	}

	div.menu_list_item_date[b-ses5m3eg2d] {
		grid-area: list_item_date;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.menu_list_item_title[b-ses5m3eg2d] {
		grid-area: list_item_title;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 0px;
	}

	div.menu_list_item_msg[b-ses5m3eg2d] {
		grid-area: list_item_msg;
		text-align: left;
		font-size: 12px;
		line-height: 20px;
		color: black;
		padding-left: 30px;
		padding-right: 30px;
	}

	button.menu_list_item_btn[b-ses5m3eg2d] {
		grid-area: list_item_btn;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 12px;
		background-color: teal;
		outline: none;
		color: white;
	}

		button.menu_list_item_btn:focus[b-ses5m3eg2d],
		button.menu_list_item_btn:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnlesson[b-ses5m3eg2d] {
		grid-area: btnlesson;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnlesson:focus[b-ses5m3eg2d],
		button.menu_btnlesson:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntraining[b-ses5m3eg2d] {
		grid-area: btntraining;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntraining:focus[b-ses5m3eg2d],
		button.menu_btntraining:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnhelp[b-ses5m3eg2d] {
		grid-area: btnhelp;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnhelp:focus[b-ses5m3eg2d],
		button.menu_btnhelp:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntest[b-ses5m3eg2d] {
		grid-area: btntest;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 10px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntest:focus[b-ses5m3eg2d],
		button.menu_btntest:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.menu_btn_icon[b-ses5m3eg2d] {
		display: inline-block;
	}

	img.menu_btn_icon_img[b-ses5m3eg2d] {
		display: block;
		margin: auto auto 8px auto;
		width: calc(100% / 2 - 8px);
		height: calc(100% / 2 - 8px);
	}

	div.menu_btn_icon_title[b-ses5m3eg2d] {
		line-height: 20px;
		padding: 0px;
		margin: 0px;
		height: 60px;
		font-size: 18px;
		line-height: 30px;
		color: white;
	}
}

/* */
@media screen and (min-width: 1025px) {
	/* menu */
	div.menu_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: 10px max-content max-content max-content 20px min(200px, 20vw);
		grid-template-columns: 1fr min(200px, 20vw) 20px min(200px, 20vw) 20px min(200px, 20vw) 20px min(200px, 20vw) 1fr;
		grid-template-areas:
			". . . . . . . . ."
			". guide guide guide guide guide guide guide ."
			". caution caution caution caution caution caution caution ."
			". answer answer answer answer answer answer answer ."
			". . . . . . . . ."
			". btnlesson . btntraining . btnhelp . btntest .";
		width: 100%;
		margin: 0px;
		padding: 0px;
	}

	div.menu_guide_layout[b-ses5m3eg2d] {
		grid-area: guide;
		display: grid;
		grid-template-rows: 40px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"guide_title"
			"guide_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_guide_title[b-ses5m3eg2d] {
		grid-area: guide_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	div.menu_guide_list[b-ses5m3eg2d] {
		grid-area: guide_list;
		border: solid 1px gray;
		background-color: #F0F0F0;
	}

	div.menu_caution_layout[b-ses5m3eg2d] {
		grid-area: caution;
		display: grid;
		grid-template-rows: 40px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"caution_title"
			"caution_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_caution_title[b-ses5m3eg2d] {
		grid-area: caution_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	div.menu_caution_list[b-ses5m3eg2d] {
		grid-area: caution_list;
		border: solid 1px gray;
		background-color: #FFE0E0;
	}

	div.menu_answer_layout[b-ses5m3eg2d] {
		grid-area: answer;
		display: grid;
		grid-template-rows: 40px 1fr;
		grid-template-columns: 100%;
		grid-template-areas:
			"answer_title"
			"answer_list";
		width: 100%;
		margin: 5px 0px;
		padding: 0px;
	}

	div.menu_answer_title[b-ses5m3eg2d] {
		grid-area: answer_title;
		text-align: left;
		font-size: 30px;
		line-height: 40px;
		color: black;
		padding-left: 15px;
	}

	div.menu_answer_list[b-ses5m3eg2d] {
		grid-area: answer_list;
		border: solid 1px gray;
		background-color: #E0FFE0;
	}

	div.menu_list_item_layout[b-ses5m3eg2d] {
		display: grid;
		grid-template-rows: max-content max-content;
		grid-template-columns: 120px 1fr 60px;
		grid-template-areas:
			"list_item_date list_item_title list_item_btn"
			"list_item_msg list_item_msg list_item_msg";
		width: 100%;
		height: max-content;
		margin: 0px;
		padding: 5px 0px;
		border-bottom: solid 1px teal;
	}

	div.menu_list_item_date[b-ses5m3eg2d] {
		grid-area: list_item_date;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: black;
	}

	div.menu_list_item_title[b-ses5m3eg2d] {
		grid-area: list_item_title;
		text-align: left;
		font-size: 18px;
		line-height: 20px;
		color: black;
		padding-left: 0px;
	}

	div.menu_list_item_msg[b-ses5m3eg2d] {
		grid-area: list_item_msg;
		text-align: left;
		font-size: 15px;
		line-height: 20px;
		color: black;
		padding-left: 30px;
		padding-right: 30px;
	}

	button.menu_list_item_btn[b-ses5m3eg2d] {
		grid-area: list_item_btn;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 12px;
		background-color: teal;
		outline: none;
		color: white;
	}

		button.menu_list_item_btn:focus[b-ses5m3eg2d],
		button.menu_list_item_btn:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnlesson[b-ses5m3eg2d] {
		grid-area: btnlesson;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnlesson:focus[b-ses5m3eg2d],
		button.menu_btnlesson:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntraining[b-ses5m3eg2d] {
		grid-area: btntraining;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntraining:focus[b-ses5m3eg2d],
		button.menu_btntraining:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btnhelp[b-ses5m3eg2d] {
		grid-area: btnhelp;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btnhelp:focus[b-ses5m3eg2d],
		button.menu_btnhelp:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	button.menu_btntest[b-ses5m3eg2d] {
		grid-area: btntest;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: 0px none;
		border-radius: 10px;
		margin: 0px;
		font-size: 12px;
		position: relative;
		background-color: teal;
		outline: none;
	}

		button.menu_btntest:focus[b-ses5m3eg2d],
		button.menu_btntest:hover[b-ses5m3eg2d] {
			box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
		}

	div.menu_btn_icon[b-ses5m3eg2d] {
		display: inline-block;
	}

	img.menu_btn_icon_img[b-ses5m3eg2d] {
		display: block;
		margin: auto auto 8px auto;
		width: calc(100% / 2 - 8px);
		height: calc(100% / 2 - 8px);
	}

	div.menu_btn_icon_title[b-ses5m3eg2d] {
		line-height: 20px;
		padding: 0px;
		margin: 0px;
		height: 60px;
		font-size: 24px;
		line-height: 30px;
		color: white;
	}
}
/* /Pages/SessionEnd.razor.rz.scp.css */
button.sessionend_btn[b-atcjehyutn] {
	font-size: 24px;
	text-align: center;
	border: none;
	border-radius: 5px;
	background-color: teal;
	color: white;
	outline: none;
	width: 300px;
	margin: 0px auto;
}

	button.sessionend_btn:hover[b-atcjehyutn],
	button.sessionend_btn:focus[b-atcjehyutn] {
		box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
	}

/* */
@media screen and (max-height: 600px) {
	/* Login */
	div.sessionend_layout[b-atcjehyutn] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-atcjehyutn] {
		grid-area: title;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: teal;
	}

	div.sessionend_msg[b-atcjehyutn] {
		grid-area: msg;
		text-align: center;
		font-size: 12px;
		line-height: 15px;
		color: black;
	}

	div.sessionend_btn[b-atcjehyutn] {
		grid-area: btn;
		text-align: center;
	}

}

/* */
@media screen and (max-width: 768px) {
	/* Login */
	div.sessionend_layout[b-atcjehyutn] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 80vw max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-atcjehyutn] {
		grid-area: title;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: teal;
	}

	div.sessionend_msg[b-atcjehyutn] {
		grid-area: msg;
		text-align: center;
		font-size: 15px;
		line-height: 18px;
		color: black;
	}

	div.sessionend_btn[b-atcjehyutn] {
		grid-area: btn;
		text-align: center;
	}
}

/* */
@media screen and (max-width: 1024px) {
	div.sessionend_layout[b-atcjehyutn] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-atcjehyutn] {
		grid-area: title;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: teal;
	}

	div.sessionend_msg[b-atcjehyutn] {
		grid-area: msg;
		text-align: center;
		font-size: 15px;
		line-height: 18px;
		color: black;
	}

	div.sessionend_btn[b-atcjehyutn] {
		grid-area: btn;
		text-align: center;
	}
}

/* */
@media screen and (min-width: 1025px) {
	/* Login */
	div.sessionend_layout[b-atcjehyutn] {
		display: grid;
		grid-template-rows: 60px 30px 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr max-content 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-atcjehyutn] {
		grid-area: title;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: teal;
	}

	div.sessionend_msg[b-atcjehyutn] {
		grid-area: msg;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: black;
	}

	div.sessionend_btn[b-atcjehyutn] {
		grid-area: btn;
		text-align: center;
	}
}
/* /Pages/SystemMent.razor.rz.scp.css */
button.sessionend_btn[b-9e3vz7pgm3] {
	font-size: 24px;
	text-align: center;
	border: none;
	border-radius: 5px;
	background-color: teal;
	color: white;
	outline: none;
	width: 300px;
	margin: 0px auto;
}

	button.sessionend_btn:hover[b-9e3vz7pgm3],
	button.sessionend_btn:focus[b-9e3vz7pgm3] {
		box-shadow: 0px 0px 10px 2px rgb(0 0 0 / 60%);
	}

/* */
@media screen and (max-height: 600px) {
	/* Login */
	div.sessionend_layout[b-9e3vz7pgm3] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg2 ."
			". . ."
			". msg ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-9e3vz7pgm3] {
		grid-area: title;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: teal;
	}

	div.sessionend_msg[b-9e3vz7pgm3] {
		grid-area: msg;
		text-align: left;
		font-size: 12px;
		line-height: 15px;
		color: black;
	}

	div.sessionend_msg2[b-9e3vz7pgm3] {
		grid-area: msg2;
		text-align: center;
		font-size: 12px;
		line-height: 18px;
		color: black;
	}

	div.sessionend_btn[b-9e3vz7pgm3] {
		grid-area: btn;
		text-align: center;
	}

}

/* */
@media screen and (max-width: 768px) {
	/* Login */
	div.sessionend_layout[b-9e3vz7pgm3] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". msg2 ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-9e3vz7pgm3] {
		grid-area: title;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: teal;
	}

	div.sessionend_msg[b-9e3vz7pgm3] {
		grid-area: msg;
		text-align: left;
		font-size: 15px;
		line-height: 18px;
		color: black;
	}

	div.sessionend_msg2[b-9e3vz7pgm3] {
		grid-area: msg2;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.sessionend_btn[b-9e3vz7pgm3] {
		grid-area: btn;
		text-align: center;
	}
}

/* */
@media screen and (max-width: 1024px) {
	div.sessionend_layout[b-9e3vz7pgm3] {
		display: grid;
		grid-template-rows: 50px 20px 30px max-content 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr min(80vw, 350px) 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". msg2 ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-9e3vz7pgm3] {
		grid-area: title;
		text-align: center;
		font-size: 18px;
		line-height: 20px;
		color: teal;
	}

	div.sessionend_msg[b-9e3vz7pgm3] {
		grid-area: msg;
		text-align: left;
		font-size: 15px;
		line-height: 18px;
		color: black;
	}

	div.sessionend_msg2[b-9e3vz7pgm3] {
		grid-area: msg2;
		text-align: center;
		font-size: 15px;
		line-height: 20px;
		color: black;
	}

	div.sessionend_btn[b-9e3vz7pgm3] {
		grid-area: btn;
		text-align: center;
	}
}

/* */
@media screen and (min-width: 1025px) {
	/* Login */
	div.sessionend_layout[b-9e3vz7pgm3] {
		display: grid;
		grid-template-rows: 60px 30px 30px max-content 30px max-content 30px max-content 10px;
		grid-template-columns: 1fr max-content 1fr;
		grid-template-areas:
			". . ."
			". title ."
			". . ."
			". msg ."
			". . ."
			". msg2 ."
			". . ."
			". btn ."
			". . .";
		width: 100vw;
		margin: 0px;
		padding: 0px;
	}

	div.sessionend_title[b-9e3vz7pgm3] {
		grid-area: title;
		text-align: center;
		font-size: 24px;
		line-height: 30px;
		color: teal;
	}

	div.sessionend_msg[b-9e3vz7pgm3] {
		grid-area: msg;
		text-align: left;
		font-size: 18px;
		line-height: 20px;
		color: black;
	}

	div.sessionend_msg2[b-9e3vz7pgm3] {
		grid-area: msg2;
		text-align: center;
		font-size: 18px;
		line-height: 24px;
		color: black;
	}

	div.sessionend_btn[b-9e3vz7pgm3] {
		grid-area: btn;
		text-align: center;
	}
}
/* /Shared/LoginLayout.razor.rz.scp.css */
body[b-adc7onws7h] {
	margin: 0px;
}

.page[b-adc7onws7h] {
	position: relative;
	display: flex;
	flex-direction: column;
}

.main[b-adc7onws7h] {
	/*flex: 1;*/
}
/* /Shared/MainLayout.razor.rz.scp.css */
.page[b-3hlydaxord] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.main[b-3hlydaxord] {
    flex: 1;
}

.sidebar[b-3hlydaxord] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-3hlydaxord] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-3hlydaxord]  a, .top-row .btn-link[b-3hlydaxord] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-3hlydaxord] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-3hlydaxord] {
        display: none;
    }

    .top-row.auth[b-3hlydaxord] {
        justify-content: space-between;
    }

    .top-row a[b-3hlydaxord], .top-row .btn-link[b-3hlydaxord] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-3hlydaxord] {
        flex-direction: row;
    }

    .sidebar[b-3hlydaxord] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-3hlydaxord] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .main > div[b-3hlydaxord] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}