@charset "shift_jis";



/*
		フレーム・枠組み
 -------------------------------------------------- */

/* container - 全体枠 */
#container{
	position: relative;
	width: 800px;
	margin: 0px auto;
	text-align: left;
}


/* content - コンテンツ全体枠 */
#content{
	position: absolute;
	width: 800px;
	margin: 230px 0px 0px 0px;
	z-index: 1;
	border-top: 1px #3366cc solid;
	background: #fff url(./img/border-bg.gif) left top repeat-y;
}


/*
		各種リセット＆共通設定
 -------------------------------------------------- */


/* margin, padding のリセット */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,input,p{
	margin: 0;
	padding: 0;
}


/* 強調表示解除 */
address,h1,h2,h3,h4{
	font-style: normal;
	font-weight: normal;
}


/* block element */
div,h1,h2,h3,h4,h5,h6,p,blockquote,address{
  display: block;
}


/* h */
h1, h2, h3, h4, h5, h6{
	font-size: 1.0em;
}


/* img */
img{
	border: none;
	vertical-align: bottom;
	margin: 0px;
	padding: 0px;
}


/* 左回り込み */
img.l{
	float: left;
	margin: 0px 20px 20px 0px;
	border: 1px #000 solid;
}


/* 右回り込み */
img.r{
	float: right;
	margin: 0px 0px 20px 20px;
	border: 1px #000 solid;
}


/* paragraph */
p{
	color: #454545;
	line-height: 160%;
}


/* list */
ul,ol,dl{
	margin: 0px;
	padding: 0px;
}


li,dt,dd{
	margin: 0px;
	padding: 0px;
	list-style: none none outside;
}


/* body */
body{
	color: #333333;
	font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', sans-serif;
	font-size: 85%;
	line-height: 160%;
	text-align: center;
	background: #fff url(./img/bg.gif) top center repeat;
}


/* link */
a{ color: #0000cc; text-decoration: none; }
a:hover{ color: #ff0000; text-decoration: underline; }

#main a img{ padding: 1px; border: 1px #0000ff solid; }
#main a:hover img{ padding: 1px; border :1px #ff0000 solid; }



/* clearfix */
.clearfix:after {
   content: ".";
   display: block;
   clear: both;
   height: 0px;
   font-size: 0px;
   visibility: hidden;
}
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }





/*
		h1 Text
 -------------------------------------------------- */

h1{
	position: absolute;
	width: 100%;
	font-size: 0.9em;
	text-align: right;
	color: #fff;
	line-height: 20px;
	z-index: 1;
	background-color: #3366cc;
}





/*
		Header
 -------------------------------------------------- */

/* 枠 */
#header{
	position: absolute;
	top: 20px;
	width: 800px;
	height: 180px;
	text-align: left;
	background: #fff url(./img/header-bg.jpg) right top no-repeat;
}


#header p.title{
	margin: 55px 40px;
	font-size: 2.5em;
}

#header p.title a{ color: #fff; }
#header p.title a:hover{ color: #fff; text-decoration: underline; }


#header div#headertext{
	position: absolute;
	top: 120px;
	color: #fff;
	margin: 0px 50px;
	font-size: 0.9em;
}



/* ----------------------------------- topicpath */

/* frame */
#siteNavi{
	position: absolute;
	width: 800px;
	top: 200px;
	font-size: 0.95em;
	text-indent: 30px;
	border-top: 1px #3366cc solid;
	background: #ddd url(./img/border-bg.gif) left top repeat-y;
	line-height: 30px;
}


#topicpath li{
	display: inline;
	margin: 0px 5px 0px 0px;
	color: #454545;
	font-size: 0.9em;
	z-index: 100000;
}

#topicpath li a{
	padding: 0px 20px 0px 0px;
	text-decoration: underline;
	background: url(./img/topicpath-bg.gif) right center no-repeat;
}




#main{
	float: right;
	display: inline;
	width: 540px;
	margin: 0px 10px;
}


/* ------------------------------ Title - 見出し */

/* h2 */
#main h2{
	margin: 30px 0px;
	font-size: 1.4em;
	line-height: 45px;
	text-indent: 50px;
	font-weight: bold;
	color: #000;
	background: url(./img/h2-bg.jpg) left center no-repeat;
}


