/* 퀴즈 목록(quiz-board) · 퀴즈 참여(quiz-play) 전용
   화이트 카드 + 소면적 포인트 톤. 넓은 면적은 흰색/옅은 회색으로 두고 진한 색(#0d498c)은
   컬러바·배지·문항 번호·주 버튼 같은 작은 영역에만 쓴다.
   수치는 사이트에 이미 서 있는 규격을 따랐다 — 카드 라운드 14px(event4.css),
   배지 pill·틴트 #e8f0fa/#e9f6ee(wj-ticket-float.css·wj-modal.css), 그림자 3단계 규격.

   주의: base.css 의 a:link,a:active,a:visited { border:0px } 가 (0,1,1) 이라 <a> 에 테두리를 주는 규칙은
   부모를 물려 특이도를 올려야 한다(카드·목록으로 버튼). */

/* 페이지 타이틀 — 공통 .sub_tit02 3단 중 부제 <p> 를 쓰지 않으므로 p 가 만들던 간격(25px)을 h3 로 보정하고,
   영문 라벨(#00bff6)은 딥네이비 본문 톤에 맞춘다. 공통 정의를 건드리지 않도록 두 페이지 스코프 안에서만 덮는다. */
#quiz_list_wrap .sub_tit02 h3,
#quiz_play_wrap .sub_tit02 h3 {
    margin-top: 25px;
}

#quiz_list_wrap .sub_tit02 span,
#quiz_play_wrap .sub_tit02 span {
    color: #0d498c;
}

/* =====================================================================
   목록
   ===================================================================== */

.quiz-board {
    max-width: 860px;
    margin: 0 auto;
}

.quiz-board__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.quiz-board__section + .quiz-board__section {
    margin-top: 42px;
}

.quiz-board__section-title {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.4px;
    color: #1a1a1a;
}

.quiz-board__section-title span {
    margin-left: 4px;
    color: #0d498c;
}

.quiz-board__section-desc {
    font-size: 13.5px;
    color: #8a8a8a;
}

.quiz-board__list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* 카드 — <a> 라서 border 선언은 .quiz-board__item 을 물려 (0,2,0) 을 확보한다 */
.quiz-board__item .quiz-board__card {
    position: relative;
    display: block;
    padding: 24px 26px 20px 30px;
    border: 1px solid #e8edf2;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(7, 46, 89, .06);
    transition: transform .2s, box-shadow .2s, border-color .2s;
}

/* 좌측 컬러바 */
.quiz-board__card::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 14px 0 0 14px;
    background: #0d498c;
}

.quiz-board__item .quiz-board__card:hover {
    transform: translateY(-2px);
    border-color: #cddcec;
    box-shadow: 0 12px 26px rgba(7, 46, 89, .12);
}

.quiz-board__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.quiz-board__badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: -.3px;
    line-height: 1.3;
}

.quiz-board__badge i {
    font-size: 14px;
}

/* 오늘의 퀴즈 — 딥네이비 채움 배지 + 컬러바(기본값) */
.quiz-board__badge--today {
    background: #0d498c;
    color: #fff;
}

/* 지난 퀴즈(참여 가능) — 오늘 것과 색을 나눠 앰버 톤. 해설 전구 아이콘(#e0a53a)과 같은 계열이다 */
.quiz-board__badge--late {
    background: #fdf3e1;
    color: #9a6200;
}

.quiz-board__item--late .quiz-board__card::before {
    background: #e0a53a;
}

.quiz-board__badge--done {
    background: #f1f3f5;
    color: #868e96;
}

/* 응모권 지급 칩 — 매수가 0이면 JS 가 아예 만들지 않는다 */
.quiz-board__reward {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 999px;
    background: #e9f6ee;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: -.3px;
    line-height: 1.3;
    color: #1f7a45;
    white-space: nowrap;
}

.quiz-board__reward i {
    font-size: 14px;
}

.quiz-board__title {
    display: block;
    margin-top: 14px;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.4px;
    line-height: 1.4;
    color: #1a1a1a;
}

.quiz-board__desc {
    display: -webkit-box;
    overflow: hidden;
    margin-top: 8px;
    font-size: 15px;
    line-height: 1.6;
    color: #757575;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.quiz-board__foot {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 16px;
    padding-top: 15px;
    border-top: 1px solid #f1f4f7;
}

.quiz-board__meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13.5px;
    color: #8a8a8a;
}

.quiz-board__meta i {
    font-size: 15px;
    color: #aab6c2;
}

.quiz-board__go {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    font-size: 14.5px;
    font-weight: 700;
    color: #0d498c;
}

