@charset "UTF-8";

.ques_fix {
	width: 100%;
	/*padding: 50px 0 20px;*/
	box-sizing: border-box;
	/*border-bottom: 2px solid #282828;*/
	/*position: relative;*/
}
.ques_fix h2 {
	width: calc(100% - 400px);
	font-size: 36px;
	line-height: 36px;
	font-family: 'NanumMyeongjoExtraBold' !important;
	word-break: keep-all;
}
.robot {
	width: 383px;
	height: 80px;
	border-radius: 30px 30px 0 0;
	/*background: #4e4e4e;*/
	position: absolute;
	/*bottom: 0;*/
	right: 0;
}
.robot_i {
	width: 60px;
	height: 70px;
	display: block;
	/*width: 84px;*/
	/*height: 94px;*/
	background: url(../../assets/images/robot.png) no-repeat center;
	background-size: cover;
	position: absolute;
	bottom: -2px;
	left: 65px;
}
.caution01 .robot_i {
	background: url(../../assets/images/caution01.png) no-repeat center;
	background-size: cover;
}
.caution02 .robot_i {
	background: url(../../assets/images/caution02.png) no-repeat center;
	background-size: cover;
}
.caution03 .robot_i {
	background: url(../../assets/images/caution03.png) no-repeat center;
	background-size: cover;
}
.timer_robot {
	width: 241px;
	height: 61px;
	background: url(../../assets/images/timer.png) no-repeat center;
	background-size: cover;
	position: absolute;
	bottom: -4px;
	right: 20px;
	text-align: center;
	padding-top: 20px;
	padding-left: 22px;
	box-sizing: border-box;
}
.timer_robot span {
	display: inline-block;
	font-size: 32px;
	line-height: 32px;
	color: #ffd860;
}
.timer_robot small {
	display: inline-block;
	font-size: 14px;
	line-height: 14px;
	color: #d6e4ff;
	font-weight: 600;
}
.timer_robot em {
	display: inline-block;
	font-size: 18px;
	line-height: 18px;
	color: #d6e4ff;
	padding: 0 3px 0 5px;
}
.guide_txt {
	display: none;
	/*width: 330px;*/
	z-index: 1;
	text-align: center;
	width: 380px;
	height: 84px;
	line-height: 84px;
	background: url(../../assets/images/ai_ms2.png) no-repeat center;
	/*background-size: cover;*/
	background-size: 95% 95%;
	/*padding-left: 35px;*/
	box-sizing: border-box;
	font-size: 20px;
	font-weight: 600;
	position: absolute;
	bottom: -82px;
	right: 0px;
}
/*.ques_fix.ai_ms .guide_txt {*/
/*	display: block;*/
/*}*/

.login .title .mla,
#openExamGuide .title .mla,
#privacy .title .mla {
	width: 148px;
}
.login .input_group {
	display: flex;
}
.login .input_wrap {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 15px;
	border: 1px solid #ddd;
}
.login .input_wrap label {
	font-size: 12px;
	font-weight: 700;
	color: #666;
}
.login .input_wrap input {
	height: 20px;
	font-size: 18px;
	font-weight: 500;
	padding: 0;
	border: none;
}

.content {
	flex: 1;
	position: relative;
	padding: 30px 0;
}
.open_content {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='150' height='100' viewBox='0 0 150 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ctext x='30' y='40' fill='lightgray'%3eTOPIK%3c/text%3e%3c/svg%3e");
}
.content.flex {
	align-items: flex-start;
}
.number {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 280px;
	height: 280px;
	border-radius: 50%;
	background: #e0f0ff;
}
.number p {
	position: absolute;
	top: 10%;
	left: 50%;
	transform: translateX(-50%);
	font-size: 24px;
	font-weight: 700;
	color: #0c70f5;
}
.number h1 {
	line-height: 100px;
	font-size: 100px;
	font-weight: 800;
	color: #102e81;
}

.user_info {
	width: 200px;
}
.login_wrap {
	margin-left: auto;
}
.login_wrap h3.title {
	border-bottom: none;
}
.input_group .input_wrap + .input_wrap {
	border-top: none;
}

.sign_pad {
	width: 210px;
	padding: 15px;
	border: 1px solid #ddd;
	border-left: none;
}
.sign_pad .sign_top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}
.sign_pad .sign_top label {
	font-size: 12px;
	font-weight: 700;
	color: #666;
}
.sign_pad .sign_top button {
	line-height: 26px;
}
.sign_pad .sign_top button img {
	width: 14px;
}
.sign_pad > canvas {
	display: block;
}

#sign_pad {
	background: #fff;
}

.login_wrap .login {
	width: 100%;
	font-size: 20px;
	line-height: 50px;
	margin-top: 20px;
}

.setting {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 0;
	border-top: 1px solid #ebebeb;
}
.setting .ver_info {
	display: flex;
	align-items: center;
	gap: 20px;
}
.setting .ver_info li {
	font-weight: 700;
}

.setting .option {
	display: flex;
	align-items: center;
	gap: 20px;
}
.setting .option .volume {
	width: 20px;
}
.setting .option .playtime {
	display: flex;
	align-items: center;
	gap: 10px;
}
.setting .option .playtime .play {
	width: 16px;
}
.setting .option .playtime span {
	line-height: 16px;
	font-size: 14px;
	font-weight: 800;
	color: #102e81;
	user-select: none;
}

.duplication_login .content figure {
	width: 200px;
	margin: 0 auto;
}
.duplication_login .content h3 {
	font-weight: 700;
	color: #102e81;
	margin-top: 30px;
}
.duplication_login .reason {
	margin-top: 30px;
}
.duplication_login .reason p {
	font-size: 17px;
	font-weight: 700;
	color: #fd5435;
}
.duplication_login .a_box {
	margin-top: 10px;
}

.supervisor .content li + li {
	margin-top: 10px;
}
.supervisor .content li button {
	width: 100%;
	line-height: 50px;
	box-shadow: 5px 5px 10px rgb(0 0 0 / 5%);
}

.info_box {
	font-weight: 700;
	padding: 15px;
	border: 1px solid #ebebeb;
	border-radius: 15px;
	background: #fafafa;
}
.change_info {
	margin-top: 20px;
}
.change_info dt {
	line-height: 20px;
	font-size: 14px;
	margin-bottom: 10px;
}
.change_info dt img {
	width: 20px;
}
.change_info dd {
	line-height: 22px;
	color: #555;
}
.change_info dd:before {
	display: inline-block;
	color: #555;
	content: 'ㆍ';
	padding: 0 5px;
}

form.modal-body .gr1 {
	grid-template-columns: repeat(1, 1fr);
}

form.modal-body .gr3 {
	grid-template-columns: repeat(3, 1fr);
}

form.modal-body .input_group {
	display: grid;
	gap: 15px;
	margin-top: 20px;
	padding: 0 20px;
}
form.modal-body .input_group .input_wrap > *:hover {
	color: #102e81;
}
form.modal-body .input_group .input_wrap input[type='radio'] {
	width: 16px;
	height: 16px;
	margin-top: 2px;
}
form.modal-body .input_group .input_wrap label {
	font-weight: 700;
}
form.modal-body .input_group .input_wrap.text {
	grid-column: 1 / span 3;
}
form.modal-body .input_wrap.text input[type='text'],
form.modal-body .input_wrap.text input[type='password'] {
	width: 100%;
	height: 45px;
	text-align: left;
	padding: 0 15px;
	background: #fbfbfb;
}
form.modal-body .input_wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}
form.modal-body .input_wrap input[type='text'] {
	width: 55px;
	height: 34px;
	font-size: 15px;
	font-weight: 700;
	text-align: center;
	padding: 0 10px;
	background: #fafafa;
}
form.modal-body .input_wrap.min input[type='text'],
form.modal-body .input_wrap.min input[type='password'] {
	padding: 0 25px 0 10px;
}
form.modal-body .input_wrap span {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	font-size: 15px;
	color: #555;
}

form.modal-body .table_wrap table thead tr + tr th {
	border-top: 1px solid #ddd;
}
form.modal-body .table_wrap table tbody tr:hover {
	background: #fafafa;
}
form.modal-body .table_wrap table tbody th {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	background: #fafafa;
}

form.modal-body .table_wrap.bar.flex {
	gap: 30px;
}
form.modal-body .table_wrap.bar table td {
	border: 1px solid #ddd;
}

form.modal-body .select_wrap {
	margin-top: 10px;
}
form.modal-body .select_wrap .nice-select {
	height: 45px;
	line-height: 43px;
	background: #fafafa;
}

.audio_option {
	display: flex;
	align-items: center;
	margin-top: 20px;
}
.audio_option .level {
	display: flex;
	align-items: center;
	gap: 15px;
}
.audio_option label {
	font-size: 16px;
	font-weight: 500;
}
.audio_option .volume_bar {
	display: flex;
	align-items: center;
	gap: 3px;
	padding: 10px 15px;
	border-radius: 20px;
	background: #e0f0ff;
}
.audio_option .volume_bar span {
	width: 15px;
	height: 15px;
	border-radius: 5px;
	background: #fff;
	cursor: pointer;
}
.audio_option .volume_bar span.on {
	background: #102e81;
}
.audio_option .playtime {
	display: flex;
	align-items: center;
	gap: 10px;
}
.audio_option .playtime .play_btn {
	width: 30px;
	padding: 0;
}
.audio_option .playtime h4 {
	font-weight: 800;
}

.audio_option .volume {
	display: flex;
	align-items: center;
	gap: 15px;
}
.range_bar {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 10px 20px;
	border-radius: 20px;
	background: #e0f0ff;
}
.range_bar p {
	font-weight: 700;
}
.range_bar > img {
	width: 20px;
}
.range_bar input[type='range'] {
	width: 100px;
}