/* h3 */
#main h3{
	margin: 30px 0px;
	padding: 3px 0px;
	font-size: 1.3em;
	font-weight: bold;
	text-indent: 30px;
	color: #000;
	border-bottom: 3px #3366cc double;
	background: url(./img/h3-bg.gif) 5px 3px no-repeat;
}




/* ------------------------------ 本文 */

/* テキスト */
#main p{
/*	margin: 30px; */
	margin: 0px 30px;
	color: #545454;
	line-height: 170%;
}


/*画像回り込み*/
#main img.left{
	float: left;
	margin: 0px 15px 15px 0px;
}

#main img.right{
	float: right;
	margin: 0px 0px 15px 15px;
}

/* ------------------------------ dl, dt, dd - 定義リスト */

#main dl{
	margin: 30px;
	padding: 15px 20px 10px;
	border: 1px #3366cc dotted;
}

#main dl dt{
	font-size: 110%;
	font-weight: bold;
	text-indent: 10px;
	color: #3366cc;
	border-bottom: 3px #3366cc double;
}

#main dl dd{
	margin: 7px 0px 10px 0px;
	padding: 0px 15px;
	font-size: 0.9em;
	color: #666;
}





/* ------------------------------ ul, ol, li - リスト */
#main ul{ margin: 30px; }

#main ul li{
	margin: 7px 0px 0px;
	padding: 0px 0px 0px 20px;
	list-style: none none outside;
	border-bottom: 1px #3366cc dotted;
	background: url(./img/list.gif) left top no-repeat;
}

#main ul.update li{
	margin: 10px 10px;
	padding: 0px 0px 10px 10px;
	list-style: none none outside;
	background: none;
}

/*更新情報内 - rssリンク*/
#main ul.update li.rss{
	margin: 0px 10px 0px 180px;
	padding: 0px 0px 0px 35px;
	line-height: 30px;
	border: none;
	background: url(./img/rss_icon.gif) left top no-repeat;
}



/* ------------------------------ Blockquote - 引用 */

#main blockquote{
	margin: 30px;
	padding: 1px;
	border: 1px #3366cc dotted;
}



/* ------------------------------ table tr th td - テーブル */

#main table{
	margin: 30px;
	font-size: 1.0em;
	empty-cells: show;
	border-spacing: 0px;
	border-collapse: collapse;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	background-color: #fff;

}

#main table tr th{
	margin: 1px;
	padding: 7px;
	font-weight: bold;
	text-align: center;
	color: #fff;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background-color: #3366cc;
}

#main table tr td{
	padding: 7px;
	text-align: left;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
}



/* ------------------------------ ranking - ランキング */

#main .ranking{
	margin: 30px;
	border: 1px #3366cc dotted;
}

#main .ranking dl{
	margin: 10px 0px;
	padding: 5px 5px 15px 5px;
	border: none;
	border-bottom: 3px #3366cc double;
}

#main .ranking dl.ranking-3{ border-bottom: none; }

#main .ranking dl dt{
	margin: 10px 0px 0px 60px;
	font-size: 1.4em;
	font-weight: bold;
	border: none;
	line-height: 50px;
}

#main .ranking dl.ranking-1 dt{ background: url(./img/ranking-1.jpg) left top no-repeat; }
#main .ranking dl.ranking-2 dt{ background: url(./img/ranking-2.jpg) left top no-repeat; }
#main .ranking dl.ranking-3 dt{ background: url(./img/ranking-3.jpg) left top no-repeat; }

#main .ranking dl dt.img{
	float: left;
	margin: 0px 20px 0px 0px;
	background: none;
}

#main .ranking dl dt.text{
	margin: 0px 0px 0px 150px;
	text-indent: 50px;
}

#main .ranking dl dd{
	margin: 10px;
	font-size: 0.95em;
}



/* ------------------------------ review - 口コミ */

#main .review{
	margin: 30px;
	min-height: 250px;
	border: 3px #3366cc double;
}

/*　人物左側　*/
#main .person-l{ padding: 20px 20px 20px 120px; }

