디자인킷 · 레이아웃
본문: 위 핵심 문장과 아래 3열 근거
D-레이아웃-본문-핵심문장3열
언제 쓰는가
전략이나 원칙을 한 문장으로 먼저 말하고 아래 3열로 풀어 주는 장. 핵심 문장 2줄 이내, 근거 3열 고정. 값 바꾸는 법: .key 핵심 문장, 열마다 .k(구분) .t(요지 14자 이내) 설명 2줄. 강조색은 핵심 문장 바탕 한 곳.
참고
McKinsey·BCG·Bain 장 구성 해설(slidemodel.com/mckinsey-presentation-structure, deckary.com/blog/consulting-slide-standards, deckary.com/blog/executive-summary-slides) 의 주장 한 줄 + 근거 3개(피라미드) 구성. 구성 방식만 참고, 코드와 문구는 직접 제작.
조각
<section class="slide lo-key-3">
<div class="run"><b>모루리빙 2027 상반기 통합 디지털 마케팅 제안</b><span>PART 02 · 전략 방향</span></div>
<div class="hd"><p class="lb">전략 방향</p><h1>매체별 역할을 유입, 설득, 재구매로 분리</h1></div>
<div class="body">
<p class="key">한 매체가 모든 역할을 맡는 구조를 끝내고, 단계마다 맡는 매체와 지표를 하나씩 지정</p>
<div class="cols">
<div><p class="k">유입 · 검색 광고</p><p class="t">구매 의도 키워드 120개 집중</p><p>현재 480개 키워드 중 전환이 발생한 120개에 예산 집중. 지표는 전환당 비용</p></div>
<div><p class="k">설득 · 인플루언서와 디스플레이</p><p class="t">리뷰형 콘텐츠 월 12건</p><p>사용 후기 영상을 상세페이지와 광고 소재로 재사용. 지표는 상세페이지 체류 시간</p></div>
<div><p class="k">재구매 · 맞춤 광고와 알림 메시지</p><p class="t">구매 후 30일, 60일, 85일 접점</p><p>교체 주기에 맞춘 안내 3회. 지표는 90일 내 재구매율</p></div>
</div>
</div>
<div class="pg">12</div>
</section>스타일
.slide.lo-key-3 .hd .lb{color:var(--mu)}
.slide.lo-key-3 .body{gap:var(--s7)}
.slide.lo-key-3 .key{font-size:var(--f-xl);font-weight:700;line-height:1.45;letter-spacing:-.02em;background:var(--acw);border-radius:var(--r);padding:32px 36px;margin:0}
.slide.lo-key-3 .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.slide.lo-key-3 .cols>div{border-top:2px solid var(--ink);padding-top:18px}
.slide.lo-key-3 .cols p{margin:0;color:var(--ink2)}
.slide.lo-key-3 .cols .k{font-size:var(--f-cap);font-weight:600;color:var(--mu)}
.slide.lo-key-3 .cols .t{font-size:var(--f-xl);font-weight:700;color:var(--ink);letter-spacing:-.02em;margin:6px 0 10px}