.language {
	display: flex;
	align-items: center;
}
.language.input_wrap {
	border: 2px solid #0c70f5;
	border-radius: 10px;
}
.language.input_wrap > input {
	display: none;
}
.language.input_wrap > input + label {
	font-size: 13px;
	font-weight: 700;
	color: #0c70f5;
	padding: 2px 15px;
	border-radius: 6px;
	transition: all 0.2s ease;
}
.language.input_wrap > input:checked + label {
	color: #fff;
	background: #0c70f5;
}

.identification .number {
	width: 180px;
	height: 180px;
}
.identification .number p {
	font-size: 18px;
}
.identification .number h1 {
	font-size: 70px;
}

.examinee_info {
	display: flex;
	align-items: center;
	gap: 50px;
	padding-bottom: 30px;
	margin-bottom: 30px;
	border-bottom: 1px solid #ebebeb;
}
.examinee_info .table_wrap {
	flex: 1;
	margin: 0;
}
.examinee_info .table_wrap tr > td[rowspan] {
	padding: 0;
}
.examinee_info .table_wrap tr > * {
	font-size: 16px;
	border: 1px solid #ddd;
}
.examinee_info .table_wrap tr > th {
	background: #fafafa;
}

.photo_wrap {
	display: flex;
	gap: 50px;
}
.photo_wrap figure {
	width: 180px;
}
.photo_wrap figure > button {
	width: 100%;
	line-height: 45px;
	font-size: 18px;
	border-width: 2px !important;
	margin-top: 10px;
}
.photo_wrap .info_wrap {
	flex: 1;
	flex-direction: column;
	gap: 0;
	padding: 0;
	border: none;
	background: #fff;
}
.photo_wrap .info_wrap .noti {
	width: 100%;
	line-height: 40px;
	padding: 20px;
	border: 1px solid #ddd;
	background: #fbfbfb;
}
.photo_wrap .info_wrap h5 {
	text-align: center;
}
.photo_wrap .info_wrap .input_wrap input {
	width: 20px;
	height: 20px;
	margin-right: 5px;
}
.photo_wrap .info_wrap .input_wrap label {
	line-height: 26px;
	font-size: 20px;
	font-weight: 700;
}

.equipment .info_wrap figure {
	height: 100px;
}

.equip_wrap {
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: 5px 20px;
}
.equip_info {
	flex: 1;
	display: flex;
	align-items: center;
	width: 100%;
	gap: 20px;
	margin-top: 20px;
	padding: 10px 20px;
	border: 1px solid #ddd;
	border-radius: 10px;
	background: #fbfbfb;
}

.sound_wave {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 170px;
}
.sound_wave wave {
	width: 100%;
}
.sound_wave .record {
	position: absolute;
	left: 50%;
	bottom: -20px;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	gap: 10px;
	width: max-content;
	padding: 10px 20px;
	border-radius: 20px;
	background: #fd5435;
}
.sound_wave .record span {
	line-height: 20px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
}
.sound_wave .record span.circle {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
}
.sound_wave .sound_wave_div {
	width: 100%;
	height: 100%;
	padding: 20px;
	border-radius: 20px;
	background: #e0f0ff;
}
.sound_wave .sound_wave_div.disabled {
	filter: contrast(10%) grayscale(100%);
}

.sound_check {
	display: flex;
	align-items: center;
	gap: 15px;
	margin: 50px 0;
}
.sound_check .counting {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	font-size: 16px;
	font-weight: 700;
	color: #e0f0ff;
	border-radius: 50%;
	background: #102e81;
}
.sound_check.disabled {
	filter: contrast(50%) grayscale(100%);
}
.sound_track {
	flex: 1;
}
.sound_track.range_bar input[type='range'] {
	flex: 1;
}
.sound_track .play {
	font-weight: 700;
	color: #102e81;
}

.exam_text {
	height: 170px;
	padding: 30px;
	border: 1px solid #bfdbff;
	border-radius: 20px;
	background: #f6fbff;
}
.exam_text label {
	line-height: 20px;
	font-size: 20px;
	font-weight: 800;
	color: #102e81;
}
.exam_text figure {
	display: flex;
	align-items: center;
}
.exam_text figure p {
	line-height: 70px;
	font-size: 70px;
	font-weight: 700;
}

.write_wrap {
	position: relative;
	padding: 30px;
	margin-top: 20px;
	border: 1px solid #ddd;
	border-radius: 20px;
}
.write_wrap > input {
	width: 100%;
	font-size: 50px;
	font-weight: 700;
	color: #333333;
	padding: 0;
	border: none;
}
.write_wrap > span {
	position: absolute;
	top: 100%;
	right: 0;
	font-size: 20px;
	color: #666;
	padding-top: 20px;
}

.agree_list {
	font-size: 20px;
	padding: 20px 20px 20px 40px;
	border: 1px solid #ddd;
}
.agree_list,
.agree_list li {
	list-style: decimal;
}
.agree_list.desc,
.agree_list.desc li {
	list-style: disc;
}
.agree_list li + li {
	margin-top: 30px;
}
.agree_list h3 {
	font-weight: 800;
	color: #333;
}

.equipment h4 {
	text-align: center;
	font-weight: 800;
}

.table_wrap .agree_table tr > * {
	padding: 10px 20px;
}
.table_wrap .agree_table input {
	width: 20px;
	height: 20px;
	margin-top: 2px;
	cursor: pointer;
}

.terms h4 {
	font-weight: 800;
	color: #102e81;
}
.terms h4 + p {
	line-height: 22px;
	font-weight: 500;
	margin-top: 10px;
	letter-spacing: -0.5px;
}
.terms .info_wrap {
	justify-content: center;
}
.terms .info_wrap p {
	font-size: 16px;
	font-weight: 500;
}
.agree_list {
	padding: 30px 30px 30px 40px;
}
.terms .agree_list li {
	font-size: 18px;
	margin-top: 0;
}
.terms .agree_list li + li {
	margin-top: 5px;
}
.terms .input_wrap {
	text-align: center;
}
.terms .input_wrap input[type='checkbox'] {
	width: 20px;
	height: 20px;
}
.terms .input_wrap label {
	line-height: 28px;
	font-size: 18px;
	font-weight: 800;
}

.listening .number {
	width: 180px;
	height: 180px;
}
.listening .number p {
	font-size: 18px;
}
.listening .number h1 {
	font-size: 70px;
}
.remaining_time {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}
.remaining_time img {
	width: 60px;
}
.remaining_time .timer label {
	font-size: 18px;
}
.remaining_time .timer h1 {
	font-weight: 800;
}

.listening .info_wrap {
	justify-content: center;
}
.listening .info_wrap p {
	font-size: 16px;
	font-weight: 800;
}

h4.exam_title {
	font-weight: 800;
	text-align: left;
	margin-bottom: 20px;
	padding-right: 70px;
}
h4.exam_title span {
	font-weight: 500;
}

.top_info {
	position: absolute;
	top: 5px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	gap: 30px;
}
.top_info:before {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	height: 2px;
	content: '';
	background: #ccc;
}
.top_info li {
	position: relative;
	width: 100px;
	line-height: 20px;
	font-size: 16px;
	font-weight: 700;
	color: #333;
	text-align: center;
	padding: 7px 0 3px;
	border: 2px solid #ccc;
	border-radius: 10px;
	background: #fff;
	z-index: 1;
}
.top_info li:before {
	position: absolute;
	top: -15px;
	left: 50%;
	transform: translateX(-50%);
	line-height: 20px;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
	padding: 0 10px;
	border-radius: 5px;
	background: #ccc;
}
.top_info li.on:before {
	color: #fff;
	background: #0c70f5;
}
.top_info li.ready:before {
	content: '대기';
}
.top_info li.count:before {
	content: "듣기";
}
.top_info li.question:before {
	content: '풀이';
}
.top_info li.ready_spk:before {
	content: '질문';
}
.top_info li.count_spk:before {
	content: '준비';
}
.top_info li.question_spk:before {
	content: '답변';
}
.top_info li.on {
	color: #0c70f5;
	border-color: #0c70f5;
	background: #e0f0ff;
}

.question_number {
	font-size: 16px;
	color: #0c70f5;
	padding: 3px 15px;
	border: 2px solid #0c70f5;
	border-radius: 10px;
	background: #fff;
}
.text_setting {
	position: absolute;
	z-index: 1;
	top: 20px;
	right:-8%;
	display: flex;
	flex-direction: column;
	gap: 15px;
	padding: 15px 10px;
	border: 1px solid #ddd;
	border-radius: 10px;
	box-shadow: 5px 5px 10px rgb(0 0 0 / 10%);
}
.text_setting li {
	display: flex;
	justify-content: center;
	width: 20px;
	height: 20px;
}
.exam_content {
	padding: 0 70px 0 30px;
}
.read .exam_content {
	gap: 30px;
	padding-left: 0;
}
.read .exam_content > * {
	flex: 1;
	margin-top: 30px;
}

.end_contents {
	text-align: right;
	color: #999;
	margin-top: 100px;
}

.memo {
	position: fixed;
	right: 50px;
	bottom: 100px;
	width: 300px;
	height: 200px;
	padding: 30px 15px 15px;
	border-radius: 20px;
	background: #fff5db;
	box-shadow: 5px 5px 10px rgb(0 0 0 / 15%);
}
.memo .close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 20px;
	height: 20px;
	background-image: url('../../assets/images/times-gray.svg');
	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0.8;
}
.memo .close:hover {
	opacity: 1;
}
.memo textarea {
	height: 150px;
	resize: none;
	padding: 0;
	border: none;
}

