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

/* =======================================================================
CSSの名前：style.css 
最終更新日時：2012/2/15
※これはPC用のスタイルシートです※
--------------------------------------------------------------------------
1.reset
2.base
3.コンテナ・サイドバー・メインコンテンツ
4.ヘッダ
5.サイドバー
6.extファイル用
7.トップページ
8.カートの中身～注文完了まで、プレゼント応募～完了まで
9.定期購入商品履歴照会・変更
10.フッタ
11.商品詳細・一覧、プレゼント詳細・一覧
12.レビュー
13.購入履歴
14.サブウインドウで表示するページ用
15.エラーページ
16.クレジットカード登録画面
17.お気に入り
18.アドレス帳
19.会員関係
30.商品詳細ページ(DVD用)
31.商品詳細ページ(サプリメント用)
40.お問合せ
41.代理受注ページ

50.インフォメーション・トピックス
51.バナーエリア
config.共通で使える設定
======================================================================= */


/* =================================================================
1.reset
=================================================================*/
*{box-sizing: border-box;}
body{background: #FFF; color: #333; line-height: 1.5; font-family: '游ゴシック体', 'Yu Gothic', YuGothic, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, 'MS PGothic', 'ＭＳ Ｐゴシック', sans-serif; word-wrap: break-word; position: relative;}

/*  すべてのタグのマージン・パディングの設定をリセット
-------------------------------------------------------------*/
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;}

/*  番号付きリストを復活
-------------------------------------------------------------*/
ol li{	margin: 1em 0; padding-left: 10px; list-style-type: decimal!important; list-style-position:inside;}


/* =================================================================
2.base
=================================================================*/
/*  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; float:none;}
*:first-child+html .clearfix {zoom: 1; } /* IE7 */

/*  基本のlink color
-------------------------------------------------------------*/
a:link{color: #60ac31;}
a:visited{color: #60ac31;}
a{text-decoration:none;}
a:hover,a:active{color: #60ac31; text-decoration:underline;}
a:hover img{
	opacity: 0.8
}


/*  汎用の文字設定
-------------------------------------------------------------*/
.center{text-align:center;}
.big{font-size:1.1em; font-weight:bold;}
.big2{font-size:1.2em; font-weight:bold;}
.bigger{font-size:1.3em; font-weight:bold;}
.biggest{font-size:1.5em; font-weight:bold;}
.red{color:#D21E21; font-weight:bold;}
.orange{color:#ffa500; font-weight:bold;}
.blue{color:#1E3CC7; font-weight:bold;}
.marker{background-color:#F7FB66; font-weight:bold;}

/*  ボタンデザイン
-------------------------------------------------------------*/
/*基本デザイン-下記クラスに加えpositive　negative等のクラスを合わせて付与する*/
a.button{border: none; display: block; line-height: 1; text-align: center; padding: 10px; text-decoration: none; font-size: 13px; -webkit-border-radius: 3px;/* for Safari and Chrome */ -moz-border-radius: 3px; /* for Firefox */ -o-border-radius: 3px; /* for opera */ border-radius: 3px; width: 100%; transition: all .3s;}
input.button{border: none; display: block; line-height: 1; text-align: center; padding: 10px; text-decoration: none; font-size: 13px; -webkit-border-radius: 3px;/* for Safari and Chrome */ -moz-border-radius: 3px; /* for Firefox */ -o-border-radius: 3px; /* for opera */ border-radius: 3px; width: 100%; transition: all .3s;}

/*マウスホバー時*/
a.button:hover{opacity: 0.7; cursor: pointer; transition: all .3s;}
input.button:hover{opacity: 0.7; cursor: pointer; transition: all .3s;}

/*次へ・入力内容を確認する・注文する・ログイン・登録する・送信・検索・ご注文手続きへ進む等*/
a.positive{background: #D21E21; color: #FFFFFF;}
input.positive{background: #D21E21; color: #FFFFFF;}

/*戻る・クリア・削除・ログアウト等*/
a.negative{background: #4c4c4c; color: #FFFFFF;}/*戻る・クリア・削除・ログアウト等*/
input.negative{background: #4c4c4c; color: #FFFFFF;}

/*上記以外のボタン*/
a.normal{background: #f7f7f7; color: #333333; border: 1px solid #adadad;}
input.normal{background: #f7f7f7; color: #333333; border: 1px solid #adadad;}
.medium.normal{ padding:9px !important;}
.small.normal{ padding:5px 9px !important;}

/*押せないボタン*/
.not_click{border: none; display: block; line-height: 1; text-align: center; padding: 10px; text-decoration: none; font-size: 12px; -webkit-border-radius: 3px;/* for Safari and Chrome */ -moz-border-radius: 3px; /* for Firefox */ -o-border-radius: 3px; /* for opera */ border-radius: 3px; background: #d2d2d2; color: #a5a5a5;}
.not_click.medium{max-width: 230px; min-width: 200px;}

/*普通サイズの時にはクラスに下記を追加*/
.medium{ min-width: 200px; font-size: 16px;}
a.medium{max-width: 230px; min-width: 200px; font-size: 16px;}
input.medium{max-width: 230px; min-width: 200px; font-size: 16px;}

/*小さいサイズの時にはクラスに下記を追加*/
.small{padding: 6px 10px; font-size: 12px;}
a.small{padding: 6px 10px; font-size: 12px;}
input.small{padding: 6px 10px; font-size: 12px;}

/*大き目の時にはクラスに下記を追加*/
a.big{padding: 15px 0; font-size: 16px; font-weight: bold;}

/*  画像の縦横比調整
-------------------------------------------------------------*/
.img_box{text-align: center; position: relative;}
.img_box img{width: auto; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}

/*  カートフローチャート
-------------------------------------------------------------*/
.cart_step{position: relative; overflow: hidden;}
.cart_step:after {content: ""; clear: both; display: block;}/* clearfix */
.cart_step ul{position: relative; left: 50%; float: left; margin-bottom: 45px;}
.cart_step ul li{position: relative; left: -50%; float: left; text-align: center; width: 140px; line-height: 1.2; color: #CDCDCD;}
.cart_step ul li.active{color: #000000; font-weight: bold;}
.cart_step ul li strong{font-size: 35px; display: block;}

/*画像の場合*/
.step{display: block; margin: 25px auto 45px auto;}

/* 2019年カート大改修 */
.new ul.steps {display: flex; align-items: center; width: 70%; margin: 40px auto; background-color: rgba(28, 134, 0, 1); border-radius: 35px; overflow: hidden;}
.new ul.steps li {position: relative; flex-basis: 32%; padding: 20px 0; color: rgba(17, 81, 0, 1); text-align: center; background-image: url("../images/icon/flowIcon/adMemFlow_01_gr.png"); background-position: 50% center; background-repeat: no-repeat;}
.new ul.steps li:nth-child(2) {background-image: url("../images/icon/flowIcon/adMemFlow_02_gr.png");}
.new ul.steps li:nth-child(3) {background-image: url("../images/icon/flowIcon/adMemFlow_03_gr.png");}
.new ul.steps li:nth-child(4) {background-image: url("../images/icon/flowIcon/adMemFlow_04_gr.png");}
.new ul.steps li:nth-child(5) {background-image: url("../images/icon/flowIcon/adMemFlow_05_gr.png");}
.new ul.steps li.current{flex-basis: 36%; color: rgba(255, 255, 255, 1);}
.new ul.steps li.already{flex-basis: 28%; color: rgba(17, 81, 0, 0);}
.new ul.steps li.already:first-child {background-image: url("../images/icon/flowIcon/adMemFlow_01_wh.png");}
.new ul.steps li.already:nth-child(2) {background-image: url("../images/icon/flowIcon/adMemFlow_02_wh.png");}
.new ul.steps li.already:nth-child(3) {background-image: url("../images/icon/flowIcon/adMemFlow_03_wh.png");}
.new ul.steps li.already:nth-child(4) {background-image: url("../images/icon/flowIcon/adMemFlow_04_wh.png");}
.new ul.steps li.already + li.current{flex-basis: 40%;}
.new ul.steps li:not(:last-child)::before,
.new ul.steps li:not(:last-child)::after {content: ""; position: absolute; width: 0; height: 0; margin: auto; top: 50%; border-style: solid; border-width: 40px 0 40px 2.5em; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10;}
.new ul.steps li:not(:last-child)::before {right: -30px; border-color: transparent transparent transparent rgba(255, 255, 255, 1);}
.new ul.steps li:not(:last-child)::after {right: -28px; border-color: transparent transparent transparent rgba(28, 134, 0, 1);}

.new ul#cart_step {width: 90%;}
.new ul#cart_step li {flex-basis: 18.75%;}
.new ul#cart_step li.current{flex-basis: 25%;}
.new ul#cart_step li:not(:last-child)::before {right: -18px;}
.new ul#cart_step li:not(:last-child)::after {right: -16px;}
.new ul#cart_step.notLogin li:nth-child(2) {padding-left: 13px; font-size: .85rem;}

/*  Amazonペイメントのスタイル
-------------------------------------------------------------*/
#AmazonPayButton{min-height: 80px;}

/*  ローディング表示のスタイル
-------------------------------------------------------------*/
#loading{position: fixed; top: 50%; left: 50%; padding-top: 100px; width: 100px; background-image: url("../images/loader_icon_pc.gif"); background-position: center center; background-repeat: no-repeat;}

/*  商品一覧、商品詳細ページアイコン類
-------------------------------------------------------------*/
#badgeArea {margin-bottom: 10px;}
#badgeArea ul {display: flex; flex-wrap: wrap; margin: -5px -8px 0 0;}
#list #badgeArea ul {margin: 0; background: none;}
.item_icon {margin: 5px 8px 0 0; color: #fff; font-size: .7rem; font-weight: bold; text-indent: .1rem; line-height: 1; padding: 5px 15px; background: #333; border-radius: 2px; letter-spacing: .1rem;}/*アイコン共通設定*/
table .item_icon {margin: 0; font-size: .6rem; padding: 2px 8px;}/*アイコン共通設定*/
.item_before {color: #fff; background: #ff9900; letter-spacing: inherit;}/*COMING SOON*/
.item_new {color: #fff; background: #ff9900;}
.item_soldout {color: #fff; background: #666; border-color: #666;}
.item_short, .item_backorder, .item_discount, .item_soryo_free, .item_timesale {color: #fff; background: #cc0000;}
.item_limited {color: #fff; background: #00cccc;}

/* =================================================================
3.コンテナ・サイドバー・メインコンテンツ
使用ファイル：すべてのファイル
=================================================================*/
/* container - サイドバー・メインコンテンツを格納するコンテナ
-------------------------------------------------------------*/
#container{width: 980px; margin: auto; padding-top: 10px;}
#container:after {content: ""; clear: both; display: block;}/* clearfix */

/* sidebar - コンテナ内サイドバー
-------------------------------------------------------------*/
#sidebar{float: left; width: 190px;}

/* main - コンテナ内メインコンテンツ
-------------------------------------------------------------*/
#main{float: right; width: 770px; padding-bottom: 20px;}
#main h2{margin-bottom: 20px; font-weight: bold; border-bottom: solid 3px #cccccc; position: relative; z-index:0}
#main h2:after{position: absolute; content: " "; display: block; border-bottom: solid 3px #84c102; bottom: -3px; width: 20%; z-index:0}
#main p{margin: 5px 10px; font-size: 90%; line-height: 150%;}
#main table{width: 100%; margin: 10px; font-size: 90%; border: 1px solid #CCC; line-height: 200%;}
#main th{padding: 10px; border: 1px solid #CCC; background: #F6F6F6; vertical-align: top; font-weight: normal; text-align: left;}
#main th.title{width: 160px; text-align: left;}
#main th.address{width: 55px;}
#main td{padding: 10px; border: 1px solid #CCC; vertical-align: top;}
#main .buttonarea{margin: 10px; padding-top: 40px; text-align: center;}
#main .buttonarea .button{display: inline-block; margin: 0 10px;}
#main .buttonarea .attention{color: #C00; font-size: 90%;}
#main .buttonareaFR{margin: 0 0 0px; float: right;}
#main .buttonareaFR:after{content: "."; display: block; visibility: hidden; height: 0.1px; font-size: 0.1em; line-height: 0; clear: both;}/* clearfix */
#main .member_buttonarea .button{display: inline-block; margin: 0 10px;}
#main .hissu{color: #C00; font-weight: bold;}
#main #breadcrumbs{margin-bottom: 20px; font-size: 80%;}
#main .amazon_comment{color: #C00; font-weight: bold;}
#main .expiration_date{padding-left: 10px;}

.pageFnc {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.pageFnc .pageguide{font-size: .85rem;}
.pageFnc .rearrange{font-size: .75rem; text-align: right;}
.pageFnc .rearrange select{margin-left: 10px;}
.pageFnc .pagelink{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex-basis: 100%; padding: 60px 0 10px;}
.pageFnc .pagelink li:not(.chgDispNum){width: 32px; height: 32px; margin-right: 8px; color: #333; font-size: .75rem; font-weight: bold; text-align: center; background-color: #fafafa; line-height: 32px; border-radius: 100%;}
.pageFnc .pagelink li.pageNavArrow{line-height: 30px;}
.pageFnc .pagelink li.current{background-color: #ccc;}
.pageFnc .pagelink li.chgDispNum select{margin-left: 30px;}
.pageFnc .pagelink li.chgDispNum option{font-weight: bold;}
.pageFnc .pagelink li:not(.chgDispNum) a{display: block; color: #333; box-sizing: border-box;border: 1px solid transparent; border-radius: 100%; transition: .3s;}
.pageFnc .pagelink li:not(.chgDispNum) a:hover{text-decoration: none; border: 1px solid #ccc; transition: .3s;}

 /* リキャプチャー機能用
-------------------------------------------------------------*/
#main #reCAPTCHA{width: 304px; margin: 20px auto 0;}

/* フォーム類部品
-------------------------------------------------------------*/
input[type="text"]{border: solid 1px #ccc; -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.25); box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); padding: 4px;}
input[type="email"]{border: solid 1px #ccc; -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.25); box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); padding: 4px;}
input[type="password"]{border: solid 1px #ccc; -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.25); box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); padding: 4px;}
input[type="tel"]{border: solid 1px #ccc; -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.25); box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); padding: 4px;}
input[type="number"]{border: solid 1px #ccc; -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.25); box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); padding: 4px;}
select{height: 30px; vertical-align: middle;}
textarea{border: solid 1px #ccc; -moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25); -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.25); box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.25);}
input, textarea, select, button{font-family: '游ゴシック体', 'Yu Gothic', YuGothic, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, 'MS PGothic', 'ＭＳ Ｐゴシック', sans-serif !important; font-size: 13px;}
input[type="number"]::-webkit-outer-spin-button, 
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none;}
input[type="number"] {-moz-appearance:textfield;} 

/* #main.no-sidebar - サイドバーの無いメインコンテンツ
-------------------------------------------------------------*/
#main.no-sidebar{float: none !important; width: 980px !important; min-height: 500px; margin: auto;}
#main.no-sidebar table{width: 960px}
#main.no-sidebar th{padding: 10px !important;}
#main.no-sidebar td{padding: 10px !important;}

/* #main.cart - カートフロー中のメインコンテンツ
-------------------------------------------------------------*/
#main.cart{float: none; width: 980px; min-height: 500px;}

/* =================================================================
4.ヘッダ
使用ファイル：common/header.xhtml
=================================================================*/
/* smartphone - スマートフォン専用サイトへのリンク
-------------------------------------------------------------*/
#smartphone a{display: block; width: 980px; height: 150px; margin: auto; background: url("../images/button_smartphone.png") no-repeat; text-indent: -9999px;}

/* preview - プレビュー時に表示するエリア
-------------------------------------------------------------*/
#preview{padding: 5px; border-bottom: 1px solid #CCC; background: #1C8600; color: #FFF; 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 .inner{position: relative;width: 980px;  margin: 10px auto 20px;}
#header .inner:after {content: ""; clear: both; display: block;}/* clearfix */
#header h1, #header .inner > p {float: left; width: 168px; height: 80px; margin-right: 10px}
#header h1 a, #header .inner > p a {display: block;  width: 100%; height: 100%; background-image: url("../images/header_title.gif"); background-repeat: no-repeat; background-size: contain; text-indent: -9999px;}
#header h1 a.christmas-1, #header .inner > p a.christmas-1 {background: url("../images/header_title_chris-1.png");}
#header h1 a.christmas-2, #header .inner > p a.christmas-2 {background: url("../images/header_title_chris-2.png");}
#header h1 a.christmas-3, #header .inner > p a.christmas-3 {background: url("../images/header_title_chris-3.png");}
#header h1 a.christmas-4, #header .inner > p a.christmas-4 {background: url("../images/header_title_chris-4.png");}
#header h2 a{display: block; float: left; width: 15px; height: 15px; overflow: hidden; margin-top: 10px; background: url("../images/header_rss.gif") no-repeat; text-indent: -9999px;}
#header h2 a:hover{background-position: 0 -15px;}

/* fontChanger - 文字サイズ変更
-------------------------------------------------------------*/
#fontChanger{float: right; margin: 10px 20px 0 0;}
#fontChanger h2{display: block; float: left; margin-right: 5px; font-size: 13px;}
#fontChanger .icon{float: left; line-height: 1;}
#fontChanger .icon a{color: #FFFFFF; display: inline-block; margin-right: 2px; text-decoration: none; font-size: 12px !important; padding: 3px; line-height: 1; vertical-align: text-bottom;}
#fontChanger .__FONT_CHANGER_BUTTON_S_OFF{background: #CCCCCC;}/* 小 OFF */
#fontChanger .__FONT_CHANGER_BUTTON_S_ON{background: #D21E21;}/* 小 ON */
#fontChanger .__FONT_CHANGER_BUTTON_M_OFF{background: #CCCCCC;}/* 中 OFF */
#fontChanger .__FONT_CHANGER_BUTTON_M_ON{background: #D21E21;}/* 中 ON */
#fontChanger .__FONT_CHANGER_BUTTON_L_OFF{background: #CCCCCC;}/* 中 OFF */
#fontChanger .__FONT_CHANGER_BUTTON_L_ON{background: #D21E21;}/* 大 ON */

#headerWrap{position: absolute; top: 0; left: 188px; right: 468px;}

/* language - 言語選択
-------------------------------------------------------------*/
#language{margin-bottom: 5px; text-align: right;}
#language h2{display: inline-block; margin-right: 5px; font-size: 0.8rem;}
#language p{display: inline-block; font-size: 0.8rem;}
#language p:not(:last-child){margin-right: 5px; }

/* search - 商品検索窓
-------------------------------------------------------------*/
#search{padding: 15px 0 6px; text-align: right;}
#search h2{float: left; width: 105px; height: 20px; overflow: hidden; margin: 10px 10px 0 0; background: url("../images/search_title.gif") no-repeat; text-indent: -9999px;}
#search p{display: inline-block; clear: both; font-size: 0.7rem; text-align: right;}
#search p:first-of-type{margin-right: 5px;}
#search .form{display: block; float: left; width: 264px; height: 35px; border: 1px solid #CCCCCC; border-right: 0px; padding: 6px 10px; transition: .5s; outline: 0; border-radius: 5px 0 0 5px;}
#search .form:focus{background-color: rgba(121, 204, 32, 0.1); transition: .5s;}
#search .button{float: left; font-size: 16px; width: 60px; height: 35px; border-radius: 0 5px 5px 0; transition: .5s; font-weight: bold;}

/* inquiry - お問い合わせ先
-------------------------------------------------------------*/
#inquiry{float: right; width: 448px;}
#inquiry ul li{display: inline-block;}
#inquiry ul li:first-child{margin-right: 10px;}
#itemDetailDvd #inquiry ul li{margin-left: 0;}
#inquiry img {vertical-align: middle;}
#inquiry a{display: block; padding: 11.5px 18px; border: 2px solid rgba(201, 201, 201, 1); border-radius: 8px; transition: .5s;}
#inquiry a img{width: 45px; height: auto;}
#inquiry a:hover{background-color: rgba(121, 204, 32, 0.1); border-color: rgba(140, 140, 140, 0.5); transition: .5s;}
#inquiry a:hover img{opacity: 1;}

/* menu - メニュー
-------------------------------------------------------------*/
#menu{height: 40px; border-top: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC;}
#menu .inner{display: block; width: 1400px; margin: auto;}
#menu ul{margin: 0 auto; width: 1400px;}
#menu ul:after {content: ""; clear: both; display: block;}/* clearfix */
#menu li{float: left;}
#menu li a{
	display: block;
	height: 38px;
	width: 200px;
	text-decoration: none;
	border-left: 1px solid #CCCCCC;
	color: #252525;
	text-align: center;
	padding-top: 10px;
	font-size: 15px;
	font-weight: bold;
}
#menu li a:hover{background: #F1F1F1;}
#menu li:last-child a{border-right: 1px solid #CCCCCC;}

#menu a:hover{background: #F1F1F1;}


/* shiborikomi - 絞り込み検索
-------------------------------------------------------------*/
#shiborikomi{width: 980px; margin: 0 auto 10px; padding: 5px 10px; background: #F1F1F1; font-size: 80%;}
#shiborikomi .select{padding: 4px 3px; background: #C00; color: #FFF; font-weight: bold;}
#shiborikomi a{padding: 4px 3px; color: #666; font-weight: bold; text-decoration: none;}
#shiborikomi a:hover{background: #CCC;}

/* topics_header - ヘッダ内トピックス用
-------------------------------------------------------------*/
#topics_header > div {width: 980px; margin: 0 auto; text-align: center;}
#topics_header > div:not(:last-child),
#topics_header > div > .inner:not(:last-child) {margin-bottom: 10px;}
#topics_header a,
#topics_header .inner > .linkstyle {display: block; padding: 10px 20px; color: #d70000; font-weight: bold; border: 1px solid #d70000; border-radius: 5px; transition: .5s;}
#topics_header > div.infomaiton a,
#topics_header > div.infomaiton .inner > .linkstyle {color: #333; border: 1px solid #aaa;}
#topics_header a span:not(:last-child),
#topics_header .inner > .linkstyle span:not(:last-child) {margin-right: 1rem;}
#topics_header span.cateName {padding: 5px 15px; font-size: 0.7rem; color: #fff; background-color: #d70000; border-radius: 3px; transition: .5s;}
#topics_header > div.infomaiton span.cateName {background-color: #333;}
#topics_header a:hover {text-decoration: none;}
#topics_header > div:not(.infomaiton) a:hover {color: #fff; background-color: #d70000; transition: .5s;}
#topics_header > div.infomaiton a:hover {border-color: #333; transition: .5s;}
#topics_header > div:not(.infomaiton) a:hover span:not(.topiTitle) {color: #d70000; background-color: #fff; transition: .5s;}

/* =================================================================
5.サイドバー
使用ファイル：common/sidebar.xhtml
=================================================================*/
/* login - ログイン枠
-------------------------------------------------------------*/
#login{width: 190px; margin-bottom: 60px;}
#login h2{background-image: url("../images/icon/black/icon_login.png"); background-size:17px 17px; background-repeat: no-repeat; background-position: left 1px; padding-left: 19px; margin-bottom: 10px; font-size: 15px;}
#login.account h2{background-image: url("../images/icon/black/icon_account.png"); margin-bottom: 0px;}
#login .buttonarea{margin-bottom: 10px;}
#login .buttonarea:after {content: ""; clear: both; display: block;}/* clearfix */
#login .button{width: 100px; margin: 10px auto;}
#login p{margin: 0 5px 5px; font-size: 90%;}
#login .name{ margin:0 0 10px;}
#login .name strong{font-size: 20px;}
#login .error{clear: both; margin: 5px 10px; color: #C00; font-weight: bold; text-align: center;}
#login .point{color: #C00;}
#login span{font-weight: bold;}

/* cart - 買い物かごの中身確認・買い物かごへ
-------------------------------------------------------------*/
#cart{width: 190px; margin-bottom: 60px;}
#cart h2{background-image: url("../images/icon/black/icon_cart.png"); background-size:17px 17px; background-repeat: no-repeat; background-position: left 1px; padding-left: 19px; margin-bottom: 10px; font-size: 15px;}
#cart h3{float: left; margin: 0 0 5px 5px; font-size: 90%; font-weight: normal;}
#cart .box:after {content: ""; clear: both; display: block;}/* clearfix */
#cart .box p{float: right; margin:0 5px 5px 0; color: #C00; font-size: 90%; font-weight: bold; text-align: right;}
#cart a{width: 140px; margin: 10px auto 0;}

/* category - 商品カテゴリ
-------------------------------------------------------------*/
#category {width: 190px; margin-bottom: 60px;}
#category h2{background-image: url("../images/icon/black/icon_category.png"); background-size:17px 17px; background-repeat: no-repeat; background-position: left 1px; padding-left: 19px; margin-bottom: 10px; font-size: 15px;}
#category #cateParent { margin-bottom: 60px; }
#category #cateParent > li {position: relative;}
#category #cateParent > li ul {position: absolute; top: 0; left: 190px; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(210, 210, 210, 1); box-shadow: 2px 2px 7px 0 rgba(0, 0, 0, 0.03);  z-index: 10000;}
#cateParent > li ul:not(#target) {width: 204px;}
#cateParent > li ul#target {top: -125px; padding: 0 20px;}
#category .select {background: url("../images/marker_on.gif") 10px 10px no-repeat #C00; color: #FFF; text-decoration: none;}
#category li:hover a.parent {color: #FFF; background: url("../images/marker.gif") 10px 10px no-repeat #ccc;}
#category li a {display: block; padding: 5px 20px; color: #333; font-size: 90%; text-decoration: none;}
#category li ul#target li:not(:last-child) {padding-bottom: 20px;}
#category li ul#target li a {padding: 0;}
#category li a img {vertical-align: middle;}
#category li ul li:first-child a {padding-top: 10px;}
#category li ul li:last-child a {padding-bottom: 10px;}
#category li ul#target li:first-child {padding-top: 20px;}
#category li ul#target li:last-child {padding-bottom: 20px;}
#category li a.parent {padding: 5px 5px 5px 25px; background: url("../images/marker.gif") 10px 10px no-repeat;}
#category li a:link {display: block; overflow: hidden;}
#category li a:hover {color: #FFF; background: #ccc; text-decoration: underline;}

#category #brandList {}
#category #brandList li:not(:last-child) { margin-bottom: 10px; }
#category #brandList a { padding: 8px 0 8px 10px; transition: .5s; }
#category #brandList li a:hover { background-color: rgba(0, 0, 0, 1); transition: .5s; }
/*#category #brandList li:nth-of-type(2) a:hover { background-color: #e8417b; } キレイナデシコが復活したら戻す
#category #brandList li:nth-of-type(3) a:hover { background-color: #006cb8; } マスターズプロテインが復活したら戻す*/
#category #brandList svg { height: 40px; vertical-align: middle; }
#category #brandList svg#belegend_logo { height: 30px; }
#category #brandList svg#legends_logo { height: 25px; }
#category #brandList svg path {	transition: .5s; }
#category #brandList a:hover svg:not(#newera_logo) path,
#category #brandList a:hover svg:not(#newera_logo) polygon,
#category #brandList a:hover svg:not(#newera_logo) rect,
#category #brandList a:hover svg:not(#newera_logo) text {	fill: #fff; transition: .5s; }
#category #brandList a:hover svg#newera_logo { background-color: #fff; }

/* present - プレゼント枠
-------------------------------------------------------------*/
#present{width: 190px; margin-bottom: 60px;}
#present h2{background-image: url("../images/icon/black/icon_present.png"); background-size:17px 17px; background-repeat: no-repeat; background-position: left 1px; padding-left: 19px; margin-bottom: 10px; font-size: 15px;}
#present h3{display: block; padding: 0 10px 0 18px; background: url("../images/marker.gif") 6px 6px no-repeat; font-size: 90%; font-weight: normal;}
#present .period{margin: 0 5px 10px 15px; font-size: 90%;}
#present .all{margin: 10px 0px 0px 0px; text-align: right; font-size: 80%;}

/* magazine - メールマガジン枠
-------------------------------------------------------------*/
#magazine{width: 190px; margin-bottom: 60px;}
#magazine h2{background-image: url("../images/icon/black/icon_mail.png"); background-size:17px 17px; background-repeat: no-repeat; background-position: left 1px; padding-left: 19px; margin-bottom: 10px; font-size: 15px;}
#magazine h3{font-size: 13px;}
#magazine .text{display: block; width: 180px; height: 25px; margin: 0 auto;}
#magazine .select_area{margin-bottom: 10px;}
#magazine label{font-size: 13px;}
#magazine .radio{margin: 5px 2px 5px 5px;}
#magazine p{margin: 0 5px 2px; font-size: 80%;}
#magazine .error{margin: 5px; color: #C00; font-weight: bold;}
#magazine .free{margin: 10px auto;}
#magazine .buttonarea:after {content: ""; clear: both; display: block;}/* clearfix */
#magazine .buttonarea li{float: left; width: 50%; text-align: center;}
#magazine .buttonarea li input{display: inline-block; width: 50px;}

/* coupon - クーポン
-------------------------------------------------------------*/
#coupon{width: 190px; margin-bottom: 60px;}
#coupon h2{background-image: url("../images/icon/black/icon_coupon.png"); background-size:17px 17px; background-repeat: no-repeat; background-position: left 1px; padding-left: 19px; margin-bottom: 10px; font-size: 15px;}
#coupon p{margin: 0 10px; font-size: 80%;}
#coupon img{display: block; margin: 0 auto;}

/* calendar - カレンダー
-------------------------------------------------------------*/
#calendar{width: 190px; margin-bottom: 10px;}
#calendar h2{background-image: url("../images/icon/black/icon_calendar.png"); background-size:17px 17px; background-repeat: no-repeat; background-position: left 1px; padding-left: 19px; margin-bottom: 10px; font-size: 15px;}
#calendar p{margin: 0 5px 10px; font-size: 80%;}
#calendar span.day_color1{color: #FF7F7E;}
#SIDE_CALENDAR{width: 190px; overflow: hidden; margin: 0 auto; font-size: 10px;}
#ui-datepicker-div {width: 12em !important;	border: 1px solid #AAA !important; display: none;}
#ui-datepicker-div .ui-datepicker-header {background: #CCC repeat-x scroll 50% 50% !important; width: 100% !important;}
#ui-datepicker-div table.ui-datepicker-calendar {width: 100% !important;}
#ui-datepicker-div select.ui-datepicker-year, #ui-datepicker-div select.ui-datepicker-month{width: 40% !important; border: 1px solid #e0e0e0; height: 23px;}
.ui-widget-content{border: 1px solid #FFF;}
.ui-datepicker{padding: 1px}
.ui-datepicker-title{font-size: 12px;}
.ui-widget-header{width: 178px; border-top: none; border-left: none; border-right: none; border-bottom: solid 1px #CCC; border-radius: 0; background: none;}
.ui-datepicker table{width: 178px;}
.ui-datepicker th,.ui-datepicker td{width: 10px !important; margin: 0; padding: 1px; border: none;}
.ui-datepicker th a,.ui-datepicker td a{padding: 1px; border: none !important;}
.ui-datepicker th div,.ui-datepicker td div{padding: 1px; border: none !important;}
.ui-datepicker-week-end{color: #C00;}

.ui-datepicker .day_color1 .ui-state-default{background-image: none; background-color: #FF7F7E; color: #C00;}
.ui-datepicker .day_color2 .ui-state-default{background-image: none; background-color: #D7FFED;}
.ui-datepicker .day_color3 .ui-state-default{background-image: none; background-color: #DDF;}
.ui-datepicker .day_color4 .ui-state-default{background-image: none; background-color: #FFD;}
.ui-datepicker .day_color5 .ui-state-default{background-image: none; background-color: #E7FFFF;}
.ui-datepicker .day_color6 .ui-state-default{background-image: none; background-color: #F0D6FF;}
img.ui-datepicker-trigger {vertical-align: top !important; padding-left: 5px !important;}

/* jquery-ui-1.8.4.custom.css　上書き用（カレンダー）
-------------------------------------------------------------*/
.ui-datepicker .ui-datepicker-header{padding: .3em 0;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{margin: 2px; padding: 2px; border: none; background: #e6e6e6;}/* 日付背景 */
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{background: #ffffff;}/* 選択した日付背景 */

/* ホバー時 */
.ui-datepicker-next.ui-corner-all.ui-state-hover.ui-datepicker-next-hover,
.ui-datepicker-prev.ui-corner-all.ui-state-hover.ui-datepicker-prev-hover,
.ui-datepicker-next.ui-corner-all.ui-state-disabled.ui-state-hover.ui-datepicker-next-hover,
.ui-datepicker-prev.ui-corner-all.ui-state-disabled.ui-state-hover.ui-datepicker-prev-hover{box-sizing: border-box; background: none;}

.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover {top: 2px; }
.ui-datepicker .ui-datepicker-prev-hover {left: 2px;}
.ui-datepicker .ui-datepicker-next-hover {right: 2px;}
.ui-datepicker .ui-datepicker-prev-hover span.ui-icon-circle-triangle-w,
.ui-datepicker .ui-datepicker-next-hover span.ui-icon-circle-triangle-e,
.ui-state-disabled span.ui-icon-circle-triangle-w,
.ui-state-disabled span.ui-icon-circle-triangle-e{background-image: url("./smoothness/images/ui-icons_454545_256x240.png"); opacity: .75; filter: alpha(opacity=75); -ms-filter: "alpha(opacity=75)"; -khtml-opacity: 0.75; -moz-opacity: 0.75;}

/* banaarea
-------------------------------------------------------------*/
.banaarea p {margin-bottom:1em;}
.banaarea img {width: 190px; height: auto; vertical-align: middle;}

/* =================================================================
6.extファイル用
使用ファイル：ext/company.html
　　　　　　　ext/tokushou.html
　　　　　　　ext/guide.html
			　ext/social_provider.xhtml
=================================================================*/
#ext h3{display: block; font-size: 110%; margin: 30px 10px 10px; border-bottom: 1px dashed #cccccc; padding-bottom: 5px;}
#ext th{text-align: left;}
#ext ul{padding-bottom: 10px;}
#ext li{list-style: disc; margin: 5px 40px; font-size: 80%;}
#ext #sitemap ul:after {content: ""; clear: both; display: block;}/* clearfix */
#ext #sitemap li{width: 216px; float: left; list-style-type: none; margin: 5px 20px;}

#ext .breadcrumbs li { display: inline-block; margin: 0; }
#ext .breadcrumbs li:not(:last-child)::after { content: ">"; padding-left: 5px; }

/*///////タイムセール////////*/
#timesale #ext h2 {
	border: none;
}
#timesale #ext h2::after {
	content: none;
}
#timesale #ext h2 img {
	vertical-align: middle;
}
#timesale #ext #itemListImage {
	margin-right: -10px;
}
#timesale #ext #contHeading p {
	margin: 0 0 20px;
}
#timesale #ext #itemListImage > div {
	float: left;
	width: 250px;
	margin-right: 10px;
}
#timesale #ext .box {
	float: none;
	width: inherit;
	margin: 0 0 10px;
}
#timesale #ext h3 {
	border-bottom: none;
}

/*///////ポイント制度・お友達紹介////////*/
#point .hBox,
#friend #about {
	padding: 9px 20px;
	color: rgba(255, 255, 255, 1);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: contain;
}

#point #about .hBox,
#friend #about {
	margin-bottom: 30px;
}

#point #terms h2,
#point #qa h2, 
#friend #terms h2 {
	margin: 0 10px 20px;
	font-size: 2rem;
	font-weight: bold;
	border: none;
	text-align: center;
}

#point #terms dl,
#point #qa dl,
#friend #terms dl {
	line-height: 1.4
}

#point #terms dl dt,
#point #qa dl dt,
#friend #terms dl dt {
	position: relative;
	margin-bottom: 10px;
	padding: 0 10px 5px;
	font-size: 1.1rem;
	font-weight: bold;
	border-bottom: 1px solid rgba(200, 200, 200, 1);
	transition: .5s;
	cursor: pointer;
}

#point #terms dl dt.open,
#point #qa dl dt.open,
#friend #terms dl dt.open {
	border-bottom: none;
	transition: .5s;
}

#point #terms dl dd,
#point #qa dl dd,
#friend #terms dl dd {
	display: none;
	padding: 0 10px;
}

#point #terms dl dt.open + dd,
#point #qa dl dt.open + dd,
#friend #terms dl dt.open + dd {
	padding-bottom: 10px;
	border-bottom: 1px solid rgba(200, 200, 200, 1);
}

#point #terms dl dd:not(:last-child),
#point #qa dl dd:not(:last-child),
#friend #terms dl dd:not(:last-child) {
	margin-bottom: 20px;
}

#point #terms dd p:last-of-type,
#point #qa dd p:last-of-type,
#friend #terms dd p:last-of-type {
	margin-bottom: 0;
}

#point #terms dd ul,
#point #qa dd ol,
#friend #terms dd ul {
	margin-bottom: 0.5rem;
}

#point #terms dd li,
#friend #terms dd li {
	margin-left: 20px;
	list-style: disc;
}

#point #terms ol li,
#friend #terms ol li {
	list-style: decimal;
}

#point #terms .terms_acdn span,
#point #qa .qa_acdn span,
#friend #terms .terms_acdn span {
	content: '';
	position: absolute;
	top: 20%;
	right: 15px;
	width: 12px;
	height: 12px;
	border: 0px;
	border-top: solid 1px rgb(21, 21, 21);
	border-right: solid 1px rgb(21, 21, 21);
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	transition: all .3s;
}

#point #terms .terms_acdn.close span,
#point #qa .qa_acdn.close span,
#friend #terms .terms_acdn.close span {
	top: 0;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}

/*///////ポイント制度////////*/
#point h2:after {
	content: none;
}

#point p {
	margin: 0 0 0.5em;
}

#point p:last-of-type {
	margin-bottom: 1em;
}

#point img {
	vertical-align: middle;
}

#point #contents > div:not(:last-child) {
	margin-bottom: 50px;
}

#point .hBox ul {
	width: 40%;
}

#point .hBox li {
	margin: 0;
	list-style: none;
}

#point .hBox a {
	display: block;
	padding: 5px 0;
	color: rgba(255, 255, 255, 1);
	background-color: rgba(210, 30, 33, 1);
	letter-spacing: 1px;
	text-align: center;
	text-decoration: none;
	text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.3);
	border-radius: 7px;
	box-shadow: 3px 3px 5px -3px rgba(0, 0, 0, 1);
	transition: .5s;
}

#point .hBox a:hover {
	background-color: rgba(179, 25, 28, 1);
	transition: .5s;
}

#point #about .hBox {
	background-image: url("../images/point_about_bg.jpg");
}

#point #about .hBox li:nth-child(1) {
	margin-bottom: 8px;
}

#point #about li {
	margin: 0;
	list-style: none;
}

#point #about > ul {
	display: flex;
	justify-content: space-between;
}

#point #gooddeal .hBox {
	padding: 32px 20px;
	background-image: url("../images/point_value_bg.jpg");
}

#point .hBox h1,
#point .hBox h2 {
	width: 50%;
	margin-bottom: 10px;
	font-size: 2rem;
	font-weight: bold;
	border-bottom: 1px solid;
	border-image: 
		linear-gradient(
		to right, 
		rgba(0, 0, 0, 0.3), 
		rgba(0, 0, 0, 0)
		) 1/0 0 1px 0;
}

#point .hBox h1 {
	text-shadow:1px 1px 2px rgba(0, 0, 0, 0.5);
}

#point .hBox h2 {
	padding-bottom: 10px;
	font-size: 1.7rem;
	line-height: 1.1;
}

#point #qa dt[data-target="qa_06"] span,
#point #qa dt[data-target="qa_07"] span {
	top: 40%;
}

#point #qa [data-target="qa_06"].close span,
#point #qa [data-target="qa_07"].close span {
	top: 30%;
}

