@charset "utf-8";
/*------------------------------------------------------------
●ブラウザ固有のCSSをリセット
-------------------------------------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, table, th, td { margin: 0; padding: 0; }
address, caption, cite, code, dfn, h1, h2, h3, h4, th, var { font-style: normal; font-weight: normal; }
caption, th { text-align: left; }
td { font-size:12px; }
a { text-decoration: none; }
img { border: none; }
/*--------------------------------------------------------
1、背景画像の設定（下記から一つ選んで下さい）
--------------------------------------------------------*/
body { background:#FFF url(img/back.gif) repeat-x 0 0;margin: 0; text-align: center; font-family: "ＭＳ Ｐゴシック", "平成角ゴシック", sans-serif; font-size: 0.8em; line-height: 1.4em; }
/*--------------------------------------------------------
4、枠線の設定
--------------------------------------------------------*/
div#header, div#header-logo, div#navi, div#main { border-left: 0px solid #666; border-right:0px solid #666; }
/*ヘッダーロゴの上下*/
div#header-logo { }
/*左メニューその他ボックス*/
div#left .contents { border: 1px solid #000000; }
div#bannar {position:absolute; top:-25px; left:722px;}
/*--------------------------------------------------------
5、文字色の設定
--------------------------------------------------------*/
body { color: #4c4c4c; }
a { text-decoration: underline; }/*下線を付ける*/
a:link { color: #0066cc; }
a:visited { color: #0066cc; }/*訪問済み*/
a:hover { color: #0066cc; }/*リンクに乗った時*/
div#footer #copyright { color: #000000; }
/*--------------------------------------------------------
■container設定
--------------------------------------------------------*/
div#container { width: 960px; _width: 962px;/*IE対策*/ margin: 0 auto; text-align: left; }
h1 { text-align:right; margin: 124px 0 0 0px; font-size: 12px; color: #666; font-weight:bold;}
div#description { margin:-110px 0 0 285px; text-align:left; font-size: 9pt; line-height: 14pt; color:#999; width:420px; border:0px solid red; }

/*--------------------------------------------------------
■ヘッダーロゴ
--------------------------------------------------------*/
div#header-logo { z-index: 1; position: absolute; top: 36px; width: 828px; _width: 820px;/*IE対策*/ height: 88px; text-align: left; border:0px solid red; }
h2 { position: absolute; top:-24px; left: 0px; font-size:12px; }
h2 a { text-decoration:none; color:#999; }
h2 a:link { text-decoration:none; color:#999; }
h2 a:visited { text-decoration:none;  color:#999;}
h2 a:hover { text-decoration:none; color:#999; }
/*--------------------▽ヘッダー文章*/
div#logo { text-align:left; margin:0px 0 0 0px; }
/*--------------------------------------------------------
■ナビゲーション
--------------------------------------------------------*/
#nav { z-index: 2; position:absolute; top: 78px; width: 960px; _width: 970px;/*IE対策*/ height: 39px; list-style: none; overflow: hidden; clear: both; border:0px solid blue; border:0px solid red; }
#nav li {
margin:; padding: 0; float: left; }
#nav a, #nav a:link, #nav a:visited { width: 160px; height: 39px; text-indent: -99999px; text-decoration: none; background-position: 0 0; float: left; }
li#top a { background-image: url(img/nav/home.gif); }
li#hatumouzai a { background-image: url(img/nav/hatumouzai.gif); }
li#ikumouzai a { background-image: url(img/nav/ikumouzai.gif); }
li#shampoo a { background-image: url(img/nav/shampoo.gif); }
li#supplement a { background-image: url(img/nav/supplement.gif); }
li#goods a { background-image: url(img/nav/goods.gif); }
li#guide a { background-image: url(img/nav/guide.gif); }
/*--------------------------------------------------------
■ぱんくずリスト
--------------------------------------------------------*/
div#pankuzu { overflow: hidden; position: absolute; top: 125px; width: 880px; height:55px; text-align: left; font-size:12px; color:#666; }
/*--------------------------------------------------------
■コンテンツ全体（右＆左＆フッター）
--------------------------------------------------------*/

/*サイズ設定　その5*/
div#contents { overflow: hidden; position: absolute; top: 160px; width: 960px; _width: 952px;/*IE対策*/ text-align: left; }
/*--------------------------------------------------------
■メインコンテンツ
--------------------------------------------------------*/
div#main { overflow: hidden; float: right; padding: 0 10px 20px 20px; width: 700px; _width: 718px;/*IE対策*/ border:0px solid red; }
/*--------------------▽コンテンツ*/

div#main .contents { clear: both; margin: 10px 5px 10px 0px; }
div#main h3 { clear: both; margin: 8px 0 10px 0; padding: 6px 0 0 25px; background:url(img/bg/h3.gif) no-repeat 0 0; font-size: 14px; font-weight: bold; line-height: 15pt; color: #454545; height:33px; width:710px; }
div#main h4 { font-size: small; color: #000000; font-weight:bold; margin: 20px 10px 10px; padding: 4px 0px 3px 20px; background: url(img/bg/h4.gif) no-repeat 0em 0.4em; border-bottom: 1px solid #CE0000; clear: both; }

div#main h3#sougou { background:url(img/text/sougou_rank.gif) no-repeat 0 0; text-indent:-9999px; padding:0px 0 0 0; margin:8px 0 10px 0; height:33px; width:710px; }
div#main p {margin:0px 0px 20px 5px; font-size:12px; line-height:1.6em; color:#4c4c4c; }

/*--------------------▽コンテンツ内のリストタグ*/

#main ul { margin:0 1.3em 0 10px; padding:0; }
#main ul li { margin:0 0 12px 15px; font-size:12px; }
#main ul li a { text-decoration:underline; }
#main ul li.ar { background:url(img/list/arrow.gif) no-repeat 0 0; padding-left:20px; margin:0 0 12px 0; font-size:12px; list-style-type:none; }
#main ol { margin:2px 10px 0 10px; padding:0px 0 0 0px; }
#main ol li { margin:0 0px 15px 0px; padding:0px; font-size:12px; }
#main ol li.check { background:url(img/list/check2.gif) no-repeat 0 3px; padding-left:20px; list-style-type:none; }
#main ol li.num { margin-left:15px; }
/*--テーブル--*/
.table_blue { width:100%; margin: 0 0 20px 0; background-color:#c2c2c2; }
.table_blue th { background-color:#e8edfa; padding:7px; font-size:12px; }
.table_blue td { background-color:#fff; padding:7px; font-size:12px; }
/*--item--*/
.item { width:100%; margin:3px 0px 20px 3px; }
.item td { padding:10px; vertical-align:top; line-height:1.5em; font-size:12px; border:1px solid #c2c2c2; }
.item th {background-color:#f0f0f0;line-height:1.5em; font-size:14px; font-weight:bold; border:1px solid #c2c2c2; padding:5px 0px 5px 10px;}

/*--------------------------------------------------------
■サイドメニュー
--------------------------------------------------------*/
div#side { width: 220px; float: left; margin: 8px 0 0 0; padding: 0 10px 20px 0px; text-align:left; border:0px solid blue; }
ul.gnavi { width: 216px; border: 1px solid #d0d4d8; margin: 0 0 15px; padding: 30px 1px 1px; }
/*----title----*/
ul.gnavi#ranking { background: url(img/side/ranking.gif) no-repeat 0px 0px; }
ul.gnavi#hatsumouzai { background: url(img/side/hatsumouzai.gif) no-repeat 0px 0px; }
ul.gnavi li { background:url(img/line/side.gif) repeat-x 0% 100%; margin: 0; font-size:12px; padding: 8px 9px 9px 5px; list-style-type:none; }
ul.gnavi li.noLine { background: none; }
ul.gnavi li a { background:url(img/icon/side_arrow.gif) no-repeat 3px 50%; margin: 0; padding: 1px 0 0 20px; text-decoration:none; }
ul.gnavi li a:hover { text-decoration:underline; }
/*--------------------------------------------------------
■フッターメニュー
--------------------------------------------------------*/

/*サイズ設定　その8*/
div#footer { clear: both; width: 960px; text-align: center; border-top:1px solid #c2c2c2; padding-top:10px; margin:25px 0 10px 0; color:#999999; }
div#footer a { color:#999999; text-decoration:none; }
/*--------------------▽フッター内で使用する線*/

div#footer hr { clear: both; color: #aaa; }
/* class
---------------------------------------------------------------------------*/
/*----アドセンス----*/
.ad_top { margin:10px 0px 0px 10px; text-align:left; }
.ad_include { margin:10px 0px 10px 10px; text-align:left; }
.ad_bottom { margin:0px 0px 15px 10px; text-align:left; }
.ad_side { margin:10px 0px 0px 10px; text-align:left; }
/*----色・テキスト----*/
.red { color:#D81851; font-weight:bold; font-size:12px; }
.red1 { color:#dc0303; font-weight:bold; }
.red2 { color:#dc0303; }
.blue0 { color:#0068b7; font-weight:bold; }
.blue { color:#0066cc; font-weight:bold; font-size:14px; }
.blue1 { color:#0066cc; font-weight:bold; font-size:18px; }
.blue2 { color:#0068b7; font-weight:bold; }
.purple { color:#1d2088; font-weight:bold; }
.orange { color:#d63a00; font-weight:bold; }
.orange2 { color:#d63a00; font-weight:bold; font-size:16px; }
.white { background-color:#FFFFFF; }
.yellow { background-color:#FFFF00; color:#000000; }
.b { font-weight:bold; font-size:16px; }
.b2 { font-weight:bold; font-size:14px; }
.b0 { font-weight:bold; }
.small { font-size:11px; }
.afi { font-weight:bold; font-size:18px; }
.title { font-weight:bold; font-size:16px; margin:30px 0 10px 0; background:url(img/line/dot.gif) repeat-x bottom; padding: 0px 0 5px 5px; width:395px; height:22px; }
.title1 { font-weight:bold; font-size:16px; margin:30px 0 10px 0; background:url(img/line/dot.gif) repeat-x bottom; padding: 0px 0 5px 5px; width:445px; height:22px; }
.title2 { margin:0 0 15px 0px; }
.komidasi { color:#8d4107; font-weight:bold; margin-bottom:7px; }
/*----囲い----*/
.note { background-color: #f4f4f4; padding:15px 8px 0px 20px; border:1px solid #C2C2C2; font-size:14px; margin:10px 0px 20px 0px; clear:both; }
.note2 { background-color: #f4f4f4; padding:15px 8px 0px 8px; border:1px solid #C2C2C2; }
.notep { background-color: #f4f4f4; padding:5px 8px 0px 8px; border:1px solid #C2C2C2; font-size:12px; margin:10px 0px 20px 0px; line-height:150%; }
.note ol { padding:0 10px 5px; }
.note ol li { font-size:12px; padding-bottom:10px;}
.border { margin:15px 0px 25px 0px; padding: 15px 10px 5px 10px; border: 1px solid #c2c2c2; }
.attention { border:#006633 dotted 1px; margin:0 20px; padding:5px; font-size:10px; line-height:130%; }
.q { margin:3px 0px 15px 0px; padding:7px 5px 0px 5px; background-color: #f6f6f6; border-top: 2px solid #dddddd; border-bottom: 2px solid #dddddd; display: block; text-align: left; }
.sample { margin:0 0 15px 10px; }
.spacer { background:url(img/line/dot.gif) repeat-x 0 0; padding-top:0px; margin:25px auto 15px auto; width:100%; clear:both; }
.spacer2 { background:url(img/line/dot2.gif) repeat-x 0 0; padding-top:0px; margin:25px auto 15px auto; width:100%; }
.spacer3 { background:url(img/line/dot.gif) repeat-x 0 0; padding-top:0px; margin:15px auto 5px auto; width:100%; clear:both; }
.backtop { background:url(img/icon/top.gif) no-repeat 847px 0px; text-align:right; margin:10px 15px 0 0; }
.img_border { border:1px solid #c2c2c2; padding:5px; margin-bottom:15px; }
.img_r { border:1px solid #c2c2c2; padding:5px; margin:10px 0 15px 15px; }
.img_l { border:1px solid #c2c2c2; padding:5px; margin:10px 15px 15px 0px; }
.img_r2 { margin-left:15px; margin: 10 0 0 15px; }
.img_l2 { margin-right:15px; margin-bottom:15px; }
/*----リスト----*/
.arrow { background:url(img/list/lig.gif) no-repeat 0px 0px; padding-left:16px; }
.arrow2 { background:url(img/list/arrow2.gif) no-repeat 0px 3px; padding-left:10px; }
.arrow3 { background:url(img/list/arrow4.gif) no-repeat 0px 3px; padding-left:17px; }
.arrow4 { background:url(img/list/arrow_red.gif) no-repeat 0px 3px; padding-left:10px; margin-right:5px; }/*--ボトム用--*/
.new { background:url(img/icon/new.gif) no-repeat 0 4px; padding-left:35px; }
.folder { background:url(img/icon/folder.gif) no-repeat 0 0px; padding-left:25px; }
/*----口コミ----*/
.kutikomi { margin:0 0 40px 0; }
.kutikomi2 { margin:10px 0 10px 0; }
.kutikomi_top { background:url(img/bg/kutikomi_top.gif) no-repeat top; }
.kutikomi_bottom { background:url(img/bg/kutikomi_bottom.gif) no-repeat top; height:18px; }
.kutikomi_top p { margin:10px 20px 0 30px; line-height:1.4em; }
.kutikomi_m { background:url(img/icon/kutikomi_m.gif) no-repeat 0 0; width:80px; height:80px; }
.kutikomi_w { background:url(img/icon/kutikomi_w.gif) no-repeat 0 0; width:80px; height:80px; }
/*----調整----*/
.float { float:left; }
.clear { clear:both; }
.mgnl1 { margin-left:20px; }
hr { clear: both; margin: 0; padding: 0; border-width: 1px 0 0 0; height: 1px; border-style: solid none none none; color: #ccc; }
/*----数字----*/
.one { background:url(img/list/1.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.two { background:url(img/list/2.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.three { background:url(img/list/3.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.four { background:url(img/list/4.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.five { background:url(img/list/5.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.six { background:url(img/list/6.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.seven { background:url(img/list/7.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.eight { background:url(img/list/8.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.nine { background:url(img/list/9.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }
.ten { background:url(img/list/10.gif) no-repeat 0 0px; height:24px; padding:2px 0 0 25px; margin-top:5px; margin-left:0px; font-weight:bold; font-size:16px; }