/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[3].use[1]!./node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[14].oneOf[3].use[2]!./node_modules/next/font/local/target.css?{"path":"src/app/layout.js","import":"","arguments":[{"src":[{"path":"../../public/fonts/Pretendard-Thin.ttf","weight":"100"},{"path":"../../public/fonts/Pretendard-ExtraLight.ttf","weight":"200"},{"path":"../../public/fonts/Pretendard-Light.ttf","weight":"300"},{"path":"../../public/fonts/Pretendard-Regular.ttf","weight":"400"},{"path":"../../public/fonts/Pretendard-Medium.ttf","weight":"500"},{"path":"../../public/fonts/Pretendard-SemiBold.ttf","weight":"600"},{"path":"../../public/fonts/Pretendard-Bold.ttf","weight":"700"},{"path":"../../public/fonts/Pretendard-ExtraBold.ttf","weight":"800"},{"path":"../../public/fonts/Pretendard-Black.ttf","weight":"900"}]}],"variableName":"pretendard"} ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/b9ab6980395d6961-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 100;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/77568aa8d83124ca-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 200;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/fe50c83c274bb925-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 300;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/5f020aa3b9a00288-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 400;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/55f89928803a2bfe-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 500;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/87954a7ffa82eaa8-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 600;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/b80a738157a78bba-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 700;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/37cd2935c761e1a3-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 800;
}

@font-face {
font-family: 'pretendard';
src: url(/_next/static/media/04822bb28efb6925-s.p.ttf) format('truetype');
font-display: swap;
font-weight: 900;
}@font-face {font-family: 'pretendard Fallback';src: local("Arial");ascent-override: 93.76%;descent-override: 23.75%;line-gap-override: 0.00%;size-adjust: 101.55%
}.__className_951327 {font-family: 'pretendard', 'pretendard Fallback'
}

/*!************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./node_modules/react-toastify/dist/ReactToastify.css ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************/
:root {
  --toastify-color-light: #fff;
  --toastify-color-dark: #121212;
  --toastify-color-info: #3498db;
  --toastify-color-success: #07bc0c;
  --toastify-color-warning: #f1c40f;
  --toastify-color-error: hsl(6, 78%, 57%);
  --toastify-color-transparent: rgba(255, 255, 255, 0.7);

  --toastify-icon-color-info: var(--toastify-color-info);
  --toastify-icon-color-success: var(--toastify-color-success);
  --toastify-icon-color-warning: var(--toastify-color-warning);
  --toastify-icon-color-error: var(--toastify-color-error);

  --toastify-container-width: fit-content;
  --toastify-toast-width: 320px;
  --toastify-toast-offset: 16px;
  --toastify-toast-top: max(var(--toastify-toast-offset), env(safe-area-inset-top));
  --toastify-toast-right: max(var(--toastify-toast-offset), env(safe-area-inset-right));
  --toastify-toast-left: max(var(--toastify-toast-offset), env(safe-area-inset-left));
  --toastify-toast-bottom: max(var(--toastify-toast-offset), env(safe-area-inset-bottom));
  --toastify-toast-background: #fff;
  --toastify-toast-padding: 14px;
  --toastify-toast-min-height: 64px;
  --toastify-toast-max-height: 800px;
  --toastify-toast-bd-radius: 6px;
  --toastify-toast-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
  --toastify-font-family: sans-serif;
  --toastify-z-index: 9999;
  --toastify-text-color-light: #757575;
  --toastify-text-color-dark: #fff;

  /* Used only for colored theme */
  --toastify-text-color-info: #fff;
  --toastify-text-color-success: #fff;
  --toastify-text-color-warning: #fff;
  --toastify-text-color-error: #fff;

  --toastify-spinner-color: #616161;
  --toastify-spinner-color-empty-area: #e0e0e0;
  --toastify-color-progress-light: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);
  --toastify-color-progress-dark: #bb86fc;
  --toastify-color-progress-info: var(--toastify-color-info);
  --toastify-color-progress-success: var(--toastify-color-success);
  --toastify-color-progress-warning: var(--toastify-color-warning);
  --toastify-color-progress-error: var(--toastify-color-error);
  /* used to control the opacity of the progress trail */
  --toastify-color-progress-bgo: 0.2;
}