/*///////お友達紹介////////*/
#friend #about {
	display: flex;
	height: 280px;
	align-items: center;
	padding-left: 40px;
	background-image: url("../images/friend_about.jpg");
}

#friend #about + p {
	margin-bottom: 1.5em;
	line-height: 1.8;
}

#friend #about + p + p {
	margin-bottom: 40px;
	color: rgba(255, 0, 0, 1);
	font-weight: bold;
	line-height: 1.8;
}

#friend #procedure {
	margin-bottom: 60px;
}

#friend #terms h2 {
	font-size: 1.5rem;
	text-align: left;
	border-bottom: 3px solid #ccc;
}

#friend #terms h3 {
	font-size: 0.8rem;
}

#friend #terms ul li {
	list-style-type: circle;
}

#friend #terms .annotation {
	color: #333;
}

/* social_provider.xhtml
-------------------------------------------------------------*/
#ext.social_provider tr th{background: #FFF;}
#ext.social_provider tr th a{text-decoration: none;}
#ext.social_provider tr.title th{background: #F6F6F6;}
#ext.social_provider th.service{width: 220px;}
#ext.social_provider th div{width: 220px; height: 44px; font-size: 14px; display: block;}
#ext.social_provider th div p{padding: 14px 0 14px 25px; border: 1px solid #cdcdcd; border-left: 0px; margin: 0 0 0 53px; display: block; background: #FFF; line-height: 1; font-size: 14px;
-webkit-border-top-right-radius: 3px;
-webkit-border-bottom-right-radius: 3px;  
-moz-border-radius-topright: 3px;  
-moz-border-radius-bottomright: 3px;
}

#ext.social_provider th.yahoo div{background: url("../images/social_yahoo.png") no-repeat; color: #e71017;}
#ext.social_provider th.facebook div{background: url("../images/social_facebook.png") no-repeat; color: #3b5998;}
#ext.social_provider th.twitter div{background: url("../images/social_twitter.png") no-repeat; color: #55acee;}
#ext.social_provider th.google div{background: url("../images/social_google.png") no-repeat; color: #dc4e41;}
#ext.social_provider th.mixi div{background: url("../images/social_mixi.png") no-repeat; color: #d1ad59;}
#ext.social_provider th.rakuten div{background: url("../images/social_rakuten.png") no-repeat; color: #bf0000;}
#ext.social_provider th.line div{background: url("../images/social_line.png") no-repeat; color: #00b300;}
#ext.social_provider th.paypal div{background: url("../images/social_paypal.png") no-repeat; color: #293e7f;}

#ext.social_provider th.yahoo div.off{background: url("../images/social_yahoo_off.png") no-repeat; color: #cdcdcd;}
#ext.social_provider th.facebook div.off{background: url("../images/social_facebook_off.png") no-repeat; color: #cdcdcd;}
#ext.social_provider th.twitter div.off{background: url("../images/social_twitter_off.png") no-repeat; color: #cdcdcd;}
#ext.social_provider th.google div.off{background: url("../images/social_google_off.png") no-repeat; color: #cdcdcd;}
#ext.social_provider th.mixi div.off{background: url("../images/social_mixi_off.png") no-repeat; color: #cdcdcd;}
#ext.social_provider th.rakuten div.off{background: url("../images/social_rakuten_off.png") no-repeat; color: #cdcdcd;}
#ext.social_provider th.line div.off{background: url("../images/social_line_off.png") no-repeat; color: #cdcdcd;}
#ext.social_provider th.paypal div.off{background: url("../images/social_paypal_off.png") no-repeat; color: #cdcdcd;}

#ext.social_provider td{vertical-align: middle;}

/* =================================================================
7.トップページ
使用ファイル：top.xhtml
=================================================================*/
/* a - リンクテキスト
-------------------------------------------------------------*/
#index #main a:link{color: #333;}
#index #main a:visited{color: #333;}
#index #main a:hover{color: #2a9e24;}
/* mainvisual - メインビジュアル
-------------------------------------------------------------*/
#mainvisual img{display: block;}

/* topics - トピックス
-------------------------------------------------------------*/
#topics{margin-bottom: 20px; width: 100%;}
#topics .box{border-bottom: #d4d4d4 solid 1px; margin-bottom: 20px;}
#topics .box:after {content: ""; clear: both; display: block;}/* clearfix */
#topics h3{display: block; float: left; width: 140px; padding: 3px 10px 5px; font-size: 90%; font-weight: normal; line-height: 100%;}
#topics h3 img{vertical-align: bottom;}
#topics .inner{display: block; float: left; width: 720px; padding: 0px 10px 5px; font-weight: normal;}
#topics .inner p{margin: 0px 0 5px; font-size: 90%;}
#topics .rss{display: block; float: right; width: 15px; height: 15px; margin: 5px 5px 0 0; background: url("../images/header_rss.gif") 0 0 no-repeat; text-indent: -9999px; z-index: 10;}
#topics .rss:hover{background: url("../images/header_rss.gif") 0 -15px no-repeat;}
#topics .img_box{width: 120px; height: 120px; margin: 5px 0 10px 10px; float: right;}
#topics .img_box img{max-width: 120px; max-height: 120px;}
#topics .link{text-align: right;}
.topix_title{display:block; font-weight:bold; font-size:120%; text-align:center;}

/* new - 新着商品
-------------------------------------------------------------*/
#new{margin-bottom: 20px; width: 100%;}
#new ul{margin-top: 10px;}
#new ul:after {content: ""; clear: both; display: block;}/* clearfix */
#new .box{float: left; width: 185px; margin: 0 10px 10px 0; border: #d4d4d4 1px solid; padding: 20px 0 0px;}
#new .img_box{width: 140px; height: 140px; margin: 0px auto 10px;}
#new .img_box img{max-width: 140px; max-height: 140px;}
#new .text{width: 140px; margin: 0 auto;}
#new .appeal{color: #F60; font-size: 70%;}
#new h3{margin: 0px 0px 20px; font-size: 90%; font-weight: normal; line-height: 140%; min-height: 60px;}
#new .price{margin: 0px 0px 20px; font-size: 80%; color: #C00; text-align: right;}


