.fs10 { font-size: 10px !important; }
.fs15 { font-size: 15px !important; }
.fs20 { font-size: 20px !important; }
.fs25 { font-size: 25px !important; }
.fs30 { font-size: 30px !important; }
.fs35 { font-size: 35px !important; }
.fs40 { font-size: 40px !important; }
.fs45 { font-size: 45px !important; }
.fs50 { font-size: 50px !important; }


/***keyword  자동완성 ***/
#auto_keywordlist {
    border: 1px solid #ccc;
    display: none;
    position: absolute;
    background: #fff;
    width: 550px;
    max-height: 350px;
    overflow-y: auto;
    z-index: 999999;

	/* 그림자, 모서리 둥글게 */
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 6px;

    /* 부드러운 트랜지션 */
    transition: all 0.2s ease-in-out;
}

#auto_keywordlist div {
    padding: 10px 15px;
    cursor: pointer;
    font-size: 14px;
    color: #333;
    transition: background 0.2s, color 0.2s;
    display: flex;
    align-items: center;
}

/* Hover 시 배경 강조 + 아이콘 추가 */
#auto_keywordlist div:hover {
    background-color: #f0f0f0;
    color: #111;
}

/* 키보드 선택(active) */
#auto_keywordlist div.active {
    background-color: #8CC2FF;
    color: #fff;
}

/* 강조된 검색어 빨간색 + 굵게 */
#auto_keywordlist div span {
    color: #e53935;
    font-weight: bold;
}

/* 검색 결과 없음 스타일 */
#auto_keywordlist .no-result {
    color: #999;
    cursor: default;
    padding: 10px 15px;
    text-align: center;
    font-style: italic;
}

/* 스크롤바 스타일 (Webkit) */
#auto_keywordlist::-webkit-scrollbar {
    width: 6px;
}

#auto_keywordlist::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,0.2);
    border-radius: 3px;
}

#auto_keywordlist::-webkit-scrollbar-track {
    background-color: rgba(0,0,0,0.05);
}



/****radio*****/

:root{
  --btn-bg:#f6f7fb; --btn-bd:#d8dbe6; --btn-tx:#333;
  --btn-on-bg:#4f46e5; --btn-on-bd:#4338ca; --btn-on-tx:#fff;
  --btn-hov-bg:#eef0f7; --btn-focus:#60a5fa; --btn-disabled:#c9ceda;
  --radius-pill:9999px; --radius-seg:5px;
  --gap:8px; --pad-y:10px; --pad-x:14px; --font:14px;
}

/* 시각 숨김(접근성용) */
.visually-hidden{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* 공통 그룹 */
.radio-btn-group{
  display:flex; flex-wrap:wrap; gap:var(--gap);
  font-size:var(--font); line-height:1;
}

/* 공통 버튼 라벨 */
.radio-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:var(--pad-y) var(--pad-x);
  border:1px solid var(--btn-bd);
  background:var(--btn-bg); color:var(--btn-tx);
  cursor:pointer; user-select:none; transition:.15s ease;
  gap:8px;
}

/* 아이콘(선택 사항: Font Awesome 등) */
.radio-btn i{ font-size:1.05em; }

/* hover */
.radio-btn:hover{ background:var(--btn-hov-bg); }

/* focus(키보드 접근) */
input[type="radio"]:focus-visible + .radio-btn{
  outline:3px solid var(--btn-focus); outline-offset:2px;
}

/* checked */
input[type="radio"]:checked + .radio-btn{
  background:var(--btn-on-bg); border-color:var(--btn-on-bd); color:var(--btn-on-tx);
  box-shadow:0 2px 6px rgba(79,70,229,.25);
}

/* disabled */
input[type="radio"]:disabled + .radio-btn{
  opacity:.55; cursor:not-allowed; background:#f3f4f8; border-color:var(--btn-disabled);
}

/* ── 1) 필(알약)형: 각각 독립 버튼 ── */
.radio-pill .radio-btn{ border-radius:var(--radius-pill); }

/* 사이즈 옵션 */
.radio-sm .radio-btn{ --pad-y:5px; --pad-x:12px; --font:13px; }
.radio-lg .radio-btn{ --pad-y:12px; --pad-x:18px; --font:15px; }

