@charset "utf-8";
@import "default.css";



/*STYLES*/
/*******************************************************************/
ol { margin: 0 40px 10px;}
ol li { list-style: decimal;}
strong { padding: 0 4px; background: #FC0; color: #333;}
.arrow { padding-left: 14px; background: url(../images/arrow.gif) 0 center no-repeat;}
.mail { padding-left: 14px; background: url(../images/mail.gif) 0 center no-repeat;}
.red { color: #C00;}



/*LAYOUT*/
/*******************************************************************/
body { background: #FFFFF4;}
div#top { position: relative; width: 100%; margin: 0;}
div#container {
	position: absolute; top: 0; left: 0;
	width: 100%;
	text-align: center;
	z-index: 10;
}
div#title { z-index: -1;}
div#pr { position: absolute; top: 0; right: 0; width: 234px;}
div#header, div#main, div#in {
	position: relative;
	clear: both;
	width: 960px;
	margin: 0 auto;
	text-align: left;
}
div#main { margin-bottom: 20px;}
.section { position: relative; width: 200px; margin: 5px 20px; float: left; display: inline;}
.threeColumn { background: url(../images/three_in.gif) 0 0 repeat-y; zoom: 100%;}
.twoColumn { background: url(../images/two_in.gif) 0 0 repeat-y; zoom: 100%;}
.bestColumn { clear: both; position: relative; background: url(../images/best_in.gif) 0 0 repeat-y; zoom: 100%;}
.threeColumn::before,
.threeColumn::after,
.twoColumn::before,
.twoColumn::after,
.bestColumn::after { display: block; height: 18px; content: " "; background: 0 0 no-repeat;}
.threeColumn::before { background-image: url(../images/three_top.gif);}
.threeColumn::after { clear: both; background-image: url(../images/three_bottom.gif);}
.twoColumn::before { background-image: url(../images/two_top.gif);}
.twoColumn::after { clear: both; background-image: url(../images/two_bottom.gif);}
.bestColumn::after { clear: both; height: 36px; background-image: url(../images/best_bottom.gif);}
.threeColumn .long { width: 440px;}
.twoColumn .long { width: 680px;}



/*HEADER*/
/*******************************************************************/
div#header {
	height: 180px;
}
div#header h1 a, div#header div a {
	position: absolute; top: 26px; left: 0;
	text-decoration: none;
	border: none;
}
div#header ul { position: absolute; top: 130px; left: 0;}
div#header li { float: left;}
div#header li a {
	display: block;
	height: 34px;
	margin-left: 30px;
	background-repeat: no-repeat;
	background-position: 0 0;
	border: none;
	text-indent: -9999px; overflow: hidden;
}
div#header li#btn01 a { width: 71px; background-image:url(../images/btn01.gif);}
div#header li#btn02 a { width: 133px; background-image:url(../images/btn02.gif);}
div#header li#btn03 a { width: 118px; background-image:url(../images/btn03.gif);}
div#header li#btn04 a { width: 78px; background-image:url(../images/btn04.gif);}
div#header li#btn05 a { width: 82px; background-image:url(../images/btn05.gif);}
div#header li#btn06 a { width: 88px; background-image:url(../images/btn06.gif);}
div#header li#btn07 a { width: 68px; background-image:url(../images/btn07.gif);}
div#header li a:hover, div#header li.select a { background-position: 0 -34px;}
div#breadcrumbs { margin-left: 30px;}
div#breadcrumbs a { border: none; color: #666;}



