@charset "UTF-8";
@import url("https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css");
@import url("https://fonts.googleapis.com/css?family=SpoqaHanSans:700");

* {
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  background-color: #ffffff;
  overflow-x: hidden; /* 가로 스크롤 방지 */
  width: 100vw;
}

/* 모바일 컨테이너 기본 스타일 */
.MO {
  background-color: #ffffff;
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100vw; /* 뷰포트 전체 너비 */
  min-height: 100vh; /* 최소 전체 화면 높이 */
  overflow-x: hidden; /* 가로 스크롤 방지 */
}

.MO .div {
  background-color: var(--white);
  overflow-x: hidden;
  overflow-y: auto;
  width: 100vw; /* 뷰포트 전체 너비 */
  min-height: 100vh; /* 최소 전체 화면 높이 */
  position: relative;
}

/* 반응형 미디어 쿼리 */
@media (max-width: 320px) {
  html {
    font-size: 14px; /* 작은 화면에서 기본 폰트 크기 줄임 */
  }
}

@media (min-width: 480px) {
  .MO .div {
    max-width: 100%; /* 반응형으로 전체 너비 사용 */
    margin: 0 auto; /* 중앙 정렬 */
  }
}

/* a blue color as a generic focus style */
button:focus-visible {
  outline: 2px solid #4a90e2 !important;
  outline: -webkit-focus-ring-color auto 5px !important;
}
a {
  text-decoration: none;
}