@charset "UTF-8";
@keyframes slide-in-fwd-br {
  0% {
    transform: translateZ(-1400px) translateY(800px) translateX(1000px);
    opacity: 0;
  }
  100% {
    transform: translateZ(0) translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes bounce {
  0% {
    transform: scale(0.2);
    -webkit-transform: scale(0.2);
    -moz-transform: scale(0.2);
    -ms-transform: scale(0.2);
    -o-transform: scale(0.2);
  }
  60% {
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
  }
  95% {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
  }
  100% {
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
  }
}
html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  line-height: 1.4;
  height: 100%;
  font-size: var(--font-size-base);
  font-family: var(--Pretendard);
  font-weight: 400;
  background-color: var(--background);
  color: var(--black);
  scroll-behavior: smooth;
  scroll-snap-type: y mandatory;
}

h1 {
  font-size: var(--font-size-lg);
  font-weight: 400;
}

h2 {
  font-size: var(--font-size-mlg);
  font-weight: 900;
}

h3 {
  font-size: var(--font-size-ml);
  font-weight: 900;
}

.relative {
  position: relative;
}

:root {
  /* fonts */
  --Pretendard: "Pretendard";
  --Montserrat: "Montserrat"
  /* font sizes */
  --font-size-st: max(.5625rem, min(1.75vw, .625rem)); /*10px*/
  --font-size-ss: max(.6875rem, min(2vw, .75rem)); /*12px*/
  --font-size-s: max(.75rem, min(2.8vw,.8125rem)); /*13px*/
  --font-size-ms: max(.75rem, min(2.8vw, .875rem)); /*14px*/
  --font-size-base: max(.875rem, min(3.2vw, 1rem)); /*16px*/
  --font-size-m: max(.9375rem, min(2.8vw, 1.125rem)); /*18px*/
  --font-size-ml: max(1rem, min(3.2vw, 1.25rem)); /*20px*/
  --font-size-mg: max(1.125rem, min(3.2vw, 1.375rem)); /*22px*/
  --font-size-mlg: max(1.125rem, min(3.2vw, 1.5rem)); /*24px*/
  --font-size-lg: max(1.25rem, min(2.6vw, 1.75rem)); /*28px*/
  --font-size-xlg: max(1.5rem, min(2.6vw, 2rem)); /*32px*/
  --font-size-xl: max(1.75rem, min(2.6vw, 2.25rem)); /*36px*/
  --font-size-xxlg: max(2rem, min(2.6vw, 2.5rem)); /*36px*/
  /* Colors */
  --black: #121212;
  --white: #fff;
  --pointcolor-01: #EB008B;
  --pointcolor-02: #C10606;
  --pointcolor-03: #2722AF;
  --graycolor01: #9E9E9E;
  --graycolor02: #818181;
  --graycolor03: #717171;
  --graycolor04: #4A4A4D;
  --graycolor05: #D9D9D9;
  --graycolor06: #EFEFEF;
  --graycolor07: #ECECEC;
  --graycolor08: #626262;
  --graycolor09: #e0e0e0;
  --graycolor10: #d8dde0;
  --placeholder: #b4b4b4;
  --label: #1C1C1E;
  --opacity-15: rgba(0,0,0,0.15);
  --opacity-20: rgba(0,0,0,0.20);
  --opacity-25: rgba(0,0,0,0.25);
  --opacity-30: rgba(0,0,0,0.30);
  --opacity-50: rgba(0,0,0,0.50);
  --box-shadow: 0em 2px 4px 2px rgba(38, 36, 62, 0.06);
  /* height */
  --h100vh: 100vh;
  --size-04: .25rem;
  --size-08: .5rem;
  --size-12: .75rem;
  --size-16: 1rem;
  --size-20: 1.25rem;
  --size-24: 1.5rem;
  --size-28: 1.75rem;
  --size-32: 2rem;
  --size-36: 2.25rem;
  --size-40: 2.5rem;
  --size-50: 3.125rem;
  --size-70: 4.375rem;
  --size-80: 5rem;
  --size-90: 5.625rem;
  --size-100: 6.25rem;
}

* ::not(.search-box) input:not(:checked), select, textarea, button {
  transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}
* ::not(.search-box) input:not(:checked):active, * ::not(.search-box) input:not(:checked):focus, select:active, select:focus, textarea:active, textarea:focus, button:active, button:focus {
  box-shadow: inset 0rem 0rem 0rem 0.125rem var(--pointcolor-01);
}

* {
  transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

textarea {
  outline: none;
  resize: none;
}

select {
  outline: none;
  -webkit-appearance: none; /* 크롬 화살표 없애기 */
  -moz-appearance: none; /* 파이어폭스 화살표 없애기 */
  appearance: none; /* 화살표 없애기 */
  border: 0.0625rem solid var(--graycolor05);
  border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -webkit-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -moz-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -ms-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -o-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  padding: var(--size-12) var(--size-50) var(--size-12) var(--size-20);
  min-width: 7.5rem;
  background: url(../public/select.svg) no-repeat calc(100% - 20px) center;
  font-size: var(--font-size-ms);
}
select ::-moz-placeholder {
  color: var(--graycolor10);
}
select ::placeholder {
  color: var(--graycolor10);
}

input {
  outline: none;
  border: 0.0625rem solid var(--graycolor09);
  border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -webkit-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -moz-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -ms-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -o-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
}
input ::-moz-placeholder {
  color: var(--placeholder);
}
input ::placeholder {
  color: var(--placeholder);
}

label input[type=radio] {
  width: var(--size-16);
  min-width: var(--size-16);
  max-width: var(--size-16);
  height: var(--size-16);
  border: 1.2px solid rgb(212, 212, 212);
  margin-right: var(--size-12);
  background-color: rgb(255, 255, 255);
  border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -webkit-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -moz-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -ms-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  -o-border-radius: 0.75rem 0.75rem 0.75rem 0.75rem;
  vertical-align: middle;
  outline: none !important;
}
label input[type=radio]:checked {
  border: 0.3125rem solid var(--black);
  background-color: var(--pointcolor-04) !important;
}

label {
  cursor: pointer;
  display: block;
}
label input[type=checkbox] {
  width: var(--size-24);
  min-width: var(--size-24);
  max-width: var(--size-24);
  height: var(--size-24);
  border: 1.2px solid rgb(212, 212, 212);
  background-color: rgb(255, 255, 255);
  border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -webkit-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -moz-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -ms-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -o-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  vertical-align: middle;
  outline: none !important;
  transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
@media (max-width: 767.98px) {
  label input[type=checkbox] {
    width: 1.25rem;
    height: 1.25rem;
    max-width: 1.25rem;
    min-width: 1.25rem;
  }
}
label input[type=checkbox]:checked {
  background-color: var(--black);
}
label input[type=checkbox]:checked:after {
  position: absolute;
  content: "";
  position: static;
  background: url(../public/check.svg) no-repeat;
  width: 0.75rem;
  height: 0.5rem;
  background-size: cover;
}

input[type=checkbox].checkbox-input {
  width: var(--size-24);
  height: var(--size-24);
  border: 1.2px solid var(--black);
  background-color: white;
  border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -webkit-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -moz-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -ms-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  -o-border-radius: var(--size-50) var(--size-50) var(--size-50) var(--size-50);
  vertical-align: middle;
  outline: none !important;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}
@media (max-width: 767.98px) {
  input[type=checkbox].checkbox-input {
    width: var(--size-16);
    height: var(--size-16);
  }
}
input[type=checkbox].checkbox-input:checked {
  background-color: var(--black);
}
input[type=checkbox].checkbox-input:checked:after {
  position: absolute;
  content: "";
  position: static;
  background: url(../public/check.svg) no-repeat;
  width: 0.5rem;
  height: 0.375rem;
  background-size: cover;
}
input[type=checkbox].checkbox-input:active, input[type=checkbox].checkbox-input:focus {
  box-shadow: inset 0rem 0rem 0rem 0.125rem var(--pointcolor-01);
}

.bold {
  font-weight: 600 !important;
}

.point-color-01 {
  color: var(--pointcolor-01);
}

.point-color-02 {
  color: var(--pointcolor-02) !important;
}

.point-color-03 {
  background: var(--pointcolor-03);
}

.point-color-04 {
  background: var(--pointcolor-04);
}

.grayColor-01 {
  color: var(--graycolor03) !important;
}

.count-applied {
  color: #4763ff;
}

.count-passed {
  color: #fd6050;
}

.count-accepted {
  color: #3dad00;
}

.count-rejected {
  color: #000;
}

.count-drafting {
  color: #626262;
}

.mr-1 {
  margin-right: var(--size-04);
}

.black {
  color: var(--black);
}

.w-100 {
  width: 100%;
}

i, em {
  font-style: normal;
  font-weight: 300;
}

.blue {
  color: var(--pointcolor-01) !important;
}

.blak {
  color: var(--black);
}

.bold {
  font-weight: 600;
}

.point {
  color: var(--pointcolor-06);
}

.gray {
  color: var(--graycolor04);
}

.txt-center {
  text-align: center;
}

input {
  outline: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

/* font */
@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  src: url(../font/Pretendard-Black.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  src: url(../font/Pretendard-ExtraBold.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  src: url(../font/Pretendard-Bold.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  src: url(../font/Pretendard-SemiBold.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  src: url(../font/Pretendard-Medium.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  src: url(../font/Pretendard-Regular.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  src: url(../font/Pretendard-Light.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  src: url(../font/Pretendard-ExtraLight.woff) format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  src: url(../font/Pretendard-Thin.woff) format("woff");
}
@font-face {
  font-family: "Montserrat";
  font-weight: 300;
  src: url(../font/montserrat-light.woff) format("woff");
}
@font-face {
  font-family: "Montserrat";
  font-weight: 400;
  src: url(../font/montserrat-medium.woff) format("woff");
}
@font-face {
  font-family: "Montserrat";
  font-weight: 500;
  src: url(../font/montserrat-bold.woff) format("woff");
}/*# sourceMappingURL=global.css.map */