/***** qbank_stats.php, statistics 부분 **********************************/
.st_body_wrapper {
	display: flex;
	max-width: 73rem;
}

.st_header {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-top: 10px;
	background: #fafafa;
	padding: 5px 5px;
	outline: 1px solid silver;
}

.st_subtitle {
	display: inline-block;
	vertical-align: middle;
	padding: 10px;
	color: #444444;
	font-size:1.5rem; 
	font-family: Arial; 
	font-weight: 500; 
	line-height: 1;
	outline: 1px solid silver;
	background: #F2F4F6;
}

.st_bank_quiz {
	text-align: center;
	vertical-align: baseline;
	align-self: center;
	font-weight: 500;
	/*color: #444;*/
	padding: 3px 10px;
	background: #f5f5f5;
	line-height: 1.4;
}

.st_bank_quiz.title {
	display: inline-block;
	color: #fff;
	border-radius: 16px;
	background: #005148;
}

.st_note_container {
	display: flex;
	flex-flow: column wrap;
	justify-content: flex-end;
	align-items: flex-end;
	padding: 5 5 0 5;
	max-width: 950px;
	outline: 0px solid gray;
}

.st_note {
	display: inline-block;
	font-size: 0.85rem;
	vertical-align: bottom;
	line-height: 1.2;
	color: #888;
	outline: 0px solid silver;
}

/***** statistics_* ******/
.st_body_container {
	max-width: 73rem;
	width: 100%;
	padding: 10px 30px;
	margin: 0px auto;
}

.st_sub_header {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-top: 10px;
	background: #fafafa;
	padding: 5px 5px;
	outline: 1px solid silver;
}

.st_section_title {
	display: inline-block;
	vertical-align: middle;
	padding: 10;
	color: #444444;
	font-size: 1.3rem; 
	font-family: Arial; 
	font-weight: 500; 
	line-height: 1;
	outline: 0px solid silver;
	background: #F2F4F6;
}
/*
.section_notice_container {
	display: flex;
	flex-flow: column wrap;	
	justify-content: space-between;
	max-width: 950px;
	font-size: 0.85rem;
	color: #888;
}
*/
/*
.section_notice {
	font-size: 0.85rem;
	color: #888;
}
*/
.st_rows_container {
	border: 0px solid silver;
	max-width: 950px;
}

.st_cells_container {
	display: flex;
	flex-wrap: nowrap;
}

.st_cells_container.st_first_row {
	background: #f2f4f6;
}

.st_cells_container.center {
	text-align: center;
}

.st_cell_strikediag {
  position: relative;
  /*min-width: 8rem; */   /* adjust as needed */
  /*min-height: 1rem;*/   /* adjust as needed */
  padding: 0;
  overflow: hidden;
}

/* draw the diagonal */
.st_cell_strikediag::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top right,
    transparent 49.5%, currentColor 50%, transparent 50.5%);
  pointer-events: none;
}

/* text in corners */
.st_cell_strikediag .st_top-right {
  position: absolute;
  top: 4px;
  right: 6px;
  white-space: nowrap;
  outline: 0px solid red;
  line-height: 100%;
}

.st_cell_strikediag .st_bottom-left {
  position: absolute;
  bottom: 4px;
  left: 6px;
  white-space: nowrap;
  line-height: 100%;
}


.st_type_cells {
	display: table-cell;
	white-space: wrap;
	outline: 1px solid silver;
	width: 18rem;
	padding-left: 0.8rem;
	word-break: break-all;
}

.st_table_cells {
	display: table-cell;
	white-space: wrap;
	flex: 1;
	text-align: center;
	outline: 1px solid silver;
	min-width: 1.5rem;
	word-break: break-all;
}

.st_type_cells.gray {
	background: gray;
}

.st_type_cells.blue {
	color: blue;
	opacity: 0.6;
}

.st_table_cells.blue {
	color: blue;
	opacity: 0.7;
}
	
.st_first_row_cells {
	display: table-cell;
	white-space: normal;
	flex: 1;
	text-align: center;
	outline: 1px solid silver;
	min-height: 3rem;
	padding-top: 0.5rem;
	min-width: 1.5rem;
}

/******* qbank.php **********************/
.qb_outmost_container {
	max-width: 73rem;
	outline: 0px solid red;
	padding: 10px 1rem;
	margin: 0px auto;
}

.qb_header {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-top: 10px;
	background: #fafafa;
	padding: 5px 5px;
	outline: 1px solid silver;
}

.qb_header_title {
	display: inline-block;
	vertical-align: middle;
	width: 20%;
	text-align: center;
	padding: 10px;
	color: #444444;
	font-size:1.5rem; 
	font-family: Arial; 
	font-weight: 500; 
	line-height: 1;
	outline: 1px solid silver;
	background: #F2F4F6;
}

.qb_note_container {
	display: flex;
	flex-flow: column wrap;
	justify-content: flex-end;
	align-items: flex-end;
	padding: 5 5 0 5;
	max-width: 950px;
	outline: 0px solid gray;
	width: 75%; 
	justify-content: space-between;	
}

.qb_note {
	display: inline-block;
	font-size: 0.85rem;
	vertical-align: bottom;
	line-height: 1.2;
	color: #888;
	outline: 0px solid silver;
}

