디자인킷 · 반폭
반폭 · 용어 정의 2~3개
D-반폭-용어정의3
언제 쓰는가
제안서에서 쓰는 지표나 용어의 뜻과 이 문서에서의 기준을 밝힐 때. 용어 7자 이내, 정의 38자 이내, 기준 20자 이내. 값 바꾸는 법: .r 하나가 한 용어. .k 의 b=용어, span=약어. .d=정의, 그 안의 span=이 문서 기준. 2~3개.
참고
직접 제작. 보고서 부록의 용어 정의(glossary) 표 방식 참고. 일반 정의와 이 문서의 적용 기준을 두 줄로 나눔.
조각
<div class="dk dkh dkh-t-term"><div class="dk-card"><p class="dk-lb">이 문서의 지표 정의</p><div class="ls"> <div class="r"><div class="k"><b>전환당 비용</b><span>CPA</span></div><div class="d">전환 1건을 얻는 데 쓴 광고비. 광고비 ÷ 전환 건수<span>본 문서 기준: 구매 완료 1건</span></div></div> <div class="r"><div class="k"><b>광고 수익률</b><span>ROAS</span></div><div class="d">광고비 대비 광고 경유 매출의 비율. 매출 ÷ 광고비<span>본 문서 기준: 결제 기준, 취소 제외</span></div></div> <div class="r"><div class="k"><b>노출 점유율</b><span>IS</span></div><div class="d">노출될 수 있었던 횟수 중 실제 노출된 비율<span>본 문서 기준: 검색 광고 한정</span></div></div> </div></div></div>
스타일
.dkh-t-term .dk-card{display:flex;flex-direction:column;padding:22px 26px}
.dkh-t-term .dk-lb{margin:0 0 10px}
.dkh-t-term .ls{flex:1;min-height:0;display:flex;flex-direction:column}
.dkh-t-term .r{flex:1;display:grid;grid-template-columns:104px 1fr;column-gap:14px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.dkh-t-term .r:first-child{border-top-color:var(--line2)}
.dkh-t-term .k b{display:block;font-size:var(--f-body);font-weight:600;line-height:1.4;white-space:nowrap}
.dkh-t-term .k span{display:block;font-size:var(--f-cap);color:var(--mu)}
.dkh-t-term .d{font-size:var(--f-sm);color:var(--ink2);line-height:1.5}
.dkh-t-term .d span{display:block;margin-top:2px;font-size:var(--f-cap);color:var(--mu)}