<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
<script>
$(function() {
$("#header").load("header.html");
$("#side").load("side.html");
$("#footer").load("footer.html");
});
</script>
<title>松ヶ岡開墾場</title>
<link rel="stylesheet" type="text/css" href="./main.css">
<link rel="stylesheet" href="swiper-master/dist/css/swiper.css">
<style type="text/css">
<!--
-->
</style>
</head>
<body>
<div id="center">
<div id="header"></div>
<p class="setumei">- 旧庄内藩士約3000人が、刀を鍬に持ちかえ、広大な原生林の開墾を成し遂げた歴史を持つ地 -</p>
<header>
<a href="index.html"><img src="header.png" width="800" alt="松ヶ岡開墾場 -Matsugaoka Kaikonjo-"></a>
</header>
<nav>
<ul id="nav">
<li><a href="rekishi.html">歴史</a></li>
<li><a href="midokoro.html">見どころ</a></li>
<li><a href="#">pokemon go</a></li>
<li><a href="info.html">ご利用案内</a></li>
<li><a href="access.html">アクセス</a></li>
</ul>
</nav>
<div id="main">
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="sample.png" alt="sample" width="800" height="400"></div>
<div class="swiper-slide"><img src="sample.png" alt="sample" width="800" height="400"></div>
<div class="swiper-slide"><img src="sample.png" alt="sample" width="800" height="400"></div>
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
</div>
<footer>
<p>(c)copy right</p>
</footer>
</div>
<script src="swiper-master/dist/js/swiper.js"></script>
<script>
var swiper = new Swiper('.swiper-container', {
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
loop: true,
pagination: {
el: '.swiper-pagination',
type: 'bullets',
clickable: true,
},
});
</script>
</body>
</html>
大石桃菜