.qb_filters_container {
	outline: 1px solid silver;
	padding: 2px;
	margin: 10px 0px;
	max-width: 950px;
	background: #fafafa;
}

.qb_filters_row {
	display: inline-flex;
	flex-flow: row wrap;
	justify-content: space-between;
	/*justify-content: flex-start;*/
	background: #fffff;
	width: 100%;
	gap: 2px;
	padding: 2px;
}

.qb_searching_row {
	display: inline-flex;
	flex-flow: row wrap;
	justify-content: space-between;
	/*justify-content: flex-start;*/
	background: #fffff;
	width: 100%;
	gap: 2px;
	padding: 2px;
}

.qb_filter_cell {
	outline: 0px solid red;
	vertical-align: middle;
	
	select {
		max-width: 20rem;
	}
}

.qb_filter_tag {
  display: inline-block;
  padding: 0px;
  margin: 4px 4px;
  /*border-radius: 12px;*/
  background: #f2f4f6;
  text-decoration: none;
  color: #333;
  font-size: 13px;
  line-height: 1;
}

.qb_filter_tag:hover {
  background: #def;
}

.qb_filter_delete {
	display: inline-block;
	ouline: 1px solid silver;
	padding:0px;
	line-hight:1;
	height:13px;
	width: 13px;
	color: red;
}

.qb_filter_tag_indi {
  display: inline-block;
  padding: 0px;
  margin: 4px;
  background: #def;
  text-decoration: none;
  color: #333;
  font-size: 0.9rem;
  line-height: 1;
}

.qb_search_cluster {
	display: inline-flex;
	flex-flow: row wrap;
	background: #f2f4f6;
	outline: 1px solid silver;
	padding: 2px;
	align-items: center;
}

.qb_search_cluster_cell {
	display: table-cell;
	padding: 0px;
	margin: 0px;
	line-height:1;
}

qb_search_cluster_cell select {
	border: 1px solid gray;
}

.qb_search_box {
	outline: 0px solid red;
	width: 15rem; 
	line-height: 0.8; 
	padding: 0px;
	vertical-align: top;
}

.qb_search_box::placeholder {
	padding: 0px;
	margin: 0px;
	line-height: 1;
}

.qb_search_tip {
	vertical-align: top;
	padding: 0px;
	border:0px; 
	width:14px; 
	height:14px; 
	background:transparent; 
	opacity:65%;
}

.qb_search_field {
	margin: 2px;
}

.qb_found_and_reset {
	display: inline-flex;
	flex-flow: row wrap;
	background: #fafafa;
	outline: 1px solid silver;
	padding: 2px;
	align-items: center;
}

.qb_found_cell {
	display: table-cell;
	margin: 0px;
	outline: 0px solid silver;
	background: #ffffff;
	padding: 0 10 0 10;
	/*line-height: 1.1;
	color: blue;*/
}

.qb_reset_button {
	margin-left: 2px;
	padding: 0px;
}

.qb_miscellaneous_buttons {
	display: inline-flex;
	flex-flow: row wrap;
	background: #f2f4f6;
	outline: 1px solid silver;
	align-items: center;
	
	.btn {
		display: inline-block;
		vertical-align: middle;
		border: none;
		background: transparent;
		padding: 0px 2px;
		margin: 0px;
	}
}

