본문: 왼쪽 글과 오른쪽 그림 자리(55:45)

설명 3가지와 그림(화면 캡처, 도식, 사진) 한 장을 나란히. 글 항목 2~3개, 그림 1개. 값 바꾸는 법: li 2~3개(제목 + 설명 한두 줄). .slot 자리에 그림을 넣고 높이 340 유지. 좌우를 바꾸려면 ul 과 figure 순서와 grid 비율을 함께 교체.

장 레이아웃 유형 정리(madegooddesigns.com/slide-layout-ideas), Behance·Dribbble pitch deck·editorial slide layout 검색 결과의 공통 구성 의 image-and-text split, McKinsey·BCG·Bain 장 구성 해설(slidemodel.com/mckinsey-presentation-structure, deckary.com/blog/consulting-slide-standards, deckary.com/blog/executive-summary-slides) 의 "한 장에 근거물 하나" 원칙. 구성 방식만 참고, 코드와 문구는 직접 제작.

<section class="slide lo-text-fig">
  <div class="run"><b>모루리빙 2027 상반기 통합 디지털 마케팅 제안</b><span>PART 01 · 현황 진단</span></div>
  <div class="hd"><p class="lb">현황 진단</p><h1>상세페이지 이탈이 전환 손실의 최대 구간</h1><p class="lede">자사몰 유입 100명 기준 단계별 잔존 인원, 2026년 3분기</p></div>
  <div class="body">
    <div class="grid">
      <ul>
        <li><p class="t">상세페이지에서 62명 이탈</p><p>유입 100명 중 장바구니 도달 38명. 스크롤 절반 이전 이탈이 다수</p></li>
        <li><p class="t">모바일 첫 화면에 가격과 배송 정보 부재</p><p>가격 확인까지 평균 4회 스크롤. 비교 대상 자사몰 3곳은 첫 화면 노출</p></li>
        <li><p class="t">리뷰 영역이 페이지 최하단에 위치</p><p>리뷰 도달률 21%. 구매 고객의 74%는 리뷰 열람 후 결제</p></li>
      </ul>
      <figure><div class="slot">그림 자리 · 상세페이지 화면 캡처</div><figcaption>모바일 상세페이지 첫 화면, 2026년 9월 기준</figcaption></figure>
    </div>
  </div>
  <div class="pg">06</div>
</section>

.slide.lo-text-fig .slot{background:var(--soft);border:1px dashed var(--line2);border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:var(--f-cap);color:var(--mu)}
.slide.lo-text-fig .grid{display:grid;grid-template-columns:55fr 45fr;gap:48px;align-items:stretch}
.slide.lo-text-fig ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:center}
.slide.lo-text-fig li{padding:20px 0;border-top:1px solid var(--line)}
.slide.lo-text-fig li:first-child{border-top:0;padding-top:0}
.slide.lo-text-fig li p{margin:0;color:var(--ink2)}
.slide.lo-text-fig li .t{font-size:var(--f-lg);font-weight:700;color:var(--ink);margin-bottom:6px}
.slide.lo-text-fig figure{margin:0;display:flex;flex-direction:column;gap:10px}
.slide.lo-text-fig .slot{height:340px}
.slide.lo-text-fig figcaption{font-size:var(--f-cap);color:var(--mu)}