body {
  margin: 0;
  line-height: normal;
  font-family: var(--font-family);
  overscroll-behavior: none;
  user-select: none;
}

.popup-overlay {
  display: flex;
  flex-direction: column;
  position: fixed;
  inset: 0;
}

/* ローディング画面 */
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: rgb(248, 227, 176);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  justify-content: center;
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.spinner {
  width: 100px;
  height: 100px;
  margin: 50px 50px;
  background-color: #ffffff;
  border-radius: 100%;
  animation: sk-scaleout 1s infinite ease-in-out;
}
.loadImg{
  width: 15rem;
  height: auto;
}
/* ローディングアニメーション */
@keyframes sk-scaleout {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
    opacity: 0;
  }
}

.popup-overlay {
  display: flex;
  flex-direction: column;
  position: fixed;
  inset: 0;
}
.loaded {
  opacity: 0;
  visibility: hidden;
}


:root {
  /* Common Style Variables */
  --font-family: "Inter", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Meiryo", sans-serif;

  /* Color */
  --color-black: #000;
  --color-darkorange: #ef8000;
  --color-dimgray-100: #6e6e6e;
  --color-dimgray-200: #565656;
  --color-gray-100: rgba(255, 255, 255, 0);
  --color-gray-200: rgba(0, 0, 0, 0.1);
  --color-gray-300: rgba(255, 255, 255, 0.88);
  --color-gray-400: rgba(0, 0, 0, 0.55);
  --color-mediumseagreen: #039f5c;
  --color-royalblue: #4f81ff;
  --color-steelblue: #039ac3;
  --color-steelblue-200: #0097c1;
  --color-white: #fff;
  --color-yellow: #e8ff4f;

  /* Gap */
  --gap-10: 0.625rem;
  --gap-14: 0.875rem;
  --gap-20: 1.25rem;
  --gap-24: 1.5rem;
  --gap-28: 1.75rem;
  --gap-32: 2rem;
  --gap-40: 2.5rem;
  --gap-64: 4rem;
  --gap-80: 5rem;

  /* Padding */
  --padding-0: 0rem;
  --padding-01: 0;
  --padding-10: 0.625rem;
  --padding-16: 1rem;
  --padding-20: 1.25rem;
  --padding-30: 1.875rem;
  --padding-50: 3.125rem;
  --padding-60: 3.75rem;
  --padding-64: 4rem;
  --padding-80: 5rem;
  --padding-100: 6.25rem;

  /* BorderRadius */
  --br-16: 16px;

  /* Font */
  --font-inter: Inter;

  /* FontSize */
  --fs-14: 0.875rem;
  --fs-15: 0.937rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-20: 1.25rem;
  --fs-24: 1.5rem;
  --fs-28: 1.75rem;
  --fs-36: 2.25rem;
  --fs-48: 3rem;
  --fs-60: 3.75rem;
  --fs-80: 5rem;

  /* WidthHeights */
  --height-18: 1.125rem;
  --height-19: 1.187rem;
  --height-24: 1.5rem;
  --height-26: 1.625rem;
  --height-28: 1.75rem;
  --height-30: 1.875rem;
  --height-80: 5rem;
  --width-19: 1.187rem;
  --width-24: 1.5rem;
  --width-30: 1.875rem;
  --width-auto: auto;

  /* LineHeights */
  --lh-100: 6.25rem;

  /* LetterSpacings */
  --ls--0_02: -0.02;
}