/* ── 2) 세그먼트형: 한 줄 분할 버튼 ── */
.radio-seg{
  display:inline-flex; border:1px solid var(--btn-bd); border-radius:var(--radius-seg); overflow:hidden;
}
.radio-seg .seg-item{ position:relative; }
.radio-seg input{ /* 시각 숨김 */ }
.radio-seg .radio-btn{
  border:0; border-right:1px solid var(--btn-bd); background:var(--btn-bg); min-width:52px;
}
.radio-seg .seg-item:last-child .radio-btn{ border-right:0; }
.radio-seg input:checked + .radio-btn{
  background:var(--btn-on-bg); color:var(--btn-on-tx);
}
.radio-seg input:focus-visible + .radio-btn{
  outline:3px solid var(--btn-focus); outline-offset:-3px; /* 테두리 안쪽 */
}



.select_wating{
	max-width: 100%;
    margin: 0px auto;
    padding: 100px 22px;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    background: #ffffff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    text-align: center;
    font-size: 25px;
    font-weight: 600;
    color: #333;
}

.sort_table {
    counter-reset: rowNumber;
}

.sort_table tr {
    counter-increment: rowNumber;
}

.sort_table tr td.sort_no::before {
    content: counter(rowNumber);
}


.Ath{background:#393C64 !important;color:#ffffff !important;}
.mp0{margin:0px !important;padding:0px !important;}



.exam-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  cursor: pointer;
  user-select: none;
}

/* 기본 체크박스 숨김 */
.exam-checkbox input {
  display: none;
}

/* 시험지 스타일 박스 */
.exam-checkbox .cbox {
  width: 22px;
  height: 22px;
  border: 2px solid #000;
  box-sizing: border-box;
  position: relative;
  background: #fff;
}

/* 체크 표시 */
.exam-checkbox input:checked + .cbox::after {
  content: "✓";
  position: absolute;
  left: 2px;
  top: -2px;
  font-size: 18px;
  font-weight: bold;
  color: #C22629;
}

.exam-checkbox input:checked + .cbox {
  background-color: #ffffff;  /* 보라색 */
  border-color: #C22629;
}
.as_poiner{cursor:pointer !important;}








/****관리자 상단 작업내역 변경하는 타이틀 부분***/
.editable-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 30px;
  background-color: #5656EF;  /* 보라색 */
  color: white;
  font-size: 16px;
  font-weight: bold;
  border-radius: 10px;  /* 라운드 형태 */
  text-decoration: none;  /* 기본 링크 스타일 제거 */
  cursor: pointer;  /* 클릭 가능 아이콘 커서 */
  transition: background-color 0.3s ease, transform 0.2s ease;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);  /* 살짝 그림자 */

}

/* 펜 아이콘 크기 및 위치 조정 */
.editable-title .icon {
  font-size: 22px;  /* 아이콘 크기 */
  color: white;
  font-weight:bold;
  transition: transform 0.2s ease;
}

/* 클릭 가능함을 바로 인식할 수 있도록 */
.editable-title:focus {
  outline: 2px solid #ffffff;  /* 포커스 시 외곽선 추가 */
  outline-offset: 2px;
  color: white;
}

/* hover 상태 - 클릭 가능함을 강조 */
.editable-title:hover {
  background-color: #2C2CEB;  /* 어두운 보라색 */
  transform: scale(1.05);  /* 살짝 커짐 */
  color: white;
}


/* 아이콘 hover 효과 - 살짝 확대 */
.editable-title:hover .icon {
  transform: scale(1.2);  /* 마우스를 올렸을 때 아이콘 커짐 */
  color: white;
}

/******************************************************/
/************** 최종문제 분야별 탭부분 *********************/
/******************************************************/
.FE_container {
	width: 100%;
	display: flex;
}
/* 좌측 '전체' 영역 */
.FE_status-total {
	width: 6%; /* 좌측 영역 비율 */
	height:50px;
	padding: 3px; 
	background-color: #ffffff;
	border: 2px solid #ccc;
	border-radius: 10px;
	text-align: center;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	position: sticky;
	top: 0;
	z-index: 1; /* 다른 요소들 위로 올라오도록 설정 */
}
.FE_status-total:hover {
	background-color: #e7f4ff; /* 배경색을 살짝 파란색으로 변경 */
	border-color: #3498db; /* 테두리 색상 변경 */
	box-shadow: 0 4px 10px rgba(52, 152, 219, 0.1); /* 그림자 효과 추가 */
	transform: translateY(-5px); /* 살짝 위로 올려서 활성화 느낌 추가 */
	cursor: pointer; /* 마우스가 올라갔을 때 손가락 커서 표시 */
	transition: all 0.3s ease; /* 부드러운 전환 효과 */
}
.FE_status-total.on{
	background:#135495;
	color: #333;
}

