@charset "utf-8";
/* CSS Document */
/*------------------------------------------------------------
●ブラウザ固有の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; }
table { border-collapse: collapse; border-spacing: 0; }
address, caption, cite, code, dfn, h1, h2, h3, h4, th, var { font-style: normal; font-weight: normal; }
fieldset, img, abbr { border: 0; }
caption, th { text-align: left; }
q:before, q:after { content: ''; }
a { text-decoration: none; }
img { border: none; vertical-align: bottom; }
/*--------------------------------------------------------
1、Total
-------------------------------------------------------*/
body { background: url(img/back.jpg) repeat-y center #F5F4EA; color: #000; margin: 0; text-align: center; font-family: "Verdana", MS UI Gothic, Tahoma, 'trebuchet ms', helvetica, arial, "MS Pゴシック", "osaka", sans-serif; font-size: 0.8em; line-height: 1.4em; }
p { line-height: 1.4em; }
a { text-decoration: underline; }
a:link { color: #00f; }
a:visited { color: #00f; }
a:hover { color: #f60; }
/*--------------------------------------------------------
2、見出し
--------------------------------------------------------*/

h1 { z-index: 2; position: relative; margin: 0 16px 0 0; font-size: 10pt; color: #fff; text-align: right; }
h2 { clear: both; margin: 0 0 1.0em 0; padding: 6px 10px 9px 20px; background: url(img/bg/h2.gif) left bottom repeat-x; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; font-size: 1.3em; line-height: 1.4em; text-align: left; color: #fff; }
h3 { clear: both; padding: 0 0 0 30px; background: url(images/h3-bg.gif) no-repeat; color: #fff; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; font-size: 16pt; font-weight: normal; line-height: 48px; }
h4 { clear: both; margin: 0 0 30px 0; color: #009; font-size: 20pt; font-weight: normal; }
/*--------------------------------------------------------
■container設定
--------------------------------------------------------*/

div#container { width: 810px; _width: 812px;/*IE*/ margin: 0 auto; text-align: left; }
div#header-logo, div#main { border-left: 1px solid #c6c1b; border-right: 1px solid #c6c1b; }
/*--------------------------------------------------------
■ヘッダーロゴ
--------------------------------------------------------*/

div#header-logo { z-index: 1; position: absolute; top: 0px; width: 810px; _width: 812px;/*IE*/ height: 206px; text-align: left; background: url(img/header.jpg); }
div#header-logo p { position: absolute; top: 90px; left: 20px; }
div#header-logo img { position: absolute; top: 30px; left: 10px; }
/*--------------------------------------------------------
■コンテンツ全体
--------------------------------------------------------*/

div#main { overflow: hidden; position: absolute; top: 205px; width: 810px; _width: 812px;/*IE*/ text-align: center; background: #fff; }
div#main .contents { clear: both; margin: 0; padding: 0px 10px 15px 10px; }

/*--------------------------------------------------------
■メインエリア
--------------------------------------------------------*/

div#main-area { margin: 20px auto 0 auto; width: 730px; text-align: left; background: #fff; }
div#main-area ol {margin:20px 0 10px 0px;}
div#main-area ol li {margin:0 0 10px 30px; font-size:14px;}
/*--------------------▽トップコンテンツ*/

div#main-area .catch { margin: 0 0 20px 0; padding: 5px 15px 5px 15px; background: url(img/bg/top_cate.jpg) repeat-x top; border: solid 1px #ccc; }
div#main-area .catch h2 { margin: 0 0 10px 0; padding: 2px 0 0 30px; background: url(img/icon/des.gif) no-repeat left; color: #000; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; font-size: 1.5em; font-weight: normal; border-bottom: solid 1px #ccc; }
div#main-area .catch p { font-size: 11pt; }
/*--------------------▽コンテンツ*/

div#main-area .contents { clear: both; margin: 20px 20px 40px 20px; }
div#main-area .contents p { color: #333; }
.check { margin: 30px 0 0 0; padding: 5px 0 4px 130px; background: url(images/check.gif) no-repeat left; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; font-size: 12pt!important; }
div#main-area .contents table { width: 690px; _width: 692px; margin: 0 0 30px 0; padding: 0; border-collapse: collapse; }
div#main-area .contents th, div#main-area .contents td { padding: 3px 5px; border: solid 1px #ccc; text-align: center; }
div#main-area .contents th { background: #fffadd; }
.noback { background: none!important; }
div#main-area .contents table.wi { width: 440px!important; }
div#main-area .contents table.wi th { padding: 3px 10px; text-align: left; }
div#main-area .contents table.wi td { padding: 3px 10px; text-align: right; }
div#main-area .contents ul { margin: 0 0 20px 20px; color: #333; }
/*--------------------▽コンテンツ2*/

div#main-area .contents2 { clear: both; margin: 20px 20px 40px 20px; }
div#main-area .contents2 p { margin-bottom: 20px; font-size: 11pt; }
.link-next { font-weight: bold; text-align: right; }
/*--------------------▽box*/

.box-bg { clear: both; margin: 30px 0; padding: 8px; text-align: left; background: url(images/box-bg.gif); }
.box-bg h3 { margin: 0px 120px 0px 0px; padding: 5px 5px 5px 10px; font-size: 14px; color: #fff; font-weight: normal; background: #6e8c4c; }
.box { margin: 0px; padding: 10px; background: #fff; border:1px solid #7abd3c; }
/*--------------------▽btn*/

.btn { width: 730px; height: 310px; margin: 0 0 30px 0; background: url(img/ad.jpg) no-repeat; }
.btn a { position: absolute; margin: 190px 0 0 340px; }
/*--------------------▽コンテンツ内の線*/

div#main-area hr { clear: both; margin: 10px 0 10px 0; color: #ccc; }
/*--------------------▽右コンテンツ内のPタグは、自動改行*/

p { margin-bottom: 1.0em; }
/*--------------------------------------------------------
■関連サイト
--------------------------------------------------------*/

div#main-area .site { clear: both; margin: 10px 20px 40px 10px; }
div#main-area .site ul { margin: 0; }
div#main-area .site li { display: inline; padding: 0px 10px; color: #333; font-size: 9pt; line-height: 150%; border-right: 1px solid #333; list-style-type: none; list-style-position: outside; }
/*--------------------------------------------------------
■サイトマップ
--------------------------------------------------------*/

div#main-area .sitemap { clear: both; margin: 20px 20px 40px 20px; }
div#main-area .sitemap ul { margin: 0 0 20px 20px; list-style-type: disc; list-style-position: outside; line-height: 250%; }
div#main-area .sitemap ul ul { margin: 0 0 0 40px; list-style-type: circle; line-height: 180%; }
/*--------------------------------------------------------
■フッターメニュー
--------------------------------------------------------*/

div#footer { clear: both; width: 810px; padding-top: 20px; text-align: center; background: url(images/foot.jpg) repeat-x top #f8f8f6; }
/*--------------------▽フッター内で使用する線*/

div#footer hr { clear: both; color: #aaa; }
/*/*--------------------▽メニューリスト*/

div#footer .menu { margin: 0 0 7px 0; }
div#footer .menu ul { text-align: right; margin-right: 10px; margin-bottom: 10px; }
div#footer .menu li { display: inline; margin-right: 8px; padding-left: 10px; color: #666; font-size: 8.5pt; line-height: 14pt; border-left: 1px solid #666; }
div#footer .menu a { color: #666; }
div#footer .menu a:hover { color: #f60; }
div#footer p { clear: both; margin-left: 20px; margin-right: 20px; color: #666; font-size: 12px; text-align: left; }
/*--------------------------------------------------------
■Copyright
--------------------------------------------------------*/

div#footer #copyright { clear: both; padding: 5px 0 5px 0; width: 810px; font-size: 12px; line-height: 14pt; color: #666; }
div#footer #copyright a { color: #666; text-decoration: none; }
div#footer #copyright a:hover { color: #666; text-decoration: underline; }
/*------------------------------------------------------------
●１、align・・・文字の横位置
-------------------------------------------------------------*/

.al-c { text-align: center!important; }/*中央寄せ*/
.al-r { text-align: right!important; }/*右寄せ*/
.al-l { text-align: left!important; }/*左寄せ*/
/*------------------------------------------------------------
●２、valign・・・文字の縦位置
-------------------------------------------------------------*/

.vl-t { vertical-align: top; }/*上寄せ*/
.vl-m { vertical-align: middle; }/*中央寄せ*/
.vl-b { vertical-align: bottom; }/*下寄せ*/
/*------------------------------------------------------------
●３、float・・・ブロックの左右の寄せ
-------------------------------------------------------------*/

.fl-c { clear: both; }/*左右の寄せを解除*/
.fl-r { float:right; margin-left: 20px; }/*右寄せ*/
.fl-l { float:left; margin-right: 20px; }/*左寄せ*/
.impact { padding: 0px; color: #000000; background-color: #ffff33; }
.impact2 { padding: 0px; color: #000000; background-color: #ccff66; }
/*------------------------------------------------------------
●８、line-height・・・行間の設定
-------------------------------------------------------------*/

.lh13 { line-height: 1.3em!important; }
.lh14 { line-height: 1.4em!important; }
.lh15 { line-height: 1.5em!important; }
.lh16 { line-height: 1.6em!important; }
.lh17 { line-height: 1.7em!important; }
.lh18 { line-height: 1.8em!important; }
.lh19 { line-height: 1.9em!important; }
.lh20 { line-height: 2.0em!important; }
/*------------------------------------------------------------
●９、underline・・・アンダーライン（下線）の設定
-------------------------------------------------------------*/

.underline { text-decoration: underline!important; }
/*------------------------------------------------------------
●１０、取り消し線の設定
-------------------------------------------------------------*/

.del { text-decoration:line-through; }
/*------------------------------------------------------------
●１１、box・・・カラーボックスの設定
-------------------------------------------------------------*/

.box-yellow { background-color: #ffff00!important; }/*黄色のボックス*/
.box-aqua { background-color: #00ffff!important; }/*水色のボックス*/
.box-gray { background-color: #eee!important; }/*灰色のボックス*/
.box-red { background-color: #fc9b8b!important; }/*赤色のボックス*/
/*------------------------------------------------------------
●１２、input:focus・・・入力フォームをハイライトする
-------------------------------------------------------------*/

input:focus, textarea:focus { background-color: #dee!important; }
/*------------------------------------------------------------
●１３、hr・・・線の基本設定
-------------------------------------------------------------*/

hr { clear: both; margin: 0; padding: 0; border-width: 1px 0 0 0; height: 1px; border-style: solid none none none; color: #ccc; }
/*------------------------------------------------------------
●１４、left、right・・・画像の横位置設定
-------------------------------------------------------------*/

/*--------------------▽左に画像、右に文章*/

.left { float: left; margin: 0 30px 20px 0!important; }
/*--------------------▽右に画像、左に画像*/

.right { float: right; margin: 0 0 20px 30px!important; }
/*------------------------------------------------------------
●１５、top、middle、bottom・・・画像の縦位置設定
-------------------------------------------------------------*/

/*--------------------▽画像の縦位置をtopに揃える*/

img.top { vertical-align: top!important; }
/*--------------------▽画像の縦位置をmiddleに揃える*/

img.middle { vertical-align: middle!important; }
/*--------------------▽右に画像、左に画像*/

img.bottom { vertical-align: bottom!important; }
/*------------------------------------------------------------
●１６、noborder・・・枠線を無くす
-------------------------------------------------------------*/

.noborder { border: 0!important; }
/*------------------------------------------------------------
●１６、zindex・・・重なりの優先度
-------------------------------------------------------------*/

.z2 { z-index: 2; }
.z3 { z-index: 3; }
/*------------------------------------------------------------
●１７、その他
-------------------------------------------------------------*/

.tag { border: 1px solid #ccc; padding: 2px 5px; }
.under { border-bottom: 1px solid #f60; }

/*------------------------------------------------------------
7、class
-------------------------------------------------------------*/
.b { font-weight: bold!important; }
.bbb /* 最大・太字 */ { color: #000; font-size: 1.5em; padding: 0; font-weight:bold;}
.bb /* 大・太字 */ { color: #000; font-size: 1.2em; font-weight:bold;}
.bbbr /* 最大・太字・赤 */ { color: #dc0000; font-size: 1.4em; font-weight:bold;}
.bbr /* 大・太字・赤 */ { color: #dc0000; font-size: 1.2em; font-weight:bold;}
.bbl /*太字・青 */ { color: #007fc0; font-weight: bold; }
.afi { font-weight:bold; font-size:20px; }
.afi2 { font-weight:bold; font-size:16px; }
.afi3 { font-weight:bold; font-size:14px; }
/*------------------------------------------------------------
7、color・・・フォントカラーの設定
-------------------------------------------------------------*/
.red { color: #cc0000; font-weight:bold; } /* 赤 */
.blue { color: #003399; } /* 青 */
.green { color: #339900; } /* 緑 */
.orange { color: #ff9900; } /* オレンジ */
.yellow { background: #FFFF99; font-weight:bold; color:#333; }

/*------------------------------------------------------------
   口コミ
-------------------------------------------------------------*/
.kutikomi { margin:0 0 25px 0; }
.kutikomi2 { margin:10px 0 10px 0; }
.kutikomi_top { background:url(img/bg/ktop.gif) no-repeat top; }
.kutikomi_bottom { background:url(img/bg/kbottom.gif) no-repeat top; height:7px; }
.kutikomi_top p { margin:10px 20px 0 30px; line-height:1.3em; }
.kutikomi_m10a { background:url(img/illust/10a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m10b { background:url(img/illust/10b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m10a_2 { background:url(img/illust/10a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m10b_2 { background:url(img/illust/10b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20a { background:url(img/illust/20a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20b { background:url(img/illust/20b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20a_2 { background:url(img/illust/20a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20b_2 { background:url(img/illust/20b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20a_3 { background:url(img/illust/20a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20b_3 { background:url(img/illust/20b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20a_4 { background:url(img/illust/20a_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m20b_4 { background:url(img/illust/20b_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30a { background:url(img/illust/30a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30b { background:url(img/illust/30b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30a_2 { background:url(img/illust/30a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30b_2 { background:url(img/illust/30b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30a_3 { background:url(img/illust/30a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30b_3 { background:url(img/illust/30b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30a_4 { background:url(img/illust/30a_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m30b_4 { background:url(img/illust/30b_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40a { background:url(img/illust/40a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40b { background:url(img/illust/40b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40a_2 { background:url(img/illust/40a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40b_2 { background:url(img/illust/40b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40a_3 { background:url(img/illust/40a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40b_3 { background:url(img/illust/40b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40a_4 { background:url(img/illust/40a_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m40b_4 { background:url(img/illust/40b_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50a { background:url(img/illust/50a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50b { background:url(img/illust/50b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50a_2 { background:url(img/illust/50a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50b_2 { background:url(img/illust/50b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50a_3 { background:url(img/illust/50a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50b_3 { background:url(img/illust/50b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50a_4 { background:url(img/illust/50a_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m50b_4 { background:url(img/illust/50b_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60a { background:url(img/illust/60a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60b { background:url(img/illust/60b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60a_2 { background:url(img/illust/60a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60b_2 { background:url(img/illust/60b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60a_3 { background:url(img/illust/60a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60b_3 { background:url(img/illust/60b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60a_4 { background:url(img/illust/60a_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m60b_4 { background:url(img/illust/60b_4.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m70a { background:url(img/illust/70a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m70b { background:url(img/illust/70b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m70a_2 { background:url(img/illust/70a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_m70b_2 { background:url(img/illust/70b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w10a { background:url(img/illust/w10a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w10b { background:url(img/illust/w10b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w10a_2 { background:url(img/illust/w10a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w10b_2 { background:url(img/illust/w10b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w10a_3 { background:url(img/illust/w10a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w10b_3 { background:url(img/illust/w10b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w20a { background:url(img/illust/w20a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w20b { background:url(img/illust/w20b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w20a_2 { background:url(img/illust/w20a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w20b_2 { background:url(img/illust/w20b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w20a_3 { background:url(img/illust/w20a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w20b_3 { background:url(img/illust/w20b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w30a { background:url(img/illust/w30a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w30b { background:url(img/illust/w30b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w30a_2 { background:url(img/illust/w30a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w30b_2 { background:url(img/illust/w30b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w30a_3 { background:url(img/illust/w30a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w30b_3 { background:url(img/illust/w30b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w40a { background:url(img/illust/w40a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w40b { background:url(img/illust/w40b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w40a_2 { background:url(img/illust/w40a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w40b_2 { background:url(img/illust/w40b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w40a_3 { background:url(img/illust/w40a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w40b_3 { background:url(img/illust/w40b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w50a { background:url(img/illust/w50a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w50b { background:url(img/illust/w50b.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w50a_2 { background:url(img/illust/w50a_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w50b_2 { background:url(img/illust/w50b_2.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w50a_3 { background:url(img/illust/w50a_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w50b_3 { background:url(img/illust/w50b_3.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w60a { background:url(img/illust/w60a.gif) no-repeat 8px 0; width:80px; height:80px; }
.kutikomi_w60b { background:url(img/illust/w60b.gif) no-repeat 8px 0; width:80px; height:80px; }

