kitagata_old/css/section.css

@charset "utf-8";

/* ***********************************************
 * コンテンツ定義 css
 *
 * コンテンツ一覧
 * ページ操作コンテンツ
 * 	住所
 * 	背景色変更
 * 	文字サイズ変更
 * 	翻訳
 * 	サイトマップ
 * 	お問い合わせ
 *
 * コンテンツブロック
 * 	スライド画像
 * 	情報一覧
 * 	記事一覧
 * 		新着情報
 *		イベント情報
 * 		町からのお知らせ
 * 		町の出来事
 * 	北方町紹介
 * 	ライフイベント
 * 	町長の部屋
 * 	緊急・災害情報
 * 	カレンダー
 * 	アクセスランキング
 * 	広報1
 * 	広報2
 * 	広報3
 * 	広報4
 * 	facebook
 * 	きたがたまなびすと
 *
 ********************************************** */

/*
 * 2014/02/26
 * section タグ定義
 * article タグ定義
 *
 * 2014/02/27
 * article_list 記事一覧 タグ定義
 *
 * 2014/03/03
 * コメントアウト編集
 * コンテンツブロックに仕分け
 *
 */

/* 一番上 ページ操作コンテンツ */
section#operation {
	position: relative;
	display: block;
	top: 0px;
	left: 0px;
	width: 920px;
	height: 60px;
	margin: 0px 10px 10px 0px;
}
a.i_link {
	color: #000000;
}
	/* 住所 ここから */
	address#operation_add{
		position: relative;
		display: block;
		margin: 0px 0px 0px 0px;
		padding: 3px 0px 0px 0px;
		text-align: right;
		font-size: 12px;
	}
	/* 住所 ここまで */

	/* ボタンリスト ここから */
	div#controle_panel{
		position: relative;
		display: block;
		left: 130px;
		top: 5px;
	}

	/* 背景色変更 ここから */
	article#bgcolor{
		position: relative;
		display: block;
		margin: 0px 10px 0px 10px;
		float:left;
	}
	div#bgcolor_img{
		position: relative;
		display: block;
		left:83px;
		top:-33px;
		height: 29px;
	}
		input#button1{
			position: absolute;
			display: block;
			width: 29px;
			height: 28px;
		}
		input#button2{
			position: absolute;
			display: block;
			left: 34px;
			width: 29px;
			height: 28px;
		}
		input#button3{
			position: absolute;
			display: block;
			left: 68px;
			width: 29px;
			height: 28px;
		}
	/* 背景色変更 ここまで */

	/* 文字サイズ変更 ここから */
	article#charsize{
		position: relative;
		display: block;
		margin: 0px 10px 0px 10px;
		float:left;
	}
	div#charsize_img{
		position: relative;
		display: block;
		left:83px;
		top:-32px;
	}
	/* 文字サイズ変更 ここまで */

	/* 翻訳 ここから */
	article#translation{
		position: relative;
		display: block;
		margin: 0px 10px 0px 10px;
		float:left;
	}
	/* 翻訳 ここまで */

	/* サイトマップ ここから */
	article#sitemap{
		position: relative;
		display: block;
		margin: 0px 10px 0px 10px;
		float:left;
	}
	/* サイトマップ ここまで */

	/* お問い合わせ ここから */
	article#contact{
		position: relative;
		display: block;
		float:left;
	}
	/* お問い合わせ ここまで */

	div#claer {
		clear : both;
	}
	/* ボタンリスト ここまで */
/* 一番上 ページ操作コンテンツ */


