@charset "utf-8";
@import url(../../font/new/font.css);

* {
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  word-break: keep-all;
}
*,
:after,
:before {
  box-sizing: border-box;
  flex-shrink: 0;
}
:root {
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  cursor: default;
  line-height: 1.5;
  overflow-wrap: break-word;
  word-break: break-word;
  tab-size: 4;
}
html,
body {
  min-height: 100%;
}
section {
  width: 100%;
}
.iframe-form {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
iframe {
  border: 0;
}
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}
button {
  background: none;
  border: 0;
  cursor: pointer;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
a {
  text-decoration: none;
  color: inherit;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
ul,
ol {
  list-style: none;
}

/* 추가 */
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

*::-webkit-scrollbar-thumb {
  background-color: #d1d5db;
  border-radius: 10px;
  background-clip: padding-box;
  border: 2px solid transparent;
}

/* skip */
.skip {
  display: block;
  height: 1px;
  width: 1px;
  margin: 0 -1px -1px 0;
  padding: 0;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  background-color: #fff;
  z-index: 9999;
  position: relative;
}
.skip:hover,
.skip:active,
.skip:focus {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 5px 0;
  text-indent: 10px;
  font-weight: bold;
  font-size: 12px;
  color: #333;
  line-height: 1;
  text-decoration: none !important;
  position: relative;
  text-align: center;
  box-shadow: 0 0 0 1px #000 inset;
}
/* 스크롤 */

.container {
  height: inherit;
  max-width: 1340px;
  width: 100%;
  margin: 0 auto;
}
.row {
  padding: 0 20px;
}

:root {
  /* Color styles */
  --primary-900: rgba(25, 122, 239, 1);
  --primary-800: rgba(59, 145, 249, 1);
  --primary-700: rgba(94, 167, 255, 1);
  --primary-600: rgba(141, 193, 255, 1);
  --primary-500: rgba(215, 233, 255, 1);
  --primary-400: rgba(245, 250, 255, 1);
  --gray-900: rgba(17, 24, 39, 1);
  --gray-800: rgba(31, 43, 55, 1);
  --gray-700: rgba(55, 65, 81, 1);
  --gray-600: rgba(72, 85, 99, 1);
  --gray-500: rgba(104, 114, 128, 1);
  --gray-400: rgba(156, 163, 175, 1);
  --gray-300: rgba(209, 213, 219, 1);
  --gray-200: rgba(232, 232, 232, 1);
  --gray-100: rgba(250, 250, 252, 1);
  --white: rgba(255, 255, 255, 1);
  --mint: rgba(0, 198, 205, 1);
  --mint-500: rgba(208, 240, 242, 1);
  --mint-400: rgba(239, 251, 251, 1);
  --red: rgba(255, 56, 48, 1);
  --green: rgba(127, 194, 65, 1);
  --green-500: rgba(216, 242, 192, 1);
  --green-400: rgba(244, 249, 239, 1);
  --success: rgba(34, 197, 142, 1);
  --yellow: rgba(244, 154, 0, 1);
  --yellow-500: rgba(255, 237, 219, 1);
  --yellow-400: rgba(255, 250, 245, 1);

  /* Effect styles */
  --shadow: -4px 0px 16px rgba(0, 0, 0, 0.08);
  --mint-background: linear-gradient(0deg, #effbfb 78.37%, #fff 100%);
  --green-background: linear-gradient(0deg, #fbfff8 78.37%, #fff 100%);
  --yellow-background: linear-gradient(0deg, #fffaf5 78.37%, #fff 100%);

  --east-top-banner: linear-gradient(0deg, #d0f0f2 0%, #ebfeff 100%);
  --central-top-banner: linear-gradient(0deg, #d6e9c4 0%, #f5ffeb 100%);
  --north-top-banner: linear-gradient(0deg, #ffe0b1 0%, #fff0da 100%);
}
body {
  font-family: "Paperlogy", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: var(--black);
}

/* 캠퍼스별 메인 색상 */
body.campus-main {
  --main-900: var(--primary-900);
  --main-500: var(--primary-500);
  --main-400: var(--primary-400);
  --icon-color: invert(32%) sepia(73%) saturate(2110%) hue-rotate(201deg)
    brightness(98%) contrast(90%);
}
body.campus-east {
  --main-900: var(--mint);
  --main-500: var(--mint-500);
  --main-400: var(--mint-400);
  --icon-color: invert(78%) sepia(52%) saturate(7415%) hue-rotate(144deg)
    brightness(103%) contrast(101%);
  --campus-background: var(--mint-background);
}
body.campus-central {
  --main-900: var(--green);
  --main-500: var(--green-500);
  --main-400: var(--green-400);
  --icon-color: invert(81%) sepia(23%) saturate(1207%) hue-rotate(39deg)
    brightness(85%) contrast(85%);
  --campus-background: var(--green-background);
}
body.campus-north {
  --main-900: var(--yellow);
  --main-500: var(--yellow-500);
  --main-400: var(--yellow-400);
  --icon-color: invert(51%) sepia(81%) saturate(1584%) hue-rotate(11deg)
    brightness(107%) contrast(102%);
  --campus-background: var(--yellow-background);
}

/* input */
.s__input {
  padding: 11px 18px;
  border-radius: 5px;
  border: 1px solid var(--border);
  font-size: 16px;
  min-height: 48px;
  margin: 2px;
}
.s__input-small {
  padding: 8px 14px;
  font-size: 14px;
  min-height: 40px;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.s__input::placeholder {
  color: var(--gray);
}
/* select */
.s__select {
  -webkit-appearance: none; /* for chrome */
  -moz-appearance: none; /*for firefox*/
  appearance: none;
  background: url("/image/icon_down_arrow.svg") no-repeat 95% 50%/18px auto;
  background-color: #fff;
  padding: 12px 54px 12px 18px;
  border-radius: 5px;
  border: 1px solid var(--border);
  font-size: 16px;
  min-height: 50px;
  margin: 2px;
}
.s__select::-ms-expand {
  display: none; /*for IE10,11*/
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1023px)*/
@media all and (max-width: 1023px) {
}
/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/
@media all and (max-width: 767px) {
  .s__btn-wrap {
    margin-top: 24px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
  }
  .s__btn-between-wrap > div {
    flex-direction: column;
    align-items: stretch;
  }
}
