@charset "utf-8";
html, body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #FFFFFF;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #666666;
	height: 100%;
}
a {
	text-decoration:none;
	font-weight:bold;
}
a:link {
	color:#666666;
}
a:visited {
	color:#666666;
}
a:hover {
	color:#00FFFF;
}
a:active {
	color:#00FFFF;
}
img {
	border-style:none;
}
#container {
	width: 100%;  /* これにより、幅がブラウザの幅の 80% のコンテナが設定されます */
	background: #FFFFFF;
	margin: 0 auto; /* 自動マージン（幅と連動）により、ページが中央揃えになります */
	text-align: left; /* この設定は body エレメントの text-align: center より優先されます。 */
	position: relative;       /* フッターの為の位置決め用 */
	height: auto !important;  /* IE6対策：この2行で */
	height: 100%;             /* IE6対策：擬似的にmin-heightと同じことをさせてる */
	min-height: 100%;         /* 中身が少なくても高さ100%にする */
}
body > #container {
	height: auto;
}
/*========================  header 関連  ======================*/

#headerbg {
	width:100%;
	min-width:1000px;
}
#header {
	width: 1000px;
	margin: 0 auto;
	border-right: 1px solid #DDDDDD;
	border-left: 1px solid #DDDDDD;
}
#header h1 {
	margin: 0; /* #header div の最後のエレメントのマージンを 0 に設定することにより、マージンの相殺（div 間の原因不明のスペース）が回避されます。div の周囲に境界線が適用されている場合は、境界線によってマージンの相殺が回避されるため、この操作は不要です */
	padding: 10px 0; /* マージンの代わりに余白を使用して、エレメントを div の端に接触しない位置に維持することができます */
}
/* #sidebar1 に関するヒント：
1. 単位はパーセントであるため、サイドバーで余白を使用することは回避してください。標準に準拠したブラウザでは、余白は幅に追加されるため、実際の幅が不特定の幅になります。 
2. 「.main #sidebar1 p」ルールで見られるように、div の端と div に含まれるエレメントの間のスペースは、エレメントに左マージンと右マージンを適用することによって設定できます。
3. 親エレメントが表示された後に Internet Explorer によって幅が計算されるため、単位がパーセントの列では原因不明のバグが発生することがあります。最終的な表示をより正確に予測する必要がある場合は、単位がピクセルの列に変更することができます。
*/