.qbank_main_table {
	display: flex;
	flex-flow: column nowrap;
	max-width: 73rem;
	margin: 2px auto;

	.qb_title_row {
		display: flex;
		flex-flow: row wrap;
		justify-content: flex-start;
		align-items: center;
		border-top: 1px solid silver;
		border-bottom: 1px solid silver;
		background: #f5f5f5;
		width: 100%;
	}

	.qb_rows_container {
		display: flex;
		flex-flow: row wrap;
		justify-content: flex-start;
		align-items: center;
		border-bottom: 1px solid silver;
		width: 100%;
	}

	/*
	.no_cell, .qid_cell, .quiz_cell, .topic_cell, .type_cell, .level_cell, .qpoint_cell, .ttl_applicants_cell, .correct_race_cell, .attempts_cell, .result_cell, .delete_cell, .date_cell {
		display: table-cell;
		outline: 1px solid silver;
	}
	*/

	.qb_check_cell { 
		display: inline-block;
		min-width: 2rem;
		max-width: 2rem;
		display: table-cell;
		text-align: center;
	}

	.qb_check_cell.title { 
		display: inline-block;
		cursor: pointer;
		min-width: 2rem;
		max-width: 2rem;
	}

	.qb_no_cell, .qb_qid_cell {
		display: inline-block;
		min-width: 3.2rem;
		max-width: 3.2rem;
		display: table-cell;
		text-align: center;
	}

	.qb_no_cell.title, .qb_qid_cell.title {
		display: inline-block;
		min-width: 3.2rem;
		max-width: 3.2rem;
		display: table-cell;
		text-align: center;
	}

	.qb_quiz_cell {
		display: inline-block;
		width: 15rem;
		flex: 5.5;
		cursor: pointer; 
		min-width: 9rem;
		text-align: left;
	}

	.qb_quiz_cell.title {
		display: inline-block;
		text-align: center;
		line-height: 1.2;
	}

	.qb_type_cell {
		display: inline-block;
		width: 15rem;
		flex: 4.5;
		min-width: 6rem;
	}
	.qb_type_cell.title {
		display: inline-block;
		text-align: center;
	}

	.qb_topic_cell {
		display: inline-block;
		width: 18.5rem;
		flex: 7;
		min-width: 6rem;
	}
	.qb_topic_cell.title {
		display: inline-block;
		text-align: center;
	}

	.qb_level_cell{
		display: inline-block;
		width: 3.6rem;
		flex: 1.2;
		text-align: center;
	}

	.qb_level_cell.title{
		display: inline-block;
		font-size: 0.8rem;
	}

	.qb_qpoint_cell {
		display: inline-block;
		width: 2.7rem;
		flex: 0.9;
		text-align: center;
	}

	.qb_qpoint_cell.title{
		display: inline-block;
		font-size: 0.8rem;
	}

	.qb_bookmark_cell {
		display: inline-block;
		flex: 0 0 40px;
		text-align: center;
		
		button {
			border:0px;
			
		}
	}
	
	.qb_ttl_applicants_cell {
		display: inline-block;
		width: 4.5rem;
		flex: 1.5;
		text-align: center;
		line-height: 1;
	}

	.qb_correct_rate_cell {
		display: inline-block;
		width: 4.5rem;
		flex: 1.5;
		text-align: center;
		line-height: 1;
	}
	.qb_attempts_cell {
		display: inline-block;
		width: 4.5rem;
		flex: 1.5;
		text-align: center;
		line-height: 1;
	}

	.qb_result_cell {
		display: inline-block;
		word-break: break-all;
		word-wrap: break-word;
		width: 1.5rem;
		flex: 1;
		text-align: center;
		line-height: 1;
	}

	.qb_ttl_applicants_cell.title {
		display: inline-block;
		line-height: 120%;
		font-size: 0.8rem;
	}
	
	.qb_correct_rate_cell.title {
		display: inline-block;
		line-height: 120%;
		font-size: 0.8rem;
	}

	.qb_result_cell.title {
		display: inline-block;
		word-break: break-all;
		word-wrap: break-word;
		width: 1.5rem;
		flex: 1;
		text-align: center;
		line-height: 1;
		font-size: 0.9rem;
	}
	
	.qb_attempts_cell.title {
		display: inline-block;
		line-height: 120%;
		font-size: 0.8rem;
	}
}


@media (max-width: 63rem) { 
	.qb_correct_rate_cell {
		display: none;
	}
}

@media (max-width: 61rem) { 
	.qb_ttl_applicants_cell {
		display: none;
	}
}

@media (max-width: 57rem) { 
	.qb_no_cell, .qb_qid_cell{
		display: none;
	}
}

@media (max-width: 54rem) { 
	.qb_level_cell, .qb_attempts_cell {
		display: none;
	}
}

@media (max-width: 52rem) { 
	.qb_topic_cell {
		display: none;
	}
}

input[type="checkbox"] {
	width: 1rem;
	height: 1rem;
	cursor: pointer;
	margin: 7 0 7 0;
}

select[name="element_sel"] {
  width: 200px;
}

select[name="category_sel"] {
  width: 250px;
}

button img {
	border:0px; 
	width:18px; 
	height:18px; 
	background:transparent; 
	opacity:65%; 
	margin:0px;
}

.page_scale {
	border:0px; 
	width:14px; 
	height:14px; 
	background:transparent; 
	opacity:65%; 
	margin:0px;
}

.page_scale.selected {
	color:blue;
	font-size:12px;
	font-weight:bold;
}

.qb_a2 {
	border:1 solid silver; 
	padding:3 2 0 2; 
	background-color:#d3e5fa; 
	font-size:12px; 
	font-family:Sans-serif; 
	color:gray;
}

/* 단일 페이지 모드 아이콘은 아래와 같이 사용
<div class="icon-wrapper single-page">
	<span class="icon-unit">🗏</span>
</div>
*/
/*** 두 페이지 나란히 펼치기 아이콘은 아래와 같이 사용 ***/
/*
<div class="icon-wrapper double-page">
	<span class="icon-unit">🗏</span>
	<span class="icon-unit">🗏</span>
</div>
*/

.icon-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2em; /* 두 장이 배치될 충분한 너비 */
    height: 1.5em;
    position: relative;
    vertical-align: middle;
	background: transparent
}


.icon-unit {
    font-size: 1.2rem;
    line-height: 1;
    color: currentColor; /* 텍스트 컬러와 통일 */
}

/* 왼쪽 페이지 */
.double-page .icon-unit:first-child {
    position: absolute;
    transform: translateX(-5px); /* 왼쪽으로 이동 */
}

/* 오른쪽 페이지 */
.double-page .icon-unit:last-child {
    position: absolute;
    transform: translateX(5px); /* 오른쪽으로 이동 */
    /* 두 페이지가 겹치는 부분의 가독성이 걱정된다면 배경색을 살짝 줄 수 있습니다 */
    background: transparent; 
    /* 하지만 이모지 특성상 배경 없이 겹치는 게 더 미니멀할 수 있습니다 */
}


/*** cart.php ****************************/
.cart_outmost_container {
	max-width: 63rem;
	outline: 0px solid red;
	padding: 10px 1rem;
	margin: 0px auto;
	align-items: stretch; /* 자식 요소들이 가로로 꽉 차게 함 */
	font-size: 0.9rem;
}