.quiz-board__go i {
    font-size: 16px;
    transition: transform .2s;
}

.quiz-board__card:hover .quiz-board__go i {
    transform: translateX(4px);
}

/* 참여가 끝난 퀴즈 — 열람은 되지만 한 톤 내리고 떠오르지 않는다 */
.quiz-board__item--done .quiz-board__card {
    background: #fbfcfd;
    box-shadow: none;
}

.quiz-board__item--done .quiz-board__card::before {
    background: #c9d3dc;
}

.quiz-board__item--done .quiz-board__title {
    color: #7b8794;
}

.quiz-board__item--done .quiz-board__card:hover {
    transform: none;
    border-color: #cddcec;
    box-shadow: 0 4px 14px rgba(7, 46, 89, .06);
}

.quiz-board__item--done .quiz-board__go {
    color: #8a97a4;
}

.quiz-board__empty {
    padding: 70px 20px;
    border: 1px dashed #dce3ea;
    border-radius: 14px;
    background: #fafbfc;
    text-align: center;
    font-size: 15px;
    color: #8a8a8a;
}

.quiz-board__empty i {
    display: block;
    margin-bottom: 10px;
    font-size: 34px;
    color: #b6c2ce;
}

/* 섹션 안이 비었을 때 — 섹션은 남기고 한 줄 안내만 */
.quiz-board__section-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 24px 20px;
    border: 1px dashed #dce3ea;
    border-radius: 14px;
    background: #fafbfc;
    font-size: 14.5px;
    color: #8a8a8a;
}

.quiz-board__section-empty i {
    font-size: 18px;
    color: #b6c2ce;
}

/* =====================================================================
   참여 완료 — 한 줄 행 + 아코디언
   ===================================================================== */

.quiz-board__past {
    overflow: hidden;
    border: 1px solid #e8edf2;
    border-radius: 12px;
    background: #fff;
}

.quiz-board__past-item + .quiz-board__past-item {
    border-top: 1px solid #f1f4f7;
}

/* <button> 이라 UA 기본값(가운데 정렬·회색 배경·작은 폰트·테두리)을 지운다 */
.quiz-board__past-head {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 17px 20px;
    border: 0;
    background: #fff;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color .2s;
    -webkit-appearance: none;
    appearance: none;
}

.quiz-board__past-head:hover {
    background: #fafbfc;
}

.quiz-board__past-ico {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 13px;
}

.quiz-board__past-ico--correct {
    background: #e8f0fa;
    color: #0d498c;
}

.quiz-board__past-ico--done {
    background: #f1f3f5;
    color: #8a8a8a;
}

.quiz-board__past-body {
    flex: 1 1 auto;
    min-width: 0;
}

.quiz-board__past-title {
    display: block;
    overflow: hidden;
    font-size: 15.5px;
    font-weight: 600;
    letter-spacing: -.3px;
    color: #1a1a1a;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quiz-board__past-meta {
    display: block;
    margin-top: 3px;
    font-size: 12.5px;
    color: #8a8a8a;
}

.quiz-board__past-meta em {
    margin-left: 7px;
    padding-left: 8px;
    border-left: 1px solid #e2e8f0;
    font-style: normal;
}

/* 결과 배지 + 푼 시각 — 화살표 바로 왼쪽 */
.quiz-board__past-result {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.quiz-board__past-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap;
}

.quiz-board__past-badge--correct {
    background: #e8f0fa;
    color: #0d498c;
}

.quiz-board__past-badge--done {
    background: #f1f3f5;
    color: #868e96;
}

.quiz-board__past-date {
    font-size: 11.5px;
    color: #a0a8b0;
    white-space: nowrap;
}

.quiz-board__past-arrow {
    flex: 0 0 auto;
    font-size: 18px;
    color: #a8b4c0;
    transition: transform .3s;
}

.quiz-board__past-item--open .quiz-board__past-arrow {
    transform: rotate(180deg);
}

.quiz-board__past-item--open .quiz-board__past-head {
    background: #fafbfc;
}

.quiz-board__past-panel {
    padding: 0 20px 20px;
}

/* =====================================================================
   복기 — 목록 아코디언과 참여 화면이 공유하는 블록
   ===================================================================== */

.quiz-review__head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 10px;
    padding: 13px 16px;
    border-radius: 12px;
    background: #f8fafc;
}

.quiz-review__badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 11px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.3;
}

.quiz-review__badge--correct {
    background: #e8f0fa;
    color: #0d498c;
}

.quiz-review__badge--wrong {
    background: #fdecec;
    color: #d64545;
}

