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

body{
	background-color:#fff;
	font-family:Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;}
		

/*ヘッダー------------------------------------------*/
header{
	box-sizing:border-box;
	width:100%;
	height:auto;
	background-color:#9bacff;}
	
#page_header{
	box-sizing:border-box;
	width:960px;               /*レシポンシブル対応あり*/
	height:auto;
	margin:0 auto;
	padding-bottom:6px;}      /*ロゴの下側間隔*/

#header_title{
	box-sizing:border-box;
	width:auto;
	height:auto;
	line-height:auto;
	float:left;
	padding-left:10px;
	margin:0 auto;}
	
#header_title h1{
	font-size:14px;
	margin:0 auto;}
	
#header_map{
	box-sizing:border-box;
	height:auto;
	line-height:auto;
	float:right;
	padding-right:10px;
	font-family: 'Architects Daughter', cursive;}
	
#header_map p a{
	text-decoration:none;
	font-size:14px;}
	
#header_map p a:hover{
	color:#fe8eb2;}	

#logo img{
	box-sizing:border-box;
	display:block;
	clear:both;
	height:53px;
	width:auto;
	margin:0 auto;
	}

/*ヘッダー２（ナビゲーション）------------------------------------------*/
#header2{
	box-sizing:border-box;
	background-color:#62cc80;
	width:100%;
	height:44px;
	border-bottom:2px #aaa solid;
	}

#header2 nav{
	box-sizing:border-box;
	width:960px;               /*レシポンシブル対応あり*/
	height:auto;
	clear:both;
	margin:0 auto;
	font-family: 'Architects Daughter', cursive;
	font-size:18px;}

#header2 nav ul li{
	box-sizing:border-box;
	width:12.5%;               /*レシポンシブル対応あり*/
	height:44px;
	float:left;
	line-height:44px;
	text-align:center;
	margin-top:0px;
	margin-bottom:0px;
	background-color:#62cc80;
	border-left:1px #aaa solid;
	border-right:1px #aaa solid;
	border-bottom:2px #aaa solid;
	transition-timing-function:ease;
	transition-property:all;
	transition-duration:1s;
	/*text-indent:-1em;*/}

#header2 nav ul li:hover{
	background-color:#62ee80;
	/*opacity:0.5;
	border-radius:8px 8px;*/
	border-reft:2px #fff solid;
	transition-timing-function:ease;
	transition-property:all;
	transition-duration:1s;}
	
#header2 nav ul li a{	
	text-decoration:none;
	font-size:16px;
	color:#fff;}

/*コンテナー------------------------------------------*/

#container{
	/*border-sizing:border-box;*/
	width:100%;
	/*height:auto;*/
	/*clear:both;*/
	margin:0 auto;}

article{
	border-sizing:border-box;
	/*height:500px;*/
	/*clear:both;*/
	margin:0 auto;
	background-color:#ff0;}
	
	
/*スライダー------------------------------------------*/	
#mainvisual{
	/*widthレシポンシブル対応あり*/
	clear:both;
	margin:0 auto;}	
	
/*アーティクル------------------------------------------*/

div.s1_1,div.s2_1,div.s2_2,div.s3_1,div.s3_2,div.s3_3{
	border-sizing:border-box;}

div.s2_1,div.s2_2{margin-top:8px;}

article div a{
	box-sizing:border-box;
	display:block;
	border:0px #ccc solid;
	border-radius:5px 5px;
	text-decoration:none;
	transition-timing-function:ease;
	transition-property:all;
	transition-duration:1.5s;}

