@charset "utf-8";

/*
==============
   共通設定
==============
*/
/*
--------------
   clearfix
--------------
*/
.clearfix:after
	{
		content: ".";	/* 新しい要素を作る */
		display: block;	/* ブロックレベル要素に */
		clear: both;
		height: 0;
		visibility: hidden;
	}

/*
------------
   ボディ
------------
*/
body
	{
		margin: 0;
		background-color: #fff;
		font: 14px/1.231 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
		color: #000;
	}

/*
--------------
   メニュー
--------------
*/
#modal
	{
		display: none;
	}

#modal h2
	{
		font-size: 18px;
		border-bottom: 1px solid #fff;
	}

#modal h2,
#modal ul li a
	{
		padding: 10px 5px;
	}

#modal ul
	{
		margin-bottom: 20px;
	}

#modal ul li a
	{
		border-bottom: 1px dashed #fff;
		display: block;
		color: #fff;
	}

.close a
	{
		font-size: 1.5em;
		color: #fff;
		float: right;
		margin-bottom: 10px;
		border-top: solid 1px #eee;
		border-bottom: solid 1px #eee;
		padding: 5px 10px;
		border: 1px solid #e0e0e0;
	}

.close a:hover
	{
		color: #fff;
		text-decoration: none;
	}

.open
	{
		display: block;
		padding: 8px;
		float: right;
		margin-top: 5px;
	}

#pageslide
	{
		display: none;
		position: absolute;
		position: fixed;
		top: 0;
		height: 100%;
		z-index: 999999;
		width: 260px;
		padding: 20px 10px;
		background-color: #000;
		color: #fff;
		border-left: 1px solid #e0e0e0;
	}

/*
--------------------------
   その他デフォルト設定
--------------------------
*/
li
	{
		list-style-type: none;
	}

h5
	{
		margin-bottom: 10px;
		margin-left: 10px;
	}

p
	{
		margin: 5px 0;
	}

a
	{
		color: rgb(165,0,0);
		text-decoration: none;
	}

a:hover
	{
		color: rgb(165,165,165);
		text-decoration: underline;
	}

img
	{
		border: 0;
	}

img.top
	{
		width: 100%;
		margin-top: 8px;
	}

/*
================================
   スマートフォン向けスタイル
================================
*/
/*
----------------
   レイアウト
----------------
*/

#container
	{
		width: auto;
		margin: auto;
		padding: 50px 0 0;
	}

#content
	{
		margin: 0px;
	}

#content_inner
	{
		margin: 5px 10px;
	}

/*
--------------
   ヘッダー
--------------
*/
.header
	{
		display: block;
		overflow: hidden;
		position: fixed;
		top: 0;
		width: 100%;
		background-color: #fff;
		border-top: 4px solid rgb(165,0,0);
		border-bottom: 3px solid rgb(165,165,165);
	}

.header h1
	{
		float: left;
	}

.header h2 a
	{
		float: right;
		margin-right: 10px;
		display: block;
	}

.header p
	{
		margin: 0;
		padding: 0;
	}

.header img
	{
		vertical-align: middle;
	}

/*
----------------------
   メインコンテンツ
----------------------
*/
.main
	{
		width: auto;
		padding: 0 5px;
		margin: 0;
	}

.main h3
	{
		padding: 20px 0;
		text-align: center;
		font-size: 1.5em;
		color: rgb(165,0,0);
	}

.main p
	{
		padding: 5px 0;
		font-size: 1.2em;
	}

.main p.red
	{
		padding: 10px 20px;
		color: rgb(165,0,0);
	}

.main p.tag
	{
		text-align: center;
	}

.main a
	{
		padding: 10px 5px;
		font-size: 1.0em;
	}

.main a.tag
	{
		text-decoration: underline;
	}

/*
--------------
   フッター
--------------
*/
#foot
	{
		margin-top: 20px;
		clear: both;
		background-color: rgb(165,0,0);
		color: #fff;
	}

#footer
	{
		width: auto;
		padding-top: 10px;
		padding-bottom: 10px;
	}

#footer p
	{
		margin: 0;
		text-align: center;
	}

#footer ul
	{
		margin: 0;
		padding: 10px 20px;
	}

#footer li
	{
		list-style-type: none;
		border-bottom: dotted 1px #fff;
		margin-bottom: 10px;
		padding-bottom: 10px;
	}

#footer li a
	{
		font-size: 1.0em;
		color: #fff;
		text-decoration: none;
	}

#footer li a:hover
	{
		text-decoration: underline;
	}

