@charset "utf-8";

@import "../css/import.css";

/*________________________________________________

	name:			webmagazine.css
	author:			kumi morita
	mail:			morimori@elf.coara.or.jp
	create Date:	2009-04-02
	lastmodified:	****-**-**
________________________________________________*/

 
 
/* Base Styles ===================================
 * (classes defined in the Markup Guide)
================================================*/
/* Suggested order:
 * display
 * list-style
 * position
 * float
 * clear
 * width
 * height
 * margin
 * padding
 * border
 * background
 * color
 * font
 * text-decoration
 * text-align
 * vertical-align
 * white-space
 * other text
 * content
 *
 */


/* ColorScheme====================================
	MainColor	=>	#7c705f
	SubColor	=>	#8a9924
	TextColor	=>	#333333
	AccentColor	=>	#b5686a
	Background	=>	#ffffff
================================================*/

/*--------------------------------------------------------------
.webmagazinemenu　　web版大分の国保各ページメニュー
--------------------------------------------------------------*/
h3 {
	clear: both;
}
/* タブメニューの設定 */
ul.tabNav {
	width: 730px;
	height: 250px;
	margin: 0;
	padding: 0;
	background: #7c705f top left no-repeat;
	text-align: right;
}
ul.tabNav li {
	display: inline;
	width: auto;
	height: 250px;
	margin: 0;
	padding: 0;
	text-align: right;
}
#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7, #tab8 {
	clear: both;
}
/* 画像の回り込み */
.float_left, img.float_left {
	float: left;
	margin: 0 10px 10px 0;
}
.float_right, img.float_right {
	float: right;
	margin: 0 0 10px 10px;
}