/* recommend - おすすめ商品
-------------------------------------------------------------*/
#recommend{margin-bottom: 20px; width: 100%;}
#recommend ul{margin-top: 10px;}
#recommend ul:after {content: ""; clear: both; display: block;}/* clearfix */
#recommend .box{float: left; width: 185px; margin: 0 10px 10px 0; border: #d4d4d4 1px solid; padding: 20px 0 0px;}
#recommend .img_box{width: 140px; height: 140px; margin: 0px auto 10px;}
#recommend .img_box img{max-width: 140px; max-height: 140px;}
#recommend .text{width: 140px; margin: 0 auto;}
#recommend .appeal{color: #F60; font-size: 70%;}
#recommend h3{margin: 0px 0px 10px; font-size: 90%; font-weight: normal; line-height: 140%; min-height: 60px;}
#recommend .price{margin: 0px 0px 20px; font-size: 80%; color: #C00; text-align: right;}


/* ranking - 人気商品ランキング
-------------------------------------------------------------*/
#ranking{margin-bottom: 20px; width: 100%;}
#ranking ul{margin-top: 10px;}
#ranking ul:after {content: ""; clear: both; display: block;}/* clearfix */
#ranking .box{float: left; width: 185px; margin: 0 10px 10px 0; border: #d4d4d4 1px solid; padding: 20px 0 0px;}

#ranking h3{width: 45px; height: 20px; text-indent: -9999px; margin: 0 0 5px;}
#ranking #ranking_no1 h3{background: url("../images/ranking_no01.gif") 0px 5px no-repeat;}
#ranking #ranking_no2 h3{background: url("../images/ranking_no02.gif") 0px 5px no-repeat;}
#ranking #ranking_no3 h3{background: url("../images/ranking_no03.gif") 0px 5px no-repeat;}
#ranking #ranking_no4 h3{background: url("../images/ranking_no04.gif") 0px 5px no-repeat;}
#ranking #ranking_no5 h3{background: url("../images/ranking_no05.gif") 0px 5px no-repeat;}
#ranking #ranking_no6 h3{background: url("../images/ranking_no06.gif") 0px 5px no-repeat;}
#ranking #ranking_no7 h3{background: url("../images/ranking_no07.gif") 0px 5px no-repeat;}
#ranking #ranking_no8 h3{background: url("../images/ranking_no08.gif") 0px 5px no-repeat;}
#ranking #ranking_no9 h3{background: url("../images/ranking_no09.gif") 0px 5px no-repeat;}
#ranking #ranking_no10 h3{background: url("../images/ranking_no10.gif") 0px 5px no-repeat;}

#ranking h4{margin: 0px 0px 10px; font-size: 90%; font-weight: normal; line-height: 140%; min-height: 60px;}
#ranking .price{margin: 0px 0px 20px; font-size: 80%; color: #C00; text-align: right;}
#ranking .text{width: 140px; margin: 0 auto;}
#ranking .appeal{color: #F60; font-size: 70%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}

#ranking .img_box{width: 140px; height: 140px; margin: 0px auto 10px; text-align: center; position: relative;}
#ranking .img_box img{width: auto; max-width: 140px; max-height: 140px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}


/* itemAccessLog - 閲覧履歴
-------------------------------------------------------------*/
#itemAccessLog{margin-bottom: 20px; clear: both;}
#itemAccessLog .box{margin-top: 10px; border: #CCC 1px solid;}
#itemAccessLog .box:hover{border: #8CC329 1px solid;}
#itemAccessLog .box:after {content: ""; clear: both; display: block;}/* clearfix */
#itemAccessLog .text{margin-left: 140px;}
#itemAccessLog h3{display: block; margin: 10px 10px 0 0; font-size: 95%;}
#itemAccessLog .link{float: right; font-size: 13px; padding-top: 10px;}
#itemAccessLog .appeal{display: block; margin: 0; color: #F60; font-size: 70%;}
#itemAccessLog .price{display: block; margin: 0; color: #C00;}
#itemAccessLog .price .teika{font-weight: bold; font-size: 110%;}
#itemAccessLog .price .other{font-size: 90%;}
#itemAccessLog .explanation1{display: block; margin: 5px 10px 0 0; padding: 5px 0; border-top: #CCC 1px solid; font-size: 80%; line-height: 120%;}
#itemAccessLog .button_area{margin: 0px 10px 20px 0px; padding-top: 20px; border-top: #CCC 1px solid; text-align: right;}
#itemAccessLog .button_area:after {content: ""; clear: both; display: block;}/* clearfix */
#itemAccessLog .button_area .button{width: auto; display: inline-block;}
#itemAccessLog .property{display: inline; margin: 0; color: #AAA; font-size: 75%;}
#itemAccessLog .img_box{width: 120px; height: 120px; margin: 10px; float: left;}
#itemAccessLog .img_box img{max-width: 120px; max-height: 120px;}

/* 新トップ用 - 2019/07/08
-------------------------------------------------------------*/
#index #main > div:not(:last-child){margin-bottom: 100px;}
#index #main h2{margin-bottom: 30px; padding-top: 3px; padding-left: 10px; font-size: 1rem; background-position: right -3px bottom -8px; background-repeat: no-repeat;}
#index #main h2:after{left: 0;}
#index #main h3{min-height: inherit; padding-top: 20px; text-align: center; background-position: top -8px center; background-repeat: no-repeat;}
#index #main .harf h3{text-align: left; background-position: top -8px left;}
#index #main .slider{z-index: 1;}
#index #main .slider::before, #index #main .slider::after {content: ""; display: block; position: absolute; top: 0; width: 78px; height: 100%; z-index: 2; }
#index #main .slider::before{
	left: 0;
	background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
#index #main .slider::after{
	right: 0;
	background: -moz-linear-gradient(right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
#index #main .slider button{width: 25px; height: 25px; z-index: 5;}
#index #main .slider .slick-prev{left: 10px;}
#index #main .slider .slick-next{right: 10px;}
#index #main .slider .slick-prev::before, #index #main .slider .slick-next::before{font-size: 25px; color: rgba(96, 172, 49, 1);}
#index #main .contents .item_image_area{margin-bottom: 5px;}
#index #main .contents .item_image_area img{max-width: 152px; max-height: 152px; margin-left: 7px; margin-right: 13px; padding: 5px; border: 1px solid #ccc; vertical-align: middle;}
#index #main .contents p{margin: 0 0 0 10px; line-height: 1.2;}
#index #main .contents p:not(:last-child){margin-bottom: 0.5em;}
#index #main .contents .badge{display: inline-block; padding: 5px 7px; color: #fff; font-size: 0.5rem; font-weight: bold; background-color: rgba(216, 0, 0, 1); border-radius: 5px;}
#index #main .contents .price{color: #333; font-weight: bold; text-align: left;}
#index #main .contents .price.timesale + .price{display: none;}

#index #recommend h2{background-image: url("../images/midashi_rec.png");}
#index #recommend .supplement{margin-bottom: 35px;}
#index #recommend .dvd{float: left; width: 48%;}
#index #recommend .apparel{float: right; width: 48%;}
#index #recommend .supplement h3{background-image: url("../images/midashi_sp.png");}
#index #recommend .dvd h3{background-image: url("../images/midashi_tm.png");}
#index #recommend .apparel h3{background-image: url("../images/midashi_app.png");}
#index #recommend .harf .slider::before, #index #recommend .harf .slider::after {width: 39px;}
#index #recommend .harf .slider button{width: 22px; height: 22px;}
#index #recommend .harf .slider .slick-prev{left: 5px;}
#index #recommend .harf .slider .slick-next{right: 5px;}
#index #recommend .harf .slider .slick-prev::before, #index #recommend .harf .slider .slick-next::before{font-size: 22px;}

#index #ranking h2{background-image: url("../images/midashi_rank.png");}
#index #ranking .tab{width: 660px; margin: 0 auto 20px; font-weight: bold; text-align: center; border: 2px solid rgba(96, 172, 49, 1); border-radius: 8px; cursor: pointer;}
#index #ranking .tab li{float: left; width: 218px; padding: 10px 0; transition: .5s;}
#index #ranking .tab li:not(:last-child){border-right: 2px solid rgba(96, 172, 49, 1);}
#index #ranking .tab li:last-child{width: 220px;}
#index #ranking .tab li.active{color: #fff; background-color: rgba(96, 172, 49, 1); cursor: auto;}
#index #ranking .area > div{display: none;}
#index #ranking .area > div.show{display: block;}
#index #ranking .area ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
#index #ranking .area ul li{flex-basis: 103px;}
#index #ranking .area ul li#ranking_no1,
#index #ranking .area ul li#ranking_no2,
#index #ranking .area ul li#ranking_no3{flex-basis: 32%; margin-bottom: 20px;}

#index #ranking .contents p{margin: 0}
#index #ranking .contents p.clown{font-size: 1.1rem; font-weight: bold; background-position: left top; background-repeat: no-repeat;}
#index #ranking .contents li#ranking_no1 p.clown{padding-left: 35px; background-image: url("../images/clown_gold.png");}
#index #ranking .contents li#ranking_no2 p.clown{padding-left: 35px; background-image: url("../images/clown_silver.png");}
#index #ranking .contents li#ranking_no3 p.clown{padding-left: 35px; background-image: url("../images/clown_bronze.png");}
#index #ranking .contents .item_image_area img{max-width: 100%; max-height: 100%; height: auto; margin: 0;}
#index #ranking .contents li#ranking_no1 .item_image_area img,
#index #ranking .contents li#ranking_no2 .item_image_area img,
#index #ranking .contents li#ranking_no3 .item_image_area img{width: 100%;}
#index #ranking .contents p.badge{padding: 5px 6px; font-size: 10px; transform: scale(0.7) translate(-20px);}
#index #ranking .contents li#ranking_no1 p.badge,
#index #ranking .contents li#ranking_no2 p.badge,
#index #ranking .contents li#ranking_no3 p.badge{padding: 5px 7px; transform: none;}
#index #ranking .contents p.itemName{font-size: 0.8rem;}
#index #ranking .contents li#ranking_no1 p.itemName,
#index #ranking .contents li#ranking_no2 p.itemName,
#index #ranking .contents li#ranking_no3 p.itemName{width: 100%; font-size: 1rem;}

#index #newitem h2{background-image: url("../images/midashi_na.png");}
#index #sns h2{background-image: url("../images/midashi_sns.png");}

/* =================================================================
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
=================================================================*/
/* cartSidebar - カートフロー内サイドバー
-------------------------------------------------------------*/
#cartSidebar{width: 210px; float: right;}
#cartSidebar #sideInner{width: 210px;}
#cartSidebar .total_box{border: #CCC 1px solid; padding: 10px; background: #F6F6F6;}
#cartSidebar .total_box .box{border: none; margin-bottom: 10px;}
#cartSidebar .total_box .box:after {content: ""; clear: both; display: block;}/* clearfix */
#cartSidebar .total_box h3{margin: 0; background: none; padding: 0px; border: 0px; font-size: 14px; float: left;}
#cartSidebar .total_box p.price{font-size: 16px; float: right; margin: 0px; font-weight: bold;}
#cartSidebar .total_box img{margin: 0px auto 10px; display: block;}
#cartSidebar .total_box .totalpricebox{border: none; margin-bottom: 10px; padding-top: 10px; border-top: 1px #CCCCCC solid;}
#cartSidebar .total_box .totalpricebox:after {content: ""; clear: both; display: block;}/* clearfix */
#cartSidebar .total_box .teiki_text{margin: 0; font-size: 12px;}
#cartSidebar .cartButtonArea a{display: block; margin: 0 auto 10px; min-width: 180px;; max-width: 180px;}
#cartSidebar .cartButtonArea img{display: block;}
#cartSidebar .cartButtonArea input{display: block; margin: 0 auto 10px; min-width: 180px;; max-width: 180px;}
#cartSidebar .tax{font-size: 9px; color: #666;}

/* cartIndex - 買い物かごの中身
-------------------------------------------------------------*/
#cartIndex{width: 980px; padding-bottom: 20px; margin: 0 auto;}
#cartIndex .content{width: 750px; float: left; margin-right: 20px;}
#cartIndex:after {content: ""; clear: both; display: block;}/* clearfix */
#cartIndex table{width: 750px; margin: 0px 0 10px;}
#cartIndex table .itemname {width: 500px;}
#cartIndex div#novelty table .itemname {width: 650px;}
#cartIndex table .itemname ~ th,
#cartIndex table .itemname ~ td {width: 125px;}
#cartIndex .img_box{width: 80px; height: 80px; text-align: center; position: relative; float: left;}
#cartIndex .img_box img{width: auto; max-width: 80px; max-height: 80px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
#cartIndex .text_box{padding-left: 90px;}
#cartIndex .text_box p{margin: 0 0 10px; font-size: 100%;}
#cartIndex .text_box p.code{font-size: 80%;}
#cartIndex .text_box p.last{margin-bottom: 0px;}

#cartIndex .empty{margin: 20px 0;}
#cartIndex .price{color: #C00; text-align: right;}
#cartIndex .tax{font-size: 9px; color: #666;}
#cartIndex .amount{text-align: center;}
#cartIndex .delete .button{width: 50px;}

#cartIndex .total{margin: 0px 0 30px; padding: 0px 0 5px; font-weight: bold; text-align: right; border-bottom: #CCC 1px solid; float: left; width: 750px;}
#cartIndex .total p{margin: 0px; font-size: 90%;}
#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%;}
#cartIndex .box{border: 1px solid #CCC; margin-bottom: 30px; clear: both;}
#cartIndex .box .buttonarea.amazon_btn{margin: 10px; padding: 10px 0 0; text-align: center;}
#cartIndex .box .buttonarea.amazon_btn .button.medium{max-width: 270px; width: 270px;}

/* ログインチェック */
/* モーダルタイプ */
#cart_index #noLoginFixedPanel {position: fixed; top: 0; left: 0;	display: flex; align-items: center;	width: 100vw;	height: 100vh; font-family: "Montserrat","游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif; background-color: rgba(255, 255, 255, 0.8); z-index: 10000;}

#cart_index .panelBox {width: 45%; margin: 0 auto; background-color: rgba(255, 255, 255, 1); border-radius: 25px;	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);}
#cart_index .panelBox h2 {margin: 30px 30px 1em; text-align: center;}
#cart_index .panelBox h2 img {width: 20%;	height: auto;}
#cart_index .panelBox p {margin: 0 30px;}
#cart_index .panelBox p:first-of-type {margin-bottom: 1em;}
#cart_index .panelBox div.buttonArea {margin-top: 3em; padding: 40px 0;	background-color: rgba(179, 204, 32, 1); border: 1px solid rgba(179, 204, 32, 1); border-radius: 0 0 25px 25px;}
#cart_index .panelBox div.buttonArea ul {text-align: center;}
#cart_index .panelBox div.buttonArea ul li {display: inline-block; width: 250px;}
#cart_index .panelBox div.buttonArea ul li:first-of-type {margin-right: 20px;}
#cart_index .panelBox div.buttonArea a {display: block;	padding: 8px 15px; color: rgba(137, 158, 14, 1); font-weight: 900; background-color: rgba(255, 255, 255, 1); border-radius: 5px;	transition: .5s;}
#cart_index .panelBox div.buttonArea a:hover {color: rgba(255, 255, 255, 1); text-decoration: none;	background-color: rgba(137, 158, 14, 1); transition: .5s;}

/* カートフロータイプ */
#cart_index #noLoginBox {width: 90%; margin: 50px auto 0; font-family: "Montserrat","游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif; border: 1px solid rgba(240, 240, 240, 1); border-radius: 5px;}
#cart_index #noLoginBox div:first-child {padding: 20px;}
#cart_index #noLoginBox p {padding: 0;}
#cart_index #noLoginBox p:first-of-type {margin-bottom: 1em;}
#cart_index #noLoginBox div.buttonArea ul {padding: 30px 0; text-align: center; background-color: rgba(240, 240, 240, 1);}
#cart_index #noLoginBox div.buttonArea ul li {display: inline-block; width: 43%;}
#cart_index #noLoginBox div.buttonArea ul li:first-of-type {margin-right: 3%;}
#cart_index #noLoginBox div.buttonArea a {display: block; padding: 10px 15px; color: rgba(255, 255, 255, 1); font-weight: 900; background-color: rgba(28, 134, 0, 1);	border: rgba(17, 81, 0, 1); border-radius: 25px; transition: .5s;}
#cart_index #noLoginBox div.buttonArea a:hover {color: rgba(255, 255, 255, 1); text-decoration: none;	background-color: rgba(17, 81, 0, 1); transition: .5s;}

/* 2019年カート大改修 */
.new.inputFlow #main table select {padding: 0 10px;}
.new.inputFlow #main table.inCart,
.new.inputFlow #main table.inCart + div {margin-bottom: 40px;}
.new.inputFlow #main table.inCart .clearCartBtn {background-color: #F6F6F6; border-right: none; vertical-align: middle;}
.new.inputFlow #main table.inCart .clearCartBtn a {width: 150px}
.new.inputFlow #main table.inCart .subTotal {font-weight: bold; text-align: right; background-color: #F6F6F6; border-left: none;}
.new.inputFlow #main table.inCart .subTotal .price {font-size: 1.2rem;}
.new.inputFlow #main #novelty h3 {padding: 10px 20px; background-image: none; border-top: 1px solid #ccc;}

.new.inputFlow #main table .message {margin: 0 0 .5em; padding: 3px; color: rgba(220, 0, 0, 1); border: 1px solid rgba(220, 0, 0, 1); border-radius: 2px;}
.new.inputFlow #main table .name {margin-bottom: 2px;}
.new.inputFlow #main table .novPropExist td {border: none;}
.new.inputFlow #main table .novProp td:not(.novPropAmount) {padding: 0 0 0 80px;}
.new.inputFlow #main table .novProp td.novPropAmount {vertical-align: middle;}
.new.inputFlow #main table .novProp .imgBox {float: left;}
.new.inputFlow #main table .novProp .imgBox > div {display: inline-block;}
.new.inputFlow #main table .novProp .imgBox img {width: 50px; height: 50px;}
.new.inputFlow #main table .novProp .text_box {padding-left: 110px;}
.new.inputFlow #main table tbody .text_box + div {clear: both;}

/* 注意書きのエリア */
.new #main .infomation .wrap {position: relative; margin-bottom: 10px; font-family: "Font Awesome 5 Free"; z-index: 1;}
.new #main .cart_info .wrap {padding: 15px 15px 15px 56px; color: rgba(37, 120, 151, 1); background-color: rgba(233, 245, 255, 1);}
.new #main .cart_info .wrap::before {content: '\f0f3'; position: absolute; top: -3px; left: 20px; color: rgba(205, 233, 255, 1); font-size: 3.5rem; font-weight: 900; z-index: -1;}
.new #main .cart_caution .wrap {padding: 15px 15px 15px 68px; color: rgba(21, 21, 21, 1); background-color: rgba(255, 250, 210, 1);}
.new#cart_result .cart_caution .wrap {margin-top: 0px;}
.new #main .cart_caution .wrap::before {content: '\f071'; position: absolute; top: -3px; left: 20px; color: rgba(255, 234, 148, 1); font-size: 3.5rem; font-weight: 900; z-index: -1;}
.new #main .infomation .wrap a {display: block; color: rgba(37, 120, 151, 1); text-decoration: none;}
.new #main .cart_info .wrap a {color: rgba(37, 120, 151, 1);}
.new #main .cart_check .wrap a {position: relative; padding: 15px 15px 15px 56px; color: rgba(0, 125, 30, 1); background-color: rgba(234, 245, 234, 1); border: 1px solid rgba(234, 245, 234, 1); z-index: 1; transition: .5s;}
.new #main .cart_check .wrap a:hover {border-color: rgba(0, 125, 30, 1); transition: .5s;}
.new #main .cart_check .wrap a::before {content: '\f058'; position: absolute; top: -3px; left: 20px; color: rgba(200, 235, 200, 1); font-size: 3.5rem; font-weight: 900; z-index: -1;}
.new #main .cart_caution .wrap a {color: rgba(21, 21, 21, 1);}
.new #main .infomation .wrap a img {vertical-align: middle;}
.new #main .infomation.novelty {margin-bottom: 10px;}
.new #main #orderInfo .cart_caution {margin-bottom: 20px;}

.new #main .infomation p {margin: 0;} 
.new #main .infomation p.title {margin-bottom: .6rem; font-size: .9rem; font-weight: bold;} 
.new #main .infomation p.contents {font-size: .8rem;}
.new #main .infomation span.underLine {text-decoration: underline;} 
.new #main .infomation span.txtBold {font-weight: bold;} 

/* cartLogin - 買い物かご・プレゼントログイン
-------------------------------------------------------------*/
#cartLogin:after {content: ""; clear: both; display: block;}/* clearfix */
#cartLogin table{margin: 0 auto 20px auto; width: 428px;}
#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; width: 468px; float: left; margin: 0 10px 30px; position: relative;}
#cartLogin .box .buttonarea{width: 100%; margin: 20px 0; padding: 0;}
#cartLogin .box table[summary="ログイン"]{margin: 10px; width: 446px;}
#cartLogin .box .link_text{text-align: right; padding: 15px 0 10px;}
#cartLogin .box .regist_non_area{width: 442px; margin: 0 auto;}
#cartLogin .box .regist_non_area p{margin: 0 0 10px;}
#cartLogin .box .amazon_area{width: 442px; margin: 0 auto; border-top: 1px solid #ccc;}
#cartLogin .box .amazon_area p{margin: 10px 0;}
#cartLogin .widebox{border: 1px solid #CCC; width: 960px; margin: 0 10px 30px; clear: both;}
#cartLogin .widebox .link{text-align: right;}
#cartLogin .widebox table{width: 920px;}
#cartLogin input[type='text'],#cartLogin input[type='password']{width: 200px;}

#cartLogin .social_provider ul{margin: 10px 19px 20px;}
#cartLogin .social_provider ul:after {content: ""; clear: both; display: block;}/* clearfix */
#cartLogin .social_provider ul li{width: 220px; height: 44px; font-size: 14px; display: block; float: left; margin: 10px 5px;}
#cartLogin .social_provider ul li a{display: block; text-decoration: none;}
#cartLogin .social_provider ul li a span{padding: 14px 0 14px 25px; border: 1px solid #cdcdcd; border-left: 0px; margin: 0 0 0 53px; display: block; background: #FFF; line-height: 1; font-size: 14px;
-webkit-border-top-right-radius: 3px;
-webkit-border-bottom-right-radius: 3px;  
-moz-border-radius-topright: 3px;  
-moz-border-radius-bottomright: 3px;
}

#cartLogin .social_provider li.yahoo a{background: url("../images/social_yahoo.png") no-repeat; color: #e71017;}
#cartLogin .social_provider li.facebook a{background: url("../images/social_facebook.png") no-repeat; color: #3b5998;}
#cartLogin .social_provider li.twitter a{background: url("../images/social_twitter.png") no-repeat; color: #55acee;}
#cartLogin .social_provider li.google a{background: url("../images/social_google.png") no-repeat; color: #dc4e41;}
#cartLogin .social_provider li.mixi a{background: url("../images/social_mixi.png") no-repeat; color: #d1ad59;}
#cartLogin .social_provider li.rakuten a{background: url("../images/social_rakuten.png") no-repeat; color: #bf0000;}
#cartLogin .social_provider li.line a{background: url("../images/social_line.png") no-repeat; color: #00b300;}
#cartLogin .social_provider li.paypal a{background: url("../images/social_paypal.png") no-repeat; color: #293e7f;}