.FE_status-total h3 {
	font-size: 16px;
	color: #333;
}
.FE_status-total.on h3 {
	font-size: 16px;
	color: #fff;
}

.FE_status-total p {
	font-size: 16px;
	color: #555;
}

.FE_status-total p {
	font-size: 13px;
	color: #555;
	font-weight:bold;
}
.FE_status-total.on p {
	font-size: 13px;
	color: #fff;
	font-weight:bold;
}
.FE_status-total p span.fcA{
	color:#D06800;
	font-size: 13px;
	font-weight:bold;
}

.FE_status-total p span.fcB{
	color:#0099FF;
	font-size: 13px;
	font-weight:bold;
}

.FE_status-total.on p span.fcA{
	color:#fff;
	font-size: 13px;
	font-weight:bold;
}

.FE_status-total.on p span.fcB{
	color:#fff;
	font-size: 13px;
	font-weight:bold;
}


/* 우측 '분야' 영역 */
.FE_status-table {
	width: 95%; /* 우측 영역 비율 */
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: flex-start;
	margin-left: 10px;
}
/**우측박스**/
.FE_status-box {
	width: 174px;
	padding: 5px;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 10px;
	text-align: center;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.FE_status-box:hover {
	background-color: #e7f4ff; /* 배경색을 살짝 파란색으로 변경 */
	border-color: #3498db; /* 테두리 색상 변경 */
	box-shadow: 0 4px 10px rgba(52, 152, 219, 0.1); /* 그림자 효과 추가 */
	transform: translateY(-5px); /* 살짝 위로 올려서 활성화 느낌 추가 */
	cursor: pointer; /* 마우스가 올라갔을 때 손가락 커서 표시 */
	transition: all 0.3s ease; /* 부드러운 전환 효과 */
}
.FE_status-box.on{
	background:#135495;
	color: #333;
}
.FE_status-box h3 {
	font-size: 13px;
	color: #333;
}
.FE_status-box.on h3 {
	font-size: 13px;
	color: #fff;
}
.FE_status-box p {
	font-size: 13px;
	color: #555;
	font-weight:bold;
}
.FE_status-box.on p {
	font-size: 13px;
	color: #fff;
	font-weight:bold;
}
.FE_status-box p span.fcA{
	color:#D06800;
	font-size: 13px;
	font-weight:bold;
}

.FE_status-box p span.fcB{
	color:#0099FF;
	font-size: 13px;
	font-weight:bold;
}

.FE_status-box.on p span.fcA{
	color:#fff;
	font-size: 13px;
	font-weight:bold;
}

.FE_status-box.on p span.fcB{
	color:#fff;
	font-size: 13px;
	font-weight:bold;
}


/*********************************/


:root {
	--mg-primary: #4f46e5;
	--mg-text: #1f2937;
	--mg-sub-text: #6b7280;
	--mg-border: #e5e7eb;
	--mg-bg: #f3f4f6;
	--mg-card-bg: #ffffff;
	--mg-danger: #e11d48;
}


/* 2. 리스트 컨테이너 (세로로 쌓임) */
.MG_list-wrap {
	display: flex;
	flex-direction: column; /* 무조건 한 줄에 하나씩 */
	gap: 10px; /* 항목 사이 간격 */
	max-width: 1000px;
	margin: 0 auto;
}

/* 3. 개별 와이드 카드 스타일 */
.MG_item {
	background-color: var(--mg-card-bg);
	border: 1px solid var(--mg-border);
	border-radius: 7px;
	padding: 20px 24px;
	display: flex; /* 내부 요소를 가로로 배치 */
	align-items: center; /* 세로 중앙 정렬 */
	gap: 24px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.03);
	transition: all 0.2s ease;
	cursor: pointer;
}

