@charset "utf-8";

/*このCSSファイルは下記の設定を定義しています

ほっぺパークトップページに適用するスタイル

*/




/****************************************************************************************/
/**ほっぺパークトップページに適用するスタイル********************************************/
/****************************************************************************************/


/* トップページ中央のナビゲーションボタンエリア */
#topnavi {
	display: block;
	clear: both;
	width: 895px;
	height: auto;
	margin: 0 0 0 5px;
	padding: 0;
	color: #ffffff;
	font-size: 12px;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
}

/*トップページ中央のナビゲーションボタンは、上段がul、下段がdlを使用している。
いずれもHTMLに画像を直接置かず、CSS内に背景画像として記述し、メンテナンス性の向上を図っている
画像の代替となるテキストはdisplay:none;に設定したspanタグに入れている*/

/*上段は<ul>を用いて、<li "下記ボタンごとのクラスで背景画像を指定"><span>ボタン名</span></li>と記述する*/
#topnavi ul {
	width: 895px;
	height: 78px;
	margin: 0;
	padding: 0;
	text-align: left;
}
#topnavi li {
	display: block;
	float: left;
	width: 178px;
	height: 78px;
	margin: 0;
	padding: 0;
	text-align: left;
}
#topnavi span {
	display: none;
}
/*下段は<dl>を用いて、<dt>建物の紹介、<dd>鶴見保育所、<dd>西部児童館、、、、という構造になっている
リストタグの使い方が違うだけであとの構成は上段と同じ*/
#topnavi dl {
	clear: left;
	width: 895px;
	height: 78px;
}
#topnavi dt {
	display: inline;
	float: left;
	width: 178px;
	height: 78px;
	margin: 0;
	padding: 0;
	text-align: left;
}
#topnavi dd {
	display: inline;
	float: left;
	width: 178px;
	height: 78px;
	margin: 0;
	padding: 0;
	text-align: left;
}

/*トップページ中央ボタンごとのクラス*/
.topnavi_01, .topnavi_01 a {	/*トップページ「行事予定」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_01.gif);
	background-position: left top;
}
.topnavi_01 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_01_over.gif);
	background-position: left top;
	overflow: hidden;
}

/****************************************************************************************/
/*ココから2010/3/17修正*/
/*
.topnavi_02, .topnavi_02 a {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_02.gif);
	background-position: left top;
}*/
/*↑修正前データ↑*/
/*↓修正後データ↓*/
.topnavi_02 {	/*トップページ「お知らせ」ボタン*/
	position: relative;
}
.topnavi_02_pdf {
    position: absolute;
    color: #777777;
}
.topnavi_02 a:link {
    text-decoration: none;
}
.topnavi_02 a:hover {
    text-decoration: none;
}
.topnavi_02 a:visited {
    text-decoration: none;
}
.topnavi_02 a {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_02.gif);
	background-position: left top;
}
.topnavi_02 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_02_over.gif);
	background-position: left top;
	overflow: hidden;
}
/*ココまで2010/3/17修正*/
/****************************************************************************************/

.topnavi_03, .topnavi_03 a {	/*トップページ「よくある質問」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_03.gif);
	background-position: left top;
}
.topnavi_03 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_03_over.gif);
	background-position: left top;
	overflow: hidden;
}

.topnavi_04, .topnavi_04 a {	/*トップページ「リンク」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_04.gif);
	background-position: left top;
}
.topnavi_04 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_04_over.gif);
	background-position: left top;
	overflow: hidden;
}

.topnavi_05, .topnavi_05 a {	/*トップページ「地図」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_05.gif);
	background-position: left top;
}
.topnavi_05 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_05_over.gif);
	background-position: left top;
	overflow: hidden;
}

.topnavi_06, .topnavi_06 a {	/*トップページ「建物の紹介」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_06.gif);
	background-position: left top;
}
.topnavi_06 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_06_over.gif);
	background-position: left top;
	overflow: hidden;
}

.topnavi_07, .topnavi_07 a {	/*トップページ「鶴見保育所」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_07.gif);
	background-position: left top;
}
.topnavi_07 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_07_over.gif);
	background-position: left top;
	overflow: hidden;
}

.topnavi_08, .topnavi_08 a {	/*トップページ「西部児童館」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_08.gif);
	background-position: left top;
}
.topnavi_08 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_08_over.gif);
	background-position: left top;
	overflow: hidden;
}

.topnavi_09, .topnavi_09 a {	/*トップページ「西部子育て支援センターべるね」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_09.gif);
	background-position: left top;
}
.topnavi_09 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_09_over.gif);
	background-position: left top;
	overflow: hidden;
}

.topnavi_10, .topnavi_10 a {	/*トップページ「ファミリーサポートセンター」ボタン*/
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_10.gif);
	background-position: left top;
}
.topnavi_10 a:hover {
	display: block;
	width: 178px;
	height: 78px;
	background-image: url(../image_indexpage/navi_10_over.gif);
	background-position: left top;
	overflow: hidden;
}

