@charset "utf-8";

/*reset*/
/*******************************************************************/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin: 0; padding: 0;}
address,caption,cite,code,dfn,em,strong,th,var { font-style: normal;}
table { border-collapse: collapse; border-spacing: 0;}
q:before,q:after { content: '';}
object,embed { vertical-align: top;}
hr,legend { display: none;}
h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal;}
img,abbr,acronym,fieldset { border: 0;}
li { list-style-type: none;}
a:link { color: #00345C; text-decoration:none;}
a:visited { color: #4E4E87; text-decoration:none;}
a:hover { color: #00345C; text-decoration: underline;}
a:active { color: #00345C; text-decoration:none;}
body {
	font-size: 81.25%;
	font-family:"MS PGothic","Osaka",Arial,sans-serif;
	line-height: 1.4;
}
#container, .section { position: relative; width: 970px; margin: 0 auto; text-align: left;}
#wrapper { width: 100%; text-align: center; color: #00345C;}
th, td { font-size: 85%;}
p { padding: 0 0 10px 0;}
ul, ol { margin: 10px 10px 10px 30px;}
ul li { list-style: disc;}
ol li { list-style: decimal;}
strong a { color: #F5F5F5;}



/*STYLES*/
/*******************************************************************/
.small { font-size: 85%;}
.normal { font-size: 100%;}
.large { font-size: 123.1%;}
.largest { font-size: 182%;}
/*
10:77%   15:116%     20:153.9%   25:189%
11:85%   16:123.1%   21:161.6%   26:197%
12:93%   17:131%     22:167%
13:100%  18:138.5%   23:174% 
14:108%  19:146.5%   24:182%
*/

/*box-shadow*/
#tab li a { -moz-box-shadow: 2px 2px 0 #666; -webkit-box-shadow: 2px 2px 0 #666; box-shadow: 2px 2px 0 #666; filter:progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#000000'); zoom:1;}
.box,
#menu li a,
.list li,
.selected { -moz-box-shadow: 2px 2px 0 #BBB; -webkit-box-shadow: 2px 2px 0 #BBB; box-shadow: 2px 2px 0 #BBB; filter:progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#999999'); zoom:1;}

/*border-radius*/
strong,
#header li a,
#tab li a,
.box,
#menu li a,
.list li li,
.selected,
.selected span a { -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;}

/*clear*/
#container,
.box,
.selected { display:inline-block; clear: both;}
#container:after,
.box:after,
.selected:after { content:"."; display:block; height:0; clear:both; visibility:hidden;}
/*Hides from IE-mac\*/
* html #container,
* html .box,
* html .selected {height:1%;}
#container,
.box,
.selected { display:block;}
/*End hide from IE-mac*/



/*HEADER_FOOTER*/
/*******************************************************************/
#top { background: #22A8B5; font-size: 85%; color: #FFF;}
#top p { position: absolute; top: 0; right: 0;}
#logo a {
	display: block;
	width: 264px; height: 68px;
	margin: 5px 0;
	background: url(logo.gif);
	text-indent: -9999px; overflow: hidden;
}
#header { border-bottom: solid 1px #CCC;}
#header .ad { position: absolute; top: 5px; left: 280px;}
#header p { position: absolute; top: 5px; right: 0; width: 190px; font-size: 77%;}
#header ul { position: absolute; top: 50px; right: 0; margin: 0;}
#header li { float: left; display: inline; padding-left: 10px;}
#header li a { display: block; width: 80px; padding: 2px 6px; text-align: center; background: #22A8B5; color: #FFF; font-size: 77%;}
#tab { height: 106px; margin-bottom: 16px; background: url(gradient.png) repeat-x 0 0 #666; border-top: solid 1px #F0F0F0; border-bottom: solid 1px #999;}
#tab ul { margin: 0;}
#tab li { display: inline; float: left; }
#tab li a { display: block; width: 190px; margin-left: 2px; padding-top: 2px; text-align: center; background: url(gradient.png) repeat-x 0 0 #999; border: solid 1px #CCC;} 
#tab li:first-child a { margin-left: 0;}
#tab li a:hover, #tab li.select a { margin-top: 10px; background: url(gradient.png) repeat-x 0 0 #CCC; border: solid 1px #FFF;}
#footer { padding: 10px; background: #F0F0F0; font-size: 77%;}



/*MAIN*/
/*******************************************************************/
#main { float: left; display: inline; width: 775px;}
#contents { float: right; width: 600px;}
#left { float: left; width: 160px;}
#aside{ float: right; width: 180px;}

#contents dl { height: 80px; padding: 5px 10px; overflow: auto; overflow-X: hidden;}
#contents .comment dl { height: auto;}
#contents dt { color: #22A8B5;}
#contents dd { margin-bottom: 3px; padding-bottom: 3px; border-bottom: dotted 1px #CCC;}

.banner { clear: both; margin-bottom: 16px;}

.box { position: relative;  margin-bottom: 16px; background: url(gradient.png) repeat-x 0 0 #EEE; border: solid 1px #CCC;}
#contents .box { background: #FFF;}
.box:hover { background: #FFF;}
.box h2, .box h3 { padding: 2px 6px; background: #22A8B5; border-bottom: solid 3px #CCC; font-weight: bold; color: #FFF; border-top-right-radius: 6px; border-top-left-radius: 6px; -moz-border-radius-topright: 6px; -moz-border-radius-topleft: 6px;}
.box ul { margin: 10px 0 10px 20px;}
.box p { padding: 10px;}

.list ul { margin: 10px 0;}
.list ol { margin: 0 0 5px 130px;}
.list li { float: left; width: 288px; margin: 0 0 16px 8px; background: #F0F0F0; list-style: none; font-size: 85%;}
.list li:nth-child(odd) { clear: left;}
.list li li { width: 73px; margin: 1px; padding: 2px 0; text-align: center; background: #2A3F42; color: #FFF;}
.list li li:nth-child(odd) { clear: none;}
.list h4, .list p { margin: 0 0 0 130px; padding: 0 0 3px;}
.list h4 { font-weight: bold;}
.thum img { float: left; width: 120px; margin-right: 4px; padding: 2px; background: #2A3F42;}

.selected { margin: 10px; padding: 5px; background: #FFF; border: solid 1px #22A8B5;}
.selected h3 { padding: 0; background: #F5F5F5; border-bottom: dotted 1px #999; font-size: 123.1%; font-weight: bold; color: #22A8B5;}
.selected h4 { font-weight: bold; color: #22A8B5;}
.selected p { clear: both; margin-bottom: 10px; padding: 10px 0; border-bottom: dotted 1px #CCC;}
.selected p a { text-decoration: underline;}
.selected span a { padding: 2px 6px; background: #22A8B5; border: solid 1px #FFF; text-decoration: none; font-size: 85%; color: #FFF;}
.selected span.red a { background: #C00;}
.selected span.orange a { background: #F60;}
.selected span.blue a { background: #039;}
.selected span a:hover { border: solid 1px #333;}
.selected ul { margin: 0;}
.selected ul li { float: left; padding: 5px 16px; background: #F5F5F5; border-bottom: dotted 1px #999; list-style: none;}
.selected ul li:first-child { border-right: solid 1px #00345C;}
.selected ul li:last-child { border-left: solid 1px #00345C;}
.selected strong { margin: 0 4px; font-size: 138.5%;}
.delete { position: absolute; top: 2px; right: 2px;}
.same, .maybe { float: left; width: 270px; margin: 0 0 0 6px;}
.same ol, .maybe ol { margin: 10px 0;}
.same li, .maybe li { list-style: none; clear: both;}
.same img, .maybe img { float: left; margin: 0 4px 3px 0; padding: 2px; background: #2A3F42;}
.same { border-right: solid 1px #00345C;}

.login h3 { background: #BD2056;}
.login form { padding: 10px 5px; text-align: center;}
.login label { display: block; padding-bottom: 5px; font-size: 77%;}
.login input[type="text"], .login input[type="password"] { width: 90px; padding: 2px;}
.login input[type="submit"] { width: 100%;}
.login p { border-top: dotted 1px #666; text-align: center;}

#menu { margin: 0 0 16px;}
#menu li { list-style: none;}
#menu li a { display: block; margin-bottom: 4px; padding: 4px 10px; background: #F69; border: solid 1px #CCC; font-size: 123.1%; color: #FFF;}
#menu li a:hover { background: #FFF; color: #F69;}

#contents .search { padding-bottom: 10px; text-align: center; background: #FFFFE1;}

#tagarea{ margin-bottom: 5px;}

div.st { clear: both; padding-bottom:10px;}
div.pickup {
	font-size: 93%;
}
div.pickup ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
div.pickup li {
	clear: both;
	margin: 4px 6px;
	padding: 5px;
	border: solid 2px #4BB8DD;
	list-style: none;
}
div.pickup .img { float: left;}
div.pickup div.item {
	margin-left: 165px;
	height: 112px;
	padding: 4px;
	border: solid 1px #EEE;
}
div.pickup div.item .title {
	margin-bottom: 10px;
	color: #4BB8DD;
	border-bottom: solid 3px #4BB8DD;
	font-weight: bold;
}
div.pickup div.item p { padding: 0 0 10px!important;}
div.pickup div.item p.sub {	font-size:x-small; color: #999;}
div.pickup div.item p a {
	padding-left: 12px;
	background-image: url(http://ware.yourfilehost-navi.com/koukoku/arrow.gif);
	background-position: 0 2px;
	background-repeat: no-repeat;
	text-decoration: none;
}

.head_ad_left,
.head_ad_right{
	width:444px;
	margin-bottom:10px;
	border:1px solid #4FB8D9;
	font-size:12px;
	padding:12px;
}
.head_ad_left{ float:left;}
.head_ad_right{ float:right;}
.head_ad_left h3 a,
.head_ad_right h3 a {
	display: block;
	padding: 4px;
	background: #C06;
	color: #FFF;
}
.head_ad_left img,
.head_ad_right img {
	float: left;
	margin-right: 12px;
	border: solid 2px #C06;
}
.clear{
	clear:both;
	margin:0px;
	padding:0px;
}
.top_left{
	width:200px;
	float:left;
}
.top_center{
	margin:0 5px !important;
	float:left;
	width:560px;
	padding-top:15px;
	display:table-cell;
	text-align:center;
	color:#990000 !important;
	vertical-align:middle;
}
.top_right{
	width:200px;
	float:right;
}