@import url('colors.css');

/* 프리텐다드 */
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
.font-pretendard {
  font-family: 'Pretendard', sans-serif;
}

/* 나눔스퀘어 라운드 */
@font-face {
  font-family: 'NanumSquare';
  font-weight: 400;
  src: url('https://cdn.rawgit.com/moonspam/NanumSquare/master/NanumSquareR.woff2') format('woff2');
}
.font-nanum {
  font-family: 'NanumSquare', sans-serif;
}

/* 고도체 */
@font-face {
  font-family: 'Godo';
  src:
    url('//cdn.jsdelivr.net/korean-webfonts/1/corps/godo/Godo/GodoM.woff2') format('woff2'),
    url('//cdn.jsdelivr.net/korean-webfonts/1/corps/godo/Godo/GodoM.woff') format('woff');
  font-weight: 400;
  font-display: swap;
}
.font-godo {
  font-family: 'Godo', sans-serif;
}

/* 여기어때 잘란체 */
@font-face {
  font-family: 'YeogiOttaeJalnanGothic';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/JalnanGothic.woff') format('woff');
  font-weight: normal;
  font-display: swap;
}
.font-jalnan {
  font-family: 'YeogiOttaeJalnanGothic', sans-serif;
}

/** 학교안심 날개 */
@font-face {
  font-family: 'SchoolSafetyWing';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/HakgyoansimNalgaeR.woff2') format('woff2');
  font-weight: normal;
  font-display: swap;
}
.font-schoolSafetyWing {
  font-family: 'SchoolSafetyWing', sans-serif;
}
/** 학교안심 보드마카 */
@font-face {
  font-family: 'SchoolSafeBoardMarker';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/HakgyoansimBoadmarkerR.woff2') format('woff2');
  font-weight: normal;
  font-display: swap;
}
.font-schoolSafeBoardMarker {
  font-family: 'SchoolSafeBoardMarker', sans-serif;
}
/** 온글잎 박다현체 */
@font-face {
  font-family: 'OngleipParkDahyeon';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2411-3@1.0/Ownglyph_ParkDaHyun.woff2') format('woff2');
  font-weight: normal;
  font-display: swap;
}
.font-ongleipParkDahyeon {
  font-family: 'OngleipParkDahyeon', sans-serif;
}
/** 산돌 삼립호빵체 */
@font-face {
  font-family: 'SandollSamlipHobbangBasic';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts-20-12@1.0/SDSamliphopangche_Basic.woff') format('woff');
  font-weight: normal;
  font-display: swap;
}
.font-sandollSamlipHobbangBasic {
  font-family: 'SandollSamlipHobbangBasic', sans-serif;
}
/** 원스토어 모바일고딕 */
@font-face {
  font-family: 'OneStoreMobileGothicBody';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-Regular.woff') format('woff');
  font-weight: normal;
  font-display: swap;
}
.font-oneStoreMobileGothicBody {
  font-family: 'OneStoreMobileGothicBody', sans-serif;
}
/** 수박화체 */
@font-face {
  font-family: 'Watermelon';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2210-EF@1.0/EF_watermelonSalad.woff2') format('woff2');
  font-weight: normal;
  font-display: swap;
}
.font-watermelon {
  font-family: 'Watermelon', sans-serif;
}
/** 카페24 고운밤 */
@font-face {
  font-family: 'Cafe24Gowoonbam';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Oneprettynight.woff') format('woff');
  font-weight: normal;
  font-display: swap;
}
.font-cafe24Gowoonbam {
  font-family: 'Cafe24Gowoonbam', sans-serif;
}
/** 강원교육모두체 */
@font-face {
  font-family: 'GangwonEducationModuche';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GangwonEdu_OTFLightA.woff') format('woff');
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: 'GangwonEducationModuche';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GangwonEdu_OTFBoldA.woff') format('woff');
  font-weight: 700;
  font-display: swap;
}
.font-gangwonEducationModuche {
  font-family: 'GangwonEducationModuche', sans-serif;
}

/* 로딩처리 애니메이션 */
@keyframes animetion-api-backdrop {
  50% {
    background-color: rgba(var(--bs-dark-rgb), 0.5);
  }
}

/* 섹션 타이틀 애니메이션 */
.section-title {
  position: relative;
}
.section-title::before {
  position: absolute;
  content: '';
  width: var(--section-title-width, 150px);
  height: 5px;
  left: 0;
  bottom: 0px;
  border-radius: 2px;
  background: var(--section-title-line, #000);
}
.section-title::after {
  position: absolute;
  content: '';
  width: 6px;
  height: 5px;
  bottom: 0px;
  background: #ffffff;
  animation: section-title-run 5s infinite linear;
}
@keyframes section-title-run {
  0% {
    left: 0;
  }
  50% {
    left: calc(var(--section-title-width, 150px) - 5px);
  }
  100% {
    left: 0;
  }
}
@keyframes section-title-run-center {
  0% {
    left: 50%;
    margin-left: -75px;
  }
  50% {
    left: 50%;
    margin-left: 45px;
  }
  100% {
    left: 50%;
    margin-left: -75px;
  }
}
@keyframes section-title-run-sm {
  0% {
    left: 0;
  }
  50% {
    left: 85px;
  }
  100% {
    left: 0;
  }
}