462 lines
26 KiB
HTML
462 lines
26 KiB
HTML
<!doctype html>
|
||
<html lang="ko">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
||
<title>철판클럽 — 눌러 굽고, 바로 건넨다</title>
|
||
<meta
|
||
name="description"
|
||
content="서울의 빠른 한 끼를 위한 가상 눌림 버거 브랜드 철판클럽의 메뉴, 조합기, 예시 매장과 운영 방식을 살펴보세요."
|
||
/>
|
||
<meta property="og:title" content="철판클럽 — 눌러 굽고, 바로 건넨다" />
|
||
<meta
|
||
property="og:description"
|
||
content="메뉴를 고르고, 재료를 조합하고, 예시 매장 운영 상태까지 확인하는 국내형 버거 쇼케이스."
|
||
/>
|
||
<meta property="og:type" content="website" />
|
||
<meta property="og:image" content="./og.png" />
|
||
<meta property="og:image:alt" content="철판 주방에서 포장한 버거를 건네는 장면" />
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
<meta name="twitter:title" content="철판클럽 — 눌러 굽고, 바로 건넨다" />
|
||
<meta
|
||
name="twitter:description"
|
||
content="메뉴를 고르고 재료를 조합해 보는 국내형 버거 브랜드 쇼케이스."
|
||
/>
|
||
<meta name="twitter:image" content="./og.png" />
|
||
<meta name="theme-color" content="#f4f1e9" />
|
||
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link
|
||
rel="stylesheet"
|
||
href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css"
|
||
/>
|
||
<link
|
||
rel="stylesheet"
|
||
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;600&display=swap"
|
||
/>
|
||
<link rel="stylesheet" href="./styles/tokens.css?v=1" />
|
||
<link rel="stylesheet" href="./styles/site.css?v=1" />
|
||
<link
|
||
rel="icon"
|
||
href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' fill='%232147e7'/%3E%3Cpath d='M6 9h20M8 16h16M10 23h12' stroke='%23fffdf8' stroke-width='3' stroke-linecap='square'/%3E%3C/svg%3E"
|
||
/>
|
||
<script>document.documentElement.classList.add("is-js");</script>
|
||
<script src="./scripts/site.js?v=1" defer></script>
|
||
</head>
|
||
<body>
|
||
<a class="skip-link" href="#main">본문으로 건너뛰기</a>
|
||
|
||
<div class="truth-bar" role="note">
|
||
<p>쇼케이스용 가상 브랜드 · 가격과 매장 정보는 화면 동작 확인용 예시</p>
|
||
</div>
|
||
|
||
<header class="site-head" id="top">
|
||
<div class="wrap head-row">
|
||
<a class="brand" href="#top" aria-label="철판클럽 처음으로">
|
||
<span class="brand-mark" aria-hidden="true"><i></i><i></i><i></i></span>
|
||
<span>철판클럽</span>
|
||
</a>
|
||
<nav class="head-nav" aria-label="주요 메뉴">
|
||
<a href="#menu">메뉴</a>
|
||
<a href="#builder">조합하기</a>
|
||
<a href="#stores">매장 찾기</a>
|
||
<a href="./franchise/">가맹 안내</a>
|
||
</nav>
|
||
<a class="head-action" href="#stores">가까운 매장 보기</a>
|
||
</div>
|
||
</header>
|
||
|
||
<main id="main">
|
||
<section class="hero" aria-labelledby="hero-heading">
|
||
<div class="hero-copy">
|
||
<p class="section-kicker">서울 도심 눌림 버거</p>
|
||
<h1 id="hero-heading">눌러 굽고,<br />바로 건넨다.</h1>
|
||
<p class="hero-lead">
|
||
얇게 눌러 가장자리는 바삭하게. 주문 뒤 조립하고 포장해, 퇴근길 한 상자로 건넵니다.
|
||
</p>
|
||
<div class="hero-actions">
|
||
<a class="button button-primary" href="#menu">오늘 메뉴 보기</a>
|
||
<a class="text-link" href="#builder">내 버거 조합하기 <span aria-hidden="true">→</span></a>
|
||
</div>
|
||
<dl class="hero-facts">
|
||
<div><dt>굽기</dt><dd>얇은 패티를 주문 뒤 눌러 굽기</dd></div>
|
||
<div><dt>받기</dt><dd>포장과 배달 가능 여부를 매장별 표시</dd></div>
|
||
</dl>
|
||
</div>
|
||
<figure class="hero-media image-shell">
|
||
<picture>
|
||
<source media="(max-width: 820px)" srcset="./assets/hero-handoff-mobile.webp" />
|
||
<img
|
||
src="./assets/hero-handoff.webp"
|
||
width="1600"
|
||
height="900"
|
||
alt="밝은 철판 주방에서 직원이 포장한 버거를 건네는 모습"
|
||
fetchpriority="high"
|
||
/>
|
||
</picture>
|
||
<span class="image-fallback" aria-hidden="true">버거 포장 장면</span>
|
||
<figcaption>
|
||
<span>철판에서 상자까지</span>
|
||
<span>생성 이미지 · 실제 매장 아님</span>
|
||
</figcaption>
|
||
</figure>
|
||
<aside class="hero-order" aria-label="오늘 고르기">
|
||
<span class="order-index">01</span>
|
||
<p>철판 더블</p>
|
||
<strong>예시 단품 8,900원</strong>
|
||
<button type="button" data-preset="double">이 조합으로 시작</button>
|
||
</aside>
|
||
</section>
|
||
|
||
<section class="service-strip" aria-label="이용 방식">
|
||
<div class="wrap service-row">
|
||
<p><span aria-hidden="true">●</span> 주문 뒤 조리</p>
|
||
<p>단품과 세트</p>
|
||
<p>포장 여부 매장별 확인</p>
|
||
<p>배달 여부 매장별 확인</p>
|
||
<p class="mono">GRIDDLE CLUB</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section menu-section" id="menu" aria-labelledby="menu-heading">
|
||
<div class="wrap">
|
||
<div class="section-head split-head">
|
||
<div>
|
||
<p class="section-kicker">오늘 고를 메뉴</p>
|
||
<h2 id="menu-heading">버거가 먼저 보이게.</h2>
|
||
</div>
|
||
<p class="section-note">
|
||
모든 가격은 조합기 동작을 보여 주기 위한 예시입니다. 실제 판매와 주문은 이루어지지 않습니다.
|
||
</p>
|
||
</div>
|
||
|
||
<div class="menu-toolbar" role="group" aria-label="메뉴 분류">
|
||
<button type="button" class="filter-button is-active" data-menu-filter="all" aria-pressed="true">전체</button>
|
||
<button type="button" class="filter-button" data-menu-filter="burger" aria-pressed="false">버거</button>
|
||
<button type="button" class="filter-button" data-menu-filter="side" aria-pressed="false">곁들임</button>
|
||
<button type="button" class="filter-button" data-menu-filter="drink" aria-pressed="false">음료</button>
|
||
</div>
|
||
|
||
<div class="menu-grid" id="menu-grid">
|
||
<article class="menu-item menu-item-featured" data-menu-category="burger">
|
||
<div class="menu-photo image-shell">
|
||
<img
|
||
src="./assets/signature-double.webp"
|
||
width="1400"
|
||
height="933"
|
||
alt="철판 패티 두 장과 치즈, 구운 양파를 넣은 버거"
|
||
loading="lazy"
|
||
/>
|
||
<span class="image-fallback" aria-hidden="true">철판 더블 사진</span>
|
||
<span class="menu-number">01</span>
|
||
</div>
|
||
<div class="menu-body">
|
||
<div><p class="menu-state">대표 메뉴</p><h3>철판 더블</h3></div>
|
||
<p>얇은 패티 두 장, 치즈, 구운 양파, 피클, 집 소스.</p>
|
||
<div class="menu-foot">
|
||
<span><small>예시 단품</small> 8,900원</span>
|
||
<button type="button" data-preset="double">조합하기</button>
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="menu-item menu-item-graphic" data-menu-category="burger">
|
||
<div class="ingredient-stack" aria-hidden="true">
|
||
<span class="bun"></span><span class="pickle"></span><span class="cheese"></span><span class="patty"></span><span class="bun bottom"></span>
|
||
<b>02</b>
|
||
</div>
|
||
<div class="menu-body">
|
||
<div><p class="menu-state">가볍게</p><h3>철판 싱글</h3></div>
|
||
<p>패티 한 장, 치즈, 피클, 집 소스. 단품으로 빠르게.</p>
|
||
<div class="menu-foot">
|
||
<span><small>예시 단품</small> 6,900원</span>
|
||
<button type="button" data-preset="single">조합하기</button>
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="menu-item menu-item-blue" data-menu-category="burger">
|
||
<div class="menu-poster" aria-hidden="true"><span>03</span><i></i><i></i><i></i></div>
|
||
<div class="menu-body">
|
||
<div><p class="menu-state">매운 피클</p><h3>고추 피클 더블</h3></div>
|
||
<p>고추 피클과 매운 소스를 더한 더블. 맵기는 예시입니다.</p>
|
||
<div class="menu-foot">
|
||
<span><small>예시 단품</small> 9,400원</span>
|
||
<button type="button" data-preset="spicy">조합하기</button>
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="menu-item menu-item-small" data-menu-category="side">
|
||
<div class="menu-body">
|
||
<div><p class="menu-state">곁들임</p><h3>얇은 감자</h3></div>
|
||
<p>가늘게 튀겨 소금으로 마무리합니다.</p>
|
||
<div class="menu-foot"><span><small>예시 가격</small> 3,600원</span></div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="menu-item menu-item-small" data-menu-category="side">
|
||
<div class="menu-body">
|
||
<div><p class="menu-state">곁들임</p><h3>양파 한 컵</h3></div>
|
||
<p>철판에서 단맛을 낸 양파를 따로 담습니다.</p>
|
||
<div class="menu-foot"><span><small>예시 가격</small> 2,800원</span></div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="menu-item menu-item-small" data-menu-category="drink">
|
||
<div class="menu-body">
|
||
<div><p class="menu-state">음료</p><h3>탄산 한 잔</h3></div>
|
||
<p>매장에서 고른 음료 한 잔. 제품별 성분을 확인해 주세요.</p>
|
||
<div class="menu-foot"><span><small>예시 가격</small> 2,400원</span></div>
|
||
</div>
|
||
</article>
|
||
</div>
|
||
<div class="empty-state" id="menu-empty" hidden role="status">
|
||
<strong>이 분류에 준비된 예시 메뉴가 없어요.</strong>
|
||
<button type="button" data-show-all-menu>모든 메뉴 보기</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section builder-section" id="builder" aria-labelledby="builder-heading">
|
||
<div class="wrap">
|
||
<div class="section-head split-head">
|
||
<div>
|
||
<p class="section-kicker">버거 조합기</p>
|
||
<h2 id="builder-heading">상자에 담길 내용을<br />먼저 정하세요.</h2>
|
||
</div>
|
||
<p class="section-note">재료 선택과 예시 총액은 실제로 바뀝니다. 주문 전송 기능은 없습니다.</p>
|
||
</div>
|
||
|
||
<div class="builder-layout">
|
||
<form class="builder-form" id="burger-builder" novalidate>
|
||
<fieldset>
|
||
<legend><span>01</span> 맛 고르기</legend>
|
||
<div class="choice-row">
|
||
<label><input type="radio" name="flavor" value="classic" checked /><span><strong>기본</strong><small>집 소스와 피클</small></span></label>
|
||
<label><input type="radio" name="flavor" value="spicy" /><span><strong>매운 피클</strong><small>고추 피클과 매운 소스</small></span></label>
|
||
</div>
|
||
</fieldset>
|
||
|
||
<fieldset>
|
||
<legend><span>02</span> 크기와 치즈</legend>
|
||
<div class="choice-row choice-row-compact">
|
||
<label><input type="radio" name="patty" value="1" /><span>패티 한 장</span></label>
|
||
<label><input type="radio" name="patty" value="2" checked /><span>패티 두 장</span></label>
|
||
</div>
|
||
<label class="field-label" for="cheese">치즈</label>
|
||
<select id="cheese" name="cheese">
|
||
<option value="0">치즈 없음</option>
|
||
<option value="1" selected>치즈 한 장</option>
|
||
<option value="2">치즈 두 장</option>
|
||
</select>
|
||
</fieldset>
|
||
|
||
<fieldset>
|
||
<legend><span>03</span> 양파와 피클</legend>
|
||
<div class="select-grid">
|
||
<label>구운 양파
|
||
<select name="onion"><option value="none">없음</option><option value="regular" selected>기본</option><option value="extra">많이</option></select>
|
||
</label>
|
||
<label>피클
|
||
<select name="pickle"><option value="none">없음</option><option value="regular" selected>기본</option><option value="extra">많이</option></select>
|
||
</label>
|
||
<label>소스
|
||
<select name="sauce"><option value="none">없음</option><option value="regular" selected>기본</option><option value="side">따로</option></select>
|
||
</label>
|
||
</div>
|
||
</fieldset>
|
||
|
||
<fieldset>
|
||
<legend><span>04</span> 단품 또는 세트</legend>
|
||
<div class="choice-row choice-row-compact">
|
||
<label><input type="radio" name="serving" value="single" checked /><span>단품</span></label>
|
||
<label><input type="radio" name="serving" value="set" /><span>세트 더하기</span></label>
|
||
</div>
|
||
<div class="set-options" id="set-options">
|
||
<p id="set-heading">세트 구성</p>
|
||
<div class="select-grid">
|
||
<label>곁들임
|
||
<select name="side" disabled><option value="fries">얇은 감자</option><option value="onion">양파 한 컵</option></select>
|
||
</label>
|
||
<label>음료
|
||
<select name="drink" disabled><option value="cola">탄산 한 잔</option><option value="water">물 한 병</option></select>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</fieldset>
|
||
|
||
<fieldset>
|
||
<legend><span>05</span> 받을 예시 매장</legend>
|
||
<label class="field-label" for="builder-store">매장</label>
|
||
<select id="builder-store" name="store">
|
||
<option value="seongsu">성수 예시점 · 영업 중 예시</option>
|
||
<option value="yeonnam">연남 예시점 · 영업 종료 예시</option>
|
||
<option value="mullae">문래 예시점 · 오늘은 쉬어요</option>
|
||
</select>
|
||
<p class="field-help">매장과 영업 상태도 화면 동작용 예시입니다.</p>
|
||
</fieldset>
|
||
</form>
|
||
|
||
<aside class="builder-summary" aria-labelledby="summary-heading">
|
||
<div class="summary-photo image-shell">
|
||
<img
|
||
src="./assets/signature-double.webp"
|
||
width="1400"
|
||
height="933"
|
||
alt="조합 결과를 설명하는 철판 더블 버거"
|
||
loading="lazy"
|
||
/>
|
||
<span class="image-fallback" aria-hidden="true">조합 버거 사진</span>
|
||
<span class="summary-stamp">화면 예시</span>
|
||
</div>
|
||
<div class="summary-body">
|
||
<p class="section-kicker">고른 내용</p>
|
||
<h3 id="summary-heading">철판 더블</h3>
|
||
<p id="summary-lines">패티 두 장 / 치즈 한 장 / 양파 기본 / 피클 기본 / 소스 기본</p>
|
||
<dl class="summary-list">
|
||
<div><dt>받기</dt><dd id="summary-serving">단품</dd></div>
|
||
<div><dt>예시 매장</dt><dd id="summary-store">성수 예시점</dd></div>
|
||
<div><dt>상태</dt><dd id="summary-store-state">영업 중 예시</dd></div>
|
||
</dl>
|
||
<div class="allergen-note" id="allergen-note">
|
||
<strong>알레르기 예시</strong>
|
||
<p id="summary-allergens">알, 우유, 대두, 밀, 쇠고기</p>
|
||
<small>같은 철판과 조리 도구를 함께 씁니다. 재료를 빼도 알레르기 안전을 보장하지 않습니다.</small>
|
||
</div>
|
||
<div class="summary-total"><span>화면 계산용 예시 총액</span><strong id="summary-total">8,900원</strong></div>
|
||
<p class="truth-inline">실제 주문이나 결제로 전송되지 않습니다.</p>
|
||
<button class="button button-primary button-full" type="button" id="save-builder">선택 내용 저장</button>
|
||
<a class="button button-ghost button-full" href="#stores" id="other-store-link">다른 매장 찾기</a>
|
||
<p class="save-status" id="save-status" role="status" aria-live="polite"></p>
|
||
</div>
|
||
</aside>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section process-section" id="process" aria-labelledby="process-heading">
|
||
<div class="wrap process-grid">
|
||
<div class="process-copy">
|
||
<p class="section-kicker">철판에서 상자까지</p>
|
||
<h2 id="process-heading">빠르다는 말 대신,<br />순서를 보여 줍니다.</h2>
|
||
<ol class="process-list">
|
||
<li><span>01</span><div><strong>누르기</strong><p>얇은 패티를 뜨거운 철판에 눌러 가장자리를 만듭니다.</p></div></li>
|
||
<li><span>02</span><div><strong>겹치기</strong><p>치즈, 구운 양파, 피클을 고른 순서대로 올립니다.</p></div></li>
|
||
<li><span>03</span><div><strong>건네기</strong><p>유산지와 상자에 담고 포장 상태를 확인합니다.</p></div></li>
|
||
</ol>
|
||
</div>
|
||
<figure class="process-media image-shell">
|
||
<img
|
||
src="./assets/griddle-press.webp"
|
||
width="1400"
|
||
height="933"
|
||
alt="조리사가 철판에서 패티를 눌러 굽고 양파를 익히는 모습"
|
||
loading="lazy"
|
||
/>
|
||
<span class="image-fallback" aria-hidden="true">철판 조리 장면</span>
|
||
<figcaption>생성 이미지 · 실제 조리 시설 아님</figcaption>
|
||
</figure>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section stores-section" id="stores" aria-labelledby="stores-heading">
|
||
<div class="wrap">
|
||
<div class="section-head split-head">
|
||
<div><p class="section-kicker">매장 찾기</p><h2 id="stores-heading">지금 받을 수 있는지<br />먼저 확인하세요.</h2></div>
|
||
<p class="section-note">주소, 전화, 거리와 운영 상태를 꾸며내지 않습니다. 아래 세 곳은 상태 화면을 위한 예시 매장입니다.</p>
|
||
</div>
|
||
|
||
<div class="store-tools">
|
||
<div class="search-box">
|
||
<input id="store-search" type="search" placeholder="동네 또는 매장명 검색" autocomplete="off" aria-label="예시 매장 검색" />
|
||
<button type="button" id="clear-store-search" hidden>지우기</button>
|
||
</div>
|
||
<div class="region-filters" role="group" aria-label="지역 고르기">
|
||
<button type="button" class="is-active" data-region="all" aria-pressed="true">전체</button>
|
||
<button type="button" data-region="성동" aria-pressed="false">성동</button>
|
||
<button type="button" data-region="마포" aria-pressed="false">마포</button>
|
||
<button type="button" data-region="영등포" aria-pressed="false">영등포</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="store-layout">
|
||
<div class="store-list" id="store-list">
|
||
<article class="store-card is-selected" data-store="seongsu" data-region="성동" data-search="성수 예시점 성동 성수동" tabindex="-1">
|
||
<div class="store-card-top"><span class="store-state state-open">영업 중 예시</span><span>예시 매장</span></div>
|
||
<h3>성수 예시점</h3>
|
||
<p>서울 성동구 성수동 일대 · 상세 주소 없음</p>
|
||
<dl><div><dt>운영</dt><dd>예시 11:00–21:30</dd></div><div><dt>마지막 주문</dt><dd>예시 21:00</dd></div></dl>
|
||
<ul aria-label="이용 방식"><li>포장 가능 예시</li><li>배달 가능 예시</li></ul>
|
||
<button type="button" data-select-store="seongsu">이 매장으로 조합 보기</button>
|
||
</article>
|
||
|
||
<article class="store-card" data-store="yeonnam" data-region="마포" data-search="연남 예시점 마포 연남동" tabindex="-1">
|
||
<div class="store-card-top"><span class="store-state state-closed">영업 종료 예시</span><span>예시 매장</span></div>
|
||
<h3>연남 예시점</h3>
|
||
<p>서울 마포구 연남동 일대 · 상세 주소 없음</p>
|
||
<dl><div><dt>운영</dt><dd>예시 11:30–20:30</dd></div><div><dt>마지막 주문</dt><dd>오늘 마감</dd></div></dl>
|
||
<ul aria-label="이용 방식"><li>포장 마감</li><li>배달 마감</li></ul>
|
||
<button type="button" data-select-store="yeonnam">종료 상태로 조합 보기</button>
|
||
</article>
|
||
|
||
<article class="store-card" data-store="mullae" data-region="영등포" data-search="문래 예시점 영등포 문래동" tabindex="-1">
|
||
<div class="store-card-top"><span class="store-state state-pause">오늘은 쉬어요</span><span>예시 매장</span></div>
|
||
<h3>문래 예시점</h3>
|
||
<p>서울 영등포구 문래동 일대 · 상세 주소 없음</p>
|
||
<dl><div><dt>운영</dt><dd>임시 휴무 예시</dd></div><div><dt>다음 확인</dt><dd>매장별 안내 필요</dd></div></dl>
|
||
<ul aria-label="이용 방식"><li>포장 불가</li><li>배달 불가</li></ul>
|
||
<button type="button" data-select-store="mullae">휴무 상태로 조합 보기</button>
|
||
</article>
|
||
</div>
|
||
|
||
<aside class="store-map" aria-label="예시 매장 분포 그림">
|
||
<div class="map-grid" aria-hidden="true"></div>
|
||
<span class="map-river" aria-hidden="true"></span>
|
||
<button type="button" class="map-pin pin-seongsu is-active" data-map-store="seongsu" aria-label="성수 예시점 고르기"><span>성수</span></button>
|
||
<button type="button" class="map-pin pin-yeonnam" data-map-store="yeonnam" aria-label="연남 예시점 고르기"><span>연남</span></button>
|
||
<button type="button" class="map-pin pin-mullae" data-map-store="mullae" aria-label="문래 예시점 고르기"><span>문래</span></button>
|
||
<p>실제 지도와 위치가 아닌 화면 설명용 도식</p>
|
||
</aside>
|
||
</div>
|
||
|
||
<div class="empty-state store-empty" id="store-empty" hidden role="status">
|
||
<strong>찾는 조건과 맞는 예시 매장이 없어요.</strong>
|
||
<p>검색어와 지역 조건을 지우고 다시 확인해 주세요.</p>
|
||
<button type="button" id="reset-store-search">검색 조건 지우기</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="franchise-callout" aria-labelledby="franchise-heading">
|
||
<figure class="franchise-image image-shell">
|
||
<img
|
||
src="./assets/kitchen-flow.webp"
|
||
width="1400"
|
||
height="933"
|
||
alt="좁고 밝은 주방에서 두 직원이 철판 조리와 포장을 나누어 맡는 모습"
|
||
loading="lazy"
|
||
/>
|
||
<span class="image-fallback" aria-hidden="true">주방 운영 동선 장면</span>
|
||
</figure>
|
||
<div class="franchise-copy">
|
||
<p class="section-kicker">가맹을 생각한다면</p>
|
||
<h2 id="franchise-heading">매출 약속보다<br />운영 조건부터.</h2>
|
||
<p>상권, 점포, 면적, 조리 동선과 비용 미정 항목을 먼저 확인할 수 있게 분리했습니다.</p>
|
||
<a class="button button-light" href="./franchise/">가맹 운영 조건 보기 <span aria-hidden="true">→</span></a>
|
||
<small>실제 가맹 모집과 상담이 아닌 쇼케이스용 흐름입니다.</small>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer class="site-foot">
|
||
<div class="wrap foot-grid">
|
||
<div><a class="brand brand-foot" href="#top"><span class="brand-mark" aria-hidden="true"><i></i><i></i><i></i></span><span>철판클럽</span></a><p>눌러 굽고, 바로 건넨다.</p></div>
|
||
<div><strong>살펴보기</strong><a href="#menu">메뉴</a><a href="#builder">조합기</a><a href="#stores">예시 매장</a><a href="./franchise/">가맹 안내</a></div>
|
||
<div><strong>정보 안내</strong><p>알레르기 정보도 예시입니다.</p><p>원산지와 영양 정보는 실제 제품 자료가 아닙니다.</p></div>
|
||
<div class="foot-truth"><strong>쇼케이스 고지</strong><p>가상 브랜드이며 실제 주문, 결제, 매장 방문, 가맹 문의를 제공하지 않습니다.</p><p class="mono">DESIGN SHOWCASE · 2026</p></div>
|
||
</div>
|
||
</footer>
|
||
</body>
|
||
</html>
|