7a73e6c5a9
- contact@sam.co.kr 행 삭제 - 무료 데모 관련 행 삭제 - www.sam.co.kr → www.sam.it.kr 변경 - v1~v9 1page + 2page PPTX 전체 재생성
278 lines
21 KiB
HTML
278 lines
21 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css">
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body {
|
|
width: 405pt; height: 720pt;
|
|
font-family: 'Pretendard', sans-serif;
|
|
background: #FAFAF9;
|
|
padding: 26pt 22pt 16pt 22pt;
|
|
display: flex; flex-direction: column;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- 헤더 -->
|
|
<div style="display: flex; align-items: center; gap: 8pt; margin-bottom: 16pt;">
|
|
<img src="/home/aweso/sam/docs/assets/bi/sam_bi_black.png" style="height: 22pt;">
|
|
<div style="flex: 1;"></div>
|
|
<p style="white-space: nowrap; font-size: 6.5pt; color: #A8A29E;">CEO DASHBOARD v7</p>
|
|
</div>
|
|
|
|
<!-- 히어로 섹션 -->
|
|
<div style="display: flex; align-items: center; gap: 14pt; margin-bottom: 18pt;">
|
|
<div style="flex: 1;">
|
|
<p style="white-space: nowrap; font-size: 8pt; font-weight: 600; color: #0D9488; letter-spacing: 0.1em; margin-bottom: 5pt;">EXECUTIVE DASHBOARD</p>
|
|
<h1 style="font-size: 19pt; font-weight: 800; color: #292524; line-height: 1.35; margin-bottom: 6pt;">대표님, 우리 회사<br>지금 어떤 상태인가요?</h1>
|
|
<p style="font-size: 8pt; color: #57534E; line-height: 1.55;">매출, 수주, 조직 실적, 승인 대기<br>더 이상 보고를 기다리지 마세요.</p>
|
|
</div>
|
|
<!-- 히어로 아이콘 -->
|
|
<div style="flex-shrink: 0; width: 80pt; height: 80pt;">
|
|
<svg viewBox="0 0 90 90" width="80pt" height="80pt" xmlns="http://www.w3.org/2000/svg">
|
|
<!-- 모니터 외곽 -->
|
|
<rect x="8" y="10" width="74" height="50" rx="5" fill="none" stroke="#0D9488" stroke-width="1.5" opacity="0.5"/>
|
|
<rect x="12" y="14" width="66" height="42" rx="3" fill="#FFFFFF"/>
|
|
<!-- KPI 미니 카드들 -->
|
|
<rect x="15" y="17" width="14" height="10" rx="1.5" fill="rgba(13,148,136,0.15)"/>
|
|
<rect x="31" y="17" width="14" height="10" rx="1.5" fill="rgba(16,185,129,0.15)"/>
|
|
<rect x="47" y="17" width="14" height="10" rx="1.5" fill="rgba(139,92,246,0.15)"/>
|
|
<rect x="63" y="17" width="12" height="10" rx="1.5" fill="rgba(239,68,68,0.15)"/>
|
|
<!-- 미니 차트 -->
|
|
<path d="M16 45 L22 40 L28 42 L34 36 L40 33 L46 30 L52 32 L58 26 L64 28 L70 22 L75 25" fill="none" stroke="#0D9488" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" opacity="0.8"/>
|
|
<path d="M16 45 L22 40 L28 42 L34 36 L40 33 L46 30 L52 32 L58 26 L64 28 L70 22 L75 25 L75 50 L16 50 Z" fill="#0D9488" opacity="0.08"/>
|
|
<!-- 모니터 받침 -->
|
|
<rect x="36" y="60" width="18" height="3" rx="1" fill="#0D9488" opacity="0.3"/>
|
|
<rect x="32" y="63" width="26" height="2" rx="1" fill="#0D9488" opacity="0.2"/>
|
|
<!-- 알림 뱃지 -->
|
|
<circle cx="73" cy="14" r="5" fill="#EF4444" opacity="0.9"/>
|
|
<text x="73" y="16.5" text-anchor="middle" fill="#fff" font-size="6" font-weight="800">5</text>
|
|
<!-- 와이파이 -->
|
|
<path d="M66 72 Q72 66 78 72" fill="none" stroke="#10B981" stroke-width="1" opacity="0.4"/>
|
|
<path d="M63 76 Q72 68 81 76" fill="none" stroke="#10B981" stroke-width="1" opacity="0.25"/>
|
|
<circle cx="72" cy="76" r="1.5" fill="#10B981" opacity="0.5"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 구분선 -->
|
|
<div style="height: 1pt; background: #D6D3D1; margin-bottom: 16pt;"></div>
|
|
|
|
<!-- 고민 섹션 (타임라인 인포그래픽) -->
|
|
<div style="margin-bottom: 16pt;">
|
|
<p style="white-space: nowrap; font-size: 7.5pt; font-weight: 700; color: #EF4444; margin-bottom: 8pt;">대표님의 하루</p>
|
|
<div style="display: flex; flex-direction: column; gap: 4pt;">
|
|
<!-- AM 9:00 -->
|
|
<div style="display: flex; align-items: center; gap: 6pt;">
|
|
<svg viewBox="0 0 26 26" width="18pt" height="18pt" xmlns="http://www.w3.org/2000/svg" style="flex-shrink: 0;">
|
|
<circle cx="13" cy="13" r="11" fill="rgba(239,68,68,0.06)" stroke="rgba(239,68,68,0.2)" stroke-width="1"/>
|
|
<circle cx="13" cy="13" r="8" fill="none" stroke="#EF4444" stroke-width="0.8" opacity="0.4"/>
|
|
<path d="M13 7 L13 13 L17 15" fill="none" stroke="#EF4444" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<text x="13" y="22" text-anchor="middle" fill="#EF4444" font-size="3.5" font-weight="600" opacity="0.7">9AM</text>
|
|
</svg>
|
|
<div style="flex: 1; background: rgba(239,68,68,0.04); border: 1pt solid rgba(239,68,68,0.1); border-radius: 6pt; padding: 6pt 8pt;">
|
|
<p style="font-size: 7.5pt; color: #57534E; white-space: nowrap;">"어제 매출 얼마야?" <span style="color: #EF4444; font-weight: 600;">팀장 보고 대기중...</span></p>
|
|
</div>
|
|
</div>
|
|
<!-- PM 2:00 -->
|
|
<div style="display: flex; align-items: center; gap: 6pt;">
|
|
<svg viewBox="0 0 26 26" width="18pt" height="18pt" xmlns="http://www.w3.org/2000/svg" style="flex-shrink: 0;">
|
|
<circle cx="13" cy="13" r="11" fill="rgba(239,68,68,0.06)" stroke="rgba(239,68,68,0.2)" stroke-width="1"/>
|
|
<circle cx="13" cy="13" r="8" fill="none" stroke="#EF4444" stroke-width="0.8" opacity="0.4"/>
|
|
<path d="M13 7 L13 13 L9 16" fill="none" stroke="#EF4444" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<text x="13" y="22" text-anchor="middle" fill="#EF4444" font-size="3.5" font-weight="600" opacity="0.7">2PM</text>
|
|
</svg>
|
|
<div style="flex: 1; background: rgba(239,68,68,0.04); border: 1pt solid rgba(239,68,68,0.1); border-radius: 6pt; padding: 6pt 8pt;">
|
|
<p style="font-size: 7.5pt; color: #57534E; white-space: nowrap;">"수주 밀린 거 없어?" <span style="color: #EF4444; font-weight: 600;">Excel 취합중...</span></p>
|
|
</div>
|
|
</div>
|
|
<!-- PM 5:00 -->
|
|
<div style="display: flex; align-items: center; gap: 6pt;">
|
|
<svg viewBox="0 0 26 26" width="18pt" height="18pt" xmlns="http://www.w3.org/2000/svg" style="flex-shrink: 0;">
|
|
<circle cx="13" cy="13" r="11" fill="rgba(239,68,68,0.06)" stroke="rgba(239,68,68,0.2)" stroke-width="1"/>
|
|
<circle cx="13" cy="13" r="8" fill="none" stroke="#EF4444" stroke-width="0.8" opacity="0.4"/>
|
|
<path d="M13 7 L13 13 L8 12" fill="none" stroke="#EF4444" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<text x="13" y="22" text-anchor="middle" fill="#EF4444" font-size="3.5" font-weight="600" opacity="0.7">5PM</text>
|
|
</svg>
|
|
<div style="flex: 1; background: rgba(239,68,68,0.04); border: 1pt solid rgba(239,68,68,0.1); border-radius: 6pt; padding: 6pt 8pt;">
|
|
<p style="font-size: 7.5pt; color: #57534E; white-space: nowrap;">"결재할 것 정리해줘" <span style="color: #EF4444; font-weight: 600;">서류 찾는중...</span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 전환 화살표 -->
|
|
<div style="text-align: center; margin-bottom: 12pt;">
|
|
<svg viewBox="0 0 40 24" width="40pt" height="16pt" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M10 6 L20 18 L30 6" fill="none" stroke="#0D9488" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" opacity="0.6"/>
|
|
</svg>
|
|
<p style="white-space: nowrap; font-size: 7.5pt; font-weight: 700; color: #0D9488;">SAM 도입 후</p>
|
|
</div>
|
|
|
|
<!-- 대시보드 Mock UI -->
|
|
<div style="background: #FFFFFF; border: 1pt solid #E7E5E4; border-radius: 7pt; padding: 9pt; margin-bottom: 16pt; box-shadow: 0 1pt 4pt rgba(0,0,0,0.05);">
|
|
<!-- 타이틀바 -->
|
|
<div style="display: flex; align-items: center; gap: 3pt; margin-bottom: 6pt;">
|
|
<div style="width: 4pt; height: 4pt; border-radius: 50%; background: #EF4444;"></div>
|
|
<div style="width: 4pt; height: 4pt; border-radius: 50%; background: #F59E0B;"></div>
|
|
<div style="width: 4pt; height: 4pt; border-radius: 50%; background: #10B981;"></div>
|
|
<p style="white-space: nowrap; font-size: 5.5pt; color: #A8A29E; margin-left: 5pt;">SAM CEO Dashboard --- 로그인 후 3초</p>
|
|
</div>
|
|
<!-- KPI 카드 (SVG 아이콘 포함) -->
|
|
<div style="display: flex; gap: 3pt; margin-bottom: 5pt;">
|
|
<div style="flex: 1; background: rgba(13,148,136,0.06); border: 1pt solid rgba(13,148,136,0.15); border-radius: 6pt; padding: 4pt 3pt; text-align: center;">
|
|
<svg viewBox="0 0 16 16" width="9pt" height="9pt" xmlns="http://www.w3.org/2000/svg" style="margin-bottom: 1pt;">
|
|
<rect x="2" y="9" width="3" height="5" rx="0.5" fill="#0D9488" opacity="0.4"/>
|
|
<rect x="6" y="5" width="3" height="9" rx="0.5" fill="#0D9488" opacity="0.7"/>
|
|
<rect x="10" y="2" width="3" height="12" rx="0.5" fill="#0D9488"/>
|
|
</svg>
|
|
<p style="white-space: nowrap; font-size: 11pt; font-weight: 800; color: #292524;">5.2억</p>
|
|
<p style="white-space: nowrap; font-size: 5pt; color: #10B981; font-weight: 700;">▲ 15.3%</p>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #0D9488; font-weight: 600; margin-top: 1pt;">월 매출</p>
|
|
</div>
|
|
<div style="flex: 1; background: rgba(16,185,129,0.06); border: 1pt solid rgba(16,185,129,0.15); border-radius: 6pt; padding: 4pt 3pt; text-align: center;">
|
|
<svg viewBox="0 0 16 16" width="9pt" height="9pt" xmlns="http://www.w3.org/2000/svg" style="margin-bottom: 1pt;">
|
|
<rect x="2" y="2" width="12" height="12" rx="2" fill="none" stroke="#10B981" stroke-width="1" opacity="0.5"/>
|
|
<path d="M5 8 L7 10 L11 6" fill="none" stroke="#10B981" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
<p style="white-space: nowrap; font-size: 11pt; font-weight: 800; color: #292524;">127건</p>
|
|
<p style="white-space: nowrap; font-size: 5pt; color: #10B981; font-weight: 700;">▲ 8건</p>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #10B981; font-weight: 600; margin-top: 1pt;">누적 수주</p>
|
|
</div>
|
|
<div style="flex: 1; background: rgba(139,92,246,0.06); border: 1pt solid rgba(139,92,246,0.15); border-radius: 6pt; padding: 4pt 3pt; text-align: center;">
|
|
<svg viewBox="0 0 16 16" width="9pt" height="9pt" xmlns="http://www.w3.org/2000/svg" style="margin-bottom: 1pt;">
|
|
<circle cx="8" cy="8" r="5.5" fill="none" stroke="#8B5CF6" stroke-width="1" opacity="0.3"/>
|
|
<circle cx="8" cy="8" r="5.5" fill="none" stroke="#8B5CF6" stroke-width="1.5" stroke-dasharray="32 35" stroke-dashoffset="-9" stroke-linecap="round"/>
|
|
</svg>
|
|
<p style="white-space: nowrap; font-size: 11pt; font-weight: 800; color: #292524;">96%</p>
|
|
<p style="white-space: nowrap; font-size: 5pt; color: #10B981; font-weight: 700;">목표 달성</p>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #8B5CF6; font-weight: 600; margin-top: 1pt;">납기 준수율</p>
|
|
</div>
|
|
<div style="flex: 1; background: rgba(239,68,68,0.06); border: 1pt solid rgba(239,68,68,0.15); border-radius: 6pt; padding: 4pt 3pt; text-align: center;">
|
|
<svg viewBox="0 0 16 16" width="9pt" height="9pt" xmlns="http://www.w3.org/2000/svg" style="margin-bottom: 1pt;">
|
|
<path d="M8 2 L14 12 L2 12 Z" fill="none" stroke="#EF4444" stroke-width="1" stroke-linejoin="round"/>
|
|
<line x1="8" y1="6" x2="8" y2="9" stroke="#EF4444" stroke-width="1.2" stroke-linecap="round"/>
|
|
<circle cx="8" cy="10.5" r="0.6" fill="#EF4444"/>
|
|
</svg>
|
|
<p style="white-space: nowrap; font-size: 11pt; font-weight: 800; color: #EF4444;">5건</p>
|
|
<p style="white-space: nowrap; font-size: 5pt; color: #EF4444; font-weight: 700;">즉시 처리</p>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #EF4444; font-weight: 600; margin-top: 1pt;">승인 대기</p>
|
|
</div>
|
|
</div>
|
|
<!-- 라인 차트 + 도넛 -->
|
|
<div style="display: flex; gap: 4pt;">
|
|
<div style="flex: 3; background: #F5F5F4; border-radius: 5pt; padding: 4pt 5pt;">
|
|
<p style="white-space: nowrap; font-size: 5pt; color: #A8A29E; margin-bottom: 2pt;">월별 매출 추이</p>
|
|
<svg viewBox="0 0 150 35" width="100%" height="26pt" xmlns="http://www.w3.org/2000/svg">
|
|
<line x1="0" y1="10" x2="150" y2="10" stroke="rgba(41,37,36,0.05)" stroke-width="0.5"/>
|
|
<line x1="0" y1="20" x2="150" y2="20" stroke="rgba(41,37,36,0.05)" stroke-width="0.5"/>
|
|
<path d="M5 30 L18 24 L31 26 L44 20 L57 16 L70 12 L83 14 L96 8 L109 10 L122 4 L135 7 L135 33 L5 33 Z" fill="#0D9488" opacity="0.08"/>
|
|
<path d="M5 30 L18 24 L31 26 L44 20 L57 16 L70 12 L83 14 L96 8 L109 10 L122 4 L135 7" fill="none" stroke="#0D9488" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<circle cx="122" cy="4" r="2" fill="#0D9488"/>
|
|
</svg>
|
|
</div>
|
|
<div style="flex: 2; background: #F5F5F4; border-radius: 5pt; padding: 4pt 5pt; display: flex; align-items: center; gap: 4pt;">
|
|
<svg viewBox="0 0 40 40" width="30pt" height="30pt" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="20" cy="20" r="14" fill="none" stroke="rgba(41,37,36,0.06)" stroke-width="4.5"/>
|
|
<circle cx="20" cy="20" r="14" fill="none" stroke="#0D9488" stroke-width="4.5" stroke-dasharray="33 55" stroke-dashoffset="22" stroke-linecap="round"/>
|
|
<circle cx="20" cy="20" r="14" fill="none" stroke="#10B981" stroke-width="4.5" stroke-dasharray="22 66" stroke-dashoffset="-11" stroke-linecap="round"/>
|
|
<circle cx="20" cy="20" r="14" fill="none" stroke="#8B5CF6" stroke-width="4.5" stroke-dasharray="19 69" stroke-dashoffset="-33" stroke-linecap="round"/>
|
|
<circle cx="20" cy="20" r="14" fill="none" stroke="#F59E0B" stroke-width="4.5" stroke-dasharray="12 76" stroke-dashoffset="-52" stroke-linecap="round"/>
|
|
</svg>
|
|
<div style="display: flex; flex-direction: column; gap: 2pt;">
|
|
<div style="display: flex; align-items: center; gap: 2pt;">
|
|
<div style="width: 3pt; height: 3pt; background: #0D9488; border-radius: 1pt;"></div>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #57534E;">영업1팀</p>
|
|
</div>
|
|
<div style="display: flex; align-items: center; gap: 2pt;">
|
|
<div style="width: 3pt; height: 3pt; background: #10B981; border-radius: 1pt;"></div>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #57534E;">영업2팀</p>
|
|
</div>
|
|
<div style="display: flex; align-items: center; gap: 2pt;">
|
|
<div style="width: 3pt; height: 3pt; background: #8B5CF6; border-radius: 1pt;"></div>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #57534E;">생산팀</p>
|
|
</div>
|
|
<div style="display: flex; align-items: center; gap: 2pt;">
|
|
<div style="width: 3pt; height: 3pt; background: #F59E0B; border-radius: 1pt;"></div>
|
|
<p style="white-space: nowrap; font-size: 4.5pt; color: #57534E;">품질팀</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 대표님이 얻는 것 -->
|
|
<div style="margin-bottom: 12pt;">
|
|
<p style="white-space: nowrap; font-size: 7.5pt; font-weight: 700; color: #0D9488; margin-bottom: 6pt;">대표님이 얻는 것</p>
|
|
<div style="display: flex; gap: 4pt;">
|
|
<!-- 즉시 현황 파악 -->
|
|
<div style="flex: 1; background: rgba(13,148,136,0.04); border: 1pt solid rgba(13,148,136,0.12); border-radius: 7pt; padding: 8pt 5pt; text-align: center;">
|
|
<svg viewBox="0 0 28 28" width="18pt" height="18pt" xmlns="http://www.w3.org/2000/svg" style="margin-bottom: 3pt;">
|
|
<circle cx="14" cy="14" r="10" fill="none" stroke="#0D9488" stroke-width="1.2" opacity="0.4"/>
|
|
<path d="M14 8 L14 14 L18 17" fill="none" stroke="#0D9488" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<circle cx="14" cy="14" r="1.5" fill="#0D9488"/>
|
|
<path d="M22 5 L20 10 L23 10 L21 15" fill="none" stroke="#F59E0B" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
<p style="font-size: 7pt; font-weight: 700; color: #292524; white-space: nowrap;">즉시 현황 파악</p>
|
|
<p style="font-size: 5.5pt; color: #A8A29E; margin-top: 2pt; line-height: 1.4;">로그인 3초면<br>전사 현황 확인</p>
|
|
</div>
|
|
<!-- 데이터로 판단 -->
|
|
<div style="flex: 1; background: rgba(16,185,129,0.04); border: 1pt solid rgba(16,185,129,0.12); border-radius: 7pt; padding: 8pt 5pt; text-align: center;">
|
|
<svg viewBox="0 0 28 28" width="18pt" height="18pt" xmlns="http://www.w3.org/2000/svg" style="margin-bottom: 3pt;">
|
|
<circle cx="14" cy="12" r="8" fill="none" stroke="#10B981" stroke-width="1.2" opacity="0.4"/>
|
|
<path d="M11 8 Q14 6 17 8" fill="none" stroke="#10B981" stroke-width="1" stroke-linecap="round"/>
|
|
<path d="M10 12 Q14 10 18 12" fill="none" stroke="#10B981" stroke-width="1" stroke-linecap="round"/>
|
|
<path d="M11 16 Q14 14 17 16" fill="none" stroke="#10B981" stroke-width="1" stroke-linecap="round"/>
|
|
<circle cx="8" cy="22" r="1.2" fill="#10B981" opacity="0.6"/>
|
|
<circle cx="14" cy="22" r="1.2" fill="#10B981" opacity="0.8"/>
|
|
<circle cx="20" cy="22" r="1.2" fill="#10B981"/>
|
|
<line x1="8" y1="22" x2="20" y2="22" stroke="#10B981" stroke-width="0.5" opacity="0.3"/>
|
|
</svg>
|
|
<p style="font-size: 7pt; font-weight: 700; color: #292524; white-space: nowrap;">데이터로 판단</p>
|
|
<p style="font-size: 5.5pt; color: #A8A29E; margin-top: 2pt; line-height: 1.4;">감이 아닌 숫자로<br>KPI/팀 성과 비교</p>
|
|
</div>
|
|
<!-- 모바일 승인 -->
|
|
<div style="flex: 1; background: rgba(139,92,246,0.04); border: 1pt solid rgba(139,92,246,0.12); border-radius: 7pt; padding: 8pt 5pt; text-align: center;">
|
|
<svg viewBox="0 0 28 28" width="18pt" height="18pt" xmlns="http://www.w3.org/2000/svg" style="margin-bottom: 3pt;">
|
|
<circle cx="14" cy="14" r="9" fill="none" stroke="#8B5CF6" stroke-width="1.2" opacity="0.4"/>
|
|
<path d="M9 14 L12.5 17.5 L19 10.5" fill="none" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<rect x="20" y="19" width="5" height="8" rx="1" fill="none" stroke="#8B5CF6" stroke-width="0.8" opacity="0.5"/>
|
|
<circle cx="22.5" cy="25.5" r="0.5" fill="#8B5CF6" opacity="0.5"/>
|
|
</svg>
|
|
<p style="font-size: 7pt; font-weight: 700; color: #292524; white-space: nowrap;">모바일 승인</p>
|
|
<p style="font-size: 5.5pt; color: #A8A29E; margin-top: 2pt; line-height: 1.4;">이동중에도 즉시<br>결재/승인 처리</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 기술 태그 -->
|
|
<div style="display: flex; gap: 4pt; margin-bottom: 8pt;">
|
|
<div style="display: flex; align-items: center; gap: 2pt; background: #F5F5F4; border-radius: 4pt; padding: 3pt 6pt;">
|
|
<svg viewBox="0 0 8 8" width="5pt" height="5pt" xmlns="http://www.w3.org/2000/svg"><path d="M2 6 Q4 2 6 6" fill="none" stroke="#A8A29E" stroke-width="0.7"/><path d="M3 6 Q4 4 5 6" fill="none" stroke="#A8A29E" stroke-width="0.7"/><circle cx="4" cy="6.5" r="0.6" fill="#A8A29E"/></svg>
|
|
<p style="white-space: nowrap; font-size: 6pt; color: #A8A29E;">클라우드 기반</p>
|
|
</div>
|
|
<div style="display: flex; align-items: center; gap: 2pt; background: #F5F5F4; border-radius: 4pt; padding: 3pt 6pt;">
|
|
<svg viewBox="0 0 8 8" width="5pt" height="5pt" xmlns="http://www.w3.org/2000/svg"><rect x="2" y="0.5" width="4" height="7" rx="0.8" fill="none" stroke="#A8A29E" stroke-width="0.7"/><circle cx="4" cy="6.5" r="0.4" fill="#A8A29E"/></svg>
|
|
<p style="white-space: nowrap; font-size: 6pt; color: #A8A29E;">PC + 모바일</p>
|
|
</div>
|
|
<div style="display: flex; align-items: center; gap: 2pt; background: #F5F5F4; border-radius: 4pt; padding: 3pt 6pt;">
|
|
<svg viewBox="0 0 8 8" width="5pt" height="5pt" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1.5" width="6" height="5" rx="0.8" fill="none" stroke="#A8A29E" stroke-width="0.7"/><circle cx="4" cy="4" r="1.2" fill="none" stroke="#A8A29E" stroke-width="0.5"/></svg>
|
|
<p style="white-space: nowrap; font-size: 6pt; color: #A8A29E;">역할별 권한</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 푸터 -->
|
|
<div style="margin-top: auto; border-top: 1pt solid #D6D3D1; padding-top: 8pt;">
|
|
<div style="display: flex; justify-content: space-between; align-items: flex-end;">
|
|
<div>
|
|
<p style="white-space: nowrap; font-size: 7.5pt; font-weight: 700; color: #57534E;">SAM</p>
|
|
<p style="white-space: nowrap; font-size: 6.5pt; color: #A8A29E; margin-top: 2pt;">www.sam.it.kr</p>
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<p style="white-space: nowrap; font-size: 6.5pt; color: #A8A29E;">뒷면에서 상세 기능을 확인하세요 ▶</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |