@charset 'UTF-8';
/* body */
body#index {
	background:white url('../images2/bg_body_index.gif') repeat-x;
}
/* div */
div#wrapperIndex {
	width:940px;
	margin:0 0 10px 0;
}
div.animeBox {
	width:940px;
	height:250px;
	margin:0 0 25px 0;
}
div.contentsIndexBox {
	overflow:hidden;
	width:940px;
	margin:0 0 20px 0;
}
div.contentsIndexBoxLeft {
	float:left;
	width:460px;
}
div.contentsIndexBoxRight {
	float:right;
	width:460px;
}
div.newsBox {
	width:460px;
}
div.newsBox .newsBox-inner {
	margin-bottom: 20px;
}
div.bannerBox {
	width:460px;
	margin:0 0 20px 0;
}
div.pickupBox {
	width:460px;
}
div.seoBox {
	width:940px;
	background:#E6E6FA;
}
/* h2 */
div.newsBox h2 {
	width:460px;
	margin:0 0 15px 0;
}
/* p */
div.contentsIndexBox p {
	margin-bottom:10px;
}
/* table */
div.newsBox table {
	width:460px;
	font-size:13px;
	line-height:140%;
}
div.newsBox table th {
	width:1%;
	padding:0 5px 7px 0;
	color:#333333;
	vertical-align:top;
	white-space:nowrap;
}
div.newsBox table td {
	width:auto;
	padding:0 0 5px 5px;
	vertical-align:top;
}
/* ul */
ul#slider {
	position:relative;
	width:940px;
	height:250px;
}
ul#slider li {
	position:absolute;
	top:0;
	left:0;
	width:940px;
	height:250px;
}
div.pickupBox ul {
	overflow:hidden;
	width:460px;
}
div.pickupBox ul li {
	float:left;
	width:225px;
	margin:0 10px 0 0;
	padding:0 0 10px 0;
}
div.pickupBox ul li.last {
	margin:0;
}
div.seoBox ul {
	padding:5px 10px;
	text-align:center;
}
div.seoBox ul li {
	display:inline;
	margin:0 10px;
	font-size:11px;
}
div.infoBox {
	margin:0 0 15px;
	padding:10px;
	line-height:160%;
	background-color:#FFF0F0;
}
/* span */
div.newsBox table td span {
	padding:0 2px;
	background:#FF3333;
	color:white;
	font-size:10px;
	font-weight:bold;
}

.anniversaryBox {
	width: 940px;
	margin: 0 0 30px 0;
}
.anniversaryBox p {
	text-align: center;
}
.anniversaryBox img {
	display: inline-block;
}





/* ========================================================================

	▼▼▼▼▼▼▼▼▼▼▼▼ SP用RWDレイアウト 追加スタイル　ここから ▼▼▼▼▼▼▼▼▼▼▼▼

======================================================================== */

/* =======================================

	MEMO: 2015.12.24
	下層ページにも適用する場合は、これより下の "01. 共通部分に関するスタイル" を共通CSSに移します。
	尚、その際にHTML側の調整も併せて必要です。

======================================= */

/* SPメニューボタンはPCでは非表示にする */
#btn-spMenu {
	display: none;
}


/* ==========================================
	01. 共通部分に関するスタイル
	※但し、下層ページへ反映した際の影響については2012/12/24時点では未検証
========================================== */