.submit_answer .examinee_info {
	gap: 30px;
}
.submit_answer .number {
	width: 120px;
	height: 120px;
}
.submit_answer .number p {
	font-size: 15px;
}
.submit_answer .number h1 {
	font-size: 40px;
}

.sign_wrap .sign_pad {
	width: auto;
	padding: 10px;
	border: none;
}
.sign_wrap .sign_pad .sign_top button {
	line-height: 24px;
	font-size: 12px;
}

.question_wrap {
	position: relative;
	margin-bottom: 30px;
}
.question_wrap.plb {
	padding-right: 30px;
	border-right: 1px solid #ddd;
}
.question_wrap p + p {
	margin-top: 20px;
}
.question_wrap p b {
	color: #0c70f5;
	padding: 0 10px;
}
.question_wrap .txt_wrap {
	padding: 20px;
	border: 1px solid #e6e6e6;
	background: #fafafa;
}
.question_wrap .choice {
	position: relative;
	margin-top: 40px;
}
.question_wrap .choice:before {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 0.1px;
	height: 100%;
	content: '';
	background: #0c70f5;
}
.question_wrap .choice li {
	position: relative;
	font-size: 16px;
	padding: 20px 20px 20px 50px;
	border: 1px solid #0c70f5;
	border-radius: 20px;
	background: #fff;
	z-index: 1;
}
.question_wrap .choice li + li {
	margin-top: 20px;
}
.question_wrap .choice li strong {
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	font-size: 20px;
	color: #102e81;
}
.question_wrap .choice_board {
	padding: 20px;
	border: 1px solid #e6e6e6;
	border-radius: 20px;
	background: #fafafa;
}
.question_wrap .choice_board li {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 60px;
	font-weight: 700;
	color: #555;
	border: 1px dashed #bbb;
	border-radius: 20px;
	background: #ebebeb;
}
.question_wrap .choice_board li + li {
	margin-top: 10px;
}
.question_wrap .choice_board li.active {
	justify-content: flex-start;
	padding: 10px 10px 10px 35px;
	border: 1px solid #0c70f5;
	background: #fff;
	cursor: pointer;
}
.question_wrap .choice_board li.active strong {
	position: absolute;
	top: 50%;
	left: 10px;
	transform: translateY(-50%);
	line-height: 20px;
	font-size: 16px;
	color: #102e81;
}
.question_wrap .answer_view {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #102e81;
	padding: 15px 20px;
	border: 1px solid #e6e6e6;
	border-radius: 20px;
}
.question_wrap .answer_view span em {
	width: 50px;
	font-weight: 800;
	text-align: center;
}

.suggest {
	padding: 20px;
	border: 1px solid #e6e6e6;
	border-radius: 20px;
	background: #fafafa;
}
.suggest label {
	display: block;
	font-size: 14px;
	font-weight: 800;
	color: #102e81;
	margin-bottom: 5px;
}
.suggest p {
	font-size: 16px;
	font-weight: 700;
	word-break: break-all;
	line-height: 2;
}
.suggest pre {
	font-size: 16px;
	font-weight: 700;
	word-break: break-all;
	font-family: 'NanumSquare', sans-serif;
}
.suggest div {
	font-size: 20px;
}

.multiple_choice {
	margin-top: 30px;
}
.multiple_choice ul.choice1 {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 20px;
}
.multiple_choice ul.choice2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
}
.multiple_choice ul.choice3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	width: 100%;
}
.multiple_choice ul.choice4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
}
.multiple_choice ul.choice6 {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 30px;
}
.multiple_choice ul figure {
}
.multiple_choice ul + .q_title {
	margin-top: 30px;
}
.multiple_choice li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 800;
}
.multiple_choice li span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	min-width: 30px;
	height: 30px;
	font-size: 16px;
	font-weight: 800;
	color: #555;
	border: 1px solid #bbb;
	border-radius: 50%;
	cursor: pointer;
}
.multiple_choice li.active span {
	color: #102e81;
	background: #e0f0ff;
}
.multiple_choice .q_title {
	font-size: 16px;
	font-weight: 800;
	margin-bottom: 20px;
}
.read .multiple_choice li {
	/*align-items: flex-start;*/
}
.read .multiple_choice li span {
	margin-top: -2px;
}
.multiple_choice .directive {
	position: relative;
	flex-direction: column;
	gap: 10px;
	padding: 60px 20px 20px;
	border: 1px solid #e6e6e6;
	border-radius: 20px;
	background: #fafafa;
}
.multiple_choice .directive li.label {
	position: absolute;
	top: 20px;
	left: 20px;
	font-size: 14px;
	color: #102e81;
}
.multiple_choice .directive li:not(.label) {
	margin-bottom: 10px;
	position: relative;
	font-size: 16px;
	font-weight: 500;
	padding: 20px 20px 20px 50px;
	border: 1px solid #0c70f5;
	border-radius: 20px;
	background: #fff;
	transition: all 0.2s ease;
	z-index: 1;
}
.multiple_choice .directive li:not(.label):hover {
	border-color: #102e81;
	background: #fafafa;
}
.multiple_choice .directive li strong {
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	line-height: 24px;
	font-size: 20px;
	color: #102e81;
}



.multiple_choice_h {
	margin-top: 30px;
}
.multiple_choice_h ul.choice1 {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 30px;
}
.multiple_choice_h ul.choice2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
}
.multiple_choice_h ul.choice3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	width: 100%;
}
.multiple_choice_h ul.choice4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
}
.multiple_choice_h ul figure {
}
.multiple_choice_h ul + .q_title {
	margin-top: 30px;
}
.multiple_choice_h li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 800;
}
.multiple_choice_h li span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	min-width: 30px;
	height: 30px;
	font-size: 16px;
	font-weight: 800;
	color: #555;
	border: 1px solid #bbb;
	border-radius: 50%;
	cursor: pointer;
}
.multiple_choice_h li.active span {
	color: #102e81;
	background: #e0f0ff;
}
.multiple_choice_h .q_title {
	font-size: 16px;
	font-weight: 800;
	margin-bottom: 20px;
}
.read .multiple_choice_h li {
	align-items: flex-start;
}
.read .multiple_choice_h li span {
	margin-top: -2px;
}
.multiple_choice_h .directive {
	position: relative;
	flex-direction: column;
	gap: 10px;
	padding: 60px 20px 20px;
	border: 1px solid #e6e6e6;
	border-radius: 20px;
	background: #fafafa;
}
.multiple_choice_h .directive li.label {
	position: absolute;
	top: 20px;
	left: 20px;
	font-size: 14px;
	color: #102e81;
}
.multiple_choice_h .directive li:not(.label) {
	margin-bottom: 10px;
	position: relative;
	font-size: 16px;
	font-weight: 500;
	padding: 20px 20px 20px 50px;
	border: 1px solid #0c70f5;
	border-radius: 20px;
	background: #fff;
	transition: all 0.2s ease;
	z-index: 1;
}
.multiple_choice_h .directive li:not(.label):hover {
	border-color: #102e81;
	background: #fafafa;
}
.multiple_choice_h .directive li strong {
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	line-height: 24px;
	font-size: 20px;
	color: #102e81;
}