/* 호버 효과 */
.MG_item:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 16px rgba(0,0,0,0.06);
	border-color: #c7d2fe;
}
.MG_item.active {
	border-color: #1661AE; /* 테두리를 메인 색상으로 */
	background-color: #eef2ff;       /* 배경을 아주 연한 인디고 색으로 */
	z-index: 0; /* 겹쳐진 그림자보다 위로 올라오게 설정 */
}
/* 4. 영역별 스타일링 */

/* (1) 왼쪽: 상태 배지 영역 */
.MG_col-status {
	flex-shrink: 0; /* 줄어들지 않음 */
	width: 110px;
	z-index:999;
}

/* 라디오 버튼 스타일 (캡슐형) */
.MG_radio-wrap {
	display: inline-flex;
	background-color: #f9fafb;
	padding: 3px;
	border-radius: 20px;
	border: 1px solid #f3f4f6;
}

.MG_radio-group {
	position: relative;
	cursor: pointer;
	font-size: 12px;
	font-weight: 700;
	padding: 6px 12px;
	border-radius: 16px;
	color: #9ca3af;
	transition: all 0.2s;
	line-height: 1;
	text-align: center;
}

.MG_radio-group input { display: none; }

.MG_radio-group:has(input:checked[value="Y"]) {
	background-color: white; color: var(--mg-primary); box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}