@media only screen and ( max-width : 640px ) {

	/* ボックスサイズの計算方法を変更 */
	* {
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}

	img {
		max-width: 100%;
		height: auto;
	}
	
	body {
		text-align: left;
	}

	/* メニューボタン */
	#btn-spMenu {
		display: block;
		padding: 15px;
			padding-left: 40px;
		background: #282353;
		color: #fff;
		text-align: center;
		text-decoration: none;
		position: absolute;
		right: 10px;
		top: 20px;
	}
		#btn-spMenu span,
		#btn-spMenu span::after,
		#btn-spMenu span::before {
			position: absolute;
			width: 16px;
			height: 2px;
			background-color: #ffffff;
		}
		#btn-spMenu span {
			left: 25%;
			top: 50%;
			bottom: auto;
			right: auto;
			-webkit-transform: translateX(-50%) translateY(-50%);
			-moz-transform: translateX(-50%) translateY(-50%);
			-ms-transform: translateX(-50%) translateY(-50%);
			-o-transform: translateX(-50%) translateY(-50%);
			transform: translateX(-50%) translateY(-50%);
			-webkit-transition: background-color 0.2s;
			-moz-transition: background-color 0.2s;
			transition: background-color 0.2s;
		}
		#btn-spMenu span::after,
		#btn-spMenu span::before {
			content: '';
			top: 0;
			left: 0;
			-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
			-webkit-transition: -webkit-transform 0.2s;
			-moz-transition: -moz-transform 0.2s;
			transition: transform 0.2s;
		}
		#btn-spMenu span::before {
			-webkit-transform: translateY(-6px);
			-moz-transform: translateY(-6px);
			-ms-transform: translateY(-6px);
			-o-transform: translateY(-6px);
			transform: translateY(-6px);
		}
		#btn-spMenu span::after {
			-webkit-transform: translateY(6px);
			-moz-transform: translateY(6px);
			-ms-transform: translateY(6px);
			-o-transform: translateY(6px);
			transform: translateY(6px);
		}
		.is_nav_open #btn-spMenu span {
			background-color: transparent;
		}
		.is_nav_open #btn-spMenu span::before {
			-webkit-transform: rotate(-45deg);
			-moz-transform: rotate(-45deg);
			-ms-transform: rotate(-45deg);
			-o-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		.is_nav_open #btn-spMenu span::after {
			-webkit-transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			-o-transform: rotate(45deg);
			transform: rotate(45deg);
		}
	div#headerBox,
	div#globalNavi {
		height: auto;
			max-height: 0;
			overflow: hidden;
			-webkit-transition: max-height .8s;
			   -moz-transition: max-height .8s;
			    -ms-transition: max-height .8s;
			     -o-transition: max-height .8s;
			        transition: max-height .8s;
	}
	.is_nav_open div#headerBox,
	.is_nav_open div#globalNavi {
		max-height: 600px;
	}

	div#container {
		width: 100%;
		margin: 25px auto 0;
		text-align:left;
	}
	div#header {
		width: 100%;
	}
		div#header h1 {
			float: none;
			width: 100%;
			max-width: 100%;
			height: auto;
			margin-bottom: 10px;
			padding-right: 120px;
			padding-left: 5%;
		}
			div#header h1 a {
				display: inline-block;
				max-width: 100%;
			}
			div#header h1 img {
				max-width: 240px;
				width: 100%;
			}
		div#headerBox {
			float: none;
			width: 100%;
			padding: 10px 5% 0;
		}
			/* ナビ上部 */
			div#localBox {
				width: 100%;
				height: auto;
				padding-top: 10px;
				border-top: 1px solid #ccc;
			}
				div#localBox ul {
					width: 100%;
					height: auto;
					margin-bottom: 20px;
				}
					div#localBox ul li {
						height: auto;
						text-align: center;
					}
					div#localBox ul li#email {
						width: 50%;
						margin: 0;
					}
					div#localBox ul li#access {
						width: 50%;
						margin: 0;
					}
					div#localBox ul li#privacy {
						width: 50%;
						margin: 0;
					}
					div#localBox ul li#sitemap {
							width: 50%;
							margin: 0;
					}
						div#localBox ul li a {
							display: block;
							padding: 5px;
						}
						div#localBox ul li img {
							display: inline-block;
						}
			/* お問い合わせナビ */
			div#contactBox {
				width: 100%;
				height: auto;
			}
				div#contactBox ul {
					width: 100%;
					height: auto;
				}
					div#contactBox ul li {
						height: auto;
						margin-bottom: 10px;
						text-align: center;
					}
					div#contactBox ul li#dial {
						float: none;
						width: 100%;
					}
					div#contactBox ul li#contact {
						float: none;
						width: 100%;
					}
						div#contactBox ul li img {
							display: inline-block;
						}
	/* グローバルナビ */
	div#globalNavi {
		width: 100%;
		margin-top: -10px;
	}
		div#globalNavi ul {
			width: 100%;
			height: auto;
			padding: 20px 0;
			background: #282353;
		}
		div#globalNavi ul:after {
			content: "";
			display: block;
			clear: both;
		}
			div#globalNavi ul li {
				height: auto;
				width: 50%;
				margin: 0;
				padding: 1px;
				text-align: center;
			}
				div#globalNavi ul li a {
					display: block;
					line-height: 46px;
					padding: 2px;
					color: #fff;
					background: #383363;
					font-size: 14px;
					text-decoration: none;
				}
				div#globalNavi ul li img {
					display: none; /* 画像は非表示にする */
					max-width: 100%;
				}
			div#globalNavi ul li:nth-child(odd):last-child {
				width: 100%; /* ナビの奇数番目かつ最後のアイテムは横幅いっぱいにする */
			}

	/* フッター */
	div#footer {
		width: 100%;
		padding-right: 5%;
		padding-left: 5%;
	}
		/* フッターの住所 */
		div#footer address {
			float: none;
			width: 100%;
		}

	/* コピーライト（著作権表示） */
	div#copyright {
		text-align:center;
		padding-right: 5%;
		padding-left: 5%;
	}
		div#copyright address {
			width: 100%;
			text-align: center;
		}

	/* ページの先頭に戻る ボタン = .btn-pageTopを付与 */
	div#footer .btn-pageTop {
		clear: both;
		float: none;
		width: 100%;
		padding-top: 20px;
		text-align: center;
	}
		div#footer .btn-pageTop a {
			display: block;
			padding: 10px 10px 10px 20px !important;
			border: 1px solid;
			background-position: 10px center!important;
			text-align: center;
		}

}