#top-bar {
	background: -moz-linear-gradient(top, rgba(102, 51, 0, 1) 0%, rgba(102, 51, 0, 0.76) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(102, 51, 0, 1)), color-stop(100%, rgba(102, 51, 0, 0.76))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(102, 51, 0, 1) 0%, rgba(102, 51, 0, 0.76) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(102, 51, 0, 1) 0%, rgba(102, 51, 0, 0.76) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(102, 51, 0, 1) 0%, rgba(102, 51, 0, 0.76) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(102, 51, 0, 1) 0%, rgba(102, 51, 0, 0.76) 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#663300', endColorstr='#c2663300', GradientType=0 ); /* IE6-9 */
	height: 40px;
	width: 100%;
}
#header-top {
	background: #ffff99;
	background: -moz-linear-gradient(top, #ffff70 0%, #ffffb8 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffff70), color-stop(100%, #ffffb8));
	background: -webkit-linear-gradient(top, #ffff70 0%, #ffffb8 100%);
	background: -o-linear-gradient(top, #ffff70 0%, #ffffb8 100%);
	background: -ms-linear-gradient(top, #ffff70 0%, #ffffb8 100%);
	background: linear-gradient(to bottom, #ffff70 0%, #ffffb8 100%);
	height: 70px;
}
#header-image {
	height: 250px;
	width: 1000px;
}
/*========================  main contents 関連  ======================*/

#wraper {
	width:1000px;
	margin:0 auto;
	border-right: 1px solid #DDDDDD;
	border-left: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;
	padding-bottom: 40px;
}
#sidebar1 {
	float: right; /* このエレメントはフローティングエレメントであるため、幅が設定されている必要があります */
	width: 28%; /* 上余白と下余白により、この div 内に視覚的なスペースが設定されます */
	margin: 30px 10px;
}
#sidebar1 h3, #sidebar1 p {
	margin-left: 10px; /* サイドバーに配置されるすべてのエレメントに左マージンと右マージンが設定されている必要があります */
	margin-right: 10px;
}
/* #mainContent に関するヒント：
1. #mainContent と #sidebar1 の間のスペースは、#mainContent div の右マージンによって設定されます。#sidebar1 div に含まれるコンテンツの量に関係なく、#sidebar1 div のスペースは維持されます。#sidebar1 のコンテンツが終了した後のスペースに #mainContent div のテキストを挿入するには、この右マージンを削除します。
2. サポートされている最小解像度（800 x 600）でのフローティングエレメントの落下を回避するには、#mainContent div 内のエレメントを 430px 以下にする必要があります（イメージを含む）。
3. 下の Internet Explorer の条件分岐コメントでは、#mainContent に「hasLayout」を設定するのにズームプロパティが使用されます。これにより、いくつかの IE 固有のバグが回避されます。
*/
#mainContent {
	margin: 0 30% 70px 10px; /* 左マージンは、適切に整列されるように、ヘッダーおよびフッターのマージンと同じである必要があります。 */
	padding: 1em 1em 3em;
}
/* 再使用できる各種クラス */
.fltrt { /* このクラスは、ページ上でフローティングエレメントを右側に配置するのに使用できます。プローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスは、ページ上でフローティングエレメントを左側に配置するのに使用できます。プローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* このクラスは、div またはブレークエレメントに適用される必要があり、また、フローティングエレメントが完全に含まれているコンテナの末尾の直前にある最後のエレメントである必要があります */
	clear:both;
}
/*========================  footer関連  ======================*/