/*
.cart_header_row {
	text-align: center;
	font-size: 1.5rem;
}
*/
.cart_header {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	width: auto;
	margin-top: 10px;
	background: #fafafa;
	padding: 5px 5px;
	outline: 1px solid silver;
}



.cart_header_title {
	display: inline-block;
	vertical-align: middle;
	width: 20%;
	text-align: center;
	padding: 10px;
	color: #444444;
	font-size:1.5rem; 
	font-family: Arial; 
	font-weight: 500; 
	line-height: 1;
	outline: 1px solid silver;
	background: #F2F4F6;
}

.cart_icons_row {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-end;
	gap: 0.1rem;
}

.cart_icon_cell {
	display: table-cell;
}

.cart_body_container {
	display: flex;
	flex-flow: column wrap;
	width: 100%;
}

.cart_title_row {
	display: flex;
	flex-flow: row wrap;
	background: #f5f5f5;
	align-items: center;
	justify-content: flex-start;
	border-bottom: 1px solid silver;
}

.cart_title_cell {
	font-size: 0.9rem;
	text-align: center;
	font-weight: 550;
}

.cart_rows_container {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: flex-start;
	padding: 0px;
	border-bottom: 1px solid silver;
	margin: 0px auto;
	width: 100%;
	max-width: 73rem;
}

.cart_check_cell { 
	width: 2rem;
	display: inline-block;
	text-align: center;
}
.cart_check_cell.title { 
	cursor: pointer;
}

.cart_no_cell {
	display: inline-block;
	min-width: 2.5rem;
	text-align: center;
}

.cart_qid_cell {
	display: inline-block;
	width: 3.5rem;
	text-align: center;
}

.cart_quiz_cell {
	display: inline-block;
	max-width: 15rem;
	min-width: 12rem;
	cursor:hand; 
}

.cart_type_cell {
	display: inline-block;
	width: 10.2rem;
}

.cart_topic_cell {
	display: inline-block;
	width: 18rem;
}

.cart_level_cell{
	display: inline-block;
	width: 3rem;
}

.cart_qpoint_cell {
	display: inline-block;
	width: 2.7rem;
	text-align: center;
}

.cart_attempts_cell {
	display: table-cell;
	width: 4.5rem;
	text-align: center;
}

.cart_result_cell {
	display: table-cell;
	width: 2.4rem;
	text-align: center;
}

.cart_delete_cell {
	display: table-cell;
	width: 2.1rem;
	outline: 0px solid red;
	text-align: center;
}

.cart_footer_row {
	text-align: center;
}



/** qexam.php *********************************/
.qx_outmost_container {
	max-width: 73rem;
	padding: 10px 1rem;
	margin: 0px auto;
}

.qx_header {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-top: 10px;
	background: #fafafa;
	padding: 5px 5px;
	outline: 1px solid silver;
}

.qx_title {
	display: inline-block;
	vertical-align: middle;
	width: 20%;
	text-align: center;
	padding: 0px 10px;
	color: #444444;
	font-size:1.5rem; 
	font-family: Arial; 
	font-weight: 500; 
	line-height: 1;
	outline: 1px solid silver;
	background: #F2F4F6;

}

.qx_note_container {
	display: flex;
	flex-flow: column wrap;
	justify-content: flex-end;
	align-items: flex-end;
	padding: 5 5 0 5;
	max-width: 950px;
	outline: 0px solid gray;
	width: 75%; 
	justify-content: space-between;	
}

.qx_note {
	display: inline-block;
	font-size: 0.85rem;
	vertical-align: bottom;
	line-height: 1.2;
	color: #888;
	outline: 0px solid silver;
}

.qx_icon_box {
	display: inline-flex;
	flex-flow: row nowrap;
	text-align: right;
	flex: 1;
	
	button {
		border: 0px;
		background: transparent;
	}
}

.qx_body_container {
	display: flex;
	flex-flow: row nowrap;
	max-width: 950px;
	text-align:center; 
	justify-content: center;
	align-items: flex-start;	
}

.qx_main_table {
	display: flex;
	flex-flow: column nowrap;
	outline: 0px solid blue;
}

.qx_row {
	display: inline-flex;
	flex-flow: row nowrap;
	align-items: center;
}

.qx_row.title {
	background: #f5f5f5;
	border-top: 0px solid silver;
	border-bottom: 0px solid silver;
}

.qx_row.indexing {
	display: table-cell;
	text-align: center;
}


.qx_no_cell {
	display: table-cell;
	width: 3rem;
	outline: 1px solid silver;
}

.qx_exam_name_cluster {
	display: flex;
	justify-content: flex-start;
	width: 20rem;
	outline: 1px solid silver;
}

.qx_exam_name_cluster.title {
	justify-content: center;
}

.qx_exam_name_cell {
	display: table-cell;
	text-align: left;
	padding-left: 10px;
	width: 13rem;
}

.qx_inner_icon_box {
	display: table-cell;
	width: 7rem;
}

.qx_inner_icon_box button{
	border: 0px;
	background: transparent;
}

.qx_time_limit_cell {
	display: table-cell;
	width: 8rem;
	outline: 1px solid silver;
}

.qx_quiz_amount_cell {
	display: table-cell;
	width: 4rem;
	outline: 1px solid silver;
}

.qx_perfect_score_cell {
	display: table-cell;
	width: 3rem;
	outline: 1px solid silver;
}