.quiz-review__meta {
    font-size: 12.5px;
    color: #8a8a8a;
}

.quiz-review__ticket {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    padding: 4px 11px;
    border-radius: 999px;
    background: #e9f6ee;
    font-size: 12.5px;
    font-weight: 700;
    color: #1f7a45;
}

.quiz-review__hidden {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    background: #f1f3f5;
    font-size: 13.5px;
    color: #757575;
}

.quiz-review__hidden i {
    font-size: 15px;
    color: #a0a8b0;
}

.quiz-review__question {
    margin-top: 20px;
}

.quiz-review__question-title {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -.3px;
    line-height: 1.5;
    color: #1a1a1a;
}

.quiz-review__question-no {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-top: 1px;
    border-radius: 50%;
    background: #0d498c;
    font-size: 12px;
    font-weight: 800;
    font-style: normal;
    line-height: 1;
    color: #fff;
}

.quiz-review__options {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 14px;
}

.quiz-review__option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    font-size: 14.5px;
    line-height: 1.5;
    color: #555;
}

.quiz-review__option--correct {
    border-color: #0d498c;
    background: #f4f9fd;
    font-weight: 600;
    color: #0d498c;
}

/* 내가 골랐는데 정답이 아닌 줄만 붉게 — 정답과 겹치면 파란 톤이 이긴다 */
.quiz-review__option--mine:not(.quiz-review__option--correct) {
    border-color: #ecd7d7;
    background: #fdf8f8;
}

.quiz-review__option-text {
    flex: 1 1 auto;
    min-width: 0;
}

.quiz-review__tags {
    flex: 0 0 auto;
    display: flex;
    gap: 5px;
}

.quiz-review__tag {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    font-style: normal;
    line-height: 1.3;
    white-space: nowrap;
}

.quiz-review__tag--correct {
    background: #e8f0fa;
    color: #0d498c;
}

.quiz-review__tag--mine {
    background: #f1f3f5;
    color: #757575;
}

.quiz-review__note {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.6;
    color: #8a8a8a;
}

.quiz-review__explain {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 12px;
    padding: 14px 16px;
    border-radius: 12px;
    background: #f8fafc;
    font-size: 14px;
    line-height: 1.7;
    color: #555;
    white-space: pre-line;
}

.quiz-review__explain i {
    flex: 0 0 auto;
    margin-top: 2px;
    font-size: 16px;
    color: #e0a53a;
}

.quiz-review__loading,
.quiz-review__error {
    padding: 26px 0;
    text-align: center;
    font-size: 14px;
    color: #8a8a8a;
}

.quiz-review__error {
    color: #d64545;
}

/* 참여 화면에서는 복기가 카드 하나로 선다 */
.quiz-play__review {
    margin-top: 16px;
    padding: 22px 26px 26px;
    border: 1px solid #e8edf2;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(7, 46, 89, .06);
}

/* =====================================================================
   참여 — 요약
   ===================================================================== */

.quiz-play {
    max-width: 760px;
    margin: 0 auto;
}

.quiz-play__intro {
    padding: 24px 26px;
    border: 1px solid #e8edf2;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(7, 46, 89, .06);
}

/* 당일/지난 배지 — 목록 카드의 quiz-board__badge 와 같은 크기·색 규칙(기본은 지난 퀴즈 앰버) */
.quiz-play__day {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 14px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: -.3px;
    line-height: 1.3;
    background: #fdf3e1;
    color: #9a6200;
}

.quiz-play__day i {
    font-size: 14px;
}

.quiz-play__day--today {
    background: #0d498c;
    color: #fff;
}

.quiz-play__desc {
    margin-bottom: 18px;
    font-size: 15.5px;
    line-height: 1.7;
    color: #555;
    white-space: pre-line;
}

.quiz-play__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.quiz-play__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 10px 15px;
    border-radius: 12px;
    background: #f8fafc;
}

.quiz-play__meta-item i {
    font-size: 16px;
    color: #0d498c;
}

.quiz-play__meta-label {
    font-size: 12.5px;
    color: #8a8a8a;
}

.quiz-play__meta-value {
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    color: #1a1a1a;
}

/* 참여 불가 안내 (이미 참여·정답 완료) */
.quiz-play__block {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
    padding: 16px 18px;
    border-radius: 14px;
    background: #f1f3f5;
    font-size: 14.5px;
    color: #757575;
}

.quiz-play__block i {
    font-size: 17px;
    color: #a0a8b0;
}

/* =====================================================================
   참여 — 문항
   ===================================================================== */

.quiz-play__questions {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
}

