<!DOCTYPE html>
<html lang="ja">
<head>
<meta http-equiv="Content-Style-Type" content="text/css">
<meta charset="UTF-8">
<meta name="author" content="SoSo Nakajima">
<title>responsive template</title>
<link rel="stylesheet" href="./css/omenu.css">
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=yes">
</head>
<style>
</style>
<body class="slide slide-right slide-vbar">
<!-- slide-right の代わりに slide-left を入れると左サイドメニューになる -->
<div id="contents">
<div align="center" class="m_area">
<!-- ここからメインの内容 -->
</div> <!-- end of m_area -->
</div> <!-- end of contents -->
<div id="h-shell">
<div id="header">
<button type="button" class="slide-toggle slide-button">
<span class="sr-only">toggle navigation</span>
<span class="slide-button-icon"></span>
</button>
<div class="hd1"> <a href="#" style="text-decoration: none;">＞ Top Page</a></div><div class="hd2" style="background-image: url(./images/header.png);background-repeat: no-repeat;background-position: left top;"></div><div class="hd3" style="padding-left:5%;height:40px;">＞ Responsible Drawer Template ＜</div>
</div><!-- end of header -->
</div><!-- end of h-shell -->
<!-- <?php include("./header.html"); ?> php でサイドメニュー(以下の <nav> ～ </nav>)を別ファイルに保存する場合 -->
<nav class="slide-nav" style="margin-top: 40px;">
<!-- ここには何も入れない：スクロールしなくなる -->
<ul class="slide-menu">
<!-- 入れるならここ -->
<div style="border: solid #7b7 2px; box-shadow: -2px -2px 2px #373 inset; margin: -10px 0 -5px; padding: 5px; text-align: center; color: #050; font-weight: bold;">
★ Google サイト内検索 ★
<gcse:searchbox-only></gcse:searchbox-only>
</div>
<hr style="margin: 10px 0;">
<li><a href="#">top link</a></li>
<li class="slide-dd">
<a href="#" data-toggle="dropdown">【Ⅰ】大分類－１</a>
<ul class="slide-dd-menu">
<li><a href="#">子分類１</a></li>
<li><a href="#">子分類２</a></li>
<li><a href="#">子分類３</a></li>
<li><a href="#">子分類４</a></li>
</ul>
</li>
<li class="slide-dd">
<a href="#" data-toggle="dropdown">【Ⅱ】大分類－２</a>
<ul class="slide-dd-menu">
<li><a href="#">子分類１１</a></li>
<li><a href="#">子分類１２</a></li>
<li><a href="#">子分類１３</a></li>
<li><a href="#">子分類１４</a></li>
</ul>
</li>
<li class="slide-dd">
<a href="#" data-toggle="dropdown">【Ⅲ】大分類－３</a>
<ul class="slide-dd-menu">
<li><a href="#">子分類３１</a></li>
<li><a href="#">子分類３２</a></li>
<li><a href="#">子分類３３</a></li>
<li><a href="#">子分類３４</a></li>
</ul>
</li>
<hr>
<li class="slide-dd">
<a href="#" data-toggle="dropdown">【Ⅲ】大分類－４</a>
<ul class="slide-dd-menu">
<li><a href="#">子分類４１</a></li>
<li><a href="#">Top</a></li>
<li><a href="#">子分類４２</a></li>
<li><a href="#">子分類４３</a></li>
</ul>
</li>
<li class="slide-dd"><a href="#">子分類４５</a></li>
<li class="slide-dd"><a href="#">子分類４５</a></li>
<li class="slide-dd"><a href="#">子分類４５</a></li>
</ul>
</nav>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
(function() {
var cx = '00123456789:abcdefg';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<!-- jquery & iScroll -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/iScroll/5.1.3/iscroll.min.js"></script>
<script src="https://cdn.rawgit.com/ungki/bootstrap.dropdown/3.3.5/dropdown.min.js"></script>
<script src="./js/omenu.js"></script>
<script src="./js/main.js"></script>
</body>
</html>