#main .person-l-01{ background: url(./img/person-l-01.gif) 20px 20px no-repeat; }
#main .person-l-02{ background: url(./img/person-l-02.gif) 20px 20px no-repeat; }
#main .person-l-03{ background: url(./img/person-l-03.gif) 20px 20px no-repeat; }
#main .person-l-04{ background: url(./img/person-l-04.gif) 20px 20px no-repeat; }
#main .person-l-05{ background: url(./img/person-l-05.gif) 20px 20px no-repeat; }

/*　人物右側　*/
#main .person-r{ padding: 20px 120px 20px 20px; text-align: right; }
#main .person-r-01{ background: url(./img/person-r-01.gif) right 10px no-repeat; }
#main .person-r-02{ background: url(./img/person-r-02.gif) right 10px no-repeat; }
#main .person-r-03{ background: url(./img/person-r-03.gif) right 10px no-repeat; }
#main .person-r-04{ background: url(./img/person-r-04.gif) right 10px no-repeat; }
#main .person-r-05{ background: url(./img/person-r-05.gif) right 10px no-repeat; }


#main .review p{
	display: inline;
	margin: 0px;
	font-size: 0.95em;
	line-height: 200%;
	border-bottom: 1px #3366cc dotted;
}

#main .review .person-2 p{ margin: 0px 100px 0px 0px; }




/* サブコンテンツ */

#sub{
	float: left;
	display: inline;
	width: 220px;
	margin: 0px 10px;
}


#sub a img{ opacity: 1.0; filter: alpha(opacity=100); }
#sub a:hover img{ opacity: 0.6; filter: alpha(opacity=60); }


#sub h4{
	margin: 30px 0px 0px;
	font-size: 1.2em;
	line-height: 40px;
	text-align: center;
	color: #000;
	border-left: 1px #3366cc solid;
	border-right: 1px #3366cc solid;
	background: url(./img/h4-bg.jpg) left top repeat-x; 
}

#sub .menubox ul#menu1{
	margin: 0px;
	padding: 0px;
	border-left: 1px #3366cc solid;
	border-right: 1px #3366cc solid;
}


#sub .menubox ul#menu1 li{
	display: inline;
	margin: 0px;
	font-size: 0.9em;
}


#sub .menubox ul#menu1 li a{
	display: block;
	margin: 0px;
	padding: 10px 15px;
	border-bottom: 1px #3366cc solid;
	background: url(./img/sub-link.gif) 5px 16px no-repeat;
}


#sub p{
	margin: 0px;
	padding: 15px 10px;
	font-size: 0.9em;
	border-left: 1px #3366cc solid;
	border-right: 1px #3366cc solid;
	border-bottom: 1px #3366cc solid;
}




/* 枠 */
#footer{
	clear: both;
	margin: 0px 1px;
	padding: 20px 0px 0px;
}

#footer ul{
	padding: 3px 0px;
	text-align: right;
	border-top: 1px #e9e9e9 solid;
}

#footer ul li{
	display: inline;
	margin: 0px 10px;
	font-size: 0.9em;
}


#footer address{
	font-size: 0.9em;
	text-align: center;
	line-height: 50px;
	color: #fff;
	background: url(./img/footer-bg.jpg) left top repeat-x;
}

#footer address a{ color: #fff; }
#footer address a:hover{ background: none; color: #333; text-decoration: none; }


#footer dl{
	float: right;
	display: inline;
	margin: 0px 7px 0px 0px;
}

#footer dl dt{
	float: left;
	display: inline;
	margin: 0px 7px;
	color: #999;
	font-size: 0.9em;
}

#footer dl dd{
	float: left;
	margin: 3px 5px 0px;
	font-size: 0.8em;
}

#footer dl dd a{ color: #999; text-decoration: none; }




/*----------------------------------------------------------------------
 *	拡張設定
 *
 *　HTMLで使いたい位置に、
 *　<span class="○○○">××××</span>
 *　と使うことで、それぞれが反映できます。
 *
 *　文中の強調テキストを太字にしたい場合 *
 *　.boldを使用
 *
 *　文中の<span class="bold">強調</span>を太字にします。
 *
 *　といった使い方をして下さい。
 *
 
 *----------------------------------------------------------------------
*/