.qx_exam_hit_cell {
	display: table-cell;
	width: 3rem;
	outline: 1px solid silver;
}

.qx_body_attached {
	display: table-cell;
	outline: 1px solid silver;
	text-align: justify;
	padding: 10px;
}
.qx_attached_title{
	text-align: center;
	width: 100%;
}

@media (max-width: 45rem) {
	.qx_body_attached {
		display: none;
	}
}

.qx_page_scale {
	border:0px; 
	width:14px; 
	height:14px; 
	background:transparent; 
	opacity:65%; 
	margin:0px;
}

.qx_page_scale.selected {
	color:blue;
	font-size:12px;
	font-weight:bold;
}


/*********************************************/
/* 페이징 스타일 */
.qb_paging { margin-top: 30px; padding: 15px; text-align: center; border-top: 1px dashed #ccc; }
.qb_paging a { padding: 3px 8px; text-decoration: none; color: #666; border: 1px solid #ddd; margin: 0 2px; font-size: 12px; }
.qb_paging b { padding: 3px 10px; background: #555; color: #fff; border: 1px solid #555; margin: 0 2px; font-size: 12px; }
.qb_paging .disabled { padding: 3px 8px; color: #ccc; border: 1px solid #eee; margin: 0 2px; font-size: 12px; cursor: default; }
.qb_paging a:hover { background: #f0f0f0; border-color: #bbb; }

/* 페이징 스타일 */
.qx_paging { margin-top: 30px; padding: 15px; text-align: center; border-top: 1px dashed #ccc; }
.qx_paging a { padding: 3px 8px; text-decoration: none; color: #666; border: 1px solid #ddd; margin: 0 2px; font-size: 12px; }
.qx_paging b { padding: 3px 10px; background: #555; color: #fff; border: 1px solid #555; margin: 0 2px; font-size: 12px; }
.qx_paging .disabled { padding: 3px 8px; color: #ccc; border: 1px solid #eee; margin: 0 2px; font-size: 12px; cursor: default; }
.qx_paging a:hover { background: #f0f0f0; border-color: #bbb; }


/******** bank_quiz.php *******************************/
/* 지문을 감싸는 컨테이너 스타일 */
.bq_passage {
	display: block;
	background:#fafafa;
	padding: 5px 10px;
	margin:0px 5px;
	outline: 0px solid silver;

    line-height: 1.6;        /* 가독성을 위한 줄간격 */
}

/* fieldset 태그 무력화 */
.bq_passage fieldset {
    border: none;            /* 테두리 삭제 */
    margin: 0;               /* 기본 여백 삭제 */
    padding: 0;              /* 안쪽 여백 삭제 */
    display: block;          /* 일반 div처럼 작동 */
}

/* [지문 번호 : **] 가 포함된 legend 태그 숨기기 */
.bq_passage legend {
    display: none;           /* 시각적으로 완전히 제거 */
}

.bq_container {
	display: flex;
	flex-flow: column nowrap;
	outline: 0px dashed red;
	padding: 0px; 
	margin:  0rem; 
	overflow-y: auto; 
	overflow-x: hidden;
}

.bq_navigation_bar {
	display: flex;
	align-items: center;
	justify-content:space-between;
	outline: 0px solid silver;
	width:96%;
}

.bq_navigations_arrows {
	display: inline-block;
	font-size:24px;
	width: 2rem;
}

.bq_base {
	text-align: center;
	vertical-align: baseline;
	align-self: center;
	font-weight: 500;
	color: #444;
	padding: 3px 10px;
	background: #f5f5f5;
	line-height: 1.4;
}

.bq_quiz_title {
	text-align: center;
	vertical-align: baseline;
	align-self: center;
	font-weight: 500;
	padding: 3px 10px;
	line-height: 1.4;
	display: inline-block;
	color: #fff;
	border-radius: 16px;
	background: #005148;
}

.bq_result_title {
	text-align: center;
	vertical-align: baseline;
	align-self: center;
	font-weight: 500;
	padding: 3px 10px;
	line-height: 1.4;
	display: inline-block;
	color: #fff;
	background: #336699;
	border-radius: 16px;
	width: fit-content;
}

.bq_passage_prefix {
	color: #0046d5;
	font-size: 0.9rem;
	background: #f2f4f6;
}

/*** 문항 렌더링 부분 *******************/
.q_body {
	display: block;
	flex-flow: column;
	outline: 0px solid silver;
	background: #fafafa;
	margin: 5px 5px;
	padding: 0px;
}

.q_quiz {
	display: block;
	padding: 10 0 0 10;
	width: 98%;
	outline: 0px solid silver;
}

.q_multiple_choices {
	display: block;
	padding: 5 0 0 0;
	/*width:100%;*/
	outline: 0px solid red;
}

.radio_button, .choice_number {
	padding:0px; 
	outline:0px none red;
}

.radio_button {
	padding-top:5px;
}

.h_source {
	width:80%;
	text-align:center;
	vertical-align:baseline;
}

.column_titles_container {
	display: inline-flex;
	flex-flow: row nowrap;
	outline:0px solid gray;
	padding:0px;
	/*background:orange;*/
}

.section_container {
	display: inline-flex;
	flex-flow: row nowrap;
	justify-content:flex-start;
	outline:0px solid silver;
}

.choices_container {
	display: flex;
	flex-flow: row wrap;
	outline:0px solid orange;
	padding:0px;
	/*background:brown;*/
}

.column_core_A, .column_core_B, .column_core_C {
	/*padding:0 0 0 5;*/
	/*margin:0 0 0 5;*/
	outline: 0px solid magenta;
	text-align:justify;
	white-space: nowrap;
}

.one_row_img_container {
	display: flex;
	flex: wrap;
	outline:0px solid lightblue;
	padding:0px;
	justify-content:flex-start;
	width:98%;
}

.choices_img {
	display: flex;
	
	flex-flow: column nowrap;
	justify-content:flex-start;
}

.choice_core_img {
	outline:0px solid green;
}

.one_row_container {
	display: flex;
	flex-flow: row wrap;
	outline:0px solid red;
	padding:0;
	width:98%;
}

.one_row_not_even {
	display: flex;
	flex-flow: row wrap;
	outline:0px solid red;
	padding:0px;
	margin:0px/
	width:100%;
	justify-content: space-between;
}

/*********************************/
.common_row_container {
	display: flex;
	flex-flow: row wrap;
	outline:0px solid red;
	padding:0px;
	margin:0px;
	justify-content: flex-start;
}

.common_cell {
	display: flex;
	outline:0px solid lightblue;
	padding:0px;
}

.pre_space {
	display: flex;
	flex-wrap: nowrap;
	outline:0px solid red;
	width: 3rem;
	padding: 0px;
	align-self: center;
}

.common_choice_core {
	display: table-cell;
	/*background: #f0f0f0;*/
	text-align: justify;
	margin:0px;
	padding:0px;
}

.number_cell {
	display: table-cell;
	padding:0px; 
	outline:0px none red;
}

.radio_cell {
	display: table-cell;
	padding:0px; 
	outline:0px none red;
	margin-top:0.14rem;
}

/********************************/
.one_fifth_container {
	display: inline-flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	outline:0px dotted blue;
	width: 7.5rem;
}

.one_row_cell {
	display: inline-flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	outline:0px dotted blue;
	padding:0px;
	margin: 0px;
}

.choice_core {
	/*background: #f0f0f0;*/
	text-align: justify;
	margin:0px;
	padding:0px;
}

.two_rows_container {
	display: inline-flex;
	flex-wrap: wrap;

}

.one_third_container {
	display: inline-flex;
	flex-wrap: nowrap;
	outline: 0px solid brown;

}

.one_third_container:nth-child(5) {
	width: 20rem;
}

.three_rows_container {
	display: flex;
	flex-wrap: wrap;
	outline: 0px dotted blue;
}

.half_container {
	display: inline-flex;
	flex-wrap: nowrap;
	outline: 0px solid silver;
	/*width: 19rem;*/
}

.half_container:nth-child(5) {
	display: inline-flex;
	flex-wrap: nowrap;
	outline: 0px solid pink;
	/*width: 39rem;*/
}

.five_rows_container {
	display: flex;
	flex-wrap: wrap;
	outline: 0px dotted red;
	width: 98%;
}

.whole_container {
	display: flex;
	flex-wrap: nowrap;
	outline: 0px solid blue;
	/*max-width: 40rem;*/
}

/*
@media (max-width:550px) {
	.column_titles_container .section_container:nth-child(2) {
		display: none
	}
}
*/

.following_space {
	width:1rem;
	outline:0px solid red;
	/* background:#fafafa; */
}

.dummy_space {
	width: 2rem;
	outline:0px solid red;
}

.quiz_spec_row {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	border: 0px solid blue;
	width: 100%;
	padding: 0px 5px;
	margin-top: 5px;
}

.quiz_spec_container {
	display: table;
	flex-flow: row nowrap;
	border-width: 1px;
	border-color: #def;
	border-style: solid;
}

.quiz_spec_container.right {
	float: right;
	margin-right: 5px;
}

.qb_qspec_title {
	display: table-cell;
	font-size:12px; 
	color:#444444; 
	text-align:right; 
	background-color:#f5f5f5; 
	padding: 2px 3px;  
	line-height: 100%;
	outline: 0px solid blue;
}

.qb_qspec {
	display: table-cell;
	font-size:12px; 
	color:#444444; 
	text-align:left; 
	padding: 2px 3px; 
	line-height: 100%;
	outline: 0px solid red;
}

.qb_qspec.red {
	color:red; 
}

.admin_hidden {
	display: table-cell;
}

.quiz_spec_cluster {
	display: flex;
	flex-flow: column;
}

.leading_space {
	display: flex;
	flex-wrap: nowrap;
	outline:0px solid red;
	width: 3rem;
}

.delimiter {
	width: 3rem;
	text-align:center;
	outline: 0px solid silver;
}

input[type="radio"] {
  width: 1rem; /* Adjust as needed */
  height: 1rem; /* Keep height and width similar for a circular shape */
  /*border-radius: 50%; /* Ensures a circular shape */
  /* Add other styling as desired */
}

.single_header {
	display: flex;
	outline: 0px sold red;
	flex: nowrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.qb_src {
	display: table-cell;
	color:#759540; 
	padding-left: 10px;
	font-size: 0.9rem;
}

.q_source {
	display: inline-block;
	color:#759540; 
	padding-left:0rem;
	font-size:0.9rem;
	line-height: 1;
	outline: 0px solid brown;
}

.result_view {
	display: table-cell;
	align-items: center;
	background: #f5f5f5;
	padding: 5p;
}

.article_commentary {
	border: 1px dotted silver;
	padding: 0 5 0 5;
	margin: 5 10 15 10; 
	vertical-align:top;
}

.hidden_radio {
	visibility: hidden;
}

.no_radio {
	display: none;
}

.explanation {
	display: flex;
	flex-flow: column wrap;
	padding: 0px 5px 5px;
	margin-top: 10px;
	outline: 0px solid brown;
}

.response_container {
	display: flex;
	align-items: center;
	border: 1px dotted silver;
	padding: 0px;
	margin: 0px;
	line-height: 100%;
}

.response_container:nth-child(1) {
	display: table-cell;
	border: 0px solid blue;
	margin-top: 0px;
}

.response_container:nth-child(2) {
	background: #f5f5f5;
	border-width: 1 1 0 1;
}

.result_container {
	display: inline-flex;
	align-items: center;
	border-width: 1 1 0 1; 
	border-style: dotted;
	border-color: silver;
}

.result_container:nth-child(1) {
	border-width: 1 0 0 1; 
}

.result_container:nth-child(3) {
	float: right;
}

.response {
	display: table-cell;
	color: blue;
	font-weight: bold;
	text-align: center;
	padding: 5 10 5 10;
	line-height: 100%;
}

.qb_OX {
	display: table-cell;
	vertical-align:middle;
	padding: 5 10 5 10;
	font-size:1.5rem; 
	font-family:Arial; 
	font-weight:bold; 
	color:red; 
	text-align: center; 
	line-height: 1;
}

.corr_ans_containger {
	display: inline-flex;
	align-items: center;
	background-color:#f5f5f5; 
}

.correct_answer {
	display: inline-block;
	vertical-align: middle;
	padding: 10px;
	line-height: 100%;
	color: blue;
	font-weight: bold;
}
 
.q_commentary {
	display: table-cell;
	padding: 5px;
}

.no_response {
	outline: 0px solid blue;
	padding: 5px;
	color: red;
}

.result_title {
	background: #f5f5f5;
	padding: 5px;
}

.multi_header_title_row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	margin: 10;
	/*background: #f5f5f5;*/
	justify-content:space-between;
}

.multi_header_container {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 10;
	/*background: #f5f5f5;*/
	justify-content:flex-start;
	border-top: 1px solid silver;
	border-bottom: 1px solid silver;
}

.q_amount, .examinee {
	padding:5px;
}

.qb_qspec_pair {
	display: inline-flex;
	flex-wrap: nowrap;
	margin: 0px 10px;
}

.qb_input {
	background-color:#dddddd; 
	border:1px solid silver; 
	font-size:1rem padding:0; 
	font-family:Arial; 
	cursor:hand;
}

.exam_spec {
	display: flex;
	outline: 0px sold red;
	flex: nowrap;
	justify-content: center;
	align-items: center;
	border-top: 0px solid silver;
	border-bottom: 1px solid silver;
	margin: 0 10 0 10;
}

/***********statistics.php 관련 부분*************************************************/
.st0_body {
	display: table;
	max-width: 950px;
}

.st0_title_row {
	display: flex;
	flex-flow: row wrap;
	background: #f5f5f5;
	align-items: center;
	justify-content: flex-start;
	border-bottom: 1px solid silver;
}

.st0_title {
	display: inline-block;
	vertical-align: middle;
	padding: 10;
	color: #444444;
	font-size: 1.3rem; 
	font-family: Arial; 
	font-weight: 500; 
	line-height: 1;
	outline: 0px solid silver;
	background: #F2F4F6;
}

.st0_user_section {
	display: flex;
	max-width: 950px;
	outline: 0px solid silver;
	justify-content: space-between;
}	

.st0_user_info_box {
	display: table-cell;
	flex: 1;
	outline: 0px solid silver;
}

.st0_selecting_box {
	display: table-cell;
	flex: 1;
	outline: 0px solid silver;
	text-align: right;
	align-self: center;
}


.st0_type_cell {
	text-align: left;
	padding-left: 1rem;
	font-size: 0.9rem;
}

.st0_note {
	test-align: center;
	min-width: 2.8rem;
	font-size: 0.9rem;
	outline: 0px;
	line-height: 200%;
	padding: 0px;
	margin: 0px;
}

.st0_rows_container {
	display: flex;
	flex-flow: row wrap;
	outline: 0px solid silver;
	align-items: center;
	padding: 0px;
	border-bottom: 0px solid silver;		
}

.st0_first_row_cells {
	display: table-cell;
	flex: 1;
	text-align: center;
	font-size: 0.9rem;
	outline: 0px solid silver;
	min-height: 3rem;
	padding-top: 0rem;
	min-width: 1.5rem;
	background: #f5f5f5;
}

.st0_blue {
	/*color: #0047ab;*/  /* cobalt blue */
	color: #007fff;		/* azure */
	cursor: default;
}

.st0_cell_strikediag {
  position: relative;
  font-size: 0.9rem;
  /*min-width: 8rem; */   /* adjust as needed */
  /*min-height: 1rem;*/   /* adjust as needed */
  padding: 0;
  overflow: hidden;
}

/* draw the diagonal */
.st0_cell_strikediag::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top right,
    transparent 49.5%, currentColor 50%, transparent 50.5%);
  pointer-events: none;
}


.st0_cell_strikediag .st0_top-right {
  position: absolute;
  top: 4px;
  right: 6px;
  white-space: nowrap;
  outline: 0px solid red;
  line-height: 100%;
  font-size: 0.8rem;
}
	
.st0_cell_strikediag .st0_bottom-left {
  position: absolute;
  bottom: 4px;
  left: 6px;
  white-space: nowrap;
  line-height: 100%;
  font-size: 0.8rem;
}

.st0_table_cells {
	text-align: center;
	min-width: 2.8rem;
	font-size: 0.9rem;
	outline: 0px;
	line-height: 200%;
	padding: 0px;
	margin: 0px;
}


/*** personal_quiz_record.php -> personal_history.php ******/
.ph_title {
	display: flex;
	flex-flow: row wrap;
	background: #f5f5f5;
	align-items: center;
	justify-content: flex-start;
	border-bottom: 1px solid silver;
}

.ph_user_section {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: space-between;
	max-width: 950px;
	gap: 1rem;
}
	
.ph_user_info_box {
	display: table-cell;
	white-space: nowrap;
}

.ph_selecting_box {
	display: table-cell;
	white-space: nowrap;
}

.ph_table {
	display: flex;
	flex-flow: column nowrap;
	max-width: 73rem;
}

.ph_title_row {
	display: flex;
	flex-flow: row wrap;
	background: #f5f5f5;
	align-items: center;
	border-bottom: 1px solid silver;
	text-align: center;
}

.ph_title_cell {
	display: inline-block;
	height: 2.5rem;
	font-size: 0.9rem;
	line-height: 120%;
	background: #f5f5f5;
	border-top: 1px solid silver;
	padding-top: 3px;
	cursor: arrow;
}

.ph_rows_container {
	display: flex;
	flex-flow: row wrap;
	outline: 0px solid silver;
	align-items: center;
	padding: 0px;
	border-bottom: 0px solid silver;		
}


.ph_no_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 3rem;
	flex: 1;
	word-break: break-all;
	min-width: 2.5rem;
	text-align: center;
}

.ph_qid_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 3rem;
	flex: 1;
	word-break: break-all;
	min-width: 2.5rem;
	text-align: center;
}

.ph_quiz_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 12rem;
	flex: 4;
	min-width: 9rem;
	vertical-align: middle;
	padding-left: 0.5rem;
	
	a {
		cursor: pointer;
	}
}

.ph_type_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 10.2rem;
	flex: 3.4;
	min-width: 6rem;
	padding-left: 0.5rem;
}

.ph_topic_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 18rem;
	flex: 6;
	min-width: 6rem;
	padding-left: 0.5rem;
}

.ph_level_cell{
	display: inline-block;
	outline: 1px solid silver;
	width: 3rem;
	flex: 1;
	text-align: center;
}

.ph_qpoint_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 2.7rem;
	flex: 0.9;
	text-align: center;
}


.ph_date_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 4.8rem;
	flex: 1.6;
	word-break: break-all;
}

.ph_attempts_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 2.4rem;
	flex: 0.8;
	text-align: center;
}

