마루 부리

아래 폰트 정보를 참고하여 웹페이지에 적용해주세요.

## Quick Apply
```css
/* 5종 굵기 전체 등록 */
@font-face {
  font-family: 'MaruBuri';
  font-weight: 200;
  font-display: swap;
  src: url('https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/200.woff2') format('woff2');
}

@font-face {
  font-family: 'MaruBuri';
  font-weight: 300;
  font-display: swap;
  src: url('https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/300.woff2') format('woff2');
}

@font-face {
  font-family: 'MaruBuri';
  font-weight: 400;
  font-display: swap;
  src: url('https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/400.woff2') format('woff2');
}

.target { font-family: 'MaruBuri', sans-serif; font-weight: 400; }
```

## 폰트 정보
- 폰트 이름: 마루 부리
- 영문 이름: MaruBuri
- 제작사: 네이버
- 카테고리: batang
- 언어: 한국어
- 사용 가능 굵기: 100, 200, 300, 400, 500
- 라이선스: Free
- 무드: Classic, Formal, Luxury, Warm
- 스타일: 바탕체, 본문용, 문서용, 또박또박

## 적용 방법

### 1. CSS @font-face (권장 — 굵기별 개별 로딩)
```css
/* 5종 굵기 개별 로딩 (@font-face) */
@font-face {
  font-family: 'MaruBuri';
  font-weight: 200;
  font-display: swap;
  src: url('https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/200.woff2') format('woff2');
}

@font-face {
  font-family: 'MaruBuri';
  font-weight: 300;
  font-display: swap;
  src: url('https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/300.woff2') format('woff2');
}

@font-face {
  font-family: 'MaruBuri';
  font-weight: 400;
  font-display: swap;
  src: url('https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/400.woff2') format('woff2');
}
```

### 2. HTML preload (빠른 로딩)
```html
<!-- 200 weight -->
<link rel="preload" href="https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/200.woff2" as="font" type="font/woff2" crossorigin />
<!-- 300 weight -->
<link rel="preload" href="https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/300.woff2" as="font" type="font/woff2" crossorigin />
<!-- 400 weight -->
<link rel="preload" href="https://cdn.jsdelivr.net/gh/gykim80/gulim_font@main/fonts/ko/batang/MaruBuri/400.woff2" as="font" type="font/woff2" crossorigin />
```

### 3. 굵기별 사용
```css
/* 사용 가능한 굵기: 100, 200, 300, 400, 500 */
.thin    { font-family: 'MaruBuri', sans-serif; font-weight: 100; }
.regular { font-family: 'MaruBuri', sans-serif; font-weight: 400; }
.bold    { font-family: 'MaruBuri', sans-serif; font-weight: 700; }
.black   { font-family: 'MaruBuri', sans-serif; font-weight: 900; }
```

### 4. Tailwind CSS 설정 (tailwind.config)
```js
// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      fontFamily: {
        custom: ['"MaruBuri"', 'sans-serif'],
      },
    },
  },
}
```

### 5. 사용 예시
```html
<h1 style="font-family: 'MaruBuri', sans-serif; font-weight: 100;">
  제목 텍스트
</h1>
```

### 6. React/Next.js
```tsx
<p style={{ fontFamily: '"MaruBuri", sans-serif', fontWeight: 700 }}>
  텍스트
</p>
```