.MG_radio-group:has(input:checked[value="N"]) {
	background-color: white; color: var(--mg-danger); box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

/* (2) 중앙: 제목 및 날짜 영역 */
.MG_col-content {
	flex-grow: 1; /* 남은 공간 모두 차지 */
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.MG_tit {
	font-size: 17px;
	font-weight: 700;
	color: var(--mg-text);
	margin: 0;
}

.MG_date {
	font-size: 14px;
	color: var(--mg-sub-text);
	display: flex;
	align-items: center;
	gap: 6px;
}

/* 날짜 옆 작은 점 */
.MG_date::before { content: ''; display: block; width: 4px; height: 4px; background: #cbd5e1; border-radius: 50%; }

/* (3) 오른쪽: 버튼 영역 */
.MG_col-actions {
	flex-shrink: 0;
	display: flex;
	gap: 8px;
}

.MG_btn {
	padding: 5px 11px;
	font-size: 13px;
	font-weight: 600;
	border-radius: 3px;
	text-decoration: none;
	transition: background-color 0.2s;
	white-space: nowrap; /* 버튼 텍스트 줄바꿈 방지 */
}

.MG_btn-del { background-color: #fff1f2; color: var(--mg-danger);border:1px solid #DB0000; }
.MG_btn-del:hover { background-color: #DB0000; color:#ffffff;}

.MG_btn-copy { background-color: #E3FFF1; color: #008A45; border:1px solid #008A45;}
.MG_btn-copy:hover { background-color: #006231;color: #ffffff;}






/*********/
.answer-con {
    position: relative;
}

/* li는 한 줄 전체 */
.answer-list li {
    width: 100%;
}

/* 번호 + 이미지 가로 배치 */
.answer-list li a {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    justify-content: flex-start;
    text-align: left;
}

/* 이미지 150px, 왼쪽 고정 */
.answer-list img {
    width: 150px;
    height: auto;
    display: block;
    margin: 0;
}
.answer-list video {
    width: 250px;
    height: auto;
    display: block;
    margin: 0;
}


.f_yellow{color:#FFFF00}




/*****형성평가 안내 폼******/

.write-table .editor-cell {
    padding: 0px;
    border: 0;
    vertical-align: top;
}

.write-table .gap-cell {
    width: 10px;
    border: 0;
}

/* 카드형 박스 */
.editor-box {
    background: #fff;
    border: 1px solid #e2e6ea;
    border-radius: 8px;
    padding: 10px;
    height: 100%;
    box-sizing: border-box;
}

/* 제목 */
.editor-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 14px;
    padding: 10px 12px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 10px;
	
}

/* 좌측 컬러 바 */
.editor-title::before {
    content: "";
    width: 4px;
    height: 18px;
    border-radius: 2px;
    background: currentColor;
}

/* 전공의 */
.title-resident {
    color: #2563eb;           
    background: #eff6ff;
	border:1px solid #80B6FF;
}

/* 병원 */
.title-hospital {
    color: #059669;      
    background: #ecfdf5;
	border:1px solid #75F0B6;
}
/* textarea 기본 */
.editor-box textarea {
    width: 100%;
    min-height: 400px;
}
.h500{
	height:500px;
}

.notice-box {
    margin-bottom: 5px;
    padding: 7px 14px;
    font-size: 15px;
    line-height: 1.6;
    color: #AA0000;
    border: 1px solid #e5e7eb;
    border-left: 4px solid #9ca3af;

	background: #fff7ed;
    border-color: #fed7aa;
    border-left-color: #f97316;
	font-weight:bold;
}
/*****형성평가 안내 폼 END******/







.resident_pic {
    width: 90px;
    height: 90px;
    border-radius: 5%;
    object-fit: cover;
    display: block;
}
.resident_pic_s {
    width: 50px;
    height: 50px;
    border-radius: 5%;
    object-fit: cover;
    display: block;
}





/*****	통계계산하는 부분		******/



.menu-cards{
	display:grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap:16px;
}



/* 카드 */
.menu-card{
	display:block;
	text-decoration:none;
	background:#fff;
	border:1px solid #e6e9ef;
	border-radius:14px;
	padding:16px;
	min-height:120px;
	position:relative;
	overflow:hidden;
	color:#111827;
	box-shadow:0 6px 16px rgba(0,0,0,.05);
	transition:.15s;
}

.menu-card:hover{
	transform:translateY(-2px);
	border-color:#cbd5e1;
	box-shadow:0 10px 22px rgba(0,0,0,.08);
}

.menu-card:focus-visible{
	outline:none;
	box-shadow:0 0 0 3px rgba(59,130,246,.25);
	border-color:#93c5fd;
}

/* 내부 좌우 레이아웃 */
.menu-card__inner{
	display:flex;
	align-items:center;
	gap:14px;
}

/* 아이콘 영역 */
.menu-card__icon-wrap{
	flex:0 0 48px;
	display:flex;
	align-items:center;
	justify-content:center;
}

.menu-card__icon{
	width:140px;
	height:140px;
	border-radius:5px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#ffffff;
	font-size:55px;
}

/* 텍스트 영역 */
.menu-card__content{
	flex:1;
	min-width:0;
	padding-bottom:25px;
}

.menu-card__title{
	font-size:26px;
	font-weight:800;
	margin-bottom:4px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.menu-card__right{
	text-align:right;
	font-size:16px;
	font-weight:800;
	margin-bottom:4px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.menu-card__desc{
	font-size:13px;
	line-height:1.45;
	color:#6b7280;
}

/* 로딩 오버레이 */
.menu-card__loading{
	position:absolute;
	inset:0;
	background:rgba(255,255,255,.94);
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:10px;
	opacity:0;
	pointer-events:none;
	transition:.2s;
}
.menu-card {
    position: relative;
}
.menu-card.is-loading .menu-card__loading{
	opacity:1;
	pointer-events:auto;
}

.loading-text{
	font-size:14px;
	font-weight:700;
	color:#374151;
}

.progress-bar{
	width:70%;
	height:8px;
	background:#e5e7eb;
	border-radius:999px;
	overflow:hidden;
}

.progress{
	display:block;
	height:100%;
	width:0%;
	background:linear-gradient(90deg,#2563eb,#60a5fa);
	transition:width .25s ease;
}



/* 날짜 미니카드 */
.menu-card_confirm{
    position: absolute;
    right: 16px;
    bottom: 10px;
    
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 600;
    
    background:#D7EAFD;
    border:1px solid #96C8FA;
    color:#5E5E5E;
    border-radius:8px;
    
    white-space: nowrap;
    pointer-events: none; /* 클릭 방해 X */
}
.ready{
    background:#FFE3E3;
    border:1px solid #FFA2A2;
    color:#5E5E5E;
}


.stat-wrap {
	margin: 20px 0;
}

.stat-box {
	position: relative;
	padding: 10px 20px 10px 52px;
	border-radius: 8px;
	background: #f5f8ff;
	border: 1px solid #d5e0ff;
	color: #222;
	font-size: 14px;
	line-height: 1.6;
}

.stat-box::before {
	content: "i";
	position: absolute;
	left: 22px;
	top: 50%;
	transform: translateY(-50%);
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: #3366ff;
	color: #fff;
	font-weight: 700;
	font-size: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.stat-title {
	font-weight: 700;
	font-size: 22px;
	margin-bottom: 6px;
	color: #1a2a4a;
	padding-left:50px;
}

.stat-text {
	margin: 0;
	padding-left:50px;
}

/*****	통계계산하는 부분 END******/



/* 공통 카드 스타일 */
.left-card {
	border: 1px solid #d9d9d9;
	border-radius: 12px;
	background: #fff;
	padding: 20px;
	height: 350px;
	margin-right: 10px;
}
.right-card {
	border: 1px solid #d9d9d9;
	border-radius: 12px;
	background: #fff;
	padding: 20px;
	height: 450px;
	margin-left: 10px;
}






/****순위 표시***/

.td-rank {
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;       /* 줄바꿈 방지 */
}

/* 학회 사이트용 고급 라운드 뱃지 */
.rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 75px;           /* 최소는 동그랗게 보이게 */
    height: 38px;
    padding: 0 10px;           /* 숫자 많아지면 좌우로 자연스레 늘어남 */
    border-radius: 10px;
    font-size: 25px;
    font-weight: 700;
    font-family: 'Pretendard', sans-serif;
    box-sizing: border-box;

    background: #f5f8fe;
    border: 1px solid #d7ddea;
    color: #1f2633;
    position: relative;

    max-width: 100%;           /* 혹시 td가 너무 좁으면 안 깨지게 */
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 숫자 표시 */
.rank-badge:before {
    content: attr(data-rank);
}

/* st / nd / rd / th 공통 스타일 */
.rank-badge:after {
    content: "th";
    font-size: 11px;
    margin-left: 2px;
    vertical-align: super;
    position: relative;
    top: -4px;
    color: #4a5568; /* 은은한 회색 */
}

/* 1st, 2nd, 3rd 규칙 */
.rank-badge[data-rank$="1"]:after { content: "st"; }
.rank-badge[data-rank$="2"]:after { content: "nd"; }
.rank-badge[data-rank$="3"]:after { content: "rd"; }

/* 11,12,13은 th로 고정 */
.rank-badge[data-rank="11"]:after,
.rank-badge[data-rank="12"]:after,
.rank-badge[data-rank="13"]:after {
    content: "th" !important;
}

/* --- 상위 3개 강조 스타일 (학회 톤) --- */

/* 1위: 대표 포인트 컬러 (#0054a6) */
.rank-badge[data-rank="1"] {
    background: #0054a6;
    border-color: #003d7d;
    color: #fff;
}
.rank-badge[data-rank="1"]:after {
    color: #e4ecff;
}

/* 2위: 포인트 보조색 (네이비 라이트) */
.rank-badge[data-rank="2"] {
    background: #2f78c4;
    border-color: #285f9b;
    color: #fff;
}
.rank-badge[data-rank="2"]:after {
    color: #e8f1ff;
}

/* 3위: 블루그레이(학회 사이트톤과 잘 어울림) */
.rank-badge[data-rank="3"] {
    background: #6b8dbc;
    border-color: #526f95;
    color: #fff;
}
.rank-badge[data-rank="3"]:after {
    color: #eef3ff;
}



.past_number{
	background:#005AB5;
	color:#ffffff !important;
	font-size:20px !important;
	font-weight:bold;
}
.answer_number{
	background:#2B772F;
	color:#ffffff !important;
	font-size:20px !important;
	font-weight:bold;
}

.tbl-hover tr:hover {
    background: #DFEFFF;    /* 학회 사이트에서 자주 쓰는 연한 블루 */
    cursor: pointer;
	font-weight:bold;
}


.tbl-rank td{
	font-size:16px !important;
}

.present_td{
	color:green !important;
	font-weight:bold;

}
.absent_td{
	color:#FF9562 !important;
	font-weight:bold;
}

.pass_td{
	color:#0069D2 !important;
	font-weight:bold;

}
.fail_td{
	color:#C80000 !important;
	font-weight:bold;
}


.set_data_Tbl{
	border-top:1px solid #ffffff;
	border-left:1px solid #ffffff;
	font-size:13px;
	text-align:center;
}
.set_data_Tbl th{
	border-bottom:1px solid #ffffff;
	border-right:1px solid #ffffff;
	text-align:center;
}
.set_data_Tbl td{
	border-bottom:1px solid #ffffff;
	border-right:1px solid #ffffff;
	text-align:center;
}




/***전체현황 디자인 새로***/

/* 전체 컨테이너 */
.state-conbox_v2{
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

/* 첫 번째 줄(시험일~합격점수 4개짜리 박스) */
.state-conbox_v2 .box-wrap_v2{
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 30px;
}

/* 각 큰 박스 */
.box_v2{
    padding: 20px;
    box-shadow: 0 2px 10px rgba(178,178,178,0.5);
    border-radius: 10px;
    background: #fff;
    flex: 1;
    min-width: 320px;
}

/* 전체 한 줄 100% 차지할 때 */
.box_v2.full_v2{
    width: 100%;
    flex: 0 0 100%;
}

/* 박스 내부 리스트: 2개씩 좌우 배치 */
.box-list_v2{
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.box-list_v2 > li{
    width: 100%;
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

/* 내부 box : 2개씩 가로 배치 */
.box-con_v2{
    flex: 1;
    min-width: calc(50% - 8px);
    padding: 15px;
    border: 1px solid #cccccc;
    border-radius: 10px;
    font-size: 15px;
    min-height: 100px;
    background: #fafafa;
}

.box-con_v2.exam{
    background: #E2FCFC !important;
}
.box-con_v2.etc{
    background: #E8FFE8 !important;
}

.box-con_v2 .tit_v2{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: 700;
}

/* 접수현황 리스트 */
.state-list_v2{
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.state-list_v2 > li{
    display: flex;
    /*align-items: center; 글씨 세로센터 정렬*/ 
    justify-content: space-between;
    min-height: 75px;
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 10px;
    font-size: 15px;
    background: #fafafa;
}

.state-list_v2 > li strong{
    font-size: 18px;
    font-weight: 700;
}

/* 2개씩 배치되는 버전 */
.state-list_v2.n2{
    flex-direction: row;
    flex-wrap: wrap;
}

.state-list_v2.n2 > li{
    width: calc((100% - 15px)/2);
}

/* 숫자 카운트 */
.box_v2 .cnt_v2{
    margin-bottom: 0px;
    font-size: 30px;
    font-weight: 700;
}
.box_v2 .cnt_v2 strong{
    font-size: 45px;
    font-weight: 700;
}

/* 반응형 */
@media (max-width: 1024px){
    .box-con_v2{
        min-width: 100%;
    }
}


.box_v2.wide_v2{
    flex: 2; /* 기존은 flex:1, 여기만 2배 넓어짐 */
}



/****통계에서 날짜 나오는 부분 ****/

.period-info-line {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: right;
}

.period-info-line li {
    padding: 4px 0;
    font-size: 14px;
    color: #2d3748;
}

.period-info-line .label {
    font-weight: 600;
    color: #1a202c;
    margin-right: 8px;
}

.period-info-line .value {
    display: inline-block;
    border-bottom: 1px dashed #d0d7e2; /* 날짜만 점선 */
    padding-bottom: 2px;
    color: #0054a6;
    font-weight: 500;
}

.period-info-line .small {
    font-size: 12px;
    color: #9098a6;
    margin-left: 3px;
}









.status-card {
    list-style: none;
    width: 100%;
    border: 1px solid #d7dde6;
    border-radius: 12px;
    background: #f5f8fe;
    padding: 15px 18px;
    display: grid;
    grid-template-columns: auto 1fr; /* 2열 고정 */
    gap: 20px;
    align-items: start; /* 핵심: 좌측 상단 고정 */
}

/* 좌측 타이틀 – 항상 상단 왼쪽 */
.left-title strong {
    font-size: 16px;
    font-weight: 700;
    color: #0054a6;
    display: block;
    margin-top: 0;
}


/* 우측 값 영역 */
.right-values {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* 값 */
.value-item {
    font-size: 15px;
    font-weight: 600;
    color: #333;
	text-align:right !important;
}

.value-item.price {
    color: #d35400;
	font-size:22px;
}