<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<link rel="preconnect" href="https://cloudcdn.pro" crossorigin />
<title>게시물</title>
<meta name="author" content="jane.doe@kaishi.kr (Jane Doe)">
<meta name="description" content="멋진 웹사이트를 만드는 데 필요한 모든 것.">
<meta name="keywords" content="kaishi 스타터 템플릿, 정적 사이트 생성기, 정적 사이트 생성기, 스타터 템플릿, bootstrap, bootstrap css, bootstrap javascript, 콘텐츠 보안 정책, 오픈 그래프 메타 태그, 반응형 내비게이션 바, schema.org 메타 태그">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="accessibility" content="ARIA" />
<meta name="accessibility" content="fullKeyboardControl" />
<meta name="accessibility" content="noFlashingHazard" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="Kaishi">
<meta name="mobile-web-app-capable" content="yes" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data: https:; style-src 'self' 'unsafe-inline'; font-src 'self'; media-src 'self';" />
<link rel="alternate" href="https://kaishi.kr" hreflang="ko" />
<link rel="canonical" href="https://kaishi.kr" />
<link rel="icon" type="image/x-icon" href="https://cloudcdn.pro/kaishi/images/favicon.ico" />
<link rel="apple-touch-icon" href="https://cloudcdn.pro/kaishi/images/icons/192x192.png" sizes="192x192" />
<link rel="icon" type="image/png" href="https://cloudcdn.pro/kaishi/images/icons/16x16.png" sizes="16x16" />
<link rel="icon" type="image/png" href="https://cloudcdn.pro/kaishi/images/icons/32x32.png" sizes="32x32" />
<meta name="theme-color" content="rgb(143, 250, 113)" />
<link rel="manifest" href="/ko/manifest.json" />
<link rel="alternate" type="application/rss+xml" href="/ko/rss.xml" />
<style>
:root{--vp-bg:#fff;--vp-bs:#f6f6f7;--vp-ba:#f6f6f7;--vp-t1:#3c3c43;--vp-t2:#4a4a52;--vp-t3:#595960;--vp-br:#166534;--vp-bl:#14532d;--vp-bd:rgba(60,60,67,.24);--vp-nh:64px}
[data-theme="dark"]{--vp-bg:#1b1b1f;--vp-bs:#202127;--vp-ba:#161618;--vp-t1:#f5f5f7;--vp-t2:#cccccf;--vp-t3:#a1a1a8;--vp-br:#86efac;--vp-bl:#bbf7d0;--vp-bd:rgba(180,180,190,.32)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--vp-bg:#1b1b1f;--vp-bs:#202127;--vp-ba:#161618;--vp-t1:#f5f5f7;--vp-t2:#cccccf;--vp-t3:#a1a1a8;--vp-br:#86efac;--vp-bl:#bbf7d0;--vp-bd:rgba(180,180,190,.32)}}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:16px;line-height:1.7;color:var(--vp-t1);background:var(--vp-bg)}
a{color:var(--vp-br);text-decoration:none}
a:hover{color:var(--vp-bl)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,h5,h6{font-weight:600;color:var(--vp-t1)}
h1{font-size:clamp(1.75rem,4vw,2.5rem);margin:1.5rem 0 1rem}
h2{font-size:clamp(1.35rem,3vw,1.75rem);margin:2rem 0 .75rem;padding-bottom:.75rem;border-bottom:1px solid var(--vp-bd)}
h3{font-size:1.25rem;margin:1.5rem 0 .5rem}
p{margin:.75rem 0}
strong{font-weight:600}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.875em}
pre{background:var(--vp-bs);border:1px solid var(--vp-bd);border-radius:8px;color:var(--vp-t1);overflow-x:auto;padding:1rem 1.25rem}
code{background:var(--vp-bs);border-radius:4px;padding:.15em .35em}
pre code{background:none;padding:0}
.skip-link{position:absolute;top:-100%;left:1rem;background:var(--vp-br);color:#fff;padding:.5rem 1rem;border-radius:8px;z-index:1000;font-weight:600}
.skip-link:focus{top:1rem;outline:none}
.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--vp-nh);background:var(--vp-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--vp-bd)}
.nav-inner{display:flex;align-items:center;height:var(--vp-nh);max-width:1376px;margin:0 auto;padding:0 24px}
.nav-brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--vp-t1);font-weight:600;flex-shrink:0}
.nav-brand img{width:28px;height:28px}
.nav-search{display:flex;align-items:center;gap:8px;border:1px solid var(--vp-bd);border-radius:8px;padding:6px 14px;cursor:pointer;background:none;color:var(--vp-t3);font-size:14px;margin-left:auto;margin-right:16px}
.nav-search:hover{border-color:var(--vp-br)}
.nav-search svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none}
.nav-search kbd{font-size:11px;border:1px solid var(--vp-bd);border-radius:4px;padding:1px 5px;margin-left:8px;background:var(--vp-bs);color:var(--vp-t3)}
.nav-links{display:flex;align-items:center;gap:4px}
.nav-links a{padding:4px 12px;color:var(--vp-t1);font-size:14px;font-weight:500}
.nav-links a:hover{color:var(--vp-br)}
.nav-controls{display:flex;align-items:center;gap:8px;margin-left:16px;flex-shrink:0}
.lang-btn{position:relative;background:none;border:none;cursor:pointer;color:var(--vp-t2);padding:4px;display:flex;align-items:center}
.lang-btn svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.5;fill:none}
.lang-dropdown{display:none;position:absolute;top:calc(100% + 8px);inset-inline-end:0;background:var(--vp-bg);border:1px solid var(--vp-bd);border-radius:8px;padding:8px;min-width:480px;max-height:70vh;overflow-y:auto;z-index:200;box-shadow:0 8px 24px #00000026}.lang-menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.lang-menu-grid a{display:flex;align-items:center;gap:6px;padding:6px 10px;color:var(--vp-t1);font-size:12px;border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lang-menu-grid a:hover{background:var(--vp-bs)}.lang-menu-grid .flag{font-size:14px;flex-shrink:0}.lang-btn{gap:4px;font-size:13px;font-weight:500}.lang-btn .lang-code{font-variant:all-small-caps;letter-spacing:.5px}.mobile-menu{display:none}.mobile-lang{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;padding-top:12px;border-top:1px solid var(--vp-bd);margin-top:12px}.mobile-lang a{display:flex;align-items:center;gap:6px;padding:8px;color:var(--vp-t1);font-size:13px;border-bottom:none}@media(max-width:768px){.lang-dropdown{min-width:280px;inset-inline-end:8px}.lang-menu-grid{grid-template-columns:repeat(2,1fr)}}
.lang-dropdown.open{display:block}
.lang-dropdown a{display:block;padding:6px 12px;color:var(--vp-t1);font-size:13px;border-radius:4px}
.lang-dropdown a:hover{background:var(--vp-bs)}
.theme-switch{position:relative;width:40px;height:22px;background:var(--vp-bs);border:1px solid var(--vp-bd);border-radius:11px;cursor:pointer;padding:0;flex-shrink:0}
.theme-switch::before{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--vp-t2);transition:transform .25s}
[data-theme="dark"] .theme-switch::before,.theme-switch.dark::before{transform:translateX(18px)}
.theme-switch .sun-svg,.theme-switch .moon-svg{position:absolute;top:3px;width:14px;height:14px;stroke:var(--vp-t3);stroke-width:2;fill:none}
.theme-switch .sun-svg{left:3px}
.theme-switch .moon-svg{right:3px}
.menu-toggle{display:none;background:none;border:1px solid var(--vp-bd);border-radius:6px;padding:4px 6px;cursor:pointer;color:var(--vp-t1)}.lang-btn,.menu-toggle{min-width:44px;min-height:44px}.theme-switch{position:relative}.theme-switch::after{content:'';position:absolute;inset:-11px;}
.menu-toggle svg{width:20px;height:20px;stroke:currentColor;stroke-width:2;fill:none}
.hero{padding:calc(var(--vp-nh) + 60px) 24px 80px;text-align:center;max-width:960px;margin:0 auto}
.hero-name{font-size:clamp(2rem,5vw,3.5rem);font-weight:700;line-height:1.1;background:linear-gradient(120deg,var(--vp-br) 30%,#4ade80);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem}
.hero-tagline{font-size:clamp(1rem,2vw,1.25rem);color:var(--vp-t2);line-height:1.6;max-width:560px;margin:0 auto 2rem}
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn-brand,.btn-alt,.btn-submit{display:inline-flex;align-items:center;padding:10px 24px;border-radius:20px;font-size:15px;cursor:pointer;border:none}
.btn-brand,.btn-submit{background:var(--vp-br);color:#fff;font-weight:600}
.btn-brand:hover,.btn-submit:hover{background:var(--vp-bl)}
.btn-alt{background:transparent;color:var(--vp-t1);border:1px solid var(--vp-bd);font-weight:500}
.btn-alt:hover{border-color:var(--vp-br)}
.hero-banner{margin:2rem auto 0;max-width:720px;border-radius:12px;overflow:hidden;box-shadow:0 8px 28px rgba(0,0,0,.12)}
.hero-banner img{width:100%;display:block}
.content-wrap{max-width:740px;margin:0 auto;padding:48px 24px;margin-top:var(--vp-nh)}
.content{font-size:16px;line-height:1.7;color:var(--vp-t1)}
.content ul,.content ol{padding-left:1.25rem;margin:.75rem 0}
.content li{margin:.25rem 0}
.breadcrumb{font-size:14px;color:var(--vp-t3);margin-bottom:24px}
.breadcrumb a{color:var(--vp-br)}
.breadcrumb span{margin:0 6px}
.article-meta{font-size:14px;color:var(--vp-t2);margin-bottom:2rem;display:flex;gap:12px;align-items:center}
.footer{background:var(--vp-ba);padding:48px 24px 24px}
.footer-inner{max-width:1152px;margin:0 auto}
.footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-bottom:32px}
.footer-heading{font-size:14px;font-weight:700;color:var(--vp-t1);margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}
.footer-col a{display:block;color:var(--vp-t2);font-size:14px;padding:3px 0}
.footer-col a:hover{color:var(--vp-br)}
.footer-bottom{border-top:1px solid var(--vp-bd);padding-top:20px;text-align:center;color:var(--vp-t3);font-size:13px}
.form-card{background:var(--vp-bs);border:1px solid var(--vp-bd);border-radius:12px;padding:2rem;max-width:520px;margin:2rem auto 0}
.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:1.25rem}
.form-group label{font-weight:600;font-size:14px;color:var(--vp-t1)}
.form-group input,.form-group select,.form-group textarea{background:var(--vp-bg);color:var(--vp-t1);border:1px solid var(--vp-bd);border-radius:8px;padding:8px 12px;font-family:inherit;font-size:15px}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--vp-br);outline:2px solid var(--vp-br);outline-offset:1px}
.form-group textarea{resize:vertical;min-height:120px}
:focus-visible{outline:2px solid var(--vp-br);outline-offset:2px}
.navbar-nav{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.nav-item{display:inline-flex}
.nav-item a{display:block;padding:4px 12px;color:var(--vp-t1);font-size:14px;font-weight:500;text-decoration:none;text-transform:none}
.nav-item a:hover{color:var(--vp-br)}
.nav-item a.text-uppercase{text-transform:none}
.nav-item a.p-2{padding:4px 12px}
.ms-auto{margin-left:auto}.mb-2{margin-bottom:0}.mb-lg-0{margin-bottom:0}
#ssg-search-btn{display:none!important}
.content{overflow:hidden}
.content img{max-width:100%;height:auto;border-radius:8px;margin:1.5rem 0;display:block}
.content .img-fluid{max-width:100%;height:auto;border-radius:8px}
.content .w-50{max-width:50%}
.content .float-start{float:left;margin:0 1.5rem 1rem 0}
.content .float-end{float:right;margin:0 0 1rem 1.5rem}
.content .p-5{padding:0}
.content .mb-3{margin-bottom:1rem}
.content .fw-bold{font-weight:600}
.content .text-danger{color:var(--vp-br)}
.content .display-1{font-size:2rem;font-weight:600}
.content::after{content:"";display:table;clear:both}
@media(max-width:768px){.content .w-50{max-width:100%}.content .float-start,.content .float-end{float:none;margin:1rem 0}.nav-links,.nav-search,.navbar-nav{display:none}.menu-toggle{display:flex}.nav-controls{margin-left:auto}.nav-controls .lang-btn{display:none}.mobile-menu{display:none;position:fixed;top:var(--vp-nh);left:0;right:0;bottom:0;background:var(--vp-bg);padding:24px;z-index:99;overflow-y:auto}.mobile-menu.open{display:block}.mobile-menu a,.mobile-menu .nav-item a{display:block;padding:10px 0;font-size:15px;color:var(--vp-t1);border-bottom:1px solid var(--vp-bd)}.mobile-menu .navbar-nav{display:block}.mobile-menu .nav-item{display:block}.hero{padding:calc(var(--vp-nh) + 32px) 16px 48px}.hero-name{font-size:clamp(1.75rem,6vw,2.5rem)}.content-wrap{padding:32px 16px}.footer-cols{grid-template-columns:1fr;gap:24px}}
</style>
<meta property="og:title" content="게시물">
<meta property="og:description" content="홈 &gt; 블로그 &gt; 게시물 게시물 작성자: jane.doe@kaishi.kr (Jane Doe) &middot; Wed, 01 Jan 2025 01:01:01 GMT ![빛나는 자연][00] 스타터">
<meta property="og:type" content="article">
<meta property="og:url" content="https://kaishi.kr">
<meta property="og:locale" content="ko">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="게시물">
<meta name="twitter:description" content="홈 &gt; 블로그 &gt; 게시물 게시물 작성자: jane.doe@kaishi.kr (Jane Doe) &middot; Wed, 01 Jan 2025 01:01:01 GMT ![빛나는 자연][00] 스타터">
<link rel="alternate" hreflang="ar" href="https://example.com/ar/posts/index.html" />
<link rel="alternate" hreflang="bn" href="https://example.com/bn/posts/index.html" />
<link rel="alternate" hreflang="cs" href="https://example.com/cs/posts/index.html" />
<link rel="alternate" hreflang="de" href="https://example.com/de/posts/index.html" />
<link rel="alternate" hreflang="en" href="https://example.com/en/posts/index.html" />
<link rel="alternate" hreflang="es" href="https://example.com/es/posts/index.html" />
<link rel="alternate" hreflang="ha" href="https://example.com/ha/posts/index.html" />
<link rel="alternate" hreflang="he" href="https://example.com/he/posts/index.html" />
<link rel="alternate" hreflang="hi" href="https://example.com/hi/posts/index.html" />
<link rel="alternate" hreflang="id" href="https://example.com/id/posts/index.html" />
<link rel="alternate" hreflang="it" href="https://example.com/it/posts/index.html" />
<link rel="alternate" hreflang="ja" href="https://example.com/ja/posts/index.html" />
<link rel="alternate" hreflang="ko" href="https://example.com/ko/posts/index.html" />
<link rel="alternate" hreflang="nl" href="https://example.com/nl/posts/index.html" />
<link rel="alternate" hreflang="pl" href="https://example.com/pl/posts/index.html" />
<link rel="alternate" hreflang="pt" href="https://example.com/pt/posts/index.html" />
<link rel="alternate" hreflang="ro" href="https://example.com/ro/posts/index.html" />
<link rel="alternate" hreflang="ru" href="https://example.com/ru/posts/index.html" />
<link rel="alternate" hreflang="sv" href="https://example.com/sv/posts/index.html" />
<link rel="alternate" hreflang="th" href="https://example.com/th/posts/index.html" />
<link rel="alternate" hreflang="tl" href="https://example.com/tl/posts/index.html" />
<link rel="alternate" hreflang="tr" href="https://example.com/tr/posts/index.html" />
<link rel="alternate" hreflang="uk" href="https://example.com/uk/posts/index.html" />
<link rel="alternate" hreflang="vi" href="https://example.com/vi/posts/index.html" />
<link rel="alternate" hreflang="yo" href="https://example.com/yo/posts/index.html" />
<link rel="alternate" hreflang="zh" href="https://example.com/zh/posts/index.html" />
<link rel="alternate" hreflang="zh-tw" href="https://example.com/zh-tw/posts/index.html" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en/posts/index.html" />
</head>
<body id="page-top" itemscope itemtype="http://schema.org/WebPage">
<a class="skip-link" href="#main">콘텐츠로 건너뛰기</a>
<nav class="nav" id="mainNav" itemscope itemtype="http://schema.org/SiteNavigationElement" aria-label="주 내비게이션">
<div class="nav-inner">
<a class="nav-brand" href="/ko/" aria-label="정적 사이트용 스타터 템플릿 Kaishi의 로고 - 홈">
<img width="100" height="33" src="https://cloudcdn.pro/kaishi/v1/logos/kaishi.svg" alt="정적 사이트용 스타터 템플릿 Kaishi의 로고" loading="lazy" decoding="async" />
<span itemprop="name">Kaishi</span>
</a>
<button class="nav-search" type="button" aria-label="검색">
<svg aria-hidden="true" viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
<span>검색</span>
<kbd>⌘K</kbd>
</button>
<div class="nav-links" id="navLinks">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0"><li class="nav-item"><a class="text-uppercase p-2" title="기능" aria-label="기능" href="/features/index.html">기능</a></li><li class="nav-item"><a class="text-uppercase p-2" title="게시물" aria-label="게시물" href="/posts/index.html">게시물</a></li><li class="nav-item"><a class="text-uppercase p-2" title="태그로 탐색" aria-label="태그로 탐색" href="/tags/index.html">태그로 탐색</a></li><li class="nav-item"><a class="text-uppercase p-2" title="문의하기" aria-label="문의하기" href="/contact/index.html">문의하기</a></li></ul>
</div>
<div class="nav-controls">
<div style="position:relative">
<button class="lang-btn" type="button" aria-label="Select language" id="langToggle"><span aria-hidden="true">🌐</span> <span class="lang-code">KO</span></button>
<div class="lang-dropdown" id="langDropdown">
<div class="lang-menu-grid">
<a href="/" hreflang="en" lang="en"><span class="flag">🇬🇧</span> English</a>
<a href="/fr/" hreflang="fr" lang="fr"><span class="flag">🇫🇷</span> Français</a>
<a href="/ar/" hreflang="ar" lang="ar"><span class="flag">🇸🇦</span> العربية</a>
<a href="/bn/" hreflang="bn" lang="bn"><span class="flag">🇧🇩</span> বাংলা</a>
<a href="/cs/" hreflang="cs" lang="cs"><span class="flag">🇨🇿</span> Čeština</a>
<a href="/de/" hreflang="de" lang="de"><span class="flag">🇩🇪</span> Deutsch</a>
<a href="/es/" hreflang="es" lang="es"><span class="flag">🇪🇸</span> Español</a>
<a href="/ha/" hreflang="ha" lang="ha"><span class="flag">🇳🇬</span> Hausa</a>
<a href="/he/" hreflang="he" lang="he"><span class="flag">🇮🇱</span> עברית</a>
<a href="/hi/" hreflang="hi" lang="hi"><span class="flag">🇮🇳</span> हिन्दी</a>
<a href="/id/" hreflang="id" lang="id"><span class="flag">🇮🇩</span> Indonesia</a>
<a href="/it/" hreflang="it" lang="it"><span class="flag">🇮🇹</span> Italiano</a>
<a href="/ja/" hreflang="ja" lang="ja"><span class="flag">🇯🇵</span> 日本語</a>
<a href="/ko/" hreflang="ko" lang="ko"><span class="flag">🇰🇷</span> 한국어</a>
<a href="/nl/" hreflang="nl" lang="nl"><span class="flag">🇳🇱</span> Nederlands</a>
<a href="/pl/" hreflang="pl" lang="pl"><span class="flag">🇵🇱</span> Polski</a>
<a href="/pt/" hreflang="pt" lang="pt"><span class="flag">🇵🇹</span> Português</a>
<a href="/ro/" hreflang="ro" lang="ro"><span class="flag">🇷🇴</span> Română</a>
<a href="/ru/" hreflang="ru" lang="ru"><span class="flag">🇷🇺</span> Русский</a>
<a href="/sv/" hreflang="sv" lang="sv"><span class="flag">🇸🇪</span> Svenska</a>
<a href="/th/" hreflang="th" lang="th"><span class="flag">🇹🇭</span> ไทย</a>
<a href="/tl/" hreflang="tl" lang="tl"><span class="flag">🇵🇭</span> Filipino</a>
<a href="/tr/" hreflang="tr" lang="tr"><span class="flag">🇹🇷</span> Türkçe</a>
<a href="/uk/" hreflang="uk" lang="uk"><span class="flag">🇺🇦</span> Українська</a>
<a href="/vi/" hreflang="vi" lang="vi"><span class="flag">🇻🇳</span> Tiếng Việt</a>
<a href="/yo/" hreflang="yo" lang="yo"><span class="flag">🇳🇬</span> Yorùbá</a>
<a href="/zh/" hreflang="zh" lang="zh"><span class="flag">🇨🇳</span> 简体中文</a>
<a href="/zh-tw/" hreflang="zh-tw" lang="zh-tw"><span class="flag">🇹🇼</span> 繁體中文</a>
</div>
</div>
</div>
<button class="theme-switch" type="button" aria-label="다크 모드 전환" id="themeToggle">
<svg aria-hidden="true" class="sun-svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41"/></svg>
<svg aria-hidden="true" class="moon-svg" viewBox="0 0 24 24"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
</button>
</div>
<button class="menu-toggle" type="button" aria-controls="mobileMenu" aria-expanded="false" aria-label="메뉴 전환">
<svg aria-hidden="true" viewBox="0 0 24 24"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
</button>
</div>
</nav>
<div class="mobile-menu" id="mobileMenu" role="navigation" aria-label="모바일 내비게이션">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0"><li class="nav-item"><a class="text-uppercase p-2" title="기능" aria-label="기능" href="/features/index.html">기능</a></li><li class="nav-item"><a class="text-uppercase p-2" title="게시물" aria-label="게시물" href="/posts/index.html">게시물</a></li><li class="nav-item"><a class="text-uppercase p-2" title="태그로 탐색" aria-label="태그로 탐색" href="/tags/index.html">태그로 탐색</a></li><li class="nav-item"><a class="text-uppercase p-2" title="문의하기" aria-label="문의하기" href="/contact/index.html">문의하기</a></li></ul>
<div class="mobile-lang">
<a href="/" hreflang="en" lang="en"><span class="flag">🇬🇧</span> English</a>
<a href="/fr/" hreflang="fr" lang="fr"><span class="flag">🇫🇷</span> Français</a>
<a href="/ar/" hreflang="ar" lang="ar"><span class="flag">🇸🇦</span> العربية</a>
<a href="/bn/" hreflang="bn" lang="bn"><span class="flag">🇧🇩</span> বাংলা</a>
<a href="/cs/" hreflang="cs" lang="cs"><span class="flag">🇨🇿</span> Čeština</a>
<a href="/de/" hreflang="de" lang="de"><span class="flag">🇩🇪</span> Deutsch</a>
<a href="/es/" hreflang="es" lang="es"><span class="flag">🇪🇸</span> Español</a>
<a href="/ha/" hreflang="ha" lang="ha"><span class="flag">🇳🇬</span> Hausa</a>
<a href="/he/" hreflang="he" lang="he"><span class="flag">🇮🇱</span> עברית</a>
<a href="/hi/" hreflang="hi" lang="hi"><span class="flag">🇮🇳</span> हिन्दी</a>
<a href="/id/" hreflang="id" lang="id"><span class="flag">🇮🇩</span> Indonesia</a>
<a href="/it/" hreflang="it" lang="it"><span class="flag">🇮🇹</span> Italiano</a>
<a href="/ja/" hreflang="ja" lang="ja"><span class="flag">🇯🇵</span> 日本語</a>
<a href="/ko/" hreflang="ko" lang="ko"><span class="flag">🇰🇷</span> 한국어</a>
<a href="/nl/" hreflang="nl" lang="nl"><span class="flag">🇳🇱</span> Nederlands</a>
<a href="/pl/" hreflang="pl" lang="pl"><span class="flag">🇵🇱</span> Polski</a>
<a href="/pt/" hreflang="pt" lang="pt"><span class="flag">🇵🇹</span> Português</a>
<a href="/ro/" hreflang="ro" lang="ro"><span class="flag">🇷🇴</span> Română</a>
<a href="/ru/" hreflang="ru" lang="ru"><span class="flag">🇷🇺</span> Русский</a>
<a href="/sv/" hreflang="sv" lang="sv"><span class="flag">🇸🇪</span> Svenska</a>
<a href="/th/" hreflang="th" lang="th"><span class="flag">🇹🇭</span> ไทย</a>
<a href="/tl/" hreflang="tl" lang="tl"><span class="flag">🇵🇭</span> Filipino</a>
<a href="/tr/" hreflang="tr" lang="tr"><span class="flag">🇹🇷</span> Türkçe</a>
<a href="/uk/" hreflang="uk" lang="uk"><span class="flag">🇺🇦</span> Українська</a>
<a href="/vi/" hreflang="vi" lang="vi"><span class="flag">🇻🇳</span> Tiếng Việt</a>
<a href="/yo/" hreflang="yo" lang="yo"><span class="flag">🇳🇬</span> Yorùbá</a>
<a href="/zh/" hreflang="zh" lang="zh"><span class="flag">🇨🇳</span> 简体中文</a>
<a href="/zh-tw/" hreflang="zh-tw" lang="zh-tw"><span class="flag">🇹🇼</span> 繁體中文</a>
</div>
</div>
<main id="main" class="content-wrap" aria-label="주 콘텐츠">
<div class="breadcrumb">
<a href="/ko/">홈</a><span>></span><a href="/ko/posts/index.html">블로그</a><span>></span><span>게시물</span>
</div>
<h1 class="page-title">게시물</h1>
<article class="content">
<div class="article-meta">
<span>작성자: jane.doe@kaishi.kr (Jane Doe)</span> ·
<time datetime="Wed, 01 Jan 2025 01:01:01 GMT">Wed, 01 Jan 2025 01:01:01 GMT</time>
</div>
<p>![빛나는 자연][00]</p>
<h2>스타터 템플릿</h2>
<p>모든 스타터 템플릿은 페이지든 웹사이트든 동일한 원칙과 기능을 바탕으로
처음부터 제작되었습니다. 덕분에 여러 템플릿을 쉽게 조합하여
자신만의 맞춤형 레이아웃과 콘텐츠를 만들 수 있습니다.</p>
<h3>페이지</h3>
<p>저희의 다양한 스타터 템플릿 중 하나로 SSG를 시작하여
웹사이트나 웹 애플리케이션을 구축해 보세요. 저희 템플릿은 유연하고 수정하기 쉽게 설계되었습니다.</p>
<h4>템플릿 기능</h4>
<ul>
<li><strong>반응형 디자인</strong>: 모든 템플릿은 완전한 반응형으로, 어떤 기기에서도 훌륭하게 보입니다.</li>
<li><strong>모듈식 컴포넌트</strong>: 템플릿은 모듈식 컴포넌트로 구축되어 사용자 지정이 쉽습니다.</li>
<li><strong>현대적 미학</strong>: 각 템플릿은 최신 디자인 트렌드를 염두에 두고 제작되었습니다.</li>
</ul>
<h4>시작하기</h4>
<p>시작하려면 프로젝트의 필요에 맞는 템플릿을 선택하세요. 자신의 콘텐츠, 스타일 및 기능으로 사용자 지정하세요.</p>
<ol>
<li><strong>템플릿 선택</strong>: 컬렉션을 둘러보고 시작점을 선택하세요.</li>
<li><strong>사용자 지정</strong>: 레이아웃을 수정하고, 콘텐츠를 추가하고, 스타일을 조정하세요.</li>
<li><strong>출시</strong>: 새 웹사이트나 웹 앱을 세상에 배포하세요.</li>
</ol>
<h3>웹사이트</h3>
<p>처음부터 웹사이트를 만드는 것은 어려운 작업일 수 있지만, 저희 스타터 템플릿은 이를 간단하고 쉽게 만들어 줍니다.</p>
<p>![빛나는 자연][00]</p>
<h3>저희 템플릿을 사용해야 하는 이유?</h3>
<ul>
<li><strong>속도</strong>: 미리 만들어진 디자인으로 개발을 빠르게 시작하세요.</li>
<li><strong>품질</strong>: 고품질의 철저히 테스트된 템플릿으로 신뢰성을 보장합니다.</li>
<li><strong>지원</strong>: 저희 팀이 모든 질문이나 문제에 대해 도움을 드립니다.</li>
</ul>
<h3>사용자 지정</h3>
<p>특정 요구 사항에 맞게 템플릿을 사용자 지정하세요. 가능성은 무한합니다!</p>
<h4>사용자 지정 팁</h4>
<ul>
<li><strong>구조 이해</strong>: 템플릿의 구조와 컴포넌트에 익숙해지세요.</li>
<li><strong>실험</strong>: 다양한 레이아웃과 스타일을 두려워하지 말고 시도해 보세요.</li>
<li><strong>피드백</strong>: 디자인에 대한 피드백을 구하고 이를 바탕으로 반복 개선하세요.</li>
</ul>
<h2>결론</h2>
<p>저희의 다양한 스타터 템플릿을 통해 여러분의 특정 요구 사항에 맞는 독창적인 무언가를 만들 수 있는 견고한 토대를 갖게 됩니다. 바로 뛰어들어 창작을 시작해 보세요!</p>
<p>[00]: data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 398' preserveAspectRatio='xMidYMid slice'><defs><linearGradient id='g' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='%23166534'/><stop offset='1' stop-color='%2386efac'/></linearGradient></defs><rect width='1440' height='398' fill='url(%23g)'/></svg></p>
</article>
</main>
<footer class="footer" id="footer" aria-label="푸터">
<div class="footer-inner">
<div class="footer-cols">
<div class="footer-col">
<p class="footer-heading">소개</p>
<a href="/ko/">홈</a>
<a href="/ko/contact/index.html">문의하기</a>
</div>
<div class="footer-col">
<p class="footer-heading">자료</p>
<a href="/ko/posts/index.html">블로그</a>
<a href="/ko/rss.xml">RSS 피드</a>
</div>
<div class="footer-col">
<p class="footer-heading">법적 정보</p>
<a href="/ko/privacy/index.html">개인정보</a>
</div>
</div>
<div class="footer-bottom">Copyright © 2023-2026 Kaishi. 모든 권리 보유.</div>
</div>
</footer>
<script type="application/ld+json">
{"@context":"http://schema.org/","@type":"BlogPosting","headline":"게시물","datePublished":"Wed, 01 Jan 2025 01:01:01 GMT","dateModified":"Wed, 01 Jan 2025 01:01:01 GMT","description":"멋진 웹사이트를 만드는 데 필요한 모든 것.","image":{"@type":"ImageObject","height":"2048","width":"2048","url":"https://cloudcdn.pro/kaishi/v1/logos/kaishi.svg"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://kaishi.kr","name":"Kaishi 스타터 템플릿으로 최소한의 노력으로 멋진 웹사이트 만들기"},"author":"jane.doe@kaishi.kr (Jane Doe)","copyrightHolder":{"@type":"Person","@id":"jane.doe@kaishi.kr (Jane Doe)"},"copyrightYear":"Copyright © 2023-2026 Kaishi. 모든 권리 보유.","creator":{"@type":"Person","@id":"jane.doe@kaishi.kr (Jane Doe)"},"inLanguage":"ko-KR","name":"Kaishi","publisher":{"@type":"Person","@id":"jane.doe@kaishi.kr (Jane Doe)"}}
</script>
<script>
(function(){var r=document.documentElement,sw=document.getElementById('themeToggle'),lt=document.getElementById('langToggle'),ld=document.getElementById('langDropdown'),mt=document.querySelector('.menu-toggle'),mm=document.getElementById('mobileMenu');function setTheme(v){r.setAttribute('data-theme',v);localStorage.setItem('vitepress-theme-appearance',v);if(v==='dark')sw.classList.add('dark');else sw.classList.remove('dark')}var saved=localStorage.getItem('vitepress-theme-appearance');if(saved)setTheme(saved);else if(matchMedia('(prefers-color-scheme:dark)').matches)setTheme('dark');var ns=document.querySelector('.nav-search');if(ns)ns.addEventListener('click',function(){var b=document.getElementById('ssg-search-btn');if(b){b.click()}else{var o=document.getElementById('ssg-search-overlay');if(o){o.classList.add('active');var inp=document.getElementById('ssg-search-input');if(inp){inp.value='';inp.focus()}}}});sw.addEventListener('click',function(){setTheme(r.getAttribute('data-theme')==='dark'?'light':'dark')});if(lt)lt.addEventListener('click',function(e){e.stopPropagation();ld.classList.toggle('open')});document.addEventListener('click',function(){if(ld)ld.classList.remove('open')});if(mt)mt.addEventListener('click',function(){var ex=this.getAttribute('aria-expanded')==='true';this.setAttribute('aria-expanded',!ex);mm.classList.toggle('open')});var lp=location.pathname.match(/^\/(en|fr|ar|bn|cs|de|es|ha|he|hi|id|it|ja|ko|nl|pl|pt|ro|ru|sv|th|tl|tr|uk|vi|yo|zh-tw|zh)\//);if(lp){var pfx='/'+lp[1];document.querySelectorAll('a[href^="/"]').forEach(function(a){var h=a.getAttribute('href');if(h&&h.charAt(0)==='/'&&h!=='/'&&!/^\/(en|fr|ar|bn|cs|de|es|ha|he|hi|id|it|ja|ko|nl|pl|pt|ro|ru|sv|th|tl|tr|uk|vi|yo|zh-tw|zh)\//.test(h)){a.setAttribute('href',pfx+h)}})}var _p=location.pathname,_m=_p.match(/^\/(en|fr|ar|bn|cs|de|es|ha|he|hi|id|it|ja|ko|nl|pl|pt|ro|ru|sv|th|tl|tr|uk|vi|yo|zh-tw|zh)\//),_src=_m?_m[1]:'en',_rest=_m?_p.slice(_m[0].length):_p.replace(/^\//,'');if(_src==='fr')_rest=_rest.replace(/^articles\//,'posts/').replace(/^fonctionnalites\//,'features/');document.querySelectorAll('a[hreflang]').forEach(function(a){var _t=a.getAttribute('hreflang'),_r=_rest;if(_t==='fr')_r=_r.replace(/^posts\//,'articles/').replace(/^features\//,'fonctionnalites/');a.setAttribute('href',_t==='en'?'/'+_r:'/'+_t+'/'+_r)});})();
</script>
<!-- SSG Search Widget -->
<div id="ssg-search-widget">
<style>
/* ── Trigger button (always visible) ── */
#ssg-search-btn{position:fixed;top:16px;right:16px;z-index:9998;display:flex;align-items:center;gap:8px;padding:8px 16px;background:#fff;border:1px solid #d1d5db;border-radius:8px;cursor:pointer;font-family:-apple-system,system-ui,sans-serif;font-size:14px;color:#595960;box-shadow:0 1px 3px rgba(0,0,0,.08);transition:border-color .15s,box-shadow .15s}
#ssg-search-btn:hover{border-color:#595960;box-shadow:0 2px 6px rgba(0,0,0,.12)}
#ssg-search-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#ssg-search-btn kbd{font-family:inherit;font-size:11px;padding:2px 6px;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:4px;color:#595960;margin-left:4px}
/* ── Modal overlay ── */
#ssg-search-overlay{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.5);align-items:flex-start;justify-content:center;padding-top:12vh}
#ssg-search-overlay.active{display:flex}
#ssg-search-box{background:#fff;border-radius:12px;width:92%;max-width:640px;box-shadow:0 25px 60px rgba(0,0,0,.3);overflow:hidden;font-family:-apple-system,system-ui,sans-serif}
#ssg-search-header{display:flex;align-items:center;padding:0 16px;border-bottom:1px solid #e5e7eb}
#ssg-search-header svg{width:20px;height:20px;stroke:#9ca3af;fill:none;stroke-width:2;flex-shrink:0}
#ssg-search-input{flex:1;padding:16px 12px;font-size:16px;border:none;outline:none;background:transparent}
#ssg-search-results{max-height:50vh;overflow-y:auto}
#ssg-sr-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.ssg-result{display:block;padding:12px 20px;text-decoration:none;color:#111;border-bottom:1px solid #f3f4f6;transition:background .1s}
.ssg-result:hover,.ssg-result.active{background:#ecfdf5}
.ssg-result-title{font-weight:600;font-size:15px;margin-bottom:3px}
.ssg-result-snippet{font-size:13px;color:#595960;line-height:1.5}
.ssg-result-snippet mark{background:#fef08a;color:inherit;border-radius:2px;padding:0 2px}
.ssg-no-results{padding:32px 20px;text-align:center;color:#595960;font-size:14px}
.ssg-no-results[role="status"]{}
/* Forced-colours / Windows High Contrast Mode */
@media(forced-colors:active){
#ssg-search-btn{border:1px solid ButtonText}
#ssg-search-btn:focus{outline:2px solid Highlight}
#ssg-search-input{border:1px solid CanvasText}
#ssg-search-input:focus{outline:2px solid Highlight}
.ssg-result:focus,.ssg-result.active{outline:2px solid Highlight}
.ssg-result-snippet mark{background:Highlight;color:HighlightText}
}
.ssg-search-footer{display:flex;gap:16px;padding:10px 20px;font-size:12px;color:#595960;border-top:1px solid #e5e7eb;justify-content:flex-end}
.ssg-search-footer kbd{font-family:inherit;font-size:11px;padding:1px 5px;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:3px}
/* ── Dark mode (media query + data-theme attribute) ── */
@media(prefers-color-scheme:dark){
:root:not([data-theme="light"]) #ssg-search-btn{background:#1f2937;border-color:#374151;color:#cccccf}
:root:not([data-theme="light"]) #ssg-search-btn:hover{border-color:#4b5563}
:root:not([data-theme="light"]) #ssg-search-btn kbd{background:#374151;border-color:#4b5563;color:#cccccf}
:root:not([data-theme="light"]) #ssg-search-box{background:#1f2937;color:#f9fafb}
:root:not([data-theme="light"]) #ssg-search-header{border-color:#374151}
:root:not([data-theme="light"]) #ssg-search-input{color:#f9fafb}
:root:not([data-theme="light"]) .ssg-result{color:#f9fafb;border-color:#374151}
:root:not([data-theme="light"]) .ssg-result:hover,:root:not([data-theme="light"]) .ssg-result.active{background:#374151}
:root:not([data-theme="light"]) .ssg-result-snippet{color:#cccccf}
:root:not([data-theme="light"]) .ssg-result-snippet mark{background:#854d0e;color:#fef08a}
:root:not([data-theme="light"]) .ssg-no-results{color:#cccccf}
:root:not([data-theme="light"]) .ssg-search-footer{border-color:#374151;color:#cccccf}
:root:not([data-theme="light"]) .ssg-search-footer kbd{background:#374151;border-color:#4b5563}
}
[data-theme="dark"] #ssg-search-btn{background:#1f2937;border-color:#374151;color:#cccccf}
[data-theme="dark"] #ssg-search-btn:hover{border-color:#4b5563}
[data-theme="dark"] #ssg-search-btn kbd{background:#374151;border-color:#4b5563;color:#cccccf}
[data-theme="dark"] #ssg-search-box{background:#1f2937;color:#f9fafb}
[data-theme="dark"] #ssg-search-header{border-color:#374151}
[data-theme="dark"] #ssg-search-input{color:#f9fafb}
[data-theme="dark"] .ssg-result{color:#f9fafb;border-color:#374151}
[data-theme="dark"] .ssg-result:hover,[data-theme="dark"] .ssg-result.active{background:#374151}
[data-theme="dark"] .ssg-result-snippet{color:#cccccf}
[data-theme="dark"] .ssg-result-snippet mark{background:#854d0e;color:#fef08a}
[data-theme="dark"] .ssg-no-results{color:#cccccf}
[data-theme="dark"] .ssg-search-footer{border-color:#374151;color:#cccccf}
[data-theme="dark"] .ssg-search-footer kbd{background:#374151;border-color:#4b5563}
</style>
<!-- Search trigger button -->
<button id="ssg-search-btn" type="button" aria-label="검색">
<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
<span>검색</span>
<kbd>K</kbd>
</button>
<!-- Search modal -->
<div id="ssg-search-overlay" role="dialog" aria-label="검색">
<div id="ssg-search-box">
<div id="ssg-search-header">
<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
<input id="ssg-search-input" type="search" placeholder="문서 검색..." autocomplete="off" aria-label="검색"/>
</div>
<div id="ssg-search-results" aria-live="polite"></div>
<div id="ssg-sr-status" role="status" aria-live="polite" aria-atomic="true"></div>
<div class="ssg-search-footer"><span><kbd>Esc</kbd> 닫기</span><span><kbd>↑</kbd><kbd>↓</kbd> 탐색</span><span><kbd>Enter</kbd> 열기</span></div>
</div>
</div>
<script>
(function(){
var idx=null,overlay=document.getElementById('ssg-search-overlay'),
input=document.getElementById('ssg-search-input'),
results=document.getElementById('ssg-search-results'),
btn=document.getElementById('ssg-search-btn'),active=-1,
lm=location.pathname.match(/^\/(en|fr|ar|bn|cs|de|es|ha|he|hi|id|it|ja|ko|nl|pl|pt|ro|ru|sv|th|tl|tr|uk|vi|yo|zh-tw|zh)\//),
lp=lm?'/'+lm[1]:'';
function load(){if(idx)return Promise.resolve();var sp=lm?'/'+lm[1]+'/search-index.json':'/search-index.json';return fetch(sp).then(function(r){return r.json()}).then(function(d){idx=d.entries||[]}).catch(function(){idx=[]})}
function open(){load().then(function(){overlay.classList.add('active');input.value='';results.innerHTML='';input.focus();active=-1})}
function close(){overlay.classList.remove('active');active=-1}
function highlight(text,q){if(!q)return esc(text);var re=new RegExp('('+q.replace(/[.*+?^${}()|[\]\\]/g,'\\$&')+')','gi');return esc(text).replace(re,'<mark>$1</mark>')}
function esc(s){var d=document.createElement('div');d.textContent=s;return d.innerHTML}
function snippet(content,q,len){len=len||150;if(!q)return esc(content.substring(0,len));var i=content.toLowerCase().indexOf(q.toLowerCase());if(i<0)return esc(content.substring(0,len));var s=Math.max(0,i-50),e=Math.min(content.length,i+len);var t=(s>0?'...':'')+content.substring(s,e)+(e<content.length?'...':'');return highlight(t,q)}
function search(q){if(!idx||!q){results.innerHTML='';return}q=q.trim();if(!q){results.innerHTML='';return}var ql=q.toLowerCase(),hits=[];
for(var i=0;i<idx.length&&hits.length<20;i++){var e=idx[i],s=0;if(e.title.toLowerCase().indexOf(ql)>=0)s+=10;if(e.content.toLowerCase().indexOf(ql)>=0)s+=5;for(var h=0;h<e.headings.length;h++){if(e.headings[h].toLowerCase().indexOf(ql)>=0){s+=3;break}}if(s>0)hits.push({entry:e,score:s})}
hits.sort(function(a,b){return b.score-a.score});
var sr=document.getElementById('ssg-sr-status');
if(!hits.length){results.innerHTML='<div class="ssg-no-results" role="status">«“\'+esc(q)+\'”»에 대한 결과가 없습니다</div>';if(sr)sr.textContent='No results found';return}
var html='';for(var j=0;j<hits.length;j++){var e=hits[j].entry;html+='<a class="ssg-result" href="'+esc(lp+e.url)+'">'+'<div class="ssg-result-title">'+highlight(e.title,q)+'</div>'+'<div class="ssg-result-snippet">'+snippet(e.content,q)+'</div></a>'}
results.innerHTML=html;active=-1;if(sr)sr.textContent=hits.length+' result'+(hits.length===1?'':'s')+' found'}
function nav(dir){var items=results.querySelectorAll('.ssg-result');if(!items.length)return;if(active>=0&&items[active])items[active].classList.remove('active');active+=dir;if(active<0)active=items.length-1;if(active>=items.length)active=0;items[active].classList.add('active');items[active].scrollIntoView({block:'nearest'})}
btn.addEventListener('click',function(){open()});
input.addEventListener('input',function(){search(this.value)});
overlay.addEventListener('click',function(e){if(e.target===overlay)close()});
document.addEventListener('keydown',function(e){if((e.ctrlKey||e.metaKey)&&e.key==='k'){e.preventDefault();if(overlay.classList.contains('active'))close();else open()}
if(!overlay.classList.contains('active'))return;if(e.key==='Escape')close();if(e.key==='ArrowDown'){e.preventDefault();nav(1)}if(e.key==='ArrowUp'){e.preventDefault();nav(-1)}
if(e.key==='Enter'){e.preventDefault();var items=results.querySelectorAll('.ssg-result');if(active>=0&&items[active])window.location=items[active].href;else if(items[0])window.location=items[0].href}})
})();
</script>
</div>
</body>
</html>