/*--------------------------------------------------------------
.citydata　市町村のデータ
--------------------------------------------------------------*/
.citydata {
	clear: both;
	display: block;
	width: auto;
	height: auto;
	margin: 0 0 5px 0;
	padding: 0 0 10px 10px;
	border-left: 1px #7c705f solid;
	border-right: 1px #7c705f solid;
	border-bottom: 1px #7c705f solid;
	text-align: left;
}
.citydata img, p.citytreeflower img {
	float: left;
	margin: 0 5px 0 0;
}
.citydata p {
	float: left;
	margin: 0 10px 0 0;
	width: 220px;
}
.citydata p.cityflower {
	margin: 0;
	width: 175px!important;
}
.citydata p.citytree {
	clear: both;
	margin: 5px 0 0 0;
	padding: 5px 0 0 0;
	width: 710px!important;
	border-top: 1px #7c705f dashed;
}
.citydata p.citytreeflower {
	float: left;
	margin: 0;
	width: 350px!important;
}
.citydata hr {
	clear: both;
	width: 710px;
	height: 1px;
	margin: 10px 0!important;
	padding: 0;
	border: 1px #333333 dashed;
	background-color: #ffffff;
	color: #333333;
}
.citydata dl {
	display: block;
	clear: both;
	width: 718px;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.citydata dt {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0 0 10px 0;
	border-bottom: 1px #333333 dashed;
}
.citydata dd {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 10px 0 0 0;
	padding: 0;
}
.citydata dt img, .citydata dd img {
	float: left;
	width: 100px;
	height: 100px;
	margin: 0 9px 0 0;
	padding: 0;
}
.citydata dt p, .citydata dd p {
	float: left;
	width: 240px;
	height: auto;
	margin: 0 10px 0 0;
	padding: 0;
}
/* statistics　人口統計 */
.statistics {
	display: inline;
	float: left;
	width: 208px;
	height: auto;
	margin: 15px 0 0 10px;
	padding: 0;
}
.statistics li {
	display: block;
	clear: both;
	width: 208px;
	height: auto;
	margin: 0;
	padding: 0;
}
.statistics li span.tit {
	display: inline;
	float: left;
	width: 118px; /* 118px */
	height: auto;
	margin: 0;
	padding: 0;
	list-style: square inside;
}
.statistics li span.population {
	display: inline;
	float: right;
	width: 90px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
.statistics div.tit {
	display: inline;
	float: left;
	width: 118px;
	height: auto;
	margin: 0;
	padding: 0;
}
.statistics div.number {
	display: inline;
	float: right;
	width: 90px;
	height: auto;
	margin: 0;
	padding: 0;
}

.statisticsBox {
	display: block;
	clear: both;
	width: 210px;
	margin-left: 350px;
}
/* clearfix */
.statisticsBox {
	display: inline-block;
	display: block;
	zoom: 100%;
}
.statisticsBox:after {
	display: block;
	clear: both;
	height: 0;
	font-size: 0.1em;
	visibility: hidden;
	line-height: 0;
	content: ".";
}
/* Hides from IE-mac \*/
* html .statisticsBox {
	height: 1%;
}
.statisticsBox {
	display: block;
}
/* End hide from IE-mac */
.statisticsBox div.titlename {
	display: inline;
	float: left;
	width: 125px;
}
.statisticsBox div.number {
	display: inline;
	float: left;
	width: 85px;
}

/* 市町村の写真集 */
ul.cityimg {
	display: block;
	clear: both;
	margin: 5px 0 10px 0;
}
ul.cityimg li {
	display: block;
	float: left;
	width: 175px;
	height: auto;
	margin: 0 10px 0 0;
	padding: 0;
}
ul.cityimg li.end {
	display: block;
	float: left;
	width: 175px;
	height: auto;
	margin: 0 0 0 0;
	padding: 0;
}
ul.cityimg li img {
	width: 175px;
	margin: 0 0 5px 0;
}
/* KOKUHO de DATA */
table.graph {
	width: auto;
	height: auto;
	margin: 5px auto;
	padding: 0;
	border-collapse: collapse;
	border: 1px #cccccc solid;
	text-align: center;
}
.graph th {
	width: auto;
	height: auto;
	margin: auto;
	padding: 3px;
	background: #333333;
	border-collapse: collapse;
	border: 1px #cccccc solid;
	color: #ffffff;
	text-align: center;
}
.graph td {
	width: auto;
	height: auto;
	margin: auto;
	padding: 3px;
	border-collapse: collapse;
	border: 1px #cccccc solid;
	text-align: center;
}
ul.graph {
	display: block;
	clear: both;
	margin: 0 0 10px 27px;
}
ul.graph li {
	display: block;
	float: left;
	width: auto;
	height: auto;
	margin: 0 10px 0 0;
	padding: 0;
}
/* 職場の風景 */
.office {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 0;
	padding: 0;
}
.office li {
	display: inline;
	float: left;
	width: 365px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: center;
}
.office li img {
	margin: 0 auto 5px auto;
}

/* リストアイコンが丸 */
.listcircle {
	width: 410px;
	height: auto;
	margin: 0 0 0 30px;
	padding: 0;
}
.listcircle dl {
	display: block;
	width: 410px;
	height: auto;
	margin: 0;
	padding: 0;
}
.listcircle dt {
	float: left;
	width: 45px; /* 70px */
	height: auto;
	margin: 0 15px 0 0;
	padding: 3px 0 3px 25px;
	background: url(../img/common/li_l_container.gif) center left no-repeat;
}
.listcircle dd {
	float: left;
	width: 325px;
	height: auto;
	margin: 0;
	padding: 3px 0 3px 0;
}

/* インデント内のテキスト枠 */
.textwaku {
	width: 385px; /* 405px */
	height: auto;
	margin: 10px 0 0 30px;
	padding: 5px 10px;
	border: 1px #cccccc solid;
}
.textwaku h4 {
	width: auto;
	height: auto;
	margin: 0 0 5px 0;
	padding: 0 0 0 10px;
	border-left: 5px #8a9924 solid;
	font-weight: bold;
}
#tab7 .textwaku {
	clear: both;
	margin: 10px 0 10px 155px;
}
/* 郷土料理作り方 */
.foodhowto {
	clear: both;
	width: 385px; /* 405px */
	height: auto;
	margin: 10px 0 10px 155px;
	padding: 5px 10px;
	border: 1px #cccccc solid;
}
.foodhowto h4 {
	width: auto;
	height: auto;
	margin: 0 0 5px 0!important;
	padding: 0 0 0 10px!important;
	border-left: 5px #8a9924 solid;
	font-weight: bold;
}

/*--------------------------------------------------------------
localfood　郷土料理紹介
--------------------------------------------------------------*/
.localfood {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 0 0 20px 0;
	padding: 0;
}
.localfood h4 {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 10px 0 5px 0;
	padding: 0;
}
.localfood .waku {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 0;
	padding: 0;
}
.localfood .image {
	display: inline;
	float: left;
	width: 325px;
	height: auto;
	margin: 0;
	padding: 0;
}
.localfood .points {
	display: inline;
	float: right;
	width: 400px;
	height: auto;
	margin: 0;
	padding: 0;
}
/* .material　材料 */
.localfood .material {
	display: inline;
	float: left;
	width: 190px; /* 210px */
	height: auto;
	margin: 0;
	padding: 10px;
	border: 1px #cccccc solid;
}
.localfood .material h4 {
	width: auto;
	height: auto;
	margin: 0 0 5px 0!important;
	padding: 3px!important;
	background: #8a9924;
	color: #ffffff;
	font-weight: bold;
}
.localfood .material li {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 0;
	padding: 2px 0;
}
.localfood .material dl {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
}
.localfood .material dt {
	display: inline;
	float: left;
	width: 1em;
	height: auto;
	margin: 0;
	padding: 0;
}
.localfood .material dd {
	display: inline;
	float: left;
	width: auto;
	height: auto;
	margin: 0 0 0 5px;
	padding: 0 0 0 5px;
	border-left: 5px #cccccc solid;
}
/* .recipe　レシピ・作り方 */
.localfood .recipe {
	display: inline;
	float: right;
	width: 485px;
	height: auto;
	margin: 0;
	padding: 0;
}
.localfood .recipe li {
	display: block;
	clear: both;
	width: 485px;
	height: auto;
	margin: 0 0 10px 0!important;
	padding: 0;
	font-size: 120%;
}
.localfood .recipe li img {
	margin: 0 5px;
	vertical-align: baseline;
}
.localfood .recipe .table {
	margin: 10px 0 0 0;
	padding: 0;
	text-align: right;
}
.localfood .recipe .table table {
	float: right;
	border: 1px #cccccc solid;
	border-collapse: collapse;
}
.localfood .recipe th {
	width: 108px; /* 120px */
	padding: 3px 5px;
	background: #faf1ce;
	border: 1px #cccccc solid;
	border-collapse: collapse;
	font-weight: bold;
	text-align: center;
}
.localfood .recipe td {
	padding: 3px 5px;
	border: 1px #cccccc solid;
	border-collapse: collapse;
	text-align: center;
}
/* .recipe2　レシピ・作り方 */
.localfood .recipe2 {
	display: block;
	margin: 10px 0;
	padding: 0;
}
.localfood .recipe2 li {
	display: block;
	clear: both;
	height: auto;
	margin: 0 0 10px 0!important;
	padding: 0;
	font-size: 120%;
}
.localfood .recipe2 li img {
	display: inline-block;
	margin: 0 5px;
	vertical-align: baseline;
}


/*--------------------------------------------------------------
.walkingmap　ウォーキングマップ
--------------------------------------------------------------*/
.walkingmap {
	display: block;
	clear: both;
	margin: 20px 0 0 0;
	padding: 0;
}
.walkingmap a:hover img {
	opacity: 0.8;
	filter: alpha(opacity=80);
}
.walkingtable {
	display: block;
	clear: both;
	margin: 10px 0;
	padding: 0;
}
.walkingtable table {
	border: 1px #cccccc solid;
	border-collapse: collapse;
	color: #663300;
}
.walkingtable th {
	padding: 5px;
	background: #E1F0FF;
	border: 1px #cccccc solid;
	border-collapse: collapse;
	white-space: nowrap;
}
.walkingtable td {
	padding: 5px;
	border: 1px #cccccc solid;
	border-collapse: collapse;
}

/*--------------------------------------------------------------
健康標語
--------------------------------------------------------------*/
.hyougo01 {
	color: #ff3366;
	font-size: 140%;
	font-weight: bold;
}
.hyougo02 {
	color: #8a9924;
	font-size: 120%;
	font-weight: bold;
}

/*--------------------------------------------------------------
編集後記
--------------------------------------------------------------*/
.editornote {
	width: 570px;
	height: auto;
	margin: 10px auto;
	padding: 0;
	background: url(img/common/editornote_bg.gif) center top repeat-y;
}
.editornote p {
	width: 530px;
	height: auto;
	margin: 0 20px;
	padding: 0;
}

/*--------------------------------------------------------------
#backnumber　バックナンバー一覧ページ
--------------------------------------------------------------*/
#backnumber {
	display: block;
	width: 730px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
#backnumber ul {
	display: block;
	clear: both;
	width: 730px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
#backnumber li {
	display: block;
	width: 730px;
	height: auto;
	margin: 0;
	padding: 10px 0;
	border-bottom: 1px #dfd0c5 solid;
	color: #555046;
	line-height: 1em;
}
#backnumber li img {
	margin-right: 10px;
	vertical-align: middle;
}
#backnumber li a {
	margin: 0 15px;
	color: #4a81ac;
}
#backnumber li a:hover {
	color: #efa767;
	text-decoration: underline;
}