/*TITLE*/
/*******************************************************************/
div#main h1 {
	position: absolute; top: 0; left: -20px;
	width: 690px; height: 92px;
	text-indent: -9999px;
}
h2, .side h3 {
	margin-bottom: 10px;
	height: 22px;
	background: 0 0 no-repeat;
	text-indent: -9999px;
}
h2.plain {
	height: 30px !important;
	margin-top: 30px;
	padding: 0 0 4px 50px;
	background: url(../images/h2.gif) left bottom no-repeat !important;
	text-indent: 1px; font-size: 130.77%;
}
h3, h4 { margin-bottom: 10px; color: #333;}
h3 span { font-variant: normal;}

.about h1 { background-image:url(../images/h1_about.gif);}
.list h1 { background-image:url(../images/h1_list.gif);}
.access h1 { background-image:url(../images/h1_access.gif);}
.map h1 { background-image:url(../images/h1_map.gif);}
.reasonable h1 { background-image:url(../images/h1_reasonable.gif);}
.privacy h1 { background-image:url(../images/h1_privacy.gif);}
.site h1 { background-image:url(../images/h1_site.gif);}
.link h1 { background-image:url(../images/h1_link.gif);}

.blog h2 { background-image:url(../images/t_blog.gif); height: 68px;}
.about h2 { background-image:url(../images/t_about.gif); height: 68px;}
.mobile h2, .mobile h3 { background-image:url(../images/t_mobile-trans.png); position: absolute; top: -24px; left: -30px; width: 230px; height: 94px;}
.bestColumn h2 { background-image:url(../images/t_best.gif); height: 122px;}
.access h2 { background-image:url(../images/t_access.gif);}
.reasonable h2, .side .reasonable h3 { background-image:url(../images/t_reasonable.gif);}
.fortune h2 { background-image:url(../images/t_fortune.gif);}
.weather h2 { background-image:url(../images/t_weather.gif);}
.sponsor h2, .sponsor h3 { background-image:url(../images/t_sponsor.gif);}

.entry h3 { background-image:url(../images/t_entry.gif);}
.sblog h3 { height: 63px; background-image:url(../images/t_sblog.gif);}
.search h3 { background-image:url(../images/t_search.gif);}
.tagcloud h3 { background-image:url(../images/t_tagcloud.gif);}



/*CONTENTS*/
/*******************************************************************/
.contents { margin-top: 100px;}
.widget { margin-bottom: 15px; padding-bottom: 15px; border-bottom: solid 1px #999;}

.blog p { position: absolute; top: 4px; right: 0;}
.blog dt { clear: both; padding: 10px 0 5px; border-top: dotted 1px #CCC; color: #7FC543;}
.blog dt a { margin-left: 10px; font-weight: bold;}
.blog dd.thum { float: left; width: 80px; padding: 0 5px 10px 0;}
.blog dd.thum img { border: solid 4px #CCC;}

.mobile .contents { margin-top: 80px;}

.bestColumn ol { margin: 0 0 0 30px; padding: 0;}
.bestColumn li { position: relative; width: 270px; margin: 0 17px; float: left; display: inline;}
.bestColumn h3 { position: absolute; top: -66px; left: 60px;}
.bestColumn h4 { padding-top: 5px; text-align: center; font-size: 130.77%;}
.bestColumn h5 { font-size: 115.38%; color: #7FC543;}
.bestColumn a, .bestColumn a:visited { border: none; color: #000 !important;}
.bestColumn .photo { text-align: center;}
.bestColumn .photo img { border: solid 5px #CCC;}
.bestColumn .more { position: absolute; top: 20px; right: 110px; text-align: right;}

.fortune h4 { margin-bottom: 0;}
.fortune img { padding: 0 3px;}
.fortune .small { margin-bottom: 5px; padding-bottom: 5px; border-bottom: solid 1px #CCC;}

.weather table { border-top: solid 1px #CCC; border-left: solid 1px #CCC;}
.weather td { border-right: solid 1px #CCC; border-bottom: solid 1px #CCC; vertical-align: top;}
.weather h3 { width: 160px; padding: 20px 0 36px; text-align: center; background: url(../images/fukidashi.gif) center no-repeat; font-size: 130.77%; color: #7FC543;}
.weather h4 { text-align: center; background: #F5F5F5;}
.weather p { padding: 0 5px 5px;}
.weather p.more { position: absolute; top: 0; right: 0;}

.about td { padding: 10px 5px 10px 0; vertical-align: top; border-bottom: solid 1px #CCC;}
.about td img { border: solid 4px #CCC;}

.list table { width: 100%; margin-bottom: 20px;}
.list tr.ex { background: #F5F5F5;}
.list td { width: 33%; padding: 10px; vertical-align: top; border-top: solid 1px #CCC;}
.list td.pickup { background: url(../images/recommend.gif) right bottom no-repeat #FFF; border: solid 2px #7FC543;}
.list td h3 { }
.list td p.thum { float: left; padding-right: 10px;}
.list td p.thum a { border: none;}
.list td img { width: 88px; height: 66px; border: solid 4px #CCC;}

.access table { margin-bottom: 30px;}
.access td { padding: 5px 10px;}

.reasonable table { width: 100%; margin-bottom: 30px; border-top: solid 1px #CCC; border-left: solid 1px #CCC;}
.reasonable table table { width: auto; margin: 0;}
.reasonable th, .reasonable td { padding: 5px; border-right: solid 1px #CCC; border-bottom: solid 1px #CCC; vertical-align: top;}
.reasonable th { background: #F5F5F5;}

.navi { margin-bottom: 20px; text-align: center;}
.navi a { padding: 2px 4px; border: solid 1px #CCC;}

table.ad td { width: auto !important; padding: 0 2px !important; border: none !important; border-top: double 2px #7FC543;}



/*FOOTER*/
/*******************************************************************/
div#footer {
	clear: both;
	height: 190px;
	background: url(../images/footer.jpg) center bottom no-repeat;
	font-size: 76.92%;
}
div#footer a { border: none;}
div#in { width: 940px; text-align: center;}
div#footer li { float: left; margin-right: 10px; padding-right: 10px; border-right: solid 1px #CCC;} 
div#footer div.pagetop { float: right;}
div#footer address { font-style: normal; letter-spacing: 0.2em;}