/*
		テキストの太字
 ----------------------------------------------------------------------*/

.bold{ font-weight: bold; }
.normal{ font-weight: normal; }
.italic{ font-weight: italic; }



/*
		テキストのサイズ
 ----------------------------------------------------------------------*/

.fs08{ font-size: 0.8em; }
.fs09{ font-size: 0.9em; }
.fs10{ font-size: 1.0em; }
.fs11{ font-size: 1.1em; }
.fs12{ font-size: 1.2em; }
.fs13{ font-size: 1.3em; }
.fs14{ font-size: 1.4em; }
.fs15{ font-size: 1.5em; }
.fs16{ font-size: 1.6em; }
.fs17{ font-size: 1.7em; }
.fs18{ font-size: 1.8em; }
.fs19{ font-size: 1.9em; }
.fs20{ font-size: 2em; }


/*
		テキストのカラー
 ----------------------------------------------------------------------*/

.red{ color: #ff0000; }		/*　赤　*/
.blue{ color: #0000ff; }	/*　青　*/
.green{ color: #009900; }	/*　緑　*/
.yellow{ color: #ffff00; }	/*　黄　*/
.navy{ color: #003399; }	/*　紺色　*/
.black{ color: #000000; }	/*　黒　*/
.gray{ color: #999999; }	/*　グレー　*/
.purple{ color: #9900cc; }	/*　紫　*/
.orange{ color: #ff6633; }	/*　橙　*/
.pink{ color: #ff00ff; }	/*　桃　*/
.white{ color :#ffffff; }	/*　白　*/


/*
		テキストの背景
 ----------------------------------------------------------------------*/

.back-red{ background-color: #ff0000; }		/*　赤　*/
.back-blue{ background-color: #0000ff; }	/*　青　*/
.back-green{ background-color: #009900; }	/*　緑　*/
.back-yellow{ background-color: #ffff00; }	/*　黄　*/
.back-navy{ background-color: #003399; }	/*　紺色　*/
.back-black{ background-color: #000000; }	/*　黒　*/
.back-gray{ background-color: #999999; }	/*　グレー　*/
.back-purple{ background-color: #9900cc; }	/*　紫　*/
.back-orange{ background-color: #ff6633; }	/*　橙　*/
.back-pink{ background-color: #ff00ff; }	/*　桃　*/
.back-white{ background-color: #ffffff; }	/*	白	*/



/*
		テキストのまつわる線
 ----------------------------------------------------------------------*/

.under{ text-decoration: underline; }		/*　下線　*/
.through{ text-decoration: line-through; }	/*　打ち消し線　*/


/*
		テキストの位置配置
 ----------------------------------------------------------------------*/

.text-l{ text-align: left; }	/*　左寄せ　*/
.text-c{ text-align: center; }	/*　中央揃え　*/
.text-r{ text-align: right; }	/*　右寄せ　*/



/*
		マージンの位置配置
 ----------------------------------------------------------------------*/

.m0{ margin: 0px!important; }				/*全margin無し*/
.mt-0{ margin-top: 0px!important; }			/*上marginが0px*/
.mr-0{ margin-right: 0px!important; }		/*右marginが0px*/
.mb-0{ margin-bottom: 0px!important; }		/*下marginが0px*/
.ml-0{ margin-left: 0px!important; }		/*左marginが0px*/

.m1{ margin: 1px!important; }
.mt-1{ margin-top: 1px!important; }	
.mr-1{ margin-right: 1px!important; }
.mb-1{ margin-bottom: 1px!important; }
.ml-1{ margin-left: 1px!important; }

.m2{ margin: 2px!important; }
.mt-2{ margin-top: 2px!important; }	
.mr-2{ margin-right: 2px!important; }
.mb-2{ margin-bottom: 2px!important; }
.ml-2{ margin-left: 2px!important; }

.m3{ margin: 3px!important; }
.mt-3{ margin-top: 3px!important; }	
.mr-3{ margin-right: 3px!important; }
.mb-3{ margin-bottom: 3px!important; }
.ml-3{ margin-left: 3px!important; }

.m4{ margin: 4px!important; }
.mt-4{ margin-top: 4px!important; }	
.mr-4{ margin-right: 4px!important; }
.mb-4{ margin-bottom: 4px!important; }
.ml-4{ margin-left: 4px!important; }

.m5{ margin: 5px!important; }
.mt-5{ margin-top: 5px!important; }	
.mr-5{ margin-right: 5px!important; }
.mb-5{ margin-bottom: 5px!important; }
.ml-5{ margin-left: 5px!important; }

.m6{ margin: 6px!important; }
.mt-6{ margin-top: 6px!important; }	
.mr-6{ margin-right: 6px!important; }
.mb-6{ margin-bottom: 6px!important; }
.ml-6{ margin-left: 6px!important; }

.m7{ margin: 7px!important; }
.mt-7{ margin-top: 7px!important; }	
.mr-7{ margin-right: 7px!important; }
.mb-7{ margin-bottom: 7px!important; }
.ml-7{ margin-left: 7px!important; }

.m8{ margin: 8px!important; }
.mt-8{ margin-top: 8px!important; }	
.mr-8{ margin-right: 8px!important; }
.mb-8{ margin-bottom: 8px!important; }
.ml-8{ margin-left: 8px!important; }

.m9{ margin: 9px!important; }
.mt-9{ margin-top: 9px!important; }	
.mr-9{ margin-right: 9px!important; }
.mb-9{ margin-bottom: 9px!important; }
.ml-9{ margin-left: 9px!important; }

.m10{ margin: 10px!important; }
.mt-10{ margin-top: 10px!important; }
.mr-10{ margin-right: 10px!important; }
.mb-10{ margin-bottom: 10px!important; }
.ml-10{ margin-left: 10px!important; }

.m15{ margin: 15px!important; }
.mt-15{ margin-top: 15px!important; }
.mr-15{ margin-right: 15px!important; }
.mb-15{ margin-bottom: 15px!important; }
.ml-15{ margin-left: 15px!important; }

.m20{ margin: 20px!important; }
.mt-20{ margin-top: 20px!important; }
.mr-20{ margin-right: 20px!important; }
.mb-20{ margin-bottom: 20px!important; }
.ml-20{ margin-left: 20px!important; }

.m25{ margin: 25px!important; }
.mt-25{ margin-top: 25px!important; }
.mr-25{ margin-right: 25px!important; }
.mb-25{ margin-bottom: 25px!important; }
.ml-25{ margin-left: 25px!important; }

.m30{ margin: 30px!important; }
.mt-30{ margin-top: 30px!important; }
.mr-30{ margin-right: 30px!important; }
.mb-30{ margin-bottom: 30px!important; }
.ml-30{ margin-left: 30px!important; }

.m40{ margin: 40px!important; }
.mt-40{ margin-top: 40px!important; }
.mr-40{ margin-right: 40px!important; }
.mb-40{ margin-bottom: 40px!important; }
.ml-40{ margin-left: 40px!important; }

.m50{ margin: 50px!important; }
.mt-50{ margin-top: 50px!important; }
.mr-50{ margin-right: 50px!important; }
.mb-50{ margin-bottom: 50px!important; }
.ml-50{ margin-left: 50px!important; }

.m60{ margin: 60px!important; }
.mt-60{ margin-top: 60px!important; }
.mr-60{ margin-right: 60px!important; }
.mb-60{ margin-bottom: 60px!important; }
.ml-60{ margin-left: 60px!important; }

.m70{ margin: 70px!important; }
.mt-70{ margin-top: 70px!important; }
.mr-70{ margin-right: 70px!important; }
.mb-70{ margin-bottom: 70px!important; }
.ml-70{ margin-left: 70px!important; }


/*------------------------------------------------------------
		padding
-------------------------------------------------------------*/

.p0{ padding: 0px!important; }				/*全padding無し*/
.pt-0{ padding-top: 0px!important; }		/*上paddingが0px*/
.pr-0{ padding-right: 0px!important; }		/*右paddingが0px*/
.pb-0{ padding-bottom: 0px!important; }		/*下paddingが0px*/
.pl-0{ padding-left: 0px!important; }		/*左paddingが0px*/

.p1{ padding: 1px!important; }
.pt-1{ padding-top: 1px!important; }
.pr-1{ padding-right: 1px!important; }
.pb-1{ padding-bottom: 1px!important; }
.pl-1{ padding-left: 1px!important; }

.p2{ padding: 2px!important; }
.pt-2{ padding-top: 2px!important; }
.pr-2{ padding-right: 2px!important; }
.pb-2{ padding-bottom: 2px!important; }
.pl-2{ padding-left: 2px!important; }

.p3{ padding: 3px!important; }
.pt-3{ padding-top: 3px!important; }
.pr-3{ padding-right: 3px!important; }
.pb-3{ padding-bottom: 3px!important; }
.pl-3{ padding-left: 3px!important; }

.p4{ padding: 4px!important; }
.pt-4{ padding-top: 4px!important; }
.pr-4{ padding-right: 4px!important; }
.pb-4{ padding-bottom: 4px!important; }
.pl-4{ padding-left: 4px!important; }

.p5{ padding: 5px!important; }
.pt-5{ padding-top: 5px!important; }
.pr-5{ padding-right: 5px!important; }
.pb-5{ padding-bottom: 5px!important; }
.pl-5{ padding-left: 5px!important; }

.p6{ padding: 6px!important; }
.pt-6{ padding-top: 6px!important; }
.pr-6{ padding-right: 6px!important; }
.pb-6{ padding-bottom: 6px!important; }
.pl-6{ padding-left: 6px!important; }

.p7{ padding: 7px!important; }
.pt-7{ padding-top: 7px!important; }
.pr-7{ padding-right: 7px!important; }
.pb-7{ padding-bottom: 7px!important; }
.pl-7{ padding-left: 7px!important; }

.p8{ padding: 8px!important; }
.pt-8{ padding-top: 8px!important; }
.pr-8{ padding-right: 8px!important; }
.pb-8{ padding-bottom: 8px!important; }
.pl-8{ padding-left: 8px!important; }

.p9{ padding: 9px!important; }
.pt-9{ padding-top: 9px!important; }
.pr-9{ padding-right: 9px!important; }
.pb-9{ padding-bottom: 9px!important; }
.pl-9{ padding-left: 9px!important; }

.p10{ padding: 10px!important; }
.pt-10{ padding-top: 10px!important; }
.pr-10{ padding-right: 10px!important; }
.pb-10{ padding-bottom: 10px!important; }
.pl-10{ padding-left: 10px!important; }

.p15{ padding: 15px!important; }
.pt-15{ padding-top: 15px!important; }
.pr-15{ padding-right: 15px!important; }
.pb-15{ padding-bottom: 15px!important; }
.pl-15{ padding-left: 15px!important; }

.p20{ padding: 20px!important; }
.pt-20{ padding-top: 20px!important; }
.pr-20{ padding-right: 20px!important; }
.pb-20{ padding-bottom: 20px!important; }
.pl-20{ padding-left: 20px!important; }

.p30{ padding: 30px!important; }
.pt-30{ padding-top: 30px!important; }
.pr-30{ padding-right: 30px!important; }
.pb-30{ padding-bottom: 30px!important; }
.pl-30{ padding-left: 30px!important; }

.p40{ padding: 40px!important; }
.pt-40{ padding-top: 40px!important; }
.pr-40{ padding-right: 40px!important; }
.pb-40{ padding-bottom: 40px!important; }
.pl-40{ padding-left: 40px!important; }

.p50{ padding: 50px!important; }
.pt-50{ padding-top: 50px!important; }
.pr-50{ padding-right: 50px!important; }
.pb-50{ padding-bottom: 50px!important; }
.pl-50{ padding-left: 50px!important; }

.p60{ padding: 60px!important; }
.pt-60{ padding-top: 60px!important; }
.pr-60{ padding-right: 60px!important; }
.pb-60{ padding-bottom: 60px!important; }
.pl-60{ padding-left: 60px!important; }

.p70{ padding: 70px!important; }
.pt-70{ padding-top: 70px!important; }
.pr-70{ padding-right: 70px!important; }
.pb-70{ padding-bottom: 70px!important; }
.pl-70{ padding-left: 70px!important; }