/*
============================
   タブレット向けスタイル
============================
*/
@media only screen and (min-width: 481px) {
/*
----------------
   レイアウト
----------------
*/

#container
	{
		width: auto;
		margin: auto;
		padding: 50px 0 0;
	}

#content
	{
		margin: 0px;
	}

#content_inner
	{
		margin: 20px 30px;
	}

.link_button
	{
		font-size: 1.2em;
	}

/*
--------------
   ヘッダー
--------------
*/
.header
	{
		display: block;
		overflow: hidden;
		position: fixed;
		top: 0;
		width: 100%;
		background-color: #fff;
		border-top: 4px solid rgb(165,0,0);
		border-bottom: 3px solid rgb(165,165,165);
	}

.header h1
	{
		float: left;
	}

.header h2 a
	{
		float: right;
		margin-right: 10px;
		display: block;
	}

.header p
	{
		margin: 0;
		padding: 0;
	}

.header img
	{
		vertical-align: middle;
	}

/*
----------------------
   メインコンテンツ
----------------------
*/
.main
	{
		width: auto;
		padding: 0 30px;
		margin: 0;
	}

.main h3
	{
		padding: 30px 0;
		text-align: center;
		font-size: 2.0em;
		color: rgb(165,0,0);
	}

.main p
	{
		padding: 8px 0;
		font-size: 1.2em;
	}

.main p.red
	{
		padding: 10px 20px;
		color: rgb(165,0,0);
	}

.main p.tag
	{
		text-align: center;
	}

.main a
	{
		padding: 20px 10px;
		font-size: 1.2em;
	}

/*
--------------
   フッター
--------------
*/
#foot
	{
		margin-top: 20px;
		clear: both;
		background-color: rgb(165,0,0);
		color: #fff;
	}

#footer
	{
		width: auto;
		padding-top: 10px;
		padding-bottom: 10px;
	}

#footer p
	{
		margin: 0;
		text-align: center;
	}

#footer ul
	{
		margin: 0;
		padding: 10px 20px;
	}

#footer li
	{
		list-style-type: none;
		border-bottom: dotted 1px #fff;
		margin-bottom: 10px;
		padding-bottom: 10px;
	}

#footer li a
	{
		font-size: 1.0em;
		color: #fff;
		text-decoration: none;
	}

#footer li a:hover
	{
		text-decoration: underline;
	}

}

/*
======================
   ＰＣ向けスタイル
======================
*/
@media only screen and (min-width: 769px) {
/*
----------------
   レイアウト
----------------
*/

#container
	{
		width: auto;
		margin: auto;
		padding: 50px 0 0;
	}

#content
	{
		margin: 0px;
	}

#content_inner
	{
		margin: 20px 50px;
	}

.link_button
	{
		font-size: 1.4em;
	}

/*
--------------
   ヘッダー
--------------
*/
.header
	{
		display: block;
		overflow: hidden;
		position: fixed;
		top: 0;
		width: 100%;
		background-color: #fff;
		border-top: 4px solid rgb(165,0,0);
		border-bottom: 3px solid rgb(165,165,165);
	}

.header h1
	{
		float: left;
	}

.header h2 a
	{
		float: right;
		margin-right: 10px;
		display: block;
	}

.header p
	{
		margin: 0;
		padding: 0;
	}

.header img
	{
		vertical-align: middle;
	}

/*
----------------------
   メインコンテンツ
----------------------
*/
.main
	{
		width: auto;
		padding: 0 80px;
		margin: 0;
	}

.main h3
	{
		padding: 30px 0;
		text-align: center;
		font-size: 2.5em;
		color: rgb(165,0,0);
	}

.main p
	{
		padding: 8px 0;
		font-size: 1.5em;
	}

.main p.red
	{
		padding: 10px 20px;
		color: rgb(165,0,0);
	}

.main p.tag
	{
		text-align: center;
	}

.main a
	{
		padding: 20px 10px;
		font-size: 1.2em;
	}

.main a.tag
	{
		text-decoration: none;
	}

/*
--------------
   フッター
--------------
*/

#foot
	{
		margin-top: 20px;
		clear: both;
		background-color: rgb(165,0,0);
		color: #fff;
	}

#footer
	{
		width: auto;
		padding-top: 10px;
		padding-bottom: 10px;
		text-align: center;
	}

#footer p
	{
		margin: 0;
	}

#footer ul
	{
		margin: 0;
		padding: 20px 50px;
	}

#footer li
	{
		display: inline;
		list-style-type: none;
		border-left: solid 1px #fff;
		margin-left: 20px;
		padding-left: 20px;
		border-bottom: none;
		margin-bottom: 0;
		padding-bottom: 0;
	}

#footer li.first
	{
		border-left: none;
		margin-left: 0;
		padding-left: 0;
	}

#footer li a
	{
		font-size: 1.0em;
		color: #fff;
		text-decoration: none;
	}

#footer li a:hover
	{
		text-decoration: underline;
	}

}