#footerbg {
	width: 100%;
	min-width:1000px;
}
#footer {
	position: absolute;
	bottom: 0px;
	height: 100px;
	width: 100%;
	text-align: center;
}
#footer p {
	margin: 0; /* フッターの最初のエレメントのマージンを 0 に設定することにより、マージンの相殺（div 間のスペース）が回避されます */
	padding: 10px 0; /* このエレメントの余白により、マージンの相殺を発生させることなく、マージンの効果とまったく同じように、スペースが設定されます */
	height: 100%;
}
#bottom-bar {
	background: -moz-linear-gradient(top, rgba(102, 51, 0, 0.75) 0%, rgba(102, 51, 0, 1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(102, 51, 0, 0.75)), color-stop(100%, rgba(102, 51, 0, 1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(102, 51, 0, 0.75) 0%, rgba(102, 51, 0, 1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(102, 51, 0, 0.75) 0%, rgba(102, 51, 0, 1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(102, 51, 0, 0.75) 0%, rgba(102, 51, 0, 1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(102, 51, 0, 0.75) 0%, rgba(102, 51, 0, 1) 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf663300', endColorstr='#663300', GradientType=0 ); /* IE6-9 */
	height: 40px;
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 0px;
}
div.outer {
	display: table;
	height: 40px;
	width: 100%;
}
* html div.outer {
	position: relative;
}
*+html div.outer {
	position: relative;
}
div.vertical-middle {
	vertical-align: middle;
	display: table-cell;
}
* html div.vertical_middle {
	position: absolute;
	top: 50%;
}
*+html div.vertical_middle {
	position: absolute;
	top: 50%;
}
div.vertical-middle p.inner {
	margin: 0px;
	color: #FFFFFF;
}
* html div.vertical_middle p.inner {
	position: relative;
	top: -50%;
}
*+html div.vertical_middle p.inner {
	position: relative;
	top: -50%;
}
.toplogo img {
	margin: 5px 10px;
}
.topinfo {
	float: right;
	vertical-align: middle;
	display: table-cell;
	height: 70px;
}
.topinfo img {
	margin-right: 10px;
	margin-left: 10px;
	vertical-align: middle;
}
.toplogo {
	float: left;
}
.menuRibbon {
	margin:0 0 10px 0;
	padding:2px 8px;
	background:#f4e804;
	color:#644602;
	line-height:140%;
	font-weight:bold;
}
.menuRibbonLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	background:#f9ea81;
	color:#a79003;
	line-height:140%;
	font-weight:bold;
}
.menuTab {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 0 5px;
	border-color: #f9ea81;
	border-style:solid;
	background:#f4e804;
	color:#644602;
	line-height:140%;
	font-weight:bold;
}
.menuTabLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 0 5px;
	border-color:#f4e804;
	border-style:solid;
	background:#f9ea81;
	color:#a79003;
	line-height:140%;
	font-weight:bold;
}
.menuTabDouble {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 5px;
	border-color: #f9ea81;
	border-style:solid;
	background:#f4e804;
	color:#644602;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}
.menuTabDoubleLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 5px;
	border-color:#f4e804;
	border-style:solid;
	background:#f9ea81;
	color:#a79003;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}
.menuLine {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 5px 0;
	border-color: #f9ea81;
	border-style:solid;
	background:#f4e804;
	color:#644602;
	line-height:140%;
	font-weight:bold;
}
.menuLineLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 5px 0;
	border-color:#f4e804;
	border-style:solid;
	background:#f9ea81;
	color:#a79003;
	line-height:140%;
	font-weight:bold;
}
.menuLineDouble {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:5px 0;
	border-color: #f9ea81;
	border-style:solid;
	background:#f4e804;
	color:#644602;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}
.menuLineDoubleLightW {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:5px 0;
	border-color:#f4e804;
	border-style:solid;
	background:#fff;
	color:#a79003;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}
.menuLineDoubleLight {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:5px 0;
	border-color:#f4e804;
	border-style:solid;
	background:#f9ea81;
	color:#a79003;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}
.menuLineLightW {
	margin:0 0 10px 0;
	padding:2px 8px;
	border-width:0 0 5px 0;
	border-color:#f4e804;
	border-style:solid;
	background:#fff;
	color:#a79003;
	line-height:140%;
	font-weight:bold;
}
.heading1 {
	color:#644602;
	border:solid 1px #f4e804;
	padding: 5px;
	border-radius: 5px;
	background: #ffff99;
	-moz-border-radius: 5px; /* FF */
	background: -moz-linear-gradient(top, #ffffb8, #ffff70); /* FF */
	-webkit-border-radius: 5px;/* Webkit */
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffb8), to(#ffff70));/* Webkit */
	-pie-background:linear-gradient(top, #ffffb8, #ffff70); /* ie */
	behavior: url(images/PIE.htc);  /* ie */
	margin: 10px auto;
}
.heading2 {
	margin:0 10px 10px 10px;
	padding:2px 8px;
	border-width:0 0 3px 10px;
	border-color:#f4e804;
	border-style:solid;
	background:#fff;
	color:#6A5A02;
	line-height:140%;
	font-weight:bold;
}
.heading3 {
	margin:10px 0 0 0;
	padding:2px 8px;
	border-width:5px 0;
	border-color:#996600;
	border-style:solid;
	background:#fff;
	color:#663300;
	line-height:140%;
	font-weight:bold;
	text-align:center;
}
.heading1 span {
	border-left:5px #f4e804 solid;
	padding-left:10px;
}
.subContent {
	font-size: 15px;
	padding: 15px 25px;
}
.sidebarContent {
	padding: 5px;
	font-size: 14px;
}
.subContent p.images {
	display: inline;
	padding-bottom: 10px;
}
.subContent p.pics {
	display: inline;
}
p.images img {
	float: right;
}
.clear {
	clear: both;
	visibility: hidden;
	height: 20px;
}
.subContent .images img {
	margin: 10px 15px;
	float: right;
}
.subContent .pics img {
	margin: 10px 15px;
	float: right;
	border: 1px solid #DDDDDD;
}
.pics img {
	border: 1px solid #DDDDDD;
}
.strong {
	font-size: 14px;
	font-weight: bold;
}
/*-------- 角丸テーブル用CSS --------*/
table {
 *border-collapse: collapse; /* IE7 and lower */
	border-spacing: 0;
	width: 100%;
}
.bordered {
	border: solid #ccc 1px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 0 1px 1px #ccc;
	-moz-box-shadow: 0 1px 1px #ccc;
	box-shadow: 0 1px 1px #ccc;
}
.bordered tr:hover {
	background: #fbf8e9;
	-o-transition: all 0.1s ease-in-out;
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-ms-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
}
.bordered td, .bordered th {
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	padding: 10px;
	text-align: left;
}
.bordered th {
	background-color: #99FFFF;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#99FFFF), to(#CCFFFF));
	background-image: -webkit-linear-gradient(top, #99FFFF, #CCFFFF);
	background-image:    -moz-linear-gradient(top, #99FFFF, #CCFFFF);
	background-image:     -ms-linear-gradient(top, #99FFFF, #CCFFFF);
	background-image:      -o-linear-gradient(top, #99FFFF, #CCFFFF);
	background-image:         linear-gradient(top, #99FFFF, #CCFFFF);
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset;
	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, .8) inset;
	box-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset;
	border-top: none;
	text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
}
.bordered td:first-child, .bordered th:first-child {
	border-left: none;
}
.bordered th:first-child {
	-moz-border-radius: 6px 0 0 0;
	-webkit-border-radius: 6px 0 0 0;
	border-radius: 6px 0 0 0;
}
.bordered th:last-child {
	-moz-border-radius: 0 6px 0 0;
	-webkit-border-radius: 0 6px 0 0;
	border-radius: 0 6px 0 0;
}
.bordered th:only-child {
	-moz-border-radius: 6px 6px 0 0;
	-webkit-border-radius: 6px 6px 0 0;
	border-radius: 6px 6px 0 0;
}
.bordered tr:last-child td:first-child {
	-moz-border-radius: 0 0 0 6px;
	-webkit-border-radius: 0 0 0 6px;
	border-radius: 0 0 0 6px;
}
.bordered tr:last-child td:last-child {
	-moz-border-radius: 0 0 6px 0;
	-webkit-border-radius: 0 0 6px 0;
	border-radius: 0 0 6px 0;
}
.bordered th {
	color: #666666;
}
/*------------------------------------------*/

/*//////////////// MAIL FORM CSS //////////////////*/
#mailform {
	color:#999999;
	font-size:12px;
	margin-top: 30px;
	margin-bottom: 30px;
	margin-left: 30px;
	margin-right: 30px;
	padding: 20px;
	border: thin dotted #CCCCCC;
}
#mailform table {
	border-collapse:collapse;
}
#mailform table td {
	padding:5px;
	font-size:100%;
	color:#666;
}
#mailform table td.l_Cel {
	width:150px;
}
/*//////////////// MAIL FORM CSS END //////////////////*/
#pagetop {
	background-position: right;
	text-align: right;
	font-size: 12px;
	padding-top: 10px;
	border-top: 3px solid #f4e804;
}
table.keiraku01 {
	margin: 5px;
}
table.keiraku01 td {
	text-align: left;
	vertical-align: top;
	padding: 20px;
}

#top-bar #h1-title {
	width: 1000px;
	margin: 0 auto;
	height: 40px;
	vertical-align: bottom;
}
#h1-title h1 {
	font-size: 12px;
	margin: 0px;
	color: #FFFFFF;
	text-align: right;
	font-weight: normal;
}
.nayami-list {
	list-style-type: square;
	text-align: left;
	margin: 0px;
	padding: 0px;
	list-style-position: inside;
}
.nayami-list li {
	margin-bottom: 5px;
}
.subContent p {
	line-height: 1.5em;
}