@charset "UTF-8";
html, body { width: 100%; height: 100vh }
html, body {
  padding-top: env(safe-area-inset-top);
  padding-right: env(safe-area-inset-right);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
}
.bg_white {
  background-color: #ffffff;
}

.bg_black {
  background-color: #000000;
}

.bg_primary900 {
  background-color: #133595;
}

.bg_primary800 {
  background-color: #0f39c2;
}

.bg_primary700 {
  background-color: #0945ec;
}

.bg_primary600 {
  background-color: #105bff;
}

.bg_primary500 {
  background-color: #277dff;
}

.bg_primary400 {
  background-color: #50a3ff;
}

.bg_primary300 {
  background-color: #88c4ff;
}

.bg_primary200 {
  background-color: #b8daff;
}

.bg_primary200 {
  background-color: #b8daff;
}

.bg_primary100 {
  background-color: #d7e9ff;
}

.bg_primary50 {
  background-color: #edf6ff;
}

.bg_neutral950 {
  background-color: #202022;
}

.bg_neutral900 {
  background-color: #3b3b3e;
}

.bg_neutral800 {
  background-color: #434347;
}

.bg_neutral700 {
  background-color: #4d4d51;
}

.bg_neutral600 {
  background-color: #5a5b60;
}

.bg_neutral500 {
  background-color: #696a71;
}

.bg_neutral400 {
  background-color: #84858c;
}

.bg_neutral300 {
  background-color: #adaeb3;
}

.bg_neutral200 {
  background-color: #cfd0d2;
}

.bg_neutral100 {
  background-color: #e6e6e7;
}

.bg_neutral50 {
  background-color: #f8fafa;
}

.txt_white {
  color: #ffffff;
}

.txt_black {
  color: #000000;
}

.txt_primary900 {
  color: #133595;
}

.txt_primary800 {
  color: #0f39c2;
}

.txt_primary700 {
  color: #0945ec;
}

.txt_primary600 {
  color: #105bff;
}

.txt_primary500 {
  color: #277dff;
}

.txt_primary400 {
  color: #50a3ff;
}

.txt_primary300 {
  color: #88c4ff;
}

.txt_primary200 {
  color: #b8daff;
}

.txt_primary200 {
  color: #b8daff;
}

.txt_primary100 {
  color: #d7e9ff;
}

.txt_primary50 {
  color: #edf6ff;
}

.txt_neutral950 {
  color: #202022;
}

.txt_neutral900 {
  color: #3b3b3e;
}

.txt_neutral800 {
  color: #434347;
}

.txt_neutral700 {
  color: #4d4d51;
}

.txt_neutral600 {
  color: #5a5b60;
}

.txt_neutral500 {
  color: #696a71;
}

.txt_neutral400 {
  color: #84858c;
}

.txt_neutral300 {
  color: #adaeb3;
}

.txt_neutral200 {
  color: #cfd0d2;
}

.txt_neutral100 {
  color: #e6e6e7;
}

.txt_neutral50 {
  color: #f8fafa;
}

.btn.lg {
  padding: 0 2.4rem;
  height: 5.4rem;
  line-height: 5.2rem;
  border: 1px solid;
  border-radius: 5.4rem;
  box-sizing: border-box;
  font-size: 1.6rem;
  font-weight: 500;
}

.btn.md {
  padding: 0 2.4rem;
  height: 5rem;
  line-height: 4.8rem;
  border: 1px solid;
  border-radius: 5rem;
  box-sizing: border-box;
  font-size: 1.6rem;
  font-weight: 500;
}

.btn.sm {
  padding: 0 1.6rem;
  height: 4.4rem;
  line-height: 4.2rem;
  border: 1px solid;
  border-radius: 4.4rem;
  box-sizing: border-box;
  font-size: 1.4rem;
  font-weight: 500;
}

.btn.primary {
  background: #0f39c2;
  border-color: #0f39c2;
  color: #ffffff;
}

.btn.line {
  background: #ffffff;
  border-color: #0f39c2;
  color: #0f39c2;
}

.btn.line02 {
  background: #ffffff;
  border-color: #e6e6e7;
  color: #0f39c2;
}

.btn.line03 {
  background: #ffffff;
  border-color: #e6e6e7;
  color: #84858c;
}

.btn.red {
  background: #e10036;
  border-color: #e10036;
  color: #ffffff;
}

.btn.ra100 {
  border-radius: 10rem;
}

.btn.ra20 {
  border-radius: 2rem;
}

.btn.ra16 {
  border-radius: 1.6rem;
}

.btn.ra15 {
  border-radius: 1.5rem;
}

.btn.ra10 {
  border-radius: 1rem;
}

.btn.ra8 {
  border-radius: 0.8rem;
}

.btn.ra4 {
  border-radius: 0.4rem;
}