/* 各コンテンツブロック配置 */
/* 全体大きさ定義 */
div#blocks {
	position: relative;
	display: block;
	top: 0px;
	left: 0px;
	margin: 10px 0px 10px 0px;
}

	/* スライド画像 ここから */
	section#imgae {
		position: absolute;
		display: block;
		top: -620px;
		left: 210px;
		width: 710px;
		height: 250px;
		margin: 10px 10px 10px 0px;
		/*background-color: #ffffff;*/
		background-image: url(img/info_background710250.png);
	}
	/* スライド画像 ここまで */

	/* 情報一覧 ここから */
	section#infolist {
		position: absolute;
		display: block;
		top: -360px;
		left: 210px;
		width: 710px;
		height: 40px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		/* 情報一覧表示位置設定 */
		article#infolist{
			position: relative;
			display: block;
			margin: 5px 30px 5px 30px;
			padding : 5px 40px;
		}
		div#infolist{
			position: relative;
			display: block;
		}
		span#infolist{
			position: absolute;
			display: block;
			top: 1px;
			left: 120px;
		}
	/* 情報一覧 ここまで */

	/* 記事一覧 ここから */
	section#articlelist {
		position: absolute;
		display: block;
		top: -310px;
		left: 210px;
		width: 710px;
		height: 370px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		/* 記事内切り替え用タグ定義 */
		/* タブボタン定義 */
		div#article_new_tab{
			position: relative;
			display: block;
			top: 25px;
			left: 30px;
			width: 100px;
			height: 28px;
			text-align:center;
		}
		div#article_info_tab{
			position: absolute;
			display: block;
			top: 26px;
			left: 150px;
			width: 100px;
			height: 28px;
			text-align:center;
		}
		div#article_news_tab{
			position: absolute;
			display: block;
			top: 26px;
			left: 275px;
			width: 130px;
			height: 28px;
			text-align:center;
		}
		div#article_events_tab{
			position: absolute;
			display: block;
			top: 25px;
			left: 430px;
			width: 110px;
			height: 28px;
			text-align:center;
		}
		div#article_list{
			position: absolute;
			display: block;
			top: 15px;
			left: 605px;
			width: 80px;
			height: 21px;
			text-align:center;
		}

		/* 記事表示ブロック */
		div#article_new{
			position: relative;
			display: block;
			top: 24px;
			margin: 0px 30px 0px 30px;
			border-style: solid hidden hidden hidden;
			border-width: 1px;
		}
		div#article_info{
			position: relative;
			display: none;
			top: 24px;
			margin: 0px 30px 0px 30px;
			border-style: solid hidden hidden hidden;
			border-width: 1px;
		}
		div#article_news{
			position: relative;
			display: none;
			top: 24px;
			margin: 0px 30px 0px 30px;
			border-style: solid hidden hidden hidden;
			border-width: 1px;
		}
		div#article_events{
			position: relative;
			display: none;
			top: 24px;
			margin: 0px 30px 0px 30px;
			border-style: solid hidden hidden hidden;
			border-width: 1px;
		}

		/* 記事文章定義 */
		span.block_line{
			position: relative;
			display: block;
			height:20px;
			padding : 7px 0px;
			border-bottom : 1px dotted;
			font-size: 14px;
		}
		span.block_line_tab{
			position: absolute;
			display: block;
			top: 7px;
			left: 55px;
		}
		span.block_line_date{
			position: absolute;
			display: block;
			top: 7px;
			left: 80px;
		}
		span.block_line_char{
			position: absolute;
			display: block;
			top: 7px;
			left: 170px;
		}
		span.block_line_date2{
			position: absolute;
			display: block;
			top: 7px;
			left: 0px;
		}
		span.block_line_char2{
			position: absolute;
			display: block;
			top: 7px;
			left: 90px;
		}
		span.block_line_char3{
			position: absolute;
			display: block;
			top: 0px;
			left: 90px;
			height: 40px
		}

	/* 記事一覧 ここまで */

	/* 北方町紹介 ここから */
	section#intro {
		position: relative;
		display: block;
		top: 0px;
		left: 0px;
		width: 200px;
		height: 560px;
		margin: 0px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		article#intro{
			position: relative;
			display: block;
			width: 180px;
			height: 530px;
			margin: 0px 0px 0px 0px;
			padding: 10px 10px 10px 10px;
		}
		div#intro_title{
			position: relative;
			display: block;
			width: 180px;
			height: 32px;
			margin: 0px 0px 0px 0px;
			background-image: url(img/shortbar_emblem.png);
		}
		div#intro_title_block{
			position: relative;
			display: block;
			width: 160px;
			margin: 0px 0px 0px 10px;
		}
		span#intro_title{
			display: table-cell;
			width: 160px;
			height: 32px;
			font-size: 18px;
			color: #ffffff;
			vertical-align: middle;
		}
		div#intro_text{
			position: relative;
			display: block;
			margin: 13px 0px 7px 0px;
		}
		span.intro_text_l{
			position: relative;
			display: block;
			text-decoration: underline;
		}
		span#kawasemi_text{
			position: absolute;
			display: block;
			top: 384px;
			left: 20px;
			color: #888888;
			font-size: 12px;
			z-index: 0;
		}
		img#kawasemi_img{
			position: relative;
			display: block;
			top: 0px;
			left: 70px;
		}
		div.intro_population_img{
			position: relative;
			display: block;
			width: 160px;
			margin: 5px 10px 0px 10px;
			text-align: center;
		}
	/* 北方町紹介 ここまで */

	/* ライフイベント ここから */
	section#event {
		position: absolute;
		display: block;
		top: 70px;
		left: 210px;
		width: 500px;
		height: 480px;
		margin: 10px 10px 10px 0px;
		/*background-color: #ffffff;*/
		background-image: url(img/lifeevent_background.png);
	}
		article#event{
			position: relative;
			display: block;
			width: 480px;
			height: 460px;
			margin: 0px 0px 0px 0px;
			padding: 10px 10px 10px 10px;
		}
		div#event_title{
			position: relative;
			display: block;
			width: 480px;
			height: 32px;
			margin: 0px 0px 0px 0px;
			background-image: url(img/longbar.png);
		}
		div#event_title_block{
			position: relative;
			display: block;
			width: 480px;
			margin: 0px 0px 0px 10px;
		}
		span#event_title{
			display: table-cell;
			width: 480px;
			height: 32px;
			font-size: 18px;
			color: #ffffff;
			vertical-align: middle;
		}
		div#event_list{
			margin:10px 0px 0px 0px;
		}
		div#event_list.clearfix:after {
			display:block;
			clear:both;
			height:0px;
			visibility:hidden;
			content:".";
		}
		div#event_list.clearfix{
			min-height:1px;
		}

		div#event_list_right{
			float:right;
		}
		div#event_list_left{

		}

		div.event_button{
			margin:0px 0px 0px 0px;
			padding: 15px 0px 15px 10px;
			width: 235px;
			height: 70px;
		}
		div.event_button a{
			display:block;
		}
		span.event_button_name{
			position: relative;
			display: block;
			top: -45px;
			left: 65px;
			width: 140px;
			margin: 0px 0px 0px 15px;
			font-size: 18px;
		}


	/* ライフイベント ここまで */

	/* 町長の部屋 ここから */
	section#mayor {
		position: absolute;
		display: block;
		top: 70px;
		left: 720px;
		width: 200px;
		height: 125px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/banner_background200170.png);*/
	}
		div#mayor_img{
			position: relative;
			display: block;
			width: 180px;
			height: 89px;
			margin: 10px 0px 0px 10px;
			background-image: url(img/Room_of_the_mayor.png);
		}

		/* 文章定義 */
		span#mayor_title{
			position: relative;
			display: block;
			top: 40%;
			width: 180px;
			height: 45px;
			text-align: center;
		}
		span#mayor_1{
			position: relative;
			display: block;
			padding : 5px 10px;
			color: #222222;
		}
		span#mayor_2{
			position: relative;
			display: block;
			padding : 0px 10px;
			color: #222222;
			text-decoration: underline;
		}
	/* 町長の部屋 ここまで */

	/* 議会 ここから */
	section#parliament {
		position: absolute;
		display: block;
		top: 200px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
	}
		div#parliament_img{
			position: relative;
			display: block;
			width: 180px;
			height: 80px;
			margin: 10px 0px 0px 10px;
			/*background-color: #fd6263;*/
			/*background-image: url(img/banner_img200170red.png);*/
		}
		/* 文章定義 */
		span#parliament_title{
			position: relative;
			display: block;
			top: 40%;
			width: 180px;
			height: 25px;
			text-align: center;
			color: #000000;
			font-size: 16px;
			font-weight: bold;
		}
	/* 議会 ここまで */



	/* きたがたまなびすと ここから */
	section#manabisuto {
		position: absolute;
		display: block;
		top: 410px;
		left: 720px;
		width: 200px;
		height: 125px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
	/* きたがたまなびすと ここまで */
	/* きたがたまなびすと2 ここから */
	section#manabisuto2 {
		position: absolute;
		display: block;
		top: 305px;
		left: 720px;
		width: 200px;
		height: 125px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
	/* きたがたまなびすと ここまで */

	/* 緊急・災害情報 ここから */
	section#edinfo {
		position: absolute;
		display: block;
		top: 540px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/banner_background200170.png);*/
	}
		div#edinfo_img{
			position: relative;
			display: block;
			width: 180px;
			height: 80px;
			margin: 10px 0px 0px 10px;
			/*background-color: #fd6263;*/
			/*background-image: url(img/banner_img200170red.png);*/
		}
	/* 緊急・災害情報2 ここから */
	section#edinfo2 {
		position: absolute;
		display: block;
		top: 540px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/banner_background200170.png);*/
	}

		/* 文章定義 */
		span#edinfo_title{
			position: relative;
			display: block;
			top: 40%;
			width: 180px;
			height: 45px;
			text-align: center;
			color: #ffffff;
			font-size: 18px;
			font-weight: bold;
		}
	/* 緊急・災害情報 ここまで */

	/* カレンダー ここから */
	section#calendar {
		position: absolute;
		display: block;
		top: 645px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
	}
		div#calendar_img{
			position: relative;
			display: block;
			width: 180px;
			height: 80px;
			margin: 10px 0px 0px 10px;
			background-color: #01a9de;
			/*background-image: url(img/banner_img200170red.png);*/
		}
	/* カレンダー2 ここから */
	section#calendar2 {
		position: absolute;
		display: block;
		top: 645px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
	}

		/* 文章定義 */
		span#calendar_title{
			position: relative;
			display: block;
			top: 40%;
			width: 180px;
			height: 45px;
			text-align: center;
			color: #ffffff;
			font-size: 18px;
			font-weight: bold;
		}
	/* カレンダー ここまで */

	/* アクセスランキング ここから */
	section#access {
		position: relative;
		display: block;
		top: 0px;
		left: 0px;
		width: 200px;
		height: 290px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		article#access{
			position: relative;
			display: block;
			width: 180px;
			height: 280px;
			margin: 0px 0px 0px 0px;
			padding: 10px 10px 10px 10px;
		}
		div#access_title{
			position: relative;
			display: block;
			width: 180px;
			height: 32px;
			margin: 0px 0px 0px 0px;
			background-image: url(img/shortbar.png);
		}
		div#access_title_block{
			position: relative;
			display: block;
			width: 180px;
			margin: 0px 0px 0px 10px;
		}
		span#access_title{
			display: table-cell;
			width: 180px;
			height: 32px;
			font-size: 18px;
			color: #ffffff;
			vertical-align: middle;
		}
	/* アクセスランキング ここまで */

	/* 広報 ここから */
	/* 広報1 */
	section#public1 {
		position: absolute;
		display: block;
		top: 560px;
		left: 210px;
		width: 245px;
		height: 140px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
	/* 広報2 */
	section#public2 {
		position: absolute;
		display: block;
		top: 560px;
		left: 465px;
		width: 245px;
		height: 140px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
	/* 広報3 */
	section#public3 {
		position: absolute;
		display: block;
		top: 710px;
		left: 210px;
		width: 245px;
		height: 140px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
	/* 広報4 */
	section#public4 {
		position: absolute;
		display: block;
		top: 710px;
		left: 465px;
		width: 245px;
		height: 140px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
	/* 広報 ここまで */

	/* facebook ここから */
	section#facebook {
		position: relative;
		display: block;
		top: 0px;
		left: 0px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		article#facebook{
			position: relative;
			display: block;
			width: 180px;
			height: 80px;
			margin: 5px 10px 10px 0px;
		}
	/* facebook ここまで */

	/* education ここから */
	section#education {
		position: absolute;
		display: block;
		top: 750px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		article#education{
			position: relative;
			display: block;
			width: 180px;
			height: 80px;
			margin: 10px 10px 10px 10px;
		}
	/* education ここまで */

	/* education2 ここから */
	section#education2 {
		position: absolute;
		display: block;
		top: 750px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		article#education{
			position: relative;
			display: block;
			width: 180px;
			height: 80px;
			margin: 10px 10px 10px 10px;
		}
	/* education ここまで */


	/* 北方新庁舎　ここから開始 */
	section#newgov {
		position: absolute;
		display:block;
		top: 305px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color :#FFFFFF;
	}

	div#newgov_img{
		position: relative;
		display: block;
		width: 180px;
		height: 80px;
		margin: 10px 0px 0px 10px;
		background-color: #01a9de;
		/*background-image: url(img/banner_img200170red.png);*/
		}
	/* 北方新庁舎　ここまで*/

	/* kitagatakids ここから */
	section#kitagatakids2 {
		position: absolute;
		display: block;
		top: 435px;
		left: 720px;
		width: 200px;
		height: 100px;
		margin: 10px 10px 10px 0px;
		background-color: #ffffff;
		/*background-image: url(img/kitagata_background.png);*/
	}
		article#kitagatakids{
			position: relative;
			display: block;
			width: 180px;
			height: 80px;
			margin: 10px 10px 10px 10px;
		}
	/* kitagatakids ここまで */

/* 各コンテンツブロック配置 */