.quiz-play__question {
    padding: 26px;
    border: 1px solid #e8edf2;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(7, 46, 89, .06);
}

.quiz-play__question-title {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 18.5px;
    font-weight: 700;
    letter-spacing: -.4px;
    line-height: 1.5;
    color: #1a1a1a;
}

.quiz-play__question-no {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-top: 1px;
    border-radius: 50%;
    background: #0d498c;
    font-size: 14px;
    font-weight: 800;
    font-style: normal;
    line-height: 1;
    color: #fff;
}

.quiz-play__options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
}

.quiz-play__options--ox {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.quiz-play__option {
    position: relative;
}

.quiz-play__option input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.quiz-play__option label {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 18px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
    font-size: 15.5px;
    line-height: 1.5;
    color: #333;
    cursor: pointer;
    transition: border-color .2s, background-color .2s, color .2s, box-shadow .2s;
}

/* 커스텀 라디오 마커 */
.quiz-play__option label::before {
    content: '';
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border: 1.5px solid #c9d3dc;
    border-radius: 50%;
    background: #fff;
    transition: border-color .2s, background-color .2s, box-shadow .2s;
}

.quiz-play__option label:hover {
    border-color: #b9cde2;
    background: #f3f8fc;
}

.quiz-play__option input:checked + label {
    border-color: #0d498c;
    background: #eef5fc;
    font-weight: 600;
    color: #0d498c;
}

.quiz-play__option input:checked + label::before {
    border-color: #0d498c;
    background: #0d498c;
    box-shadow: inset 0 0 0 3px #fff;
}

.quiz-play__option input:focus-visible + label {
    border-color: #0d498c;
    box-shadow: 0 0 0 4px rgba(13, 73, 140, .10);
}

/* OX 문항 — 마커 위, 글자 크게 */
.quiz-play__options--ox .quiz-play__option label {
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    padding: 24px 16px;
    font-size: 26px;
    font-weight: 800;
}

/* 제출·참여 완료 후 — 선택을 잠근 상태 */
.quiz-play__questions--locked .quiz-play__option label {
    cursor: default;
}

.quiz-play__questions--locked .quiz-play__option label:hover {
    border-color: #e2e8f0;
    background: #f8fafc;
}

.quiz-play__questions--locked .quiz-play__option input:checked + label:hover {
    border-color: #0d498c;
    background: #eef5fc;
}

/* =====================================================================
   참여 — 결과
   ===================================================================== */

.quiz-play__result {
    margin-top: 16px;
    padding: 32px 26px 28px;
    border: 1px solid #e8edf2;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(7, 46, 89, .06);
    text-align: center;
}

/* 결과 아이콘 — 제목과 같은 줄, 제목 글자 크기에 맞춘 원형 배지 */
.quiz-play__result-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    margin-right: 8px;
    border-radius: 50%;
    font-size: 14px;
    flex: none;
}

.quiz-play__result--correct .quiz-play__result-ico {
    background: #e8f0fa;
    color: #0d498c;
}

.quiz-play__result--wrong .quiz-play__result-ico {
    background: #fdecec;
    color: #d64545;
}

.quiz-play__result-title {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.3;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -.5px;
    color: #1a1a1a;
}

.quiz-play__result--correct .quiz-play__result-title {
    color: #0d498c;
}

.quiz-play__result--wrong .quiz-play__result-title {
    color: #d64545;
}

.quiz-play__result-explain {
    margin-top: 16px;
    padding: 16px 18px;
    border-radius: 12px;
    background: #f8fafc;
    font-size: 14.5px;
    line-height: 1.7;
    color: #555;
    text-align: left;
    white-space: pre-line;
}

.quiz-play__result-ticket {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    padding: 9px 16px;
    border-radius: 999px;
    background: #e9f6ee;
    font-size: 14px;
    font-weight: 700;
    color: #1f7a45;
}

.quiz-play__result-ticket i {
    font-size: 16px;
}

/* =====================================================================
   참여 — 버튼
   ===================================================================== */

.quiz-play__actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 28px;
}

.quiz-play__btn {
    min-width: 170px;
    height: 54px;
    padding: 0 26px;
    border: 1px solid transparent;
    border-radius: 14px;
    font-size: 16px;
    font-weight: 700;
    line-height: 52px;
    text-align: center;
    transition: background-color .2s, border-color .2s, box-shadow .2s, color .2s;
}

/* <a> 라서 부모를 물려 (0,2,0) — base.css 의 a:link { border:0px } 를 이겨야 테두리가 남는다 */
.quiz-play__actions .quiz-play__btn--ghost {
    border: 1px solid #dce3ea;
    background: #fff;
    color: #555;
}