.Toastify__toast-container {
  z-index: var(--toastify-z-index);
  -webkit-transform: translate3d(0, 0, var(--toastify-z-index));
  position: fixed;
  width: var(--toastify-container-width);
  box-sizing: border-box;
  color: #fff;
  display: flex;
  flex-direction: column;
}

.Toastify__toast-container--top-left {
  top: var(--toastify-toast-top);
  left: var(--toastify-toast-left);
}
.Toastify__toast-container--top-center {
  top: var(--toastify-toast-top);
  left: 50%;
  transform: translateX(-50%);
  align-items: center;
}
.Toastify__toast-container--top-right {
  top: var(--toastify-toast-top);
  right: var(--toastify-toast-right);
  align-items: end;
}
.Toastify__toast-container--bottom-left {
  bottom: var(--toastify-toast-bottom);
  left: var(--toastify-toast-left);
}
.Toastify__toast-container--bottom-center {
  bottom: var(--toastify-toast-bottom);
  left: 50%;
  transform: translateX(-50%);
  align-items: center;
}
.Toastify__toast-container--bottom-right {
  bottom: var(--toastify-toast-bottom);
  right: var(--toastify-toast-right);
  align-items: end;
}

.Toastify__toast {
  --y: 0;
  position: relative;
  touch-action: none;
  width: var(--toastify-toast-width);
  min-height: var(--toastify-toast-min-height);
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: var(--toastify-toast-padding);
  border-radius: var(--toastify-toast-bd-radius);
  box-shadow: var(--toastify-toast-shadow);
  max-height: var(--toastify-toast-max-height);
  font-family: var(--toastify-font-family);
  /* webkit only issue #791 */
  z-index: 0;
  /* inner swag */
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  word-break: break-word;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast-container {
    width: 100vw;
    left: env(safe-area-inset-left);
    margin: 0;
  }
  .Toastify__toast-container--top-left,
  .Toastify__toast-container--top-center,
  .Toastify__toast-container--top-right {
    top: env(safe-area-inset-top);
    transform: translateX(0);
  }
  .Toastify__toast-container--bottom-left,
  .Toastify__toast-container--bottom-center,
  .Toastify__toast-container--bottom-right {
    bottom: env(safe-area-inset-bottom);
    transform: translateX(0);
  }
  .Toastify__toast-container--rtl {
    right: env(safe-area-inset-right);
    left: initial;
  }
  .Toastify__toast {
    --toastify-toast-width: 100%;
    margin-bottom: 0;
    border-radius: 0;
  }
}

.Toastify__toast-container[data-stacked='true'] {
  width: var(--toastify-toast-width);
}

.Toastify__toast--stacked {
  position: absolute;
  width: 100%;
  transform: translate3d(0, var(--y), 0) scale(var(--s));
  transition: transform 0.3s;
}

.Toastify__toast--stacked[data-collapsed] .Toastify__toast-body,
.Toastify__toast--stacked[data-collapsed] .Toastify__close-button {
  transition: opacity 0.1s;
}

.Toastify__toast--stacked[data-collapsed='false'] {
  overflow: visible;
}

.Toastify__toast--stacked[data-collapsed='true']:not(:last-child) > * {
  opacity: 0;
}

.Toastify__toast--stacked:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: calc(var(--g) * 1px);
  bottom: 100%;
}

.Toastify__toast--stacked[data-pos='top'] {
  top: 0;
}

.Toastify__toast--stacked[data-pos='bot'] {
  bottom: 0;
}

.Toastify__toast--stacked[data-pos='bot'].Toastify__toast--stacked:before {
  transform-origin: top;
}

.Toastify__toast--stacked[data-pos='top'].Toastify__toast--stacked:before {
  transform-origin: bottom;
}

.Toastify__toast--stacked:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  transform: scaleY(3);
  z-index: -1;
}

.Toastify__toast--rtl {
  direction: rtl;
}

.Toastify__toast--close-on-click {
  cursor: pointer;
}

.Toastify__toast-icon {
  -webkit-margin-end: 10px;
          margin-inline-end: 10px;
  width: 22px;
  flex-shrink: 0;
  display: flex;
}

.Toastify--animate {
  animation-fill-mode: both;
  animation-duration: 0.5s;
}

.Toastify--animate-icon {
  animation-fill-mode: both;
  animation-duration: 0.3s;
}

.Toastify__toast-theme--dark {
  background: var(--toastify-color-dark);
  color: var(--toastify-text-color-dark);
}

