마케터·영업 이력서 작성 가이드

내 이력서를 HTML 한 파일로 만들어줘. 디자인은 자유롭게 하되, 아래 schema.org Microdata 규약을 정확히 지켜야 해.

[필수 규약]
1. <body>를 schema.org Person 으로 연다: <body itemscope itemtype="https://schema.org/Person">. 이 루트가 없으면 업로드가 거부된다.
2. 직군은 Person 직속에 <span itemprop="occupationalCategory" style="display:none">marketer</span> 로 표시한다(화면에는 안 보여도 된다). 값은 반드시 소문자 영문 id: marketer.
2-1. (선택) 직군 안의 세분화는 Person 직속에 <span itemprop="roleName" style="display:none">값</span> 으로 표시한다. 안 써도 되고, 쓰면 세분화 검색에 노출된다. 마케터·영업 직군에서 쓸 수 있는 값: performance(퍼포먼스), content(콘텐츠), brand(브랜드), crm(CRM), sales(영업), pr(PR·홍보), seo(SEO). 다른 직군의 값을 쓰면 무시되고 경고가 뜬다.
3. 공통 프로필은 Person 직속 itemprop 으로: 이름 name, 한 줄 소개 jobTitle, 지역 address, 요약 description, 링크 <a itemprop="url" href>·<a itemprop="sameAs" href>, 스킬 <span itemprop="knowsAbout">…</span>(스킬마다 하나).
4. 반복되는 항목(경력 1건, 프로젝트 1건 등)은 itemprop="<영역키>" itemscope 요소 하나로 감싸고, 그 안의 값에 itemprop="<필드키>" 를 붙인다.
5. 기간은 <time itemprop="period" datetime="YYYY-MM/YYYY-MM"> 형식으로 쓴다. 재직 중이면 끝을 present 로. 화면 텍스트는 자유지만 실제로 읽히는 건 datetime 속성뿐이다.
6. (선택) 스킬에 숙련도·사용 기간을 붙일 수 있다. 붙이면 "6년 쓴 React"와 "한 번 써본 React"가 검색에서 구분된다. 기본형(3번의 <span itemprop="knowsAbout">)만 써도 전혀 문제 없고, 붙이고 싶은 스킬만 골라서 아래 형태로 바꾸면 된다:
   <div itemprop="knowsAbout" itemscope itemtype="https://schema.org/DefinedTerm">
     <span itemprop="name">React</span>
     <span itemprop="proficiencyLevel">고급</span>
     <span itemprop="experienceMonths">62</span>
   </div>
   - proficiencyLevel: 초급 / 중급 / 고급 / 전문가 (영문 beginner / intermediate / advanced / expert 도 된다). 이 중 하나로 해석되지 않는 표기는 버려진다.
   - experienceMonths: 개월수. "62", "62개월", "5년 2개월", "5 years" 모두 읽는다. 0~600개월 범위를 벗어나면 버려진다.
   - 화면에 숫자를 그대로 보이고 싶지 않으면 style="display:none" 을 줘도 값은 읽힌다.
7. (선택) 경력마다 seniority(직급) · industry(산업) · companySize · companyType 을 적을 수 있다. Person 직속에는 workLocation(지역) · workMode(근무형태) · employmentType(고용형태: 정규직/계약직/파트타임/인턴/프리랜서)를 적는다. 모르면 생략한다 — 지어내지 말 것. 값 목록은 규약 API 의 industries · regions 를 따른다.

[공통 영역 — 모든 직군이 갖는다]
- itemprop="profile" (기본 정보): 내부 itemprop 은 name, headline, location, link
- itemprop="summary" (요약): 내부 itemprop 은 summary
- itemprop="experience" (경력): 내부 itemprop 은 company, role, period, achievement, seniority, industry, companySize, companyType
- itemprop="education" (학력): 내부 itemprop 은 school, degree, major, period
- itemprop="skills" (스킬): 내부 itemprop 은 skill
- itemprop="certifications" (자격·수상): 내부 itemprop 은 certification, issuer, period
- itemprop="links" (링크): 내부 itemprop 은 link

[마케터·영업 특화 영역 — 이 직군에만 있다]
- itemprop="campaigns" (캠페인): 내부 itemprop 은 campaign, channel, budget, result, description