.allQuestion .nav {
	gap: 10px;
}
.allQuestion .nav-link {
	font-weight: 800;
	color: #333;
	border-radius: 10px;
	background: #ebebeb;
}
.allQuestion .table_wrap th {
	position: relative;
}
.allQuestion .table_wrap th.check:before {
	position: absolute;
	top: 50%;
	left: 10px;
	transform: translateY(-50%);
	width: 15px;
	height: 10px;
	content: '';
	background-image: url('../../assets/images/checker.svg');
	background-position: center left;
	background-repeat: no-repeat;
	background-size: auto 10px;
}
.allQuestion .table_wrap th.highlight:after {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	width: 15px;
	height: 10px;
	content: '';
	background-image: url('../../assets/images/highlighter.svg');
	background-position: center right;
	background-repeat: no-repeat;
	background-size: auto 10px;
}
.submit_answer .table_wrap th {
	position: relative;
	border-right: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
.submit_answer .table_wrap td {
	border-right: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
.submit_answer .table_wrap th.check:before {
	position: absolute;
	top: 50%;
	left: 25px;
	transform: translateY(-50%);
	width: 15px;
	height: 10px;
	content: '';
	background-image: url('../../assets/images/checker.svg');
	background-position: center left;
	background-repeat: no-repeat;
	background-size: auto 10px;
}
.submit_answer .table_wrap th.highlight:after {
	position: absolute;
	top: 50%;
	right: 25px;
	transform: translateY(-50%);
	width: 15px;
	height: 10px;
	content: '';
	background-image: url('../../assets/images/highlighter.svg');
	background-position: center right;
	background-repeat: no-repeat;
	background-size: auto 10px;
}
h3.submit_info {
	font-weight: 700;
	text-align: center;
	margin: 30px 0;
}

.write .exam_content {
	padding-left: 0;
}
.short-answer li {
	position: relative;
}
.short-answer li:after {
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	font-size: 14px;
	font-weight: 500;
	color: #999;
	content: attr(text_length);
}
.short-answer li span {
	background: #fff;
	z-index: 1;
}
.short-answer li input {
	width: 100%;
	margin-left: -25px;
	border-radius: 20px;
}

.txt_wrap .table_wrap {
	margin-top: 20px;
}
.txt_wrap .table_wrap table {
	background: #fff;
}
.txt_wrap .table_wrap table tr > * {
	font-size: 14px;
}
.txt_wrap .table_wrap th {
	border-top: 2px solid #0c70f5;
	border-bottom: 1px solid #ddd;
}

.essay-answer li {
	position: relative;
}
.essay-answer li:after {
	position: absolute;
	bottom: 10px;
	right: 15px;
	font-size: 14px;
	font-weight: 500;
	color: #999;
	content: attr(text_length) '/' attr(max_length);
}
.essay-answer textarea {
	border-radius: 20px;
}

.write .submit_answer .table_wrap table.submit {
	border-top: 2px solid #0c70f5;
}
.write .submit_answer .table_wrap .submit td {
	font-size: 14px;
	text-align: left;
	padding: 10px;
}
.write .submit_answer .table_wrap .submit .warn th {
	background: transparent;
}

figure.question_wrap {
	display: flex;
	justify-content: center;
	/*width: 600px;*/
	/*margin: 50px auto;*/
}

figure.question_wrap img {
	width: auto;
}

.disconnect .modal-body {
	padding: 30px 0;
}
.disconnect figure {
	width: 150px;
	margin: 0 auto;
}
.disconnect h3 {
	text-align: center;
}

.speaking .info_wrap em {
	text-decoration: underline;
}

.speaking .table_wrap .input_wrap input[type='checkbox'] {
	width: 20px;
	height: 20px;
	margin-top: 2px;
}
.speaking .table_wrap .sound_wave {
	width: 300px;
	height: 30px;
	margin: 0 auto;
	padding: 0;
	background: transparent;
}

.player {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: 30px;
	padding: 10px 15px;
	border: 2px solid #0c70f5;
	border-radius: 20px;
}
.player .sound_check {
	flex: 1;
}
.control {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 0 20px;
}

.speaking .content .btn_wrap button {
	font-size: 18px;
	margin: 0 auto;
	padding: 5px 20px;
}
.speaking .content .btn_wrap button img {
	width: 24px;
}
.speaking .check img {
	width: 20px;
}

.answerCheck .info_wrap {
	justify-content: center;
}
.answerCheck .info_wrap p {
	font-size: 20px;
	font-weight: 800;
}

/*.survey h3 .mla {*/
/*	width: 90px;*/
/*}*/
.survey .content figure.niied {
	width: 243px;
	margin: 50px auto;
}
.multiple_choice .nice-select {
	width: 300px;
	height: 50px;
	line-height: 48px;
	font-weight: 800;
}
.multiple_choice .nice-select .option {
	line-height: 40px;
	font-weight: 800;
	font-size: 16px;
}
.survey .select_wrap .nice-select {
	width: 200px;
	height: 50px;
	line-height: 48px;
	font-weight: 800;
}
.survey .select_wrap .nice-select .option {
	line-height: 40px;
	font-weight: 800;
}

.survey .multiple_choice .choice5 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
.survey .multiple_choice .q_title {
	font-size: 20px;
}
.survey .essay-answer {
	margin-top: 30px;
}
.survey .essay-answer textarea {
	min-height: 105px;
}
.survey .number {
	width: 200px;
	height: 200px;
}
.survey .number p {
	font-size: 18px;
}
.survey .number h1 {
	font-size: 70px;
}
.survey .photo_wrap figure.topik {
	width: 200px;
	margin: 0 auto;
}

@media screen and (min-width: 1401px) {
	.content {
		width: 1000px;
		padding: 30px 0;
		margin: 0 auto;
	}
	.login .content {
		width: 1200px;
	}

	.number {
		width: 500px;
		height: 500px;
	}
	.number p {
		font-size: 35px;
	}
	.number h1 {
		line-height: 200px;
		font-size: 200px;
	}

	.login_wrap {
		padding: 32px 0;
	}
	.login_wrap h3.title {
		padding-bottom: 50px;
	}
	.user_info {
		width: 300px;
	}
	.login .input_wrap {
		padding: 15px 20px;
	}
	.login .input_wrap label {
		font-size: 14px;
	}
	.login .input_wrap input {
		height: 45px;
		font-size: 30px;
	}
	.sign_pad .sign_top label {
		font-size: 14px;
	}
	.sign_pad {
		width: 300px;
		padding: 15px 20px;
	}
	.login_wrap .login {
		line-height: 80px;
		font-size: 30px;
		margin-top: 50px;
	}
	#signature {
		width: 260px;
		height: 128px;
	}

	.setting .ver_info li {
		font-size: 16px;
	}
	.setting .option .volume {
		width: 24px;
	}
	.setting .option .playtime .play {
		width: 20px;
	}
	.setting .option .playtime span {
		line-height: 20px;
		font-size: 16px;
	}

	.duplication_login .content figure {
		width: 310px;
	}
	.duplication_login .content h3 {
		font-size: 40px;
		line-height: 50px;
		margin-top: 50px;
	}
	.duplication_login .reason {
		margin-top: 50px;
	}
	.duplication_login .reason p {
		font-size: 20px;
	}
	.duplication_login .a_box {
		line-height: 50px;
		font-size: 20px;
		margin-top: 20px;
	}

	.supervisor .content li button {
		line-height: 70px;
		font-size: 24px;
	}
	.supervisor .content li + li {
		margin-top: 15px;
	}

	.info_box {
		font-size: 16px;
		padding: 20px;
	}

	.change_info {
		margin-top: 30px;
	}
	.change_info dt,
	.change_info dd {
		font-size: 16px;
	}

	form.modal-body .input_wrap {
		gap: 10px;
	}
	form.modal-body .input_group {
		gap: 20px;
	}
	form.modal-body .input_group .input_wrap input[type='radio'] {
		width: 20px;
		height: 20px;
	}
	form.modal-body .input_group .input_wrap label {
		font-size: 16px;
	}
	form.modal-body .input_wrap.text input[type='text'],
	form.modal-body .input_wrap.text input[type='password'] {
		height: 50px;
		font-size: 16px;
		padding: 0 20px;
	}
	form.modal-body .input_wrap input[type='text'],
	form.modal-body .input_wrap span {
		font-size: 16px;
	}
	form.modal-body .select_wrap {
		margin-top: 20px;
	}
	form.modal-body .select_wrap .nice-select {
		height: 50px;
		line-height: 47px;
	}
	form.modal-body .select_wrap .nice-select:after {
		right: 20px;
		width: 10px;
		height: 10px;
		margin-top: -7px;
	}

	.audio_option {
		margin-top: 30px;
	}
	.audio_option label {
		font-size: 20px;
	}
	.audio_option .level {
		gap: 20px;
	}
	.audio_option .volume_bar {
		padding: 15px;
		border-radius: 25px;
	}
	.audio_option .volume_bar span {
		width: 20px;
		height: 20px;
	}
	.audio_option .playtime .play_btn {
		width: 40px;
	}

	.range_bar {
		gap: 20px;
	}
	.range_bar.sound_track {
		padding: 15px 40px;
	}
	.range_bar > img {
		width: 24px;
	}

	.identification .number {
		width: 200px;
		height: 200px;
	}
	.identification .table_wrap table col:nth-child(2) {
		width: 180px !important;
	}

	.photo_wrap figure {
		width: 200px;
	}
	.photo_wrap figure > button {
		margin-top: 20px;
	}
	.photo_wrap .info_wrap .noti {
		line-height: 50px;
		padding: 30px 40px;
	}
	.info_wrap li {
		line-height: 30px;
		font-size: 20px;
	}

	.equipment .content {
		width: 1200px;
	}
	.equipment .info_wrap {
		gap: 50px;
		padding: 25px 50px;
	}
	.equipment .info_wrap > ul {
		flex: 1;
	}
	.equipment .equip_wrap {
		flex-direction: row;
	}
	.equipment .equip_info {
		gap: 30px;
		font-size: 16px;
		margin-top: 30px;
		padding: 10px 30px;
	}
	.equipment .equip_info > * {
		line-height: 28px;
	}
	.sound_check .counting {
		width: 50px;
		height: 50px;
		font-size: 20px;
	}
	.range_bar {
		padding: 15px 20px;
		border-radius: 25px;
	}
	.range_bar p {
		line-height: 20px;
		font-size: 16px;
	}

	.sound_wave,
	.sound_check {
		width: 1000px;
		margin: 0 auto;
	}
	.sound_wave .record {
		bottom: -25px;
		border-radius: 25px;
	}
	.sound_wave .record span {
		line-height: 30px;
	}
	.sound_wave .record span.circle {
		width: 20px;
		height: 20px;
	}

	.exam_text {
		height: 180px;
	}
	.exam_text figure p {
		line-height: 80px;
		font-size: 80px;
	}
	.write_wrap > input {
		height: 60px;
		font-size: 60px;
	}

	.terms .info_wrap p {
		line-height: 30px;
		font-size: 20px;
	}
	.agree_list h3 {
		font-size: 20px;
	}
	.terms .input_wrap label {
		line-height: 30px;
		font-size: 20px;
	}
	.terms .input_wrap input[type='checkbox'] {
		width: 24px;
		height: 24px;
		margin-top: 3px;
	}
	.terms h4 + p {
		line-height: 24px;
		font-size: 16px;
	}

	.listening .number {
		width: 200px;
		height: 200px;
	}
	.listening .table_wrap table col:nth-child(2) {
		width: 180px !important;
	}
	.examinee_info .table_wrap tr > td {
		font-size: 30px;
	}
	.remaining_time img {
		width: 72px;
	}
	.listening .info_wrap p {
		font-size: 20px;
	}

	.top_info li {
		width: 120px;
		line-height: 26px;
		font-size: 20px;
	}
	.listening .content {
		padding: 30px 0;
	}
	.question_number {

		font-size: 16px;
		color: #0c70f5;
		padding: 3px 15px;
		border: 2px solid #0c70f5;
		border-radius: 10px;
		background: #fff;

		line-height: 30px;
	}

	.exam_content {
		width: 1000px;
		margin: 0 auto;
		padding: 0;
	}
	.sound_check {
		margin: 20px auto;
	}
	.sound_check_spk {
		margin: 50px 100px 30px;
	}

	.text_setting {
		/*top: -30px;*/
		padding: 20px 15px;
	}
	.text_setting li {
		width: 30px;
		height: 30px;
	}
	.text_setting li > button {
		width: 30px;
	}

	.multiple_choice {
		margin-top: 15px;
	}

	.survey .multiple_choice{
		margin-top: 50px;
	}

	.multiple_choice .answer_li {
		gap: 20px;
		font-size: 16px;
	}
	.multiple_choice li {
		gap: 20px;
		font-size: 24px;
	}
	.multiple_choice li .answer_no {
		width: 55px;
		min-width: 55px;
		height: 55px;
		font-size: 25px;
	}
	
	.multiple_choice li span {
		width: 40px;
		min-width: 40px;
		height: 40px;
		font-size: 20px;
	}

	.multiple_choice .q_title {
		font-size: 20px;
		margin-bottom: 15px;
	}
	.multiple_choice ul + .q_title {
		margin-top: 50px;
	}
	.memo textarea {
		font-size: 16px;
	}

	.content.submit_answer {
		width: 1300px;
	}
	.submit_answer .number {
		width: 200px;
		height: 200px;
	}
	.submit_answer .number h1 {
		font-size: 80px;
	}
	.submit_answer .number p {
		font-size: 18px;
	}
	.submit_answer .examinee_info {
		gap: 50px;
	}

	.examinee_info .table_wrap table col:nth-child(1) {
		width: 181px !important;
	}
	.examinee_info .table_wrap table col:nth-child(2) {
		width: 150px !important;
	}
	.sign_wrap .sign_pad {
		padding: 20px 20px 10px;
	}
	.sign_wrap .sign_pad .sign_top button {
		line-height: 28px;
		font-size: 16px;
	}

	.read .content {
		width: 100%;
		padding: 30px 0;
	}
	.read .exam_content {
		gap: 50px;
		width: 100%;
		padding-right: 80px;
	}
	h4.exam_title {
		line-height: 20px;
		font-size: 24px;
		margin-bottom: 15px;
		padding-right: 80px;
	}
	.multiple_choice ul {
		gap: 70px;
	}
	.suggest label {
		line-height: 24px;
		font-size: 16px;
	}
	.suggest p {
		line-height: 2;
		/*font-size: 30px !important;*/
	}
	.suggest pre {
		line-height: 30px;
		font-size: 20px;
	}

	.question_wrap {
		margin-top: 30px;
		margin-bottom: 30px;
	}
	.question_wrap .txt_wrap p {
		line-height: 30px;
		font-size: 20px;
	}
	.question_wrap .txt_wrap pre {
		line-height: 30px;
		font-size: 20px;
	}
	.question_wrap .choice {
		margin-top: 50px;
	}
	.question_wrap .choice li {
		font-size: 20px;
		padding: 30px 30px 30px 80px;
	}
	.question_wrap .choice li strong {
		left: 30px;
		font-size: 30px;
	}
	.question_wrap .choice_board {
		padding: 30px;
	}
	.question_wrap .choice_board li {
		min-height: 90px;
		line-height: 30px;
		font-size: 20px;
	}
	.question_wrap .choice_board li.active {
		padding: 20px 20px 20px 60px;
	}
	.question_wrap .choice_board li.active strong {
		left: 20px;
		line-height: 30px;
		font-size: 24px;
	}
	.question_wrap .answer_view {
		padding: 20px 30px;
	}
	.question_wrap .answer_view > b {
		line-height: 24px;
		font-size: 16px;
	}
	.question_wrap .answer_view span em {
		width: 100px;
	}
	.multiple_choice .directive {
		padding: 70px 30px 30px;
	}
	.multiple_choice .directive li.label {
		top: 20px;
		left: 30px;
		font-size: 16px;
	}
	.multiple_choice .directive li:not(.label) {
		font-size: 20px;
		padding: 30px 30px 30px 80px;
	}
	.multiple_choice .directive li strong {
		left: 30px;
		font-size: 30px;
	}

	.allQuestion .nav-link {
		font-size: 16px;
		padding: 10px 20px;
	}

	h3.submit_info {
		margin: 50px 0;
	}

	.write .content {
		width: 100%;
		padding: 30px 0;
	}
	.write .exam_content {
		width: 100%;
		padding-right: 80px;
	}

	.short-answer li input {
		height: 70px;
		font-size: 20px;
		margin-left: -35px;
		padding: 0 35px;
	}
	.short-answer li:after {
		font-size: 20px;
	}

	.txt_wrap .table_wrap {
		width: 800px;
		margin: 30px auto 0;
	}

	.essay-answer textarea {
		line-height: 30px;
		font-size: 20px;
		padding: 20px;
	}
	.essay-answer li:after {
		line-height: 30px;
		font-size: 20px;
	}

	.write .submit_answer .table_wrap table.submit col:nth-child(1) {
		width: 80px !important;
	}
	.write .submit_answer .table_wrap .submit td {
		height: 80px;
		font-size: 16px;
	}

	.speaking .content {
		width: 100%;
		padding: 30px 0;
	}

	.disconnect .modal-dialog {
		max-width: 600px;
	}
	.disconnect .modal-content {
		padding: 50px 0;
	}
	.disconnect h3 {
		font-size: 24px;
	}

	.speaking .table_wrap .sound_wave {
		width: 450px;
	}
	.speaking .player {
		margin-top: 50px;
		padding: 15px 20px;
	}
	.control {
		gap: 30px;
	}
	.control .circle {
		width: 50px;
	}
	.player .sound_check {
		gap: 20px;
		margin: 0;
	}
	.speaking .content .btn_wrap button {
		gap: 20px;
		font-size: 20px;
		padding: 10px 30px;
	}
	.speaking .content .btn_wrap button img {
		width: 26px;
	}

	.question_wrap .txt_wrap {
		padding: 30px;
	}
	.survey .multiple_choice .q_title {
		font-size: 24px;
	}

	.survey .content {
		width: 100%;
	}
	.survey .content.finish {
		max-width: 1000px;
	}
	.exam_content {
		width: 100%;
	}
	.survey .essay-answer {
		margin-top: 50px;
	}
	.survey .photo_wrap .info_wrap .noti {
		text-align: center;
	}
}

@media screen and (min-width: 2001px) {
	.content {
		width: 1600px;
		padding: 30px 0;
	}
	.login .content {
		width: 1600px;
	}
	.login .title .mla,
	#openExamGuide .title .mla,
	#privacy .title .mla {
		width: 185px;
	}
	.number {
		width: 600px;
		height: 600px;
	}
	.number h1 {
		line-height: 200px;
		font-size: 200px;
	}
	.number p {
		font-size: 55px;
	}

	.login_wrap {
		padding: 50px 0;
	}
	.login .input_wrap {
		padding: 20px;
	}
	.login .input_wrap label {
		font-size: 16px;
	}
	.login .input_wrap input {
		height: 50px;
		font-size: 35px;
	}
	.user_info {
		width: 400px;
	}
	.sign_pad {
		width: 400px;
	}

	.login_wrap .login {
		line-height: 100px;
		font-size: 40px;
		border-radius: 15px;
	}

	#signature {
		width: 360px;
		height: 178px;
	}

	.setting .ver_info {
		gap: 30px;
	}
	.setting .ver_info li {
		font-size: 20px;
	}
	.setting .option {
		gap: 30px;
	}
	.setting .option .volume {
		width: 30px;
	}
	.setting .option .playtime {
		gap: 20px;
	}
	.setting .option .playtime .play {
		width: 30px;
	}
	.setting .option .playtime span {
		line-height: 30px;
		font-size: 20px;
	}
	.setting .option .btn.cog {
		width: 30px;
	}

	.duplication_login .a_box {
		line-height: 60px;
		font-size: 24px;
		padding: 0 30px;
	}

	.supervisor .content li button {
		line-height: 80px;
		font-size: 30px;
	}

	.info_box {
		line-height: 30px;
		font-size: 20px;
	}

	.change_info dt,
	.change_info dd {
		line-height: 30px;
		font-size: 20px;
	}

	form.modal-body .input_wrap input[type='text'] {
		width: 70px;
		height: 50px;
		padding: 0 15px;
		border-radius: 15px;
	}
	form.modal-body .input_wrap input[type='text'],
	form.modal-body .input_wrap span {
		font-size: 20px;
	}
	form.modal-body .input_wrap.min input[type='text'],
	form.modal-body .input_wrap.min input[type='password'] {
		height: 50px;
		padding: 0 30px 0 15px;
	}
	form.modal-body .input_group .input_wrap label {
		font-size: 20px;
	}
	form.modal-body .input_wrap.text input[type='text'],
	form.modal-body .input_wrap.text input[type='password'] {
		height: 60px;
		font-size: 20px;
		border-radius: 15px;
	}

	.change_info dt,
	.change_info dd {
		line-height: 30px;
		font-size: 20px;
	}

	.language.input_wrap {
		border-radius: 15px;
	}
	.language.input_wrap > input + label {
		font-size: 18px;
		padding: 2px 25px;
		border-radius: 10px;
	}

	.identification .number {
		width: 250px;
		height: 250px;
	}
	.identification .number h1 {
		font-size: 100px;
	}
	.identification .number p {
		font-size: 24px;
	}

	.examinee_info {
		gap: 80px;
		padding-bottom: 50px;
		margin-bottom: 50px;
	}
	.examinee_info .table_wrap tr > * {
		font-size: 20px;
	}
	.examinee_info .table_wrap table col:nth-child(1) {
		width: 226px !important;
	}
	.examinee_info .table_wrap table col:nth-child(2) {
		width: 180px !important;
	}

	.photo_wrap {
		gap: 80px;
	}
	.photo_wrap .info_wrap .input_wrap input {
		width: 30px;
		height: 30px;
		margin-top: 5px;
		margin-right: 10px;
		border-radius: 10px;
	}
	.photo_wrap .info_wrap .input_wrap label {
		line-height: 40px;
		font-size: 30px;
	}
	.photo_wrap .info_wrap .noti {
		line-height: 60px;
		padding: 40px;
	}
	.photo_wrap figure {
		width: 250px;
	}

	.equipment .content {
		width: 1400px;
	}
	.equipment .info_wrap {
		padding: 40px 50px;
	}
	.equipment .equip_info {
		font-size: 20px;
		margin-top: 50px;
		padding: 20px 30px;
		border-radius: 15px;
	}
	.photo_wrap figure > button {
		line-height: 50px;
		font-size: 20px;
	}

	.sound_wave,
	.sound_check {
		width: 1400px;
	}
	.sound_wave .record span {
		font-size: 20px;
	}
	.sound_check {
		gap: 20px;
	}
	.sound_check .counting {
		width: 60px;
		height: 60px;
		font-size: 30px;
	}
	.range_bar {
		padding: 20px 30px;
		border-radius: 30px;
	}
	.range_bar p {
		line-height: 30px;
		font-size: 20px;
	}

	.exam_text {
		height: 210px;
	}
	.write_wrap > input {
		height: 70px;
		font-size: 70px;
	}

	.terms .agree_list li {
		font-size: 20px;
	}
	.terms .input_wrap input[type='checkbox'] {
		width: 30px;
		height: 30px;
		margin-top: 5px;
		border-radius: 10px;
	}
	.terms .input_wrap label {
		font-size: 30px;
		line-height: 40px;
	}
	.terms h4 + p {
		line-height: 30px;
		font-size: 20px;
	}

	.listening .number {
		width: 250px;
		height: 250px;
	}
	.listening .number p {
		font-size: 24px;
	}
	.listening .number h1 {
		font-size: 100px;
	}
	.listening .info_wrap p {
		font-size: 24px;
	}

	.language.input_wrap > input + label {
		line-height: 50px;
	}

	.memo {
		right: 50px;
		bottom: 150px;
	}

	.exam_content {
		width: 100%;
	}

	.top_info {
		top: 0;
		gap: 50px;
	}
	.top_info li {
		width: 150px;
		line-height: 30px;
		padding: 10px 0 4px;
	}
	.top_info li:before {
		line-height: 24px;
		font-size: 14px;
	}

	.question_number {
		font-size: 20px;
		padding: 8px 15px;
		border-radius: 15px;
	}

	.multiple_choice .q_title {
		font-size: 24px;
		margin-bottom: 25px;
	}
	.multiple_choice ul + .q_title {
		margin-top: 80px;
	}
	.multiple_choice li {
		font-size: 35px;
	}

	.content.submit_answer {
		width: 1600px;
	}

	.suggest label {
		line-height: 30px;
		font-size: 20px;
		margin-bottom: 10px;
	}
	.suggest p {
		line-height: 2;
		font-size: 24px;
	}

	.read .exam_content {
		gap: 80px;
	}
	.read .multiple_choice li span {
		margin-top: -5px;
	}

	.question_wrap.plb {
		padding-right: 80px;
	}
	.question_wrap .choice li {
		line-height: 36px;
		font-size: 24px;
	}
	.question_wrap .choice li + li {
		margin-top: 30px;
	}
	.question_wrap .choice li strong {
		font-size: 36px;
	}
	.question_wrap .choice_board li {
		min-height: 100px;
		font-size: 24px;
	}
	.question_wrap .choice_board li.active {
		padding: 30px 30px 30px 80px;
	}
	.question_wrap .choice_board li.active strong {
		left: 30px;
		line-height: 40px;
		font-size: 30px;
	}
	.question_wrap .choice_board li + li {
		margin-top: 20px;
	}
	.question_wrap .answer_view > b {
		line-height: 30px;
		font-size: 20px;
	}
	.question_wrap .answer_view span {
		font-size: 20px;
	}
	.multiple_choice .directive {
		gap: 20px;
	}
	.multiple_choice .directive li.label {
		font-size: 20px;
	}
	.multiple_choice .directive li strong {
		font-size: 36px;
	}
	.multiple_choice .directive li:not(.label) {
		font-size: 24px;
	}

	.submit_answer .number {
		width: 250px;
		height: 250px;
	}
	.submit_answer .number h1 {
		font-size: 100px;
	}
	.submit_answer .number p {
		font-size: 24px;
	}

	.allQuestion .table_wrap th.check:before {
		width: 20px;
		height: 15px;
		background-size: auto 15px;
	}
	.allQuestion .table_wrap th.highlight:after {
		width: 20px;
		height: 15px;
		background-size: auto 15px;
	}

	.multiple_choice li span {
		width: 50px;
		min-width: 50px;
		height: 50px;
		font-size: 20px;
	}
	.short-answer li input {
		height: 80px;
		font-size: 24px;
		margin-left: -40px;
	}

	.question_wrap .txt_wrap {
		padding: 50px;
	}
	.txt_wrap .table_wrap {
		width: 1200px;
		margin-top: 50px;
	}
	.txt_wrap .table_wrap table tr > * {
		font-size: 20px;
	}

	.essay-answer textarea {
		min-height: 240px;
		line-height: 40px;
		font-size: 24px;
	}

	.write .submit_answer .table_wrap .submit td {
		height: 100px;
		font-size: 20px;
		padding: 15px;
	}

	.disconnect .modal-dialog {
		max-width: 800px;
	}
	.disconnect .modal-body {
		padding: 50px;
	}
	.disconnect h3 {
		font-size: 30px;
	}

	.speaking .table_wrap .sound_wave {
		width: 1000px;
	}
	.speaking .content .btn_wrap button {
		gap: 25px;
		font-size: 24px;
		padding: 15px 50px;
	}

	.answerCheck .info_wrap p {
		font-size: 40px;
	}

	.survey .content figure.niied {
		width: 500px;
		margin: 100px auto;
	}
	.survey .select_wrap .nice-select {
		width: 300px;
		height: 70px;
		line-height: 68px;
		font-size: 24px;
	}
	.survey .content.finish {
		max-width: 1400px;
	}
	.survey .number {
		width: 250px;
		height: 250px;
	}
	.survey .number h1 {
		line-height: 250px;
		font-size: 100px;
	}
	.survey .number p {
		font-size: 24px;
	}
}