.Toastify__toast-theme--light {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}

.Toastify__toast-theme--colored.Toastify__toast--default {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}

.Toastify__toast-theme--colored.Toastify__toast--info {
  color: var(--toastify-text-color-info);
  background: var(--toastify-color-info);
}

.Toastify__toast-theme--colored.Toastify__toast--success {
  color: var(--toastify-text-color-success);
  background: var(--toastify-color-success);
}

.Toastify__toast-theme--colored.Toastify__toast--warning {
  color: var(--toastify-text-color-warning);
  background: var(--toastify-color-warning);
}

.Toastify__toast-theme--colored.Toastify__toast--error {
  color: var(--toastify-text-color-error);
  background: var(--toastify-color-error);
}

.Toastify__progress-bar-theme--light {
  background: var(--toastify-color-progress-light);
}

.Toastify__progress-bar-theme--dark {
  background: var(--toastify-color-progress-dark);
}

.Toastify__progress-bar--info {
  background: var(--toastify-color-progress-info);
}

.Toastify__progress-bar--success {
  background: var(--toastify-color-progress-success);
}

.Toastify__progress-bar--warning {
  background: var(--toastify-color-progress-warning);
}

.Toastify__progress-bar--error {
  background: var(--toastify-color-progress-error);
}

.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error {
  background: var(--toastify-color-transparent);
}

.Toastify__close-button {
  color: #fff;
  position: absolute;
  top: 6px;
  right: 6px;
  background: transparent;
  outline: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s ease;
  z-index: 1;
}

.Toastify__toast--rtl .Toastify__close-button {
  left: 6px;
  right: unset;
}

.Toastify__close-button--light {
  color: #000;
  opacity: 0.3;
}

.Toastify__close-button > svg {
  fill: currentColor;
  height: 16px;
  width: 14px;
}

.Toastify__close-button:hover,
.Toastify__close-button:focus {
  opacity: 1;
}

@keyframes Toastify__trackProgress {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
}

.Toastify__progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0.7;
  transform-origin: left;
}

.Toastify__progress-bar--animated {
  animation: Toastify__trackProgress linear 1 forwards;
}

.Toastify__progress-bar--controlled {
  transition: transform 0.2s;
}

.Toastify__progress-bar--rtl {
  right: 0;
  left: initial;
  transform-origin: right;
  border-bottom-left-radius: initial;
}

.Toastify__progress-bar--wrp {
  position: absolute;
  overflow: hidden;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  border-bottom-left-radius: var(--toastify-toast-bd-radius);
  border-bottom-right-radius: var(--toastify-toast-bd-radius);
}

.Toastify__progress-bar--wrp[data-hidden='true'] {
  opacity: 0;
}

.Toastify__progress-bar--bg {
  opacity: var(--toastify-color-progress-bgo);
  width: 100%;
  height: 100%;
}

.Toastify__spinner {
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  border: 2px solid;
  border-radius: 100%;
  border-color: var(--toastify-spinner-color-empty-area);
  border-right-color: var(--toastify-spinner-color);
  animation: Toastify__spin 0.65s linear infinite;
}

@keyframes Toastify__bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}

@keyframes Toastify__bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, var(--y), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, var(--y), 0);
  }
}

@keyframes Toastify__bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}

@keyframes Toastify__bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, var(--y), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, var(--y), 0);
  }
}