/********************************************/
/* トップページ「お知らせ」記事表示ボックス */
#topwhatnew {
	width: 400px;
	height: auto;
	margin: 10px 0 10px 250px;	/*「お知らせ」記事表示ボックスは左マージン設定で中央に表示している*/
	padding: 0;
	text-align: left;
}
#topwhatnew h3 {	/*見出しのボックス*/
	width: 386px;
	min-height: 16px;
	margin: 0;
	padding: 6px 7px 7px 7px;
	background-image: url(../image_common/bg_whatnew.gif);	/*青斜線の背景と上、左右枠線の画像*/
	background-position: left top;
	background-repeat: no-repeat;
	color: #0066cc;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
#topwhatnew h3 span {
	min-height: 15px;
	margin: 0px;
	padding: 1px 0px 0px 55px;	/*new!マークの後にテキストを表示させるためにインデントしている*/
	background-image: url(../image_common/icon_new.gif);	/*new!マーク*/
	background-position: left;
	background-repeat: no-repeat;
	color: #0066cc;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
#topwhatnew ul {	/*記事表示部分のボックス　widthを絶妙に調整して枠線が見出しのボックスの画像とぴったり一致するようにしている*/
	display:block;
	width: 388px;
	height: auto;
	margin: 0;
	padding: 0 5px 0 5px;
	border: 1px #66b3ff solid;
	text-align: left;
}
#topwhatnew li {	/*記事*/
	display:block;
	width: auto;
	min-height: 21px;
	margin: 5px 0 5px 0;
	padding: 0 0 0 40px;	/*左40pxインデント*/
	background-image: url(../image_common/icon_whatnew_list.gif);	/*リストマーク（ふたば）*/
	background-repeat: no-repeat;
	background-position: left;
	text-align: left;
}
#topwhatnew li img {	/*<li>内に画像を配置すると記事の右側に右寄せで画像を配置する*/
	float: right;
	margin: 0 0 5px 5px;
	padding: 0;
}

/********************************************/
/* トップページ「行事予定」記事表示ボックス （お知らせ記事表示ボックスと同様の仕様）*/
#topevent {
	width: 400px;
	height: auto;
	margin: 10px 0 10px 250px;
	padding: 0;
	text-align: left;
}
#topevent h3 {
	width: 386px;
	height: auto;
	margin: 0;
	padding: 7px;
	background-image: url(../image_common/bg_event.gif);
	background-position: left top;
	background-repeat: no-repeat;
	color: #ff0000;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
#topevent h3 span {
	min-height: 20px;
	margin: 0;
	padding: 0 0 0 35px;
	background-image: url(../image_common/icon_event.gif);
	background-position: left;
	background-repeat: no-repeat;
	color: #ff0000;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
#topevent ul {
	display:block;
	width: 388px;
	height: auto;
	margin: 0;
	padding: 0 5px 0 5px;
	border: 1px #ff9999 solid;
	text-align: left;
}
#topevent li {
	display:block;
	width: auto;
	min-height: 21px;
	margin: 5px 0 5px 0;
	padding: 0 0 0 40px;
	background-image: url(../image_common/icon_event_list.gif);
	background-repeat: no-repeat;
	background-position: 7px;
	text-align: left;
}
#topevent li img {
	float: right;
	margin: 0 0 5px 5px;
	padding: 0;
}

/********************************************/
/* トップページ「休館日」記事表示ボックス（お知らせ記事表示ボックスと同様の仕様） */
#closed {
	width: 400px;
	height: auto;
	margin: 10px 0 20px 250px;
	padding: 0;
	text-align: left;
}
#closed h3 {
	display: block;
	width: 400px;
	min-height: 15px;
	margin: 0;
	padding: 7px 0 0 0;
	background-image: url(../image_common/bg_closed_header.gif);	/*見出しの背景画像上半分*/
	background-position: left top;
	background-repeat: no-repeat;
	color: #ff0000;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
#closed h3 span {
	display: block;
	width: 385px;
	height: auto;
	margin: 0;
	padding: 0 0 7px 15px;
	background-image: url(../image_common/bg_closed_footer.gif);	/*見出しの背景画像下半分*/
	background-position: left bottom;
	background-repeat: no-repeat;
	color: #663300;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
#closed p {
	clear: both;
	margin: 5px 10px 0 10px;
	padding: 0;
	text-align: left;
}