@charset "utf-8";

/* common.css */
* {
  padding: 0;
  margin: 0;
  font-family: 'Pretendard';
}

li {
  list-style: none;
}

a {
  color: #000;
  text-decoration: none;
}

/* 공통 box-sizing 설정 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 기본 폰트 설정 */
body {
  line-height: 1.6;
  color: #333;
  background-color: #fff;
  font-family: 'Pretendard';
  font-size: 16px;
  font-weight: 400;
}

/* 링크 스타일 */
a {
  color: inherit;
  font-family: 'Pretendard';
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* 버튼 공통 스타일 */
button {
  border: none;
  background: none;
  cursor: pointer;
  font-family: inherit;
}

/* 이미지 반응형 */
img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* 폼 요소 기본 스타일 */
input,
textarea,
select {
  padding: 2rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  outline: none;
  font-family: inherit;
  font-size: 1rem;
}

input:focus,
textarea:focus,
select:focus {
  border-color: #007bff;
}

/* 공통 레이아웃 클래스 */
.inner_wrap {
  position: relative;
  width: 1340px;
  margin: 0 auto;
  box-sizing: border-box;
}

.text-center {
  text-align: center;
}

/* 접근성: 화면에는 안보이지만 스크린리더용 텍스트 */
.sr-only {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  white-space: nowrap;
  clip: rect(0, 0, 0, 0);
}

:root {
  --spacing-60: 60px;
  --spacing-40: 40px;
  --spacing-30: 30px;
  --spacing-32: 32px;
  --spacing-28: 28px;
  --spacing-24: 24px;
  --spacing-20: 20px;
  --spacing-18: 18px;
  --spacing-16: 16px;
  --spacing-12: 12px;
  --spacing-10: 10px;
  --spacing-8: 8px;
  --spacing-4: 4px;
  --fz-xxl: 8rem;
  --fz-xl: 6rem;
  --fz-40: 4rem;
  --fz-36: 3.6rem;
  --fz-32: 3.2rem;
  --fz-24: 2.4rem;
  --fz-20: 2rem;
  --fz-19: 1.9rem;
  --fz-17: 1.7rem;
  --fz-14: 1.4rem;
  --fz-12: 1.2rem;
  --color-black: #000;
  --color-default: #111;
  --color-darkgray: #666;
  --color-gray: #bbb;
  --color-gray2: #ccc;
  --color-lightgray: rgba(255, 255, 255, 0.3);
  --color-lightgray2: #f8f8f8;
  --color-white: #fff;
  --color-primary: #0075c2;
  --color-secondary: #eb5402;
  --color-red: #ff0a73;
  --color-deepred: #e11212;
  --color-yellow: #ffb400;
  --color-green: #00bd6a;
  --color-deepgreen: #0d7617;
  --color-blue: #0082ff;
  --color-deepblue: #0f629e;
  --bg-color-main: #ffffff;
  --fw-Black: 900;
  --fw-ExtraBold: 800;
  --fw-Bold: 700;
  --fw-SemiBold: 600;
  --fw-Medium: 500;
  --fw-Regular: 400;
  --fw-Light: 300;
  --fw-ExtraLight: 200;
  --fw-Thin: 100;
}

.mr12 {
  margin-right: var(---spacing-12);
}

.btn_color {
  color: var(--bg-color-main);
}