.ph_result_cell {
	display: inline-block;
	outline: 1px solid silver;
	width: 2.4rem;
	flex: 0.8;
	text-align: center;
}

media (max-width: 53rem) { 
	.ph_correct_rate_cell {
		display: none;
	}
}

@media (max-width: 51rem) { 
	.ph_ttl_applicants_cell {
		display: none;
	}
}

@media (max-width: 47rem) { 
	.ph_no_cell, .ph_qid_cell{
		display: none;
	}
}

@media (max-width: 44rem) { 
	.ph_level_cell, .ph_attempts_cell {
		display: none;
	}
}

@media (max-width: 42rem) { 
	.ph_topic_cell {
		display: none;
	}
}	


.ph_page_indexing_row {
	text-align: center;
}

.ph_footer_row {
	text-align: center;
}

/*** quiz_statistics.php ***/
.qs_title_row {
	display: flex;
	flex-flow: row wrap;
	background: #f5f5f5;
	align-items: center;
	justify-content: flex-start;
	border-bottom: 1px solid silver;
}

.qs_thm9 {
	font-family: tahoma;
	font-size: 0.9rem;
}

.qs_input {
	background-color:#dddddd; 
	border:1px solid silver; 
	font-size:1rem padding:0; 
	font-family:Arial; 
	cursor:hand;
}

/* 북마크 별 아이콘 스타일 */
.qb_star_icon { 
	/*font-family: Arial, "Segoe UI Emoji", "Segoe UI Symbol", "Noto Emoji", Symbola;*/
	font-size: 1.1rem;
	transition: all 0.2s; 
	font-weight: 600;
	cursor: pointer; 
	display: inline-block; 
}

.qb_star_icon:hover { 
	transform: scale(1.3); 
	color: #005148; 
	font-weight: 600;
} /* 호버 시 녹색 계열 살짝 노출 */
/* 활성 상태는 qb_cart_js.php의 refreshBookmarks()가 제어: ★, red */

.qb_star_icon.manager { 
	font-size: 1.5rem;
	color: #005148;
}

.qb_star_icon.title { 
	font-size: 1.2rem;
	color: #005148;
}