/*--------------------------------------------------------------
.webmagazinefootermenu　ウエブマガジンフッターメニュ
--------------------------------------------------------------*/
.webmagazinefootermenu {
	display: block;
	clear: both;
	width: auto!important;
	height: auto!important;
	margin: 20px 0 0 0!important;
	padding: 5px 10px!important;
	background: #ffffff!important;
	border: 1px #333333 solid!important;
	text-align: left!important;
}
.webmagazinefootermenu ul {
	display: block;
	clear: both;
	width: auto!important;
	height: auto!important;
	margin: 0!important;
	padding: 0!important;
	background: #ffffff!important;
	text-align: left!important;
}
.webmagazinefootermenu li {
	display: inherit!important;
	float: left;
	width: auto!important;
	height: auto!important;
	margin: 0 10px 5px 0!important;
	padding: 0 10px!important;
	background: #ffffff!important;
	border-right: 1px #333333 solid;
	text-align: left!important;
	white-space: nowrap;
}
.webmagazinefootermenu li a {
	padding: 0!important;
}

/*--------------------------------------------------------------
.webmagazinetable　ウエブマガジン内テーブル
--------------------------------------------------------------*/
.webmagazinetable {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 10px 0;
	padding: 0;
}
.webmagazinetable ul {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
}
.webmagazinetable li {
	display: inline;
	float: left;
	width: auto;
	height: auto;
	margin: 0 20px 0 0;
	padding: 0;
}
.webmagazinetable table {
	width: auto;
	height: auto;
	margin: 5px 0;
	padding: 0;
	border: 1px #cccccc solid;
	border-collapse: collapse;
}
.webmagazinetable th {
	width: auto;
	height: auto;
	margin: 0;
	padding: 3px 5px;
	background: #eeeeee;
	border: 1px #cccccc solid;
	border-collapse: collapse;
	text-align: center;
}
.webmagazinetable td {
	width: auto;
	height: auto;
	margin: 0;
	padding: 3px 5px;
	border: 1px #cccccc solid;
	border-collapse: collapse;
	text-align: left;
}

/*--------------------------------------------------------------
clearfix
--------------------------------------------------------------*/
.citydata, .citydata dl, .citydata dt, .citydata dd, .webmagazinefootermenu, .webmagazinefootermenu ul, .webmagazinefootermenu li, .waku {
	display: inline-block;
	display: block;
	zoom: 100%;
}
.citydata:after, .citydata dl:after, .citydata dt:after, .citydata dd:after, .webmagazinefootermenu:after, .webmagazinefootermenu ul:after, .webmagazinefootermenu li:after, .waku:after {
	display: block;
	clear: both;
	height: 0;
	font-size: 0.1em;
	visibility: hidden;
	line-height: 0;
	content: ".";
}
/* Hides from IE-mac \*/
* html .citydata, * html .citydata dl, * html .citydata dt, * html .citydata dd, * html .webmagazinefootermenu, * html .webmagazinefootermenu ul, * html .webmagazinefootermenu li, * html .waku {
	height: 1%;
}
.citydata, .citydata dl, .citydata dt, .citydata dd, .webmagazinefootermenu, .webmagazinefootermenu ul, .webmagazinefootermenu li, .waku {
	display: block;
}
/* End hide from IE-mac */