@charset "utf-8";



/*PC・タブレット・スマホ(全端末)共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/



/*全体の設定
---------------------------------------------------------------------------*/


body {
	margin: 0px;

	padding: 0px;

	-webkit-text-size-adjust: none;

/*	color: #666; */	/*全体の文字色*/
	color: #494949;	/*全体の文字色*/

	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/

	font-size: 16px;	/*文字サイズ*/

	line-height: 2;	/*行間*/

	background: #fff;	/*背景色*/

}


h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {
	margin: 0px;
	padding: 0px;
	font-size:	100%;
	font-weight: normal;
}


ul {list-style-type: none;}

ol {padding-left: 40px;padding-bottom: 15px;}

img {border: none;max-width: 100%;height: auto;vertical-align: middle;}

table {border-collapse:collapse;font-size: 100%;border-spacing: 0;}

iframe {width: 100%;}



/*リンク（全般）設定
---------------------------------------------------------------------------*/

a {

	color: #666;	/*リンクテキストの色*/

	transition: 0.4s;	/*マウスオン時の移り変わるまでの時間設定。0.3秒。*/

}

a:hover {

	color: #80ad45;	/*マウスオン時の文字色*/

}



/*コンテナー（ホームページを囲む一番外側のブロック）
---------------------------------------------------------------------------*/

#container {

	max-width: 1200px;	/*最大幅*/

	margin: 50px 50px 0;	/*上、左右、下に空けるブロックの外側へのスペース*/

}



/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/


/*headerブロック*/


header {

	position: relative;

	text-align: center;
/*内容を中央よせ*/
}
/*ロゴ画像設定*/

#logo  img {

	width: 35%;	/*画像幅*/

	margin-bottom: 40px;	/*画像の下に空けるスペース*/

}


/*トップページのロゴ画像設定*/

#top #logo img {

	position: absolute;
	right: 5%;	/*headerブロックに対して右から5%の場所に配置*/

	top: 40%;	/*headerブロックに対して上から40%の場所に配置*/

	z-index: 1;

}



/*トップページのメイン画像
---------------------------------------------------------------------------*/


/*画像ブロック*/


#mainimg {

	margin-bottom: 40px;	/*画像の下に空けるスペース*/

	box-shadow: 0px 0px 20px rgba(0,0,0,0.2);	/*影の設定。右へ、左へ、広げる幅。0,0,0は黒のことで0.2は透明度20%のこと。*/

	border-radius: 10px;	/*角を丸くする指定。この１行を削除すれば角丸がなくなります。*/

}



/*メニュー
---------------------------------------------------------------------------*/

/*メニュー全体を囲むブロック*/

#menubar {

	text-align: center;	/*文字をセンタリング*/

	font-size: 18px;	/*文字サイズ*/

	margin-bottom: 40px;	/*メニューの下に空けるスペース*/

}


/*メニュー１個あたりの設定*/

#menubar li {
	display: inline;	/*横並びにする設定*/

}

#menubar li a {

	text-decoration: none;

	padding: 15px 30px;	/*各メニュー内の余白。上下に15px、左右に30pxあけるという意味。*/

}


/*マウスオン時、現在表示中、の設定*/

#menubar li a:hover,
#menubar li.current a {

	color: #80ad45;	/*文字色*/

	border-bottom: 4px solid #80ad45;	/*下線の幅、線種、色*/

}

---------------------------------------------------------------------------*/

/*メニュー全体を囲むブロック*/

#menubar2 {

	text-align: center;	/*文字をセンタリング*/

	font-size: 18px;	/*文字サイズ*/

	margin-bottom: 40px;	/*メニューの下に空けるスペース*/

}


/*メニュー１個あたりの設定*/


#menubar2 li a {

	text-decoration: none;

	padding: 3px 30px;	/*各メニュー内の余白。上下に15px、左右に30pxあけるという意味。*/

}


/*マウスオン時、現在表示中、の設定*/

#menubar2 li a:hover,
#menubar2 li.current a {

	color: #cc3300;	/*文字色*/

	border-left: 5px solid #80ad45;	/*下線の幅、線種、色*/


}


/*コンテンツ（見出しバーや文字などが入っているブロック）
---------------------------------------------------------------------------*/


/*コンテンツのh2タグの設定*/

#contents h2 {

	clear: both;

	margin-bottom: 15px;

	color: #fff;		/*文字色*/

	padding: 5px 20px;	/*上下、左右への余白*/

	background: #80ad45;	/*背景色*/

	border-radius: 10px;	/*角を丸くする指定。この１行を削除すれば角丸がなくなります。*/

}


/*コンテンツのh3タグの設定*/


