@charset "UTF-8";
@import url("smoothness/jquery-ui-1.8.4.custom.css"); 

/* =======================================================================
CSSの名前：style.css 
最終更新日時：2012/2/15
--------------------------------------------------------------------------
1.reset
2.base
3.コンテナ・サイドバー・メインコンテンツ
4.ヘッダ
5.サイドバー
6.extファイル用
7.トップページ
8.カートの中身～注文完了まで、プレゼント応募～完了まで
9.定期購入商品履歴照会・変更
10.フッタ
11.商品詳細・一覧、プレゼント詳細・一覧
12.レビュー
13.購入履歴
14.サブウインドウで表示するページ用
15.エラーページ
======================================================================= */


/* =================================================================
1.reset
=================================================================*/
body{background:#FFF; color:#333; line-height:1.5; font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",verdana,Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; word-wrap:break-word;}

/*  すべてのタグのマージン・パディングの設定をリセット
-------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,hr{margin:0; padding:0;}
li{list-style-type:none;}
table{border-collapse:collapse; border-spacing:0;}
img{border:0;}


/* =================================================================
2.base
=================================================================*/

/*  padding/margin
-------------------------------------------------------------*/
.m0{margin:0;}
.mT0{margin-top:0;}
.mB0{margin-bottom:0;}
.mR0{margin-right:0;}
.mL0{margin-left:0;}
.mT10{margin-top:10px;}
.mB10{margin-bottom:10px;}
.mR10{margin-right:10px;}
.mL10{margin-left:10px;}
.mT20{margin-top:20px;}
.mB20{margin-bottom:20px;}
.mR20{margin-right:20px;}
.mL20{margin-left:20px;}
.mT30{margin-top:30px;}
.mB30{margin-bottom:30px;}
.mR30{margin-right:30px;}
.mL30{margin-left:30px;}
.mT40{margin-top:40px;}
.mB40{margin-bottom:40px;}
.mR40{margin-right:40px;}
.mL40{margin-left:40px;}
.mT50{margin-top:50px;}
.mB50{margin-bottom:50px;}
.mR50{margin-right:50px;}
.mL50{margin-left:50px;}
/*------------------------------*/
.p0{padding:0;}
.pT0{padding-top:0;}
.pB0{padding-bottom:0;}
.pR0{padding-right:0;}
.pL0{padding-left:0;}
.pT10{padding-top:10px;}
.pB10{padding-bottom:10px;}
.pR10{padding-right:10px;}
.pL10{padding-left:10px;}
.pT20{padding-top:20px;}
.pB20{padding-bottom:20px;}
.pR20{padding-right:20px;}
.pL20{padding-left:20px;}
.pT30{padding-top:30px;}
.pB30{padding-bottom:30px;}
.pR30{padding-right:30px;}
.pL30{padding-left:30px;}
.pT40{padding-top:40px;}
.pB40{padding-bottom:40px;}
.pR40{padding-right:40px;}
.pL40{padding-left:40px;}
.pT50{padding-top:50px;}
.pB50{padding-bottom:50px;}
.pR50{padding-right:50px;}
.pL50{padding-left:50px;}

/*  clear
-------------------------------------------------------------*/
.clear{clear:both;}
.clearfloat{clear:both; height:0; font-size:1px; line-height:0;}
.clearfix{zoom:1;}
.clearfix:after{content:""; display:block; clear:both;}


/*  左・右寄せ
-------------------------------------------------------------*/
.fL{float:left;}
.fR{float:right;}
.txC{text-align:center;}
.txR{text-align:right;}

/*  基本のlink color
-------------------------------------------------------------*/
a:link{color:#333;}
a:visited{color:#333;}
a:hover {text-decoration:none;}
a:active{ color:#333;}


/* =================================================================
3.コンテナ・サイドバー・メインコンテンツ
使用ファイル：すべてのファイル
=================================================================*/

/* container - サイドバー・メインコンテンツを格納するコンテナ
-------------------------------------------------------------*/
#container{width:960px; margin:auto;}

/* sidebar - コンテナ内サイドバー
-------------------------------------------------------------*/
#sidebar{ position:relative; float:left; width:220px; z-index:100; }

/* main - コンテナ内メインコンテンツ
-------------------------------------------------------------*/
#main{float:right; width:720px; padding-bottom:20px;}
#main h2{display:block; height:25px; padding:3px 10px 3px 25px; background:url("../images/title_bg.gif") no-repeat; font-size:85%;}
#main p{margin:5px 20px; font-size:80%; line-height:150%;}
#main table{width:700px; margin:10px 20px; font-size:80%; border:1px solid #CCC; line-height:160%;}
#main th{padding:15px; border:1px solid #CCC; background:#EEE; vertical-align:top; font-weight:normal;}
#main th.title{width:160px; text-align:left;}
#main th.address{width:150px;}
#main td{padding:15px; border:1px solid #CCC; vertical-align:top;}
#main .buttonarea{margin:10px; padding-top:20px; border-top:#CCC 1px dashed; text-align:center;}
#main .buttonareaFR{margin:0 20px; float:right;}
#main .buttonareaFR:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#main .hissu{color:#C00; font-weight:bold;}
#main #breadcrumbs{margin-bottom:10px; font-size:80%;}

.no-sidebar{float:none !important; width:850px !important; min-height:500px; margin:auto !important;}
.no-sidebar table{width:810px !important;}
.no-sidebar th{padding:20px !important;}
.no-sidebar td{padding:20px !important;}


/* =================================================================
4.ヘッダ
使用ファイル：common/header.xhtml
=================================================================*/

/* smartphone - スマートフォン専用サイトへのリンク
-------------------------------------------------------------*/
#smartphone a{display:block; width:980px; height:220px; margin:auto; background:url("../images/button_smartphone.png") no-repeat; text-indent:-9999px;}

/* preview - プレビュー時に表示するエリア
-------------------------------------------------------------*/
#preview{margin-bottom:10px; padding:5px; border-bottom:1px solid #CCC; background:#1C8600; color:#FFF; font-family:"メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; font-size:80%; text-align:center;}
#preview table{width:800px; margin:auto;}
#preview .ico{width:20%; padding-right:10px; text-align:right;}
#preview .content{text-align:left;}

/* header - ヘッダ
-------------------------------------------------------------*/
#header{ position:relative; margin:0 auto; width:980px; height:140px; z-index:101; }
#header h1 { position:absolute; left:15px; top:0; width:190px;}
#header h1 a{display:block; overflow:hidden; padding:120px 0 0 0; height:0; background:url('../images/header_title.gif') no-repeat; }

/* menu - メニュー
-------------------------------------------------------------*/
#header .menu{float:right; width:775px;}
#header .menu .tagline{float:right; padding:15px 0 0 0; font-weight:bold; font-size:75%;}

#header .menu ul.btn{float:right; padding:0 10px 0 8px;}
#header .menu ul.btn li{float:left; padding:0 0 0 1px; font-size:0; line-height:1;}
#header .menu ul.btn li a:hover img{opacity:0.75; filter: alpha(opacity=75);}
#header .menu ul.nav{clear:both; padding:15px 2px 0 0;}
#header .menu ul.nav li{float:right; padding:0 8px 0 0; font-size:68.8%;}
#header .menu ul.nav li a{display:block; padding:0 0 0 8px; background:url(../images/arw_r_01.gif) no-repeat 0 0.4em;}
#header .menu ul.nav li a:hover {opacity:0.75; filter: alpha(opacity=75);}

/* headerPanel - パネル
-------------------------------------------------------------*/
#headerPanel .panel { display:none; position:absolute; left:50%; margin:0 0 0 -490px; padding:40px 30px 30px 30px; width:920px; background-color:#fff; z-index:103; }
#headerPanel .panel .panelClose { position:absolute; bottom:-36px; width:120px; height:36px; cursor:pointer;}
#headerPanel .panel .panelClose img {font-size:0; line-height:1; display:block; vertical-align:bottom;}

/* loginPanel - パネル・ログイン
-------------------------------------------------------------*/
#headerPanel #loginPanel { top:-291px; border-bottom:#b5a04b 4px solid; }
#headerPanel #loginPanel>div{ border:#dbdada 1px solid; height:128px; background:#f5f4f4; }
#headerPanel #loginPanel>div h2 { padding:18px 0 16px 18px; }
#headerPanel #loginPanel>div h2 img { display:block; }
#headerPanel #loginPanel .member { float:left; width:626px; }
#headerPanel #loginPanel .member p { float:left; }
#headerPanel #loginPanel .member p input[type="text"],
#headerPanel #loginPanel .member p input[type="password"] {padding:4px 3px; border:#c9c9c9 1px solid; width:176px; border-radius:2px; font-size:13px;}
#headerPanel #loginPanel .member p.inputId { padding:8px 0 0 23px; }
#headerPanel #loginPanel .member p.inputPassword { padding:8px 0 0 9px; }
#headerPanel #loginPanel .member p.inputBtn { padding:0 0 0 23px; }
#headerPanel #loginPanel .member p.inputBtn input { display:block; }
#headerPanel #loginPanel .member p.inputBtn input:hover {opacity:0.75; filter: alpha(opacity=75);}
#headerPanel #loginPanel .member p.error { clear:both; float:none; padding:0 0 0 25px; color:#ff0000; font-weight:bold; font-size:14px; }
#headerPanel #loginPanel .new { float:right; width:273px; }
#headerPanel #loginPanel .new p { text-align:center; }
#headerPanel #loginPanel .new p a:hover img {opacity:0.75; filter: alpha(opacity=75);}
#headerPanel #loginPanel ul { clear:both; padding:8px 0 0 0; }
#headerPanel #loginPanel ul li { padding:3px 0 0 0; font-size:75%; }
#headerPanel #loginPanel ul li a {padding:0 0 0 8px; background:url(../images/arw_r_02.gif) no-repeat 0 0.4em;}
#headerPanel #loginPanel ul li a:hover{opacity:0.75; filter: alpha(opacity=75);}
#headerPanel #loginPanel .panelClose { right:130px; }

/* mypagePanel - パネル・マイページ
-------------------------------------------------------------*/
#headerPanel #mypagePanel { top:-291px; border-bottom:#b5a04b 4px solid; }
#headerPanel #mypagePanel>.inner { border:#d9d8d8 1px solid; padding:19px 0 19px 19px; width:897px; background:#eee; }
#headerPanel #mypagePanel .btn { float:left; padding:0 41px 0 0; background:url(../images/hdr_mypagepanel_line_02.gif) repeat-y 274px 0; }
#headerPanel #mypagePanel .btn li { font-size:0; line-height:1; }
#headerPanel #mypagePanel .btn li+li { padding:13px 0 0 0; }
#headerPanel #mypagePanel .btn li a:hover { opacity:0.75; filter: alpha(opacity=75); }
#headerPanel #mypagePanel .membermenu { float:left; width:392px; min-height:122px; background:#fff url(../images/hdr_mypagepanel_line_01.gif) repeat-y 191px 0; }
#headerPanel #mypagePanel .membermenu .section { float:left; padding:15px 0 0 30px; width:165px; }
#headerPanel #mypagePanel .membermenu .section p { font-weight:bold; font-size:15px; }
#headerPanel #mypagePanel .membermenu .section ul { padding:9px 0 0 0; }
#headerPanel #mypagePanel .membermenu .section ul li { padding:1px 0 0 0; font-size:13px; }
#headerPanel #mypagePanel .membermenu .section ul li a { display:block; padding:0 0 0 13px; background:url(../images/arw_r_05.png) no-repeat 0 0.4em; }
#headerPanel #mypagePanel .logout { float:left; }
#headerPanel #mypagePanel input.button { padding:83px 0 0 20px; }
#headerPanel #mypagePanel input.button:hover{opacity:0.75; filter: alpha(opacity=75);}
#headerPanel #mypagePanel .panelClose { right:130px; }

/* loginPanel - パネル・カート
-------------------------------------------------------------*/
#headerPanel #cartPanel { top:-241px; border-bottom:#164885 4px solid; }
#headerPanel #cartPanel>.inner { margin:0 0 10px 0; border-top:#96938a 1px dotted; border-bottom:#96938a 1px dotted; padding:2px 0; }
#headerPanel #cartPanel .inner .inner { padding:30px 0 30px 30px; background:#f5f2e9; }
#headerPanel #cartPanel p { float:left; padding:15px 0 0 0; }
#headerPanel #cartPanel p.amount {}
#headerPanel #cartPanel p.amount strong { font-weight:bold; font-size:112.5%; }
#headerPanel #cartPanel p.total { padding-left:15px; }
#headerPanel #cartPanel p.total strong { color:#9f1a1a; font-weight:bold; font-size:112.5%; }
#headerPanel #cartPanel p.total span.tax { color:#333; font-weight:normal; font-size:72.2%; }
#headerPanel #cartPanel p.postage { padding:23px 0 0 5px; font-size:75%; }
#headerPanel #cartPanel p.postage span { color:#9f1a1a; }
#headerPanel #cartPanel p.btn { float:right; padding:0 30px 0 24px; width:278px; }
#headerPanel #cartPanel p.btn img { display:block; }
#headerPanel #cartPanel p.btn:hover img{opacity:0.75; filter: alpha(opacity=75);}
#headerPanel #cartPanel .panelClose { right:10px; }

/* overlayMask - オーバーレイマスク
-------------------------------------------------------------*/
#overlayMask { display:none; opacity:0; position:fixed; top:0; left:0; width:100%; height:100%; background:url(../images/overlaymask.png); z-index:102; }


/* =================================================================
5.サイドバー
使用ファイル：common/sidebar.xhtml
=================================================================*/

/* widget - ウィジェット
-------------------------------------------------------------*/
#sidebar .widget { margin:0 0 20px 0; border-top:#164885 4px solid; background:#fff; }
#sidebar .widget>.inner { border:#dbdce0 1px solid; }
#sidebar .widget h2 {}
#sidebar .widget h2 img { display:block; }

/* search - 検索枠
-------------------------------------------------------------*/
#sidebar .search {}
#sidebar .search .input { margin:0 auto; width:178px; height:49px;}
#sidebar .search .input input[type="text"] {border:#b9c8da 1px solid; border-right:none; padding:4px 3px; width:142px; height:19px; font-size:13px; vertical-align:top;}
#sidebar .search .input input[type="image"] {border:#b9c8da 1px solid; border-left:none; }
#sidebar .search .allergy { border-top:#dbdce0 1px solid; }
#sidebar .search .allergy img { display:block; }
#sidebar .search .allergy a:hover img {opacity:0.75; filter: alpha(opacity=75);}

/* category - カテゴリ
-------------------------------------------------------------*/
#sidebar .category {}
#sidebar .category ul.nav li { position:relative; }
#sidebar .category ul.nav li img { display:block; }
#sidebar .category ul.nav li a:hover img {opacity:0.75; filter: alpha(opacity=75);}
#sidebar .category ul.nav ul.submenu { display:none; position:absolute; left:234px; top:-22px; padding:30px 50px 38px 20px; width:392px; background:url(../images/sb_category_nav_sub_bg.png); font-size:13px; line-height:1.5; border-radius:3px; }
#sidebar .category ul.nav ul.submenu:before { content:""; display:block; position:absolute; left:-27px; top:22px; padding:0 0 0 27px; height:49px; background:url(../images/sb_category_nav_sub_arw.png) no-repeat; }
#sidebar .category ul.nav ul.submenu li { float:left; padding:10px 0 0 30px; width:166px; }
#sidebar .category ul.nav ul.submenu li:first-child { float:none; padding-bottom:20px; width:342px; }
#sidebar .category ul.nav ul.submenu li a { display:block; padding:0 0 0 10px; background:url(../images/arw_r_03.png) no-repeat 0 0.4em; color:#fff; text-decoration:none; }
#sidebar .category ul.nav ul.submenu li a:hover { opacity:0.75; filter: alpha(opacity=75); }

/* brand - ブランド
-------------------------------------------------------------*/
#sidebar .brand {}
#sidebar .brand ul.nav { padding:0 15px; }
#sidebar .brand ul.nav li { font-size:75%; }
#sidebar .brand ul.nav li+li { border-top:#e9eaec 1px solid; }
#sidebar .brand ul.nav li a { display:block; padding:6px 0 5px 20px; background:url(../images/arw_r_01.gif) no-repeat 5px 50%; text-decoration:none; }
#sidebar .brand ul.nav li a:hover {opacity:0.75; filter: alpha(opacity=75);}


/* =================================================================
6.extファイル用
使用ファイル：ext/company.html
　　　　　　　ext/tokushou.html
　　　　　　　ext/guide.html
=================================================================*/

#ext h2{display:block; height:25px; padding:3px 10px 3px 25px; background:url("../images/title_bg.gif") no-repeat; font-size:85%;}
#ext h3{display:block; margin:30px 20px 10px 10px; padding:5px; border-bottom:#DDD 1px solid; border-left:#960 6px solid; font-size:80%;}
#ext th{text-align:left;}
#ext ul{padding-bottom:10px;}
#ext li{list-style:disc; margin:5px 40px; font-size:80%;}


/* =================================================================
7.トップページ
使用ファイル：top.xhtml
=================================================================*/

/* mainvisual - メインビジュアル
-------------------------------------------------------------*/
#mainvisual img{display:block; margin-bottom:20px;}

/* topics - トピックス
-------------------------------------------------------------*/
#topics{zoom:1; float:left; width:540px; padding-bottom:20px;}
#topics .box{zoom:1; border-bottom:#CCC solid 1px;}
#topics .box:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#topics h3{display:block; float:left; width:90px; padding:5px 10px; font-size:90%; font-weight:normal;}
#topics p{display:block; float:left; width:370px; margin:0; padding:5px 10px; font-size:90%; font-weight:normal;}
#topics p img{display:block; float:right; margin:0 0 5px 5px;}
#topics .rss{display:block; float:right; width:15px; height:15px; overflow:hidden; margin:3px 3px 0 0; background:url("../images/header_rss.gif") 0 0 no-repeat; text-indent:-9999px;}
#topics .rss:hover{background:url("../images/header_rss.gif") 0 -15px no-repeat;}

/* new - 新着商品
-------------------------------------------------------------*/
#new{zoom:1; float:left; width:540px; padding-bottom:10px;}
#new:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#new .box{float:left; width:260px; margin-right:8px; margin-bottom:10px; border:#CCC 1px solid;}
#new .text{float:right; width:119px;}
#new h3{display:block; margin:10px 10px 0 0; font-size:13px; font-weight:normal; line-height:120%;}
#new .price{display:block; margin:5px 7px 5px 0; font-size:12px; color:#C00;}
#new .iconarea{display:block; margin:10px 7px 0 0;}
#new .button{display:block; clear:both; margin-bottom:5px; text-align:center;}
#new .img{display:block; width:120px; height:120px; margin:10px;}

/* recommend - おすすめ商品
-------------------------------------------------------------*/
#recommend{zoom:1; float:left; width:540px; padding-bottom:10px;}
#recommend:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#recommend .box{float:left; width:260px; margin-right:8px; margin-bottom:10px; border:#CCC 1px solid;}
#recommend .text{float:right; width:119px;}
#recommend h3{display:block; margin:10px 10px 0 0; font-size:13px; font-weight:normal; line-height:120%;}
#recommend .price{display:block; margin:5px 7px 5px 0; font-size:12px; color:#C00;}
#recommend .iconarea{display:block; margin:10px 7px 0 0;}
#recommend .button{display:block; clear:both; margin-bottom:5px; text-align:center;}
#recommend .img{display:block; width:120px; height:120px; margin:10px;}

/* ranking - 人気商品ランキング
-------------------------------------------------------------*/
#ranking{float:right; width:190px; margin-bottom:10px; background:url("../images/sidebar_middle_bg.gif") repeat-y;}
#ranking h2{display:block; width:190px; height:30px; padding:0; background:url("../images/ranking_title.gif") no-repeat; text-indent:-9999px;}
#ranking h4{width:110px; margin-left:10px; font-size:80%; font-weight:normal;}
#ranking h3{width:100px; height:20px; text-indent:-9999px;}
#ranking p{width:110px; margin:0 0 5px 10px; color:#C00; font-size:75%;}
#ranking #ranking_no1 h3{background:url("../images/ranking_no01.gif") 10px 5px no-repeat;}
#ranking #ranking_no2 h3{background:url("../images/ranking_no02.gif") 10px 5px no-repeat;}
#ranking #ranking_no3 h3{background:url("../images/ranking_no03.gif") 10px 5px no-repeat;}
#ranking #ranking_no4 h3{background:url("../images/ranking_no04.gif") 10px 5px no-repeat;}
#ranking #ranking_no5 h3{background:url("../images/ranking_no05.gif") 10px 5px no-repeat;}
#ranking #ranking_no6 h3{background:url("../images/ranking_no06.gif") 10px 5px no-repeat;}
#ranking #ranking_no7 h3{background:url("../images/ranking_no07.gif") 10px 5px no-repeat;}
#ranking #ranking_no8 h3{background:url("../images/ranking_no08.gif") 10px 5px no-repeat;}
#ranking #ranking_no9 h3{background:url("../images/ranking_no09.gif") 10px 5px no-repeat;}
#ranking #ranking_no10 h3{background:url("../images/ranking_no10.gif") 10px 5px no-repeat;}
#ranking .box{zoom:1; border-bottom:#CCC solid 1px;}
#ranking .box:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#ranking .text{float:left; width:120px ;margin-bottom:5px;}
#ranking .img{float:left; width:50px; height:50px; margin:10px;}


/* =================================================================
8.カートの中身～注文完了まで、プレゼント応募～完了まで
使用ファイル：cart_index.xhtml, cart_login.xhtml
　　　　　　　cart_seisan.xhtml, cart_confirm.xhtml
　　　　　　　cart_pre.xhtml, cart_result.xhtml
　　　　　　　present_login.xhtml, present_input.xhtml
　　　　　　　present_confirm.xhtml, present_result.xhtml
=================================================================*/

/* cartIndex - 買い物かごの中身
-------------------------------------------------------------*/
#cartIndex{margin-bottom:20px;}
#cartIndex .step{display:block; margin:20px auto;}
#cartIndex .price{color:#C00; text-align:right;}
#cartIndex .amount{text-align:center;}
#cartIndex .delete{text-align:center;}
#cartIndex .total{margin:0 20px 30px; padding:5px 10px; font-weight:bold; text-align:right; border-bottom:#CCC 1px solid;}
#cartIndex .img{float:left; width:80px; height:80px; margin-right:10px;}
#cartIndex .box{border:1px solid #CCC; margin-bottom:30px;}
#cartIndex h3{margin-bottom:15px; padding:1px 20px; border-bottom:1px solid #CCC; background:url("../images/marker.gif") 7px 7px no-repeat #EEE; font-size:85%;}

/* cartLogin - 買い物かご・プレゼントログイン
-------------------------------------------------------------*/
#cartLogin .step{display:block; margin:20px auto;}
#cartLogin table{margin:0 20px 10px;}
#cartLogin h3{margin-bottom:15px; padding:1px 20px; border-bottom:1px solid #CCC; background:url("../images/marker.gif") 7px 7px no-repeat #EEE; font-size:85%;}
#cartLogin .box{border:1px solid #CCC; margin-bottom:30px;}

/* cartFlow - 買い物かご・プレゼント注文情報入力～注文完了まで
-------------------------------------------------------------*/
#cartFlow .step{display:block; margin:20px auto;}
#cartFlow h3{margin:30px 20px 10px; font-size:90%;}
#cartFlow .price{color:#C00; text-align:right;}
#cartFlow .amount{text-align:center;}
#cartFlow .total{margin:0 20px; padding:5px 10px; border-bottom:#CCC 1px solid; font-weight:bold; text-align:right;}
#cartFlow .point{color:#F60; font-weight:bold;}
#cartFlow .attention{color:#C00; font-weight:bold; font-size:110%;}
#cartFlow .img{float:left; width:80px; height:80px; margin-right:10px;}
#cartFlow .code{width:100px;}

/* =================================================================
9.定期購入商品履歴照会・変更
使用ファイル：teiki_index.xhtml, teiki_detail.xhtml
　　　　　　　teiki_renew.xhtml, teiki_renew_confirm.xhtml
=================================================================*/

/* teikiIndex - 定期購入商品一覧
-------------------------------------------------------------*/
#teikiIndex h3{margin:5px; padding-left:8px; border-left:6px solid #FFF; font-size:110%;}
#teikiIndex h4{display:block; margin:30px 20px 20px; padding-left:15px; border-bottom:1px solid #CCC; background:url("../images/marker.gif") 0 8px no-repeat; font-size:100%;}
#teikiIndex .box{margin:10px; padding:10px; border:1px solid #CCC; background:#FFF;}
#teikiIndex .head{padding:5px; background:#F1F1F1;}
#teikiIndex .headDetail{padding-left:15px; background:url("../images/marker_on.gif") 0 5px no-repeat;}
#teikiIndex .headRenew{color:#777; text-align:right;}
#teikiIndex .price{color:#C00; text-align:right;}
#teikiIndex table{width:668px;}
#teikiIndex th{padding:5px 10px;}
#teikiIndex td{text-align:center;}
#teikiIndex td.month{background:#F9F9F9; font-weight:bold; color:#960;}
#teikiIndex .status { float:right; margin-right:20px;}
#teikiIndex .cancel_oder{ text-align:right; margin: 0px 20px;}
#teikiIndex .cancel_oder form{ height:20px;}

/* teikiDetail - 定期購入商品照会・変更・確認画面
-------------------------------------------------------------*/
#teikiDetail h3{margin:5px; padding-left:8px; border-left:6px solid #FFF; font-size:110%;}
#teikiDetail h4{display:block; margin:30px 20px 20px; padding-left:15px; border-bottom:1px solid #CCC; background:url("../images/marker.gif") 0 8px no-repeat; font-size:100%;}
#teikiDetail h5{margin:20px 20px 0;}
#teikiDetail .box{margin:10px; padding:10px; border:1px solid #CCC; background:#FFF;}
#teikiDetail .head{padding:5px; background:#F1F1F1;}
#teikiDetail .headDetail{margin-right:20px; padding-left:5px; border-left:12px groove #333;}
#teikiDetail .price{color:#C00;}
#teikiDetail table{width:668px;}
#teikiDetail td.month{background:#F9F9F9; font-weight:bold; color:#960;}


/* =================================================================
10.フッタ
使用ファイル：common/footer.xhtml
=================================================================*/

#footer{clear:both; border-top:#161f35 1px solid; width:100%;}
#footer .inner{ position:relative; margin:0 auto; padding:40px 0 40px 0; width:980px;}
#footer .backtotop { position:absolute; right:0; top:-37px; }
#footer .backtotop a{display:block; overflow:hidden; padding:41px 0 0 0; width:133px; height:0; background:url("../images/footer_backtotop.png") no-repeat; }

/* footerPrimary - フッター・プライマリー
-------------------------------------------------------------*/
#footerPrimary{float:left; padding:0 63px 0 0; width:156px;}
#footerPrimary img{display:block;}
#footerPrimary .logo{}
#footerPrimary ul.mark{padding:13px 0 0 0;}
#footerPrimary ul.mark li{float:left;}
#footerPrimary ul.mark li+li{float:right;}
#footerPrimary .freedial{padding:18px 0 0 0;}

/* footerSitemap - フッター・サイトマップ
-------------------------------------------------------------*/
#footerSitemap{float:left; border-left:#dbdce0 1px solid; padding:0 0 0 17px; width:426px;}
#footerSitemap ul{float:left; padding:0 0 0 23px;}
#footerSitemap ul li{padding:0 0 7px 0; font-size:75%;}
#footerSitemap ul li a{display:block; padding:0 0 0 12px; background:url(../images/arw_r_01.gif) no-repeat 0 0.5em;}
#footerSitemap ul li a:hover{opacity:0.75; filter: alpha(opacity=75);}
#footerSitemap ul li span{font-size:83.3%;}

/* calendar - フッター・カレンダー
-------------------------------------------------------------*/
#calendar{float:left; width:316px;}
#calendar h2{display:block; overflow:hidden; padding:16px 0 0 0; width:111px; height:0px; background:url("../images/calendar_title.gif") no-repeat;}
#calendar p{padding:5px 0 0 0; font-size:62.5%;}
#calendar span.day_color1{color:#7da4e3;}
#calendar p span{font-size:120%;}
#SIDE_CALENDAR{margin:13px 0 0 0; width:316px; overflow:hidden; font-size:9px;}
#calendar .ui-widget-content{border:none;}
#calendar .ui-datepicker{margin:0 0 0 -16px; padding:0;}
#calendar .ui-datepicker-group{padding:0 0 0 16px; width:150px;}
#calendar .ui-datepicker-title{font-size:13px; line-height:1;}
#calendar .ui-widget-header{width:150px; border:none; border-radius:0; background:#3c5585; color:#d8dde6; font-weight:normal;}
#calendar .ui-datepicker .ui-datepicker-prev,
#calendar .ui-datepicker .ui-datepicker-next{display:none;}
#calendar .ui-datepicker .ui-datepicker-title{margin:0; padding:2px 0 2px 5px; text-align:left;}
#calendar .ui-datepicker table{border:#96a3bb 1px solid; border-top:none; width:150px; color:#444; font-size:11px;}
#calendar .ui-datepicker table th a,#calendar .ui-datepicker table td a {text-align:center;}
#calendar .ui-datepicker table .ui-state-default {background:none;}
#calendar .ui-datepicker th {padding:3px 0;}
#calendar .ui-datepicker th,.ui-datepicker td{width:10px !important; margin:0; border:none;}
#calendar .ui-datepicker th a,.ui-datepicker td a{padding:1px; border:none !important;}
#calendar .ui-datepicker-week-end{color:#C00;}
#calendar .ui-datepicker-row-break{display:none;}
#ui-datepicker-div {display:none;}

#calendar .ui-datepicker table .day_color1 .ui-state-default{background-image:none; background-color:#7da4e3;}


/* calendar - フッター・コピーライト
-------------------------------------------------------------*/
#footerCopyright{padding:20px 0; width:100%; background:#161f35; color:#fff; text-align:center; font-size:12px;}


/* =================================================================
11.商品詳細・一覧、プレゼント詳細・一覧
使用ファイル：item_list$detail.xhtml, item_list$image.xhtml
　　　　　　　item_list$simple.xhtml, item_detail.xhtml
　　　　　　　present_list.xhtml, present_detail.xhtml
=================================================================*/

/* category_html - カテゴリHTML
-------------------------------------------------------------*/
#category_html{margin-bottom:20px;}
#category_html img{display:block; margin-bottom:10px;}

/* itemListCategory - カテゴリ
-------------------------------------------------------------*/
#itemListCategory{margin-bottom:20px;}
#itemListCategory ul{display:block; zoom:1; width:748px; border:#CCC 1px solid; background:#F5F5F5;}
#itemListCategory ul:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#itemListCategory li{display:inline; float:left;}
#itemListCategory .select{background:url("../images/marker_on.gif") 7px 10px no-repeat #C00; color:#FFF; text-decoration:none;}
#itemListCategory li a{display:block; padding:5px; background:url("../images/marker.gif") 7px 10px no-repeat; color:#333; font-size:80%;text-decoration:none; text-indent:15px; white-space:nowrap;}
#itemListCategory li a:link{display:block;}
#itemListCategory li a:hover{background:url("../images/marker.gif") 7px 10px no-repeat #CCC; color:#FFF; text-decoration:underline;}
#itemListCategory #sub ul{display:block; width:748px; border:#CCC 1px solid; border-top:none; background:#FFF;}
#itemListCategory #sub ul:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#itemListCategory #sub li{display:inline; float:left;}
#itemListCategory #sub .select{background:url("../images/marker_on.gif") 7px 10px no-repeat #CCC; color:#FFF; text-decoration:none;}
#itemListCategory #sub li a{display:block; padding:5px; background:url("../images/marker.gif") 7px 10px no-repeat; color:#333; font-size:80%; text-decoration:none; text-indent:15px;}
#itemListCategory #sub li a:link{display:block;}
#itemListCategory #sub li a:hover{background:url("../images/marker.gif") 7px 10px no-repeat #CCC; color:#FFF; text-decoration:underline;}

/* list - 一覧画面共通のメニュー
-------------------------------------------------------------*/
#list{padding-bottom:20px;}
#list ul{zoom:1; margin-bottom:10px; padding-left:5px; background:url("../images/list_bg.gif") bottom repeat-x;}
#list ul:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#list li{float:left;}
#list li a{display:block; margin-right:5px; padding:5px 10px 5px 30px; border-top:1px solid #DDD; border-left:1px solid #DDD; border-right:1px solid #DDD; border-bottom:1px solid #CCC; font-size:80%;}
#list .detail{background:url("../images/list_detail.gif") 7px 7px no-repeat #DDD;}
#list .image{background:url("../images/list_image.gif") 7px 7px no-repeat #DDD;}
#list .simple{background:url("../images/list_simple.gif") 7px 7px no-repeat #DDD;}
#list .detail_select{border-top:1px solid #CCC; border-left:1px solid #CCC; border-right:1px solid #CCC; border-bottom:1px solid #FFF; background:url("../images/list_detail_on.gif") 7px 7px no-repeat #FFF; color:#333; text-decoration:none;}
#list .image_select{border-top:1px solid #CCC; border-left:1px solid #CCC; border-right:1px solid #CCC; border-bottom:1px solid #FFF; background:url("../images/list_image_on.gif") 7px 7px no-repeat #FFF; color:#333; text-decoration:none;}
#list .simple_select{border-top:1px solid #CCC; border-left:1px solid #CCC; border-right:1px solid #CCC; border-bottom:1px solid #FFF; background:url("../images/list_simple_on.gif") 7px 7px no-repeat #FFF; color:#333; text-decoration:none;}
#list .pageguide{float:left; width:500px; font-size:75%;}
#list .rearrange{float:left; width:200px; font-size:75%; text-align:right;}
#list .pagelink{clear:both; font-size:75%;}
#list .nolink{color:#999;}

/* itemListDetail - 商品詳細一覧・プレゼント一覧
-------------------------------------------------------------*/
#itemListDetail{margin-bottom:20px;}
#itemListDetail .box{zoom:1; margin-top:10px; border:#CCC 1px solid;}
#itemListDetail .box:hover{border:#8CC329 1px solid;}
#itemListDetail .box:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#itemListDetail .img{float:left; width:120px; height:120px; margin:10px;}
#itemListDetail .text{margin-left:140px;}
#itemListDetail h3{display:block; margin:10px 10px 0 0; font-size:95%;}
#itemListDetail .appeal{display:block; margin:0; color:#F60; font-size:70%;}
#itemListDetail .price{display:block; margin:0; color:#C00;}
#itemListDetail .price .teika{font-weight:bold; font-size:110%;}
#itemListDetail .price .other{font-size:90%;}
#itemListDetail .explanation1{display:block; margin:5px 10px 0 0; padding:5px 0; border-top:#CCC 1px solid; font-size:80%; line-height:120%;}
#itemListDetail .button{display:block; margin:5px 10px 5px 0; padding-top:10px; border-top:#CCC 1px solid; text-align:right;}
#itemListDetail .property{display:inline; margin:0; color:#AAA; font-size:75%;}

/* itemListSimple - 商品簡易一覧
-------------------------------------------------------------*/
#itemListSimple{margin-bottom:20px;}
#itemListSimple .box{zoom:1; margin-top:10px; border:#CCC 1px solid;}
#itemListSimple .box:hover{border:#8CC329 1px solid;}
#itemListSimple .box:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#itemListSimple h3{display:block; margin:10px 10px 0 10px; font-size:95%;}
#itemListSimple .appeal{display:block; margin:0 0 0 10px; color:#F60; font-size:70%;}
#itemListSimple .price{display:block; margin:0 0 0 10px; color:#C00;}
#itemListSimple .price .teika{font-weight:bold; font-size:110%;}
#itemListSimple .price .other{font-size:90%;}
#itemListSimple .explanation1{display:block; margin:5px 10px 0; padding:5px 0; border-top:#CCC 1px solid; font-size:80%; line-height:120%;}
#itemListSimple .button{display:block; margin:5px 10px; padding-top:10px; border-top:#CCC 1px solid; text-align:right;}
#itemListSimple .property{display:inline; margin:0; color:#AAA; font-size:75%;}

/* itemListImage - 商品画像一覧
-------------------------------------------------------------*/
#itemListImage{margin-bottom:20px;}
#itemListImage:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#itemListImage .box{float:left; margin-top:10px; width:235px; margin-right:10px; border:#CCC 1px solid;}
#itemListImage .box:hover{border:#8CC329 1px solid;}
#itemListImage .text{float:left; width:95px;}
#itemListImage h3{display:block; margin:5px 10px 0 0; font-size:14px; line-height:120%;}
#itemListImage .icon{display:block; margin:10px 7px 0 0; line-height:120%;}
#itemListImage .button{display:block; clear:both; margin:5px 0; text-align:center;}
#itemListImage .img{display:inline; float:left; margin:10px 6px 10px 10px;}

/* itemDetail - 商品詳細・プレゼント詳細
-------------------------------------------------------------*/
#itemDetail{margin-bottom:20px;}
#itemDetail .box{zoom:1; margin-top:10px; border:#CCC 1px solid;}
#itemDetail .box:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */
#itemDetail .iconarea{float:left; width:270;}
#itemDetail .otherImage{clear:both; padding:10px 10px 0 15px; font-size:75%;}
#itemDetail .recommend{clear:both; padding:0 10px 10px 15px; font-size:75%;}
#itemDetail .img{width:260px; height:260px; margin:10px;}
#itemDetail .propertyImg{float:left; margin-bottom:10px;}
#itemDetail .propertyImg img{display:block; margin-left:10px;}
#itemDetail .propertyImg p{margin:0; text-align:center;}
#itemDetail p{margin:0 0 10px;}
#itemDetail .text{float:right; width:455px;}
#itemDetail .appeal{display:block; margin:10px 10px 0 0; color:#F60; font-size:75%;}
#itemDetail h3{display:block; margin:10px 10px 5px 0; font-size:105%;}
#itemDetail .price{display:block; margin:0 10px 5px 0; font-size:90%; color:#C00;}
#itemDetail .price .teika{display:block; margin-bottom:5px; font-weight:bold; font-size:110%;}
#itemDetail .price .other{display:block; font-size:90%;}
#itemDetail .information{display:block; margin:0 10px 0 0; font-size:80%;}
#itemDetail .explanation2{display:block; margin:10px 10px 20px 0; padding-top:10px; border-top:#CCC 1px solid; font-size:80%; line-height:120%;}
#itemDetail .explanation3{display:block; margin:0 10px 20px 0; padding:10px; background:#EEE; color:#666; font-size:75%; line-height:120%;}
#itemDetail .button{display:block; margin:20px 10px 20px 0;}
#itemDetail table{width:445px; margin:0 0 10px;}
#itemDetail th{width:100px; padding:5px 10px; text-align:left;}
#itemDetail td{padding:5px 10px;}


/* =================================================================
12.レビュー
使用ファイル：item_detail.xhtml, member_review.xhtml
=================================================================*/
#review{margin-bottom:40px;}
#review p{margin:0 10px;}
#review p.item_name{font-size:95%; font-weight:bold;}
#review h3{float:left; margin:0 10px; font-size:80%;}
#review .box{zoom:1; margin:10px 0 5px; padding:10px; border:#CCC 1px solid;}
#review .box h3{float:none; font-size:90%;}
#review .box p{margin:0;}
#review .box p.name{padding:5px 0; margin-bottom:10px; border-bottom:1px dashed #CCC; color:#666; font-size:75%;}
#review p.goodButton{margin-bottom:5px; color:#666; font-size:75%;}
#review p.goodButton input{margin-left:5px;}
#review p.goodNumber{margin-bottom:20px; color:#666; font-size:75%;}
#review p.more{margin-bottom:20px; font-size:75%; text-align:right;}
#review p.pageguide{margin:10px;}
#review p.pagelink{text-align:center; margin-bottom:20px;}
#review ul.star{float:left; margin-right:10px;}
#review ul.star li{display:block; float:left; width:15px; height:15px; text-indent:-9999px;}
#review ul.star li.good{background:url("../images/review_good.gif") no-repeat;}
#review ul.star li.bad{background:url("../images/review_bad.gif") no-repeat;}
#review .contribution{zoom:1; margin-top:10px; padding:10px 10px 0 10px;}
#review .contribution table{margin:0; border:none;}
#review .contribution th{width:80px; padding:5px 10px; border:none; background:none; font-weight:normal; text-align:left;}
#review .contribution td{padding:5px 10px; border:none;}
#review .contribution h3{float:none; margin-bottom:10px; padding:3px 5px; border-right:1px solid #EEE; border-bottom:1px solid #DDD; border-left:5px solid #960; background:#F5F5F5; font-size:95%;}


/* =================================================================
13.購入履歴
使用ファイル：member_history.xhtml
=================================================================*/
#history h3{display:block; margin:40px 30px 0 20px; padding-left:55px; font-size:80%;}
#history h3.preparing{background:url("../images/history_preparing.gif") no-repeat;}
#history h3.delivered{background:url("../images/history_delivered.gif") no-repeat;}
#history h3.delivering{background:url("../images/history_delivering.gif") no-repeat;}
#history h3.canceled{background:url("../images/history_canceled.gif") no-repeat;}
#history h3.yoyaku{background:url("../images/history_yoyaku.gif") no-repeat;}
#history h3.teiki_together{background:url("../images/history_teiki_together.gif") no-repeat;}
#history .price{color:#C00; text-align:right;}
#history .cart{width:230px; text-align:center;}
#history .code{width:80px;}
#history .amount{width:30px; text-align:center;}
#history .status{float:right;}
#history .property{display:block; color:#AAA; font-size:90%;}


/* ===================================================================
14：サブウインドウで表示するページ用
使用ファイル：item_detail_other_image.xhtml
　　　　　　　item_friend_mail.xhtml,item_friend_mail_result.xhtml
　　　　　　　item_itemproperty_zaiko.xhtml
　　　　　　　present_friend_mail.xhtml,present_friend_mail_result.xhtml
=================================================================== */

#subwindow{width:640px;margin:auto;text-align:left;}

#subwindow #header{width:640px;zoom:100%;}
#subwindow #header:after{content:".";display:block;visibility:hidden;height:0.1px;font-size:0.1em;line-height:0;clear:both;}/* clearfix */

#subwindow #header h1 a{float:left;width:300px;height:60px;background:url("../images/header_title.gif") no-repeat;display:block;text-indent:-9999px;}

#subwindow #content{width:640px;padding-bottom:20px;float:left;}
#subwindow #content h2{height:25px;display:block;background:url("../images/title_bg.gif") no-repeat;font-size:85%;padding:3px 10px 3px 25px;}
#subwindow #content p{margin:5px 20px;font-size:80%;line-height:150%;}
#subwindow #content .images{text-align:center;margin:10px;}
#subwindow #content table{font-size:80%;line-height:160%;margin:10px 20px;width:600px;border:1px solid #CCCCCC;}
#subwindow #content th{background:#EEEEEE;padding:15px;vertical-align:top;border:1px solid #CCCCCC;width:150px;}
#subwindow #content th.zaiko{width:auto;text-align:center;}
#subwindow #content td{padding:15px;vertical-align:top;border:1px solid #CCCCCC;}
#subwindow #content td.number{text-align:right;}
#subwindow #content .hissu{color:#CC0000;font-weight:bold;}
#subwindow .buttonarea{text-align:center;border-top:#CCCCCC 1px dashed;margin:10px;padding-top:10px;}


/* =================================================================
15.エラーページ
使用ファイル：common/messages.xhtml
=================================================================*/
#error{width:100%; padding-bottom:20px;}
#error table{margin:20px; border:none !important; font-size:80%;}
#error td{padding:10px; border:none !important;}
#error .ico{width:40px; vertical-align:top; text-align:center;}
#error .content{padding:5px; color:#C00; font-weight:bold; vertical-align:middle; line-height:150%;}
#error .buttonarea{margin:10px; padding-top:10px; border-top:#CCC 1px dashed; text-align:center;}
#error ul{background:none;}


/* =================================================================
16.クレジットカード登録画面
使用ファイル：member_credit_entry_input.xhtml
=================================================================*/
#credit td.button{text-align:center;}