@charset "utf-8";

/* base 1 ********************************************/

body{
	margin: 0 0 10px;
	padding: 0;
	line-height: 160%;
	color: #282824;
	background: #efefdc url(../img/bg.gif) top repeat-x;
	font-family: Meiryo, Verdana, "メイリオ", "ＭＳ Ｐゴシック", Hiragino Kaku Gothic Pro, Osaka;
	font-size: 78%;
	text-align:center;
}

#container{
	margin:0 auto;
	width: 902px;
	background: #fff url(../img/bg_container.gif);
}
#wrap{
	padding: 0 1px;
	background: url(../img/bg_content_2.gif);
	text-align:left;
}
#index #wrap{ background: url(../img/bg_content_1.gif);}

#header{
	height: 80px;
	position: relative;
	background: url(../img/header.gif);
}

#navi_top{
	position: absolute;
	top: 23px;
	left: 725px;
	width: 160px;
	height: 22px;
}

#title{
	margin: 0 0 20px;
	padding: 0 0 5px;
	background: url(../img/line_bg.gif) no-repeat bottom;
}
#contents{
	float: right;
	width: 660px;
}

.article{ padding: 0 25px 15px 0;}

#navi_left{
	float: left;
	width: 200px;
}

#footer{
	margin: 0;
	clear: both;
	border-bottom: #d0d0b0 solid 1px;
	background: url(../img/line_bg.gif) no-repeat top #fff;
}
div.form2{
	text-align: right;
}

/* base 2 ********************************************/

a{ color: #177c12;}
a:hover{ color: #3bb535;}

p{ margin: 0 0 0.7em;}

img{ border: none;}

.imgL{ margin: 0 15px 10px 0; float: left;}
.imgR{ margin: 0 0 10px 15px; float: right;}

.sml{ font-size: 80%;}

h1{
	margin: 0;
	padding: 0;
	font-size: 120%;
}

h2{
	margin: 0 0 15px;
	padding: 0 20px;
	clear: both;
	border-top: 1px solid #c1c19e;
	background: url(../img/h2.gif) bottom;
	line-height: 35px;
	font-size: 110%;
}

h3{
	margin: 0 0 10px;
	padding: 0 0 1px 15px;
	background: url(../img/h3.gif) repeat-y left center;
	line-height: 175%;
	font-size: 130%;
}

h4{
	margin: 0 0 10px;
	background: #efefdc;
	font-size: 100%;
}

/* --- GET HIGHT --- */

.hght{
	display: block;
	min-height: 0;
}
.hght:after{
	content: " ";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
}
* html .hght{ display: inline-block;}
/* exclude ie mac \*/
* html .hght{ height: 1%;}
/* all brouser */

/* --- PRINT --- */

@media print {
body { _zoom: 0.85;}
}

/* --- justify --- */

/* exclude ie mac \*/
#contents{ text-align: justify; text-justify: inter-ideograph;}
/* all brouser */

/* --- span --- */

#header span{ display: none;}

/* header ********************************************/

#header #LOGO,
#header #tel,
#header #address{ position: absolute;}

#header a{ display: block;}

/* --- h1 --- */

#header h1{
	margin: 0 15px;
	text-align: right;
	font-size: 11px;
	font-weight: normal;
}

/* --- LOGO --- */

#header #LOGO{
	top: 10px;
	left: 25px;
}
#header #LOGO, #header #LOGO a{ width: 175px; height: 55px;}
#header #tel{
	padding: 35px 0 0;
	width: 300px;
	height: 1em;
	top: 18px;
	left: 290px;
	font-weight: bold;
}
#header #address{
	width: 500px;
	height: 1em;
	top: 50px;
	right: 15px;
	text-align: right;
	font-size: 11px;
}

/* --- NAVIGATION --- */

#navi_top a{ width: 160px; height: 22px;}

/* navi_left ********************************************/

#navi_left ul{ margin: 0; padding: 0; list-style: none;}
#navi_left li{
	margin: 0 0 10px;
	float: left;
	display: block;
	width: 210px;
	height: 40px;
	background: url(../img/navi_left.gif);
	line-height: 40px;
	font-size: 12px;
	overflow: hidden;
}
#navi_left li a{
	padding: 0 0 0 50px;
	display: block;
	color: #282824;
	width: 160px;
	_width: 210px;
	height: 40px;
	text-decoration: none;
}
#navi_left li a:hover{ text-decoration: underline;}

/* contents ********************************************/

/* --- LIST --- */

#about{ padding: 5px 0 30px;}
#about div{ margin: 0; clear: both;}
#about .hght{ margin: 0 0 5px; background: url(../img/line_150.gif) bottom left no-repeat;}
#about div div{
	padding: 0 0 0 20px;
	float: left;
	clear: none;
	background: url(../img/arrow_1.gif) no-repeat left;
	width: 80px;
}
#about p{ margin: 0 0 5px; float: right; width: 450px;}