#contents h3 {

	clear: both;

	margin-bottom: 15px;

	padding: 3px 20px;	/*上下、左右への余白*/

	background: #fff;	/*背景色*/

	border: 1px solid #ccc;	/*枠線の幅、線種、色*/

	border-radius: 10px;	/*角を丸くする指定。この１行を削除すれば角丸がなくなります。*/

}


/*コンテンツのp(段落)タグ設定*/


#contents p {

	padding: 0px 20px 14px;	/*上、左右、下への余白*/

}

#contents h2 + p,

#contents h3 + p {

	margin-top: -5px;

}



/*Galleryページ
---------------------------------------------------------------------------*/

/*各ブロックごとの設定*/

.list {

	overflow: hidden;

	border-bottom: 1px solid #ccc;	/*下線の幅、線種、色*/

	padding: 20px;	/*ボックス内の余白*/

}


/*h4見出しの設定*/

.list h4 {

	/*color: #80ad45;*/ /*文字色*/

	color: #003300;	/*文字色*/

}


/*画像の設定*/

.list img {
	
	width: 30%;		/*画像幅*/

	float: right;	/*画像を左に回り込み*/

	margin-left: 3%	/*画像の右側に空けるスペース*/

}


/*段落タグ*/

.list p {

	padding: 0 !important;

}



.list2 {

	overflow: hidden;

	border-bottom: 1px solid #ccc;	/*下線の幅、線種、色*/

	padding: 20px;	/*ボックス内の余白*/

}


/*h4見出しの設定*/

.list2 h4 {

	color: #80ad45;	/*文字色*/

}


/*画像の設定*/

.list2 img {
	
	width: 8%;		/*画像幅*/

	float: left;	/*画像を左に回り込み*/

	margin-right: 3%	/*画像の右側に空けるスペース*/

}


/*段落タグ*/

.list2 p {

	padding: 0 !important;

}




/*フッター(ページ最下部のcopyrightのパーツ)設定
---------------------------------------------------------------------------*/

footer {

	clear: both;

	text-align: center;	/*文字をセンタリング*/

	padding: 10px 0px 0px;	/*上、左右、下へのボックス内の余白*/

}


footer a {

	text-decoration: none;

	border: none;

}


footer .pr {

	display: block;

}



/*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/


/*ブロック全体の設定*/

#new dl {

	padding-left: 20px;

	margin-bottom: 15px;

}

/*日付設定*/

#new dt {

	font-weight: bold;	/*太字にする設定。標準がいいならこの行削除。*/

	float: left;

	width: 8em;

}

/*記事設定*/

#new dd {

	padding-left: 8em;

}


/*テーブル
---------------------------------------------------------------------------*/

/*tテーブルブロック設定*/

.ta1 {

	width: 100%;

	margin-bottom: 15px;

}

.ta1, .ta1 td, .ta1 th {

	word-break: break-all;

	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/

	padding: 10px;			/*テーブル内の余白*/

}

/*テーブル１行目に入った見出し部分*/

.ta1 th.tamidashi {

	width: auto;

	text-align: left;	/*左よせ*/

	background: #eee;	/*背景色*/

}

/*テーブルの左側ボックス*/

.ta1 th {

	width: 30%;	/*幅*/

	text-align: center;	/*センタリング*/

}


/*その他
---------------------------------------------------------------------------*/

.look {background: #e5e5e5;padding: 5px 10px;border-radius: 4px;}

.mb15,.mb1em {margin-bottom: 15px;}

.color1 {color: #80ad45;}

.pr {font-size: 12px;}





/*画面幅800px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

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


/*コンテナー（ホームページを囲む一番外側のブロック）
---------------------------------------------------------------------------*/

#container {

	margin: 20px 20px 0;	/*上、左右、下に空けるブロックの外側へのスペース*/

}


}





/*画面幅580px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

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


/*全体の設定
---------------------------------------------------------------------------*/

body {

	font-size: 12px;	/*文字サイズ*/

	line-height: 1.5;	/*行間*/
}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/

/*ロゴ画像設定*/

#logo  img {

	width: 90%;	/*画像幅*/
}
/*トップページのロゴ画像設定*/

#top #logo img {

	width: 45%;	/*画像幅*/

	top: 35%;		/*headerブロックに対して上から40%の場所に配置*/

}


/*メニュー
---------------------------------------------------------------------------*/

/*メニュー１個あたりの設定*/

#menubar li {

	display: block;	/*縦並びにする設定*/

	margin-bottom: 10px;

}

#menubar li a {

	text-decoration: none;

	padding: 8px 30px;	/*各メニュー内の余白。*/

}


/*Galleryページ
---------------------------------------------------------------------------*/

/*各ブロックごとの設定*/

.list {

	padding: 10px;	/*ボックス内の余白*/

}


/*テーブル
---------------------------------------------------------------------------*/

/*tテーブルブロック設定*/

.ta1, .ta1 td, .ta1 th {

	padding: 5px;			/*テーブル内の余白*/

}


}