<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>一覧・詳細特化型 無料CMS fudosan_re_lp3</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="ここにサイト説明を入れます">
<base href="{{BASE_PATH}}/templates/">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vegas/2.5.4/vegas.min.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/cms.css">
</head>

<body class="list">

<div id="container">

<header>

<h1 id="logo"><a href="{{BASE_PATH}}"><img src="images/logo.png" alt="あなたのサイト名"></a></h1>

<!--開閉メニュー-->
<div id="menubar">

<nav>
<ul>
<li><a href="{{BASE_PATH}}">ホーム</a></li>
{{CATEGORIES}}
<li><a href="{{BASE_PATH}}/page/?p=faq">よく頂く質問</a></li>
<li><a href="{{BASE_PATH}}/page/?p=company">会社概要</a></li>
</ul>
</nav>

</div>
<!--/#menubar（開閉メニュー）-->

<div id="header-box-tpcms">
<ul>
{{CATEGORIES}}
</ul>
</div>

</header>

<div id="contents">

<main>

<div class="notice">※デモサイトです。</div>

<section class="bg-tpcms">
<h2>このページは</h2>
<p>templates/list.htmlが骨組みファイルです。<br>
それぞれの担当htmlは、html内のコメント（html側）側に記載されています。</p>
</section>

<section>

<!-- 管理ページのカテゴリ名をそのまま出力。 -->
<h2>{{CATEGORY_NAME}}</h2>

<!-- サイト内検索ブロック。「SEARCH_FORM」内は、_search.form.htmlで設定。 -->
{{SEARCH_FORM}}

<!-- データ出力。「LIST」内は、_list.item.htmlで設定。 -->
<div class="list-tpcms-grid">
{{LIST}}
</div>

<!-- ページャー。「PAGER」専用のhtmlはありません。 -->  
{{PAGER}}

</section>

</main>

</div>
<!--/#contents-->

<!--ウェーブアニメーション-->
<svg style="display:none">
<defs>
<path id="wavePath" d="M0 30 V15 Q30 3 60 15 T120 15 V30z" />
</defs>
</svg>

<div class="wave-section">
<div class="wave wave-top">
<svg viewBox="0 0 120 28" preserveAspectRatio="none">
<g class="wave-wrap">
<use href="#wavePath" x="0"   y="0" />
<use href="#wavePath" x="120" y="0" />
</g>
</svg>
</div>
</div>

<footer id="footer">

<div class="footer1">

<p><img src="images/logo-footer.png" alt="SAMPLE COMPANY"></p>

<p>〒000-0000 東京足立区XXXXXX1丁目1号<br>
代表電話：000-0000-0000<br>
受付時間：月曜日から金曜日の8時から18時まで</p>

<ul class="sns">
<li><a href="#"><i class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-line"></i></a></li>
<li><a href="#"><i class="fab fa-youtube"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
</ul>

<h3>診療時間</h3>

<table class="week">
<tr>
<th>受付時間</th>
<th>月</th>
<th>火</th>
<th>水</th>
<th>木</th>
<th>金</th>
<th>土</th>
<th>日</th>
</tr>
<tr>
<td>9:00 - 12:00</td>
<td>○</td>
<td>○</td>
<td>○</td>
<td>○</td>
<td>○</td>
<td>○</td>
<td>×</td>
</tr>
<tr>
<td>14:00 - 18:00</td>
<td>○</td>
<td>○</td>
<td>○</td>
<td>△</td>
<td>○</td>
<td>×</td>
<td>×</td>
</tr>
</table>
<p class="r">△は予約専門です。×は休診日です。</p>

</div>
<!--/.footer1-->

<div class="footer2">

<h3>アクセス</h3>
<p><a href="https://template-party.com/file/pickup_googlemap.html">GoogleMapの地図を変更する方法はマニュアルをご覧下さい。</a></p>
<div class="iframe">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3241.0448418561778!2d139.74267721573196!3d35.675897837870934!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188b89b2e1c8b1%3A0x59a123e3d5ac5ab6!2z44CSMTAwLTAwMTQg5p2x5Lqs6YO95Y2D5Luj55Sw5Yy65rC455Sw55S677yR5LiB55uu77yX4oiS77yR!5e0!3m2!1sja!2sjp!4v1545036128899" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>

<small>Copyright© あなたのサイト名 All Rights Reserved.</small>

</div>
<!--/.footer2-->

</footer>

</div>
<!--/#container-->

<!--テンプレートの著作表記。勝手に削除すると重大な規約違反になります。-->
<span class="pr"><a href="https://template-party-cms.com/" target="_blank">Template Party CMS</a></span>

<!--ページの上部へ戻るボタン-->
<div class="pagetop"><a href="#"><i class="fas fa-angle-double-up"></i></a></div>

<!--開閉ボタン（ハンバーガーアイコン）-->
<div id="menubar_hdr">
<span></span><span></span><span></span>
</div>

<!--jQueryの読み込み-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<!--パララックス（inview）-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/protonet-jquery.inview/1.1.2/jquery.inview.min.js"></script>
<script src="js/jquery.inview_set.js"></script>

<!--このテンプレート専用のスクリプト-->
<script src="js/main.js"></script>
<script src="js/cms.js"></script>

</body>
</html>