/* 2019年カート大改修 */
.new #main #loginNew div:not(.box) input[name="LOGINID"],
.new #main #loginNew div:not(.box) input[name="PASSWORD"] {width: 20em;}
.new #main #cartLogin div:not(.widebox) input,
.new #main #loginNew div.box input {width: 100%;}
.new #main #loginNew div:not(.box) input[name="REALSTYLE:LOGIN_SAVE"] {margin-left: 1em; vertical-align: middle;}
.new #main #loginNew div:not(.box) label[for="REALSTYLE:LOGIN_SAVE"] {margin-left: .2em; vertical-align: middle;}
.new #main #cartLogin p.link_text {margin: 0 10px; padding: 0 0 10px;}
.new #main #cartLogin .box:nth-of-type(2) {position: relative;}
.new #main #cartLogin .box:nth-of-type(2) .buttonarea {position: absolute; bottom: 0;}

/* cartFlow - 買い物かご・プレゼント注文情報入力～注文完了まで
-------------------------------------------------------------*/
#cartFlow{width: 980px; padding-bottom: 20px; margin: 0 auto;}
#cartFlow:after {content: ""; clear: both; display: block;}/* clearfix */
#cartFlow .content{width: 750px; float: left; margin-right: 20px;}
#cartFlow td input{vertical-align: baseline;}
#cartFlow table.newCreditCard{width: 547px; font-size: 100%; margin: 10px auto;}

#cartFlow .point_info{margin-bottom: 20px;}

#cartFlow .teiki ul{margin: 5px 10px;}
#cartFlow .teiki ul:after {content: ""; clear: both; display: block;}/* clearfix */
#cartFlow .teiki ul li{float: left; font-size: 13px; margin-right: 1em;}

#cartFlow table {width: 750px; margin: 0px 0 20px;}
#cartFlow table.change_data {margin-top: -21px;}
#cartFlow table.member_regist {margin-top: -21px;}
#cartFlow table td.short input {width: 120px;}

#cartFlow .text_box {padding-left: 90px;}
#cartFlow .text_box p {margin: 0 0 10px; font-size: 100%;}
#cartFlow .text_box p.code {font-size: 80%;}
#cartFlow .text_box p.last {margin-bottom: 0px;}

#cartFlow h3 {display: block; font-size: 110%; margin: 30px 0px 10px; padding-bottom: 5px;}
#cartFlow h3 img {vertical-align: middle;}
#cartFlow h3 .lock {position:relative; top:-3px;}
#cartFlow .price {color: #C00; text-align: right;}
#cartFlow .total {margin: 0px 0 30px; padding: 0px 0 5px; font-weight: bold; text-align: right; border-bottom: #CCC 1px solid; width: 700px;}
#cartFlow .total p {margin: 0px; font-size: 90%;}
#cartFlow .point {color: #F60; font-weight: bold;}
#cartFlow .attention {color: #C00; font-weight: bold; font-size: 110%;}
#cartFlow .attention_message {color: #C00; font-weight: bold;}

#cartFlow .sendCopyButton,
#cartFlow .delAddressButton .button {margin-bottom: 10px;}
#cartFlow .sendCopyButton:after {content: ""; clear: both; display: block;}/* clearfix */
#cartFlow .sendCopyButton .button,
#cartFlow .delAddressButton .button {width: auto; display: inline-block;}

#cartFlow .multi_send .buttonarea {background: #EEE; margin: 0px 0 20px; padding: 30px 0;}
#cartFlow .multi_send table.delivery {margin-top: -21px;}
#cartFlow .multi_send .sendAddressButton a {width: auto; display: inline-block; margin-bottom: 10px;}

#cartFlow #reCAPTCHA {margin: 20px auto 40px auto;}
#cartFlow #reCAPTCHA iframe {width: 158px; height: 138px;}
#cartFlow #reCAPTCHA .g-recaptcha {display: block; -webkit-transform: scale(1.19); -ms-transform: scale(1.19); transform: scale(1.19); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0;}

#cartFlow .cartitem {margin-top: 20px; width: 210px; padding: 10px; border: #CCC 1px solid;}
#cartFlow .cartitem h3 {margin: 0 0 10px; padding: 0px; border: none; background: none;}
#cartFlow .cartitem li {margin-bottom: 10px; padding-bottom: 0px; border-bottom: 1px solid #CCC;}
#cartFlow .cartitem .img_box { width: 25px; height: 25px; float: left; margin-right: 5px; text-align: center; position: relative;}
#cartFlow .cartitem .img_box img {width: auto; max-width: 25px; max-height: 25px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
#cartFlow .cartitem .text_box {padding-left: 0px; margin-bottom: 5px;}
#cartFlow .cartitem .text_box:after {content: ""; clear: both; display: block;}/* clearfix */
#cartFlow .cartitem .text_box p {margin: 0px; font-size: 70%; line-height: 130%;}
#cartFlow .cartitem p.price {font-size: 70%; margin: 0px; float: left;}
#cartFlow .cartitem p.amount {font-size: 70%; margin: 0px; float: right;}

#cartFlow .cartresult table {width: 920px; margin: 0 auto 20px;}
#cartFlow .cartresult .total {width: 920px; margin: 0 10px 30px;}

#cartFlow .cartconfirm table {width: 920px; margin: 0 auto 20px;}
#cartFlow .cartconfirm .total {width: 920px; margin: 0 10px 30px;}
#cartFlow .error {clear: both; margin: 5px 10px; color: #C00; font-weight: bold; text-align: center; font-size: 80%;}

#cartFlow .card-supplement {font-size:12px; color:#368bc6; font-weight:bold;}
#cartFlow .card-supplement2 {font-size:12px; font-weight:bold;}

/* クーポンラジオボタン制御に仕様 */
.couponHide, .pointHide {display: none;}

/* 2019年カート大改修 */
.new #main #cartFlow .content > h3:first-of-type,
.new #main #cartFlow .content > div:first-of-type h3,
.new #main #cartFlow .content  h3.client {margin-top: 0;}
.new #main #cartFlow #mobile h3 {margin: 0 0 10px; padding: 0;}
.new #main #cartFlow .multi_send .sendAddressButton a {margin-bottom: 0;}
.new #main #cartFlow .multi_send .buttonarea {margin-top: 20px;}
.new #main #cartFlow input.error {margin: 0; color: inherit; font-weight: normal; text-align: left; font-size: inherit;}
.new #main #cartFlow label.error {text-align: left;}

/* cartResult - カート完了画面
-------------------------------------------------------------*/
#cartResult .number {margin: 30px 0px; text-align: center; line-height: 200%;}
#cartResult .number strong {font-size: 20px;}
#cartResult .onetime {margin-bottom: 0; text-align: center;}

/* 2019年カート大改修 */
.new #main #cartResult .orderNum {width: 50%; margin: 40px auto 5px; padding: 5px 0; font-size: 2rem; font-weight: bold; text-align: center; border: 2px solid rgba(21, 21, 21, 1); border-radius: 35px;}
.new #main #cartResult div.onetime {margin-bottom: 60px;}
.new #main #cartResult .orderNum.noOnetime {margin-bottom: 100px;}
.new #main #cartResult .buttonArea {width: 430px; margin: 0 auto;}
.new #main #cartResult .buttonArea li {float: left; width: 200px; text-align: center;}
.new #main #cartResult .buttonArea li:not(:first-child) {margin-left: 30px;}
.new #main #cartResult .buttonArea li a {display: block; padding: 10px 0; color:rgba(21, 21, 21, 1); border:1px solid rgba(21, 21, 21, 1); border-radius: 25px; transition: .5s;}
.new #main #cartResult .buttonArea li a:hover {background-color: rgba(230, 230, 230, 1); text-decoration: none;}

.new#cart_result_ontime #main #cartResult .orderNum {margin-bottom: 100px;}

/* cartRecommend - カートおすすめ
-------------------------------------------------------------*/
#cartRecommend{margin-top: 20px; width: 210px; padding: 10px; border: #CCC 1px solid; }
#cartRecommend .box{margin: 0px 0 40px; border: 0px;}
#cartRecommend .box:after {content: ""; clear: both; display: block;}/* clearfix */
#cartRecommend .text{margin-left: 70px; min-height: 60px;}
#cartRecommend h3{margin-bottom: 10px; height: auto; background: none; padding: 0px; border-bottom: none;}
#cartRecommend h3 a{float: right;}
#cartRecommend h4{display: block; margin: 0px 0px 10px; background: none; padding: 0px; font-size: 70%; border-bottom: none;}
#cartRecommend .appeal{display: block; margin: 0; color: #F60; font-size: 70%;}
#cartRecommend .price{display: block; margin: 0; color: #C00;}
#cartRecommend .price .teika{font-weight: bold; font-size: 100%;}
#cartRecommend .price .other{font-size: 90%;}
#cartRecommend .explanation1{display: block; margin: 5px 0px 0 0; padding: 10px 0; border-top: #CCC 1px solid; font-size: 80%; line-height: 120%;}
#cartRecommend .buttonarea{display: block; margin: 0px; padding-top: 10px; text-align: left;}
#cartRecommend .buttonarea .button{display: block; margin: 0 0 10px;}
#cartRecommend .property{ margin: 0 0 10px; color: #AAA; font-size: 75%;}

#cartRecommend .img_box{width: 60px; height: 60px; text-align: center; position: relative; float: left;}
#cartRecommend .img_box img{width: auto; max-width: 60px; max-height: 60px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}

/* presentFlow - 買い物かご・プレゼント注文情報入力～注文完了まで
-------------------------------------------------------------*/
#presentFlow #cartLogin table{width: 446px !important;}

/* 新規登録　送信ボタン - 押せないとき */
input[type="submit"][disabled] {
background-color: #ccc;
cursor: default;
}

/* =================================================================
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 #373737; font-size: 110%;}
#teikiIndex h4{display: block; margin: 30px 0px 20px; padding-left: 15px; border-bottom: 1px solid #CCC; background: url("../images/marker.gif") 2px 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 .head_renew .button{display: inline-block; width: auto; margin-bottom: 10px;}
#teikiIndex .price{color: #C00; text-align: right;}
#teikiIndex table{width: 728px; margin: 10px 0px 30px;}
#teikiIndex table:last-child{margin-bottom: 0px;}
#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;}
#teikiIndex .cancel_oder .button{display: inline-block; width: auto;}
#teikiIndex .cancel_oder form{height: 20px;}

/* teikiDetail - 定期購入商品照会・変更・確認画面
-------------------------------------------------------------*/
#teikiDetail h3{margin: 5px; padding-left: 8px; border-left: 6px solid #373737; font-size: 110%;}
#teikiDetail h4{display: block; margin: 30px 0px 20px; padding-left: 15px; border-bottom: 1px solid #CCC; background: url("../images/marker.gif") 2px 8px no-repeat; font-size: 100%;}
#teikiDetail h5{margin: 20px 0px 0; font-size: 16px;}
#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: 728px; margin: 10px 0px 30px;}
#teikiDetail table:last-child{margin-bottom: 0px;}
#teikiDetail td.month{background: #F9F9F9; font-weight: bold; color: #960;}


/* =================================================================
10.フッタ
使用ファイル：common/footer.xhtml
=================================================================*/
#footer{clear: both; width: 100%; margin-top: 120px;}
#footer .copyright{padding: 10px 0 10px; font-size: 75%; color: #333; text-align: center; border-top: 1px solid #CCC;}

/* backtotop */
#topBtn{position:fixed; bottom:20px; right:20px; display:block;}
#topBtn a{width:54px; height:54px; display:block;}

/* =================================================================
11.商品詳細・一覧、プレゼント詳細・一覧、トピックス詳細・一覧
使用ファイル：item_list$detail.xhtml, item_list$image.xhtml
　　　　　　　item_list$simple.xhtml, item_detail.xhtml
　　　　　　　present_list.xhtml, present_detail.xhtml
		　　topics_list.xhtml,topics_detail.xhtml
=================================================================*/
/* category_html - カテゴリHTML
-------------------------------------------------------------*/
#category_html{position: relative; margin-bottom: 20px;}
#category_html img{display: block; max-width: 100%; margin-bottom: 10px;}
#category_html .social {display: flex; position: absolute; left: 87px; bottom: 20px;}
#category_html .social li:not(:last-child) {margin-right: 20px;}
#category_html .social svg {width: 24px; height: auto; fill:#fff; vertical-align: middle;}
#category_html .social a svg {transition: .5s;}
#category_html .social a:hover svg {fill:#000; transition: .5s;}

/* search_condition - 絞り込み検索条件
-------------------------------------------------------------*/
#search_condition{margin-bottom: 20px;}

/* itemListCategory - カテゴリ
-------------------------------------------------------------*/
#itemListCategory {margin-bottom: 20px;}
#list #itemListCategory ul {display: flex; flex-wrap: wrap; margin-bottom: 20px; padding: 0; background-image: none;}
#list #itemListCategory li {float: inherit; margin: 0 10px 10px 0;}
#list #itemListCategory li a {display: block; position: relative; padding: 5px 23px 4px; color: #333; background-color: #fefefe; text-decoration: none; border: 1px solid #ccc; border-radius: 5px; z-index: 2;}
#list #itemListCategory li a::after {content: ""; display: block; position: absolute; top: 0; left: 0; width: 0; height: 100%; background-color: #efefef; z-index: -1; transition: .3s;}
#list #itemListCategory li a:hover::after {width: 100%; transition: .3s;}

/* narrowListCategory - 絞り込みカテゴリ
-------------------------------------------------------------*/
#narrowListCategory:after {content: ""; clear: both; display: block;}/* clearfix */
#narrowListCategory h3{display: block; padding: 3px 10px; font-size: 80%; border: 1px solid #ccc; z-index: 99; position: relative; cursor: default;}
#narrowListCategory .inner{padding-bottom: 20px;}
#narrowListCategory .inner:after {content: ""; clear: both; display: block;}/* clearfix */
#narrowListCategory #narrowDownCategoryMultiple{float: left; width: 180px; height: 27px; margin-right: 5px;}
#narrowListCategory #narrowDownCategoryMultiple:after {content: ""; clear: both; display: block;}/* clearfix */
#narrowListCategory h3:hover + ul{display: block; z-index: 100; position: relative; border: 1px solid #ccc; border-top: none; margin-top: -1px;}

#narrowListCategory .box {display: none; background: #FFF; padding: 5px;}
#narrowListCategory .box:hover{display: block; z-index: 100; position: relative; border: 1px solid #ccc; border-top: none; margin-top: -1px;}
#narrowListCategory .box.hover{display: block; z-index: 100; position: relative; border: 1px solid #ccc; border-top: none; margin-top: -1px;}
#narrowListCategory .box li{font-size: 80%; display: block; margin-bottom: 5px;}
#narrowListCategory .box li:after {content: ""; clear: both; display: block;}/* clearfix */
#narrowListCategory .box input{float: left; width: 15px; display: block; margin: 3px 5px 0 3px;}
#narrowListCategory .box label{float: left; width: 145px; display: block;}
*+html #narrowListCategory .box label{margin: 5px 0 0 0px;}

#narrowListCategory .filterArea{clear: both; margin-bottom: 20px;}
#narrowListCategory .filterArea:after {content: ""; clear: both; display: block;}/* clearfix */
#narrowListCategory .filterArea li{display: block; font-size: 80%; background: #C00; float: left; color: #FFF; text-decoration: none; padding: 5px; white-space: nowrap; margin-right: 10px; line-height: 130%;}
#narrowListCategory .filterArea li a{margin-left: 10px; color: #FFFFFF; text-decoration: none; font-size: 130%;}
#narrowListCategory .filterArea li a:hover{text-decoration: underline;}
#narrowListCategory .filterArea li.filter_clear {background: none; margin: 0px; text-indent: 0px;}
#narrowListCategory .filterArea li.filter_clear a{ color: #333333; margin: 0px; font-size: 100%;}

/* list - 一覧画面共通のメニュー
-------------------------------------------------------------*/
#list .box{position: relative; z-index: 1;}
#list h1{margin-bottom: 20px; font-size: 1.5rem; font-weight: bold; border-bottom: solid 3px #cccccc; position: relative; z-index:0}
#list h1:after{position: absolute; content: " "; display: block; border-bottom: solid 3px #84c102; bottom: -3px; width: 20%; z-index:0}
#list h2{position: inherit; margin: 0; font-size: 1rem; border: none;}
#list h2::after{content: none;}
#list a{color: #333;}
#list select{padding: 0 5px; font-weight: bold; border-radius: 5px;}
#list ul.toggleSwitch{flex-basis: 100%; margin-bottom: 20px; border-bottom: 1px solid #ccc;}
#list ul.toggleSwitch:after{content: ""; display: block; clear: both;}
#list ul.toggleSwitch li{float: left; font-size: .75rem; margin-bottom: -1px;}
#list ul.toggleSwitch li:not(:last-child){margin-right: 5px;}
#list ul.toggleSwitch li a{display: block; padding: 5px 10px 5px 25px; border: 1px solid #ddd; border-bottom: 1px solid #ccc; transition: .3s;}
#list ul.toggleSwitch li a:not(.select):hover{background-color: #fff; border-color: #ccc; border-bottom-color: #ccc; transition: .3s;}
#list .detail{background: url("../images/icon_list_detail.png") 7px 7px no-repeat #ddd;}
#list .image{background: url("../images/icon_list_image.png") 7px 7px no-repeat #ddd;}
#list .simple{background: url("../images/icon_list_simple.png") 7px 7px no-repeat #ddd;}
#list .detail.select{background-color: #fff; border-color: #ccc; border-bottom-color: #fff;}
#list .image.select{background-color: #fff; border-color: #ccc; border-bottom-color: #fff;}
#list .simple.select{background-color: #fff; border-color: #ccc; border-bottom-color: #fff;}
#list #itemAccessLog{flex-basis: 100%; margin-top: 60px;}
#list #badgeArea ul{margin-top: -5px;}
#list #badgeArea li{font-size: .6rem; padding: 4px 13px;}
#list .button_area .positive{color: #fff;}
#list .aniBorder > span {display: block; position: absolute; z-index: 10;}
#list .aniBorder > span.top, #list .aniBorder > span.bottom {width: 0; height: 1px; background-color: #ccc;}
#list .aniBorder > span.right, #list .aniBorder > span.left {width: 1px; height: 0; background-color: #ccc;}
#list .aniBorder > span.top{top: -1px; left: 0; transition-duration: .01s;}
#list .aniBorder > span.bottom{bottom: -1px; right: 0; transition-duration: .01s;}
#list .aniBorder > span.right{right: -1px; top: 0; transition-duration: .01s;}
#list .aniBorder > span.left{left: -1px; bottom: 0; transition-duration: .01s;}
#list a:hover .aniBorder > span.top{width: 100%; transition-duration: .3s;}
#list a:hover .aniBorder > span.bottom{width: 100%; transition-duration: .3s; /*transition-delay: .4s;*/}
#list a:hover .aniBorder > span.right{height: 100%; transition-duration: .3s; /*transition-delay: .2s;*/}
#list a:hover .aniBorder > span.left{height: 100%; transition-duration: .3s; /*transition-delay: .6s;*/}

/* itemListDetail - 商品詳細一覧・プレゼント一覧
-------------------------------------------------------------*/
#itemListDetail{margin: 20px 0;}
#itemListDetail .box{padding: 10px; border: 1px solid #eee;}
#itemListDetail .box:not(:first-child){margin-top: 15px;}
#itemListDetail .box > div{display: flex; justify-content: space-between; flex-wrap: wrap;}
#itemListDetail .caution.box.teiki{flex-basis: 100%; order: 1; margin: 0 0 .5rem;}
#itemListDetail .img_box, #itemListDetail .img_box img{position: inherit; margin: inherit; text-align: left;}
#itemListDetail .img_box{flex-basis: 15%; order: 2;}
#itemListDetail .img_box img{width: auto; max-width: 100%; max-height: 100%;}
#itemListDetail .text{flex-basis: 83.5%; order: 3;}
#itemListDetail .explanation1{font-size: .9rem;}
#itemListDetail .price{margin-bottom: 10px; text-align: right;}
#itemListDetail ul.price{display: flex; justify-content: flex-end;}
#itemListDetail ul.price li{align-self: flex-end;}
#itemListDetail ul.price li:not(:first-child){margin-left: 10px;}
#itemListDetail ul.price li:last-child{color: #c00; font-size: 1.4rem; font-weight: bold;}
#itemListDetail .price p{margin: 0;}
#itemListDetail .price .priceTag, #itemListDetail .price .tax{font-size: .5em;}
#itemListDetail .button_area{display: flex; justify-content: flex-end; padding-top: 10px; border-top: 1px solid #ccc;}
#itemListDetail .button_area li:not(:first-child){margin-left: 5px;}
#itemListDetail .button_area .button{width: 150px; padding: 5px 0;}
#itemListDetail .property{margin: 0; color: #AAA; font-size: .75rem; padding: 3px;}
#itemListDetail .aniBorder > span.top, #list .aniBorder > span.bottom {background-color: #aaa;}
#itemListDetail .aniBorder > span.right, #list .aniBorder > span.left {background-color: #aaa;}


/* itemListDetail - 商品一覧お気に入りリストに入った報告ポップアップ
-------------------------------------------------------------*/
#itemListDetail .wishlistSubmitButton{position: relative;}
#itemListDetail .wishlistSubmitButton .wishlistMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListDetail .wishlistSubmitButton .wishlistMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListDetail .wishlistSubmitButton .wishlistMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListDetail .wishlistSubmitButton .wishlistMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListDetail .wishlistSubmitButton .wishlistMessage .link{background-color: #fff; text-align: center;}
#itemListDetail .wishlistSubmitButton .wishlistMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}
#itemListDetail .wishlistSubmitButton .wishlistDelMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListDetail .wishlistSubmitButton .wishlistDelMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListDetail .wishlistSubmitButton .wishlistDelMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListDetail .wishlistSubmitButton .wishlistDelMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListDetail .wishlistSubmitButton .wishlistDelMessage .link{background-color: #fff; text-align: center;}
#itemListDetail .wishlistSubmitButton .wishlistDelMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* itemListDetail - 商品カートに入った報告ポップアップ
-------------------------------------------------------------*/
#itemListDetail .cartSubmitButton{position: relative;}
#itemListDetail .cartSubmitButton .cartMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListDetail .cartSubmitButton .cartMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListDetail .cartSubmitButton .cartMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListDetail .cartSubmitButton .cartMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListDetail .cartSubmitButton .cartMessage .link{background-color: #fff; text-align: center;}
#itemL#itemListDetailistImage .cartSubmitButton .cartMessage .link a{display: inline-block;}
#itemListDetail .cartSubmitButton .cartMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* itemListSimple - 商品簡易一覧
-------------------------------------------------------------*/
#itemListSimple{margin: 20px 0;}
#itemListSimple .box{padding: 10px; border: 1px solid #eee;}
#itemListSimple .box:not(:first-child){margin-top: 15px;}
#itemListSimple .price{margin-bottom: 10px; text-align: right;}
#itemListSimple ul.price{display: flex; justify-content: flex-end;}
#itemListSimple ul.price li{align-self: flex-end;}
#itemListSimple ul.price li:not(:first-child){margin-left: 10px;}
#itemListSimple ul.price li:last-child{color: #c00; font-size: 1.4rem; font-weight: bold;}
#itemListSimple .price p{margin: 0;}
#itemListSimple .price .priceTag, #itemListSimple .price .tax{font-size: .5em;}
#itemListSimple .button_area{display: flex; justify-content: flex-end; padding-top: 10px; border-top: 1px solid #ccc;}
#itemListSimple .button_area li:not(:first-child){margin-left: 5px;}
#itemListSimple .button_area .button{width: 150px; padding: 5px 0;}
#itemListSimple .property{margin: 0; color: #AAA; font-size: .75rem; padding: 3px;}
#itemListSimple .aniBorder > span.top, #list .aniBorder > span.bottom {background-color: #aaa;}
#itemListSimple .aniBorder > span.right, #list .aniBorder > span.left {background-color: #aaa;}