[제약]
- JavaScript는 실행되지 않는다(스크립트가 동작하지 않는 안전한 iframe에서 열람된다). CSS만 쓴다. <script>, <iframe>, <form>, <input>, <meta>, <base>, SVG 태그(<svg> 포함)는 전부 제거되니 넣지 않는다. 아이콘이 필요하면 이미지(<img>)로 넣는다.
- 웹폰트를 CSS @font-face 나 @import 로 외부에서 불러오면 차단되어 적용되지 않는다. 폰트는 system-ui 같은 시스템 폰트를 쓰거나, 꼭 필요하면 base64 data URI로 <style> 안에 직접 심는다.
- 파일 크기는 2MB 이하. 이미지는 외부 https URL을 쓰거나, 추적을 막고 싶으면 base64 data URI(<img src="data:image/png;base64,...">)로 직접 심는다. 외부 URL로 이미지를 걸면 그 이미지를 호스팅하는 쪽이 열람자의 IP와 접속 시각을 알 수 있다.
- 인라인 SVG를 <style> 배경으로 넣을 때(예: background: url('data:image/svg+xml;utf8,<svg ...>')) raw "<svg"가 그대로 들어가면 그 <style> 블록 전체가 삭제된다. "%3Csvg"로 퍼센트 인코딩하거나 base64 data URI를 쓴다.

내 경력 정보는 다음과 같아:
(여기에 본인 경력을 붙여넣으세요)

<!doctype html>
<html lang="ko">
<head>
  <meta charset="utf-8">
  <title>홍길동 이력서</title>
  <style>
    body { font-family: system-ui, sans-serif; max-width: 720px; margin: 0 auto; padding: 40px; }
    section, div[itemprop] { margin-bottom: 24px; }
  </style>
</head>
<body itemscope itemtype="https://schema.org/Person">
  <span itemprop="occupationalCategory" style="display:none">marketer</span>
  <span itemprop="roleName" style="display:none">performance</span>

  <h1 itemprop="name">홍길동</h1>
  <p itemprop="jobTitle">7년차 백엔드 엔지니어</p>
  <span itemprop="address">서울</span>
  <span itemprop="workLocation" style="display:none">seoul-gangnam</span>
  <span itemprop="workMode" style="display:none">hybrid</span>
  <span itemprop="employmentType" style="display:none">정규직</span>
  <a itemprop="url" href="https://github.com/hong">GitHub</a>
  <a itemprop="sameAs" href="https://blog.example.com">기술 블로그</a>

  <p itemprop="description">결제 시스템을 7년간 설계하고 운영했습니다.</p>

  <span itemprop="knowsAbout">Kotlin</span>
  <span itemprop="knowsAbout">Kubernetes</span>
  <!-- 숙련도·기간은 선택 확장이다. 위 단순 형태로만 써도 스킬은 그대로 잡힌다. -->
  <div itemprop="knowsAbout" itemscope itemtype="https://schema.org/DefinedTerm">
    <span itemprop="name">PostgreSQL</span>
    <span itemprop="proficiencyLevel">고급</span>
    <span itemprop="experienceMonths">62</span>
  </div>
  <!-- 언어 능력도 스킬 사전의 스킬이다(category natural-language) — 별칭 해석은 한글
       표기("영어")를 그대로 인식한다. -->
  <div itemprop="knowsAbout" itemscope itemtype="https://schema.org/DefinedTerm">
    <span itemprop="name">영어</span>
    <span itemprop="proficiencyLevel">고급</span>
  </div>

  <div itemprop="experience" itemscope itemtype="https://schema.org/OrganizationRole">
    <h3 itemprop="company">토스</h3>
    <span itemprop="role">Server Developer</span>
    <time itemprop="period" datetime="2021-03/2024-08">2021.03 – 2024.08</time>
    <ul><li itemprop="achievement">결제 API 응답속도 35% 개선</li></ul>
    <span itemprop="seniority">시니어</span>
    <span itemprop="industry">핀테크</span>
    <span itemprop="companySize">스타트업</span>
    <span itemprop="companyType">자사서비스</span>
  </div>

  <div itemprop="education" itemscope itemtype="https://schema.org/EducationalOrganization">
    <span itemprop="school">한국대학교</span>
    <span itemprop="degree">학사</span>
    <span itemprop="major">컴퓨터공학</span>
  </div>

  <div itemprop="certifications" itemscope itemtype="https://schema.org/EducationalOccupationalCredential">
    <span itemprop="certification">정보처리기사</span>
    <span itemprop="issuer">한국산업인력공단</span>
  </div>

  <div itemprop="campaigns" itemscope itemtype="https://schema.org/CreativeWork">
    <h3 itemprop="campaign">여름 시즌 퍼포먼스</h3>
    <span itemprop="channel">Meta Ads</span>
    <span itemprop="budget">3억원</span>
    <span itemprop="result">ROAS 480%</span>
    <p itemprop="description">크리에이티브 A/B 12종을 4주간 운영.</p>
  </div>
</body>
</html>