@media screen and (min-width: 2701px) {
	.content {
		width: 2000px;
		padding: 100px 0;
	}
	.login .content {
		width: 2000px;
	}
	.login .title .mla,
	#openExamGuide .title .mla,
	#privacy .title .mla {
		width: 222px;
	}

	.number {
		width: 800px;
		height: 800px;
	}
	.number h1 {
		line-height: 300px;
		font-size: 300px;
	}
	.number p {
		font-size: 70px;
	}

	.login_wrap {
		padding: 83px 0;
	}
	.user_info {
		width: 500px;
	}
	.login .input_wrap {
		padding: 30px;
	}
	.login .input_wrap label {
		font-size: 20px;
	}
	.login .input_wrap input {
		height: 60px;
		font-size: 45px;
	}

	.sign_pad {
		width: 500px;
		padding: 20px 30px;
	}
	.sign_pad .sign_top label {
		font-size: 20px;
	}
	.sign_pad .sign_top button {
		line-height: 34px;
	}
	.sign_pad .sign_top button img {
		width: 20px;
	}
	#signature {
		width: 460px;
		height: 227px;
	}

	.login_wrap .login {
		line-height: 120px;
		font-size: 50px;
		margin-top: 70px;
	}

	.setting {
		padding: 40px 0;
	}
	.setting .ver_info {
		gap: 50px;
	}
	.setting .ver_info li {
		font-size: 30px;
	}

	.setting .option .volume {
		width: 40px;
	}
	.setting .option .playtime .play {
		width: 40px;
	}
	.setting .option .playtime span {
		line-height: 40px;
		font-size: 30px;
	}
	.setting .option .btn.cog {
		width: 40px;
	}

	.duplication_login .content figure {
		width: 450px;
	}
	.duplication_login .content h3 {
		font-size: 50px;
		line-height: 60px;
		margin-top: 70px;
	}
	.duplication_login .reason {
		margin-top: 70px;
	}
	.duplication_login .reason p {
		font-size: 30px;
	}
	.duplication_login .a_box {
		line-height: 80px;
		font-size: 30px;
		padding: 0 50px;
		margin-top: 50px;
	}

	.supervisor .content li button {
		line-height: 100px;
		font-size: 40px;
	}
	.supervisor .content li + li {
		margin-top: 20px;
	}

	.info_box {
		line-height: 40px;
		font-size: 30px;
		padding: 30px;
	}

	.change_info {
		margin-top: 50px;
	}
	.change_info dt,
	.change_info dd {
		line-height: 45px;
		font-size: 30px;
	}
	.change_info dt {
		margin-bottom: 20px;
	}
	.change_info dt img {
		width: 30px;
	}

	form.modal-body .input_group .input_wrap label {
		font-size: 30px;
	}
	form.modal-body .input_group {
		gap: 20px;
		margin-top: 40px;
		padding: 0 40px;
	}
	form.modal-body .input_wrap {
		gap: 20px;
	}
	form.modal-body .input_wrap input[type='text'] {
		width: 100px;
	}
	form.modal-body .input_wrap input[type='text'],
	form.modal-body .input_wrap span {
		font-size: 30px;
	}
	form.modal-body .input_wrap span {
		right: 15px;
	}
	form.modal-body .input_wrap.text input[type='text'],
	form.modal-body .input_wrap.text input[type='password'] {
		height: 70px;
		font-size: 30px;
		padding: 30px;
	}
	form.modal-body .input_wrap.min input[type='text'],
	form.modal-body .input_wrap.min input[type='password'] {
		height: 60px;
		padding: 0 40px 0 15px;
	}
	form.modal-body .table_wrap.bar.flex {
		gap: 50px;
	}
	form.modal-body .select_wrap {
		margin-top: 40px;
	}
	form.modal-body .select_wrap .nice-select {
		height: 70px;
		line-height: 67px;
		border-radius: 15px;
	}

	.audio_option {
		margin-top: 50px;
	}
	.audio_option .level {
		gap: 40px;
	}
	.audio_option label {
		font-size: 30px;
	}
	.audio_option .volume_bar {
		padding: 20px 25px;
		border-radius: 30px;
	}
	.audio_option .volume_bar span {
		width: 30px;
		height: 30px;
		border-radius: 10px;
	}
	.audio_option .playtime {
		gap: 20px;
	}
	.audio_option .playtime .play_btn {
		width: 50px;
	}
	.audio_option .volume {
		gap: 30px;
	}
	.range_bar > img {
		width: 30px;
	}

	.identification .number {
		width: 400px;
		height: 400px;
	}
	.identification .number h1 {
		font-size: 150px;
	}
	.identification .number p {
		font-size: 40px;
	}

	.examinee_info {
		padding-bottom: 80px;
		margin-bottom: 80px;
	}
	.examinee_info .table_wrap table col:nth-child(1) {
		width: 360px !important;
	}
	.examinee_info .table_wrap table col:nth-child(2) {
		width: 250px !important;
	}
	.examinee_info .table_wrap tr > * {
		font-size: 30px;
	}
	.examinee_info .table_wrap tr > td {
		font-size: 40px;
	}

	.photo_wrap figure {
		width: 400px;
	}
	.photo_wrap figure > button {
		line-height: 60px;
		font-size: 30px;
	}
	.photo_wrap .info_wrap .noti {
		line-height: 70px;
		padding: 50px;
	}
	.photo_wrap .info_wrap .input_wrap input {
		width: 45px;
		height: 45px;
		margin-top: 5px;
	}
	.photo_wrap .info_wrap .input_wrap label {
		line-height: 55px;
		font-size: 40px;
	}
	.info_wrap li {
		line-height: 45px;
		font-size: 30px;
	}

	.equipment .content {
		width: 2000px;
	}
	.equipment .info_wrap {
		padding: 50px 70px;
	}
	.equipment .info_wrap figure {
		width: 150px;
		height: 150px;
	}
	.equipment .equip_info {
		font-size: 24px;
		margin-top: 50px;
		padding: 30px 50px;
	}
	.equipment .equip_info > * {
		line-height: 40px;
	}

	.sound_wave,
	.sound_check {
		width: 2000px;
		gap: 40px;
	}
	.sound_wave {
		height: 200px;
	}
	.sound_check .counting {
		width: 100px;
		height: 100px;
		font-size: 50px;
	}
	.range_bar {
		gap: 40px;
		padding: 25px 50px;
		border-radius: 50px;
	}
	.range_bar.sound_track {
		padding: 25px 50px;
	}
	.range_bar p {
		line-height: 50px;
		font-size: 30px;
	}
	.range_bar > img {
		width: 60px;
	}
	.sound_wave .record {
		bottom: -35px;
		gap: 20px;
		padding: 20px 30px;
		border-radius: 35px;
	}
	.sound_wave .record span {
		font-size: 30px;
	}
	.sound_wave .record span.circle {
		width: 30px;
		height: 30px;
	}

	.exam_text {
		height: 280px;
		padding: 50px;
	}
	.exam_text label {
		line-height: 30px;
		font-size: 30px;
		font-weight: 800;
		color: #102e81;
	}
	.exam_text figure p {
		line-height: 100px;
		font-size: 100px;
	}
	.write_wrap {
		padding: 50px;
		margin-top: 30px;
	}
	.write_wrap > input {
		height: 80px;
		font-size: 80px;
	}
	.write_wrap > span {
		font-size: 30px;
	}

	.terms .info_wrap p {
		line-height: 36px;
		font-size: 24px;
	}
	.agree_list {
		padding: 50px 50px 50px 70px;
	}
	.agree_list h3 {
		font-size: 24px;
	}
	.terms .agree_list li {
		font-size: 24px;
	}
	.terms .input_wrap input[type='checkbox'] {
		width: 45px;
		height: 45px;
		margin-top: 5px;
	}
	.terms .input_wrap label {
		line-height: 55px;
		font-size: 40px;
	}
	.terms h4 + p {
		line-height: 36px;
		font-size: 24px;
	}

	.listening .number {
		width: 400px;
		height: 400px;
	}
	.listening .number h1 {
		font-size: 150px;
	}
	.listening .number p {
		font-size: 40px;
	}

	.remaining_time {
		gap: 40px;
	}
	.remaining_time img {
		width: 117px;
	}
	.remaining_time .timer label {
		font-size: 30px;
	}

	.info_wrap {
		padding: 70px 50px;
	}
	.listening .info_wrap p {
		font-size: 40px;
	}

	.question_number {
		font-size: 30px;
		padding: 11px 20px;
		border-radius: 20px;
	}
	.exam_content {
		width: 100%;
	}
	h4.exam_title {
		line-height: 50px;
		font-size: 36px;
		margin-bottom: 50px;
		padding-right: 120px;
	}
	.text_setting {
		gap: 30px;
		padding: 25px 20px;
		border-radius: 15px;
	}
	.text_setting li {
		width: 40px;
		height: 40px;
	}
	.text_setting li > button {
		width: 40px;
	}

	.multiple_choice .q_title {
		font-size: 30px;
		margin-bottom: 70px;
	}
	.multiple_choice ul + .q_title {
		margin-top: 100px;
	}
	.multiple_choice li {
		gap: 30px;
		font-size: 40px;
	}
	.multiple_choice li span {
		width: 60px;
		min-width: 60px;
		height: 60px;
		font-size: 30px;
	}

	.memo {
		width: 400px;
		height: 350px;
		padding: 40px 30px 30px;
	}
	.memo textarea {
		height: 280px;
		font-size: 24px;
	}
	.memo .close {
		top: 20px;
		right: 20px;
	}

	.top_info li {
		width: 180px;
		line-height: 50px;
		font-size: 30px;
		padding: 15px 0 5px;
		border-radius: 20px;
	}
	.top_info li:before {
		line-height: 30px;
		font-size: 16px;
		padding: 0 15px;
		border-radius: 10px;
	}

	.content.submit_answer {
		width: 2000px;
	}

	.listening .content {
		padding: 70px 0;
	}
	.listening #signature {
		width: 460px;
		height: 318px;
	}

	.read .exam_content {
		gap: 100px;
		padding-right: 120px;
	}
	.read .multiple_choice li span {
		margin-top: 0;
	}

	.suggest {
		padding: 30px;
	}
	.suggest label {
		line-height: 40px;
		font-size: 30px;
	}
	.suggest p {
		line-height: 2;
		font-size: 30px;
	}
	.suggest div {
		font-size: 20px;
	}

	.read .content {
		padding: 70px 0;
	}

	.question_wrap {
		margin-bottom: 70px;
	}
	.question_wrap .txt_wrap p {
		font-size: 30px;
		line-height: 45px;
	}
	.question_wrap .choice {
		margin-top: 70px;
	}
	.question_wrap .choice li {
		line-height: 40px;
		font-size: 30px;
		padding: 50px 50px 50px 100px;
	}
	.question_wrap .choice li strong {
		line-height: 60px;
		font-size: 45px;
	}
	.question_wrap .choice_board li {
		min-height: 150px;
		font-size: 30px;
	}
	.question_wrap .choice_board li.active {
		padding-left: 110px;
	}
	.question_wrap .choice_board li.active strong {
		left: 40px;
		line-height: 50px;
		font-size: 40px;
	}

	.question_wrap .answer_view {
		padding: 30px 50px;
	}
	.question_wrap .answer_view > b {
		line-height: 40px;
		font-size: 30px;
	}
	.question_wrap .answer_view span {
		font-size: 30px;
	}
	.question_wrap .answer_view span em {
		width: 150px;
	}
	.multiple_choice .directive {
		padding: 100px 50px 50px;
	}
	.multiple_choice .directive li.label {
		top: 30px;
		left: 50px;
		font-size: 30px;
	}
	.multiple_choice .directive li:not(.label) {
		line-height: 40px;
		font-size: 30px;
		padding: 50px 50px 50px 100px;
	}
	.multiple_choice .directive li strong {
		line-height: 60px;
		font-size: 45px;
	}

	.read .number {
		width: 400px;
		height: 400px;
	}
	.read .number h1 {
		font-size: 150px;
	}
	.read .number p {
		font-size: 40px;
	}

	.read #signature {
		width: 460px;
		height: 318px;
	}

	.allQuestion .nav-link {
		font-size: 24px;
		padding: 20px 40px;
		border-radius: 15px;
	}

	h3.submit_info {
		line-height: 64px;
		margin: 70px 0;
	}

	.write .content {
		padding: 70px 0;
	}
	.write .exam_content {
		padding-right: 120px;
	}

	.short-answer li input {
		height: 100px;
		font-size: 30px;
		margin-left: -60px;
		padding: 0 50px;
		border-radius: 30px;
	}

	.essay-answer li:after {
		bottom: 15px;
		right: 20px;
	}
	.essay-answer textarea {
		min-height: 350px;
		line-height: 45px;
		font-size: 30px;
		padding: 50px;
	}

	.write .number {
		width: 400px;
		height: 400px;
	}
	.write .number h1 {
		font-size: 150px;
	}
	.write .number p {
		font-size: 40px;
	}

	.write #signature {
		width: 460px;
		height: 318px;
	}

	.write .submit_answer .table_wrap .submit td {
		height: 130px;
		font-size: 30px;
		padding: 30px;
	}

	figure.question_wrap {
		/*width: 1000px;*/
		margin: 100px auto;
	}

	.range_bar input[type='range'] {
		width: 200px;
	}

	.speaking .player {
		margin-top: 70px;
		padding: 30px 50px;
		border-radius: 40px;
	}
	.speaking .table_wrap .input_wrap input[type='checkbox'] {
		width: 40px;
		height: 40px;
		margin-top: 0;
		border-radius: 5px;
	}
	.speaking .content .btn_wrap button {
		gap: 40px;
		font-size: 30px;
		padding: 20px 70px;
	}
	.speaking .content .btn_wrap button img {
		width: 36px;
	}
	.control .circle {
		width: 70px;
	}
	.answerCheck .info_wrap p {
		font-size: 60px;
	}

	.speaking .number {
		width: 400px;
		height: 400px;
	}
	.speaking .number h1 {
		font-size: 150px;
	}
	.speaking .number p {
		font-size: 40px;
	}

	.speaking #signature {
		width: 460px;
		height: 318px;
	}

	.speaking .check img {
		width: 30px;
	}

	.survey .content figure.niied {
		width: 700px;
	}
	.survey .select_wrap .nice-select {
		font-size: 30px;
	}
	.survey .select_wrap .nice-select .option {
		line-height: 60px;
	}
	.survey .multiple_choice .q_title {
		font-size: 30px;
	}
	.survey .multiple_choice .choice5 {
		gap: 30px;
	}
	.survey .content.finish {
		max-width: 2000px;
	}
	.survey .number {
		width: 400px;
		height: 400px;
	}
	.survey .number h1 {
		line-height: 400px;
		font-size: 150px;
	}
	.survey .number p {
		font-size: 36px;
	}
}