/* itemListSimple - 商品カートに入った報告ポップアップ
-------------------------------------------------------------*/
#itemListSimple .cartSubmitButton{position: relative;}
#itemListSimple .cartSubmitButton .cartMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListSimple .cartSubmitButton .cartMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListSimple .cartSubmitButton .cartMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListSimple .cartSubmitButton .cartMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListSimple .cartSubmitButton .cartMessage .link{background-color: #fff; text-align: center;}
#itemListSimple .cartSubmitButton .cartMessage .link a{display: inline-block;}
#itemListSimple .cartSubmitButton .cartMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* itemListSimple - 商品一覧お気に入りリストに入った報告ポップアップ
-------------------------------------------------------------*/
#itemListSimple .wishlistSubmitButton{position: relative;}
#itemListSimple .wishlistSubmitButton .wishlistMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListSimple .wishlistSubmitButton .wishlistMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListSimple .wishlistSubmitButton .wishlistMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListSimple .wishlistSubmitButton .wishlistMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListSimple .wishlistSubmitButton .wishlistMessage .link{background-color: #fff; text-align: center;}
#itemListSimple .wishlistSubmitButton .wishlistMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}
#itemListSimple .wishlistSubmitButton .wishlistDelMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListSimple .wishlistSubmitButton .wishlistDelMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListSimple .wishlistSubmitButton .wishlistDelMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListSimple .wishlistSubmitButton .wishlistDelMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListSimple .wishlistSubmitButton .wishlistDelMessage .link{background-color: #fff; text-align: center;}
#itemListSimple .wishlistSubmitButton .wishlistDelMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* itemListImage - 商品画像一覧
-------------------------------------------------------------*/
#itemListImage{display: flex; flex-wrap: wrap; justify-content: space-between; margin: -30px 0 20px;}
#itemListImage.column3{margin-top: -50px;}
#itemListImage.column3::after{content: ""; display: block; flex-basis: 28%;}
#itemListImage .box{flex-basis: 24%; margin-top: 40px; padding: 8px;}
#itemListImage.column3 .box{flex-basis: 28%; margin-top: 60px;}
#itemListImage .box > div{height: 100%; display: flex; flex-direction: column;}
#itemListImage .badgeArea, #itemListImage .img_box{margin-bottom: 5px;}
#itemListImage .badgeArea.upper{text-align: center; order: 1;}
#itemListImage .badgeArea.bottom{margin-top: -10px;order: 3;}
#itemListImage .badgeArea.upper ul{margin-top: -5px;}
#itemListImage .badgeArea.upper .item_icon{margin-right: 0;}
#itemListImage .badgeArea.bottom ul{display: flex; flex-wrap: wrap; margin-right: -5px;}
#itemListImage .badgeArea.bottom .item_icon{margin-right: 5px; padding: 3px 10px; font-size: .5rem;}
#itemListImage .img_box, #itemListImage .img_box img{position: inherit; margin: inherit; text-align: left;}
#itemListImage .img_box{margin-bottom: 10px; order: 2;}
#itemListImage .img_box img{max-width: 100%; height: auto;}
#itemListImage .img_box + .text{margin-top: 10px;}
#itemListImage .itemName{margin: 0; font-size: .9rem; flex-grow: 1; order: 4;}
#itemListImage .text{order: 5;}
#itemListImage .button_area li:not(:first-child){margin-top: 10px;}
#itemListImage .price{margin-bottom: 10px; text-align: right; line-height: 1;}
#itemListImage ul.price li:last-child{margin-top: .1rem; color: #c00; font-size: 1.4rem; font-weight: bold;}
#itemListImage .price p{margin: 0;}
#itemListImage .price .priceTag, #itemListImage .price .tax{font-size: .5em;}
#itemListImage .property{margin: 0; color: #aaa; font-size: .75rem;}

/* itemListImage - 商品カートに入った報告ポップアップ
-------------------------------------------------------------*/
#itemListImage .cartSubmitButton{position: relative;}
#itemListImage .cartSubmitButton .cartMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListImage .cartSubmitButton .cartMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListImage .cartSubmitButton .cartMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListImage .cartSubmitButton .cartMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListImage .cartSubmitButton .cartMessage .link{background-color: #fff; text-align: center;}
#itemListImage .cartSubmitButton .cartMessage .link a{display: inline-block;}
#itemListImage .cartSubmitButton .cartMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* itemListImage - 商品一覧お気に入りリストに入った報告ポップアップ
-------------------------------------------------------------*/
#itemListImage .wishlistSubmitButton{position: relative;}
#itemListImage .wishlistSubmitButton .wishlistMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListImage .wishlistSubmitButton .wishlistMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListImage .wishlistSubmitButton .wishlistMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListImage .wishlistSubmitButton .wishlistMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListImage .wishlistSubmitButton .wishlistMessage .link{background-color: #fff; text-align: center;}
#itemListImage .wishlistSubmitButton .wishlistMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}
#itemListImage .wishlistSubmitButton .wishlistDelMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemListImage .wishlistSubmitButton .wishlistDelMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemListImage .wishlistSubmitButton .wishlistDelMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemListImage .wishlistSubmitButton .wishlistDelMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemListImage .wishlistSubmitButton .wishlistDelMessage .link{background-color: #fff; text-align: center;}
#itemListImage .wishlistSubmitButton .wishlistDelMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* topicsList - トピックス一覧
-------------------------------------------------------------*/
#topicsList {margin-bottom: 20px;}
#topicsList .box {margin-top: 10px; padding: 10px; border: #CCC 1px solid;}
#topicsList .box:after {content: ""; clear: both; display: block;}/* clearfix */
#topicsList .box h3{font-size: 95%; display: block; margin: 10px 10px 0 0px;}
#topicsList .box p{display: block; width: 728px; margin: 0; padding: 5px 0px; font-size: 90%; font-weight: normal;}
#topicsList .img_box{width: 120px; height: 120px; float: right; margin: 0 0 10px 10px; text-align: center; position: relative;}
#topicsList .img_box img{width: auto; max-width: 120px; max-height: 120px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}

/* itemDetail - 商品詳細・プレゼント詳細
-------------------------------------------------------------*/
#itemDetail{margin-bottom: 20px; font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;}
#itemDetail h1 {margin-bottom: .5em; font-size: 1.3rem;}
#itemDetail .box{margin-top: 10px;}
#itemDetail .text .box{margin-bottom: 10px;}
#itemDetail .box:after {content: ""; clear: both; display: block;}/* clearfix */

/* 商品画像の切り替え */
#itemDetail .item_image_area{float: left; width: 270px;}
#itemDetail .item_image_area #targetarea{visibility: hidden;}
#itemDetail .item_image_area #main_box{position: relative; border: 1px solid #ccc;}
#itemDetail .item_image_area #main_box:after {content: ""; clear: both; display: block;}/* clearfix */
#itemDetail .item_image_area .img_box{display: none; width: 268px; height: 268px;}
#itemDetail .item_image_area .img_box img{max-width: 268px; max-height: 268px;}
#itemDetail .item_image_area .img_box {width: 268px; height: 268px; overflow: hidden;}
#itemDetail .item_image_area .img_box img {-moz-transition: -moz-transform 0.1s linear; -webkit-transition: -webkit-transform 0.1s linear; -o-transition: -o-transform 0.1s linear; -ms-transition: -ms-transform 0.1s linear; transition: transform 0.1s linear;}
#itemDetail .item_image_area .img_box img:hover {-webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2);}
#itemDetail .item_image_area .thumb{margin: 10px 0 20px;}
#itemDetail .item_image_area .thumb:after {content: ""; clear: both; display: block;}/* clearfix */
#itemDetail .item_image_area .thumb li {margin: 0 5px 5px 0; float: left;}
#itemDetail .item_image_area .thumb li.last {margin-right: 0;}
#itemDetail .item_image_area .thumb a {border: 1px solid #ccc; width: 50px; height: 50px; display: block; text-align: center; position: relative;}
#itemDetail .item_image_area .thumb a img {max-width: 48px; max-height: 48px; width: auto; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
#itemDetail .item_image_area .thumb a img:hover {filter: alpha(opacity=60); -moz-opacity: .6; -khtml-opacity: .6; opacity: .6;}
#itemDetail .item_image_area .thumb li.active a {border: 1px solid #cc3333; display: block; filter: alpha(opacity=100) !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important;}
#itemDetail .item_image_area .thumb li.active a img:hover {cursor: default; filter: alpha(opacity=100) !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important;}
#itemDetail .otherImage {clear: both; margin-bottom: 2em; padding: 10px 10px 0 15px; font-size: 75%;}
#itemDetail .recommend {clear: both; padding: 0 10px 10px 15px; font-size: 75%;}
#itemDetail .property_image_area { clear: both;}
#itemDetail .propertyImg {width: 80px; float: left; margin-right: 15px;}
#itemDetail .propertyImg .propertyimg_box {width: 80px; height: 80px; text-align: center; position: relative; margin: 0 10px 0px 0;}
#itemDetail .propertyImg .propertyimg_box img {width: auto; max-width: 80px; max-height: 80px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
#itemDetail .propertyImg p {margin: 0; text-align: center;}
#itemDetail p {margin: 0 0 10px;}
#itemDetail .text {float: right; width: 480px; margin-bottom: 60px;}
#itemDetail .appeal {margin-bottom: .5em;}
#itemDetail h3 {display: block; margin: 10px 0px 5px 0; font-size: 105%;}
#itemDetail .price {margin-bottom: 1em; font-size: 1rem; text-align: right;}
#itemDetail .price > *:not(.price_info) {font-size: .9rem;}
#itemDetail .price ul,
#itemDetail .price p {margin-bottom: .5em;}
#itemDetail .price ul.price_info {}
#itemDetail .price ul.price_info li:last-of-type {color: rgba(210, 0, 0, 1); font-size: 1.6rem; font-weight: bold;}
#itemDetail .price .teika {}
#itemDetail .price .makerTeika {}
#itemDetail .price .other {}
#itemDetail .price .priceTag {font-size: .7em;}
#itemDetail .price .tax {font-size: .5em;}
#itemDetail .item_info {margin-bottom: 2em; padding: 1em; text-align: right; background-color: rgba(253, 253, 253, 1); border-radius: 3px;}
#itemDetail .item_info p,
#itemDetail .item_info div {margin: 0; font-size: .8rem;}
#itemDetail .item_info .review,
#itemDetail .item_info p:not(:last-of-type) {margin-bottom: .3em;}
#itemDetail .item_info .review {margin-bottom: .5rem;}
#itemDetail .item_info .review a, .review .star {display: flex; justify-content: flex-end; align-items: center;}
#itemDetail .item_info .review a {color: rgba(21, 21, 21, 1); text-decoration: none;}
#itemDetail .item_info .review .star {margin-right: .5rem;}
#itemDetail .item_info .review .star li:not(:last-of-type) {margin-right: .2rem;}
#itemDetail .item_info .review .good {color: rgba(251, 196, 43, 1);}
#itemDetail .item_info .review .bad {color: rgba(210, 210, 210, 1);}
#itemDetail .item_info .review .reviewCount {padding-top: 2px;}
#itemDetail .item_info p a {display: inline-block; padding: 6px 30px; color: rgba(21, 21, 21, 1); background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(150, 150, 150, 1); border-radius: 5px; letter-spacing: 1.5px; transition: 300ms;}
#itemDetail .item_info p a:hover{text-decoration: none; background-color: rgba(250, 250, 250, 1)}
#itemDetail .information {display: block; margin: 0 0px 0 0; font-size: 80%;}
#itemDetail .explanation1 {margin-bottom: .5em; color: rgba(150, 150, 150, 1); font-size: .8em;}
#itemDetail .explanation4 li {font-size: 1.3rem; font-weight: bold; text-align: center;}
#itemDetail .explanation4 li > span {padding: 0 0.5em;}
#itemDetail .explanation4 li > span span {padding-right: 1em;}
#itemDetail .explanation4 li:not(:last-child) {padding-bottom: 0.4rem;}
#itemDetail .explanation4 .fa-star:not(:last-child){margin-right: .1em;}
#itemDetail .explanation4 li .far:before {color: #ddd;}
#itemDetail .explanation4 li .fas:before {color: #f3d638;}
#itemDetail table {width: 480px; margin: 0 0 10px;}
#itemDetail th {width: 100px; padding: 5px 10px; text-align: left;}
#itemDetail .row {width: 170px; vertical-align: middle; text-align: center;}
#itemDetail td {padding: 5px 10px;}
#itemDetail .cartPropertyArea {margin-bottom: 2em;}
#itemDetail .amount_cartBtn_area.noInner,
#itemDetail .amount_cartBtn_area .inner {position: relative; display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 2em;}
#itemDetail .amount_cartBtn_area.noInner + div,
#itemDetail .amount_cartBtn_area .inner + div {margin-bottom: 2em;}
#itemDetail .amount_cartBtn_area fieldset {width: 25%; border: none;}
#itemDetail .amount_cartBtn_area legend {margin-bottom: .5em; font-weight: bold;}
#itemDetail .amount_cartBtn_area fieldset div {position: relative; background-color: rgba(250, 250, 250, 1);}
#itemDetail .amount_cartBtn_area fieldset div::before {content: "\f107"; display: block; position: absolute; right: 1em; top: 50%; font-family: "Font Awesome 5 Free"; font-weight: 900; transform: translateY(-50%);}
#itemDetail .amount_cartBtn_area fieldset div.enable:hover::before {animation: arrow 1s ease-in infinite;}
#itemDetail .amount_cartBtn_area fieldset div.disabled::before {color: rgba(204, 204, 204, 1);}
#itemDetail .amount_cartBtn_area fieldset div::after {content: ""; position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 2px; background-color: rgba(179, 204, 32, 1);}
#itemDetail .amount_cartBtn_area fieldset div.disabled::after {background-color: rgba(204, 204, 204, 1);}
#itemDetail .amount_cartBtn_area select {position: relative; width: 100%; height: 100%; padding: 12px 0 12px 1em; background-color: transparent; border: none; outline: none; cursor: pointer; -webkit-appearance: none; appearance: none;}
#itemDetail .amount_cartBtn_area .button,
#itemDetail .amount_cartBtn_area a {margin: 0; padding: 11px 0; background-color: rgba(191, 0, 0, 1); border-bottom: 3px solid rgba(153, 0, 0, 1); transition: 100ms;}
#itemDetail .amount_cartBtn_area a {display: inline-block; min-width: 230px; padding: 11px 18px; color: rgba(255, 255, 255, 1); text-align: center; line-height: 1; border-radius: 3px;}
#itemDetail .amount_cartBtn_area .button:hover,
#itemDetail .amount_cartBtn_area a:hover {border-bottom: 3px solid rgba(153, 0, 0, 1); opacity: .75; transition: 100ms;}
#itemDetail .amount_cartBtn_area a:hover {text-decoration: none;}
#itemDetail .amount_cartBtn_area div.disabled .button,
#itemDetail .amount_cartBtn_area a.disabled {margin-top: 2px; background-color: rgba(210, 210, 210, 1); border-bottom: 1px solid rgba(165, 165, 165, 1);}
#itemDetail .amount_cartBtn_area a.disabled {color: rgba(165, 165, 165 ,1); pointer-events: none;}
#itemDetail .button {margin-bottom: 10px;}
#itemDetail .auxiliary_button {margin: 2em 0;}
#itemDetail .button.small {max-width: 160px;}
#itemDetail .box .text .teiki_item_box {color: #C00; border: 2px solid #C00; font-size: 90%; margin-bottom: 10px; margin-top: 5px; padding: 2px}
#itemDetail .teiki_item_box_list {color: #C00;border: 2px solid #C00; font-size: 70%; margin-bottom: 10px; margin-top: 5px;padding: 2px}
#itemDetail .purchase_limit {display: none; position: absolute; bottom: -42px; width: auto; margin: 10px 0 0; padding: .5em; font-size: .8rem; background-color: rgba(255, 248, 232, 1); border: none; border-top: solid 1px rgba(255 ,192, 110, 1); border-bottom: solid 3px rgba(255 ,192, 110, 1); opacity: 1; transition: 300ms;}
#itemDetail .purchase_limit::before,
#itemDetail .purchase_limit::after {
  top: -14px; left: 15%!important; border-bottom-color: rgba(255 ,192, 110, 1); transform: none;
}
/* itemDetail - 商品詳細カートに入った報告ポップアップ
-------------------------------------------------------------*/
#itemDetail .cartSubmitButton{position: relative;}
#itemDetail .cartSubmitButton .cartMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemDetail .cartSubmitButton .cartMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemDetail .cartSubmitButton .cartMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemDetail .cartSubmitButton .cartMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemDetail .cartSubmitButton .cartMessage .link{background-color: #fff; text-align: center;}
#itemDetail .cartSubmitButton .cartMessage .link a{display: inline-block;}
#itemDetail .cartSubmitButton .cartMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* itemDetail - 商品詳細お気に入りリストに入った報告ポップアップ
-------------------------------------------------------------*/
#itemDetail .wishlistSubmitButton {position: relative;}
#itemDetail .wishlistSubmitButton .wishlistMessage {display: none; position: absolute; width: 350px; bottom: -135px; left: 50%; padding: 10px; background-color: #fff; border: #ccc 1px solid; z-index: 10; transform: translateX(-50%);}
#itemDetail .wishlistSubmitButton .wishlistMessage .title {text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemDetail .wishlistSubmitButton .wishlistMessage .mainclose {background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemDetail .wishlistSubmitButton .wishlistMessage .link {background-color: #fff; text-align: center;}
#itemDetail .wishlistSubmitButton .wishlistMessage .link a {margin: 0 auto;}
#itemDetail .wishlistSubmitButton .wishlistMessage .close {position: absolute; top: 3px; right: 3px; cursor: pointer;}
#itemDetail .wishlistSubmitButton .wishlistDelMessage {position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemDetail .wishlistSubmitButton .wishlistDelMessage:after {content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemDetail .wishlistSubmitButton .wishlistDelMessage .title {text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemDetail .wishlistSubmitButton .wishlistDelMessage .mainclose {background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemDetail .wishlistSubmitButton .wishlistDelMessage .link {background-color: #fff; text-align: center;}
#itemDetail .wishlistSubmitButton .wishlistDelMessage .close {position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* itemDetail - トピックス詳細
-------------------------------------------------------------*/
#itemDetail .topics_img h3,#itemDetail .topics_noimg h3{margin: 10px 10px 5px 0px; display: block; font-size: 105%;}
#itemDetail .topics_img p,#itemDetail .topics_noimg p{font-size: 90%; margin: 5px 0px 1em;;}
#itemDetail .topics_img img{display: block;}
#itemDetail .topics_img .img_box{width: 140px; height: 140px; margin: 10px 10px 10px 0; text-align: center; position: relative; float: left;}
#itemDetail .topics_img .img_box img{width: auto; max-width: 140px; max-height: 140px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
#itemDetail .topics_img .topics_text{overflow: auto;}
#itemDetail .topics_img,#itemDetail .topics_noimg{padding: 10px;}
#itemDetail .topics_noimg p img{float: right; max-width: 100%; margin: 0 0 10px 10px;}
#itemDetail .topicsDetail table{width: 750px; margin: 0 0 10px;}
#itemDetail td{padding: 5px 10px;}
#itemDetail .topicsDetail .embedImg {float: none; margin: 0 0 1em;}

/* itemDetail - 賞味期限設定
-------------------------------------------------------------*/
#best-before {padding: 15px 20px; background-color: #fcfcfc;}
#itemDetailSupple_wpc #best-before{margin-bottom: 1em;}
#best-before p {margin: 0; padding: 0; font-size: .9rem; line-height: 1.5;}
#best-before ul {padding: 5px 5px 5px .8rem; font-size: .8rem;}
#best-before ul li:not(:last-child) {padding-bottom: 5px;}
#best-before .date {padding: 2px 5px; font-size: 1rem; font-weight: bold;}
#best-before .date.caution {color: #ffa500;}
#best-before .annotation {padding-top: 5px; font-weight: normal !important; color: #333 !important;}
#best-before .annotation .date {font-size: .8rem; background-color: #fff3b0;}
#best-before .note {font-size: .7rem;}

/* itemDetail - swiper設定
-------------------------------------------------------------*/
#itemDetail .gallery-top {margin-bottom: 10px; height: 50vw; max-height: 600px; min-height: 500px;}
#itemDetail .gallery-top .swiper-slide {display: flex; align-items: flex-start; justify-content: center;}
#itemDetail .swiper-slide img {max-width: 100%; vertical-align: middle;}
#itemDetail .gallery-top .swiper-slide img {align-self: center;}
#itemDetail .swiper-pagination-progressbar {background-color: transparent;}
#itemDetail .gallery-thumbs .swiper-slide {border: 1px solid rgba(0, 0, 0, 0); transition: .5s;}
#itemDetail .gallery-thumbs .swiper-slide-thumb-active {border-color: rgba(0, 0, 0, 1); transition: .5s;}
#itemDetail .swiper-button-next:after,
#itemDetail .swiper-button-prev:after {text-shadow: 3px 2px 2px rgba(255, 255, 255, .8);}

