@charset "utf-8";
/* CSS Document */

/*==============================*/
/* メインスライダー */
/*==============================*/
@media (min-width: 600px) {
	/* 設定 */
	.container { width: 100%; height: 100%; overflow-x: hidden; overflow-y: hidden; }
	.container .slide_all { width: 1000px; margin: 0 auto; height: 460px; position: relative; }
	.container .slide_wrap { width: 3000px; position: absolute; left: 50%; margin-left: -1501px; }
	.container .slide_body { width: 100%;}
	
	.container .slide { width: 1000px; line-height: 460px; text-align: center; position: relative; }
	
	.container .slide img{ width: 100%!important; height: auto; }

	/* ページャーの位置 */
	.container .bx-wrapper .bx-pager{ position: absolute; top: 400px;}
	
	/* 枠のスタイルを削除 */
	.container .bx-wrapper .bx-viewport { box-shadow: none; border: none; }
	
	/* 前後 */
	.slide:after{ position: absolute; top: 0; left: 0; content:""; width: 100%; height:500px; background: #fff; opacity: .6; }
	.slide.active:after{ content: none; }
	
	.bx-wrapper .bx-pager.bx-default-pager a{
		width: 100px;
		height: 5px;
	}
	.bx-wrapper .bx-pager.bx-default-pager a:hover,
	.bx-wrapper .bx-pager.bx-default-pager a.active {
		background: #fff;
	}

	/* 矢印 */
	.container .bx-prev { position: absolute; left: 50%; margin-left: -530px; background: none; }
	.container .bx-prev:after{
		position: absolute; top: 0px; right: 0px;
		content: "";
		width: 25px;
		height: 25px;
		border-top: 4px solid #fff;
		border-right: 4px solid #fff;
		-webkit-transform: rotate(-135deg);
		transform: rotate(-135deg);
	}
	.container .bx-next { position: absolute; right: 50%; margin-right: -520px; background: none; }
	.container .bx-next:after{
		position: absolute; top: 0px; right: 0px;
		content: "";
		width: 25px;
		height: 25px;
		border-top: 4px solid #fff;
		border-right: 4px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@media (max-width: 600px) {
	
	/* 矢印 */
	.container .bx-prev { position: absolute; left: 50%; margin-left: -530px; background: none; }
	.container .bx-prev:after{
		position: absolute; top: 0px; right: 0px;
		content: "";
		width: 25px;
		height: 25px;
		border-top: 4px solid #fff;
		border-right: 4px solid #fff;
		-webkit-transform: rotate(-135deg);
		transform: rotate(-135deg);
	}
	.container .bx-next { position: absolute; right: 50%; margin-right: -520px; background: none; }
	.container .bx-next:after{
		position: absolute; top: 0px; right: 0px;
		content: "";
		width: 25px;
		height: 25px;
		border-top: 4px solid #fff;
		border-right: 4px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.bx-wrapper { margin: 0; }
	.container { width: 100%; height: 20%; overflow-x: hidden; overflow-y: hidden; }
	.container .bx-wrapper .bx-viewport { box-shadow: none; border: none; }
	
	/* ページャーの位置 */
	.container .bx-wrapper .bx-pager{ position: absolute; bottom: 10%;}
}


/*==============================*/
/* トップパネル */
/*==============================*/
div.top_panel{
	background-image: url(/common/img/share/bg_blue.jpg);
	background-size: 200px 200px;
	background-repeat: repeat;
}

@media (min-width: 600px) {
	div.top_panel{
		padding: 50px 0;
		margin-bottom: 50px;
	}
	div.top_panel ul{
		width: 730px;
		margin: 0 auto;
		overflow: hidden;
	}
	div.top_panel ul li{
		background: #fff;
	}
	div.top_panel ul li:not(:last-child){
		float: left;
		margin-right: 20px;
	}
}

@media (max-width: 600px) {
	div.top_panel{
		padding: 20px 0;
		margin-bottom: 50px;
	}
	div.top_panel ul{
		width: 80%;
		margin: 0 auto;
	}
	div.top_panel ul li {
		margin-bottom: 10px;
	}
	div.top_panel ul li img{
		width: 100%;
	}
}

/*==============================*/
/* コメント */
/*==============================*/
.coment p{
	font-size: 18px;
	font-family: "Sawarabi Gothic";
	line-height: 1.2em;
	font-weight: 300;
	color: #666666;
}
@media (max-width: 600px) {
	.coment p{
		font-size: 16px;
	}
}