/* --- index --- */

#index .article{ padding: 0 20px 15px 0;}

#contents_L{
	float: left;
	width: 440px;
}
#contents_R{
	float: right;
	width: 190px;
}
#contents_R img{ margin: 0 0 6px; vertical-align: bottom;}
#contents_R p{
	margin: 0 20px 8px 0;
	line-height: 140%;
	font-size: 90%;
}

#twitter_update_list{
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: 140%;
	text-align: left;
}
#twitter_update_list li{
	margin: 0 0 0.3em;
	padding: 0 0 0.3em;
	border-bottom: #d0d0b0 solid 1px;
}
#twitter-link{
	display:block;
	text-align: right;
	font-size: 90%;
}

/* --- denka --- */

.pink, .blue, .orange, .green, .brown{ margin: 0 0 15px; padding: 13px;}
.pink h3, .blue h3, .orange h3, .green h3{ margin: 0;}
.pink{ border: solid 2px #f4d5d5;}
.blue{ border: solid 2px #d5e5f4;}
.orange{ border: solid 2px #ffdea4;}
.green{ border: solid 2px #c7edb1;}
.brown{ border: solid 2px #e8e8d3;}
.about h3,.brown h3{ font-size: 120%;}
.red{
	margin: 0 0 10px;
	padding: 4px;
	color: #d7000e;
	border: dotted 1px #ff515d;
	font-weight: bold;
}
.brown .red{ line-height: 200%; text-align: center; vertical-align: middle;}
.brown .yellow img{ margin: 0 3px;}
.red div{ 
	padding: 12px;
	background: #d7000e;
	color: #fff;
	text-align: center;
	font-size: 130%;
	font-weight: bold;
}
.brown p{ margin: 0; color: #282824; line-height: 140%; font-weight: normal;}
.yellow{
	margin: 0;
	padding: 12px;
	background: #fffca2;
	text-align: center;
}
.yellow div.arrow_down{
	padding: 33px 0 0;
	background: url(../denka/icon_arrow.gif) center 5px no-repeat;
	line-height: 200%;
	font-weight: bold;
}
.yellow span{ color: #d7000e; font-size: 200%; font-weight: bold;}
.f1_l{
	float: left;
	width: 399px;
	background: url(../denka/icon_plus.gif) no-repeat center center;
	line-height: 130%;
	font-size: 80%;
}
.f1_r{ float: right; width: 190px;}
.f1_l h4{ margin: 10px 0; padding: 2px; text-align: center; font-size: 120%;}
.f1_l img{ margin: 0 0 5px; vertical-align: bottom;}
.fa_l{ float: left; width: 190px;}
.fa_r{ float: right; width: 190px;}

.f2_l{ float: left; width: 370px;}
.f2_r{ float: right; width: 220px;}
.brown .yellow .fb_l{
	padding: 0 30px 0 0;
	float: left;
	background: url(../ih/arrow.gif) no-repeat right;
	width: 200px;
	_width: 230px;
	text-align: right;
}
.brown .yellow .fb_r{
	padding: 0;
	float: right;
	width: 115px;
	background: none;
	line-height: 220%;
}


/* contents others ********************************************/

/* footer ********************************************/


#footer_inner{
	padding: 10px 20px 0;
	line-height: 150%;
}
#footer_inner p{ margin: 0 0 0.5em; padding: 0 300px 0 0;}
#footer_inner .sml{ line-height: 130%;}

#footer #copy{
	padding: 10px 20px;
	border-top: #d0d0b0 solid 1px;
	color: #7f7f73;
}

/* form ********************************************/

form{
	margin: 0;
	padding: 0;
}

#form{ margin: 0 10px 15px;}
#form h3{ margin: 15px 0 5px; font-size: 110%;}
#form img{ margin: 5px 0 0;}
#form span, #form p.error{ color: #b80002; font-weight: bold;}
#form p{ margin: 0 0 10px; text-align: center;}
#form p.lg{ font-size: 110%;}
#form p.error{ font-size: 110%;}
#form p.lft{ text-align: left;}
#form p.rgt{ text-align: right;}

#form div.hght{ background: url(../img/line_150.gif) no-repeat bottom left;}
#form .hght{ clear: both;}
#form .l, #form .le{
	padding: 6px 0 6px 10px;
	float: left;
	clear: none;
	width: 150px;
	background: none;
}
#form .r, #form .re{
	margin: 6px 0;
	padding: 0;
	float: right;
	width: 450px;
	background: none;
}
#form div.error{ background: url(../img/line_error.gif) no-repeat bottom left;}
#form div.error .r div{ color: #b80002; background: none;}
#form div.end{ background: none;}

#form select{ margin: 0;}
#form textarea{ width: 400px; height: 120px;}
#form input.input{ width: 250px;}
#form input.trans{ width: 80px;}