/* itemDetail - バリエーション選択
-------------------------------------------------------------*/
#itemDetail .vari_select_area fieldset {margin-bottom: 2em; border: none;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) ul::after,
#itemDetail .vari_select_area li.selector:last-of-type::after {content: ""; position: absolute; bottom: -2px; left: 0; display: block; width: 100%; height: 2px; background-color: rgba(179, 204, 32, 1);}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) ul > span.activeElem_bg {content: ""; position: absolute; top: 6px; left: 19px; display: block; height: 31px; background-color: rgba(179, 204, 32, .1); border-radius: 15px 5px 5px 15px; z-index: 1; transition: left 300ms ease;}
#itemDetail .vari_select_area fieldset.salesForm ul > span.activeElem_bg {width: 103px;}
#itemDetail .vari_select_area fieldset.salesForm ul > li:nth-of-type(2).checked + span.activeElem_bg {left: 124px; transition: left 300ms ease;}
#itemDetail .vari_select_area fieldset.salesForm .teikiActive {margin: 10px 0 0; padding: 1em; font-size: .8rem; background-color: rgba(255, 248, 232, 1); border: none; border-top: solid 1px rgba(255 ,192, 110, 1); border-bottom: solid 3px rgba(255 ,192, 110, 1); opacity: 1; transition: 300ms;}
#itemDetail .vari_select_area fieldset.salesForm .teikiActive.hide {height: 0; margin-top: -30px; opacity: 0; overflow: hidden; visibility: hidden; transition: 300ms;}
#itemDetail .vari_select_area fieldset.salesForm .teikiActive::before,
#itemDetail .vari_select_area fieldset.salesForm .teikiActive::after {top: -14px; left: 28%; border-bottom-color: rgba(255 ,192, 110, 1); transform: none;}
#itemDetail .vari_select_area fieldset.optionSelect {opacity: 1; transition: 300ms;}
#itemDetail .vari_select_area fieldset.optionSelect.hidden {display: inherit!important; margin-top: -108px; opacity: 0; transition: 300ms;}
#itemDetail .vari_select_area fieldset.optionSelect ul > span.activeElem_bg {width: 133px;}
#itemDetail .vari_select_area fieldset.optionSelect ul > li:nth-of-type(2).checked + span.activeElem_bg {left: 154px; transition: left 300ms ease;}
#itemDetail .vari_select_area input[type="radio"] {display: none;}
#itemDetail .vari_select_area legend {margin-bottom: .5em; font-weight: bold;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) ul {display: flex; position: relative; padding: 10px 0 10px 1.5em; background-color: rgba(253, 253, 253, 1);}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) ul li:not(:last-of-type) {margin-right: 1em;}
#itemDetail .vari_select_area .flavor_select {position: relative; z-index: 5;}
#itemDetail .vari_select_area .flavor_select::before,
#itemDetail .vari_select_area .flavor_select::after {content: ""; display: block; position: absolute; top: 50%;  width: .45em; height: 2px; background-color: rgba(21, 21, 21, 1); border-radius: 5px; transform: translateY(-50%); z-index: 999; transition: transform 300ms;}
#itemDetail .vari_select_area .flavor_select::before {transform: rotate(45deg); right: 1.25em;}
#itemDetail .vari_select_area .flavor_select::after {transform: rotate(-45deg); right: 1em;}
#itemDetail .vari_select_area .flavor_select.open::before {transform: rotate(-45deg); right: 1.25em; transition: transform 300ms;}
#itemDetail .vari_select_area .flavor_select.open::after {transform: rotate(45deg); right: 1em; transition: transform 300ms;}
#itemDetail .vari_select_area .flavor_select:not(.open):hover::before,
#itemDetail .vari_select_area .flavor_select:not(.open):hover::after {animation: arrow 1s ease-in infinite;}
#itemDetail .vari_select_area .flavor_select > li {position: absolute; top: 0; left: 0; width: 100%; z-index: 10; transition: .5s;}
#itemDetail .vari_select_area li.selector.checked {z-index: 100;}
#itemDetail .vari_select_area .flavor_select > li:not(.selector_opener) {background-color: rgba(253, 253, 253	, 1);}
#itemDetail .vari_select_area li.selector_opener {height: 100%; cursor: pointer; z-index: 1000;}
#itemDetail .vari_select_area li.selector:last-of-type::after {content: ""; position: absolute; bottom: -2px; left: 0; display: block; width: 100%; height: 2px; background-color: rgb(179, 204, 32, 1);}
#itemDetail .vari_select_area .flavor_select .btn {height: 100%;}
#itemDetail .vari_select_area label {cursor: pointer;}
#itemDetail .vari_select_area .flavor_select label {display: block; padding: 10px 0 10px 1.5em; z-index: 5;}
#itemDetail .vari_select_area .flavor_select > li.selector label::after {content: ""; display: block; position: absolute; top: 0;
  left: 0; width: 0; height: 44px; background-color: rgba(250, 250, 250, 1); transition: width 300ms; z-index: -1;}
#itemDetail .vari_select_area .flavor_select > li.checked label::after {width: 100%; background-color: rgba(253, 253, 253, 1); transition: background-color 300ms;}
#itemDetail .vari_select_area .flavor_select > li.selector:hover label::after {width: 100%; transition: width 300ms;}
#itemDetail .vari_select_area .flavor_select.open > li.checked  label::after {background-color: rgba(179, 204, 32, .1); transition: background-color 300ms;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) li {z-index: 2;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"] + label .check {position: relative; display: inline-block; width: 1.3em; height: 1.3em; margin-right: .3em; margin-bottom: 2px; vertical-align: middle; border: 2px solid rgba(230, 230, 230, 1); border-radius: 1.3em; transform-origin: 0% 0%; transition: border-color 300ms;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"]:checked + label .check {border-color: rgba(179, 204, 32, 1); transition: border-color 300ms;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"] + label .check::before,
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"] + label .check::after {content: ""; position: absolute; height: 2px; background-color: rgba(230, 230, 230, 1); border-radius: 1px; transition: background-color 300ms 150ms;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"]:checked + label .check::before,
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"]:checked + label .check::after {content: ""; position: absolute; height: 2px; background-color: rgba(179, 204, 32, 1); border-radius: 1px; transition: background-color 300ms 150ms;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"] + label .check::before {width: 0; top: 9px; left: 3px; transform: rotate(45deg); transition: width 50ms ease 50ms;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"] + label .check::after {width: 0; top: 8px; left: 5px; transform: rotate(-45deg); transition: width 50ms ease;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"] + label:hover .check::before,
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"]:checked + label .check::before {width: 5px; transition: width 100ms ease;}
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"] + label:hover .check::after,
#itemDetail .vari_select_area fieldset:not(.flavorSelectForm) input[type="radio"]:checked + label .check::after {width: 9px; transition: width 100ms ease 100ms;}
@keyframes arrow {0% {top: 40%;} 100% {top: 60%;}}

/* reccomend - こんな商品も買っていますエリア
-------------------------------------------------------------*/
.itemDetail #itemListDetail .img_box {width: 120px; height: 120px; margin: 10px; float: left; text-align: center; position: relative;}
.itemDetail #itemListDetail .img_box img {width: auto; max-width: 120px; max-height: 120px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
.itemDetail #itemListDetail .box > div {display: inherit;}
.itemDetail #itemListDetail .text {margin-left: 140px;}
.itemDetail #itemListDetail h3 {display: block; margin: 0px 10px 10px 0; font-size: 95%;}
.itemDetail #itemListDetail .appeal {display: block; margin: 0; color: #f60;  font-size: 70%;}
.itemDetail #itemListDetail .price {margin-bottom: 10px; color: #C00; font-size: 110%; font-weight: bold; text-align: right;}
.itemDetail #itemListDetail .button_area {display: inherit; margin: 0px 10px 20px 0px; padding-top: 20px; border-top: #CCC 1px solid; text-align: right;}
.itemDetail #itemListDetail .button_area .button{width: auto; display: inline-block;}
.itemDetail #itemListDetail .button_area .small{padding: 6px 10px;}
.itemDetail #itemListDetail .button_area .property{float: right; margin: 0; color: #AAA; font-size: 75%; padding: 3px;}