.quiz-play__actions .quiz-play__btn--ghost:hover {
    border-color: #0d498c;
    color: #0d498c;
}

.quiz-play__btn--submit {
    background: #0d498c;
    color: #fff;
    box-shadow: 0 6px 18px rgba(13, 73, 140, .25);
}

.quiz-play__btn--submit:hover {
    background: #072e59;
    box-shadow: 0 8px 22px rgba(13, 73, 140, .3);
}

.quiz-play__btn--submit:disabled {
    background: #dce3ea;
    color: #fff;
    box-shadow: none;
    cursor: default;
}

/* =====================================================================
   모바일
   ===================================================================== */

@media all and (max-width: 767px) {
    /* style_mob.css 의 .sub_tit02 p 간격(15px)을 h3 로 */
    #quiz_list_wrap .sub_tit02 h3,
    #quiz_play_wrap .sub_tit02 h3 {
        margin-top: 15px;
    }

    .quiz-board__head {
        margin-bottom: 14px;
    }

    .quiz-board__count {
        font-size: 14px;
    }

    .quiz-board__list {
        gap: 12px;
    }

    .quiz-board__item .quiz-board__card {
        padding: 20px 18px 16px 22px;
    }

    .quiz-board__title {
        margin-top: 12px;
        font-size: 17.5px;
    }

    .quiz-board__desc {
        font-size: 14px;
    }

    .quiz-board__foot {
        gap: 6px 12px;
        margin-top: 14px;
        padding-top: 13px;
    }

    .quiz-board__meta {
        font-size: 12.5px;
    }

    /* 좁은 폭에서 메타와 겹치지 않도록 '풀러가기'를 다음 줄 오른쪽으로 */
    .quiz-board__go {
        width: 100%;
        justify-content: flex-end;
        margin-left: 0;
        font-size: 13.5px;
    }

    .quiz-board__empty {
        padding: 56px 16px;
        font-size: 14px;
    }

    .quiz-board__section-empty {
        padding: 20px 16px;
        font-size: 13.5px;
    }

    .quiz-board__section + .quiz-board__section {
        margin-top: 34px;
    }

    .quiz-board__section-title {
        font-size: 16px;
    }

    .quiz-board__section-desc {
        display: none;
    }

    .quiz-board__past-head {
        gap: 10px;
        padding: 15px 16px;
    }

    .quiz-board__past-title {
        font-size: 14.5px;
    }

    .quiz-board__past-badge,
    .quiz-board__past-date {
        font-size: 10.5px;
    }

    .quiz-board__past-badge {
        padding: 3px 8px;
    }

    .quiz-board__past-panel {
        padding: 0 16px 16px;
    }

    .quiz-review__head {
        padding: 12px 14px;
    }

    .quiz-review__ticket {
        margin-left: 0;
    }

    .quiz-review__question-title {
        font-size: 15px;
    }

    .quiz-review__option {
        padding: 11px 12px;
        font-size: 14px;
    }

    .quiz-review__explain {
        padding: 13px 14px;
        font-size: 13.5px;
    }

    .quiz-play__review {
        padding: 18px 18px 22px;
    }

    .quiz-play__intro {
        padding: 20px 18px;
    }

    .quiz-play__desc {
        font-size: 14.5px;
    }

    .quiz-play__meta {
        gap: 8px;
    }

    .quiz-play__meta-item {
        width: 100%;
        padding: 11px 14px;
    }

    .quiz-play__meta-label {
        min-width: 58px;
    }

    .quiz-play__question {
        padding: 22px 18px;
    }

    .quiz-play__question-title {
        gap: 10px;
        font-size: 16.5px;
    }

    .quiz-play__question-no {
        width: 28px;
        height: 28px;
        font-size: 13px;
    }

    .quiz-play__options {
        margin-top: 16px;
    }

    .quiz-play__option label {
        padding: 14px 16px;
        font-size: 15px;
    }

    .quiz-play__options--ox .quiz-play__option label {
        padding: 20px 12px;
        font-size: 22px;
    }

    .quiz-play__result {
        padding: 28px 18px 24px;
    }

    .quiz-play__result-ico {
        width: 23px;
        height: 23px;
        font-size: 12px;
    }

    .quiz-play__result-title {
        font-size: 18.5px;
    }

    .quiz-play__result-explain {
        font-size: 14px;
    }

    .quiz-play__actions {
        flex-direction: column;
        margin-top: 24px;
    }

    .quiz-play__btn {
        width: 100%;
        min-width: 0;
    }
}
