왼쪽 핵심 문장과 오른쪽 세부 목록

주장 하나와 그것을 풀어 주는 세부 내용 4~5개를 한 장에 둘 때. 왼쪽 문장 3~4줄(40자 안팎), 오른쪽 항목 4~5개, 항목 설명 1~2줄. 값 바꾸는 법: .big=핵심 문장(em 한 곳), .s=보충 한 줄. 오른쪽 dl 의 div 하나가 세부 항목(dt 굵은 낱말 2~4자, dd 설명). 항목 4~5개.

컨설팅 장표 규칙 해설(Deckary 'consulting slide standards' https://deckary.com/blog/consulting-slide-standards , 'slide types guide' https://deckary.com/blog/pillar-slide-types-guide)의 무장식·제한된 색·한 장 한 주장 원칙 참고. 왼쪽에 주장, 오른쪽에 세부를 두는 1:2 좌우 분할(같은 폴더 밖 조각 D-도식-핵심어근거3 의 문장형 변형). 구성 방식만 참고, 그림과 코드는 직접 제작.

<div class="dk dk-tlead">
  <div class="l">
    <p class="k">제안 방향</p>
    <p class="big">광고와 후기 콘텐츠를 <em>한 계획</em>으로 묶어 운영</p>
    <p class="s">매체별로 따로 움직이던 일정과 메시지를 하나의 월간 계획표에 올림</p>
  </div>
  <dl>
    <div><dt>메시지</dt><dd>월별 중심 메시지 1개를 정하고 모든 매체가 같은 문구 사용</dd></div>
    <div><dt>일정</dt><dd>소재 교체, 체험단 발행, 자사 채널 게시를 같은 주에 배치</dd></div>
    <div><dt>예산</dt><dd>주 단위로 성과 좋은 묶음에 이동, 이동 폭은 전체의 20% 이내</dd></div>
    <div><dt>측정</dt><dd>매체가 달라도 전환 기준과 기여 기간을 하나로 통일</dd></div>
    <div><dt>보고</dt><dd>매체별 보고서 대신 통합 리포트 1건</dd></div>
  </dl>
</div>

.dk-tlead{display:grid;grid-template-columns:460px minmax(0,1fr);align-items:center}
.dk-tlead .l{padding-right:56px}
.dk-tlead .k{margin:0 0 10px;font-size:var(--f-sm);font-weight:600;color:var(--mu)}
.dk-tlead .big{margin:0;font-size:var(--f-h);font-weight:700;line-height:1.38;letter-spacing:-.025em}
.dk-tlead .big em{font-style:normal;color:var(--ac);white-space:nowrap}
.dk-tlead .s{margin:16px 0 0;font-size:var(--f-body);color:var(--ink2)}
.dk-tlead dl{margin:0;padding-left:56px;border-left:1px solid var(--line2)}
.dk-tlead dl>div{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:baseline;padding:19px 0;border-bottom:1px solid var(--line)}
.dk-tlead dl>div:first-child{padding-top:6px}
.dk-tlead dl>div:last-child{border-bottom:0;padding-bottom:6px}
.dk-tlead dt{font-size:var(--f-md);font-weight:700;color:var(--ink)}
.dk-tlead dd{margin:0;font-size:var(--f-body);color:var(--ink2)}