/* SNSボタン
-------------------------------------------------------------*/
.sherebutton .snsbtn10{display:-webkit-flex;display:flex;margin:0 0 1em 0;}
.sherebutton .snsbtn10 a{display:block; padding:1em; line-height:1; color:#fff; font-family:'Montserrat'; text-align:center; text-transform: uppercase; transition:0.3s; flex:1 1; border-radius: 10px; text-decoration: none; width:155px}
.sherebutton .snsbtn10 a:not(:last-child) {	margin-right: 5px; }
.sherebutton .snsbtn10 a:hover{box-shadow:0px 0px 8px rgba(0,0,0,0.2);}
.sherebutton .snsbtn10 .btn-fb{background:#465f8c;}
.sherebutton .snsbtn10 .btn-fb img{margin-right: 5px;}
.sherebutton .snsbtn10 .btn-tw{background:#3998d4;}
.sherebutton .snsbtn10 .btn-tw img{margin-right: 5px;}
.sherebutton .snsbtn10 .btn-li{background:#38ba38;}
.sherebutton .snsbtn10 .btn-li img{margin-right: 5px;}
.sherebutton .snsbtn10 .btn-fb:hover{background:#4267B2;}
.sherebutton .snsbtn10 .btn-tw:hover{background:#31A3EA;}
.sherebutton .snsbtn10 .btn-li:hover{background:#00B900;}
.sherebutton .snsbtn10 a i{margin:0 0.15em 0 0;}
.sherebutton .snsbtn11 {display: flex; justify-content: space-between; font-family: 'Lato', sans-serif;}
.sherebutton .snsbtn11 > li {position: relative; width: 25%;}
.sherebutton .snsbtn11 > li > a,
.sherebutton .snsbtn11 > li span a {position: relative; display: block; padding: 13px 0; color: rgba(21, 21, 21, 1); text-align: center;}
.sherebutton .snsbtn11 > li > a::after,
.sherebutton .snsbtn11 > li span a::after {content: ""; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 3px; background-color: rgba(201, 201, 201, 1); z-index: -1; transition: 300ms;}
.sherebutton .snsbtn11 > li > a:hover,
.sherebutton .snsbtn11 > li span a:hover {color: rgba(255, 255, 255, 1); text-decoration: none;}
.sherebutton .snsbtn11 > li > a:hover::after,
.sherebutton .snsbtn11 > li span a:hover::after {height: 100%; transition: 300ms;}
.sherebutton .snsbtn11 > .wishlistSubmitButton span a {padding: 13px 0; font-size: .9rem; font-weight: bold;}
.sherebutton .snsbtn11 > .wishlistSubmitButton span a::after {background-color: rgba(255, 26, 111, 1);}
.sherebutton .snsbtn11 > .facebook a {color: rgba(24, 119, 242, 1);}
.sherebutton .snsbtn11 > .facebook a::after {background-color: rgba(24, 119, 242, 1);}
.sherebutton .snsbtn11 > .twitter a {color: rgba(29, 161, 243, 1);}
.sherebutton .snsbtn11 > .twitter a::after {background-color: rgba(29, 161, 243, 1);}
.sherebutton .snsbtn11 > .line a {color: rgba(2, 184, 2, 1);}
.sherebutton .snsbtn11 > .line a::after {background-color: rgba(2, 184, 2, 1);}
.sherebutton .snsbtn11 > li i {color: rgba(201, 201, 201, 1); margin-right: .2em; font-size: 1.5rem; vertical-align: bottom;}
.sherebutton .snsbtn11 > li a:hover i {color: rgba(255, 255, 255, 1);}
.sherebutton .snsbtn11 > .wishlistSubmitButton i {vertical-align: sub;}
.sherebutton .snsbtn11 > li .registed i {color: rgba(255, 26, 111, 1);}
.sherebutton .snsbtn11 > .facebook i {color: rgba(24, 119, 242, 1);}
.sherebutton .snsbtn11 > .twitter i {color: rgba(29, 161, 243, 1);}
.sherebutton .snsbtn11 > .line i {color: rgba(2, 184, 2, 1);}
.sherebutton .snsbtn11 > li.wishlistSubmitButton .registNum {position: absolute; bottom: -40px; left: 50%; display: block; padding: 3px 1em 2px; background-color: rgba(255, 255, 255, 1); border: 1px solid rgba(201, 201, 201, 1); border-radius: 3px; transform: translateX(-50%);}

/* present_detail.xhtml - プレゼント詳細
-------------------------------------------------------------*/
#itemDetail.present .item_image_area #targetarea{visibility: visible;}
#itemDetail.present .item_image_area .img_box{display:block; width: 268px; height: 268px;}
.novelty,.seibun,.img_center { text-align:center; }
.video{text-align:center; margin:15px;}

/* =================================================================
12.レビュー
使用ファイル：item_detail.xhtml, member_review.xhtml
=================================================================*/
#review{margin-bottom: 40px;}
#review p{margin: 0 0px;}
#review p.item_name{font-size: 95%; font-weight: bold;}
#review h3{float: left; margin: 0 10px 0 0; font-size: 80%;}
#review .review_box{margin-bottom: 20px;}
#review .box{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 .button{margin-left: 5px; vertical-align: middle; display: inline-block; width: auto;}
#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; padding-top: 40px;}
#review ul.star{float: left;}
#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{margin-top: 10px; padding: 10px 10px 10px 10px; background: #F1F1F1;}
#review .contribution #error{background: #F1F1F1;}

#review .contribution table{margin: 0; border: none;}
#review .contribution th{width: 140px; 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:0 0 10px 0; padding:0px; font-size: 120%;}

#review .review-image{padding-top: 20px;}
#review .review-image:after {content: ""; clear: both; display: block;}/* clearfix */
#review .review-image .img_box{width: 80px; height: 80px; margin-right: 10px; margin-bottom: 10px; text-align: center; position: relative; float: left;}
#review .review-image img{width: auto; max-width: 80px; max-height: 80px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}


/* =================================================================
13.購入履歴
使用ファイル：member_history.xhtml
=================================================================*/
#history .pageFnc{display: inherit; text-align: center;}
#history .pagelink{margin: 20px 0; padding: 0;}
#history .funcLink{display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 10px;}
#history .funcLink::after{content: ""; display: block; flex-basis: 32%;}
#history .funcLink li{flex-basis: 32%;}
#history .funcLink a{display: block; padding: 15px 0; border: 1px solid #eee; color: #333; font-size: .8rem; border-radius: 5px; transition: .3s;}
#history .funcLink a:hover{text-decoration: none; background-color: #fefefe; border-color: #ccc; transition: .3s;}

#history .infoarea{display: block; margin: 40px 0 0; font-size: 80%; font-weight: bold;}
#history .infoarea:after {content: ""; clear: both; display: block;}/* clearfix */
#history .infoarea .status_icon{color: #FFFFFF; float: left; font-weight: normal; margin-right: 10px;}
#history .cancel{float: right; margin-left: 10px;}
#history .payment_change{float: right; margin-left: 10px;}
#history .infoarea .date{clear: both; padding-top: 3px;}

#history .preparing .status_icon{background: #336600; padding: 3px 5px;}/* 手配中 */
#history .delivered .status_icon{background: #ff9900; padding: 3px 5px;}/* 配送中 */
#history .delivering .status_icon{background: #000066; padding: 3px 5px;}/* 配送済 */
#history .canceled .status_icon{background: #cc0000; padding: 3px 5px;}/* 取消済 */
#history .yoyaku .status_icon{background: #000000; padding: 3px 5px;}/* 予約済 */
#history .teiki_together .status_icon{background: #996633; padding: 3px 5px;}/* 定期にまとめて */

#history table{margin: 20px 0 0;}
#history .price{color: #C00; text-align: right;}
#history .cart{width: 230px; text-align: center;}
#history .cart .button{margin-bottom: 10px; width: auto; display: inline-block;}
#history .cart .delivery_slip{margin-bottom: 0px;}
#history .code{width: 80px;}
#history .amount{width: 30px; text-align: center;}

#history .property{display: block; color: #AAA; font-size: 90%;}

#history .img_box{width: 80px; height: 80px; margin-right: 10px; margin-bottom: 10px; text-align: center; position: relative; float: left;}
#history .img_box img{width: auto; max-width: 80px; max-height: 80px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}

/* member_history - 商品カートに入った報告ポップアップ
-------------------------------------------------------------*/
#history .cartSubmitButton{position: relative;}
#history .cartSubmitButton .cartMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#history .cartSubmitButton .cartMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#history .cartSubmitButton .cartMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#history .cartSubmitButton .cartMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#history .cartSubmitButton .cartMessage .link{background-color: #fff; text-align: center;}
#history .cartSubmitButton .cartMessage .link a{display: inline-block;}
#history .cartSubmitButton .cartMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* ===================================================================
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: 500px; margin: auto;}
#subwindow #header{background: none;}
#subwindow #header h1 a{float: none;}
#subwindow #content h2{margin-bottom: 20px; font-weight: normal;border-bottom: solid 3px #cccccc; position: relative; z-index:1}
#subwindow #content h2:after{position: absolute; content: " "; display: block; border-bottom: solid 3px #373737; bottom: -3px; width: 20%; z-index:1}
#subwindow #content table{font-size: 80%;line-height: 160%;margin: 10px 0px;width: 100%;border: 1px solid #CCCCCC;}
#subwindow #content th{padding: 10px; border: 1px solid #CCC; background: #F6F6F6; vertical-align: top; font-weight: normal; text-align: left;}
#subwindow #content th.zaiko{width: auto;text-align: center;}
#subwindow #content td{padding: 10px; border: 1px solid #CCC; vertical-align: top;}
#subwindow #content td.number{text-align: right;}
#subwindow #content .hissu{color: #CC0000;font-weight: bold;}
#subwindow #content .close{margin: 10px 0; font-size: 80%; line-height: 150%; text-align: right;}
#subwindow .buttonarea{text-align: center; margin: 10px; padding-top: 40px;}
#subwindow .buttonarea .button{display: inline-block; margin: 0 10px;}

#subwindow #content #products{width: 500px; position: relative;}
#subwindow #content #products .slides_container{overflow: hidden; position: relative; border: 1px solid #ccc; margin: 10px 0 0 0;}
#subwindow #content #products .slides_container .ima_box{width: 498px; height: 498px; position: relative; text-align: center;}
#subwindow #content #products .slides_container img{width: auto; margin: auto; max-width: 498px; max-height: 498px; display: block; position: absolute; bottom: 0; left: 0; right: 0; top: 0;}
#subwindow #content #products .slides_container a{width: 400px; height: 400px; display: block;}
#subwindow #content #products .thumbox{clear: both; margin: 15px 0 0; padding: 0;}
#subwindow #content #products .thumbox:after {content: ""; clear: both; display: block;}/* clearfix */
#subwindow #content #products .thumbox .pagination li{margin: 0 10px 10px 0; float: left;}
#subwindow #content #products .thumbox .pagination li.last{margin-right: 0;}
#subwindow #content #products .thumbox .img_box{border: 1px solid #ccc; width: 92px; height: 92px; display: block;}
#subwindow #content #products .thumbox .img_box img{max-width: 90px; max-height: 90px;}
#subwindow #content #products .thumbox .img_box img:hover{filter: alpha(opacity=60); -moz-opacity: .6; -khtml-opacity: .6; opacity: .6;}
#subwindow #content #products .thumbox .current .img_box{border: 1px solid #cc3333; display: block; filter: alpha(opacity=100) !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important;}
#subwindow #content #products .thumbox .current .img_box img:hover{cursor: default; filter: alpha(opacity=100) !important; -moz-opacity: 1 !important; -khtml-opacity: 1 !important; opacity: 1 !important;}
#subwindow #content #products .prev{display: block; background: url(../images/detail_prev_button.png) no-repeat; text-indent: -9999px; width: 60px; height: 60px; top: 35%; left: -26px; position: absolute; z-index: 1000;}
#subwindow #content #products .next{display: block; background: url(../images/detail_next_button.png) no-repeat; text-indent: -9999px; width: 60px; height: 60px; top: 35%; right: -26px; position: absolute; z-index: 1000;}
#subwindow #content #products .arrowOn:hover .prev, #subwindow #content #products .arrowOn:hover .next{display: block;}
#subwindow #content #products .arrowOn:hover .prev:hover, #subwindow #content #products .arrowOn:hover .next:hover{filter: alpha(opacity=80); -moz-opacity: .8; -khtml-opacity: .8; opacity: .8;}


/* =================================================================
15.エラーページ
使用ファイル：common/messages.xhtml
　　　　　　　ext/social_provider.xhtml
=================================================================*/
#error{width: 100%; padding: 10px 0px;}
#error table{margin: 0px 0 10px; border: none !important; font-size: 85%;}
#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%; float: none;}
#error .buttonarea{margin: 10px; padding-top: 40px; text-align: center;}
#error ul{background: none;}
#error li{float: none; font-size: 100%; border: 0px; padding: 0px; margin-right: 0px; margin-bottom: 0px; width: auto; line-height: 150%;}

/* 2019年カート大改修 */
.new #error {padding: 0; font-family: "Font Awesome 5 Free";}
.new #error .errorbox,
.new #error th, .new #error td {margin: 0; padding: 0; border: none;}
.new #error table[summary="エラー"],
.new #error table .ico {vertical-align: middle;}
.new #error table {width: 100%; margin-bottom: 10px!important;}
.new #error table .ico {display: none;}
.new #error table td {position: relative; width: 100%; padding: 25px 25px 25px 55px!important; text-align: left;}
.new #error table.default .content {color: rgba(21, 21, 21, 1);}
.new #error table[summary="エラー"], .new #error table[summary="警告"] {background-color: rgba(255, 0, 0, 0.1);}
.new #error table[summary="情報"], .new #error table[summary="メッセージ"] {background-color: rgba(233, 245, 255, 1);}
.new #error table[summary="情報"] .content,
.new #error table[summary="メッセージ"] .content {color: rgba(37, 120, 151, 1);}
.new #error table .content::before {content: "\f06a"; position: absolute; top: 50%; left: 20px; color: rgba(37, 120, 151, 0.2); font-size: 3vw; transform: translateY(-50%);}
.new #error table[summary="エラー"] .content::before {content: "\f071"; color: rgba(205, 0, 0, 0.2);}
.new #error table[summary="警告"] .content::before {content: "\f05e"; color: rgba(205, 0, 0, 0.2);}
.new #error table[summary="情報"] .content::before {content: "\f05a"; color: rgba(37, 120, 151, 0.2);}

/*  social_provider.xhtmlのエラー部分
-------------------------------------------------------------*/
#social_plus_error{width: 100%; padding: 10px 0px;}
#social_plus_error table{margin: 0px 0 10px; border: none !important; font-size: 85%;}
#social_plus_error td{padding: 10px; border: none !important;}
#social_plus_error .ico{width: 40px; vertical-align: top; text-align: center;}
#social_plus_error .content{padding: 5px; color: #C00; font-weight: bold; vertical-align: middle; line-height: 150%; float: none;}
#social_plus_error .buttonarea{margin: 10px; padding-top: 10px; border-top: #CCC 1px dashed; text-align: center;}
#social_plus_error ul{background: none;}
#social_plus_error li{float: none; font-size: 100%; border: 0px; padding: 0px; margin-right: 0px; margin-bottom: 0px; width: auto; line-height: 150%;}


/* =================================================================
16.クレジットカード登録画面
使用ファイル：member_credit_entry_input.xhtml
=================================================================*/
#credit td.button_area{text-align: center;}
#credit td.button_area .button{display: inline-block; width: auto;}
#credit .can_regist{padding-top: 30px;}
#credit .error{clear: both; margin: 5px 10px; color: #C00; font-weight: bold; text-align: center; font-size: 80%;}


/* =================================================================
17.お気に入り
使用ファイル：wishlist.xhtml
　　　　　　　wishlist_edit.xhtml
=================================================================*/
#wishList{margin-bottom: 20px;}
#wishList .box{margin-top: 10px; border: #CCC 1px solid;}
#wishList .box:hover{border: #8CC329 1px solid;}
#wishList .box:after {content: ""; clear: both; display: block;}/* clearfix */
#wishList .provisional{margin: 0px;}
#wishList .text{margin-left: 140px;}
#wishList h3{display: block; margin: 10px 10px 0 0; font-size: 95%;}
#wishList .appeal{display: block; margin: 0; color: #F60; font-size: 70%;}
#wishList .price{display: block; margin: 0; color: #C00;}
#wishList .price .teika{font-weight: bold; font-size: 110%;}
#wishList .price .other{font-size: 90%;}
#wishList .explanation1{display: block; margin: 5px 10px 0 0; padding: 10px 0px; border-top: #CCC 1px solid; font-size: 80%; line-height: 120%;}
#wishList .explanation1 h4{margin-bottom: 10px;}
#wishList .explanation1 h4 a{display: inline-block; width: auto; font-weight: normal;}
#wishList .explanation1 p{margin: 0px;}
#wishList .button_area{margin: 0px 10px 20px 0px; padding-top: 20px; border-top: #CCC 1px solid; text-align: right;}
#wishList .button_area:after {content: ""; clear: both; display: block;}/* clearfix */
#wishList .button_area .button{width: auto; display: inline-block;}
#wishList .property{display: inline; margin: 0; color: #AAA; font-size: 75%;}

#wishList .img_box{width: 120px; height: 120px; margin: 10px; float: left; text-align: center; position: relative;}
#wishList .img_box img{width: auto; max-width: 120px; max-height: 120px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}

/* wishList - 商品カートに入った報告ポップアップ
-------------------------------------------------------------*/
#wishList .cartSubmitButton{position: relative;}
#wishList .cartSubmitButton .cartMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#wishList .cartSubmitButton .cartMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#wishList .cartSubmitButton .cartMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#wishList .cartSubmitButton .cartMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#wishList .cartSubmitButton .cartMessage .link{background-color: #fff; text-align: center;}
#wishList .cartSubmitButton .cartMessage .link a{display: inline-block;}
#wishList .cartSubmitButton .cartMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* =================================================================
18.アドレス帳
使用ファイル：address_add.xhtml
　　　　　　　address_input.xhtml
=================================================================*/
#addressList{padding-bottom: 20px;}
#addressList h3{margin-bottom: 15px; padding: 1px 0px 0px 20px; border-bottom: 1px solid #CCC; background: url("../images/marker.gif") 7px 7px no-repeat; font-size: 85%; margin-top: 30px;}
#addressList ul{padding: 20px 0 10px;}
#addressList ul:after {content: ""; clear: both; display: block;}/* clearfix */
#addressList li{float: left; font-size: 80%; border: 1px solid #CCC; padding: 10px 10px 40px 10px; margin-right: 10px; margin-bottom: 10px; width: 348px; line-height: 180%; position: relative;}
#addressList li strong{font-size: 18px;}
#addressList li .button_area{margin: 0px 0px 0; position: absolute; bottom: 10px;}
#addressList li .button_area .button{width: auto; display: inline-block;}
#addressList .widebox li{width: 453px;}
#addressList .pageguide{float: left; width: 500px; font-size: 75%;}
#addressList .rearrange{float: left; width: 200px; font-size: 75%; text-align: right;}
#addressList .pagelink{clear: both; font-size: 75%;}
#addressList .nolink{color: #999;}


/* =================================================================
19.会員関係
使用ファイル：member_mypage.xhtml member_input.xhtml
=================================================================*/
#member_input .change_data .button {width: 20%;	padding: 7px 10px; border: 1px solid #60ac31;}
#member_input .change_data .button:hover {color: #fff; background-color: #60ac31;}
#main #member_input .annotation {color: #333;	font-weight: normal;}
#member.mypage h3{margin: 10px 0 10px 10px;}
#member.mypage h3 a{ float: right; width: auto;}
#member.mypage ul{margin: 0 0 50px 10px;}
#member.mypage ul:after {content: ""; clear: both; display: block;}/* clearfix */
#member.mypage ul li{float: left; width: 253px; padding: 0 0 10px;}
#member.mypage ul li h4{font-size: 16px; background: #F6F6F6; font-weight: normal; padding: 6px 10px; margin: 0 0px 15px 0;}
#member.mypage ul li .box{border: 1px solid #CCCCCC; margin-right: 10px; padding: 0px 0px 10px;}
#member.mypage ul li p{font-size: 12px;}
#member.mypage ul li a{font-size: 12px;}

#member.mypage #social_plus tr th{background: #FFF;}
#member.mypage #social_plus tr th a{text-decoration: none;}
#member.mypage #social_plus tr.title th{background: #F6F6F6;}
#member.mypage #social_plus th.service{width: 220px;}
#member.mypage #social_plus th div{width: 220px; height: 44px; font-size: 14px; display: block;}
#member.mypage #social_plus th div p{padding: 14px 0 14px 25px; border: 1px solid #cdcdcd; border-left: 0px; margin: 0 0 0 53px; display: block; background: #FFF; line-height: 1; font-size: 14px;
-webkit-border-top-right-radius: 3px;
-webkit-border-bottom-right-radius: 3px;  
-moz-border-radius-topright: 3px;  
-moz-border-radius-bottomright: 3px;
}

/*#member.mypage #social_plus th{width: 100px;}*/
#member.mypage #social_plus th.yahoo div{background: url("../images/social_yahoo.png") no-repeat; color: #e71017;}
#member.mypage #social_plus th.facebook div{background: url("../images/social_facebook.png") no-repeat; color: #3b5998;}
#member.mypage #social_plus th.twitter div{background: url("../images/social_twitter.png") no-repeat; color: #55acee;}
#member.mypage #social_plus th.google div{background: url("../images/social_google.png") no-repeat; color: #dc4e41;}
#member.mypage #social_plus th.mixi div{background: url("../images/social_mixi.png") no-repeat; color: #d1ad59;}
#member.mypage #social_plus th.rakuten div{background: url("../images/social_rakuten.png") no-repeat; color: #bf0000;}
#member.mypage #social_plus th.line div{background: url("../images/social_line.png") no-repeat; color: #00b300;}
#member.mypage #social_plus th.paypal div{background: url("../images/social_paypal.png") no-repeat; color: #293e7f;}

#member.mypage #social_plus th.yahoo div.off{background: url("../images/social_yahoo_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus th.facebook div.off{background: url("../images/social_facebook_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus th.twitter div.off{background: url("../images/social_twitter_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus th.google div.off{background: url("../images/social_google_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus th.mixi div.off{background: url("../images/social_mixi_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus th.rakuten div.off{background: url("../images/social_rakuten_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus th.line div.off{background: url("../images/social_line_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus th.paypal div.off{background: url("../images/social_paypal_off.png") no-repeat; color: #cdcdcd;}
#member.mypage #social_plus td{vertical-align: middle;}

/*お友達紹介バナー*/
#main #introduction,
#main #introduction_txt {margin-bottom: 20px;}
#main #introduction p {margin-bottom: 1em;}
#main #introduction > div {position: relative; margin-bottom: 35px;}
#main #introduction img {vertical-align: middle;}
#main #introduction .btn {position: absolute;	right: 0;	bottom: 2px; margin: 0;}
#main #introduction .btn a {display: block; padding: 8px 40px; color: rgb(255, 255, 255);	font-size: 1rem; font-weight: bold;	background-color: rgb(0, 150, 255);	border-radius: 5px;	transition: .5s;}
#main #introduction .btn a:hover {text-decoration: none; opacity: 0.8; transition: .5s;}
#main #introduction .caution {margin: -1.3em 0 1.5em; font-size: 0.7rem;}

/* 2019年カート大改修 */
.new.inputFlow #main:not(.cart_login):not(.login) table {width: 100%; margin: 0;}
.new.inputFlow #main.member_input {margin-top: 20px;}
.new.inputFlow #main.member_input p {margin: 0;}
.new.inputFlow #main table tr:not(.zipCode) .badge {margin-left: .5rem; margin-right: 0;}
.new.inputFlow #main table tr .badge {position: absolute; top: 50%; right: 11px; padding: 6.5px 10px; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.new.inputFlow #main table tr.zipCode .badge,
.new.inputFlow #main table tr:not(.zipCode) .badge.optional {margin-right: 0;}
.new.inputFlow:not(#cart_login) #main table:not(.inCart):not(.novelty_box) th {width: 215px; vertical-align: middle;}
.new.inputFlow:not(#cart_login) #main table:not(.inCart):not(.novelty_box) th > div {position: relative;}
.new.inputFlow:not(#cart_login) #main table:not(.inCart):not(.novelty_box) td table.newCreditCard th {width: 150px;}
.new.inputFlow:not(#cart_login) #main table:not(.inCart):not(.novelty_box) td table.newCreditCard td {width: 363px;}
.new.inputFlow #main table .address th {width: 200px;}
.new.inputFlow #main table .address th.midashi {width: 80px;}
.new.inputFlow #main input[type="text"],
.new.inputFlow #main input[type="email"],
.new.inputFlow #main select,
.new.inputFlow #main input[type="password"],
.new.inputFlow #main input[type="tel"],
.new.inputFlow #main input[type="number"] {border-radius: 3px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
	box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);}
.new.inputFlow #main input[name="CREDIT_NAME"] {width: 20em;}
.new.inputFlow #main input[name="CREDIT_NO1"],
.new.inputFlow #main input[name="CREDIT_NO2"],
.new.inputFlow #main input[name="CREDIT_NO3"],
.new.inputFlow #main input[name="CREDIT_NO4"] {width: 5em;}
.new.inputFlow #main input[name="SECURITY_CD"] {width: 5em;}
.new.inputFlow #main input[name="POINT_USE"] {margin-right: 5px;}
.new.inputFlow #main select {border-color: #ccc;}
.new.inputFlow #main table .name input {width: 10.5em;}
.new.inputFlow #main table .mailConfirmChk input {width: 13em;}
.new.inputFlow #main table .nickName input,
.new.inputFlow #main table .mail input,
.new.inputFlow #main table #PC_MAIL_CONFIRM,
.new.inputFlow #main table .loginIdChk input,
.new.inputFlow #main table .pwd input,
.new.inputFlow #main table .pwdConfirm input,
.new.inputFlow #main table input#ADDR2,
.new.inputFlow #main table input#ADDR3 {width: 29.5em;}
.new.inputFlow #main table .mailConfirmChk input[type="text"]:last-of-type {width: 15em; margin-left: .2rem;}
.new.inputFlow #main table .genderChk input:last-of-type,
.new.inputFlow #main table .birthdayChk input:not(:first-of-type),
.new.inputFlow #main table .mailMagazine td > span:not(:first-of-type) input[name="REALSTYLE:MAILMAGAZINE"] {margin-left: 1em;}
.new.inputFlow #main table .birthdayChk input {width: 5em;}
.new.inputFlow #main table .birthdayChk input:first-of-type {width: 6em;}
.new.inputFlow #main table .zipCodeChk input#ZIP {width: 7.5em;}
.new.inputFlow #main table .zipCodeChk input.btn {margin-left: 5px; padding: 4px 12px; border: 1px solid #ccc; border-radius: 4px; transition: .3s;}
.new.inputFlow #main table .zipCodeChk input.btn:hover {background-color: #ddd; transition: .3s;}
.new.inputFlow #main table .zipCodeChk input#ADDR1 {width: 5em;}
.new.inputFlow #main table td > label {display: block; margin: 0 -10px -10px; padding: 5px 1em; color: rgba(220, 0, 0, 1); background-color: rgba(255, 0, 0, 0.1);}
.new.inputFlow #main table td > label#PC_MAIL-error,
.new.inputFlow #main table td > label#PASSWORD-error {margin-top: -.5em; margin-bottom: 10px;}
.new.inputFlow #main table .name div label:not(:first-child) {margin-left: 1em;}
.new.inputFlow #main table .name .username label,
.new.inputFlow #main table .name .send_username label {margin-left: 1rem;}
.new.inputFlow #main table .name .username label:nth-of-type(2),
.new.inputFlow #main table .name .send_username label:nth-of-type(2) {margin-left: 2em;}
.new.inputFlow #main table .birthdayChk label:not(:first-of-type) {margin-left: .2em;}
.new.inputFlow #main table .mail,
.new.inputFlow #main table .pwd {margin-bottom: .5em;}
.new.inputFlow #main table .pwdConfirm {line-height: 200%;}

.new.inputFlow #main table #mobile {margin: 0 -10px -10px; padding: 10px 13px 10px; background-color: rgba(255, 250, 210, 1); background-image: url("../../userweb/images/caption/notice.png"); background-position: left top; background-repeat: no-repeat;}
.new#member_input #main table #mobile {margin-top: 10px;}
.new.inputFlow #main table #mobile:nth-child(2) {margin-top: 20px;}
.new.inputFlow #main table #mobile:nth-child(3) {margin-top: 10px;}
.new.inputFlow #main table #mobile h3 {margin-bottom: 10px;}
.new.inputFlow #main table #mobile p {margin-bottom: .5rem;}
.new.inputFlow #main table #mobile ul {margin-top: 1rem;}

.new.inputFlow #main.confirm .caution {position: relative; margin: 5px 0 0; padding: 8px 0 6px 32px; color: rgba(0, 0, 0, 1); font-family: "Font Awesome 5 Free"; font-size: .8em; font-weight: normal; z-index: 2}
.new.inputFlow #main.cart_confirm .caution::before,
.new.inputFlow #main.cart_confirm .caution::after {left: 15%;}
.new.inputFlow #main.member_confirm .caution::before,
.new.inputFlow #main.member_confirm .caution::after {left: 10%;}
.new.inputFlow #main.confirm .caution span::before {content: "\f071"; position: absolute; left: 5px; top: 50%; font-size: 1.2vw; font-weight: bold; color: rgba(230, 220, 130, 1); -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: -1}

.new.inputFlow #main.result div {margin-bottom: 1em;}
.new.inputFlow #main.member_result div {margin-bottom: 4em;}
.new.inputFlow #main.result p {margin: 0 0 .3em;}
.new.inputFlow #main.result .inquiry {margin: 0 auto; text-align: center;}
.new.inputFlow #main.result .inquiry li {display: inline-block;}
.new.inputFlow #main.result .inquiry li:not(:first-child) {margin-left: 10px;}
.new.inputFlow #main.result .inquiry li a {display: block; width:230px; padding: 10px 50px; transition: .5s;}
.new.inputFlow #main.result .inquiry li a:hover {background-color: rgba(226, 250, 220, 1); transition: .5s;}

/* 紹介コード表示用エリア */
.new .roundBox {display: flex; width: 60%; margin: 0 auto 1em; text-align: center;	border: 1px solid; border-radius: 25px;}
.new .roundBox > * {flex-basis: 50%; padding: 10px 0;}
.new .roundBox dt {border-right: 1px solid rgba(51, 51, 51, 1);}
.new .roundBox dd {font-weight: bold;}

/* =================================================================
20.ログイン関係
使用ファイル：login.xhtml
=================================================================*/
#loginNew:after {content: ""; clear: both; display: block;}/* clearfix */
#loginNew table{margin: 0 auto 20px auto; width: 428px;}
#loginNew 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%;}
#loginNew .box{border: 1px solid #CCC; width: 468px; float: left; margin: 0 10px 30px; position: relative;}
#loginNew .box .buttonarea{width: 100%; margin: 20px 0; padding: 0;}
#loginNew .box table{margin: 10px; width: 446px !important;}
#loginNew .box .link_text{text-align: right; padding: 15px 0 10px;}
#loginNew .box .regist_non_area{width: 442px; margin: 0 auto;}
#loginNew .box .regist_non_area p{margin: 0 0 10px;}
#loginNew .box .amazon_area{width: 442px; margin: 0 auto; border-top: 1px solid #ccc;}
#loginNew .box .amazon_area p{margin: 10px 0;}
#loginNew .widebox{border: 1px solid #CCC; width: 960px; margin: 0 10px 30px; clear: both;}
#loginNew .widebox .link{text-align: right;}
#loginNew .widebox table{width: 920px;}
#loginNew input[type='text'],#loginNew input[type='password']{width: 200px;}

#loginNew .social_provider ul{margin: 0px 20px 0px;}
#loginNew .social_provider ul:after {content: ""; clear: both; display: block;}/* clearfix */
#loginNew .social_provider ul li{width: 194px; height: 44px; font-size: 14px; display: block; float: left; margin: 0px 28px 20px 0;}
#loginNew .social_provider ul li:nth-child(2n){margin-right: 0px;}
#loginNew .social_provider ul li a{display: block; text-decoration: none;}
#loginNew .social_provider ul li a span{padding: 14px 0 14px 25px; border: 1px solid #cdcdcd; border-left: 0px; margin: 0 0 0 53px; display: block; background: #FFF; line-height: 1; font-size: 14px;
-webkit-border-top-right-radius: 3px;
-webkit-border-bottom-right-radius: 3px;  
-moz-border-radius-topright: 3px;  
-moz-border-radius-bottomright: 3px;
}

#loginNew .social_provider li.yahoo a{background: url("../images/social_yahoo.png") no-repeat; color: #e71017;}
#loginNew .social_provider li.facebook a{background: url("../images/social_facebook.png") no-repeat; color: #3b5998;}
#loginNew .social_provider li.twitter a{background: url("../images/social_twitter.png") no-repeat; color: #55acee;}
#loginNew .social_provider li.google a{background: url("../images/social_google.png") no-repeat; color: #dc4e41;}
#loginNew .social_provider li.mixi a{background: url("../images/social_mixi.png") no-repeat; color: #d1ad59;}
#loginNew .social_provider li.rakuten a{background: url("../images/social_rakuten.png") no-repeat; color: #bf0000;}
#loginNew .social_provider li.line a{background: url("../images/social_line.png") no-repeat; color: #00b300;}
#loginNew .social_provider li.paypal a{background: url("../images/social_paypal.png") no-repeat; color: #293e7f;}

/* =================================================================
21.商品比較
使用ファイル：item_compare.xhtml
=================================================================*/
#itemCompare .img_box{width: 80px; height: 80px; margin: 0; text-align: center; position: relative;}
#itemCompare .img_box img{width: auto; max-width: 80px; max-height: 80px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
#itemCompare .propertyimg_box{width: 60px; height: 60px; margin: 0; text-align: center; position: relative;}
#itemCompare .propertyimg_box img{width: auto; max-width: 60px; max-height: 60px; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
#itemCompare th{width: 150px;}
#itemCompare .button_area .button{width: auto; display: inline-block; width: 130px;}

/* itemCompare - 商品カートに入った報告ポップアップ
-------------------------------------------------------------*/
#itemCompare .cartSubmitButton{position: relative;}
#itemCompare .cartSubmitButton .cartMessage{position: absolute; top: -85px; left: 50%; margin-left: -122px; padding: 10px; background-color: #fff; border: #ccc 2px solid; width: 270px; z-index: 10; display: none;}
#itemCompare .cartSubmitButton .cartMessage:after{content: ""; display: block; position: absolute; top: 100%; left: 50%; margin-left: -3px; width: 6px; height: 5px;}
#itemCompare .cartSubmitButton .cartMessage .title{text-align: center; font-size: 100.0%; font-weight: bold; color: #000;}
#itemCompare .cartSubmitButton .cartMessage .mainclose{background-color: #fff; cursor: pointer; text-align: center; margin-bottom: 0;}
#itemCompare .cartSubmitButton .cartMessage .link{background-color: #fff; text-align: center;}
#itemCompare .cartSubmitButton .cartMessage .link a{display: inline-block;}
#itemCompare .cartSubmitButton .cartMessage .close{position: absolute; top: 3px; right: 3px; cursor: pointer;}

/* =================================================================
30.商品詳細ページ(DVD用)
=================================================================*/
/* #sidebar_dvd - コンテナ内右サイドバー(dvd専用)
-------------------------------------------------------------*/
#sidebar_dvd{float: right; width: 210px;}
#sidebar_dvd .total_box{border: #CCC 1px solid; padding: 10px; background: #F6F6F6;}
#sidebar_dvd .total_box .button{width:190px; box-sizing:border-box; margin:5px 0;}
#sidebar_dvd h3{font-size:.8em;}
#itemDetailDvd ul li{list-style-type:disc;margin-left:18px;}
#itemDetailDvd ul#EBISU_MENU_LIST li{margin-left:0;}
#itemDetailDvd #menu ul li{list-style-type:none;}/*DVDフッター用*/
/* -------------------------------------------------------------*/
#itemDetailDvd hr{margin-bottom:1em;}
#itemDetailDvd .f_left{float:left; padding:0 10px 10px 0;}
#itemDetailDvd .f_right{float:right; padding:0 0 10px 10px;}
#itemDetailDvd #main{float:none; width:750px;}
#itemDetailDvd .text{width:460px;}
#itemDetailDvd .profile_title{float:none; clear:both;}
#itemDetailDvd .profile_face{float:left; padding:0 10px 10px 0;}
#itemDetailDvd .explanation2 .h3_1,#itemDetailDvd .explanation3 .h3_1{font-size: 1.6em; color: #367CBE; border-top: 2px solid #367CBE; border-bottom: 2px solid #367CBE; padding: 1em; margin: 20px 0; text-align: center; line-height: 1.5em;}
#itemDetailDvd .explanation2 .h3_2,#itemDetailDvd .explanation3 .h3_2{text-align:center; width:100%;	font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "游明朝体", "Yu Mincho","ＭＳ Ｐ明朝", "MS PMincho",  serif; font-weight:bold;	font-size:2em; line-height:130%; color:#fff;	position: static; z-index:0;	padding: .5em; background:#2f81b5; margin: 20px 0; box-sizing:border-box;}
#itemDetailDvd .h3_3{	font-size:1.5em;	font-weight:bold;	border-left:5px solid #367CBE;	padding:.5em;	background-color:#DCEFF7;	margin: 20px 0;}
#itemDetailDvd .h3_4{	text-align: center;	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝体", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;	font-weight: bold;	font-size: 2em;	line-height: 130%;	color:#D21E21;	margin:20px 0;}
#itemDetailDvd .box_dvd h4{	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;	font-weight:bold;	font-size:200%;	line-height:180%;}
#itemDetailDvd #itemDetail ul li{list-style-type:disc; list-style-position:inside;}
#itemDetailDvd .box_1,.box_dvd,.box_qa,.profile{	border:2px solid #cccccc;	padding:20px; margin:20px 0;}
#itemDetailDvd ul.check li{list-style:none;	background:url(/client_info/REALSTYLE/images/list_check_blue.png) no-repeat left 8px;	list-style:none;	padding: 13px 0 0 39px;	font-size:1.2em;}
#itemDetailDvd .box_dvd dt{list-style:none;	background:url(/client_info/REALSTYLE/images/list_check_blue.png) no-repeat left 8px;	list-style:none;	padding: 13px 0 0 39px;	font-size:1.2em;	color:#367CBE;	font-weight:bold;}
#itemDetailDvd .box_dvd dd{	border-bottom: 1px dotted #333;	padding: 5px 0 0 5px; margin-bottom:10px;}
#itemDetailDvd .box_dvd dd img{float:left;	padding:0 10px 10px 0;}
#itemDetailDvd .box_qa dt{list-style:none;	font-size:1.2em; color:#367CBE;	font-weight:bold;	border-bottom: 1px dotted #333;	padding-top:10px;}
#itemDetailDvd .box_qa dd{	padding: 10px 0;}
#itemDetailDvd .video{text-align:center; margin:15px;}
#itemDetailDvd .dvdbtn {
  background: #ff0000;
  background-image: -webkit-linear-gradient(top, #ff0000, #de0303);
  background-image: -moz-linear-gradient(top, #ff0000, #de0303);
  background-image: -ms-linear-gradient(top, #ff0000, #de0303);
  background-image: -o-linear-gradient(top, #ff0000, #de0303);
  background-image: linear-gradient(to bottom, #ff0000, #de0303);
  -webkit-border-radius: 9;
  -moz-border-radius: 9;
  border-radius: 9px;
  font-family: Arial;
  color: #ffffff !important; 
  font-size: 21px;
  padding: 10px 40px 10px 40px;
  text-decoration: none;
}

#itemDetailDvd .dvdbtn:hover {
  background: #ff0000;
  background-image: -webkit-linear-gradient(top, #ff0000, #de0303);
  background-image: -moz-linear-gradient(top, #ff0000, #de0303);
  background-image: -ms-linear-gradient(top, #ff0000, #de0303);
  background-image: -o-linear-gradient(top, #ff0000, #de0303);
  background-image: linear-gradient(to bottom, #ff0000, #de0303);
  text-decoration: none;
color: #ffffff;
}

#itemDetailDvd .center{text-align:center;}
#itemDetailDvd .right{text-align:right;}
#itemDetailDvd .img_dvd_side{width:100%; padding:5px; box-sizing:border-box; text-align:center; display:table-cell; vertical-align:central; background-color:#fff;}
#itemDetailDvd .img_dvd_side img{width:96%;}
#itemDetailDvd .sticky{postion: -webkit-sticky; position: sticky; top: 0;}	/* ---サイドバー追従----*/
#itemDetailDvd .modal_window {
    top: 50%;
    left: 50%;
    margin: -350px 0 0 -300px;
    width: 600px;
    height: 700px;
    text-align: center;
    display: block;
    background: #fff;
    position: relative;
    z-index: 10;
}
#itemDetailDvd #main h2{position:static;}
#itemDetailDvd #main h2:after{position:relative;}

/* =================================================================
30-2.商品詳細ページ(DVD+サプリ商品用)
=================================================================*/
/* #sidebar_dvd - コンテナ内右サイドバー(dvd専用)
-------------------------------------------------------------*/
/*#itemDetailDvd_s ul li{list-style-type:disc;margin-left:18px;}*/
#itemDetailDvd_s ul#EBISU_MENU_LIST li{margin-left:0;}
#itemDetailDvd_s #menu ul li{list-style-type:none;}/*DVDフッター用*/
/* -------------------------------------------------------------*/
#itemDetailDvd_s hr{margin-bottom:1em;}
#itemDetailDvd_s .f_left{float:left; padding:0 10px 10px 0;}
#itemDetailDvd_s .f_right{float:right; padding:0 0 10px 10px;}
/*#itemDetailDvd_s #main{float:none; width:750px;}*/
#itemDetailDvd_s .text{width:460px;}
#itemDetailDvd_s .profile_title{float:none; clear:both;}
#itemDetailDvd_s .profile_face{float:left; padding:0 10px 10px 0;}
#itemDetailDvd_s .explanation2 .h3_1,#itemDetailDvd .explanation3 .h3_1{font-size: 1.6em; color: #367CBE; border-top: 2px solid #367CBE; border-bottom: 2px solid #367CBE; padding: 1em; margin: 20px 0; text-align: center; line-height: 1.5em;}
#itemDetailDvd_s .explanation2 .h3_2,#itemDetailDvd .explanation3 .h3_2{text-align:center; width:100%;	font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "游明朝体", "Yu Mincho","ＭＳ Ｐ明朝", "MS PMincho",  serif; font-weight:bold;	font-size:2em; line-height:130%; color:#fff;	position: static; z-index:0;	padding: .5em; background:#2f81b5; margin: 20px 0; box-sizing:border-box;}
#itemDetailDvd_s .h3_3{	font-size:1.5em;	font-weight:bold;	border-left:5px solid #367CBE;	padding:.5em;	background-color:#DCEFF7;	margin: 20px 0;}
#itemDetailDvd_s .h3_4{	text-align: center;	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝体", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;	font-weight: bold;	font-size: 2em;	line-height: 130%;	color:#D21E21;	margin:20px 0;}
#itemDetailDvd_s .box_dvd h4{	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;	font-weight:bold;	font-size:200%;	line-height:180%;}
#itemDetailDvd_s #itemDetail ul li{list-style-type:disc; list-style-position:inside;}
#itemDetailDvd_s .box_1,.box_dvd,.box_qa,.profile{	border:2px solid #cccccc;	padding:20px; margin:20px 0;}
#itemDetailDvd_s ul.check li{list-style:none;	background:url(/client_info/REALSTYLE/images/list_check_blue.png) no-repeat left 8px;	list-style:none;	padding: 13px 0 0 39px;	font-size:1.2em;}
#itemDetailDvd_s .box_dvd dt{list-style:none;	background:url(/client_info/REALSTYLE/images/list_check_blue.png) no-repeat left 8px;	list-style:none;	padding: 13px 0 0 39px;	font-size:1.2em;	color:#367CBE;	font-weight:bold;}
#itemDetailDvd_s .box_dvd dd{	border-bottom: 1px dotted #333;	padding: 5px 0 0 5px; margin-bottom:10px;}
#itemDetailDvd_s .box_dvd dd img{float:left;	padding:0 10px 10px 0;}
#itemDetailDvd_s .box_qa dt{list-style:none;	font-size:1.2em; color:#367CBE;	font-weight:bold;	border-bottom: 1px dotted #333;	padding-top:10px;}
#itemDetailDvd_s .box_qa dd{	padding: 10px 0;}
#itemDetailDvd_s .video{text-align:center; margin:15px;}
#itemDetailDvd_s .dvdbtn {
  background: #ff0000;
  background-image: -webkit-linear-gradient(top, #ff0000, #de0303);
  background-image: -moz-linear-gradient(top, #ff0000, #de0303);
  background-image: -ms-linear-gradient(top, #ff0000, #de0303);
  background-image: -o-linear-gradient(top, #ff0000, #de0303);
  background-image: linear-gradient(to bottom, #ff0000, #de0303);
  -webkit-border-radius: 9;
  -moz-border-radius: 9;
  border-radius: 9px;
  font-family: Arial;
  color: #ffffff !important; 
  font-size: 21px;
  padding: 10px 40px 10px 40px;
  text-decoration: none;
}
 
#itemDetailDvd_s .dvdbtn:hover {
  background: #ff0000;
  background-image: -webkit-linear-gradient(top, #ff0000, #de0303);
  background-image: -moz-linear-gradient(top, #ff0000, #de0303);
  background-image: -ms-linear-gradient(top, #ff0000, #de0303);
  background-image: -o-linear-gradient(top, #ff0000, #de0303);
  background-image: linear-gradient(to bottom, #ff0000, #de0303);
  text-decoration: none;
color: #ffffff;
}
 
#itemDetailDvd_s .center{text-align:center;}
#itemDetailDvd_s .right{text-align:right;}
#itemDetailDvd_s .img_dvd_side{width:100%; padding:5px; box-sizing:border-box; text-align:center; display:table-cell; vertical-align:central; background-color:#fff;}
#itemDetailDvd_s .img_dvd_side img{width:96%;}
#itemDetailDvd_s .sticky{postion: -webkit-sticky; position: sticky; top: 0;}	/* ---サイドバー追従----*/
#itemDetailDvd_s .modal_window {
    top: 50%;
    left: 50%;
    margin: -350px 0 0 -300px;
    width: 600px;
    height: 700px;
    text-align: center;
    display: block;
    background: #fff;
    position: relative;
    z-index: 10;
}
#itemDetailDvd_s #main h2{position:static;}
#itemDetailDvd_s #main h2:after{position:relative;}

/* =================================================================
31.商品詳細ページ(サプリメント用)
=================================================================*/


/* =================================================================
32.商品詳細ページ(member_result)
=================================================================*/
#memberResult #main .mailInpit,
#memberResult .inquiry {
	margin-left: 10px;
}

#memberResult #main .mailInpit {
	margin-bottom: 10px;
	font-size: 0.9rem;
}

#memberResult .inquiry li a {
	display: inline-block;
	padding: 10px 30px;
	color: #333;
	text-decoration: none;
	border: 1px solid #333;
	border-radius: 3px;
}

/* =================================================================
40.お問合せ
=================================================================*/
#apply table{width:750px;}
#apply table th{width:100px;}
#apply table td{width:600px;}
.bl_link , .btn_center{text-align:center}

/* =================================================================
41.代理受注ページ
=================================================================*/
#main.agencyOrders{font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;}
#main.agencyOrders h1{font-size: 28px; margin: 0 0 20px;}
#main.agencyOrders h2{margin: 30px 0 10px; font-size: 1.5rem; border-bottom: 3px solid #ccc;}
#main.agencyOrders h2::after{content: "";}

#main.agencyOrders #itemList > div {margin-bottom: 60px;}
#main.agencyOrders .globalMenu{display: flex; justify-content: space-between; margin-bottom: 40px;}
#main.agencyOrders .globalMenu li{flex-basis: 31%;}
#main.agencyOrders .globalMenu li a{display: block; padding: 10px 0; font-size: 1.5rem; fonr-weight: 900; text-align: center; border: 1px solid #eee; border-radius: 10px; transition: .3s;}
#main.agencyOrders .localMenu {display: flex; flex-wrap: wrap; margin: 0 -5px; background: none;}
#main.agencyOrders .localMenu li {margin: 5px;}
#main.agencyOrders .localMenu li a {display: block; padding: 7px 15px; font-size: .9rem; border: 1px solid #eee; border-radius: 5px; transition: .3s;}
#main.agencyOrders .localMenu li a::after {content: '\02228'; margin-left: 5px; padding: 0 5px 2px; color: #fff; background-color: #ccc; border-radius: 5px;}
#main.agencyOrders .globalMenu li a:hover,
#main.agencyOrders .localMenu li a:hover{text-decoration: none; background-color: #fefefe; border-color: #ccc; transition: .3s;}

#main.agencyOrders table {border: none; font-size: 14px;}
#main.agencyOrders table tr {border-bottom: 1px solid #ccc;}
#main.agencyOrders table td {border: none; padding: 0 !important; vertical-align: middle;}
#main.agencyOrders table .item {width: 60%; }
#main.agencyOrders table .price {width: 30%; text-align: right; font-size: 13px; padding: 0 15px 0 0 !important }
#main.agencyOrders table .amount {width: 8%; text-align: center; }
#main.agencyOrders table .check {display: table-cell; }
#main.agencyOrders table .check input[type=checkbox] {vertical-align: middle; }
#main.agencyOrders table .code {font-size: 11px; width: 120px; display: table-cell; padding: 0; }
#main.agencyOrders table .name {padding: 8px 20px 8px 0; display: table-cell; }
#main.agencyOrders table .price select {width: 170px; height: 30px; }
#main.agencyOrders table .price input[type="text"] {width: 80px; display: none; margin: 0 0 0 5px; height: 30px; }
#main.agencyOrders table .amount select {width: 50px; height: 30px; }
#main.agencyOrders .addCart {text-align: right;}
#main.agencyOrders .addCart a {display: inline-block;}
#main.agencyOrders .fixedsticky {position: -webkit-sticky; position: -moz-sticky; position: -ms-sticky;  position: -o-sticky; position: sticky;}
#main.agencyOrders .top {top:0; background:#FFFFFF;}
#footerFloatingMenu {display: block; width: 100%; position: fixed; left: 0px; bottom: 0px; z-index: 9999; text-align: center; padding: 0 auto;  background-color: #84c102;}
#footerFloatingMenu .fa {font-size: 2em; color: #fff; position: absolute; left: 10px; }
div#footerFloatingMenu a {display: inline-block; padding: 12px 10px 0 50px; height: 55px; line-height: 35px; color: #fff; position: relative;}
.fixedsticky {top: 0;}
#footerFloatingMenu .inner {width: 980px; margin: 0 auto;}
#footerFloatingMenu .left_menu {float: left;}
#footerFloatingMenu .right_menu {float: right;}

/* =================================================================
50.インフォメーション・トピックス
=================================================================*/
#infomation {
	position: relative;
	margin-bottom: 40px;
	padding: 40px 10px;
	color: #D21E21;
	border-top: 1px solid #D21E21;
	border-bottom: 1px solid #D21E21;
}
#infomation h2 {
	margin-bottom: 10px;
	font-size: 1.2rem;
	text-align: center;
}
#infomation h3 {
	margin-bottom: 5px;
}
#infomation .f_left {
	float: left;
	width: 35%;
	padding-right: 10px;
}
#infomation .f_right {
	float: left;
	width: 65%;
}
#infomation p {
	position: absolute;
	top: 80px;
	right: 165px;
	width: 15%;
}
#infomation p:last-child {
	right: 10px;
}

/* =================================================================
51.バナーエリア
=================================================================*/
#bnrArea {margin-bottom: 40px;}
#bnrArea ul {display: flex;	flex-wrap: wrap;}
#bnrArea li {margin-bottom: 12px; flex-basis: 32.5%;}
#bnrArea li:first-child {flex-basis: 100%;}
#bnrArea li:not(:first-child):not(:nth-child(4)):not(:nth-child(7)):not(:nth-child(10)) {margin-right: 1.2%;}
#bnrArea img {width: 100%; height: auto; vertical-align: middle;}

/* =================================================================
config.共通で使える設定
=================================================================*/
/*  注意・警告表示
-------------------------------------------------------------*/
#main .caution, #main .total_box .noveltyInfo, .caution {	font-size: 1rem; color: #c80000; font-weight: bold; }
#main .caution.box, #main .total_box .noveltyInfo, .caution.box {	display: block;	margin-top: 5px;	padding: 5px;	font-size: 0.8rem; border: 1px solid #a80000;	border-radius: 3px; }
.itemDetail #itemDetail .caution.box {margin-top: 0;}
#main.cart_index .caution.box, #main .total_box .noveltyInfo { margin: 0 0 10px; }
#main .novelty_box .caution.box {	margin-bottom: 0;	color: #c70000!important; }
#main .caution.mailInpit { margin: 0;	font-size: 0.7rem; }
#main .caution.stop {	font-size: 0.8rem; }
#main .caution.samit { margin: 5px 0 0.5em;	font-size: 0.7rem; }
.mailaddress { margin-bottom: 7px; }
#main .annotation {	margin: 0; font-size: 0.7rem;	color: #c80000;	font-weight: bold; }
#mobile {	margin: 1em 0; font-size: 0.8rem; }
#mobile p {	margin: 0 0 10px; }
#mobile li { display: inline-block; }
#mobile li:not(:last-child) {	margin-right: 5px; }
#mobile a {
	display: block;
	width: 100px;
	color: #333;
	font-weight: bold;
	text-align: center;
	border: 1px rgba(184,188,191,1) solid;
	background-color: rgba(255, 255, 255, 1);
	border-radius: 5px;
	transition: .5s;
}
#mobile a:hover {
	color: #fff;
	background-color: rgba(184,188,191,1);
	transition: .5s;
	text-decoration: none;
}
#mobile .docomo a {
	border-color: rgba(204,51,65,1);
}
#mobile .docomo a:hover {
	background-color: rgba(204,51,65,1);
}
#mobile .au a {
	border-color: rgba(235,85,5,1);
}
#mobile .au a:hover {
	background-color: rgba(235,85,5,1);
}
#apply #mobile { margin-left: 10px; margin-bottom: 20px; }
#apply #mobile a { padding: 5px 0; }
#main .total_box .noveltyInfo {color: rgba(0, 125, 30, 1); background-color: rgba(234, 245, 234, 1); border-color: rgba(200, 235, 200, 1); transition: .5s;}
#main .total_box .noveltyInfo:hover {border-color: rgba(0, 125, 30, 1); transition: .5s;}
#main .total_box .noveltyInfo a:hover {text-decoration: none;}
#main .total_box .noveltyInfo .fa-check-circle {margin-right: .3rem; color: rgba(200, 235, 200, 1);}

/*  文字入力系共通
-------------------------------------------------------------*/
/* 住所入力系 */
.zipcode div {
	float: left;
	width: 16%;
}

.zipcode div #ZIP,
.zipcode div #SEND_ZIP {
	width: 100%;
}

.zipcode p {
	float: right;
	width: 83%;
}

.chgAddr {
	display: none;
}

/*  個人情報保護方針
-------------------------------------------------------------*/
.protection {
	text-align: left;
}

	.protection h3,
	.protection h4 {
		margin-bottom: 10px;
		font-size: 0.9rem;
		text-align: center;
	}

	.protection h5 {
		margin-left: 10px;
		font-size: 0.75rem;
	}

	.protection > div {
		margin:0 auto;
		border: solid 1px #CCC;
		width: 750px;
		height: 120px;
		padding: 0.5em;
		overflow: auto;
	}

		#main .protection > div p {
			font-size: 0.75rem;
			margin-bottom: 1em;
		}

		#main .protection > div ul {
			margin: 0 10px 1em;
			font-size: 0.75rem;
		}

			#main .protection > div li {
				margin-left: 20px;
				list-style: disc;
			}
	
		#main div.responsible h4,
		#main div.responsible p {
			margin: 0 0 0.5px;
			text-align: right;
		}