article div a:hover{
	background-color:#81e0e8;}

#topic a{
	border-radius:5px 5px;
	background-color:#ffffbb;}

#topic a:hover{
	background-color:#81e0e8;}

section{
	clear:both;
	overflow:hidden;
	padding:5px 30px;}

section.img_30 img,section.img_40 img,section.img_50 img,section.img_100 img{
	float:left;
	height:auto;
	margin-right:10px;
	border-radius:5px 5px;}
	
section.img_30 img{width:30%;}
section.img_40 img{width:40%;}
section.img_49 img{width:49%;}
section.img_50 img{width:50%;}
section.img_100 img{width:100%;}
	
section div h2{
	font-size:18px;
	font-weight:bold;
	padding-bottom:5px;
	color:#33c;}

section div h3{
	height:28px;
	line-height:28px;
	font-size:18px;
	font-weight:bold;
	padding-bottom:5px;
	background-color:#ff8eb2;
	border-radius:5px 5px;
	color:#fff;}
	
section div p{
	font-size:16px;
	color:#666;
	line-height:1.5em;
	padding-bottom:5px;}

section.category{
	margin-top:10px;
	/*border-top:1px #ccc solid;*/}

section.category div{
	margin-left:35px;
	margin-bottom:0px;}

section.category img{
	float:left;
	height:22px;
	width:auto;}
	
table.list th{
	text-align:center;
	font-size:14px;
	margin:5px 0;}
	
table thead{
	background-color:#62cc80;}
	
.text-center{text-align:center;}
	
/*リンクス------------------------------------------*/
div#links{
	box-sizing:border-box;
	float:left;
	width:980px;
	height:auto;
	text-align:center;
	padding:10px;
	margin:10px auto;
	border:1px #ccc solid;
	border-radius:8px 8px;}

div#links a{
	float:left;
	color:#333;
	text-decoration:none;
	font-size:16px;}

/*div#links a:hover{
	color:#fe8eb2;}*/

/*フッター------------------------------------------*/
div.footer_top{
	clear:both;
	width:100%;
	height:40px;
	line-height:40px;
	background-color:#ff8eb2;
	text-align:center;
	font-size:18px;}

div.footer_top a{
	text-decoration:none;}

div.footer_top a:hover{color:#fff;}

footer{
	clear:both;	
	width:100%;
	height:80px; /*フッターの縦の長さ*/	
	line-height:60px;
	background-color:#bf81e8;
	font-family: 'Architects Daughter', cursive;
	text-align:center;
	font-size:14px;}

/*レシポンシブWebデザイン------------------------------------------*/

div.s1_1{width:100%;}
div.s2_1,div.s2_2{width:50%;}
div.s3_1,div.s3_3{width:33.3%;}
div.s3_2{width:33.4%;}
div.s4_1,div.s4_2,div.s4_3,div.s4_4{width:25%;}
div.s1_1,div.s2_1,div.s2_2,div.s3_1,div.s3_2,div.s3_3{float:left;}
div.s4_1,div.s4_2,div.s4_3,div.s4_4{float:left;}
div.s1_1,div.s2_1,div.s3_1,div.s4_1{clear:both;}
#footer_1,#footer_2{width:50%;float:left;}

#page_footer{
	height:auto;
	margin:0 auto;}
#page_header,#menu,article,#page_footer{width:960px;}

@media only screen and (min-with:960px){}

/* -----タブレット用----------------------------------------- */

@media only screen and (min-width:600px) and (max-width:959px){
	#page_header,#header2 nav,article,#page_footer{width:100%;}
	#header2 nav ul li{width:25%;}
	#header2 nav ul li a{font-size:14px;}
	#mainvisual{width:90%;}
	section{padding:10px 20px;}
	
	#header_map{display:none;}	
	
	
	section.img_01 div,section.img_02 div,section.img_03 div{margin-bottom:5px;}
	section.img_03 img{width:100%;}	
	div#links{width:100%;}
}
/* -----スマホ用----------------------------------------- */
	
@media only screen and (max-width:599px){
	#page_header,#header2 nav,article,#page_footer{width:100%;}
	#header2 nav ul li{width:25%;}
	#header2 nav ul li a{font-size:12px;}
	#mainvisual{width:90%;}
	#header_map{padding-left:8px;}

	
	section{padding:5px 5px;}
	
	#header_title,#header_map,div.s1_1,div.s2_1,div.s2_2{
		clear:both;
		width:100%;}
	#header_map,.ad-link,#ad-2,#ad-3{display:none;}	
	section.img_100 p{display:none;}
		
	nav ul li{width:16.6%;height:50px;line-height:50px;}
	
	/*div.s2_2{border-top:1px #ccc solid;padding-top:5px;}*/
	section.category h2{font-size:14px;}
	section div h2{font-size:12px;}
	section div h3{font-size:12px;}
	section.img_30 div,section.img_50 div,section.img_100 div{margin-bottom:5px;}
	div#links{width:100%;}
	footer{font-size:12px;}
		}