first commit 2
This commit is contained in:
@@ -0,0 +1,194 @@
|
||||
<?php
|
||||
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
|
||||
?>
|
||||
|
||||
<div class="usage-guide-container">
|
||||
<h1 class="guide-title">창호 견적 시스템 사용법</h1>
|
||||
|
||||
<div class="guide-section">
|
||||
<h2>1. 시스템 개요</h2>
|
||||
<p>본 시스템은 창호 교체 및 설치를 위한 견적을 온라인으로 요청할 수 있는 서비스입니다. 사용자가 직접 창호의 종류, 규격, 옵션 등을 선택하여 견적을 요청하면 전문가가 검토 후 정확한 견적을 제공해 드립니다.</p>
|
||||
</div>
|
||||
|
||||
<div class="guide-section">
|
||||
<h2>2. 견적 요청 절차</h2>
|
||||
<ol class="guide-steps">
|
||||
<li>
|
||||
<h3>기본 정보 입력</h3>
|
||||
<p>주소, 주택 유형, 평수, 자재 등 기본 정보를 입력합니다.</p>
|
||||
<ul>
|
||||
<li><strong>주소:</strong> '우편번호 찾기' 버튼을 클릭하여 정확한 주소를 입력하세요.</li>
|
||||
<li><strong>주택 유형:</strong> 아파트, 빌라, 단독주택 등 해당하는 주택 유형을 선택하세요.</li>
|
||||
<li><strong>평수:</strong> 실제 평수를 숫자로만 입력하세요.</li>
|
||||
<li><strong>자재:</strong> PVC, 알루미늄, 시스템창호 중 원하는 자재를 선택하세요.</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<h3>공통 옵션 설정</h3>
|
||||
<p>모든 창호에 공통으로 적용될 옵션을 선택합니다.</p>
|
||||
<ul>
|
||||
<li><strong>색상:</strong> 창호의 색상을 선택하세요. 특정 색상이 필요한 경우 '색지정'을 선택하고 원하는 색상을 입력하세요.</li>
|
||||
<li><strong>핸들:</strong> 창호 핸들 종류를 선택하세요.</li>
|
||||
<li><strong>유리 색상:</strong> 유리의 색상을 선택하세요.</li>
|
||||
<li><strong>유리 두께:</strong> 유리의 두께를 선택하세요.</li>
|
||||
<li><strong>시공 여부:</strong> 자재만 구매할지, 시공까지 포함할지 선택하세요.</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<h3>창호 추가하기</h3>
|
||||
<p>'창 추가하기' 버튼을 클릭하여 견적에 포함할 창호를 추가합니다.</p>
|
||||
<ul>
|
||||
<li><strong>창 종류:</strong> 거실창, 안방창, 작은방창, 주방창, 발코니창 등 해당하는 창 종류를 선택하세요.</li>
|
||||
<li><strong>규격:</strong> 가로(mm) x 세로(mm) 형식으로 창호의 규격을 입력하세요. 정확한 측정이 필요합니다.</li>
|
||||
<li><strong>창호 형태:</strong> 미서기창, 여닫이창, 고정창 등 원하는 창호 형태를 선택하세요.</li>
|
||||
<li><strong>창 비율:</strong> 이미지를 참고하여 원하는 창 비율을 선택하세요.</li>
|
||||
<li><strong>교체 위치:</strong> 외부접한창 또는 내창 중 교체할 위치를 선택하세요.</li>
|
||||
<li><strong>비고:</strong> 추가 요청사항이 있으면 입력하세요.</li>
|
||||
</ul>
|
||||
<p>여러 개의 창호가 필요한 경우 '창 추가하기' 버튼을 다시 클릭하여 추가 창호를 입력할 수 있습니다.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h3>견적 요청 완료</h3>
|
||||
<p>모든 정보 입력이 완료되면 하단의 '작성완료' 버튼을 클릭하여 견적을 요청합니다.</p>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div class="guide-section">
|
||||
<h2>3. 도움말 기능 활용하기</h2>
|
||||
<p>견적 작성 중 도움이 필요하시면 다음 기능을 활용하세요:</p>
|
||||
<ul>
|
||||
<li><strong>가이드:</strong> 창호 관련 용어와 옵션에 대한 설명을 제공합니다. 각 항목을 클릭하면 상세 설명과 이미지를 볼 수 있습니다.</li>
|
||||
<li><strong>실측 튜토리얼:</strong> 창호 규격을 정확하게 측정하는 방법을 단계별로 안내합니다.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="guide-section">
|
||||
<h2>4. 견적 확인 및 진행</h2>
|
||||
<p>견적 요청 후 진행 과정은 다음과 같습니다:</p>
|
||||
<ol>
|
||||
<li>전문가가 요청하신 견적 내용을 검토합니다.</li>
|
||||
<li>검토 완료 후 정확한 견적 금액과 상세 내용을 안내해 드립니다.</li>
|
||||
<li>견적에 동의하시면 계약 및 시공 일정을 조율합니다.</li>
|
||||
<li>시공 완료 후 AS 및 품질 보증 서비스가 제공됩니다.</li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div class="guide-section">
|
||||
<h2>5. 자주 묻는 질문 (FAQ)</h2>
|
||||
<div class="faq-item">
|
||||
<h3>Q: 정확한 창호 규격을 모르는 경우 어떻게 해야 하나요?</h3>
|
||||
<p>A: '실측 튜토리얼' 기능을 참고하여 직접 측정하시거나, 견적 요청 시 비고란에 "실측 필요"라고 기재해 주시면 전문가가 현장 방문하여 실측해 드립니다.</p>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<h3>Q: 견적 요청 후 얼마나 기다려야 하나요?</h3>
|
||||
<p>A: 일반적으로 견적 요청 후 1~2영업일 이내에 연락드립니다. 복잡한 견적의 경우 추가 시간이 소요될 수 있습니다.</p>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<h3>Q: 견적 금액에 시공비가 포함되어 있나요?</h3>
|
||||
<p>A: 시공 여부 옵션에서 '시공 포함'을 선택하신 경우 견적 금액에 시공비가 포함됩니다. '자재만'을 선택하신 경우 자재 비용만 포함됩니다.</p>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<h3>Q: 견적 후 변경이 가능한가요?</h3>
|
||||
<p>A: 네, 계약 전이라면 언제든지 견적 내용을 변경하실 수 있습니다. 담당자에게 연락하시어 변경 사항을 알려주세요.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="guide-section">
|
||||
<h2>6. 문의 및 지원</h2>
|
||||
<p>추가 문의사항이 있으시면 다음 연락처로 문의해 주세요:</p>
|
||||
<ul>
|
||||
<li>전화: 02-XXX-XXXX (평일 09:00~18:00)</li>
|
||||
<li>이메일: support@example.com</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.usage-guide-container {
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
font-family: 'Noto Sans KR', sans-serif;
|
||||
line-height: 1.6;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.guide-title {
|
||||
text-align: center;
|
||||
font-size: 28px;
|
||||
margin-bottom: 30px;
|
||||
color: #1976d2;
|
||||
border-bottom: 2px solid #1976d2;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.guide-section {
|
||||
margin-bottom: 40px;
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
.guide-section h2 {
|
||||
font-size: 22px;
|
||||
color: #1976d2;
|
||||
margin-bottom: 15px;
|
||||
border-left: 5px solid #1976d2;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.guide-section h3 {
|
||||
font-size: 18px;
|
||||
color: #333;
|
||||
margin: 15px 0 10px;
|
||||
}
|
||||
|
||||
.guide-steps {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.guide-steps li {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.guide-steps ul, .guide-section ul {
|
||||
padding-left: 20px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.guide-steps ul li, .guide-section ul li {
|
||||
margin-bottom: 8px;
|
||||
list-style-type: disc;
|
||||
}
|
||||
|
||||
.faq-item {
|
||||
margin-bottom: 20px;
|
||||
border-bottom: 1px dashed #ddd;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.faq-item h3 {
|
||||
color: #1976d2;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.usage-guide-container {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.guide-title {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.guide-section h2 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.guide-section h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user