/* ---------------------------------------- */
/* ---------------------------------------- */
/* ---------------------------------------- */
/* 추가화면 css */
#privacy .content h5 {
	background: var(--bs-gray-200);
	padding: 1rem;
	text-align: center;
	font-weight: 700;
	border-radius: 10px;
}
#privacy .content h6 {
	margin: 3rem 0 0.5rem;
	font-weight: 700;
}
#privacy .content .agree-contents {
	border: 1px solid var(--bs-border-color);
	padding: 1rem;
	font-size: 0.9rem;
	color: var(--bs-gray);
	max-height: 100px;
	overflow-y: auto;
	background: var(--bs-gray-100);
}
#privacy .content .agree-contents + .input_wrap {
	margin-top: 0.5rem;
	font-weight: 700;
}
#privacy .content .input_wrap.fs-5 {
	margin-top: 2rem;
	font-weight: 700;
}
#privacy .content .input_wrap.fs-5 .form-check-input {
	width: 1.25rem;
	height: 1.25rem;
}
#privacy .content .btn-lg {
	min-width: 200px;
	margin: 4rem 0 0 auto;
	line-height: 50px;
	font-size: 1.25rem;
}
#privacy .content .btn-lg:disabled {
	background: var(--bs-gray) !important;
}

#openExamGuide .content {
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
#openExamGuide .content h5 {
	font-size: 1.5rem;
	line-height: 2.5rem;
	font-weight: 800;
	margin-top: -2rem;
}
#openExamGuide .content p {
	font-size: 1.2rem;
	font-weight: 500;
	color: var(--bs-danger);
}
#openExamGuide .content .btn-lg {
	min-width: 400px;
	margin: 4rem auto 0;
	line-height: 50px;
	font-size: 1.25rem;
}
#openExamGuide .version {
	border-top: 1px solid var(--bs-border-color);
	color: var(--bs-gray-500);
	padding-top: 2rem;
	font-size: 0.9rem;
}
#takeExamModal {
}
#takeExamModal .btn-list li + li {
	margin-top: 10px;
}
#takeExamModal .btn-list li button {
	width: 100%;
	line-height: 2rem;
	padding: 1rem 0;
	font-size: 1.25rem;
	box-shadow: 5px 5px 10px rgb(0 0 0 / 5%);
}
#takeExamModal .btn-list li button:disabled {
	color: var(--bs-gray) !important;
	border-color: var(--bs-gray-300) !important;
}

