gahusb
a7d9af0d35
- 어드민 마케팅 페이지: 4대 전문가 체크리스트(디자인/PM/품질/마케팅) 추가, localStorage 저장, 크몽 등록 가이드 패널, 품질 점수 바 - SVG 썸네일 6개 전면 재설계: 헤드라인 강화, 목업 세밀화, 실제 제품가 반영 - 신규 썸네일 2개 제작: thumb-lotto.svg (로또 번호 추천), thumb-saju.svg (AI 사주 분석) - 사이드바 상호명 추가 (토스페이먼츠 심사 준비) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
228 lines
15 KiB
XML
228 lines
15 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="675" viewBox="0 0 1200 675">
|
||
<defs>
|
||
<linearGradient id="bgSj" x1="0%" y1="0%" x2="100%" y2="100%">
|
||
<stop offset="0%" style="stop-color:#0e0720"/>
|
||
<stop offset="50%" style="stop-color:#1a0a3a"/>
|
||
<stop offset="100%" style="stop-color:#04102b"/>
|
||
</linearGradient>
|
||
<linearGradient id="headSj" x1="0%" y1="0%" x2="100%" y2="0%">
|
||
<stop offset="0%" style="stop-color:#c4b5fd"/>
|
||
<stop offset="100%" style="stop-color:#a78bfa"/>
|
||
</linearGradient>
|
||
<linearGradient id="goldSj" x1="0%" y1="0%" x2="100%" y2="0%">
|
||
<stop offset="0%" style="stop-color:#fde68a"/>
|
||
<stop offset="100%" style="stop-color:#f59e0b"/>
|
||
</linearGradient>
|
||
<linearGradient id="priceSj" x1="0%" y1="0%" x2="100%" y2="100%">
|
||
<stop offset="0%" style="stop-color:#4c1d95"/>
|
||
<stop offset="100%" style="stop-color:#7c3aed"/>
|
||
</linearGradient>
|
||
<linearGradient id="pillarGrad" x1="0%" y1="0%" x2="0%" y2="100%">
|
||
<stop offset="0%" style="stop-color:#1e1b4b"/>
|
||
<stop offset="100%" style="stop-color:#0e0720"/>
|
||
</linearGradient>
|
||
<radialGradient id="glowSj" cx="70%" cy="50%" r="55%">
|
||
<stop offset="0%" style="stop-color:#7c3aed;stop-opacity:0.2"/>
|
||
<stop offset="100%" style="stop-color:#7c3aed;stop-opacity:0"/>
|
||
</radialGradient>
|
||
<radialGradient id="orb" cx="40%" cy="35%" r="60%">
|
||
<stop offset="0%" style="stop-color:#312e81"/>
|
||
<stop offset="100%" style="stop-color:#0e0720"/>
|
||
</radialGradient>
|
||
<filter id="glowSjF">
|
||
<feGaussianBlur stdDeviation="6" result="blur"/>
|
||
<feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
|
||
</filter>
|
||
<filter id="panelShadSj">
|
||
<feDropShadow dx="0" dy="12" stdDeviation="22" flood-color="#000" flood-opacity="0.55"/>
|
||
</filter>
|
||
</defs>
|
||
|
||
<!-- 배경 -->
|
||
<rect width="1200" height="675" fill="url(#bgSj)"/>
|
||
<rect width="1200" height="675" fill="url(#glowSj)"/>
|
||
|
||
<!-- 별 배경 효과 -->
|
||
<circle cx="680" cy="120" r="1.5" fill="#c4b5fd" opacity="0.6"/>
|
||
<circle cx="720" cy="80" r="1" fill="#a78bfa" opacity="0.5"/>
|
||
<circle cx="760" cy="140" r="1.5" fill="#c4b5fd" opacity="0.4"/>
|
||
<circle cx="800" cy="100" r="1" fill="#ddd6fe" opacity="0.6"/>
|
||
<circle cx="840" cy="60" r="2" fill="#a78bfa" opacity="0.3"/>
|
||
<circle cx="900" cy="120" r="1.5" fill="#c4b5fd" opacity="0.5"/>
|
||
<circle cx="950" cy="70" r="1" fill="#ddd6fe" opacity="0.4"/>
|
||
<circle cx="1000" cy="100" r="1.5" fill="#a78bfa" opacity="0.6"/>
|
||
<circle cx="1050" cy="50" r="1" fill="#c4b5fd" opacity="0.5"/>
|
||
<circle cx="1100" cy="90" r="2" fill="#ddd6fe" opacity="0.3"/>
|
||
<circle cx="650" cy="200" r="1" fill="#a78bfa" opacity="0.5"/>
|
||
<circle cx="700" cy="240" r="1.5" fill="#c4b5fd" opacity="0.4"/>
|
||
<circle cx="730" cy="580" r="1" fill="#a78bfa" opacity="0.5"/>
|
||
<circle cx="780" cy="560" r="1.5" fill="#c4b5fd" opacity="0.4"/>
|
||
<circle cx="820" cy="600" r="1" fill="#ddd6fe" opacity="0.5"/>
|
||
|
||
<!-- 배경 한자 장식 (은은하게) -->
|
||
<text x="80" y="580" font-family="'Malgun Gothic',sans-serif" font-size="80" fill="#1a0a3a" opacity="0.6">天</text>
|
||
<text x="400" y="620" font-family="'Malgun Gothic',sans-serif" font-size="60" fill="#1a0a3a" opacity="0.4">命</text>
|
||
|
||
<!-- 왼쪽 콘텐츠 -->
|
||
<!-- 뱃지 -->
|
||
<rect x="60" y="62" width="290" height="40" rx="20" fill="#1e1b4b" stroke="#7c3aed" stroke-width="1.5"/>
|
||
<text x="82" y="87" font-family="'Malgun Gothic',sans-serif" font-size="14" font-weight="700" fill="#c4b5fd">✨ 전통 사주 × AI 딥러닝 분석</text>
|
||
|
||
<!-- 헤드라인 -->
|
||
<text x="60" y="164" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="52" font-weight="900" fill="#ffffff">타고난 운명을</text>
|
||
<text x="60" y="228" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="52" font-weight="900" fill="url(#headSj)">AI가 읽어드립니다</text>
|
||
<text x="60" y="274" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="19" fill="#94a3b8">사주팔자 완전 해석 · 12가지 인생 항목 분석</text>
|
||
|
||
<!-- 12항목 분석 목록 -->
|
||
<g font-family="'Malgun Gothic',sans-serif" font-size="14" fill="#94a3b8">
|
||
<text x="60" y="310">🔮 성격·적성 · 💼 직업운 · 💰 재물운 · ❤️ 애정운</text>
|
||
<text x="60" y="340">🏠 가정운 · ⚕️ 건강운 · 📅 연간운 · ✨ 용신·기신</text>
|
||
<text x="60" y="370">🌟 대운 흐름 · 🤝 인연 분석 · ⚠️ 주의 시기 · 💡 조언</text>
|
||
</g>
|
||
|
||
<!-- 차별화 포인트 -->
|
||
<rect x="60" y="392" width="520" height="80" rx="14" fill="#0e0720" stroke="#1e1b4b" stroke-width="1"/>
|
||
<g font-family="'Malgun Gothic',sans-serif">
|
||
<circle cx="88" cy="420" r="16" fill="#1e1b4b" stroke="#7c3aed" stroke-width="1"/>
|
||
<text x="88" y="426" text-anchor="middle" font-size="14">🤖</text>
|
||
<text x="114" y="416" font-size="14" font-weight="700" fill="#e2e8f0">Gemini AI 해석 엔진</text>
|
||
<text x="114" y="434" font-size="12" fill="#64748b">단순 운세가 아닌 근거 있는 해석</text>
|
||
|
||
<circle cx="88" cy="460" r="16" fill="#1e1b4b" stroke="#7c3aed" stroke-width="1"/>
|
||
<text x="88" y="466" text-anchor="middle" font-size="14">📜</text>
|
||
<text x="114" y="456" font-size="14" font-weight="700" fill="#e2e8f0">전통 사주 학문 기반</text>
|
||
<text x="114" y="474" font-size="12" fill="#64748b">오행·천간지지·신살 완전 적용</text>
|
||
</g>
|
||
|
||
<!-- 가격 뱃지 -->
|
||
<rect x="60" y="488" width="256" height="72" rx="16" fill="url(#priceSj)"/>
|
||
<text x="188" y="515" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="13" fill="#ddd6fe">AI 상세 리포트</text>
|
||
<text x="188" y="545" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="900" fill="#ffffff">4,900원</text>
|
||
|
||
<!-- 무료 기본 분석 안내 -->
|
||
<rect x="60" y="574" width="520" height="36" rx="10" fill="#1e1b4b" opacity="0.85"/>
|
||
<text x="80" y="597" font-family="'Malgun Gothic',sans-serif" font-size="13" fill="#a78bfa">🎁 기본 사주팔자 계산·오행 분석은 무료 제공</text>
|
||
|
||
<!-- URL -->
|
||
<text x="60" y="632" font-family="sans-serif" font-size="14" fill="#3b5998">jaengseung-made.com</text>
|
||
|
||
<!-- 오른쪽 사주팔자 패널 -->
|
||
<rect x="614" y="52" width="558" height="558" rx="22" fill="#0a0618" stroke="#1e1b4b" stroke-width="1.5" filter="url(#panelShadSj)"/>
|
||
<!-- 상단 장식선 -->
|
||
<line x1="634" y1="104" x2="1152" y2="104" stroke="#1e1b4b" stroke-width="1"/>
|
||
|
||
<!-- 패널 타이틀 -->
|
||
<text x="893" y="84" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="15" font-weight="700" fill="url(#goldSj)">✦ 사주 분석 결과 ✦</text>
|
||
|
||
<!-- 사주 팔자 표 (4기둥) -->
|
||
<!-- 헤더 -->
|
||
<text x="680" y="132" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#64748b">시주(時柱)</text>
|
||
<text x="790" y="132" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#64748b">일주(日柱)</text>
|
||
<text x="900" y="132" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#64748b">월주(月柱)</text>
|
||
<text x="1010" y="132" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#64748b">년주(年柱)</text>
|
||
|
||
<!-- 기둥 1: 시주 -->
|
||
<rect x="642" y="144" width="76" height="90" rx="12" fill="url(#pillarGrad)" stroke="#1e1b4b" stroke-width="1.5"/>
|
||
<text x="680" y="186" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#60a5fa">庚</text>
|
||
<text x="680" y="210" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#475569">경(庚)</text>
|
||
<rect x="642" y="248" width="76" height="90" rx="12" fill="url(#pillarGrad)" stroke="#1e1b4b" stroke-width="1.5"/>
|
||
<text x="680" y="290" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#60a5fa">申</text>
|
||
<text x="680" y="314" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#475569">신(申) · 금(金)</text>
|
||
|
||
<!-- 기둥 2: 일주 (하이라이트) -->
|
||
<rect x="752" y="144" width="76" height="90" rx="12" fill="#1e1b4b" stroke="#7c3aed" stroke-width="2"/>
|
||
<text x="790" y="186" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#c4b5fd">癸</text>
|
||
<text x="790" y="210" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#a78bfa">계(癸)</text>
|
||
<rect x="752" y="248" width="76" height="90" rx="12" fill="#1e1b4b" stroke="#7c3aed" stroke-width="2"/>
|
||
<text x="790" y="290" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#c4b5fd">酉</text>
|
||
<text x="790" y="314" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#a78bfa">유(酉) · 금(金)</text>
|
||
<!-- 일주 뱃지 -->
|
||
<rect x="740" y="130" width="100" height="20" rx="10" fill="#7c3aed"/>
|
||
<text x="790" y="144" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="10" font-weight="700" fill="#fff">나의 일주</text>
|
||
|
||
<!-- 기둥 3: 월주 -->
|
||
<rect x="862" y="144" width="76" height="90" rx="12" fill="url(#pillarGrad)" stroke="#1e1b4b" stroke-width="1.5"/>
|
||
<text x="900" y="186" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#34d399">壬</text>
|
||
<text x="900" y="210" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#475569">임(壬)</text>
|
||
<rect x="862" y="248" width="76" height="90" rx="12" fill="url(#pillarGrad)" stroke="#1e1b4b" stroke-width="1.5"/>
|
||
<text x="900" y="290" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#34d399">子</text>
|
||
<text x="900" y="314" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#475569">자(子) · 수(水)</text>
|
||
|
||
<!-- 기둥 4: 년주 -->
|
||
<rect x="972" y="144" width="76" height="90" rx="12" fill="url(#pillarGrad)" stroke="#1e1b4b" stroke-width="1.5"/>
|
||
<text x="1010" y="186" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#fbbf24">壬</text>
|
||
<text x="1010" y="210" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#475569">임(壬)</text>
|
||
<rect x="972" y="248" width="76" height="90" rx="12" fill="url(#pillarGrad)" stroke="#1e1b4b" stroke-width="1.5"/>
|
||
<text x="1010" y="290" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="32" font-weight="700" fill="#fbbf24">申</text>
|
||
<text x="1010" y="314" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="12" fill="#475569">신(申) · 금(金)</text>
|
||
|
||
<!-- 오행 그래프 -->
|
||
<line x1="634" y1="356" x2="1152" y2="356" stroke="#1e1b4b" stroke-width="1"/>
|
||
<text x="893" y="380" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="13" font-weight="700" fill="#64748b">오행(五行) 분포</text>
|
||
|
||
<g font-family="'Malgun Gothic',sans-serif" font-size="11">
|
||
<!-- 목(木) -->
|
||
<text x="654" y="406" fill="#64748b">목(木)</text>
|
||
<rect x="654" y="412" width="80" height="14" rx="4" fill="#0a2010"/>
|
||
<rect x="654" y="412" width="8" height="14" rx="4" fill="#22c55e"/>
|
||
<text x="666" y="424" fill="#22c55e">▪</text>
|
||
|
||
<!-- 화(火) -->
|
||
<text x="754" y="406" fill="#64748b">화(火)</text>
|
||
<rect x="754" y="412" width="80" height="14" rx="4" fill="#2a0a00"/>
|
||
<rect x="754" y="412" width="6" height="14" rx="4" fill="#ef4444"/>
|
||
|
||
<!-- 토(土) -->
|
||
<text x="854" y="406" fill="#64748b">토(土)</text>
|
||
<rect x="854" y="412" width="80" height="14" rx="4" fill="#1c1200"/>
|
||
<rect x="854" y="412" width="10" height="14" rx="4" fill="#f59e0b"/>
|
||
|
||
<!-- 금(金) -->
|
||
<text x="954" y="406" fill="#64748b">금(金)</text>
|
||
<rect x="954" y="412" width="80" height="14" rx="4" fill="#1a1800"/>
|
||
<rect x="954" y="412" width="72" height="14" rx="4" fill="#e2e8f0"/>
|
||
<text x="1022" y="424" text-anchor="end" fill="#0f172a" font-weight="700">强</text>
|
||
|
||
<!-- 수(水) -->
|
||
<text x="1054" y="406" fill="#64748b">수(水)</text>
|
||
<rect x="1054" y="412" width="80" height="14" rx="4" fill="#061428"/>
|
||
<rect x="1054" y="412" width="56" height="14" rx="4" fill="#3b82f6"/>
|
||
</g>
|
||
|
||
<!-- AI 분석 항목 그리드 -->
|
||
<line x1="634" y1="444" x2="1152" y2="444" stroke="#1e1b4b" stroke-width="1"/>
|
||
<text x="893" y="466" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="13" font-weight="700" fill="#64748b">AI 해석 12항목</text>
|
||
|
||
<g font-family="'Malgun Gothic',sans-serif" font-size="12">
|
||
<rect x="640" y="476" width="108" height="30" rx="8" fill="#1e1b4b" stroke="#7c3aed" stroke-width="1"/>
|
||
<text x="694" y="496" text-anchor="middle" fill="#c4b5fd">🎭 성격·적성</text>
|
||
<rect x="756" y="476" width="108" height="30" rx="8" fill="#1e1b4b" stroke="#7c3aed" stroke-width="1"/>
|
||
<text x="810" y="496" text-anchor="middle" fill="#c4b5fd">💼 직업운</text>
|
||
<rect x="872" y="476" width="108" height="30" rx="8" fill="#1e1b4b" stroke="#7c3aed" stroke-width="1"/>
|
||
<text x="926" y="496" text-anchor="middle" fill="#c4b5fd">💰 재물운</text>
|
||
<rect x="988" y="476" width="108" height="30" rx="8" fill="#1e1b4b" stroke="#7c3aed" stroke-width="1"/>
|
||
<text x="1042" y="496" text-anchor="middle" fill="#c4b5fd">❤️ 애정운</text>
|
||
<rect x="1104" y="476" width="40" height="30" rx="8" fill="#1e1b4b"/>
|
||
<text x="1124" y="496" text-anchor="middle" fill="#475569">+8</text>
|
||
|
||
<rect x="640" y="514" width="108" height="30" rx="8" fill="#0e0720" stroke="#1e1b4b" stroke-width="1"/>
|
||
<text x="694" y="534" text-anchor="middle" fill="#64748b">📅 연간운</text>
|
||
<rect x="756" y="514" width="108" height="30" rx="8" fill="#0e0720" stroke="#1e1b4b" stroke-width="1"/>
|
||
<text x="810" y="534" text-anchor="middle" fill="#64748b">⚕️ 건강운</text>
|
||
<rect x="872" y="514" width="108" height="30" rx="8" fill="#0e0720" stroke="#1e1b4b" stroke-width="1"/>
|
||
<text x="926" y="534" text-anchor="middle" fill="#64748b">✨ 용신</text>
|
||
<rect x="988" y="514" width="108" height="30" rx="8" fill="#0e0720" stroke="#1e1b4b" stroke-width="1"/>
|
||
<text x="1042" y="534" text-anchor="middle" fill="#64748b">🌟 대운</text>
|
||
<rect x="1104" y="514" width="40" height="30" rx="8" fill="#0e0720"/>
|
||
<text x="1124" y="534" text-anchor="middle" fill="#1e1b4b">...</text>
|
||
</g>
|
||
|
||
<!-- 결제 후 잠금 해제 표시 -->
|
||
<rect x="634" y="552" width="518" height="44" rx="12" fill="url(#priceSj)" opacity="0.9"/>
|
||
<text x="893" y="579" text-anchor="middle" font-family="'Malgun Gothic',sans-serif" font-size="14" font-weight="700" fill="#fff">🔓 4,900원으로 12항목 전체 리포트 잠금 해제</text>
|
||
|
||
<!-- 하단 바 -->
|
||
<rect x="0" y="638" width="1200" height="37" fill="#4c1d95"/>
|
||
<text x="600" y="662" text-anchor="middle" font-family="'Malgun Gothic','Apple SD Gothic Neo',sans-serif" font-size="14" font-weight="600" fill="#ddd6fe">전통 사주팔자 + AI 딥러닝 해석 · 12항목 상세 분석 · jaengseung-made.com</text>
|
||
</svg>
|