.icon.icon0::before {
  background: url(/static/images/@ico_icon.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 1.6rem;
  height: 1.6rem;
}

.icon.icon1::before {
  background: url(/static/images/btn_arrow-gray.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 3rem;
  height: 3rem;
}

.icon.icon2::before {
  background: url(/static/images/btn_arrow-white.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 3rem;
  height: 3rem;
}

.icon-nav.nav1::before {
  background: url(/static/images/icon-nav-1.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav2::before {
  background: url(/static/images/icon-nav-2.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav3::before {
  background: url(/static/images/icon-nav-3.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav4::before {
  background: url(/static/images/icon-nav-4.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav5::before {
  background: url(/static/images/icon-nav-5.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav6::before {
  background: url(/static/images/icon-nav-6.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav7::before {
  background: url(/static/images/icon-nav-7.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav8::before {
  background: url(/static/images/icon-nav-8.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav9::before {
  background: url(/static/images/icon-nav-9.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav10::before {
  background: url(/static/images/icon-nav-10.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav11::before {
  background: url(/static/images/icon-nav-11.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav12::before {
  background: url(/static/images/icon-nav-12.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav13::before {
  background: url(/static/images/icon-nav-13.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav14::before {
  background: url(/static/images/icon-nav-14.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav15::before {
  background: url(/static/images/icon-nav-15.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav16::before {
  background: url(/static/images/icon-nav-16.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav17::before {
  background: url(/static/images/icon-nav-17.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav18::before {
  background: url(/static/images/icon-nav-18.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav19::before {
  background: url(/static/images/icon-nav-19.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav20::before {
  background: url(/static/images/icon-nav-20.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav21::before {
  background: url(/static/images/icon-nav-21.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav22::before {
  background: url(/static/images/icon-nav-22.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav23::before {
  background: url(/static/images/icon-nav-23.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav24::before {
  background: url(/static/images/icon-nav-24.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.btn.icol1::before {
  background: url(/static/images/btn_arrow.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-right: 0rem;
}

.btn.icol2::before {
  background: url(/static/images/circle_del_gray.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-right: 0rem;
}

.btn.icol3::before {
  background: url(/static/images/btn_search.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-right: 0rem;
}

.btn.icol4::before {
  background: url(/static/images/btn_del_bk.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0rem;
}

.btn.icor1::after {
  background: url(/static/images/btn_arrow.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-left: 0rem;
}

.btn.icor2::after {
  background: url(/static/images/circle_del_gray.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-left: 0rem;
}

.btn.icor3::after {
  background: url(/static/images/btn_search.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-left: 0rem;
}

.btn.icor4::after {
  background: url(/static/images/btn_del_bk.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  margin-left: 0rem;
}

/* 반응형 처리 */
/* 플렉스박스 */
/* Reset */
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
p,
blockquote,
pre,
code,
address,
ul,
ol,
li,
nav,
section,
article,
header,
footer,
main,
aside,
dl,
dt,
dd,
table,
thead,
tbody,
tfoot,
label,
caption,
th,
td,
form,
fieldset,
legend,
hr,
input,
button,
textarea,
object,
figure,
figcaption {
  margin: 0;
  padding: 0;
}

body,
input,
select,
textarea,
button,
img,
fieldset {
  border: none;
}

ul,
ol,
li {
  list-style: none;
}

table {
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
  table-layout: fixed;
}

address,
cite,
code,
em,
i {
  font-style: normal; /*font-weight:normal;*/
}

label,
img,
input,
select,
textarea,
button,
a {
  vertical-align: middle;
}

u,
ins,
a {
  text-decoration: none;
  color: unset;
}

button {
  cursor: pointer;
  background-color: transparent;
  color: unset;
}

caption > div,
legend,
.hide {
  overflow: hidden;
  display: block;
  position: absolute;
  border: 0;
  width: 1px;
  height: 1px;
  clip: rect(1px, 1px, 1px, 1px);
}

/* Normalize */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

input[type=number] {
  -moz-appearance: textfield;
  -webkit-appearance: textfield;
          appearance: textfield;
}

input[type=number],
input[type=text],
input[type=password],
input[type=url],
input[type=email],
input[type=tel],
input[type=date],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none;
}

img {
  width: 100%;
  height: auto;
  display: block;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

:root {
  color-scheme: light only;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  font-display: swap;
  src: local("Pretendard Black"), url("../fonts/pretendard/Pretendard-Black.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Black.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  font-display: swap;
  src: local("Pretendard ExtraBold"), url("../fonts/pretendard/Pretendard-ExtraBold.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-ExtraBold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  font-display: swap;
  src: local("Pretendard Bold"), url("../fonts/pretendard/Pretendard-Bold.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Bold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  font-display: swap;
  src: local("Pretendard SemiBold"), url("../fonts/pretendard/Pretendard-SemiBold.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-SemiBold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  font-display: swap;
  src: local("Pretendard Medium"), url("../fonts/pretendard/Pretendard-Medium.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Medium.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  font-display: swap;
  src: local("Pretendard Regular"), url("../fonts/pretendard/Pretendard-Regular.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Regular.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  font-display: swap;
  src: local("Pretendard Light"), url("../fonts/pretendard/Pretendard-Light.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Light.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  font-display: swap;
  src: local("Pretendard ExtraLight"), url("../fonts/pretendard/Pretendard-ExtraLight.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-ExtraLight.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  font-display: swap;
  src: local("Pretendard Thin"), url("../fonts/pretendard/Pretendard-Thin.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Thin.woff") format("woff");
}
html {
  font-size: 10px;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  color: #000000;
  line-height: 1.4;
  word-break: keep-all;
}

body {
  font-size: 1rem;
}

* {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}

.header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.4rem;
  width: 100%;
  max-width: 54rem;
  min-height: 4.8rem;
  padding: 0.6rem 1.6rem;
  position: fixed;
  top: env(safe-area-inset-top);
  z-index: 10;
}
.header.white {
  background: #ffffff;
  border-bottom: 1px solid #e6e6e7;
}
.header.white .exam_title {
  font-size: 1.2rem;
  font-weight: 500;
  color: #84858c;
}
.header_left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.4rem;
  overflow: hidden;
}
.header_left .logo {
  /* 25.04.30 수정 - 크기 */
  width: 12.5rem;
  height: 2.2rem;
  flex: 0 0 auto;
}
.header_left .logo img {
  height: 100%;
}
.header_left p {
  line-height: 1;
}
.header_right {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 1.2rem;
  flex: 0 0 auto;
}
.header_right .timer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  background: #edf6ff;
  padding: 0.6rem 1.2rem;
  border-radius: 100rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: #0f39c2;
}
.header_right .timer::before {
  content: "";
  width: 1.6rem;
  height: 1.6rem;
  background: url(/static/images/ico16_timer.svg) center center no-repeat;
}

.wrap {
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  background: #f8fafa;
  padding-top: env(safe-area-inset-top);
}

.wrap main {
  /* 25.05.06 css 추가 */
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
}

.container {
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
}
.container_pc {
  max-width: 54rem;
  margin: 0 auto;
  min-height: 100vh;
  min-height: 100dvh;
  box-shadow: 0 0 1.2rem rgba(15, 57, 194, 0.08);
  overflow-x: hidden;
}
.container_pc:has(.header.white) {
  padding-top: 4.9rem;
}
.container_pc:has(.login) {
  background: url(/static/images/bg_login.png) center center no-repeat;
  background-size: cover;
  padding-top: 0;
}
.container_pc:has(.header_left .exam_info) {
  padding-top: 5.1rem;
}

.border_top {
  border-top: 1px solid #202022;
}

.modal {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 100%;
  height: 100%;
  /* 결과 성공,실패 아이콘 */
}
.modal_wrap {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  position: fixed;
  top: 0;
  z-index: 1000;
  display: none;
}
.modal_inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 100%;
  max-width: 50rem;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 0.8rem;
  box-shadow: 0 0.4rem 1.6rem rgba(0, 0, 0, 0.24);
  padding: 2.4rem;
}
.modal_header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 100%;
  text-align: center;
  place-items: center;
}
.modal_body {
  width: 100%;
  text-align: center;
}
.modal_footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.8rem;
  width: 100%;
}
.modal_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: -1;
}
.modal_success, .modal_fail {
  width: 5.6rem;
  height: 5.6rem;
}
.modal_success {
  background: url(/static/images/ico56_success.svg) center center no-repeat;
}
.modal_fail {
  background: url(/static/images/ico56_fail.svg) center center no-repeat;
}
.modal_block {
  /* 25.05.04 모달 스크롤 방지 추가 */
  overflow: hidden;
}

.login {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
}
.login_box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;
  width: 100%;
  padding: 4rem 2rem;
  border: 1px solid #f8fafa;
  border-radius: 1.2rem;
  background: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: blur(0.6rem);
          backdrop-filter: blur(0.6rem);
}
.login_box .logo {
  max-width: 19.6rem;
}

.user {
  position: relative;
  min-height: 100%;
}
.user_top {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0rem;
  height: 26rem;
  background: url(/static/images/bg_user.png) center center no-repeat;
  background-size: cover;
}
.user_top .user_number {
  font-size: 1.4rem;
  color: #5a5b60;
}
.user_bottom {
  width: 100%;
  min-height: calc(100vh - 18.4rem);
  background: #ffffff;
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  box-shadow: 0 0 1.6rem 0 rgba(15, 57, 194, 0.12);
  padding: 2.4rem 0;
  position: absolute;
  top: 18.4rem;
  z-index: 1;
}
.user_btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 0.4rem;
  flex: 0 0 auto;
}
.user_btn.before .exam_state {
  color: #0f39c2;
}
.user_btn.scoring .exam_state {
  color: #50a3ff;
}
.user_btn.result .exam_state {
  color: #84858c;
}
.user_answer {
  padding: 1.2rem 1.6rem;
  background: #f8fafa;
  border: 1px solid #e6e6e7;
  border-radius: 0.8rem;
  color: #202022;
  font-size: 1.5rem;
  word-break: break-all;
  min-height: 4.5rem;
}

.scroller {
  padding-top: 1.6rem;
  padding-bottom: 2.4rem;
  overflow-y: auto;
  margin-left: -1.6rem;
  margin-right: -1.6rem;
  padding-left: 1.6rem;
  padding-right: 1.6rem;
}

.wrap:has(.header) main {
  padding-top: calc(env(safe-area-inset-top) + 1rem);
}
.wrap:has(.header) main.home {
  /* 패딩 : 상단 헤더 있을 경우 */
  padding-top: calc(env(safe-area-inset-top) + 4.8rem);
}
.wrap:has(.user) main {
  /* 패딩 : 로그인 후 메인 화면 */
  padding-top: env(safe-area-inset-top);
}
.wrap:has(.bottom_navi) main {
  /* 패딩 : 하단 바[메뉴] 있을 경우 */
  padding-bottom: calc(env(safe-area-inset-bottom) + 5.6rem);
}
.wrap:has(.tab):has(.bottom_navi) main {
  /* 패딩 : 상단 문제유형 탭 + 하단 바[메뉴] 있을 경우 */
  padding-top: calc(env(safe-area-inset-top) + 8.5rem);
  padding-bottom: calc(env(safe-area-inset-bottom) + 5.6rem);
}
.wrap:has(.breadcrumb):has(.bottom_navi) main {
  /* 패딩 : 상단 부대 브레드크럼 + 하단 바[메뉴] 있을 경우 */
  padding-top: calc(env(safe-area-inset-top) + 8.5rem);
  padding-bottom: calc(env(safe-area-inset-bottom) + 5.6rem);
}
.wrap:has(.bottom_btn) main {
  /* 패딩 : 하단 바[버튼] 있을 경우 */
  padding-bottom: calc(env(safe-area-inset-bottom) + 6.7rem);
}
.wrap:has(.bottom_btn):has(.bottom_status) main {
  /* 패딩 : 하단 바[버튼] + 상태 표시줄 있을 경우 */
  padding-bottom: calc(env(safe-area-inset-bottom) + 10.6rem);
}
.wrap:has(.bottom_btn):has(.bottom_status):has(.tab) main.home {
  /* 패딩 : 상단 문제유형 탭 +  하단 바[버튼] + 상태 표시줄 있을 경우 */
  padding-top: calc(env(safe-area-inset-top) + 4.5rem);
  padding-bottom: calc(env(safe-area-inset-bottom) + 10.6rem);
}

/* 풀스크린(스크롤 없음) */
.fullscreen {
  /* 25.05.06 css - 단위 수정 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  min-height: calc(100dvh - 5.1rem);
}

/* 풀스크린 : 하단 바[메뉴] 있을 경우 */
.wrap:has(.bottom_navi) .fullscreen {
  /* 25.05.06 css - 단위 수정 */
  min-height: calc(100dvh - 10.5rem);
}

/* 풀스크린 : 상단 문제유형 탭 + 하단 바[메뉴] 있을 경우 */
.wrap:has(.tab):has(.bottom_navi) .fullscreen {
  /* 25.05.06 css - 단위 수정 */
  min-height: calc(100dvh - 14.5rem);
}

/* 풀스크린 : 하단 바[버튼] + 상태 표시줄 있을 경우 */
.wrap:has(.bottom_btn):has(.bottom_status) .fullscreen {
  /* 25.05.06 css - 단위 수정 */
  min-height: calc(100dvh - 15.5rem);
}

/* 풀스크린 : 상단 문제유형 탭 + 하단 바[버튼] + 상태 표시줄 있을 경우 */
.wrap:has(.bottom_btn):has(.bottom_status):has(.tab) .fullscreen {
  /* 25.05.06 css - 단위 수정 */
  min-height: calc(100dvh - 19.2rem);
}

.bottom {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  gap: 0rem;
  width: 100%;
  max-width: 54rem;
  position: fixed;
  bottom: 0;
  background: #ffffff;
  border-top: 1px solid #e6e6e7;
  box-shadow: 0 0 1.6rem rgba(15, 57, 194, 0.12);
  /* 25.07.21 z-index 추가 */
  z-index: 10;
  /* 하단 메뉴 */
  /* 하단 버튼 */
  /* 하단 플로팅 버튼 */
  /* 하단 상태 표시줄 */
}
.bottom_navi {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  padding: 0.4rem 1.6rem;
  /* 25.05.06 iOS 대응 css 수정 */
  padding-bottom: calc(env(safe-area-inset-bottom) + 0.4rem);
  /* 전체 통계 */
  /* 부대별 확인 */
  /* 출제 관리 */
  /* 평가 관리 */
  /* 식별번호 관리 */
}
.bottom_navi li {
  flex: 1;
}
.bottom_navi li a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0;
  font-size: 1.2rem;
  font-weight: 500;
  color: #84858c;
  text-wrap: nowrap;
}
.bottom_navi li a::before {
  content: "";
  width: 2rem;
  height: 2rem;
}
.bottom_navi_menu01 a::before {
  background: url(/static/images/ico20_bottom_stats.svg) center center no-repeat;
}
.bottom_navi_menu01.on a {
  color: #0f39c2;
}
.bottom_navi_menu01.on a::before {
  background: url(/static/images/ico20_bottom_stats_on.svg) center center no-repeat;
}
.bottom_navi_menu02 a::before {
  background: url(/static/images/ico20_bottom_folder.svg) center center no-repeat;
}
.bottom_navi_menu02.on a {
  color: #0f39c2;
}
.bottom_navi_menu02.on a::before {
  background: url(/static/images/ico20_bottom_folder_on.svg) center center no-repeat;
}
.bottom_navi_menu03 a::before {
  background: url(/static/images/ico20_bottom_note.svg) center center no-repeat;
}
.bottom_navi_menu03.on a {
  color: #0f39c2;
}
.bottom_navi_menu03.on a::before {
  background: url(/static/images/ico20_bottom_note_on.svg) center center no-repeat;
}
.bottom_navi_menu04 a::before {
  background: url(/static/images/ico20_bottom_exam.svg) center center no-repeat;
}
.bottom_navi_menu04.on a {
  color: #0f39c2;
}
.bottom_navi_menu04.on a::before {
  background: url(/static/images/ico20_bottom_exam_on.svg) center center no-repeat;
}
.bottom_navi_menu05 a::before {
  /* 25.07.21 식별번호 관리 > 기타 메뉴 변경 */
  background: url(/static/images/ico20_bottom_etc.svg) center center no-repeat;
}
.bottom_navi_menu05.on a {
  color: #0f39c2;
}
.bottom_navi_menu05.on a::before {
  /* 25.07.21 식별번호 관리 > 기타 메뉴 변경 */
  background: url(/static/images/ico20_bottom_etc_on.svg) center center no-repeat;
}
.bottom_btn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 1.2rem;
  padding: 0.8rem 1.6rem;
  /* 25.05.06 iOS 대응 css 수정 */
  padding-bottom: calc(env(safe-area-inset-bottom) + 0.8rem);
}
.bottom_floating_btn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.6rem;
  position: absolute;
  /* 25.05.06 iOS 대응 css 수정 */
  bottom: calc(env(safe-area-inset-bottom) + 6.5rem);
  right: 1.6rem;
  padding: 1.2rem 1.6rem;
  background: #0f39c2;
  border-radius: 100rem;
  box-shadow: 0 0.4rem 1.2rem rgba(15, 57, 194, 0.2);
  font-size: 1.4rem;
  font-weight: 500;
  color: #ffffff;
  line-height: 1;
  /* csv 다운로드 */
  /* 문제추가 */
  /* 평가 추가 */
  /* 식별번호 추가 */
}
.bottom_floating_btn::before {
  content: "";
  display: inline-block;
  width: 1.6rem;
  height: 1.6rem;
}
.bottom_floating_btn.csv::before {
  background: url(/static/images/ico16_download_csv.svg) center center no-repeat;
}
.bottom_floating_btn.add_question::before {
  background: url(/static/images/ico16_add_question.svg) center center no-repeat;
}
.bottom_floating_btn.add_exam::before {
  background: url(/static/images/ico16_add_exam.svg) center center no-repeat;
}
.bottom_floating_btn.add_id::before {
  background: url(/static/images/ico16_add_id.svg) center center no-repeat;
}
.bottom_status {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0rem;
  padding: 1.2rem 1.6rem 0.8rem 1.6rem;
}
.bottom_status .checking {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.4rem;
  font-weight: 500;
  color: #0f39c2;
}
.bottom_status .checking::before {
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  background: url(/static/images/ico12_check.svg) center center no-repeat;
}
.bottom_status .checking::after {
  content: "선택 중";
}
.bottom .breadcrumb {
  /* 25.05.06 css 추가 */
  padding: 0;
  border-bottom: unset;
  position: unset;
}

input, textarea, select {
  border: 1px solid #e6e6e7;
  border-radius: 0.8rem;
  background-color: #ffffff;
  box-sizing: border-box;
  font-size: 1.5rem;
  color: #202022;
  outline: none;
  width: 100%;
  padding: 1.2rem 1.6rem;
}
input::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder {
  color: #84858c;
}
input::placeholder, textarea::placeholder, select::placeholder {
  color: #84858c;
}
input:focus, textarea:focus, select:focus {
  border: 1px solid #0f39c2;
}
input:user-invalid, textarea:user-invalid, select:user-invalid {
  border: 1px solid #ff0000;
}

select {
  background: #ffffff url(/static/images/ico24_chevron_down_bk.svg) center right 1.6rem no-repeat;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 4rem;
}
select::-ms-expand {
  display: none;
}
select:disabled {
  background-color: #ffffff;
}

textarea {
  resize: none;
}
textarea:disabled {
  /* 25.07.21 textarea disblaed 추가*/
  color: #696a71;
  background: #f8fafa;
}

input[type=search] {
  padding: 0.8rem 3.6rem 0.8rem 1.2rem;
  background: #f8fafa url(/static/images/ico16_search_gray.svg) center right 1.2rem no-repeat;
  border: 1px solid #e6e6e7;
}
input[type=search]::-moz-placeholder {
  color: #84858c;
}
input[type=search]::placeholder {
  color: #84858c;
}
input[type=search]:user-valid {
  background: #ffffff url(/static/images/ico16_search_gray.svg) center right 1.2rem no-repeat;
}
input[type=search]:focus {
  background: #ffffff url(/static/images/ico16_search_blue.svg) center right 1.2rem no-repeat;
  border: 1px solid #0f39c2;
}

input[type=checkbox] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 1.6rem;
  height: 1.6rem;
  padding: 0;
  flex: 0 0 auto;
  border: 1px solid #cfd0d2;
  border-radius: 0.4rem;
}
input[type=checkbox]:checked {
  background: #0f39c2 url(/static/images/ico8_check.svg) no-repeat center center;
  border: 1px solid #0f39c2;
}

/* 달력 커스텀 */
input[type=date] {
  position: relative;
  background: #ffffff url(/static/images/ico16_calendar.svg) top 1.3rem right 1.6rem no-repeat;
  color: #202022;
  height: 4.6rem;
}
input[type=date]::-webkit-clear-button, input[type=date]::-webkit-inner-spin-button, input[type=date]::-webkit-datetime-edit {
  display: none;
}
input[type=date]::-webkit-calendar-picker-indicator {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  color: transparent;
}
input[type=date]::before {
  content: attr(data-placeholder);
  width: 100%;
}
input[type=date]:valid::before {
  display: none;
}
input[type=date]:valid::-webkit-datetime-edit {
  display: block;
}

input[type=file] {
  display: none;
}

input[type=range] {
  /* 25.07.21 - 정훈장교 평가 슬라이더 추가 */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 0.4rem;
  background: #e6e6e7;
  border-radius: 0.8rem;
  outline: none;
  cursor: pointer;
  padding: 0;
  border: 0;
}
input[type=range]::-webkit-slider-runnable-track {
  /* 25.07.21 - 정훈장교 평가 슬라이더 트랙 */
  height: 0.4rem;
  border-radius: 0.8rem;
}
input[type=range]::-moz-range-track {
  /* 25.07.21 - 정훈장교 평가 슬라이더 트랙 [ 파이어폭스 ] */
  height: 0.4rem;
  border-radius: 0.8rem;
}
input[type=range]::-webkit-slider-thumb {
  /* 25.07.21 - 정훈장교 평가 슬라이더 핸들 */
  -webkit-appearance: none;
  height: 2.4rem;
  width: 2.4rem;
  background: radial-gradient(circle at center, #0f39c2 6px, #ffffff 7px);
  border-radius: 100%;
  border: 0;
  margin-top: -1rem;
  box-shadow: 0 0.2rem 0.8rem rgba(15, 57, 194, 0.32);
  -webkit-transition: background 0.15s;
  transition: background 0.15s;
  position: relative;
  z-index: 1;
}
input[type=range]::-moz-range-thumb {
  /* 25.07.21 - 정훈장교 평가 슬라이더 핸들 [ 파이어 폭스 ] */
  height: 2.4rem;
  width: 2.4rem;
  background: radial-gradient(circle at center, #0f39c2 6px, #ffffff 7px);
  border-radius: 100%;
  border: none;
  box-shadow: 0 0.2rem 0.8rem rgba(15, 57, 194, 0.32);
  -moz-transition: background 0.15s;
  transition: background 0.15s;
  position: relative;
  z-index: 2;
}
input[type=range]::-moz-range-progress {
  /* 25.07.21 - 정훈장교 평가 슬라이더 진행도 [ 파이어 폭스 ] */
  background: #d7e9ff;
}

.input {
  /* 로그인 인풋 */
}
.input_login {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.2rem;
  width: 100;
}
.input_login input {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid #f8fafa;
  box-shadow: 0 0.4rem 1.6rem 0 rgba(15, 57, 194, 0.04);
  font-weight: 300;
}
.input_login input:focus {
  border: 1px solid #0f39c2;
}
.input_login input:user-invalid {
  border: 1px solid #ff0000;
}
.input_login .input_wrap {
  gap: 0.2rem;
}
.input_wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.4rem;
  width: 100%;
  position: relative;
}
.input_wrap label {
  font-size: 1.4rem;
  color: #202022;
}
.input_wrap .unit {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 1.6rem;
  font-size: 1.4rem;
  color: #5a5b60;
}
.input_wrap:has(.unit) input {
  padding: 1.2rem 3.6rem 1.2rem 1.6rem;
}
.input_invalid {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.4rem;
  color: #ff0000;
  font-size: 1.3rem;
}
.input_invalid:before {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: url(/static/images/ico14_invalid.svg) center center no-repeat;
}
.input_range {
  /* 25.07.21 - 정훈장교 평가 슬라이더 추가 */
  width: 100%;
  height: 0.4rem;
  position: relative;
}
.input_range_value {
  /* 25.07.21 - 정훈장교 평가 슬라이더 - 활성화 영역 */
  position: absolute;
  width: 0%;
  height: 0.4rem;
  border-radius: 0.8rem;
  background: #d7e9ff;
}
.input_range input[type=range]:disabled::-webkit-slider-thumb {
  /* 25.07.21 - 정훈장교 평가 슬라이더 핸들 - disabled */
  background: radial-gradient(circle at center, #84858c 6px, #ffffff 7px);
  cursor: not-allowed;
}
.input_range input[type=range]:disabled::-moz-range-thumb {
  /* 25.07.21 - 정훈장교 평가 슬라이더 핸들 [ 파이어 폭스 ] - disabled */
  background: radial-gradient(circle at center, #84858c 6px, #ffffff 7px);
  cursor: not-allowed;
}
.input_range input[type=range]:disabled::-moz-range-progress {
  /* 25.07.21 - 정훈장교 평가 슬라이더 진행도 [ 파이어 폭스 ] */
  background: #adaeb3;
}
.input_range:has(input[type=range][disabled]) .input_range_value {
  /* 25.07.21 - 정훈장교 평가 슬라이더 트랙 - disabled */
  background: #adaeb3;
}

@-moz-document url-prefix() {
  .input_range_value {
    /* 25.07.21 - 정훈장교 평가 슬라이더 트랙 - 파이어폭스 대응 */
    display: none;
  }
}

button:disabled {
  border-color: #e6e6e7 !important;
  background-color: #e6e6e7 !important;
  color: #84858c !important;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* 로그아웃 */
  /* 뒤로가기 */
  /* 리스트 더보기 */
  /* 부대별확인 메뉴 */
  /* 문제 더보기 */
  /* 닫기 */
  /* 평가 추가(b04_1)  > 좌측 플러스 버튼*/
  /* 평가 추가(b04_1) > 선택한 식별번호 삭제 */
  /* 부대기호 선택 */
}
.btn.full {
  width: 100%;
}
.btn_logout {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0.4rem;
  padding: 0.8rem 0.4rem;
  font-size: 1.3rem;
  font-weight: 500;
  color: #5a5b60;
}
.btn_logout::before {
  content: "";
  width: 1.6rem;
  height: 1.6rem;
  background: url(/static/images/ico16_logout.svg) center center no-repeat;
}
.btn_back {
  width: 2.4rem;
  height: 2.4rem;
  background: url(/static/images/ico24_back.svg) center center no-repeat;
  flex: 0 0 auto;
}
.btn_more_list {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.2rem;
  font-size: 1.4rem;
  font-weight: 500;
  color: #84858c;
  padding: 0.8rem 1.2rem;
  width: 100%;
}
.btn_more_list::after {
  content: "";
  width: 2.4rem;
  height: 2.4rem;
  background: url(/static/images/ico24_chevron_down_gray.svg) center center no-repeat;
}
.btn_category {
  width: 2.4rem;
  height: 2.4rem;
  background: url(/static/images/ico24_folder.svg) center center no-repeat;
  flex: 0 0 auto;
}
.btn_more_question {
  width: 2.4rem;
  height: 2.4rem;
  background: url(/static/images/ico24_chevron_down_bk.svg) center center no-repeat;
  flex: 0 0 auto;
  transition: 0.2s all;
}
.btn_edit {
  /* 문제 수정 */
  /* 식별번호 편집 */
}
.btn_edit_question {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  padding: 0.8rem 1.6rem;
  background: #ffffff;
  border: 1px solid #e6e6e7;
  border-radius: 0.4rem;
  font-size: 1.4rem;
  font-weight: 500;
  color: #202022;
  flex: 1;
  height: 3.6rem;
}
.btn_edit_question::before {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: url(/static/images/ico14_edit.svg) center center no-repeat;
}
.btn_edit_id {
  width: 2.4rem;
  height: 2.4rem;
  background: url(/static/images/ico24_id_edit.svg) center center no-repeat;
  flex: 0 0 auto;
}
.btn_edit_id_finish {
  width: 2.4rem;
  height: 2.4rem;
  background: url(/static/images/ico24_double_check.svg) center center no-repeat;
  flex: 0 0 auto;
}
.btn_del {
  /* 문제 삭제 */
  /* 문제 추가 > 답안 삭제 */
}
.btn_del_question {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  padding: 0.8rem 1.6rem;
  background: rgba(225, 0, 54, 0.05);
  border-radius: 0.4rem;
  font-size: 1.4rem;
  font-weight: 500;
  color: #e10036;
  flex: 1;
  height: 3.6rem;
}
.btn_del_question::before {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: url(/static/images/ico14_delete.svg) center center no-repeat;
}
.btn_del_answer {
  padding: 0.4rem 0.8rem;
  font-size: 1.4rem;
  font-weight: 500;
  color: #5a5b60;
}
.btn_close {
  width: 2.4rem;
  height: 2.4rem;
  background: url(/static/images/ico24_close.svg) center center no-repeat;
  flex: 0 0 auto;
}
.btn_add {
  /* 답안 추가 */
}
.btn_add_answer {
  font-size: 1.4rem;
  font-weight: 500;
  color: #0f39c2;
}
.btn_choice::before {
  content: "";
  width: 1.6rem;
  height: 1.6rem;
  background: url(/static/images/ico16_plus.svg) center center no-repeat;
  margin-right: 0.2rem;
}
.btn_cancel_id {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 2.4rem;
  height: 2.4rem;
  background: #ffffff;
  border: 1px solid #e6e6e7;
  border-radius: 100rem;
  flex: 0 0 auto;
}
.btn_cancel_id::before {
  content: "";
  display: block;
  width: 1.2rem;
  height: 1.2rem;
  background: url(/static/images/ico12_del.svg) center center no-repeat;
}
.btn_menu_id {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  padding: 1.2rem 1.6rem;
  background: #ffffff;
  border: 1px solid #e6e6e7;
  border-radius: 0.8rem;
  font-size: 1.5rem;
  color: #202022;
  width: 100%;
}
.btn_menu_id::after {
  content: "";
  width: 2rem;
  height: 2rem;
  background: url(/static/images/ico20_folder.svg) center center no-repeat;
}
.btn_voice {
  /* 25.05.04 - 보이스 입력 버튼 추가 */
  position: absolute;
  right: 1.6rem;
  bottom: 1.2rem;
  width: 4rem;
  height: 4rem;
  background: #ffffff url(/static/images/ico16_mic_blue.svg) center center no-repeat;
  background-size: 1.6rem 1.6rem;
  border: 1px solid #0f39c2;
  border-radius: 100rem;
}

.icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.icon-nav {
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
}

.box {
  display: flex;
  justify-content: space-between;
  background: #ffffff;
  border: 1px solid #e6e6e7;
  border-radius: 1.2rem;
  box-shadow: 0 0.4rem 1.6rem rgba(15, 57, 194, 0.12);
  padding: 1.6rem 2rem;
  /* 시험응시 화면에서 패딩 조절 */
  /* 합불 여부 박스 */
  /* 식별번호 추가(버튼) */
}
.box.column {
  flex-direction: column;
}
.box.type01 {
  align-items: flex-start;
  gap: 0.8rem;
}
.box.type01 .type01_inner {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.8rem;
  width: 100%;
  flex: 1 1 auto;
  overflow: hidden;
  padding: 0.1rem;
}
.box.type01 .type01_top {
  /* 25.04.30 css 추가 */
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.8rem;
  width: 100%;
}
.box.type01 .type01_top:has(.btn_more_question) .w100 {
  /* 25.04.30 css 추가 */
  width: calc(100% - 3.2rem);
}
.box.type01.active .box_title {
  white-space: unset;
}
.box.type01.active .btn_more_question {
  transform: rotateX(180deg);
}
.box.type01.checked {
  border: 1px solid #0f39c2;
}
.box.type02 {
  padding: 0;
}
.box.type02 .type02_inner {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0rem;
  width: 100%;
}
.box.type02 .type02_top,
.box.type02 .type02_bottom {
  padding: 1.6rem 2rem;
}
.box.type02 .type02_top {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.8rem;
}
.box.type02 .type02_top:has(.btn_more_question) .w100 {
  width: calc(100% - 3.2rem);
}
.box.type02 .type02_bottom {
  display: none;
  border-top: 1px solid #e6e6e7;
}
.box.type02:has(.exam_id_number):has(.exam_date_start) .type02_bottom {
  display: block;
}
.box.type02.active .type02_top .box_title {
  white-space: unset;
}
.box.type02.active .type02_bottom {
  display: block;
}
.box.type02.active .btn_more_question {
  transform: rotateX(180deg);
}
.box.type02.active:has(.user_answer) .user_answer {
  white-space: unset;
  text-overflow: unset;
  overflow: auto;
}
.box.type02.deleted .badge {
  color: #84858c;
}
.box.type02.deleted .box_title {
  color: #5a5b60;
}
.box.type02.deleted .type02_bottom {
  display: none;
}
.box:has(.question) {
  padding: 2rem;
  border: unset;
  outline: 1px solid #e6e6e7;
}
.box_result {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  padding: 2rem;
  border-radius: 0.8rem;
  overflow: hidden;
}
.box_result p {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.6rem;
}
.box_result p:before {
  content: "";
  width: 1.8rem;
  height: 1.8rem;
  background: url(/static/images/ico18_aibot.svg) center center no-repeat;
}
.box_result.pass {
  background: url(/static/images/bg_result_pass.png) center center no-repeat;
  background-size: cover;
}
.box_result.fail {
  background: url(/static/images/bg_result_fail.png) center center no-repeat;
  background-size: cover;
}
.box_list {
  /* 관리자 박스 리스트 */
}
.box_list_admin > li:nth-child(n+2) {
  margin-top: 0.4rem;
}
.box_title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
  font-size: 1.5rem;
  font-weight: 600;
  color: #202022;
}
.box_title_detail {
  font-size: 1.6rem;
  font-weight: 600;
  color: #202022;
  word-break: break-all;
}
.box.btn {
  /* 직접 입력 */
  /* 엑셀 추가 */
  /* 파일 업로드 */
}
.box.btn_direct, .box.btn_excel, .box.btn_upload {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.8rem;
}
.box.btn_direct::before, .box.btn_excel::before, .box.btn_upload::before {
  content: "";
  width: 3.2rem;
  height: 3.2rem;
}
.box.btn_direct::before {
  background: url(/static/images/ico32_direct.svg) center center no-repeat;
}
.box.btn_excel::before {
  background: url(/static/images/ico32_excel.svg) center center no-repeat;
}
.box.btn_upload::before {
  background: url(/static/images/ico32_upload.svg) center center no-repeat;
}
.box_etc {
  /* 25.07.21 기타 메뉴 */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0rem;
  background: #ffffff;
  border: 0.1rem solid #e6e6e7;
  border-radius: 1.2rem;
}
.box_etc li:nth-child(n+2) .box_etc_item {
  /* 25.07.21 기타 메뉴 간의 보더 */
  border-top: 0.1rem solid #e6e6e7;
}
.box_etc_item {
  /* 25.07.21 기타 메뉴 항목 */
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.8rem;
  padding: 1.6rem 2rem;
  position: relative;
  line-height: 1;
}
.box_etc_item::after {
  /* 25.07.21 기타 메뉴 - 우측 화살표 */
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 2rem;
  width: 1.8rem;
  height: 1.8rem;
  background: url(../images/ico18_chevron_right.svg);
}
.box_etc_item.item01::before {
  /* 25.07.21 기타 메뉴 - 좌측 아이콘 - 식별번호 관리 */
  content: "";
  display: block;
  width: 2rem;
  height: 2rem;
  background: url(../images/ico20_number.svg);
}
.box_etc_item.item02::before {
  /* 25.07.21 기타 메뉴 - 좌측 아이콘 - 평가 데이터 구축 */
  content: "";
  display: block;
  width: 2rem;
  height: 2rem;
  background: url(../images/ico20_question_db.svg);
}

/* 추가한 관리자 */
.id_admin {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.3rem;
  font-weight: 500;
  color: #84858c;
}
.id_admin::before {
  content: "";
  width: 1.6rem;
  height: 1.6rem;
  background: url(/static/images/ico16_admin.svg) center center no-repeat;
}

.none {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
}
.none .logo {
  opacity: 0.7;
}

/* 응시 목록 */
.exam_list {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: normal;
  gap: 0.4rem;
}
.exam_list .box {
  align-items: center;
}
.exam_info {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
}
.exam_title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
  font-size: 1.4rem;
  color: #5a5b60;
}
.exam_date {
  font-size: 1.6rem;
  font-weight: 600;
  color: #202022;
}
.exam_date_expire {
  padding: 0.2rem 1.2rem;
  background: #f8fafa;
  border: 1px solid #e6e6e7;
  border-radius: 100rem;
  font-size: 1.2rem;
  color: #5a5b60;
  width: -moz-fit-content;
  width: fit-content;
}
.exam_date_expire::before {
  content: "D";
}
.exam_date_start {
  font-size: 1.3rem;
  color: #84858c;
}
.exam_id_number {
  font-size: 1.3rem;
  font-weight: 500;
  color: #434347;
}
.exam_state {
  font-size: 2rem;
  font-weight: 700;
}
.exam_text {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0rem;
  font-size: 1.4rem;
  color: #84858c;
}
.exam_text:after {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: url(/static/images/ico14_chevron_right_gray.svg) center center no-repeat;
}
.exam_recent {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
}
.exam_recent p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
  font-size: 1.3rem;
  font-weight: 500;
  color: #434347;
  width: 100%;
}
.exam_recent:before {
  content: "";
  display: inline-block;
  width: 1.6rem;
  height: 1.6rem;
  background: url(/static/images/ico16_exam_check.svg) center center no-repeat;
  flex: 0 0 auto;
}

/* 평가 문제 목록 */
.question {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.2rem;
  /* AI 분석 */
  /* 문제 출제횟수,합격률 */
  /* 문제 수정 로그 */
  /* 모범 답안 */
}
.question_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 1.6rem;
  counter-reset: number 0;
}
.question_list:has(.question_analysis) {
  gap: 1.2rem;
}
.question_number::after {
  counter-increment: number 1;
  content: "Q" counter(number) ".";
}
.question_title {
  font-size: 1.6rem;
  font-weight: 600;
  color: #202022;
  word-break: break-all;
}
.question_answer {
  min-height: 10rem;
  /* 25.05.04 css 수정 */
  padding-right: 6.8rem;
}
.question_answer_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 0.2rem;
  width: 100%;
}
.question_analysis {
  padding: 1.2rem 1.6rem;
  border-radius: 0.8rem;
}
.question_analysis.correct {
  background: #edf6ff;
}
.question_analysis.correct .analysis_title {
  color: #0f39c2;
}
.question_analysis.correct .analysis_title::before {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: url(/static/images/ico14_ai_blue.svg) no-repeat center center;
}
.question_analysis.correct .analysis_list {
  color: #0f39c2;
}
.question_analysis.wrong {
  background: rgba(225, 0, 54, 0.05);
}
.question_analysis.wrong .analysis_title {
  color: #e10036;
}
.question_analysis.wrong .analysis_title::before {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: url(/static/images/ico14_ai_red.svg) no-repeat center center;
}
.question_analysis.wrong .analysis_list {
  color: #e10036;
}
.question_analysis .analysis_title {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.4rem;
  font-weight: 600;
}
.question_analysis .analysis_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: normal;
  gap: 0.6rem;
  font-size: 1.4rem;
  word-break: break-all;
}
.question_stat {
  /* 25.04.30 css 수정 문제 출제횟수, 합격/불합격 인원, 합격률 */
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 2.4rem;
  width: 100%;
}
.question_stat_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0.2rem;
  width: 100%;
}
.question_stat_list li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1.2rem;
}
.question_stat_list li .txt_neutral600 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.6rem;
  min-width: 5.6rem;
}
.question_stat_list li .txt_neutral600::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 100rem;
}
.question_stat_black .txt_neutral600::before {
  background: #202022;
}
.question_stat_blue .txt_neutral600::before {
  background: #0f39c2;
}
.question_stat_red .txt_neutral600::before {
  background: #e10036;
}
.question_stat_number, .question_stat_pass, .question_stat_fail {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.2rem;
  font-size: 1.4rem;
  font-weight: 500;
  text-align: right;
  width: 100%;
}
.question_stat_number::before, .question_stat_pass::before, .question_stat_fail::before {
  content: "";
  display: block;
  height: 0.1rem;
  width: 100%;
  border-top: 1px dashed #cfd0d2;
}
.question_stat_number {
  color: #202022;
}
.question_stat_pass {
  color: #0f39c2;
}
.question_stat_fail {
  color: #e10036;
}
.question_stat_rate {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1.4rem;
  font-weight: 600;
  color: #0f39c2;
}
.question_stat_rate_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 1.2rem;
  position: relative;
}
.question_history .badge:nth-child(n+2)::before {
  content: "";
  display: inline-block;
  width: 0.1rem;
  height: 0.8rem;
  background: #adaeb3;
  margin: 0 0.6rem;
}
.question_example {
  font-size: 1.4rem;
  color: #202022;
}
.question_stt_area {
  /* 25.05.04 추가 - STT 영역  */
  background: #edf6ff;
  padding: 1.2rem 1.6rem;
  border: 1px solid #d7e9ff;
  border-radius: 0.8rem;
  line-height: 1.4;
  scroll-margin-bottom: 28rem;
  scroll-padding-bottom: 28rem;
  overflow-y: auto;
  color: #0f39c2;
  overflow-wrap: break-word;
  word-break: break-all;
  text-align: left;
  font-size: 1.5rem;
  min-height: 4.2rem;
  max-height: 8.2rem;
}
.question_stt_circle {
  /* 25.05.04 추가 - STT 뱃지  */
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 100rem;
  box-shadow: 0.1rem 0.1rem 0.1rem rgba(255, 255, 255, 0.2);
  position: relative;
  overflow: hidden;
}
.question_stt_circle_inner {
  /* 25.05.04 추가 - STT 뱃지 내부 */
  width: 4.8rem;
  height: 4.8rem;
  background: rgba(255, 255, 255, 0.2) url(/static/images/ico20_mic_wt.svg) center center no-repeat;
  background-size: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(0.3rem);
          backdrop-filter: blur(0.3rem);
  border-radius: 100rem;
}
.question_stt_circle.blue::before {
  /* 25.05.04 추가 - STT 뱃지 블루 */
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right bottom, #88c4ff 0%, #277dff 50%, #0945ec 100%);
  animation: rotateBlue 2s linear infinite;
  transform-origin: center;
}
@keyframes rotateBlue {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.question_stt_circle.red::before {
  /* 25.05.04 추가 - STT 뱃지 레드 */
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right bottom, #ff9fb6 0%, #f54a73 50%, #e10036 100%);
}

/* 식별번호 리스트[통계 상세 : B01-4] */
.id_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0rem;
}
.id_list_item {
  /* 25.04.30 css 수정 */
  display: grid;
  grid-template-columns: 1fr 6.4rem;
  gap: 1.2rem;
  padding: 0.8rem 0;
  border-bottom: 1px solid #e6e6e7;
}
.id_list_item .badge {
  /* 25.04.30 css 추가 */
  width: -moz-fit-content;
  width: fit-content;
  justify-self: end;
}
.id_info {
  /* 25.04.30 css 수정 */
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  width: 100%;
}
.id_number {
  font-size: 1.3rem;
  font-weight: 500;
  color: #202022;
}
.id_exam_date {
  font-size: 1.2rem;
  color: #5a5b60;
}
.id_choice_wrap {
  background: #ffffff;
  border: 1px solid #e6e6e7;
  border-radius: 0.8rem;
  padding: 1.2rem 1.6rem;
  width: 100%;
}
.id_choice_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.8rem;
  font-size: 1.3rem;
  color: #202022;
  overflow: auto;
  max-height: 15.2rem;
  position: relative;
}
.id_choice_list::-webkit-scrollbar {
  width: 0.4rem;
  background-color: transparent;
}
.id_choice_list::-webkit-scrollbar-thumb {
  width: 0.4rem;
  background-color: #cfd0d2;
  border-radius: 0.4rem;
}
.id_choice_list::-webkit-scrollbar-track {
  background-color: transparent;
}
.id_choice_list li {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.6rem;
}
.id_choice_none {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 100%;
  padding: 1.2rem 0;
}

.spinner {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  background-color: transparent;
  position: relative;
  z-index: 1;
}

.loader_circle {
  width: 15rem;
  height: 15rem;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
  position: relative;
}
.loader_circle::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 100rem;
  background: rgba(255, 255, 255, 0.05);
  -webkit-backdrop-filter: blur(0.6rem);
          backdrop-filter: blur(0.6rem);
  position: absolute;
  z-index: -2;
}
.loader_line {
  width: 15rem;
  height: 15rem;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px #0945ec;
}
.loader_line_mask {
  position: absolute;
  width: 7.5rem;
  height: 15rem;
  overflow: hidden;
  margin-left: -7.5rem;
  transform-origin: 7.5rem;
  -webkit-mask-image: linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));
          mask-image: linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));
  animation: rotate 1.2s infinite linear;
}

.logo_box {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 12rem;
  opacity: 0.7;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.limit {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  position: relative;
}
.limit_icon {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 4.8rem;
  height: 4.8rem;
  border: 1px solid #e6e6e7;
  border-radius: 100rem;
  box-shadow: 0 0.4rem 1.6rem rgba(15, 57, 194, 0.12);
  background: #ffffff url(/static/images/ico24_timer.svg) center center no-repeat;
  position: relative;
  z-index: 1;
}
.limit_text {
  padding: 0.8rem 2.4rem 0.8rem 3.6rem;
  border-top-right-radius: 100rem;
  border-bottom-right-radius: 100rem;
  background: linear-gradient(90deg, #f8fafa 0%, #e6e6e7 100%);
  font-size: 1.6rem;
  font-weight: 600;
  color: #3b3b3e;
  margin-left: -2.4rem;
  line-height: 1;
  height: 3.8rem;
  align-content: center;
}

.tab {
  border-bottom: 1px solid #e6e6e7;
  /* 25.05.06 css 추가 */
  position: fixed;
  top: 4.8rem;
  width: 100%;
  max-width: 54rem;
  background: #f8fafa;
  z-index: 1;
  /* 부대별확인(메뉴) */
}
.tab_inner {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0rem;
}
.tab_item a {
  position: relative;
  display: block;
  padding: 0.8rem 1.6rem;
  font-size: 1.4rem;
  font-weight: 500;
  color: #202022;
  opacity: 0.4;
}
.tab_item.active a {
  opacity: 1;
}
.tab_item.active a::after {
  content: "";
  width: 100%;
  height: 0.2rem;
  background: #202022;
  position: absolute;
  bottom: 0;
  left: 0;
}
.tab_container_middle {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0rem;
  width: 100%;
  flex: 1 1 0;
}
.tab_depth1 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  width: 100%;
  padding: 0 1.6rem;
  border-bottom: 1px solid #e6e6e7;
}
.tab_depth1 ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0rem;
  position: relative;
}
.tab_depth1 ul li button {
  height: 3.6rem;
  position: relative;
  font-size: 1.4rem;
  font-weight: 500;
  color: #202022;
  padding: 0.8rem 1.6rem;
  opacity: 0.4;
}
.tab_depth1 ul li.active button {
  opacity: 1;
}
.tab_depth1 ul li.active button::after {
  content: "";
  width: 100%;
  height: 0.2rem;
  background: #202022;
  position: absolute;
  bottom: 0;
  left: 0;
}
.tab_depth2 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  width: 100%;
  padding: 0 1.6rem;
  border-bottom: 1px solid #e6e6e7;
}
.tab_depth2 ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0rem;
  position: relative;
}
.tab_depth2 ul li button {
  height: 3.6rem;
  position: relative;
  font-size: 1.4rem;
  font-weight: 400;
  color: #202022;
  padding: 0.8rem 1.6rem;
  opacity: 0.4;
}
.tab_depth2 ul li.active button {
  font-weight: 500;
  opacity: 1;
}
.tab_depth3 {
  width: 14rem;
  flex: 0 0 auto;
}
.tab_depth3 ul {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0rem;
}
.tab_depth3 ul li {
  width: 100%;
}
.tab_depth3 ul li button {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  width: 100%;
  height: 4.2rem;
  padding: 1.2rem 0.8rem 1.2rem 3.2rem;
  font-size: 1.3rem;
  color: #202022;
  opacity: 0.4;
}
.tab_depth3 ul li button .tab_choice {
  display: none;
}
.tab_depth3 ul li.active button {
  background: #ffffff;
  font-weight: 500;
  opacity: 1;
}
.tab_depth3 ul li.active .tab_choice {
  display: block;
}
.tab_depth4 {
  width: 100%;
  height: 100%;
  background: #ffffff;
  padding: 1.2rem;
}
.tab_depth4_list_item > button {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  position: relative;
  width: 100%;
  height: 4.2rem;
  font-size: 1.3rem;
  font-weight: 500;
  color: #202022;
  padding: 1.2rem 0.8rem 1.2rem 2.6rem;
  border-radius: 0.8rem;
}
.tab_depth4_list_item > button::before {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: url(/static/images/ico14_solid_right.svg) center center no-repeat;
  position: absolute;
  left: 0.8rem;
  top: 50%;
  transform: translateY(-50%);
}
.tab_depth4_list_item > button .tab_choice {
  display: none;
}
.tab_depth4_list_item.active > button {
  background: #edf6ff;
}
.tab_depth4_list_item.active > button::before {
  background: url(/static/images/ico14_solid_blue.svg) center center no-repeat;
}
.tab_depth4_list_item.active .tab_choice {
  display: block;
}
.tab_depth4_list_item.active .tab_depth5 {
  display: block;
}
.tab_depth5 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.4rem;
  padding: 0.4rem 1.2rem;
  display: none;
}
.tab_depth5 li {
  width: 100%;
}
.tab_depth5 li button {
  width: 100%;
  height: 3.4rem;
  padding: 0.8rem 1.2rem;
  font-size: 1.3rem;
  color: #5a5b60;
  text-align: left;
}
.tab_depth5 li.active button {
    color: #202022;
}
.tab_choice {
  font-size: 1.3rem;
  font-weight: 500;
  color: #84858c;
}

.badge {
  font-size: 1.2rem;
  font-weight: 500;
  color: #84858c;
}
.badge.normal {
  padding: 0.2rem 1.2rem;
  background: #f8fafa;
  outline: 1px solid #e6e6e7;
  border-radius: 100rem;
  color: #202022;
}
.badge.skyblue {
  /* 25.07.21 뱃지 추가 - 스카이블루 */
  padding: 0.2rem 1.2rem;
  background: #edf6ff;
  outline: 1px solid #b8daff;
  border-radius: 100rem;
  color: #0f39c2;
}
.badge.blue {
  padding: 0.4rem 1.2rem;
  background: #edf6ff;
  border-radius: 100rem;
  color: #0f39c2;
}
.badge.red {
  padding: 0.4rem 1.2rem;
  background: rgba(225, 0, 54, 0.05);
  border-radius: 100rem;
  color: #e10036;
}

/* 일반 진행 바 */
.progress {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 6rem;
  height: 0.4rem;
  border: none;
  border-radius: 100rem;
}
.progress::-webkit-progress-bar {
  background: #e6e6e7;
  border-radius: 100rem;
}
.progress::-webkit-progress-value {
  background: #0f39c2;
  border-radius: 100rem;
}
.progress::-moz-progress-bar {
  background: #0f39c2;
}
.progress_circle {
  /* 통계상세(B01_4) 합격률 */
  /* 파일 업로드중 */
}
.progress_circle_ring {
  transition: stroke-dashoffset 0.5s ease-in-out;
  transform: rotate(-90deg);
  transform-origin: center;
}
.progress_circle.type01 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  position: relative;
}
.progress_circle.type01 span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.progress_circle.type02 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  position: relative;
}
.progress_circle.type02 .progress_upload {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: baseline;
  gap: 0rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.progress_circle.type02 .progress_upload_rate {
  font-size: 2.2rem;
  font-weight: 700;
  color: #0f39c2;
}
.progress_circle.type02 .progress_upload_rate::after {
  content: "%";
  font-size: 1.4rem;
  font-weight: 500;
}

.breadcrumb {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.4rem;
  padding: 0.8rem 1.6rem;
  background: #ffffff;
  border-bottom: 1px solid #e6e6e7;
  /* 25.05.06 css 추가 */
  position: fixed;
  top: 4.8rem;
  width: 100%;
  max-width: 54rem;
  background: #ffffff;
  z-index: 1;
}
.breadcrumb_item {
  font-size: 1.4rem;
  font-weight: 500;
  color: #202022;
}
.breadcrumb_item:nth-child(n+2)::before {
  content: "/";
  font-size: 1.2rem;
  font-weight: 400;
  color: #adaeb3;
  margin-right: 0.4rem;
}

.review_container textarea {
  /* 25.07.21 정훈장교 평가 - textarea 패딩 수정 */
  padding-right: 1.6rem;
}
.review_btn_wrap {
  /* 25.07.21 정훈장교 평가 - 합불 선택 버튼 */
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.8rem;
}
.review_btn_content .input_wrap.hidden {
  /* 25.07.21 정훈장교 평가 - 합불 선택 시 textarea 사라짐 */
  display: none;
}

.box.type02.closed .review_btn_wrap button:disabled.active:nth-child(1) {
  /* 25.07.21 평가데이터 평가 완료 시 버튼 비활성화 [ 합격 버튼 ] */
  background: #133595 !important;
  border: 1px solid #133595 !important;
  color: #ffffff !important;
}
.box.type02.closed .review_btn_wrap button:disabled.active:nth-child(2) {
  /* 25.07.21 평가데이터 평가 완료 시 버튼 비활성화 [ 불합격 버튼 ] */
  background: #ad0029 !important;
  border: 1px solid #ad0029 !important;
  color: #ffffff !important;
}

.tooltip {
  /* 25.07.21 - 정훈장교 평가 툴팁 아이콘 */
  display: block;
  cursor: pointer;
  padding: 0.2rem;
  background: url(../images/ico16_info.svg) no-repeat center center;
  width: 2rem;
  height: 2rem;
}

[data-tooltip] {
  /* 25.07.21 - 정훈장교 평가 툴팁 */
  position: relative;
}
[data-tooltip]::before, [data-tooltip]::after {
  /* 25.07.21 - 정훈장교 평가 툴팁 - 기본 형태 */
  visibility: hidden;
  opacity: 0;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.15s ease-in-out;
  font-size: 1.2rem;
  z-index: 9;
}
[data-tooltip]::before {
  /* 25.07.21 - 정훈장교 평가 툴팁 - 배경 */
  content: attr(data-tooltip);
  position: absolute;
  bottom: 2.2rem;
  padding: 0.4rem 0.8rem;
  border-radius: 0.4rem;
  color: #ffffff;
  background: #202022;
  word-break: break-all;
  min-width: 16rem;
}
[data-tooltip]:after {
  /* 25.07.21 - 정훈장교 평가 툴팁 - 아래 화살표 */
  content: "";
  border-left: 0.5rem solid transparent;
  bottom: 1.6rem;
  border-right: 0.5rem solid transparent;
  border-top: 0.5rem solid #202022;
}

[data-tooltip]:not([data-tooltip=""]):hover:before {
  /* 25.07.21 - 정훈장교 평가 툴팁 - 활성화 */
  visibility: visible;
  opacity: 1;
  bottom: 2.6rem;
}

[data-tooltip]:not([data-tooltip=""]):hover:after {
  /* 25.07.21 - 정훈장교 평가 툴팁 - 활성화 */
  visibility: visible;
  opacity: 1;
  bottom: 2.2rem;
}

/* text */
.word {
  word-break: break-all;
}

h2 {
  font-size: 7rem;
  font-weight: 700;
}

h3 {
  font-size: 4rem;
  font-weight: 700;
}

h4 {
  font-size: 2.4rem;
  font-weight: 600;
}

h5 {
  font-size: 1.8rem;
  font-weight: 700;
}

.txt {
  display: inline-block;
}
.txt_22 {
  font-size: 2.2rem;
}
.txt_20 {
  font-size: 2rem;
}
.txt_18 {
  font-size: 1.8rem;
}
.txt_16 {
  font-size: 1.6rem;
}
.txt_15 {
  font-size: 1.5rem;
}
.txt_14 {
  font-size: 1.4rem;
}
.txt_13 {
  font-size: 1.3rem;
}
.txt_12 {
  font-size: 1.2rem;
}
.txt_underline {
  text-decoration: underline;
}

.fw100 {
  font-weight: 100;
}
.fw200 {
  font-weight: 200;
}
.fw300 {
  font-weight: 300;
}
.fw400 {
  font-weight: 400;
}
.fw500 {
  font-weight: 500;
}
.fw600 {
  font-weight: 600;
}
.fw700 {
  font-weight: 700;
}
.fw800 {
  font-weight: 800;
}
.fw900 {
  font-weight: 900;
}

.dot {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.4rem;
}
.dot:before {
  content: "";
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 100rem;
  background: #adaeb3;
  margin-top: 0.7rem;
  flex: 0 0 auto;
}

.ellipsis1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
  line-height: 140%;
}

.ellipsis2 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 140%;
}

.ellipsis3 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 140%;
}

.ellipsis1 {
  display: block;
}

/* align */
.align {
  display: flex;
}
.align.inline {
  display: inline-flex;
}
.align.right {
  justify-content: flex-end;
}
.align.center {
  justify-content: center;
}
.align.both {
  justify-content: space-between;
}
.align.bottom {
  position: fixed;
  left: 2rem;
  right: 2rem;
  bottom: 3rem;
}
.align.f-wrap {
  flex-wrap: wrap;
}
.align.col {
  flex-direction: column;
}
.align.vt {
  align-items: flex-start;
}
.align.vm {
  align-items: center;
}
.align.vb {
  align-items: flex-end;
}
.align.triple {
  display: block;
  position: relative;
}
.align.triple::after {
  content: "";
  display: block;
  clear: both;
}
.align.triple .left {
  float: left;
}
.align.triple .right {
  float: right;
}
.align.triple .center {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}
.align.triple .bottom {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}
.align-btn {
  display: flex;
  gap: 1rem;
}
.align-btn .btn {
  flex: 1;
}

.gap2 {
  gap: 0.2rem;
}
.gap4 {
  gap: 0.4rem;
}
.gap8 {
  gap: 0.8rem;
}
.gap12 {
  gap: 1.2rem;
}
.gap16 {
  gap: 1.6rem;
}
.gap24 {
  gap: 2.4rem;
}
.gap32 {
  gap: 3.2rem;
}

.txt_left {
  text-align: left !important;
}
.txt_center {
  text-align: center !important;
}
.txt_right {
  text-align: right !important;
}

.flex {
  display: flex;
}
.flex > * {
  flex: 1;
}
.flex.none {
  flex: none;
}

.mt0 {
  margin-top: 0rem;
}
.mt2 {
  margin-top: 0.2rem;
}
.mt3 {
  margin-top: 0.3rem;
}
.mt4 {
  margin-top: 0.4rem;
}
.mt5 {
  margin-top: 0.5rem;
}
.mt6 {
  margin-top: 0.6rem;
}
.mt8 {
  margin-top: 0.8rem;
}
.mt10 {
  margin-top: 1rem;
}
.mt12 {
  margin-top: 1.2rem;
}
.mt14 {
  margin-top: 1.4rem;
}
.mt15 {
  margin-top: 1.5rem;
}
.mt16 {
  margin-top: 1.6rem;
}
.mt18 {
  margin-top: 1.8rem;
}
.mt20 {
  margin-top: 2rem;
}
.mt22 {
  margin-top: 2.2rem;
}
.mt24 {
  margin-top: 2.4rem;
}
.mt25 {
  margin-top: 2.5rem;
}
.mt26 {
  margin-top: 2.6rem;
}
.mt28 {
  margin-top: 2.8rem;
}
.mt30 {
  margin-top: 3rem;
}
.mt32 {
  margin-top: 3.2rem;
}
.mt34 {
  margin-top: 3.4rem;
}
.mt36 {
  margin-top: 3.6rem;
}
.mt38 {
  margin-top: 3.8rem;
}
.mt40 {
  margin-top: 4rem;
}
.mt46 {
  margin-top: 4.6rem;
}
.mt48 {
  margin-top: 4.8rem;
}
.mt50 {
  margin-top: 5rem;
}
.mt60 {
  margin-top: 6rem;
}
.mt70 {
  margin-top: 7rem;
}
.mt80 {
  margin-top: 8rem;
}
.mt90 {
  margin-top: 9rem;
}
.mt100 {
  margin-top: 10rem;
}
.mt120 {
  margin-top: 12rem;
}
.mt140 {
  margin-top: 14rem;
}
.mt160 {
  margin-top: 16rem;
}
.mt180 {
  margin-top: 18rem;
}
.mt200 {
  margin-top: 20rem;
}

.mb0 {
  margin-bottom: 0rem;
}
.mb2 {
  margin-bottom: 0.2rem;
}
.mb3 {
  margin-bottom: 0.3rem;
}
.mb4 {
  margin-bottom: 0.4rem;
}
.mb5 {
  margin-bottom: 0.5rem;
}
.mb6 {
  margin-bottom: 0.6rem;
}
.mb8 {
  margin-bottom: 0.8rem;
}
.mb10 {
  margin-bottom: 1rem;
}
.mb12 {
  margin-bottom: 1.2rem;
}
.mb14 {
  margin-bottom: 1.4rem;
}
.mb15 {
  margin-bottom: 1.5rem;
}
.mb16 {
  margin-bottom: 1.6rem;
}
.mb18 {
  margin-bottom: 1.8rem;
}
.mb20 {
  margin-bottom: 2rem;
}
.mb22 {
  margin-bottom: 2.2rem;
}
.mb24 {
  margin-bottom: 2.4rem;
}
.mb25 {
  margin-bottom: 2.5rem;
}
.mb26 {
  margin-bottom: 2.6rem;
}
.mb28 {
  margin-bottom: 2.8rem;
}
.mb30 {
  margin-bottom: 3rem;
}
.mb32 {
  margin-bottom: 3.2rem;
}
.mb34 {
  margin-bottom: 3.4rem;
}
.mb36 {
  margin-bottom: 3.6rem;
}
.mb38 {
  margin-bottom: 3.8rem;
}
.mb40 {
  margin-bottom: 4rem;
}
.mb46 {
  margin-bottom: 4.6rem;
}
.mb48 {
  margin-bottom: 4.8rem;
}
.mb50 {
  margin-bottom: 5rem;
}
.mb60 {
  margin-bottom: 6rem;
}
.mb70 {
  margin-bottom: 7rem;
}
.mb80 {
  margin-bottom: 8rem;
}
.mb90 {
  margin-bottom: 9rem;
}
.mb100 {
  margin-bottom: 10rem;
}
.mb120 {
  margin-bottom: 12rem;
}
.mb140 {
  margin-bottom: 14rem;
}
.mb160 {
  margin-bottom: 16rem;
}
.mb180 {
  margin-bottom: 18rem;
}
.mb200 {
  margin-bottom: 20rem;
}

.ml0 {
  margin-left: 0rem;
}
.ml2 {
  margin-left: 0.2rem;
}
.ml3 {
  margin-left: 0.3rem;
}
.ml4 {
  margin-left: 0.4rem;
}
.ml5 {
  margin-left: 0.5rem;
}
.ml6 {
  margin-left: 0.6rem;
}
.ml8 {
  margin-left: 0.8rem;
}
.ml10 {
  margin-left: 1rem;
}
.ml12 {
  margin-left: 1.2rem;
}
.ml14 {
  margin-left: 1.4rem;
}
.ml15 {
  margin-left: 1.5rem;
}
.ml16 {
  margin-left: 1.6rem;
}
.ml18 {
  margin-left: 1.8rem;
}
.ml20 {
  margin-left: 2rem;
}
.ml22 {
  margin-left: 2.2rem;
}
.ml24 {
  margin-left: 2.4rem;
}
.ml25 {
  margin-left: 2.5rem;
}
.ml26 {
  margin-left: 2.6rem;
}
.ml28 {
  margin-left: 2.8rem;
}
.ml30 {
  margin-left: 3rem;
}
.ml32 {
  margin-left: 3.2rem;
}
.ml34 {
  margin-left: 3.4rem;
}
.ml36 {
  margin-left: 3.6rem;
}
.ml38 {
  margin-left: 3.8rem;
}
.ml40 {
  margin-left: 4rem;
}
.ml46 {
  margin-left: 4.6rem;
}
.ml48 {
  margin-left: 4.8rem;
}
.ml50 {
  margin-left: 5rem;
}
.ml60 {
  margin-left: 6rem;
}
.ml70 {
  margin-left: 7rem;
}
.ml80 {
  margin-left: 8rem;
}
.ml90 {
  margin-left: 9rem;
}
.ml100 {
  margin-left: 10rem;
}
.ml120 {
  margin-left: 12rem;
}
.ml140 {
  margin-left: 14rem;
}
.ml160 {
  margin-left: 16rem;
}
.ml180 {
  margin-left: 18rem;
}
.ml200 {
  margin-left: 20rem;
}

.mr0 {
  margin-right: 0rem;
}
.mr2 {
  margin-right: 0.2rem;
}
.mr3 {
  margin-right: 0.3rem;
}
.mr4 {
  margin-right: 0.4rem;
}
.mr5 {
  margin-right: 0.5rem;
}
.mr6 {
  margin-right: 0.6rem;
}
.mr7 {
  margin-right: 0.7rem;
}
.mr8 {
  margin-right: 0.8rem;
}
.mr10 {
  margin-right: 1rem;
}
.mr12 {
  margin-right: 1.2rem;
}
.mr14 {
  margin-right: 1.4rem;
}
.mr15 {
  margin-right: 1.5rem;
}
.mr16 {
  margin-right: 1.6rem;
}
.mr18 {
  margin-right: 1.8rem;
}
.mr20 {
  margin-right: 2rem;
}
.mr22 {
  margin-right: 2.2rem;
}
.mr24 {
  margin-right: 2.4rem;
}
.mr25 {
  margin-right: 2.5rem;
}
.mr26 {
  margin-right: 2.6rem;
}
.mr28 {
  margin-right: 2.8rem;
}
.mr30 {
  margin-right: 3rem;
}
.mr32 {
  margin-right: 3.2rem;
}
.mr34 {
  margin-right: 3.4rem;
}
.mr36 {
  margin-right: 3.6rem;
}
.mr38 {
  margin-right: 3.8rem;
}
.mr40 {
  margin-right: 4rem;
}
.mr46 {
  margin-right: 4.6rem;
}
.mr48 {
  margin-right: 4.8rem;
}
.mr50 {
  margin-right: 5rem;
}
.mr60 {
  margin-right: 6rem;
}
.mr70 {
  margin-right: 7rem;
}
.mr80 {
  margin-right: 8rem;
}
.mr90 {
  margin-right: 9rem;
}
.mr100 {
  margin-right: 10rem;
}
.mr120 {
  margin-right: 12rem;
}
.mr140 {
  margin-right: 14rem;
}
.mr160 {
  margin-right: 16rem;
}
.mr180 {
  margin-right: 18rem;
}
.mr200 {
  margin-right: 20rem;
}

.pt0 {
  padding-top: 0rem;
}
.pt2 {
  padding-top: 0.2rem;
}
.pt3 {
  padding-top: 0.3rem;
}
.pt4 {
  padding-top: 0.4rem;
}
.pt5 {
  padding-top: 0.5rem;
}
.pt6 {
  padding-top: 0.6rem;
}
.pt8 {
  padding-top: 0.8rem;
}
.pt10 {
  padding-top: 1rem;
}
.pt12 {
  padding-top: 1.2rem;
}
.pt14 {
  padding-top: 1.4rem;
}
.pt15 {
  padding-top: 1.5rem;
}
.pt16 {
  padding-top: 1.6rem;
}
.pt18 {
  padding-top: 1.8rem;
}
.pt20 {
  padding-top: 2rem;
}
.pt22 {
  padding-top: 2.2rem;
}
.pt24 {
  padding-top: 2.4rem;
}
.pt25 {
  padding-top: 2.5rem;
}
.pt26 {
  padding-top: 2.6rem;
}
.pt28 {
  padding-top: 2.8rem;
}
.pt30 {
  padding-top: 3rem;
}
.pt32 {
  padding-top: 3.2rem;
}
.pt34 {
  padding-top: 3.4rem;
}
.pt36 {
  padding-top: 3.6rem;
}
.pt38 {
  padding-top: 3.8rem;
}
.pt40 {
  padding-top: 4rem;
}
.pt46 {
  padding-top: 4.6rem;
}
.pt48 {
  padding-top: 4.8rem;
}
.pt50 {
  padding-top: 5rem;
}
.pt60 {
  padding-top: 6rem;
}
.pt70 {
  padding-top: 7rem;
}
.pt80 {
  padding-top: 8rem;
}
.pt90 {
  padding-top: 9rem;
}
.pt100 {
  padding-top: 10rem;
}
.pt120 {
  padding-top: 12rem;
}
.pt140 {
  padding-top: 14rem;
}
.pt160 {
  padding-top: 16rem;
}
.pt180 {
  padding-top: 18rem;
}
.pt200 {
  padding-top: 20rem;
}

.pl0 {
  padding-left: 0rem;
}
.pl2 {
  padding-left: 0.2rem;
}
.pl3 {
  padding-left: 0.3rem;
}
.pl4 {
  padding-left: 0.4rem;
}
.pl5 {
  padding-left: 0.5rem;
}
.pl6 {
  padding-left: 0.6rem;
}
.pl8 {
  padding-left: 0.8rem;
}
.pl10 {
  padding-left: 1rem;
}
.pl12 {
  padding-left: 1.2rem;
}
.pl14 {
  padding-left: 1.4rem;
}
.pl15 {
  padding-left: 1.5rem;
}
.pl16 {
  padding-left: 1.6rem;
}
.pl18 {
  padding-left: 1.8rem;
}
.pl20 {
  padding-left: 2rem;
}
.pl22 {
  padding-left: 2.2rem;
}
.pl24 {
  padding-left: 2.4rem;
}
.pl25 {
  padding-left: 2.5rem;
}
.pl26 {
  padding-left: 2.6rem;
}
.pl28 {
  padding-left: 2.8rem;
}
.pl30 {
  padding-left: 3rem;
}
.pl32 {
  padding-left: 3.2rem;
}
.pl34 {
  padding-left: 3.4rem;
}
.pl36 {
  padding-left: 3.6rem;
}
.pl38 {
  padding-left: 3.8rem;
}
.pl40 {
  padding-left: 4rem;
}
.pl46 {
  padding-left: 4.6rem;
}
.pl48 {
  padding-left: 4.8rem;
}
.pl50 {
  padding-left: 5rem;
}
.pl60 {
  padding-left: 6rem;
}
.pl70 {
  padding-left: 7rem;
}
.pl80 {
  padding-left: 8rem;
}
.pl90 {
  padding-left: 9rem;
}
.pl100 {
  padding-left: 10rem;
}
.pl120 {
  padding-left: 12rem;
}
.pl140 {
  padding-left: 14rem;
}
.pl160 {
  padding-left: 16rem;
}
.pl180 {
  padding-left: 18rem;
}
.pl200 {
  padding-left: 20rem;
}

.pr0 {
  padding-right: 0rem;
}
.pr2 {
  padding-right: 0.2rem;
}
.pr3 {
  padding-right: 0.3rem;
}
.pr4 {
  padding-right: 0.4rem;
}
.pr5 {
  padding-right: 0.5rem;
}
.pr6 {
  padding-right: 0.6rem;
}
.pr8 {
  padding-right: 0.8rem;
}
.pr10 {
  padding-right: 1rem;
}
.pr12 {
  padding-right: 1.2rem;
}
.pr14 {
  padding-right: 1.4rem;
}
.pr15 {
  padding-right: 1.5rem;
}
.pr16 {
  padding-right: 1.6rem;
}
.pr18 {
  padding-right: 1.8rem;
}
.pr20 {
  padding-right: 2rem;
}
.pr22 {
  padding-right: 2.2rem;
}
.pr24 {
  padding-right: 2.4rem;
}
.pr25 {
  padding-right: 2.5rem;
}
.pr26 {
  padding-right: 2.6rem;
}
.pr28 {
  padding-right: 2.8rem;
}
.pr30 {
  padding-right: 3rem;
}
.pr32 {
  padding-right: 3.2rem;
}
.pr34 {
  padding-right: 3.4rem;
}
.pr36 {
  padding-right: 3.6rem;
}
.pr38 {
  padding-right: 3.8rem;
}
.pr40 {
  padding-right: 4rem;
}
.pr46 {
  padding-right: 4.6rem;
}
.pr48 {
  padding-right: 4.8rem;
}
.pr50 {
  padding-right: 5rem;
}
.pr60 {
  padding-right: 6rem;
}
.pr70 {
  padding-right: 7rem;
}
.pr80 {
  padding-right: 8rem;
}
.pr90 {
  padding-right: 9rem;
}
.pr100 {
  padding-right: 10rem;
}
.pr120 {
  padding-right: 12rem;
}
.pr140 {
  padding-right: 14rem;
}
.pr160 {
  padding-right: 16rem;
}
.pr180 {
  padding-right: 18rem;
}
.pr200 {
  padding-right: 20rem;
}

.pb0 {
  padding-bottom: 0rem;
}
.pb2 {
  padding-bottom: 0.2rem;
}
.pb3 {
  padding-bottom: 0.3rem;
}
.pb4 {
  padding-bottom: 0.4rem;
}
.pb5 {
  padding-bottom: 0.5rem;
}
.pb6 {
  padding-bottom: 0.6rem;
}
.pb8 {
  padding-bottom: 0.8rem;
}
.pb10 {
  padding-bottom: 1rem;
}
.pb12 {
  padding-bottom: 1.2rem;
}
.pb14 {
  padding-bottom: 1.4rem;
}
.pb15 {
  padding-bottom: 1.5rem;
}
.pb16 {
  padding-bottom: 1.6rem;
}
.pb18 {
  padding-bottom: 1.8rem;
}
.pb20 {
  padding-bottom: 2rem;
}
.pb22 {
  padding-bottom: 2.2rem;
}
.pb24 {
  padding-bottom: 2.4rem;
}
.pb25 {
  padding-bottom: 2.5rem;
}
.pb26 {
  padding-bottom: 2.6rem;
}
.pb28 {
  padding-bottom: 2.8rem;
}
.pb30 {
  padding-bottom: 3rem;
}
.pb32 {
  padding-bottom: 3.2rem;
}
.pb34 {
  padding-bottom: 3.4rem;
}
.pb36 {
  padding-bottom: 3.6rem;
}
.pb38 {
  padding-bottom: 3.8rem;
}
.pb40 {
  padding-bottom: 4rem;
}
.pb46 {
  padding-bottom: 4.6rem;
}
.pb48 {
  padding-bottom: 4.8rem;
}
.pb50 {
  padding-bottom: 5rem;
}
.pb60 {
  padding-bottom: 6rem;
}
.pb70 {
  padding-bottom: 7rem;
}
.pb80 {
  padding-bottom: 8rem;
}
.pb90 {
  padding-bottom: 9rem;
}
.pb100 {
  padding-bottom: 10rem;
}
.pb120 {
  padding-bottom: 12rem;
}
.pb140 {
  padding-bottom: 14rem;
}
.pb160 {
  padding-bottom: 16rem;
}
.pb180 {
  padding-bottom: 18rem;
}
.pb200 {
  padding-bottom: 20rem;
}

.w100 {
  width: 100%;
}

.h100 {
  height: 100%;
}

/* 25.05.04 css 추가 */
.relative {
  position: relative;
}