#endExamEvalResult .table button {
	font-size: 20px;
	color: var(--bs-primary);
	font-weight: 700;
	text-decoration: underline;
}

footer .right.flex-end {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
footer .right.flex-end button {
	border-radius: 10px;
	justify-content: center;
	margin-left: 0.5rem;
}

/* 답안 */
.answer-result {
	display: inline-flex;
	margin: 0 0 1rem;
	font-weight: 800;
	font-size: 1.75rem;
	padding: 1rem 1rem 1rem 4rem;
	border-radius: 10px;
	color: var(--bs-success);
	background-repeat: no-repeat;
	background-position: 0.75rem center;
	background-size: auto 36px;
	background-image: url('../../assets/images/ic_check_success.png');
	background-color: rgba(var(--bs-success-rgb), 0.15);
}
.answer-result.wrong {
	color: var(--bs-danger);
	background-image: url('../../assets/images/ic_check_danger.png');
	background-color: rgba(var(--bs-danger-rgb), 0.15);
}
.multiple_choice li.selected span {
	background-color: rgba(var(--bs-danger-rgb), 0.15);;
}

.answer-box {
	border: 2px solid #102e81;
	background: #e0f0ff;
	border-radius: 10px;
	margin: 2rem 0 6rem;
	padding: 2rem;
}
.answer-box dl {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	font-size: 1.5rem;
	color: #102e81;
	margin: 0.25rem 0;
}
.answer-box dl dt {
	flex-shrink: 0;
	font-weight: 800;
	margin-right: 0.5rem;
}

/* 성적 결과 안내 */
#gradeResult {
	padding: 2rem;
	min-width: 700px;
}
#gradeResult .w_mark {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='150' height='100' viewBox='0 0 150 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ctext x='30' y='40' fill='darkgray'%3eSAMPLE%3c/text%3e%3c/svg%3e");
}
#gradeResult .contents-box {
	padding: 2rem 1.5rem;
	border: 1px solid var(--bs-border-color);
}
#gradeResult .contents-box h1 {
	font-size: 2rem;
	font-weight: 800;
	text-align: center;
}
#gradeResult .top-box h1 {
	font-size: 2rem;
	font-weight: 800;
	border-bottom: 2px solid var(--bs-border-color);
}
#gradeResult .top-box h2 {
	font-size: 1rem;
	font-weight: 800;
}
#gradeResult .contents-box h2 {
	font-size: 1.25rem;
	font-weight: 800;
}
#gradeResult .contents-box h2 small {
	font-size: 1rem;
	font-weight: 500;
	color: var(--bs-gray);
}
#gradeResult .contents-box .table {
	border: 2px solid var(--bs-gray-600);
}
#gradeResult .contents-box .table th,
#gradeResult .contents-box .table td {
	text-align: center;
	color: var(--bs-dark);
	border: 1px solid var(--bs-border-color);
	vertical-align: middle;
	font-size: 12px;
	line-height: 1.4;
}
#gradeResult .contents-box .table tbody.text-start td {
	text-align: left;
}
#gradeResult .contents-box .table small {
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--bs-gray);
}
#gradeResult .contents-box .table .graph-guide {
	display: flex;
	justify-content: center;
	align-items: center;
}
#gradeResult .contents-box .table .graph-guide li {
	display: flex;
	align-items: center;
	margin: 0 1rem;
}
#gradeResult .contents-box .table .graph-guide li span {
	width: 30px;
	height: 16px;
	display: block;
	border: 1px solid var(--bs-gray-600);
	background: #bbb;
}
#gradeResult .contents-box .table .graph-guide li.avg span {
	background: #eee;
}
#gradeResult .contents-box .table .graph-guide li strong {
	font-weight: 500;
	margin-left: 0.25rem;
}
#gradeResult .contents-box .table .graph-box {
	display: flex;
	flex-direction: column;
}
#gradeResult .contents-box .table .graph-box li {
	width: 0;
	height: 20px;
	border: 1px solid var(--bs-gray-600);
	background: #bbb;
	text-align: right;
	padding: 0 0.5rem 0 0;
	font-size: 0.875rem;
}
#gradeResult .contents-box .table .graph-box li.avg {
	background: #eee;
	margin-top: 0.25rem;
}
.circle-list li {
	position: relative;
	padding-left: 1rem;
}
.li_empty {
	height: 100px;
}
.circle-list li:before {
	content: '';
	display: block;
	width: 4px;
	height: 4px;
	background-color: var(--bs-dark);
	border-radius: 10px;
	position: absolute;
	left: 0;
	top: 7px;
}