@charset "UTF-8";
.card-table {
  padding: 16px 0;
  border-top: 2px solid #3c79c2;
  border-bottom: 1px solid #cbcccc;
}
.card-table .card-table__row {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
.card-table .card-table__row .card-table__label {
  flex: 0 0 180px;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
  line-height: 150%;
}
.card-table .card-table__row .card-table__content {
  flex: 1;
  font-size: 1.0625rem;
  font-weight: 500;
  color: #4b4d4b;
  line-height: 1;
  line-height: 150%;
}

ul.movie-card-wrp {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1rem;
  margin-top: 16px;
}
ul.movie-card-wrp .movie-card__description * {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
  line-height: 1.6;
  font-family: inherit !important;
}
ul.movie-card-wrp li.movie-card {
  background: #ffffff;
  border: 1px solid #cbcccc;
  border-radius: 0.75rem;
  padding: 2rem;
  margin-bottom: 24px;
  display: flex;
  gap: 0.3125rem;
}
ul.movie-card-wrp li.movie-card:last-child {
  margin-bottom: 0;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card {
    flex-direction: column;
    padding: 24px;
    border-radius: 8px;
    margin-bottom: 16px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__index {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
  margin-right: 10px;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__index {
    margin-right: 5px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__cnt {
  flex: 1;
}
ul.movie-card-wrp li.movie-card .movie-card__top {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1rem;
}
ul.movie-card-wrp li.movie-card .movie-card__header {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #cbcccc;
  margin-bottom: 1rem;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header {
    gap: 16px;
    padding-bottom: 12px;
    margin-bottom: 12px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header img.movie-card__poster {
  width: 7.5rem;
  height: 10rem;
  border-radius: 0.375rem;
  object-fit: cover;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header img.movie-card__poster {
    width: 80px;
    height: 107px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  flex: 1;
  gap: 0.75rem;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info {
    gap: 8px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top {
  display: flex;
  align-items: center;
  gap: 0rem;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--color-gray-gy-20, #cbcccc);
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__age {
  display: flex;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__age {
    display: flex;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__index {
  padding: 3px 8px;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-small2, 4px);
  background: var(--color-point-highlight-h-p, #6355ab);
  color: #fff;
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__index.movie-card__index--all {
  background: #00b248;
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__index.movie-card__index--12 {
  background: #ff8c00;
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__index.movie-card__index--15 {
  background: #0b78cb;
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__index.movie-card__index--19 {
  background: #c04657;
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__index.movie-card__index--etc {
  background: #4a4a4a;
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__header-row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  align-items: center;
  gap: 1rem;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__header-row {
    gap: 12px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__header-row span.movie-card__age {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  height: 2rem;
  padding: 0 0.5rem;
  background: #228738;
  color: #ffffff;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  border-radius: 0.25rem;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top .movie-card__header-row span.movie-card__age {
    height: 28px;
    padding: 0 6px;
    font-size: 14px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top h3.movie-card__title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
  color: #4b4d4d;
  margin: 0;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__top h3.movie-card__title {
    font-size: 20px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 8px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details > span {
  flex: 1 1 calc(50% - 8px);
  max-width: calc(50% - 8px);
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details > span {
    flex: 1 1 100%;
    max-width: 100%;
    word-break: break-word;
    font-size: 13px;
    letter-spacing: -0.7px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row {
    flex-direction: column;
    gap: 8px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row .movie-card__detail-item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.5rem;
  flex: 1;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row .movie-card__detail-item {
    gap: 6px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row .movie-card__detail-item span.movie-card__label {
  width: 3.75rem;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #333;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row .movie-card__detail-item span.movie-card__label {
    width: 50px;
    font-size: 14px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row .movie-card__detail-item span.movie-card__label.movie-card__label--genre {
  color: #000000;
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row .movie-card__detail-item span.movie-card__value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__details-row .movie-card__detail-item span.movie-card__value {
    font-size: 14px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__language-row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__language-row {
    gap: 6px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__language-row span.movie-card__language-label {
  width: 3.75rem;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #333;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__language-row span.movie-card__language-label {
    width: 50px;
    font-size: 14px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__language-row span.movie-card__language {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  flex: 1;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__header .movie-card__info .movie-card__details .movie-card__language-row span.movie-card__language {
    font-size: 14px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__description {
  background: #f1f2f2;
  border-radius: 0.375rem;
  padding: 2rem;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__description {
    padding: 20px;
    border-radius: 4px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__description p {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  margin: 0;
}
@media (max-width: 900px) {
  ul.movie-card-wrp li.movie-card .movie-card__description p {
    font-size: 14px;
  }
}
ul.movie-card-wrp li.movie-card .movie-card__description p return {
  word-break: break-word;
}

.usage-guide .tac img {
  display: inline-block;
}
.usage-guide.type-2 .usage-guide__content {
  padding: 1rem;
  border-radius: 8px;
  background: var(--color-gray-gy-05, #f1f2f2);
}
.usage-guide.type-2 .usage-guide__content li {
  margin-bottom: 10px !important;
}
.usage-guide__title {
  margin: 2.5rem 0;
  margin-bottom: 1.25rem;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.75rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
}
@media (max-width: 900px) {
  .usage-guide__title {
    margin: 1.25rem 0;
  }
}
.usage-guide__content li {
  margin-bottom: 6px;
  position: relative;
  padding-left: 0.75rem;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1;
  line-height: 150%;
  letter-spacing: -0.01em;
}
.usage-guide__content li ul {
  margin-top: 10px;
}
.usage-guide__content li ul li {
  line-height: 150%;
}
.usage-guide__content li ul li::before {
  display: none;
}
.usage-guide__content li::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 50%;
  background: #000;
}
@media (max-width: 900px) {
  .usage-guide__content li::before {
    top: 8px;
  }
}
.usage-guide__content li:last-child {
  margin-bottom: 0;
}
.usage-guide__content li.list-none {
  padding-left: 0;
}
.usage-guide__content li.list-none::before {
  display: none;
}
.usage-guide__content li.noti {
  padding-left: 20px;
  position: relative;
}
.usage-guide__content li.noti::before {
  position: absolute;
  top: 0px;
  content: "※";
  display: inline-block;
  width: 0;
  height: 0;
}
.usage-guide__table-wrapper {
  margin-top: 20px;
  border-top: 2px solid #30619b;
}
@media (max-width: 900px) {
  .usage-guide__table-wrapper {
    margin-top: 15px;
  }
}
@media (max-width: 900px) {
  .usage-guide__table-wrapper {
    overflow-x: auto;
  }
}
.usage-guide__table {
  width: 100%;
  border-collapse: collapse;
}
.usage-guide__table.selected-books-table td {
  text-align: center;
}
.usage-guide__table.selected-books-table td img {
  display: inline-block;
}
.usage-guide__table caption {
  display: none;
}
@media (max-width: 900px) {
  .usage-guide__table {
    min-width: 600px;
  }
}
.usage-guide__table tr th {
  padding: 1rem 0;
  border-right: 1px solid var(--color-primary-pr01, #d8e4f3);
  border-bottom: 1px solid var(--color-primary-pr01, #d8e4f3);
  border-left: 1px solid var(--color-primary-pr01, #d8e4f3);
  background: var(--color-primary-pr00, #ecf2f9);
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
}
.usage-guide__table tr td {
  text-align: center;
  padding: 1.25rem 0.625rem;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1;
  line-height: 1.5;
  border-bottom: 1px solid var(--color-gray-gy-20, #cbcccc);
  border-right: 1px solid var(--color-gray-gy-20, #cbcccc);
  border-left: 1px solid #cbcccc;
  word-break: keep-all;
}
.usage-guide__table tr td.text-left {
  text-align: left;
}
@media (max-width: 900px) {
  .usage-guide__title {
    margin: 20px 0;
    font-size: 24px;
    line-height: 120%;
    word-break: keep-all;
  }
  .usage-guide__content li {
    padding-left: 16px;
    font-size: 0.9375rem;
    line-height: 1.5;
    word-break: keep-all;
    margin-bottom: 5px;
  }
  .usage-guide__content li::before {
    content: "";
    display: block;
    position: absolute;
    top: 11px;
  }
  .usage-guide__table-wrapper .usage-guide__table tr th, .usage-guide__table-wrapper .usage-guide__table tr td {
    padding: 10px 10px;
    font-size: 14px;
  }
}

/* ========================================
   - 가로 방향으로 카드들이 배치
   - 각 카드는 하나의 데이터 항목을 표현
======================================== */
.contact-info {
  margin-bottom: 25px;
}
@media (max-width: 900px) {
  .contact-info {
    margin-bottom: 20px;
  }
}
.contact-info h3 {
  margin-top: 40px;
  font-size: 1.5rem;
  font-weight: 400;
  color: #191919;
  line-height: 1;
  position: relative;
  padding-left: 25px;
}
@media (max-width: 900px) {
  .contact-info h3 {
    margin-top: 20px;
  }
}
.contact-info h3::before {
  content: "";
  display: block;
  position: absolute;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url("../../assets/images/icon/icon-check_circle.svg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media (max-width: 900px) {
  .contact-info h3 {
    line-height: 1.3;
    word-break: keep-all;
  }
}

@media (max-width: 900px) {
  .contact-table-wrp {
    overflow-x: auto;
  }
}
@media (max-width: 900px) {
  .contact-table-wrp.scroll-x {
    overflow-x: auto;
  }
}
.contact-table-wrp .contact-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 25px;
  border-top: 2px solid #30619b;
}
@media (max-width: 900px) {
  .contact-table-wrp .contact-table {
    min-width: 600px;
  }
}
.contact-table-wrp .contact-table caption {
  display: none;
}
.contact-table-wrp .contact-table tbody tr th,
.contact-table-wrp .contact-table tbody tr td {
  padding: 18px 0;
  text-align: center;
  line-height: 150% !important;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #191919;
  line-height: 1;
  word-break: keep-all;
}
@media (max-width: 900px) {
  .contact-table-wrp .contact-table tbody tr th,
  .contact-table-wrp .contact-table tbody tr td {
    font-size: 13px;
    padding: 18px 10px;
  }
}
.contact-table-wrp .contact-table tbody tr th {
  background-color: #ecf2f9;
  border-bottom: 1px solid var(--color-primary-pr01, #d8e4f3);
}
.contact-table-wrp .contact-table tbody tr td {
  border: 1px solid var(--color-gray-gy-20, #cbcccc);
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1;
}

/* ========================================
   프로그램신청 페이지 스타일
======================================== */
.program-application {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 61rem;
  width: 100%;
}

.program-notice {
  background: #f4f5f6;
  border: 1px solid #cdd1d5;
  border-radius: 0.75rem;
  padding: 1rem;
  margin-bottom: 24px;
}
@media (max-width: 900px) {
  .program-notice {
    margin-bottom: 16px;
  }
}
.program-notice__content {
  padding-left: 1.75rem;
  margin-top: 0.5rem;
}
.program-notice__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.program-notice__list li {
  position: relative;
  padding-left: 0.75rem;
  margin-bottom: 0.5rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: #4b4d4d;
}
.program-notice__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5625rem;
  width: 0.25rem;
  height: 0.25rem;
  background: #4b4d4d;
  border-radius: 0.25rem;
}
@media (max-width: 900px) {
  .program-notice__list li::before {
    width: 4px;
    height: 4px;
  }
}
.program-notice__list li.list-none {
  padding-left: 0;
}
.program-notice__list li.list-none::before {
  display: none;
}
.program-notice__list li:last-child {
  margin-bottom: 0;
}

.program-search-section {
  background: #eef2f7;
  border-radius: 0.5rem;
  padding: 1.375rem 2rem;
}

.program-search-form {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  justify-content: flex-end;
}
@media (max-width: 900px) {
  .program-search-form .ui-select-container {
    width: 100%;
  }
}
.program-search-form .program-search__library {
  flex-shrink: 0;
  min-width: 8.75rem;
}
.program-search-form .program-search__type {
  flex-shrink: 0;
  width: 7.5rem;
}
@media (max-width: 900px) {
  .program-search-form .program-search__type {
    width: 100%;
  }
}
.program-search-form .program-search__input {
  flex: 1;
}
@media (max-width: 900px) {
  .program-search-form .program-search__input {
    width: 100%;
  }
}
.program-search-form .program-search__button {
  flex-shrink: 0;
  min-width: 4.875rem;
}
@media (max-width: 900px) {
  .program-search-form .program-search__button {
    width: 100%;
  }
}
@media (max-width: 900px) {
  .program-search-form {
    flex-direction: column;
    gap: 0.375rem;
  }
  .program-search-form .program-search__library,
  .program-search-form .program-search__type,
  .program-search-form .program-search__input {
    width: 100%;
    max-width: none;
  }
}

.program-results {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.program-results__summary {
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #4b4d4d;
}
.program-results__summary strong {
  color: #3c79c2;
  font-weight: 700;
}
@media (max-width: 900px) {
  .program-results {
    gap: 0.625rem;
  }
}

.program-card-list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .program-card-list {
    gap: 0.75rem;
  }
}

.program-card {
  background: white;
  border: 1px solid #b1b8be;
  border-radius: 0.75rem;
  padding: 2rem;
  display: flex;
  gap: 1.5rem;
  min-width: 37.5rem;
}
.program-card:hover {
  background: #f4f5f6;
}
.program-card__index {
  font-family: "Pretendard GOV";
  font-size: 0.9375rem;
  font-weight: 700;
  color: #191a1a;
  text-align: center;
  padding: 0.125rem 0.4375rem;
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.program-card__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 95%;
}
@media (max-width: 900px) {
  .program-card__content {
    width: 100%;
    gap: 0.625rem;
  }
}
.program-card__header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .program-card__header {
    gap: 0.75rem;
    flex-direction: column;
    align-items: flex-start;
  }
}
.program-card__badges {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .program-card__badges {
    gap: 0.125rem;
  }
}
.program-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media (max-width: 900px) {
  .program-card__body {
    gap: 0.5rem;
  }
}
.program-card__title {
  font-family: "Pretendard GOV";
  font-size: 1.5rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 900px) {
  .program-card__title {
    font-size: 1.125rem;
    white-space: normal;
  }
}
.program-card__details {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .program-card__details {
    gap: 0.25rem;
  }
}
.program-card__detail-row {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
@media (max-width: 900px) {
  .program-card__detail-row {
    flex-direction: column;
    gap: 0.5rem;
  }
}
@media (max-width: 900px) {
  .program-card {
    padding: 1.25rem;
    gap: 1rem;
    min-width: auto;
    flex-direction: column;
  }
  .program-card__index {
    align-self: flex-start;
  }
}

.program-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.75rem;
  height: 2rem;
  border-radius: 1rem;
  font-family: "Pretendard GOV";
  font-size: 0.9375rem;
  font-weight: 400;
  color: white;
  text-align: center;
  white-space: nowrap;
}
.program-badge--000000 {
  background: #008f37;
}
.program-badge--128121 {
  background: #F2CC3D;
}
.program-badge--128005 {
  background: #4ade80;
}
.program-badge--128058 {
  background: #7fa7d7;
}
.program-badge--128115 {
  background: #a3cf62;
}
.program-badge--128047 {
  background: #a855f7;
}
.program-badge--128099 {
  background: #ef6601;
}
.program-badge--128104 {
  background: #ffacc1;
}
.program-badge--128108 {
  background: #06b6d4;
}
.program-badge--128109 {
  background: #f59e0b;
}
.program-badge--128038 {
  background: #10b981;
}
.program-badge--128011 {
  background: #8b5cf6;
}
.program-badge--128100 {
  background: #f97316;
}
.program-badge--128086 {
  background: #ec4899;
}
.program-badge--728143 {
  background: #14b8a6;
}
.program-badge--728211 {
  background: #84cc16;
}
.program-badge--128082 {
  background: #6366f1;
}
.program-badge--728210 {
  background: #d946ef;
}
.program-badge--728220 {
  background: #189ba7;
}
.program-badge--728222 {
  background: #7b19d7;
}
.program-badge--912345 {
  background: #22d3ee;
}
.program-badge--912346 {
  background: #fb7185;
}
.program-badge--912347 {
  background: #34d399;
}
.program-badge--912348 {
  background: #fbbf24;
}
.program-badge--status-pending {
  background: #d8e4f3;
  border: 1px solid #6494ce;
  color: #30619b;
}
.program-badge--status-progress {
  background: #00993e;
}
.program-badge--status-end {
  background: #6b7280;
}
.program-badge--status-child {
  background: #fff3cd;
  border: 1px solid #ffc107;
  color: #856404;
}
@media (max-width: 900px) {
  .program-badge {
    font-size: 0.875rem;
    height: 1.625rem;
    padding: 0 0.5rem;
  }
}

.program-detail {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  flex: 1;
  min-width: 0;
}
.program-detail--full {
  flex: 2;
}
.program-detail__label {
  font-family: "Pretendard GOV";
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  flex-shrink: 0;
  min-width: 3.75rem;
}
.program-detail__label[data-long] {
  min-width: 8.3125rem;
}
@media (max-width: 900px) {
  .program-detail__label {
    min-width: auto;
    font-size: 0.9375rem;
  }
}
.program-detail__value {
  font-family: "Pretendard GOV";
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1.5;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 900px) {
  .program-detail__value {
    white-space: normal;
    font-size: 0.9375rem;
  }
}
@media (max-width: 900px) {
  .program-detail {
    flex-direction: column;
    gap: 0.25rem;
  }
  .program-detail__label {
    min-width: auto;
  }
}

/* ========================================
   공연장 신청 - 개인정보 수집·이용 동의 섹션
   - 회원가입 스타일 재사용으로 변경
======================================== */
.privacy-section {
  margin-bottom: 2rem;
}

.consent-agreement {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.consent-agreement__text {
  color: #333;
  font-family: "Noto Sans KR";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25rem;
  margin: 0;
}
.consent-agreement__header {
  display: flex;
  align-items: center;
  align-self: stretch;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .consent-agreement__header {
    gap: 0.375rem;
    margin-bottom: 0.375rem;
  }
}
.consent-agreement__icon {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .consent-agreement__icon {
    width: 1rem;
    height: 1rem;
  }
}
.consent-agreement__icon svg {
  width: 100%;
  height: 100%;
}
.consent-agreement__section-title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #000000;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .consent-agreement__section-title {
    font-size: 0.9375rem;
  }
}
.consent-agreement__text {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  gap: 0.75rem;
  padding-left: 1.75rem;
}
@media (max-width: 900px) {
  .consent-agreement__text {
    gap: 0.5rem;
    padding-left: 1.375rem;
  }
}
.consent-agreement__list {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: privacy-counter;
}
@media (max-width: 900px) {
  .consent-agreement__list {
    gap: 0.375rem;
  }
}
.consent-agreement__list li {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  gap: 0.25rem;
  position: relative;
  counter-increment: privacy-counter;
}
.consent-agreement__list li::before {
  content: counter(privacy-counter) ".";
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  color: #4b4d4d;
  width: 1rem;
  height: 1.4375rem;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  position: absolute;
}
@media (max-width: 900px) {
  .consent-agreement__list li::before {
    font-size: 0.875rem;
  }
}
.consent-agreement__list li strong {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
  padding-left: 22px;
}
@media (max-width: 900px) {
  .consent-agreement__list li strong {
    font-size: 0.875rem;
    padding-left: 1.25rem;
  }
}
.consent-agreement__list li p {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #3c79c2;
  margin: 0;
  padding-left: 1.25rem;
}
@media (max-width: 900px) {
  .consent-agreement__list li p {
    font-size: 0.875rem;
    padding-left: 1rem;
  }
}
.consent-agreement__list li ul {
  margin: 0;
  padding-left: 1.25rem;
  list-style: none;
}
@media (max-width: 900px) {
  .consent-agreement__list li ul {
    padding-left: 1rem;
  }
}
.consent-agreement__list li ul li {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
  counter-increment: none;
}
@media (max-width: 900px) {
  .consent-agreement__list li ul li {
    font-size: 0.875rem;
  }
}
.consent-agreement__list li ul li::before {
  content: "";
}
.consent-agreement__list li:nth-child(3) strong, .consent-agreement__list li:nth-child(4) strong {
  color: #4b4d4d;
}
.consent-agreement__agreement {
  background: #f1f2f2;
  border-radius: 0.625rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  align-self: stretch;
  gap: 1rem;
}
@media (max-width: 900px) {
  .consent-agreement__agreement {
    padding: 1rem;
    gap: 0.75rem;
  }
}
.consent-agreement__agreement-text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  margin: 0;
  align-self: stretch;
}
@media (max-width: 900px) {
  .consent-agreement__agreement-text {
    font-size: 0.9375rem;
  }
}
.consent-agreement__radio-group {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .consent-agreement__radio-group {
    gap: 1rem;
  }
}

.applicant-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
  gap: 1rem;
  margin-bottom: 2rem;
}
@media (max-width: 900px) {
  .applicant-form {
    gap: 0.75rem;
    margin-bottom: 1.5rem;
  }
}
.applicant-form__title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.193;
  color: #191a1a;
  margin: 0;
  align-self: stretch;
}
@media (max-width: 900px) {
  .applicant-form__title {
    font-size: 1.5rem;
  }
}
.applicant-form .form-grid {
  width: 61rem;
  max-width: 100%;
}
@media (max-width: 900px) {
  .applicant-form .form-grid {
    width: 100%;
  }
}

.time-selection-group {
  display: flex;
  gap: 1rem;
}
@media (max-width: 900px) {
  .time-selection-group {
    gap: 0.75rem;
  }
}
.time-selection-group__primary {
  display: flex;
  align-items: flex-end;
  gap: 0.75rem;
}
.time-selection-group__separator {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  color: #000000;
  display: flex;
  align-items: center;
  height: 3.5rem;
  padding: 0 0.625rem;
}
.time-selection-group__secondary {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  width: 13.5rem;
}
@media (max-width: 900px) {
  .time-selection-group__secondary {
    width: 100%;
  }
}

.radio-group--horizontal {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 29.5rem;
  height: 1.875rem;
}
@media (max-width: 900px) {
  .radio-group--horizontal {
    width: 100%;
    flex-wrap: wrap;
    height: auto;
  }
}

.form-actions {
  margin-top: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  gap: 0.5rem;
  padding-top: 1rem;
}
@media (max-width: 900px) {
  .form-actions {
    gap: 0.75rem;
  }
}
.form-actions.bd-1 {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--color-gray-gy-20, #cbcccc);
}
.form-actions__button {
  width: 8.4375rem;
  height: 3.5rem;
}
@media (max-width: 900px) {
  .form-actions__button {
    width: 100%;
  }
}

@media (max-width: 900px) {
  .mb-col {
    flex-direction: column;
  }
}

.notice-empty p {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
}

/* ========================================
   공연장 달력 컴포넌트
======================================== */
.hall-institution-tabs {
  background: #f1f2f2;
  border-radius: 0.375rem;
  padding: 0.75rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .hall-institution-tabs {
    margin-bottom: 1rem;
  }
}

@media (max-width: 900px) {
  .hall-calendar-wrp {
    overflow-x: auto;
  }
}

.hall-calendar {
  background: white;
}
@media (max-width: 900px) {
  .hall-calendar {
    min-width: 600px;
  }
}
.hall-calendar__header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 1.5rem 1rem;
  border-bottom: 1px solid #cdd1d5;
}
@media (max-width: 900px) {
  .hall-calendar__header {
    padding: 1rem 0.5rem;
    gap: 0.5rem;
  }
}
.hall-calendar__nav {
  background: none;
  border: 1px solid #cdd1d5;
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6c757d;
  cursor: pointer;
  transition: all 0.2s ease;
}
.hall-calendar__nav:hover {
  background: #f8f9fa;
}
.hall-calendar__nav:hover img {
  filter: brightness(0) saturate(100%) invert(40%) sepia(73%) saturate(1295%) hue-rotate(202deg) brightness(97%) contrast(89%);
}
.hall-calendar__nav img {
  width: 1.2rem;
  height: 1.2rem;
  filter: brightness(0) saturate(100%) invert(46%) sepia(0%) saturate(2%) hue-rotate(349deg) brightness(108%) contrast(88%);
  transition: filter 0.2s ease;
}
.hall-calendar__date {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.hall-calendar__year-select .ui-select__element, .hall-calendar__month-select .ui-select__element {
  background: none !important;
  border: none !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #1e2124 !important;
  padding: 0 30px !important;
  border-radius: 0.375rem !important;
  transition: background-color 0.2s ease;
  box-shadow: none !important;
  padding: 0 30px;
}
.hall-calendar__year-select .ui-select__element:hover, .hall-calendar__month-select .ui-select__element:hover {
  background: #f8f9fa !important;
}
.hall-calendar__year-select .ui-select__element:focus, .hall-calendar__month-select .ui-select__element:focus {
  outline: none !important;
  background: #f8f9fa !important;
}
.hall-calendar__year-select .ui-select__icon, .hall-calendar__month-select .ui-select__icon {
  width: 1rem;
  height: 1rem;
  color: #6c757d;
}
.hall-calendar__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: #f1f2f2;
  border-bottom: 1px solid #cbcccc;
}
.hall-calendar__weekday {
  padding: 0.625rem 0.5rem;
  text-align: center;
  font-weight: 700;
  font-size: 1.0625rem;
  color: #191a1a;
}
.hall-calendar__weekday--sunday {
  color: #d7424e;
}
.hall-calendar__weekday--saturday {
  color: #3c79c2;
}
@media (max-width: 900px) {
  .hall-calendar__weekday {
    padding: 0.5rem 0.25rem;
    font-size: 0.875rem;
  }
}
.hall-calendar__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}
.hall-calendar__cell {
  min-height: 6.5625rem;
  background: white;
  border: 1px solid #cbcccc;
  border-top: none;
  padding: 0.5rem;
  position: relative;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 0.25rem;
  justify-content: space-between;
}
.hall-calendar__cell:not(:nth-child(7n)) {
  border-right: none;
}
@media (max-width: 900px) {
  .hall-calendar__cell {
    min-height: 6.5625rem;
    padding: 0.25rem;
  }
}
.hall-calendar__cell--empty {
  background: white;
}
.hall-calendar__cell--today .hall-calendar__day {
  background: #d8e4f3;
  color: #18304d;
  border-radius: 1.4375rem;
  width: 2.875rem;
  height: 2.875rem;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #18304d;
  line-height: 1;
}
.hall-calendar__cell--today .hall-calendar__day::after {
  content: "";
  position: absolute;
  bottom: 0.25rem;
  left: 50%;
  transform: translateX(-50%);
  width: 0.25rem;
  height: 0.25rem;
  background: #d7424e;
  border-radius: 50%;
}
.hall-calendar__cell--sunday .hall-calendar__day {
  color: #d7424e;
}
.hall-calendar__cell--saturday .hall-calendar__day {
  color: #3c79c2;
}
.hall-calendar__day {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  text-align: center;
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .hall-calendar__day {
    font-size: 0.875rem;
    width: 2rem;
    height: 2rem;
  }
}
.hall-calendar__status {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  border: 1px solid var(--color-blue-BU800, #004470);
  background: var(--color-blue-BU500, #007ccc);
  color: white;
  border: none;
  padding: 0.25rem 0.6875rem;
  border-radius: 1.125rem;
  font-size: 0.9375rem;
  font-weight: 400;
  cursor: pointer;
  transition: background-color 0.2s ease;
  min-height: 2.25rem;
  min-width: 3.375rem;
}
.hall-calendar__status--present {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
  background: transparent;
  background-image: url("../../assets/images/icon/lib_check_present.svg") !important;
  background-size: cover;
  width: 81px;
  height: 80px;
  color: #ffffff;
  text-indent: -9999px;
  margin-left: auto;
  pointer-events: none;
}
@media (max-width: 900px) {
  .hall-calendar__status--present {
    width: 3.1875rem;
    height: 3.25rem;
    right: 4px;
    bottom: 8px;
  }
}
.hall-calendar__status--absent {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
  background: transparent;
  background-image: url("../../assets/images/icon/lib_check_absent.svg") !important;
  background-size: cover;
  width: 81px;
  height: 80px;
  color: #f1f2f2;
  text-indent: -9999px;
  margin-left: auto;
  pointer-events: none;
}
@media (max-width: 900px) {
  .hall-calendar__status--absent {
    width: 3.1875rem;
    height: 3.25rem;
    right: 4px;
    bottom: 8px;
  }
}
.hall-calendar__status--app-able {
  border-radius: 18px;
  border: 1px solid var(--color-primary-pr05, #3c79c2);
  background: var(--color-primary-pr00, #ecf2f9);
  color: #30619b;
}
.hall-calendar__status--app-closed {
  border: 1px solid var(--color-orange-OR-500, #fbbc53);
  background: var(--color-orange-OR-100, #feeaca);
  font-size: 0.9375rem;
  font-weight: 500;
  color: #8a672e;
  line-height: 1;
}
.hall-calendar__status--closed {
  border: 1px solid var(--color-primary-pr07, #244874);
  background: var(--color-primary-pr05, #3c79c2);
  min-width: 4.75rem;
  align-self: flex-end;
  pointer-events: none;
}
.hall-calendar__status--period {
  width: auto;
  border-radius: 18px;
  background: var(--color-point-highlight-h-op, #c57eba);
  font-size: 0.8125rem;
  font-weight: 400;
  color: #fff;
  line-height: 1;
  line-height: 1.5;
  align-self: flex-end;
}
@media (max-width: 900px) {
  .hall-calendar__status {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    flex-direction: column;
  }
}
.hall-calendar__buttons {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  align-items: flex-end;
  align-self: flex-end;
}
.hall-calendar__button {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  border: 1px solid var(--color-blue-BU800, #004470);
  background: var(--color-blue-BU500, #007ccc);
  color: white;
  border: none;
  padding: 0.25rem 0.6875rem;
  border-radius: 1.125rem;
  font-size: 0.9375rem;
  font-weight: 400;
  cursor: pointer;
  transition: background-color 0.2s ease;
  min-height: 1.75rem;
  min-width: 3.375rem;
}
@media (max-width: 900px) {
  .hall-calendar__button {
    gap: 2px;
    align-items: center;
  }
}
@media (max-width: 900px) {
  .hall-calendar__button img {
    width: 1rem;
    height: 1rem;
  }
}
.hall-calendar__button--check-in {
  border-radius: 18px;
  border: 1px solid var(--color-blue-BU800, #004470);
  background: var(--color-blue-BU500, #007ccc);
}
.hall-calendar__button--culture {
  border-radius: 18px;
  background: var(--color-point-highlight-h-p, #6355ab);
}
.hall-calendar__button--event {
  border-radius: 18px;
  background: var(--color-point-highlight-h-og, #ff8c00);
}
.hall-calendar__button--movie {
  border-radius: 18px;
  background: var(--color-blue-BU300, #54a7dd);
}
.hall-calendar__button--morning {
  background: #00993e;
}
.hall-calendar__button--afternoon {
  background: #ffac21;
}
.hall-calendar__button--evening {
  background: #4b4d4d;
}
.hall-calendar__button--unavailable {
  background: #e5e5e5;
  color: #4b4d4d;
  border: 1px solid #b1b3b3;
  cursor: not-allowed;
}
.hall-calendar__button--unavailable:hover {
  background: #e5e5e5;
}
.hall-calendar__button:hover:not(.hall-calendar__button--unavailable) {
  opacity: 0.8;
}
@media (max-width: 900px) {
  .hall-calendar__button {
    font-size: 0.75rem;
    padding: 0.1875rem 0.5rem;
    min-width: 2.5rem;
  }
}
.hall-calendar__footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 1rem;
  border-top: 1px solid #cdd1d5;
  padding-right: 0;
}
@media (max-width: 900px) {
  .hall-calendar__footer {
    justify-content: flex-start;
    padding: 0.75rem;
    padding-right: 0;
  }
}
.hall-calendar__actions {
  display: flex;
  gap: 0.5rem;
}

/* ========================================
   공통 검색 컴포넌트 - Common Search
   - 테이블 상단 검색 필터 영역
   - Figma 디자인 기반 구현
======================================== */
.com-search {
  background: #eef2f7;
  padding: 1.375rem 2rem;
  border-radius: 0.5rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .com-search {
    padding: 16px 20px;
    margin-bottom: 20px;
  }
}
.com-search__filters {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.75rem;
}
@media (max-width: 900px) {
  .com-search__filters {
    flex-direction: column;
    gap: 6px;
    align-items: stretch;
  }
}
.com-search__input {
  flex: 1;
  min-width: 22.5rem;
}
@media (max-width: 900px) {
  .com-search__input {
    min-width: auto;
  }
}
.com-search__button {
  min-width: 4.875rem;
}
.com-search__button .ui-button {
  background: #244874;
  border: none;
  border-radius: 0.375rem;
  height: 3rem;
  color: white;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  padding: 0 1rem;
}
.com-search__button .ui-button:hover {
  background: #1e3a5f;
}
@media (max-width: 900px) {
  .com-search__button .ui-button {
    font-size: 15px;
  }
}
@media (max-width: 900px) {
  .com-search__button {
    min-width: auto;
  }
}

/* ========================================
   만족도 조사 컴포넌트 (UiUserFeedback)
   - 서브페이지 하단 공통 컴포넌트
   - 5점 척도 라디오 버튼 + 의견 입력 + 제출 버튼
   - Figma 디자인 기반 구현
======================================== */
.user-feedback {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .user-feedback {
    gap: 16px;
    margin-bottom: 20px;
  }
}

.table-filters {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.75rem;
  flex-wrap: wrap;
}
@media (max-width: 900px) {
  .table-filters {
    gap: 8px;
    flex-direction: column;
    align-items: stretch;
  }
}
.table-filters__select {
  min-width: 10rem;
}
@media (max-width: 900px) {
  .table-filters__select {
    min-width: auto;
  }
}
.table-filters__search {
  flex: 1;
  min-width: 12.5rem;
}
@media (max-width: 900px) {
  .table-filters__search {
    min-width: auto;
  }
}
@media (max-width: 900px) {
  .table-filters__button {
    align-self: stretch;
  }
}

.table-results {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  padding: 0.75rem 0;
  border-bottom: 2px solid #e5e7eb;
}
@media (max-width: 900px) {
  .table-results {
    padding: 8px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
.table-results__count {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
}
@media (max-width: 900px) {
  .table-results__count {
    font-size: 14px;
  }
}
.table-results__count .highlight {
  font-weight: 700;
  color: #3c79c2;
}
/* ========================================
   만족도 조사 컴포넌트 (UiUserFeedback)
   - 서브페이지 하단 공통 컴포넌트
   - 5점 척도 라디오 버튼 + 의견 입력 + 제출 버튼
   - Figma 디자인 기반 구현
======================================== */
.user-feedback {
  background: #f4f5f6; /* Figma의 배경색 */
  border-radius: 0.75rem;
  padding: 2rem;
  margin: 2.5rem 0;
}
@media (max-width: 900px) {
  .user-feedback {
    padding: 1.25rem;
    margin: 1.5rem 0;
    border-radius: 0.5rem;
  }
}
.user-feedback__form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}
.user-feedback__header {
  margin-bottom: 0.5rem;
}
.user-feedback__title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.5;
  color: #131416;
  margin: 0;
  text-align: left;
}
@media (max-width: 900px) {
  .user-feedback__title {
    font-size: 1rem;
  }
}
.user-feedback__satisfaction {
  width: 100%;
}
.user-feedback__input-section {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  width: 100%;
}
@media (max-width: 900px) {
  .user-feedback__input-section {
    flex-direction: column;
    gap: 0.75rem;
  }
}

/* 만족도 선택 영역 */
.satisfaction-fieldset {
  border: none;
  padding: 0;
  margin: 0;
}

.satisfaction-options {
  display: flex;
  gap: 1.5rem;
  align-items: center;
  flex-wrap: wrap;
}
@media (max-width: 900px) {
  .satisfaction-options {
    gap: 0.5rem;
    justify-content: space-between;
  }
}

.satisfaction-option {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 0 0 auto;
}
@media (max-width: 900px) {
  .satisfaction-option {
    gap: 0.375rem;
  }
}

/* 라디오 버튼 스타일 - Figma 디자인 기반 */
.satisfaction-radio {
  appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  border: 0.0875rem solid #58616a; /* 기본 상태 */
  border-radius: 50%;
  background-color: #ffffff;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  transition: all 0.2s ease;
  /* 체크된 상태 */
  /* 포커스 상태 */
  /* 호버 상태 */
}
@media (max-width: 900px) {
  .satisfaction-radio {
    width: 1rem;
    height: 1rem;
  }
}
.satisfaction-radio:checked {
  border-color: #256ef4; /* Figma의 선택된 상태 색상 */
  border-width: 0.0875rem;
}
.satisfaction-radio:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.625rem;
  height: 0.625rem;
  background-color: #256ef4;
  border-radius: 50%;
}
@media (max-width: 900px) {
  .satisfaction-radio:checked::after {
    width: 0.5rem;
    height: 0.5rem;
  }
}
.satisfaction-radio:focus {
  outline: 2px solid rgba(37, 110, 244, 0.3);
  outline-offset: 2px;
}
.satisfaction-radio:hover:not(:checked) {
  border-color: #256ef4;
  background-color: rgba(37, 110, 244, 0.05);
}

/* 라디오 버튼 라벨 */
.satisfaction-label {
  cursor: pointer;
  user-select: none;
  /* 라벨 호버 효과 */
}
.satisfaction-label__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #131416;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .satisfaction-label__text {
    font-size: 0.9375rem;
  }
}
.satisfaction-label:hover .satisfaction-label__text {
  color: #256ef4;
}

/* 의견 입력란 래퍼 */
.feedback-input-wrapper {
  flex: 1;
  position: relative;
}
@media (max-width: 900px) {
  .feedback-input-wrapper {
    width: 100%;
  }
}

/* 의견 입력 텍스트 영역 - Figma 디자인 기반 */
.feedback-textarea {
  width: 100%;
  min-height: 3rem;
  padding: 0.875rem 1rem;
  border: 1px solid #58616a; /* Figma의 테두리 색상 */
  border-radius: 0.375rem;
  background-color: #ffffff;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #131416;
  resize: none;
  overflow-y: hidden;
  transition: all 0.2s ease;
  /* 플레이스홀더 스타일 */
  /* 포커스 상태 */
  /* 호버 상태 */
}
@media (max-width: 900px) {
  .feedback-textarea {
    font-size: 0.9375rem;
    padding: 0.75rem 0.875rem;
    min-height: 2.75rem;
  }
}
.feedback-textarea::placeholder {
  color: #8a949e;
  font-weight: 400;
}
.feedback-textarea:focus {
  outline: none;
  border-color: #256ef4;
  box-shadow: 0 0 0 3px rgba(37, 110, 244, 0.1);
}
.feedback-textarea:hover:not(:focus) {
  border-color: #131416;
}

/* 제출 버튼 - Figma 디자인 기반 */
.feedback-submit-btn {
  flex: 0 0 auto;
  width: 4.875rem;
  height: 3rem;
  padding: 0 1rem;
  background-color: #244874; /* Figma의 버튼 색상 */
  color: #ffffff;
  border: none;
  border-radius: 0.375rem;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  /* 호버 상태 */
  /* 활성화 상태 */
  /* 포커스 상태 */
  /* 로딩 상태 (필요시 사용) */
}
@media (max-width: 900px) {
  .feedback-submit-btn {
    width: 100%;
    height: 2.75rem;
    font-size: 0.9375rem;
  }
}
.feedback-submit-btn:hover {
  background-color: rgb(29.9605263158, 59.9210526316, 96.5394736842);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(36, 72, 116, 0.3);
}
.feedback-submit-btn:active {
  transform: translateY(0);
  box-shadow: 0 1px 4px rgba(36, 72, 116, 0.3);
}
.feedback-submit-btn:focus {
  outline: 2px solid rgba(36, 72, 116, 0.3);
  outline-offset: 2px;
}
.feedback-submit-btn:disabled {
  background-color: #8a949e;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
.feedback-submit-btn:disabled:hover {
  background-color: #8a949e;
  transform: none;
}

/* 스크린 리더용 숨김 텍스트 */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ========================================
   모바일 회원증 컴포넌트 (새 디자인)
   - Figma 디자인 기반 카드형 레이아웃
   - 그라데이션 카드 + 바코드 섹션 + 통계
======================================== */
.mobile-card-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  margin: 1.5rem auto;
  max-width: 32.4375rem;
}
@media (max-width: 900px) {
  .mobile-card-container {
    gap: 1rem;
    margin: 1rem 0;
    max-width: 100%;
  }
}

/* 메인 카드 (그라데이션 배경) */
.mobile-card-new {
  width: 100%;
  height: 15.625rem;
  background: radial-gradient(circle at bottom right, #0072bc 0%, #0e7cad 6.25%, #1d859e 12.5%, #399980 25%, #56ac62 37.5%, #72bf44 50%, #94b93a 62.5%, #b6b32f 75%, #faa61a 100%);
  border-radius: 0.75rem;
  padding: 2rem 2rem 1.5rem 2rem;
  color: white;
  position: relative;
  overflow: hidden;
  /* 배경 패턴 */
}
@media (max-width: 900px) {
  .mobile-card-new {
    width: 100%;
    max-width: 28.75rem;
    height: 12.5rem;
    padding: 1.25rem;
  }
}
.mobile-card-new::before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: url("../../assets/images/card-pattern.svg") no-repeat bottom right;
  background-size: cover;
  opacity: 0.6;
  pointer-events: none;
}
.mobile-card-new__header {
  position: relative;
  z-index: 2;
  text-align: right;
  margin-bottom: 2.5rem;
}
@media (max-width: 900px) {
  .mobile-card-new__header {
    margin-bottom: 1.5rem;
  }
}
.mobile-card-new__title-en {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  margin-bottom: 0.5rem;
  opacity: 0.9;
}
@media (max-width: 900px) {
  .mobile-card-new__title-en {
    font-size: 0.875rem;
  }
}
.mobile-card-new__title-ko {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .mobile-card-new__title-ko {
    font-size: 1.25rem;
  }
}
.mobile-card-new__member-info {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  width: 12.5rem;
}
.mobile-card-new__row {
  display: flex;
  align-items: center;
  gap: 0;
  height: 1.8125rem;
}
.mobile-card-new__label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 400;
  line-height: 1.5;
  width: 4.5rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .mobile-card-new__label {
    font-size: 1rem;
    width: 3.75rem;
  }
}
.mobile-card-new__value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.5;
  flex: 1;
}
@media (max-width: 900px) {
  .mobile-card-new__value {
    font-size: 1rem;
  }
}

/* 바코드 섹션 */
.barcode-section {
  width: 100%;
  height: auto;
  background: white;
  border: 1px solid #cbcccc;
  border-radius: 0.75rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  position: relative;
}
@media (max-width: 900px) {
  .barcode-section {
    width: 100%;
    max-width: 28.75rem;
    height: auto;
    padding: 0.75rem;
  }
}
.barcode-section__qr-toggle {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}
.barcode-section__qr-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0;
  background: none;
  border: none;
  color: #191a1a;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.barcode-section__qr-btn:hover {
  opacity: 0.7;
}
.barcode-section__qr-btn:focus {
  outline: 2px solid #3c79c2;
  outline-offset: 2px;
}
.barcode-section__qr-icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .barcode-section__qr-icon {
    width: 24px;
    height: 24px;
  }
}
.barcode-section__qr-text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .barcode-section__qr-text {
    font-size: 17px;
  }
}
.barcode-section__timestamp {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #3c79c2;
  text-align: center;
}
@media (max-width: 900px) {
  .barcode-section__timestamp {
    font-size: 0.875rem;
  }
}
.barcode-section__barcode {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.barcode-section__barcode img {
  max-width: 19.25rem;
  height: auto;
}
@media (max-width: 900px) {
  .barcode-section__barcode img {
    max-width: 100%;
  }
}
.barcode-section__barcode svg {
  width: 80%;
  height: auto;
}
@media (max-width: 900px) {
  .barcode-section__barcode svg {
    max-width: 100%;
  }
}
.barcode-section__qrcode {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding-bottom: 2rem;
}
.barcode-section__qrcode svg {
  width: 7.5rem;
  height: 7.5rem;
}
@media (max-width: 900px) {
  .barcode-section__qrcode svg {
    width: 120px;
    height: 120px;
  }
}
.barcode-section__qrcode img {
  width: 7.5rem;
  height: 7.5rem;
}
@media (max-width: 900px) {
  .barcode-section__qrcode img {
    width: 120px;
    height: 120px;
  }
}
.barcode-section__number {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
  text-align: center;
}
@media (max-width: 900px) {
  .barcode-section__number {
    font-size: 0.875rem;
  }
}

/* 회원 통계 */
.member-stats {
  display: flex;
  gap: 0.75rem;
}
@media (max-width: 900px) {
  .member-stats {
    width: 100%;
    max-width: 28.75rem;
    gap: 0.5rem;
  }
}
.member-stats__item {
  flex: auto;
  min-width: 5.9375rem;
  border: 1px solid #cbcccc;
  border-radius: 0.75rem;
  padding: 0.625rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  height: 6.125rem;
  background: white;
}
@media (max-width: 900px) {
  .member-stats__item {
    min-width: auto;
    height: 4.875rem;
    padding: 0.5rem;
  }
}
.member-stats__label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  text-align: center;
}
@media (max-width: 900px) {
  .member-stats__label {
    font-size: 0.875rem;
  }
}
.member-stats__value {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding-top: 0.25rem;
  border-top: 2px solid #6494ce;
  min-height: 2.5rem;
  justify-content: center;
}
@media (max-width: 900px) {
  .member-stats__value {
    min-height: 2rem;
  }
}
.member-stats__number {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
  color: #3c79c2;
}
@media (max-width: 900px) {
  .member-stats__number {
    font-size: 1.25rem;
  }
}
.member-stats__unit {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
}
@media (max-width: 900px) {
  .member-stats__unit {
    font-size: 0.875rem;
  }
}
.member-stats__status {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #3c79c2;
  padding-top: 0.25rem;
  border-top: 2px solid #6494ce;
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .member-stats__status {
    font-size: 0.875rem;
    min-height: 2rem;
  }
}

/* 상태 메시지 */
.member-status-message {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #3c79c2;
  text-align: center;
}
@media (max-width: 900px) {
  .member-status-message {
    width: 100%;
    max-width: 28.75rem;
    font-size: 0.875rem;
  }
}

/* 반응형 추가 조정 */
@media (max-width: 900px) {
  .satisfaction-options {
    gap: 1rem;
  }
  .user-feedback__input-section {
    gap: 0.625rem;
  }
  .feedback-submit-btn {
    width: 4.375rem;
    font-size: 1rem;
  }
}
.member-info__action {
  width: 100%;
}

/*
   * 결과 페이지 스타일
   * - 피그마 디자인에 맞는 카드형 레이아웃
   * - 다양한 결과 타입별 동일한 구조 유지
   * - 버튼과 정보 표시 영역 구분
   */
.result-page {
  /* 반응형 처리 */
}
.result-page .result-container {
  display: flex;
  justify-content: center;
  padding: 2.5rem 0; /* 40px 상하 패딩 */
}
.result-page .result-card {
  background: #f1f2f2; /* 피그마의 배경색 */
  border-radius: 12px;
  padding: 2.5rem; /* 40px */
  width: 100%;
  max-width: 896px; /* 976px - 40px*2 좌우 패딩 */
  display: flex;
  flex-direction: column;
  gap: 2.5rem; /* 40px */
}
.result-page .result-content {
  display: flex;
  flex-direction: column;
  gap: 1rem; /* 16px */
}
.result-page .result-header {
  display: flex;
  justify-content: center;
}
.result-page .result-title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.75rem; /* 28px */
  font-weight: 700;
  line-height: 1.193;
  color: #191a1a;
  text-align: center;
  margin: 0;
}
.result-page .result-message {
  text-align: center;
}
.result-page .result-message p {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem; /* 17px */
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
.result-page .result-info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem; /* 8px */
  align-items: center;
}
.result-page .info-item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem; /* 16px */
}
.result-page .info-label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem; /* 17px */
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  text-align: center;
}
.result-page .info-value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem; /* 17px */
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  text-align: left;
  width: 11.25rem;
}
.result-page .info-value-with-copy {
  display: flex;
  align-items: center;
  gap: 0.5rem; /* 8px */
}
.result-page .copy-button {
  background: #ecf2f9;
  border: 1px solid #30619b;
  border-radius: 4px;
  padding: 0 0.625rem; /* 10px */
  height: 32px;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem; /* 15px */
  font-weight: 400;
  line-height: 1.5;
  color: #3c79c2;
  cursor: pointer;
  transition: all 0.2s ease;
}
.result-page .copy-button:hover {
  background: #d9e8f7;
}
.result-page .copy-button:active {
  transform: scale(0.98);
}
.result-page .result-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem; /* 16px */
}
.result-page .result-actions--multiple {
  flex-direction: row;
}
@media (max-width: 900px) {
  .result-page .result-container {
    padding: 1rem 0;
  }
  .result-page .result-card {
    padding: 1rem;
    gap: 1rem;
    margin: 0 0.5rem;
  }
  .result-page .result-title {
    font-size: 1.25rem; /* 20px */
  }
  .result-page .result-message p {
    font-size: 0.9375rem; /* 15px */
  }
  .result-page .info-item {
    flex-direction: column;
    gap: 0.5rem;
  }
  .result-page .info-label,
  .result-page .info-value {
    text-align: center;
  }
  .result-page .result-actions--multiple {
    flex-direction: column;
    gap: 0.75rem;
  }
}

/* ========================================
   기본 레이아웃
======================================== */
.sub-content {
  flex: 1;
  max-width: 976px;
}
@media (max-width: 900px) {
  .sub-content {
    max-width: 100%;
  }
}

/* ========================================
   가입정보입력 폼
======================================== */
.signup-form__header {
  margin-bottom: 1.5rem;
}
.signup-form__title {
  font-size: 1.75rem;
  font-weight: bold;
  color: #191a1a;
  margin-bottom: 0;
}
.signup-form__content {
  margin-bottom: 3rem;
}
.signup-form__actions {
  display: flex;
  gap: 1rem;
  justify-content: center;
}
@media (max-width: 900px) {
  .signup-form__actions {
    flex-direction: column;
    gap: 0.5rem;
  }
}
.signup-form .ui-select--large .ui-select__element {
  padding: 1rem 1.5rem;
  padding-right: 50px;
}
@media (max-width: 900px) {
  .signup-form .ui-select--large .ui-select__element {
    padding: 0.75rem 1rem;
    padding-right: 30px;
  }
}

.info-box {
  background-color: #f4f5f6;
  border: 1px solid #cdd1d5;
  border-radius: 0.75rem;
  padding: 1rem;
  margin-bottom: 1rem;
}
@media (max-width: 900px) {
  .info-box {
    margin-bottom: 0.125rem;
  }
}
.info-box__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.info-box__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
}
.info-box__title {
  font-size: 1.0625rem;
  font-weight: bold;
  color: #1e2124;
  margin: 0;
}
.info-box__content {
  padding-left: 1.75rem;
}
.info-box .info-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.info-box .info-list li {
  position: relative;
  font-size: 0.9375rem;
  color: #4b4d4d;
  line-height: 1.5;
  padding-left: 1rem;
  margin-bottom: 0.5rem;
}
.info-box .info-list li:last-child {
  margin-bottom: 0;
}
.info-box .info-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5rem;
  width: 0.375rem;
  height: 0.375rem;
  background-color: #4b4d4d;
  border-radius: 50%;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem 1.5rem;
}
@media (max-width: 900px) {
  .form-grid {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .form-field {
    gap: 0.25rem;
  }
}
.form-field--full {
  grid-column: 1/-1;
}
.form-field .form-label {
  position: relative;
  font-size: 1.1875rem;
  font-weight: bold;
  margin-bottom: 0.4375rem;
  color: #4b4d4d;
  position: relative;
  margin-top: 5px;
}
.form-field .form-label.required::after {
  content: "*";
  color: #d7424e;
  margin-left: 0.5rem;
  font-size: 1rem;
  vertical-align: super;
  position: absolute;
  top: -3px;
}
.form-field .radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  height: 100%;
  min-height: 56px;
}
.form-field .birth-group {
  display: flex;
  gap: 1rem;
  align-items: center;
}
@media (max-width: 900px) {
  .form-field .birth-group {
    gap: 0.75rem;
    align-items: center;
  }
}
.form-field .birth-group > :first-child {
  flex: 1;
}
.form-field .birth-group .radio-group {
  display: flex;
  gap: 1rem;
  align-items: center;
}
@media (max-width: 900px) {
  .form-field .birth-group .radio-group {
    margin-top: 0;
  }
}
.form-field .input-with-button {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
}
.form-field .input-with-button > :first-child {
  flex: 1;
}
.form-field .address-group {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.form-field .address-group .input-with-button {
  flex-direction: row;
}

/* ========================================
   14세 미만 회원가입 추가 스타일
======================================== */
.guardian-section,
.member-section {
  margin-bottom: 2.5rem;
}
.guardian-section .section-title,
.member-section .section-title {
  font-size: 1.5rem;
  font-weight: bold;
  color: #191a1a;
}

.age-checkbox {
  margin-top: 1rem;
  padding: 0.75rem 0;
}

.input-with-button--triple {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}
.input-with-button--triple > :first-child {
  flex: 1;
}
.input-with-button--triple .ui-button {
  min-width: 7.5rem;
  white-space: nowrap;
}

/* ========================================
   대출자정보 추가 스타일
======================================== */
.member-verification-section {
  margin-bottom: 2.5rem;
}
.member-verification-section .section-title {
  font-size: 1.5rem;
  font-weight: bold;
  color: #191a1a;
  margin-bottom: 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #ecf2fe;
}

.verification-form-box {
  border: 1px solid #b1b3b3;
  border-radius: 0.75rem;
  padding: 2.5rem;
  margin-bottom: 1.5rem;
}
.verification-form-box .form-grid-wrp {
  max-width: 27.5rem;
  margin: 0 auto;
}
.verification-form-box .form-field {
  margin-bottom: 1.5rem;
}
.verification-form-box .form-field:last-child {
  margin-bottom: 0;
}

.verification-actions {
  display: flex;
  justify-content: center;
  margin-bottom: 2.5rem;
}

.form-grid--single {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 29.5rem;
}
@media (max-width: 900px) {
  .form-grid--single {
    max-width: 100%;
  }
}

/* ========================================
   간단한 대출자정보 회원가입 스타일
======================================== */
.simple-signup-section {
  margin-bottom: 2.5rem;
}
.simple-signup-section .section-title {
  font-size: 1.75rem;
  font-weight: bold;
  color: #191a1a;
  margin-bottom: 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #ecf2fe;
}

.simple-form-fields {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 100%;
}
.simple-form-fields .form-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.simple-form-fields .password-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}
@media (max-width: 900px) {
  .simple-form-fields .password-fields {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}
.simple-form-fields .input-with-button {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  max-width: 29.5rem;
}
.simple-form-fields .input-with-button > :first-child {
  flex: 1;
}
@media (max-width: 900px) {
  .simple-form-fields .input-with-button {
    max-width: 100%;
  }
}

/* ========================================
   회원가입 선택
======================================== */
.membership-selection__container {
  display: flex;
  gap: 2.5rem;
  padding: 2rem;
  border-bottom: 1px solid #8a949e;
  border-top: 1px solid #8a949e;
}
@media (max-width: 900px) {
  .membership-selection__container {
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.25rem;
  }
}
.membership-selection__banner {
  flex: 1;
  background-color: #ecf2f9;
  border-radius: 0.75rem;
  padding: 2rem;
}
@media (max-width: 900px) {
  .membership-selection__banner {
    padding: 1.25rem;
  }
}
.membership-selection__banner .banner-content {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  height: 100%;
}
@media (max-width: 900px) {
  .membership-selection__banner .banner-content {
    gap: 1.5rem;
  }
}
.membership-selection__banner .banner-text {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.membership-selection__banner .banner-title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .membership-selection__banner .banner-title {
    font-size: 1.25rem;
  }
}
.membership-selection__banner .banner-description {
  font-size: 1.1875rem;
  line-height: 1.5;
  color: #191a1a;
}
@media (max-width: 900px) {
  .membership-selection__banner .banner-description {
    font-size: 1rem;
  }
}
.membership-selection__banner .banner-description p {
  margin: 0 0 0.25rem 0;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  margin: 0;
}
.membership-selection__banner .banner-description p:last-child {
  margin-bottom: 0;
}
.membership-selection__banner .banner-description .highlight {
  background: none;
  color: #3c79c2;
  font-weight: 700;
}
.membership-selection__banner .banner-image {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  flex: 1;
}
@media (max-width: 900px) {
  .membership-selection__banner .banner-image {
    justify-content: center;
  }
}
.membership-selection__banner .banner-img {
  width: 10.1875rem;
  height: 7.5rem;
  object-fit: contain;
}
@media (max-width: 900px) {
  .membership-selection__banner .banner-img {
    width: 7.5rem;
    height: 5.625rem;
  }
}
.membership-selection .divider {
  width: 1px;
  background-color: #8a949e;
  align-self: stretch;
}
@media (max-width: 900px) {
  .membership-selection .divider {
    height: 1px;
    width: 100%;
  }
}
.membership-selection__options {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.membership-selection .option-card {
  background-color: #ffffff;
  border-radius: 0.75rem;
  padding: 1.75rem;
  cursor: pointer;
  transition: all 0.2s ease, transform 0.15s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
@media (max-width: 900px) {
  .membership-selection .option-card {
    padding: 1.25rem;
  }
}
.membership-selection .option-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}
.membership-selection .option-card:active {
  transform: scale(0.98);
}
.membership-selection .option-card--no {
  border: 2px solid #df6871;
}
.membership-selection .option-card--no:hover {
  background-color: rgba(223, 104, 113, 0.05);
}
.membership-selection .option-card--yes {
  border: 2px solid #f1f2f2;
  background-color: #f1f2f2;
  min-height: 218px;
}
@media (max-width: 900px) {
  .membership-selection .option-card--yes {
    min-height: 200px;
  }
}
.membership-selection .option-card--yes:hover {
  background-color: rgba(60, 121, 194, 0.05);
}
.membership-selection .option-card .option-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .membership-selection .option-card .option-header {
    gap: 1rem;
  }
}
.membership-selection .option-card .option-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.membership-selection .option-card .option-icon--danger {
  background-color: rgba(223, 104, 113, 0.1);
  color: #df6871;
}
.membership-selection .option-card .option-icon--success {
  background-color: rgba(60, 121, 194, 0.1);
  color: #3c79c2;
}
.membership-selection .option-card .option-icon svg {
  width: 1.5rem;
  height: 1.5rem;
}
.membership-selection .option-card .option-title {
  flex: 1;
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.5;
  color: #1e2124;
  margin: 0;
}
@media (max-width: 900px) {
  .membership-selection .option-card .option-title {
    font-size: 1.0625rem;
  }
}
.membership-selection .option-card .option-arrow {
  color: #4b4d4d;
  display: flex;
  align-items: center;
  justify-content: center;
}
.membership-selection .option-card .option-arrow svg {
  width: 1.5rem;
  height: 1.5rem;
}
.membership-selection .option-card .option-content {
  margin-left: 4rem;
}
@media (max-width: 900px) {
  .membership-selection .option-card .option-content {
    margin-left: 3.5rem;
  }
}
.membership-selection .option-card .option-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.membership-selection .option-card .option-list li {
  position: relative;
  padding-left: 1.5rem;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #4b4d4d;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .membership-selection .option-card .option-list li {
    font-size: 0.9375rem;
    padding-left: 1.25rem;
  }
}
.membership-selection .option-card .option-list li:last-child {
  margin-bottom: 0;
}
.membership-selection .option-card .option-list li::before {
  content: "";
  position: absolute;
  left: 0.5rem;
  top: 11px;
  transform: translateY(-50%);
  width: 0.375rem;
  height: 0.375rem;
  background-color: #4b4d4d;
  border-radius: 50%;
}
@media (max-width: 900px) {
  .membership-selection .option-card .option-list li::before {
    left: 0.375rem;
    width: 0.25rem;
    height: 0.25rem;
  }
}

/* ========================================
   회원가입 유형 선택
======================================== */
.membership-type-selection .form-group {
  margin-top: 20px;
}
.membership-type-selection .form-group:first-child {
  margin-top: 0;
}
@media (max-width: 900px) {
  .membership-type-selection .form-group {
    margin-top: 16px;
  }
}
.membership-type-selection__container {
  display: flex;
  gap: 2.5rem;
  padding: 2rem;
  border-bottom: 1px solid #8a949e;
  border-top: 1px solid #8a949e;
}
@media (max-width: 900px) {
  .membership-type-selection__container {
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.25rem;
  }
}
.membership-type-selection__banner {
  flex: 1;
  background-color: #ecf2f9;
  border-radius: 0.75rem;
  padding: 2rem;
}
@media (max-width: 900px) {
  .membership-type-selection__banner {
    padding: 1.25rem;
  }
}
.membership-type-selection__banner .banner-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.membership-type-selection__banner .banner-text {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.membership-type-selection__banner .banner-title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .membership-type-selection__banner .banner-title {
    font-size: 1.25rem;
  }
}
.membership-type-selection__banner .banner-description {
  font-size: 1.1875rem;
  line-height: 1.5;
  color: #191a1a;
}
@media (max-width: 900px) {
  .membership-type-selection__banner .banner-description {
    font-size: 1rem;
  }
}
.membership-type-selection__banner .banner-description p {
  margin: 0;
}
.membership-type-selection .divider {
  width: 1px;
  background-color: #8a949e;
  align-self: stretch;
}
@media (max-width: 900px) {
  .membership-type-selection .divider {
    height: 1px;
    width: 100%;
  }
}
.membership-type-selection__options {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  justify-content: center;
}
@media (max-width: 900px) {
  .membership-type-selection__options {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}
.membership-type-selection .type-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  height: 3.5rem;
  padding: 0 1.25rem;
  border: 1px solid #58616a;
  border-radius: 0.5rem;
  background-color: transparent;
  cursor: pointer;
  transition: all 0.2s ease, transform 0.15s ease;
}
@media (max-width: 900px) {
  .membership-type-selection .type-button {
    height: 3rem;
    padding: 0 1rem;
  }
}
.membership-type-selection .type-button:hover {
  background-color: rgba(60, 121, 194, 0.05);
  border-color: #3c79c2;
}
.membership-type-selection .type-button:active {
  transform: scale(0.98);
}
.membership-type-selection .type-button .type-content {
  flex: 1;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  gap: 0.25rem;
}
.membership-type-selection .type-button .type-title {
  font-size: 1.1875rem;
  font-weight: 700;
  color: #18304d;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .membership-type-selection .type-button .type-title {
    font-size: 1.0625rem;
  }
}
.membership-type-selection .type-button .type-subtitle {
  font-size: 1.1875rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .membership-type-selection .type-button .type-subtitle {
    font-size: 1.0625rem;
  }
}
.membership-type-selection .type-button .type-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #58616a;
}
.membership-type-selection .type-button .type-arrow svg {
  width: 1rem;
  height: 1rem;
}
.membership-type-selection .notice-text {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}
@media (max-width: 900px) {
  .membership-type-selection .notice-text {
    gap: 0.375rem;
  }
}
.membership-type-selection .notice-text .notice-symbol {
  font-size: 1.0625rem;
  color: #4b4d4d;
  line-height: 1.5;
  flex-shrink: 0;
  height: 1.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .membership-type-selection .notice-text .notice-symbol {
    font-size: 0.9375rem;
    height: 1.375rem;
  }
}
.membership-type-selection .notice-text .notice-content {
  flex: 1;
}
.membership-type-selection .notice-text .notice-content p {
  font-size: 1.1875rem;
  line-height: 1.5;
  letter-spacing: -0.05em;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .membership-type-selection .notice-text .notice-content p {
    font-size: 1rem;
  }
}
.membership-type-selection .notice-text .notice-content .highlight {
  color: #244874;
  font-weight: 700;
  background: none;
}

/* ========================================
   이용약관 동의
======================================== */
.terms-agreement {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
@media (max-width: 900px) {
  .terms-agreement {
    gap: 1.5rem;
  }
}
.terms-agreement__header {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 900px) {
  .terms-agreement__header {
    gap: 0.75rem;
  }
}
.terms-agreement__title {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .terms-agreement__title {
    font-size: 1.5rem;
  }
}
.terms-agreement__description {
  font-size: 1.1875rem;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .terms-agreement__description {
    font-size: 1rem;
  }
}
.terms-agreement__all-agree {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .terms-agreement__all-agree {
    gap: 1.25rem;
  }
}
.terms-agreement__all-agree .all-agree-checkbox {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.terms-agreement__content {
  border: 1px solid #cbcccc;
  border-radius: 0.75rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .terms-agreement__content {
    padding: 0.375rem;
    gap: 1.25rem;
  }
}
.terms-agreement__actions {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
}
@media (max-width: 900px) {
  .terms-agreement__actions {
    flex-direction: column;
    gap: 1rem;
  }
}
.terms-agreement__actions .btn {
  width: 11.25rem;
  height: 3.5rem;
  border-radius: 0.5rem;
  font-size: 1.1875rem;
  font-weight: 400;
  line-height: 1.5;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
}
@media (max-width: 900px) {
  .terms-agreement__actions .btn {
    width: 100%;
    height: 3rem;
    font-size: 1.0625rem;
  }
}
.terms-agreement__actions .btn--secondary {
  background-color: transparent;
  border: 1px solid #58616a;
  color: #1e2124;
}
.terms-agreement__actions .btn--secondary:hover {
  background-color: rgba(88, 97, 106, 0.1);
}
.terms-agreement__actions .btn--primary {
  background-color: #3c79c2;
  color: #ffffff;
}
.terms-agreement__actions .btn--primary:hover {
  background-color: #2a5a94;
}

.terms-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .terms-list {
    gap: 0.125rem;
  }
}

.terms-item {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #cbcccc;
  margin-top: 16px;
}
@media (max-width: 900px) {
  .terms-item {
    gap: 0.75rem;
    padding-bottom: 1.5rem;
  }
}
.terms-item:first-child {
  margin-top: 0;
}
.terms-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.terms-item__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.terms-item__checkbox {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.terms-item__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 900px) {
  .terms-item__content {
    gap: 0.75rem;
  }
}
.terms-item__radio {
  background-color: #f1f2f2;
  padding: 1.5rem;
  border-radius: 0.625rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2.5rem;
}
@media (max-width: 900px) {
  .terms-item__radio {
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
    padding: 1rem;
  }
}
.terms-item__radio .radio-question {
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #1e2124;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .terms-item__radio .radio-question {
    font-size: 0.9375rem;
  }
}
.terms-item__radio .radio-group {
  display: flex;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .terms-item__radio .radio-group {
    gap: 1rem;
    justify-content: center;
  }
}

.terms-scroll-box {
  background-color: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 0.625rem;
  padding: 1rem 0.5rem 1rem 1rem;
  height: 12.5rem;
  display: flex;
  gap: 0.5rem;
}
.terms-scroll-box .terms-content {
  flex: 1;
  overflow-y: auto;
}
.terms-scroll-box .terms-content__placeholder {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #666;
  padding: 0.5rem;
}
@media (max-width: 900px) {
  .terms-scroll-box .terms-content__placeholder {
    font-size: 0.8125rem;
  }
}
.terms-scroll-box .scroll-bar {
  background-color: #d8e4f3;
  border-radius: 0.125rem;
  flex-shrink: 0;
}

.terms-table-wrapper .mobile-info {
  display: none;
  font-size: 0.8125rem;
  color: #666;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .terms-table-wrapper .mobile-info {
    display: block;
  }
}

.terms-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
  line-height: 1.6;
}
@media (max-width: 900px) {
  .terms-table {
    font-size: 0.75rem;
  }
}
.terms-table .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.terms-table th,
.terms-table td {
  border: 1px solid #e5e5e5;
  padding: 0.75rem 0.5rem;
  text-align: center;
  vertical-align: middle;
}
@media (max-width: 900px) {
  .terms-table th,
  .terms-table td {
    padding: 0.5rem 0.375rem;
  }
}
.terms-table thead {
  background-color: #f8f9fa;
}
.terms-table thead th {
  font-weight: 600;
  color: #1e2124;
  word-break: keep-all;
}
.terms-table tbody td {
  color: #333;
  word-break: keep-all;
}
.terms-table tbody td.highlight {
  color: #3c79c2;
  font-weight: 600;
  font-size: 0.9375rem;
  background: #fff;
}
@media (max-width: 900px) {
  .terms-table tbody td.highlight {
    font-size: 0.8125rem;
  }
}

.terms-notice {
  margin-top: 1rem;
  padding-left: 1.25rem;
  list-style: none;
}
.terms-notice li {
  position: relative;
  font-size: 0.8125rem;
  line-height: 1.6;
  color: #666;
  margin-bottom: 0.5rem;
  padding-left: 0.75rem;
}
@media (max-width: 900px) {
  .terms-notice li {
    font-size: 0.75rem;
  }
}
.terms-notice li:before {
  content: "•";
  position: absolute;
  left: 0;
  color: #666;
}
.terms-notice li:last-child {
  margin-bottom: 0;
}

.terms-text-content {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #333;
}
@media (max-width: 900px) {
  .terms-text-content {
    font-size: 0.8125rem;
  }
}

.terms-section {
  margin-bottom: 2rem;
}
@media (max-width: 900px) {
  .terms-section {
    margin-bottom: 1.5rem;
  }
}
.terms-section:last-child {
  margin-bottom: 0;
}

.terms-chapter {
  font-size: 1rem;
  font-weight: 700;
  color: #1e2124;
  margin-bottom: 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid #3c79c2;
}
@media (max-width: 900px) {
  .terms-chapter {
    font-size: 0.9375rem;
    margin-bottom: 1rem;
    padding-bottom: 0.625rem;
  }
}

.terms-article {
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .terms-article {
    margin-bottom: 1.25rem;
  }
}
.terms-article:last-child {
  margin-bottom: 0;
}

.terms-article-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1e2124;
  margin-bottom: 0.75rem;
}
@media (max-width: 900px) {
  .terms-article-title {
    font-size: 0.875rem;
    margin-bottom: 0.625rem;
  }
}

.terms-paragraph {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #333;
  margin-bottom: 0.75rem;
}
@media (max-width: 900px) {
  .terms-paragraph {
    font-size: 0.8125rem;
    margin-bottom: 0.625rem;
  }
}
.terms-paragraph:last-child {
  margin-bottom: 0;
}
.terms-paragraph .highlight-red {
  color: #ef4444;
  font-weight: 600;
}

.terms-list {
  margin: 0.75rem 0;
  list-style: none;
}
@media (max-width: 900px) {
  .terms-list {
    margin: 0.625rem 0;
    padding-left: 0;
  }
}
.terms-list li {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #333;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .terms-list li {
    font-size: 0.8125rem;
    margin-bottom: 0.375rem;
  }
}
.terms-list li:last-child {
  margin-bottom: 0;
}

.checkbox-input {
  appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  border: 2px solid #cbcccc;
  border-radius: 0.25rem;
  background-color: #ffffff;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
}
.checkbox-input--large {
  width: 1.5rem;
  height: 1.5rem;
}
.checkbox-input:checked {
  background-color: #256ef4;
  border-color: #256ef4;
}
.checkbox-input:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.75rem;
  height: 0.75rem;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="white"><path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.checkbox-input:checked.checkbox-input--large::after {
  width: 0.875rem;
  height: 0.875rem;
}

.checkbox-label {
  font-size: 1.1875rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  cursor: pointer;
}
.checkbox-label--large {
  font-size: 1.1875rem;
  font-weight: 700;
}
@media (max-width: 900px) {
  .checkbox-label {
    font-size: 1.0625rem;
  }
}
.checkbox-label .required-mark {
  color: #191a1a;
}

.radio-input {
  appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid #58616a;
  border-radius: 50%;
  background-color: #ffffff;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
}
.radio-input:checked {
  border-color: #256ef4;
  border-width: 0.0875rem;
}
.radio-input:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.625rem;
  height: 0.625rem;
  background-color: #256ef4;
  border-radius: 50%;
}

.radio-label {
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #131416;
  cursor: pointer;
}
@media (max-width: 900px) {
  .radio-label {
    font-size: 0.9375rem;
  }
}

.radio-item {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.final-agreement {
  background-color: #ffffff;
  padding: 0 1.5rem;
  display: flex;
  justify-content: flex-end;
}
@media (max-width: 900px) {
  .final-agreement {
    padding: 0 1rem;
    justify-content: flex-end;
  }
}

/* ========================================
   소장도서 검색
======================================== */
.ui-library-filter {
  margin-bottom: 2rem;
  /* 검색 영역 스타일 */
}
@media (max-width: 900px) {
  .ui-library-filter {
    margin-bottom: 1.5rem;
  }
}
.ui-library-filter__search-result {
  margin-top: 1.5rem;
}
@media (max-width: 900px) {
  .ui-library-filter__search-result {
    margin-top: 1rem;
  }
}
.ui-library-filter__box {
  border-radius: 0.5rem;
  padding: 1.5rem 1.25rem;
  background-color: #ecf2f9;
}
@media (max-width: 900px) {
  .ui-library-filter__box {
    padding: 1rem;
  }
}
.ui-library-filter__header {
  margin-bottom: 0.75rem;
}
@media (max-width: 900px) {
  .ui-library-filter__header {
    margin-bottom: 0.5rem;
  }
}
.ui-library-filter__main-control {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.5rem;
}
.ui-library-filter__main-checkbox :global(.ui-checkbox__title) {
  font-weight: 700;
  color: #191a1a;
  font-size: 1.1875rem;
}
@media (max-width: 900px) {
  .ui-library-filter__main-checkbox :global(.ui-checkbox__title) {
    font-size: 0.875rem;
  }
}
.ui-library-filter__toggle {
  background: none;
  border: none;
  color: #1f2937;
  cursor: pointer;
  padding: 0.25rem;
  border-radius: 0.25rem;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}
.ui-library-filter__toggle:hover {
  background-color: #f3f4f6;
}
.ui-library-filter__toggle:focus {
  outline: 2px solid #6b7280;
  outline-offset: 2px;
}
.ui-library-filter__toggle[aria-expanded=false] .ui-library-filter__toggle-icon {
  transform: rotate(-90deg);
}
.ui-library-filter__toggle-icon {
  transition: transform 0.2s ease;
}
.ui-library-filter__content {
  display: none;
}
.ui-library-filter__content:not(:nth-of-type(1)) {
  margin-top: 15px;
}
@media (max-width: 900px) {
  .ui-library-filter__content:not(:nth-of-type(1)) {
    margin-top: 0.75rem;
  }
}
.ui-library-filter__content.is-active {
  display: block;
}
.ui-library-filter__subtitle {
  color: #333;
  font-weight: 700;
  font-size: 0.9375rem;
  margin-bottom: 0.9375rem;
  padding-top: 0.25rem;
  margin-top: 15px;
}
@media (max-width: 900px) {
  .ui-library-filter__subtitle {
    font-size: 0.875rem;
    margin-bottom: 0.75rem;
    margin-top: 12px;
  }
}
.ui-library-filter__grid.ui-library-filter__grid {
  display: grid;
  gap: 1rem 1.5rem;
}
@media (max-width: 900px) {
  .ui-library-filter__grid.ui-library-filter__grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.625rem 1rem;
  }
}
.ui-library-filter__item :global(.ui-checkbox) {
  gap: 0.375rem;
}
.ui-library-filter__item :global(.ui-checkbox__title) {
  font-size: 0.875rem;
  color: #374151;
  line-height: 1.4;
}
@media (max-width: 900px) {
  .ui-library-filter__item :global(.ui-checkbox__title) {
    font-size: 0.8125rem;
  }
}
.ui-checkbox__input:checked + .ui-library-filter__item :global(.ui-checkbox__control) {
  background-color: #6b7280;
  border-color: #6b7280;
}
.ui-checkbox__input:focus + .ui-library-filter__item :global(.ui-checkbox__control) {
  border-color: #6b7280;
  box-shadow: 0 0 0 3px rgba(107, 114, 128, 0.1);
}
.ui-library-filter__item :global(.ui-checkbox:hover:not(.ui-checkbox--disabled) .ui-checkbox__control) {
  border-color: #9ca3af;
}
.ui-library-filter__search {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-top: 0rem !important;
  /* 검색어 드롭다운 */
  /* 탭 버튼 */
  /* 검색어 목록 */
  /* 하단 옵션 */
}
@media (max-width: 900px) {
  .ui-library-filter__search {
    margin-top: 1.25rem !important;
    margin-bottom: 1.25rem !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem !important;
  }
}
.ui-library-filter__search-input {
  flex: 1;
}
.ui-library-filter__search-dropdown {
  padding: 24px;
  position: absolute;
  width: 100%;
  max-width: 36.0625rem;
  top: 100%;
  left: 0;
  z-index: 1000;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  margin-top: 0.25rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: all 0.2s ease;
}
@media (max-width: 900px) {
  .ui-library-filter__search-dropdown {
    padding: 1rem;
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    width: 90vw;
    max-width: 100%;
  }
  .ui-library-filter__search-dropdown.is-open {
    transform: translateX(-50%) translateY(0);
  }
}
.ui-library-filter__search-dropdown.is-open {
  opacity: 1;
  visibility: visible;
}
.ui-library-filter__search-tabs {
  display: flex;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem 0.5rem 0 0;
  overflow: hidden;
  width: 100%;
}
@media (max-width: 900px) {
  .ui-library-filter__search-tabs {
    width: 100%;
  }
}
.ui-library-filter__search-tabs button {
  flex: 1;
  padding: 1rem 1rem;
  background: #ffffff;
  border: none;
  color: #6b7280;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
}
@media (max-width: 900px) {
  .ui-library-filter__search-tabs button {
    padding: 0.75rem 0.5rem;
    font-size: 0.875rem;
  }
}
.ui-library-filter__search-tabs button:not(:last-child) {
  border-right: 1px solid #e5e7eb;
}
.ui-library-filter__search-tabs button.active, .ui-library-filter__search-tabs button[data-active=true] {
  background: #3c79c2;
  color: #ffffff;
  border-bottom: 2px solid #3c79c2;
}
.ui-library-filter__search-tabs button:hover:not(.active) {
  background: #f9fafb;
  color: #374151;
}
.ui-library-filter__search-list {
  background: #ffffff;
  padding: 1rem;
  width: 100%;
}
@media (max-width: 900px) {
  .ui-library-filter__search-list {
    width: 100%;
    padding: 0.75rem;
  }
}
.ui-library-filter__search-list .search-content {
  display: none;
  width: 100%;
}
.ui-library-filter__search-list .search-content.active {
  display: block;
}
.ui-library-filter__search-list .search-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0;
  cursor: pointer;
  transition: background-color 0.2s ease;
  width: 100%;
}
.ui-library-filter__search-list .search-item--clickable a {
  display: inline-block;
  width: 100%;
}
.ui-library-filter__search-list .search-item--non-clickable {
  cursor: default;
  pointer-events: none;
}
.ui-library-filter__search-list .search-item--non-clickable a {
  display: inline-block;
  width: 100%;
}
.ui-library-filter__search-list .search-item a {
  display: inline-block;
  width: 100%;
}
.ui-library-filter__search-list .search-item a:hover .search-term {
  text-decoration: underline;
  color: #3c79c2;
}
.ui-library-filter__search-list .search-item a.no-hover .search-term {
  text-decoration: none;
  color: #374151;
}
.ui-library-filter__search-list .search-item a span {
  display: inline-block;
}
@media (max-width: 900px) {
  .ui-library-filter__search-list .search-item {
    padding: 0.375rem 0;
  }
}
.ui-library-filter__search-list .search-item .search-term {
  color: #374151;
  font-size: 1rem;
}
@media (max-width: 900px) {
  .ui-library-filter__search-list .search-item .search-term {
    font-size: 0.875rem;
  }
}
.ui-library-filter__search-list .search-item .search-term.is-recent {
  font-weight: 600;
  display: inline-block;
}
.ui-library-filter__search-list .search-item .search-date {
  color: #9ca3af;
  font-size: 0.875rem;
  font-weight: 400;
}
@media (max-width: 900px) {
  .ui-library-filter__search-list .search-item .search-date {
    font-size: 0.75rem;
  }
}
.ui-library-filter__search-list .search-item .search-rank {
  color: #3c79c2;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.125rem 0.375rem;
  border-radius: 0.625rem;
  min-width: 1rem;
  text-align: center;
}
@media (max-width: 900px) {
  .ui-library-filter__search-list .search-item .search-rank {
    font-size: 0.6875rem;
    padding: 0.0625rem 0.25rem;
  }
}
.ui-library-filter__search-options {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
  padding: 0.625rem 1rem;
  border-top: 1px solid #f3f4f6;
  border-radius: 0 0 0.5rem 0.5rem;
  width: 100%;
}
@media (max-width: 900px) {
  .ui-library-filter__search-options {
    width: 100%;
    padding: 0.5rem 0.75rem;
    gap: 0.75rem;
  }
}
.ui-library-filter__search-options .option-item {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.ui-library-filter__search-options .option-item .option-icon {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  background: #9ca3af;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 0.6875rem;
}
@media (max-width: 900px) {
  .ui-library-filter__search-options .option-item .option-icon {
    width: 1rem;
    height: 1rem;
    font-size: 0.5625rem;
  }
}
.ui-library-filter__search-options .option-item .option-icon::before {
  content: "×";
}
.ui-library-filter__search-options .option-item .option-text {
  color: #6b7280;
  font-size: 0.875rem;
}
@media (max-width: 900px) {
  .ui-library-filter__search-options .option-item .option-text {
    font-size: 0.8125rem;
  }
}
.ui-library-filter__search-options .option-button {
  background: none;
  border: none;
  color: #0071ba;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
}
@media (max-width: 900px) {
  .ui-library-filter__search-options .option-button {
    font-size: 0.8125rem;
  }
}
.ui-library-filter__search-options .option-button:hover {
  color: #244874;
}

/* ========================================
   상세검색 헤더
======================================== */
.search-detail-header {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  height: 3rem;
  border-radius: 0.375rem;
  border: 1px solid #3c79c2;
  background: #ecf2f9;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .search-detail-header {
    height: 2.5rem;
    margin-bottom: 1rem;
  }
}
.search-detail-header .search-detail-title {
  color: #0b50d0;
  text-align: center;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .search-detail-header .search-detail-title {
    font-size: 0.9375rem;
  }
}

/* ========================================
   검색 타입 탭
======================================== */
.search-type-tabs {
  position: relative;
  margin-bottom: 2.5rem;
}
@media (max-width: 900px) {
  .search-type-tabs {
    margin-bottom: 12px;
  }
}
.search-type-tabs.ui-tab--grid-3 .ui-tab__list {
  flex-wrap: wrap;
  overflow: hidden;
  border-right: none;
  border-bottom: none;
}
@media (max-width: 900px) {
  .search-type-tabs.ui-tab--grid-3 .ui-tab__list {
    margin-top: 1.5rem;
    flex-wrap: nowrap;
    overflow: auto;
  }
}
.search-type-tabs.ui-tab--grid-3 .ui-tab__button {
  flex: 1 1 calc(100% / min(3, var(--total-tabs, 5)));
  max-width: calc(100% / min(3, var(--total-tabs, 5)));
  border-bottom: 1px solid #b1b8be;
}
.search-type-tabs.ui-tab--grid-3 .ui-tab__button:last-child {
  border-right: 1px solid #b1b8be;
}
.search-type-tabs.ui-tab--grid-4 .ui-tab__list {
  flex-wrap: wrap;
  overflow: hidden;
  border-right: none;
  border-bottom: none;
}
@media (max-width: 900px) {
  .search-type-tabs.ui-tab--grid-4 .ui-tab__list {
    margin-top: 1.5rem;
    flex-wrap: nowrap;
    overflow: auto;
  }
}
.search-type-tabs.ui-tab--grid-4 .ui-tab__button {
  flex: 1 1 calc(100% / min(4, var(--total-tabs, 5)));
  border-bottom: 1px solid #b1b8be;
}
.search-type-tabs.ui-tab--grid-4 .ui-tab__button:last-child {
  border-right: 1px solid #b1b8be;
}
.search-type-tabs.ui-tab--grid-5 .ui-tab__list {
  flex-wrap: wrap;
  overflow: hidden;
  border-right: none;
  border-bottom: none;
}
@media (max-width: 900px) {
  .search-type-tabs.ui-tab--grid-5 .ui-tab__list {
    margin-top: 1.5rem;
    flex-wrap: nowrap;
    overflow: auto;
  }
}
.search-type-tabs.ui-tab--grid-5 .ui-tab__button {
  flex: 1 1 calc(100% / min(5, var(--total-tabs, 5)));
  border-bottom: 1px solid #b1b3b3;
}
.search-type-tabs.ui-tab--grid-5 .ui-tab__button:last-child {
  border-right: 1px solid #b1b3b3;
}
.search-type-tabs.ui-tab--grid-6 .ui-tab__list {
  flex-wrap: wrap;
  overflow: hidden;
  border-right: none;
  border-bottom: none;
}
@media (max-width: 900px) {
  .search-type-tabs.ui-tab--grid-6 .ui-tab__list {
    margin-top: 1.5rem;
    flex-wrap: nowrap;
    overflow: auto;
  }
}
.search-type-tabs.ui-tab--grid-6 .ui-tab__button {
  flex: 1 1 calc(100% / min(6, var(--total-tabs, 6)));
  border-bottom: 1px solid #b1b8be;
}
.search-type-tabs.ui-tab--grid-6 .ui-tab__button:last-child {
  border-right: 1px solid #b1b8be;
}
.search-type-tabs .ui-tab__button--active::after {
  display: none !important;
}
.search-type-tabs .ui-tab__list {
  gap: 0;
  border: 1px solid #b1b3b3;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  width: 100%;
  border-radius: 0rem;
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
}
@media (max-width: 900px) {
  .search-type-tabs .ui-tab__list {
    margin-bottom: 35px;
  }
}
.search-type-tabs .ui-tab__list::-webkit-scrollbar {
  height: 6px;
}
.search-type-tabs .ui-tab__list::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 3px;
}
.search-type-tabs .ui-tab__list::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}
.search-type-tabs .ui-tab__list::-webkit-scrollbar-thumb:hover {
  background: #999;
}
.search-type-tabs .ui-tab__button {
  background: transparent;
  border: none;
  border-right: 1px solid #b1b3b3;
  padding: 0.75rem 1rem;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #7d8181;
  transition: all 0.2s ease;
  position: relative;
  white-space: nowrap;
  flex-shrink: 0;
  flex: 1;
  min-width: max-content;
  border-bottom: none;
}
.search-type-tabs .ui-tab__button:last-child {
  border-right: none;
}
.search-type-tabs .ui-tab__button:hover:not(.ui-tab__button--active) {
  background: rgba(255, 255, 255, 0.5);
  z-index: 1;
}
.search-type-tabs .ui-tab__button:hover:not(.ui-tab__button--active) .ui-tab__label {
  color: #5a5a5a;
}
@media (max-width: 900px) {
  .search-type-tabs .ui-tab__button {
    flex-shrink: 0;
    min-width: max-content;
    min-height: 50px;
  }
}
.search-type-tabs .ui-tab__button--active {
  background: #003456;
  color: #ffffff;
  z-index: 2;
}
.search-type-tabs .ui-tab__button--active .ui-tab__label {
  color: #ffffff;
}

/* ========================================
   카테고리 탭
======================================== */
.category-tabs {
  margin-bottom: 1.5rem;
}
.category-tabs.ui-tab--grid-5 .ui-tab__list {
  grid-template-columns: repeat(5, 1fr);
}
@media (max-width: 900px) {
  .category-tabs.ui-tab--grid-5 .ui-tab__list {
    grid-template-columns: repeat(5, 1fr);
  }
}
.category-tabs .ui-tab__list {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1rem;
  border-radius: 0.5rem;
}
@media (max-width: 900px) {
  .category-tabs .ui-tab__list {
    grid-template-columns: repeat(4, 1fr);
    gap: 0.375rem;
  }
}
.category-tabs .ui-tab__button {
  background: #ffffff;
  border: none;
  border-radius: 0.375rem;
  padding: 1rem;
  font-size: 1rem;
  font-weight: 500;
  color: #666;
  transition: all 0.2s ease;
  position: relative;
  text-align: center;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid #cbcccc;
  background: #f1f2f2;
  min-height: 9.375rem;
  min-width: 9.125rem;
}
.category-tabs .ui-tab__button:after {
  display: none;
}
@media (max-width: 900px) {
  .category-tabs .ui-tab__button {
    padding: 1rem 0.25rem;
    font-size: 0.875rem;
    min-height: 6.25rem;
    height: 6.25rem;
    width: 100%;
    min-width: 0;
  }
}
.category-tabs .ui-tab__button:hover:not(.ui-tab__button--active) {
  background: #f8f9fa;
  color: #495057;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.category-tabs .ui-tab__button--active {
  background: #ecf2f9;
  color: #191a1a !important;
  font-weight: 600;
  z-index: 1;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 123, 255, 0.3);
  border: 2px solid var(--color-primary-pr04, #6494ce);
}
@media (max-width: 900px) {
  .category-tabs .ui-tab__button--active {
    transform: translateY(0);
  }
}
.category-tabs .ui-tab__button--active .ui-tab__label {
  color: #ffffff;
}
.category-tabs .ui-tab__button .ui-tab__icon {
  width: 3.5rem;
  height: 3.5rem;
  margin-bottom: 0.5rem;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (max-width: 900px) {
  .category-tabs .ui-tab__button .ui-tab__icon {
    width: 2.5rem;
    height: 2.5rem;
    margin-bottom: 0.375rem;
  }
}
.category-tabs .ui-tab__button .ui-tab__number {
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1;
  color: #191a1a;
}
.category-tabs .ui-tab__button .ui-tab__label {
  display: block;
  line-height: 1.4;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a !important;
}
@media (max-width: 900px) {
  .category-tabs .ui-tab__button .ui-tab__label {
    font-size: 0.75rem;
  }
}

/* ========================================
   검색 필터 섹션
======================================== */
.search-filter-section {
  margin-top: 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 900px) {
  .search-filter-section {
    margin-top: 1rem;
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
  }
}
.search-filter-section .filter-row {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 1.875rem;
}
@media (max-width: 900px) {
  .search-filter-section .filter-row {
    flex-direction: column;
    gap: 0.75rem;
  }
}
.search-filter-section .filter-row:last-child {
  margin-bottom: 0;
}
.search-filter-section .filter-group {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.search-filter-section .filter-group--classification {
  flex: 1;
}
.search-filter-section .filter-group--sort {
  flex: 0 0 auto;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .search-filter-section .filter-group--sort {
    justify-content: flex-start;
  }
}
.search-filter-section .filter-badge {
  background: #228738;
  color: #ffffff;
  padding: 0.5rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  white-space: nowrap;
  display: flex;
  align-items: center;
}
@media (max-width: 900px) {
  .search-filter-section .filter-badge {
    font-size: 0.9375rem;
    padding: 0.375rem 0.5rem;
  }
}

/* ========================================
   검색 정보 요약
======================================== */
.search-info-summary {
  display: flex;
  align-items: center;
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1.5;
  color: #1e2124;
  margin-top: 2.1875rem;
}
@media (max-width: 900px) {
  .search-info-summary.type2 {
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
}
.search-info-summary.type2 .mb0 {
  flex: none;
}
@media (max-width: 900px) {
  .search-info-summary {
    flex-direction: column;
    align-items: flex-start;
    font-size: 0.9375rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
}
.search-info-summary strong {
  color: #3c79c2;
  font-weight: 700;
}
.search-info-summary .search-keyword-info {
  margin-left: 0;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #1e2124;
}
@media (max-width: 900px) {
  .search-info-summary .search-keyword-info {
    font-size: 0.9375rem;
  }
}
.search-info-summary .search-keyword-info span {
  font-size: 1.0625rem;
  font-weight: 500;
  color: #191a1a;
}
@media (max-width: 900px) {
  .search-info-summary .search-keyword-info span {
    font-size: 0.9375rem;
  }
}
.search-info-summary .search-keyword-info .text-blue-600 {
  font-weight: 700;
  color: #0b78cb;
}

/* ========================================
   인포박스
======================================== */
.infobox {
  background-color: #f3f4f6;
  border: 1px solid #9ca3af;
  border-radius: 0.75rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .infobox {
    padding: 0.75rem;
    margin-bottom: 1rem;
  }
}
.infobox--secondary {
  background-color: #f3f4f6;
  border-color: #9ca3af;
}
.infobox__header {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.5rem;
}
.infobox__icon {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.5rem;
  flex-shrink: 0;
}
.infobox__icon svg {
  width: 2rem;
  height: 2rem;
}
@media (max-width: 900px) {
  .infobox__icon svg {
    width: 1.5rem;
    height: 1.5rem;
  }
}
.infobox__title {
  font-weight: 700;
  font-size: 1.1875rem;
  line-height: 1.5;
  color: #333;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .infobox__title {
    font-size: 1rem;
  }
}
.infobox__content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.75rem;
  padding-left: 1.75rem;
}
@media (max-width: 900px) {
  .infobox__content {
    padding-left: 1.25rem;
    gap: 0.5rem;
  }
}
.infobox__list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 900px) {
  .infobox__list {
    gap: 0.375rem;
  }
}
.infobox__list-item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 0.25rem;
  font-weight: 400;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #333;
  position: relative;
  padding-left: 0.75rem;
}
.infobox__list-item.mb-flex-col {
  flex-direction: column;
}
@media (max-width: 900px) {
  .infobox__list-item {
    font-size: 0.875rem;
  }
}
.infobox__list-item span {
  color: #d7424e;
}
.infobox__list-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  margin-right: 0.375rem;
  width: 0.375rem;
  height: 0.375rem;
  background-color: #464c53;
  border-radius: 0.25rem;
  flex-shrink: 0;
  margin-top: 0.5625rem;
}
@media (max-width: 900px) {
  .infobox__list-item::before {
    width: 0.25rem;
    height: 0.25rem;
    margin-top: 0.4375rem;
  }
}

/* ========================================
   검색 결과 영역
======================================== */
.search-result {
  /* 빈 상태 */
  /* 로딩 상태 */
}
.search-result__header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .search-result__header {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
}
.search-result__title {
  font-weight: 700;
  font-size: 1.1875rem;
  line-height: 1.5;
  color: #1e2124;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .search-result__title {
    font-size: 1rem;
  }
}
.search-result__controls {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex: 1;
  gap: 0.75rem;
}
@media (max-width: 900px) {
  .search-result__controls {
    justify-content: space-between;
    gap: 0.5rem;
  }
}
.search-result__content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .search-result__content {
    gap: 1rem;
  }
}
.search-result__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(17.5rem, 1fr));
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .search-result__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}
.search-result__empty {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  padding: 5rem 1.5rem;
  text-align: center;
  color: #6b7280;
}
@media (max-width: 900px) {
  .search-result__empty {
    padding: 3.75rem 1rem;
  }
}
.search-result__empty .empty-icon {
  width: 5rem;
  height: 5rem;
  margin-bottom: 1rem;
  opacity: 0.5;
}
@media (max-width: 900px) {
  .search-result__empty .empty-icon {
    width: 3.75rem;
    height: 3.75rem;
  }
}
.search-result__empty .empty-title {
  font-weight: 600;
  font-size: 1.125rem;
  margin-bottom: 0.5rem;
  color: #374151;
}
@media (max-width: 900px) {
  .search-result__empty .empty-title {
    font-size: 1rem;
  }
}
.search-result__empty .empty-description {
  font-weight: 400;
  font-size: 0.9375rem;
  color: #6b7280;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .search-result__empty .empty-description {
    font-size: 0.875rem;
  }
}
.search-result__loading {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  padding: 3.75rem 1.5rem;
}
@media (max-width: 900px) {
  .search-result__loading {
    padding: 2.5rem 1rem;
  }
}
.search-result__loading .loading-spinner {
  width: 2.5rem;
  height: 2.5rem;
  border: 3px solid #e5e7eb;
  border-top: 3px solid #3c79c2;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 1rem;
}
@media (max-width: 900px) {
  .search-result__loading .loading-spinner {
    width: 2rem;
    height: 2rem;
  }
}
.search-result__loading .loading-text {
  font-weight: 400;
  font-size: 1rem;
  color: #6b7280;
}
@media (max-width: 900px) {
  .search-result__loading .loading-text {
    font-size: 0.875rem;
  }
}

/* ========================================
   스마트도서관 검색바 커스텀
======================================== */
.smart-library-searchbar {
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .smart-library-searchbar {
    margin-bottom: 1rem;
  }
}
.smart-library-searchbar :global(.ui-searchbar) .ui-searchbar__container {
  border-radius: 0.5rem;
  border: 1px solid #9ca3af;
  background-color: #ffffff;
}
@media (max-width: 900px) {
  .smart-library-searchbar :global(.ui-searchbar) .ui-searchbar__container {
    width: 100%;
  }
}
.smart-library-searchbar :global(.ui-searchbar) .ui-searchbar__input {
  font-size: 1.0625rem;
  padding: 1rem;
}
@media (max-width: 900px) {
  .smart-library-searchbar :global(.ui-searchbar) .ui-searchbar__input {
    font-size: 0.9375rem;
    padding: 0.75rem;
  }
}
.smart-library-searchbar :global(.ui-searchbar) .ui-searchbar__button {
  background-color: #3c79c2;
  color: #ffffff;
  font-weight: 600;
  border-radius: 0 0.5rem 0.5rem 0;
}
@media (max-width: 900px) {
  .smart-library-searchbar :global(.ui-searchbar) .ui-searchbar__button {
    padding: 0.75rem;
  }
}
.smart-library-searchbar :global(.ui-searchbar) .ui-searchbar__button:hover {
  background-color: rgb(47.9527559055, 96.7047244094, 155.0472440945);
}

/* ========================================
   도서 표지 제공 정보
======================================== */
.book-cover-info {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-end;
  flex-wrap: nowrap;
}
@media (max-width: 900px) {
  .book-cover-info {
    font-size: 0.9375rem;
  }
}

/* ========================================
   게시판 목록
======================================== */
.bbs-list-container {
  margin-top: 1.5rem;
}
@media (max-width: 900px) {
  .bbs-list-container {
    margin-top: 1rem;
  }
}

/* 공지사항 박스 */
.notice-box {
  display: flex;
  padding: 2rem;
  border-radius: 12px;
  border: 1px solid var(--color-gray-gy-20, #cbcccc);
  background: var(--color-gray-wt, #fff);
}
.notice-box p {
  font-size: 1.1875rem;
  font-weight: 400;
  color: #1e2124;
  line-height: 1;
  line-height: 150%;
}
@media (max-width: 900px) {
  .notice-box p {
    font-size: 1.0625rem;
  }
}
.notice-box .desc {
  border-top: 1px dashed var(--color-border-gray, #b1b8be);
  padding-top: 1.5rem;
  margin-top: 1.5rem;
  display: flex;
  align-items: center;
  font-size: 1.1875rem;
  font-weight: 400;
  color: #0b5dd0;
  line-height: 1;
}
@media (max-width: 900px) {
  .notice-box .desc {
    gap: 5px;
    align-items: flex-start;
    font-size: 0.9375rem;
    line-height: 150%;
    padding-top: 1rem;
    margin-top: 1rem;
  }
}
@media (max-width: 900px) {
  .notice-box {
    padding: 1.25rem;
    flex-direction: column;
    gap: 0.75rem;
  }
}
.notice-box .notice-icon {
  display: inline-block;
  margin-right: 0.75rem;
}
@media (max-width: 900px) {
  .notice-box .notice-icon {
    margin-right: 0;
    align-self: flex-start;
  }
}
.notice-box .notice-content {
  flex: 1;
  margin-top: 0.375rem;
}
@media (max-width: 900px) {
  .notice-box .notice-content {
    margin-top: 0;
  }
}
.notice-box .notice-content .notice-title {
  font-size: 1.1875rem;
  font-weight: 700;
  color: #191a1a;
  margin-bottom: 0.75rem;
}
@media (max-width: 900px) {
  .notice-box .notice-content .notice-title {
    font-size: 1rem;
    margin-bottom: 0.5rem;
  }
}
.notice-box .notice-content .notice-text {
  font-size: 1.0625rem;
  font-weight: 500;
  color: #191a1a;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .notice-box .notice-content .notice-text {
    font-size: 0.9375rem;
  }
}

.bbs-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  margin: 1.5rem 0;
  padding: 1rem 0;
  border-bottom: 1px solid #d1d5db;
}
@media (max-width: 900px) {
  .bbs-header {
    gap: 0.75rem;
    margin: 1rem 0;
  }
}
.bbs-header .bbs-total {
  font-size: 1rem;
  color: #374151;
}
@media (max-width: 900px) {
  .bbs-header .bbs-total {
    font-size: 0.875rem;
  }
}
.bbs-header .bbs-total strong {
  color: #3c79c2;
  font-weight: 700;
}
.bbs-header .bbs-actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .bbs-header .bbs-actions {
    justify-content: flex-start;
  }
}

.book-description {
  border-radius: var(--radius-medium3, 8px);
  border: var(--border-width-static-regular, 1px) solid var(--color-border-gray-light, #cdd1d5);
  background: var(--color-surface-gray-subtler, #f4f5f6);
  padding: 16px;
}
@media (max-width: 900px) {
  .book-description {
    padding: 12px;
  }
}
.book-description p {
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1.5;
  color: #212121;
  word-break: keep-all;
}
@media (max-width: 900px) {
  .book-description p {
    font-size: 0.9375rem;
  }
}
.book-description ul li {
  position: relative;
  padding-left: 0.75rem;
  font-size: 0.9375rem;
  font-weight: 400;
  color: #212121;
  line-height: 1;
  margin-bottom: 0.75rem;
  word-break: keep-all;
}
@media (max-width: 900px) {
  .book-description ul li {
    font-size: 0.875rem;
    font-weight: 400;
    color: #212121;
    line-height: 1;
    margin-bottom: 0.625rem;
    padding-left: 0.625rem;
    line-height: 1.5;
  }
}
.book-description ul li i {
  position: relative;
  top: 5px;
}
@media (max-width: 900px) {
  .book-description ul li i {
    top: 3px;
  }
}
.book-description ul li.book-edit {
  margin-top: -10px;
}
.book-description ul li.book-edit::before {
  content: "";
  display: block;
  position: absolute;
  top: 18px;
}
@media (max-width: 900px) {
  .book-description ul li.book-edit {
    margin-top: -8px;
  }
  .book-description ul li.book-edit::before {
    content: "";
    display: block;
    position: absolute;
    top: 15px;
  }
}
.book-description ul li:last-child {
  margin-bottom: 0;
}
.book-description ul li {
  line-height: 1.5;
}
.book-description ul li strong {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #306199;
  line-height: 1;
}
@media (max-width: 900px) {
  .book-description ul li strong {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #306199;
    line-height: 1;
  }
}
.book-description ul li::before {
  content: "";
  display: block;
  position: absolute;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  top: 10px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #000;
}
@media (max-width: 900px) {
  .book-description ul li::before {
    top: 8px;
    width: 3px;
    height: 3px;
  }
}

/* ========================================
   애니메이션
======================================== */
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.gnb-third-item {
  display: flex;
  align-items: center;
  gap: var(--gap-2, 4px);
  align-self: stretch;
  border-radius: var(--radius-medium2, 6px);
  background: var(--color-action-secondary, rgba(255, 255, 255, 0));
  position: relative;
  margin-bottom: 0.25rem;
}
.gnb-third-item::before {
  content: "";
  display: block;
  position: absolute;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 6px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #000;
}
.gnb-third-item .gnb-third-link {
  display: block;
  width: 100%;
  height: 100%;
  padding: var(--padding-4, 16px) var(--padding-3, 8px);
  padding-left: 22px;
}
.gnb-third-item .gnb-third-link .gnb-third-text {
  font-size: 1rem;
  font-weight: 400;
  color: #121212;
  line-height: 1;
}
.gnb-third-item:hover {
  border-radius: var(--radius-medium2, 6px);
  background-color: #ecf2f9;
}
.gnb-third-item:hover .gnb-third-text {
  color: #191a1a !important;
  font-weight: 400 !important;
}
.gnb-third-item:active {
  background: #d8e4f3;
}
.gnb-third-item:active .gnb-third-text {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #244874 !important;
}
.gnb-third-item.selected {
  background: #ecf2f9;
}
.gnb-third-item.selected .gnb-third-text {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #244874 !important;
}

.statistics-content {
  flex: 1;
}
.statistics-content__item {
  flex: 1;
}
@media (max-width: 900px) {
  .statistics-content {
    flex-direction: column;
    min-height: 12.5rem;
    gap: 0.9375rem;
  }
  .statistics-content__item {
    flex: 1;
    width: 100% !important;
  }
}

.bookshelf-header {
  margin-top: 1.5rem;
  margin-bottom: 20px;
}
@media (max-width: 900px) {
  .bookshelf-header {
    margin-top: 16px;
    margin-bottom: 12px;
  }
}

.bookshelf-header__title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #212121;
  line-height: 1;
}
@media (max-width: 900px) {
  .bookshelf-header__title {
    font-size: 20px;
    font-weight: 700;
    color: #212121;
    line-height: 1;
  }
}
.bookshelf-header__title span {
  font-size: 1.5rem;
  font-weight: 700;
  color: #3c79c2;
  line-height: 1;
}
@media (max-width: 900px) {
  .bookshelf-header__title span {
    font-size: 20px;
    font-weight: 700;
    color: #3c79c2;
    line-height: 1;
  }
}

.bookshelf-item .bookshelf-item__content .bookshelf-item__thumbnail {
  height: 215px;
  width: 100%;
  display: block;
  overflow: hidden;
  background-color: #f3f4f6;
}
@media (max-width: 900px) {
  .bookshelf-item .bookshelf-item__content .bookshelf-item__thumbnail {
    height: 180px;
  }
}
.bookshelf-item .bookshelf-item__content .bookshelf-item__actions {
  margin-top: 1.25rem;
}
@media (max-width: 900px) {
  .bookshelf-item .bookshelf-item__content .bookshelf-item__actions {
    margin-top: 16px;
  }
}
.bookshelf-item .bookshelf-item__content .bookshelf-item__title {
  margin-top: 16px;
  font-size: 1.0625rem;
  font-weight: 500;
  color: #212121;
  line-height: 1;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.bookshelf-container {
  margin-bottom: 2.5rem;
}

/* ========================================
   서브 페이지 레이아웃 스타일
   - sub-layout__content-inner: 메인 콘텐츠 영역
   - sub-layout__content-inner-header: 페이지 제목/설명 영역
   - sub-layout__content-inner-body: 본문 콘텐츠 영역
   - policy-table: 정책 테이블 래퍼
======================================== */
.sub-layout__content-inner {
  background: #fff;
  border-radius: 0.5rem;
}
.sub-layout__content-inner-header {
  padding-bottom: 1rem;
  border-bottom: 1px solid #ecf2fe;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-header {
    padding-bottom: 12px;
  }
}
.sub-layout__content-inner-header-title {
  margin-top: 2.1875rem;
  color: #333;
  font-weight: 700;
  word-break: keep-all;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-header-title {
    font-size: 24px;
  }
}
.sub-layout__content-inner-header-desc {
  margin-top: 1rem;
  font-size: 1rem;
  line-height: 1.6;
  color: #111827;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-header-desc {
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.5;
  }
}
.sub-layout__content-inner-body {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body {
    gap: 12px;
  }
}
.sub-layout__content-inner-body-item {
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item {
    gap: 4px;
  }
}
.sub-layout__content-inner-body-item-list {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-top: 20px;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-list {
    margin-top: 16px;
  }
}
.sub-layout__content-inner-body-item-list li {
  font-size: 1.125rem;
  font-weight: 400;
  color: #333;
  padding: 0.5rem 1rem;
  position: relative;
  line-height: 150%;
}
.sub-layout__content-inner-body-item-list li p {
  margin-top: 10px;
}
.sub-layout__content-inner-body-item-list li::before {
  content: "";
  display: block;
  position: absolute;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  top: 21px;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #000;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-list li::before {
    top: 18px;
  }
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-list li {
    font-size: 16px;
    padding: 6px 12px;
  }
}
.sub-layout__content-inner-body-item-list li a {
  color: #3c79c2;
  text-decoration: underline;
}

/* ========================================
   정책 테이블 래퍼 스타일
   - 테이블을 감싸는 컨테이너
   - 반응형 스크롤 처리
======================================== */
.policy-table {
  width: 100%;
  overflow-x: auto;
  border-radius: 0.5rem;
}
@media (max-width: 900px) {
  .policy-table {
    margin-top: 1rem;
  }
}
.policy-table .table {
  width: 100%;
  margin: 0;
}
.policy-table .table.text-left td {
  text-align: left !important;
}
.policy-table .table--bordered {
  border-collapse: collapse;
}
.policy-table .table--bordered th,
.policy-table .table--bordered td {
  padding: 0.75rem 1rem;
  text-align: center;
  border-bottom: 1px solid #ecf2fe;
  line-height: 150%;
}
@media (max-width: 900px) {
  .policy-table .table--bordered th,
  .policy-table .table--bordered td {
    padding: 8px 12px;
    font-size: 14px;
  }
}
.policy-table .table--bordered th {
  background: rgba(60, 121, 194, 0.15);
  font-weight: 600;
  color: #333;
}
.policy-table .table--bordered th.bg-white {
  background: #fff;
  border-right: 1px solid #ecf2fe;
}
.policy-table .table--bordered td {
  background: #fff;
  color: #333;
}
.policy-table .table--bordered tbody tr:hover {
  background: rgba(60, 121, 194, 0.02);
}

.step-process {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 1.25rem;
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  position: relative;
}
@media (max-width: 900px) {
  .step-process {
    margin-top: 16px;
    flex-direction: column;
    gap: 1rem;
    align-items: stretch;
  }
}

.step-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  position: relative;
  flex: 1;
  min-width: 6.4375rem;
  text-align: center;
  background: #ecf2f9;
  border: 1px solid #cbcccc;
  border-radius: 0.75rem;
  padding: 1.5rem;
  height: -webkit-fill-available;
}
@media (max-width: 900px) {
  .step-item {
    flex-direction: row;
    justify-content: flex-start;
    min-width: 100%;
    text-align: left;
    gap: 1rem;
    height: auto;
    padding: 1rem;
  }
}

.step-number {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 2.125rem;
  height: 2.125rem;
  background: #6494ce;
  color: #ffffff;
  border-radius: 1.0625rem;
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.1875rem;
  line-height: 1.5;
  margin-bottom: 0.75rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .step-number {
    width: 1.875rem;
    height: 1.875rem;
    font-size: 1rem;
    margin-bottom: 0;
  }
}

.step-content {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #1e2124;
  line-height: 1.5;
  word-break: keep-all;
  text-align: center;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
@media (max-width: 900px) {
  .step-content {
    font-size: 0.9375rem;
    flex: 1;
    text-align: center;
  }
}
.step-content .step-sub {
  margin-top: 10px;
  word-break: keep-all;
  display: block;
  font-size: 0.875rem;
  color: #6b7280;
  font-weight: 400;
  line-height: 1.4;
}

.step-arrow {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 2.5rem;
  height: 2.5rem;
  background: #ffffff;
  border: 1px solid #cbcccc;
  border-radius: 1.25rem;
  padding: 0.5rem;
  position: absolute;
  top: 50%;
  right: -1.875rem;
  transform: translateY(-50%);
  z-index: 2;
}
@media (max-width: 900px) {
  .step-arrow {
    display: none;
  }
}

.step-item--disabled .step-content {
  color: #4b4d4d;
}

.step-item--completed .step-number {
  background: #228738;
}
.step-item--completed .step-content {
  color: #228738;
}

.step-item--current .step-number {
  background: #ffb114;
  animation: pulse 2s infinite;
}
.step-item--current .step-content {
  color: #ffb114;
}

.step-item--highlight {
  background: #3c79c2;
}
.step-item--highlight .step-number {
  border-radius: 1.0625rem;
  background: #ffffff;
  color: #3c79c2;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  text-align: center;
}
.step-item--highlight .step-content {
  color: #ffffff;
  text-align: center;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: 0;
}
.step-item--highlight .step-content .step-sub {
  color: #ffffff;
}

.step-process--6col {
  gap: 0.75rem;
}
.step-process--6col .step-item {
  min-width: 6.25rem;
  padding: 1.25rem;
}
.step-process--6col .step-arrow {
  right: -1.625rem;
}
@media (max-width: 900px) {
  .step-process--6col {
    flex-direction: column;
    gap: 1rem;
  }
  .step-process--6col .step-item {
    min-width: 100%;
    padding: 1rem;
  }
}

.step-process--5col {
  gap: 1.25rem;
}
.step-process--5col .step-item {
  min-width: 8.75rem;
  padding: 1.5rem 1rem;
}
.step-process--5col .step-arrow {
  right: -1.875rem;
}
@media (max-width: 900px) {
  .step-process--5col {
    flex-direction: column;
    gap: 1rem;
  }
  .step-process--5col .step-item {
    min-width: 100%;
    padding: 1rem;
  }
}

.step-title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 700;
  color: #18304d;
  line-height: 1.5;
  text-align: center;
  margin-bottom: 0.25rem;
}
@media (max-width: 900px) {
  .step-title {
    font-size: 1.0625rem;
  }
}

.step-item--pending .step-number {
  background: #d1d5db;
  color: #6b7280;
}
.step-item--pending .step-content {
  color: #6b7280;
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 4px 16px rgba(255, 177, 20, 0.4);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 6px 20px rgba(255, 177, 20, 0.6);
  }
}
/* ========================================
   희망도서신청 신청자 정보
======================================== */
.sub-layout__content-inner-body-item-content {
  display: flex;
  gap: 1rem;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-content {
    flex-direction: column;
  }
}
.sub-layout__content-inner-body-item-content .sub-layout__content-inner-body-item-content-item {
  flex: 1;
}

.sub-layout__content-inner-body-item-content-item-label {
  font-size: 1.1875rem;
  font-weight: bold;
  margin-bottom: 0.4375rem;
  color: #4b4d4d;
  position: relative;
  margin-top: 5px;
  margin-bottom: 10px;
  min-height: 29px;
  display: flex;
  align-items: flex-end;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-content-item-label {
    font-size: 16px;
  }
}
.sub-layout__content-inner-body-item-content-item-label .text-red {
  position: relative;
  top: -8px;
  left: 2px;
}

.sub-layout__content-inner-body-item-content-item-value {
  margin-top: 4px;
  font-weight: 400;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-content-item-value {
    margin-top: 6px;
  }
}

.text-red {
  color: #d7424e;
}

.sub-layout__content-inner-body-item-title-text {
  margin-top: 2.1875rem !important;
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.25;
  margin: 0;
  color: #333;
  font-weight: 700;
}

.sub-layout__content-inner-body-item-title-text-noti {
  display: flex;
  gap: 0.5rem;
  padding: 1rem;
  align-items: center;
  border-radius: var(--radius-xlarge2, 12px);
  border: var(--border-width-static-regular, 1px) solid var(--color-border-gray-light, #cdd1d5);
  background: var(--color-surface-gray-subtler, #f4f5f6);
  margin-top: 1rem;
}
.sub-layout__content-inner-body-item-title-text-noti p {
  line-height: 1.5;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-title-text-noti {
    gap: 6px;
    padding: 12px;
    margin-top: 12px;
    align-items: flex-start;
  }
}
.sub-layout__content-inner-body-item-title-text-noti svg {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-title-text-noti svg {
    width: 18px;
    height: 18px;
  }
}

.sub-layout__content-inner-body-footer {
  display: flex;
  gap: 0.5rem;
  max-width: 18.75rem;
  margin: 0 auto;
  margin-top: 3.4375rem;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-footer {
    margin-top: 16px;
    flex-direction: column;
    max-width: 100%;
  }
}

.sub-layout__content-inner-body-item-list-sub {
  margin-top: 0.75rem;
  margin-left: 1rem;
  list-style: disc;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-list-sub {
    margin-top: 8px;
    margin-left: 12px;
  }
}
.sub-layout__content-inner-body-item-list-sub li {
  position: relative;
  padding-left: 0;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #464c53;
  line-height: 1;
  word-break: keep-all;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-list-sub li {
    font-size: 16px;
    line-height: 1.5;
    word-break: keep-all;
  }
}
.sub-layout__content-inner-body-item-list-sub li::before {
  content: "";
  display: block;
  position: absolute;
  content: "";
  position: absolute;
  left: -1rem;
  top: 50%;
  transform: translateY(-50%);
  background-color: transparent;
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 4px;
  border: 1px solid var(--color-gray-gy-70, #4b4d4d);
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body-item-list-sub li::before {
    left: -12px;
    width: 3px;
    height: 3px;
  }
}

.sub-layout__content-inner-body--form .sub-layout__content-inner-body-item {
  gap: 1.875rem;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body--form .sub-layout__content-inner-body-item {
    gap: 20px;
  }
}
.sub-layout__content-inner-body--form .sub-layout__content-inner-body-item-title-text {
  margin-top: 0 !important;
}

.notice-box.type2 {
  flex-direction: column;
  border-radius: var(--radius-xlarge2, 12px);
  border: var(--border-width-static-regular, 1px) solid var(--color-border-secondary-light, #d6e0eb);
  background: var(--color-surface-secondary-subtler, #eef2f7);
}
@media (max-width: 900px) {
  .notice-box.type2 {
    border-radius: 8px;
    padding: 16px;
  }
}
.notice-box.type2 .notice-box-header {
  display: flex;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px dashed var(--color-gray-gy-30, #b1b3b3);
}
@media (max-width: 900px) {
  .notice-box.type2 .notice-box-header {
    padding-bottom: 12px;
  }
}
.notice-box.type2 .notice-box-header .notice-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #191919;
  line-height: 1;
}
@media (max-width: 900px) {
  .notice-box.type2 .notice-box-header .notice-title {
    font-size: 18px;
  }
}
.notice-box.type2 .notice-content {
  margin-top: 24px;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .notice-box.type2 .notice-content {
    margin-top: 16px;
  }
}
.notice-box.type2 .notice-content ul li {
  margin-bottom: 1rem;
}
.notice-box.type2 .notice-content ul li:last-child {
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .notice-box.type2 .notice-content ul li {
    margin-bottom: 6px;
  }
}
.notice-box.type2 .notice-content ul li dl {
  display: flex;
  align-items: flex-start;
  gap: 0.375rem;
}
@media (max-width: 900px) {
  .notice-box.type2 .notice-content ul li dl {
    gap: 8px;
  }
}
.notice-box.type2 .notice-content ul li dt {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #3c79c2;
  line-height: 1;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .notice-box.type2 .notice-content ul li dt {
    font-size: 14px;
    margin-bottom: 4px;
  }
}
.notice-box.type2 .notice-content ul li dd {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #333;
  line-height: 1;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .notice-box.type2 .notice-content ul li dd {
    font-size: 14px;
    word-break: keep-all;
  }
}

.sub-layout__content--detail {
  border-top: 2px solid var(--color-primary-pr07, #244874);
}
.sub-layout__content--detail .post-detail__header {
  border-bottom: 1px solid #e5e7eb;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__header {
    padding-bottom: 0px;
    margin-bottom: 10px;
  }
}
.sub-layout__content--detail .post-detail__title {
  display: flex;
  align-items: center;
  font-size: 1.75rem;
  font-weight: 700;
  color: #333;
  line-height: 1;
  line-height: 1.5;
  padding: 1rem 0;
  border-bottom: 1px solid #e5e7eb;
  padding-left: 28px;
  word-break: break-all;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__title {
    font-size: 20px;
    margin-bottom: 0px;
    border-bottom: none;
    padding-left: 5px;
    align-items: flex-start;
  }
}
.sub-layout__content--detail .post-detail__info {
  display: flex;
  gap: 1.5625rem;
  padding: 1rem 0;
  padding-left: 28px;
  border-top: 1px solid #e5e7eb;
}
.sub-layout__content--detail .post-detail__info.file-info {
  background: var(--color-primary-pr00, #ecf2f9);
}
.sub-layout__content--detail .post-detail__info.file-info a:hover {
  color: #3c79c2;
  text-decoration: underline;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__info {
    gap: 20px;
    flex-direction: column;
    padding-left: 5px;
  }
}
.sub-layout__content--detail .post-detail__info-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  position: relative;
}
.sub-layout__content--detail .post-detail__info-item::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -13px;
  transform: translateY(-50%);
  width: 0.125rem;
  height: 100%;
  background-color: #e5e7eb;
}
.sub-layout__content--detail .post-detail__info-item:last-child::after {
  display: none;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__info-item {
    gap: 6px;
  }
}
.sub-layout__content--detail .post-detail__info-label {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191919;
  line-height: 1;
  white-space: nowrap;
  min-width: 60px;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__info-label {
    font-size: 13px;
  }
}
.sub-layout__content--detail .post-detail__info-value {
  font-size: 1.0625rem;
  font-weight: 500;
  color: #4b4b4b;
  line-height: 1;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__info-value {
    font-size: 13px;
  }
}
.sub-layout__content--detail .post-detail__body {
  font-size: 1rem;
  font-weight: 400;
  color: #333;
  line-height: 1;
  line-height: 1.6;
  margin-bottom: 3rem;
  min-height: 12.5rem;
  padding: 1rem;
  word-wrap: break-word;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__body {
    font-size: 14px;
    margin-bottom: 32px;
    min-height: 150px;
  }
}
.sub-layout__content--detail .post-detail__body img {
  max-width: 100%;
  height: auto;
}
.sub-layout__content--detail .post-detail__body p {
  margin-bottom: 1rem;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__body p {
    margin-bottom: 12px;
  }
}
.sub-layout__content--detail .post-detail__body p:last-child {
  margin-bottom: 0;
}
.sub-layout__content--detail .post-detail__footer {
  border-top: 2px solid var(--color-primary-pr07, #244874);
  padding-top: 1.5rem;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__footer {
    padding-top: 16px;
  }
}
.sub-layout__content--detail .post-detail__actions {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
@media (max-width: 900px) {
  .sub-layout__content--detail .post-detail__actions {
    gap: 8px;
  }
}

.bd-none {
  border-bottom: none !important;
}

.com-sub-title {
  margin-top: 2rem;
  font-size: 1.5rem;
  font-weight: 400;
  color: #191919;
  line-height: 1;
  margin-bottom: 1rem;
  position: relative;
  padding-left: 2rem;
}
@media (max-width: 900px) {
  .com-sub-title {
    margin-top: 24px;
    font-size: 20px;
    margin-bottom: 12px;
    padding-left: 28px;
    line-height: 1.5;
    word-break: keep-all;
  }
}
.com-sub-title::before {
  content: "";
  display: block;
  position: absolute;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 24px;
  height: 24px;
  background-image: url("../../assets/images/icon/sub-title-noti.svg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (max-width: 900px) {
  .com-sub-title::before {
    top: 15px;
    width: 20px;
    height: 20px;
  }
}

.footer-btn-wrp {
  display: flex;
  gap: 1rem;
  justify-content: center;
}
@media (max-width: 900px) {
  .footer-btn-wrp {
    flex-direction: column;
    gap: 10px;
  }
}

.is-mo-hide {
  display: block;
}
@media (max-width: 900px) {
  .is-mo-hide {
    display: none;
  }
}

.is-mo-show {
  display: none;
}
@media (max-width: 900px) {
  .is-mo-show {
    display: block;
  }
}

.terms-agreement .ui-checkbox--medium .ui-checkbox__title,
.terms-agreement .ui-checkbox--large .ui-checkbox__title {
  font-size: 1.1875rem;
  line-height: 1.5;
  letter-spacing: -0.05em;
  color: #191a1a;
  font-weight: 700;
}

/* ========================================
   공연장 대관정보 스타일 (com-title-type2)
======================================== */
.com-title-type2 {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  margin-bottom: 2rem;
}
@media (max-width: 900px) {
  .com-title-type2 {
    margin-bottom: 1.25rem;
  }
}
.com-title-type2__header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.75rem 1rem;
  margin-bottom: 0.0625rem;
  border-top: 2px solid #244874;
}
@media (max-width: 900px) {
  .com-title-type2__header {
    padding: 0.5rem 0;
  }
}
.com-title-type2__header h2 {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  color: #4b4d4d;
  margin: 0;
}
@media (max-width: 900px) {
  .com-title-type2__header h2 {
    font-size: 1.125rem;
  }
}
.com-title-type2__detail {
  border-top: 1px solid #b1b4b4;
  border-bottom: 1px solid #b1b4b4;
  padding: 1.5rem 1rem;
}
@media (max-width: 900px) {
  .com-title-type2__detail {
    padding: 1rem 0;
  }
}
.com-title-type2__row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 1.625rem;
  margin-bottom: 8px;
}
.com-title-type2__row:last-child {
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .com-title-type2__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    min-height: auto;
    margin-bottom: 6px;
  }
  .com-title-type2__row:last-child {
    margin-bottom: 0;
  }
}
.com-title-type2__column {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex: 1;
}
@media (max-width: 900px) {
  .com-title-type2__column {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    width: 100%;
  }
}
.com-title-type2__term {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #1a1a1a;
  width: 11.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .com-title-type2__term {
    width: auto;
    font-size: 0.875rem;
  }
}
.com-title-type2__description {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  flex: 1;
}
@media (max-width: 900px) {
  .com-title-type2__description {
    font-size: 0.875rem;
  }
}
.com-title-type2__description--primary {
  color: #053456;
}
.com-title-type2 > p {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  color: #4b4d4d;
  margin: 0 0 1rem 0;
}
@media (max-width: 900px) {
  .com-title-type2 > p {
    font-size: 1.125rem;
    margin-bottom: 0.75rem;
  }
}
.com-title-type2 .info-list {
  display: flex;
  gap: 1rem;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--color-gray-gy-30, #b1b3b3);
  border-bottom: 1px solid var(--color-gray-gy-30, #b1b3b3);
  padding: 24px 0;
}
@media (max-width: 900px) {
  .com-title-type2 .info-list {
    gap: 0.5rem;
  }
}
.com-title-type2 .info-list__item {
  display: flex;
  flex: 1;
  align-items: center;
  gap: 1.5rem;
  min-height: 1.625rem;
}
@media (max-width: 900px) {
  .com-title-type2 .info-list__item {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    min-height: auto;
  }
}
.com-title-type2 .info-list__term {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #1a1a1a;
  width: 11.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .com-title-type2 .info-list__term {
    width: auto;
    font-size: 0.875rem;
  }
}
.com-title-type2 .info-list__description {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  flex: 1;
}
@media (max-width: 900px) {
  .com-title-type2 .info-list__description {
    font-size: 0.875rem;
  }
}
.com-title-type2 .info-list__description--primary {
  color: #053456;
}

/* ========================================
   개인정보 동의 섹션 스타일 (privacy-consent)
======================================== */
@media (max-width: 900px) {
  .privacy-consent {
    margin-bottom: 1.5rem;
  }
}
.privacy-consent__title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
  color: #1a1a1a;
  margin: 0 0 1.5rem 0;
}
@media (max-width: 900px) {
  .privacy-consent__title {
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }
}
.privacy-consent__infobox {
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 0.5rem;
  padding: 1rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .privacy-consent__infobox {
    padding: 0.75rem;
    margin-bottom: 1rem;
  }
}
.privacy-consent__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .privacy-consent__header {
    gap: 0.375rem;
    margin-bottom: 0.375rem;
  }
}
.privacy-consent__icon {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.privacy-consent__icon svg {
  width: 100%;
  height: 100%;
  color: #323333;
}
@media (max-width: 900px) {
  .privacy-consent__icon {
    width: 1rem;
    height: 1rem;
  }
}
.privacy-consent__subtitle {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #000000;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .privacy-consent__subtitle {
    font-size: 0.9375rem;
  }
}
.privacy-consent__content {
  padding-left: 1.75rem;
}
@media (max-width: 900px) {
  .privacy-consent__content {
    padding-left: 1.375rem;
  }
}
.privacy-consent__list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 900px) {
  .privacy-consent__list {
    gap: 0.375rem;
  }
}
.privacy-consent__list-item {
  display: flex;
  align-items: flex-start;
  gap: 0.25rem;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #323333;
}
@media (max-width: 900px) {
  .privacy-consent__list-item {
    font-size: 0.875rem;
  }
}
.privacy-consent__list-item::before {
  content: "1.";
  color: #4b4d4d;
  font-weight: 400;
  flex-shrink: 0;
  width: 0.8125rem;
  display: block;
}
.privacy-consent__list-item:nth-child(2)::before {
  content: "2.";
}
.privacy-consent__list-item:nth-child(3)::before {
  content: "3.";
}
.privacy-consent__list-item:nth-child(4)::before {
  content: "4.";
}
.privacy-consent__list-item:nth-child(5)::before {
  content: "5.";
}

/* ========================================
   인라인 스타일을 클래스로 변환한 스타일들
======================================== */
/* 주요키워드 워드클라우드 영역 */
.keywords-content {
  height: 25rem;
  background-color: #f8f8f8;
}
@media (max-width: 900px) {
  .keywords-content {
    height: 300px;
  }
}

/* 워드클라우드 캔버스 */
.wordcloud-canvas {
  width: 100%;
  height: 100%;
}

/* 통계 차트 컨테이너 아이템 */
.statistics-chart-item {
  width: 50%;
}
@media (max-width: 900px) {
  .statistics-chart-item {
    width: 100% !important;
  }
}

/* 테이블 헤더 배경색 */
.table-header-bg {
  background: #ecf2f9;
}

/* 책 추천 슬라이더 숨김 처리 */
.book-recommendation-slider--hidden {
  display: none;
}

/* 언어 콘텐츠 숨김 처리 */
.language-content--hidden {
  display: none;
}

/* 소장정보 래퍼 숨김 처리 */
.collection-wrapper--hidden {
  display: none;
}

/* 키보드 래퍼 상대 위치 */
.keyboard-wrapper {
  position: relative;
}

/* 다국어 입력 래퍼 */
.worldword-wrap {
  top: 100%;
  margin-top: -0.625rem;
  display: none;
}
.worldword-wrap--visible {
  display: block;
}

/* 한 줄 제목 스타일 */
.title-single-line {
  white-space: pre-line;
  text-align: right;
}

/* 이벤트 카드 태그 색상 클래스들 */
.event-card__tag {
  /* 기본 배경색 */
  background-color: #333;
  /* 각 도서관/지역별 태그 색상 클래스 */
}
.event-card__tag--yeonsu-kkumdham {
  background-color: #a3cf62;
}
.event-card__tag--songdo5dong {
  background-color: #e45f53;
}
.event-card__tag--nuri-park {
  background-color: #7b19d7;
}
.event-card__tag--songdo-international {
  background-color: #8e63aa;
}
.event-card__tag--cheonghak {
  background-color: #4a90e2;
}
.event-card__tag--nonhyeon {
  background-color: #f5a623;
}
.event-card__tag--okryeon {
  background-color: #50e3c2;
}
.event-card__tag--hakik {
  background-color: #bd10e0;
}
.event-card__tag--literature {
  background-color: #e74c3c;
}
.event-card__tag--seonhak {
  background-color: #9b59b6;
}
.event-card__tag--dongchun-narae {
  background-color: #34495e;
}
.event-card__tag--haedoji {
  background-color: #16a085;
}

.login-container {
  display: flex;
  align-items: stretch;
  width: 100%;
  padding: 32px;
  background: white;
  border-top: 1px solid var(--color-divider-gray, #8a949e);
  border-bottom: 1px solid var(--color-divider-gray, #8a949e);
}

/* 좌측 환영 배너 */
.login-banner {
  flex: 1;
  padding: 32px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: var(--radius-xlarge2, 12px);
  background: var(--color-primary-pr00, #ecf2f9);
}

.login-banner__content {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
  gap: 2.5rem;
}

.login-banner__text-group {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.login-banner__title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.5rem; /* 24px */
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}

.login-banner__description {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem; /* 17px */
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  margin: 0;
}

.login-banner__image {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}

.login-banner__img {
  width: 125px;
  height: 120px;
  object-fit: contain;
}

/* 구분선 */
.login-divider {
  width: 1px;
  background: #8a949e;
  flex-shrink: 0;
  margin: 0 40px;
}

/* 우측 로그인 폼 */
.login-form-section {
  flex: 1;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 0;
  padding-bottom: 0;
  padding-top: 0;
  width: 100%;
  max-width: 100%;
}
@media (max-width: 900px) {
  .login-form-section {
    padding-top: 16px;
  }
}
.login-form-section .member-info-display-container {
  width: 100%;
}

.login-form {
  width: 100%;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem; /* 24px */
}

.login-form__button-group {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.login-form__divider {
  color: #cdd1d5;
  font-size: 1rem;
  line-height: 1;
}

/* 반응형 처리 */
@media (max-width: 900px) {
  .login-container {
    flex-direction: column;
    max-width: 100%;
    min-height: auto;
    padding: 0;
  }
  .login-banner {
    padding: 1.5rem;
    border-radius: 0;
  }
  .login-banner__content {
    flex-direction: row;
    align-items: center;
    gap: 1.5rem;
  }
  .login-banner__image {
    justify-content: center;
    align-items: center;
  }
  .login-banner__img {
    width: 80px;
    height: 77px;
  }
  .login-banner__title {
    font-size: 1.25rem; /* 20px */
  }
  .login-banner__description {
    font-size: 0.9375rem; /* 15px */
  }
  .login-divider {
    width: 100%;
    height: 1px;
    margin: 0;
  }
  .login-form-section {
    padding: 1.5rem;
  }
  .login-form {
    gap: 1.25rem; /* 20px */
  }
}
@media (max-width: 480px) {
  .login-banner {
    padding: 1rem;
  }
  .login-banner__content {
    flex-direction: column;
    gap: 1rem;
  }
  .login-banner__content .info-notice {
    margin-top: 0;
  }
  .login-banner__title {
    font-size: 1.125rem; /* 18px */
    text-align: center;
  }
  .login-banner__description {
    font-size: 0.875rem; /* 14px */
    text-align: center;
  }
  .login-form-section {
    padding: 1rem;
  }
}
.ui-searchbar {
  background-color: #eef2f7;
  border-radius: 0.75rem;
  padding: 1.375rem 2rem;
}
.ui-searchbar--full-width {
  width: 100%;
}
.ui-searchbar__content {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.625rem;
  width: 100%;
}
.ui-searchbar__select {
  min-width: 7.5rem;
  flex-shrink: 0;
}
.ui-searchbar__button {
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .ui-searchbar {
    padding: 1rem;
  }
  .ui-searchbar__content {
    flex-direction: column;
    align-items: stretch;
    gap: 0.375rem;
  }
  .ui-searchbar__select, .ui-searchbar__input, .ui-searchbar__button {
    width: 100%;
  }
}

/* ========================================
   회원정보수정 페이지 스타일 (로그인 스타일 확장)
======================================== */
/* 회원정보수정 Step2 - 기본 정보 표시 영역 */
.member-info-display {
  padding: 1.5rem 0;
  margin-bottom: 1.5rem;
  border-top: 1px solid #b1b3b3;
  border-bottom: 1px solid #b1b3b3;
}
@media (max-width: 900px) {
  .member-info-display {
    padding: 1rem 0;
    margin-bottom: 1rem;
  }
}

.info-row {
  display: flex;
  align-items: center;
  padding: 0 1.5rem;
  margin-bottom: 1rem;
}
.info-row:last-child {
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .info-row {
    padding: 0 1rem;
    margin-bottom: 0.75rem;
  }
}

.info-label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  width: 11.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .info-label {
    font-size: 0.9375rem;
    width: 7.5rem;
  }
}

.info-value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  flex: 1;
}
@media (max-width: 900px) {
  .info-value {
    font-size: 0.9375rem;
  }
}

/* 메인 섹션 타이틀 스타일 */
.section-title--main {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.193;
  color: #191a1a;
  margin: 0 0 1.5rem 0;
  width: 100%;
}
@media (max-width: 900px) {
  .section-title--main {
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }
}

/* ========================================
   회원탈퇴 페이지 스타일
======================================== */
/* 탈퇴 안내 콘텐츠 */
.withdrawal-notice__content {
  margin-top: 0.5rem;
}

.withdrawal-notice__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  margin: 0 0 0.75rem 1.75rem; /* 아이콘 + 간격만큼 들여쓰기 */
}
.withdrawal-notice__text:last-child {
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .withdrawal-notice__text {
    font-size: 0.9375rem;
    margin-left: 1.5rem;
    margin-bottom: 0.625rem;
  }
}

.withdrawal-notice__section {
  margin-bottom: 0.5rem;
}
.withdrawal-notice__section:last-child {
  margin-bottom: 0;
}

.withdrawal-notice__subtitle {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.5;
  color: #3c79c2;
  margin: 0 0 0.5rem 1.75rem; /* 아이콘 + 간격만큼 들여쓰기 */
}
@media (max-width: 900px) {
  .withdrawal-notice__subtitle {
    font-size: 1rem;
    margin-left: 1.5rem;
  }
}

/* 동의 체크박스 영역 */
.withdrawal-agreement {
  margin: 1.5rem 0;
  margin-top: 0;
  padding-top: 24px;
  border-top: 1px solid #b1b3b3;
}
@media (max-width: 900px) {
  .withdrawal-agreement {
    margin: 1rem 0;
    padding-top: 16px;
  }
}

/* 탈퇴하기 버튼 여백 */
.withdrawal-submit-btn {
  margin-top: 0.5rem;
}

/* ========================================
   정회원인증 페이지 스타일
======================================== */
/* 인증 섹션 */
.verification-section {
  margin: 0 auto;
  width: 100%;
}
@media (max-width: 900px) {
  .verification-section {
    max-width: 100%;
  }
}

/* 동의 영역 */
.verification-agreement {
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .verification-agreement {
    margin-bottom: 1rem;
  }
}

/* 주민등록번호 입력 그룹 */
.verification-input-group {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .verification-input-group {
    flex-direction: column;
  }
}
.verification-input-group .verification-input {
  flex: 0 0 auto;
  width: auto;
}
@media (max-width: 900px) {
  .verification-input-group .verification-input {
    width: 100%;
  }
}
@media (max-width: 900px) {
  .verification-input-group {
    gap: 0.125rem;
  }
}

.input-separator {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #646767;
  margin: 0 0.125rem;
}
@media (max-width: 900px) {
  .input-separator {
    font-size: 0.9375rem;
  }
}

/* 필수 표시가 있는 라디오 질문 */
.radio-question.required {
  color: #d7424e;
  font-weight: 400;
}
@media (max-width: 900px) {
  .radio-question.required {
    font-size: 0.9375rem;
  }
}

/* 텍스트 스타일 변형 */
.text-muted {
  color: #464c53 !important;
}

.text-note {
  color: #4b4d4d !important;
}
.text-note:before {
  content: "";
  display: inline-block;
  width: 0.375rem;
  height: 0.375rem;
  background-color: #4b4d4d;
  border-radius: 0.25rem;
  margin-right: 0.5rem;
  vertical-align: middle;
}

/* 안내 메시지 컴포넌트 - 로그인 배너 내부에서 사용 */
.info-notice__header {
  display: flex;
  gap: 0.5rem;
}

.info-notice__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-top: 2px;
}
@media (max-width: 900px) {
  .info-notice__icon {
    margin-top: 1px;
  }
}

.info-notice__title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem; /* 17px */
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
  word-break: keep-all;
}

.info-notice__content {
  width: 100%;
}

.info-notice__desc {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: #464c53;
  margin: 0;
  padding-bottom: 5px;
  border-bottom: 1px dashed #b1b3b3;
}

.info-notice__description {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem; /* 17px */
  font-weight: 400;
  line-height: 1.5;
  color: #464c53;
  margin: 0;
  margin-left: 1.75rem; /* 아이콘 + 간격만큼 들여쓰기 */
}

/* 회원정보수정 버튼 그룹 - 취소/확인 버튼을 가로로 배치 */
.member-edit-buttons {
  display: flex;
  gap: 1.5rem; /* 24px */
  width: 100%;
}
.member-edit-buttons .cancel-button,
.member-edit-buttons .confirm-button {
  flex: 1; /* 동일한 너비로 분할 */
}

/* 반응형 처리 - 모바일에서 버튼을 세로로 배치 */
@media (max-width: 900px) {
  .info-notice {
    margin-top: 1rem;
    padding: 0.75rem;
  }
  .info-notice__title {
    font-size: 1rem; /* 16px */
  }
  .info-notice__description {
    font-size: 0.9375rem; /* 15px */
    margin-left: 1.5rem;
  }
  .member-edit-buttons {
    flex-direction: column;
    gap: 1rem;
  }
  .member-edit-buttons .cancel-button,
  .member-edit-buttons .confirm-button {
    width: 100%;
  }
}
@media (max-width: 480px) {
  .info-notice {
    padding: 0.5rem;
  }
  .info-notice__header {
    gap: 0.375rem;
  }
  .info-notice__title {
    font-size: 0.9375rem; /* 15px */
  }
  .info-notice__description {
    font-size: 0.875rem; /* 14px */
    margin-left: 1.25rem;
  }
}
.grid-cols-1 {
  grid-template-columns: repeat(1, 1fr) !important;
}

.grid-cols-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}

.grid-cols-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}

.grid-cols-4 {
  grid-template-columns: repeat(4, 1fr) !important;
}

.grid-cols-5 {
  grid-template-columns: repeat(5, 1fr) !important;
}

.grid-cols-6 {
  grid-template-columns: repeat(6, 1fr) !important;
}

.grid-cols-7 {
  grid-template-columns: repeat(7, 1fr) !important;
}

.grid-cols-8 {
  grid-template-columns: repeat(8, 1fr) !important;
}

.grid-cols-9 {
  grid-template-columns: repeat(9, 1fr) !important;
}

.grid-cols-10 {
  grid-template-columns: repeat(10, 1fr) !important;
}

.grid-cols-11 {
  grid-template-columns: repeat(11, 1fr) !important;
}

.grid-cols-12 {
  grid-template-columns: repeat(12, 1fr) !important;
}

.table-overflow-auto {
  max-height: 400px;
  overflow-y: auto;
}

.col-w-10px {
  width: 10px !important;
  min-width: 10px !important;
}

.col-w-10per {
  width: 2% !important;
  min-width: 2% !important;
}

.col-w-20px {
  width: 20px !important;
  min-width: 20px !important;
}

.col-w-20per {
  width: 4% !important;
  min-width: 4% !important;
}

.col-w-30px {
  width: 30px !important;
  min-width: 30px !important;
}

.col-w-30per {
  width: 6% !important;
  min-width: 6% !important;
}

.col-w-40px {
  width: 40px !important;
  min-width: 40px !important;
}

.col-w-40per {
  width: 8% !important;
  min-width: 8% !important;
}

.col-w-50px {
  width: 50px !important;
  min-width: 50px !important;
}

.col-w-50per {
  width: 10% !important;
  min-width: 10% !important;
}

.col-w-60px {
  width: 60px !important;
  min-width: 60px !important;
}

.col-w-60per {
  width: 12% !important;
  min-width: 12% !important;
}

.col-w-70px {
  width: 70px !important;
  min-width: 70px !important;
}

.col-w-70per {
  width: 14% !important;
  min-width: 14% !important;
}

.col-w-80px {
  width: 80px !important;
  min-width: 80px !important;
}

.col-w-80per {
  width: 16% !important;
  min-width: 16% !important;
}

.col-w-90px {
  width: 90px !important;
  min-width: 90px !important;
}

.col-w-90per {
  width: 18% !important;
  min-width: 18% !important;
}

.col-w-100px {
  width: 100px !important;
  min-width: 100px !important;
}

.col-w-100per {
  width: 20% !important;
  min-width: 20% !important;
}

.col-w-110px {
  width: 110px !important;
  min-width: 110px !important;
}

.col-w-110per {
  width: 22% !important;
  min-width: 22% !important;
}

.col-w-120px {
  width: 120px !important;
  min-width: 120px !important;
}

.col-w-120per {
  width: 24% !important;
  min-width: 24% !important;
}

.col-w-130px {
  width: 130px !important;
  min-width: 130px !important;
}

.col-w-130per {
  width: 26% !important;
  min-width: 26% !important;
}

.col-w-140px {
  width: 140px !important;
  min-width: 140px !important;
}

.col-w-140per {
  width: 28% !important;
  min-width: 28% !important;
}

.col-w-150px {
  width: 150px !important;
  min-width: 150px !important;
}

.col-w-150per {
  width: 30% !important;
  min-width: 30% !important;
}

.col-w-160px {
  width: 160px !important;
  min-width: 160px !important;
}

.col-w-160per {
  width: 32% !important;
  min-width: 32% !important;
}

.col-w-170px {
  width: 170px !important;
  min-width: 170px !important;
}

.col-w-170per {
  width: 34% !important;
  min-width: 34% !important;
}

.col-w-180px {
  width: 180px !important;
  min-width: 180px !important;
}

.col-w-180per {
  width: 36% !important;
  min-width: 36% !important;
}

.col-w-190px {
  width: 190px !important;
  min-width: 190px !important;
}

.col-w-190per {
  width: 38% !important;
  min-width: 38% !important;
}

.col-w-200px {
  width: 200px !important;
  min-width: 200px !important;
}

.col-w-200per {
  width: 40% !important;
  min-width: 40% !important;
}

.col-w-210px {
  width: 210px !important;
  min-width: 210px !important;
}

.col-w-210per {
  width: 42% !important;
  min-width: 42% !important;
}

.col-w-220px {
  width: 220px !important;
  min-width: 220px !important;
}

.col-w-220per {
  width: 44% !important;
  min-width: 44% !important;
}

.col-w-230px {
  width: 230px !important;
  min-width: 230px !important;
}

.col-w-230per {
  width: 46% !important;
  min-width: 46% !important;
}

.col-w-240px {
  width: 240px !important;
  min-width: 240px !important;
}

.col-w-240per {
  width: 48% !important;
  min-width: 48% !important;
}

.col-w-250px {
  width: 250px !important;
  min-width: 250px !important;
}

.col-w-250per {
  width: 50% !important;
  min-width: 50% !important;
}

.col-w-260px {
  width: 260px !important;
  min-width: 260px !important;
}

.col-w-260per {
  width: 52% !important;
  min-width: 52% !important;
}

.col-w-270px {
  width: 270px !important;
  min-width: 270px !important;
}

.col-w-270per {
  width: 54% !important;
  min-width: 54% !important;
}

.col-w-280px {
  width: 280px !important;
  min-width: 280px !important;
}

.col-w-280per {
  width: 56% !important;
  min-width: 56% !important;
}

.col-w-290px {
  width: 290px !important;
  min-width: 290px !important;
}

.col-w-290per {
  width: 58% !important;
  min-width: 58% !important;
}

.col-w-300px {
  width: 300px !important;
  min-width: 300px !important;
}

.col-w-300per {
  width: 60% !important;
  min-width: 60% !important;
}

.col-w-310px {
  width: 310px !important;
  min-width: 310px !important;
}

.col-w-310per {
  width: 62% !important;
  min-width: 62% !important;
}

.col-w-320px {
  width: 320px !important;
  min-width: 320px !important;
}

.col-w-320per {
  width: 64% !important;
  min-width: 64% !important;
}

.col-w-330px {
  width: 330px !important;
  min-width: 330px !important;
}

.col-w-330per {
  width: 66% !important;
  min-width: 66% !important;
}

.col-w-340px {
  width: 340px !important;
  min-width: 340px !important;
}

.col-w-340per {
  width: 68% !important;
  min-width: 68% !important;
}

.col-w-350px {
  width: 350px !important;
  min-width: 350px !important;
}

.col-w-350per {
  width: 70% !important;
  min-width: 70% !important;
}

.col-w-360px {
  width: 360px !important;
  min-width: 360px !important;
}

.col-w-360per {
  width: 72% !important;
  min-width: 72% !important;
}

.col-w-370px {
  width: 370px !important;
  min-width: 370px !important;
}

.col-w-370per {
  width: 74% !important;
  min-width: 74% !important;
}

.col-w-380px {
  width: 380px !important;
  min-width: 380px !important;
}

.col-w-380per {
  width: 76% !important;
  min-width: 76% !important;
}

.col-w-390px {
  width: 390px !important;
  min-width: 390px !important;
}

.col-w-390per {
  width: 78% !important;
  min-width: 78% !important;
}

.col-w-400px {
  width: 400px !important;
  min-width: 400px !important;
}

.col-w-400per {
  width: 80% !important;
  min-width: 80% !important;
}

.col-w-410px {
  width: 410px !important;
  min-width: 410px !important;
}

.col-w-410per {
  width: 82% !important;
  min-width: 82% !important;
}

.col-w-420px {
  width: 420px !important;
  min-width: 420px !important;
}

.col-w-420per {
  width: 84% !important;
  min-width: 84% !important;
}

.col-w-430px {
  width: 430px !important;
  min-width: 430px !important;
}

.col-w-430per {
  width: 86% !important;
  min-width: 86% !important;
}

.col-w-440px {
  width: 440px !important;
  min-width: 440px !important;
}

.col-w-440per {
  width: 88% !important;
  min-width: 88% !important;
}

.col-w-450px {
  width: 450px !important;
  min-width: 450px !important;
}

.col-w-450per {
  width: 90% !important;
  min-width: 90% !important;
}

.col-w-460px {
  width: 460px !important;
  min-width: 460px !important;
}

.col-w-460per {
  width: 92% !important;
  min-width: 92% !important;
}

.col-w-470px {
  width: 470px !important;
  min-width: 470px !important;
}

.col-w-470per {
  width: 94% !important;
  min-width: 94% !important;
}

.col-w-480px {
  width: 480px !important;
  min-width: 480px !important;
}

.col-w-480per {
  width: 96% !important;
  min-width: 96% !important;
}

.col-w-490px {
  width: 490px !important;
  min-width: 490px !important;
}

.col-w-490per {
  width: 98% !important;
  min-width: 98% !important;
}

.col-w-500px {
  width: 500px !important;
  min-width: 500px !important;
}

.col-w-500per {
  width: 100% !important;
  min-width: 100% !important;
}

.container-full-width {
  width: 100% !important;
}

.container-auto-width {
  width: auto !important;
}

.container-w-100 {
  width: 100px !important;
}

.container-w-150 {
  width: 150px !important;
}

.container-w-200 {
  width: 200px !important;
}

.container-w-250 {
  width: 250px !important;
}

.container-w-300 {
  width: 300px !important;
}

.container-w-350 {
  width: 350px !important;
}

.container-w-400 {
  width: 400px !important;
}

.container-w-450 {
  width: 450px !important;
}

.container-w-500 {
  width: 500px !important;
}

.container-w-550 {
  width: 550px !important;
}

.container-w-600 {
  width: 600px !important;
}

.container-w-650 {
  width: 650px !important;
}

.container-w-700 {
  width: 700px !important;
}

.container-w-750 {
  width: 750px !important;
}

.container-w-800 {
  width: 800px !important;
}

.container-w-850 {
  width: 850px !important;
}

.container-w-900 {
  width: 900px !important;
}

.container-w-950 {
  width: 950px !important;
}

.container-w-1000 {
  width: 1000px !important;
}

.size-40x40 {
  width: 40px !important;
  height: 40px !important;
}
@media (max-width: 768px) {
  .size-40x40 {
    width: 32px !important;
    height: 32px !important;
  }
}

.size-48x48 {
  width: 48px !important;
  height: 48px !important;
}
@media (max-width: 768px) {
  .size-48x48 {
    width: 40px !important;
    height: 40px !important;
  }
}

.size-56x56 {
  width: 56px !important;
  height: 56px !important;
}
@media (max-width: 768px) {
  .size-56x56 {
    width: 48px !important;
    height: 48px !important;
  }
}

.size-64x64 {
  width: 64px !important;
  height: 64px !important;
}
@media (max-width: 768px) {
  .size-64x64 {
    width: 56px !important;
    height: 56px !important;
  }
}

.size-2-5rem {
  width: 2.5rem !important;
  height: 2.5rem !important;
}

.size-3rem {
  width: 3rem !important;
  height: 3rem !important;
}

.size-3-5rem {
  width: 3.5rem !important;
  height: 3.5rem !important;
}

.size-4rem {
  width: 4rem !important;
  height: 4rem !important;
}

.table-max-height-200 {
  max-height: 200px !important;
  overflow-y: auto !important;
}

.table-max-height-250 {
  max-height: 250px !important;
  overflow-y: auto !important;
}

.table-max-height-300 {
  max-height: 300px !important;
  overflow-y: auto !important;
}

.table-max-height-350 {
  max-height: 350px !important;
  overflow-y: auto !important;
}

.table-max-height-400 {
  max-height: 400px !important;
  overflow-y: auto !important;
}

.table-max-height-450 {
  max-height: 450px !important;
  overflow-y: auto !important;
}

.table-max-height-500 {
  max-height: 500px !important;
  overflow-y: auto !important;
}

.table-max-height-550 {
  max-height: 550px !important;
  overflow-y: auto !important;
}

.table-max-height-600 {
  max-height: 600px !important;
  overflow-y: auto !important;
}

.table-max-height-650 {
  max-height: 650px !important;
  overflow-y: auto !important;
}

.table-max-height-700 {
  max-height: 700px !important;
  overflow-y: auto !important;
}

.table-max-height-750 {
  max-height: 750px !important;
  overflow-y: auto !important;
}

.table-max-height-800 {
  max-height: 800px !important;
  overflow-y: auto !important;
}

.col-width-auto {
  width: auto !important;
}
@media (max-width: 900px) {
  .col-width-auto {
    width: 150px !important;
    min-width: 150px !important;
  }
}

.col-width-1 {
  width: 1px !important;
  min-width: 1px !important;
}

.col-width-2 {
  width: 2px !important;
  min-width: 2px !important;
}

.col-width-3 {
  width: 3px !important;
  min-width: 3px !important;
}

.col-width-4 {
  width: 4px !important;
  min-width: 4px !important;
}

.col-width-5 {
  width: 5px !important;
  min-width: 5px !important;
}

.col-width-6 {
  width: 6px !important;
  min-width: 6px !important;
}

.col-width-7 {
  width: 7px !important;
  min-width: 7px !important;
}

.col-width-8 {
  width: 8px !important;
  min-width: 8px !important;
}

.col-width-9 {
  width: 9px !important;
  min-width: 9px !important;
}

.col-width-10 {
  width: 10px !important;
  min-width: 10px !important;
}

.col-width-11 {
  width: 11px !important;
  min-width: 11px !important;
}

.col-width-12 {
  width: 12px !important;
  min-width: 12px !important;
}

.col-width-13 {
  width: 13px !important;
  min-width: 13px !important;
}

.col-width-14 {
  width: 14px !important;
  min-width: 14px !important;
}

.col-width-15 {
  width: 15px !important;
  min-width: 15px !important;
}

.col-width-16 {
  width: 16px !important;
  min-width: 16px !important;
}

.col-width-17 {
  width: 17px !important;
  min-width: 17px !important;
}

.col-width-18 {
  width: 18px !important;
  min-width: 18px !important;
}

.col-width-19 {
  width: 19px !important;
  min-width: 19px !important;
}

.col-width-20 {
  width: 20px !important;
  min-width: 20px !important;
}

.col-width-21 {
  width: 21px !important;
  min-width: 21px !important;
}

.col-width-22 {
  width: 22px !important;
  min-width: 22px !important;
}

.col-width-23 {
  width: 23px !important;
  min-width: 23px !important;
}

.col-width-24 {
  width: 24px !important;
  min-width: 24px !important;
}

.col-width-25 {
  width: 25px !important;
  min-width: 25px !important;
}

.col-width-26 {
  width: 26px !important;
  min-width: 26px !important;
}

.col-width-27 {
  width: 27px !important;
  min-width: 27px !important;
}

.col-width-28 {
  width: 28px !important;
  min-width: 28px !important;
}

.col-width-29 {
  width: 29px !important;
  min-width: 29px !important;
}

.col-width-30 {
  width: 30px !important;
  min-width: 30px !important;
}

.col-width-31 {
  width: 31px !important;
  min-width: 31px !important;
}

.col-width-32 {
  width: 32px !important;
  min-width: 32px !important;
}

.col-width-33 {
  width: 33px !important;
  min-width: 33px !important;
}

.col-width-34 {
  width: 34px !important;
  min-width: 34px !important;
}

.col-width-35 {
  width: 35px !important;
  min-width: 35px !important;
}

.col-width-36 {
  width: 36px !important;
  min-width: 36px !important;
}

.col-width-37 {
  width: 37px !important;
  min-width: 37px !important;
}

.col-width-38 {
  width: 38px !important;
  min-width: 38px !important;
}

.col-width-39 {
  width: 39px !important;
  min-width: 39px !important;
}

.col-width-40 {
  width: 40px !important;
  min-width: 40px !important;
}

.col-width-41 {
  width: 41px !important;
  min-width: 41px !important;
}

.col-width-42 {
  width: 42px !important;
  min-width: 42px !important;
}

.col-width-43 {
  width: 43px !important;
  min-width: 43px !important;
}

.col-width-44 {
  width: 44px !important;
  min-width: 44px !important;
}

.col-width-45 {
  width: 45px !important;
  min-width: 45px !important;
}

.col-width-46 {
  width: 46px !important;
  min-width: 46px !important;
}

.col-width-47 {
  width: 47px !important;
  min-width: 47px !important;
}

.col-width-48 {
  width: 48px !important;
  min-width: 48px !important;
}

.col-width-49 {
  width: 49px !important;
  min-width: 49px !important;
}

.col-width-50 {
  width: 50px !important;
  min-width: 50px !important;
}

.col-width-51 {
  width: 51px !important;
  min-width: 51px !important;
}

.col-width-52 {
  width: 52px !important;
  min-width: 52px !important;
}

.col-width-53 {
  width: 53px !important;
  min-width: 53px !important;
}

.col-width-54 {
  width: 54px !important;
  min-width: 54px !important;
}

.col-width-55 {
  width: 55px !important;
  min-width: 55px !important;
}

.col-width-56 {
  width: 56px !important;
  min-width: 56px !important;
}

.col-width-57 {
  width: 57px !important;
  min-width: 57px !important;
}

.col-width-58 {
  width: 58px !important;
  min-width: 58px !important;
}

.col-width-59 {
  width: 59px !important;
  min-width: 59px !important;
}

.col-width-60 {
  width: 60px !important;
  min-width: 60px !important;
}

.col-width-61 {
  width: 61px !important;
  min-width: 61px !important;
}

.col-width-62 {
  width: 62px !important;
  min-width: 62px !important;
}

.col-width-63 {
  width: 63px !important;
  min-width: 63px !important;
}

.col-width-64 {
  width: 64px !important;
  min-width: 64px !important;
}

.col-width-65 {
  width: 65px !important;
  min-width: 65px !important;
}

.col-width-66 {
  width: 66px !important;
  min-width: 66px !important;
}

.col-width-67 {
  width: 67px !important;
  min-width: 67px !important;
}

.col-width-68 {
  width: 68px !important;
  min-width: 68px !important;
}

.col-width-69 {
  width: 69px !important;
  min-width: 69px !important;
}

.col-width-70 {
  width: 70px !important;
  min-width: 70px !important;
}

.col-width-71 {
  width: 71px !important;
  min-width: 71px !important;
}

.col-width-72 {
  width: 72px !important;
  min-width: 72px !important;
}

.col-width-73 {
  width: 73px !important;
  min-width: 73px !important;
}

.col-width-74 {
  width: 74px !important;
  min-width: 74px !important;
}

.col-width-75 {
  width: 75px !important;
  min-width: 75px !important;
}

.col-width-76 {
  width: 76px !important;
  min-width: 76px !important;
}

.col-width-77 {
  width: 77px !important;
  min-width: 77px !important;
}

.col-width-78 {
  width: 78px !important;
  min-width: 78px !important;
}

.col-width-79 {
  width: 79px !important;
  min-width: 79px !important;
}

.col-width-80 {
  width: 80px !important;
  min-width: 80px !important;
}

.col-width-81 {
  width: 81px !important;
  min-width: 81px !important;
}

.col-width-82 {
  width: 82px !important;
  min-width: 82px !important;
}

.col-width-83 {
  width: 83px !important;
  min-width: 83px !important;
}

.col-width-84 {
  width: 84px !important;
  min-width: 84px !important;
}

.col-width-85 {
  width: 85px !important;
  min-width: 85px !important;
}

.col-width-86 {
  width: 86px !important;
  min-width: 86px !important;
}

.col-width-87 {
  width: 87px !important;
  min-width: 87px !important;
}

.col-width-88 {
  width: 88px !important;
  min-width: 88px !important;
}

.col-width-89 {
  width: 89px !important;
  min-width: 89px !important;
}

.col-width-90 {
  width: 90px !important;
  min-width: 90px !important;
}

.col-width-91 {
  width: 91px !important;
  min-width: 91px !important;
}

.col-width-92 {
  width: 92px !important;
  min-width: 92px !important;
}

.col-width-93 {
  width: 93px !important;
  min-width: 93px !important;
}

.col-width-94 {
  width: 94px !important;
  min-width: 94px !important;
}

.col-width-95 {
  width: 95px !important;
  min-width: 95px !important;
}

.col-width-96 {
  width: 96px !important;
  min-width: 96px !important;
}

.col-width-97 {
  width: 97px !important;
  min-width: 97px !important;
}

.col-width-98 {
  width: 98px !important;
  min-width: 98px !important;
}

.col-width-99 {
  width: 99px !important;
  min-width: 99px !important;
}

.col-width-100 {
  width: 100px !important;
  min-width: 100px !important;
}

.col-width-101 {
  width: 101px !important;
  min-width: 101px !important;
}

.col-width-102 {
  width: 102px !important;
  min-width: 102px !important;
}

.col-width-103 {
  width: 103px !important;
  min-width: 103px !important;
}

.col-width-104 {
  width: 104px !important;
  min-width: 104px !important;
}

.col-width-105 {
  width: 105px !important;
  min-width: 105px !important;
}

.col-width-106 {
  width: 106px !important;
  min-width: 106px !important;
}

.col-width-107 {
  width: 107px !important;
  min-width: 107px !important;
}

.col-width-108 {
  width: 108px !important;
  min-width: 108px !important;
}

.col-width-109 {
  width: 109px !important;
  min-width: 109px !important;
}

.col-width-110 {
  width: 110px !important;
  min-width: 110px !important;
}

.col-width-111 {
  width: 111px !important;
  min-width: 111px !important;
}

.col-width-112 {
  width: 112px !important;
  min-width: 112px !important;
}

.col-width-113 {
  width: 113px !important;
  min-width: 113px !important;
}

.col-width-114 {
  width: 114px !important;
  min-width: 114px !important;
}

.col-width-115 {
  width: 115px !important;
  min-width: 115px !important;
}

.col-width-116 {
  width: 116px !important;
  min-width: 116px !important;
}

.col-width-117 {
  width: 117px !important;
  min-width: 117px !important;
}

.col-width-118 {
  width: 118px !important;
  min-width: 118px !important;
}

.col-width-119 {
  width: 119px !important;
  min-width: 119px !important;
}

.col-width-120 {
  width: 120px !important;
  min-width: 120px !important;
}

.col-width-121 {
  width: 121px !important;
  min-width: 121px !important;
}

.col-width-122 {
  width: 122px !important;
  min-width: 122px !important;
}

.col-width-123 {
  width: 123px !important;
  min-width: 123px !important;
}

.col-width-124 {
  width: 124px !important;
  min-width: 124px !important;
}

.col-width-125 {
  width: 125px !important;
  min-width: 125px !important;
}

.col-width-126 {
  width: 126px !important;
  min-width: 126px !important;
}

.col-width-127 {
  width: 127px !important;
  min-width: 127px !important;
}

.col-width-128 {
  width: 128px !important;
  min-width: 128px !important;
}

.col-width-129 {
  width: 129px !important;
  min-width: 129px !important;
}

.col-width-130 {
  width: 130px !important;
  min-width: 130px !important;
}

.col-width-131 {
  width: 131px !important;
  min-width: 131px !important;
}

.col-width-132 {
  width: 132px !important;
  min-width: 132px !important;
}

.col-width-133 {
  width: 133px !important;
  min-width: 133px !important;
}

.col-width-134 {
  width: 134px !important;
  min-width: 134px !important;
}

.col-width-135 {
  width: 135px !important;
  min-width: 135px !important;
}

.col-width-136 {
  width: 136px !important;
  min-width: 136px !important;
}

.col-width-137 {
  width: 137px !important;
  min-width: 137px !important;
}

.col-width-138 {
  width: 138px !important;
  min-width: 138px !important;
}

.col-width-139 {
  width: 139px !important;
  min-width: 139px !important;
}

.col-width-140 {
  width: 140px !important;
  min-width: 140px !important;
}

.col-width-141 {
  width: 141px !important;
  min-width: 141px !important;
}

.col-width-142 {
  width: 142px !important;
  min-width: 142px !important;
}

.col-width-143 {
  width: 143px !important;
  min-width: 143px !important;
}

.col-width-144 {
  width: 144px !important;
  min-width: 144px !important;
}

.col-width-145 {
  width: 145px !important;
  min-width: 145px !important;
}

.col-width-146 {
  width: 146px !important;
  min-width: 146px !important;
}

.col-width-147 {
  width: 147px !important;
  min-width: 147px !important;
}

.col-width-148 {
  width: 148px !important;
  min-width: 148px !important;
}

.col-width-149 {
  width: 149px !important;
  min-width: 149px !important;
}

.col-width-150 {
  width: 150px !important;
  min-width: 150px !important;
}

.col-width-151 {
  width: 151px !important;
  min-width: 151px !important;
}

.col-width-152 {
  width: 152px !important;
  min-width: 152px !important;
}

.col-width-153 {
  width: 153px !important;
  min-width: 153px !important;
}

.col-width-154 {
  width: 154px !important;
  min-width: 154px !important;
}

.col-width-155 {
  width: 155px !important;
  min-width: 155px !important;
}

.col-width-156 {
  width: 156px !important;
  min-width: 156px !important;
}

.col-width-157 {
  width: 157px !important;
  min-width: 157px !important;
}

.col-width-158 {
  width: 158px !important;
  min-width: 158px !important;
}

.col-width-159 {
  width: 159px !important;
  min-width: 159px !important;
}

.col-width-160 {
  width: 160px !important;
  min-width: 160px !important;
}

.col-width-161 {
  width: 161px !important;
  min-width: 161px !important;
}

.col-width-162 {
  width: 162px !important;
  min-width: 162px !important;
}

.col-width-163 {
  width: 163px !important;
  min-width: 163px !important;
}

.col-width-164 {
  width: 164px !important;
  min-width: 164px !important;
}

.col-width-165 {
  width: 165px !important;
  min-width: 165px !important;
}

.col-width-166 {
  width: 166px !important;
  min-width: 166px !important;
}

.col-width-167 {
  width: 167px !important;
  min-width: 167px !important;
}

.col-width-168 {
  width: 168px !important;
  min-width: 168px !important;
}

.col-width-169 {
  width: 169px !important;
  min-width: 169px !important;
}

.col-width-170 {
  width: 170px !important;
  min-width: 170px !important;
}

.col-width-171 {
  width: 171px !important;
  min-width: 171px !important;
}

.col-width-172 {
  width: 172px !important;
  min-width: 172px !important;
}

.col-width-173 {
  width: 173px !important;
  min-width: 173px !important;
}

.col-width-174 {
  width: 174px !important;
  min-width: 174px !important;
}

.col-width-175 {
  width: 175px !important;
  min-width: 175px !important;
}

.col-width-176 {
  width: 176px !important;
  min-width: 176px !important;
}

.col-width-177 {
  width: 177px !important;
  min-width: 177px !important;
}

.col-width-178 {
  width: 178px !important;
  min-width: 178px !important;
}

.col-width-179 {
  width: 179px !important;
  min-width: 179px !important;
}

.col-width-180 {
  width: 180px !important;
  min-width: 180px !important;
}

.col-width-181 {
  width: 181px !important;
  min-width: 181px !important;
}

.col-width-182 {
  width: 182px !important;
  min-width: 182px !important;
}

.col-width-183 {
  width: 183px !important;
  min-width: 183px !important;
}

.col-width-184 {
  width: 184px !important;
  min-width: 184px !important;
}

.col-width-185 {
  width: 185px !important;
  min-width: 185px !important;
}

.col-width-186 {
  width: 186px !important;
  min-width: 186px !important;
}

.col-width-187 {
  width: 187px !important;
  min-width: 187px !important;
}

.col-width-188 {
  width: 188px !important;
  min-width: 188px !important;
}

.col-width-189 {
  width: 189px !important;
  min-width: 189px !important;
}

.col-width-190 {
  width: 190px !important;
  min-width: 190px !important;
}

.col-width-191 {
  width: 191px !important;
  min-width: 191px !important;
}

.col-width-192 {
  width: 192px !important;
  min-width: 192px !important;
}

.col-width-193 {
  width: 193px !important;
  min-width: 193px !important;
}

.col-width-194 {
  width: 194px !important;
  min-width: 194px !important;
}

.col-width-195 {
  width: 195px !important;
  min-width: 195px !important;
}

.col-width-196 {
  width: 196px !important;
  min-width: 196px !important;
}

.col-width-197 {
  width: 197px !important;
  min-width: 197px !important;
}

.col-width-198 {
  width: 198px !important;
  min-width: 198px !important;
}

.col-width-199 {
  width: 199px !important;
  min-width: 199px !important;
}

.col-width-200 {
  width: 200px !important;
  min-width: 200px !important;
}

.col-width-201 {
  width: 201px !important;
  min-width: 201px !important;
}

.col-width-202 {
  width: 202px !important;
  min-width: 202px !important;
}

.col-width-203 {
  width: 203px !important;
  min-width: 203px !important;
}

.col-width-204 {
  width: 204px !important;
  min-width: 204px !important;
}

.col-width-205 {
  width: 205px !important;
  min-width: 205px !important;
}

.col-width-206 {
  width: 206px !important;
  min-width: 206px !important;
}

.col-width-207 {
  width: 207px !important;
  min-width: 207px !important;
}

.col-width-208 {
  width: 208px !important;
  min-width: 208px !important;
}

.col-width-209 {
  width: 209px !important;
  min-width: 209px !important;
}

.col-width-210 {
  width: 210px !important;
  min-width: 210px !important;
}

.col-width-211 {
  width: 211px !important;
  min-width: 211px !important;
}

.col-width-212 {
  width: 212px !important;
  min-width: 212px !important;
}

.col-width-213 {
  width: 213px !important;
  min-width: 213px !important;
}

.col-width-214 {
  width: 214px !important;
  min-width: 214px !important;
}

.col-width-215 {
  width: 215px !important;
  min-width: 215px !important;
}

.col-width-216 {
  width: 216px !important;
  min-width: 216px !important;
}

.col-width-217 {
  width: 217px !important;
  min-width: 217px !important;
}

.col-width-218 {
  width: 218px !important;
  min-width: 218px !important;
}

.col-width-219 {
  width: 219px !important;
  min-width: 219px !important;
}

.col-width-220 {
  width: 220px !important;
  min-width: 220px !important;
}

.col-width-221 {
  width: 221px !important;
  min-width: 221px !important;
}

.col-width-222 {
  width: 222px !important;
  min-width: 222px !important;
}

.col-width-223 {
  width: 223px !important;
  min-width: 223px !important;
}

.col-width-224 {
  width: 224px !important;
  min-width: 224px !important;
}

.col-width-225 {
  width: 225px !important;
  min-width: 225px !important;
}

.col-width-226 {
  width: 226px !important;
  min-width: 226px !important;
}

.col-width-227 {
  width: 227px !important;
  min-width: 227px !important;
}

.col-width-228 {
  width: 228px !important;
  min-width: 228px !important;
}

.col-width-229 {
  width: 229px !important;
  min-width: 229px !important;
}

.col-width-230 {
  width: 230px !important;
  min-width: 230px !important;
}

.col-width-231 {
  width: 231px !important;
  min-width: 231px !important;
}

.col-width-232 {
  width: 232px !important;
  min-width: 232px !important;
}

.col-width-233 {
  width: 233px !important;
  min-width: 233px !important;
}

.col-width-234 {
  width: 234px !important;
  min-width: 234px !important;
}

.col-width-235 {
  width: 235px !important;
  min-width: 235px !important;
}

.col-width-236 {
  width: 236px !important;
  min-width: 236px !important;
}

.col-width-237 {
  width: 237px !important;
  min-width: 237px !important;
}

.col-width-238 {
  width: 238px !important;
  min-width: 238px !important;
}

.col-width-239 {
  width: 239px !important;
  min-width: 239px !important;
}

.col-width-240 {
  width: 240px !important;
  min-width: 240px !important;
}

.col-width-241 {
  width: 241px !important;
  min-width: 241px !important;
}

.col-width-242 {
  width: 242px !important;
  min-width: 242px !important;
}

.col-width-243 {
  width: 243px !important;
  min-width: 243px !important;
}

.col-width-244 {
  width: 244px !important;
  min-width: 244px !important;
}

.col-width-245 {
  width: 245px !important;
  min-width: 245px !important;
}

.col-width-246 {
  width: 246px !important;
  min-width: 246px !important;
}

.col-width-247 {
  width: 247px !important;
  min-width: 247px !important;
}

.col-width-248 {
  width: 248px !important;
  min-width: 248px !important;
}

.col-width-249 {
  width: 249px !important;
  min-width: 249px !important;
}

.col-width-250 {
  width: 250px !important;
  min-width: 250px !important;
}

.col-width-251 {
  width: 251px !important;
  min-width: 251px !important;
}

.col-width-252 {
  width: 252px !important;
  min-width: 252px !important;
}

.col-width-253 {
  width: 253px !important;
  min-width: 253px !important;
}

.col-width-254 {
  width: 254px !important;
  min-width: 254px !important;
}

.col-width-255 {
  width: 255px !important;
  min-width: 255px !important;
}

.col-width-256 {
  width: 256px !important;
  min-width: 256px !important;
}

.col-width-257 {
  width: 257px !important;
  min-width: 257px !important;
}

.col-width-258 {
  width: 258px !important;
  min-width: 258px !important;
}

.col-width-259 {
  width: 259px !important;
  min-width: 259px !important;
}

.col-width-260 {
  width: 260px !important;
  min-width: 260px !important;
}

.col-width-261 {
  width: 261px !important;
  min-width: 261px !important;
}

.col-width-262 {
  width: 262px !important;
  min-width: 262px !important;
}

.col-width-263 {
  width: 263px !important;
  min-width: 263px !important;
}

.col-width-264 {
  width: 264px !important;
  min-width: 264px !important;
}

.col-width-265 {
  width: 265px !important;
  min-width: 265px !important;
}

.col-width-266 {
  width: 266px !important;
  min-width: 266px !important;
}

.col-width-267 {
  width: 267px !important;
  min-width: 267px !important;
}

.col-width-268 {
  width: 268px !important;
  min-width: 268px !important;
}

.col-width-269 {
  width: 269px !important;
  min-width: 269px !important;
}

.col-width-270 {
  width: 270px !important;
  min-width: 270px !important;
}

.col-width-271 {
  width: 271px !important;
  min-width: 271px !important;
}

.col-width-272 {
  width: 272px !important;
  min-width: 272px !important;
}

.col-width-273 {
  width: 273px !important;
  min-width: 273px !important;
}

.col-width-274 {
  width: 274px !important;
  min-width: 274px !important;
}

.col-width-275 {
  width: 275px !important;
  min-width: 275px !important;
}

.col-width-276 {
  width: 276px !important;
  min-width: 276px !important;
}

.col-width-277 {
  width: 277px !important;
  min-width: 277px !important;
}

.col-width-278 {
  width: 278px !important;
  min-width: 278px !important;
}

.col-width-279 {
  width: 279px !important;
  min-width: 279px !important;
}

.col-width-280 {
  width: 280px !important;
  min-width: 280px !important;
}

.col-width-281 {
  width: 281px !important;
  min-width: 281px !important;
}

.col-width-282 {
  width: 282px !important;
  min-width: 282px !important;
}

.col-width-283 {
  width: 283px !important;
  min-width: 283px !important;
}

.col-width-284 {
  width: 284px !important;
  min-width: 284px !important;
}

.col-width-285 {
  width: 285px !important;
  min-width: 285px !important;
}

.col-width-286 {
  width: 286px !important;
  min-width: 286px !important;
}

.col-width-287 {
  width: 287px !important;
  min-width: 287px !important;
}

.col-width-288 {
  width: 288px !important;
  min-width: 288px !important;
}

.col-width-289 {
  width: 289px !important;
  min-width: 289px !important;
}

.col-width-290 {
  width: 290px !important;
  min-width: 290px !important;
}

.col-width-291 {
  width: 291px !important;
  min-width: 291px !important;
}

.col-width-292 {
  width: 292px !important;
  min-width: 292px !important;
}

.col-width-293 {
  width: 293px !important;
  min-width: 293px !important;
}

.col-width-294 {
  width: 294px !important;
  min-width: 294px !important;
}

.col-width-295 {
  width: 295px !important;
  min-width: 295px !important;
}

.col-width-296 {
  width: 296px !important;
  min-width: 296px !important;
}

.col-width-297 {
  width: 297px !important;
  min-width: 297px !important;
}

.col-width-298 {
  width: 298px !important;
  min-width: 298px !important;
}

.col-width-299 {
  width: 299px !important;
  min-width: 299px !important;
}

.col-width-300 {
  width: 300px !important;
  min-width: 300px !important;
}

.col-width-301 {
  width: 301px !important;
  min-width: 301px !important;
}

.col-width-302 {
  width: 302px !important;
  min-width: 302px !important;
}

.col-width-303 {
  width: 303px !important;
  min-width: 303px !important;
}

.col-width-304 {
  width: 304px !important;
  min-width: 304px !important;
}

.col-width-305 {
  width: 305px !important;
  min-width: 305px !important;
}

.col-width-306 {
  width: 306px !important;
  min-width: 306px !important;
}

.col-width-307 {
  width: 307px !important;
  min-width: 307px !important;
}

.col-width-308 {
  width: 308px !important;
  min-width: 308px !important;
}

.col-width-309 {
  width: 309px !important;
  min-width: 309px !important;
}

.col-width-310 {
  width: 310px !important;
  min-width: 310px !important;
}

.col-width-311 {
  width: 311px !important;
  min-width: 311px !important;
}

.col-width-312 {
  width: 312px !important;
  min-width: 312px !important;
}

.col-width-313 {
  width: 313px !important;
  min-width: 313px !important;
}

.col-width-314 {
  width: 314px !important;
  min-width: 314px !important;
}

.col-width-315 {
  width: 315px !important;
  min-width: 315px !important;
}

.col-width-316 {
  width: 316px !important;
  min-width: 316px !important;
}

.col-width-317 {
  width: 317px !important;
  min-width: 317px !important;
}

.col-width-318 {
  width: 318px !important;
  min-width: 318px !important;
}

.col-width-319 {
  width: 319px !important;
  min-width: 319px !important;
}

.col-width-320 {
  width: 320px !important;
  min-width: 320px !important;
}

.col-width-321 {
  width: 321px !important;
  min-width: 321px !important;
}

.col-width-322 {
  width: 322px !important;
  min-width: 322px !important;
}

.col-width-323 {
  width: 323px !important;
  min-width: 323px !important;
}

.col-width-324 {
  width: 324px !important;
  min-width: 324px !important;
}

.col-width-325 {
  width: 325px !important;
  min-width: 325px !important;
}

.col-width-326 {
  width: 326px !important;
  min-width: 326px !important;
}

.col-width-327 {
  width: 327px !important;
  min-width: 327px !important;
}

.col-width-328 {
  width: 328px !important;
  min-width: 328px !important;
}

.col-width-329 {
  width: 329px !important;
  min-width: 329px !important;
}

.col-width-330 {
  width: 330px !important;
  min-width: 330px !important;
}

.col-width-331 {
  width: 331px !important;
  min-width: 331px !important;
}

.col-width-332 {
  width: 332px !important;
  min-width: 332px !important;
}

.col-width-333 {
  width: 333px !important;
  min-width: 333px !important;
}

.col-width-334 {
  width: 334px !important;
  min-width: 334px !important;
}

.col-width-335 {
  width: 335px !important;
  min-width: 335px !important;
}

.col-width-336 {
  width: 336px !important;
  min-width: 336px !important;
}

.col-width-337 {
  width: 337px !important;
  min-width: 337px !important;
}

.col-width-338 {
  width: 338px !important;
  min-width: 338px !important;
}

.col-width-339 {
  width: 339px !important;
  min-width: 339px !important;
}

.col-width-340 {
  width: 340px !important;
  min-width: 340px !important;
}

.col-width-341 {
  width: 341px !important;
  min-width: 341px !important;
}

.col-width-342 {
  width: 342px !important;
  min-width: 342px !important;
}

.col-width-343 {
  width: 343px !important;
  min-width: 343px !important;
}

.col-width-344 {
  width: 344px !important;
  min-width: 344px !important;
}

.col-width-345 {
  width: 345px !important;
  min-width: 345px !important;
}

.col-width-346 {
  width: 346px !important;
  min-width: 346px !important;
}

.col-width-347 {
  width: 347px !important;
  min-width: 347px !important;
}

.col-width-348 {
  width: 348px !important;
  min-width: 348px !important;
}

.col-width-349 {
  width: 349px !important;
  min-width: 349px !important;
}

.col-width-350 {
  width: 350px !important;
  min-width: 350px !important;
}

.col-width-351 {
  width: 351px !important;
  min-width: 351px !important;
}

.col-width-352 {
  width: 352px !important;
  min-width: 352px !important;
}

.col-width-353 {
  width: 353px !important;
  min-width: 353px !important;
}

.col-width-354 {
  width: 354px !important;
  min-width: 354px !important;
}

.col-width-355 {
  width: 355px !important;
  min-width: 355px !important;
}

.col-width-356 {
  width: 356px !important;
  min-width: 356px !important;
}

.col-width-357 {
  width: 357px !important;
  min-width: 357px !important;
}

.col-width-358 {
  width: 358px !important;
  min-width: 358px !important;
}

.col-width-359 {
  width: 359px !important;
  min-width: 359px !important;
}

.col-width-360 {
  width: 360px !important;
  min-width: 360px !important;
}

.col-width-361 {
  width: 361px !important;
  min-width: 361px !important;
}

.col-width-362 {
  width: 362px !important;
  min-width: 362px !important;
}

.col-width-363 {
  width: 363px !important;
  min-width: 363px !important;
}

.col-width-364 {
  width: 364px !important;
  min-width: 364px !important;
}

.col-width-365 {
  width: 365px !important;
  min-width: 365px !important;
}

.col-width-366 {
  width: 366px !important;
  min-width: 366px !important;
}

.col-width-367 {
  width: 367px !important;
  min-width: 367px !important;
}

.col-width-368 {
  width: 368px !important;
  min-width: 368px !important;
}

.col-width-369 {
  width: 369px !important;
  min-width: 369px !important;
}

.col-width-370 {
  width: 370px !important;
  min-width: 370px !important;
}

.col-width-371 {
  width: 371px !important;
  min-width: 371px !important;
}

.col-width-372 {
  width: 372px !important;
  min-width: 372px !important;
}

.col-width-373 {
  width: 373px !important;
  min-width: 373px !important;
}

.col-width-374 {
  width: 374px !important;
  min-width: 374px !important;
}

.col-width-375 {
  width: 375px !important;
  min-width: 375px !important;
}

.col-width-376 {
  width: 376px !important;
  min-width: 376px !important;
}

.col-width-377 {
  width: 377px !important;
  min-width: 377px !important;
}

.col-width-378 {
  width: 378px !important;
  min-width: 378px !important;
}

.col-width-379 {
  width: 379px !important;
  min-width: 379px !important;
}

.col-width-380 {
  width: 380px !important;
  min-width: 380px !important;
}

.col-width-381 {
  width: 381px !important;
  min-width: 381px !important;
}

.col-width-382 {
  width: 382px !important;
  min-width: 382px !important;
}

.col-width-383 {
  width: 383px !important;
  min-width: 383px !important;
}

.col-width-384 {
  width: 384px !important;
  min-width: 384px !important;
}

.col-width-385 {
  width: 385px !important;
  min-width: 385px !important;
}

.col-width-386 {
  width: 386px !important;
  min-width: 386px !important;
}

.col-width-387 {
  width: 387px !important;
  min-width: 387px !important;
}

.col-width-388 {
  width: 388px !important;
  min-width: 388px !important;
}

.col-width-389 {
  width: 389px !important;
  min-width: 389px !important;
}

.col-width-390 {
  width: 390px !important;
  min-width: 390px !important;
}

.col-width-391 {
  width: 391px !important;
  min-width: 391px !important;
}

.col-width-392 {
  width: 392px !important;
  min-width: 392px !important;
}

.col-width-393 {
  width: 393px !important;
  min-width: 393px !important;
}

.col-width-394 {
  width: 394px !important;
  min-width: 394px !important;
}

.col-width-395 {
  width: 395px !important;
  min-width: 395px !important;
}

.col-width-396 {
  width: 396px !important;
  min-width: 396px !important;
}

.col-width-397 {
  width: 397px !important;
  min-width: 397px !important;
}

.col-width-398 {
  width: 398px !important;
  min-width: 398px !important;
}

.col-width-399 {
  width: 399px !important;
  min-width: 399px !important;
}

.col-width-400 {
  width: 400px !important;
  min-width: 400px !important;
}

.col-width-401 {
  width: 401px !important;
  min-width: 401px !important;
}

.col-width-402 {
  width: 402px !important;
  min-width: 402px !important;
}

.col-width-403 {
  width: 403px !important;
  min-width: 403px !important;
}

.col-width-404 {
  width: 404px !important;
  min-width: 404px !important;
}

.col-width-405 {
  width: 405px !important;
  min-width: 405px !important;
}

.col-width-406 {
  width: 406px !important;
  min-width: 406px !important;
}

.col-width-407 {
  width: 407px !important;
  min-width: 407px !important;
}

.col-width-408 {
  width: 408px !important;
  min-width: 408px !important;
}

.col-width-409 {
  width: 409px !important;
  min-width: 409px !important;
}

.col-width-410 {
  width: 410px !important;
  min-width: 410px !important;
}

.col-width-411 {
  width: 411px !important;
  min-width: 411px !important;
}

.col-width-412 {
  width: 412px !important;
  min-width: 412px !important;
}

.col-width-413 {
  width: 413px !important;
  min-width: 413px !important;
}

.col-width-414 {
  width: 414px !important;
  min-width: 414px !important;
}

.col-width-415 {
  width: 415px !important;
  min-width: 415px !important;
}

.col-width-416 {
  width: 416px !important;
  min-width: 416px !important;
}

.col-width-417 {
  width: 417px !important;
  min-width: 417px !important;
}

.col-width-418 {
  width: 418px !important;
  min-width: 418px !important;
}

.col-width-419 {
  width: 419px !important;
  min-width: 419px !important;
}

.col-width-420 {
  width: 420px !important;
  min-width: 420px !important;
}

.col-width-421 {
  width: 421px !important;
  min-width: 421px !important;
}

.col-width-422 {
  width: 422px !important;
  min-width: 422px !important;
}

.col-width-423 {
  width: 423px !important;
  min-width: 423px !important;
}

.col-width-424 {
  width: 424px !important;
  min-width: 424px !important;
}

.col-width-425 {
  width: 425px !important;
  min-width: 425px !important;
}

.col-width-426 {
  width: 426px !important;
  min-width: 426px !important;
}

.col-width-427 {
  width: 427px !important;
  min-width: 427px !important;
}

.col-width-428 {
  width: 428px !important;
  min-width: 428px !important;
}

.col-width-429 {
  width: 429px !important;
  min-width: 429px !important;
}

.col-width-430 {
  width: 430px !important;
  min-width: 430px !important;
}

.col-width-431 {
  width: 431px !important;
  min-width: 431px !important;
}

.col-width-432 {
  width: 432px !important;
  min-width: 432px !important;
}

.col-width-433 {
  width: 433px !important;
  min-width: 433px !important;
}

.col-width-434 {
  width: 434px !important;
  min-width: 434px !important;
}

.col-width-435 {
  width: 435px !important;
  min-width: 435px !important;
}

.col-width-436 {
  width: 436px !important;
  min-width: 436px !important;
}

.col-width-437 {
  width: 437px !important;
  min-width: 437px !important;
}

.col-width-438 {
  width: 438px !important;
  min-width: 438px !important;
}

.col-width-439 {
  width: 439px !important;
  min-width: 439px !important;
}

.col-width-440 {
  width: 440px !important;
  min-width: 440px !important;
}

.col-width-441 {
  width: 441px !important;
  min-width: 441px !important;
}

.col-width-442 {
  width: 442px !important;
  min-width: 442px !important;
}

.col-width-443 {
  width: 443px !important;
  min-width: 443px !important;
}

.col-width-444 {
  width: 444px !important;
  min-width: 444px !important;
}

.col-width-445 {
  width: 445px !important;
  min-width: 445px !important;
}

.col-width-446 {
  width: 446px !important;
  min-width: 446px !important;
}

.col-width-447 {
  width: 447px !important;
  min-width: 447px !important;
}

.col-width-448 {
  width: 448px !important;
  min-width: 448px !important;
}

.col-width-449 {
  width: 449px !important;
  min-width: 449px !important;
}

.col-width-450 {
  width: 450px !important;
  min-width: 450px !important;
}

.col-width-451 {
  width: 451px !important;
  min-width: 451px !important;
}

.col-width-452 {
  width: 452px !important;
  min-width: 452px !important;
}

.col-width-453 {
  width: 453px !important;
  min-width: 453px !important;
}

.col-width-454 {
  width: 454px !important;
  min-width: 454px !important;
}

.col-width-455 {
  width: 455px !important;
  min-width: 455px !important;
}

.col-width-456 {
  width: 456px !important;
  min-width: 456px !important;
}

.col-width-457 {
  width: 457px !important;
  min-width: 457px !important;
}

.col-width-458 {
  width: 458px !important;
  min-width: 458px !important;
}

.col-width-459 {
  width: 459px !important;
  min-width: 459px !important;
}

.col-width-460 {
  width: 460px !important;
  min-width: 460px !important;
}

.col-width-461 {
  width: 461px !important;
  min-width: 461px !important;
}

.col-width-462 {
  width: 462px !important;
  min-width: 462px !important;
}

.col-width-463 {
  width: 463px !important;
  min-width: 463px !important;
}

.col-width-464 {
  width: 464px !important;
  min-width: 464px !important;
}

.col-width-465 {
  width: 465px !important;
  min-width: 465px !important;
}

.col-width-466 {
  width: 466px !important;
  min-width: 466px !important;
}

.col-width-467 {
  width: 467px !important;
  min-width: 467px !important;
}

.col-width-468 {
  width: 468px !important;
  min-width: 468px !important;
}

.col-width-469 {
  width: 469px !important;
  min-width: 469px !important;
}

.col-width-470 {
  width: 470px !important;
  min-width: 470px !important;
}

.col-width-471 {
  width: 471px !important;
  min-width: 471px !important;
}

.col-width-472 {
  width: 472px !important;
  min-width: 472px !important;
}

.col-width-473 {
  width: 473px !important;
  min-width: 473px !important;
}

.col-width-474 {
  width: 474px !important;
  min-width: 474px !important;
}

.col-width-475 {
  width: 475px !important;
  min-width: 475px !important;
}

.col-width-476 {
  width: 476px !important;
  min-width: 476px !important;
}

.col-width-477 {
  width: 477px !important;
  min-width: 477px !important;
}

.col-width-478 {
  width: 478px !important;
  min-width: 478px !important;
}

.col-width-479 {
  width: 479px !important;
  min-width: 479px !important;
}

.col-width-480 {
  width: 480px !important;
  min-width: 480px !important;
}

.col-width-481 {
  width: 481px !important;
  min-width: 481px !important;
}

.col-width-482 {
  width: 482px !important;
  min-width: 482px !important;
}

.col-width-483 {
  width: 483px !important;
  min-width: 483px !important;
}

.col-width-484 {
  width: 484px !important;
  min-width: 484px !important;
}

.col-width-485 {
  width: 485px !important;
  min-width: 485px !important;
}

.col-width-486 {
  width: 486px !important;
  min-width: 486px !important;
}

.col-width-487 {
  width: 487px !important;
  min-width: 487px !important;
}

.col-width-488 {
  width: 488px !important;
  min-width: 488px !important;
}

.col-width-489 {
  width: 489px !important;
  min-width: 489px !important;
}

.col-width-490 {
  width: 490px !important;
  min-width: 490px !important;
}

.col-width-491 {
  width: 491px !important;
  min-width: 491px !important;
}

.col-width-492 {
  width: 492px !important;
  min-width: 492px !important;
}

.col-width-493 {
  width: 493px !important;
  min-width: 493px !important;
}

.col-width-494 {
  width: 494px !important;
  min-width: 494px !important;
}

.col-width-495 {
  width: 495px !important;
  min-width: 495px !important;
}

.col-width-496 {
  width: 496px !important;
  min-width: 496px !important;
}

.col-width-497 {
  width: 497px !important;
  min-width: 497px !important;
}

.col-width-498 {
  width: 498px !important;
  min-width: 498px !important;
}

.col-width-499 {
  width: 499px !important;
  min-width: 499px !important;
}

.col-width-500 {
  width: 500px !important;
  min-width: 500px !important;
}

.col-width-501 {
  width: 501px !important;
  min-width: 501px !important;
}

.col-width-502 {
  width: 502px !important;
  min-width: 502px !important;
}

.col-width-503 {
  width: 503px !important;
  min-width: 503px !important;
}

.col-width-504 {
  width: 504px !important;
  min-width: 504px !important;
}

.col-width-505 {
  width: 505px !important;
  min-width: 505px !important;
}

.col-width-506 {
  width: 506px !important;
  min-width: 506px !important;
}

.col-width-507 {
  width: 507px !important;
  min-width: 507px !important;
}

.col-width-508 {
  width: 508px !important;
  min-width: 508px !important;
}

.col-width-509 {
  width: 509px !important;
  min-width: 509px !important;
}

.col-width-510 {
  width: 510px !important;
  min-width: 510px !important;
}

.col-width-511 {
  width: 511px !important;
  min-width: 511px !important;
}

.col-width-512 {
  width: 512px !important;
  min-width: 512px !important;
}

.col-width-513 {
  width: 513px !important;
  min-width: 513px !important;
}

.col-width-514 {
  width: 514px !important;
  min-width: 514px !important;
}

.col-width-515 {
  width: 515px !important;
  min-width: 515px !important;
}

.col-width-516 {
  width: 516px !important;
  min-width: 516px !important;
}

.col-width-517 {
  width: 517px !important;
  min-width: 517px !important;
}

.col-width-518 {
  width: 518px !important;
  min-width: 518px !important;
}

.col-width-519 {
  width: 519px !important;
  min-width: 519px !important;
}

.col-width-520 {
  width: 520px !important;
  min-width: 520px !important;
}

.col-width-521 {
  width: 521px !important;
  min-width: 521px !important;
}

.col-width-522 {
  width: 522px !important;
  min-width: 522px !important;
}

.col-width-523 {
  width: 523px !important;
  min-width: 523px !important;
}

.col-width-524 {
  width: 524px !important;
  min-width: 524px !important;
}

.col-width-525 {
  width: 525px !important;
  min-width: 525px !important;
}

.col-width-526 {
  width: 526px !important;
  min-width: 526px !important;
}

.col-width-527 {
  width: 527px !important;
  min-width: 527px !important;
}

.col-width-528 {
  width: 528px !important;
  min-width: 528px !important;
}

.col-width-529 {
  width: 529px !important;
  min-width: 529px !important;
}

.col-width-530 {
  width: 530px !important;
  min-width: 530px !important;
}

.col-width-531 {
  width: 531px !important;
  min-width: 531px !important;
}

.col-width-532 {
  width: 532px !important;
  min-width: 532px !important;
}

.col-width-533 {
  width: 533px !important;
  min-width: 533px !important;
}

.col-width-534 {
  width: 534px !important;
  min-width: 534px !important;
}

.col-width-535 {
  width: 535px !important;
  min-width: 535px !important;
}

.col-width-536 {
  width: 536px !important;
  min-width: 536px !important;
}

.col-width-537 {
  width: 537px !important;
  min-width: 537px !important;
}

.col-width-538 {
  width: 538px !important;
  min-width: 538px !important;
}

.col-width-539 {
  width: 539px !important;
  min-width: 539px !important;
}

.col-width-540 {
  width: 540px !important;
  min-width: 540px !important;
}

.col-width-541 {
  width: 541px !important;
  min-width: 541px !important;
}

.col-width-542 {
  width: 542px !important;
  min-width: 542px !important;
}

.col-width-543 {
  width: 543px !important;
  min-width: 543px !important;
}

.col-width-544 {
  width: 544px !important;
  min-width: 544px !important;
}

.col-width-545 {
  width: 545px !important;
  min-width: 545px !important;
}

.col-width-546 {
  width: 546px !important;
  min-width: 546px !important;
}

.col-width-547 {
  width: 547px !important;
  min-width: 547px !important;
}

.col-width-548 {
  width: 548px !important;
  min-width: 548px !important;
}

.col-width-549 {
  width: 549px !important;
  min-width: 549px !important;
}

.col-width-550 {
  width: 550px !important;
  min-width: 550px !important;
}

.col-width-551 {
  width: 551px !important;
  min-width: 551px !important;
}

.col-width-552 {
  width: 552px !important;
  min-width: 552px !important;
}

.col-width-553 {
  width: 553px !important;
  min-width: 553px !important;
}

.col-width-554 {
  width: 554px !important;
  min-width: 554px !important;
}

.col-width-555 {
  width: 555px !important;
  min-width: 555px !important;
}

.col-width-556 {
  width: 556px !important;
  min-width: 556px !important;
}

.col-width-557 {
  width: 557px !important;
  min-width: 557px !important;
}

.col-width-558 {
  width: 558px !important;
  min-width: 558px !important;
}

.col-width-559 {
  width: 559px !important;
  min-width: 559px !important;
}

.col-width-560 {
  width: 560px !important;
  min-width: 560px !important;
}

.col-width-561 {
  width: 561px !important;
  min-width: 561px !important;
}

.col-width-562 {
  width: 562px !important;
  min-width: 562px !important;
}

.col-width-563 {
  width: 563px !important;
  min-width: 563px !important;
}

.col-width-564 {
  width: 564px !important;
  min-width: 564px !important;
}

.col-width-565 {
  width: 565px !important;
  min-width: 565px !important;
}

.col-width-566 {
  width: 566px !important;
  min-width: 566px !important;
}

.col-width-567 {
  width: 567px !important;
  min-width: 567px !important;
}

.col-width-568 {
  width: 568px !important;
  min-width: 568px !important;
}

.col-width-569 {
  width: 569px !important;
  min-width: 569px !important;
}

.col-width-570 {
  width: 570px !important;
  min-width: 570px !important;
}

.col-width-571 {
  width: 571px !important;
  min-width: 571px !important;
}

.col-width-572 {
  width: 572px !important;
  min-width: 572px !important;
}

.col-width-573 {
  width: 573px !important;
  min-width: 573px !important;
}

.col-width-574 {
  width: 574px !important;
  min-width: 574px !important;
}

.col-width-575 {
  width: 575px !important;
  min-width: 575px !important;
}

.col-width-576 {
  width: 576px !important;
  min-width: 576px !important;
}

.col-width-577 {
  width: 577px !important;
  min-width: 577px !important;
}

.col-width-578 {
  width: 578px !important;
  min-width: 578px !important;
}

.col-width-579 {
  width: 579px !important;
  min-width: 579px !important;
}

.col-width-580 {
  width: 580px !important;
  min-width: 580px !important;
}

.col-width-581 {
  width: 581px !important;
  min-width: 581px !important;
}

.col-width-582 {
  width: 582px !important;
  min-width: 582px !important;
}

.col-width-583 {
  width: 583px !important;
  min-width: 583px !important;
}

.col-width-584 {
  width: 584px !important;
  min-width: 584px !important;
}

.col-width-585 {
  width: 585px !important;
  min-width: 585px !important;
}

.col-width-586 {
  width: 586px !important;
  min-width: 586px !important;
}

.col-width-587 {
  width: 587px !important;
  min-width: 587px !important;
}

.col-width-588 {
  width: 588px !important;
  min-width: 588px !important;
}

.col-width-589 {
  width: 589px !important;
  min-width: 589px !important;
}

.col-width-590 {
  width: 590px !important;
  min-width: 590px !important;
}

.col-width-591 {
  width: 591px !important;
  min-width: 591px !important;
}

.col-width-592 {
  width: 592px !important;
  min-width: 592px !important;
}

.col-width-593 {
  width: 593px !important;
  min-width: 593px !important;
}

.col-width-594 {
  width: 594px !important;
  min-width: 594px !important;
}

.col-width-595 {
  width: 595px !important;
  min-width: 595px !important;
}

.col-width-596 {
  width: 596px !important;
  min-width: 596px !important;
}

.col-width-597 {
  width: 597px !important;
  min-width: 597px !important;
}

.col-width-598 {
  width: 598px !important;
  min-width: 598px !important;
}

.col-width-599 {
  width: 599px !important;
  min-width: 599px !important;
}

.col-width-600 {
  width: 600px !important;
  min-width: 600px !important;
}

.col-width-601 {
  width: 601px !important;
  min-width: 601px !important;
}

.col-width-602 {
  width: 602px !important;
  min-width: 602px !important;
}

.col-width-603 {
  width: 603px !important;
  min-width: 603px !important;
}

.col-width-604 {
  width: 604px !important;
  min-width: 604px !important;
}

.col-width-605 {
  width: 605px !important;
  min-width: 605px !important;
}

.col-width-606 {
  width: 606px !important;
  min-width: 606px !important;
}

.col-width-607 {
  width: 607px !important;
  min-width: 607px !important;
}

.col-width-608 {
  width: 608px !important;
  min-width: 608px !important;
}

.col-width-609 {
  width: 609px !important;
  min-width: 609px !important;
}

.col-width-610 {
  width: 610px !important;
  min-width: 610px !important;
}

.col-width-611 {
  width: 611px !important;
  min-width: 611px !important;
}

.col-width-612 {
  width: 612px !important;
  min-width: 612px !important;
}

.col-width-613 {
  width: 613px !important;
  min-width: 613px !important;
}

.col-width-614 {
  width: 614px !important;
  min-width: 614px !important;
}

.col-width-615 {
  width: 615px !important;
  min-width: 615px !important;
}

.col-width-616 {
  width: 616px !important;
  min-width: 616px !important;
}

.col-width-617 {
  width: 617px !important;
  min-width: 617px !important;
}

.col-width-618 {
  width: 618px !important;
  min-width: 618px !important;
}

.col-width-619 {
  width: 619px !important;
  min-width: 619px !important;
}

.col-width-620 {
  width: 620px !important;
  min-width: 620px !important;
}

.col-width-621 {
  width: 621px !important;
  min-width: 621px !important;
}

.col-width-622 {
  width: 622px !important;
  min-width: 622px !important;
}

.col-width-623 {
  width: 623px !important;
  min-width: 623px !important;
}

.col-width-624 {
  width: 624px !important;
  min-width: 624px !important;
}

.col-width-625 {
  width: 625px !important;
  min-width: 625px !important;
}

.col-width-626 {
  width: 626px !important;
  min-width: 626px !important;
}

.col-width-627 {
  width: 627px !important;
  min-width: 627px !important;
}

.col-width-628 {
  width: 628px !important;
  min-width: 628px !important;
}

.col-width-629 {
  width: 629px !important;
  min-width: 629px !important;
}

.col-width-630 {
  width: 630px !important;
  min-width: 630px !important;
}

.col-width-631 {
  width: 631px !important;
  min-width: 631px !important;
}

.col-width-632 {
  width: 632px !important;
  min-width: 632px !important;
}

.col-width-633 {
  width: 633px !important;
  min-width: 633px !important;
}

.col-width-634 {
  width: 634px !important;
  min-width: 634px !important;
}

.col-width-635 {
  width: 635px !important;
  min-width: 635px !important;
}

.col-width-636 {
  width: 636px !important;
  min-width: 636px !important;
}

.col-width-637 {
  width: 637px !important;
  min-width: 637px !important;
}

.col-width-638 {
  width: 638px !important;
  min-width: 638px !important;
}

.col-width-639 {
  width: 639px !important;
  min-width: 639px !important;
}

.col-width-640 {
  width: 640px !important;
  min-width: 640px !important;
}

.col-width-641 {
  width: 641px !important;
  min-width: 641px !important;
}

.col-width-642 {
  width: 642px !important;
  min-width: 642px !important;
}

.col-width-643 {
  width: 643px !important;
  min-width: 643px !important;
}

.col-width-644 {
  width: 644px !important;
  min-width: 644px !important;
}

.col-width-645 {
  width: 645px !important;
  min-width: 645px !important;
}

.col-width-646 {
  width: 646px !important;
  min-width: 646px !important;
}

.col-width-647 {
  width: 647px !important;
  min-width: 647px !important;
}

.col-width-648 {
  width: 648px !important;
  min-width: 648px !important;
}

.col-width-649 {
  width: 649px !important;
  min-width: 649px !important;
}

.col-width-650 {
  width: 650px !important;
  min-width: 650px !important;
}

.col-width-651 {
  width: 651px !important;
  min-width: 651px !important;
}

.col-width-652 {
  width: 652px !important;
  min-width: 652px !important;
}

.col-width-653 {
  width: 653px !important;
  min-width: 653px !important;
}

.col-width-654 {
  width: 654px !important;
  min-width: 654px !important;
}

.col-width-655 {
  width: 655px !important;
  min-width: 655px !important;
}

.col-width-656 {
  width: 656px !important;
  min-width: 656px !important;
}

.col-width-657 {
  width: 657px !important;
  min-width: 657px !important;
}

.col-width-658 {
  width: 658px !important;
  min-width: 658px !important;
}

.col-width-659 {
  width: 659px !important;
  min-width: 659px !important;
}

.col-width-660 {
  width: 660px !important;
  min-width: 660px !important;
}

.col-width-661 {
  width: 661px !important;
  min-width: 661px !important;
}

.col-width-662 {
  width: 662px !important;
  min-width: 662px !important;
}

.col-width-663 {
  width: 663px !important;
  min-width: 663px !important;
}

.col-width-664 {
  width: 664px !important;
  min-width: 664px !important;
}

.col-width-665 {
  width: 665px !important;
  min-width: 665px !important;
}

.col-width-666 {
  width: 666px !important;
  min-width: 666px !important;
}

.col-width-667 {
  width: 667px !important;
  min-width: 667px !important;
}

.col-width-668 {
  width: 668px !important;
  min-width: 668px !important;
}

.col-width-669 {
  width: 669px !important;
  min-width: 669px !important;
}

.col-width-670 {
  width: 670px !important;
  min-width: 670px !important;
}

.col-width-671 {
  width: 671px !important;
  min-width: 671px !important;
}

.col-width-672 {
  width: 672px !important;
  min-width: 672px !important;
}

.col-width-673 {
  width: 673px !important;
  min-width: 673px !important;
}

.col-width-674 {
  width: 674px !important;
  min-width: 674px !important;
}

.col-width-675 {
  width: 675px !important;
  min-width: 675px !important;
}

.col-width-676 {
  width: 676px !important;
  min-width: 676px !important;
}

.col-width-677 {
  width: 677px !important;
  min-width: 677px !important;
}

.col-width-678 {
  width: 678px !important;
  min-width: 678px !important;
}

.col-width-679 {
  width: 679px !important;
  min-width: 679px !important;
}

.col-width-680 {
  width: 680px !important;
  min-width: 680px !important;
}

.col-width-681 {
  width: 681px !important;
  min-width: 681px !important;
}

.col-width-682 {
  width: 682px !important;
  min-width: 682px !important;
}

.col-width-683 {
  width: 683px !important;
  min-width: 683px !important;
}

.col-width-684 {
  width: 684px !important;
  min-width: 684px !important;
}

.col-width-685 {
  width: 685px !important;
  min-width: 685px !important;
}

.col-width-686 {
  width: 686px !important;
  min-width: 686px !important;
}

.col-width-687 {
  width: 687px !important;
  min-width: 687px !important;
}

.col-width-688 {
  width: 688px !important;
  min-width: 688px !important;
}

.col-width-689 {
  width: 689px !important;
  min-width: 689px !important;
}

.col-width-690 {
  width: 690px !important;
  min-width: 690px !important;
}

.col-width-691 {
  width: 691px !important;
  min-width: 691px !important;
}

.col-width-692 {
  width: 692px !important;
  min-width: 692px !important;
}

.col-width-693 {
  width: 693px !important;
  min-width: 693px !important;
}

.col-width-694 {
  width: 694px !important;
  min-width: 694px !important;
}

.col-width-695 {
  width: 695px !important;
  min-width: 695px !important;
}

.col-width-696 {
  width: 696px !important;
  min-width: 696px !important;
}

.col-width-697 {
  width: 697px !important;
  min-width: 697px !important;
}

.col-width-698 {
  width: 698px !important;
  min-width: 698px !important;
}

.col-width-699 {
  width: 699px !important;
  min-width: 699px !important;
}

.col-width-700 {
  width: 700px !important;
  min-width: 700px !important;
}

.col-width-701 {
  width: 701px !important;
  min-width: 701px !important;
}

.col-width-702 {
  width: 702px !important;
  min-width: 702px !important;
}

.col-width-703 {
  width: 703px !important;
  min-width: 703px !important;
}

.col-width-704 {
  width: 704px !important;
  min-width: 704px !important;
}

.col-width-705 {
  width: 705px !important;
  min-width: 705px !important;
}

.col-width-706 {
  width: 706px !important;
  min-width: 706px !important;
}

.col-width-707 {
  width: 707px !important;
  min-width: 707px !important;
}

.col-width-708 {
  width: 708px !important;
  min-width: 708px !important;
}

.col-width-709 {
  width: 709px !important;
  min-width: 709px !important;
}

.col-width-710 {
  width: 710px !important;
  min-width: 710px !important;
}

.col-width-711 {
  width: 711px !important;
  min-width: 711px !important;
}

.col-width-712 {
  width: 712px !important;
  min-width: 712px !important;
}

.col-width-713 {
  width: 713px !important;
  min-width: 713px !important;
}

.col-width-714 {
  width: 714px !important;
  min-width: 714px !important;
}

.col-width-715 {
  width: 715px !important;
  min-width: 715px !important;
}

.col-width-716 {
  width: 716px !important;
  min-width: 716px !important;
}

.col-width-717 {
  width: 717px !important;
  min-width: 717px !important;
}

.col-width-718 {
  width: 718px !important;
  min-width: 718px !important;
}

.col-width-719 {
  width: 719px !important;
  min-width: 719px !important;
}

.col-width-720 {
  width: 720px !important;
  min-width: 720px !important;
}

.col-width-721 {
  width: 721px !important;
  min-width: 721px !important;
}

.col-width-722 {
  width: 722px !important;
  min-width: 722px !important;
}

.col-width-723 {
  width: 723px !important;
  min-width: 723px !important;
}

.col-width-724 {
  width: 724px !important;
  min-width: 724px !important;
}

.col-width-725 {
  width: 725px !important;
  min-width: 725px !important;
}

.col-width-726 {
  width: 726px !important;
  min-width: 726px !important;
}

.col-width-727 {
  width: 727px !important;
  min-width: 727px !important;
}

.col-width-728 {
  width: 728px !important;
  min-width: 728px !important;
}

.col-width-729 {
  width: 729px !important;
  min-width: 729px !important;
}

.col-width-730 {
  width: 730px !important;
  min-width: 730px !important;
}

.col-width-731 {
  width: 731px !important;
  min-width: 731px !important;
}

.col-width-732 {
  width: 732px !important;
  min-width: 732px !important;
}

.col-width-733 {
  width: 733px !important;
  min-width: 733px !important;
}

.col-width-734 {
  width: 734px !important;
  min-width: 734px !important;
}

.col-width-735 {
  width: 735px !important;
  min-width: 735px !important;
}

.col-width-736 {
  width: 736px !important;
  min-width: 736px !important;
}

.col-width-737 {
  width: 737px !important;
  min-width: 737px !important;
}

.col-width-738 {
  width: 738px !important;
  min-width: 738px !important;
}

.col-width-739 {
  width: 739px !important;
  min-width: 739px !important;
}

.col-width-740 {
  width: 740px !important;
  min-width: 740px !important;
}

.col-width-741 {
  width: 741px !important;
  min-width: 741px !important;
}

.col-width-742 {
  width: 742px !important;
  min-width: 742px !important;
}

.col-width-743 {
  width: 743px !important;
  min-width: 743px !important;
}

.col-width-744 {
  width: 744px !important;
  min-width: 744px !important;
}

.col-width-745 {
  width: 745px !important;
  min-width: 745px !important;
}

.col-width-746 {
  width: 746px !important;
  min-width: 746px !important;
}

.col-width-747 {
  width: 747px !important;
  min-width: 747px !important;
}

.col-width-748 {
  width: 748px !important;
  min-width: 748px !important;
}

.col-width-749 {
  width: 749px !important;
  min-width: 749px !important;
}

.col-width-750 {
  width: 750px !important;
  min-width: 750px !important;
}

.col-width-751 {
  width: 751px !important;
  min-width: 751px !important;
}

.col-width-752 {
  width: 752px !important;
  min-width: 752px !important;
}

.col-width-753 {
  width: 753px !important;
  min-width: 753px !important;
}

.col-width-754 {
  width: 754px !important;
  min-width: 754px !important;
}

.col-width-755 {
  width: 755px !important;
  min-width: 755px !important;
}

.col-width-756 {
  width: 756px !important;
  min-width: 756px !important;
}

.col-width-757 {
  width: 757px !important;
  min-width: 757px !important;
}

.col-width-758 {
  width: 758px !important;
  min-width: 758px !important;
}

.col-width-759 {
  width: 759px !important;
  min-width: 759px !important;
}

.col-width-760 {
  width: 760px !important;
  min-width: 760px !important;
}

.col-width-761 {
  width: 761px !important;
  min-width: 761px !important;
}

.col-width-762 {
  width: 762px !important;
  min-width: 762px !important;
}

.col-width-763 {
  width: 763px !important;
  min-width: 763px !important;
}

.col-width-764 {
  width: 764px !important;
  min-width: 764px !important;
}

.col-width-765 {
  width: 765px !important;
  min-width: 765px !important;
}

.col-width-766 {
  width: 766px !important;
  min-width: 766px !important;
}

.col-width-767 {
  width: 767px !important;
  min-width: 767px !important;
}

.col-width-768 {
  width: 768px !important;
  min-width: 768px !important;
}

.col-width-769 {
  width: 769px !important;
  min-width: 769px !important;
}

.col-width-770 {
  width: 770px !important;
  min-width: 770px !important;
}

.col-width-771 {
  width: 771px !important;
  min-width: 771px !important;
}

.col-width-772 {
  width: 772px !important;
  min-width: 772px !important;
}

.col-width-773 {
  width: 773px !important;
  min-width: 773px !important;
}

.col-width-774 {
  width: 774px !important;
  min-width: 774px !important;
}

.col-width-775 {
  width: 775px !important;
  min-width: 775px !important;
}

.col-width-776 {
  width: 776px !important;
  min-width: 776px !important;
}

.col-width-777 {
  width: 777px !important;
  min-width: 777px !important;
}

.col-width-778 {
  width: 778px !important;
  min-width: 778px !important;
}

.col-width-779 {
  width: 779px !important;
  min-width: 779px !important;
}

.col-width-780 {
  width: 780px !important;
  min-width: 780px !important;
}

.col-width-781 {
  width: 781px !important;
  min-width: 781px !important;
}

.col-width-782 {
  width: 782px !important;
  min-width: 782px !important;
}

.col-width-783 {
  width: 783px !important;
  min-width: 783px !important;
}

.col-width-784 {
  width: 784px !important;
  min-width: 784px !important;
}

.col-width-785 {
  width: 785px !important;
  min-width: 785px !important;
}

.col-width-786 {
  width: 786px !important;
  min-width: 786px !important;
}

.col-width-787 {
  width: 787px !important;
  min-width: 787px !important;
}

.col-width-788 {
  width: 788px !important;
  min-width: 788px !important;
}

.col-width-789 {
  width: 789px !important;
  min-width: 789px !important;
}

.col-width-790 {
  width: 790px !important;
  min-width: 790px !important;
}

.col-width-791 {
  width: 791px !important;
  min-width: 791px !important;
}

.col-width-792 {
  width: 792px !important;
  min-width: 792px !important;
}

.col-width-793 {
  width: 793px !important;
  min-width: 793px !important;
}

.col-width-794 {
  width: 794px !important;
  min-width: 794px !important;
}

.col-width-795 {
  width: 795px !important;
  min-width: 795px !important;
}

.col-width-796 {
  width: 796px !important;
  min-width: 796px !important;
}

.col-width-797 {
  width: 797px !important;
  min-width: 797px !important;
}

.col-width-798 {
  width: 798px !important;
  min-width: 798px !important;
}

.col-width-799 {
  width: 799px !important;
  min-width: 799px !important;
}

.col-width-800 {
  width: 800px !important;
  min-width: 800px !important;
}

.col-width-801 {
  width: 801px !important;
  min-width: 801px !important;
}

.col-width-802 {
  width: 802px !important;
  min-width: 802px !important;
}

.col-width-803 {
  width: 803px !important;
  min-width: 803px !important;
}

.col-width-804 {
  width: 804px !important;
  min-width: 804px !important;
}

.col-width-805 {
  width: 805px !important;
  min-width: 805px !important;
}

.col-width-806 {
  width: 806px !important;
  min-width: 806px !important;
}

.col-width-807 {
  width: 807px !important;
  min-width: 807px !important;
}

.col-width-808 {
  width: 808px !important;
  min-width: 808px !important;
}

.col-width-809 {
  width: 809px !important;
  min-width: 809px !important;
}

.col-width-810 {
  width: 810px !important;
  min-width: 810px !important;
}

.col-width-811 {
  width: 811px !important;
  min-width: 811px !important;
}

.col-width-812 {
  width: 812px !important;
  min-width: 812px !important;
}

.col-width-813 {
  width: 813px !important;
  min-width: 813px !important;
}

.col-width-814 {
  width: 814px !important;
  min-width: 814px !important;
}

.col-width-815 {
  width: 815px !important;
  min-width: 815px !important;
}

.col-width-816 {
  width: 816px !important;
  min-width: 816px !important;
}

.col-width-817 {
  width: 817px !important;
  min-width: 817px !important;
}

.col-width-818 {
  width: 818px !important;
  min-width: 818px !important;
}

.col-width-819 {
  width: 819px !important;
  min-width: 819px !important;
}

.col-width-820 {
  width: 820px !important;
  min-width: 820px !important;
}

.col-width-821 {
  width: 821px !important;
  min-width: 821px !important;
}

.col-width-822 {
  width: 822px !important;
  min-width: 822px !important;
}

.col-width-823 {
  width: 823px !important;
  min-width: 823px !important;
}

.col-width-824 {
  width: 824px !important;
  min-width: 824px !important;
}

.col-width-825 {
  width: 825px !important;
  min-width: 825px !important;
}

.col-width-826 {
  width: 826px !important;
  min-width: 826px !important;
}

.col-width-827 {
  width: 827px !important;
  min-width: 827px !important;
}

.col-width-828 {
  width: 828px !important;
  min-width: 828px !important;
}

.col-width-829 {
  width: 829px !important;
  min-width: 829px !important;
}

.col-width-830 {
  width: 830px !important;
  min-width: 830px !important;
}

.col-width-831 {
  width: 831px !important;
  min-width: 831px !important;
}

.col-width-832 {
  width: 832px !important;
  min-width: 832px !important;
}

.col-width-833 {
  width: 833px !important;
  min-width: 833px !important;
}

.col-width-834 {
  width: 834px !important;
  min-width: 834px !important;
}

.col-width-835 {
  width: 835px !important;
  min-width: 835px !important;
}

.col-width-836 {
  width: 836px !important;
  min-width: 836px !important;
}

.col-width-837 {
  width: 837px !important;
  min-width: 837px !important;
}

.col-width-838 {
  width: 838px !important;
  min-width: 838px !important;
}

.col-width-839 {
  width: 839px !important;
  min-width: 839px !important;
}

.col-width-840 {
  width: 840px !important;
  min-width: 840px !important;
}

.col-width-841 {
  width: 841px !important;
  min-width: 841px !important;
}

.col-width-842 {
  width: 842px !important;
  min-width: 842px !important;
}

.col-width-843 {
  width: 843px !important;
  min-width: 843px !important;
}

.col-width-844 {
  width: 844px !important;
  min-width: 844px !important;
}

.col-width-845 {
  width: 845px !important;
  min-width: 845px !important;
}

.col-width-846 {
  width: 846px !important;
  min-width: 846px !important;
}

.col-width-847 {
  width: 847px !important;
  min-width: 847px !important;
}

.col-width-848 {
  width: 848px !important;
  min-width: 848px !important;
}

.col-width-849 {
  width: 849px !important;
  min-width: 849px !important;
}

.col-width-850 {
  width: 850px !important;
  min-width: 850px !important;
}

.col-width-851 {
  width: 851px !important;
  min-width: 851px !important;
}

.col-width-852 {
  width: 852px !important;
  min-width: 852px !important;
}

.col-width-853 {
  width: 853px !important;
  min-width: 853px !important;
}

.col-width-854 {
  width: 854px !important;
  min-width: 854px !important;
}

.col-width-855 {
  width: 855px !important;
  min-width: 855px !important;
}

.col-width-856 {
  width: 856px !important;
  min-width: 856px !important;
}

.col-width-857 {
  width: 857px !important;
  min-width: 857px !important;
}

.col-width-858 {
  width: 858px !important;
  min-width: 858px !important;
}

.col-width-859 {
  width: 859px !important;
  min-width: 859px !important;
}

.col-width-860 {
  width: 860px !important;
  min-width: 860px !important;
}

.col-width-861 {
  width: 861px !important;
  min-width: 861px !important;
}

.col-width-862 {
  width: 862px !important;
  min-width: 862px !important;
}

.col-width-863 {
  width: 863px !important;
  min-width: 863px !important;
}

.col-width-864 {
  width: 864px !important;
  min-width: 864px !important;
}

.col-width-865 {
  width: 865px !important;
  min-width: 865px !important;
}

.col-width-866 {
  width: 866px !important;
  min-width: 866px !important;
}

.col-width-867 {
  width: 867px !important;
  min-width: 867px !important;
}

.col-width-868 {
  width: 868px !important;
  min-width: 868px !important;
}

.col-width-869 {
  width: 869px !important;
  min-width: 869px !important;
}

.col-width-870 {
  width: 870px !important;
  min-width: 870px !important;
}

.col-width-871 {
  width: 871px !important;
  min-width: 871px !important;
}

.col-width-872 {
  width: 872px !important;
  min-width: 872px !important;
}

.col-width-873 {
  width: 873px !important;
  min-width: 873px !important;
}

.col-width-874 {
  width: 874px !important;
  min-width: 874px !important;
}

.col-width-875 {
  width: 875px !important;
  min-width: 875px !important;
}

.col-width-876 {
  width: 876px !important;
  min-width: 876px !important;
}

.col-width-877 {
  width: 877px !important;
  min-width: 877px !important;
}

.col-width-878 {
  width: 878px !important;
  min-width: 878px !important;
}

.col-width-879 {
  width: 879px !important;
  min-width: 879px !important;
}

.col-width-880 {
  width: 880px !important;
  min-width: 880px !important;
}

.col-width-881 {
  width: 881px !important;
  min-width: 881px !important;
}

.col-width-882 {
  width: 882px !important;
  min-width: 882px !important;
}

.col-width-883 {
  width: 883px !important;
  min-width: 883px !important;
}

.col-width-884 {
  width: 884px !important;
  min-width: 884px !important;
}

.col-width-885 {
  width: 885px !important;
  min-width: 885px !important;
}

.col-width-886 {
  width: 886px !important;
  min-width: 886px !important;
}

.col-width-887 {
  width: 887px !important;
  min-width: 887px !important;
}

.col-width-888 {
  width: 888px !important;
  min-width: 888px !important;
}

.col-width-889 {
  width: 889px !important;
  min-width: 889px !important;
}

.col-width-890 {
  width: 890px !important;
  min-width: 890px !important;
}

.col-width-891 {
  width: 891px !important;
  min-width: 891px !important;
}

.col-width-892 {
  width: 892px !important;
  min-width: 892px !important;
}

.col-width-893 {
  width: 893px !important;
  min-width: 893px !important;
}

.col-width-894 {
  width: 894px !important;
  min-width: 894px !important;
}

.col-width-895 {
  width: 895px !important;
  min-width: 895px !important;
}

.col-width-896 {
  width: 896px !important;
  min-width: 896px !important;
}

.col-width-897 {
  width: 897px !important;
  min-width: 897px !important;
}

.col-width-898 {
  width: 898px !important;
  min-width: 898px !important;
}

.col-width-899 {
  width: 899px !important;
  min-width: 899px !important;
}

.col-width-900 {
  width: 900px !important;
  min-width: 900px !important;
}

.col-width-901 {
  width: 901px !important;
  min-width: 901px !important;
}

.col-width-902 {
  width: 902px !important;
  min-width: 902px !important;
}

.col-width-903 {
  width: 903px !important;
  min-width: 903px !important;
}

.col-width-904 {
  width: 904px !important;
  min-width: 904px !important;
}

.col-width-905 {
  width: 905px !important;
  min-width: 905px !important;
}

.col-width-906 {
  width: 906px !important;
  min-width: 906px !important;
}

.col-width-907 {
  width: 907px !important;
  min-width: 907px !important;
}

.col-width-908 {
  width: 908px !important;
  min-width: 908px !important;
}

.col-width-909 {
  width: 909px !important;
  min-width: 909px !important;
}

.col-width-910 {
  width: 910px !important;
  min-width: 910px !important;
}

.col-width-911 {
  width: 911px !important;
  min-width: 911px !important;
}

.col-width-912 {
  width: 912px !important;
  min-width: 912px !important;
}

.col-width-913 {
  width: 913px !important;
  min-width: 913px !important;
}

.col-width-914 {
  width: 914px !important;
  min-width: 914px !important;
}

.col-width-915 {
  width: 915px !important;
  min-width: 915px !important;
}

.col-width-916 {
  width: 916px !important;
  min-width: 916px !important;
}

.col-width-917 {
  width: 917px !important;
  min-width: 917px !important;
}

.col-width-918 {
  width: 918px !important;
  min-width: 918px !important;
}

.col-width-919 {
  width: 919px !important;
  min-width: 919px !important;
}

.col-width-920 {
  width: 920px !important;
  min-width: 920px !important;
}

.col-width-921 {
  width: 921px !important;
  min-width: 921px !important;
}

.col-width-922 {
  width: 922px !important;
  min-width: 922px !important;
}

.col-width-923 {
  width: 923px !important;
  min-width: 923px !important;
}

.col-width-924 {
  width: 924px !important;
  min-width: 924px !important;
}

.col-width-925 {
  width: 925px !important;
  min-width: 925px !important;
}

.col-width-926 {
  width: 926px !important;
  min-width: 926px !important;
}

.col-width-927 {
  width: 927px !important;
  min-width: 927px !important;
}

.col-width-928 {
  width: 928px !important;
  min-width: 928px !important;
}

.col-width-929 {
  width: 929px !important;
  min-width: 929px !important;
}

.col-width-930 {
  width: 930px !important;
  min-width: 930px !important;
}

.col-width-931 {
  width: 931px !important;
  min-width: 931px !important;
}

.col-width-932 {
  width: 932px !important;
  min-width: 932px !important;
}

.col-width-933 {
  width: 933px !important;
  min-width: 933px !important;
}

.col-width-934 {
  width: 934px !important;
  min-width: 934px !important;
}

.col-width-935 {
  width: 935px !important;
  min-width: 935px !important;
}

.col-width-936 {
  width: 936px !important;
  min-width: 936px !important;
}

.col-width-937 {
  width: 937px !important;
  min-width: 937px !important;
}

.col-width-938 {
  width: 938px !important;
  min-width: 938px !important;
}

.col-width-939 {
  width: 939px !important;
  min-width: 939px !important;
}

.col-width-940 {
  width: 940px !important;
  min-width: 940px !important;
}

.col-width-941 {
  width: 941px !important;
  min-width: 941px !important;
}

.col-width-942 {
  width: 942px !important;
  min-width: 942px !important;
}

.col-width-943 {
  width: 943px !important;
  min-width: 943px !important;
}

.col-width-944 {
  width: 944px !important;
  min-width: 944px !important;
}

.col-width-945 {
  width: 945px !important;
  min-width: 945px !important;
}

.col-width-946 {
  width: 946px !important;
  min-width: 946px !important;
}

.col-width-947 {
  width: 947px !important;
  min-width: 947px !important;
}

.col-width-948 {
  width: 948px !important;
  min-width: 948px !important;
}

.col-width-949 {
  width: 949px !important;
  min-width: 949px !important;
}

.col-width-950 {
  width: 950px !important;
  min-width: 950px !important;
}

.col-width-951 {
  width: 951px !important;
  min-width: 951px !important;
}

.col-width-952 {
  width: 952px !important;
  min-width: 952px !important;
}

.col-width-953 {
  width: 953px !important;
  min-width: 953px !important;
}

.col-width-954 {
  width: 954px !important;
  min-width: 954px !important;
}

.col-width-955 {
  width: 955px !important;
  min-width: 955px !important;
}

.col-width-956 {
  width: 956px !important;
  min-width: 956px !important;
}

.col-width-957 {
  width: 957px !important;
  min-width: 957px !important;
}

.col-width-958 {
  width: 958px !important;
  min-width: 958px !important;
}

.col-width-959 {
  width: 959px !important;
  min-width: 959px !important;
}

.col-width-960 {
  width: 960px !important;
  min-width: 960px !important;
}

.col-width-961 {
  width: 961px !important;
  min-width: 961px !important;
}

.col-width-962 {
  width: 962px !important;
  min-width: 962px !important;
}

.col-width-963 {
  width: 963px !important;
  min-width: 963px !important;
}

.col-width-964 {
  width: 964px !important;
  min-width: 964px !important;
}

.col-width-965 {
  width: 965px !important;
  min-width: 965px !important;
}

.col-width-966 {
  width: 966px !important;
  min-width: 966px !important;
}

.col-width-967 {
  width: 967px !important;
  min-width: 967px !important;
}

.col-width-968 {
  width: 968px !important;
  min-width: 968px !important;
}

.col-width-969 {
  width: 969px !important;
  min-width: 969px !important;
}

.col-width-970 {
  width: 970px !important;
  min-width: 970px !important;
}

.col-width-971 {
  width: 971px !important;
  min-width: 971px !important;
}

.col-width-972 {
  width: 972px !important;
  min-width: 972px !important;
}

.col-width-973 {
  width: 973px !important;
  min-width: 973px !important;
}

.col-width-974 {
  width: 974px !important;
  min-width: 974px !important;
}

.col-width-975 {
  width: 975px !important;
  min-width: 975px !important;
}

.col-width-976 {
  width: 976px !important;
  min-width: 976px !important;
}

.col-width-977 {
  width: 977px !important;
  min-width: 977px !important;
}

.col-width-978 {
  width: 978px !important;
  min-width: 978px !important;
}

.col-width-979 {
  width: 979px !important;
  min-width: 979px !important;
}

.col-width-980 {
  width: 980px !important;
  min-width: 980px !important;
}

.col-width-981 {
  width: 981px !important;
  min-width: 981px !important;
}

.col-width-982 {
  width: 982px !important;
  min-width: 982px !important;
}

.col-width-983 {
  width: 983px !important;
  min-width: 983px !important;
}

.col-width-984 {
  width: 984px !important;
  min-width: 984px !important;
}

.col-width-985 {
  width: 985px !important;
  min-width: 985px !important;
}

.col-width-986 {
  width: 986px !important;
  min-width: 986px !important;
}

.col-width-987 {
  width: 987px !important;
  min-width: 987px !important;
}

.col-width-988 {
  width: 988px !important;
  min-width: 988px !important;
}

.col-width-989 {
  width: 989px !important;
  min-width: 989px !important;
}

.col-width-990 {
  width: 990px !important;
  min-width: 990px !important;
}

.col-width-991 {
  width: 991px !important;
  min-width: 991px !important;
}

.col-width-992 {
  width: 992px !important;
  min-width: 992px !important;
}

.col-width-993 {
  width: 993px !important;
  min-width: 993px !important;
}

.col-width-994 {
  width: 994px !important;
  min-width: 994px !important;
}

.col-width-995 {
  width: 995px !important;
  min-width: 995px !important;
}

.col-width-996 {
  width: 996px !important;
  min-width: 996px !important;
}

.col-width-997 {
  width: 997px !important;
  min-width: 997px !important;
}

.col-width-998 {
  width: 998px !important;
  min-width: 998px !important;
}

.col-width-999 {
  width: 999px !important;
  min-width: 999px !important;
}

.col-width-1000 {
  width: 1000px !important;
  min-width: 1000px !important;
}

.no-inline-style {
  width: unset !important;
  height: unset !important;
  max-width: unset !important;
  max-height: unset !important;
  background-color: unset !important;
  color: unset !important;
  grid-template-columns: unset !important;
}

.ui-book-slider-container {
  position: relative;
  width: 100%;
}

.ui-book-slider {
  width: 100%;
  height: auto;
  overflow: hidden;
}
.ui-book-slider__item {
  display: flex;
  flex-direction: column;
  height: 100%;
  cursor: pointer;
  transition: transform 0.2s ease;
}
.ui-book-slider__item:hover {
  transform: translateY(-2px);
}
.ui-book-slider__image-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 3/4;
  margin-bottom: 0.75rem;
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.ui-book-slider__image-link {
  display: block;
  width: 100%;
  height: 100%;
}
.ui-book-slider__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.3s ease;
}
.ui-book-slider__image:hover {
  transform: scale(1.02);
}
.ui-book-slider__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.ui-book-slider__title {
  font-family: "PretendardVariable", "PretendardGOV", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-weight: 600;
  font-size: 0.875rem;
  line-height: 1.4;
  color: #333;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 900px) {
  .ui-book-slider__title {
    font-size: 0.8125rem;
  }
}
.ui-book-slider__title-link {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}
.ui-book-slider__title-link:hover {
  color: #3c79c2;
}
.ui-book-slider__author {
  font-family: "PretendardVariable", "PretendardGOV", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-weight: 400;
  font-size: 0.8125rem;
  line-height: 1.3;
  color: #6b7280;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 900px) {
  .ui-book-slider__author {
    font-size: 0.75rem;
  }
}
.ui-book-slider__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s ease;
  backdrop-filter: blur(4px);
}
.ui-book-slider__nav:hover {
  background: rgb(255, 255, 255);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: translateY(-50%) scale(1.05);
}
.ui-book-slider__nav:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
.ui-book-slider__nav--prev {
  left: -1.25rem;
}
.ui-book-slider__nav--next {
  right: -1.25rem;
}
.ui-book-slider__nav i {
  font-size: 1.125rem;
  color: #374151;
}
@media (max-width: 900px) {
  .ui-book-slider__nav {
    width: 2.25rem;
    height: 2.25rem;
  }
  .ui-book-slider__nav--prev {
    left: -1.125rem;
  }
  .ui-book-slider__nav--next {
    right: -1.125rem;
  }
  .ui-book-slider__nav i {
    font-size: 1rem;
  }
}
.ui-book-slider .swiper-wrapper {
  align-items: stretch;
}
.ui-book-slider .swiper-slide {
  height: auto;
}

@media (max-width: 900px) {
  .ui-book-slider__item:hover {
    transform: none;
  }
  .ui-book-slider__image:hover {
    transform: none;
  }
}
@media (max-width: 900px) {
  .ui-book-slider__image-wrapper {
    margin-bottom: 0.5rem;
    border-radius: 0.375rem;
  }
  .ui-book-slider__info {
    gap: 0.125rem;
  }
}
.ui-book-card__description {
  margin-bottom: 1rem;
}
.ui-book-card__description p {
  font-family: "PretendardVariable", "PretendardGOV", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-weight: 400;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #374151;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ui-components {
  display: contents;
}

.keyboard-wrapper {
  position: relative;
  z-index: 1000;
}

.worldword-wrap {
  position: absolute;
  top: 100%;
  margin-top: -2.5rem !important;
  right: 0;
  max-width: 45.6875rem;
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.15);
  z-index: 1001;
  width: max-content;
}
@media (max-width: 900px) {
  .worldword-wrap {
    max-width: calc(100vw - 2rem);
    right: -1rem;
    border-radius: 0.375rem;
  }
}
.worldword-wrap fieldset {
  border: none;
  padding: 1.25rem;
  margin: 0;
}
@media (max-width: 900px) {
  .worldword-wrap fieldset {
    padding: 1rem;
  }
}
.worldword-wrap legend {
  display: none;
}
.worldword-wrap .worldword-title {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #111827;
}
@media (max-width: 900px) {
  .worldword-wrap .worldword-title {
    font-size: 0.9375rem;
    margin-bottom: 0.75rem;
  }
}
.worldword-wrap .language {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 1rem;
  padding: 0;
  list-style: none;
}
@media (max-width: 900px) {
  .worldword-wrap .language {
    gap: 0.1875rem;
    margin-bottom: 0.75rem;
  }
}
.worldword-wrap .language li {
  margin: 0;
}
.worldword-wrap .language a {
  display: block;
  padding: 0.5rem 0.75rem;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 0.25rem;
  color: #374151;
  text-decoration: none;
  font-size: 0.875rem;
  transition: all 0.2s;
  word-break: keep-all;
}
@media (max-width: 900px) {
  .worldword-wrap .language a {
    padding: 0.375rem 0.625rem;
    font-size: 0.8125rem;
    border-radius: 0.1875rem;
  }
}
.worldword-wrap .language a:hover {
  background: #f3f4f6;
  border-color: #d1d5db;
}
.worldword-wrap .language a.selected {
  background: #3c79c2;
  border-color: #3c79c2;
  color: #ffffff;
}
.worldword-wrap .language-contents {
  display: none;
}
.worldword-wrap .language-contents[data-type=히라가나] {
  display: block;
}
.worldword-wrap .language-contents .ir_text {
  font-size: 0.75rem;
  color: #6b7280;
  margin: 0.5rem 0 0.25rem 0;
  font-weight: 500;
}
@media (max-width: 900px) {
  .worldword-wrap .language-contents .ir_text {
    font-size: 0.6875rem;
    margin: 0.375rem 0 0.1875rem 0;
  }
}
.worldword-wrap .language-contents ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.125rem;
  margin: 0 0 0.75rem 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 900px) {
  .worldword-wrap .language-contents ul {
    gap: 0.0625rem;
    margin-bottom: 0.5rem;
  }
}
.worldword-wrap .language-contents ul li {
  margin: 0;
}
.worldword-wrap .language-contents ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 0.25rem;
  color: #374151;
  text-decoration: none;
  font-size: 0.875rem;
  transition: all 0.2s;
}
@media (max-width: 900px) {
  .worldword-wrap .language-contents ul li a {
    width: 1.75rem;
    height: 1.75rem;
    font-size: 0.75rem;
    border-radius: 0.1875rem;
  }
}
.worldword-wrap .language-contents ul li a:hover {
  background: #f3f4f6;
  border-color: #3c79c2;
  color: #3c79c2;
}

.worldword-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 2rem;
  height: 2rem;
  background: #f9fafb;
  border: 1px solid #d1d5db;
  border-radius: 0.25rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .worldword-close {
    width: 1.75rem;
    height: 1.75rem;
    top: 0.375rem;
    right: 0.375rem;
    border-radius: 0.1875rem;
  }
}
.worldword-close:hover {
  background: #f3f4f6;
  border-color: #9ca3af;
}
.worldword-close .sp_layout {
  font-size: 0;
}
.worldword-close .sp_layout::before {
  content: "×";
  font-size: 1.125rem;
  color: #6b7280;
}
@media (max-width: 900px) {
  .worldword-close .sp_layout::before {
    font-size: 1rem;
  }
}

.ui-more-btn {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.3125rem;
  align-items: center;
}
.ui-more-btn__text {
  font-size: 1.0625rem;
  font-weight: 500;
  color: #191a1a;
  line-height: 1;
}
.ui-more-btn:hover .ui-more-btn__text {
  color: #3c79c2;
}

.main-container {
  min-height: calc(100vh - 200px);
}

.search-layout {
  display: flex;
  gap: 2rem;
  align-items: flex-start;
  min-height: calc(100vh - 300px);
}
.search-layout__sidebar {
  flex: 0 0 17.5rem;
}
@media (max-width: 900px) {
  .search-layout__sidebar {
    display: none;
  }
}
.search-layout__content {
  flex: 1;
  min-width: 0;
  padding: 1.5rem 0;
}
@media (max-width: 900px) {
  .search-layout__content {
    padding: 1rem 0;
  }
}

@media (max-width: 900px) {
  .search-layout {
    gap: 1.5rem;
  }
  .search-layout__sidebar {
    flex: 0 0 15rem;
  }
}
.ui-switch-container {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.ui-switch {
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.ui-switch--disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.ui-switch__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}

.ui-switch__track {
  position: relative;
  border-radius: 1.25rem;
  background-color: #d1d5db;
  transition: all 0.2s ease;
}
.ui-switch--small .ui-switch__track {
  width: 2rem;
  height: 1.125rem;
}
.ui-switch--medium .ui-switch__track {
  width: 2.75rem;
  height: 1.5rem;
}
.ui-switch--large .ui-switch__track {
  width: 3.5rem;
  height: 1.875rem;
}
.ui-switch__input:checked + .ui-switch__track {
  background-color: #3c79c2;
}
.ui-switch--success .ui-switch__input:checked + .ui-switch__track {
  background-color: #228738;
}
.ui-switch--warning .ui-switch__input:checked + .ui-switch__track {
  background-color: #ffb114;
}
.ui-switch--error .ui-switch__input:checked + .ui-switch__track {
  background-color: #ef4444;
}
.ui-switch__input:focus + .ui-switch__track {
  box-shadow: 0 0 0 3px rgba(60, 121, 194, 0.1);
}
.ui-switch:hover:not(.ui-switch--disabled) .ui-switch__track {
  background-color: #9ca3af;
}
.ui-switch:hover:not(.ui-switch--disabled) .ui-switch__input:checked + .ui-switch__track {
  background-color: #0071ba;
}

.ui-switch__thumb {
  position: absolute;
  top: 50%;
  background-color: #ffffff;
  border-radius: 50%;
  transition: all 0.2s ease;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.ui-switch--small .ui-switch__thumb {
  width: 0.875rem;
  height: 0.875rem;
  left: 0.125rem;
  transform: translateY(-50%);
}
.ui-switch--medium .ui-switch__thumb {
  width: 1.25rem;
  height: 1.25rem;
  left: 0.125rem;
  transform: translateY(-50%);
}
.ui-switch--large .ui-switch__thumb {
  width: 1.625rem;
  height: 1.625rem;
  left: 0.125rem;
  transform: translateY(-50%);
}
.ui-switch--small .ui-switch__input:checked + .ui-switch__track .ui-switch__thumb {
  left: 1rem;
}
.ui-switch--medium .ui-switch__input:checked + .ui-switch__track .ui-switch__thumb {
  left: 1.375rem;
}
.ui-switch--large .ui-switch__input:checked + .ui-switch__track .ui-switch__thumb {
  left: 1.75rem;
}

.ui-switch__label {
  font-size: 0.875rem;
  color: #374151;
  user-select: none;
  cursor: pointer;
  line-height: 1.4;
}
.ui-switch--small .ui-switch__label {
  font-size: 0.8125rem;
}
.ui-switch--large .ui-switch__label {
  font-size: 1rem;
}
.ui-switch__label--left {
  order: -1;
}
.ui-switch--disabled .ui-switch__label {
  color: #9ca3af;
  cursor: not-allowed;
}

/*
 * 내정보 페이지 스타일
 * - 회원 정보 카드 레이아웃
 * - 서비스 현황 그리드 카드
 * - 프로필 아이콘 및 상태 표시
 */
.my-info-container {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1.5rem;
  width: 100%;
}

/* ================================
   회원 정보 카드
================================ */
.member-info-card {
  background: #ffffff;
  border: 1px solid #b1b3b3;
  border-radius: 0.375rem;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1rem;
}
@media (max-width: 900px) {
  .member-info-card {
    padding: 20px;
    gap: 16px;
  }
}

.member-profile {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1rem;
}
@media (max-width: 900px) {
  .member-profile {
    gap: 16px;
  }
}

/* 프로필 섹션 */
.profile-section {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.5rem;
  width: 32.1875rem;
}
@media (max-width: 900px) {
  .profile-section {
    width: 100%;
    gap: 8px;
  }
}

.profile-icon {
  position: relative;
  width: 2.25rem;
  height: 2.25rem;
}
@media (max-width: 900px) {
  .profile-icon {
    width: 36px;
    height: 36px;
  }
}

.profile-bg {
  width: 100%;
  height: 100%;
  background: #6494ce;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.certification-icon {
  position: absolute;
  top: 0.375rem;
  left: 0.375rem;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}
@media (max-width: 900px) {
  .certification-icon {
    top: 6px;
    left: 6px;
    width: 24px;
    height: 24px;
  }
}
.certification-icon .icon {
  font-size: 0.625rem;
  color: #33363d;
  font-weight: 400;
}
@media (max-width: 900px) {
  .certification-icon .icon {
    font-size: 10px;
  }
}

.member-name {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
  color: #000000;
  margin: 0;
}
@media (max-width: 900px) {
  .member-name {
    font-size: 20px;
  }
}

/* 상세 정보 영역 */
.member-details {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1rem;
  padding: 1.5rem 0;
  border-top: 1px solid #b1b3b3;
  border-bottom: 1px solid #b1b3b3;
  margin-bottom: 0.4375rem;
}
@media (max-width: 900px) {
  .member-details {
    gap: 16px;
    padding: 16px 0;
  }
}

.detail-row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 1.5rem;
  width: 100%;
}
@media (max-width: 900px) {
  .detail-row {
    gap: 8px;
  }
}

.detail-label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  width: 11.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .detail-label {
    font-size: 15px;
    width: 130px;
  }
}

.detail-value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  flex: none;
}
@media (max-width: 900px) {
  .detail-value {
    font-size: 15px;
  }
}

/* 대출자번호 복사 버튼 영역 */
.number-with-copy {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.75rem;
  flex: 1;
}
@media (max-width: 900px) {
  .number-with-copy {
    gap: 8px;
  }
}

/* 책이음회원 상태 영역 */
.bookium-status {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.625rem;
  flex: 1;
  width: 44.25rem;
}
@media (max-width: 900px) {
  .bookium-status {
    flex-direction: column;
    gap: 8px;
    width: 100%;
  }
}
.bookium-status .detail-value {
  flex: none;
}

/* 액션 버튼 영역 */
.action-buttons {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  gap: 1rem;
  width: 100%;
}
@media (max-width: 900px) {
  .action-buttons {
    flex-direction: column;
    gap: 12px;
  }
}

/* ================================
   서비스 현황 그리드
   - CSS Grid 레이아웃 사용으로 깔끔한 그리드 구성
   - 반응형: 데스크톱 4열, 모바일 1열
================================ */
.card-header {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.75rem;
}
@media (max-width: 900px) {
  .card-header {
    gap: 8px;
  }
}

.title-section {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .title-section {
    gap: 4px;
  }
}

.title-with-badge {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  margin-bottom: 0.4375rem;
}
@media (max-width: 900px) {
  .title-with-badge {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
.title-with-badge h4 {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .title-with-badge h4 {
    font-size: 15px;
  }
}

.badge {
  background: #4b4d4d;
  color: #ffffff;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  padding: 0 0.5rem;
  height: 1.75rem;
  border-radius: 62.5rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}
@media (max-width: 900px) {
  .badge {
    font-size: 13px;
    padding: 0 6px;
    height: 24px;
  }
}

.subtitle {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  margin: 0;
  height: auto;
}
@media (max-width: 900px) {
  .subtitle {
    font-size: 13px;
    height: auto;
  }
}

.card-content {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.625rem;
  padding-top: 0.5rem;
  border-top: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .card-content {
    padding-top: 8px;
    gap: 8px;
  }
}

.status-numbers {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .status-numbers {
    gap: 4px;
  }
}
.status-numbers .current-count {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.5;
  color: #3c79c2;
}
@media (max-width: 900px) {
  .status-numbers .current-count {
    font-size: 17px;
  }
}
.status-numbers .overdue-count {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.5;
  color: #979a9a;
}
@media (max-width: 900px) {
  .status-numbers .overdue-count {
    font-size: 17px;
  }
}
.status-numbers .divider,
.status-numbers .total-count {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #979a9a;
}
@media (max-width: 900px) {
  .status-numbers .divider,
  .status-numbers .total-count {
    font-size: 13px;
  }
}
.status-numbers .total-count {
  color: #191a1a;
}

.status-indicator {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .status-indicator {
    width: 20px;
    height: 20px;
  }
}
.status-indicator.active {
  background: #00993e;
}
.status-indicator.none {
  background: #000000;
}
.status-indicator.inactive {
  background: #646767;
}

/* ================================
   범례 영역
================================ */
.legend-section {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 1.5rem;
}
@media (max-width: 900px) {
  .legend-section {
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
  }
}

.legend-item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .legend-item {
    gap: 8px;
  }
}

.legend-dot {
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .legend-dot {
    width: 12px;
    height: 12px;
  }
}
.legend-dot.active {
  background: #00993e;
}
.legend-dot.none {
  background: #000000;
}
.legend-dot.inactive {
  background: #646767;
}

.legend-text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
}
@media (max-width: 900px) {
  .legend-text {
    font-size: 13px;
  }
}
.legend-text.none {
  color: #000000;
}

.service-status-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  width: 100%;
  max-width: 61rem;
}
@media (max-width: 900px) {
  .service-status-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}
.service-status-grid .service-card {
  border-radius: 6px;
  border: 1px solid var(--color-gray-gy-30, #b1b3b3);
  background: var(--color-gray-wt, #fff);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1rem;
}
@media (max-width: 900px) {
  .service-status-grid .service-card {
    padding: 16px;
  }
}

.verification-section-custom {
  margin: 0;
}
.verification-section-custom .verification-agreement {
  width: 100%;
}
.verification-section-custom .terms-scroll-box {
  height: auto;
}
.verification-section-custom .info-box {
  height: auto;
  max-height: 13.75rem;
  overflow-y: auto;
}

.verification-form {
  display: flex;
  flex-direction: column;
  width: 100%;
  /* 정보 박스 스타일 - 기존 terms-scroll-box 패턴 재사용 */
  /* 동의 여부 라디오 섹션 - 기존 radio-group 스타일 재사용 */
  /* 회원 정보 표시 섹션 */
  /* 인증 버튼 섹션 */
  /* 모바일 전용 UiRadio 스타일 조정 */
}
.verification-form .info-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .verification-form .info-list {
    gap: 0.375rem;
  }
}
.verification-form .info-list li {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
  position: relative;
  padding-left: 1rem;
}
@media (max-width: 900px) {
  .verification-form .info-list li {
    font-size: 0.8125rem;
    padding-left: 0.875rem;
  }
}
.verification-form .info-list li:before {
  content: "";
  position: absolute;
  left: 0;
  width: 0.375rem;
  height: 0.375rem;
  background: #4b4d4d;
  border-radius: 0.25rem;
}
@media (max-width: 900px) {
  .verification-form .info-list li:before {
    top: 0.5625rem;
    width: 0.3125rem;
    height: 0.3125rem;
  }
}
.verification-form .info-list li.info-note:before {
  content: "※";
  background: none;
  color: #4b4d4d;
  font-size: 1.0625rem;
  top: -0.0625rem;
  left: -0.25rem;
  width: auto;
  height: auto;
}
@media (max-width: 900px) {
  .verification-form .info-list li.info-note:before {
    font-size: 0.9375rem;
    top: -0.0625rem;
    left: -0.1875rem;
  }
}
.verification-form .info-list .text-red {
  color: #d7424e;
}
.verification-form .verification-radio {
  background: #f1f2f2;
  padding: 1.5rem;
  border-radius: 0.625rem;
  display: flex;
  align-items: center;
  gap: 2.5rem;
}
@media (max-width: 900px) {
  .verification-form .verification-radio {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
    border-radius: 0.5rem;
    margin-top: 20px;
  }
}
.verification-form .verification-radio__question {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #d7424e;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .verification-form .verification-radio__question {
    font-size: 0.9375rem;
  }
}
.verification-form .verification-radio .radio-group {
  display: flex;
  gap: 1.5rem;
  align-items: center;
}
@media (max-width: 900px) {
  .verification-form .verification-radio .radio-group {
    gap: 1rem;
  }
}
.verification-form .member-info {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 900px) {
  .verification-form .member-info {
    gap: 0.75rem;
  }
}
.verification-form .member-info__row {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  min-height: 3rem;
}
@media (max-width: 900px) {
  .verification-form .member-info__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    min-height: auto;
  }
}
.verification-form .member-info__label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  width: 11.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .verification-form .member-info__label {
    width: auto;
    font-size: 0.9375rem;
  }
}
.verification-form .member-info__value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  flex: 1;
}
@media (max-width: 900px) {
  .verification-form .member-info__value {
    font-size: 0.9375rem;
  }
}
.verification-form .member-info__input-group {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
}
@media (max-width: 900px) {
  .verification-form .member-info__input-group {
    gap: 0.5rem;
  }
}
.verification-form .member-info__input-group .input-separator {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  color: #8a949e;
}
.verification-form .verification-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.5rem 0;
}
@media (max-width: 900px) {
  .verification-form .verification-actions {
    padding: 1rem 0;
  }
}
@media (max-width: 900px) {
  .verification-form .verification-radio .ui-radio {
    margin: 0;
    max-width: none;
  }
}

.verification-section {
  border-radius: 0.75rem;
  background: #ffffff;
}
.verification-section--info {
  width: 100%;
  border-top: 1px solid #b1b3b3;
  border-bottom: 1px solid #b1b3b3;
  border-left: none;
  border-right: none;
  border-radius: 0;
  padding: 1.5rem 0;
  background: transparent;
  margin-top: 24px;
}
@media (max-width: 900px) {
  .verification-section--info {
    margin-top: 16px;
    padding: 1rem 0;
  }
}

/* ========================================
   통합회원조회 - Member Info Section
   - 회원 정보 표시 컴포넌트
   - Figma 디자인 기반 구현
======================================== */
.member-info-section {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 1rem;
  background: white;
  border-radius: 0.5rem;
}
@media (max-width: 900px) {
  .member-info-section {
    gap: 12px;
  }
}

.member-info-item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 1.5rem;
  padding: 1.5rem 0;
  border-top: 1px solid #b1b3b3;
}
.member-info-item:first-child {
  border-top: none;
  padding-top: 0;
}
.member-info-item:last-child {
  border-bottom: 1px solid #b1b3b3;
  padding-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .member-info-item {
    gap: 16px;
    padding: 16px 0;
    flex-direction: column;
    align-items: flex-start;
  }
  .member-info-item:last-child {
    padding-bottom: 16px;
  }
}
.member-info-item__label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  width: 11.25rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .member-info-item__label {
    width: auto;
    font-size: 15px;
  }
}
.member-info-item__value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  flex: 1;
}
@media (max-width: 900px) {
  .member-info-item__value {
    font-size: 15px;
  }
}
.member-info-item__action {
  flex-shrink: 0;
}
.member-info-item__action .member-info-button {
  background: #ecf2f9 !important;
  color: #3c79c2 !important;
  border: 1px solid #6494ce !important;
  border-radius: 0.375rem !important;
  padding: 0.75rem 0.75rem !important;
  font-size: 0.9375rem !important;
  height: 2.5rem;
  min-width: 4rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.25rem;
}
.member-info-item__action .member-info-button:hover {
  background: #d9e7f7 !important;
}
.member-info-item__action .member-info-button svg {
  width: 0.6875rem;
  height: 0.4375rem;
  transform: rotate(90deg) scaleY(-1);
  color: #3c79c2;
}
@media (max-width: 900px) {
  .member-info-item__action .member-info-button {
    font-size: 13px;
    padding: 8px 10px !important;
    height: 32px;
    min-width: 48px;
  }
}

/* ========================================
   공연장 대관정보 스타일 (com-title-type2)
======================================== */
.section-title-type2 {
  font-size: 2rem;
  font-weight: 700;
  color: #4b4d4d;
  line-height: 1;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .section-title-type2 {
    font-size: 20px;
    margin-bottom: 16px;
  }
}

.info-box .info-list li p {
  margin-top: 10px 0px;
  margin-left: 17px;
}
.info-box .info-list li.list-none {
  padding-left: 0;
}
.info-box .info-list li.list-none strong {
  display: inline-block;
  margin-bottom: 5px;
}
.info-box .info-list li.list-none::before {
  display: none;
}
.info-box .privacy-notice {
  margin-bottom: 1rem;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b4d4d;
}
.info-box .privacy-notice p {
  margin-bottom: 0.5rem;
}
.info-box .privacy-notice p:last-child {
  margin-bottom: 0;
}
.info-box .privacy-notice.privacy-notice--footer {
  margin-top: 1rem;
  margin-bottom: 0;
}
.info-box .privacy-notice .privacy-provider {
  margin-top: 0.75rem;
}
.info-box .privacy-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 0.125rem solid #30619b;
  border-bottom: 0.0625rem solid #cdd1d5;
  margin-bottom: 0;
  font-size: 0.9375rem;
}
@media (max-width: 900px) {
  .info-box .privacy-table {
    font-size: 13px;
  }
}
.info-box .privacy-table thead th {
  background: #ecf2f9;
  border-right: 0.0625rem solid #d8e4f3;
  border-bottom: 0.0625rem solid #cdd1d5;
  padding: 0.75rem 0.5rem;
  font-weight: 700;
  color: #000;
  text-align: center;
  line-height: 1.4;
}
.info-box .privacy-table thead th:last-child {
  border-right: none;
}
@media (max-width: 900px) {
  .info-box .privacy-table thead th {
    padding: 10px 6px;
    font-size: 13px;
  }
}
.info-box .privacy-table tbody td {
  padding: 1rem;
  border-right: 0.0625rem solid #d8e4f3;
  color: #000;
  line-height: 1.5;
  vertical-align: middle;
}
.info-box .privacy-table tbody td:last-child {
  border-right: none;
}
.info-box .privacy-table tbody td.text-center {
  text-align: center;
}
@media (max-width: 900px) {
  .info-box .privacy-table tbody td {
    padding: 12px 10px;
    font-size: 13px;
  }
}
.info-box .privacy-table .privacy-items p {
  margin-bottom: 0.5rem;
}
.info-box .privacy-table .privacy-items p:last-child {
  margin-bottom: 0;
}
.info-box .text-underline {
  text-decoration: underline;
  font-size: 1.0625rem;
}
@media (max-width: 900px) {
  .info-box .text-underline {
    font-size: 14px;
  }
}

/* ========================================
   프로그램신청-상세 페이지 스타일
======================================== */
.program-detail-page {
  display: flex;
  flex-direction: column;
  max-width: 61rem;
  width: 100%;
}
@media (max-width: 900px) {
  .program-detail-page {
    gap: 4px !important;
  }
}
.program-detail-page__header {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.program-detail-page__status {
  border-top: 0.125rem solid #063a74;
  background: white;
  border-bottom: 1px solid #cbcccc;
  padding: 1rem;
  display: flex;
  align-items: center;
}
@media (max-width: 900px) {
  .program-detail-page__status {
    padding: 0.75rem;
  }
}
.program-detail-page__badges {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .program-detail-page__badges {
    gap: 0.25rem;
  }
}
.program-detail-page__title-section {
  background: white;
  border-bottom: 1px solid #cbcccc;
  padding: 1rem;
}
@media (max-width: 900px) {
  .program-detail-page__title-section {
    padding: 0.75rem;
  }
}
.program-detail-page__title {
  font-family: "Pretendard GOV";
  font-size: 1.5rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1.5;
  margin: 0;
}
@media (max-width: 900px) {
  .program-detail-page__title {
    font-size: 1.25rem;
  }
}
.program-detail-page__info {
  background: white;
  border-bottom: 1px solid #cbcccc;
  padding: 1rem;
}
@media (max-width: 900px) {
  .program-detail-page__info {
    padding: 0.75rem;
  }
}
.program-detail-page__info-grid {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .program-detail-page__info-grid {
    gap: 0.5rem;
  }
}
.program-detail-page__info-row {
  display: flex;
  gap: 0.5rem;
  min-height: 1.625rem;
  align-items: flex-start;
}
@media (max-width: 900px) {
  .program-detail-page__info-row {
    gap: 0.375rem;
    min-height: auto;
  }
}
.program-detail-page__info-item {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  flex: 1;
  min-width: 0;
}
.program-detail-page__info-item--single {
  flex: 2;
}
@media (max-width: 900px) {
  .program-detail-page__info-item {
    flex-direction: column;
    gap: 0.25rem;
  }
}
.program-detail-page__info-label {
  font-family: "Pretendard GOV";
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  flex-shrink: 0;
  min-width: 5rem;
}
@media (max-width: 900px) {
  .program-detail-page__info-label {
    min-width: auto;
    font-size: 0.9375rem;
  }
}
.program-detail-page__info-value {
  font-family: "Pretendard GOV";
  font-size: 1.0625rem;
  font-weight: 500;
  color: #4b4d4d;
  line-height: 1.5;
  flex: 1;
}
@media (max-width: 900px) {
  .program-detail-page__info-value {
    font-size: 0.9375rem;
  }
}
.program-detail-page__attachments {
  flex: 1;
}
.program-detail-page__attachment-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .program-detail-page__attachment-list {
    gap: 0.25rem;
  }
}
.program-detail-page__attachment {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
@media (max-width: 900px) {
  .program-detail-page__attachment {
    gap: 0.25rem;
  }
}
.program-detail-page__attachment-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .program-detail-page__attachment-icon {
    width: 1.25rem;
    height: 1.25rem;
  }
}
.program-detail-page__attachment-link {
  font-family: "Pretendard GOV";
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  text-decoration: none;
  flex: 1;
}
.program-detail-page__attachment-link:hover {
  text-decoration: underline;
  color: #3c79c2;
}
.program-detail-page__attachment-link:focus {
  outline: 2px solid #3c79c2;
  outline-offset: 0.125rem;
}
@media (max-width: 900px) {
  .program-detail-page__attachment-link {
    font-size: 0.9375rem;
  }
}
.program-detail-page__no-attachment {
  font-family: "Pretendard GOV";
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1.5;
  font-style: italic;
}
@media (max-width: 900px) {
  .program-detail-page__no-attachment {
    font-size: 0.9375rem;
  }
}
.program-detail-page__content {
  background: white;
  border-bottom: 1px solid #cbcccc;
  padding: 2rem;
  min-height: 12.5rem;
  display: flex;
  align-items: center;
}
@media (max-width: 900px) {
  .program-detail-page__content {
    padding: 0rem;
    min-height: 9.375rem;
  }
}
.program-detail-page__content-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.625rem;
}
.program-detail-page__content-title {
  font-family: "Pretendard GOV";
  font-size: 1.75rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
}
@media (max-width: 900px) {
  .program-detail-page__content-title {
    font-size: 1.25rem;
  }
}
.program-detail-page__content-description {
  font-family: "Pretendard GOV";
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
}
@media (max-width: 900px) {
  .program-detail-page__content-description {
    font-size: 0.9375rem;
  }
}
.program-detail-page__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 1.5rem 0 4rem;
}
@media (max-width: 900px) {
  .program-detail-page__actions {
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 0 2rem;
  }
}
.program-detail-page__action-button {
  min-width: 7.5rem;
}
@media (max-width: 900px) {
  .program-detail-page__action-button {
    width: 100%;
    min-width: 0;
  }
}
@media (max-width: 900px) {
  .program-detail-page {
    gap: 1.5rem;
  }
}

.program-badge--status-pending {
  background: #d8e4f3;
  border: 1px solid #6494ce;
  color: #30619b;
}

.form-field__unit {
  flex: none;
  font-size: 1.0625rem;
}

.form-field__notice {
  font-size: 0.9375rem;
  font-weight: 500;
  color: #d7424e;
  line-height: 1;
  line-height: 1.5;
}

.children-service-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 1rem;
  width: 100%;
}
@media (max-width: 900px) {
  .children-service-grid {
    gap: 12px;
  }
}
.children-service-grid .children-service-grid__button {
  background: #ecf2fe;
  border: 1px solid #256ef4;
  border-radius: 0.375rem;
  height: 3rem;
  padding: 0 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.2s ease;
  min-width: 4.875rem;
}
@media (max-width: 900px) {
  .children-service-grid .children-service-grid__button {
    height: 48px;
    padding: 0 12px;
    border-radius: 6px;
  }
}
.children-service-grid .children-service-grid__button__text {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #0b50d0;
  line-height: 1;
  line-height: 1.5;
  text-align: center;
  font-family: "Pretendard GOV", sans-serif;
}
@media (max-width: 900px) {
  .children-service-grid .children-service-grid__button__text {
    font-size: 16px;
  }
}
.children-service-grid .children-service-grid__button--active {
  background: #244874;
  border-color: #244874;
}
.children-service-grid .children-service-grid__button--active .children-service-grid__button__text {
  color: #ffffff;
}
.children-service-grid .children-service-grid__button:hover {
  background: rgba(236, 242, 254, 0.8);
}
.children-service-grid .children-service-grid__button:hover.children-service-grid__button--active {
  background: rgba(36, 72, 116, 0.9);
}
.children-service-grid .children-service-grid__button:focus {
  outline: 2px solid #256ef4;
  outline-offset: 2px;
}

.com-grid {
  display: grid;
  gap: 1rem;
}
.com-grid-2 {
  grid-template-columns: repeat(2, 1fr);
}
.com-grid-3 {
  grid-template-columns: repeat(3, 1fr);
}
.com-grid-4 {
  grid-template-columns: repeat(4, 1fr);
}
.com-grid-5 {
  grid-template-columns: repeat(5, 1fr);
}
.com-grid-6 {
  grid-template-columns: repeat(6, 1fr);
}
@media (max-width: 900px) {
  .com-grid-4, .com-grid-5, .com-grid-6 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 900px) {
  .com-grid-3, .com-grid-4, .com-grid-5, .com-grid-6 {
    grid-template-columns: repeat(2, 1fr);
  }
}

.com-grid-item {
  width: 100%;
}
.com-grid-item a {
  display: block;
}
.com-grid-item .image {
  border-radius: 0.75rem;
  overflow: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
}
.com-grid-item .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.com-grid-item .image:hover {
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}
.com-grid-item .image:hover img {
  transform: scale(1.05);
}
.com-grid-item .image.h-sm {
  height: 7.5rem;
}
@media (max-width: 900px) {
  .com-grid-item .image.h-sm {
    height: auto;
  }
}
.com-grid-item .image.h-md {
  height: 11.25rem;
}
@media (max-width: 900px) {
  .com-grid-item .image.h-md {
    height: auto;
  }
}
.com-grid-item .image.h-lg {
  height: 14.125rem;
}
@media (max-width: 900px) {
  .com-grid-item .image.h-lg {
    height: auto;
  }
}
.com-grid-item .image.h-xlg {
  height: 15.3125rem;
}
@media (max-width: 900px) {
  .com-grid-item .image.h-xlg {
    height: auto;
  }
}
.com-grid-item .image.h-xl {
  height: 17.5rem;
}
@media (max-width: 900px) {
  .com-grid-item .image.h-xl {
    height: auto;
  }
}
.com-grid-item .title {
  margin-top: 10px;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1;
  line-height: 1.5;
  text-align: center;
}

.form-field__participant-names {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
}
.form-field__participant-names .ui-input-container {
  flex: 0 0 calc((100% - 2.5rem) / 5);
}
@media (max-width: 900px) {
  .form-field__participant-names .ui-input-container {
    flex: 0 0 calc((100% - 1.25rem) / 3);
  }
}
@media (max-width: 900px) {
  .form-field__participant-names .ui-input-container {
    flex: 0 0 calc((100% - 0.625rem) / 2);
  }
}

.usage-guide-section .usage-guide-item {
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item {
    margin-bottom: 20px;
  }
}
.usage-guide-section .usage-guide-item:last-child {
  margin-bottom: 0;
}
.usage-guide-section .usage-guide-item .usage-guide-item__title {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
  line-height: 1.5;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item .usage-guide-item__title {
    font-size: 15px;
    margin-bottom: 10px;
  }
}
.usage-guide-section .usage-guide-item .usage-guide-item__title .usage-guide-item__number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  background: #3c79c2;
  color: #ffffff;
  border-radius: 50%;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 1;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item .usage-guide-item__title .usage-guide-item__number {
    width: 20px;
    height: 20px;
    font-size: 13px;
  }
}
.usage-guide-section .usage-guide-item .usage-guide-item__list {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: list-counter;
}
.usage-guide-section .usage-guide-item .usage-guide-item__list li {
  position: relative;
  padding-left: 1.75rem;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1;
  line-height: 1.6;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item .usage-guide-item__list li {
    font-size: 14px;
    padding-left: 20px;
    margin-bottom: 6px;
  }
}
.usage-guide-section .usage-guide-item .usage-guide-item__list li:last-child {
  margin-bottom: 0;
}
.usage-guide-section .usage-guide-item .usage-guide-item__list li::before {
  content: "";
  position: absolute;
  left: 0.5rem;
  top: 0.625rem;
  width: 0.25rem;
  height: 0.25rem;
  background: #4b4d4d;
  border-radius: 50%;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item .usage-guide-item__list li::before {
    left: 6px;
    top: 8px;
    width: 3px;
    height: 3px;
  }
}
.usage-guide-section .usage-guide-item .usage-guide-item__list li.flex-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding-left: 0;
}
.usage-guide-section .usage-guide-item .usage-guide-item__list li.flex-item::before {
  position: static;
  flex-shrink: 0;
}
.usage-guide-section .usage-guide-item .usage-guide-item__list li.ml12 {
  padding-left: 2.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item .usage-guide-item__list li.ml12 {
    padding-left: 32px;
  }
}
.usage-guide-section .usage-guide-item .usage-guide-item__list li.ml24 {
  padding-left: 3.25rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item .usage-guide-item__list li.ml24 {
    padding-left: 44px;
  }
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li {
  counter-increment: list-counter;
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li::before {
  content: "①";
  position: absolute;
  left: 0;
  top: 4px;
  width: auto;
  height: auto;
  background: transparent;
  border: none;
  border-radius: 0;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li::before {
    font-size: 14px;
  }
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(1)::before {
  content: "①";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(2)::before {
  content: "②";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(3)::before {
  content: "③";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(4)::before {
  content: "④";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(5)::before {
  content: "⑤";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(6)::before {
  content: "⑥";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(7)::before {
  content: "⑦";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(8)::before {
  content: "⑧";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(9)::before {
  content: "⑨";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li:nth-child(10)::before {
  content: "⑩";
}
.usage-guide-section .usage-guide-item .usage-guide-item__list--numbered li.flex-item::before {
  position: static;
}
.usage-guide-section .usage-guide-subitem {
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding-left: 0.75rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem {
    margin-top: 12px;
    margin-bottom: 12px;
    padding-left: 8px;
  }
}
.usage-guide-section .usage-guide-subitem:last-child {
  margin-bottom: 0;
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__title {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #191a1a;
  line-height: 1;
  line-height: 1.5;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__title {
    font-size: 14px;
    margin-bottom: 6px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__text {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1;
  line-height: 1.5;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__text {
    font-size: 14px;
    margin-bottom: 6px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: list-counter;
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-1 {
  padding-left: 0.75rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-1 {
    padding-left: 8px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-1 li {
  padding-left: 1.75rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-1 li {
    padding-left: 20px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-1 li::before {
  content: "";
  left: 0.5rem;
  top: 0.6875rem;
  width: 0.25rem;
  height: 0.25rem;
  background: transparent;
  border: 1px solid #4b4d4d;
  border-radius: 0.25rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-1 li::before {
    left: 6px;
    top: 9px;
    width: 3px;
    height: 3px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-2 {
  padding-left: 1.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-2 {
    padding-left: 16px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-2 li {
  padding-left: 1.75rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-2 li {
    padding-left: 20px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-2 li::before {
  content: "";
  left: 0.5rem;
  top: 0.8125rem;
  width: 0.375rem;
  height: 0.075rem;
  background: #4b4d4d;
  border-radius: 0;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list.indent-2 li::before {
    left: 6px;
    top: 11px;
    width: 5px;
    height: 1px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li {
  position: relative;
  padding-left: 1.75rem;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1;
  line-height: 1.6;
  margin-bottom: 0.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li {
    font-size: 14px;
    padding-left: 20px;
    margin-bottom: 6px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li:last-child {
  margin-bottom: 0;
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li::before {
  content: "";
  position: absolute;
  left: 0.5rem;
  top: 0.625rem;
  width: 0.25rem;
  height: 0.25rem;
  background: #4b4d4d;
  border-radius: 50%;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li::before {
    left: 6px;
    top: 8px;
    width: 3px;
    height: 3px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-1 {
  padding-left: 2.5rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-1 {
    padding-left: 32px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-1::before {
  content: "";
  left: 1.25rem;
  top: 0.6875rem;
  width: 0.25rem;
  height: 0.25rem;
  background: transparent;
  border: 1px solid #4b4d4d;
  border-radius: 0.25rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-1::before {
    left: 16px;
    top: 9px;
    width: 3px;
    height: 3px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-2 {
  padding-left: 3.25rem;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-2 {
    padding-left: 44px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-2::before {
  content: "";
  left: 2rem;
  top: 0.8125rem;
  width: 0.375rem;
  height: 0.075rem;
  background: #4b4d4d;
  border-radius: 0;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list li.indent-2::before {
    left: 28px;
    top: 11px;
    width: 5px;
    height: 1px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li {
  counter-increment: list-counter;
  display: flex;
  align-items: center;
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li::before {
  content: "①";
  position: absolute;
  left: 0;
  top: 4px;
  width: auto;
  height: auto;
  background: transparent;
  border: none;
  border-radius: 0;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1;
}
@media (max-width: 900px) {
  .usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li::before {
    font-size: 14px;
  }
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(1)::before {
  content: "①";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(2)::before {
  content: "②";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(3)::before {
  content: "③";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(4)::before {
  content: "④";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(5)::before {
  content: "⑤";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(6)::before {
  content: "⑥";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(7)::before {
  content: "⑦";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(8)::before {
  content: "⑧";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(9)::before {
  content: "⑨";
}
.usage-guide-section .usage-guide-subitem .usage-guide-subitem__list--numbered li:nth-child(10)::before {
  content: "⑩";
}

.button-list-vertical {
  display: flex;
  flex-direction: column;
}
@media (max-width: 900px) {
  .button-list-vertical {
    gap: 12px;
  }
}

.library-banner {
  position: relative;
  height: 260px;
  width: 100%;
  margin-bottom: 2rem;
  border-radius: 0.75rem;
  overflow: hidden;
}
@media (max-width: 900px) {
  .library-banner {
    height: 180px;
    margin-bottom: 20px;
    border-radius: 8px;
  }
}
.library-banner__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.library-banner__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 0.75rem;
}
@media (max-width: 900px) {
  .library-banner__overlay {
    border-radius: 8px;
  }
}
.library-banner__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: white;
  width: 100%;
  padding: 0 16px;
}
.library-banner__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  margin-bottom: 0.25rem;
}
@media (max-width: 900px) {
  .library-banner__title {
    flex-direction: column;
    gap: 0;
  }
}
.library-banner__title-main {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  line-height: 1.5;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .library-banner__title-main {
    font-size: 24px;
  }
}
.library-banner__title-sub {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.5;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .library-banner__title-sub {
    font-size: 16px;
  }
}
.library-banner__subtitle {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  line-height: 1.5;
  color: #fbbc53;
  margin-bottom: 0.25rem;
}
@media (max-width: 900px) {
  .library-banner__subtitle {
    font-size: 20px;
    margin-bottom: 4px;
  }
}
.library-banner__name {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 2.75rem;
  line-height: 1.5;
  color: #00b248;
}
.library-banner__name span {
  font-size: 35px;
  font-weight: 700;
  color: #fff;
}
@media (max-width: 900px) {
  .library-banner__name {
    font-size: 22px;
  }
}

.library-purpose {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 900px) {
  .library-purpose {
    gap: 12px;
  }
}
.library-purpose__item {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}
@media (max-width: 900px) {
  .library-purpose__item {
    gap: 8px;
  }
}
.library-purpose__icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .library-purpose__icon {
    width: 20px;
    height: 20px;
  }
}
.library-purpose__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
  flex: 1;
  position: relative;
  top: -2px;
}
@media (max-width: 900px) {
  .library-purpose__text {
    font-size: 15px;
  }
}

.library-facility-section {
  margin-bottom: 2rem;
}
.library-facility-section__header {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  margin-bottom: 1.5rem;
}
.library-facility-section__icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}
.library-facility-section__title {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 1;
  color: #191a1a;
}
@media (max-width: 900px) {
  .library-facility-section__title {
    font-size: 22px;
  }
}

.library-info-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.library-info-list__item {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  padding-left: 1.25rem;
  position: relative;
}
.library-info-list__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  background: #191a1a;
  border-radius: 4px;
}
.library-info-list__label {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .library-info-list__label {
    font-size: 15px;
  }
}
.library-info-list__value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #4b4d4d;
}
@media (max-width: 900px) {
  .library-info-list__value {
    font-size: 15px;
  }
}

.scroll-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 900px) {
  .scroll-x {
    width: 100%;
  }
}

.facility-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid #d8e4f3;
}
@media (max-width: 900px) {
  .facility-table {
    min-width: 700px;
  }
}
.facility-table thead {
  background: #ecf2f9;
}
.facility-table thead th {
  padding: 0.5rem 1rem;
  border: 1px solid #d8e4f3;
  border-top: 0;
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
  text-align: center;
}
@media (max-width: 900px) {
  .facility-table thead th {
    font-size: 15px;
    padding: 8px 12px;
  }
}
.facility-table tbody td {
  padding: 0.75rem 1rem;
  border: 1px solid #cbcccc;
  border-top: 0;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #4b4d4d;
  text-align: center;
  vertical-align: middle;
}
.facility-table tbody td.text-left {
  text-align: left;
}
@media (max-width: 900px) {
  .facility-table tbody td {
    font-size: 15px;
    padding: 10px 12px;
  }
}

.com-inbo-type2 {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  padding: 1rem;
  background: #ecf2f9;
  border: 1px solid #ecf2f9;
  border-radius: 0.5rem;
}
@media (max-width: 900px) {
  .com-inbo-type2 {
    padding: 12px;
  }
}
.com-inbo-type2__icon {
  width: 1.25rem;
  height: 1.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.com-inbo-type2__reference {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #191a1a;
}
.com-inbo-type2__text {
  flex: 1;
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #18304d;
  margin: 0;
}
@media (max-width: 900px) {
  .com-inbo-type2__text {
    font-size: 15px;
  }
}
.com-inbo-type2__text-group {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.com-inbo-type2__text-group .com-inbo-type2__text {
  margin: 0;
}
.com-inbo-type2--notice {
  background: #eef2f7;
  border: 1px solid #d6e0eb;
  border-radius: 0.75rem;
  padding: 1rem;
}
@media (max-width: 900px) {
  .com-inbo-type2--notice {
    padding: 12px;
  }
}
.com-inbo-type2--notice .com-inbo-type2__text {
  color: #3c79c2;
}

.marathon-progress {
  background: #f1f2f2;
  padding: 1.625rem 1rem;
  border-radius: 0.375rem;
  margin-bottom: 2.5rem;
  position: relative;
  height: 200px;
}
@media (max-width: 900px) {
  .marathon-progress {
    padding: 20px 12px;
    height: 180px;
    margin-bottom: 24px;
  }
}
.marathon-progress__track {
  position: relative;
  margin: 0 4.375rem;
  padding-top: 6rem;
}
@media (max-width: 900px) {
  .marathon-progress__track {
    margin: 0px;
    padding-top: 80px;
  }
}
.marathon-progress__bar {
  width: 100%;
  height: 10px;
  background: #cbcccc;
  border-radius: 5px;
  position: relative;
}
.marathon-progress__filled {
  position: absolute;
  bottom: 37px;
  left: 0;
  height: 10px;
  background: linear-gradient(90deg, #3c79c2 0%, #6494ce 100%);
  border-radius: 5px;
  transition: width 0.3s ease;
}
@media (max-width: 900px) {
  .marathon-progress__filled {
    bottom: 29px;
  }
}
.marathon-progress__labels {
  display: flex;
  justify-content: space-between;
  margin-top: 0.75rem;
  position: relative;
}
@media (max-width: 900px) {
  .marathon-progress__labels {
    margin-top: 8px;
  }
}
.marathon-progress__label {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
}
@media (max-width: 900px) {
  .marathon-progress__label {
    font-size: 14px;
  }
}
.marathon-progress__runner {
  position: absolute;
  top: 0;
  left: 0;
  width: 140px;
  height: 80px;
  transition: left 0.3s ease;
  transform: translateX(-70px);
}
@media (max-width: 900px) {
  .marathon-progress__runner {
    width: 100px;
    height: 60px;
    transform: translateX(-50px);
  }
}
.marathon-progress__runner-badge {
  position: relative;
  width: 140px;
  height: 80px;
}
@media (max-width: 900px) {
  .marathon-progress__runner-badge {
    width: 100px;
    height: 60px;
  }
}
.marathon-progress__runner-badge svg {
  width: 100%;
  height: 100%;
}
.marathon-progress__runner-content {
  position: absolute;
  top: 10px;
  left: 21px;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
@media (max-width: 900px) {
  .marathon-progress__runner-content {
    top: 6px;
    left: 16px;
  }
}
.marathon-progress__runner-top {
  display: flex;
  align-items: center;
  gap: 0.3125rem;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .marathon-progress__runner-top {
    gap: 4px;
  }
}
.marathon-progress__runner-icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .marathon-progress__runner-icon {
    width: 18px;
    height: 18px;
  }
}
.marathon-progress__runner-icon img {
  width: 100%;
  height: 100%;
}
.marathon-progress__runner-name {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #ffffff;
  white-space: nowrap;
}
.marathon-progress__runner-name span {
  font-weight: 400;
}
@media (max-width: 900px) {
  .marathon-progress__runner-name {
    font-size: 14px;
  }
}
.marathon-progress__runner-distance {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #ffffff;
  text-align: center;
  width: 100%;
  margin-top: 0.5rem;
  position: relative;
  left: -6px;
  top: -4px;
}
@media (max-width: 900px) {
  .marathon-progress__runner-distance {
    font-size: 14px;
    margin-top: 4px;
  }
}
.marathon-progress__flag {
  position: absolute;
  top: 2rem;
  right: -19px;
}
@media (max-width: 900px) {
  .marathon-progress__flag {
    top: 20px;
    right: -11px;
  }
}
.marathon-progress__flag img {
  width: 40px;
  height: 40px;
}
@media (max-width: 900px) {
  .marathon-progress__flag img {
    width: 32px;
    height: 32px;
  }
}

.marathon-status-card {
  background: #ffffff;
  border: 1px solid #b1b3b3;
  border-radius: 0.375rem;
  padding: 2rem;
  margin-bottom: 2.5rem;
  display: flex;
  gap: 2.25rem;
}
@media (max-width: 900px) {
  .marathon-status-card {
    padding: 20px;
    margin-bottom: 24px;
    flex-direction: column;
    gap: 20px;
  }
}
.marathon-status-card__header {
  display: flex;
  gap: 0.5rem;
  padding-right: 2.25rem;
  border-right: 1px solid #b1b3b3;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .marathon-status-card__header {
    border-right: none;
    border-bottom: 1px solid #b1b3b3;
    padding-right: 0;
    padding-bottom: 16px;
    justify-content: flex-start;
  }
}
.marathon-status-card__icon {
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  position: relative;
}
@media (max-width: 900px) {
  .marathon-status-card__icon {
    width: 30px;
    height: 30px;
  }
}
.marathon-status-card__icon-bg {
  width: 2.25rem;
  height: 2.25rem;
  position: absolute;
  left: 0;
  top: 0;
}
@media (max-width: 900px) {
  .marathon-status-card__icon-bg {
    width: 30px;
    height: 30px;
  }
}
.marathon-status-card__icon-bg img {
  display: block;
  width: 100%;
  height: 100%;
}
.marathon-status-card__icon-image {
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  left: 0.375rem;
  top: 0.375rem;
}
@media (max-width: 900px) {
  .marathon-status-card__icon-image {
    width: 18px;
    height: 18px;
    left: 6px;
    top: 6px;
  }
}
.marathon-status-card__icon-image img {
  display: block;
  width: 100%;
  height: 100%;
}
.marathon-status-card__title {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.5;
  color: #000000;
  margin: 0;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .marathon-status-card__title {
    font-size: 20px;
  }
}
.marathon-status-card__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex: 1;
  padding: 1.5rem 0;
}
@media (max-width: 900px) {
  .marathon-status-card__content {
    gap: 12px;
    padding: 0;
  }
}
.marathon-status-card__row {
  display: flex;
  gap: 1rem;
}
@media (max-width: 900px) {
  .marathon-status-card__row {
    flex-direction: column;
    gap: 12px;
  }
}
.marathon-status-card__item {
  flex: 1;
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
}
@media (max-width: 900px) {
  .marathon-status-card__item {
    gap: 16px;
  }
}
.marathon-status-card__label {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
  width: 120px;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .marathon-status-card__label {
    font-size: 15px;
    width: 100px;
  }
}
.marathon-status-card__value {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 400;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #4b4d4d;
  flex: 1;
}
@media (max-width: 900px) {
  .marathon-status-card__value {
    font-size: 15px;
  }
}

.detail-section {
  margin-bottom: 2.5rem;
}
@media (max-width: 900px) {
  .detail-section {
    margin-bottom: 24px;
  }
}
.detail-section__title {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 1;
  color: #191a1a;
  margin-bottom: 0.75rem;
  padding: 0.75rem 0;
}
@media (max-width: 900px) {
  .detail-section__title {
    font-size: 22px;
    margin-bottom: 8px;
    padding: 8px 0;
  }
}
.detail-section__content {
  border-top: 1px solid #b1b3b3;
  border-bottom: 1px solid #b1b3b3;
  padding: 1.5rem 0;
}
@media (max-width: 900px) {
  .detail-section__content {
    padding: 16px 0;
  }
}
.detail-section__row {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.detail-section__row:last-child {
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .detail-section__row {
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
  }
}
.detail-section__item {
  flex: 1;
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
}
.detail-section__item--full {
  flex: 1 1 100%;
}
@media (max-width: 900px) {
  .detail-section__item {
    gap: 16px;
  }
}
.detail-section__label {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
  width: 120px;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .detail-section__label {
    font-size: 15px;
    width: 100px;
  }
}
.detail-section__value {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 400;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #4b4d4d;
  flex: 1;
}
@media (max-width: 900px) {
  .detail-section__value {
    font-size: 15px;
  }
}

.marathon-detail-page__actions {
  display: flex;
  gap: 1rem;
  justify-content: center;
  padding: 4rem 0;
}
@media (max-width: 900px) {
  .marathon-detail-page__actions {
    flex-direction: column;
    gap: 12px;
    padding: 32px 0;
  }
}

.library-directions-title {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 1;
  color: #191a1a;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .library-directions-title {
    font-size: 22px;
    margin-bottom: 20px;
  }
}

.subtab-panel {
  display: none;
}
.subtab-panel.active {
  display: block;
}

.map-container {
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .map-container {
    margin-bottom: 20px;
  }
}

.map-placeholder {
  width: 100%;
  height: 480px;
  border: 1px solid #cbcccc;
  display: flex;
  align-items: center;
  justify-content: center;
  background: white;
  position: relative;
  overflow: hidden;
  /* 카카오맵 컨테이너 스타일 */
  /* 분류별 지도(NGII) 스타일 */
}
@media (max-width: 900px) {
  .map-placeholder {
    height: 300px;
  }
}
.map-placeholder .map-placeholder .root_daum_roughmap {
  width: 100% !important;
  height: 100% !important;
}
.map-placeholder .map-placeholder--ngii {
  padding: 0;
}
.map-placeholder .ngii-map-wrapper {
  width: 100% !important;
  height: 480px !important;
  position: relative;
}
@media (max-width: 900px) {
  .map-placeholder .ngii-map-wrapper {
    height: 300px !important;
  }
}
.map-placeholder .ngii-map-toolbar {
  position: absolute;
  top: 170px;
  right: 20px;
  width: 54px;
  height: 200px;
  z-index: 1000000;
}
@media (max-width: 900px) {
  .map-placeholder .ngii-map-toolbar {
    top: 80px;
    right: 10px;
    width: 44px;
    height: 150px;
  }
}
.map-placeholder .ngii-toolbar-inner {
  width: 39px;
  margin-top: 10px;
  margin-left: 30px;
}
@media (max-width: 900px) {
  .map-placeholder .ngii-toolbar-inner {
    width: 34px;
    margin-left: 10px;
    margin-top: 5px;
    position: relative;
    top: 56px;
  }
  .map-placeholder .ngii-toolbar-inner img {
    max-width: 100%;
    height: auto;
  }
}
.map-placeholder__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  color: #4b4d4d;
  margin: 0;
}
@media (max-width: 900px) {
  .map-placeholder__text {
    font-size: 15px;
  }
}

.address-info-box {
  background: #ecf2f9;
  padding: 0.5rem 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .address-info-box {
    padding: 12px 16px;
    margin-bottom: 20px;
  }
}
.address-info-box__address {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
  text-align: center;
  margin: 0;
}
@media (max-width: 900px) {
  .address-info-box__address {
    font-size: 15px;
  }
}
.address-info-box__contact {
  display: flex;
  gap: 2rem;
  align-items: center;
}
@media (max-width: 900px) {
  .address-info-box__contact {
    gap: 20px;
    flex-direction: column;
  }
}

.contact-item {
  display: flex;
  gap: 0.625rem;
  align-items: center;
}
.contact-item__label {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #18304d;
}
@media (max-width: 900px) {
  .contact-item__label {
    font-size: 15px;
  }
}
.contact-item__value {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
}
@media (max-width: 900px) {
  .contact-item__value {
    font-size: 15px;
  }
}

.transportation-section {
  display: flex;
  flex-direction: column;
}

.transportation-item {
  display: flex;
  gap: 2rem;
  align-items: center;
  padding: 2rem 3.75rem;
  border-top: 1px solid #cbcccc;
  border-bottom: 1px solid #cbcccc;
  background: white;
}
.transportation-item:not(:first-child) {
  border-top: 0;
}
@media (max-width: 900px) {
  .transportation-item {
    gap: 20px;
    padding: 20px 16px;
    flex-direction: column;
    align-items: flex-start;
  }
}
.transportation-item__icon {
  width: 72px;
  height: 72px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .transportation-item__icon {
    width: 56px;
    height: 56px;
  }
}
.transportation-item__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.transportation-item__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 900px) {
  .transportation-item__content {
    gap: 12px;
  }
}
.transportation-item__title {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.5;
  margin: 0;
}
@media (max-width: 900px) {
  .transportation-item__title {
    font-size: 20px;
  }
}
.transportation-item__title--subway {
  color: #7fb95e;
}
.transportation-item__title--bus {
  color: #3c79c2;
}

.transportation-routes {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 900px) {
  .transportation-routes {
    gap: 12px;
  }
}

.transportation-route {
  display: flex;
  gap: 1rem;
  align-items: center;
}
@media (max-width: 900px) {
  .transportation-route {
    gap: 12px;
    flex-direction: column;
    align-items: flex-start;
  }
}
.transportation-route__badge {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-shrink: 0;
}
.transportation-route__arrow {
  width: 1.5rem;
  height: 1.5rem;
}
@media (max-width: 900px) {
  .transportation-route__arrow {
    width: 20px;
    height: 20px;
  }
}
.transportation-route__line {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  white-space: normal;
}
@media (max-width: 900px) {
  .transportation-route__line {
    font-size: 15px;
  }
}
.transportation-route__line--incheon {
  color: #7fb95e;
}
.transportation-route__line--bus {
  color: #3c79c2;
}
.transportation-route__info {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
  font-weight: 400;
}
@media (max-width: 900px) {
  .transportation-route__info {
    font-size: 15px;
  }
}

.root_daum_roughmap_landing {
  width: 100% !important;
}

.sub-layout__content-inner-body:has(.lib-box-info),
.sub-layout__content-inner-body:has(.lib-box-item) {
  gap: 0.375rem;
}
@media (max-width: 900px) {
  .sub-layout__content-inner-body:has(.lib-box-info),
  .sub-layout__content-inner-body:has(.lib-box-item) {
    gap: 0.125rem;
  }
}

.lib-box-info {
  background-color: #f1f2f2;
  border: 1px solid #cbcccc;
  border-radius: 0.75rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.lib-box-info__header {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.lib-box-info__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.lib-box-info__title {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .lib-box-info__title {
    font-size: 15px;
  }
}
.lib-box-info__content {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-left: 1.75rem;
}
@media (max-width: 900px) {
  .lib-box-info__content {
    padding-left: 1.25rem;
  }
}
.lib-box-info__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  margin: 0;
}
@media (max-width: 900px) {
  .lib-box-info__text {
    font-size: 15px;
  }
}
.lib-box-info__divider {
  height: 0;
  border-bottom: 1px solid #979a9a;
  margin: 0;
}
.lib-box-info__notice {
  display: flex;
  gap: 0.25rem;
  align-items: flex-start;
}
.lib-box-info__notice-icon {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #3c79c2;
  min-width: 1rem;
  text-align: center;
}
@media (max-width: 900px) {
  .lib-box-info__notice-icon {
    font-size: 15px;
  }
}
.lib-box-info__notice-text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #3c79c2;
  margin: 0;
}
@media (max-width: 900px) {
  .lib-box-info__notice-text {
    font-size: 15px;
  }
}

.lib-box-item {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}
.lib-box-item__bullet {
  width: 1.5rem;
  height: 1.625rem;
  display: flex;
  align-items: center;
  padding-left: 0.5rem;
}
.lib-box-item__bullet::before {
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  background-color: #4b4d4d;
  border-radius: 0.25rem;
}
.lib-box-item__content {
  flex: 1;
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-wrap: wrap;
  line-height: 1.5;
}
.lib-box-item__label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
}
@media (max-width: 900px) {
  .lib-box-item__label {
    font-size: 15px;
  }
}
.lib-box-item__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
}
@media (max-width: 900px) {
  .lib-box-item__text {
    font-size: 15px;
  }
}

.lib-box-notice {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.lib-box-notice__item {
  display: flex;
  gap: 0.25rem;
  align-items: flex-start;
}
.lib-box-notice__item--primary .lib-box-notice__icon,
.lib-box-notice__item--primary .lib-box-notice__text {
  color: #3c79c2;
}
.lib-box-notice__item--primary .lib-box-notice__text {
  font-weight: 700;
}
.lib-box-notice__icon {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  min-width: 1.5rem;
  text-align: center;
}
@media (max-width: 900px) {
  .lib-box-notice__icon {
    font-size: 15px;
  }
}
.lib-box-notice__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .lib-box-notice__text {
    font-size: 15px;
  }
}

.lib-box-sublist {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.lib-box-sublist__item {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  padding-left: 1.5rem;
}
.lib-box-sublist__item--sub {
  padding-left: 2.5rem;
}
@media (max-width: 900px) {
  .lib-box-sublist__item {
    padding-left: 1.25rem;
  }
  .lib-box-sublist__item--sub {
    padding-left: 2rem;
  }
}
.lib-box-sublist__bullet {
  width: 1.25rem;
  height: 1.625rem;
  display: flex;
  align-items: center;
  padding-left: 0.5rem;
}
.lib-box-sublist__bullet--dash::before {
  content: "";
  width: 0.375rem;
  height: 1.2px;
  background-color: #4b4d4d;
}
.lib-box-sublist__bullet--circle {
  width: 1rem;
  height: 1.4375rem;
}
.lib-box-sublist__bullet--circle::before {
  content: "";
  width: 0.25rem;
  height: 0.25rem;
  border: 1px solid #646767;
  border-radius: 0.25rem;
}
.lib-box-sublist__content {
  flex: 1;
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  flex-wrap: wrap;
}
.lib-box-sublist__label {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .lib-box-sublist__label {
    font-size: 15px;
  }
}
.lib-box-sublist__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .lib-box-sublist__text {
    font-size: 15px;
  }
}

.file-upload {
  background: #ffffff;
  border: 1px solid #b1b8be;
  border-radius: 0.75rem;
  padding: 1.5rem;
}
@media (max-width: 900px) {
  .file-upload {
    padding: 12px;
  }
}
.file-upload__header {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.file-upload__title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #131416;
  line-height: 1;
  line-height: 1.5;
}
.file-upload__description {
  font-size: 1.0625rem;
  font-weight: 500;
  color: #464c53;
  line-height: 1;
  line-height: 1.5;
}
.file-upload__dropzone {
  background: #e6e8ea;
  border-radius: 0.75rem;
  padding: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) {
  .file-upload__dropzone {
    padding: 32px 24px;
    gap: 16px;
  }
}
.file-upload__dropzone-text {
  font-size: 1.1875rem;
  font-weight: 400;
  color: #1e2124;
  line-height: 1;
  line-height: 1.5;
  text-align: center;
}
@media (max-width: 900px) {
  .file-upload__dropzone-text {
    font-size: 1.0625rem;
  }
}
.file-upload__button {
  background: #3c79c2;
  color: #ffffff;
  border: none;
  border-radius: 0.375rem;
  padding: 0 1rem;
  height: 3rem;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #ffffff;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s;
}
.file-upload__button:hover {
  background: rgb(53.9763779528, 108.8523622047, 174.5236220472);
}
@media (max-width: 900px) {
  .file-upload__button {
    height: 44px;
    font-size: 15px;
  }
}
.file-upload__list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.file-upload__count {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #1e2124;
  line-height: 1;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .file-upload__count {
    font-size: 15px;
  }
}
.file-upload__count-current {
  color: #0b50d0;
}
.file-upload__count-total {
  color: #1e2124;
}
.file-upload__delete-all {
  background: #ffffff;
  border: 1px solid #58616a;
  border-radius: 0.25rem;
  padding: 0 0.625rem;
  height: 2rem;
  display: flex;
  align-items: center;
  gap: 0.125rem;
  font-size: 0.9375rem;
  font-weight: 400;
  color: #1e2124;
  line-height: 1;
  cursor: pointer;
  transition: all 0.2s;
}
.file-upload__delete-all:hover {
  background: #f5f6f7;
}
.file-upload__delete-all svg {
  width: 0.6875rem;
  height: 0.6875rem;
}
.file-upload__items {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.file-upload__item {
  background: #ffffff;
  border: 1px solid #cdd1d5;
  border-radius: 0.5rem;
  padding: 1rem;
}
.file-upload__item:hover {
  border: 1px solid #3c79c2;
}
.file-upload__item--error {
  background: #fdefec;
  border: 2px solid #de3412;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.file-upload__item--error:hover {
  border: 2px solid #de3412;
}
@media (max-width: 900px) {
  .file-upload__item {
    padding: 12px;
  }
}
.file-upload__item-content {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.file-upload__item-name {
  flex: 1;
  font-size: 1.0625rem;
  font-weight: 500;
  color: #131416;
  line-height: 1;
  line-height: 1.5;
  cursor: pointer;
  user-select: none;
}
@media (max-width: 900px) {
  .file-upload__item-name {
    font-size: 15px;
  }
}
.file-upload__item-spinner {
  flex-shrink: 0;
}
.file-upload__item-spinner svg {
  width: 1.25rem;
  height: 1.25rem;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.file-upload__item-check {
  flex-shrink: 0;
}
.file-upload__item-check svg {
  width: 1.0625rem;
  height: 1.0625rem;
}
.file-upload__item-delete {
  background: transparent;
  border: none;
  padding: 0.125rem;
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #1e2124;
  line-height: 1;
  cursor: pointer;
  transition: color 0.2s;
}
.file-upload__item-delete:hover {
  color: #3c79c2;
}
.file-upload__item-delete svg {
  width: 1.0625rem;
  height: 1.0625rem;
}
@media (max-width: 900px) {
  .file-upload__item-delete {
    font-size: 15px;
  }
}
.file-upload__item-error {
  display: flex;
  align-items: flex-start;
  gap: 0.25rem;
}
.file-upload__item-error svg {
  width: 1.0625rem;
  height: 1.0625rem;
  flex-shrink: 0;
  margin-top: 0.25rem;
}
.file-upload__item-error-text {
  font-size: 1.0625rem;
  font-weight: 500;
  color: #bd2c0f;
  line-height: 1;
  line-height: 1.5;
  flex: 1;
}
@media (max-width: 900px) {
  .file-upload__item-error-text {
    font-size: 15px;
  }
}
.file-upload__item-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.file-upload__item-action {
  background: transparent;
  border: none;
  padding: 0.125rem;
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #1e2124;
  line-height: 1;
  cursor: pointer;
  transition: color 0.2s;
}
.file-upload__item-action:hover {
  color: #3c79c2;
}
.file-upload__item-action svg {
  width: 1.0625rem;
  height: 1.0625rem;
}
@media (max-width: 900px) {
  .file-upload__item-action {
    font-size: 15px;
  }
}

.file-upload__helper-text {
  display: flex;
  align-items: center;
  gap: 7px;
}

.book-info.clearfix {
  padding-bottom: 10px;
  display: flex;
  flex-direction: row;
  gap: 20px;
}
@media (max-width: 900px) {
  .book-info.clearfix {
    gap: 0px;
  }
}
.book-info.clearfix .book-cover {
  width: 130px;
}
.book-info.clearfix .book-cover img {
  width: 100%;
}
.book-info.clearfix .book-details {
  flex: 1;
}
.book-info.clearfix .book-details table {
  border-collapse: collapse;
}
.book-info.clearfix .book-details table tr th {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
}
.book-info.clearfix .book-details table tr td {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1;
  padding: 12px;
}

.delivery-application-detail {
  width: 100%;
}
.delivery-application-detail .application-info {
  margin-bottom: 0;
}
.delivery-application-detail .application-info .info-row {
  padding: 0;
  margin: 0;
  display: flex;
  border-bottom: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .delivery-application-detail .application-info .info-row {
    flex-direction: column;
  }
}
.delivery-application-detail .application-info .info-row:last-child {
  border-bottom: none;
}
.delivery-application-detail .application-info .info-row:first-child .info-label {
  border-top: 1px solid #d8e4f3;
}
.delivery-application-detail .application-info .info-row:first-child .info-value {
  border-top: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .delivery-application-detail .application-info .info-row:first-child .info-value {
    border-top: none;
  }
}
.delivery-application-detail .application-info .info-row .info-label {
  align-self: stretch;
  background-color: #ecf2f9;
  padding: 14px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: #191a1a;
  border-left: 1px solid #d8e4f3;
  border-right: 1px solid #d8e4f3;
  text-align: center;
}
@media (max-width: 900px) {
  .delivery-application-detail .application-info .info-row .info-label {
    width: 100%;
    font-size: 0.8125rem;
    padding: 12px 0;
    border-right: 1px solid #cbcccc;
    border-bottom: 1px solid #d8e4f3;
  }
}
.delivery-application-detail .application-info .info-row .info-value {
  flex: 1;
  background-color: #ffffff;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  font-size: 17px;
  font-weight: 400;
  color: #4b4d4d;
  border-right: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .delivery-application-detail .application-info .info-row .info-value {
    width: 100%;
    font-size: 0.9375rem;
    padding: 10px 12px;
    border-left: 1px solid #cbcccc;
  }
}
.delivery-application-detail .book-list-table {
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table {
    overflow-x: auto;
  }
}
.delivery-application-detail .book-list-table .table-header {
  display: flex;
  border-bottom: 1px solid #d8e4f3;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-header {
    min-width: 600px;
  }
}
.delivery-application-detail .book-list-table .table-header .header-cell {
  background-color: #ecf2f9;
  padding: 12px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: #191a1a;
  text-align: center;
  border-left: 1px solid #d8e4f3;
  border-top: 1px solid #d8e4f3;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-header .header-cell {
    font-size: 0.8125rem;
    padding: 10px 6px;
  }
}
.delivery-application-detail .book-list-table .table-header .header-cell:last-child {
  border-right: 1px solid #d8e4f3;
}
.delivery-application-detail .book-list-table .table-header .header-cell.col-number {
  width: 80px;
  min-width: 80px;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-header .header-cell.col-number {
    width: 60px;
    min-width: 60px;
  }
}
.delivery-application-detail .book-list-table .table-header .header-cell.col-title {
  flex: 1;
}
.delivery-application-detail .book-list-table .table-header .header-cell.col-call-number {
  flex: 1;
}
.delivery-application-detail .book-list-table .table-header .header-cell.col-registration {
  flex: 1;
}
.delivery-application-detail .book-list-table .table-row {
  display: flex;
  border-bottom: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-row {
    min-width: 600px;
  }
}
.delivery-application-detail .book-list-table .table-row .data-cell {
  background-color: #ffffff;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  font-size: 17px;
  font-weight: 400;
  color: #4b4d4d;
  border-left: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-row .data-cell {
    font-size: 0.9375rem;
    padding: 10px 8px;
  }
}
.delivery-application-detail .book-list-table .table-row .data-cell:last-child {
  border-right: 1px solid #cbcccc;
}
.delivery-application-detail .book-list-table .table-row .data-cell.col-number {
  width: 80px;
  min-width: 80px;
  justify-content: center;
  text-align: center;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-row .data-cell.col-number {
    width: 60px;
    min-width: 60px;
  }
}
.delivery-application-detail .book-list-table .table-row .data-cell.col-title {
  flex: 1;
}
.delivery-application-detail .book-list-table .table-row .data-cell.col-call-number {
  flex: 1;
  justify-content: center;
  text-align: center;
}
.delivery-application-detail .book-list-table .table-row .data-cell.col-registration {
  flex: 1;
  justify-content: center;
  text-align: center;
}
.delivery-application-detail .book-list-table .table-note {
  background-color: #ffffff;
  padding: 12px 16px;
  border: 1px solid #cbcccc;
  border-top: none;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 17px;
  color: #4b4d4d;
  position: relative;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-note {
    font-size: 0.9375rem;
    padding: 10px 12px;
    min-width: 600px;
  }
}
.delivery-application-detail .book-list-table .table-note .note-icon {
  margin-right: 8px;
  font-weight: 400;
}
@media (max-width: 900px) {
  .delivery-application-detail .book-list-table .table-note .note-icon {
    margin-right: 6px;
  }
}
.delivery-application-detail .book-list-table .table-note .note-text {
  font-weight: 400;
}
.delivery-application-detail .delivery-info {
  margin-top: 0;
}
.delivery-application-detail .delivery-info .delivery-row {
  display: flex;
  border-bottom: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .delivery-application-detail .delivery-info .delivery-row {
    flex-direction: column;
  }
}
.delivery-application-detail .delivery-info .delivery-row:first-child {
  border-top: none;
}
.delivery-application-detail .delivery-info .delivery-row .delivery-label {
  flex: 1;
  background-color: #ffffff;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  font-weight: 400;
  color: #4b4d4d;
  border-left: 1px solid #cbcccc;
  border-right: 1px solid #cbcccc;
  text-align: center;
}
@media (max-width: 900px) {
  .delivery-application-detail .delivery-info .delivery-row .delivery-label {
    font-size: 0.9375rem;
    padding: 10px 12px;
    border-bottom: 1px solid #cbcccc;
  }
}
.delivery-application-detail .delivery-info .delivery-row .delivery-value {
  flex: 1;
  background-color: #ffffff;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  color: #4b4d4d;
  border-right: 1px solid #cbcccc;
  text-align: center;
}
@media (max-width: 900px) {
  .delivery-application-detail .delivery-info .delivery-row .delivery-value {
    font-size: 0.9375rem;
    padding: 10px 12px;
    border-left: 1px solid #cbcccc;
  }
}
.delivery-application-detail .delivery-info .delivery-row .delivery-value.delivery-date {
  font-weight: 700;
}

.btn-top {
  position: fixed;
  right: 40px;
  bottom: 40px;
  width: 64px;
  height: 64px;
  display: flex;
  gap: 5px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  cursor: pointer;
  border-radius: 8px;
  border: 1px solid #cbcccc;
  background: #fff;
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.05), 0 4px 8px 0 rgba(0, 0, 0, 0.08);
  z-index: 100;
  transition: all 0.3s ease;
  font-size: 0.9375rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1;
}
.btn-top:hover {
  background: #ecf2f9;
}
.btn-top:active {
  background: #d8e4f3;
}
.btn-top svg {
  width: 24px;
  height: 24px;
}
@media (max-width: 900px) {
  .btn-top {
    width: 50px;
    height: 50px;
    right: 20px;
    bottom: 20px;
  }
}

.post-reply {
  background: #ecf2f9;
  padding: 1.5rem;
  border-radius: 0.5rem;
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 900px) {
  .post-reply {
    padding: 1rem;
    margin-top: 1.5rem;
  }
}
.post-reply__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}
@media (max-width: 900px) {
  .post-reply__header {
    flex-direction: row;
    align-items: flex-start;
    gap: 0.75rem;
  }
}
.post-reply__badge {
  background: #0b78cb;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  height: 2rem;
  padding: 0 0.75rem;
  border-radius: 0.25rem;
  flex-shrink: 0;
}
.post-reply__badge img {
  width: 1.5rem;
  height: 1.5rem;
}
@media (max-width: 900px) {
  .post-reply__badge img {
    width: 0.9375rem;
    height: 0.9375rem;
  }
}
.post-reply__badge span {
  color: white;
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  white-space: nowrap;
}
.post-reply__info {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex: 1;
}
@media (max-width: 900px) {
  .post-reply__info {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
  }
}
.post-reply__info-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
@media (max-width: 900px) {
  .post-reply__info-item {
    width: 100%;
  }
}
.post-reply__info-label {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 1.0625rem;
  color: #191a1a;
  padding: 0 0.75rem;
}
.post-reply__info-value {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 400;
  font-size: 1.0625rem;
  color: #191a1a;
  padding: 0 0.5rem;
}
.post-reply__divider {
  width: 1px;
  height: 1.0625rem;
  background: #646767;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .post-reply__divider {
    display: none;
  }
}
.post-reply__content {
  background: white;
  padding: 2rem;
  border-radius: 0.25rem;
  min-height: 9.375rem;
  display: flex;
}
.post-reply__content > * {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
  line-height: 1.6;
  font-family: inherit !important;
}
@media (max-width: 900px) {
  .post-reply__content {
    padding: 1.25rem;
    min-height: 7.5rem;
  }
}
.post-reply__content p {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 400;
  font-size: 1.0625rem;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
}

.color-red {
  color: #d7424e;
}

.integrated-member-notice {
  margin-bottom: 1.25rem;
  font-size: 0.9375rem;
  color: #333;
  line-height: 1.5;
}

.library-status .pop-list-item .pop-list-item-title,
.library-status .pop-list-item .pop-list-item-content {
  flex: 1;
  background: #ecf2f9;
  border-bottom: 1px solid var(--color-primary-pr01, #d8e4f3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  text-align: center;
  color: #000;
}
.library-status .pop-list-item.library-status-cnt .pop-list-item-title,
.library-status .pop-list-item.library-status-cnt .pop-list-item-content {
  flex: 1;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 400;
  text-align: center;
  color: #000;
}

.attendance-check-modal .attendance-description {
  margin-bottom: 1.25rem;
}
.attendance-check-modal .attendance-description p {
  font-size: 0.9375rem;
  color: #333;
  line-height: 1.5;
  margin: 0;
}
.attendance-check-modal .attendance-example {
  margin-bottom: 1.25rem;
  padding: 1rem;
  background-color: #f5f5f5;
  border-radius: 0.25rem;
}
.attendance-check-modal .attendance-example p {
  font-size: 0.875rem;
  color: #333;
  line-height: 1.5;
  margin: 0;
}
.attendance-check-modal .attendance-input textarea {
  width: 100%;
  min-height: 7.5rem;
  padding: 0.75rem;
  border: 1px solid #ddd;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.5;
  resize: vertical;
  font-family: inherit;
}
.attendance-check-modal .attendance-input textarea::placeholder {
  color: #999;
}
.attendance-check-modal .attendance-input textarea:focus {
  outline: none;
  border-color: #3c79c2;
  box-shadow: 0 0 0 2px rgba(60, 121, 194, 0.1);
}

.library-schedule-modal {
  text-align: center;
}
.library-schedule-modal .schedule-header {
  margin-bottom: 1.25rem;
}
.library-schedule-modal .schedule-header h2 {
  font-size: 1.125rem;
  font-weight: 600;
  color: #333;
  margin: 0 0 0.5rem 0;
}
.library-schedule-modal .schedule-header h3 {
  font-size: 1rem;
  font-weight: 600;
  color: #333;
  margin: 0;
}
.library-schedule-modal .schedule-status {
  margin-bottom: 1.5rem;
}
.library-schedule-modal .schedule-status .status-badge {
  display: inline-block;
  background-color: #3c79c2;
  color: white;
  padding: 0.5rem 1.25rem;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  font-weight: 500;
}
.library-schedule-modal .schedule-content {
  text-align: left;
  background-color: #f5f5f5;
  padding: 1.25rem;
  border-radius: 0.25rem;
}
.library-schedule-modal .schedule-content ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.library-schedule-modal .schedule-content ul li {
  font-size: 0.9375rem;
  color: #333;
  line-height: 1.6;
  margin-bottom: 0.5rem;
  position: relative;
  padding-left: 1rem;
}
.library-schedule-modal .schedule-content ul li:last-child {
  margin-bottom: 0;
}
.library-schedule-modal .schedule-content ul li:before {
  content: "•";
  position: absolute;
  left: 0;
  color: #333;
}

.cat-activities-section .ui-select-container {
  width: 100%;
}
.cat-activities-section .com-grid {
  margin-bottom: 45px;
}
@media (max-width: 900px) {
  .cat-activities-section .com-grid {
    margin-bottom: 30px;
  }
}

/* 돔 영화 테이블 스타일 */
.dome-movie-table .poster-cell {
  text-align: center;
  vertical-align: middle;
}

.dome-movie-table .poster-cell img {
  display: inline-block;
  width: 144px;
  height: auto;
  object-fit: cover;
  border-radius: 4px;
}

.dome-movie-table .content-cell {
  line-height: 1.6;
  vertical-align: top;
}

@media (max-width: 900px) {
  .dome-movie-table .poster-cell img {
    width: 100px;
    height: 120px;
  }
}
.usage-guide__table-cell {
  text-align: center;
}
.usage-guide__table-cell img {
  display: inline-block;
}

.date-selectors {
  /* 대출급상승도서 테이블 스타일 */
}
.date-selectors .date-selector-header {
  padding: 16px 24px;
}
@media (max-width: 900px) {
  .date-selectors .date-selector-header {
    padding: 12px 16px;
  }
}
.date-selectors .date-selector-header.type-2 .date-text {
  color: #3c79c2 !important;
}
.date-selectors .date-selector-header .date-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
@media (max-width: 900px) {
  .date-selectors .date-selector-header .date-controls {
    gap: 6px;
  }
}
.date-selectors .date-selector-header .date-controls .arrow-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid #cdd1d5;
  border-radius: 50%;
  background-color: transparent;
  cursor: pointer;
  transition: all 0.2s ease;
}
@media (max-width: 900px) {
  .date-selectors .date-selector-header .date-controls .arrow-btn {
    width: 28px;
    height: 28px;
  }
}
.date-selectors .date-selector-header .date-controls .arrow-btn:hover {
  background-color: #f0f0f0;
}
.date-selectors .date-selector-header .date-controls .arrow-btn img {
  width: 19.2px;
  height: 19.2px;
}
@media (max-width: 900px) {
  .date-selectors .date-selector-header .date-controls .arrow-btn img {
    width: 16px;
    height: 16px;
  }
}
.date-selectors .date-selector-header .date-controls .date-display {
  display: flex;
  align-items: center;
  gap: 4px;
}
@media (max-width: 900px) {
  .date-selectors .date-selector-header .date-controls .date-display {
    gap: 2px;
  }
}
.date-selectors .date-selector-header .date-controls .date-display .date-item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 8px;
  border-radius: 6px;
  background-color: transparent;
}
@media (max-width: 900px) {
  .date-selectors .date-selector-header .date-controls .date-display .date-item {
    height: 36px;
    padding: 0 6px;
  }
}
.date-selectors .date-selector-header .date-controls .date-display .date-item .date-text {
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.5;
  color: #1e2124;
}
@media (max-width: 900px) {
  .date-selectors .date-selector-header .date-controls .date-display .date-item .date-text {
    font-size: 20px;
  }
}
.date-selectors .popular-books-table-wrapper {
  width: 100%;
  margin-top: 16px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table-wrapper {
    overflow-x: auto;
  }
}
.date-selectors .popular-books-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.date-selectors .popular-books-table thead tr {
  background-color: #ecf2f9;
  border-top: 2px solid #004d80;
}
.date-selectors .popular-books-table thead tr th {
  height: 44px;
  padding: 8px 16px;
  border-right: 1px solid #d8e4f3;
  border-bottom: 1px solid #d8e4f3;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.5;
  color: #191a1a;
  text-align: center;
  vertical-align: middle;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th {
    font-size: 13px;
    height: 40px;
    padding: 8px 12px;
  }
}
.date-selectors .popular-books-table thead tr th:last-child {
  border-right: none;
}
.date-selectors .popular-books-table thead tr th.rank-col {
  min-width: 60px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th.rank-col {
    min-width: 50px;
  }
}
.date-selectors .popular-books-table thead tr th.institution-col {
  min-width: 115px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th.institution-col {
    min-width: 100px;
  }
}
.date-selectors .popular-books-table thead tr th.date1-col {
  min-width: 80px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th.date1-col {
    min-width: 70px;
  }
}
.date-selectors .popular-books-table thead tr th.date2-col {
  min-width: 80px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th.date2-col {
    min-width: 70px;
  }
}
.date-selectors .popular-books-table thead tr th.count-col {
  min-width: 100px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th.count-col {
    min-width: 90px;
  }
}
.date-selectors .popular-books-table thead tr th.title-col {
  width: auto;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th.title-col {
    min-width: 450px;
  }
}
.date-selectors .popular-books-table thead tr th.isbn-col {
  min-width: 180px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table thead tr th.isbn-col {
    min-width: 160px;
  }
}
.date-selectors .popular-books-table thead tr td,
.date-selectors .popular-books-table thead tr th {
  border: none !important;
}
.date-selectors .popular-books-table tbody tr {
  border-bottom: 1px solid #cbcccc;
}
.date-selectors .popular-books-table tbody tr:hover {
  background-color: #f8f9fa;
}
.date-selectors .popular-books-table tbody tr .book-info {
  margin-top: 0;
}
.date-selectors .popular-books-table tbody tr .book-title {
  min-height: auto;
}
.date-selectors .popular-books-table tbody tr .title-col {
  text-align: left;
}
.date-selectors .popular-books-table tbody tr .title-col .book-info {
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.date-selectors .popular-books-table tbody tr .title-col .book-image {
  flex: none;
  max-width: 70px;
}
.date-selectors .popular-books-table tbody tr .title-col .book-title {
  min-height: 51px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table tbody tr .title-col .book-title {
    min-height: auto;
  }
}
.date-selectors .popular-books-table tbody tr .institution-col .rank-change-badge {
  background-color: #3c79c2;
  border-radius: 20px;
  padding: 8px 12px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table tbody tr .institution-col .rank-change-badge {
    padding: 6px 8px;
  }
}
.date-selectors .popular-books-table tbody tr .institution-col .rank-change-badge img {
  width: 24px;
  height: 24px;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table tbody tr .institution-col .rank-change-badge img {
    width: 20px;
    height: 20px;
  }
}
.date-selectors .popular-books-table tbody tr .institution-col .rank-change-badge .change-number {
  color: #ffffff;
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 500;
  font-size: 17px;
  line-height: 1.5;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table tbody tr .institution-col .rank-change-badge .change-number {
    font-size: 15px;
  }
}
.date-selectors .popular-books-table tbody tr th,
.date-selectors .popular-books-table tbody tr td {
  border: none !important;
}
.date-selectors .popular-books-table tbody tr td {
  padding: 12px 16px;
  font-size: 17px;
  line-height: 1.5;
  color: #4b4d4d;
  vertical-align: middle;
  text-align: center;
}
.date-selectors .popular-books-table tbody tr td.text-left {
  text-align: left;
}
@media (max-width: 900px) {
  .date-selectors .popular-books-table tbody tr td {
    padding: 8px 12px;
    font-size: 15px;
  }
}
.date-selectors .popular-books-table tbody tr td:last-child {
  border-right: none;
}

.source-text {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #1e2124;
  line-height: 1;
  margin-top: 40px;
  display: inline-block;
  text-align: right;
}
@media (max-width: 900px) {
  .source-text {
    display: inline-block;
    margin-top: 24px;
  }
}

.search-form {
  padding: 24px 0;
  border-bottom: 1px solid var(--color-gray-gy-30, #b1b3b3);
  border-top: 1px solid var(--color-gray-gy-30, #b1b3b3);
}
@media (max-width: 900px) {
  .search-form {
    padding: 16px 0;
  }
}
.search-form dl {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 16px;
}
@media (max-width: 900px) {
  .search-form dl {
    margin-bottom: 10px;
  }
}
.search-form dl:last-child {
  margin-bottom: 0;
}
.search-form dl dt {
  min-width: 160px;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #1e2124;
  line-height: 1;
}
@media (max-width: 900px) {
  .search-form dl dt {
    font-size: 0.9375rem;
    min-width: 60px;
    text-align: center;
  }
}
.search-form dl dd {
  flex: 1;
}

.ai-book-queue {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  padding: 24px;
  background-color: #f1f2f2;
  border-radius: 12px;
  margin-bottom: 24px;
}
.ai-book-queue .ai-intro-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.ai-book-queue .ai-intro-section .intro-header {
  text-align: center;
}
.ai-book-queue .ai-intro-section .intro-header .intro-subtitle {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-intro-section .intro-header .intro-subtitle {
    font-size: 20px;
  }
}
.ai-book-queue .ai-intro-section .intro-title-area {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: center;
  width: 100%;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-intro-section .intro-title-area {
    gap: 12px;
  }
}
.ai-book-queue .ai-intro-section .intro-title-area .title-text {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-intro-section .intro-title-area .title-text {
    font-size: 28px;
  }
}
.ai-book-queue .ai-intro-section .intro-title-area .ai-chatbot-icon {
  height: 85px;
  width: 62px;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-intro-section .intro-title-area .ai-chatbot-icon {
    height: 65px;
    width: 48px;
  }
}
.ai-book-queue .ai-intro-section .intro-title-area .ai-chatbot-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ai-book-queue .ai-description-card {
  background-color: #ffffff;
  border: 1px solid #cbcccc;
  border-radius: 6px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  position: relative;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-description-card {
    padding: 20px;
  }
}
.ai-book-queue .ai-description-card .quote-icon {
  width: 16px;
  height: 16px;
}
.ai-book-queue .ai-description-card .quote-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ai-book-queue .ai-description-card .description-content .highlight-text {
  position: relative;
}
.ai-book-queue .ai-description-card .description-content .highlight-text::before {
  content: "";
  position: absolute;
  background-color: #fde0b0;
  height: 8px;
  left: 0.5px;
  top: 40px;
  width: 318px;
  z-index: 0;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-description-card .description-content .highlight-text::before {
    display: none;
  }
}
.ai-book-queue .ai-description-card .description-content .highlight-text p {
  position: relative;
  z-index: 2;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
  text-align: center;
  margin: 0;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-description-card .description-content .highlight-text p {
    font-size: 15px;
  }
}
.ai-book-queue .ai-description-card .description-content .highlight-text p strong {
  font-weight: 700;
}
.ai-book-queue .ai-description-card .info-notice {
  display: flex;
  gap: 4px;
  align-items: center;
  width: 100%;
}
.ai-book-queue .ai-description-card .info-notice .info-icon {
  flex-shrink: 0;
}
.ai-book-queue .ai-description-card .info-notice .info-icon img {
  width: 16.667px;
  height: 16.667px;
  object-fit: contain;
}
.ai-book-queue .ai-description-card .info-notice .info-text {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: #7d8181;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .ai-book-queue .ai-description-card .info-notice .info-text {
    font-size: 11px;
  }
}

.ai-carousel-section {
  margin-bottom: 24px;
  width: 100%;
}
.ai-carousel-section .carousel-container {
  display: flex;
  gap: 16px;
  align-items: center;
  width: 100%;
}
.ai-carousel-section .carousel-container .carousel-btn {
  width: 40px;
  height: 40px;
  border-radius: 1000px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.ai-carousel-section .carousel-container .carousel-btn--prev {
  background-color: #ffffff;
  border: 1px solid #3c79c2;
}
.ai-carousel-section .carousel-container .carousel-btn--prev:hover {
  background-color: #f8f9fa;
}
.ai-carousel-section .carousel-container .carousel-btn--next {
  background-color: #3c79c2;
}
.ai-carousel-section .carousel-container .carousel-btn--next:hover {
  background-color: #2d5a94;
}
.ai-carousel-section .carousel-container .carousel-btn--next img {
  filter: brightness(0) invert(1);
}
.ai-carousel-section .carousel-container .carousel-btn img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}
.ai-carousel-section .carousel-container .carousel-content {
  flex: 1;
  overflow: hidden;
}
.ai-carousel-section .carousel-container .carousel-content .ai-carousel-swiper {
  width: 100%;
}
.ai-carousel-section .carousel-container .carousel-content .ai-carousel-swiper .swiper-wrapper {
  align-items: center;
}
.ai-carousel-section .carousel-container .carousel-content .ai-carousel-swiper .swiper-slide {
  display: flex;
  gap: 12px;
  width: 100%;
}
@media (max-width: 900px) {
  .ai-carousel-section .carousel-container .carousel-content .ai-carousel-swiper .swiper-slide {
    gap: 8px;
  }
}
.ai-carousel-section .carousel-container .carousel-content .carousel-slide {
  display: flex;
  gap: 12px;
  width: 100%;
}
@media (max-width: 900px) {
  .ai-carousel-section .carousel-container .carousel-content .carousel-slide {
    gap: 8px;
  }
}
.ai-carousel-section .carousel-container .carousel-content .slide-card {
  flex: 1;
  background-color: #ffffff;
  border: 1px solid #b1b3b3;
  border-radius: 6px;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 78px;
  min-height: 78px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.ai-carousel-section .carousel-container .carousel-content .slide-card--active {
  border: 2px solid #3c79c2;
}
.ai-carousel-section .carousel-container .carousel-content .slide-card:hover {
  border-color: #3c79c2;
  background-color: #f8f9fa;
}
@media (max-width: 900px) {
  .ai-carousel-section .carousel-container .carousel-content .slide-card {
    padding: 12px;
    height: auto;
    min-height: 70px;
  }
}
.ai-carousel-section .carousel-container .carousel-content .slide-card p {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: #1d1d1d;
  text-align: center;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 900px) {
  .ai-carousel-section .carousel-container .carousel-content .slide-card p {
    font-size: 13px;
    -webkit-line-clamp: 4;
  }
}

.ai-bookqueue-detail-page .ai-bookqueue-section {
  margin-bottom: 24px;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .ai-bookqueue-section {
    margin-bottom: 20px;
  }
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble {
  background-color: #f1f2f2;
  border: 1px solid #cbcccc;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 24px;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble {
    padding: 16px;
    gap: 16px;
    flex-direction: column;
    align-items: flex-start;
  }
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content {
    flex-direction: column;
    width: 100%;
  }
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .quote-left {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .quote-left img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .right {
  display: flex;
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .chat-text {
  flex: 1;
  margin: 0 10px;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .chat-text {
    margin: 0;
  }
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .chat-text p {
  font-size: 17px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .chat-text p {
    font-size: 15px;
  }
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .quote-right {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  align-self: end;
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .chat-content .quote-right img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .ai-chatbot-icon {
  flex-shrink: 0;
  width: 62px;
  height: 85px;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .ai-chatbot-icon {
    width: 48px;
    height: 66px;
  }
}
.ai-bookqueue-detail-page .ai-bookqueue-section .ai-chat-bubble .ai-chatbot-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.recommend-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 24px;
  margin-bottom: 16px;
}
@media (max-width: 900px) {
  .recommend-header {
    gap: 12px;
    margin-top: 20px;
    margin-bottom: 12px;
  }
}
.recommend-header .book-title {
  display: flex;
  align-items: center;
}
.recommend-header .book-title h3 {
  font-size: 1.1875rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
  line-height: 150%;
}
@media (max-width: 900px) {
  .recommend-header .book-title h3 {
    font-size: 1rem;
    line-height: 1.5;
    word-break: break-all;
  }
}
.recommend-header .recommend-badge {
  position: relative;
  flex: none;
}
@media (max-width: 900px) {
  .recommend-header .recommend-badge {
    flex: none;
    background: #fbbc53;
    border-radius: 6px;
    padding: 5px;
  }
}
@media (max-width: 900px) {
  .recommend-header .recommend-badge .badge-background {
    display: none;
  }
}
.recommend-header .recommend-badge .badge-content {
  position: absolute;
  left: 12px;
  top: 6px;
  display: flex;
  align-items: center;
  z-index: 10;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
}
@media (max-width: 900px) {
  .recommend-header .recommend-badge .badge-content {
    left: 0px;
    top: 0px;
    font-size: 0.875rem;
    position: relative;
    flex: none;
  }
}
.recommend-header .recommend-badge .badge-content .badge-text {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
  flex: none;
}

.ai-bookqueue-detail-page .additional-questions-section {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .additional-questions-section {
    margin-top: 32px;
    padding-top: 32px;
  }
}
.ai-bookqueue-detail-page .additional-questions-section .section-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .additional-questions-section .section-header {
    gap: 6px;
    margin-bottom: 20px;
  }
}
.ai-bookqueue-detail-page .additional-questions-section .section-header .ai-icon {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .additional-questions-section .section-header .ai-icon {
    width: 40px;
    height: 40px;
  }
}
.ai-bookqueue-detail-page .additional-questions-section .section-header .ai-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ai-bookqueue-detail-page .additional-questions-section .section-header h2 {
  font-size: 19px;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
  flex: 1;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .additional-questions-section .section-header h2 {
    font-size: 16px;
  }
}
.ai-bookqueue-detail-page .additional-questions-section .questions-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .additional-questions-section .questions-list {
    gap: 12px;
  }
}
.ai-bookqueue-detail-page .additional-questions-section .questions-list .question-item {
  background-color: #e5e5e5;
  border-radius: 16px 16px 16px 0;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 17px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .ai-bookqueue-detail-page .additional-questions-section .questions-list .question-item {
    padding: 12px;
    font-size: 15px;
  }
}
.ai-bookqueue-detail-page .additional-questions-section .questions-list .question-item:hover {
  background-color: #cbcccc;
  transform: translateY(-1px);
}
.ai-bookqueue-detail-page .additional-questions-section .questions-list .question-item:active {
  transform: translateY(0);
}

.ai-loading-section {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-direction: column;
  position: absolute;
  left: 57%;
  top: 50%;
  min-width: 280px;
  transform: translate(-50%, -50%);
  background: white;
  border: 3px solid #b1cae7;
  border-radius: 25px;
  padding: 32px;
  margin: 40px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 0px 40px 0px rgba(102, 102, 102, 0.4);
  animation: fadeInUp 0.6s ease-out;
}
@media (max-width: 900px) {
  .ai-loading-section {
    left: 50%;
    min-width: auto;
    padding: 24px;
    margin: 32px 0;
    flex-direction: column;
    gap: 16px;
    width: 60%;
  }
}
.ai-loading-section .ai-chatbot-icon {
  width: 100px;
  height: 100px;
  flex-shrink: 0;
  animation: bounce 2s ease-in-out infinite;
}
.ai-loading-section .ai-chatbot-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ai-loading-section .loading-text {
  font-size: 19px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  text-align: center;
  text-align: center;
  animation: pulse 1.5s ease-in-out infinite;
}
@media (max-width: 900px) {
  .ai-loading-section .loading-text {
    font-size: 17px;
  }
}
.ai-loading-section .loading-text .ai-brand {
  font-weight: 700;
  color: #3c79c2;
  animation: colorPulse 2s ease-in-out infinite;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate(-50%, -30%) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-10px);
  }
  60% {
    transform: translateY(-5px);
  }
}
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}
@keyframes colorPulse {
  0%, 100% {
    color: #3c79c2;
  }
  50% {
    color: #5a9de6;
  }
}
.additional-questions-section {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .additional-questions-section {
    margin-top: 32px;
    padding-top: 32px;
  }
}
.additional-questions-section .section-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}
.additional-questions-section .section-header .ai-icon {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
}
.additional-questions-section .section-header .ai-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.additional-questions-section .section-header h2 {
  font-size: 19px;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
  flex: 1;
}
.additional-questions-section .questions-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.additional-questions-section .questions-list .question-item {
  background-color: #e5e5e5;
  border: none;
  border-radius: 16px 16px 16px 0;
  padding: 16px;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 17px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 900px) {
  .additional-questions-section .questions-list .question-item {
    white-space: normal;
    word-break: keep-all;
    word-wrap: break-word;
  }
}
.additional-questions-section .questions-list .question-item:hover {
  background-color: #cbcccc;
  transform: translateY(-1px);
}
.additional-questions-section .questions-list .question-item:active {
  transform: translateY(0);
}

.bookshelf-add__message {
  font-size: 1.1875rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
  line-height: 1.5;
  word-break: keep-all;
}

.life-bookshelf-page .life-bookshelf-intro {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px 40px;
  background-color: #f1f2f2;
  border-radius: 12px;
  margin-bottom: 24px;
}
.life-bookshelf-page .life-bookshelf-intro__image {
  flex-shrink: 0;
  width: 168px;
}
.life-bookshelf-page .life-bookshelf-intro__image img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.life-bookshelf-page .life-bookshelf-intro__text {
  font-size: 17px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  text-align: center;
}
.life-bookshelf-page .life-bookshelf-intro__text strong {
  font-size: 19px;
  font-weight: 700;
  color: #3c79c2;
  line-height: 1.5;
}
.life-bookshelf-page .service-composition {
  border: 1px solid #cbcccc;
  border-radius: 12px;
  overflow: hidden;
}
.life-bookshelf-page .service-composition__part--solution .service-composition__header {
  background-color: #30619b;
}
.life-bookshelf-page .service-composition__part--solution .service-composition__header h4 {
  color: #ffffff;
}
.life-bookshelf-page .service-composition__part--solution .service-composition__name {
  color: #30619b;
}
.life-bookshelf-page .service-composition__part--collection .service-composition__header {
  background-color: #df6871;
}
.life-bookshelf-page .service-composition__part--collection .service-composition__header h4 {
  color: #ffffff;
}
.life-bookshelf-page .service-composition__part--collection .service-composition__name {
  color: #df6871;
}
.life-bookshelf-page .service-composition__header {
  padding: 18px 24px;
  position: relative;
}
.life-bookshelf-page .service-composition__header h4 {
  font-size: 19px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.5;
  text-align: center;
  margin: 0;
}
.life-bookshelf-page .service-composition__body {
  padding: 32px;
  background-color: #ffffff;
}
.life-bookshelf-page .service-composition__list {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  gap: 16px;
}
@media (max-width: 900px) {
  .life-bookshelf-page .service-composition__list {
    flex-direction: column;
    gap: 12px;
  }
}
.life-bookshelf-page .service-composition__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.life-bookshelf-page .service-composition__icon {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.life-bookshelf-page .service-composition__icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.life-bookshelf-page .service-composition__name {
  font-size: 17px;
  font-weight: 700;
  color: inherit;
  line-height: 1.5;
  text-align: center;
}
.life-bookshelf-page .service-composition-image img {
  width: 100%;
  height: auto;
  border-radius: 12px;
}
@media (max-width: 900px) {
  .life-bookshelf-page .life-bookshelf-intro {
    flex-direction: column;
    align-items: center;
  }
  .life-bookshelf-page .life-bookshelf-intro__text {
    text-align: center;
  }
  .life-bookshelf-page .service-composition__list {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
}

.school-books-page .school-books-intro {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px 40px;
  background-color: #f1f2f2;
  border-radius: 12px;
  margin-bottom: 24px;
}
.school-books-page .school-books-intro__image {
  flex-shrink: 0;
  width: 186px;
}
.school-books-page .school-books-intro__image img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.school-books-page .school-books-intro__text {
  font-size: 17px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  text-align: center;
}
.school-books-page .school-books-intro__text strong {
  font-size: 19px;
  font-weight: 700;
  color: #3c79c2;
  line-height: 1.5;
}
.school-books-page .school-books-intro__text p {
  margin: 0 0 4px 0;
  text-align: center;
}
.school-books-page .school-books-intro__text p:last-child {
  margin-bottom: 0;
}
.school-books-page .service-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.school-books-page .service-card {
  border-radius: 12px;
  padding: 32px;
  position: relative;
  min-height: 356px;
}
.school-books-page .service-card--blue {
  background-color: #e6f2fa;
}
.school-books-page .service-card--blue .service-card__image {
  position: absolute;
  bottom: 0;
  right: 21px;
}
.school-books-page .service-card--orange {
  background-color: #fff8ee;
}
.school-books-page .service-card--green {
  background-color: #dbefd0;
}
.school-books-page .service-card--pink {
  background-color: #fbeced;
}
.school-books-page .service-card__title {
  font-size: 24px;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  margin: 0 0 20px 0;
}
.school-books-page .service-card__content {
  display: flex;
  flex-direction: column;
}
.school-books-page .service-card__content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 16px 0;
}
.school-books-page .service-card__content ul li {
  font-size: 17px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  margin-bottom: 8px;
  position: relative;
  padding-left: 12px;
}
.school-books-page .service-card__content ul li:before {
  content: "•";
  position: absolute;
  left: 0;
  color: #4b4d4d;
}
.school-books-page .service-card__content ul li:last-child {
  margin-bottom: 0;
}
.school-books-page .service-card__description {
  font-size: 17px;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  margin: 0 0 16px 0;
}
.school-books-page .service-card__image {
  margin-left: auto;
  margin-top: auto;
  text-align: center;
}
@media (max-width: 900px) {
  .school-books-page .service-card__image {
    display: none;
  }
}
.school-books-page .service-card__image img {
  max-width: 100%;
  height: auto;
}
@media (max-width: 900px) {
  .school-books-page .school-books-intro {
    flex-direction: column;
    align-items: center;
  }
  .school-books-page .school-books-intro__text {
    text-align: center;
  }
  .school-books-page .service-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .school-books-page .service-card {
    padding: 24px;
    min-height: auto;
  }
}

.text-red {
  color: #d7424e;
}

.form-field--buttons {
  margin-top: 40px;
}
@media (max-width: 900px) {
  .form-field--buttons {
    margin-top: 24px;
  }
}

.ai-recommendation-section {
  margin-bottom: 2rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section {
    margin-bottom: 1.5rem;
  }
}
.ai-recommendation-section .ai-recommendation-content {
  display: flex;
  gap: 2rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-recommendation-content {
    flex-direction: column;
    gap: 1.5rem;
  }
}
.ai-recommendation-section .ai-quote-section {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ai-recommendation-section .ai-quote-section .section-title {
  font-size: 1.5rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  border-bottom: none;
  display: flex;
  align-items: center;
  padding-bottom: 0;
  margin: 0;
}
.ai-recommendation-section .ai-quote-section .section-title::after {
  display: none !important;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-quote-section .section-title {
    font-size: 1.25rem;
  }
}
.ai-recommendation-section .ai-quote-section .ai-quote-card {
  position: relative;
  background-color: #d8e4f3;
  width: 12.5rem;
  height: 12.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.ai-recommendation-section .ai-quote-section .ai-quote-card::after {
  position: absolute;
  right: -20px;
  bottom: -20px;
  content: "";
  width: 55px;
  height: 81px;
  background: url("../../assets/images/icon/icon-ai.svg") no-repeat center center;
  background-size: contain;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-quote-section .ai-quote-card {
    width: 100%;
    height: auto;
    min-height: 9.375rem;
    padding: 1.5rem;
  }
}
.ai-recommendation-section .ai-quote-section .ai-quote-card .quote-text {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #323333;
  line-height: 1.5;
  text-align: center;
  margin: 0;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-quote-section .ai-quote-card .quote-text {
    font-size: 0.9375rem;
  }
}
.ai-recommendation-section .ai-report-section {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ai-recommendation-section .ai-report-section .report-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-header {
    flex-direction: column;
    align-items: flex-start;
  }
}
.ai-recommendation-section .ai-report-section .report-header .section-title {
  font-size: 1.5rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
  margin: 0;
  white-space: nowrap;
  border-bottom: none;
  display: flex;
  align-items: center;
  padding-bottom: 0;
}
.ai-recommendation-section .ai-report-section .report-header .section-title::after {
  display: none !important;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-header .section-title {
    font-size: 1.25rem;
  }
}
.ai-recommendation-section .ai-report-section .report-header .keyword-tags {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-header .keyword-tags {
    width: 100%;
  }
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-header .keyword-tags .tag-icon {
    display: none;
  }
}
.ai-recommendation-section .ai-report-section .report-header .keyword-tags .keyword-tag {
  background-color: #fff;
  border: 1px solid #58616a;
  border-radius: 0.25rem;
  padding: 0.375rem 0.625rem;
  min-width: 3.75rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 0.9375rem;
  font-weight: 400;
  color: #1e2124;
  line-height: 1.5;
  text-align: center;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-header .keyword-tags .keyword-tag {
    min-width: 3.125rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.8125rem;
  }
}
.ai-recommendation-section .ai-report-section .report-header .keyword-tags .keyword-tag--active {
  background-color: #f4f5f6;
}
.ai-recommendation-section .ai-report-section .report-header .keyword-tags .keyword-tag:hover {
  background-color: #f4f5f6;
}
.ai-recommendation-section .ai-report-section .report-header .keyword-tags .keyword-tag .tag-icon {
  width: 1.5rem;
  height: 1.5rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-header .keyword-tags .keyword-tag .tag-icon {
    width: 1.25rem;
    height: 1.25rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content {
  display: flex;
  position: relative;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content {
    flex-direction: column;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-tabs {
  display: flex;
  flex-direction: column;
  width: 9.375rem;
  border: 1px solid #8aafdb;
  background-color: #d8e4f3;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-tabs {
    flex-direction: row;
    width: 100%;
    height: 3.5rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab {
  position: relative;
  background-color: #d8e4f3;
  border: none;
  border-bottom: 1px solid #8aafdb;
  padding: 1rem;
  min-height: 3.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 1.0625rem;
  font-weight: 400;
  color: #4b4d4d;
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab {
    flex: 1;
    border-bottom: none;
    border-right: 1px solid #8aafdb;
    min-height: auto;
    font-size: 0.875rem;
    padding: 0.75rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab:last-child {
  border-bottom: none;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab:last-child {
    border-right: none;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab--active {
  background-color: #3c79c2;
  color: #fff;
  border-color: #3c79c2;
  z-index: 2;
}
.ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab--active .tab-icon {
  display: inline-block;
  margin-left: 0.25rem;
  width: 0.9375rem;
  height: 0.75rem;
  vertical-align: middle;
  transform: rotate(90deg);
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab--active .tab-icon {
    display: none;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab .tab-icon {
  display: none;
}
.ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab:hover:not(.ai-recommendation-section .ai-report-section .report-content .report-tabs .report-tab--active) {
  background-color: #c8ddf0;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel {
  flex: 1;
  background-color: #ecf2f9;
  border: 1px solid #8aafdb;
  border-left: none;
  min-height: 12.5rem;
  max-width: 37.125rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel {
    border-left: 1px solid #8aafdb;
    border-top: none;
    min-height: 9.375rem;
    max-width: 100%;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content {
  display: none;
  padding: 1.5rem;
  height: 100%;
  width: 100%;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content {
    padding: 1rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content--active {
  display: block;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .report-panel-inner {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .typing-text {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #323333;
  line-height: 1.5;
  margin: 0;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .typing-text {
    font-size: 0.9375rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .empty-message {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #b1b3b3;
  line-height: 1.5;
  text-align: center;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 9.375rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .empty-message {
    font-size: 0.9375rem;
    min-height: 7.5rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding-top: 1.25rem;
  border-top: 1px solid #cbcccc;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target {
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-top: 1rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target .target-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target .target-header .target-icon {
  width: 1.25rem;
  height: 1.25rem;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target .target-header .target-label {
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1.5;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target .target-header .target-label {
    font-size: 0.9375rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target .target-text {
  font-size: 1.0625rem;
  font-weight: 400;
  color: #191a1a;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .recommended-target .target-text {
    font-size: 0.9375rem;
    flex: 1 0 100%;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: relative;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper {
    gap: 0.375rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper {
  flex: 1;
  max-width: 100%;
  height: 9.5rem;
  overflow: hidden;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper {
    height: 8.125rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-wrapper {
  align-items: center;
  height: 100%;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 8.125rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide {
    height: 6.875rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide .book-link {
  display: block;
  width: 5.9375rem;
  height: 8.125rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  border-radius: 0.25rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide .book-link {
    width: 5rem;
    height: 6.875rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide .book-link:hover {
  transform: translateY(-4px);
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide .book-link:hover .book-cover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide .book-link:active {
  transform: translateY(-2px);
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-swiper .swiper-slide .book-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.25rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: box-shadow 0.2s ease;
  display: block;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-prev,
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-next {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  border: 1px solid #3c79c2;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  flex-shrink: 0;
  z-index: 10;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-prev,
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-next {
    width: 1.5rem;
    height: 1.5rem;
  }
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-prev:hover,
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-next:hover {
  background-color: #ecf2f9;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-prev:active,
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-next:active {
  background-color: #d8e4f3;
}
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-prev img,
.ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-next img {
  width: 0.75rem;
  height: 0.75rem;
}
@media (max-width: 900px) {
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-prev img,
  .ai-recommendation-section .ai-report-section .report-content .report-panel .report-panel-content .related-books-swiper-wrapper .related-books-btn-next img {
    width: 0.75rem;
    height: 0.75rem;
  }
}

@keyframes typing-cursor {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
.typing-text {
  position: relative;
}
.typing-text.typing-active::after {
  content: "|";
  animation: typing-cursor 1s infinite;
  margin-left: 2px;
}

.notice-detail-page .post-navigation {
  border-bottom: 1px solid #e5e7eb;
  margin: 40px 0;
  margin-top: -20px;
}
.notice-detail-page .post-navigation .post-navigation__item {
  display: flex;
  align-items: center;
  gap: 37px;
  padding: 20px 0;
  border-bottom: 1px solid #e5e7eb;
}
.notice-detail-page .post-navigation .post-navigation__item:last-child {
  border-bottom: none;
}
.notice-detail-page .post-navigation .post-navigation__item .post-navigation__label {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #191a1a;
  line-height: 1;
}
.notice-detail-page .post-navigation .post-navigation__item .post-navigation__label img {
  width: 16px;
  height: 16px;
}
.notice-detail-page .post-navigation .post-navigation__item .post-navigation__title {
  font-size: 16px;
  font-weight: 400;
  color: #374151;
  text-decoration: none;
  line-height: 1.5;
  transition: color 0.2s ease;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
}
.notice-detail-page .post-navigation .post-navigation__item .post-navigation__title:hover {
  color: #3c79c2;
}
.notice-detail-page .post-navigation .post-navigation__item.post-navigation__prev .post-navigation__label img {
  order: -1;
}
@media (max-width: 768px) {
  .notice-detail-page .post-navigation {
    margin: 20px 0;
  }
  .notice-detail-page .post-navigation .post-navigation__item {
    padding: 16px 0;
  }
  .notice-detail-page .post-navigation .post-navigation__item .post-navigation__label {
    font-size: 13px;
    margin-bottom: 6px;
    flex: none;
  }
  .notice-detail-page .post-navigation .post-navigation__item .post-navigation__title {
    font-size: 14px;
  }
  .notice-detail-page .post-navigation .post-navigation__item.post-navigation__next .post-navigation__title {
    text-align: left;
  }
}

.greeting-page {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  align-items: center;
}
@media (max-width: 900px) {
  .greeting-page {
    gap: 40px;
  }
}
.greeting-page__banner {
  width: 100%;
  max-width: 61rem;
  height: 26.25rem;
  position: relative;
  border-radius: 0.75rem;
  overflow: hidden;
}
@media (max-width: 900px) {
  .greeting-page__banner {
    max-width: 100%;
    height: 420px;
    border-radius: 12px;
  }
}
.greeting-page__banner-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.greeting-page__banner-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
}
.greeting-page__banner-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: center;
  text-align: center;
  color: white;
}
@media (max-width: 900px) {
  .greeting-page__banner-text {
    gap: 8px;
  }
}
.greeting-page__banner-title {
  font-size: 0;
  line-height: 1.5;
  white-space: nowrap;
}
.greeting-page__banner-title-bold {
  font-family: "Binggrae", sans-serif;
  font-size: 3.75rem;
  font-weight: 700;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .greeting-page__banner-title-bold {
    font-size: 60px;
  }
}
.greeting-page__banner-title-regular {
  font-family: "Binggrae", sans-serif;
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .greeting-page__banner-title-regular {
    font-size: 40px;
  }
}
.greeting-page__banner-subtitle {
  font-family: "Jalnan 2", sans-serif;
  font-size: 2.75rem;
  font-weight: 400;
  line-height: 1.5;
}
@media (max-width: 900px) {
  .greeting-page__banner-subtitle {
    font-size: 44px;
  }
}
.greeting-page__content {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
@media (max-width: 900px) {
  .greeting-page__content {
    gap: 40px;
  }
}
.greeting-page__welcome {
  font-family: "Sandoll Samliphopangche", sans-serif;
  font-size: 2.25rem;
  font-weight: 400;
  line-height: normal;
  color: #8aafdb;
  width: 100%;
}
@media (max-width: 900px) {
  .greeting-page__welcome {
    font-size: 36px;
  }
}
.greeting-page__section {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
}
@media (max-width: 900px) {
  .greeting-page__section {
    gap: 24px;
  }
}
.greeting-page__section-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}
@media (max-width: 900px) {
  .greeting-page__section-header {
    gap: 12px;
  }
}
.greeting-page__icon-wrapper {
  position: relative;
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .greeting-page__icon-wrapper {
    width: 36px;
    height: 36px;
  }
}
.greeting-page__icon-wrapper--blue {
  background: #6494ce;
}
.greeting-page__icon-wrapper--orange {
  background: #fbbc53;
}
.greeting-page__icon-wrapper--green {
  background: #7fb95e;
}
.greeting-page__icon {
  width: 1.5rem;
  height: 1.5rem;
}
@media (max-width: 900px) {
  .greeting-page__icon {
    width: 24px;
    height: 24px;
  }
}
.greeting-page__section-title {
  font-family: "Chilgok Halmez", sans-serif;
  font-size: 1.875rem;
  font-weight: 400;
  line-height: normal;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .greeting-page__section-title {
    font-size: 30px;
  }
}
.greeting-page__section-title--blue {
  color: #6494ce;
}
.greeting-page__section-title--orange {
  color: #fbbc53;
}
.greeting-page__section-title--green {
  color: #7fb95e;
}
.greeting-page__text {
  font-family: "Pretendard GOV", sans-serif;
  font-size: 1.1875rem;
  font-weight: 400;
  line-height: 1.5;
  color: #323333;
  width: 100%;
}
@media (max-width: 900px) {
  .greeting-page__text {
    font-size: 19px;
  }
}
.greeting-page__closing {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
  align-items: flex-end;
}
@media (max-width: 900px) {
  .greeting-page__closing {
    gap: 24px;
  }
}
.greeting-page__closing-image {
  width: 8.125rem;
}
@media (max-width: 900px) {
  .greeting-page__closing-image {
    width: 130px;
  }
}
.greeting-page__closing-text {
  font-family: "Chilgok Halmez", sans-serif;
  font-size: 1.5625rem;
  font-weight: 400;
  line-height: normal;
  color: #646767;
  text-align: right;
  width: 100%;
}
@media (max-width: 900px) {
  .greeting-page__closing-text {
    font-size: 25px;
  }
}

.notice-detail-page .post-detail__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  padding: 4px 24px;
  height: 32px;
  border-radius: 32px;
  margin-right: 5px;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  line-height: 1;
}
@media (max-width: 900px) {
  .notice-detail-page .post-detail__badge {
    margin-right: 8px;
    padding: 4px 16px;
    height: 28px;
    border-radius: 28px;
    margin-right: 5px;
    font-size: 0.8125rem;
  }
}
.notice-detail-page .post-detail__badge--0, .notice-detail-page .post-detail__badge--000000 {
  background: #008f37;
}
.notice-detail-page .post-detail__badge--128121 {
  background: #F2CC3D;
}
.notice-detail-page .post-detail__badge--128005 {
  background: #4ade80;
}
.notice-detail-page .post-detail__badge--128058 {
  background: #7fa7d7;
}
.notice-detail-page .post-detail__badge--128115 {
  background: #a3cf62;
}
.notice-detail-page .post-detail__badge--128047 {
  background: #a855f7;
}
.notice-detail-page .post-detail__badge--128099 {
  background: #ef6601;
}
.notice-detail-page .post-detail__badge--128104 {
  background: #ffacc1;
}
.notice-detail-page .post-detail__badge--128108 {
  background: #06b6d4;
}
.notice-detail-page .post-detail__badge--128109 {
  background: #f59e0b;
}
.notice-detail-page .post-detail__badge--128038 {
  background: #10b981;
}
.notice-detail-page .post-detail__badge--128011 {
  background: #8b5cf6;
}
.notice-detail-page .post-detail__badge--128100 {
  background: #f97316;
}
.notice-detail-page .post-detail__badge--128086 {
  background: #ec4899;
}
.notice-detail-page .post-detail__badge--728143 {
  background: #14b8a6;
}
.notice-detail-page .post-detail__badge--728211 {
  background: #84cc16;
}
.notice-detail-page .post-detail__badge--128082 {
  background: #6366f1;
}
.notice-detail-page .post-detail__badge--728210 {
  background: #d946ef;
}
.notice-detail-page .post-detail__badge--728220 {
  background: #189ba7;
}
.notice-detail-page .post-detail__badge--728222 {
  background: #7b19d7;
}
.notice-detail-page .post-detail__badge--912345 {
  background: #22d3ee;
}
.notice-detail-page .post-detail__badge--912346 {
  background: #fb7185;
}
.notice-detail-page .post-detail__badge--912347 {
  background: #34d399;
}
.notice-detail-page .post-detail__badge--912348 {
  background: #fbbf24;
}
.notice-detail-page .post-detail__badge--status-pending {
  background: #d8e4f3;
  border: 1px solid #6494ce;
  color: #30619b;
}
.notice-detail-page .post-detail__badge--status-progress {
  background: #00993e;
}
.notice-detail-page .post-detail__badge--status-end {
  background: #6b7280;
}
.notice-detail-page .post-detail__badge--status-child {
  background: #fff3cd;
  border: 1px solid #ffc107;
  color: #856404;
}

/* 국토지리정보원 지도 */
.ol-rotate.ol-hidden {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s linear, visibility 0s linear 0.25s;
}

.ol-attribution.ol-logo-only button,
.ol-attribution.ol-uncollapsible button {
  display: none;
}

/* UiTab with Description - 대관안내 페이지용 */
.search-type-tabs .ui-tab__button--with-description {
  min-height: 4.5rem;
  padding: 0.75rem 1rem;
}
.search-type-tabs .ui-tab__button--with-description .ui-tab__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.125rem;
  white-space: pre-wrap;
  text-align: center;
}
.search-type-tabs .ui-tab__button--with-description .ui-tab__label {
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: inherit;
}
.search-type-tabs .ui-tab__button--with-description .ui-tab__description {
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: inherit;
}
.search-type-tabs .ui-tab__button--with-description.ui-tab__button--active {
  background: #003456;
  color: white;
  z-index: 2;
}
.search-type-tabs .ui-tab__button--with-description.ui-tab__button--active .ui-tab__label {
  color: white;
}
.search-type-tabs .ui-tab__button--with-description.ui-tab__button--active .ui-tab__description {
  color: white;
}
.search-type-tabs .ui-tab__button--with-description:hover:not(.ui-tab__button--active) {
  background: rgba(255, 255, 255, 0.5);
  z-index: 1;
}
.search-type-tabs .ui-tab__button--with-description:hover:not(.ui-tab__button--active) .ui-tab__label {
  color: #5a5a5a;
}
.search-type-tabs .ui-tab__button--with-description:not(.ui-tab__button--active) {
  background: transparent;
  color: #7d8181;
}
.search-type-tabs .ui-tab__button--with-description:not(.ui-tab__button--active) .ui-tab__label {
  color: #7d8181;
}
.search-type-tabs .ui-tab__button--with-description:not(.ui-tab__button--active) .ui-tab__description {
  color: #7d8181;
}

/* 도서관 갤러리 - 대관안내 페이지 기타 섹션 */
.library-gallery {
  background: #f1f2f2;
  border-radius: 0.75rem;
  padding: 2rem;
  width: 100%;
}
.library-gallery__grid {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  justify-content: center;
}
.library-gallery__item {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: center;
  flex-shrink: 0;
}
.library-gallery__image {
  width: 10.625rem;
  height: 8rem;
  overflow: hidden;
  border-radius: 0.5rem;
}
.library-gallery__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.library-gallery__title {
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  text-align: center;
  margin: 0;
  width: 9.53125rem;
}
@media (max-width: 900px) {
  .library-gallery {
    padding: 24px;
  }
  .library-gallery__grid {
    flex-wrap: wrap;
    gap: 20px;
  }
  .library-gallery__item {
    width: calc(50% - 10px);
    min-width: 0;
  }
  .library-gallery__image {
    width: 100%;
    height: auto;
    aspect-ratio: 170/128;
  }
  .library-gallery__title {
    width: 100%;
    font-size: 15px;
  }
}
@media (max-width: 600px) {
  .library-gallery {
    padding: 16px;
  }
  .library-gallery__grid {
    flex-direction: column;
    gap: 16px;
  }
  .library-gallery__item {
    width: 100%;
  }
}

/* 감면조례 인포박스 - 대관안내 페이지 전용 */
.rental-infobox {
  background: #f1f2f2;
  border: 1px solid #cbcccc;
  border-radius: 0.75rem;
  padding: 1rem;
  width: 100%;
}
.rental-infobox__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.rental-infobox__icon {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rental-infobox__title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
}
.rental-infobox__content {
  padding-left: 1.75rem;
}
.rental-infobox__list-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.rental-infobox__list-item {
  display: flex;
  gap: 0.25rem;
  align-items: flex-start;
}
.rental-infobox__list-item--indent-8 {
  padding-left: 0.5rem;
}
.rental-infobox__list-item--indent-36 {
  padding-left: 2.25rem;
}
.rental-infobox__list-item-bullet {
  flex-shrink: 0;
  width: 1rem;
  height: 1.4375rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rental-infobox__list-item-bullet--dot::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background: #4b4d4d;
  border-radius: 4px;
}
.rental-infobox__list-item-bullet--circle {
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
}
.rental-infobox__list-item-bullet--number {
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.5;
  color: #4b4d4d;
}
.rental-infobox__list-item-text {
  flex: 1;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
  word-break: break-all;
}

/* 시설물사용료 테이블 스타일 */
.facility-fee-table tbody td {
  vertical-align: middle;
}
.facility-fee-table .facility-category {
  font-weight: 700;
  text-align: center;
}
.facility-fee-table .remark-cell {
  text-align: left;
  vertical-align: top;
  padding: 1rem;
  line-height: 1.8;
}

/* 빨간색 텍스트 */
.text-red {
  color: #d7424e;
}

/* 안내 메시지 박스 - 책마중서비스 등에서 사용 */
.info-notice {
  background: #f4f5f6;
  border: 1px solid #cdd1d5;
  border-radius: 0.75rem;
  padding: 1rem;
}
.info-notice__header {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}
.info-notice__icon {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.info-notice__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.info-notice__title {
  flex: 1;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.5;
  color: #191a1a;
  margin: 0;
  word-break: keep-all;
}
@media (max-width: 900px) {
  .info-notice {
    padding: 0.75rem;
  }
  .info-notice__title {
    font-size: 0.9375rem;
  }
}

/* 파란색 인포박스 */
.com-infobox-blue {
  background-color: #f0f7ff;
  border: 1px solid #d4e6f7;
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin-top: 1.5rem;
}
.com-infobox-blue__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.com-infobox-blue__icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}
.com-infobox-blue__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: #003456;
  margin: 0;
}
.com-infobox-blue__content {
  padding-left: 2rem;
}
.com-infobox-blue__list {
  list-style: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}
.com-infobox-blue__list li {
  counter-increment: item;
  position: relative;
  padding-left: 1.5rem;
  font-size: 1rem;
  line-height: 1.8;
  color: #333;
  margin-bottom: 0.5rem;
}
.com-infobox-blue__list li:last-child {
  margin-bottom: 0;
}
.com-infobox-blue__list li::before {
  content: counter(item) ". ";
  position: absolute;
  left: 0;
  font-weight: 600;
  color: #003456;
}

/* 반응형 조정 */
@media (max-width: 900px) {
  .com-infobox-blue {
    padding: 1rem;
  }
  .com-infobox-blue__content {
    padding-left: 1rem;
  }
  .com-infobox-blue__list li {
    font-size: 0.875rem;
    padding-left: 1.25rem;
  }
  .facility-fee-table .remark-cell {
    padding: 0.75rem;
    font-size: 0.875rem;
  }
}
.facility-guide .usage-guide__table th {
  text-align: center;
}

.search-detail-section .ui-accordion.ui-accordion--default.ui-accordion--medium .ui-accordion__trigger .ui-accordion__header {
  justify-content: center;
}

.search-detail-section__content .ui-tab.ui-tab--default.ui-tab--medium.mb-4.search-type-tabs.ui-tab--grid-5 .ui-tab__list {
  margin-top: 24px;
}

.ui-library-filter__search.flex.gap-8.mt20 {
  margin-top: 20px !important;
}

/*# sourceMappingURL=sub.css.map */