/* ==========================================
	02. トップページのみに関するスタイル
========================================== */

@media only screen and ( max-width : 640px ) {
		
		body#index {
			background: none;
		}
		div#wrapperIndex {
			width: 100%;
		}
		div.animeBox {
			width: 100%;
			height: auto;
		}
		div.contentsIndexBox {
			width: 100%;
			padding-right: 5%;
			padding-left: 5%;
		}
			div.contentsIndexBoxLeft {
				float: none;
				width: 100%;
			}
			div.contentsIndexBoxRight {
				float: none;
				width: 100%;
			}

		/* 更新履歴 */
		div.newsBox {
			width: 100%;
			margin-bottom: 20px;
		}
			div.newsBox .newsBox-inner {
				height: 200px;
				-ms-overflow-y: scroll;
				    overflow-y: scroll;
				-webkit-overflow-scrolling: touch;
			}
			div.newsBox h2 {
				width: 100%;
			}
			div.newsBox table {
				width: 100%;
			}

		/* ピックアップリンク */
		div.pickupBox {
			width: 100%;
		}
			div.pickupBox ul {
				width: 100%;
			}
			div.pickupBox ul li {
				width: 50%;
				margin: 0;
				padding: 5px;
			}

		/* SEOリンク */
		div.seoBox {
			width: 100%;
		}
			div.seoBox ul {
				padding: 10px 5%;
			}
				div.seoBox ul li {
					display: inline-block;
				}
					div.seoBox ul li a {
						display: block;
						padding: 5px;
					}

		/* トップスライドバナー */
		ul#slider {
			width: 100%;
			height: auto;
		}
			ul#slider li {
				position: absolute;
				width: 100%;
				height: auto;
			}
		.anniversaryBox {
			width: 100%;
		}
		.anniversaryBox p {
			padding: 0 30px;
		}
		.anniversaryBox img {
			width: 100%;
			height: auto;
		}
}

/* ========================================================================

	▲▲▲▲▲▲▲▲▲▲▲▲▲ SP用RWDレイアウト 追加スタイル　ここまで ▲▲▲▲▲▲▲▲▲▲▲▲▲

======================================================================== */