<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://unpkg.com/ress/dist/ress.min.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap" rel="stylesheet">
<link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet">
<title>Koeki Shokugan Site</title>
</head>
<body>
<header>
<nav>
<ul class="menu">
<li class="single">
<a href="index.html"><i class="fas fa-desktop"></i>トップページ</a>
</li>
<li class="wide">
<a href="http://roy.e.koeki-u.ac.jp/~c120187/rubyII/shokugan.html"><i class="far fa-folder-open"></i>プログラムページ</a>
</li>
<li class="wide">
<a href="http://roy.e.koeki-u.ac.jp/~c120028/kisoproweb/member.html"><i class="far fa-address-book"></i>メンバー紹介</a>
</li>
</ul>
</nav>
</header>
<h1>Koeki Shokugan Site</h1>
<section id="index" class="wrapper mg-top">
<h2 class="section-title">食玩の概要</h2>
<p class="section-text">食玩を知らない人でも以下のテーマを読めば、特徴や販売店舗など食玩について詳しくなれます。最後の練習問題でより興味が深まり、食玩を欲しくなること間違いなし！</p>
<div class="index-inner">
<h3 class="index-title">食玩クイズ(標準レベル)</h3>
<div id="quizu">
<div class="quizu-inner">
<a href="about.html" class="blue btn">「食玩」って何？</a>
<a href="buy.html" class="blue btn">どこで買えるの？</a>
<a href="cool.html" class="blue btn">ココがスゴイ！！</a>
</div>
</div>
</section>
<section id="index" class="wrapper mg-top">
<h2 class="section-title">マニアックイズ</h2>
<p class="section-text">知る人ぞ知る超難問が全部で10問！歴史やシリーズなど、食玩にまつわる問題が多数出題されます。食玩をもっと知りたい人は、ぜひチャレンジしてみてください。</p>
<div class="index-inner">
<h3 class="index-title">食玩クイズ(上級レベル)</h3>
<div id="quizu">
<div class="quizu-inner">
<a href="quiz.html" class="blue btn">クイズに挑戦する</a>
</div>
</div>
</section>
<section id="index" class="wrapper mg-top">
<h2 class="section-title">アンケート</h2>
<p class="section-text">食玩についてや今回のプログラムやWebページについてのアンケートです。是非ご協力お願いします。</p>
<div class="index-inner">
<h3 class="index-title">食玩アンケート</h3>
<div id="quizu">
<div class="quizu-inner">
<a href="quiz.html" class="blue btn">アンケートを書く</a>
</div>
</div>
</section>
<section id="index" class="wrapper mg-top">
<h2 class="section-title">店舗紹介</h2>
<p class="section-text">東北公益文科大学周辺で、食玩を取り扱っているスーパーやコンビニについて調べられます。家の近くだったり、よく行ったりする店舗の品揃えやジャンルを知りたい場合は、ぜひご活用ください。</p>
<div class="index-inner">
<h3 class="index-title">簡単な使い方</h3>
<ol class="index-list">
<li>各スポットをクリックすることで、店舗の特徴と写真が表示されます。</li>
<li>左側の「データレイヤを見る」アイコンで、店舗ごとのレイヤ分けが可能です。</li>
<li>左側の▽でアイコンを増やし、虫眼鏡アイコンの地名検索を活用できます。</li>
</ol>
<h3 class="index-title index-mg">凡例</h3>
<ol class="index-list">
<li>スーパー（カートのマーク）<br>
紫色：イオン 桃色：マックスバリュ 青色：ヤマザワ 緑色：コープ 赤色：ト一屋 黄色：ジェイ・マルエー 茶色：Aコープ</li>
<li>コンビニ（バッグのマーク）<br>
橙色：セブン-イレブン 空色：ローソン 黄緑色：ファミリーマート</li>
</ol>
</div>
</section>
<iframe width="100%" height="600px" frameborder="0" allowfullscreen src="//umap.openstreetmap.fr/ja/map/map_618011?scaleControl=false&miniMap=false&scrollWheelZoom=false&zoomControl=true&allowEdit=false&moreControl=true&searchControl=null&tilelayersControl=null&embedControl=null&datalayersControl=true&onLoadPanel=undefined&captionBar=false"></iframe>
<ul>
<li><a href="//umap.openstreetmap.fr/ja/map/map_618011">フルスクリーン表示</a></li>
</ul>
<footer id="footer">
<p>© 2020 Profile</p>
</footer>
</body>
</html>
ItoRino