/*  バッチ 2019年カート大改修
-------------------------------------------------------------*/
.badge {margin-right: .5em; padding: 2px 10px; font-size: 0.65rem; font-weight: bold; color: rgba(255,255,255,1); border-radius: 3px; vertical-align: middle; line-height: 100%;}
.new h3 .badge,
.new h4 .badge {margin-left: 1em; margin-right: 0;}
#non_introduction .badge{margin-left: 0;}
.badge.required,
.badge.timesale {background-color: rgba(200,0,0,1);}
.badge.optional {background-color: rgba(0,0,200,1);}

/*  ツールチップ
-------------------------------------------------------------*/
.tippy-tooltip { text-align: left; }
.tippy-tooltip p:not(:last-child) { padding: 0 0 0.3em; }
.tippy-tooltip.light-border-theme {background-color: rgba(255, 250, 230, 1); border-color: rgba(231, 206, 106, 1);}
.tippy-tooltip.light-border-theme[data-placement^=top]>.tippy-arrow,
.tippy-tooltip.light-border-theme[data-placement^=top]>.tippy-arrow:after {border-top-color: rgba(255, 250, 230, 1);}
.tippy-tooltip.light-border-theme[data-placement^=top]>.tippy-arrow:before {border-top-color: rgba(231, 206, 106, 1);}
.tippy-content {padding: 10px 13px;}

/*  吹き出し
-------------------------------------------------------------*/
/* 上 */
.balloon-top {position: relative; margin: .6rem 0 0; padding: 5px 5px 0; border-top: 1px solid #ccc;}
.balloon-top:before {content: ""; position: absolute; top: -13px; right: 8%; margin-left: -17px; border: 7px solid transparent; border-bottom: 7px solid #FFF; z-index: 2;}
.balloon-top:after {content: ""; position: absolute; top: -14px; right: 8%; margin-left: -17px; border: 7px solid transparent; border-bottom: 7px solid #ccc; z-index: 1;}
.balloon-top::before,
.balloon-top::after {left: 20%; right: inherit;}
#itemDetail .balloon-top::before,
#itemDetail .balloon-top::after {left: 50%; margin-left: 0; transform: translateX(-50%);}


/* 下 */
.balloon-bottom {position: relative;}
.balloon-bottom:before {content: ""; position: absolute; bottom: -14px; left: 50%; border: 7px solid transparent; border-top: 7px solid #FFF; transform: translateX(-50%); z-index: 2;}
.balloon-bottom:after {content: ""; position: absolute; bottom: -15px; left: 50%; border: 7px solid transparent; border-top: 7px solid rgba(201, 201, 201, 1); transform: translateX(-50%); z-index: 1;}


/*  SVG用の設定
-------------------------------------------------------------*/
/* ビーレジェンドロゴ */
.bl-cls-1{fill:#231815;}
/* キレイナデシコロゴ */
.nadeshiko-cls-1,.nadeshiko-cls-2{fill:#e8417b;}
.nadeshiko-cls-2{fill-rule:evenodd;}
/* マスターズプロテインロゴ */
.masters-cls-1{fill:url(#gradation_2);}
.masters-cls-2{fill:url(#gradation_2-2);}
.masters-cls-3{fill:url(#gradation_2-3);}
.masters-cls-4{fill:url(#gradation_2-4);}
.masters-cls-5{fill:url(#gradation_2-5);}
.masters-cls-6{fill:url(#gradation_2-6);}
.masters-cls-7{fill:url(#gradation_2-7);}
.masters-cls-8{fill:url(#gradation_2-8);}
.masters-cls-9{fill:url(#gradation_2-9);}
.masters-cls-10{fill:url(#gradation_2-10);}
.masters-cls-11{fill:url(#gradation_2-11);}
.masters-cls-12{fill:url(#gradation_2-12);}
.masters-cls-13{fill:url(#gradation_2-13);}
.masters-cls-14{fill:url(#gradation_2-14);}
.masters-cls-15{fill:url(#gradation_2-15);}
.masters-cls-16{fill:url(#gradation_2-16);}
.masters-cls-17{fill:url(#gradation_2-17);}
.masters-cls-18{fill:url(#gradation_2-18);}
.masters-cls-19{fill:url(#gradation_2-19);}
.masters-cls-20{fill:url(#gradation_2-20);}
.masters-cls-21{fill:url(#gradation_2-21);}
.masters-cls-22{fill:url(#gradation_2-22);}
.masters-cls-23{fill:url(#gradation_2-23);}
.masters-cls-24{fill:url(#gradation_2-24);}
.masters-cls-25{fill:url(#gradation_2-25);}
.masters-cls-26{fill:url(#gradation_2-26);}
.masters-cls-27{fill:url(#gradation_2-27);}
.masters-cls-28{fill:url(#gradation_2-28);}
.masters-cls-29{fill:#231815;}
/* NEWERAロゴ */
.newera-cls-1{fill:#fff;}
.newera-cls-2{fill:#231815;}
.newera-cls-3{fill:none;}
/* LEGENDSロゴ */
.legends-cls-1{fill:#231815;}

/*  非表示
-------------------------------------------------------------*/
.sp { display: none; }
.hidden { display: none!important; }