@font-face {
  font-family: 'Noto Sans Korean';
  font-style: normal;
  font-weight: 400;
  src:
    local('Noto Sans Regular'),
    local('NotoSans-Regular'),
    url(https://cdn.ninehire.com/font/eot/NotoSansKR-Regular-Hestia.eot),
    url(https://cdn.ninehire.com/font/eot/NotoSansKR-Regular-Hestia.eot?#iefix)
      format('embedded-opentype'),
    url(https://cdn.ninehire.com/font/woff/NotoSansKR-Regular-Hestia.woff) format('woff'),
    url(https://cdn.ninehire.com/font/otf/NotoSansKR-Regular-Hestia.otf)
      format('opentype');
}

@font-face {
  font-family: 'Noto Sans Korean';
  font-style: normal;
  font-weight: 700;
  src:
    local('Noto Sans Bold'),
    local('NotoSans-Bold'),
    url(https://cdn.ninehire.com/font/eot/NotoSansKR-Bold-Hestia.eot),
    url(https://cdn.ninehire.com/font/eot/NotoSansKR-Bold-Hestia.eot?#iefix)
      format('embedded-opentype'),
    url(https://cdn.ninehire.com/font/woff/NotoSansKR-Bold-Hestia.woff) format('woff'),
    url(https://cdn.ninehire.com/font/otf/NotoSansKR-Bold-Hestia.otf) format('opentype');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 400;
  src: url('https://cdn.ninehire.com/font/fonts/Pretendard-Regular.subset.woff2')
    format('woff2');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 600;
  src: url('https://cdn.ninehire.com/font/fonts/Pretendard-SemiBold.subset.woff2')
    format('woff2');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 700;
  src: url('https://cdn.ninehire.com/font/fonts/Pretendard-Bold.subset.woff2')
    format('woff2');
}

/* 배민 한나체 프로 */
@font-face {
  font-family: 'BMHANNAPro';
  src: url('https://cdn.ninehire.com/font/hanna-pro/BMHannaPro.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

/* 네이버 나눔 명조 */
@font-face {
  font-family: 'Nanum Myeongjo';
  font-style: normal;
  font-weight: 400;
  src: url('https://cdn.ninehire.com/font/nanum-myeongjo/NanumMyeongjo.otf')
    format('opentype');
}
@font-face {
  font-family: 'Nanum Myeongjo';
  font-style: normal;
  font-weight: 600;
  src: url('https://cdn.ninehire.com/font/nanum-myeongjo/NanumMyeongjoBold.otf')
    format('opentype');
}
@font-face {
  font-family: 'Nanum Myeongjo';
  font-style: normal;
  font-weight: 700;
  src: url('https://cdn.ninehire.com/font/nanum-myeongjo/NanumMyeongjoExtraBold.otf')
    format('opentype');
}

/* 네이버 나눔 스퀘어 네오 */
@font-face {
  font-family: 'NanumSquareNeo-Variable';
  font-weight: 400;
  font-style: normal;
  src:
    url(https://cdn.ninehire.com/font/nanum-square-neo/Webfont/eot/NanumSquareNeoTTF-cBd.eot),
    url(https://cdn.ninehire.com/font/nanum-square-neo/Webfont/woff2/NanumSquareNeoTTF-cBd.woff2)
      format('woff2'),
    url(https://cdn.ninehire.com/font/nanum-square-neo/OTF/NanumSquareNeoTTF-cBd.otf)
      format('opentype');
}
@font-face {
  font-family: 'NanumSquareNeo-Variable';
  font-weight: 600;
  font-style: normal;
  src:
    url(https://cdn.ninehire.com/font/nanum-square-neo/Webfont/eot/NanumSquareNeoTTF-dEb.eot),
    url(https://cdn.ninehire.com/font/nanum-square-neo/Webfont/woff2/NanumSquareNeoTTF-dEb.woff2)
      format('woff2'),
    url(https://cdn.ninehire.com/font/nanum-square-neo/OTF/NanumSquareNeoTTF-dEb.otf)
      format('opentype');
}
@font-face {
  font-family: 'NanumSquareNeo-Variable';
  font-weight: 700;
  font-style: normal;
  src:
    url(https://cdn.ninehire.com/font/nanum-square-neo/Webfont/eot/NanumSquareNeoTTF-eHv.eot),
    url(https://cdn.ninehire.com/font/nanum-square-neo/Webfont/woff2/NanumSquareNeoTTF-eHv.woff2)
      format('woff2'),
    url(https://cdn.ninehire.com/font/nanum-square-neo/OTF/NanumSquareNeoTTF-eHv.otf)
      format('opentype');
}

/* 지마켓 산스 */
@font-face {
  font-family: 'Gmarket Sans';
  font-style: normal;
  font-weight: 700;
  src:
    local('Gmarket Sans Bold'),
    local('GmarketSans-Bold'),
    url('https://cdn.ninehire.com/font/gmarket/GmarketSansBold.woff2') format('woff2'),
    url('https://cdn.ninehire.com/font/gmarket/GmarketSansBold.woff') format('woff');
}
@font-face {
  font-family: 'Gmarket Sans';
  font-style: normal;
  font-weight: 500;
  src:
    local('Gmarket Sans Medium'),
    local('GmarketSans-Medium'),
    url('https://cdn.ninehire.com/font/gmarket/GmarketSansMedium.woff2') format('woff2'),
    url('https://cdn.ninehire.com/font/gmarket/GmarketSansMedium.woff') format('woff');
}
@font-face {
  font-family: 'Gmarket Sans';
  font-style: normal;
  font-weight: 300;
  src:
    local('Gmarket Sans Light'),
    local('GmarketSans-Light'),
    url('https://cdn.ninehire.com/font/gmarket/GmarketSansLight.woff2') format('woff2'),
    url('https://cdn.ninehire.com/font/gmarket/GmarketSansLight.woff') format('woff');
}

@font-face {
  font-family: 'DNFBitBitv2';
  src:
    url('//cdn.ninehire.com/font/DNFBitBitv2/DNFBitBitv2.otf') format('opentype'),
    url('//cdn.ninehire.com/font/DNFBitBitv2/DNFBitBitv2.ttf') format('truetype');
}

@font-face {
  font-family: 'CJ ONLYONE NEW';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    url('//cdn.ninehire.com/font/cj-onlyone/otf/CJ-ONLYONE-NEW-body-OTF-Regular.otf')
      format('opentype'),
    url('//cdn.ninehire.com/font/cj-onlyone/ttf/CJ-ONLYONE-NEW-body-Regular.ttf')
      format('truetype');
}

@font-face {
  font-family: 'CJ ONLYONE NEW';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    url('//cdn.ninehire.com/font/cj-onlyone/otf/CJ-ONLYONE-NEW-title-OTF-Bold.otf')
      format('opentype'),
    url('//cdn.ninehire.com/font/cj-onlyone/ttf/CJ-ONLYONE-NEW-title-Bold.ttf')
      format('truetype');
}

/* 네이버 나눔스퀘어 */
@font-face {
  font-family: 'NanumSquare';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    local('NanumSquare Bold'),
    local('NanumSquareB'),
    url('https://cdn.dev.ninehire.com/font/NanumSquare/NanumSquareB.otf')
      format('opentype');
}

@font-face {
  font-family: 'NanumSquare';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    local('NanumSquare Regular'),
    local('NanumSquareR'),
    url('https://cdn.dev.ninehire.com/font/NanumSquare/NanumSquareR.otf')
      format('opentype');
}

@font-face {
  font-family: 'NanumSquare';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src:
    local('NanumSquare Light'),
    local('NanumSquareL'),
    url('https://cdn.dev.ninehire.com/font/NanumSquare/NanumSquareL.otf')
      format('opentype');
}

/* 로보토 */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src:
    local('Roboto Condensed Thin'),
    local('RobotoCondensed-Thin'),
    url('https://cdn.dev.ninehire.com/font/Roboto/RobotoCondensed-Thin.ttf')
      format('truetype');
}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src:
    local('Roboto Condensed Light'),
    local('RobotoCondensed-Light'),
    url('https://cdn.dev.ninehire.com/font/Roboto/RobotoCondensed-Light.ttf')
      format('truetype');
}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    local('Roboto Condensed Regular'),
    local('RobotoCondensed-Regular'),
    url('https://cdn.dev.ninehire.com/font/Roboto/RobotoCondensed-Regular.ttf')
      format('truetype');
}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src:
    local('Roboto Condensed Medium'),
    local('RobotoCondensed-Medium'),
    url('https://cdn.dev.ninehire.com/font/Roboto/RobotoCondensed-Medium.ttf')
      format('truetype');
}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    local('Roboto Condensed Bold'),
    local('RobotoCondensed-Bold'),
    url('https://cdn.dev.ninehire.com/font/Roboto/RobotoCondensed-Bold.ttf')
      format('truetype');
}

html {
  --antd-wave-shadow-color: transparent !important;
  width: 100%;
  height: 100%;
  overflow: hidden;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  color: #393838;
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
  -moz-scrollbar: none !important;
}

/* Hide scrollbar for Chrome, Safari and Opera */
body::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
body {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

textarea,
input,
input:matches(
    [type='email'],
    [type='number'],
    [type='password'],
    [type='search'],
    [type='tel'],
    [type='text'],
    [type='url']
  ) {
  -webkit-appearance: none;
}

input[type='radio'] {
  -webkit-appearance: radio;
}

p {
  margin: 0 !important;
}

.ant-upload > span {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

.ql-editor {
  font-family: 'Noto Sans Korean', sans-serif !important;
  font-size: 14px;
  word-break: break-all;
}

.ql-editor li {
  padding: 0 !important;
}

input {
  box-sizing: border-box;
  font-family: 'Noto Sans Korean', sans-serif;
}

button {
  font-family: 'Noto Sans Korean', sans-serif;
}

body,
body > div:first-child,
div#__next {
  height: 100%;
  box-sizing: border-box;
  margin: 0;
}

div {
  box-sizing: border-box;
}

body {
  font-family: 'Noto Sans Korean', sans-serif;
  font-display: swap;
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.1) !important;
  border-radius: 5px !important;
  background-clip: content-box !important;
  border-right: 3px solid transparent !important;
  border-left: 3px solid transparent !important;
}

::-webkit-scrollbar-track {
  background-color: rgba(255, 255, 255, 0) !important;
}

.ReactModal__Overlay {
  opacity: 0;
  transition: opacity 200ms ease-in-out;
}

.ReactModal__Overlay--after-open {
  opacity: 1;
}

.ReactModal__Overlay--before-close {
  opacity: 0;
}

.ReactModal__Content {
  opacity: 0;
  transform: translateY(-150px);
  transition: all 0.6s cubic-bezier(0.075, 0.82, 0.165, 1);
  height: max-content;
}

.ReactModal__Content--after-open {
  opacity: 1;
  transform: translateX(0px);
}

.ReactModal__Content--before-close {
  opacity: 0;
  transform: translateX(-100px);
}

.__tooltip__customize {
  border-radius: 6px !important;
  padding: 7px 8px !important;
  font-size: 12px !important;
  line-height: 150% !important;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1) !important;
}

.__tooltip__customize a {
  color: white;
  text-decoration: underline;
  font-weight: 700;
  cursor: pointer;
}

.ant-popover-content {
  display: flex !important;
  border-radius: 6px !important;
  padding: 7px 8px !important;
  font-size: 12px !important;
  line-height: 150% !important;
  background: #393838 !important;
}

.ant-popover-arrow {
  border-color: #393838 !important;
}

.ant-popover-arrow-content {
  background: #393838 !important;
}

.ant-popover-inner-content {
  padding: 0px !important;
  color: white !important;
}

.ant-popover-inner {
  background: #393838 !important;
  box-shadow: none !important;
}

.ant-switch-handle::before {
  transition: none !important;
}

.ant-picker-cell:hover > .ant-picker-cell-inner {
  background: #f4f5fa !important;
}

/* react-reflex */
body.reflex-col-resize {
  cursor: col-resize;
}

body.reflex-row-resize {
  cursor: row-resize;
}

.reflex-container {
  justify-content: flex-start;
  /* align items in Main Axis */
  align-items: stretch;
  /* align items in Cross Axis */
  align-content: stretch;
  /* OLD - iOS 6-, Safari 3.1-6 */
  /* OLD - Firefox 19- (buggy but mostly works) */
  /* TWEENER - IE 10 */
  /* NEW - Chrome */
  display: flex;
  position: relative;
  height: 100%;
  width: 100%;
}

.reflex-container.horizontal {
  flex-direction: column;
  min-height: 1px;
}

.reflex-container.vertical {
  flex-direction: row;
  min-width: 1px;
}

.reflex-container > .reflex-element {
  position: relative;
  /* overflow: auto; */
  height: 100%;
  width: 100%;
}

.reflex-container.reflex-resizing > .reflex-element {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.reflex-container > .reflex-element > .reflex-size-aware {
  height: 100%;
  width: 100%;
}

.reflex-container > .reflex-splitter {
  background-color: transparent;
  z-index: 100;
}

.reflex-container > .reflex-splitter.active,
.reflex-container > .reflex-splitter:hover {
  background-color: transparent;
  transition: all 1s ease;
}

.horizontal > .reflex-splitter {
  border-bottom: 1px solid #c6c6c6;
  border-top: 1px solid #c6c6c6;
  cursor: row-resize;
  width: 100%;
  height: 2px;
}

.reflex-element.horizontal .reflex-handle {
  cursor: row-resize;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.reflex-container.horizontal > .reflex-splitter:hover,
.reflex-container.horizontal > .reflex-splitter.active {
  border-bottom: 1px solid #eeeeee;
  border-top: 1px solid #eeeeee;
}

.reflex-container.vertical > .reflex-splitter {
  cursor: col-resize;
  height: 100%;
  width: 0 !important;
  display: flex;
  flex-direction: column;
}

.reflex-element.vertical .reflex-handle {
  cursor: col-resize;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.reflex-container > .reflex-splitter.reflex-thin {
  box-sizing: border-box;
  -moz-background-clip: padding;
  -webkit-background-clip: padding;
  background-clip: padding-box;
  opacity: 0.2;
  z-index: 100;
}

.reflex-container
  > .reflex-splitter.reflex-thin.active
  .reflex-container
  > .reflex-splitter.reflex-thin:hover {
  transition: all 1.5s ease;
  opacity: 0.5;
}

.reflex-container.horizontal > .reflex-splitter.reflex-thin {
  border-bottom: 8px solid rgba(255, 255, 255, 0);
  border-top: 8px solid rgba(255, 255, 255, 0);
  height: 17px !important;
  cursor: row-resize;
  margin: -8px 0;
  width: 100%;
}

.reflex-container.horizontal > .reflex-splitter.reflex-thin.active,
.reflex-container.horizontal > .reflex-splitter.reflex-thin:hover {
  border-bottom: 8px solid transparent;
  border-top: 8px solid transparent;
}

.reflex-container.vertical > .reflex-splitter.reflex-thin {
  border-right: 8px solid rgba(255, 255, 255, 0);
  border-left: 8px solid rgba(255, 255, 255, 0);
  width: 17px !important;
  cursor: col-resize;
  margin: 0 -8px;
  height: 100%;
}

.reflex-container.vertical > .reflex-splitter.reflex-thin.active,
.reflex-container.vertical > .reflex-splitter.reflex-thin:hover {
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
}
