@charset "UTF-8";
:root {
  --main-color: #2D2E83;
  --main-hover: ;
  --primary-color: #1F36A9;
  --primary-hover: #1d3994;
  --sub-color: #BCCF00;
  --sub-hover: #9BB800;
  --secondary-color: #82C91F;
  --secondary-hover: #6FA71B;
  --tertiary-color: #009FE3;
  --tertiary-hover: #008CC9;
  --quaternary-color: #1d9f6f;
  --quaternary-hover: #157e57;
  --primary-light: #F2F4F6;
  --primary-light-hover: #f0fff3;
  --grdientC01: linear-gradient(141deg, #2AAAE4 -1.07%, #1F36A9 98.93%);
  /* 포탈 색상 변수 [S] */
  --primary-light1: ;
  --primary-light1-hover: ;
  --primary-light2: ;
  --primary-light2-hover: ;
  --lib-primary-color: ;
  --lib-primary-hover: ;
  --lib-secondary-color: ;
  --lib-secondary-hover: ;
  --lib-tertiary-color: ;
  --lib-tertiary-hover: ;
  /* 포탈 색상 변수 [E] */
  --default-bg: #fff;
  --default-border: #c1c8d0;
  --default-color: #333;
  --default-hover: #f2f2f2;
  --sub-color: #BCCF00;
  --sub-hover: #9BB800;
  --secondary-color: #333;
  --secondary-hover: #000;
  --tertiary-color: #0091e7;
  --tertiary-hover: #f0f9ff;
  --positive-color: #0093e3;
  --positive-hover: #0082c8;
  --negative-color: #FF3B30;
  --negative-hover: #E6342E;
  --disabled-color: #e5e5e5;
  --disabled-text-color: #5C5C5C;
  --disabled-color02: #555;
  --disabled-text-color02: #fff;
  --btnBlack-color: #252525;
  --btnBlack-hover: #000;
  --btnGray-color: #555;
  --btnGray-hover: #444;
}

body.site-edu {
  --main-color: #2D2E83;
  --main-hover: ;
  --primary-color: #1F36A9;
  --primary-hover: #1d3994;
  --sub-color: #BCCF00;
  --sub-hover: #9BB800;
  --secondary-color: #82C91F;
  --secondary-hover: #6FA71B;
  --tertiary-color: #009FE3;
  --tertiary-hover: #008CC9;
  --quaternary-color: #1d9f6f;
  --quaternary-hover: #157e57;
  --primary-light: #F2F4F6;
  --primary-light-hover: #f0fff3;
  --grdientC01: linear-gradient(141deg, #2AAAE4 -1.07%, #1F36A9 98.93%);
  /* 포탈 색상 변수 [S] */
  --primary-light1: ;
  --primary-light1-hover: ;
  --primary-light2: ;
  --primary-light2-hover: ;
  --lib-primary-color: ;
  --lib-primary-hover: ;
  --lib-secondary-color: ;
  --lib-secondary-hover: ;
  --lib-tertiary-color: ;
  --lib-tertiary-hover: ;
  /* 포탈 색상 변수 [E] */
}

body.site-culture,
body.site-edu-culture {
  --main-color: #2D2E83;
  --main-hover: ;
  --primary-color: #1F36A9;
  --primary-hover: #1d3994;
  --sub-color: #BCCF00;
  --sub-hover: #9BB800;
  --secondary-color: #5571FF;
  --secondary-hover: #445EC6;
  --tertiary-color: #0AAF8E;
  --tertiary-hover: #088D73;
  --quaternary-color: #FBAC1C;
  --quaternary-hover: #D99318;
  --primary-light: #F2F4F6;
  --primary-light-hover: #f0fff3;
  --grdientC01: linear-gradient(141deg, #5571FF -1.07%, #20C7A5 98.93%);
  /* 포탈 색상 변수 [S] */
  --primary-light1: ;
  --primary-light1-hover: ;
  --primary-light2: ;
  --primary-light2-hover: ;
  --lib-primary-color: ;
  --lib-primary-hover: ;
  --lib-secondary-color: ;
  --lib-secondary-hover: ;
  --lib-tertiary-color: ;
  --lib-tertiary-hover: ;
  /* 포탈 색상 변수 [E] */
}

body.portal {
  --main-color: ;
  --main-hover: ;
  --primary-color: #1D9F6F;
  --primary-hover: #157E57;
  --sub-color: ;
  --sub-hover: ;
  --secondary-color: #2F9400;
  --secondary-hover: #267900;
  --tertiary-color: #172A88;
  --tertiary-hover: #15257A;
  --quaternary-color: ;
  --quaternary-hover: ;
  --primary-light: ;
  --primary-light-hover: ;
  --grdientC01: ;
  /* 포탈 색상 변수 [S] */
  --primary-light1: #E2EFEB;
  --primary-light1-hover: #D1E9E3;
  --primary-light2: #F6F9F8;
  --primary-light2-hover: #E9EDFF;
  --lib-primary-color: #1F36A9;
  --lib-primary-hover: #1d3994;
  --lib-secondary-color: #82C91F;
  --lib-secondary-hover: #6FA71B;
  --lib-tertiary-color: #009FE3;
  --lib-tertiary-hover: #008CC9;
  /* 포탈 색상 변수 [E] */
}

/**
 * 버튼 시스템
 * ---------------------------------------------------------------------------
 * 기능:
 * - 기본 버튼, 색상 변형, 크기 변형 지원
 * - 반응형 디자인
 * - 접근성 고려
 * 
 * 사용 예시:
 * <button class="btn>기본 버튼</button>
 * <button class="btn--pri btn--ico-sm">주요 버튼</button>
 * <button class="btn--sec btn--ico-lg">큰 보조 버튼</button>
 */
/**
 * 버튼 기본 스타일 믹스인
 * ---------------------------------------------------------------------------
 * 모든 버튼에 공통적으로 적용되는 기본 스타일을 정의합니다.
 * - 인라인 플렉스 레이아웃
 * - 중앙 정렬
 * - 기본 크기 및 여백
 * - 전환 효과
 */
:root {
  --btn-height: 4.2rem;
  --btn-width: 7.8rem;
  --btn-padding: 0.5rem 1.2rem;
  --btn-border-radius: 0.6rem;
  --btn-transition: all 0.2s ease;
  --btn-font-weight: 500;
  --btn-font-size: 1.6rem;
  --btn-line-height: 1;
}

/**
 * 버튼 변형 스타일 믹스인
 * ---------------------------------------------------------------------------
 * 버튼 타입별 스타일을 정의합니다.
 * @param {string} $variant - 버튼 타입 (default, primary, secondary, tertiary, positive, negative, disabled)
 */
/**
 * 버튼 크기 변형
 * ---------------------------------------------------------------------------
 * 버튼의 크기를 정의하는 맵입니다.
 * - small: 작은 크기 (32px)
 * - large: 큰 크기 (48px)
 */
/**
 * 버튼 크기 믹스인
 * ---------------------------------------------------------------------------
 * 버튼의 크기를 설정합니다.
 * @param {string} $size - 버튼 크기 (small, large)
 */
/**
 * 버튼 컴포넌트
 * ---------------------------------------------------------------------------
 * 사용 가능한 클래스:
 * - .btn: 기본 버튼
 * - .btn--pri: 주요 버튼
 * - .btn--sec: 보조 버튼
 * - .btn--ter: 3차 버튼
 * - .btn--ico-positive: 긍정 버튼
 * - .btn--ico-warning: 경고 버튼
 * - .btn--ico-sm: 작은 크기
 * - .btn--ico-lg: 큰 크기
 * 
 * 예시: <button class="btn--pri btn--ico-sm">작은 주요 버튼</button>
 */
.btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--default-bg);
  border: 1px solid #c1c8d0;
  color: #252525;
}
.btn:hover:not(:disabled) {
  background-color: var(--default-hover);
}
.btn--pri {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--primary-color);
  border: 1px solid var(--primary-color);
  color: #fff;
}
.btn--pri:hover:not(:disabled) {
  background-color: var(--primary-hover);
  border-color: var(--primary-hover);
}
.btn--pri-line {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: #fff;
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
}
.btn--pri-line:hover:not(:disabled) {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
}
.btn--sec {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--secondary-color);
  border: 1px solid var(--secondary-color);
  color: #fff;
}
.btn--sec:hover:not(:disabled) {
  background-color: var(--secondary-hover);
  border-color: var(--secondary-hover);
}
.btn--ter {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--tertiary-color);
  border: 1px solid var(--tertiary-color);
  color: #fff;
}
.btn--ter:hover:not(:disabled) {
  background-color: var(--tertiary-hover);
  border-color: var(--tertiary-hover);
}
.btn--quat {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--quaternary-color);
  border: 1px solid var(--quaternary-color);
  color: #fff;
}
.btn--quat:hover:not(:disabled) {
  background-color: var(--quaternary-hover);
  border-color: var(--quaternary-hover);
}
.btn--blk {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--btnBlack-color);
  border: 1px solid var(--btnBlack-color);
  color: #fff;
}
.btn--blk:hover:not(:disabled) {
  background-color: var(--btnBlack-hover);
  border-color: var(--btnBlack-hover);
}
.btn--gry {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--btnGray-color);
  border: 1px solid var(--btnGray-color);
  color: #fff;
}
.btn--gry:hover:not(:disabled) {
  background-color: var(--btnGray-hover);
  border-color: var(--btnGray-hover);
}
.btn--pos {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--positive-color);
  border: 1px solid var(--positive-color);
  color: #fff;
}
.btn--pos:hover:not(:disabled) {
  background-color: var(--positive-hover);
  border-color: var(--positive-hover);
}
.btn--neg {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--negative-color);
  border: 1px solid var(--negative-color);
  color: #fff;
}
.btn--neg:hover:not(:disabled) {
  background-color: var(--negative-hover);
  border-color: var(--negative-hover);
}
.btn--dis {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--disabled-color);
  border: 1px solid var(--disabled-color);
  color: var(--disabled-text-color);
  cursor: not-allowed;
}
.btn:disabled, .btn--pri:disabled, .btn--pri-line:disabled, .btn--sec:disabled, .btn--ter:disabled, .btn--quat:disabled, .btn--blk:disabled, .btn--gry:disabled, .btn--pos:disabled, .btn--neg:disabled {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  background-color: var(--disabled-color);
  border: 1px solid var(--disabled-color);
  color: var(--disabled-text-color);
  cursor: not-allowed;
}
.btn--sm {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  min-height: 32px;
  min-width: 60px;
  padding: 4px 8px;
  font-size: 14px;
}
.btn--lg {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  min-width: var(--btn-width);
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  border-radius: var(--btn-border-radius);
  box-sizing: border-box;
  position: relative;
  font-weight: var(--btn-font-weight);
  font-size: var(--btn-font-size);
  line-height: var(--btn-line-height);
  word-break: keep-all;
  transition: var(--btn-transition);
  cursor: pointer;
  min-height: 5.2rem;
  min-width: 15rem;
  font-size: 2rem;
  font-weight: 600;
  border-radius: 0.8rem;
}
.btn--lg:disabled {
  min-height: 5.2rem;
  min-width: 15rem;
  font-size: 2rem;
  font-weight: 600;
  border-radius: 0.8rem;
}

/*---------------------------------------------------------------------------------------------------------------*/
/**
 * 버튼 컨테이너
 * ---------------------------------------------------------------------------
 * BEM 구조:
 * Block: btn-container
 * Modifiers: 
 *   - btn-container--right: 우측 정렬
 *   - btn-container--left: 좌측 정렬
 *   - btn-container--justify: 양쪽 정렬
 *   - btn-container--column: 세로 방향
 *   - full: 전체 너비
 *   - full-column: 전체 너비 세로 방향
 */
.btn-container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  padding: 4rem 0 0;
  box-sizing: border-box;
}
.btn-container--left {
  justify-content: flex-start;
}
.btn-container--right {
  justify-content: flex-end;
}
.btn-container--justify {
  display: flex;
  width: 100%;
  flex-flow: row nowrap;
  justify-content: space-between;
}
.btn-container--column {
  display: flex;
  flex-flow: column;
}
.btn-container--column *[class*=btn] {
  width: 100%;
}
.btn-container--full {
  display: flex;
  flex-flow: row nowrap;
}
.btn-container.full_column {
  display: flex;
  flex-flow: column;
}
.btn-container.full_column *[class*=btn] {
  flex: 1;
  min-height: 46px;
}
.btn-container--lg {
  display: flex;
  justify-content: center;
  gap: 1.2rem;
  padding: 4rem 0 0;
}
.btn-container--lg .btn {
  min-width: 15rem;
  height: 5.2rem;
  border-radius: 0.8rem;
  font-size: 2rem;
}

/* --------------------------------------------------------------------------------------------------------------- */
a[class*=btn--ico-],
button[class*=btn--ico-] {
  gap: 0.8rem;
}
a[class*=btn--ico-]::before,
button[class*=btn--ico-]::before {
  display: block;
  content: "";
  flex: none;
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: all 0.2s ease;
}

.btn--lg[class*=btn--ico-]::before {
  width: 2.4rem;
  height: 2.4rem;
}

/* 검색 버튼 */
.btn--ico-search::before {
  background-image: url("../images/search_icon.svg");
}

.btn--pri.btn--ico-search::before,
.btn--sec.btn--ico-search::before,
.btn--ter.btn--ico-search::before,
.btn--blk.btn--ico-search::before {
  background-image: url("../images/search_primary_icon.svg");
}

/* 초기화 버튼 */
.btn--ico-reset::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M5.46257 4.43262C7.21556 2.91688 9.5007 2 12 2C17.5228 2 22 6.47715 22 12C22 14.1361 21.3302 16.1158 20.1892 17.7406L17 12H20C20 7.58172 16.4183 4 12 4C9.84982 4 7.89777 4.84827 6.46023 6.22842L5.46257 4.43262ZM18.5374 19.5674C16.7844 21.0831 14.4993 22 12 22C6.47715 22 2 17.5228 2 12C2 9.86386 2.66979 7.88416 3.8108 6.25944L7 12H4C4 16.4183 7.58172 20 12 20C14.1502 20 16.1022 19.1517 17.5398 17.7716L18.5374 19.5674Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-reset::before,
.btn--sec.btn--ico-reset::before,
.btn--gry.btn--ico-reset::before {
  background-image: url("../images/reset_primary_icon.svg");
}

/* 신청 버튼 */
.btn--ico-apply::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M17 2V4H20.0066C20.5552 4 21 4.44495 21 4.9934V21.0066C21 21.5552 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5551 3 21.0066V4.9934C3 4.44476 3.44495 4 3.9934 4H7V2H17ZM7 6H5V20H19V6H17V8H7V6ZM9 16V18H7V16H9ZM9 13V15H7V13H9ZM9 10V12H7V10H9ZM15 4H9V6H15V4Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-apply::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M17 2V4H20.0066C20.5552 4 21 4.44495 21 4.9934V21.0066C21 21.5552 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5551 3 21.0066V4.9934C3 4.44476 3.44495 4 3.9934 4H7V2H17ZM7 6H5V20H19V6H17V8H7V6ZM9 16V18H7V16H9ZM9 13V15H7V13H9ZM9 10V12H7V10H9ZM15 4H9V6H15V4Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 신청 취소 버튼 */
.btn--ico-apply_cancel::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M9 3V1H7V3H3C2.44772 3 2 3.44772 2 4V20C2 20.5523 2.44772 21 3 21H21C21.5523 21 22 20.5523 22 20V4C22 3.44772 21.5523 3 21 3H17V1H15V3H9ZM4 10H20V19H4V10ZM4 5H7V6H9V5H15V6H17V5H20V8H4V5ZM9.87862 10.9644L12 13.0858L14.1212 10.9644L15.5355 12.3785L13.4142 14.5001L15.5354 16.6212L14.1213 18.0354L12 15.9143L9.87855 18.0354L8.46442 16.6211L10.5857 14.5001L8.46436 12.3785L9.87862 10.9644Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}

.btn--pri.btn--ico-apply_cancel::before,
.btn--sec.btn--ico-apply_cancel::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M9 3V1H7V3H3C2.44772 3 2 3.44772 2 4V20C2 20.5523 2.44772 21 3 21H21C21.5523 21 22 20.5523 22 20V4C22 3.44772 21.5523 3 21 3H17V1H15V3H9ZM4 10H20V19H4V10ZM4 5H7V6H9V5H15V6H17V5H20V8H4V5ZM9.87862 10.9644L12 13.0858L14.1212 10.9644L15.5355 12.3785L13.4142 14.5001L15.5354 16.6212L14.1213 18.0354L12 15.9143L9.87855 18.0354L8.46442 16.6211L10.5857 14.5001L8.46436 12.3785L9.87862 10.9644Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 글쓰기 버튼 */
.btn--ico-write::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M15.7279 9.57627L14.3137 8.16206L5 17.4758V18.89H6.41421L15.7279 9.57627ZM17.1421 8.16206L18.5563 6.74785L17.1421 5.33363L15.7279 6.74785L17.1421 8.16206ZM7.24264 20.89H3V16.6473L16.435 3.21231C16.8256 2.82179 17.4587 2.82179 17.8492 3.21231L20.6777 6.04074C21.0682 6.43126 21.0682 7.06443 20.6777 7.45495L7.24264 20.89Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-write::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M15.7279 9.57627L14.3137 8.16206L5 17.4758V18.89H6.41421L15.7279 9.57627ZM17.1421 8.16206L18.5563 6.74785L17.1421 5.33363L15.7279 6.74785L17.1421 8.16206ZM7.24264 20.89H3V16.6473L16.435 3.21231C16.8256 2.82179 17.4587 2.82179 17.8492 3.21231L20.6777 6.04074C21.0682 6.43126 21.0682 7.06443 20.6777 7.45495L7.24264 20.89Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 수정 버튼 */
.btn--ico-edit:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M16.7574 2.99677L14.7574 4.99677H5V18.9968H19V9.23941L21 7.23941V19.9968C21 20.5491 20.5523 20.9968 20 20.9968H4C3.44772 20.9968 3 20.5491 3 19.9968V3.99677C3 3.44448 3.44772 2.99677 4 2.99677H16.7574ZM20.4853 2.09727L21.8995 3.51149L12.7071 12.7039L11.2954 12.7063L11.2929 11.2897L20.4853 2.09727Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-edit:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M16.7574 2.99677L14.7574 4.99677H5V18.9968H19V9.23941L21 7.23941V19.9968C21 20.5491 20.5523 20.9968 20 20.9968H4C3.44772 20.9968 3 20.5491 3 19.9968V3.99677C3 3.44448 3.44772 2.99677 4 2.99677H16.7574ZM20.4853 2.09727L21.8995 3.51149L12.7071 12.7039L11.2954 12.7063L11.2929 11.2897L20.4853 2.09727Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 삭제 버튼 */
.btn--ico-delete::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M17 6H22V8H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V8H2V6H7V3C7 2.44772 7.44772 2 8 2H16C16.5523 2 17 2.44772 17 3V6ZM18 8H6V20H18V8ZM9 11H11V17H9V11ZM13 11H15V17H13V11ZM9 4V6H15V4H9Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-delete::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M17 6H22V8H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V8H2V6H7V3C7 2.44772 7.44772 2 8 2H16C16.5523 2 17 2.44772 17 3V6ZM18 8H6V20H18V8ZM9 11H11V17H9V11ZM13 11H15V17H13V11ZM9 4V6H15V4H9Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 다국어 버튼 */
.btn--ico-keyboard::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-keyboard::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 관심도서 버튼 */
.btn--ico-interest::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M3 18.5V5C3 3.34315 4.34315 2 6 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22H6.5C4.567 22 3 20.433 3 18.5ZM19 20V17H6.5C5.67157 17 5 17.6716 5 18.5C5 19.3284 5.67157 20 6.5 20H19ZM10 4H6C5.44772 4 5 4.44772 5 5V15.3368C5.45463 15.1208 5.9632 15 6.5 15H19V4H17V12L13.5 10L10 12V4Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-interest::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M3 18.5V5C3 3.34315 4.34315 2 6 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22H6.5C4.567 22 3 20.433 3 18.5ZM19 20V17H6.5C5.67157 17 5 17.6716 5 18.5C5 19.3284 5.67157 20 6.5 20H19ZM10 4H6C5.44772 4 5 4.44772 5 5V15.3368C5.45463 15.1208 5.9632 15 6.5 15H19V4H17V12L13.5 10L10 12V4Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 장바구니 버튼 */
.btn--ico-cart::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M4.00436 6.41686L0.761719 3.17422L2.17593 1.76001L5.41857 5.00265H20.6603C21.2126 5.00265 21.6603 5.45037 21.6603 6.00265C21.6603 6.09997 21.6461 6.19678 21.6182 6.29L19.2182 14.29C19.0913 14.713 18.7019 15.0027 18.2603 15.0027H6.00436V17.0027H17.0044V19.0027H5.00436C4.45207 19.0027 4.00436 18.5549 4.00436 18.0027V6.41686ZM6.00436 7.00265V13.0027H17.5163L19.3163 7.00265H6.00436ZM5.50436 23.0027C4.67593 23.0027 4.00436 22.3311 4.00436 21.5027C4.00436 20.6742 4.67593 20.0027 5.50436 20.0027C6.33279 20.0027 7.00436 20.6742 7.00436 21.5027C7.00436 22.3311 6.33279 23.0027 5.50436 23.0027ZM17.5044 23.0027C16.6759 23.0027 16.0044 22.3311 16.0044 21.5027C16.0044 20.6742 16.6759 20.0027 17.5044 20.0027C18.3328 20.0027 19.0044 20.6742 19.0044 21.5027C19.0044 22.3311 18.3328 23.0027 17.5044 23.0027Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-cart::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M4.00436 6.41686L0.761719 3.17422L2.17593 1.76001L5.41857 5.00265H20.6603C21.2126 5.00265 21.6603 5.45037 21.6603 6.00265C21.6603 6.09997 21.6461 6.19678 21.6182 6.29L19.2182 14.29C19.0913 14.713 18.7019 15.0027 18.2603 15.0027H6.00436V17.0027H17.0044V19.0027H5.00436C4.45207 19.0027 4.00436 18.5549 4.00436 18.0027V6.41686ZM6.00436 7.00265V13.0027H17.5163L19.3163 7.00265H6.00436ZM5.50436 23.0027C4.67593 23.0027 4.00436 22.3311 4.00436 21.5027C4.00436 20.6742 4.67593 20.0027 5.50436 20.0027C6.33279 20.0027 7.00436 20.6742 7.00436 21.5027C7.00436 22.3311 6.33279 23.0027 5.50436 23.0027ZM17.5044 23.0027C16.6759 23.0027 16.0044 22.3311 16.0044 21.5027C16.0044 20.6742 16.6759 20.0027 17.5044 20.0027C18.3328 20.0027 19.0044 20.6742 19.0044 21.5027C19.0044 22.3311 18.3328 23.0027 17.5044 23.0027Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 엑셀 버튼 */
.btn--ico-excel {
  border-color: #4f962a;
  color: #4f962a;
}

.btn--ico-excel::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(79,150,42,1)'%3E%3Cpath d='M2.85858 2.87732L15.4293 1.0815C15.7027 1.04245 15.9559 1.2324 15.995 1.50577C15.9983 1.52919 16 1.55282 16 1.57648V22.4235C16 22.6996 15.7761 22.9235 15.5 22.9235C15.4763 22.9235 15.4527 22.9218 15.4293 22.9184L2.85858 21.1226C2.36593 21.0522 2 20.6303 2 20.1327V3.86727C2 3.36962 2.36593 2.9477 2.85858 2.87732ZM4 4.73457V19.2654L14 20.694V3.30599L4 4.73457ZM17 19H20V4.99997H17V2.99997H21C21.5523 2.99997 22 3.44769 22 3.99997V20C22 20.5523 21.5523 21 21 21H17V19ZM10.2 12L13 16H10.6L9 13.7143L7.39999 16H5L7.8 12L5 7.99997H7.39999L9 10.2857L10.6 7.99997H13L10.2 12Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-excel::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M2.85858 2.87732L15.4293 1.0815C15.7027 1.04245 15.9559 1.2324 15.995 1.50577C15.9983 1.52919 16 1.55282 16 1.57648V22.4235C16 22.6996 15.7761 22.9235 15.5 22.9235C15.4763 22.9235 15.4527 22.9218 15.4293 22.9184L2.85858 21.1226C2.36593 21.0522 2 20.6303 2 20.1327V3.86727C2 3.36962 2.36593 2.9477 2.85858 2.87732ZM4 4.73457V19.2654L14 20.694V3.30599L4 4.73457ZM17 19H20V4.99997H17V2.99997H21C21.5523 2.99997 22 3.44769 22 3.99997V20C22 20.5523 21.5523 21 21 21H17V19ZM10.2 12L13 16H10.6L9 13.7143L7.39999 16H5L7.8 12L5 7.99997H7.39999L9 10.2857L10.6 7.99997H13L10.2 12Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 체크 버튼 */
.btn--ico-check::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M9.9997 15.1709L19.1921 5.97852L20.6063 7.39273L9.9997 17.9993L3.63574 11.6354L5.04996 10.2212L9.9997 15.1709Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-check::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M9.9997 15.1709L19.1921 5.97852L20.6063 7.39273L9.9997 17.9993L3.63574 11.6354L5.04996 10.2212L9.9997 15.1709Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn:disabled.btn--ico-check::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(119,119,119,1)'%3E%3Cpath d='M9.9997 15.1709L19.1921 5.97852L20.6063 7.39273L9.9997 17.9993L3.63574 11.6354L5.04996 10.2212L9.9997 15.1709Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 목록 버튼 */
.btn--ico-list::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M8 4H21V6H8V4ZM3 3.5H6V6.5H3V3.5ZM3 10.5H6V13.5H3V10.5ZM3 17.5H6V20.5H3V17.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-list::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M8 4H21V6H8V4ZM3 3.5H6V6.5H3V3.5ZM3 10.5H6V13.5H3V10.5ZM3 17.5H6V20.5H3V17.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 로그인 버튼 */
.btn--ico-login::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M4 15H6V20H18V4H6V9H4V3C4 2.44772 4.44772 2 5 2H19C19.5523 2 20 2.44772 20 3V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V15ZM10 11V8L15 12L10 16V13H2V11H10Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-login::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M4 15H6V20H18V4H6V9H4V3C4 2.44772 4.44772 2 5 2H19C19.5523 2 20 2.44772 20 3V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V15ZM10 11V8L15 12L10 16V13H2V11H10Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 상세검색 버튼 */
.btn--ico-detail::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748ZM12.1779 7.17624C11.4834 7.48982 11 8.18846 11 9C11 10.1046 11.8954 11 13 11C13.8115 11 14.5102 10.5166 14.8238 9.82212C14.9383 10.1945 15 10.59 15 11C15 13.2091 13.2091 15 11 15C8.79086 15 7 13.2091 7 11C7 8.79086 8.79086 7 11 7C11.41 7 11.8055 7.06167 12.1779 7.17624Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-detail::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748ZM12.1779 7.17624C11.4834 7.48982 11 8.18846 11 9C11 10.1046 11.8954 11 13 11C13.8115 11 14.5102 10.5166 14.8238 9.82212C14.9383 10.1945 15 10.59 15 11C15 13.2091 13.2091 15 11 15C8.79086 15 7 13.2091 7 11C7 8.79086 8.79086 7 11 7C11.41 7 11.8055 7.06167 12.1779 7.17624Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 일반검색 버튼 */
.btn--ico-normal::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748ZM12.1779 7.17624C11.4834 7.48982 11 8.18846 11 9C11 10.1046 11.8954 11 13 11C13.8115 11 14.5102 10.5166 14.8238 9.82212C14.9383 10.1945 15 10.59 15 11C15 13.2091 13.2091 15 11 15C8.79086 15 7 13.2091 7 11C7 8.79086 8.79086 7 11 7C11.41 7 11.8055 7.06167 12.1779 7.17624Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-normal::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748ZM12.1779 7.17624C11.4834 7.48982 11 8.18846 11 9C11 10.1046 11.8954 11 13 11C13.8115 11 14.5102 10.5166 14.8238 9.82212C14.9383 10.1945 15 10.59 15 11C15 13.2091 13.2091 15 11 15C8.79086 15 7 13.2091 7 11C7 8.79086 8.79086 7 11 7C11.41 7 11.8055 7.06167 12.1779 7.17624Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 업로드 버튼 */
.btn--ico-upload::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M12.4142 5H21C21.5523 5 22 5.44772 22 6V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H10.4142L12.4142 5ZM4 5V19H20V7H11.5858L9.58579 5H4ZM11 12V9H13V12H16V14H13V17H11V14H8V12H11Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-upload::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M12.4142 5H21C21.5523 5 22 5.44772 22 6V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H10.4142L12.4142 5ZM4 5V19H20V7H11.5858L9.58579 5H4ZM11 12V9H13V12H16V14H13V17H11V14H8V12H11Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 보기 버튼 */
.btn--ico-view::before {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center center;
}

.btn--pri.btn--ico-view::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 다운로드 버튼 */
.btn--ico-download::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M13 10H18L12 16L6 10H11V3H13V10ZM4 19H20V12H22V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V12H4V19Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-download::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M13 10H18L12 16L6 10H11V3H13V10ZM4 19H20V12H22V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V12H4V19Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 프린트 버튼 */
.btn--ico-print::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M17 2C17.5523 2 18 2.44772 18 3V7H21C21.5523 7 22 7.44772 22 8V18C22 18.5523 21.5523 19 21 19H18V21C18 21.5523 17.5523 22 17 22H7C6.44772 22 6 21.5523 6 21V19H3C2.44772 19 2 18.5523 2 18V8C2 7.44772 2.44772 7 3 7H6V3C6 2.44772 6.44772 2 7 2H17ZM16 17H8V20H16V17ZM20 9H4V17H6V16C6 15.4477 6.44772 15 7 15H17C17.5523 15 18 15.4477 18 16V17H20V9ZM8 10V12H5V10H8ZM16 4H8V7H16V4Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-print::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M17 2C17.5523 2 18 2.44772 18 3V7H21C21.5523 7 22 7.44772 22 8V18C22 18.5523 21.5523 19 21 19H18V21C18 21.5523 17.5523 22 17 22H7C6.44772 22 6 21.5523 6 21V19H3C2.44772 19 2 18.5523 2 18V8C2 7.44772 2.44772 7 3 7H6V3C6 2.44772 6.44772 2 7 2H17ZM16 17H8V20H16V17ZM20 9H4V17H6V16C6 15.4477 6.44772 15 7 15H17C17.5523 15 18 15.4477 18 16V17H20V9ZM8 10V12H5V10H8ZM16 4H8V7H16V4Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 달력 버튼 */
.btn--ico-calendar::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-calendar::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 링크 버튼 */
.btn--ico-link::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-link::before,
.btn--sec.btn--ico-link::before,
.btn--ter.btn--ico-link::before,
.btn--quat.btn--ico-link::before,
.btn--blk.btn--ico-link::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 홈 버튼 */
.btn--ico-home::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M19 21H5C4.44772 21 4 20.5523 4 20V11L1 11L11.3273 1.6115C11.7087 1.26475 12.2913 1.26475 12.6727 1.6115L23 11L20 11V20C20 20.5523 19.5523 21 19 21ZM13 19H18V9.15745L12 3.7029L6 9.15745V19H11V13H13V19Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-home::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M19 21H5C4.44772 21 4 20.5523 4 20V11L1 11L11.3273 1.6115C11.7087 1.26475 12.2913 1.26475 12.6727 1.6115L23 11L20 11V20C20 20.5523 19.5523 21 19 21ZM13 19H18V9.15745L12 3.7029L6 9.15745V19H11V13H13V19Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 이전 버튼 */
.btn--ico-prev::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M7.82843 10.9999H20V12.9999H7.82843L13.1924 18.3638L11.7782 19.778L4 11.9999L11.7782 4.22168L13.1924 5.63589L7.82843 10.9999Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-prev::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M7.82843 10.9999H20V12.9999H7.82843L13.1924 18.3638L11.7782 19.778L4 11.9999L11.7782 4.22168L13.1924 5.63589L7.82843 10.9999Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 다음 버튼 */
.btn--ico-next[class*=btn--ico-]::before {
  display: none;
}

.btn--ico-next::before {
  display: block;
  content: "";
  flex: none;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.2s ease;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M16.1716 10.9999L10.8076 5.63589L12.2218 4.22168L20 11.9999L12.2218 19.778L10.8076 18.3638L16.1716 12.9999H4V10.9999H16.1716Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-next::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M16.1716 10.9999L10.8076 5.63589L12.2218 4.22168L20 11.9999L12.2218 19.778L10.8076 18.3638L16.1716 12.9999H4V10.9999H16.1716Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 예약버튼 */
.btn--ico-reserve::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 10H4V19H20V10ZM15.0355 11.136L16.4497 12.5503L11.5 17.5L7.96447 13.9645L9.37868 12.5503L11.5 14.6716L15.0355 11.136ZM7 5H4V8H20V5H17V6H15V5H9V6H7V5Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-reserve::before,
.btn--sec.btn--ico-reserve::before,
.btn--ter.btn--ico-reserve::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 10H4V19H20V10ZM15.0355 11.136L16.4497 12.5503L11.5 17.5L7.96447 13.9645L9.37868 12.5503L11.5 14.6716L15.0355 11.136ZM7 5H4V8H20V5H17V6H15V5H9V6H7V5Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn:disabled.btn--ico-reserve::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(238,238,238,1)'%3E%3Cpath d='M9 3V1H7V3H3C2.44772 3 2 3.44772 2 4V20C2 20.5523 2.44772 21 3 21H21C21.5523 21 22 20.5523 22 20V4C22 3.44772 21.5523 3 21 3H17V1H15V3H9ZM4 10H20V19H4V10ZM4 5H7V6H9V5H15V6H17V5H20V8H4V5ZM9.87862 10.9644L12 13.0858L14.1212 10.9644L15.5355 12.3785L13.4142 14.5001L15.5354 16.6212L14.1213 18.0354L12 15.9143L9.87855 18.0354L8.46442 16.6211L10.5857 14.5001L8.46436 12.3785L9.87862 10.9644Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 배달버튼 */
.btn--ico-delivery::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M8.96456 18C8.72194 19.6961 7.26324 21 5.5 21C3.73676 21 2.27806 19.6961 2.03544 18H1V6C1 5.44772 1.44772 5 2 5H16C16.5523 5 17 5.44772 17 6V8H20L23 12.0557V18H20.9646C20.7219 19.6961 19.2632 21 17.5 21C15.7368 21 14.2781 19.6961 14.0354 18H8.96456ZM15 7H3V15.0505C3.63526 14.4022 4.52066 14 5.5 14C6.8962 14 8.10145 14.8175 8.66318 16H14.3368C14.5045 15.647 14.7296 15.3264 15 15.0505V7ZM17 13H21V12.715L18.9917 10H17V13ZM17.5 19C18.1531 19 18.7087 18.5826 18.9146 18C18.9699 17.8436 19 17.6753 19 17.5C19 16.6716 18.3284 16 17.5 16C16.6716 16 16 16.6716 16 17.5C16 17.6753 16.0301 17.8436 16.0854 18C16.2913 18.5826 16.8469 19 17.5 19ZM7 17.5C7 16.6716 6.32843 16 5.5 16C4.67157 16 4 16.6716 4 17.5C4 17.6753 4.03008 17.8436 4.08535 18C4.29127 18.5826 4.84689 19 5.5 19C6.15311 19 6.70873 18.5826 6.91465 18C6.96992 17.8436 7 17.6753 7 17.5Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-delivery::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M8.96456 18C8.72194 19.6961 7.26324 21 5.5 21C3.73676 21 2.27806 19.6961 2.03544 18H1V6C1 5.44772 1.44772 5 2 5H16C16.5523 5 17 5.44772 17 6V8H20L23 12.0557V18H20.9646C20.7219 19.6961 19.2632 21 17.5 21C15.7368 21 14.2781 19.6961 14.0354 18H8.96456ZM15 7H3V15.0505C3.63526 14.4022 4.52066 14 5.5 14C6.8962 14 8.10145 14.8175 8.66318 16H14.3368C14.5045 15.647 14.7296 15.3264 15 15.0505V7ZM17 13H21V12.715L18.9917 10H17V13ZM17.5 19C18.1531 19 18.7087 18.5826 18.9146 18C18.9699 17.8436 19 17.6753 19 17.5C19 16.6716 18.3284 16 17.5 16C16.6716 16 16 16.6716 16 17.5C16 17.6753 16.0301 17.8436 16.0854 18C16.2913 18.5826 16.8469 19 17.5 19ZM7 17.5C7 16.6716 6.32843 16 5.5 16C4.67157 16 4 16.6716 4 17.5C4 17.6753 4.03008 17.8436 4.08535 18C4.29127 18.5826 4.84689 19 5.5 19C6.15311 19 6.70873 18.5826 6.91465 18C6.96992 17.8436 7 17.6753 7 17.5Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn:disabled.btn--ico-delivery::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(119,119,119,1)'%3E%3Cpath d='M8.96456 18C8.72194 19.6961 7.26324 21 5.5 21C3.73676 21 2.27806 19.6961 2.03544 18H1V6C1 5.44772 1.44772 5 2 5H16C16.5523 5 17 5.44772 17 6V8H20L23 12.0557V18H20.9646C20.7219 19.6961 19.2632 21 17.5 21C15.7368 21 14.2781 19.6961 14.0354 18H8.96456ZM15 7H3V15.0505C3.63526 14.4022 4.52066 14 5.5 14C6.8962 14 8.10145 14.8175 8.66318 16H14.3368C14.5045 15.647 14.7296 15.3264 15 15.0505V7ZM17 13H21V12.715L18.9917 10H17V13ZM17.5 19C18.1531 19 18.7087 18.5826 18.9146 18C18.9699 17.8436 19 17.6753 19 17.5C19 16.6716 18.3284 16 17.5 16C16.6716 16 16 16.6716 16 17.5C16 17.6753 16.0301 17.8436 16.0854 18C16.2913 18.5826 16.8469 19 17.5 19ZM7 17.5C7 16.6716 6.32843 16 5.5 16C4.67157 16 4 16.6716 4 17.5C4 17.6753 4.03008 17.8436 4.08535 18C4.29127 18.5826 4.84689 19 5.5 19C6.15311 19 6.70873 18.5826 6.91465 18C6.96992 17.8436 7 17.6753 7 17.5Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 지도 버튼 */
.btn--ico-map::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M2 5L9 2L15 5L21.303 2.2987C21.5569 2.18992 21.8508 2.30749 21.9596 2.56131C21.9862 2.62355 22 2.69056 22 2.75827V19L15 22L9 19L2.69696 21.7013C2.44314 21.8101 2.14921 21.6925 2.04043 21.4387C2.01375 21.3765 2 21.3094 2 21.2417V5ZM16 19.3955L20 17.6812V5.03308L16 6.74736V19.3955ZM14 19.2639V6.73607L10 4.73607V17.2639L14 19.2639ZM8 17.2526V4.60451L4 6.31879V18.9669L8 17.2526Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-map::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M2 5L9 2L15 5L21.303 2.2987C21.5569 2.18992 21.8508 2.30749 21.9596 2.56131C21.9862 2.62355 22 2.69056 22 2.75827V19L15 22L9 19L2.69696 21.7013C2.44314 21.8101 2.14921 21.6925 2.04043 21.4387C2.01375 21.3765 2 21.3094 2 21.2417V5ZM16 19.3955L20 17.6812V5.03308L16 6.74736V19.3955ZM14 19.2639V6.73607L10 4.73607V17.2639L14 19.2639ZM8 17.2526V4.60451L4 6.31879V18.9669L8 17.2526Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 지도 핀 버튼 */
.btn--ico-map_marker::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M12 20.8995L16.9497 15.9497C19.6834 13.2161 19.6834 8.78392 16.9497 6.05025C14.2161 3.31658 9.78392 3.31658 7.05025 6.05025C4.31658 8.78392 4.31658 13.2161 7.05025 15.9497L12 20.8995ZM12 23.7279L5.63604 17.364C2.12132 13.8492 2.12132 8.15076 5.63604 4.63604C9.15076 1.12132 14.8492 1.12132 18.364 4.63604C21.8787 8.15076 21.8787 13.8492 18.364 17.364L12 23.7279ZM12 13C13.1046 13 14 12.1046 14 11C14 9.89543 13.1046 9 12 9C10.8954 9 10 9.89543 10 11C10 12.1046 10.8954 13 12 13ZM12 15C9.79086 15 8 13.2091 8 11C8 8.79086 9.79086 7 12 7C14.2091 7 16 8.79086 16 11C16 13.2091 14.2091 15 12 15Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-map_marker::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M12 20.8995L16.9497 15.9497C19.6834 13.2161 19.6834 8.78392 16.9497 6.05025C14.2161 3.31658 9.78392 3.31658 7.05025 6.05025C4.31658 8.78392 4.31658 13.2161 7.05025 15.9497L12 20.8995ZM12 23.7279L5.63604 17.364C2.12132 13.8492 2.12132 8.15076 5.63604 4.63604C9.15076 1.12132 14.8492 1.12132 18.364 4.63604C21.8787 8.15076 21.8787 13.8492 18.364 17.364L12 23.7279ZM12 13C13.1046 13 14 12.1046 14 11C14 9.89543 13.1046 9 12 9C10.8954 9 10 9.89543 10 11C10 12.1046 10.8954 13 12 13ZM12 15C9.79086 15 8 13.2091 8 11C8 8.79086 9.79086 7 12 7C14.2091 7 16 8.79086 16 11C16 13.2091 14.2091 15 12 15Z'%3E%3C/path%3E%3C/svg%3E");
}

/* O 버튼 */
.btn--ico-positive::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-positive::before,
.btn:disabled.btn--ico-positive::before,
.btn--sec.btn--ico-positive::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z'%3E%3C/path%3E%3C/svg%3E");
}

/* X 버튼 */
.btn--ico-negative::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-negative::before,
.btn:disabled.btn--ico-negative::before,
.btn--sec.btn--ico-negative::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 시계 버튼 */
.btn--ico-time::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-time::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn:disabled.btn--ico-wait::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(119,119,119,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 경고 버튼 */
.btn--ico-warning::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-warning::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn:disabled.btn--ico-warning::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(119,119,119,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 플러스 버튼 */
.btn--ico-plus::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-plus::before,
.btn--sec.btn--ico-plus::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 마이너스 버튼 */
.btn--ico-minus::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M5 11V13H19V11H5Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-minus::before,
.btn--sec.btn--ico-minus::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M5 11V13H19V11H5Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 상호대차 버튼 */
.btn--ico-sangho::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M16.0503 12.0498L21 16.9996L16.0503 21.9493L14.636 20.5351L17.172 17.9988L4 17.9996V15.9996L17.172 15.9988L14.636 13.464L16.0503 12.0498ZM7.94975 2.0498L9.36396 3.46402L6.828 5.9988L20 5.99955V7.99955L6.828 7.9988L9.36396 10.5351L7.94975 11.9493L3 6.99955L7.94975 2.0498Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-sangho::before,
.btn--sec.btn--ico-sangho::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M16.0503 12.0498L21 16.9996L16.0503 21.9493L14.636 20.5351L17.172 17.9988L4 17.9996V15.9996L17.172 15.9988L14.636 13.464L16.0503 12.0498ZM7.94975 2.0498L9.36396 3.46402L6.828 5.9988L20 5.99955V7.99955L6.828 7.9988L9.36396 10.5351L7.94975 11.9493L3 6.99955L7.94975 2.0498Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 비회원 버튼 */
.btn--ico-negativenmember::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(31,54,169,1)'%3E%3Cpath d='M14 14.252V16.3414C13.3744 16.1203 12.7013 16 12 16C8.68629 16 6 18.6863 6 22H4C4 17.5817 7.58172 14 12 14C12.6906 14 13.3608 14.0875 14 14.252ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.21 11 16 9.21 16 7C16 4.79 14.21 3 12 3C9.79 3 8 4.79 8 7C8 9.21 9.79 11 12 11ZM19 17.5858L21.1213 15.4645L22.5355 16.8787L20.4142 19L22.5355 21.1213L21.1213 22.5355L19 20.4142L16.8787 22.5355L15.4645 21.1213L17.5858 19L15.4645 16.8787L16.8787 15.4645L19 17.5858Z'%3E%3C/path%3E%3C/svg%3E");
}

.btn--pri.btn--ico-negativenmember::before,
.btn--sec.btn--ico-negativenmember::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(255,255,255,1)'%3E%3Cpath d='M14 14.252V16.3414C13.3744 16.1203 12.7013 16 12 16C8.68629 16 6 18.6863 6 22H4C4 17.5817 7.58172 14 12 14C12.6906 14 13.3608 14.0875 14 14.252ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.21 11 16 9.21 16 7C16 4.79 14.21 3 12 3C9.79 3 8 4.79 8 7C8 9.21 9.79 11 12 11ZM19 17.5858L21.1213 15.4645L22.5355 16.8787L20.4142 19L22.5355 21.1213L21.1213 22.5355L19 20.4142L16.8787 22.5355L15.4645 21.1213L17.5858 19L15.4645 16.8787L16.8787 15.4645L19 17.5858Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 버튼 end */
@media screen and (max-width: 768px) {
  .btn {
    min-height: 3.8rem;
  }
  .btn--lg {
    min-height: 4.8rem;
    font-size: 1.6rem;
  }
  .btn--lg:disabled {
    min-height: 4.8rem;
    font-size: 1.6rem;
  }
  a[class*=btn--ico-]::before,
  button[class*=btn--ico-]::before {
    width: 1.6rem;
    height: 1.6rem;
  }
}
@font-face {
  font-family: "GongGothic";
  font-weight: 700;
  font-display: swap;
  src: url("../font/GongGothicBold.woff") format("woff");
}
@font-face {
  font-family: "GongGothic";
  font-weight: 500;
  font-display: swap;
  src: url("../font/GongGothicMedium.woff") format("woff");
}
@font-face {
  font-family: "GongGothic";
  font-weight: 300;
  font-display: swap;
  src: url("../font/GongGothicLight.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  font-display: swap;
  src: url("../font/Pretendard-Bold.woff2") format("woff2"), url("../font/Pretendard-Bold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  font-display: swap;
  src: url("../font/Pretendard-SemiBold.woff2") format("woff2"), url("../font/Pretendard-SemiBold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  font-display: swap;
  src: url("../font/Pretendard-Medium.woff2") format("woff2"), url("../font/Pretendard-Medium.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  font-display: swap;
  src: url("../font/Pretendard-Regular.woff2") format("woff2"), url("../font/Pretendard-Regular.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  font-display: swap;
  src: url("../font/Pretendard-Light.woff2") format("woff2"), url("../font/Pretendard-Light.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  font-display: swap;
  src: url("../font/Pretendard-Thin.woff2") format("woff2"), url("../font/Pretendard-Thin.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  font-display: swap;
  src: url("../font/Pretendard-ExtraLight.woff2") format("woff2"), url("../font/Pretendard-ExtraLight.woff") format("woff");
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video,
button {
  margin: 0;
  padding: 0;
  border: 0;
}

html,
body,
form,
fieldset,
p,
div,
h1,
h2,
h3,
h4,
h5,
h6 {
  -webkit-text-size-adjust: none;
}

html,
body {
  background-color: #fff;
}

html {
  font-size: 10px;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: "Pretendard", "Malgun Gothic", sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.4;
  word-break: keep-all;
  letter-spacing: -0.03em;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  color: #252525;
}
@media screen and (max-width: 768px) {
  body {
    font-size: 1.4rem;
  }
}

a {
  background: transparent;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  color: #252525;
  transition: all 0.2s ease;
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

svg:not(:root) {
  overflow: hidden;
}

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

pre {
  overflow: auto;
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

code,
kbd,
pre,
samp {
  font: inherit;
}

mark {
  background: #ff0;
  color: #1a1a1a;
}

dfn {
  font-style: italic;
}

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

td,
th {
  padding: 0;
}

ul,
ol {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font: inherit;
}

address,
caption,
cite,
code,
dfn,
em,
var {
  font-style: normal;
}

strong {
  font-weight: 600;
}

img {
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
}

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button,
select {
  text-transform: none;
}

button {
  overflow: visible;
  border: 0 none;
  background-color: transparent;
  transition: all 0.2s ease;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type=checkbox],
input[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  height: auto;
}

input[type=search] {
  -webkit-appearance: textfield;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

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

textarea {
  overflow: auto;
  resize: vertical;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #858585;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #858585;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #858585;
}

*:focus-visible {
  outline: solid 1.5px #000;
  outline-offset: 1.5px;
}

.scroll_lock {
  touch-action: none;
  -webkit-overflow-scrolling: none;
  overflow: hidden;
  overscroll-behavior: none;
}

/* input */
input[type=checkbox] {
  width: 20px;
  height: 20px;
}

input[type=radio] {
  width: 20px;
  height: 20px;
}

label,
button {
  cursor: pointer;
}

label,
input {
  vertical-align: middle;
}

.label_wrap {
  display: flex;
}

.label_wrap.center {
  justify-content: center;
}

.label_wrap.left {
  justify-content: flex-start;
}

.label_wrap.right {
  justify-content: flex-end;
}

.label_box {
  display: block;
  padding: 0 0 0 23px;
  line-height: 1;
  box-sizing: border-box;
  position: relative;
}
.label_box input[type=checkbox] {
  position: absolute;
  left: 0;
  top: 1px;
}
.label_box input[type=radio] {
  position: absolute;
  left: 0;
  top: 1px;
}
.label_box label {
  min-height: 18px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  line-height: 1.2em;
  word-break: keep-all;
}
.label_box.gray label {
  font-weight: 500;
  color: #555;
}

.label_text_box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 5px;
}

.input-box-container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 1.5rem;
}

.input-box {
  position: relative;
  padding: 0 0 0 2.5rem;
  line-height: 1;
}

.input-box__input {
  position: absolute;
  left: 0;
  top: 0;
}

.input-box__label {
  line-height: 1.1em;
}

.chk-container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 4rem;
}
@media screen and (max-width: 768px) {
  .chk-container {
    gap: 2.4rem;
  }
}

.chk-box {
  display: flex;
  align-items: center;
  padding: 0 0 0 3rem;
  position: relative;
}
@media screen and (max-width: 768px) {
  .chk-box {
    padding: 0 0 0 2.4rem;
  }
}

.chk-input[type=radio] {
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  border: 0.1rem solid #c1c8d0;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
  left: 0;
  top: -0.05rem;
}
.chk-input[type=radio]:checked {
  border: solid 0.6rem var(--primary-color);
}
.chk-input[type=radio]:focus-visible {
  outline: solid 2px #000;
}
@media screen and (max-width: 768px) {
  .chk-input[type=radio] {
    width: 1.8rem;
    height: 1.8rem;
    top: 0.1rem;
  }
  .chk-input[type=radio]:checked {
    border: solid 0.5rem var(--primary-color);
  }
}

.chk-input[type=checkbox] {
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 0.4rem;
  border: 0.1rem solid #c1c8d0;
  background-repeat: no-repeat;
  background-position: center;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
  position: absolute;
  left: 0;
  top: -0.05rem;
}
.chk-input[type=checkbox]:checked {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='22' height='22' fill='rgba(255,255,255,1)'%3E%3Cpath d='M9.9997 15.1709L19.1921 5.97852L20.6063 7.39273L9.9997 17.9993L3.63574 11.6354L5.04996 10.2212L9.9997 15.1709Z'%3E%3C/path%3E%3C/svg%3E");
}
@media screen and (max-width: 768px) {
  .chk-input[type=checkbox] {
    width: 1.8rem;
    height: 1.8rem;
    background-size: 1.8rem;
    top: 0;
  }
}

.chk-label {
  color: #555;
  font-weight: 500;
}

@media screen and (max-width: 760px) {
  .label_wrap {
    flex-flow: column nowrap;
  }
  input[type=checkbox] {
    width: 16px;
    height: 16px;
  }
  input[type=radio] {
    width: 16px;
    height: 16px;
  }
  .label_box {
    padding: 0 0 0 20px;
  }
}
.label_select {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 5px;
  padding: 0;
  position: static;
}
.label_select label {
  flex: none;
  font-weight: 600;
}

.label_in_checkbox {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.label_in_checkbox + .label_in_checkbox {
  margin-left: 8px;
}

input[type=text]:disabled,
input[type=password]:disabled,
input[type=number]:disabled,
input[type=tel]:disabled,
input[type=email]:disabled,
input[type=url]:disabled,
input[type=search]:disabled,
input[type=file]:disabled,
input[type=date]:disabled,
input[type=month]:disabled,
input[type=time]:disabled,
input[type=datetime-local]:disabled {
  background: #f5f5f5;
}

input[type=text]:read-only,
input[type=password]:read-only,
input[type=number]:read-only,
input[type=tel]:read-only,
input[type=email]:read-only,
input[type=url]:read-only,
input[type=search]:read-only,
input[type=file]:read-only,
input[type=date]:read-only,
input[type=month]:read-only,
input[type=time]:read-only,
input[type=datetime-local]:read-only {
  background: #f5f5f5;
}

th .label_box {
  justify-content: center;
}

a.skip {
  position: fixed;
  left: -9999px;
  top: -9999px;
  display: block;
  line-height: 3em;
  background: #40b2cd;
  color: #fff;
  text-align: center;
}

a.skip:hover,
a.skip:focus {
  position: static;
  left: 0;
  top: 0;
}

input[type=text]:disabled,
input[type=password]:disabled {
  background: #f2f2f2;
}

.container {
  margin: 0 auto;
}

/* commom start */
.hidden,
.none {
  position: fixed;
  left: -9999px;
}

.float_left {
  float: left;
}

.float_right {
  float: right;
}

.contents_ready {
  padding: 50px 0;
  text-align: center;
}

.right {
  text-align: right;
}

/* common end */
/* text-align start */
.text_center {
  text-align: center;
}

.text_right {
  text-align: right;
}

.text_left {
  text-align: left;
}

/* text-align end */
.img_box {
  display: flex;
  flex-flow: row wrap;
  gap: 10px;
}
.img_box.center {
  justify-content: center;
}
.img_box.right {
  justify-content: flex-end;
}
.img_box.width100 img {
  width: 100%;
}

/* 테이블 start */
.scroll_guide {
  display: none;
  margin-bottom: 1.5vh;
  padding: 20px 20px 20px 55px;
  border: 1px dashed #e5e5e5;
  position: relative;
}
.scroll_guide p {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.3em;
  color: #444;
  word-break: keep-all;
}
.scroll_guide::before {
  display: block;
  content: "";
  width: 20px;
  height: 33px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/ico_table_scroll.png");
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}

@media screen and (max-width: 768px) {
  .scroll_guide {
    display: block;
  }
}
.table-scroll {
  max-width: 100%;
  width: 100%;
}
.table-scroll::-webkit-scrollbar {
  height: 5px;
  background-color: #f1f1f1;
}
.table-scroll::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 10px;
}
.table-scroll th,
.table-scroll td {
  word-break: keep-all;
}
.table-scroll + .table_scroll {
  margin: 20px 0 0;
}

@media screen and (max-width: 760px) {
  .table-scroll {
    padding: 0 0 5px;
    overflow-x: auto;
  }
  .table-scroll .table th,
  .table-scroll .table td {
    word-break: keep-all;
  }
}
ul + .table_scroll,
ul + .table {
  margin: 20px 0 0;
}

.table-ref {
  padding: 0 0 1rem;
  text-align: right;
  color: #555;
}

.table {
  border-top: 2px solid #000;
}
.table + .table {
  margin: 30px 0 0;
}
.table caption {
  text-align: left;
}
.table tr > :first-child {
  border-left: 0 none;
}
.table tr > :last-child {
  border-right: 0 none;
}
.table th,
.table td {
  padding: 1.5rem 1.5rem;
  font-size: 1.6rem;
  border: 1px solid #e1e7ec;
  border-top: 0 none;
  box-sizing: border-box;
  word-break: keep-all;
}
.table th {
  background: #f8f8f8;
  font-weight: 600;
  text-align: center;
}
.table tbody th {
  background-color: #f8f8f8;
}
.table td {
  background: #fff;
}
.table .td-title {
  text-align: left;
}
.table .td-title__box {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.table .td-title a {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.table .td-title a:hover {
  color: #0091e7;
}
.table .td-title a:hover span {
  color: #0091e7;
}
.table .btn {
  min-height: 3.6rem;
}

/* table td 가운데 정렬 */
.table--center th,
.table--center td {
  text-align: center;
}
.table--center .th--center {
  text-align: center;
}
.table--center .th--left {
  text-align: left;
}
.table--center .th--right {
  text-align: right;
}
.table--center .td--center {
  text-align: center;
}
.table--center .td--left {
  text-align: left;
}
.table--center .td--right {
  text-align: right;
}
.table--center .td--title {
  text-align: left;
}

/* table td 왼쪽 정렬 */
.table--left th,
.table--left td {
  text-align: left;
}
.table--left .td--center {
  text-align: center;
}
.table--left .td--left {
  text-align: left;
}
.table--left .td--right {
  text-align: right;
}
.table--left .td--center {
  text-align: center;
}
.table--left .td--left {
  text-align: left;
}
.table--left .td--right {
  text-align: right;
}
.table--left .td--title {
  text-align: left;
}

/* table td 오른쪽 정렬 */
.table--right th,
.table--right td {
  text-align: right;
}
.table--right .th--center {
  text-align: center;
}
.table--right .th--left {
  text-align: left;
}
.table--right .th--right {
  text-align: right;
}
.table--right .td--center {
  text-align: center;
}
.table--right .td--left {
  text-align: left;
}
.table--right .td--right {
  text-align: right;
}
.table--right .td--title {
  text-align: left;
}

@media screen and (max-width: 760px) {
  .table {
    border-top-width: 1px;
  }
  .table th,
  .table td {
    padding: 10px 10px;
  }
}
.must-text {
  text-align: right;
  color: #777;
  padding: 0 0 12px;
}

.must-ico {
  font-size: 0;
  display: inline-block;
  vertical-align: text-top;
  line-height: 1;
}
.must-ico::before {
  display: block;
  content: "*";
  font-size: 20px;
  font-weight: 600;
  color: #eb0000;
}

.celsius_ico {
  font-size: 0;
}
.celsius_ico::before {
  content: "°";
  font-size: 1.6rem;
  vertical-align: top;
}

.flex_box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 5px;
}
.flex_box input[type=text] {
  flex: 1;
}

.id_box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 5px;
}
.id_box input[type=text] {
  flex: 1;
  min-width: 0;
}

.email_box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 5px;
}
.email_box input[type=text],
.email_box select {
  flex: 1;
  min-width: 0;
}
.email_box .at {
  color: #999;
}

.phone_box {
  display: flex;
  align-items: center;
  gap: 5px;
}
.phone_box:has(select) select {
  flex: 1;
  min-width: 0;
}
.phone_box:has(select) input[type=text],
.phone_box:has(select) input[type=number] {
  flex: 2 1 0;
}
.phone_box input[type=text],
.phone_box input[type=number] {
  flex: 1;
  min-width: 0;
}
.phone_box .dash {
  color: #999;
}

.upload_box {
  display: flex;
  align-items: center;
  gap: 5px;
}
.upload_box__file {
  position: fixed;
  left: -99999px;
  top: -99999px;
}
.upload_box__name {
  flex: 1;
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 10px;
  color: #858585;
  border-radius: 3px;
  border: 1px solid #dbdbdb;
  background-color: #fff;
  box-sizing: border-box;
}
.upload_box__name.active {
  color: #252525;
}

@media screen and (max-width: 760px) {
  .upload_box .btn_ico_upload {
    gap: 0;
    min-width: initial;
    width: 40px;
    padding: 0;
    font-size: 0;
  }
}
.school_box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 15px;
}

.school_box-item {
  display: flex;
  align-items: center;
  gap: 5px;
}
.school_box-item input[type=text] {
  width: 60px;
  text-align: right;
}
.school_box-item label {
  flex: none;
}

@media screen and (max-width: 760px) {
  .school_box {
    gap: 10px;
  }
  .school_box-item {
    flex: 1;
  }
  .school_box-item input[type=text] {
    width: 100%;
    min-width: 0;
  }
}
.opt_in {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 10px 0 0;
}
.opt_in.full button {
  width: 100%;
}
.opt_in.half button {
  width: 50%;
}
.opt_in label {
  font-weight: 500;
  color: #555;
}

.address_box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 5px;
}
.address_box .post_code {
  flex: 1 1 100%;
  display: flex;
  align-items: center;
  gap: 5px;
}
.address_box .post_code > input[type=text] {
  max-width: 150px;
  width: 100px;
}
.address_box input[type=text] {
  flex: 1 1 100%;
}

.checkbox_container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 15px;
}

.label_container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 10px;
}

@media screen and (max-width: 760px) {
  .checkbox_container {
    gap: 10px;
  }
}
.period_container {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 40px;
  border-radius: 3px;
  border: 1px solid #dbdbdb;
  background-color: #fff;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.period_container input[type=text],
.period_container input[type=month],
.period_container input[type=date],
.period_container input[type=datetime-local],
.period_container input[type=time] {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0 none;
  background-color: transparent;
}
.period_container input[type=text]:hover, .period_container input[type=text]:focus,
.period_container input[type=month]:hover,
.period_container input[type=month]:focus,
.period_container input[type=date]:hover,
.period_container input[type=date]:focus,
.period_container input[type=datetime-local]:hover,
.period_container input[type=datetime-local]:focus,
.period_container input[type=time]:hover,
.period_container input[type=time]:focus {
  outline: 0 none;
}
.period_container:has(input[type=date]:focus) {
  outline: 2px solid #000;
}
.period_container:has(input[type=date]:disabled) {
  background-color: #efefef;
}
.period_container:has(input[type=date]:disabled) input[type=date] {
  background-color: transparent;
}

.wave {
  color: #777;
}

.condition_wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.condition_item {
  display: flex;
  align-items: center;
  gap: 8px;
  /*   input[type='time'] {
  	min-width: 130px;
  } */
}
.condition_item input[type=number] {
  width: 80px;
}

/* 테이블 end */
.form_table {
  border-top: 1px solid #000;
}
.form_table th,
.form_table td {
  padding: 20px 20px;
  border-left: 0 none;
  border-right: 0 none;
}
.form_table tbody th,
.form_table th {
  background-color: #fff;
  text-align: left;
  font-weight: 600;
}
.form_table tbody th label,
.form_table th label {
  text-align: left;
  font-weight: 600;
}
.form_table select {
  max-width: 500px;
  width: 100%;
}
.form_table td > input[type=text],
.form_table td > input[type=password],
.form_table td > input[type=date] {
  max-width: 500px;
  width: 100%;
}
.form_table textarea {
  width: 100%;
  height: 150px;
  resize: none;
}
.form_table .period_container,
.form_table .flex_box,
.form_table .id_box,
.form_table .email_box,
.form_table .phone_box,
.form_table .address_box,
.form_table .upload_box,
.form_table .school_box {
  max-width: 500px;
  width: 100%;
}
.form_table .period_container > input[type=text],
.form_table .flex_box > input[type=text],
.form_table .id_box > input[type=text],
.form_table .email_box > input[type=text],
.form_table .phone_box > input[type=text],
.form_table .address_box > input[type=text],
.form_table .upload_box > input[type=text],
.form_table .school_box > input[type=text] {
  max-width: initial;
  width: auto;
}
.form_table .period_container select,
.form_table .flex_box select,
.form_table .id_box select,
.form_table .email_box select,
.form_table .phone_box select,
.form_table .address_box select,
.form_table .upload_box select,
.form_table .school_box select {
  max-width: initial;
  width: auto;
}

@media screen and (max-width: 760px) {
  .form_table {
    display: block;
  }
  .form_table tbody {
    display: block;
  }
  .form_table tr {
    display: flex;
    flex-flow: column nowrap;
    padding: 15px 0;
    border-bottom: 1px solid #dbdbdb;
  }
  .form_table th {
    display: block;
    padding: 0;
    margin: 0 0 12px;
    border: 0 none;
  }
  .form_table td {
    display: block;
    padding: 0;
    border: 0 none;
  }
  .form_table select {
    max-width: 100%;
  }
  .form_table td > input[type=text],
  .form_table td > input[type=password] {
    max-width: 100%;
  }
  .form_table .flex_box,
  .form_table .id_box,
  .form_table .email_box,
  .form_table .phone_box,
  .form_table .address_box,
  .form_table .school_box {
    max-width: 100%;
  }
  .form_table .email_box select {
    flex: 1 1 100%;
  }
}
.board_table th,
.board_table td {
  border-left: 0 none;
  border-right: 0 none;
  background-color: transparent;
}
.board_table th {
  font-weight: 600;
}

@media screen and (max-width: 760px) {
  .board_table {
    display: block;
    width: calc(100% + 4vw);
    margin: 0 -2vw;
  }
  .board_table thead {
    position: fixed;
    left: -99999px;
    top: -99999px;
  }
  .board_table tbody {
    display: block;
  }
  .board_table tr {
    display: flex;
    flex-flow: row wrap;
    gap: 6px 8px;
    padding: 12px 2vw;
    border-bottom: 1px solid #dbdbdb;
  }
  .board_table tr:has(.no_data) {
    border: 0 none;
  }
  .board_table td {
    display: block;
    padding: 0;
    border: 0 none;
  }
  .board_table td.num {
    display: none;
  }
  .board_table td.title {
    width: 100%;
    order: 1;
  }
  .board_table td.title a,
  .board_table td.title .title_text {
    font-size: 1.7rem;
    font-weight: 500;
  }
  .board_table td:not(.title) {
    width: auto;
    order: 2;
    font-size: 1.5rem;
    color: #777;
  }
  .board_table td .ico_file {
    width: 16px;
    height: 16px;
  }
  .board_table td .ico_file::before {
    background-size: 16px auto;
  }
  .board_table td.no_data {
    width: 100%;
    padding: 50px 15px;
    font-weight: 500;
  }
}
.mypage_table th,
.mypage_table td {
  border-left: 0 none;
  border-right: 0 none;
  background-color: transparent;
}
.mypage_table th {
  font-weight: 600;
}

@media screen and (max-width: 760px) {
  .table.mypage_table {
    display: block;
    border-top: 0 none;
  }
  .table.mypage_table thead {
    position: fixed;
    left: -99999px;
    top: -99999px;
  }
  .table.mypage_table tbody {
    display: block;
  }
  .table.mypage_table tr {
    display: flex;
    flex-flow: row wrap;
    border-radius: 5px;
    border: 1px solid #dbdbdb;
    overflow: hidden;
  }
  .table.mypage_table tr:last-child {
    border-bottom: 1px solid #dbdbdb;
  }
  .table.mypage_table tr:has(.no_data) {
    padding: 0;
    border: 0 none;
  }
  .table.mypage_table tr + tr {
    margin: 15px 0 0;
  }
  .table.mypage_table td {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    width: 100%;
    min-height: 36px;
    padding: 10px 10px 10px 90px;
    text-align: left;
    border: 0 none;
    border-bottom: 1px solid #dbdbdb;
    box-sizing: border-box;
    position: relative;
  }
  .table.mypage_table td:last-child {
    border-bottom: 0 none;
  }
  .table.mypage_table td::before {
    flex: none;
    display: flex;
    content: "";
    align-items: center;
    width: 80px;
    height: 100%;
    padding: 10px 10px;
    font-weight: 600;
    border-right: 1px solid #dbdbdb;
    background-color: #f9f9f9;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 0;
  }
  .table.mypage_table td.num {
    display: none;
  }
  .table.mypage_table td.title::before {
    content: "제목";
  }
  .table.mypage_table td.title.club_name::before {
    content: "동아리명";
  }
  .table.mypage_table td .title_text {
    font-weight: 600;
  }
  .table.mypage_table td.library {
    width: 100%;
  }
  .table.mypage_table td.library::before {
    content: "도서관";
  }
  .table.mypage_table td.apply_person::before {
    content: "신청인원";
  }
  .table.mypage_table td.state, .table.mypage_table td.status {
    width: 100%;
  }
  .table.mypage_table td.state::before, .table.mypage_table td.status::before {
    content: "상태";
  }
  .table.mypage_table td.state br, .table.mypage_table td.status br {
    display: none;
  }
  .table.mypage_table td.manage {
    width: 100%;
  }
  .table.mypage_table td.manage::before {
    content: "관리";
  }
  .table.mypage_table td.apply_check {
    width: 100%;
  }
  .table.mypage_table td.apply_check::before {
    content: "신청내역";
  }
  .table.mypage_table td.applicant::before {
    content: "신청자";
  }
  .table.mypage_table td.join_period::before {
    content: "가입기간";
  }
  .table.mypage_table td.reserve_date::before {
    content: "예약일";
  }
  .table.mypage_table td.reg_date::before {
    content: "신청일시";
  }
  .table.mypage_table td.reserve_expire_date::before {
    content: "예약만기일";
  }
  .table.mypage_table td.detail_view::before {
    content: "상세보기";
  }
  .table.mypage_table td.cancel {
    width: 100%;
  }
  .table.mypage_table td.cancel::before {
    content: "취소";
  }
  .table.mypage_table td.no_data {
    width: 100%;
    padding: 50px 15px;
  }
  .table.mypage_table td.no_data::before {
    display: none;
  }
  .table.mypage_table td .btn {
    flex: 1;
  }
}
/* 파일 아이콘 */
.file_download {
  display: flex;
  gap: 5px;
  padding: 0 0 0 23px;
  line-height: 1.3em;
  position: relative;
}
.file_download::before {
  display: block;
  content: "";
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  left: 0;
  top: 0;
}
.file_download:hover {
  color: #0091e7;
}
.file_download.pdf::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(225,85,85,1)'%3E%3Cpath d='M5 4H15V8H19V20H5V4ZM3.9985 2C3.44749 2 3 2.44405 3 2.9918V21.0082C3 21.5447 3.44476 22 3.9934 22H20.0066C20.5551 22 21 21.5489 21 20.9925L20.9997 7L16 2H3.9985ZM10.4999 7.5C10.4999 9.07749 10.0442 10.9373 9.27493 12.6534C8.50287 14.3757 7.46143 15.8502 6.37524 16.7191L7.55464 18.3321C10.4821 16.3804 13.7233 15.0421 16.8585 15.49L17.3162 13.5513C14.6435 12.6604 12.4999 9.98994 12.4999 7.5H10.4999ZM11.0999 13.4716C11.3673 12.8752 11.6042 12.2563 11.8037 11.6285C12.2753 12.3531 12.8553 13.0182 13.5101 13.5953C12.5283 13.7711 11.5665 14.0596 10.6352 14.4276C10.7999 14.1143 10.9551 13.7948 11.0999 13.4716Z'%3E%3C/path%3E%3C/svg%3E");
}
.file_download.hwp::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(8,132,228,1)'%3E%3Cpath d='M16 2L20.9997 7L21 20.9925C21 21.5489 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5447 3 21.0082V2.9918C3 2.44405 3.44749 2 3.9985 2H16ZM16 8.66667H8V7.33333L11.333 7.333L11.3333 6H12.6667L12.666 7.333H14.999L15 4H5V20H19V8L16 7.999V8.66667ZM9.33333 14.6667L9.333 16.666L16 16.6667V18H8V14.6667H9.33333ZM12 14.3333C12.5523 14.3333 13 14.781 13 15.3333C13 15.8856 12.5523 16.3333 12 16.3333C11.4477 16.3333 11 15.8856 11 15.3333C11 14.781 11.4477 14.3333 12 14.3333ZM12 9C13.3807 9 14.5 10.1193 14.5 11.5C14.5 12.8807 13.3807 14 12 14C10.6193 14 9.5 12.8807 9.5 11.5C9.5 10.1193 10.6193 9 12 9ZM12 10.3333C11.3557 10.3333 10.8333 10.8557 10.8333 11.5C10.8333 12.1443 11.3557 12.6667 12 12.6667C12.6443 12.6667 13.1667 12.1443 13.1667 11.5C13.1667 10.8557 12.6443 10.3333 12 10.3333Z'%3E%3C/path%3E%3C/svg%3E");
}
.file_download.zip::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,86,145,1)'%3E%3Cpath d='M20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM19 20V4H5V20H19ZM14 12V17H10V14H12V12H14ZM12 4H14V6H12V4ZM10 6H12V8H10V6ZM12 8H14V10H12V8ZM10 10H12V12H10V10Z'%3E%3C/path%3E%3C/svg%3E");
}
.file_download.excel::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(9,118,65,1)'%3E%3Cpath d='M13.2 12L16 16H13.6L12 13.7143L10.4 16H8L10.8 12L8 8H10.4L12 10.2857L13.6 8H15V4H5V20H19V8H16L13.2 12ZM3 2.9918C3 2.44405 3.44749 2 3.9985 2H16L20.9997 7L21 20.9925C21 21.5489 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5447 3 21.0082V2.9918Z'%3E%3C/path%3E%3C/svg%3E");
}
.file_download.ppt::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(190,60,32,1)'%3E%3Cpath d='M3 2.9918C3 2.44405 3.44749 2 3.9985 2H16L20.9997 7L21 20.9925C21 21.5489 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5447 3 21.0082V2.9918ZM5 4V20H19V8H16V14H10V16H8V8H15V4H5ZM10 10V12H14V10H10Z'%3E%3C/path%3E%3C/svg%3E");
}
.file_download.word::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(49,91,157,1)'%3E%3Cpath d='M16 8V16H14L12 14L10 16H8V8H10V13L12 11L14 13V8H15V4H5V20H19V8H16ZM3 2.9918C3 2.44405 3.44749 2 3.9985 2H16L20.9997 7L21 20.9925C21 21.5489 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5447 3 21.0082V2.9918Z'%3E%3C/path%3E%3C/svg%3E");
}
.file_download.image::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(85,85,85,1)'%3E%3Cpath d='M15 8V4H5V20H19V8H15ZM3 2.9918C3 2.44405 3.44749 2 3.9985 2H16L20.9997 7L21 20.9925C21 21.5489 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5447 3 21.0082V2.9918ZM11 9.5C11 10.3284 10.3284 11 9.5 11C8.67157 11 8 10.3284 8 9.5C8 8.67157 8.67157 8 9.5 8C10.3284 8 11 8.67157 11 9.5ZM17.5 17L13.5 10L8 17H17.5Z'%3E%3C/path%3E%3C/svg%3E");
}
.file_download.zip::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(250,205,27,1)'%3E%3Cpath d='M20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM19 20V4H5V20H19ZM14 12V17H10V14H12V12H14ZM12 4H14V6H12V4ZM10 6H12V8H10V6ZM12 8H14V10H12V8ZM10 10H12V12H10V10Z'%3E%3C/path%3E%3C/svg%3E");
}

@media screen and (max-width: 760px) {
  .file_download {
    padding: 0 0 0 21px;
  }
  .file_download::before {
    width: 16px;
    height: 16px;
    background-size: 16px auto;
    top: 1px;
  }
}
.page_remote {
  display: flex;
  flex-flow: row wrap;
  margin-top: 30px;
  border-top: 1px solid #000;
  border-bottom: 1px solid #dbdbdb;
  background: #fafafa;
}
.page_remote dt,
.page_remote dd {
  display: flex;
  align-items: center;
  padding: 15px 15px;
  box-sizing: border-box;
}
.page_remote dt:nth-of-type(n + 2),
.page_remote dd:nth-of-type(n + 2) {
  border-top: 1px solid #dbdbdb;
}
.page_remote dt {
  width: 50px;
  flex: none;
  justify-content: center;
  padding: 0;
  font-size: 0;
}
.page_remote dt::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(37,37,37,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
}
.page_remote dt.prev::before {
  transform: rotate(180deg);
}
.page_remote dd {
  padding-left: 0;
  width: calc(100% - 50px);
  color: #999;
}
.page_remote dd a {
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  max-width: 100%;
  overflow: hidden;
  font-weight: 500;
  color: #555;
  line-height: 1.3em;
}
.page_remote dd a:hover {
  color: #0091e7;
}

/* input */
input[type=button] {
  cursor: pointer;
}

input[type=text],
input[type=password],
input[type=number],
input[type=tel],
input[type=email],
input[type=url],
input[type=search],
input[type=file],
input[type=date],
input[type=month],
input[type=time],
input[type=datetime-local],
select,
.input {
  min-width: 0;
  height: 4.2rem;
  border: solid 1px #dbdbdb;
  border-radius: 0.6rem;
  background: #fff;
  padding: 0 10px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

textarea {
  border: solid 1px #dbdbdb;
  border-radius: 0.6rem;
  background: #fff;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  overflow: auto;
  padding: 10px;
  line-height: 1.3em;
  height: auto;
}

.jsElasticArea {
  transition: all 0.3s ease;
}

input[type=date],
input[type=month],
input[type=datetime-local] {
  padding: 0 10px;
  box-sizing: border-box;
}
input[type=date]::-webkit-calendar-picker-indicator,
input[type=month]::-webkit-calendar-picker-indicator,
input[type=datetime-local]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  background-position: center center;
  background-size: 18px auto;
  background-image: url("../images/input_date_icon.svg");
}

@media screen and (max-width: 768px) {
  input[type=date]::-webkit-calendar-picker-indicator,
  input[type=month]::-webkit-calendar-picker-indicator,
  input[type=datetime-local]::-webkit-calendar-picker-indicator {
    background-size: 16px auto;
  }
}
input[type=time] {
  padding: 0 10px;
  box-sizing: border-box;
}
input[type=time]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  background-position: center center;
  background-size: 18px auto;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(153,153,153,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z'%3E%3C/path%3E%3C/svg%3E");
}
input[type=time]::-webkit-calendar-picker-indicator:hover, input[type=time]::-webkit-calendar-picker-indicator:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z'%3E%3C/path%3E%3C/svg%3E");
}

select {
  padding: 0 30px 0 10px;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center right 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
select::-ms-expand {
  display: none;
}

.due-date-box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0.6rem;
}

.due-date-separator {
  font-size: 1.8rem;
  font-weight: 500;
  color: #999;
}

.due-date-input {
  flex: 1;
  min-width: 0;
}

input[type=text][disabled],
input[type=text]:disabled,
input[type=password][disabled],
input[type=password]:disabled,
input[type=number][disabled],
input[type=number]:disabled,
input[type=tel][disabled],
input[type=tel]:disabled,
input[type=email][disabled],
input[type=email]:disabled,
input[type=url][disabled],
input[type=url]:disabled,
input[type=search][disabled],
input[type=search]:disabled,
input[type=file][disabled],
input[type=file]:disabled,
input[type=date][disabled],
input[type=date]:disabled,
input[type=month][disabled],
input[type=month]:disabled,
input[type=time][disabled],
input[type=time]:disabled,
input[type=datetime-local][disabled],
input[type=datetime-local]:disabled,
select[disabled],
select:disabled {
  background-color: #efefef;
  color: #888;
  cursor: auto;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  select {
    padding: 0 0 0 5px;
  }
}
.input02,
.width02 {
  width: 2%;
}

.input03,
.width03 {
  width: 3%;
}

.input04,
.width04 {
  width: 4%;
}

.input05,
.width05 {
  width: 5%;
}

.input06,
.width06 {
  width: 6%;
}

.input07,
.width07 {
  width: 7%;
}

.input08,
.width08 {
  width: 8%;
}

.input09,
.width09 {
  width: 9%;
}

.input10,
.width10 {
  width: 10%;
}

.input15,
.width15 {
  width: 15%;
}

.input17,
.width17 {
  width: 17%;
}

.input20,
.width20 {
  width: 20%;
}

.input25,
.width25 {
  width: 25%;
}

.input30,
.width30 {
  width: 30%;
}

.input33,
.width33 {
  width: 33%;
}

.input35,
.width35 {
  width: 35%;
}

.input40,
.width40 {
  width: 40%;
}

.input45,
.width45 {
  width: 45%;
}

.input50,
.width50 {
  width: 50%;
}

.input55,
.width55 {
  width: 55%;
}

.input60,
.width60 {
  width: 60%;
}

.input65,
.width65 {
  width: 65%;
}

.input70,
.width70 {
  width: 70%;
}

.input75,
.width75 {
  width: 75%;
}

.input80,
.width80 {
  width: 80%;
}

.input85,
.width85 {
  width: 85%;
}

.input86,
.width86 {
  width: 86%;
}

.input87,
.width87 {
  width: 87%;
}

.input88,
.width88 {
  width: 88%;
}

.input89,
.width89 {
  width: 89%;
}

.input90,
.width90 {
  width: 90%;
}

.input92,
.width92 {
  width: 92%;
}

.input94,
.width94 {
  width: 94%;
}

.input95,
.width95 {
  width: 95%;
}

.input97,
.width97 {
  width: 97%;
}

.input98,
.width98 {
  width: 98%;
}

.input99,
.width99 {
  width: 99%;
}

.input100,
.width100 {
  width: 100%;
}

.float_right {
  float: right;
}

.float_left {
  float: left;
}

.flex1 {
  flex: 1;
}

.flex1_100 {
  flex: 1;
  width: 100%;
}

.flex_auto {
  flex: 1 1 auto;
}

.flex_auto_100 {
  flex: 1 1 auto;
  width: 100px;
}

/* margin start */
.m-0 {
  margin: 0;
}

.m-10 {
  margin: 1rem;
}

.m-20 {
  margin: 2rem;
}

.m-30 {
  margin: 3rem;
}

.m-40 {
  margin: 4rem;
}

.m-50 {
  margin: 5rem;
}

.m-60 {
  margin: 6rem;
}

.m-70 {
  margin: 7rem;
}

.m-80 {
  margin: 8rem;
}

.m-90 {
  margin: 9rem;
}

.m-100 {
  margin: 10rem;
}

.mt-10 {
  margin-top: 1rem;
}

.mt-20 {
  margin-top: 2rem;
}

.mt-30 {
  margin-top: 3rem;
}

.mt-40 {
  margin-top: 4rem;
}

.mt-50 {
  margin-top: 5rem;
}

.mt-60 {
  margin-top: 6rem;
}

.mt-70 {
  margin-top: 7rem;
}

.mt-80 {
  margin-top: 8rem;
}

.mt-90 {
  margin-top: 9rem;
}

.mt-100 {
  margin-top: 10rem;
}

.mb-10 {
  margin-bottom: 1rem;
}

.mb-20 {
  margin-bottom: 2rem;
}

.mb-30 {
  margin-bottom: 3rem;
}

.mb-40 {
  margin-bottom: 4rem;
}

.mb-50 {
  margin-bottom: 5rem;
}

.mb-60 {
  margin-bottom: 6rem;
}

.mb-70 {
  margin-bottom: 7rem;
}

.mb-80 {
  margin-bottom: 8rem;
}

.mb-90 {
  margin-bottom: 9rem;
}

.mb-100 {
  margin-bottom: 10rem;
}

.ml-05 {
  margin-left: 0.5rem;
}

.ml-10 {
  margin-left: 1rem;
}

.ml-20 {
  margin-left: 2rem;
}

.ml-30 {
  margin-left: 3rem;
}

.ml-40 {
  margin-left: 4rem;
}

.ml-50 {
  margin-left: 5rem;
}

.ml-60 {
  margin-left: 6rem;
}

.ml-70 {
  margin-left: 7rem;
}

.ml-80 {
  margin-left: 8rem;
}

.ml-90 {
  margin-left: 9rem;
}

.ml-100 {
  margin-left: 10rem;
}

.mr-10 {
  margin-right: 1rem;
}

.mr-20 {
  margin-right: 2rem;
}

.mr-30 {
  margin-right: 3rem;
}

.mr-40 {
  margin-right: 4rem;
}

.mr-50 {
  margin-right: 5rem;
}

.mr-60 {
  margin-right: 6rem;
}

.mr-70 {
  margin-right: 7rem;
}

.mr-80 {
  margin-right: 8rem;
}

.mr-90 {
  margin-right: 9rem;
}

.mr-100 {
  margin-right: 10rem;
}

.mtb-10 {
  margin: 1rem 0;
}

.mtb-20 {
  margin: 2rem 0;
}

.mtb-30 {
  margin: 3rem 0;
}

.mtb-40 {
  margin: 4rem 0;
}

.mtb-50 {
  margin: 5rem 0;
}

.mtb-60 {
  margin: 6rem 0;
}

.mtb-70 {
  margin: 7rem 0;
}

.mtb-80 {
  margin: 8rem 0;
}

.mtb-90 {
  margin: 9rem 0;
}

.mtb-100 {
  margin: 10rem 0;
}

/* margin end */
/* padding start */
.p-0 {
  padding: 0;
}

.p-10 {
  padding: 1rem;
}

.p-20 {
  padding: 2rem;
}

.p-30 {
  padding: 3rem;
}

.p-40 {
  padding: 4rem;
}

.p-50 {
  padding: 5rem;
}

.p-60 {
  padding: 6rem;
}

.p-70 {
  padding: 7rem;
}

.p-80 {
  padding: 8rem;
}

.p-90 {
  padding: 9rem;
}

.p-100 {
  padding: 10rem;
}

.pt-10 {
  padding-top: 1rem;
}

.pt-20 {
  padding-top: 2rem;
}

.pt-30 {
  padding-top: 3rem;
}

.pt-40 {
  padding-top: 4rem;
}

.pt-50 {
  padding-top: 5rem;
}

.pt-60 {
  padding-top: 6rem;
}

.pt-70 {
  padding-top: 7rem;
}

.pt-80 {
  padding-top: 8rem;
}

.pt-90 {
  padding-top: 9rem;
}

.pt-100 {
  padding-top: 10rem;
}

.pb-10 {
  padding-bottom: 1rem;
}

.pb-20 {
  padding-bottom: 2rem;
}

.pb-30 {
  padding-bottom: 3rem;
}

.pb-40 {
  padding-bottom: 4rem;
}

.pb-50 {
  padding-bottom: 5rem;
}

.pb-60 {
  padding-bottom: 6rem;
}

.pb-70 {
  padding-bottom: 7rem;
}

.pb-80 {
  padding-bottom: 8rem;
}

.pb-90 {
  padding-bottom: 9rem;
}

.pb-100 {
  padding-bottom: 10rem;
}

.pl-10 {
  padding-left: 1rem;
}

.pl-20 {
  padding-left: 2rem;
}

.pl-30 {
  padding-left: 3rem;
}

.pl-40 {
  padding-left: 4rem;
}

.pl-50 {
  padding-left: 5rem;
}

.pl-60 {
  padding-left: 6rem;
}

.pl-70 {
  padding-left: 7rem;
}

.pl-80 {
  padding-left: 8rem;
}

.pl-90 {
  padding-left: 9rem;
}

.pl-100 {
  padding-left: 10rem;
}

.pr-10 {
  padding-right: 1rem;
}

.pr-20 {
  padding-right: 2rem;
}

.pr-30 {
  padding-right: 3rem;
}

.pr-40 {
  padding-right: 4rem;
}

.pr-50 {
  padding-right: 5rem;
}

.pr-60 {
  padding-right: 6rem;
}

.pr-70 {
  padding-right: 7rem;
}

.pr-80 {
  padding-right: 8rem;
}

.pr-90 {
  padding-right: 9rem;
}

.pr-100 {
  padding-right: 10rem;
}

.ptb-10 {
  padding: 1rem 0;
}

.ptb-20 {
  padding: 2rem 0;
}

.ptb-30 {
  padding: 3rem 0;
}

.ptb-40 {
  padding: 4rem 0;
}

.ptb-50 {
  padding: 5rem 0;
}

.ptb-60 {
  padding: 6rem 0;
}

.ptb-70 {
  padding: 7rem 0;
}

.ptb-80 {
  padding: 8rem 0;
}

.ptb-90 {
  padding: 9rem 0;
}

.ptb-100 {
  padding: 10rem 0;
}

/* padding end */
/* flex_box start */
.flex {
  display: flex;
}

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

.flex_jc {
  display: flex;
  justify-content: center;
}

.flex_ac {
  display: flex;
  align-items: center;
}

.flex_ae {
  display: flex;
  align-items: flex-end;
}

.flex_col {
  display: flex;
  flex-flow: column nowrap;
}

.flex_col_jcac {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
}

.flex_col_jc {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
}

.flex_col_ac {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}

.flex_jsb {
  display: flex;
  justify-content: space-between;
}

.flex_col_jsb {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
}

.flex_rowwrap {
  display: flex;
  flex-flow: row wrap;
}

.flex_colwrap {
  display: flex;
  flex-flow: column wrap;
}

.flex1 {
  flex: 1;
}

.flex1_100 {
  flex: 1;
  width: 100%;
}

.flex_auto {
  flex: 1 1 auto;
}

.flex_auto_100 {
  flex: 1 1 auto;
  width: 100%;
}

.gap5 {
  gap: 5px;
}

.gap10 {
  gap: 10px;
}

.gap15 {
  gap: 15px;
}

.gap20 {
  gap: 20px;
}

.gap25 {
  gap: 25px;
}

.gap30 {
  gap: 30px;
}

.gap35 {
  gap: 35px;
}

.gap40 {
  gap: 40px;
}

.gap45 {
  gap: 45px;
}

.gap50 {
  gap: 50px;
}

.gap55 {
  gap: 55px;
}

.gap60 {
  gap: 60px;
}

.gap65 {
  gap: 65px;
}

.gap70 {
  gap: 70px;
}

.gap75 {
  gap: 75px;
}

.gap80 {
  gap: 80px;
}

.gap85 {
  gap: 85px;
}

.gap90 {
  gap: 90px;
}

.gap95 {
  gap: 95px;
}

.gap100 {
  gap: 100px;
}

/* flex_box end */
/* 리스트 start */
.proce_list {
  display: flex;
  gap: 10px;
  padding: 20px 20px;
  border-radius: 8px;
  background-color: #f8f9fa;
  counter-reset: porce-counter;
}
.proce_list li {
  flex: 1;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}
.proce_list li::before {
  display: flex;
  justify-content: center;
  align-items: center;
  content: counter(porce-counter);
  counter-increment: porce-counter;
  width: 40px;
  height: 40px;
  margin: 0 0 10px;
  font-size: 2rem;
  font-weight: 700;
  line-height: initial;
  border-radius: 50%;
  color: #fff;
  background-color: #3498db;
}

.proce_box {
  flex: 1;
  display: flex;
  flex-flow: column nowrap;
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.proce_title {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 64px;
  padding: 10px 15px;
  font-size: 1.8rem;
  line-height: 1.3em;
  font-weight: 700;
  color: #fff;
  background-color: #3498db;
  box-sizing: border-box;
}

.proce_content {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 15px 15px;
  text-align: center;
  font-weight: 500;
  line-height: 1.5em;
  word-break: keep-all;
  background-color: #fff;
  box-sizing: border-box;
}

.list_box {
  padding: 20px 20px;
  border-radius: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.06);
}

.list_03 {
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  gap: 10px;
  box-sizing: border-box;
}
.list_03 > li {
  padding: 0 0 0 16px;
  font-size: 1.5rem;
  line-height: 1.5em;
  color: #555;
  position: relative;
  word-break: keep-all;
}
.list_03 > li::before {
  display: block;
  content: "";
  width: 8px;
  height: 1px;
  background-color: var(--primary-color);
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 10px;
}
.list_03 > li__blue {
  color: #0093e3;
}
.list_03 > li__wrn {
  color: #FF3B30;
}
.list_03 > li > ul,
.list_03 > li > ol {
  padding: 10px 0 0;
}

.list_04 {
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  gap: 10px;
  box-sizing: border-box;
}
.list_04 > li {
  padding: 0 0 0 16px;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.5em;
  color: #777;
  position: relative;
  word-break: keep-all;
}
.list_04 > li::before {
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-bottom: 5px solid var(--primary-color);
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 8px;
}
.list_04 > li__blue {
  color: #0093e3;
}
.list_04 > li__wrn {
  color: #FF3B30;
}
.list_04 > li > ul,
.list_04 > li > ol {
  padding: 8px 0 0;
}

.go_link {
  padding: 0 21px 0 0;
  line-height: 1.5em;
  position: relative;
}
.go_link::after {
  display: block;
  content: "";
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(170,170,170,1)'%3E%3Cpath d='M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  right: 0;
  top: 0;
}
.go_link strong {
  transition: all 0.3s ease;
}
.go_link:hover {
  color: #0091e7;
}
.go_link:hover strong {
  color: #0091e7;
}

.go_download {
  display: flex;
  align-items: center;
  gap: 5px;
  line-height: 1.5em;
}
.go_download::after {
  display: block;
  content: "";
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(170,170,170,1)'%3E%3Cpath d='M13 10H18L12 16L6 10H11V3H13V10ZM4 19H20V12H22V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V12H4V19Z'%3E%3C/path%3E%3C/svg%3E");
}

.num_list {
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  gap: 10px;
}
.num_list > li {
  line-height: 1.3em;
  counter-increment: steps;
  padding: 0 0 0 20px;
  position: relative;
}
.num_list > li::before {
  display: inline-block;
  content: counter(steps) ".";
  color: #333;
  position: absolute;
  left: 0;
  top: 0;
}

.dash_list {
  display: flex;
  flex-flow: column nowrap;
  gap: 10px;
}
.dash_list > li {
  color: #777;
  padding-left: 15px;
  line-height: 1.3em;
  position: relative;
}
.dash_list > li::before {
  display: block;
  content: "";
  width: 5px;
  height: 1px;
  background: #999;
  position: absolute;
  left: 0;
  top: 9px;
}
.dash_list > li.wrn {
  color: #eb0000;
}

.explain_list {
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  gap: 5px;
}
.explain_list > li {
  color: #555;
  position: relative;
  padding-left: 16px;
  line-height: 1.5em;
  font-weight: 500;
  word-break: keep-all;
}
.explain_list > li::before {
  display: inline-block;
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
}
.explain_list > li.wrn {
  color: #FF3B30;
}
.explain_list > li.wrn_bold {
  font-weight: 600;
  color: #FF3B30;
}
.explain_list > li.blue {
  color: #0093e3;
}

.num_list_02 {
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  gap: 10px;
}
.num_list_02 > li {
  color: #777;
  font-size: 15px;
  padding: 0 0 0 18px;
  position: relative;
  counter-increment: steps2;
}
.num_list_02 > li::before {
  display: inline-block;
  content: counter(steps2) ".";
  font-size: 15px;
  position: absolute;
  left: 0;
  top: 0;
  color: #777;
  font-weight: 500;
}
.num_list_02 > li.wrn {
  color: #FF3B30;
}

.circle_num_list_01 {
  counter-reset: circle 0;
}
.circle_num_list_01 > li {
  padding-left: 30px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3em;
  position: relative;
}
.circle_num_list_01 > li::before {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  font-size: 14px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #252525;
  font-weight: 600;
  position: absolute;
  left: 0;
  top: 2px;
  counter-increment: circle 1;
  content: counter(circle);
}
.circle_num_list_01 > li + li {
  margin: 10px 0 0;
}
.circle_num_list_01 > li.wrn {
  color: #FF3B30;
}

.circle_num_list_02 {
  counter-reset: circle 0;
}
.circle_num_list_02 > li {
  line-height: 1.3em;
  padding-left: 24px;
  position: relative;
}
.circle_num_list_02 > li::before {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  font-size: 12px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid #252525;
  font-weight: 600;
  position: absolute;
  left: 0;
  top: 2px;
  counter-increment: circle 1;
  content: counter(circle);
}
.circle_num_list_02 > li + li {
  margin-top: 20px;
}
.circle_num_list_02 > li.wrn {
  color: #FF3B30;
}

/* 리스트 end */
/* text color start */
.explain-text {
  width: 100%;
  display: block;
  color: #777;
  padding: 1rem 0 0;
  position: relative;
}
.explain-text::before {
  display: inline-block;
  content: "※";
  margin-right: 6px;
}
.explain-text--wrn {
  color: #FF3B30;
}
.explain-text--wrn::before {
  color: #FF3B30;
}
.explain-text.p0 {
  padding: 0;
}

.explain_point {
  width: 100%;
  display: block;
  color: #777;
  padding: 0 0 0 24px;
  margin: 10px 0 0;
  line-height: 1.5em;
  font-weight: 500;
  box-sizing: border-box;
  position: relative;
}
.explain_point::before {
  display: block;
  content: "";
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/ico_explain_point.gif");
  position: absolute;
  left: 0;
  top: 4px;
}
.explain_point.title {
  margin: 0 0 10px;
  color: #252525;
}
.explain_point.m0 {
  margin: 0;
}
.explain_point.mt20 {
  margin: 20px 0 0;
}
.explain_point.mb05 {
  margin: 0 0 5px;
}
.explain_point.mb10 {
  margin: 0 0 10px;
}
.explain_point + .explain_point {
  margin: 5px 0 0;
}

li .explain_point {
  font-size: 1.5rem;
}
li .explain_point::before {
  top: 3px;
}

.explain2 {
  display: block;
  color: #777;
  margin: 10px 0 0;
  line-height: 1.3em;
  font-size: 14px;
}
.explain2:before {
  display: inline-block;
  content: "※";
  margin: 0 6px 0 0;
}
.explain2.wrn {
  color: #FF3B30;
}
.explain2.wrn::before {
  color: #FF3B30;
}

.form_msg {
  width: 100%;
  margin: 10px 0 0;
  font-weight: 500;
}
.form_msg.sucess {
  color: #0093e3;
}
.form_msg.fail {
  color: #FF3B30;
}
.form_msg.center {
  text-align: center;
}

.bold {
  font-weight: 600;
}

.strong {
  font-weight: 700;
}

.wrn {
  color: #FF3B30;
}

.wrn_bold {
  font-weight: 600;
  color: #FF3B30;
}

.red {
  color: #FF3B30;
}

.red_bold {
  font-weight: 600;
  color: #FF3B30;
}

.blue {
  color: #0093e3;
}

.blue_bold {
  font-weight: 600;
  color: #0093e3;
}

.link:hover {
  color: #0091e7;
}
.link:hover span,
.link:hover strong {
  color: #0091e7;
}

/* text color end*/
/* file_ico start */
.ico_file {
  font-size: 0;
  display: block;
  width: 18px;
  height: 18px;
  margin: 0 auto;
}
.ico_file::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(170,170,170,1)'%3E%3Cpath d='M18 19H19V6.82843L17.1716 5H16V9H7V5H5V19H6V12H18V19ZM4 3H18L20.7071 5.70711C20.8946 5.89464 21 6.149 21 6.41421V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM8 14V19H16V14H8Z'%3E%3C/path%3E%3C/svg%3E");
}

/* file_ico end */
/* 페이징 Start */
.paging_container {
  display: flex;
  flex-flow: row wrap;
  gap: 3px;
  justify-content: center;
  align-items: center;
  padding: 20px 0 0;
}
.paging_container button,
.paging_container strong {
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.5rem;
  line-height: initial;
  color: #777;
  border-radius: 4px;
  background-color: #fff;
  box-sizing: border-box;
}
.paging_container button:hover,
.paging_container strong:hover {
  background-color: #f2f2f2;
}
.paging_container .current {
  background-color: #666;
  color: #fff;
  font-weight: 600;
  border: 0 none;
}
.paging_container .current:hover {
  background-color: #666;
}
.paging_container .first,
.paging_container .last,
.paging_container .prev,
.paging_container .next {
  font-size: 0;
}
.paging_container .first::before,
.paging_container .last::before,
.paging_container .prev::before,
.paging_container .next::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.3s ease;
}
.paging_container .first::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(0,0,0,0.35)'%3E%3Cpath d='M4.83578 12L11.0429 18.2071L12.4571 16.7929L7.66421 12L12.4571 7.20712L11.0429 5.79291L4.83578 12ZM10.4857 12L16.6928 18.2071L18.107 16.7929L13.3141 12L18.107 7.20712L16.6928 5.79291L10.4857 12Z'%3E%3C/path%3E%3C/svg%3E");
}
.paging_container .prev::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(0,0,0,0.35)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}
.paging_container .next::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(0,0,0,0.35)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}
.paging_container .last::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(0,0,0,0.35)'%3E%3Cpath d='M19.1642 12L12.9571 5.79291L11.5429 7.20712L16.3358 12L11.5429 16.7929L12.9571 18.2071L19.1642 12ZM13.5143 12L7.30722 5.79291L5.89301 7.20712L10.6859 12L5.89301 16.7929L7.30722 18.2071L13.5143 12Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 페이징 End */
/* 체크 icon start*/
.check_wrap {
  text-align: right;
  color: #777;
}

.check_ico {
  font-size: 0;
  display: inline-block;
  vertical-align: text-top;
  line-height: 1;
}

.check_ico::before {
  display: block;
  content: "✔";
  font-size: 18px;
  font-weight: 500;
  color: #0066c3;
}

/* 체크 icon end*/
/* 알라딘 인터넷서점 */
.from_aladin {
  padding: 20px 0 0;
  text-align: right;
}
.from_aladin a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 1.5rem;
  color: #999;
}
.from_aladin a::before {
  display: block;
  content: "";
  width: 6rem;
  height: 3rem;
  background: url("../images/img_aladin.png") no-repeat center center;
  background-size: contain;
}

@media (max-width: 768px) {
  .from_aladin a::before {
    width: 5rem;
    height: 2.5rem;
  }
}
/* 로딩 이미지 */
@keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
.loadingWrap {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.9);
  z-index: 1000;
  text-align: center;
}

.loadingWrap p {
  margin-top: 15px;
  font-weight: 300;
  font-size: 38px;
  opacity: 0.8;
  color: #fff;
  letter-spacing: 0;
}

.loadingWrap #loading {
  margin-top: 800px;
}

#loading {
  display: inline-block;
  width: 70px;
  height: 70px;
  border: 8px solid rgba(102, 169, 232, 0.534);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}

#loading p {
  font-size: 24px;
  font-weight: 600;
}

@keyframes hatch {
  0% {
    transform: rotate(0deg) scaleY(0.6);
  }
  20% {
    transform: rotate(-2deg) scaleY(1.05);
  }
  35% {
    transform: rotate(2deg) scaleY(1);
  }
  50% {
    transform: rotate(-2deg);
  }
  65% {
    transform: rotate(1deg);
  }
  80% {
    transform: rotate(-1deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@-webkit-keyframes hatch {
  0% {
    -webkit-transform: rotate(0deg) scaleY(0.6);
  }
  20% {
    -webkit-transform: rotate(-2deg) scaleY(1.05);
  }
  35% {
    -webkit-transform: rotate(2deg) scaleY(1);
  }
  50% {
    -webkit-transform: rotate(-2deg);
  }
  65% {
    -webkit-transform: rotate(1deg);
  }
  80% {
    -webkit-transform: rotate(-1deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
  }
}
.animate_hatch {
  animation-name: hatch;
  -webkit-animation-name: hatch;
  animation-duration: 2s;
  -webkit-animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -webkit-transform-origin: 50% 100%;
  visibility: visible !important;
}

/* calendar_table start */
.calendar_header {
  min-height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  position: relative;
  margin: 0 0 20px;
}
.calendar_header .calendar_date {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 2.4rem;
  font-weight: 700;
}
.calendar_header select {
  padding: 0 28px 0 0;
  font-size: 2.4rem;
  font-weight: 700;
  border: 0 none;
}
.calendar_header .prev_month_btn,
.calendar_header .next_month_btn {
  width: 28px;
  height: 28px;
  font-size: 0;
  opacity: 0.3;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='28' height='28' fill='rgba(0,0,0,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}
.calendar_header .prev_month_btn::before,
.calendar_header .next_month_btn::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.calendar_header .prev_month_btn:hover,
.calendar_header .next_month_btn:hover {
  opacity: 0.8;
}
.calendar_header .prev_month_btn {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='28' height='28' fill='rgba(0,0,0,1)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}
.calendar_header .today_btn {
  min-width: auto;
  min-height: 36px;
  padding: 0 10px;
  position: absolute;
  right: 0;
  top: 2px;
}

.calendar_table {
  border-top: 1px solid #dbdbdb;
}
.calendar_table th,
.calendar_table td {
  width: 14.2857142857%;
  box-sizing: border-box;
}
.calendar_table th {
  padding: 10px 10px;
  font-weight: 600;
  line-height: initial;
  background-color: #fff;
}
.calendar_table th.sat {
  color: #3f51b5;
}
.calendar_table th.sun {
  color: #c30000;
}
.calendar_table td {
  height: 120px;
  padding: 8px 8px;
  vertical-align: top;
  position: relative;
}
.calendar_table td.today {
  border: 3px solid #42ca65;
}
.calendar_table td.no_apply {
  background: repeating-linear-gradient(45deg, #fbfbfb, #fbfbfb 8px, #e5e5e5 8px, #e5e5e5 9px);
}
.calendar_table .day {
  display: block;
  font-weight: 500;
  color: #555;
  position: relative;
  z-index: 2;
}
.calendar_table .sat .day {
  color: #3f51b5;
}
.calendar_table .sun .day {
  color: #c30000;
}
.calendar_table .noday .day {
  color: #ccc;
}
.calendar_table .schedule_list {
  margin: 5px 0 0;
}
.calendar_table .schedule_list li {
  position: relative;
}
.calendar_table .schedule_list li + li {
  margin: 12px 0 0;
}
.calendar_table .schedule_list li > a,
.calendar_table .schedule_list li > span {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.1em;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  word-break: break-all;
  color: #555;
}
.calendar_table .schedule_list li > a:hover {
  color: #0091e7;
}
.calendar_table .schedule_list li::before {
  display: inline-block;
  padding: 3px 6px;
  margin: 0 0 5px;
  font-weight: 600;
  font-size: 1.3rem;
  line-height: initial;
  border-radius: 2px;
  color: #fff;
}
.calendar_table .schedule_list li.class::before {
  content: "강좌";
  background-color: #0082e9;
}
.calendar_table .schedule_list li.event::before {
  content: "행사";
  background-color: #37a72f;
}
.calendar_table .schedule_list li.closed {
  padding: 4px 6px;
  font-weight: 600;
  font-size: 1.4rem;
  line-height: initial;
  border-radius: 2px;
  color: #fff;
  background-color: #ff7f02;
}
.calendar_table .apply_list {
  margin: 10px 0 0;
}
.calendar_table .apply_list li {
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-start;
}
.calendar_table .apply_list li + li {
  margin: 5px 0 0;
}
.calendar_table .apply_list button {
  width: 100%;
  padding: 5px 5px;
  font-size: 1.5rem;
  font-weight: 500;
  color: #555;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
}
.calendar_table .apply_list button:hover {
  background-color: #f6f6f6;
}
.calendar_table .apply_list .approval {
  font-weight: 600;
  color: #1d47da;
}
.calendar_table .apply_btn {
  width: 100%;
  height: 100%;
  border: 3px solid transparent;
  position: absolute;
  left: 0;
  top: 0;
  font-size: 0;
  box-sizing: border-box;
  transition: all 0.3s ease;
  z-index: 2;
}
.calendar_table .apply_btn:hover {
  background-color: rgba(48, 122, 232, 0.05);
}
.calendar_table .apply_btn:disabled {
  z-index: 1;
  opacity: 1;
  border: 0 none;
  background: repeating-linear-gradient(45deg, #fafafa, #fafafa 8px, #ededed 8px, #ededed 9px);
}
.calendar_table .apply_btn.on {
  background-color: transparent;
  border-color: #307ae8;
}
.calendar_table .apply_status {
  display: block;
  width: 100px;
  text-align: center;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.2em;
  word-break: break-all;
  color: #777;
  position: absolute;
  left: 50%;
  bottom: 10px;
  z-index: 2;
  transform: translateX(-50%);
}
.calendar_table .apply_status.positive {
  font-weight: 600;
  color: #0093e3;
}
.calendar_table .btn_ico_apply {
  width: calc(100% - 16px);
  padding: 0;
  border-radius: 3px;
  color: #fff;
  border: 0 none;
  background-color: #0093e3;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.calendar_table .btn_ico_apply:hover {
  background-color: #0082c8;
}

.calendar_caption {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  margin: 15px 0 0;
}
.calendar_caption.left {
  justify-content: flex-start;
}
.calendar_caption span {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 500;
  color: #555;
}
.calendar_caption span::before {
  display: block;
  content: "";
  width: 14px;
  height: 14px;
  box-sizing: border-box;
}
.calendar_caption .today::before {
  border: 3px solid #42ca65;
}
.calendar_caption .select::before {
  border: 3px solid #307ae8;
}
.calendar_caption .no_apply::before {
  background: repeating-linear-gradient(45deg, #f0f0f0, #f0f0f0 4px, #dbdbdb 4px, #dbdbdb 5px);
}

.mo {
  display: none;
}

@media screen and (max-width: 760px) {
  br.mo {
    display: initial;
  }
}
.apply_calendar_container {
  display: flex;
  flex-flow: row wrap;
  gap: 20px;
}

.apply_calendar_area {
  flex: 1;
  padding: 25px 20px;
  border-radius: 3px;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
}

.apply_calendar_area .calendar_table th:first-child,
.apply_calendar_area .calendar_table td:first-child {
  border-left-color: transparent;
}
.apply_calendar_area .calendar_table th:last-child,
.apply_calendar_area .calendar_table td:last-child {
  border-right-color: transparent;
}
.apply_calendar_area .calendar_table td {
  height: 90px;
}

.apply_list_area {
  width: 240px;
  padding: 25px 15px;
  border-radius: 3px;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
}
.apply_list_area:has(.no_data) h4 {
  display: none;
}

.apply_list_area h4 {
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
  margin: 0 0 25px;
}

.apply_list_area ul {
  height: 100%;
  display: flex;
  flex-flow: column nowrap;
  gap: 8px;
}
.apply_list_area ul label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 10px;
  border-radius: 3px;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
  transition: all 0.3s ease;
}
.apply_list_area ul label:hover {
  background-color: rgba(48, 122, 232, 0.05);
}
.apply_list_area ul strong {
  font-weight: 600;
  color: #0093e3;
}
.apply_list_area ul span {
  font-weight: 500;
  color: #555;
}
.apply_list_area ul :disabled + label {
  border: 0 none;
  background-color: #e5e5e5;
}
.apply_list_area ul :disabled + label strong {
  color: #5C5C5C;
}
.apply_list_area ul :disabled + label span {
  color: #5C5C5C;
}
.apply_list_area ul :checked + label {
  border-color: transparent;
  background-color: #0093e3;
}
.apply_list_area ul :checked + label strong {
  color: #fff;
}
.apply_list_area ul :checked + label span {
  color: #fff;
}
.apply_list_area ul .no_data {
  height: 100%;
}

@media screen and (max-width: 1024px) {
  .apply_calendar_container {
    flex-flow: column nowrap;
    gap: 40px;
  }
  .apply_calendar_area {
    flex: none;
    width: 100%;
    padding: 0;
    border-radius: 0;
    border: 0 none;
  }
  .apply_list_area {
    width: 100%;
    padding: 20px 15px;
  }
  .apply_list_area ul {
    flex-flow: row wrap;
    gap: 10px;
  }
  .apply_list_area ul li {
    width: calc(50% - 5px);
  }
}
@media screen and (max-width: 760px) {
  .apply_list_area ul {
    gap: 8px;
  }
  .apply_list_area ul li {
    width: 100%;
  }
}
@media screen and (max-width: 760px) {
  .calendar_header {
    gap: 15px;
  }
  .calendar_header .calendar_date {
    gap: 5px;
    font-size: 2rem;
  }
  .calendar_header .prev_month_btn,
  .calendar_header .next_month_btn {
    width: 24px;
    height: 24px;
    background-size: 24px auto;
  }
  .calendar_header .today_btn {
    min-width: auto;
    min-height: 30px;
    padding: 0 8px;
    font-size: 1.5rem;
    top: 5px;
  }
  .calendar_header .today_btn::before {
    width: 16px;
    height: 16px;
    background-size: 16px auto;
  }
  .calendar_table {
    width: 760px;
  }
  .calendar_table .event_list li a,
  .calendar_table .event_list li span {
    font-size: 1.5rem;
  }
  .page_remote dt,
  .page_remote dd {
    padding: 12px 10px;
  }
  .page_remote dt {
    width: 40px;
  }
  .page_remote dd {
    padding-left: 0;
    width: calc(100% - 40px);
  }
}
/* calendar_table end */
/* 팝업 start */
.modal {
  width: 100%;
  height: 100%;
  /*background: rgba(0,0,0,0.5);*/
  box-sizing: border-box;
  display: none;
  justify-content: center;
  align-items: center;
  padding: 50px 50px;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 20;
  -webkit-overflow-scrolling: touch;
  overflow: hidden;
}
.modal-blank {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(2px);
  opacity: 0;
  transition: all 0.3s ease;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1;
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='36' height='36' fill='rgba(255,255,255,1)'%3E%3Cpath d='M10.5859 12L2.79297 4.20706L4.20718 2.79285L12.0001 10.5857L19.793 2.79285L21.2072 4.20706L13.4143 12L21.2072 19.7928L19.793 21.2071L12.0001 13.4142L4.20718 21.2071L2.79297 19.7928L10.5859 12Z'%3E%3C/path%3E%3C/svg%3E"), auto;
}
.modal-area {
  max-width: 1100px;
  width: 100%;
  max-height: 100%;
  display: flex;
  flex-flow: column nowrap;
  overflow: hidden;
  background: #fff;
  border-radius: 3px;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
  transition: all 0.3s ease;
  opacity: 0;
  -webkit-transform: translateZ(0);
  transform: translateZ(0) translateY(30px);
  -webkit-overflow-scrolling: touch;
}
.modal-header {
  display: flex;
  align-items: center;
  padding: 20px 30px;
  border-bottom: 1px solid #dbdbdb;
}
.modal-title {
  font-size: 2rem;
  font-weight: 700;
}
.modal-body {
  flex: 1;
  overflow-y: auto;
  padding: 30px 30px;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.modal-body::-webkit-scrollbar {
  width: 5px;
  background-color: #ccc;
}
.modal-body::-webkit-scrollbar-thumb {
  background-color: #000;
}
.modal:has(.footer__btn-wrap) .modal-body {
  padding: 30px 30px 0;
}
.modal-footer {
  width: 100%;
  padding: 0 20px 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  background-color: #fff;
}
.modal-footer .btn {
  flex: 1;
  height: 48px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
}
.modal-footer .btn.pri {
  background-color: #252525;
  border: 0 none;
}
.modal-footer .btn.pri:hover {
  background-color: #050505;
}
.modal .modal-close-btn {
  min-width: auto;
  width: 28px;
  height: 28px;
  transition: all 0.3s ease;
  border-radius: 2px;
  font-size: 0;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='28' height='28' fill='rgba(37,37,37,1)'%3E%3Cpath d='M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  right: 2.4rem;
  top: 2rem;
  z-index: 10;
}
.modal .modal-close-btn:hover {
  opacity: 1;
}
.modal.is-active .modal-area {
  opacity: 1;
  transform: translateZ(0) translateY(0);
}
.modal.is-active .modal-blank {
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .modal {
    padding: 20px 20px;
  }
  .modal .modal-header {
    padding: 2rem 1.6rem;
  }
  .modal .modal-body {
    padding: 2rem 1.6rem;
  }
  .modal .modal-close-btn {
    right: 1rem;
  }
}

/* 팝업 end */
/* 다이얼로그 start */
.dialog .blank {
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.5);
  transition: all 0.3s ease;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
}
.dialog_container {
  width: 100%;
  max-width: 500px;
  margin: 30px 0 0;
  opacity: 0;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  transition: all 0.3s ease;
  position: static;
  z-index: 2;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-overflow-scrolling: touch;
}
.dialog_header {
  padding: 15px 20px;
  background-color: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.dialog_header h4 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #212529;
}
.dialog_header .blind {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.dialog_body {
  padding: 30px 20px 20px;
}
.dialog_body p {
  font-size: 17px;
  line-height: 1.5;
  color: #495057;
  text-align: center;
}
.dialog_body .input_area {
  margin-bottom: 20px;
}
.dialog_body .form-control {
  display: block;
  width: 100%;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #495057;
  background-color: #fff;
  border: 1px solid #ced4da;
  border-radius: 4px;
  transition: all 0.3s ease;
}
.dialog_body .form-control:focus {
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.dialog_button {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 30px 0 0;
}
.dialog_button button {
  width: 100%;
  height: 44px;
}
.dialog_button button.btn_primary {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}
.dialog_button button.btn_primary:hover {
  background-color: #0069d9;
  border-color: #0062cc;
}
.dialog_close_btn {
  width: 24px;
  height: 24px;
  font-size: 0;
  position: absolute;
  top: 13px;
  right: 15px;
  cursor: pointer;
  background: none;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dialog_close_btn::before, .dialog_close_btn::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 2px;
  background-color: #6c757d;
  transition: all 0.3s ease;
}
.dialog_close_btn::before {
  transform: rotate(45deg);
}
.dialog_close_btn::after {
  transform: rotate(-45deg);
}
.dialog_close_btn:hover::before, .dialog_close_btn:hover::after {
  background-color: #000;
}
.dialog.on .blank {
  opacity: 1;
}
.dialog.on .dialog_container {
  opacity: 1;
  margin: 0;
}

@media screen and (max-width: 760px) {
  .dialog {
    padding: 20px 20px;
  }
  .dialog_body {
    padding: 20px 15px 15px;
  }
  .dialog_button {
    margin: 20px 0 0;
  }
  .dialog_button button {
    height: 40px;
  }
}
/* 다이얼로그 end */
/* 로딩 인디케이터 start */
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.loading {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  top: 0;
  left: 0;
  z-index: 50;
}
.loading__spinner {
  width: 80px;
  height: 80px;
  border: 10px solid #f3f3f3;
  border-top: 10px solid #3498db;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* 지역 로딩 스피너 (특정 영역에만 표시) */
.loading-local {
  position: relative;
  min-height: 200px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 40px 20px;
}
.loading-local .spinner {
  width: 50px;
  height: 50px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #3498db;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.loading-local .loading-message {
  margin-top: 16px;
  font-size: 14px;
  color: #666;
  text-align: center;
}

/* 오버레이 형태의 지역 로딩 스피너 */
.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.9);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 10;
}
.loading-overlay .spinner {
  width: 50px;
  height: 50px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #3498db;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.loading-overlay .loading-message {
  margin-top: 16px;
  font-size: 14px;
  color: #666;
  text-align: center;
}

/* 에러 메시지 스타일 */
.error-message {
  padding: 40px 20px;
  text-align: center;
}
.error-message .error-icon {
  font-size: 48px;
  display: block;
  margin-bottom: 16px;
}
.error-message .error-text {
  font-size: 14px;
  color: #e74c3c;
}

/* 데이터 없음 스타일 */
.no-data {
  padding: 40px 20px;
  text-align: center;
}
.no-data .no-data-icon {
  font-size: 48px;
  display: block;
  margin-bottom: 16px;
}
.no-data .no-data-text {
  font-size: 14px;
  color: #95a5a6;
}

/* 로딩 인디케이터 end */
/* 카카오 맵 start */
.root_daum_roughmap.root_daum_roughmap_landing {
  width: 100%;
  height: 100%;
}
.root_daum_roughmap.root_daum_roughmap_landing .wrap_map {
  height: calc(100% - 32px);
}
.root_daum_roughmap.root_daum_roughmap_landing .map {
  width: 100%;
  height: 100%;
}
.root_daum_roughmap.root_daum_roughmap_landing .map_border {
  display: none;
}
.root_daum_roughmap.root_daum_roughmap_landing .wrap_btn_ico_zoom {
  z-index: 1;
}
.root_daum_roughmap.root_daum_roughmap_landing .wrap_controllers {
  border: 0 none;
  border-top: 1px solid #dbdbdb;
}
.root_daum_roughmap.root_daum_roughmap_landing .cont {
  display: none;
}
.root_daum_roughmap.root_daum_roughmap_landing .wrap_btn_ico_zoom,
.root_daum_roughmap.root_daum_roughmap_landing .wrap_btn_zoom {
  z-index: 5;
}

/* 카카오 맵 end */
.jsTabPanel,
.jsHoverTabPanel {
  display: none;
}
.jsTabPanel.is-active,
.jsHoverTabPanel.is-active {
  display: block;
}

/* 아코디언 버튼  [S] */
.jsAccOn,
.jsAccOff {
  display: none;
}
.jsAccOn.is-active,
.jsAccOff.is-active {
  display: block;
}

.jsAccPanel {
  display: none;
}

/* 토글 아코디언 모듈 동작 End */
.multilingual_input[type=text] {
  width: 100%;
  height: 50px;
  text-align: center;
  border-color: #1d47da;
  margin: 0 0 20px;
}

.multilingual_language {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
}
.multilingual_language button {
  width: 100%;
  height: 50px;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
  border-radius: 0;
  margin-right: -1px;
}
.multilingual_language button:first-child {
  border-radius: 3px 0 0 3px;
}
.multilingual_language button:last-child {
  border-radius: 0 3px 3px 0;
}
.multilingual_language button.on {
  background-color: #1d47da;
  color: #fff;
  border-color: #1d47da;
}

#textInput {
  width: 80%;
  margin: 10px 0;
  padding: 10px;
  font-size: 16px;
}

.multilingual_keyboard {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20px;
}

.keyboard__row {
  display: flex;
  justify-content: center;
  margin-bottom: 5px;
  max-width: 100%;
}
.keyboard__row .key {
  width: 50px;
  height: 50px;
  background: #f0f0f0;
  border: 1px solid #dbdbdb;
  text-align: center;
  line-height: 50px;
  margin: 2px;
  font-size: 14px;
  user-select: none;
}
.keyboard__row .key.special {
  background: #ffd700;
}
.keyboard__row .key:hover {
  background: #ddd;
}
.keyboard__row .key:active {
  background: #aaa;
}
.keyboard__row .active {
  background: #ddd;
}
.keyboard__row:has(button.Space) {
  width: 33%;
}
.keyboard__row button.Space {
  width: 100%;
}

.layer_popup {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}
.layer_popup .blank {
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(2px);
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.3s ease;
}

.layer_popup_container {
  max-width: 1530px;
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  gap: 30px;
  padding: 0 20px;
  margin: 0 auto;
  opacity: 0;
  box-sizing: border-box;
  position: relative;
  transition: all 0.3s ease;
}
.layer_popup_container:has(.swiper-slide:nth-child(4)) {
  padding: 0 80px;
}

.layer_popup_swiper {
  max-width: 400px;
  width: 100%;
}
.layer_popup_swiper:has(.swiper-slide:nth-child(2)) {
  max-width: 830px;
}
.layer_popup_swiper:has(.swiper-slide:nth-child(3)) {
  max-width: 1260px;
}
.layer_popup_swiper:has(.swiper-slide:nth-child(4)) {
  max-width: 1370px;
}
.layer_popup_swiper .swiper-slide {
  aspect-ratio: 1/1;
  font-size: 0;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  box-sizing: border-box;
}
.layer_popup_swiper .popup-content-wrap {
  display: none;
}

.layer_popup_container .swiper_prev_btn,
.layer_popup_container .swiper_next_btn {
  width: 60px;
  height: 60px;
  font-size: 0;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='60' height='60' fill='rgba(255,255,255,1)'%3E%3Cpath d='M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  right: 0;
  top: calc(50% - 50px);
  transform: translateY(-50%);
  z-index: 1;
}
.layer_popup_container .swiper_prev_btn:hover,
.layer_popup_container .swiper_next_btn:hover {
  opacity: 1;
}
.layer_popup_container .swiper_prev_btn.swiper-button-disabled,
.layer_popup_container .swiper_next_btn.swiper-button-disabled {
  display: none;
}
.layer_popup_container .swiper_prev_btn {
  left: 0;
  right: initial;
  transform: translateY(-50%) rotate(180deg);
}

.layer_popup_swiper .swiper_pagination {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 30px 0 0;
}
.layer_popup_swiper .swiper_pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  margin: 0;
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.5);
  transition: all 0.3s ease;
}
.layer_popup_swiper .swiper_pagination .swiper-pagination-bullet-active {
  width: 16px;
  height: 8px;
  border-radius: 50px;
  background-color: #33ff66;
}
.layer_popup_swiper .swiper_pagination:has(.swiper-pagination-bullet:nth-child(2)) {
  display: flex;
}

.layer_popup__function {
  display: flex;
  flex-flow: row wrap;
  gap: 10px;
  justify-content: center;
  align-items: center;
}
.layer_popup__function .layer_popup__count {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  font-weight: 500;
  border-radius: 50px;
  background-color: #fff;
}
.layer_popup__function .layer_popup__count strong {
  margin: 0 0 0 4px;
  color: #ff0000;
}
.layer_popup__function button {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 20px;
  font-weight: 500;
  border-radius: 50px;
  background-color: #fff;
}
.layer_popup__function button::after {
  display: block;
  content: "";
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z'%3E%3C/path%3E%3C/svg%3E");
}
.layer_popup__function button:hover {
  background-color: #e5e5e5;
}

.layer_popup.on .layer_popup_container {
  margin: 0;
  opacity: 1;
}
.layer_popup.on .blank {
  opacity: 1;
}

@media screen and (max-width: 1200px) {
  .layer_popup_container:has(.swiper-slide:nth-child(3)) {
    padding: 0 80px;
  }
}
@media screen and (max-width: 760px) {
  .layer_popup_container {
    padding: 0 20px;
  }
  .layer_popup_container:has(.swiper-slide:nth-child(3)), .layer_popup_container:has(.swiper-slide:nth-child(4)) {
    padding: 0 20px;
  }
  .layer_popup_container .swiper_prev_btn,
  .layer_popup_container .swiper_next_btn {
    display: none;
  }
  .layer_popup_swiper:has(.swiper-slide:nth-child(2)) {
    max-width: 400px;
  }
  .layer_popup_swiper:has(.swiper-slide:nth-child(3)) {
    max-width: 400px;
  }
  .layer_popup_swiper:has(.swiper-slide:nth-child(4)) {
    max-width: 400px;
  }
  .layer_popup_swiper .swiper_pagination {
    margin: 20px 0 0;
  }
  .layer_popup_swiper .swiper_pagination .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
  }
  .layer_popup_swiper .swiper_pagination .swiper-pagination-bullet-active {
    width: 12px;
    height: 6px;
  }
  .layer_popup__function {
    gap: 6px;
    width: 100%;
  }
  .layer_popup__function .layer_popup__count {
    height: 30px;
    padding: 0 12px;
    font-size: 1.5rem;
  }
  .layer_popup__function button {
    gap: 2px;
    height: 30px;
    padding: 0 12px;
    font-size: 1.5rem;
  }
  .layer_popup__function button::after {
    width: 16px;
    height: 16px;
    background-size: 16px auto;
  }
}
.comments_area:has(.comments_item) {
  border-top: 1px solid #000;
}

.comments_item {
  padding: 20px 0;
  border-bottom: 1px solid #dbdbdb;
  position: relative;
}
.comments_item:last-of-type {
  border-bottom: 0 none;
}

.comments_reply_item {
  padding: 20px 0 20px 28px;
  position: relative;
}
.comments_reply_item::before {
  display: block;
  content: "";
  width: 18px;
  height: 18px;
  box-sizing: border-box;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(204,204,204,1)'%3E%3Cpath d='M4.99989 13.9999L4.99976 5L6.99976 4.99997L6.99986 11.9999L17.1717 12L13.222 8.05024L14.6362 6.63603L21.0001 13L14.6362 19.364L13.222 17.9497L17.1717 14L4.99989 13.9999Z'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  left: 0;
  top: 18px;
}

.comments_user {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  padding: 0 0 0 20px;
  margin: 0 0 15px;
  font-weight: 600;
  position: relative;
}
.comments_user::before {
  display: block;
  content: "";
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(51,51,51,1)'%3E%3Cpath d='M4 22C4 17.5817 7.58172 14 12 14C16.4183 14 20 17.5817 20 22H18C18 18.6863 15.3137 16 12 16C8.68629 16 6 18.6863 6 22H4ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.21 11 16 9.21 16 7C16 4.79 14.21 3 12 3C9.79 3 8 4.79 8 7C8 9.21 9.79 11 12 11Z'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  left: 0;
  top: 0;
}
.comments_user .date {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1;
  color: #999;
}

.comments_text {
  line-height: 1.3em;
}
.comments_text p {
  color: #555;
}
.comments_text textarea {
  width: 100%;
  height: 100px;
  border: 0 none;
}
.comments_text textarea:focus {
  outline: 0 none;
}
.comments_text .btn_container {
  justify-content: flex-end;
  padding: 10px 10px;
}
.comments_text .btn_container .btn,
.comments_text .btn_container .btn_secondary {
  min-width: 40px;
  min-height: 34px;
  line-height: initial;
}
.comments_text .btn_container .btn::before,
.comments_text .btn_container .btn_secondary::before {
  display: none;
}
.comments_text:has(textarea) {
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #dbdbdb;
}
.comments_text:has(:focus) {
  outline: 2px solid #000;
}

.commetns_func {
  display: flex;
  align-items: center;
  gap: 8px;
  position: absolute;
  right: 0;
  top: 20px;
}
.commetns_func button {
  width: 18px;
  height: 18px;
  font-size: 0;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.05em;
  opacity: 0.35;
  background-repeat: no-repeat;
  background-position: center;
}
.commetns_func button:hover {
  opacity: 1;
}
.commetns_func .btn_reply {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M14 22.5L11.2 19H6C5.44772 19 5 18.5523 5 18V7.10256C5 6.55028 5.44772 6.10256 6 6.10256H22C22.5523 6.10256 23 6.55028 23 7.10256V18C23 18.5523 22.5523 19 22 19H16.8L14 22.5ZM15.8387 17H21V8.10256H7V17H11.2H12.1613L14 19.2984L15.8387 17ZM2 2H19V4H3V15H1V3C1 2.44772 1.44772 2 2 2Z'%3E%3C/path%3E%3C/svg%3E");
}
.commetns_func .btn_modify {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M16.7574 2.99678L14.7574 4.99678H5V18.9968H19V9.23943L21 7.23943V19.9968C21 20.5491 20.5523 20.9968 20 20.9968H4C3.44772 20.9968 3 20.5491 3 19.9968V3.99678C3 3.4445 3.44772 2.99678 4 2.99678H16.7574ZM20.4853 2.09729L21.8995 3.5115L12.7071 12.7039L11.2954 12.7064L11.2929 11.2897L20.4853 2.09729Z'%3E%3C/path%3E%3C/svg%3E");
}
.commetns_func .btn_delete {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M17 6H22V8H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V8H2V6H7V3C7 2.44772 7.44772 2 8 2H16C16.5523 2 17 2.44772 17 3V6ZM18 8H6V20H18V8ZM9 11H11V17H9V11ZM13 11H15V17H13V11ZM9 4V6H15V4H9Z'%3E%3C/path%3E%3C/svg%3E");
}

.comments_write_item {
  display: flex;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #dbdbdb;
}
.comments_write_item:has(:focus) {
  outline: 2px solid #333;
}
.comments_write_item textarea {
  width: 100%;
  height: 100px;
  border: 0 none;
}
.comments_write_item textarea:focus {
  outline: 0 none;
}
.comments_write_item .btn_container {
  justify-content: flex-end;
  padding: 10px 10px;
}
.comments_write_item .btn_container .btn,
.comments_write_item .btn_container .btn_secondary {
  min-width: auto;
  width: 80px;
  min-height: auto;
  height: 80px;
  line-height: initial;
}
.comments_write_item .btn_container .btn::before,
.comments_write_item .btn_container .btn_secondary::before {
  display: none;
}

@media screen and (max-width: 760px) {
  .comments_item {
    padding: 15px 0;
  }
  .commetns_func {
    top: 15px;
  }
  .comments_reply_item {
    padding: 15px 0 15px 20px;
  }
  .comments_reply_item::before {
    width: 14px;
    height: 14px;
    background-size: 14px auto;
    top: 14px;
  }
  .comments_user {
    padding: 0 0 0 16px;
    font-size: 1.5rem;
  }
  .comments_user::before {
    width: 14px;
    height: 14px;
    background-size: 14px auto;
    top: 0;
  }
}
.preview_mode_banner {
  width: 100vw;
  padding: 3rem;
  box-sizing: border-box;
  background-color: #ff9800;
  color: white;
  text-align: center;
  font-size: 3.2rem;
  font-weight: 700;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
}

/* 툴팁(도움말) */
.tool_tip_container {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  position: relative;
}

.tool_tip_btn {
  width: 20px;
  height: 20px;
  font-size: 0;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(51,51,51,1)'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 20C7.59 20 4 16.41 4 12C4 7.59 7.59 4 12 4C16.41 4 20 7.59 20 12C20 16.41 16.41 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z'%3E%3C/path%3E%3C/svg%3E");
}

.tool_tip_content {
  width: 400px;
  height: auto;
  padding: 12px 12px;
  opacity: 0;
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  position: absolute;
  left: -8px;
  top: 28px;
  z-index: -1;
  transition: all 0.2s ease-in-out;
}
.tool_tip_content::before {
  content: "";
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #fff;
  position: absolute;
  top: -8px;
  left: 10px;
  filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.15));
}

.tool_tip__title {
  font-weight: 600;
  margin: 0 0 8px;
  color: #444;
}

.tool_tip_content p {
  padding: 0 0 0 10px;
  font-size: 14px;
  line-height: 1.3em;
  color: #555;
  position: relative;
}
.tool_tip_content p::before {
  content: "";
  width: 2px;
  height: 2px;
  background-color: #999;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 8px;
}
.tool_tip_content p + p {
  margin: 6px 0 0;
}

.tool_tip_btn:hover,
.tool_tip_btn:focus {
  opacity: 1;
}
.tool_tip_btn:hover + .tool_tip_content,
.tool_tip_btn:focus + .tool_tip_content {
  opacity: 1;
  z-index: 1;
}

@media screen and (max-width: 768px) {
  .m-hidden {
    display: none;
  }
}
.footer {
  min-height: 19.5rem;
  padding: 2.4rem 0 6rem;
  box-sizing: border-box;
  background-color: #f2f4f6;
}
@media screen and (max-width: 768px) {
  .footer {
    min-height: 30rem;
    height: auto;
    padding: 2.4rem 0 0;
  }
}

.footer-inner {
  display: flex;
  max-width: 145.2rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
  box-sizing: border-box;
  flex-direction: column;
  gap: 1.2rem;
}
@media screen and (max-width: 768px) {
  .footer-inner {
    gap: 2rem;
  }
}

.footer-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
}
@media screen and (max-width: 768px) {
  .footer-top {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media screen and (max-width: 768px) {
  .footer-nav {
    width: 100%;
  }
}

.footer-nav__list {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 1.6rem;
}
@media screen and (max-width: 768px) {
  .footer-nav__list {
    justify-content: center;
    gap: 1rem 1.4rem;
  }
}

.footer-nav__item + .footer-nav__item {
  padding: 0 0 0 1.7rem;
  position: relative;
}
.footer-nav__item + .footer-nav__item::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1rem;
  background-color: #c1c8d0;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .footer-nav__item + .footer-nav__item {
    padding: 0 0 0 1.5rem;
  }
  .footer-nav__item + .footer-nav__item::before {
    width: 0.1rem;
    height: 1rem;
  }
}

.footer-nav__link {
  font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
  .footer-nav__link {
    font-size: 1.6rem;
  }
}

.footer-nav__item:first-of-type .footer-nav__link {
  color: var(--primary-color);
  font-weight: 600;
}

@media screen and (max-width: 768px) {
  .family-site-wrap {
    width: 100%;
  }
}

.family-site {
  min-width: 24rem;
}
@media screen and (max-width: 768px) {
  .family-site {
    width: 100%;
    height: 4rem;
    font-size: 1.5rem;
  }
}

.footer-bottom {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media screen and (max-width: 768px) {
  .footer-bottom {
    gap: 2rem;
  }
}

.footer-info-container {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .footer-info-container {
    justify-content: center;
  }
}

.footer-info__title {
  position: fixed;
  left: -99999px;
  top: -99999px;
}

.footer-info__content {
  color: #555;
}
@media screen and (max-width: 768px) {
  .footer-info__content {
    text-align: center;
    font-size: 1.4rem;
  }
}

.footer-copyright {
  color: #999;
}
@media screen and (max-width: 768px) {
  .footer-copyright {
    text-align: center;
    font-size: 1.3rem;
  }
}

.modal--gnb {
  padding: 0;
  z-index: 100;
}

.modal--gnb .modal-area {
  max-width: 90%;
  height: 100%;
  margin: 0;
  position: absolute;
  right: -100%;
  top: 0;
  opacity: 1;
  border-radius: 0;
  transform: none;
}

.modal--gnb.is-active .modal-area {
  right: 0;
}

.top-menu-area {
  display: flex;
  height: 7.2rem;
  padding: 0 2rem;
  box-sizing: border-box;
  border-bottom: solid 1px #c1c8d0;
}

.top-menu {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.top-menu-item {
  padding: 0.8rem 1.6rem;
  border-radius: 5rem;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 600;
  line-height: initial;
}
.top-menu-item--1 {
  background-color: var(--quaternary-color);
}
.top-menu-item--1:hover, .top-menu-item--1:focus-visible {
  background-color: var(--quaternary-hover);
}
.top-menu-item--2 {
  background-color: var(--primary-color);
}
.top-menu-item--2:hover, .top-menu-item--2:focus-visible {
  background-color: var(--primary-hover);
}

.menu-area {
  height: calc(100% - 7.2rem - 5.6rem);
}

.menu-list {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.menu-list::-webkit-scrollbar {
  width: 4px;
  background-color: #B5B5B5;
}
.menu-list::-webkit-scrollbar-thumb {
  background-color: #383838;
}

.menu-item {
  display: flex;
  flex-direction: column;
  border-bottom: solid 1px #c1c8d0;
}

.menu-btn {
  display: flex;
  width: 100%;
  order: 1;
  align-items: center;
  justify-content: space-between;
  padding: 2rem 2rem;
  box-sizing: border-box;
  position: relative;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1;
}
.menu-btn::after {
  display: block;
  content: "열기";
  width: 2.4rem;
  height: 2.4rem;
  box-sizing: border-box;
  border-radius: 50%;
  border: solid 1px #e1e7ec;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../images/menu_gnb_open.svg");
  font-size: 0;
}
.menu-btn:hover, .menu-btn:focus-visible {
  background-color: #f2f2f2;
}

.menu-btn.jsAccOff {
  color: var(--tertiary-color);
  font-weight: 700;
}
.menu-btn.jsAccOff::after {
  background-image: url("../images/menu_gnb_close.svg");
}

.menu-sub {
  width: 100%;
  order: 2;
  padding: 0 2rem;
  box-sizing: border-box;
  position: relative;
  background-color: #F4F4F4;
}
.menu-sub::before {
  display: block;
  content: "";
  width: 0;
  height: 0.2rem;
  background-color: var(--tertiary-color);
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  transition: all 0.3s ease;
}

.menu-sub.is-active {
  padding: 2rem 2rem;
}
.menu-sub.is-active::before {
  width: 100%;
}

.menu-sub-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.menu-sub-list a,
.menu-sub-list span {
  display: inline-block;
  padding: 0.5rem 0;
  position: relative;
  font-size: 1.6rem;
  line-height: 1;
}
.menu-sub-list a::before {
  display: block;
  content: "";
  width: 0;
  height: 0.2rem;
  background-color: var(--tertiary-color);
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  transition: all 0.3s ease;
}
.menu-sub-list a:hover {
  color: var(--tertiary-color);
  font-weight: 500;
}
.menu-sub-list a:hover::before {
  width: 100%;
}

.menu-close-btn {
  width: 3.6rem;
  height: 3.6rem;
  position: absolute;
  right: 0.8rem;
  top: 1.8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 2.4rem auto;
  background-image: url("../images/mobile_menu_close.svg");
  font-size: 0;
}
.menu-close-btn:hover, .menu-close-btn:focus-visible {
  background-color: #f8f8f8;
}

.menu-mobile-card {
  display: flex;
  width: 100%;
  height: 5.6rem;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  color: #fff;
  background-color: var(--primary-color);
  font-size: 1.6rem;
  font-weight: 600;
}
.menu-mobile-card::before {
  display: block;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(255,255,255,1)'%3E%3Cpath d='M3 6H21V18H3V6ZM2 4C1.44772 4 1 4.44772 1 5V19C1 19.5523 1.44772 20 2 20H22C22.5523 20 23 19.5523 23 19V5C23 4.44772 22.5523 4 22 4H2ZM13 8H19V10H13V8ZM18 12H13V14H18V12ZM10.5 10C10.5 11.3807 9.38071 12.5 8 12.5C6.61929 12.5 5.5 11.3807 5.5 10C5.5 8.61929 6.61929 7.5 8 7.5C9.38071 7.5 10.5 8.61929 10.5 10ZM8 13.5C6.067 13.5 4.5 15.067 4.5 17H11.5C11.5 15.067 9.933 13.5 8 13.5Z'%3E%3C/path%3E%3C/svg%3E");
}
.menu-mobile-card:hover, .menu-mobile-card:focus-visible {
  background-color: var(--primary-hover);
}

.menu-mobile-citizen-auth {
  display: flex;
  width: 100%;
  height: 5.6rem;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  color: #fff;
  background-color: var(--tertiary-color);
  font-size: 1.6rem;
  font-weight: 600;
}
.menu-mobile-citizen-auth::before {
  display: block;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(255,255,255,1)'%3E%3Cpath d='M3 6H21V18H3V6ZM2 4C1.44772 4 1 4.44772 1 5V19C1 19.5523 1.44772 20 2 20H22C22.5523 20 23 19.5523 23 19V5C23 4.44772 22.5523 4 22 4H2ZM13 8H19V10H13V8ZM18 12H13V14H18V12ZM10.5 10C10.5 11.3807 9.38071 12.5 8 12.5C6.61929 12.5 5.5 11.3807 5.5 10C5.5 8.61929 6.61929 7.5 8 7.5C9.38071 7.5 10.5 8.61929 10.5 10ZM8 13.5C6.067 13.5 4.5 15.067 4.5 17H11.5C11.5 15.067 9.933 13.5 8 13.5Z'%3E%3C/path%3E%3C/svg%3E");
}
.menu-mobile-citizen-auth:hover, .menu-mobile-citizen-auth:focus-visible {
  background-color: var(--tertiary-hover);
}

:has(.modal--layer.is-active) {
  overflow: hidden;
}

.modal--layer {
  padding: 0 1.6rem;
}

.modal--layer .modal-area {
  max-width: 100%;
  width: auto;
  overflow: visible;
  position: relative;
  background-color: transparent;
  padding: 0 6.6rem;
}
.modal--layer .modal-area:has(.swiper-button-lock) {
  padding: 0;
}

.layer-swiper {
  width: 100%;
}
.layer-swiper:has(.layer-item:only-of-type) {
  max-width: 40rem;
}
.layer-swiper:has(.layer-item:nth-of-type(2)) {
  max-width: 83rem;
}
.layer-swiper:has(.layer-item:nth-of-type(3)) {
  max-width: 126rem;
}

.layer-item {
  display: block;
  width: 40rem;
  height: 50rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 1rem;
  border: solid 0.1rem rgba(0, 0, 0, 0.2);
}

.layer-item__img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  object-fit: cover;
  object-position: center top;
}

.layer-control-area {
  display: flex;
  flex-direction: row nowrap;
  gap: 3rem;
  justify-content: center;
  align-items: center;
}

.layer-control {
  display: flex;
  flex-flow: row wrap;
  gap: 1rem;
  justify-content: center;
  align-items: center;
  padding: 3rem 0 0;
}

.layer-control__item {
  display: flex;
  height: 4rem;
  align-items: center;
  justify-content: center;
  padding: 0 2rem;
  font-weight: 500;
  border-radius: 5rem;
  background-color: #fff;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.1);
  line-height: 1;
}
.layer-control__item strong {
  margin: 0 0 0 0.4rem;
  color: #FF3B30;
}

.layer-control__item.jsModalOff {
  gap: 0.5rem;
}
.layer-control__item.jsModalOff::after {
  display: block;
  content: "";
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z'%3E%3C/path%3E%3C/svg%3E");
}
.layer-control__item.jsModalOff:hover {
  background-color: #e5e5e5;
}

.layer-navi {
  display: flex;
  flex-flow: row wrap;
  gap: 0.6rem;
  justify-content: flex-end;
  align-items: center;
}

.layer-navi__btn {
  width: 5rem;
  height: 5rem;
  box-sizing: border-box;
  position: absolute;
  top: 25rem;
  transform: translateY(-50%);
  z-index: 1;
  border-radius: 50%;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.1);
  font-size: 0;
}
.layer-navi__btn:hover {
  background-color: #e5e5e5;
}

.layer-navi__btn--prev {
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='32' height='32' fill='rgba(0,0,0,1)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}

.layer-navi__btn--next {
  right: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='32' height='32' fill='rgba(0,0,0,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}

@media screen and (max-width: 768px) {
  .modal--layer .modal-area {
    padding: 0;
  }
  .layer-swiper {
    max-width: 50rem;
    padding: 0;
  }
  .layer-swiper:has(.layer-item:only-of-type) {
    max-width: 50rem;
  }
  .layer-swiper:has(.layer-item:nth-of-type(2)) {
    max-width: 50rem;
  }
  .layer-swiper:has(.layer-item:nth-of-type(3)) {
    max-width: 50rem;
  }
  .layer-item {
    width: 100%;
    height: auto;
    aspect-ratio: 400/500;
  }
  .layer-control {
    gap: 0.6rem;
    padding: 2rem 0 0;
  }
  .layer-control__item {
    height: 3.6rem;
    padding: 0 1.6rem;
    font-size: 1.4rem;
  }
  .layer-control__item.jsModalOff {
    gap: 0;
  }
  .layer-control__item.jsModalOff::after {
    width: 1.6rem;
    height: 1.6rem;
  }
  .layer-navi__btn {
    display: none;
  }
}
.comming-wrap {
  width: 100vw;
  height: 100vh;
  padding: 0 2rem;
  box-sizing: border-box;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url("../images/comming_bg.png");
  font-family: "GongGothic", "Pretendard", "Malgun Gothic", sans-serif;
}

.comming-container {
  display: flex;
  max-width: 150rem;
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  position: relative;
}

.comming-title {
  color: #252525;
  text-align: center;
  text-shadow: 0 0 2rem rgba(255, 255, 255, 0.3);
  font-size: 7rem;
  font-weight: 700;
  line-height: 1.2em;
}

.comming-title__point {
  display: block;
  color: #0070C0;
}

.comming-info-area {
  display: flex;
  width: 100%;
  flex-flow: row wrap;
  gap: 4rem;
  padding: 4rem 0 0;
}

.comming-info {
  display: flex;
  flex: 1 1 calc(50% - 2.5rem);
  flex-direction: column;
  border-radius: 2rem;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.5);
}

.comming-info__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  padding: 2rem 2rem;
  border-radius: 2rem 2rem 0 0;
  color: #fff;
  background-color: #163776;
  text-align: center;
  font-size: 4rem;
  font-weight: 700;
}
.comming-info__title::before {
  display: block;
  content: "";
  width: 3.6rem;
  height: 3.6rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.comming-info__title--tel::before {
  background-image: url("../images/comming_tel_icon.svg");
}

.comming-info__title--location::before {
  background-image: url("../images/comming_loc_icon.svg");
}

.comming-info-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3rem;
  padding: 4rem 2rem;
  border-radius: 0 0 2rem 2rem;
  background-color: #fff;
}

.comming-info__value-1 {
  color: #E94C31;
  text-align: center;
  font-size: 4rem;
  font-weight: 700;
}

.comming-info__value-2 {
  font-size: 2.4rem;
  font-weight: 500;
  color: #777;
}

.comming-logo {
  width: 15rem;
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
}

.comming-wrap .btn-container {
  padding: 6rem 0 0;
}

.comming-wrap .btn {
  min-width: auto;
  min-height: 7rem;
  padding: 0 7rem 0 3rem;
  border-radius: 50rem;
  background-repeat: no-repeat;
  background-position: center right 2.5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(255,255,255,1)'%3E%3Cpath d='M16.1716 10.9999L10.8076 5.63589L12.2218 4.22168L20 11.9999L12.2218 19.778L10.8076 18.3638L16.1716 12.9999H4V10.9999H16.1716Z'%3E%3C/path%3E%3C/svg%3E");
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.5);
  font-size: 2.4rem;
  line-height: 1;
}
.comming-wrap .btn:hover {
  background-position: center right 2rem;
}

.loc-wrap {
  display: flex;
  width: 100%;
  height: 6.4rem;
  align-items: center;
  background-color: #f2f4f6;
}

.loc-container {
  max-width: 145.2rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
  box-sizing: border-box;
}

.loc-list {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.loc-item {
  display: flex;
  align-items: center;
  position: relative;
}

.loc-item + .loc-item::before {
  display: block;
  content: "";
  width: 0.6rem;
  height: 1rem;
  margin: 0 2rem 0 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/loc_arrow_icon.svg");
}

.loc__link {
  color: #555;
  font-size: 2rem;
}

.loc-item:last-of-type .loc__link {
  color: #252525;
  font-weight: 600;
}

.loc__link--home {
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/loc_home_icon.svg");
  font-size: 0;
}

.loc__btn {
  width: 2.4rem;
  height: 2.4rem;
  margin: 0 0 0 0.8rem;
  border-radius: 50%;
  border: solid 1px #e1e7ec;
  box-sizing: border-box;
  font-size: 0;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../images/loc_open_icon.svg");
}
.loc__btn:hover, .loc__btn:focus-visible {
  background-color: #fafafa;
}
.loc__btn.is-active {
  background-image: url("../images/loc_close_icon.svg");
}

.loc-sub-wrap {
  display: none;
  width: 15rem;
  position: absolute;
  left: 2rem;
  top: 3rem;
  z-index: 2;
  padding: 1.2rem 1.2rem;
  box-sizing: border-box;
  border: solid 1px #ebecef;
  border-radius: 0.8rem;
  background-color: #fff;
  box-shadow: 0 0.4rem 1rem 0 rgba(0, 0, 0, 0.05);
}

.loc-sub {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 1.2rem;
}

.loc-sub__link {
  display: inline-block;
  color: #555;
  line-height: 1.2em;
  word-break: break-all;
  transition: all 0.3s ease;
}
.loc-sub__link:hover, .loc-sub__link:focus-visible {
  font-weight: 500;
  color: #0091e7;
}

.content-wrap {
  min-height: calc(100vh - 15.2rem - 19.5rem - 6.4rem);
  padding: 6rem 0 10rem;
  box-sizing: border-box;
}

body:has(.loc-wrap[style*="display: none"]) .content-wrap,
body:has(.loc-wrap[hidden]) .content-wrap {
  min-height: calc(100vh - 15.2rem - 19.5rem);
}

.content-container {
  max-width: 145.2rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
  box-sizing: border-box;
}

.content-header {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 0 0 4rem;
}

.content-title {
  font-size: 5.2rem;
  font-weight: 700;
}

.content-btn-container {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.content-btn {
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 50%;
  border: solid 1px #e1e7ec;
  box-sizing: border-box;
  font-size: 0;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px auto;
}
.content-btn.is-active {
  display: block;
}
.content-btn:hover {
  background-color: #f2f2f2;
}

.content-btn--share {
  background-image: url("../images/content_share_icon.svg");
}
.content-btn--share.is-active {
  border-color: var(--primary-color);
  background-color: var(--primary-color);
  background-image: url("../images/content_close_icon.svg");
}

.content-btn--link {
  background-image: url("../images/content_link_icon.svg");
}

.content-btn--print {
  background-image: url("../images/content_print_icon.svg");
}

.content-btn-box {
  position: relative;
}

.content-share-area {
  width: 100%;
  position: absolute;
  left: 0;
  top: 5.5rem;
  z-index: 1;
  border-radius: 10rem;
  background-color: #fff;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.1);
}

.content-share-list {
  padding: 1rem 0;
}

.content-share-btn {
  width: 100%;
  height: 3.8rem;
  opacity: 0.6;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px auto;
  font-size: 0;
}
.content-share-btn:hover, .content-share-btn:focus-visible {
  opacity: 1;
}

.content-share-btn--facebook {
  background-image: url("../images/content_btn_facbook.svg");
}

.content-share-btn--x {
  background-image: url("../images/content_btn_x.svg");
}

.content-share-btn--naver {
  background-image: url("../images/content_btn_naver.svg");
}

.content-share-btn--instagram {
  background-image: url("../images/content_btn_instagram.svg");
}

.content-box + .content-box {
  padding: 6rem 0 0;
}

.content-desc {
  font-size: 1.8rem;
}

.content-ready-wrap {
  padding: 4rem 0;
}

.content-ready-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.paging-wrap {
  padding: 4rem 0 0;
}

.paging-list {
  display: flex;
  flex-wrap: wrap;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
}

.paging-item {
  display: flex;
}

.paging__link {
  display: flex;
  width: 3.6rem;
  height: 3.6rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.4rem;
  color: #555;
  background-color: #fff;
  font-size: 1.8rem;
  transition: all 0.3s ease;
}
.paging__link:hover, .paging__link:focus-visible {
  color: #252525;
  background-color: #f2f2f2;
}

.paging__link--current {
  color: #fff;
  background-color: var(--primary-color);
  font-weight: 700;
}
.paging__link--current:hover, .paging__link--current:focus-visible {
  color: #fff;
  background-color: var(--primary-color);
}

.paging__link--prev {
  font-size: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1rem;
  background-image: url("../images/paging_prev_icon.svg");
}

.paging__link--next {
  font-size: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1rem;
  background-image: url("../images/paging_next_icon.svg");
}

.paging-item--first::after {
  display: flex;
  align-items: center;
  justify-content: center;
  content: "···";
  width: 3.6rem;
  height: 3.6rem;
  color: #555;
  font-size: 1.8rem;
}

.paging-item--last::before {
  display: flex;
  align-items: center;
  justify-content: center;
  content: "···";
  width: 3.6rem;
  height: 3.6rem;
  color: #555;
  font-size: 1.8rem;
}

.tab-area {
  padding: 0 0 4rem;
}
.tab-area:has(.tab-nav__item:only-of-type) {
  display: none;
}

.tab-nav-wrap {
  display: block;
  opacity: 1;
  overflow: visible;
  visibility: visible;
}

.tab-btn {
  display: none;
}

.tab-nav {
  display: flex;
  width: 100%;
  align-items: center;
}

.tab-nav__item {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  height: 6rem;
  box-sizing: border-box;
  color: #555;
  border-radius: 0.8rem 0.8rem 0 0;
  border: solid 1px #dbdbdb;
  border-bottom: solid 2px #000;
  background-color: #fff;
  font-size: 1.8rem;
  font-weight: 500;
}
.tab-nav__item:hover {
  background-color: #f2f2f2;
}

.tab-nav__item + .tab-nav__item {
  margin: 0 0 0 -1px;
}

.tab-nav__item.is-active {
  position: relative;
  z-index: 1;
  color: #252525;
  border: 2px solid #000;
  border-bottom-color: transparent;
  font-weight: 600;
}
.tab-nav__item.is-active:hover, .tab-nav__item.is-active:focus-visible {
  background-color: #fff;
}

.sub-nav {
  display: flex;
  width: 100%;
  align-items: center;
  margin: 0 0 4rem;
}

.sub-nav__item {
  display: flex;
  flex: 1;
  height: 5.2rem;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border-radius: 0;
  border: solid 1px #c1c8d0;
  color: #555;
  font-size: 1.8rem;
}
.sub-nav__item:first-of-type {
  border-radius: 0.6rem 0 0 0.6rem;
}
.sub-nav__item:last-of-type {
  border-radius: 0 0.6rem 0.6rem 0;
}
.sub-nav__item:hover {
  color: #252525;
  background-color: #f2f2f2;
}

.sub-nav__item + .sub-nav__item {
  margin: 0 0 0 -1px;
}

.sub-nav__item.is-active {
  position: relative;
  z-index: 1;
  color: #fff;
  border-color: #339AFF;
  background-color: #339AFF;
  font-weight: 600;
}

@media screen and (max-width: 768px) {
  .comming-wrap {
    height: auto;
    min-height: 100vh;
    padding: 5rem 1rem 10rem;
    position: relative;
  }
  .comming-container {
    position: static;
  }
  .comming-title {
    font-size: 2.8rem;
  }
  .comming-info-area {
    gap: 1.5rem;
  }
  .comming-info {
    flex: 1 1 100%;
  }
  .comming-info__title {
    padding: 2rem 2rem;
    font-size: 2.4rem;
  }
  .comming-info__title::before {
    width: 2.4rem;
    height: 2.4rem;
  }
  .comming-info-content {
    gap: 1rem;
    padding: 3rem 2rem;
  }
  .comming-info__value-1 {
    font-size: 2.4rem;
  }
  .comming-info__value-2 {
    font-size: 1.5rem;
  }
  .comming-logo {
    width: 12rem;
  }
  .comming-wrap .btn {
    min-height: 6rem;
    font-size: 2rem;
  }
  .content-wrap {
    min-height: calc(100vh - 6rem - 30rem - 5.2rem);
    padding: 3rem 0 6rem;
  }
  :has(.loc-item:only-of-type) .content-wrap {
    min-height: calc(100vh - 6rem - 30rem);
  }
  .content-header {
    align-items: flex-start;
    padding: 0 0 2.4rem;
  }
  .content-title {
    font-size: 2.4rem;
  }
  .content-share-area {
    top: 4.4rem;
  }
  .content-btn {
    width: 3.6rem;
    height: 3.6rem;
    background-size: 1.8rem;
  }
  .content-share-btn {
    height: 3.6rem;
    background-size: 1.6rem;
  }
  .content-btn-box--print {
    display: none;
  }
  .content-share-list {
    padding: 0.5rem 0;
  }
  .content-box + .content-box {
    padding: 2.8rem 0 0;
  }
  .loc-wrap {
    height: 5.2rem;
    box-sizing: border-box;
    border-bottom: solid 1px #dbdbdb;
    background-color: #fff;
  }
  .loc-wrap:has(.loc-item:only-of-type) {
    display: none;
  }
  .loc-container {
    height: 100%;
    padding: 0;
  }
  .loc-list {
    height: 100%;
    gap: 0;
  }
  .loc-item {
    flex: 1;
    height: 100%;
    padding: 0 3.2rem 0 0.8rem;
    box-sizing: border-box;
    position: relative;
    border-left: solid 1px #dbdbdb;
    border-right: solid 1px #dbdbdb;
  }
  .loc-item + .loc-item {
    margin: 0 0 0 -1px;
  }
  .loc-item + .loc-item::before {
    display: none;
  }
  .loc-item--home {
    position: fixed;
    left: -99999px;
    top: -99999px;
  }
  .loc__link {
    font-size: 1.4rem;
    word-break: break-all;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
  }
  .loc__btn--open,
  .loc__btn--close {
    width: 100%;
    height: 100%;
    margin: 0;
    position: absolute;
    left: 0;
    top: 0;
    border: 0 none;
    background-color: transparent;
    background-position: right 0.8rem center;
    background-size: 1.4rem;
    font-size: 0;
  }
  .loc__btn--open:hover,
  .loc__btn--close:hover {
    background-color: transparent;
  }
  .loc-sub-wrap {
    width: calc(100% + 2px);
    min-width: auto;
    padding: 1.2rem;
    left: -1px;
    top: 5.2rem;
    border-radius: 0;
    border-color: #dbdbdb;
    border-top: transparent;
  }
  .loc-sub {
    gap: 1rem;
  }
  .paging__link {
    width: 3.2rem;
    height: 3.2rem;
    font-size: 1.4rem;
    line-height: 1;
  }
  .paging__link--prev,
  .paging__link--next {
    background-size: 0.8rem auto;
    font-size: 0;
  }
  .paging-item--first::after,
  .paging-item--last::before {
    width: 3.2rem;
    height: 3.2rem;
  }
  .tab-area {
    padding: 0 0 2.4rem;
    position: relative;
  }
  .tab-nav-wrap {
    display: none;
    width: 100%;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 4.9rem;
    z-index: 1;
    border-radius: 0 0 0.6rem 0.6rem;
    border: solid 1px #c1c8d0;
    background-color: #fff;
    box-shadow: 0 0.4rem 0.8rem 0 rgba(0, 0, 0, 0.1);
    overflow: hidden;
  }
  .tab-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    width: 100%;
    height: 5rem;
    padding: 0 1.6rem;
    box-sizing: border-box;
    border-radius: 0.6rem;
    border: solid 1px #c1c8d0;
    background-color: #fff;
    color: #555;
    font-size: 1.8rem;
    font-weight: 500;
  }
  .tab-btn::after {
    display: block;
    content: "";
    width: 1.8rem;
    height: 1.8rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  }
  .tab-btn.is-active {
    border-radius: 0.6rem 0.6rem 0 0;
  }
  .tab-btn.is-active::after {
    transform: rotate(180deg);
  }
  .tab-nav {
    flex-direction: column;
  }
  .tab-nav__item,
  .tab-nav__item.is-active {
    flex: none;
    width: 100%;
    height: 4.2rem;
    justify-content: flex-start;
    padding: 0 1.6rem;
    border-radius: 0;
    border: 0 none;
    border-bottom: solid 1px #c1c8d0;
    color: #555;
    font-size: 1.4rem;
    font-weight: 400;
  }
  .tab-nav__item:last-of-type,
  .tab-nav__item.is-active:last-of-type {
    border-bottom-color: transparent;
  }
  .tab-nav__item + .tab-nav__item,
  .tab-nav__item.is-active + .tab-nav__item {
    margin: 0;
  }
  .sub-nav__item {
    height: 4.8rem;
    font-size: 1.6rem;
  }
}
.badge-box {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.badge-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1.2rem;
  box-sizing: border-box;
  border-radius: 0.4rem;
  color: var(--tertiary-color);
  background-color: #fff;
  border: solid 1px var(--tertiary-color);
  text-align: center;
  font-weight: 600;
  line-height: 1;
}

.badge-status--1 {
  color: #fff;
  background-color: var(--tertiary-color);
  border: 0 none;
}

.badge-status--2 {
  color: #fff;
  background-color: var(--secondary-color);
  border: 0 none;
}

.badge-status--3 {
  color: var(--secondary-color);
  border-color: var(--secondary-color);
}

.badge-status--4 {
  color: #fff;
  background-color: var(--secondary-color);
  border: 0 none;
}

.badge-status--5 {
  color: var(--quaternary-color);
  border-color: var(--quaternary-color);
}

.badge-status--6 {
  color: var(--quaternary-color);
  background-color: #DBFFF2;
  border: 0 none;
}

.badge-status--dis {
  color: #555;
  background-color: #e5e5e5;
  border: 0 none;
}

.badge-status--dis-02 {
  color: #fff;
  background-color: #555;
  border: 0 none;
}

.badge-status--blk {
  color: #fff;
  background-color: #555;
  border: 0 none;
}

.badge-container {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.badge-notice {
  display: block;
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/pinned_icon.svg");
  font-size: 0;
}

.badge-secret {
  display: inline-block;
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/secret_icon.svg");
  font-size: 0;
  vertical-align: middle;
}

.badge-new {
  display: inline-block;
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
  font-size: 0;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/new_icon.svg");
}

.text-status--1 {
  font-weight: 600;
  color: #555;
}

.text-status--2 {
  font-weight: 600;
  color: var(--tertiary-color);
}

.text-status--3 {
  font-weight: 600;
  color: #FF3B30;
}

.text-status--4 {
  font-weight: 600;
  color: var(--quaternary-color);
}

.text-box {
  padding: 2.8rem 2.8rem;
  box-sizing: border-box;
  border-radius: 1.6rem;
  background-color: #f2f4f6;
}
.text-box--dash {
  background-color: #fff;
  border: dashed 1px #dbdbdb;
}
.text-box--shadow {
  background-color: #fff;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.1);
}

.text-box__desc {
  font-size: 1.8rem;
}

.text--black {
  color: #252525;
}

.text--m-black {
  font-weight: 500;
  color: #252525;
}

.text--b-black {
  font-weight: 600;
  color: #252525;
}

.text--red {
  font-weight: 400;
  color: #FF3B30;
}

.text--m-red {
  font-weight: 500;
  color: #FF3B30;
}

.text--b-red {
  font-weight: 600;
  color: #FF3B30;
}

.text--blue {
  font-weight: 400;
  color: #1d47da;
}

.text--m-blue {
  font-weight: 500;
  color: #1d47da;
}

.text--b-blue {
  font-weight: 600;
  color: #1d47da;
}

.must-desc {
  padding: 0 0 1.2rem;
  color: #555;
  text-align: right;
}

.title-1 + .must-desc {
  margin: -4.4rem 0 0;
  padding: 0 0 1.6rem;
}

.must-text {
  color: #FF3B30;
  font-weight: 600;
}

.must-ico {
  font-size: 0;
}
.must-ico::before {
  display: inline;
  content: "*";
  font-size: 2rem;
  font-weight: 600;
  color: #FF3B30;
}

.form-cmt {
  padding: 0.8rem 0 0;
  color: #777;
  font-weight: 500;
}

.form-cmt--1 {
  color: #1d47da;
}

.form-cmt--2 {
  color: #FF3B30;
}

.no-data {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 7rem 2rem;
  box-sizing: border-box;
  background-color: #F4F4F4;
}
.no-data p {
  color: #555;
  text-align: center;
  font-weight: 500;
}

.table .td-no-data {
  padding: 7rem 2rem;
  text-align: center;
  font-weight: 500;
  background-color: #F4F4F4;
  color: #555;
}

.link-text {
  padding: 0 0 0 2rem;
  color: var(--primary-color);
  font-weight: 500;
  position: relative;
}
.link-text::before {
  display: inline-block;
  content: "";
  width: 1.8rem;
  height: 1.8rem;
  position: absolute;
  left: 0;
  top: 0.2rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(31,54,169,1)'%3E%3Cpath d='M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z'%3E%3C/path%3E%3C/svg%3E");
}
.link-text:hover {
  text-decoration: underline;
}

@media screen and (max-width: 768px) {
  .badge-box {
    gap: 0.4rem;
  }
  .badge-status {
    padding: 0.8rem 1.2rem;
  }
  .badge-new {
    width: 2rem;
    height: 2rem;
  }
  .btn--lg {
    height: 4rem;
    font-size: 1.6rem;
  }
  .title-1 {
    font-size: 2rem;
  }
  .title-1--deco {
    padding: 0 0 1.6rem 2.2rem;
    background-position: left top 0.7rem;
    background-size: 1.4rem;
  }
  .content-desc {
    font-size: 1.6rem;
  }
}
.search-wrap {
  margin: 0 0 4rem;
  border-radius: 1.6rem;
  overflow: hidden;
}

.search-container {
  display: flex;
  flex-direction: column;
}

.search-area {
  display: flex;
  width: 100%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;
  order: 1;
  padding: 4rem 3rem;
  box-sizing: border-box;
  background-color: var(--primary-light);
}

.search-box {
  display: flex;
  max-width: 74rem;
  width: 100%;
  height: 6.8rem;
  box-sizing: border-box;
  position: relative;
  border-radius: 10rem;
  border: solid 3px var(--primary-color);
  background-color: #fff;
}

.search-select-box {
  height: 100%;
}

.search-select {
  width: 100%;
  height: 100%;
  padding: 0 5.4rem 0 2rem;
  border-radius: 10rem 0 0 10rem;
  border: 0 none;
  background-color: transparent;
  font-size: 1.8rem;
  font-weight: 500;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(31,54,169,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center right 1.4rem;
  background-size: 2rem auto;
  cursor: pointer;
}
.search-select::-ms-expand {
  display: none;
}

.search-input-box {
  flex: 1;
  height: 100%;
  position: relative;
}
.search-input-box::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 2rem;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: #c1c8d0;
}

.search-input[type=text] {
  width: 100%;
  height: 100%;
  padding: 0 8.5rem 0 2rem;
  border-radius: 0 10rem 10rem 0;
  border: 0 none;
  background-color: transparent;
  font-size: 1.8rem;
}

.search-area .btn--ico-search {
  min-width: initial;
  width: 6.2rem;
  min-height: inherit;
  height: 6.2rem;
  gap: 0;
  border-radius: 50%;
  border: 0 none;
  font-size: 0;
  position: absolute;
  right: -0.3rem;
  top: 50%;
  transform: translateY(-50%);
}
.search-area .btn--ico-search::before {
  width: 2.8rem;
  height: 2.8rem;
}

.search-acc-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  width: 100%;
  height: 5rem;
  order: 2;
  color: #555;
  background-color: #E6EBF0;
  font-size: 1.8rem;
  font-weight: 600;
}
.search-acc-btn::after {
  display: inline-block;
  content: "";
  width: 1.3rem;
  height: 0.8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/search_detail_open_icon.svg");
}
.search-acc-btn.is-active::after {
  transform: rotate(180deg);
}
.search-acc-btn:hover, .search-acc-btn:focus-visible {
  background-color: #e0e5ec;
}

.search-detail-wrap {
  width: 100%;
  order: 3;
  box-sizing: border-box;
  border-radius: 0 0 1.6rem 1.6rem;
  border: solid 1px #e1e7ec;
}

.search-detail-area {
  display: flex;
  flex-flow: row wrap;
}

.search-detail-item {
  display: flex;
  flex: 1 1 50%;
  align-items: center;
  padding: 2.8rem 3rem;
  box-sizing: border-box;
  border-bottom: solid 1px #e1e7ec;
}

.search-detail-title {
  width: 9rem;
  font-size: 1.8rem;
  font-weight: 600;
}

.search-detail-value {
  width: calc(100% - 9rem);
}

.search-detail__input[type=text] {
  width: 100%;
  height: 4.8rem;
}

.search-detail-item .chk-label {
  font-size: 1.6rem;
}

.search-detail__select {
  width: 100%;
  height: 4.8rem;
}

.search-detail-value .due-date-input {
  height: 4.8rem;
}

.search-detail-wrap .btn-container {
  padding: 3rem 3rem;
}

.search-detail-btn--reset {
  background-color: #555;
}
.search-detail-btn--reset::before {
  background-image: url("../images/search_btn_reset_icon.svg");
}
.search-detail-btn--reset:hover, .search-detail-btn--reset:focus-visible {
  background-color: #444;
}

.search-detail-btn--search {
  background-color: var(--primary-color);
}
.search-detail-btn--search::before {
  background-image: url("../images/search_btn_icon.svg");
}
.search-detail-btn--search:hover, .search-detail-btn--search:focus-visible {
  background-color: var(--primary-hover);
}

.search-check-box {
  display: flex;
  max-width: 74rem;
  width: 100%;
  align-items: flex-start;
}
.search-check-box .chk-container {
  gap: 1.6rem;
}
.search-check-box .chk-input {
  top: 0.1rem;
}
.search-check-box .chk-label {
  color: #444;
  font-size: 1.8rem;
  font-weight: 400;
}

.search-check-title {
  width: 12rem;
  padding: 0 0 0 2.4rem;
  box-sizing: border-box;
  color: var(--primary-color);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 1.8rem auto;
  font-size: 1.8rem;
  font-weight: 600;
  white-space: nowrap;
}
.search-check-title--lib {
  background-image: url("../images/lib_select_title_deco.svg");
}

.popular-keyword-box {
  display: flex;
  max-width: 74rem;
  width: 100%;
  align-items: flex-start;
}

.popular-keyword-title {
  width: 12rem;
  padding: 0 0 0 2rem;
  box-sizing: border-box;
  color: var(--primary-color);
  background-repeat: no-repeat;
  background-position: left center;
  background-image: url("../images/popular_keyword_title_deco.svg");
  font-size: 1.8rem;
  font-weight: 600;
  white-space: nowrap;
}

.popular-keyword-list {
  display: flex;
  flex-flow: row wrap;
  gap: 1.6rem;
}

.popular-keyword-link {
  color: #555;
  font-size: 1.8rem;
}
.popular-keyword-link:hover, .popular-keyword-link:focus-visible {
  color: #252525;
  font-weight: 500;
}

.result-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 0 0 2rem;
}

.result-info {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.result-count {
  font-size: 1.8rem;
  color: #555;
}
.result-count__current {
  color: var(--primary-color);
  font-weight: 700;
}

.result-sort {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

@media screen and (max-width: 768px) {
  .search-wrap {
    border-radius: 0.8rem;
  }
  .search-area {
    gap: 2rem;
    padding: 2rem 1.6rem;
  }
  .search-box {
    height: 4.8rem;
  }
  .search-select {
    display: none;
  }
  .search-input-box::before {
    display: none;
  }
  .search-input[type=text] {
    border-radius: 10rem;
    font-size: 1.4rem;
  }
  .search-area .btn--ico-search {
    width: 4.8rem;
    height: 4.8rem;
  }
  .search-area .btn--ico-search::before {
    width: 2.2rem;
    height: 2.2rem;
  }
  .search-check-box {
    flex-direction: column;
    gap: 1rem;
  }
  .search-check-box .chk-container {
    gap: 0.8rem;
  }
  .search-check-box .chk-box {
    padding: 0 0 0 2.2rem;
  }
  .search-check-box .chk-input {
    top: 0;
  }
  .search-check-box .chk-label {
    font-size: 1.4rem;
  }
  .search-check-title {
    width: 100%;
    padding: 0 0 0 2rem;
    background-position: left top 0.35rem;
    background-size: 1.4rem;
    font-size: 1.6rem;
  }
  .popular-keyword-box {
    flex-direction: column;
    gap: 1rem;
  }
  .popular-keyword-title {
    width: 100%;
    padding: 0 0 0 2rem;
    background-position: left top 0.35rem;
    background-size: 1.4rem;
    font-size: 1.6rem;
  }
  .popular-keyword-list {
    gap: 0.8rem;
  }
  .popular-keyword-link {
    font-size: 1.4rem;
  }
  .search-acc-btn {
    height: 3.6rem;
    font-size: 1.4rem;
  }
  .search-acc-btn::after {
    width: 1rem;
    height: 0.8rem;
  }
  .search-detail-item {
    flex: 1 1 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.2rem;
    padding: 1.6rem 1.6rem;
  }
  .search-detail-title {
    font-size: 1.5rem;
  }
  .search-detail-value {
    width: 100%;
  }
  .search-detail__input[type=text] {
    height: 4.2rem;
  }
  .search-detail-value .due-date-input {
    height: 4.2rem;
  }
  .search-detail-item .chk-label {
    font-size: 1.5rem;
  }
  .search-detail-wrap .btn-container {
    padding: 2.4rem 1.6rem;
  }
  .search-detail-wrap .btn-container .btn {
    flex: 1;
    min-width: auto;
  }
  .result-header {
    padding: 0 0 1.2rem;
  }
  .result-count {
    font-size: 1.4rem;
  }
  .result-select--2 {
    display: none;
  }
}
.book-container {
  display: flex;
  gap: 4rem;
}

.book-side-area {
  display: flex;
  flex: 0 0 20rem;
  flex-direction: column;
  gap: 2.4rem;
}

.book-side-item {
  padding: 0 0 2.4rem;
  position: relative;
  border-bottom: solid 1px #dbdbdb;
}

.book-side-title {
  font-size: 1.8rem;
  font-weight: 600;
}

.book-side-sub.on {
  padding: 1.6rem 0 0;
}

.book-side-btn {
  display: block;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  border: solid 1px #e1e7ec;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z'%3E%3C/path%3E%3C/svg%3E");
  font-size: 0;
  position: absolute;
  top: 0;
  right: 0;
}
.book-side-btn:hover, .book-side-btn:focus-visible {
  background-color: #f2f2f2;
}
.book-side-btn.is-active {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(0,0,0,1)'%3E%3Cpath d='M5 11V13H19V11H5Z'%3E%3C/path%3E%3C/svg%3E");
}

.book-side-sub {
  display: flex;
  padding: 1.6rem 0 0;
}

.book-side-list {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.book-side-list .no-data {
  margin: 1.6rem 0 0;
}

.book-side-keyword {
  display: flex;
  gap: 0.6rem;
  text-align: left;
  font-size: 1.5rem;
  color: #3d3d3d;
}
.book-side-keyword__label {
  word-break: break-all;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.book-side-keyword__count {
  flex: none;
}
.book-side-keyword:hover, .book-side-keyword:focus-visible {
  font-weight: 600;
  text-decoration: underline;
}

.book-side-keyword.is-active {
  color: var(--primary-color);
  font-weight: 600;
}
.book-side-keyword.is-active:hover, .book-side-keyword.is-active:focus-visible {
  color: var(--primary-hover);
}

.book-wrap .result-area {
  flex: 1;
}

.book-list {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  padding: 2.4rem 0 0;
  border-top: solid 2px #000;
}

.book-item {
  display: flex;
  gap: 2.8rem;
  padding: 0 0 2.4rem;
  border-bottom: solid 1px #c1c8d0;
}

.book-cover {
  width: 16rem;
  height: 23rem;
  box-sizing: border-box;
  border-radius: 0.6rem;
  border: solid 1px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.book-cover__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.book-cover:hover .book-cover__img {
  transform: scale(1.05);
}

.book-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.6rem;
}

.book-title {
  font-size: 2.4rem;
  font-weight: 600;
}
.book-title:hover {
  text-decoration: underline;
}

.book-desc-box {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.book-desc {
  display: flex;
  gap: 1rem 0;
}

.book-desc__title {
  width: 8.5rem;
  color: #3d3d3d;
  font-weight: 500;
}

.book-desc__value {
  flex: 1;
  color: #555;
}

.book-item .btn-container {
  flex-direction: column;
  gap: 0.8rem;
  padding: 0;
}

.book-detail-area {
  display: flex;
  align-items: flex-start;
  gap: 4rem;
}

.book-detail-cover {
  width: 22.4rem;
  height: 32rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 1rem;
  border: solid 1px #dbdbdb;
}

.book-detail-cover__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.book-detail-info {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.book-detail-info .badge-status--1 {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
}

.book-detail-info .badge-status--2 {
  background-color: var(--tertiary-color);
  border-color: var(--tertiary-color);
}

.book-detail-title {
  padding: 2rem 0 0;
  font-size: 2.4rem;
  font-weight: 600;
}

.book-detail-desc-box {
  display: flex;
  align-items: center;
  gap: 0.8rem 1.2rem;
  padding: 0.8rem 0 0;
}

.book-detail-desc:nth-of-type(n+2) {
  padding: 0 0 0 1.3rem;
  position: relative;
}
.book-detail-desc:nth-of-type(n+2)::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1.2rem;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: #c1c8d0;
}

.book-detail-wrap .content-box {
  padding: 4rem 0 0;
}

.book-detail-desc__title {
  position: fixed;
  left: -99999px;
  top: -99999px;
}

.book-detail-desc__value {
  color: #555;
}

.book-detail-data-box {
  display: flex;
  flex-flow: row wrap;
  gap: 1rem 2rem;
  padding: 2rem 0 0;
}

.book-detail-data {
  display: flex;
  width: 50%;
  align-items: flex-start;
}
.book-detail-data:nth-of-type(odd) {
  width: 25rem;
}
.book-detail-data:nth-of-type(even) {
  width: calc(100% - 25rem - 2rem);
}
.book-detail-data:last-of-type {
  width: 100%;
}

.book-detail-data__title {
  width: 7rem;
  color: #3d3d3d;
  font-weight: 500;
}

.book-detail-data__value {
  flex: 1;
  color: #555;
}

.book-detail-area .btn-container {
  justify-content: flex-start;
  padding: 2rem 0 0;
}

@media screen and (max-width: 768px) {
  .book-side-area {
    display: none;
  }
  .book-list {
    border-top: solid 1px #c1c8d0;
  }
  .book-item {
    flex-flow: row wrap;
    align-items: flex-start;
    gap: 1.6rem 1.6rem;
    position: relative;
  }
  .book-item:last-of-type {
    padding: 0;
    border-bottom: 0 none;
  }
  .book-cover {
    width: 8rem;
    height: 11.5rem;
    margin: 0 0 4.2rem;
  }
  .book-info {
    gap: 1.2rem;
  }
  .book-item .badge-box {
    position: absolute;
    left: 0;
    top: 12.7rem;
  }
  .book-item .badge-status {
    width: 8rem;
  }
  .book-title {
    font-size: 1.8rem;
  }
  .book-desc__title {
    width: 6rem;
  }
  .book-item .btn-container {
    width: 100%;
  }
  .book-item .btn-container .btn {
    width: 100%;
  }
  .book-item .btn-container:not(:has(*)) {
    display: none;
  }
  .book-detail-area {
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
  }
  .book-detail-cover {
    width: 18rem;
    height: auto;
    aspect-ratio: 180/260;
  }
  .book-detail-title {
    padding: 1.2rem 0 0;
    font-size: 1.8rem;
  }
  .book-detail-info {
    width: 100%;
    align-items: center;
  }
  .book-detail-desc-box {
    width: 100%;
    flex-flow: row wrap;
    justify-content: center;
    padding: 1.2rem 0 0;
  }
  .book-detail-data-box {
    width: 100%;
    padding: 2rem 0 0;
    margin: 2rem 0 0;
    border-top: solid 1px #c1c8d0;
  }
  .book-detail-data:nth-of-type(odd),
  .book-detail-data:nth-of-type(even) {
    width: 100%;
  }
  .book-detail-area .btn-container {
    width: 100%;
  }
  .book-detail-area .btn-container .btn {
    width: 100%;
  }
}
.table--bbs th,
.table--bbs td {
  padding: 1.8rem 1.2rem;
  border-left: 0 none;
  border-right: 0 none;
  font-size: 1.8rem;
}
.table--bbs th {
  text-align: center;
}
.table--bbs td {
  text-align: center;
}

.table--apply th,
.table--apply td {
  border-left: 0 none;
  border-right: 0 none;
}
.table--apply th {
  text-align: center;
}
.table--apply td {
  text-align: center;
}

.table--mypage th,
.table--mypage td {
  border-left: 0 none;
  border-right: 0 none;
}
.table--mypage th {
  text-align: center;
}
.table--mypage td {
  text-align: center;
}
.table--mypage .td-title {
  text-align: left;
}

.card-list {
  display: flex;
  flex-flow: row wrap;
  gap: 3rem;
}

.card-item {
  width: calc(20% - 2.4rem);
  position: relative;
}

.card-thumb {
  display: block;
  width: 100%;
  height: 18rem;
  aspect-ratio: 260/180;
  border-radius: 0.8rem;
  border: solid 1px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.card-thumb__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: all 0.3s ease;
}

.card-thumb:hover .card-thumb__img {
  transform: scale(1.05);
}

.card-info {
  padding: 1.2rem 0 0;
}

.card .badge-container {
  position: absolute;
  left: 1rem;
  top: 1rem;
}

.card-title {
  font-size: 1.8rem;
  font-weight: 600;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-inline-box;
}
.card-title:hover {
  text-decoration: underline;
}

.card-meta-box {
  display: flex;
  flex-flow: row wrap;
  gap: 0.8rem;
  padding: 0.4rem 0 0;
}

.card-meta + .card-meta {
  padding: 0 0 0 0.9rem;
  position: relative;
}
.card-meta + .card-meta::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1.1rem;
  background-color: #dbdbdb;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.card-meta__title {
  position: fixed;
  left: -99999px;
  top: -99999px;
}

.card-meta__value {
  color: #555;
  font-size: 1.4rem;
  font-weight: 400;
}

.bbs-search-area {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  padding: 1.6rem 3.2rem;
  margin: 0 0 4rem;
  border-radius: 1.6rem;
  background-color: var(--primary-light);
}
.bbs-search-area--wide {
  gap: 2rem;
}

.bbs-search-box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0.8rem;
}

.bbs-search-select-box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0.8rem;
}

.bbs-search-input-box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0.8rem;
}

.bbs-search-area .btn-container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0.8rem;
}

.bbs-search-area .btn {
  border-radius: 0.6rem;
}

.bbs-search-title {
  font-size: 1.8rem;
  font-weight: 600;
}

.bbs-search-select {
  height: 4.8rem;
}

.bbs-search-input[type=text] {
  width: 59rem;
  height: 4.8rem;
}

.bbs-search-radio-box {
  display: flex;
}

.bbs-search-radio-label {
  display: flex;
  height: 4.8rem;
  align-items: center;
  justify-content: center;
  padding: 0 1.6rem;
  box-sizing: border-box;
  color: #555;
  border: solid 1px #c1c8d0;
  background-color: #fff;
  transition: all 0.3s ease;
}
.bbs-search-radio-label:nth-of-type(n + 2) {
  margin: 0 0 0 -0.1rem;
}
.bbs-search-radio-label:first-of-type {
  border-radius: 0.6rem 0 0 0.6rem;
}
.bbs-search-radio-label:last-of-type {
  border-radius: 0 0.6rem 0.6rem 0;
}
.bbs-search-radio-label:hover, .bbs-search-radio-label:focus-visible {
  color: #252525;
  background-color: #f2f2f2;
}

:checked + .bbs-search-radio-label {
  color: #fff;
  border-color: transparent;
  background-color: var(--primary-color);
  font-weight: 600;
  position: relative;
  z-index: 1;
}
:checked + .bbs-search-radio-label:hover, :checked + .bbs-search-radio-label:focus-visible {
  background-color: var(--primary-color);
}

.bbs-search-area .due-date-input {
  height: 4.8rem;
}

.bbs-search-area .btn-container {
  padding: 0;
}

.bbs-search-area .btn {
  display: flex;
  height: 4.8rem;
  gap: 0.8rem;
  box-sizing: border-box;
  font-size: 1.8rem;
}

.bbs-search-area .btn--ico-search {
  min-width: 14rem;
}

.table .badge-notice {
  margin: 0 auto;
}

.badge-file {
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
}

.table .badge-file {
  margin: 0 auto;
}

.badge-file--zip {
  background-image: url("../images/file_type_zip.svg");
}

.badge-file--hwp {
  background-image: url("../images/file_type_hwp.svg");
}

.badge-file--pdf {
  background-image: url("../images/file_type_pdf.svg");
}

.badge-file--ppt {
  background-image: url("../images/file_type_ppt.svg");
}

.badge-file--excel {
  background-image: url("../images/file_type_excel.svg");
}

.badge-file--word {
  background-image: url("../images/file_type_word.svg");
}

.badge-file--img {
  background-image: url("../images/file_type_img.svg");
}

.badge-file--audio {
  background-image: url("../images/file_type_audio.svg");
}

.badge-file--video {
  background-image: url("../images/file_type_video.svg");
}

.badge-file--download {
  background-image: url("../images/file_type_download.svg");
}

.badge-file--view,
.badge-file--preview {
  background-image: url("../images/file_type_view.svg");
}

.bbs-write-area {
  border-top: solid 2px #000;
}

.bbs-write__item {
  display: flex;
  padding: 0 2rem;
  border-bottom: solid 1px #c1c8d0;
}

.bbs-write__title {
  display: flex;
  width: 18rem;
  align-items: center;
  padding: 2rem 0;
  box-sizing: border-box;
  font-weight: 600;
}

.bbs-write__content {
  flex: 1;
  padding: 2rem 0;
}

.bbs-write__input {
  width: 100%;
}

.bbs-write__textarea {
  width: 100%;
  height: 40rem;
  resize: none;
}

.bbs-detail-area {
  border-top: solid 2px #000;
}

.bbs-detail-title {
  padding: 2rem 2rem;
  font-size: 2.6rem;
  font-weight: 600;
}

.bbs-detail-meta {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 2rem;
  padding: 2rem 2rem;
  border-top: solid 1px #dbdbdb;
}

.bbs-detail-meta-list {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  position: relative;
}

.bbs-detail-meta-list + .bbs-detail-meta-list {
  padding: 0 0 0 2.1rem;
}
.bbs-detail-meta-list + .bbs-detail-meta-list::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1.4rem;
  background-color: #dbdbdb;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.bbs-detail-meta-title {
  width: 1.8rem;
  height: 1.8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
}

.bbs-detail-meta-title--writer {
  background-image: url("../images/board_writer_icon.svg");
}

.bbs-detail-meta-title--view {
  background-image: url("../images/board_view_icon.svg");
}

.bbs-detail-meta-title--date {
  background-image: url("../images/board_date_icon.svg");
}

.bbs-detail-meta-value {
  color: #555;
  line-height: 1;
}

.bbs-detail-content {
  padding: 3rem 2rem;
  border-top: solid 1px #dbdbdb;
}

.file-list-area {
  width: 100%;
  padding: 2rem 2rem;
  box-sizing: border-box;
  border-top: solid 1px #dbdbdb;
  background-color: #F4F4F4;
}

.file-list__title {
  padding: 0 0 0.8rem;
  font-size: 1.8rem;
  font-weight: 600;
}

.file-list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.file-list__item {
  display: flex;
  width: 100%;
  height: 4rem;
  background-color: #fff;
  border: solid 1px #dbdbdb;
}

.file-list__link {
  display: flex;
  flex: 1;
  height: 100%;
  align-items: center;
}

.file-list .badge-file {
  width: 4rem;
  height: 100%;
  background-size: 2rem auto;
}

.file-list__name {
  display: flex;
  flex: 1;
  height: 100%;
  align-items: center;
  padding: 0 1.2rem;
  box-sizing: border-box;
  border-left: solid 1px #dbdbdb;
  color: #555;
  font-weight: 500;
}

.file-list__name-text {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  word-break: break-all;
}

.file-list__link:hover .file-list__name {
  color: #0091e7;
}

.file-list .badge-file--download {
  width: 4rem;
  height: 100%;
  box-sizing: border-box;
  border-left: solid 1px #dbdbdb;
}
.file-list .badge-file--download:hover {
  background-color: #f2f2f2;
}

.file-list .badge-file--preview {
  width: 4rem;
  height: 100%;
  box-sizing: border-box;
  border-left: solid 1px #dbdbdb;
}
.file-list .badge-file--preview:hover {
  background-color: #f2f2f2;
}

.bbs-detail-area--answer {
  padding: 2.8rem 2.8rem;
  margin: 3rem 0 0;
  position: relative;
  border: dashed 1px #dbdbdb;
}
.bbs-detail-area--answer .bbs-detail-title {
  padding: 0 0 2.8rem;
}
.bbs-detail-area--answer .bbs-detail-meta {
  padding: 2rem 0;
}
.bbs-detail-area--answer .bbs-detail-content {
  padding: 3rem 0;
}

.page-navi-area {
  display: flex;
  flex-direction: column;
  margin: 4rem 0 0;
  border-top: solid 1px #dbdbdb;
}

.page-navi {
  display: flex;
  width: 100%;
  align-items: center;
  border-bottom: solid 1px #dbdbdb;
}

.page-navi__title {
  padding: 2rem 1.2rem 2rem 4rem;
  background-repeat: no-repeat;
  background-position: left 1.2rem center;
  font-weight: 600;
}

.page-navi__title--next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z'%3E%3C/path%3E%3C/svg%3E");
}

.page-navi__title--prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
}

.page-navi__value {
  flex: 1;
  padding: 2rem 1.2rem;
}

.page-navi__link {
  color: #555;
  font-weight: 500;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.page-navi__link:hover, .page-navi__link:focus-visible {
  color: #0091e7;
}

.page-navi__link--none {
  color: #999;
}
.page-navi__link--none:hover, .page-navi__link--none:focus-visible {
  color: #999;
}

@media screen and (max-width: 1024px) {
  .bbs-search-area {
    padding: 1.6rem 1.6rem;
    gap: 0.6rem;
    border-radius: 0.8rem;
  }
  .bbs-search-box {
    flex: 1 1 100%;
    gap: 0.6rem;
  }
  .bbs-search-select {
    flex: 1;
  }
  .bbs-search-title {
    position: fixed;
    left: -99999px;
    top: -99999px;
  }
  .bbs-search-input-box {
    flex: 1 1 100%;
    gap: 0.6rem;
    position: relative;
  }
  .bbs-search-select {
    height: 4.2rem;
    font-size: 1.4rem;
  }
  .bbs-search-input[type=text] {
    flex: 1;
    width: auto;
    height: 4.2rem;
    padding: 0 4.2rem 0 1rem;
    font-size: 1.4rem;
  }
  .bbs-search-area .btn--ico-search {
    width: 100%;
    height: 4.2rem;
    font-size: 1.6rem;
  }
  .bbs-search-input-box .btn--ico-search {
    min-width: auto;
    width: 4.2rem;
    min-height: auto;
    height: 4.2rem;
    gap: 0;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 0;
    border: 0 none;
    background-color: transparent;
    font-size: 0;
  }
  .bbs-search-input-box .btn--ico-search::before {
    width: 2rem;
    height: 2rem;
    background-image: url("../images/search_icon.svg");
  }
  .bbs-search-input-box .btn--ico-search:hover, .bbs-search-input-box .btn--ico-search:focus-visible {
    background-color: transparent;
  }
  .bbs-search-input-box .btn--ico-search:hover::before, .bbs-search-input-box .btn--ico-search:focus-visible::before {
    background-image: url("../images/search_hover_icon.svg");
  }
  .bbs-search-radio-box {
    flex: 1;
  }
  .bbs-search-area .due-date-box {
    flex: 1 1 100%;
  }
  .bbs-search-area .due-date-input {
    height: 4.2rem;
    font-size: 1.4rem;
  }
  .bbs-search-radio-label {
    flex: 1 1 auto;
    height: 4.2rem;
    font-size: 1.4rem;
  }
  .card-item {
    width: calc(50% - 1.5rem);
  }
  .card-thumb {
    height: auto;
  }
}
@media screen and (max-width: 768px) {
  .table--bbs th,
  .table--bbs td {
    padding: 1.2rem 1rem;
    font-size: 1.4rem;
  }
  .table--bbs .th-datem,
  .table--bbs .td-date {
    width: 10rem;
  }
  .table--bbs tr:has(.badge-notice) td {
    background-color: var(--primary-light);
  }
  colgroup {
    display: none;
  }
  .card-item {
    width: 100%;
  }
  .bbs-detail-title {
    padding: 1.6rem 0;
    font-size: 1.8rem;
  }
  .bbs-detail-meta {
    gap: 1.2rem 1.2rem;
    padding: 1.6rem 0;
  }
  .bbs-detail-meta-list + .bbs-detail-meta-list {
    padding: 0 0 0 1.3rem;
  }
  .bbs-detail-meta-title {
    width: 1.6rem;
    height: 1.6rem;
  }
  .bbs-detail-content {
    padding: 2.4rem 0;
  }
  .file-list-area {
    padding: 1.6rem 1.6rem;
  }
  .page-navi {
    align-items: initial;
  }
  .page-navi__title {
    position: fixed;
    left: -99999px;
    top: -99999px;
  }
  .page-navi__value {
    padding: 1.6rem 0;
  }
  .page-navi__value .page-navi__link {
    padding: 0 0 0 2.4rem;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .page-navi__value--next .page-navi__link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z'%3E%3C/path%3E%3C/svg%3E");
  }
  .page-navi__value--prev .page-navi__link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  }
}
.lecture-list {
  display: flex;
  flex-flow: row wrap;
  gap: 3rem;
}

.lecture-item {
  width: calc(33.3333333333% - 2rem);
  box-sizing: border-box;
  border-radius: 1.6rem;
  border: 1px solid #e1e7ec;
  position: relative;
}
.lecture-item::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 1.6rem;
  padding: 6px;
  opacity: 0;
  background: var(--grdientC01);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  pointer-events: none;
  transition: all 0.3s ease;
}
.lecture-item:hover {
  border-color: transparent;
}
.lecture-item:hover::before {
  opacity: 1;
}

.lecture-item--with-thumb {
  display: flex;
  flex-direction: column;
}
.lecture-item--with-thumb .lecture-top {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  flex: 1;
}
.lecture-item--with-thumb .lecture-info {
  flex: 1;
  min-width: 0;
}
.lecture-item--with-thumb .lecture-status-area {
  border-top: solid 1px #e1e7ec;
}

.lecture-thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  width: 12rem;
  height: 16rem;
  margin: 2rem 2rem 2rem 0;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 0.8rem;
  background-color: #f5f5f5;
}

.lecture-thumbnail__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: all 0.3s ease;
}

.lecture-thumbnail:hover .lecture-thumbnail__img {
  transform: scale(1.05);
}

.lecture-info {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 2.4rem 2.4rem;
}

.lecture-title {
  font-size: 2rem;
  font-weight: 600;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.lecture-title:hover {
  text-decoration: underline;
}

.lecture-desc-box {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.lecture-desc {
  display: flex;
}

.lecture-desc__title {
  width: 7rem;
  font-size: 1.5rem;
  color: #3d3d3d;
  font-weight: 500;
}

.lecture-desc__value {
  flex: 1;
  font-size: 1.5rem;
  color: #555;
}

.lecture-status-area {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  padding: 2.4rem 2.4rem;
  border-top: solid 1px #e1e7ec;
}

.lecture-status {
  display: flex;
  gap: 0.8rem;
  position: relative;
  white-space: nowrap;
}

.lecture-status + .lecture-status {
  padding: 0 0 0 1.3rem;
}
.lecture-status + .lecture-status::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1.2rem;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: #d9d9d9;
}

.lecture-status__title {
  color: #3d3d3d;
  font-size: 1.8rem;
}

.lecture-status__value {
  color: var(--primary-color);
  font-size: 1.8rem;
  font-weight: 600;
}

.pro-list {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  padding: 2.4rem 0 0;
  border-top: solid 1px #c1c8d0;
}

.pro-item {
  display: flex;
  gap: 2.8rem;
  padding: 0 0 2.4rem;
  border-bottom: solid 1px #c1c8d0;
}

.pro-poster {
  width: 14rem;
  height: 20rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 1rem;
  border: solid 1px #c1c8d0;
}

.pro-poster__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.pro-poster:hover .pro-poster__img {
  transform: scale(1.05);
}

.pro-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}

.pro-title {
  font-size: 2.4rem;
  font-weight: 600;
}
.pro-title:hover, .pro-title:focus-visible {
  text-decoration: underline;
}

.pro-desc-box {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.pro-desc {
  display: flex;
  align-items: flex-start;
}

.pro-desc__title {
  width: 7rem;
  color: #3d3d3d;
  font-weight: 500;
}

.pro-desc__value {
  display: flex;
  flex: 1;
  flex-flow: row wrap;
  gap: 0.4rem 0.8rem;
  color: #555;
}

.pro-situation-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}

.pro-item .btn-container {
  padding: 0;
}

.pro-detail-area {
  display: flex;
  align-items: flex-start;
  gap: 4rem;
}

.pro-detail-poster {
  width: 28rem;
  height: 40rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 1rem;
  border: solid 1px #dbdbdb;
}

.pro-detail-poster__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pro-detail-poster__img.jsImagePopup {
  cursor: pointer;
  transition: all 0.3s ease;
}
.pro-detail-poster__img.jsImagePopup:hover {
  transform: scale(1.02);
  opacity: 0.9;
}

.pro-detail-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-end;
  border-bottom: solid 1px #dbdbdb;
}

.pro-detail-info-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 2.8rem;
  padding: 0 18rem 0 0;
  box-sizing: border-box;
  position: relative;
}

.pro-detail-title {
  font-size: 2.4rem;
  font-weight: 600;
}

.pro-detail-desc-box {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.pro-detail-desc {
  display: flex;
  align-items: flex-start;
}

.pro-detail-desc__title {
  width: 8.4rem;
  color: #3d3d3d;
  font-weight: 500;
}

.pro-detail-desc__value {
  display: flex;
  flex: 1;
  gap: 0.4rem 0.8rem;
  color: #555;
}

.pro-detail-info .btn-container {
  padding: 0;
  position: absolute;
  bottom: 0;
  right: 0;
}

.pro-detail-content {
  width: 100%;
  padding: 4rem 0;
  margin: 4rem 0 0;
  border-top: solid 1px #dbdbdb;
}

.pro-detail-content__text {
  font-size: 1.8rem;
}

.pro-apply-info {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  padding: 2.4rem 2.4rem;
  border-radius: 1rem;
  background-color: var(--primary-light);
}

.pro-apply-info__item {
  display: flex;
  align-items: flex-start;
}

.pro-apply-info__title {
  width: 10rem;
  color: #3d3d3d;
  font-size: 1.8rem;
  font-weight: 500;
}

.pro-apply-info__value {
  flex: 1;
  color: #555;
  font-size: 1.8rem;
}

.space-list {
  display: flex;
  flex-flow: row wrap;
  gap: 3.2rem;
}

.space-item {
  display: flex;
  width: 100%;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  gap: 3.2rem;
  padding: 2.8rem 2.8rem;
  box-sizing: border-box;
  border-radius: 1.2rem;
  border: solid 1px #dbdbdb;
}

.space-img-box {
  width: 46rem;
  height: 30rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 0.4rem;
  border: solid 1px rgba(0, 0, 0, 0.05);
}
.space-img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.space-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 2.4rem;
}

.space-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
}

.space-title {
  font-size: 2.4rem;
  font-weight: 600;
}

.space-legend {
  display: flex;
  align-items: center;
  gap: 1.4rem;
}
.space-legend__item {
  font-size: 1.8rem;
  color: #555;
}
.space-legend__item + .space-legend__item {
  padding: 0 0 0 1.5rem;
  position: relative;
}
.space-legend__item + .space-legend__item::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1.4rem;
  background-color: #B3B3B3;
  position: absolute;
  left: 0;
  top: 0.6rem;
}

.space-desc-box {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.space-desc {
  display: flex;
  align-items: flex-start;
}

.space-desc__title {
  width: 10.4rem;
  padding: 0 0 0 2rem;
  box-sizing: border-box;
  position: relative;
  font-size: 1.8rem;
  font-weight: 600;
}
.space-desc__title::before {
  display: block;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background-color: #B6D002;
  position: absolute;
  left: 0;
  top: 0.8rem;
}

.space-desc__value {
  flex: 1;
  font-size: 1.8rem;
}

.table--space th,
.table--space td {
  padding: 1rem 1rem;
}

.space-item .btn-container {
  width: 100%;
  padding: 0;
}

.space-item .btn {
  width: 100%;
}

.space-list--2 .space-item {
  width: calc(50% - 1.6rem);
}
.space-list--2 .space-img-box {
  width: 30.6rem;
  height: 26rem;
}

.event-list {
  display: flex;
  flex-flow: row wrap;
  gap: 3rem;
}

.event-item {
  width: calc(20% - 2.4rem);
  position: relative;
}

.event-poster {
  display: block;
  width: 100%;
  aspect-ratio: 260/340;
  border-radius: 1rem;
  border: solid 1px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.event-poster__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: all 0.3s ease;
}

.event-poster:hover .event-poster__img {
  transform: scale(1.05);
}

.event-info {
  padding: 1.2rem 0 0;
}

.event-title {
  font-size: 1.8rem;
  font-weight: 600;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-inline-box;
}
.event-title:hover {
  text-decoration: underline;
}

.event-desc-box {
  display: flex;
  flex-flow: column;
  gap: 0.4rem;
  padding: 0.4rem 0 0;
}

.event-desc {
  display: flex;
  align-items: flex-start;
}

.event-desc__title {
  width: 6rem;
  color: #3d3d3d;
  font-size: 1.4rem;
  font-weight: 500;
}

.event-desc__value {
  flex: 1;
  color: #555;
  font-size: 1.4rem;
}

.club-detail-area {
  border-top: solid 2px #000;
  border-bottom: solid 1px #dbdbdb;
}

.club-detail-title {
  padding: 2.8rem 2.8rem;
  font-size: 2.4rem;
  font-weight: 600;
}

.club-detail-content {
  padding: 2.8rem 2.8rem;
  border-top: solid 1px #dbdbdb;
  background-color: #f4f4f4;
}

.club-detail-info-box {
  display: flex;
  flex-flow: row wrap;
  gap: 2rem 2rem;
}

.club-detail-info {
  display: flex;
  flex: 1 1 calc(33.3333333333% - 1.6rem);
}

.club-detail-info__title {
  width: 9.6rem;
  white-space: nowrap;
  font-size: 1.8rem;
  font-weight: 600;
}

.club-detail-info__value {
  flex: 1;
  font-size: 1.8rem;
}

.club-detail-area .btn-container {
  width: 100%;
  flex-direction: column;
}
.club-detail-area .btn-container .btn {
  width: 100%;
}

.facility-desc-area {
  padding: 2.8rem 2.8rem;
  border-top: solid 1px #dbdbdb;
}

.facility-desc-title {
  margin-bottom: 2rem;
  padding-bottom: 1.6rem;
  font-size: 2rem;
  font-weight: 600;
  border-bottom: 1px solid #dbdbdb;
}

.facility-desc-content {
  font-size: 1.6rem;
  line-height: 1.8;
}
.facility-desc-content img {
  max-width: 100%;
  height: auto;
}
.facility-desc-content figure {
  margin: 1.6rem 0;
}
.facility-desc-content figure img {
  display: block;
}
.facility-desc-content p {
  margin: 1rem 0;
}
.facility-desc-content ul, .facility-desc-content ol {
  margin: 1rem 0;
  padding-left: 2rem;
}
.facility-desc-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.6rem 0;
}
.facility-desc-content table td, .facility-desc-content table th {
  border: 1px solid #dbdbdb;
  padding: 0.8rem;
}

@media screen and (max-width: 1024px) {
  .event-item {
    width: calc(50% - 1.5rem);
  }
}
@media screen and (max-width: 768px) {
  .lecture-list {
    gap: 1.6rem;
  }
  .lecture-item {
    width: 100%;
  }
  .lecture-item--with-thumb {
    flex-direction: column;
  }
  .lecture-item--with-thumb .lecture-top {
    flex: 1;
  }
  .lecture-item--with-thumb .lecture-status-area {
    border-top: solid 1px #e1e7ec;
  }
  .lecture-thumbnail {
    width: 9rem;
    height: 12rem;
    margin: 1.6rem 1.6rem 1.6rem 0;
    border-radius: 0.6rem;
  }
  .lecture-info {
    gap: 1.6rem;
    padding: 1.6rem 1.6rem;
  }
  .lecture-title {
    font-size: 1.8rem;
  }
  .lecture-desc-box {
    gap: 0.4rem;
  }
  .lecture-status-area {
    gap: 0.8rem 0.8rem;
    padding: 1.6rem 1.6rem;
  }
  .lecture-status {
    gap: 0.4rem;
  }
  .lecture-status + .lecture-status {
    padding: 0 0 0 0.9rem;
  }
  .lecture-status__title {
    font-size: 1.6rem;
  }
  .lecture-status__value {
    font-size: 1.6rem;
  }
  .pro-apply-info {
    gap: 0.8rem;
    padding: 2rem 2rem;
  }
  .pro-apply-info__title {
    width: 8rem;
    font-size: 1.5rem;
  }
  .pro-apply-info__value {
    font-size: 1.5rem;
  }
  .pro-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.6rem;
  }
  .pro-poster {
    display: none;
  }
  .pro-info {
    gap: 1.6rem;
  }
  .pro-title {
    font-size: 1.8rem;
  }
  .pro-desc__title {
    width: 4.5rem;
  }
  .pro-item .btn-container {
    width: 100%;
  }
  .pro-item .btn-container .btn {
    flex: 1;
  }
  .pro-detail-area {
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
  }
  .pro-detail-poster {
    width: 18rem;
    height: 25.4rem;
  }
  .pro-detail-info {
    width: 100%;
  }
  .pro-detail-info-inner {
    gap: 1.6rem;
    padding: 0;
  }
  .pro-detail-title {
    text-align: center;
    font-size: 1.8rem;
  }
  .pro-detail-desc-box {
    padding: 2rem 0 0;
    gap: 0.6rem;
    border-top: solid 1px #c1c8d0;
  }
  .pro-detail-desc__title {
    width: 6rem;
  }
  .pro-detail-info .btn-container {
    width: 100%;
    position: static;
  }
  .pro-detail-info .btn-container .btn {
    width: 100%;
  }
  .pro-detail-content {
    padding: 2.4rem 0;
    margin: 2.4rem 0 0;
  }
  .pro-detail-content__text {
    font-size: 1.4rem;
  }
  .space-item {
    flex: 1 1 100%;
    padding: 1.6rem 1.6rem;
  }
  .space-img-box {
    width: 18rem;
    height: 15rem;
  }
  .space-info {
    gap: 1.6rem;
  }
  .space-title {
    font-size: 2rem;
  }
  .space-desc__title {
    width: 9rem;
    padding: 0 0 0 1.6rem;
    font-size: 1.6rem;
  }
  .space-desc__title::before {
    width: 0.6rem;
    height: 0.6rem;
    top: 0.6rem;
  }
  .space-desc__value {
    font-size: 1.6rem;
  }
  .event-item {
    width: 100%;
  }
}
.image-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 2rem;
  box-sizing: border-box;
}

.image-popup {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.image-popup__close {
  position: absolute;
  top: -4rem;
  right: 0;
  width: 3.6rem;
  height: 3.6rem;
  background: transparent;
  border: none;
  cursor: pointer;
  z-index: 10;
}
.image-popup__close::before, .image-popup__close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2.4rem;
  height: 0.3rem;
  background-color: #fff;
  border-radius: 0.2rem;
}
.image-popup__close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.image-popup__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.image-popup__close:hover::before, .image-popup__close:hover::after {
  background-color: var(--primary-color);
}

.image-popup__content {
  max-width: 100%;
  max-height: calc(90vh - 6rem);
  overflow: hidden;
  border-radius: 0.8rem;
  background-color: #fff;
}

.image-popup__img {
  display: block;
  max-width: 100%;
  max-height: calc(90vh - 6rem);
  object-fit: contain;
}

.image-popup__title {
  margin-top: 1.6rem;
  color: #fff;
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .image-popup__close {
    top: -3.5rem;
    width: 3rem;
    height: 3rem;
  }
  .image-popup__close::before, .image-popup__close::after {
    width: 2rem;
    height: 0.2rem;
  }
  .image-popup__title {
    font-size: 1.5rem;
  }
}
.cal-navi {
  padding: 0 0 2rem;
}
.cal-navi__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3.2rem;
}
.cal-navi__title {
  font-size: 2.8rem;
  font-weight: 600;
}
.cal-navi__btn {
  width: 4.8rem;
  height: 4.8rem;
  box-sizing: border-box;
  font-size: 0;
  border: 1px solid #dbdbdb;
  border-radius: 50%;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
}
.cal-navi__btn:hover {
  background-color: #f6f6f6;
}
.cal-navi__btn--prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='28' height='28' fill='rgba(51,154,255,1)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}
.cal-navi__btn--next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='28' height='28' fill='rgba(51,154,255,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}

.cal-legend {
  display: flex;
  justify-content: flex-end;
  padding: 0 0 2rem;
}
.cal-legend__inner {
  display: flex;
  align-items: center;
  gap: 1.6rem;
}
.cal-legend__item {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.cal-legend__item::before {
  display: flex;
  content: "";
  justify-content: center;
  align-items: center;
}
.cal-legend__item--today::before {
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background-color: #C4D9B7;
}
.cal-legend__item--pos::before {
  content: "가";
  width: 1.8rem;
  height: 1.8rem;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #fff;
  background-color: #2AB0F0;
}
.cal-legend__item--wait::before {
  content: "대";
  width: 1.8rem;
  height: 1.8rem;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #fff;
  background-color: #FF9500;
}
.cal-legend__item--neg::before {
  content: "마";
  width: 1.8rem;
  height: 1.8rem;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #fff;
  background-color: #EC3341;
}

.cal-wrap {
  border-top: solid 2px #000;
}

.cal-header {
  display: flex;
  border-bottom: solid 1px #dbdbdb;
}

.cal-week {
  display: flex;
  border-bottom: solid 1px #dbdbdb;
}

.cal-item {
  width: 14.2857142857%;
  box-sizing: border-box;
  border-right: solid 1px #dbdbdb;
}
.cal-item:last-of-type {
  border-right: 0 none;
}

.cal-header .cal-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem 1.4rem;
  background-color: #F4F4F4;
}

.cal-body .cal-item {
  display: flex;
  min-height: 12rem;
  flex-direction: column;
  padding: 1.4rem 1.4rem;
  background-color: #fff;
}

.cal-day {
  font-size: 1.8rem;
  font-weight: 500;
}
.cal-day--sat {
  color: #007AFF;
}
.cal-day--sun {
  color: #FF3B30;
}

.cal-date {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  font-size: 1.8rem;
  font-weight: 500;
}
.cal-date--sat {
  color: #007AFF;
}
.cal-date--sun {
  color: #FF3B30;
}

.cal-item--today .cal-date::before {
  display: block;
  content: "오늘";
  width: 1.2rem;
  height: 1.2rem;
  margin: 0 0.8rem 0 0;
  font-size: 0;
  border-radius: 50%;
  background-color: #C4D9B7;
}

.cal-item--sat .cal-day {
  color: #007AFF;
}
.cal-item--sat .cal-date {
  color: #007AFF;
}

.cal-item--sun .cal-day {
  color: #FF3B30;
}
.cal-item--sun .cal-date {
  color: #FF3B30;
}

.apply-list {
  display: flex;
  flex-direction: column;
}
.apply-list__hidden {
  display: flex;
  flex-direction: column;
}
.apply-list__more {
  margin-top: 0.4rem;
  padding: 0.4rem 0.8rem;
  font-size: 1.2rem;
  font-weight: 500;
  color: #666;
  background-color: #f5f5f5;
  border: 1px solid #ddd;
  border-radius: 0.4rem;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s ease;
}
.apply-list__more:hover {
  background-color: #e8e8e8;
  color: #333;
}

.apply-item {
  text-align: left;
  position: relative;
  padding: 0.4rem 0.4rem 0.4rem 2rem;
  border-radius: 0.4rem;
}
.apply-item__status {
  font-size: 0;
  position: absolute;
  left: 0;
  top: 0.6rem;
  transition: all 0.3s ease;
}
.apply-item__status::before {
  display: flex;
  width: 1.8rem;
  height: 1.8rem;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #fff;
}
.apply-item__title {
  font-size: 1.4rem;
  font-weight: 500;
  transition: all 0.3s ease;
}

.apply-item--pos .apply-item__status {
  background-color: #2AB0F0;
}
.apply-item--pos .apply-item__status::before {
  content: "가";
}
.apply-item--pos .apply-item__title {
  color: #2AB0F0;
}
.apply-item--pos:hover {
  background-color: #f6f6f6;
}
.apply-item--pos:hover .apply-item__status {
  background-color: #1170b3;
}
.apply-item--pos:hover .apply-item__title {
  color: #1170b3;
}
.apply-item--pos.is-active {
  padding: 0.4rem 0 0.4rem 2.6rem;
  background-color: #2AB0F0;
}
.apply-item--pos.is-active .apply-item__status::before {
  content: "선택됨";
  font-size: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(255,255,255,1)'%3E%3Cpath d='M9.9997 15.1709L19.1921 5.97852L20.6063 7.39273L9.9997 17.9993L3.63574 11.6354L5.04996 10.2212L9.9997 15.1709Z'%3E%3C/path%3E%3C/svg%3E");
}
.apply-item--pos.is-active .apply-item__title {
  font-weight: 600;
  color: #fff;
}
.apply-item--pos:hover.is-active {
  background-color: #2AB0F0;
}
.apply-item--pos:hover.is-active .apply-item__status {
  background-color: #2AB0F0;
}

.apply-item--neg .apply-item__status {
  background-color: #EC3341;
}
.apply-item--neg .apply-item__status::before {
  content: "마";
}
.apply-item--neg .apply-item__title {
  color: #EC3341;
}

.apply-item--wait .apply-item__status {
  background-color: #FF9500;
}
.apply-item--wait .apply-item__status::before {
  content: "대";
}
.apply-item--wait .apply-item__title {
  color: #FF9500;
}
.apply-item--wait:hover {
  background-color: #f6f6f6;
}
.apply-item--wait:hover .apply-item__status {
  background-color: #E68600;
}
.apply-item--wait:hover .apply-item__title {
  color: #E68600;
}

.cal-item .apply-item {
  padding: 0.4rem 0 0.4rem 2.6rem;
}

.cal-item .apply-item__status {
  left: 0.4rem;
}

.cal-legend__item--holiday::before {
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background-color: #EC3341;
}

.cal-legend__item--schedule::before {
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background-color: #FF9500;
}

.cal-legend__item--program::before {
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background-color: #2AB0F0;
}

.apply-item--schedule .apply-item__status {
  background-color: #FF9500;
}
.apply-item--schedule .apply-item__status::before {
  content: "일";
}
.apply-item--schedule .apply-item__title {
  color: #FF9500;
}

.apply-item--event .apply-item__status {
  background-color: #8E44AD;
}
.apply-item--event .apply-item__status::before {
  content: "행";
}
.apply-item--event .apply-item__title {
  color: #8E44AD;
}

.apply-item--more {
  padding: 0.4rem;
  font-size: 1.2rem;
  color: #666;
  text-align: center;
}

.cal-item--holiday {
  background-color: #FFF5F5;
}
.cal-item--holiday .cal-date {
  color: #EC3341;
}

.cal-item.is-selected {
  background-color: #E3F2FD;
  cursor: pointer;
}

.cal-body .cal-item {
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.cal-body .cal-item:hover:not(.cal-item--empty) {
  background-color: #f6f6f6;
}

.schedule-calendar-wrap {
  padding: 2rem 0;
}

.schedule-calendar {
  max-width: 140rem;
  margin: 0 auto;
}

.schedule-calendar__container {
  display: flex;
  gap: 3rem;
  align-items: stretch;
}

.schedule-calendar__left {
  flex: 1;
  min-width: 0;
}

.schedule-calendar__right {
  width: 36rem;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}

.cal-dots {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-right: 0.8rem;
}

.cal-dot {
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
}
.cal-dot--schedule {
  background-color: #FF9500;
}
.cal-dot--program {
  background-color: #2AB0F0;
}

.cal-item--has-event {
  cursor: pointer;
}

.schedule-calendar__events {
  padding: 2rem;
  background-color: #f9f9f9;
  border-radius: 0.8rem;
  height: 100%;
  max-height: calc(100vh - 20rem);
  overflow-y: auto;
  box-sizing: border-box;
}

.schedule-calendar__events-date {
  font-size: 1.8rem;
  font-weight: 600;
  margin-bottom: 1.6rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid #ddd;
}

.schedule-calendar__events-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.schedule-calendar__event-item {
  display: flex;
  flex-direction: column;
  padding: 1.6rem;
  background-color: #fff;
  border-radius: 0.8rem;
  border-left: 4px solid #ddd;
}
.schedule-calendar__event-item a {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  text-decoration: none;
  color: inherit;
}
.schedule-calendar__event-item--schedule {
  border-left-color: #FF9500;
}
.schedule-calendar__event-item--event {
  border-left-color: #8E44AD;
}
.schedule-calendar__event-item--program {
  border-left-color: #2AB0F0;
}

.schedule-calendar__event-type {
  display: inline-block;
  padding: 0.2rem 0.8rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  border-radius: 0.4rem;
  width: fit-content;
}
.schedule-calendar__event-item--schedule .schedule-calendar__event-type {
  background-color: #FF9500;
}
.schedule-calendar__event-item--event .schedule-calendar__event-type {
  background-color: #8E44AD;
}
.schedule-calendar__event-item--program .schedule-calendar__event-type {
  background-color: #2AB0F0;
}

.schedule-calendar__event-title {
  font-size: 1.6rem;
  font-weight: 500;
  margin-top: 0.4rem;
}

.schedule-calendar__event-place {
  font-size: 1.4rem;
  color: #666;
}

.schedule-calendar__event-period {
  font-size: 1.3rem;
  color: #666;
  margin-top: 0.4rem;
}
.schedule-calendar__event-period strong {
  color: #333;
  font-weight: 600;
  margin-right: 0.4rem;
}

.schedule-calendar__no-event {
  font-size: 1.6rem;
  color: #666;
  text-align: center;
  padding: 2rem;
}

.schedule-calendar__event-status {
  display: inline-block;
  padding: 0.3rem 0.8rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  border-radius: 0.4rem;
}
.schedule-calendar__event-status--recruiting {
  background-color: #2AB0F0;
}
.schedule-calendar__event-status--closed {
  background-color: #999;
}

.schedule-calendar__event-time {
  font-size: 1.3rem;
  color: #666;
  margin-top: 0.4rem;
}

.schedule-calendar__event-item--closed {
  opacity: 0.6;
  cursor: not-allowed;
}
.schedule-calendar__event-item--closed .schedule-calendar__event-title {
  color: #888;
}

.schedule-calendar__event-item--recruiting a:hover .schedule-calendar__event-status--recruiting {
  background-color: #1170b3;
}
.schedule-calendar__event-item--recruiting a:hover .schedule-calendar__event-title {
  color: #1170b3;
}

@media screen and (max-width: 768px) {
  .cal-navi__inner {
    justify-content: space-between;
  }
  .cal-navi__title {
    font-size: 2.4rem;
  }
  .cal-navi__btn {
    width: 3.2rem;
    height: 3.2rem;
    background-size: 2rem;
  }
  .cal-legend {
    padding: 0 0 1.2rem;
  }
  .cal-header .cal-item {
    padding: 0.8rem 0.4rem;
  }
  .cal-body .cal-item {
    min-height: 6rem;
    padding: 0.8rem 0.4rem;
  }
  .cal-date {
    font-size: 1.4rem;
  }
  .cal-day {
    font-size: 1.4rem;
  }
  .cal-item--today .cal-date::before {
    width: 0.8rem;
    height: 0.8rem;
    margin: 0 0.4rem 0 0;
  }
  .cal-dots {
    margin-right: 0.6rem;
    gap: 0.3rem;
  }
  .cal-dot {
    width: 0.8rem;
    height: 0.8rem;
  }
  .schedule-calendar-wrap {
    padding: 1rem 0;
  }
  .schedule-calendar {
    max-width: 100%;
  }
  .schedule-calendar__container {
    flex-direction: column;
    gap: 2rem;
  }
  .schedule-calendar__left {
    width: 100%;
  }
  .schedule-calendar__right {
    width: 100%;
    position: static;
  }
  .schedule-calendar__events {
    padding: 1.6rem;
    min-height: auto;
    max-height: none;
  }
  .schedule-calendar__events-date {
    font-size: 1.6rem;
    margin-bottom: 1.2rem;
  }
  .schedule-calendar__event-item {
    padding: 1.2rem;
  }
  .schedule-calendar__event-title {
    font-size: 1.4rem;
  }
  .schedule-calendar__event-place,
  .schedule-calendar__event-period,
  .schedule-calendar__event-time {
    font-size: 1.2rem;
  }
  .schedule-calendar__event-status {
    font-size: 1.1rem;
    padding: 0.2rem 0.6rem;
  }
  .cal-legend__inner {
    flex-wrap: wrap;
    gap: 1rem;
  }
  .cal-legend__item {
    font-size: 1.2rem;
  }
  .apply-item {
    padding: 0.3rem 0.3rem 0.3rem 1.6rem;
  }
  .apply-item__status {
    top: 0.4rem;
  }
  .apply-item__status::before {
    width: 1.4rem;
    height: 1.4rem;
    font-size: 1.1rem;
  }
  .apply-item__title {
    font-size: 1.1rem;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .cal-item .apply-item {
    padding: 0.3rem 0 0.3rem 1.8rem;
  }
  .cal-item .apply-item__status {
    left: 0.2rem;
  }
  .apply-list__more {
    font-size: 1.1rem;
    padding: 0.3rem 0.6rem;
  }
}
.login-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.login-form {
  display: flex;
  max-width: 480px;
  width: 100%;
  flex-direction: column;
  align-items: center;
  padding: 4rem 4rem;
  box-sizing: border-box;
  border-radius: 1rem;
  border: solid 1px #dbdbdb;
  background-color: #fff;
}

.login-title {
  font-size: 0;
  padding: 0 0 4rem;
}

.login-title__logo {
  width: 22rem;
}

.login-area {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 1.2rem;
}

.login-input-box {
  width: 100%;
}

.login-input[type=text],
.login-input[type=password] {
  width: 100%;
  height: 4.8rem;
}

.login-form .form-cmt {
  padding: 0;
  text-align: right;
}

.login-save-box {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.8rem;
}

.login-save-label {
  font-weight: 500;
  line-height: 1;
}

.login-form .btn-container {
  width: 100%;
  flex-direction: column;
  padding: 2.8rem 0 0;
}

.login-form .btn {
  width: 100%;
}

.login-link-box {
  display: flex;
  padding: 2.8rem 0 0;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
}

.login-link-item + .login-link-item {
  padding: 0 0 0 1.3rem;
  position: relative;
}
.login-link-item + .login-link-item::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1.2rem;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: #c1c8d0;
}

.login-link {
  color: #555;
  font-size: 1.8rem;
}
.login-link:hover, .login-link:focus-visible {
  text-decoration: underline;
}

.join-container {
  max-width: 108rem;
  width: 100%;
  margin: 0 auto;
}

.join-step {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0 4rem;
  counter-reset: join-step-counter;
}

.join-step__item {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  position: relative;
}
.join-step__item::before {
  display: flex;
  content: counter(join-step-counter);
  counter-increment: join-step-counter;
  font-size: 1.6rem;
  width: 2.8rem;
  height: 2.8rem;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  line-height: initial;
  letter-spacing: initial;
  border-radius: 50%;
  color: #fff;
  background-color: #909090;
}

.join-step__item__text {
  color: #909090;
  font-size: 1.8rem;
}

.join-step__item.is-active::before {
  background-color: var(--primary-color);
}
.join-step__item.is-active .join-step__item__text {
  font-weight: 600;
  color: var(--primary-color);
}

.join-step__arrow {
  width: 1rem;
  height: 1.8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/join_step_arrow.svg");
  font-size: 0;
}

.auth-area {
  display: flex;
  flex-flow: row wrap;
  gap: 4rem;
}

.auth-item {
  display: flex;
  flex: 1 1 calc(50% - 2rem);
  min-height: 40rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4rem 2rem;
  box-sizing: border-box;
  border-radius: 1rem;
  border: solid 1px #c1c8d0;
}
.auth-item::before {
  display: block;
  content: "";
  width: 8rem;
  height: 8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.auth-item:hover {
  border-color: transparent;
  outline: solid 0.4rem var(--quaternary-color);
  background-color: #fafafa;
}

.auth-item--new::before {
  background-image: url("../images/join_type_new.svg");
}

.auth-item--existing::before {
  background-image: url("../images/join_type_existing.svg");
}

.auth-item--phone::before {
  background-image: url("../images/join_auth_phone.svg");
}

.auth-item--ipin::before {
  background-image: url("../images/join_auth_ipin.svg");
}

.auth-item--citizen::before {
  background-image: url("../images/join_auth_citizen.svg");
}

.auth-item--worker::before {
  background-image: url("../images/join_auth_worker.svg");
}

.auth-item--ebook::before {
  background-image: url("../images/edu_content_ebook-ico.svg");
}

.auth-item--emagazine::before {
  background-image: url("../images/edu_content_emazine-ico.svg");
}

.auth-item__title {
  padding: 4rem 0 0;
  font-size: 2.4rem;
  font-weight: 600;
}

.auth-item__desc-1 {
  padding: 1.2rem 0 0;
  color: #555;
  text-align: center;
  font-size: 1.6rem;
  font-weight: 500;
}

.auth-item__desc-2 {
  padding: 2.4rem 0 0;
  color: #555;
  text-align: center;
  font-size: 1.4rem;
}

.auth-btn-box {
  display: flex;
  width: 100%;
  gap: 1.2rem;
  padding: 2.4rem 0 0;
}
.auth-btn-box .btn {
  flex: 1;
  height: 5.2rem;
  border-radius: 0.8rem;
  font-size: 2rem;
}

.term-area {
  border-top: solid 2px #000;
}

.term-item {
  padding: 2.8rem 5rem 2.8rem 0;
  position: relative;
  border-bottom: solid 1px #e1e7ec;
}

.term-title {
  padding: 0 0 0 3.2rem;
  position: relative;
}

.term-item .chk-input {
  position: absolute;
  left: 0;
  top: 0.2rem;
}
.term-item .chk-input:focus-visible {
  outline: solid 1.5px #000;
  outline-offset: 1.5px;
}

.term-label {
  font-size: 2rem;
  font-weight: 600;
}
.term-label:focus-visible {
  outline: solid 1.5px #000;
  outline-offset: 1.5px;
}

.term-content-area {
  width: calc(100% + 5rem);
  margin: 2.8rem 0 0;
}

.term-content {
  max-height: 30rem;
  height: 100%;
  padding: 2.8rem;
  box-sizing: border-box;
  background-color: #F4F4F4;
  color: #333;
  overflow-y: auto;
}
.term-content::-webkit-scrollbar {
  width: 4px;
  background-color: #B5B5B5;
}
.term-content::-webkit-scrollbar-thumb {
  background-color: #383838;
}
.term-content strong {
  display: inline-block;
  margin: 0 0 1.6rem;
  font-weight: 600;
}
.term-content span {
  display: inline-block;
  margin: 0 0 0.6rem;
  font-weight: 500;
}

.term-btn {
  width: 3.2rem;
  height: 3.2rem;
  font-size: 0;
  position: absolute;
  right: 0;
  top: 2.5rem;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.8rem auto;
  background-image: url("../images/term_btn_open.svg");
}
.term-btn:hover, .term-btn:focus-visible {
  opacity: 1;
}
.term-btn.on {
  display: block;
}
.term-btn.is-active {
  background-image: url("../images/term_btn_close.svg");
}

.term-item--auth {
  display: flex;
  align-items: center;
  gap: 2.8rem;
}

.term-title--auth {
  width: 13rem;
  padding: 0.2rem 0 0.2rem 3.2rem;
  box-sizing: border-box;
  background-repeat: no-repeat;
  background-position: left center;
  font-size: 2rem;
  font-weight: 600;
}

.term-title--target {
  background-image: url("../images/citizen_apply_target.svg");
}

.term-title--method {
  background-image: url("../images/citizen_apply_method.svg");
}

.term-title--limit {
  background-image: url("../images/citizen_apply_limit.svg");
}

.term-title--doc {
  background-image: url("../images/citizen_apply_doc.svg");
}

.term-info {
  flex: 1;
}

.mypage-apply-list {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.mypage-apply-item {
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 2.4rem 2.4rem;
  box-sizing: border-box;
  border: solid 1px #c1c8d0;
}

.mypage-apply-info {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;
}

.mypage-apply-title {
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.2em;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.mypage-apply-title:hover, .mypage-apply-title:focus-visible {
  color: #0091e7;
}

.mypage-apply-desc-box {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.mypage-apply-desc {
  display: flex;
}

.mypage-apply-desc__title {
  width: 7.2rem;
  color: #3d3d3d;
  font-weight: 500;
}

.mypage-apply-desc__value {
  flex: 1;
  color: #555;
}

.mypage-apply-item .btn-container {
  padding: 0;
}

.pw-input-area {
  display: flex;
  max-width: 64rem;
  width: 100%;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
}
.pw-input-area::before {
  display: block;
  content: "";
  max-width: 30rem;
  width: 100%;
  aspect-ratio: 30/30;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/password_deco.png");
}

.pw-input-title {
  padding: 2rem 0 0;
  font-size: 3.2rem;
  font-weight: 600;
}

.pw-input-desc {
  padding: 2rem 0 0;
  text-align: center;
  font-size: 2rem;
}

.pw-input-id {
  padding: 2.4rem 0 0;
  font-size: 3.2rem;
  font-weight: 600;
}

.pw-input-id__value {
  color: var(--tertiary-color);
  font-weight: 600;
}

.pw-input-box {
  width: 100%;
  padding: 4rem 0 0;
}

.pw-input[type=password] {
  width: 100%;
  height: 5.2rem;
  text-align: center;
}

.pw-input-area .btn-container {
  width: 100%;
  padding: 2.8rem 0 0;
}

.pw-input-area .btn {
  width: 100%;
  height: 5.2rem;
  border-radius: 0.6rem;
  font-size: 2rem;
}

.find-form-area {
  max-width: 870px;
  width: 100%;
  margin: 0 auto;
}

.find-form-title {
  text-align: center;
  font-size: 2.4rem;
  font-weight: 600;
}

.find-form {
  display: flex;
  padding: 4rem 0 0;
  flex-direction: column;
  gap: 2.8rem;
}

.find-form-list {
  display: flex;
  align-items: flex-start;
  gap: 2.8rem;
}

.find-form-list__title {
  display: flex;
  height: 4.8rem;
  align-items: center;
  font-size: 1.8rem;
  font-weight: 600;
}

.find-form--pw .find-form-list {
  gap: 0;
}
.find-form--pw .find-form-list__title {
  width: 14rem;
}

.find-form-list__content {
  flex: 1;
}

.find-form-input[type=text],
.find-form-input[type=password] {
  width: 100%;
  height: 4.8rem;
}

.find-result-area {
  display: flex;
  max-width: 480px;
  width: 100%;
  min-height: 40rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  padding: 4rem 4rem;
  box-sizing: border-box;
  border-radius: 1rem;
  border: solid 1px #c1c8d0;
}

.find-result {
  font-size: 2.4rem;
}

.find-result__value {
  color: var(--quaternary-color);
  font-weight: 600;
}

.find-result-area .btn-container {
  width: 100%;
}
.find-result-area .btn-container .btn {
  flex: 1;
}

.withdrawal-box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  padding: 2.4rem 2.4rem;
  box-sizing: border-box;
  border: solid 1px #c1c8d0;
}

.withdrawal-desc {
  font-size: 1.8rem;
  font-weight: 600;
}

.withdrawal-area .list-1 {
  padding: 4rem 0 0;
}

.mobile-card-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mobile-card {
  max-width: 480px;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 1rem;
  border: solid 1px #c1c8d0;
  box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1);
}

.mobile-card-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 3rem;
  padding: 5rem 5rem;
  border-bottom: solid 1px #c1c8d0;
}
.mobile-card-info::before {
  display: block;
  content: "";
  width: 8rem;
  height: 8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/sejoing_symbol.png");
}

.mobile-card-name {
  font-size: 3.6rem;
  font-weight: 500;
}

.mobile-card-barcode__img {
  max-width: 100%;
  width: 100%;
}

.mobile-card-num {
  color: var(--primary-color);
  text-align: center;
  font-size: 2.2rem;
  font-weight: 600;
}

.mobile-card-desc-box {
  padding: 2.4rem 0;
  background-color: var(--primary-light);
}

.mobile-card-desc {
  text-align: center;
  font-size: 1.8rem;
}

body.site-culture .mobile-card-info::before,
body.site-edu-culture .mobile-card-info::before {
  background-image: url("../images/culture_symbol.png");
}

.policy-label-area {
  display: flex;
  gap: 2.4rem;
}

.title-1 + .policy-label-area {
  padding: 1rem 0 0;
}

.policy-label {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.6rem;
  padding: 3rem 3rem;
  position: relative;
  border-radius: 1.6rem;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}
.policy-label:hover {
  transform: translateY(-0.5rem);
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.2);
  color: #0091e7;
}

.policy-label__icon {
  width: 8rem;
  height: 8rem;
}
.policy-label__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.policy-label__title {
  font-size: 1.8rem;
  font-weight: 600;
}

.policy-index-list {
  display: flex;
  flex-flow: row wrap;
  border-top: solid 2px #000;
}

.policy-index-item {
  display: flex;
  flex: 1 1 50%;
  justify-content: flex-start;
  padding: 1rem 2rem;
  box-sizing: border-box;
  border-bottom: solid 1px #dbdbdb;
}
.policy-index-item:nth-of-type(even) {
  border-left: solid 1px #dbdbdb;
}

.policy-index-link {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  box-sizing: border-box;
  font-size: 1.8rem;
  font-weight: 500;
  transition: all 0.3s ease;
}
.policy-index-link img {
  width: 5rem;
}
.policy-index-link:hover {
  color: #0091e7;
}

.policy-title {
  padding: 0 0 1.6rem;
}
.policy-title img {
  width: 3.6rem;
}
.policy-title img + img {
  margin: 0 0 0 0.3rem;
}
.policy-title strong {
  padding: 0 0 0 1.2rem;
  font-size: 2.4rem;
  font-weight: 600;
  vertical-align: middle;
}

.policy-img-box {
  padding: 2rem 2rem;
  box-sizing: border-box;
  border-radius: 0.6rem;
  border: 0.8rem solid #eef3f8;
  background-color: #fff;
  text-align: center;
}

.policy-box {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.policy-box select {
  height: 4.2rem;
}

.sitemap-wrap {
  padding: 2rem 0;
}

.sitemap-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
}

.sitemap-section {
  flex: 0 0 calc(33.333% - 2rem);
  background: #fff;
  border: 1px solid #e1e7ec;
  border-radius: 1.6rem;
  padding: 3rem;
  box-sizing: border-box;
  transition: all 0.3s ease;
}

.sitemap-section:hover {
  border-color: var(--primary-color);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
  transform: translateY(-5px);
}

.sitemap-depth-1-title {
  font-size: 2.2rem;
  font-weight: 700;
  color: #222;
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 2px solid #222;
  display: block;
}

.sitemap-depth-1-title:hover {
  color: var(--primary-color);
}

.sitemap-depth-2-list {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.sitemap-depth-2-item {
  font-size: 1.7rem;
  font-weight: 600;
}

.sitemap-depth-2-link {
  color: #444;
  display: inline-block;
  transition: color 0.2s;
}

.sitemap-depth-2-link:hover {
  color: var(--primary-color);
  text-decoration: underline;
}

.sitemap-depth-3-list {
  margin-top: 0.8rem;
  padding-left: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.sitemap-depth-3-item {
  font-size: 1.5rem;
  font-weight: 400;
  position: relative;
}

.sitemap-depth-3-item::before {
  content: "-";
  position: absolute;
  left: -1.2rem;
  color: #888;
}

.sitemap-depth-3-link {
  color: #666;
}

.sitemap-depth-3-link:hover {
  color: var(--primary-color);
}

.sitemap-loading,
.sitemap-error,
.sitemap-no-data {
  width: 100%;
  text-align: center;
  padding: 5rem 0;
  font-size: 1.8rem;
  color: #666;
  background: #f8f9fa;
  border-radius: 1rem;
}

@media screen and (max-width: 1024px) {
  .sitemap-section {
    flex: 0 0 calc(50% - 1.5rem);
  }
}
@media screen and (max-width: 768px) {
  .mobile-card {
    border-radius: 0;
    border: 0 none;
    box-shadow: none;
  }
  .mobile-card-info {
    gap: 2.4rem;
    padding: 2.4rem 2.4rem;
    border-bottom: 0 none;
  }
  .mobile-card-info::before {
    width: 6rem;
    height: 6rem;
  }
  .mobile-card-name {
    font-size: 2.4rem;
  }
  .mobile-card-num {
    font-size: 1.8rem;
  }
  .mobile-card-desc-box {
    padding: 1.6rem 1.6rem;
    border-radius: 0.4rem;
    border: solid 1px #dbdbdb;
  }
  .mobile-card-desc {
    font-size: 1.4rem;
  }
  .login-form {
    padding: 2.8rem 0 0;
    border-radius: 0;
    border: 0 none;
  }
  .login-link {
    font-size: 1.6rem;
  }
  .join-step-area {
    display: none;
  }
  .auth-area {
    gap: 1.6rem;
  }
  .auth-item {
    flex: 1 1 100%;
    min-height: 30rem;
    padding: 1.6rem 1.6rem;
  }
  .auth-item::before {
    width: 6rem;
    height: 6rem;
  }
  .auth-item__title {
    padding: 2.4rem 0 0;
    font-size: 2rem;
  }
  .auth-item__desc-2 {
    padding: 1.6rem 0 0;
  }
  .term-item {
    padding: 1.8rem 3.6rem 1.8rem 0;
  }
  .term-title {
    padding: 0 0 0 2.6rem;
  }
  .term-label {
    font-size: 1.6rem;
  }
  .term-content-area {
    width: calc(100% + 3.6rem);
  }
  .term-content-area.is-active {
    margin: 2rem 0 0;
  }
  .term-btn {
    width: 2.4rem;
    height: 2.4rem;
    background-size: 1.4rem auto;
    top: 1.8rem;
  }
  .mypage-apply-item {
    flex-direction: column;
  }
  .mypage-apply-item .btn-container {
    width: 100%;
  }
  .mypage-apply-item .btn {
    flex: 1;
  }
  .sitemap-grid {
    gap: 1.5rem;
  }
  .sitemap-section {
    flex: 0 0 100%;
    padding: 2rem;
  }
  .sitemap-depth-1-title {
    font-size: 2rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
  }
}
.table--form tbody th {
  background-color: #fff;
}
.table--form th,
.table--form td {
  padding: 2.8rem 0;
  border: 0 none;
  border-bottom: solid 1px #dbdbdb;
  background-color: #fff;
  text-align: left;
}
.table--form th {
  font-size: 1.8rem;
  font-weight: 500;
}
.table--form td {
  font-size: 1.8rem;
}
.table--form .btn {
  font-size: 1.8rem;
}
.table--form .chk-input[type=checkbox],
.table--form .chk-input[type=radio] {
  top: 0.1rem;
}

.form-container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0.8rem 1.5rem;
}

.form-container--col {
  flex-direction: column;
  align-items: flex-start;
}

.form-info-message {
  margin: 0 0 2rem;
  padding: 1.5rem 1.5rem;
  background-color: #f8f9fa;
  border-left: 4px solid var(--primary-color);
  border-radius: 4px;
}

.form-box {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 1.2rem;
  max-width: 80rem;
  width: 100%;
}
.form-box input[type=text],
.form-box input[type=password],
.form-box input[type=number],
.form-box input[type=date],
.form-box select {
  flex: 1;
  min-width: 0;
  height: 4.8rem;
}
.form-box .btn {
  min-width: 10rem;
  height: 4.8rem;
  border-radius: 0.6rem;
}

.form-input[type=text],
.form-input[type=password],
.form-select,
.form-textarea {
  width: 100%;
}

.form-textarea {
  height: 20rem;
  resize: none;
}

.form-separator {
  color: #555;
  font-weight: 500;
}

.form-box--add {
  flex-direction: column;
}
.form-box--add input[type=text] {
  flex: initial;
  width: 100%;
}

.form-zipcode {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 1.2rem;
}
.form-zipcode .btn {
  min-width: 15rem;
}

.companion-container {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 1.2rem;
}

.table--form .companion-container {
  max-width: 80rem;
  width: 100%;
}

.companion-item {
  display: flex;
  width: 100%;
  flex-flow: row wrap;
  align-items: center;
  border-radius: 0.6rem;
  border: solid 1px #dbdbdb;
  background-color: #fff;
}

.companion-box {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  box-sizing: border-box;
  position: relative;
}
.companion-box + .companion-box::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 1.6rem;
  background-color: #dbdbdb;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.companion-label {
  padding: 0 1.2rem;
  box-sizing: border-box;
  font-size: 1.6rem;
  font-weight: 500;
  white-space: nowrap;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.companion-input[type=text],
.companion-input[type=date],
.companion-select {
  flex: 1;
  height: 4.8rem;
  padding: 0 1rem 0 9rem;
  border: 0;
  border-radius: 0 none;
  font-size: 1.6rem;
}

.companion-item .form-box {
  gap: 0.4rem;
}

.complete-area {
  display: flex;
  max-width: 480px;
  width: 100%;
  min-height: 40rem;
  flex-direction: column;
  align-items: center;
  gap: 2.8rem;
  justify-content: center;
  margin: 0 auto;
  padding: 4rem;
  box-sizing: border-box;
  border-radius: 1rem;
  border: solid 1px #e1e7ec;
}
.complete-area::before {
  display: block;
  content: "";
  width: 8rem;
  height: 8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/join_complete.svg");
}

.complete-title {
  font-size: 2.4rem;
  font-weight: 600;
}

.complete-desc {
  color: #555;
  text-align: center;
  font-weight: 500;
}

.complete-list-box {
  width: 100%;
  padding: 1.6rem 1.6rem;
  box-sizing: border-box;
  border-radius: 0.6rem;
  background-color: var(--primary-light);
}

.complete-list-box li {
  font-size: 1.5rem;
}
.complete-list-box li::before {
  top: 0.8rem;
}

.complete-area .btn-container {
  width: 100%;
  padding: 0;
}
.complete-area .btn-container .btn {
  flex: 1;
}

@media screen and (max-width: 768px) {
  .table--form {
    display: block;
  }
  .table--form tbody {
    display: flex;
    flex-direction: column;
  }
  .table--form tr {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.6rem 0;
    border-bottom: solid 1px #dbdbdb;
  }
  .table--form th,
  .table--form td {
    width: 100%;
    padding: 0;
    border: 0 none;
    font-size: 1.6rem;
  }
  .form-box input[type=text],
  .form-box input[type=password],
  .form-box input[type=number],
  .form-box input[type=date],
  .form-box select {
    height: 4.2rem;
  }
  .form-box .btn {
    min-width: auto;
    height: 4.2rem;
    white-space: nowrap;
  }
  .form-box--mail select {
    flex: 1 1 100%;
  }
  .companion-box {
    flex: 1 1 100%;
  }
  .companion-box + .companion-box {
    border-top: 1px solid #dbdbdb;
  }
  .companion-box + .companion-box::before {
    display: none;
  }
}
.tnb {
  width: 100%;
  height: 60px;
  box-sizing: border-box;
  border-bottom: solid 1px #dbdbdb;
  background-color: #fff;
}
@media screen and (max-width: 1280px) {
  .tnb {
    display: none;
  }
}

.tnb-inner {
  display: flex;
  max-width: 145.2rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
  box-sizing: border-box;
  height: 100%;
  align-items: center;
  justify-content: flex-end;
}

.tnb-right {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.tnb__item {
  padding: 0.8rem 1.6rem;
  border-radius: 10rem;
  color: #fff;
  font-weight: 600;
  line-height: initial;
}

.tnb__item--login {
  background-color: var(--quaternary-color);
}
.tnb__item--login:hover {
  background-color: var(--quaternary-hover);
}

.tnb__item--join {
  background-color: var(--secondary-color);
}
.tnb__item--join:hover {
  background-color: var(--secondary-hover);
}

.tnb__item--mypage {
  background-color: var(--tertiary-color);
}
.tnb__item--mypage:hover {
  background-color: var(--tertiary-hover);
}

.tnb__item--teacher {
  background-color: var(--primary-color);
}
.tnb__item--teacher:hover {
  background-color: var(--primary-hover);
}

.tnb__item--attendance {
  background-color: var(--secondary-color);
}
.tnb__item--attendance:hover {
  background-color: var(--secondary-hover);
}

.header-container {
  position: relative;
  z-index: 10;
}
.header-container.is-sticky {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.05);
}

.header {
  width: 100%;
  height: 9.2rem;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
  background-color: #fff;
}
.header::before {
  display: block;
  content: "";
  width: 100%;
  height: 1px;
  background-color: rgba(0, 0, 0, 0.1);
  position: absolute;
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 1280px) {
  .header {
    height: 6rem;
  }
}

.header-inner {
  display: flex;
  height: 100%;
  max-width: 145.2rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
  box-sizing: border-box;
  align-items: center;
  justify-content: flex-end;
}
@media screen and (max-width: 1280px) {
  .header-inner {
    padding: 0 0.8rem 0 1.6rem;
  }
}

.header-logo {
  margin-right: auto;
}

.header-logo__link {
  display: block;
  width: 17rem;
  height: 5.2rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/h1_logo_culture.svg");
  font-size: 0;
}
@media screen and (max-width: 1280px) {
  .header-logo__link {
    width: 10.4rem;
    height: 3.2rem;
  }
}

.gnb {
  max-width: 1100px;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1280px) {
  .gnb {
    display: none;
  }
}

.gnb__list {
  display: flex;
  width: 100%;
  height: 100%;
}

.gnb__item {
  flex: 1;
  position: relative;
}

.gnb__link {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 2.2rem;
  font-weight: 600;
}

.gnb__text {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
  position: relative;
}
.gnb__text::before {
  display: block;
  content: "";
  width: 0;
  height: 4px;
  background-color: var(--primary-color);
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  transition: all 0.3s ease;
}

.gnb__item.is-hover .gnb__text {
  color: var(--primary-color);
}
.gnb__item.is-hover .gnb__text::before {
  width: 100%;
}

.gnb__item.is-active .gnb__text {
  color: var(--primary-color);
}
.gnb__item.is-active .gnb__text::before {
  width: 100%;
}

.gnb-sub {
  width: 100%;
  height: 0;
  padding: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 9.2rem;
  transition: all 0.3s ease;
  z-index: 2;
}

.gnb-sub__item {
  width: 100%;
}

.gnb-sub__link {
  display: flex;
  width: 100%;
  height: 38px;
  justify-content: center;
  align-items: center;
  color: #5c5c5c;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 500;
}
.gnb-sub__link:hover {
  color: var(--primary-color);
}

.gnb-bg {
  width: 100%;
  height: 0;
  opacity: 0;
  background-color: #fff;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.06);
  transition: all 0.3s ease;
  position: absolute;
  left: 0;
  top: 15.2rem;
  z-index: 1;
}
@media screen and (max-width: 1280px) {
  .gnb-bg {
    display: none;
  }
}

.header-container.is-active .gnb-sub,
.header-container.is-active .gnb-bg {
  padding: 2rem 0;
  opacity: 1;
}

.gnb-4.is-active .gnb-sub,
.gnb-4.is-active .gnb-bg {
  height: 152px;
}

.gnb-5.is-active .gnb-sub,
.gnb-5.is-active .gnb-bg {
  height: 190px;
}

.gnb-6.is-active .gnb-sub,
.gnb-6.is-active .gnb-bg {
  height: 228px;
}

.gnb-7.is-active .gnb-sub,
.gnb-7.is-active .gnb-bg {
  height: 266px;
}

.gnb-8.is-active .gnb-sub,
.gnb-8.is-active .gnb-bg {
  height: 304px;
}

.gnb-9.is-active .gnb-sub,
.gnb-9.is-active .gnb-bg {
  height: 342px;
}

.gnb-10.is-active .gnb-sub,
.gnb-10.is-active .gnb-bg {
  height: 380px;
}

.gnb-11.is-active .gnb-sub,
.gnb-11.is-active .gnb-bg {
  height: 418px;
}

.gnb-12.is-active .gnb-sub,
.gnb-12.is-active .gnb-bg {
  height: 456px;
}

.gnb-13.is-active .gnb-sub,
.gnb-13.is-active .gnb-bg {
  height: 494px;
}

.gnb-14.is-active .gnb-sub,
.gnb-14.is-active .gnb-bg {
  height: 532px;
}

.gnb-15.is-active .gnb-sub,
.gnb-15.is-active .gnb-bg {
  height: 570px;
}

.header .btn-container {
  display: none;
}
@media screen and (max-width: 1280px) {
  .header .btn-container {
    display: flex;
    padding: 0;
  }
}

.menu-toggle-btn {
  display: block;
  width: 24px;
  height: 24px;
  font-size: 0;
  position: relative;
}
.menu-toggle-btn::before {
  display: block;
  content: "";
  width: 20px;
  height: 3px;
  background-color: #000;
  border-radius: 10rem;
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  transition: all 0.3s ease;
}
.menu-toggle-btn::after {
  display: block;
  content: "";
  width: 20px;
  height: 3px;
  background-color: #000;
  border-radius: 10rem;
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  transition: all 0.3s ease;
}
@media screen and (max-width: 1280px) {
  .menu-toggle-btn {
    display: none;
    display: none;
  }
}

.menu-toggle-btn__bar {
  display: block;
  width: 20px;
  height: 3px;
  background-color: #000;
  border-radius: 10rem;
  transition: all 0.2s ease;
  position: absolute;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.menu-toggle-btn__bar:nth-child(1) {
  top: calc(50% + 8px);
}
.menu-toggle-btn__bar:nth-child(2) {
  top: calc(50% - 8px);
}

.header-container.is-active .menu-toggle-btn::before {
  width: 100%;
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.header-container.is-active .menu-toggle-btn::after {
  width: 100%;
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.header-container.is-active .menu-toggle-btn__bar {
  opacity: 0;
}

.mobile-card-link {
  display: inline-block;
  padding: 0.6rem 1rem;
  border-radius: 0.4rem;
  border: solid 1px var(--primary-color);
  color: var(--primary-color);
  background-color: #fff;
  font-weight: 600;
}

.menu-open-btn {
  width: 3.6rem;
  height: 3.6rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 2.4rem auto;
  background-image: url("../images/mobile_menu_open.svg");
  font-size: 0;
}
.menu-open-btn:hover, .menu-open-btn:focus-visible {
  background-color: #f8f8f8;
}

.main-wrap {
  padding: 4rem 0 3rem;
}
@media screen and (max-width: 768px) {
  .main-wrap {
    padding: 0 0 2rem;
    overflow-x: hidden;
  }
}

.main-container {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  max-width: 145.2rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
  box-sizing: border-box;
}

.main-visual-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 2rem;
  width: 100%;
}
@media screen and (max-width: 1280px) {
  .main-visual-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .main-visual-grid {
    display: none;
  }
}

.main-visual--mobile {
  display: none;
}
@media screen and (max-width: 768px) {
  .main-visual--mobile {
    display: block;
    width: calc(100% + 3.2rem);
    margin: 0 -1.6rem;
  }
}

.main-visual-grid__item {
  display: flex;
  flex-direction: column;
  min-height: 28rem;
  padding: 3.2rem;
  box-sizing: border-box;
  border-radius: 2.4rem;
  background-repeat: no-repeat;
  background-position: right bottom -2.5rem;
  background-size: 50% auto;
}
@media screen and (max-width: 768px) {
  .main-visual-grid__item {
    min-height: 22rem;
    padding: 2.4rem;
    border-radius: 1.6rem;
    background-position: right bottom -1.5rem;
    background-size: 50% auto;
  }
}

.main-visual-grid__item--1 {
  background-color: #FBAC1C;
  background-image: url("../images/img_visual_deco04.png");
}

.main-visual-grid__item--2 {
  background-color: #FA71B7;
  background-image: url("../images/img_visual_deco05.png");
}

.main-visual-grid__item--3 {
  background-color: var(--tertiary-color);
  background-image: url("../images/img_visual_deco06.png");
}

.main-visual-grid__item--4 {
  background-color: var(--secondary-color);
  background-image: url("../images/img_visual_deco07.png");
}

.main-visual {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .main-visual {
    width: calc(100% + 3.2rem);
    margin: 0 -1.6rem;
  }
}

.main-visual-swiper {
  width: 100%;
}

.main-visual__item {
  display: flex;
  width: 46rem;
  height: 54rem;
  flex-direction: column;
  padding: 4rem 4rem;
  box-sizing: border-box;
  border-radius: 2.8rem;
  background-repeat: no-repeat;
  background-position: center top 19rem;
  background-size: 36rem auto;
}
@media screen and (max-width: 768px) {
  .main-visual__item {
    width: 100%;
    height: 44.6rem;
    padding: 3.2rem 1.6rem;
    border-radius: 0;
    background-position: center top 15rem;
  }
}

.main-visual__item--1 {
  background-color: #FBAC1C;
  background-image: url("../images/img_visual_deco04.png");
}

.main-visual__item--2 {
  background-color: #FA71B7;
  background-image: url("../images/img_visual_deco05.png");
}

.main-visual__item--3 {
  background-color: var(--tertiary-color);
  background-image: url("../images/img_visual_deco06.png");
}

.main-visual__item--4 {
  background-color: var(--secondary-color);
  background-image: url("../images/img_visual_deco07.png");
}

.main-visual__title {
  color: #fff;
  font-size: 4.8rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .main-visual__title {
    font-size: 4rem;
  }
}

.main-visual__desc {
  padding: 2rem 0 0;
  color: #fff;
  font-size: 2rem;
  font-weight: 400;
}
@media screen and (max-width: 768px) {
  .main-visual__desc {
    padding: 0.8rem 0 0;
    font-size: 1.6rem;
  }
}

.main-visual__link-container {
  display: flex;
  flex-flow: row wrap;
  gap: 1.2rem;
  margin-top: auto;
}
@media screen and (max-width: 768px) {
  .main-visual__link-container {
    gap: 1rem;
  }
}

.main-visual-grid__item .main-visual__link-container {
  margin-top: 4rem;
}
@media screen and (max-width: 768px) {
  .main-visual-grid__item .main-visual__link-container {
    margin-top: 2.4rem;
  }
}

.main-visual__link {
  padding: 1.6rem 2.4rem;
  box-sizing: border-box;
  border-radius: 10rem;
  border: solid 1px rgba(0, 0, 0, 0.1);
  background-color: #fff;
  font-size: 2.4rem;
  font-weight: 600;
  transition: all 0.3s ease;
}
.main-visual__link:hover {
  color: #0091e7;
}
@media screen and (max-width: 768px) {
  .main-visual__link {
    padding: 0.8rem 2.4rem;
    font-size: 2rem;
  }
}

.main-visual .main-visual__pagination {
  display: none;
}
@media screen and (max-width: 768px) {
  .main-visual .main-visual__pagination {
    display: flex;
    width: auto;
    gap: 0.4rem;
    position: absolute;
    left: initial;
    right: 1.6rem;
    top: 3.2rem;
    bottom: initial;
    z-index: 1;
  }
  .main-visual .main-visual__pagination .swiper-pagination-bullet {
    width: 0.8rem;
    height: 0.8rem;
    margin: 0;
    opacity: 0.5;
    background-color: #fff;
    transition: all 0.3s ease;
  }
  .main-visual .main-visual__pagination .swiper-pagination-bullet-active {
    width: 2rem;
    opacity: 1;
    border-radius: 0.8rem;
  }
}

.main-search {
  width: 100%;
  height: 8.8rem;
  margin: 4rem 0 10rem;
  box-sizing: border-box;
  border-radius: 10rem;
  border: solid 4px var(--secondary-color);
  background-color: #fff;
}
@media screen and (max-width: 768px) {
  .main-search {
    height: 6rem;
    margin: 2rem 0 4rem;
    border-width: 3px;
  }
}

.main-search-container {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
}

.main-search__select {
  min-width: 14rem;
  height: 100%;
  padding: 0 7.4rem 0 4rem;
  box-sizing: border-box;
  border: 0 none;
  border-radius: 10rem 0 0 10rem;
  background-color: transparent;
  font-size: 2.4rem;
  font-weight: 500;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(21,21,21,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center right 1.4rem;
  background-size: 2.4rem auto;
  cursor: pointer;
}
.main-search__select::-ms-expand {
  display: none;
}
@media screen and (max-width: 768px) {
  .main-search__select {
    display: none;
  }
}

.main-search-box {
  display: flex;
  align-items: center;
  flex: 1;
  height: 100%;
  box-sizing: border-box;
  position: relative;
}
.main-search-box::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 2rem;
  background-color: #e1e7ec;
}
@media screen and (max-width: 768px) {
  .main-search-box::before {
    display: none;
  }
}

.main-search__input[type=text] {
  min-width: 0;
  width: 100%;
  height: 100%;
  padding: 0 10rem 0 2rem;
  border: 0 none;
  border-radius: 10rem;
  background-color: transparent;
  font-size: 2.4rem;
}
@media screen and (max-width: 768px) {
  .main-search__input[type=text] {
    padding: 0 6rem 0 2rem;
    font-size: 1.8rem;
  }
}

.main-search__btn {
  width: 6rem;
  height: 6rem;
  font-size: 0;
  position: absolute;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 4rem;
  background-image: url("../images/culture_search_icon.svg");
}
.main-search__btn:hover {
  background-color: #f2f2f2;
  background-image: url("../images/culture_search_hover_icon.svg");
}
@media screen and (max-width: 768px) {
  .main-search__btn {
    width: 4rem;
    height: 4rem;
    right: 1.2rem;
    background-size: 2.8rem;
  }
}

.main-title {
  margin: 0 0 2rem;
  font-size: 4rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .main-title {
    font-size: 2.4rem;
  }
}

.main-more-link {
  width: 4rem;
  height: 4rem;
  box-sizing: border-box;
  position: absolute;
  right: 0;
  top: 0;
  border-radius: 50%;
  border: solid 1px #c1c8d0;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(85,85,85,1)'%3E%3Cpath d='M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z'%3E%3C/path%3E%3C/svg%3E");
  font-size: 0;
}
.main-more-link:hover {
  background-color: #f2f2f2;
}
@media screen and (max-width: 768px) {
  .main-more-link {
    width: 3.2rem;
    height: 3.2rem;
    background-size: 2rem;
  }
}

.main-navi {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  position: absolute;
  right: 0;
  top: 0;
}
@media screen and (max-width: 768px) {
  .main-navi {
    gap: 0.4rem;
  }
}

.main-navi__btn {
  width: 4rem;
  height: 4rem;
  box-sizing: border-box;
  border-radius: 50%;
  border: solid 1px #c1c8d0;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  font-size: 0;
}
.main-navi__btn:hover {
  background-color: #f2f2f2;
}
@media screen and (max-width: 768px) {
  .main-navi__btn {
    width: 3.2rem;
    height: 3.2rem;
    background-size: 2rem;
  }
}

.main-navi__btn--prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(85,85,85,1)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}
@media screen and (max-width: 768px) {
  .main-navi__btn--prev {
    display: none;
  }
}

.main-navi__btn--next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(85,85,85,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}
@media screen and (max-width: 768px) {
  .main-navi__btn--next {
    display: none;
  }
}

.main-navi__btn--pause {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(85,85,85,1)'%3E%3Cpath d='M6 5H8V19H6V5ZM16 5H18V19H16V5Z'%3E%3C/path%3E%3C/svg%3E");
}

.main-navi__btn--play {
  display: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(85,85,85,1)'%3E%3Cpath d='M16.3944 12.0001L10 7.7371V16.263L16.3944 12.0001ZM19.376 12.4161L8.77735 19.4818C8.54759 19.635 8.23715 19.5729 8.08397 19.3432C8.02922 19.261 8 19.1645 8 19.0658V4.93433C8 4.65818 8.22386 4.43433 8.5 4.43433C8.59871 4.43433 8.69522 4.46355 8.77735 4.5183L19.376 11.584C19.6057 11.7372 19.6678 12.0477 19.5146 12.2774C19.478 12.3323 19.4309 12.3795 19.376 12.4161Z'%3E%3C/path%3E%3C/svg%3E");
}

.main-navi:has(.swiper-button-lock:nth-of-type(2)) .main-navi__btn--play,
.main-navi:has(.swiper-button-lock:nth-of-type(2)) .main-navi__btn--pause {
  display: none;
}

.main-notice {
  display: flex;
  width: calc(100% - 52rem);
  flex-direction: column;
  position: relative;
}
@media screen and (max-width: 1280px) {
  .main-notice {
    width: 100%;
  }
}

.main-notice__list {
  border-top: solid 1px #c1c8d0;
}

.main-notice__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 2rem 0;
  border-bottom: solid 1px #c1c8d0;
}
.main-notice__item:last-of-type {
  padding-bottom: 0;
  border-bottom: 0 none;
}
@media screen and (max-width: 768px) {
  .main-notice__item {
    padding: 1.6rem 0;
  }
}

.main-notice__link {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.main-notice__title {
  font-size: 1.8rem;
  line-height: 1;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  transition: all 0.3s ease;
}
@media screen and (max-width: 768px) {
  .main-notice__title {
    font-size: 1.6rem;
  }
}

.main-notice__link:hover .main-notice__title {
  color: #0091e7;
}

.main-notice__date {
  color: #555;
  white-space: nowrap;
}
.main-link {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 3rem;
  padding: 2.8rem 2rem;
  margin-top: 4rem;
  box-sizing: border-box;
  border-radius: 2rem;
  border: solid 1px #c1c8d0;
}
@media screen and (max-width: 1280px) {
  .main-link {
    margin: 4rem 0 0;
  }
}
@media screen and (max-width: 768px) {
  .main-link {
    gap: 2rem 0.4rem;
    padding: 2rem 1.6rem;
    border-radius: 1.6rem;
  }
}

.main-link__item {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
}
@media screen and (max-width: 768px) {
  .main-link__item {
    flex: auto;
    width: calc(50% - 0.2rem);
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 0.8rem;
  }
}

.main-link__icon {
  width: 5.6rem;
  height: 5.6rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: all 0.3s ease;
}
@media screen and (max-width: 768px) {
  .main-link__icon {
    width: 2.4rem;
    height: 2.4rem;
  }
}

.main-link__item--1 .main-link__icon {
  background-image: url("../images/main_link_icon01.svg");
}

.main-link__item--2 .main-link__icon {
  background-image: url("../images/main_link_icon02.svg");
}

.main-link__item--3 .main-link__icon {
  background-image: url("../images/main_link_icon03.svg");
}

.main-link__item--4 .main-link__icon {
  background-image: url("../images/main_link_icon04.svg");
}

.main-link__item--5 .main-link__icon {
  background-image: url("../images/main_link_icon05.svg");
}

.main-link__item--6 .main-link__icon {
  background-image: url("../images/main_link_icon06.svg");
}

.main-link__item--7 .main-link__icon {
  background-image: url("../images/main_link_icon07.svg");
}

.main-link__item--8 .main-link__icon {
  background-image: url("../images/main_link_icon08.svg");
}

.main-link__item:hover .main-link__icon {
  transform: scale(1.05);
}

.main-link__title {
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1;
  transition: all 0.3s ease;
}
@media screen and (max-width: 768px) {
  .main-link__title {
    font-size: 1.5rem;
  }
}

.main-link__item:hover .main-link__title {
  color: var(--primary-color);
  font-weight: 600;
}

.main-calendar {
  width: 46rem;
  margin-left: 6rem;
  position: relative;
}
@media screen and (max-width: 1280px) {
  .main-calendar {
    width: 100%;
    margin: 10rem 0 0;
  }
}
@media screen and (max-width: 768px) {
  .main-calendar {
    margin: 4rem 0 0;
  }
}

.main-calendar__container {
  padding: 2rem;
  box-sizing: border-box;
  border-radius: 2rem;
  border: solid 1px #c1c8d0;
  background-color: #fff;
}

.main-calendar__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.6rem;
}

.main-calendar__month {
  font-size: 2.4rem;
  font-weight: 700;
  color: #252525;
}
@media screen and (max-width: 768px) {
  .main-calendar__month {
    font-size: 2rem;
  }
}

.main-calendar__nav {
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 50%;
  border: solid 1px #c1c8d0;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 2rem;
  cursor: pointer;
  transition: all 0.3s ease;
}
.main-calendar__nav:hover {
  background-color: #f5f5f5;
}

.main-calendar__nav--prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(85,85,85,1)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}

.main-calendar__nav--next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(85,85,85,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}

.main-calendar__table {
  width: 100%;
  border-collapse: collapse;
}
.main-calendar__table th,
.main-calendar__table td {
  text-align: center;
  padding: 0.8rem 0;
  font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
  .main-calendar__table th,
  .main-calendar__table td {
    font-size: 1.4rem;
    padding: 0.6rem 0;
  }
}
.main-calendar__table th {
  font-weight: 600;
  color: #666;
  padding-bottom: 1.2rem;
  border-bottom: solid 1px #c1c8d0;
}
.main-calendar__table th.sunday {
  color: #e53935;
}
.main-calendar__table th.saturday {
  color: var(--primary-color);
}
.main-calendar__table td {
  position: relative;
}
.main-calendar__table td.empty {
  background-color: transparent;
}
.main-calendar__table td.sunday .main-calendar__day {
  color: #e53935;
}
.main-calendar__table td.saturday .main-calendar__day {
  color: var(--primary-color);
}
.main-calendar__table td.today .main-calendar__day {
  background-color: var(--primary-color);
  color: #fff;
  font-weight: 700;
}
.main-calendar__table td.selected .main-calendar__day {
  border: 2px solid var(--primary-color);
}

.main-calendar__day {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  margin: 0 auto;
  border-radius: 50%;
  border: 2px solid transparent;
  background-color: transparent;
  cursor: pointer;
  position: relative;
  transition: all 0.3s ease;
}
.main-calendar__day:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 768px) {
  .main-calendar__day {
    width: 3.2rem;
    height: 3.2rem;
  }
}

.main-calendar__count {
  display: none;
}

.main-calendar__dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  position: absolute;
  bottom: 0.2rem;
  left: 50%;
  transform: translateX(-50%);
}

.main-calendar__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
}
.main-calendar__dot--holiday {
  background-color: #e53935;
}
.main-calendar__dot--schedule {
  background-color: var(--secondary-color);
}
.main-calendar__dot--program {
  background-color: var(--tertiary-color);
}

.main-calendar__legend {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  margin-top: 1.6rem;
  padding-top: 1.2rem;
  border-top: solid 1px #c1c8d0;
}

.main-calendar__legend-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.4rem;
  color: #666;
}
.main-calendar__legend-item::before {
  content: "";
  display: block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
}
.main-calendar__legend-item--holiday::before {
  background-color: #e53935;
}
.main-calendar__legend-item--schedule::before {
  background-color: var(--secondary-color);
}
.main-calendar__legend-item--event::before {
  background-color: var(--tertiary-color);
}

.main-calendar__events {
  margin-top: 2rem;
  padding: 1.6rem;
  border-radius: 1.6rem;
  background-color: #f8f9fa;
}
@media screen and (max-width: 768px) {
  .main-calendar__events {
    margin-top: 1.6rem;
    padding: 1.2rem;
  }
}

.main-calendar__events-date {
  font-size: 1.6rem;
  font-weight: 600;
  color: #252525;
  margin-bottom: 1.2rem;
}
@media screen and (max-width: 768px) {
  .main-calendar__events-date {
    font-size: 1.4rem;
  }
}

.main-calendar__events-list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  max-height: 14rem;
  overflow-y: auto;
}
.main-calendar__events-list::-webkit-scrollbar {
  width: 0.6rem;
}
.main-calendar__events-list::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 0.3rem;
}
.main-calendar__events-list::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 0.3rem;
}
.main-calendar__events-list::-webkit-scrollbar-thumb:hover {
  background: #aaa;
}

.main-calendar__event-item {
  padding: 1rem 1.2rem;
  border-radius: 0.8rem;
  background-color: #fff;
  border-left: 4px solid var(--primary-color);
}
.main-calendar__event-item a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem;
}
.main-calendar__event-item--schedule {
  border-left-color: var(--secondary-color);
}
.main-calendar__event-item--event {
  border-left-color: var(--tertiary-color);
}
.main-calendar__event-item--program {
  border-left-color: var(--primary-color);
}

.main-calendar__event-type {
  display: inline-block;
  padding: 0.2rem 0.8rem;
  border-radius: 1rem;
  background-color: var(--primary-color);
  color: #fff;
  font-size: 1.2rem;
  font-weight: 500;
}
.main-calendar__event-item--schedule .main-calendar__event-type {
  background-color: var(--secondary-color);
}
.main-calendar__event-item--event .main-calendar__event-type {
  background-color: var(--tertiary-color);
}

.main-calendar__event-title {
  flex: 1;
  font-size: 1.4rem;
  color: #252525;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.main-calendar__event-place {
  width: 100%;
  font-size: 1.2rem;
  color: #888;
}

.main-calendar__no-event {
  font-size: 1.4rem;
  color: #888;
  text-align: center;
  padding: 2rem 0;
}

.main-lecture {
  width: 100%;
  margin: 10rem 0 0;
  position: relative;
}
@media screen and (max-width: 768px) {
  .main-lecture {
    margin: 4rem 0 0;
  }
}

@media screen and (max-width: 768px) {
  .main-lecture-swiper {
    overflow: visible;
  }
}

.main-lecture-item {
  width: 32.2rem;
  margin-right: 4.4rem;
}
@media screen and (max-width: 768px) {
  .main-lecture-item {
    width: 24rem;
    margin-right: 2rem;
  }
}

.main-lecture__poster {
  display: block;
  width: 100%;
  height: 45rem;
  margin: 0 0 2rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 2rem;
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.main-lecture__poster-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}
.main-lecture__poster:hover .main-lecture__poster-img {
  transform: scale(1.05);
}
@media screen and (max-width: 768px) {
  .main-lecture__poster {
    height: 34rem;
    border-radius: 1.6rem;
  }
}

.main-lecture .badge-status {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .main-lecture .badge-status {
    font-size: 1.4rem;
  }
}

.main-lecture__title {
  display: block;
  padding: 1.2rem 0 0;
  font-size: 2rem;
  font-weight: 600;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  transition: all 0.3s ease;
}
.main-lecture__title:hover {
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .main-lecture__title {
    font-size: 1.8rem;
  }
}

.main-lecture__date {
  padding: 1.2rem 0 0;
  color: #555;
  font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
  .main-lecture__date {
    font-size: 1.4rem;
  }
}

.main-lecture__info {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  padding: 0.6rem 0 0;
}

.main-lecture__info-title {
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .main-lecture__info-title {
    font-size: 1.4rem;
  }
}

.main-lecture__info-value {
  display: flex;
  gap: 0.3rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .main-lecture__info-value {
    font-size: 1.4rem;
  }
}

.main-lecture__info-current {
  color: var(--primary-color);
  font-weight: 700;
}

.main-lecture .main-navi {
  right: 4.6rem;
}
@media screen and (max-width: 768px) {
  .main-lecture .main-navi {
    right: 3.6rem;
  }
}

.main-book-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 100%;
  margin-top: 10rem;
}
@media screen and (max-width: 768px) {
  .main-book-banner {
    margin-top: 4rem;
  }
}

.main-book-wrap {
  width: calc(100% - 52rem);
  position: relative;
}
@media screen and (max-width: 1280px) {
  .main-book-wrap {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .main-book-wrap {
    margin: 4rem 0 0;
  }
  .main-book-wrap .no-data {
    height: auto;
  }
}

.main-book {
  width: 100%;
}

.main-book-nav {
  margin: 0 0 2rem;
}

.main-book-nav__list {
  display: flex;
  gap: 2rem;
}
@media screen and (max-width: 768px) {
  .main-book-nav__list {
    gap: 0.8rem;
  }
}

.main-book-nav__item + .main-book-nav__item {
  display: flex;
  align-items: center;
  gap: 2rem;
}
.main-book-nav__item + .main-book-nav__item::before {
  display: block;
  content: "/";
  font-size: 4rem;
  font-weight: 700;
  color: #c1c8d0;
}
@media screen and (max-width: 768px) {
  .main-book-nav__item + .main-book-nav__item {
    gap: 0.8rem;
  }
  .main-book-nav__item + .main-book-nav__item::before {
    font-size: 2.4rem;
  }
}

.main-book-nav__btn {
  color: #999;
  font-size: 4rem;
  font-weight: 700;
}
.main-book-nav__btn:hover, .main-book-nav__btn:focus-visible {
  color: #252525;
}
.main-book-nav__btn.is-active {
  color: #252525;
}
@media screen and (max-width: 768px) {
  .main-book-nav__btn {
    font-size: 2.4rem;
  }
}

@media screen and (max-width: 768px) {
  .main-newbook-swiper {
    overflow: visible;
  }
}

@media screen and (max-width: 768px) {
  .main-recommendbook-swiper {
    overflow: visible;
  }
}

.main-book__item {
  width: 21rem;
  margin-right: 20px;
}
@media screen and (max-width: 768px) {
  .main-book__item {
    width: 13rem;
  }
}

.main-book__cover {
  display: block;
  width: 100%;
  height: 30rem;
  margin: 0 0 2rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 2rem;
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.main-book__cover-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}
.main-book__cover:hover .main-book__cover-img, .main-book__cover:focus-visible .main-book__cover-img {
  transform: scale(1.05);
}
@media screen and (max-width: 768px) {
  .main-book__cover {
    height: 20rem;
    border-radius: 1.6rem;
  }
}

.main-book__title {
  display: block;
  margin: 0 0 0.8rem;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.2em;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.main-book__title:hover, .main-book__title:focus-visible {
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .main-book__title {
    font-size: 1.8rem;
  }
}

.main-book__author {
  color: #555;
  font-size: 1.8rem;
  line-height: 1.2;
}
@media screen and (max-width: 768px) {
  .main-book__author {
    font-size: 1.4rem;
  }
}

.main-book .main-navi {
  right: 4.6rem;
}
@media screen and (max-width: 768px) {
  .main-book .main-navi {
    right: 3.6rem;
  }
}

.main-banner {
  width: 46rem;
  margin-left: 6rem;
  position: relative;
}
@media screen and (max-width: 1280px) {
  .main-banner {
    width: 100%;
    margin: 10rem 0 0;
  }
}
@media screen and (max-width: 768px) {
  .main-banner {
    margin: 4rem 0 0;
  }
}

.main-banner-swiper {
  width: 100%;
  height: 48rem;
  box-sizing: border-box;
  border: solid 1px rgba(0, 0, 0, 0.1);
  border-radius: 2rem;
}
@media screen and (max-width: 1280px) {
  .main-banner-swiper {
    width: 46rem;
  }
}
@media screen and (max-width: 768px) {
  .main-banner-swiper {
    width: 100%;
    height: auto;
    aspect-ratio: 164/157;
  }
}

.main-banner__item {
  font-size: 0;
}

.main-banner__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  transition: all 0.3s ease;
}

.main-banner__item:hover .main-banner__img {
  transform: scale(1.05);
}

.main-banner__pagination {
  min-width: 7rem;
  width: auto;
  padding: 0.8rem 1.6rem;
  position: absolute;
  left: initial;
  right: 2rem;
  top: initial;
  bottom: 2rem;
  z-index: 1;
  box-sizing: border-box;
  border-radius: 10rem;
  background-color: rgba(0, 0, 0, 0.5);
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  font-size: 1.8rem;
}
.main-banner__pagination .swiper-pagination-current {
  color: #fff;
  font-weight: 600;
}

.main-banner .no-data {
  width: 100%;
  height: 100%;
}

.main-service {
  display: flex;
  width: 100%;
  flex-flow: row wrap;
  align-items: center;
  gap: 2rem;
  margin: 10rem 0 0;
}
@media screen and (max-width: 768px) {
  .main-service {
    gap: 1rem;
    margin: 4rem 0 0;
  }
}

.main-service__item {
  display: flex;
  flex: 1;
  align-items: center;
  position: relative;
  padding: 2rem 2.8rem;
  border: 1px solid #dbdbdb;
  border-radius: 2rem;
}
@media screen and (max-width: 768px) {
  .main-service__item {
    flex: 1 1 100%;
    padding: 1.6rem 2.4rem;
    border-radius: 1.6rem;
  }
  .main-service__item::after {
    right: 2rem;
  }
}

.main-service__item::after {
  display: block;
  content: "";
  width: 3.2rem;
  height: 3.2rem;
  position: absolute;
  right: 2.8rem;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  background-color: var(--secondary-color);
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../images/main_link_deco_icon.svg");
  transition: all 0.3s ease;
}

.main-service__title {
  font-size: 2rem;
  font-weight: 600;
  transition: all 0.3s ease;
}
@media screen and (max-width: 768px) {
  .main-service__title {
    font-size: 1.6rem;
  }
}

.main-service__item:hover .main-service__title,
.main-service__item:focus-visible .main-service__title {
  color: var(--primary-color);
}
.main-service__item:hover::after,
.main-service__item:focus-visible::after {
  right: 2.3rem;
}
@media screen and (max-width: 768px) {
  .main-service__item:hover::after,
  .main-service__item:focus-visible::after {
    right: 1.5rem;
  }
}

.main-site {
  width: 100%;
  padding: 3rem 0 0;
  margin: 4rem 0 0 0;
  border-top: solid 1px #dbdbdb;
}
@media screen and (max-width: 768px) {
  .main-site {
    padding: 2rem 0;
    margin: 4rem 0 0;
  }
}

.main-site-inner {
  display: flex;
  max-width: 145.2rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.6rem;
  box-sizing: border-box;
  align-items: center;
  flex-flow: row wrap;
}
@media screen and (max-width: 768px) {
  .main-site-inner {
    flex-flow: row wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 1.6rem 0.8rem;
  }
}

.main-site__title {
  margin: 0 3.2rem 0 0;
  font-size: 2.8rem;
  font-weight: 700;
  white-space: nowrap;
  order: 1;
}
@media screen and (max-width: 768px) {
  .main-site__title {
    margin-right: auto;
    font-size: 2rem;
  }
}

.main-site-swiper {
  width: calc(100% - 33rem);
  order: 4;
  margin: 0 0 0 auto;
}
.main-site-swiper::after {
  display: block;
  width: 10rem;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  content: "";
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.2), rgb(255, 255, 255));
}
@media screen and (max-width: 768px) {
  .main-site-swiper {
    width: 100%;
    margin: 0;
    overflow: visible;
  }
  .main-site-swiper::after {
    display: none;
  }
}

.main-site__item {
  width: 26.8rem;
  height: 5.5rem;
  overflow: hidden;
  box-sizing: border-box;
  opacity: 0.6;
  border-radius: 0.6rem;
  border: solid 1px #dbdbdb;
  font-size: 0;
  transition: all 0.3s ease;
}
.main-site__item:hover, .main-site__item:focus-visible {
  opacity: 1;
}

.main-site__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.main-site__item:hover .main-site__img {
  transform: scale(1.05);
}

.main-site__navi {
  display: flex;
  gap: 0.5rem;
  order: 3;
}

.main-site__navi__btn {
  width: 2rem;
  height: 2rem;
  font-size: 0;
  opacity: 0.6;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: all 0.3s ease;
}
.main-site__navi__btn.swiper-button-lock {
  display: block;
}
.main-site__navi__btn:hover {
  opacity: 1;
}

.main-site__navi__btn--prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(85,85,85,1)'%3E%3Cpath d='M7.82843 10.9999H20V12.9999H7.82843L13.1924 18.3638L11.7782 19.778L4 11.9999L11.7782 4.22168L13.1924 5.63589L7.82843 10.9999Z'%3E%3C/path%3E%3C/svg%3E");
}
@media screen and (max-width: 768px) {
  .main-site__navi__btn--prev {
    display: none;
  }
}

.main-site__navi__btn--next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(85,85,85,1)'%3E%3Cpath d='M16.1716 10.9999L10.8076 5.63589L12.2218 4.22168L20 11.9999L12.2218 19.778L10.8076 18.3638L16.1716 12.9999H4V10.9999H16.1716Z'%3E%3C/path%3E%3C/svg%3E");
}
@media screen and (max-width: 768px) {
  .main-site__navi__btn--next {
    display: none;
  }
}

.main-site__navi__btn--pause {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(85,85,85,1)'%3E%3Cpath d='M6 5H8V19H6V5ZM16 5H18V19H16V5Z'%3E%3C/path%3E%3C/svg%3E");
}

.main-site__navi__btn--play {
  display: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='rgba(85,85,85,1)'%3E%3Cpath d='M16.3944 12.0001L10 7.7371V16.263L16.3944 12.0001ZM19.376 12.4161L8.77735 19.4818C8.54759 19.635 8.23715 19.5729 8.08397 19.3432C8.02922 19.261 8 19.1645 8 19.0658V4.93433C8 4.65818 8.22386 4.43433 8.5 4.43433C8.59871 4.43433 8.69522 4.46355 8.77735 4.5183L19.376 11.584C19.6057 11.7372 19.6678 12.0477 19.5146 12.2774C19.478 12.3323 19.4309 12.3795 19.376 12.4161Z'%3E%3C/path%3E%3C/svg%3E");
}

.main-site__pagination {
  display: flex;
  width: 4.2rem;
  order: 2;
  gap: 0.6rem;
  margin: 0 3rem 0 0;
  position: static;
  color: #999;
  font-size: 2rem;
  white-space: nowrap;
}
.main-site__pagination.swiper-pagination-lock {
  display: flex;
}
.main-site__pagination .swiper-pagination-current {
  color: var(--primary-color);
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .main-site__pagination {
    margin: 0;
    font-size: 1.8rem;
  }
}

.title-1 {
  padding: 0 0 1.6rem;
  font-size: 2.4rem;
  font-weight: 600;
}

.title-1--deco {
  padding: 0 0 1.6rem 2.4rem;
  background-repeat: no-repeat;
  background-position: left top 0.9rem;
  background-size: 1.6rem auto;
  background-image: url("../images/title_deco_2.svg");
}

.list-1 {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.list-1 > li {
  position: relative;
  padding-left: 2rem;
  box-sizing: border-box;
  text-align: left;
  font-size: 2rem;
  font-weight: 600;
}
.list-1 > li::before {
  display: block;
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  box-sizing: border-box;
  border-radius: 50%;
  border: 0.3rem solid #339AFF;
  background-color: transparent;
  position: absolute;
  left: 0;
  top: 0.75rem;
}
.list-1 .list-2,
.list-1 .list-3 {
  padding: 1rem 0 0;
}
.list-1 .table-scroll,
.list-1 .table {
  margin: 1rem 0 0;
}
.list-1 .btn-container {
  padding: 1rem 0 0;
}

.list-2 {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.list-2 > li {
  position: relative;
  padding-left: 2rem;
  box-sizing: border-box;
  font-size: 1.8rem;
  font-weight: 500;
  color: #252525;
}
.list-2 > li::before {
  display: block;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  box-sizing: border-box;
  border-radius: 50%;
  background-color: #B6D002;
  position: absolute;
  left: 0;
  top: 0.9rem;
}

.list-3 {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.list-3 > li {
  padding: 0 0 0 1.6rem;
  box-sizing: border-box;
  position: relative;
  color: #444;
  text-align: left;
  font-size: 1.6rem;
  font-weight: 400;
}
.list-3 > li::before {
  display: block;
  content: "";
  width: 0.8rem;
  height: 1px;
  background-color: #B6D002;
  position: absolute;
  left: 0;
  top: 1rem;
}

.table-list-1 {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.table-list-1 > li {
  padding: 0 0 0 1.2rem;
  position: relative;
  text-align: left;
  font-size: 1.6rem;
  font-weight: 400;
}
.table-list-1 > li::before {
  display: block;
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #009FE3;
  position: absolute;
  left: 0;
  top: 0.9rem;
}

.table-list-2 {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.table-list-2 > li {
  padding: 0 0 0 1.2rem;
  position: relative;
  text-align: left;
  font-size: 1.5rem;
  font-weight: 400;
  color: #444;
}
.table-list-2 > li::before {
  display: block;
  content: "";
  width: 0.4rem;
  height: 0.1rem;
  border-radius: 0;
  background-color: #009FE3;
  position: absolute;
  left: 0;
  top: 0.9rem;
}

li > .table-list-2 {
  padding-top: 0.6rem 0 0;
}

.num-list-1 {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.num-list-1 > li {
  font-size: 1.8rem;
}
.num-list-1 ul,
.num-list-1 ol,
.num-list-1 p {
  padding: 1rem 0 0 2rem;
}

.num-list-2 {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.num-list-2 > li {
  font-size: 1.6rem;
  color: #444;
}
.num-list-2 ul,
.num-list-2 ol,
.num-list-2 p {
  padding: 1rem 0 0 1.6rem;
}

.online-area {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.online-item {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 2.8rem 2.8rem;
  box-sizing: border-box;
  border-radius: 1rem;
  border: solid 1px #c1c8d0;
  background-color: #fff;
}
.online-item::before {
  display: block;
  content: "";
  width: 8rem;
  height: 8rem;
  margin: 0 2.8rem 0 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.online-item--1::before {
  background-image: url("../images/online_deco_1.png");
}

.online-item--2::before {
  background-image: url("../images/online_deco_2.png");
}

.online-item--3::before {
  background-image: url("../images/online_deco_3.png");
}

.online-item--4::before {
  background-image: url("../images/online_deco_4.png");
}

.online-info {
  flex: 1;
  margin: 0 8rem 0 0;
}

.online-info__title {
  font-size: 2rem;
  font-weight: 600;
}

.online-info__desc {
  padding: 0.8rem 0 0;
  color: #555;
  font-size: 1.6rem;
}

.online-item .btn-container {
  padding: 0;
}
.online-item .btn-container .btn {
  min-height: 5rem;
  font-size: 1.8rem;
}

.lib-info-container {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  gap: 6rem;
}

.lib-info {
  flex: 1;
}

.lib-info-content {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 2rem 0 0;
  border-top: solid 1px #000;
}

.lib-info-text-1 {
  font-size: 1.8rem;
  font-weight: 500;
}

.lib-info-text-2 {
  color: #8F8F8F;
}

.lib-note-container {
  display: flex;
  flex-flow: row wrap;
  gap: 2rem 2rem;
}

.lib-note {
  display: flex;
  width: calc(50% - 1rem);
  flex-direction: column;
  justify-content: center;
  gap: 1.2rem;
  padding: 2.8rem 2.8rem 2.8rem 11.6rem;
  box-sizing: border-box;
  border-radius: 2rem;
  background-color: #F4F4F4;
  background-repeat: no-repeat;
  background-position: left 2.8rem center;
}

.lib-note--1 {
  background-image: url("../images/lib_note_deco_1.svg");
}

.lib-note--2 {
  background-image: url("../images/lib_note_deco_2.svg");
}

.lib-note--3 {
  background-image: url("../images/lib_note_deco_3.svg");
}

.lib-note--4 {
  background-image: url("../images/lib_note_deco_4.svg");
}

.lib-note--5 {
  background-image: url("../images/lib_note_deco_5.svg");
}

.lib-note--6 {
  background-image: url("../images/lib_note_deco_6.svg");
}

.lib-note--7 {
  background-image: url("../images/lib_note_deco_7.svg");
}

.lib-note-title {
  font-size: 2rem;
  font-weight: 700;
}

.lib-note-list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.lib-note-item {
  padding: 0 0 0 1.2rem;
  position: relative;
  font-size: 1.8rem;
}
.lib-note-item::before {
  display: block;
  content: "";
  width: 0.6rem;
  height: 0.1rem;
  position: absolute;
  left: 0;
  top: 1.1rem;
  background-color: #252525;
}

.dataroom-content {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 3.2rem;
  padding: 2.8rem 2.8rem;
  box-sizing: border-box;
  border-radius: 1.2rem;
  border: 1px solid #e6e6e6;
}

.dataroom-img-area {
  display: flex;
  flex-flow: row wrap;
  gap: 1.6rem;
}

.dataroom-img-item {
  flex: 1;
  aspect-ratio: 674/310;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 0.4rem;
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.dataroom-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.dataroom-desc {
  font-size: 2rem;
  font-weight: 500;
}

.dataroom-info-area {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.dataroom-info {
  display: flex;
  align-items: flex-start;
  padding: 0 0 0 2rem;
  box-sizing: border-box;
  position: relative;
}
.dataroom-info::before {
  display: block;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background-color: #B6D002;
  position: absolute;
  left: 0;
  top: 0.8rem;
}

.dataroom-info__title {
  width: 14rem;
  font-size: 1.8rem;
  font-weight: 600;
}

.dataroom-info__value {
  flex: 1;
  font-size: 1.8rem;
}

.dataroom-content .btn-container {
  padding: 0;
}

.proce-list--hope li:nth-child(3n-2) .proce-item__step {
  background-color: var(--primary-color);
}
.proce-list--hope li:nth-child(3n-1) .proce-item__step {
  background-color: var(--tertiary-color);
}
.proce-list--hope li:nth-child(3n) .proce-item__step {
  background-color: var(--quaternary-color);
}

.list-1 + .proce-wrap {
  margin: 1.6rem 0 0;
}

.info-area {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  gap: 3rem;
  padding: 3.2rem 3.2rem;
  margin: 0 0 4rem;
  border-radius: 1.6rem;
  background-color: var(--primary-light);
}
.info-area::before {
  display: block;
  content: "";
  width: 15rem;
  height: 10rem;
  border-radius: 0.8rem;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
}

.info-area--bookeum::before {
  background-size: 9.8rem;
  background-image: url("../images/bookeum_logo.png");
}

.info-area--bookbada::before {
  background-size: 11.8rem;
  background-image: url("../images/bookbada_logo.png");
}

.info-area--booknare::before {
  background-size: 9.4rem;
  background-image: url("../images/booknare_logo.png");
}

.info-area--librarian::before {
  background-size: 13.4rem;
  background-image: url("../images/librarian_logo.png");
}

.info-area--origin::before {
  width: 6rem;
  height: 6rem;
  border-radius: 0;
  background-color: transparent;
  background-size: contain;
  background-image: url("../images/origin_logo.png");
}

.info-box {
  flex: 1;
}

.info-title {
  font-size: 2.4rem;
  font-weight: 700;
}

.info-desc {
  padding: 1rem 0 0;
  font-size: 1.8rem;
}

.info-area .btn-container {
  padding: 0;
}

.proce-wrap {
  padding: 2rem 2rem;
  box-sizing: border-box;
  background-color: #F4F4F4;
}

.proce-list {
  display: flex;
  flex-flow: row wrap;
  gap: 2rem 0;
}

.proce-item {
  flex: 1;
  position: relative;
}

.proce-item + .proce-item {
  padding: 0 0 0 5rem;
  position: relative;
}
.proce-item + .proce-item::before {
  display: block;
  content: "";
  width: 1rem;
  height: 1.8rem;
  position: absolute;
  left: 2rem;
  top: 50%;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("../images/proce_arrow.svg");
  font-size: 0;
}

.proce-list--bookbada .proce-item {
  flex: 1 1 calc(33.3333333333% - 5rem);
}

.proce-item__inner {
  display: flex;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  padding: 2.4rem 2.4rem;
  box-sizing: border-box;
  border-radius: 0.6rem;
  border: solid 1px #c1c8d0;
  background-color: #fff;
}

.proce-item__step {
  display: flex;
  width: 2.8rem;
  height: 2.8rem;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  background-color: var(--tertiary-color);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
}

.proce-item__status {
  text-align: center;
  font-size: 1.8rem;
  font-weight: 600;
}
.proce-item__status a:hover,
.proce-item__status a:focus-visible {
  color: #0091e7;
}

.proce-item__exl {
  color: #555;
  text-align: center;
}

.link-wrap {
  padding: 2rem 2rem;
  box-sizing: border-box;
  background-color: #F4F4F4;
}

.link-container {
  display: flex;
  flex-flow: row wrap;
  gap: 2rem;
}

.link-item {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 5rem 2rem;
  box-sizing: border-box;
  border-radius: 0.6rem;
  border: solid 1px #c1c8d0;
  background-color: #fff;
}

.link-item__img {
  height: 4rem;
}

.link-item__title {
  padding: 3rem 0 0;
  font-size: 2.4rem;
  font-weight: 700;
}

.link-item .btn-container {
  padding: 3rem 0 0;
}

.charter-header {
  display: flex;
  width: 100%;
  flex-flow: row wrap;
  justify-content: center;
  padding: 6rem 6rem;
  box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 1rem;
}
.charter-header__title {
  font-size: 3rem;
  font-weight: 700;
  color: #1F36A9;
}
.charter-header__desc {
  padding-top: 2.4rem;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 500;
}

.charter-list-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4rem 0 0;
}

.charter-list {
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
  counter-reset: charter;
}
.charter-list__item {
  padding: 0.4rem 0 0.4rem 4.8rem;
  font-size: 1.8rem;
  position: relative;
}
.charter-list__item::before {
  display: flex;
  width: 3.2rem;
  height: 3.2rem;
  align-items: center;
  justify-content: center;
  content: counter(charter);
  counter-increment: charter;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  border-radius: 50%;
  background-color: #1F36A9;
  position: absolute;
  left: 0;
  top: 0;
}
.charter-list-desc {
  padding-top: 2rem;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
}

.ci-main-img {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  padding: 6rem 3rem;
  box-sizing: border-box;
  border: 1px solid #c1c8d0;
  border-radius: 1rem;
  background-color: #fff;
}
.ci-main-img img {
  max-width: 45.6rem;
  width: 100%;
}

.ci-main-content {
  padding: 3.2rem 0 0;
}

.ci-main-title {
  text-align: center;
  font-size: 4.2rem;
  font-weight: 700;
  color: var(--main-color);
}

.ci-main-desc {
  max-width: 90rem;
  width: 100%;
  margin: 0 auto;
  padding: 3.2rem;
  text-align: center;
  font-size: 1.8rem;
  line-height: 1.5;
}

.ci-box {
  display: flex;
  width: 100%;
  min-height: 24rem;
  justify-content: center;
  align-items: center;
  padding: 2rem 2rem;
  box-sizing: border-box;
  border-radius: 0.6rem;
  border: solid 1px #ccc;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url("../images/grid_bg.jpg");
}

.ci-item-container {
  display: flex;
  flex-flow: row wrap;
  gap: 2.4rem;
}

.ci-item {
  display: flex;
  flex: 1 1 calc(33.3333333333% - 2.4rem);
  flex-direction: column;
  gap: 1.2rem;
}
.ci-item--4 {
  flex: 1 1 calc(25% - 2.4rem);
}

.ci-title {
  padding: 0 0 0 1.6rem;
  position: relative;
  font-size: 1.8rem;
  font-weight: 500;
}
.ci-title::before {
  display: block;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background-color: #B6D002;
  position: absolute;
  left: 0;
  top: 0.8rem;
}

.ci-img--1 {
  max-width: 22.6rem;
  width: 100%;
}

.ci-img--2 {
  max-width: 23rem;
  width: 100%;
}

.ci-img--3 {
  max-width: 26rem;
  width: 100%;
}

.ci-img--4 {
  max-width: 12rem;
  width: 100%;
}

.ci-img--5 {
  max-width: 25.8rem;
  width: 100%;
}

.ci-img--6 {
  max-width: 12.4rem;
  width: 100%;
}

.ci-img--7 {
  max-width: 28.6rem;
  width: 100%;
}

.ci-img--8 {
  max-width: 28.2rem;
  width: 100%;
}

.ci-img--9 {
  max-width: 28.6rem;
  width: 100%;
}

.ci-img--10 {
  max-width: 14.4rem;
  width: 100%;
}

.ci-img--11 {
  max-width: 28.2rem;
  width: 100%;
}

.ci-img--12 {
  max-width: 14.4rem;
  width: 100%;
}

.ci-img--13 {
  max-width: 24rem;
  width: 100%;
}

.ci-img--14 {
  max-width: 11.2rem;
  width: 100%;
}

.ci-img--15 {
  max-width: 23.8rem;
  width: 100%;
}

.ci-img--16 {
  max-width: 11.4rem;
  width: 100%;
}

.ci-img--17 {
  max-width: 12rem;
  width: 100%;
}

.ci-img--18 {
  max-width: 11.8rem;
  width: 100%;
}

.color-layout-area {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
}

.color-layout {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.color-layout--1 {
  flex: 1;
  flex-flow: row wrap;
}
.color-layout--2 {
  flex: 2 1 0;
}
.color-layout--2-1 {
  flex: 1;
}
.color-layout--2-2 {
  flex: 1;
}
.color-layout--3 {
  flex: 1 1 0;
}
.color-layout--3-1 {
  flex: 1;
}
.color-layout--3-2 {
  flex: 1;
}

.color-item {
  display: flex;
  width: 100%;
  height: 100%;
  padding: 3rem 3rem;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.color-item--1 {
  background-color: #273890;
}
.color-item--2 {
  background-color: #00AEEF;
}
.color-item--3 {
  background-color: #B2D233;
}
.color-item--4 {
  background-color: #8B734B;
}
.color-item--5 {
  background-color: #8B9091;
}

.color-title {
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 1;
  color: #fff;
}

.color-desc-box {
  padding: 2rem 0 0;
}

.color-desc {
  display: flex;
}
.color-desc__title {
  width: 9.6rem;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  color: #fff;
}
.color-desc__value {
  flex: 1;
  font-size: 1.8rem;
  line-height: 1;
  white-space: nowrap;
  color: #fff;
}
.color-desc + .color-desc {
  padding: 1.2rem 0 0;
}

.history-header {
  width: 100%;
  height: 22rem;
  padding: 4rem 2rem 0;
  box-sizing: border-box;
  border-radius: 0.4rem;
  position: relative;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url("../images/history_bg.jpg");
}
.history-header::before {
  display: block;
  content: "";
  width: 2.4rem;
  height: 6.4rem;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url("../images/history_bg_deco.svg");
}

.history-title {
  text-align: center;
  font-size: 6rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
}

.history-desc {
  padding: 2rem 0 0;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1;
  color: #fff;
}

.history-container {
  display: flex;
  flex-direction: column;
  gap: 8rem;
  padding: 8rem 0;
  position: relative;
}
.history-container::before {
  display: block;
  content: "";
  width: 0.1rem;
  height: 100%;
  background-color: #e6e6e6;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}
.history-container::after {
  display: block;
  content: "";
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background-color: #e6e6e6;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

.history-list {
  display: flex;
  align-items: flex-start;
}
.history-list__title {
  display: flex;
  width: 50%;
  justify-content: flex-end;
  padding: 0 21.2rem 0 0;
  box-sizing: border-box;
  font-size: 5.6rem;
  font-weight: 700;
  line-height: 1;
  color: #339AFF;
  position: relative;
}
.history-list__title::before {
  display: block;
  content: "";
  width: 20rem;
  height: 0.1rem;
  background-color: #339AFF;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.history-list__title::after {
  display: block;
  content: "";
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background-color: #339AFF;
  position: absolute;
  right: -0.3rem;
  top: 50%;
  transform: translateY(-50%);
}
.history-list__content {
  display: flex;
  width: 50%;
  flex-direction: column;
  gap: 1.2rem;
  padding: 2rem 0 0 5rem;
  box-sizing: border-box;
}

.timeline-list {
  display: flex;
  align-items: flex-start;
  gap: 0 1.2rem;
}
.timeline-list__title {
  min-width: 4rem;
  font-size: 2rem;
  font-weight: 600;
  color: #339AFF;
}
.timeline-list__value {
  font-size: 2rem;
}

.orgchart-area {
  display: flex;
  justify-content: center;
  flex-direction: column;
  margin: 0 0 6rem;
}

.orgchart-1depth {
  position: relative;
  max-width: 44.2rem;
  margin: 0 auto;
  padding: 3.8rem;
  border-radius: 1rem;
  background: #1d9f6f;
  box-shadow: 0.4rem 0.4rem 1.3rem 0 rgba(29, 159, 111, 0.4);
}
.orgchart-1depth__title {
  display: block;
  text-align: center;
  color: #fff;
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -0.028rem;
}
.orgchart-1depth::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4.8rem;
  transform: translateX(-50%);
  width: 0.1rem;
  height: 4.8rem;
  background: #999;
}

.orgchart-2depth {
  position: relative;
  display: flex;
  gap: 4.8rem;
  padding-top: 9.5rem;
}
.orgchart-2depth__item {
  position: relative;
  display: flex;
  justify-content: center;
  width: calc(25% - 3.6rem);
  padding: 3rem 0;
  border-radius: 1rem;
  border: 0.1rem solid #999;
  background: #fff;
  box-shadow: 0.4rem 0.4rem 1rem 0 rgba(0, 0, 0, 0.1);
}
.orgchart-2depth__item::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -4.8rem;
  width: 0.1rem;
  height: 4.8rem;
  background: #999;
}
.orgchart-2depth__title {
  color: #151515;
  font-size: 2.4rem;
  line-height: 100%;
  font-weight: 500;
  letter-spacing: -0.024rem;
}
.orgchart-2depth::before {
  content: "";
  position: absolute;
  top: 4.8rem;
  left: 50%;
  width: calc((25% + 1.2rem) * 3);
  height: 0.1rem;
  background: #999;
  transform: translateX(-50%);
}

.org-info-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 6.8rem;
  margin-top: 4rem;
  padding: 2.4rem 0;
  background: #f4f4f4;
}

.org-info {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 1.6rem;
}
.org-info__title {
  position: relative;
  display: flex;
  align-items: center;
  color: #151515;
  font-size: 2rem;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -0.02rem;
}
.org-info__title::before {
  content: "";
  display: inline-flex;
  width: 3.2rem;
  height: 3.2rem;
  margin-right: 1.2rem;
}
.org-info__title--tel::before {
  background: url("../images/icon_orangize_tel.svg") no-repeat 0 0;
  background-size: cover;
}
.org-info__title--fax::before {
  background: url("../images/icon_orangize_fax.svg") no-repeat 0 0;
  background-size: cover;
}
.org-info__value {
  color: #151515;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 100%;
  letter-spacing: -0.018rem;
}

.vision-wrap {
  display: flex;
  flex-direction: column;
  gap: 6rem 0;
}

.vision-area-wrap {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.vision-area {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0 2.4rem;
}

.vision-title-box {
  display: flex;
  width: 10rem;
  padding: 2rem 0;
  align-items: center;
  flex-direction: column;
}

.vision-title {
  flex: 1;
  width: 100%;
  padding-bottom: 1.2rem;
  border-bottom: 0.2rem solid #339AFF;
  font-weight: 600;
  text-align: center;
  font-size: 2rem;
  line-height: 130%;
  letter-spacing: -0.1rem;
}
.vision-title + .vision-title {
  margin-top: 16rem;
}

.vision-add-text {
  display: none;
}

.vision-content {
  flex: 1;
}

.vision-area-container {
  display: flex;
  gap: 6rem;
}

.vision-text {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  gap: 1.6rem;
  width: 100%;
  padding: 2rem 2rem;
  box-sizing: border-box;
  border: 0.1rem solid rgba(0, 0, 0, 0.2);
  border-radius: 1rem;
}
.vision-text__item {
  text-align: center;
  font-size: 4rem;
  font-weight: 700;
  line-height: 130%;
}

.vision-desc-area {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.vision-desc {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.vision-desc__title {
  padding: 2rem;
  box-sizing: border-box;
  border-radius: 1rem;
  color: #fff;
  font-size: 2.4rem;
  font-weight: 700;
}
.vision-desc__value {
  width: calc(100% - 170px);
  padding: 2rem;
  box-sizing: border-box;
  border: 0.1rem solid #ccc;
  border-radius: 1rem;
  font-size: 2.4rem;
  font-weight: 500;
  word-break: keep-all;
}

.vision-step-container {
  display: flex;
  flex-flow: row wrap;
  gap: 1.8rem;
}

.vision-step {
  flex: 1;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

.vision-step__title {
  padding: 4rem 2rem 2.8rem;
  border: 0.1rem solid #ccc;
  border-bottom: 0 none;
  border-radius: 1rem 1rem 0 0;
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  box-sizing: border-box;
}

.vision-step__content {
  display: flex;
  flex-direction: column;
  padding: 2.4rem 2rem;
  border-radius: 0 0 1rem 1rem;
  word-break: keep-all;
  position: relative;
}

.vision-step__value {
  text-align: center;
  font-size: 2.4rem;
  font-weight: 700;
  color: #fff;
}

.vision-step__list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  margin-top: 2rem;
  padding: 3.8rem 2rem;
  border: 1px solid #dbdbdb;
  border-radius: 1rem;
}
.vision-step__list > li {
  position: relative;
  padding-left: 1.2rem;
  font-size: 1.8rem;
  font-weight: 500;
  word-break: keep-all;
  letter-spacing: -0.018rem;
  color: #151515;
}
.vision-step__list > li::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 0;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background: #151515;
}

.vision-step__sub-list {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  padding-top: 1.6rem;
}
.vision-step__sub-list > li {
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  font-weight: 400;
}
.vision-step__sub-list > li::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 0;
  width: 0.8rem;
  height: 0.1rem;
  background-color: #151515;
}

.vision-step--1 .vision-step__title {
  border-color: var(--tertiary-color);
}
.vision-step--1 .vision-step__content {
  background-color: var(--tertiary-color);
}
.vision-step--1 .vision-step__list {
  border-color: var(--tertiary-color);
}

.vision-step--2 .vision-step__title {
  border-color: var(--secondary-color);
}
.vision-step--2 .vision-step__content {
  background-color: var(--secondary-color);
}
.vision-step--2 .vision-step__list {
  border-color: var(--secondary-color);
}

.vision-step--3 .vision-step__title {
  border-color: var(--quaternary-color);
}
.vision-step--3 .vision-step__content {
  background-color: var(--quaternary-color);
}
.vision-step--3 .vision-step__list {
  border-color: var(--quaternary-color);
}

.vision-step--4 .vision-step__title {
  border-color: var(--main-color);
}
.vision-step--4 .vision-step__content {
  background-color: var(--main-color);
}
.vision-step--4 .vision-step__list {
  border-color: var(--main-color);
}

.map-info-area {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 3rem 3rem;
  margin-top: 4rem;
  padding: 4rem;
  background: #f4f4f4;
  box-sizing: border-box;
}

.map-info__title {
  color: #151515;
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -0.028rem;
}
.map-info__list {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  margin-top: 2.4rem;
}
.map-info__item {
  display: flex;
  align-items: flex-start;
  gap: 0 1.6rem;
}
.map-info__item-title {
  position: relative;
  display: flex;
  align-items: center;
  color: #151515;
  font-size: 2rem;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -0.02rem;
}
.map-info__item-title::before {
  content: "";
  display: inline-flex;
  width: 3.2rem;
  height: 3.2rem;
  margin-right: 1.2rem;
}
.map-info__item--address .map-info__item-title::before {
  background: url("../images/icon_orangize_spot.svg") no-repeat 0 0;
  background-size: cover;
}
.map-info__item--tel .map-info__item-title::before {
  background: url("../images/icon_orangize_tel.svg") no-repeat 0 0;
  background-size: cover;
}
.map-info__item--fax .map-info__item-title::before {
  background: url("../images/icon_orangize_fax.svg") no-repeat 0 0;
  background-size: cover;
}
.map-info__item--bus .map-info__item-title::before {
  background: url("../images/icon_orangize_bus.svg") no-repeat 0 0;
  background-size: cover;
}
.map-info + .map-info {
  margin-top: 1.2rem;
}
.map-info__item-content {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  padding: 0.2rem 0;
  color: #151515;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 1.6;
}

.map-sketch {
  max-width: 66rem;
  width: 100%;
}
.map-sketch__img {
  border-radius: 1rem;
}
.map-sketch__img--web {
  display: block;
}
.map-sketch__img--mobile {
  display: none;
}

.map-link {
  width: 17.2rem;
  height: 17.2rem;
  border-radius: 1rem;
  background: #172a88;
}
.map-link a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 1.6rem 0;
  width: 100%;
  height: 100%;
}
.map-link a span {
  color: #fff;
  font-size: 2rem;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -0.02rem;
}
.map-link a::before {
  content: "";
  display: block;
  width: 4rem;
  height: 4rem;
  background: url("../images/icon_spot.svg") no-repeat 0 0;
  background-size: cover;
}

.location-map {
  width: 100%;
  height: 40rem;
  box-sizing: border-box;
  border: solid 1px #dbdbdb;
}
.location-map .root_daum_roughmap .wrap_map {
  height: 100%;
}
.location-map .wrap_controllers {
  display: none;
}

.facility-nav {
  display: flex;
  justify-content: center;
  margin-bottom: 4rem;
}
@media screen and (max-width: 768px) {
  .facility-nav {
    width: 100%;
  }
}
.facility-nav__item {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 10rem;
  width: 100%;
  height: 5.4rem;
  box-sizing: border-box;
  border: solid 1px #dbdbdb;
  border-left-color: transparent;
  border-right-color: transparent;
  background-color: #fff;
  color: #666;
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .facility-nav__item {
    flex: 1;
    max-width: initial;
    height: 4.5rem;
    font-size: 1.8rem;
  }
}
.facility-nav__item:first-of-type {
  border-left-color: #dbdbdb;
}
.facility-nav__item:last-of-type {
  border-right-color: #dbdbdb;
}
.facility-nav__item:hover {
  color: #151515;
  background-color: #f2f2f2;
}
.facility-nav__item.is-active {
  font-weight: 600;
  color: #fff;
  border-color: var(--main-color);
  background-color: var(--main-color);
}
.facility-nav__text {
  position: relative;
}
.facility-nav__item.is-active .facility-nav__text::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 0.1rem;
  background-color: #fff;
}
@media screen and (max-width: 768px) {
  .facility-nav__item.is-active .facility-nav__text::after {
    bottom: 0.1rem;
  }
}

.facility-content {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 6rem;
  box-sizing: border-box;
  border: solid 1px #dbdbdb;
}
.facility-content.is-active {
  display: flex;
}
@media screen and (max-width: 768px) {
  .facility-content {
    padding: 2rem;
  }
}

.facility-img-desc {
  display: none;
  font-size: 1.4rem;
  padding-bottom: 2rem;
  color: #888;
}
.facility-img--desktop {
  display: block;
}
@media screen and (max-width: 768px) {
  .facility-img--desktop {
    display: none;
  }
}
.facility-img--mobile {
  width: 100%;
  display: none;
}
@media screen and (max-width: 768px) {
  .facility-img--mobile {
    display: block;
  }
}
.facility-img img {
  width: 100%;
}

@media screen and (max-width: 1024px) {
  .charter-header {
    padding: 3rem 2rem;
  }
  .charter-header__title {
    font-size: 2.4rem;
  }
  .charter-header__desc {
    padding-top: 2rem;
    font-size: 1.6rem;
  }
  .charter-list__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    padding: 0;
    text-align: center;
    font-size: 1.6rem;
  }
  .charter-list__item::before {
    position: static;
  }
  .emblem-area .ci-box {
    flex: 1 1 100%;
  }
  .emblem-info-area {
    flex: 1 1 100%;
  }
}
@media screen and (max-width: 768px) {
  .badge-box {
    gap: 0.4rem;
  }
  .badge-status {
    padding: 0.8rem 1.2rem;
  }
  .badge-new {
    width: 2rem;
    height: 2rem;
  }
  .btn--lg {
    height: 4rem;
    font-size: 1.6rem;
  }
  .page-navi {
    align-items: initial;
  }
  .page-navi__title {
    position: fixed;
    left: -99999px;
    top: -99999px;
  }
  .page-navi__value {
    padding: 1.6rem 0;
  }
  .page-navi__value .page-navi__link {
    padding: 0 0 0 2.4rem;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .page-navi__value--next .page-navi__link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z'%3E%3C/path%3E%3C/svg%3E");
  }
  .page-navi__value--prev .page-navi__link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' fill='rgba(0,0,0,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  }
  .title-1 {
    font-size: 2rem;
  }
  .title-1--deco {
    padding: 0 0 1.6rem 2.2rem;
    background-position: left top 0.7rem;
    background-size: 1.4rem;
  }
  .content-desc {
    font-size: 1.6rem;
  }
  .list-3 > li {
    padding: 0 0 0 0.9rem;
    font-size: 1.4rem;
  }
  .list-3 > li::before {
    width: 0.3rem;
    height: 0.3rem;
    top: 0.8rem;
  }
  .hope-proce-area {
    flex-direction: column;
    gap: 4.2rem;
  }
  .hope-proce {
    flex-flow: row-reverse nowrap;
  }
  .hope-proce + .hope-proce::before {
    display: none;
  }
  .hope-proce__title {
    display: flex;
    width: 8rem;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
  }
  .hope-proce__content {
    flex: 1;
    flex-direction: column;
    justify-content: center;
    gap: 4.2rem;
  }
  .hope-step {
    flex: none;
    height: 5.6rem;
    flex-direction: row;
    padding: 0;
  }
  .hope-step::before,
  .hope-step + .hope-step::before {
    display: block;
    content: "다음단계";
    width: 1.8rem;
    height: 1rem;
    position: absolute;
    left: 50%;
    top: -2.1rem;
    transform: translate(-50%, -50%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("../images/proce_arrow_ver.svg");
    font-size: 0;
  }
  .hope-proce--1 .hope-step:first-of-type::before {
    display: none;
  }
  .hope-step__num {
    width: 2.4rem;
    height: 2.4rem;
    font-size: 1.4rem;
  }
  .table--bbs th,
  .table--bbs td {
    padding: 1.2rem 1rem;
    font-size: 1.4rem;
  }
  .table--bbs .th-datem,
  .table--bbs .td-date {
    width: 10rem;
  }
  .table--bbs tr:has(.badge-notice) td {
    background-color: var(--primary-light);
  }
  colgroup {
    display: none;
  }
  .lib-info-container {
    gap: 2.8rem;
  }
  .lib-info {
    flex: 1 1 100%;
  }
  .lib-info-content {
    gap: 0.8rem;
  }
  .lib-info-text-1 {
    font-size: 1.6rem;
  }
  .lib-note {
    flex: 1 1 100%;
    gap: 1rem;
    padding: 7.6rem 1.6rem 1.6rem;
    background-position: top 1.6rem center;
    background-size: 4.8rem;
  }
  .lib-note-title {
    text-align: center;
    font-size: 1.8rem;
  }
  .lib-note-list {
    gap: 0.6rem;
  }
  .lib-note-item {
    font-size: 1.6rem;
  }
  .lib-note-item::before {
    top: 0.9rem;
  }
  .info-area {
    gap: 1.6rem;
    padding: 1.6rem 1.6rem;
    border-radius: 1rem;
  }
  .info-area::before {
    width: 10rem;
    height: 7rem;
  }
  .info-area--bookeum::before {
    background-size: 6.8rem;
  }
  .info-area--bookbada::before {
    background-size: 7.8rem;
  }
  .info-area--booknare::before {
    background-size: 6.4rem;
  }
  .info-area--librarian::before {
    background-size: 8.4rem;
  }
  .info-area--origin::before {
    width: 5rem;
    height: 5rem;
  }
  .info-box {
    flex: 1 1 100%;
  }
  .info-title {
    text-align: center;
    font-size: 2rem;
  }
  .info-desc {
    text-align: center;
    font-size: 1.6rem;
  }
  .info-area .btn-container {
    width: 100%;
  }
  .info-area .btn {
    flex: 1;
  }
  .proce-list {
    gap: 5rem;
  }
  .proce-item {
    flex: 1 1 100%;
  }
  .proce-item + .proce-item {
    padding: 0;
  }
  .proce-item + .proce-item::before {
    width: 1.8rem;
    height: 1rem;
    background-image: url("../images/proce_arrow_ver.svg");
    left: 50%;
    top: -2.5rem;
    transform: translate(-50%, -50%);
  }
  .link-item {
    flex: 1 1 100%;
  }
  .link-item__title {
    padding: 2.4rem 0 0;
    font-size: 2rem;
  }
  .link-item .btn-container {
    width: 100%;
    padding: 2.4rem 0 0;
  }
  .link-item .btn {
    width: 100%;
  }
  .ci-item {
    flex: 1 1 100%;
  }
  .ci-box {
    min-height: 15rem;
  }
  .color-layout-area {
    flex-flow: column nowrap;
  }
  .history-header {
    height: auto;
    padding: 2rem 2rem;
  }
  .history-header::before {
    display: none;
  }
  .history-title {
    font-size: 3.2rem;
  }
  .history-desc {
    padding: 1rem 0 0;
    font-size: 1.6rem;
    line-height: 1.4;
  }
  .history-container {
    padding: 3rem 0;
    gap: 5rem;
  }
  .history-container::before {
    left: 8.7rem;
    transform: none;
  }
  .history-list__title {
    width: 9rem;
    justify-content: flex-start;
    padding: 0 3.2rem 0 0;
    font-size: 2rem;
  }
  .history-list__title::before {
    width: 2rem;
  }
  .history-list__title::after {
    right: 0;
  }
  .history-list__content {
    flex: 1;
    padding: 0 0 0 2rem;
  }
  .timeline-list__title {
    min-width: 3rem;
    font-size: 1.6rem;
  }
  .timeline-list__value {
    font-size: 1.6rem;
  }
  .orgchart-1depth {
    width: 100%;
    padding: 2.4rem 0;
    max-width: unset;
    box-sizing: border-box;
  }
  .orgchart-1depth__title {
    font-size: 2rem;
  }
  .orgchart-1depth::after {
    left: 3rem;
    top: auto;
    bottom: -30.5rem;
    height: 30.5rem;
  }
  .orgchart-2depth {
    flex-direction: column;
    gap: 2.4rem;
    padding-top: 2.4rem;
    margin-left: 5.2rem;
  }
  .orgchart-2depth__item {
    width: 100%;
    padding: 2rem 0;
  }
  .orgchart-2depth__item::before {
    top: 50%;
    left: -2.4rem;
    width: 2.4rem;
    height: 0.1rem;
    transform: translateY(-50%);
  }
  .orgchart-2depth__title {
    font-size: 1.8rem;
  }
  .orgchart-2depth::before {
    display: none;
  }
  .org-info-area {
    gap: 0;
    padding: 1.6rem;
  }
  .org-info {
    justify-content: center;
  }
  .org-info__title {
    font-size: 1.8rem;
  }
  .org-info__title::before {
    width: 2.8rem;
    height: 2.8rem;
  }
  .org-info__value {
    display: block;
    margin-top: 1.2rem;
    font-size: 1.8rem;
  }
  .vision-wrap {
    gap: 4rem;
  }
  .vision-area {
    justify-content: center;
  }
  .vision-title-box {
    width: auto;
    padding: 0 0 1.8rem;
  }
  .vision-title + .vision-title {
    display: none;
  }
  .vision-add-text {
    display: inline-block;
  }
  .vision-content {
    flex: 1 1 100%;
  }
  .vision-text__item {
    font-size: 2.8rem;
  }
  .vision-desc {
    flex-direction: column;
  }
  .vision-desc__title {
    width: 100%;
    text-align: center;
  }
  .vision-desc__value {
    width: 100%;
    text-align: center;
    font-size: 2rem;
  }
  .vision-step-container {
    flex-flow: column nowrap;
  }
  .vision-step {
    flex: none;
  }
  .vision-step + .vision-step::before {
    width: 6rem;
    height: 2rem;
    top: -3.8rem;
    left: 50%;
    transform: translateX(-50%);
  }
  .vision-step--2::before {
    background-image: url(../images/icon_vision_arrow_01_mo.svg);
  }
  .vision-step--3::before {
    background-image: url(../images/icon_vision_arrow_02_mo.svg);
  }
  .vision-area-container {
    flex-direction: column;
  }
  .vision-step--4 .vision-step__content,
  .vision-step--5 .vision-step__content {
    flex-direction: column;
  }
  .vision-step--4 .vision-step__value:first-of-type,
  .vision-step--5 .vision-step__value:first-of-type {
    border-radius: 0;
  }
  .vision-step--4 .vision-step__value:last-of-type,
  .vision-step--5 .vision-step__value:last-of-type {
    border-radius: 0 0 1rem 1rem;
  }
  .map-area {
    height: 40rem;
  }
  .map-info-area {
    padding: 2.4rem;
  }
  .map-info__title {
    font-size: 2rem;
    text-align: center;
  }
  .map-info__item {
    flex-direction: column;
    align-items: center;
    gap: 1.6rem 0;
  }
  .map-info__item strong {
    font-size: 1.8rem;
  }
  .map-info__item strong::before {
    width: 2.8rem;
    height: 2.8rem;
  }
  .map-info__item span {
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 140%;
    text-align: center;
  }
  .map-info__item + .map-info__item {
    margin-top: 2.4rem;
  }
  .map-sketch__img--web {
    display: none;
  }
  .map-sketch__img--mobile {
    display: block;
  }
}

/*# sourceMappingURL=edu_culture.css.map */