@keyframes Toastify__bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes Toastify__bounceOutUp {
  20% {
    transform: translate3d(0, calc(var(--y) - 10px), 0);
  }
  40%,
  45% {
    opacity: 1;
    transform: translate3d(0, calc(var(--y) + 20px), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes Toastify__bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}

@keyframes Toastify__bounceOutDown {
  20% {
    transform: translate3d(0, calc(var(--y) - 10px), 0);
  }
  40%,
  45% {
    opacity: 1;
    transform: translate3d(0, calc(var(--y) + 20px), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}

.Toastify__bounce-enter--top-left,
.Toastify__bounce-enter--bottom-left {
  animation-name: Toastify__bounceInLeft;
}

.Toastify__bounce-enter--top-right,
.Toastify__bounce-enter--bottom-right {
  animation-name: Toastify__bounceInRight;
}

.Toastify__bounce-enter--top-center {
  animation-name: Toastify__bounceInDown;
}

.Toastify__bounce-enter--bottom-center {
  animation-name: Toastify__bounceInUp;
}

.Toastify__bounce-exit--top-left,
.Toastify__bounce-exit--bottom-left {
  animation-name: Toastify__bounceOutLeft;
}

.Toastify__bounce-exit--top-right,
.Toastify__bounce-exit--bottom-right {
  animation-name: Toastify__bounceOutRight;
}

.Toastify__bounce-exit--top-center {
  animation-name: Toastify__bounceOutUp;
}

.Toastify__bounce-exit--bottom-center {
  animation-name: Toastify__bounceOutDown;
}

@keyframes Toastify__zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}

@keyframes Toastify__zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: translate3d(0, var(--y), 0) scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}

.Toastify__zoom-enter {
  animation-name: Toastify__zoomIn;
}

.Toastify__zoom-exit {
  animation-name: Toastify__zoomOut;
}

@keyframes Toastify__flipIn {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}

@keyframes Toastify__flipOut {
  from {
    transform: translate3d(0, var(--y), 0) perspective(400px);
  }
  30% {
    transform: translate3d(0, var(--y), 0) perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    transform: translate3d(0, var(--y), 0) perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.Toastify__flip-enter {
  animation-name: Toastify__flipIn;
}

.Toastify__flip-exit {
  animation-name: Toastify__flipOut;
}

@keyframes Toastify__slideInRight {
  from {
    transform: translate3d(110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideInLeft {
  from {
    transform: translate3d(-110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideInUp {
  from {
    transform: translate3d(0, 110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideInDown {
  from {
    transform: translate3d(0, -110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideOutRight {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(110%, var(--y), 0);
  }
}

@keyframes Toastify__slideOutLeft {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-110%, var(--y), 0);
  }
}

@keyframes Toastify__slideOutDown {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 500px, 0);
  }
}

@keyframes Toastify__slideOutUp {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -500px, 0);
  }
}

.Toastify__slide-enter--top-left,
.Toastify__slide-enter--bottom-left {
  animation-name: Toastify__slideInLeft;
}

.Toastify__slide-enter--top-right,
.Toastify__slide-enter--bottom-right {
  animation-name: Toastify__slideInRight;
}

.Toastify__slide-enter--top-center {
  animation-name: Toastify__slideInDown;
}

.Toastify__slide-enter--bottom-center {
  animation-name: Toastify__slideInUp;
}

.Toastify__slide-exit--top-left,
.Toastify__slide-exit--bottom-left {
  animation-name: Toastify__slideOutLeft;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

.Toastify__slide-exit--top-right,
.Toastify__slide-exit--bottom-right {
  animation-name: Toastify__slideOutRight;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

.Toastify__slide-exit--top-center {
  animation-name: Toastify__slideOutUp;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

.Toastify__slide-exit--bottom-center {
  animation-name: Toastify__slideOutDown;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

@keyframes Toastify__spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/*!********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./src/styles/globals.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************/
*,
*::before,
*::after {
    box-sizing: border-box;
}

p {
    margin: 0;
    color: var(--text-primary, #E0F2F7);
}

html {
    margin: 0;
    padding: 0;
    background-color: #0A1929;
}

body {
    width: 100vw;
    height: 100vh;
    margin: 0;
    /* v3.5 — Gemini 다크 진리값 (#0A1929 + vignette + cyan 액센트 라디얼) */
    background:
        radial-gradient(ellipse at 15% 20%, rgba(0, 212, 255, 0.06), transparent 50%),
        radial-gradient(ellipse at 85% 80%, rgba(35, 116, 236, 0.05), transparent 55%),
        radial-gradient(ellipse at center, rgba(15, 38, 56, 0.4) 0%, rgba(5, 19, 33, 0.85) 100%),
        linear-gradient(180deg, #0A1929 0%, #051321 100%);
    background-attachment: fixed;
    color: var(--text-primary, #E0F2F7);
    overflow: hidden;
    font-family: "Inter", "Open Sans", "Pretendard", "Apple SD Gothic Neo", sans-serif;
    -webkit-user-select: none;
    -moz-user-select: none;
         user-select: none;
}

input,
textarea,
select,
[contenteditable="true"],
.selectable {
    -webkit-user-select: text;
    -moz-user-select: text;
         user-select: text;
}

/* VWORLD 타일 seam(흰 격자) 처리 — Retina sub-pixel seam (2026-05-28):
   원인: 브라우저가 translate3d 로 타일 위치 계산 시 소수점 픽셀 반올림 오차 → 타일 사이
   틈이 벌어지고 뒤 배경이 비쳐 흰 격자로 보임. 줌아웃/레티나에서 심함.
   해법(제미나이 권장 정석): width 조절은 레이아웃 엔진이 무시/왜곡 → 대신 transform:scale
   로 타일을 미세 확대해 서로 겹치게 만들어 틈을 메움. backface-visibility 로 사파리 잔상 방지.
   image-rendering:optimize-contrast 는 우리 환경에서 연두 엣지 아티팩트 유발해 미사용. */
.leaflet-tile {
    outline: none !important;
    border: none !important;
}
/* Sub-pixel seam 대응 — 색 블렌드 방식 (2026-05-28):
   타일을 늘리면(width/scale) 가장자리 보간 잔상(흰/연두)이 생기고, 네이티브로 두면 소수점
   갭으로 컨테이너 배경이 비침. 늘리기 잔상이 더 거슬리므로 → 타일은 네이티브 유지(잔상 없음)
   + 컨테이너 배경을 위성 평균 톤(올리브-그레이)으로 깔아 남는 미세 갭이 지형에 묻히게 함.
   #0A1929(다크 네이비)는 밝은 위성 위에서 검은 격자로 튀어서 위성 톤으로 교체. */
.leaflet-container {
    background: #3d4239 !important;
}

div {
    -ms-overflow-style: none;
    scrollbar-width: none;
    &::-webkit-scrollbar {
        display: none;
    }
}

input,
button,
textarea,
select {
    font: inherit;
    background-color: transparent;
    border: none;
    outline: none;
    color: var(--text-primary, #E0F2F7);
}

input::placeholder,
textarea::placeholder,
select::placeholder {
    color: var(--text-tertiary, #94a3b8);
}

button {
    border: none;
    padding: 0;
    color: var(--text-primary, #E0F2F7);
    cursor: pointer;
    flex: none;
    text-align: center;
}

a {
    color: inherit;
    text-decoration: none;
}

/* 헤더 시그니처 — 회사 톤 4px underline (Montserrat 헤더 아래 강조 라인) */
.brand-underline {
    position: relative;
    padding-bottom: 12px;
}
.brand-underline::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 4px;
    background: #2374ec;
}

/* 헤더 폰트 — Montserrat (회사 톤) */
h1, h2, h3, h4, h5, h6, .brand-heading {
    font-family: "Montserrat", "Open Sans", "Pretendard", "Apple SD Gothic Neo", sans-serif;
    font-weight: 600;
    letter-spacing: -0.01em;
}

/* ─── 경보 애니메이션 (v3 light 톤) ───────────────────────────────── */
@keyframes livePulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.85); }
}

@keyframes cautionPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

@keyframes cautionBorderPulse {
    0%, 100% { box-shadow: inset 0 0 0 2px #f59e0b, 0 2px 8px rgba(245,158,11,0.18); }
    50% { box-shadow: inset 0 0 0 2px rgba(245,158,11,0.5), 0 2px 8px rgba(245,158,11,0.08); }
}

@keyframes emergencyBlink {
    0%, 100% { background: rgba(229,57,53,0.08); }
    50% { background: rgba(229,57,53,0.18); }
}

@keyframes criticalBg {
    0%, 100% { background: rgba(229,57,53,0.12); }
    50% { background: rgba(229,57,53,0.24); }
}

@keyframes cautionBannerBg {
    0%, 100% { background: rgba(245,158,11,0.18); }
    50% { background: rgba(245,158,11,0.08); }
}

/* ─── 디자인 토큰 v3.5 — Gemini PPT v1.0.7 A~E v2 5장 진리값 (2026-05-26 다크 회귀) ────
 * v1 다크 네이비 + 시안 글로우 (홍수)
 * v2 챠콜 + 호박 + IR 적색 (야간 SAR)
 * v3 White + 네이비 #014099 + 라이트 시안 (SY Korea 회사 라이트)
 * v3.5 Gemini 다크 — #0A1929 base + cyan #00D4FF accent + 외곽 글로우 시그니처
 *      회사 SY KOREA 로고/브랜딩은 유지 (헤더 connector). 배경/패널만 다크.
 *
 * 변수 이름은 v1~v3 100% 유지 — 컴포넌트 코드 변경 0. 값만 다크 톤으로 회귀.
 */
:root {
    /* ── 회사 브랜드 (다크 톤에 맞춰 brighter 변형으로 채도 유지) */
    --brand-navy: #4d92ff;            /* 메인 네이비 — 다크 위 가독성 */
    --brand-navy-bright: #7eb1ff;     /* 호버/포커스 */
    --brand-navy-deep: #a7c8ff;       /* 헤더/제목 — 다크 위에서는 더 밝게 (역할 = 강한 강조) */
    --brand-cyan: #00D4FF;            /* Gemini 진리값 cyan accent */
    --brand-cyan-deep: #1FA8C9;       /* border 1px용 */
    --brand-lime: #B5E853;            /* SK 로고 연두 유지 */
    --brand-lime-bright: #C8E443;
    --brand-lime-deep: #88B82A;
    --brand-sky-light: #0F2638;       /* 그라데이션 — 다크 톤으로 */
    --brand-sky-mid: #0A1929;
    --brand-sky-deep: #051321;

    /* ── 시안 액센트 (v1 시안 글로우 복원) */
    --cyan-accent: #00D4FF;
    --cyan-accent-target: #00D4FF;
    --cyan-border: rgba(31, 168, 201, 0.45);
    --cyan-border-strong: rgba(0, 212, 255, 0.65);
    --cyan-border-subtle: rgba(0, 212, 255, 0.18);
    --cyan-border-faint: rgba(255, 255, 255, 0.06);
    --cyan-border-light: rgba(0, 212, 255, 0.12);
    --cyan-bg-active: rgba(0, 212, 255, 0.12);
    --cyan-bg-subtle: rgba(0, 212, 255, 0.06);
    --cyan-bg-ghost: rgba(0, 212, 255, 0.04);
    --cyan-bg-faint: rgba(0, 212, 255, 0.025);
    --cyan-bg-pulse: rgba(0, 212, 255, 0.18);
    /* 외곽 글로우 시그니처 복원 (Gemini 진리값) */
    --cyan-glow: 0 0 18px rgba(19, 242, 242, 0.32);
    --cyan-glow-strong: 0 0 24px rgba(0, 212, 255, 0.45);
    --cyan-text-shadow: 0 0 8px rgba(0, 212, 255, 0.55);

    /* ── 호박/적색 (다크 톤) */
    --amber-accent: #FFB300;
    --amber-bright: #FCD34D;
    --amber-deep: #B45309;
    --ir-red: #FF4444;
    --ir-red-bright: #FF6B6B;
    --ir-red-bg: rgba(255, 68, 68, 0.12);
    --ir-red-border: rgba(255, 68, 68, 0.45);

    /* ── 상태 색 (다크 톤) */
    --state-danger: #FF4444;
    --state-danger-bright: #FF6B6B;
    --state-danger-target: #FF4444;
    --state-warning: #FFB300;
    --state-warning-alt: #FCD34D;
    --state-warning-bright: #FCD34D;
    --state-warning-target: #FFB300;
    --state-success: #00C853;
    --state-success-bright: #5ee9b5;
    --state-success-target: #00C853;
    --state-success-soft: #5ee9b5;
    --state-info: #00D4FF;

    /* ── 상태 배경/테두리 (다크) */
    --danger-bg-soft: rgba(255, 68, 68, 0.08);
    --danger-bg-active: rgba(255, 68, 68, 0.18);
    --danger-border-soft: rgba(255, 68, 68, 0.30);
    --danger-border: rgba(255, 68, 68, 0.55);
    --warning-bg-soft: rgba(255, 179, 0, 0.10);
    --warning-border-soft: rgba(255, 179, 0, 0.40);
    --success-bg-soft: rgba(0, 200, 83, 0.08);
    --success-border-soft: rgba(0, 200, 83, 0.30);

    /* ── 텍스트 (Gemini 진리값 — 밝은 글자 on 다크 배경) */
    --text-primary: #E0F2F7;
    --text-bright: #FFFFFF;
    --text-display: #00D4FF;           /* 큰 숫자/액센트 텍스트 */
    --text-secondary: #cad5e2;
    --text-tertiary: #94a3b8;
    --text-dim: #64748b;
    --text-disabled: #475569;
    --text-inverse: #0A1929;

    /* ── 배경 (Gemini 진리값 다크 패널) */
    --bg-app: #0A1929;
    --bg-panel: rgba(15, 38, 56, 0.6);     /* 반투명 60% — body 그라데이션 비침 */
    --bg-header: #051321;                  /* 헤더 슬림 — 60px */
    --bg-card: rgba(15, 38, 56, 0.75);
    --bg-card-deep: #0d1525;

    /* ── 분리선 (다크 톤 — 시안 옅게) */
    --border-divider: rgba(0, 212, 255, 0.10);
    --border-subtle: rgba(255, 255, 255, 0.05);
    --border-faint: rgba(255, 255, 255, 0.03);
    --border-hover: rgba(0, 212, 255, 0.35);
    --border-input: rgba(0, 212, 255, 0.15);

    /* ── 위험 글로우 — 다크 톤 적색 그림자 */
    --danger-glow: 0 0 16px rgba(255, 68, 68, 0.35);

    /* ── 잔여 호환 */
    --bg-dark-blue: #051321;
    --text-on-cyan: #0A1929;
    --text-on-warning: #0A1929;
    --cyan-text-glow: rgba(0, 212, 255, 0.55);
    --cyan-fill: #00D4FF;
    --warning-fill: #FFB300;
    --success-fill: #00C853;

    /* phase 색 (다크 톤 위계) */
    --phase-s2: #00D4FF;
    --phase-s2-bg: rgba(0, 212, 255, 0.10);
    --phase-s2-border: rgba(0, 212, 255, 0.30);
    --phase-s3: #FFB300;
    --phase-s3-bg: rgba(255, 179, 0, 0.10);
    --phase-s3-border: rgba(255, 179, 0, 0.35);
    --phase-s4: #FF4444;
    --phase-s4-bg: rgba(255, 68, 68, 0.10);
    --phase-s4-border: rgba(255, 68, 68, 0.35);
}

/* ─── 패널 시그니처 v3.5 — Gemini 다크 진리값 (외곽 cyan 글로우 + inset 1px liner) ──
 * v3 회사 underline → v3.5 회귀: 외곽 box-shadow 글로우 = 시그니처
 *
 * 카드 = 반투명 다크 + 1px cyan 보더 + 외곽 글로우 + inset 1px liner (Gemini A~E v2)
 */
.tactical-panel {
    position: relative;
    background: var(--bg-panel, rgba(15, 38, 56, 0.6));
    border: 1px solid var(--cyan-border, rgba(31, 168, 201, 0.45));
    box-shadow:
        var(--cyan-glow, 0 0 18px rgba(19, 242, 242, 0.32)),
        inset 0 0 0 1px rgba(0, 212, 255, 0.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: box-shadow 0.18s ease, border-color 0.18s ease;
}
.tactical-panel:hover {
    border-color: var(--brand-cyan, #00D4FF);
    box-shadow:
        var(--cyan-glow-strong, 0 0 24px rgba(0, 212, 255, 0.45)),
        inset 0 0 0 1px rgba(0, 212, 255, 0.18);
}

.tactical-panel-strong {
    position: relative;
    background: var(--bg-card, rgba(15, 38, 56, 0.75));
    border: 1px solid var(--cyan-border-strong, rgba(0, 212, 255, 0.65));
    box-shadow:
        var(--cyan-glow-strong, 0 0 24px rgba(0, 212, 255, 0.45)),
        inset 0 0 0 1px rgba(0, 212, 255, 0.18);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.tactical-modal {
    position: relative;
    background: var(--bg-card, rgba(15, 38, 56, 0.92));
    border: 1px solid var(--cyan-border-strong, rgba(0, 212, 255, 0.65));
    border-radius: 12px;
    box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.6),
        0 0 32px rgba(0, 212, 255, 0.25),
        inset 0 0 0 1px rgba(0, 212, 255, 0.12);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.tactical-danger {
    position: relative;
    background: var(--bg-card, rgba(15, 38, 56, 0.75));
    border: 1px solid var(--ir-red-border, rgba(255, 68, 68, 0.55));
    box-shadow:
        var(--danger-glow, 0 0 16px rgba(255, 68, 68, 0.35)),
        inset 0 0 0 1px rgba(255, 68, 68, 0.12);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}