@charset "Shift_JIS";

/*============================================================
 全体
============================================================*/

.topics-all {margin: 0 auto;font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 
'MS Pゴシック', Osaka, sans-serif, arial, verdana, Helvetica, Verdana, "Droid Sans", Arial;}

/*============================================================
新規タグ作成までの仮ボタン用
============================================================*/
.basket-button {
 width: 100%;
 text-align: center;
 position: absolute;
 bottom: 12px;
}

.product-1box .basket-button{ width: calc( 70% - 40px); right: 15px;}
.iphone .product-1box .basket-button{ width: 100%;}/***** iphone用 *****/

@media screen and (max-width: 767px) {
  .product-1box .basket-button{ width: calc( 100% - 30px); right: auto;}
}



/*============================================================
 Contents全体
============================================================*/
.contents {margin-bottom:30px;}

.contents img{ max-width: 100%; height: auto; vertical-align: bottom;}

.contents-inner {padding: 0 10px; letter-spacing: 0;}
article.contents-main { letter-spacing: 0;}

/* ヘッダー画像 */
.top-img {max-width: 100%;height: auto;vertical-align: bottom;}

/* 日付 */
.p-update {text-align: right;font-size: .8em!important;}

/*============================================================
 パンくずリスト
============================================================*/
section#breadcrumb {}
section#breadcrumb > ol { list-style: normal; font-size: 12px; margin: 0; padding: 0;}
section#breadcrumb > ol > li{display: inline-block; margin: 0;}
section#breadcrumb > ol > li:nth-of-type(1)::before { font-family: "FontAwesome"; content: '\f015'; color: #aaa; font-size: 1.5em; vertical-align: middle; margin: 0 10px; }
section#breadcrumb > ol > li:not(:last-child):after { font-family: "FontAwesome"; content: '\f105'; color: #aaa; font-size: large; margin: 0 10px; }
section#breadcrumb > ol > li a{ font-weight: normal;}

/*============================================================
 リスト
============================================================*/
/* ULタグの通常版 */
.contents-main ul {
list-style: disc;margin-bottom: 20px;padding-left: 1.5em;
}

.contents-main li {
margin-bottom: 0.5em;color: #666;line-height: 1.5;
}

/* OLタグの通常版＜算用数字＞ */
.contents-main ol {
list-style: decimal;margin-bottom: 20px;padding-left: 2em;
}

/* 注意書用 */
.contents-main ul.ul-caution {
list-style: none;margin:5px 10px 20px;padding: 20px 20px 10px;border: 1px solid #ddd;
}

.contents-main ul.ul-caution li {
margin-bottom: 12px;
padding-left: 1em; /*1em（1文字）分、右に動かす*/
text-indent: -1.2em; /*最初の行だけ1em（1文字）分、左に動かす*/
color: #666;line-height: 1.5;

}

.contents-main ul.ul-caution > li::before {
content: "※" ;
padding-right: 0.2em;
}

/*============================================================
 目次
============================================================*/

/* 目次ナビ＜5枠-2枠＞ */
.contents-main .mokuji-navi5 , 
.contents-main .mokuji-navi4 , 
.contents-main .mokuji-navi3 , 
.contents-main .mokuji-navi2 {margin-bottom: 25px; font-size: 0; letter-spacing: 0;}

.contents-main .mokuji-navi5 ul , 
.contents-main .mokuji-navi4 ul , 
.contents-main .mokuji-navi3 ul , 
.contents-main .mokuji-navi2 ul {margin-bottom: 0; padding: 0; list-style: none;}

.contents-main .mokuji-navi5 li {width: 20%    ;display: inline-block;margin-bottom: 1px ;}
.contents-main .mokuji-navi4 li {width: 25%    ;display: inline-block;margin-bottom: 1px ;}
.contents-main .mokuji-navi3 li {width: 33.33%; display: inline-block;margin-bottom: 1px ;}
.contents-main .mokuji-navi2 li {width: 50%    ;display: inline-block;margin-bottom: 1px ;}

.contents-main .mokuji-navi5 li a::before, 
.contents-main .mokuji-navi4 li a::before, 
.contents-main .mokuji-navi3 li a::before, 
.contents-main .mokuji-navi2 li a::before {font-family: "FontAwesome";content: '\f0da';  margin:0 5px;  color: #aaa;}

.contents-main .mokuji-navi5 li a, 
.contents-main .mokuji-navi4 li a, 
.contents-main .mokuji-navi3 li a, 
.contents-main .mokuji-navi2 li a {
display: block;
margin-right: 1px;
padding: 5px 10px 5px 0;
background-color: #f7f7f7;
border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd;
color: #666;
font-size: 12px;
font-weight: normal;
text-decoration: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;}

.contents-main .mokuji-navi5 li a:hover, 
.contents-main .mokuji-navi4 li a:hover, 
.contents-main .mokuji-navi3 li a:hover, 
.contents-main .mokuji-navi2 li a:hover {background-color: #94ecf6;}

.contents-main .mokuji-navi5 ul::after, 
.contents-main .mokuji-navi4 ul::after, 
.contents-main .mokuji-navi3 ul::after, 
.contents-main .mokuji-navi2 ul::after {content: ""; display: block; clear: both;}




/*============================================================
リンクナビ　（その他リンク等の別ページリンク用）
============================================================*/
.etc-navi { width: calc(100% - 10px ); margin: 10px 0px 10px 10px;}
.etc-navi ul{ padding: 0px; font-size: 0;}
.etc-navi ul li{ margin-right: 10px; margin-bottom: 5px; padding: 0px; display: inline-block; text-decoration: none; border: 1px solid #999; border-radius: 5px; text-align: left; vertical-align: top; overflow: hidden;}
.etc-navi ul li:hover { border: 1px solid #09f;}
.etc-navi ul li a { padding: 10px; margin: 0px !important; font-size: 16px !important; text-decoration: none; font-weight: normal !important;}
.etc-navi ul li a:hover { background: #09f; color: #fff;}

.etc-navi .cell5 li{width: calc( 20% - 12px);}
.etc-navi .cell4 li{width: calc( 25% - 12px);}
.etc-navi .cell3 li{width: calc( 33.33% - 12px);}
.etc-navi .cell2 li{width: calc( 50% - 12px);}
.etc-navi .cell1 li{width: calc( 100% - 13px); float: none;}


/*============================================================
リンクナビ アコーディオン式
============================================================*/
/****************** 第一階層 ******************/
.navi-accordion { margin-right: 10px; background-color: #fff; border-radius: 5px ;border: 1px solid #999; text-align: left !important;}
.navi-accordion:hover{ border-color: #09f !important;;}
.navi-accordion > a { display: block; color: #333; cursor: pointer; position: relative; padding: 10px 25px 10px 10px !important;}
.navi-accordion > a:hover { color: #fff !important; background-color: #09f;}
.navi-accordion > a::after, .navi-accordion  > a.guide-active::after { font-size: 16px; position: absolute; right: 10px; top: 12px; color: #aaa !important;}
.navi-accordion > a::before { content: "\f0fe"; font-family:FontAwesome; color: #aaa !important; margin-right: 7px;}
.navi-accordion > a.active::before { content: "\f146"; font-family:FontAwesome;}
.navi-accordion > a::after { content: "\f078"; font-family:FontAwesome;}
.navi-accordion > a.active::after { content: "\f077"; font-family:FontAwesome;}

/****************** 第二階層 ******************/
.navi-accordion > ul { list-style: none; padding: 0px; margin: 0px;}
.navi-accordion > ul > li{ margin: 0px; width: 100% !important; border: 0; text-align: left !important;}
.navi-accordion > ul > li:hover{ border: 0;}
.navi-accordion > ul > li > a {display: block; color: #1e50a2 !important; font-size: 14px; cursor: pointer; position: relative; text-decoration: none; padding: 6px !important; padding-left: 1.2em !important; text-indent: -1em;}
.navi-accordion > ul > li > a:hover { background-color: #09f; color: #fff !important;}
.navi-accordion > ul > li > a::after, 
.navi-accordion > ul > li > a.active::after{ font-size: 16px; position: absolute; right: 10px; top: 10px; color: #fff;}
.navi-accordion > ul > li > a::before { content: "\f0da"; font-family:FontAwesome; margin: 0px 5px;}

/* 第二階層を閉じる */
.navi_list { display: none; border-top: 2px dotted #aaaaaa;}
div.navi-accordion > ul { list-style: none;}

/****************** 第三階層以降 ******************/
.navi-accordion > ul > li.navi-accordion > ul > li > a{ padding-left: 15px !important;}
.navi-accordion > ul > li.navi-accordion > ul > li:last-child{ border-bottom: 1px solid #ccc; border-radius: 0px;}
.navi-accordion > ul > li.navi-accordion > a::before { color: #1e50a2 !important;}
.navi-accordion > ul > li.navi-accordion > a:hover::before { color: #fff !important;}
.navi-accordion > ul > li.navi-accordion > a.active::before { content: "\f0da";}
.navi-accordion > ul > li.navi-accordion > a::after, .navi-accordion > ul > li.navi-accordion > a.active::after { top: 6px;}

/*============================================================
 パンくずリスト
============================================================*/
.bread-crumb {font-size: 0.9em;}

.bread-crumb ol {margin: 0; padding: 0; list-style: none;}
.bread-crumb li {float: left; width: auto;}
.bread-crumb li a {display: inline-block; color: #000; text-decoration: none;}
.bread-crumb li a:hover {text-decoration:underline;color:#00f;}

.bread-crumb ol::after {content: ""; display: block; clear: both;}
.bread-crumb li::after {font-family: "FontAwesome";content: '\f105'; margin:0 10px; color: #aaa;font-size: large;}
.bread-crumb li:last-child::after {content: "";}


/*============================================================
 サイドメニュー
============================================================*/
.side-menu {border: solid 6px #f0f0f0;}
.side-menu h2{margin: 0; padding: 10px;font-size: 1.0em;font-weight: normal;line-height: 1.2em;border-left: 1px solid #03f;}
.side-menu h2 i{color: #fb1e64;font-size: larger;}

.side-menu ul{margin: 0; padding: 0; list-style: none;background-color:#efffff;}

.side-menu li a{display: block;padding: 10px;border-top: solid 1px #ddd;color: #000; font-size: 14px;text-decoration: none;line-height: 1.4em;}
.side-menu li a:hover {background-color:#cff;}
.side-menu li a::before {font-family: "FontAwesome"; content: '\f0da'; margin: 0 5px; color: #888;}



/*============================================================
 アコーディオン
============================================================*/
ul.acordion-wrapper { list-style: none; perspective: 900; padding: 0; margin: 0 auto; overflow-y: hidden; max-width: 1000px; line-height: 1.5; letter-spacing: 1px; color: #222;}
ul.acordion-wrapper > li { position: relative; padding: 0; margin-bottom: .5em}
ul.acordion-wrapper h3.question { margin-bottom: 2px; overflow: hidden; color: #0075c1; font-weight: bold; background-color: #e9eff0; padding: 0; position: relative; z-index: 9;}
ul.acordion-wrapper h3.question label { position: relative;  display: block; cursor: pointer; padding: 1em 2em 1em 4.5em; margin: 0; width: calc(100% - 6em);}
ul.acordion-wrapper > li input[type=checkbox]:checked ~ h3.question label { background-color: #e9eff0;}
ul.acordion-wrapper h3.question label::before, ul.acordion-wrapper div.anser::before { font-size: 30px; font-weight: bold; font-style: italic; position: absolute; left: 0px; padding: 5px 15px 5px; top: 0; width: 30px; text-align: center;}
ul.acordion-wrapper h3.question label::before { content: "Q"; color: #30b5ef;}

ul.acordion-wrapper div.anser { position: relative; overflow: hidden; z-index: 2; margin-top: 0; max-height: 0; opacity: 0; transform: translateY(-100%); border-top: 2px solid #fff; background-color: #e9eff0; overflow: hidden; transition: .3s;}
ul.acordion-wrapper div.anser::before { content: "A"; color: #fc5151;}
ul.acordion-wrapper > li input[type=checkbox]:checked ~ div.anser { padding: 1em 2em 1em 4.5em; max-height: 800px; opacity: 1; transform: translateY(0);}
ul.acordion-wrapper > li:nth-of-type(1) {animation-delay: 0.25s;}
ul.acordion-wrapper > li:nth-of-type(2) {animation-delay: 0.5s;}
ul.acordion-wrapper > li:nth-of-type(3) {animation-delay: 0.75s;}
ul.acordion-wrapper > li:nth-of-type(4) {animation-delay: 1s;}
ul.acordion-wrapper > li:nth-of-type(5) {animation-delay: 1.25s;}
ul.acordion-wrapper > li:nth-of-type(6) {animation-delay: 1.5s;}
ul.acordion-wrapper > li:nth-of-type(7) {animation-delay: 1.75s;}
ul.acordion-wrapper > li:nth-of-type(8) {animation-delay: 2s;}
ul.acordion-wrapper > li:last-of-type {padding-bottom: 0;}
ul.acordion-wrapper > li i { position: absolute; transform: translate(-6px, 0); margin-top: 1.5em; right: 1em; z-index: 99;}
ul.acordion-wrapper > li i:before, ul.acordion-wrapper > li i:after { content: ""; position: absolute; background-color: #5cb3c9; width: 3px; height: 9px;}
ul.acordion-wrapper > li input[type=checkbox] { position: absolute; cursor: pointer; width: 100%; height: 100%; z-index: 1; opacity: 0; display: none;}
ul.acordion-wrapper > li i:before {transform: translate(2px, 0) rotate(45deg); transition: .3s;}
ul.acordion-wrapper > li input[type=checkbox]:checked ~ i:before {transform: translate(-2px, 0) rotate(45deg);}
ul.acordion-wrapper > li i:after {transform: translate(-2px, 0) rotate(-45deg); transition: .3s;}
ul.acordion-wrapper > li input[type=checkbox]:checked ~ i:after { transform: translate(2px, 0) rotate(-45deg);}
ul.acordion-wrapper ul, ul.acordion-wrapper ol { margin: 0.5em; font-size: .8em;}
ul.acordion-wrapper ul.note li { font-size: 1.5rem;}

ul.acordion-wrapper div.btn { overflow: hidden; background-color: #fafafa; padding: 0; position: relative; z-index: 9; text-align: center; border: 1px solid #0075c1;}
ul.acordion-wrapper div.btn label { position: relative;  display: block; cursor: pointer; padding: 1em 2em 1em 1em; margin: 0; width: calc(100% - 3em);}
ul.acordion-wrapper div.btn label::before,  ul.acordion-wrapper div.inner::before { font-size: 22px; font-weight: 100; position: absolute; left: 0px; padding: 12px 15px 18px; color: #fff; top: 0; width: 26px; height: calc(100% - 30px); text-align: center;}
ul.acordion-wrapper div.btn label:hover{ background-color: #e9eff0;}
ul.acordion-wrapper > li input[type=checkbox]:checked ~ div.btn label::before { background-color: #28af96;}
ul.acordion-wrapper div.btn label:hover::before { background-color: #28af96;}
ul.acordion-wrapper div.inner { position: relative; overflow: hidden; z-index: 2; margin-top: 0; max-height: 0; opacity: 0; transform: translateY(-100%); border-bottom: 1px solid #ccc; overflow: hidden; transition: .3s;}
ul.acordion-wrapper > li input[type=checkbox]:checked ~ div.inner { padding: 1em 2em 1em 1em; max-height: 100%; opacity: 1; transform: translateY(0); background-color: #fff;}

@media screen and (max-width:767px)  {
	/* アコーディオン */
	ul.acordion-wrapper h3.question, ul.acordion-wrapper div.anser{ font-size: .8em;}
	ul.acordion-wrapper { font-size: 1em;}
	ul.acordion-wrapper h3.question label { padding-left: 5em; width: calc(100% - 7em);}
	ul.acordion-wrapper > li input[type="checkbox"]:checked ~ div.anser { padding-right: 0; padding-left: 5em;}
	ul.acordion-wrapper ul.note li { font-size: 1.2rem;}
}


/*============================================================
 レフトメニュー用アコーディオン
============================================================*/

div.left-acod { width: 100%;}
div.left-acod  ul  li:last-of-type { border-bottom: 0px solid #666;}

/****************** 第一階層 ******************/
div.left-acod > ul > li > a.toggle {
 display: block;
 color: #333;
 font-size: 16px;
 text-decoration: none;
 background-color: #eee;
 cursor: pointer;
 position: relative;
}

div.left-acod > ul > li > a.toggle:hover { background-color: #9cf !important; color: #333 !important;}

div.left-acod > ul > li > a.toggle::after {
  font-size: 16px;
  position: absolute;
  right: 10px;
  top: 10px;
  color: #fff !important;
  content: "\f078";
  font-family:FontAwesome;
}

div.left-acod > ul > li > a.toggle::before { content: "\f0fe"; font-family:FontAwesome; color: #aaa !important;}

div.left-acod > ul > li > a.toggle.active::before { content: "\f146"; font-family:FontAwesome;}
div.left-acod > ul > li > a.toggle.active::after { content: "\f077"; font-family:FontAwesome;}


/****************** 第二階層 ******************/
div.left-acod > ul > li > ul a.toggle {
	display: block;
	color: #333;
	font-size: 16px;
	background-color: #fff;
	cursor: pointer;
	position: relative;
	text-decoration: none;
}

div.left-acod > ul > li > ul a.toggle:hover { background-color: #f7f7f7;color:#333 !important;}
div.left-acod > ul > li > ul a.toggle::before { content: "\f078"; font-family:FontAwesome; color: #ddd;}
div.left-acod > ul > li > ul a.toggle.active::before { content: "\f077"; font-family:FontAwesome;}

/* 第二階層以降を閉じる */
div.left-acod > ul > li a.toggle+ul { display: none;}

/****************** 第三階層以降 ******************/
div.left-acod > ul > li > ul > li > ul a.toggle { font-size: 14px; background-color: #f9f9f9; padding-left: 15px;}
div.left-acod > ul > li > ul > li > ul a.toggle:hover { background-color: #f4f4f4;}

a.toggle.active+ul{ border-bottom: 2px solid #aaa;}



/*============================================================
 ご利用ガイド用レフトメニュー
============================================================*/
div.guide-accordion {
  width: 100%;
}

/****************** 第一階層 ******************/
div.guide-accordion > ul > li > a {
 display: block;
 color: #333;
 font-size: 16px;
 text-decoration: none;
 background-color: #eee;
 cursor: pointer;
 position: relative;
}

div.guide-accordion > ul > li > a:hover {
  background-color: #9cf !important;
  color: #333 !important;
}

div.guide-accordion > ul > li > a::after, div.guide-accordion > ul > li > a.guide-active::after {
  font-size: 16px;
  position: absolute;
  right: 10px;
  top: 10px;
  color: #fff !important;
}

div.guide-accordion > ul > li > a::before {
  content: "\f0fe";
  font-family:FontAwesome;
  color: #aaa !important;
}

div.guide-accordion > ul > li > a.active::before {
  content: "\f146";
  font-family:FontAwesome;
}

div.guide-accordion > ul > li > a::after {
  content: "\f078";
  font-family:FontAwesome;
}

div.guide-accordion > ul > li > a.active::after {
  content: "\f077";
  font-family:FontAwesome;
}


/****************** 第二階層 ******************/
div.guide-accordion > ul > li > ul > li > a {
display: block;
color: #333;
font-size: 16px;
background-color: #fff;
cursor: pointer;
position: relative;
text-decoration: none;
}

div.guide-accordion > ul > li > ul > li > a:hover {
  background-color: #f7f7f7;color:#333 !important;
}

div.guide-accordion > ul > li > ul > li > a::before {
  content: "\f078";
  font-family:FontAwesome;
  color: #ddd;
}

div.guide-accordion > ul > li > ul > li > a.active::before {
  content: "\f077";
  font-family:FontAwesome;
}


div.guide-accordion > ul > li > ul > li > a::after, div.guide-accordion > ul > li > ul > li > a.active::after {
  font-size: 16px;
  position: absolute;
  right: 30x;
  top: 10px;
  color: #fff;
}

div.guide-accordion > ul > li > ul > li > a::after {
  content: "\f107";
  font-family:FontAwesome;
}

div.guide-accordion > ul > li > ul > li > a.active::after {
  content: "\f106";
  font-family:FontAwesome;
}

/* 第二階層を閉じる */
div.guide-accordion > ul > li > ul {
  display: none;
}

/****************** 第三階層 ******************/
div.guide-accordion > ul > li > ul > li > ul > li > a {
display: block;
color: #333 !important;
font-size: 14px;
background-color: #efffff;
cursor: pointer;
position: relative;
text-decoration: none;
padding: 6px;
}

div.guide-accordion > ul > li > ul > li > ul > li > a:hover {
  background-color: #9cf; color: #333 !important;
}

div.guide-accordion > ul > li > ul > li > ul > li > a::after, div.guide-accordion > ul > li > ul > li > ul > li > a.active::after{
  font-size: 21px;
  position: absolute;
  right: 30px;
  top: 10px;
  color: #fff;
}

div.guide-accordion > ul > li > ul > li > ul > li > a::before {
  content: "\f0da";
  font-family:FontAwesome;
}

/* 第二階層を閉じる */
div.guide-accordion > ul > li > ul > li > ul  {
  display: none;
}



/*============================================================
 コンテンツ記事
============================================================*/
.contents-main h1 {
font-size: 1.8em;
margin: 1.0em 0;
line-height:1.2em;
text-align: center;
}
.contents-main h1:nth-of-type(n+2) { display: none;}

/* お知らせページCSS */
.notice-p {
border-bottom: 1px dotted #888;
padding-bottom: 10px;
}

.contents-main h2 {
font-size: 1.6em;
margin: 1.0em 0;
padding: 0.5em 0.8em 0.4em;
color: #333;
background: #e0efff;
border-radius: 3px;
}
.contents-main h3 {
font-size: 1.4em;
margin: 1.0em 0;
padding: 0.4em 0 0.3em 0.4em;
border-top: solid 1px #000;
border-bottom:
solid 1px #000;
color: #333;
}
.contents-main h4 {
font-size: 1.3em;
margin: 1.0em 0;
color: #333;
line-height: 1.2em;
border-bottom: 2px solid #eee;
padding-bottom: 3px;
}

.contents-main h4::before {
color: #06f !important;
content: "\f058" !important;
font-family: "FontAwesome",sans-serif !important /*FontAwesomeをフォント指定*/;
margin-right: 5px !important;
font-size: 1.2em !important;
}

.contents-main h5 {
font-size: 1.2em;
margin: 1.0em 0;
color: #000;
line-height: 1.2em;
border-left: 2px solid #06f;
padding: 0.4em 0 0.3em 0.5em;
}

.contents-main p {
max-width: 100%;
font-size: 1.0em;
margin-top: 0;
margin-bottom: 20px;
line-height: 1.7em;
}
.contents-main .lead {
max-width:100%;
font-size: 1.2em;
color: #666;
line-height: 1.5em;
}
.contents-main img {max-width:100%;height: auto;}

.contents-main a{ color:#1e50a2; font-weight: bold;}
.contents-main a:hover {color: #F00;text-decoration:none;}
.contents-main a.txt-link {font-size: 1.2em;display: block;}

.contents-main a.txt-link::after {
font-family: FontAwesome /*FontAwesomeをフォント指定*/;
margin-left: 3px;
content: '\f08e' ;
}

.border-waku {
border: 1px solid #ccc;
padding: 15px 0 5px 2em;
border-radius: 3px;
}

/*関連販売のテキストリンク＜主に新品商材＞*/
a.kanren-link {font-size: 1.2em;display: block;margin: 0 20px 30px 20px;padding:10px; background-color:#09f; color:#fff !important;text-align: center;text-decoration: none;border-radius: 10px}
a.kanren-link::after {
	font-family: FontAwesome /*FontAwesomeをフォント指定*/;
	margin-left: 3px;
	content: '\f08e' ;
}
a.kanren-link:hover {background-color:#03f;}

/*関連販売のテキストリンク＜主に中古商材＞*/
a.kanren-link-tyuko {font-size: 1.2em;display: block;margin: 0 20px 30px 20px; padding:10px; background-color:#eee; color:#222;text-align: center;text-decoration: none; border-radius: 10px}
a.kanren-link-tyuko::after {
	font-family: FontAwesome /*FontAwesomeをフォント指定*/;
	margin-left: 3px;
	content: '\f08e' ;
}
a.kanren-link-tyuko:hover {background-color:#ffe100;}

/*関連販売のテキストリンク＜緑色＞*/
.golink { background-color: #6c0 !important;}
.golink:hover { background-color: #3a0 !important;}


/*============================================================
 テーブル
============================================================*/
/* スクロール版 */
.tbl-scroll-box {
 width: auto;
 overflow: auto;
 -webkit-scrollbar;
 -webkit-scrollbar-trac;
 -webkit-scrollbar-thumb;
 padding: 15px 0;
}

table.tbl-scroll {
  border-top: 1px solid #999;
  border-right: 1px solid #999;
  border-collapse: collapse;
  width: 100%;
  min-width: 400px;
  text-align: center;
  margin-bottom:15px;
  margin-top:-15px;
}
table.tbl-scroll th,
table.tbl-scroll td {
  border-left: 1px solid #999;
  border-bottom: 1px solid #999;
  padding: 10px;
}
table.tbl-scroll th {
  background-color: #e0efff;
}

table.tbl-scroll td img {
 max-width: 80%;
}

table.tbl-scroll tbody tr:nth-of-type(even) td{ background-color: #f6f6f6;}

/* 縦に分割版 */
table.tbl-tate { border-collapse: collapse; width: 100%; margin-bottom:15px;}

table.tbl-tate th,
table.tbl-tate td { padding: 10px; border: 1px solid #999;}
table.tbl-tate th { background-color: #e0efff; text-align: center; width: 30%;}


@media screen and (max-width: 400px) {
.tbl-scroll-box {
 width: 100%;
 overflow: auto;
 -webkit-scrollbar;
 -webkit-scrollbar-trac;
 -webkit-scrollbar-thumb;
 padding: 15px 0;
}
table.tbl-scroll { width: 100%; }
table.tbl-scroll thead {  }
table.tbl-scroll tbody {  }
table.tbl-scroll th,  table.tbl-scroll td {  }
table.tbl-scroll tr {  }
table.tbl-scroll tbody tr {  }

table.tbl-tate { border-top: 1px solid #999;}
table.tbl-tate td { display: block; text-align: center;}
table.tbl-tate th { display: block; border-top: none; border-bottom: none; width: auto;}

}




/*============================================================
 引用
============================================================*/

.topics-link a {
	margin: 5px 10px 20px;
	padding: 20px 20px 10px;
	border: 1px solid #ddd;
	display: block;
}

.topics-link a:hover {opacity: 0.5;background-color:#eee;border: 1px solid #888;}

.topicsLink-image {float: left; width: 30%;  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;display: block;}
.topicsLink-txt  {float: right; width: 70%;font-size: 1.5em; box-sizing: border-box;display: block;}


blockquote {
	font-size: 15px;
	position: relative;
	padding: 30px;
	border-radius: 5px;
	background: #F3F3F3;
	line-height: 2.3em;
}

blockquote::before, blockquote::after {
	position: absolute;
	font-family:"FontAwesome";
	font-size: 4em;
	opacity: .05;
	display:inline-block;
}

blockquote::before {content:"\f10d";top: 9px;left: 0;}

blockquote::after {content:"\f10e";bottom: 5px;right: 0;}

.contents-main cite {font-style: italic;font-size: 0.9em;text-align: right;padding-top: 5px;display: block;}

.contents-main cite a {font-weight: normal;}

/*========================================================================================================================
  商品枠
========================================================================================================================*/

/***** product-frame：外枠 *****/
.product-1box { border: solid 1px #ccc;margin-bottom: 10px;padding: 12px 15px; position: relative;}
.product-2box, .product-3box, .product-4box, .product-5box {display: flex;}
.ipad .product-2box, .ipad .product-3box, .ipad .product-4box, .ipad .product-5box {display:box;}

.product-2box_SR, .product-3box_SR, .product-4box_SR, .product-5box_SR {display: flex;}
.ipad .product-2box_SR, .ipad .product-3box_SR, .ipad .product-4box_SR .ipad .product-5box_SR {display:box;}

.product-1box::after, .product-2box::after, .product-3box::after, .product-4box::after, .product-5box::after {content: ""; display: block; clear: both;}



/***** 商品枠 *****/
.product-waku {box-sizing: border-box; border: solid 1px #ccc;margin: 0px 3px 10px 0px;padding:22px 15px 12px; position: relative;}
.product-waku:last-child { margin-right: 0px;}

/* 1枠 */
.product-1box .product-waku { width: 100%; border: 0px; margin: 0px; padding: 0px; position: static;}

/* 2枠 */
.product-2box .product-waku {width: calc( 50% - 1px); float:left;}

/* 3枠 */
.product-3box .product-waku { width: calc( 33.33% - 1px);float:left;}

/* 4枠 */
.product-4box .product-waku { width: calc( 25% - 2px); border: 0; padding: 5px; border-bottom: 2px dotted #ccc; float:left;}

/* 5枠 */
.product-5box .product-waku { width: calc( 20% - 2px); border: 0; padding: 5px; border-bottom: 2px dotted #ccc; float:left;}


/***** 商品枠 4/5枠 *****/
.product-4box .product-waku .list-maker_SP, .product-5box .product-waku .list-maker_SP { height: 1.3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 0;}

.product-4box .product-waku .list-name_SP, .product-5box .product-waku .list-name_SP {
 font-size: 12px;
 height: 3.9em;
 overflow: hidden;
 position: relative;
 word-break: break-all;
}

.product-4box .product-waku .list-name_SP::before, .product-5box .product-waku .list-name_SP::before {
 background: #fff;
 position: absolute;
 content: "…";
 top: 2.6em;
 right: 0;
}
.product-4box .product-waku .list-name_SP::after, .product-5box .product-waku .list-name_SP::after {
 background: #fff;
 position: absolute;
 content: "";
 height: 100%;
 width: 100%;
}

.product-4box .product-waku .result-product-info-price_SP, .product-5box .product-waku .result-product-info-price_SP {font-size: 14px;}
.product-4box .product-waku .result-product-info-taxdisp_SP, .product-5box .product-waku .result-product-info-taxdisp_SP { margin-bottom: 0; line-height: 110%;}
.product-4box .product-waku .result-product-info-price_SP span, .product-5box .product-waku .result-product-info-price_SP span {font-size: 0.8em;}
.product-4box .product-waku .result-product-info-point_SP, .product-5box .product-waku .result-product-info-point_SP { padding-bottom: 5px; font-size: 12px;}
.product-4box .product-waku .result-product-info-point_SP span, .product-5box .product-waku .result-product-info-point_SP span { width: 4.1em; height: 1.1em; overflow: hidden; display: inline-block;}

.product-4box .product-waku .product-info-icon_SP, .product-5box .product-waku .product-info-icon_SP { display: none;}
.product-4box .product-waku .product-info-comment_SP, .product-5box .product-waku .product-info-comment_SP { display: none;}
.product-4box .product-waku .sale_date_SP, .product-5box .product-waku .sale_date_SP { display: none;}

.product-4box .product-waku .favoriteButton, .product-5box .product-waku .favoriteButton { width: calc( 100% - 10px);}


/* リスト表示 */
table.product-list { border-top: 1px solid #999; border-right: 1px solid #999; border-collapse: collapse; width: 100%; min-width: 670px; margin-bottom:15px; margin-top:-15px; table-layout: fixed;}
table.product-list th, table.product-list td { border-left: 1px solid #999; border-bottom: 1px solid #999; padding: 10px;}
table.product-list th { background-color: #eeeeee; text-align: center;}

table.product-list th:nth-of-type(1) { width: 15%;}	/* 商品画像 */
table.product-list th:nth-of-type(2) { width: 55%;}	/* 商品名　 */
table.product-list th:nth-of-type(3) { width: 12%;}	/* 販売価格 */
table.product-list th:nth-of-type(4) { width: 9%;}	/* 商品番号 */
table.product-list th:nth-of-type(5) { width: 9%;}	/* 在　　庫 */

table.product-list tr > td:nth-of-type(4) { font-size: 0.8em;}	/* 商品番号 */


/***** 商品枠 ランキング表示 *****/
.ranking div.product-waku div.waku-img::after {
	position: absolute;
	content: '';
	top: 10px;
	left: 10px;
	display: block;
	width: 100%;
	height: 250px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: top left;
}
.ranking div.product-waku:nth-child(1) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank1.png);}
.ranking div.product-waku:nth-child(2) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank2.png);}
.ranking div.product-waku:nth-child(3) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank3.png);}
.ranking div.product-waku:nth-child(4) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank4.png);}
.ranking div.product-waku:nth-child(5) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank5.png);}
.ranking div.product-waku:nth-child(6) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank6.png);}
.ranking div.product-waku:nth-child(7) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank7.png);}
.ranking div.product-waku:nth-child(8) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank8.png);}
.ranking div.product-waku:nth-child(9) div.waku-img::after { background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank9.png);}
.ranking div.product-waku:nth-child(10) div.waku-img::after {background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank10.png);}

.rank6-10 div.product-waku:nth-child(1) div.waku-img::after {background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank6.png);}
.rank6-10 div.product-waku:nth-child(2) div.waku-img::after {background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank7.png);}
.rank6-10 div.product-waku:nth-child(3) div.waku-img::after {background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank8.png);}
.rank6-10 div.product-waku:nth-child(4) div.waku-img::after {background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank9.png);}
.rank6-10 div.product-waku:nth-child(5) div.waku-img::after {background-image: url(https://www.sofmap.com/ec/topics/common_parts/rank10.png);}


/*** 見出し ***/
.product-midashi { background-color: rgba( 0, 0, 0, 0.5); position: absolute; top: 0px; left: 0; width: calc( 100% - 10px); padding: 3px 5px; text-align: center; color: #fff; z-index: 99;}
.product-1box .product-midashi { display: none;}

/*** 画像とスペック情報 ***/
.waku1-img, .waku-img {text-align: center; margin-top: 10px;}
.waku-img img{ width: 100%; max-width: 160px; min-width: 40px;}
.product-1box .waku-img img{ width: 100%; max-width: 250px;}

.waku-img a{ padding: 0px;}
.waku1-img a:hover, .waku-img a:hover {opacity: 0.5;}
.waku1-spec, .waku-spec {text-align: left;}
.waku-spec {text-align: left; margin-bottom: 60px;}



/*** 画像とスペック情報を横に並べる ***/
.waku1-img {float:left;width:30%;}
.waku1-spec {float:right;width:70%;text-align: left;position: relative; padding-bottom: 60px;}

.product-1box .waku-img {float:left; width:30%; margin-right: 15px;}
.product-1box .waku-spec {float:right;width:calc( 70% - 15px);text-align: left;}

/* メーカー名 */
.list-maker_SP {font-size:12px; margin-bottom: 5px;line-height: 1.3em;}
.list-maker_SP a {color: #06F;font-weight: normal; margin-bottom: 5px;}
.list-maker_SP a:hover {color:#06F;}

/* 商品名 */
.list-name_SP {margin-bottom: 5px;line-height: 1.3em;}
.list-name_SP a {color: #06F;font-weight: normal; padding: 0px;}
.list-name_SP a:hover {color:#06F; text-decoration: underline;}

/* 税抜価格 */
.result-product-info-price_SP{font-weight:bold;color:#f00;font-size:16px;  }
.result-product-info-price_SP span {font-weight:normal;padding-left: 2px;font-size: small;}

/* 税込価格 */
.result-product-info-taxdisp_SP{color:#444;font-size:11px;margin-bottom: 5px;}

/* ポイントサービス */
.result-product-info-point_SP {font-weight:bold;color:#F90;line-height: 1.3em;margin-bottom: 5px;}
.result-product-info-point_SP span {font-weight:normal;color:#F90;}

/* 発売日情報 */
.sale_date_SP {font-size:12px; margin-bottom: 5px;line-height: 1.3em;}

/* 商品ステータス */
.product-info-icon_SP{color:#6c0;font-size:12px;margin-bottom: 5px;font-weight: bold;}

/* 商品コメント */
.product-info-comment_SP{color:#777;text-align: left;line-height: 1.5em;}

/*** カート＆削除ボタン ***/

.favoriteButton::after {content: ""; display: block; clear: both;}
.product-waku .favoriteButton {position: absolute; bottom: 12px; width: calc( 100% - 30px);}
.product-1box .favoriteButton { width: 35%; left: calc( 30% + 20px);right:auto }/* 20180227修正 */
.ie .favoriteButton { float: right; position: static;} /*IE用*/

.ie .product-1box .basket-button {position: static !important;}


/* 商品詳細ボタン */
.detail-Button100 a, .cart-inButton100 a, .cart-inButton100 input, .cart-inButton100 button, .reservButton100 a, .not_sale_icon100, .sold_out_icon100, .sold_out2_icon100, .junbi_icon100 {
 display: block;
 color: #fff !important;
 text-decoration: none;
 float: left;
 width: 100%;
 font-size: 16px;
 font-weight: normal;
 text-align: center;
 margin: 5px 0px;
 padding: 10px 0px;
 border-radius: 5px;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 background: #09f;
 box-shadow: 0px 3px 0px #06c;
 -webkit-box-shadow: 0px 3px 0px #06c;
 -moz-box-shadow: 0px 3px 0px #06c;
 -ms-box-shadow: 0px 3px 0px #06c;
 -o-box-shadow: 0px 3px 0px #06c;
 border: 1px solid #06c;
 text-shadow: 1px 1px 1px #06c;
}
.detail-Button100 a::before { font-family: FontAwesome;
 padding-right: 3px;
 content: '\f061';
}
.detail-Button100 a:hover {cursor:pointer;
 opacity: 0.5;
 font-weight: normal;
 color: #fff;
}


/* カートに入れる＆予約するボタン */
.cart-inButton100 a, .cart-inButton100 input, .cart-inButton100 button, .reservButton100 a {
 background: #6c0;
 box-shadow: 0px 3px 0px #390;
 -webkit-box-shadow: 0px 3px 0px #390;
 -moz-box-shadow: 0px 3px 0px #390;
 -ms-box-shadow: 0px 3px 0px #390;
 -o-box-shadow: 0px 3px 0px #390;
 border-color: #390;
 text-shadow: 1px 1px 1px #390;
}
.cart-inButton100 a::before, .cart-inButton100 input::before, .cart-inButton100 button::before {font-family: FontAwesome;
 padding-right: 3px;
 content: '\f07a';
}
.cart-inButton100 a:hover, .cart-inButton100 input:hover, .cart-inButton100 button:hover {
 cursor:pointer;
 background:#3a0;
 -webkit-box-shadow: 0px 3px 0px #060;
 -moz-box-shadow: 0px 3px 0px #060;
 -ms-box-shadow: 0px 3px 0px #060;
 -o-box-shadow: 0px 3px 0px #060;
 box-shadow: 0px 3px 0px #060;
 border: 1px solid #060;
 text-shadow: 1px 1px 1px #060;
 font-weight: normal;
 color: #fff;
}



/* 注文不可ボタン */
.not_sale_icon100 {
 background: #eee;
 border-color: #adabab;
 color: #222;
 box-shadow: none;
 text-shadow: none;
}

/* 売り切れボタン */
.sold_out_icon100 {
 background: #f90;
 border-color: #f63;
 box-shadow: none;
 text-shadow: none;
}

/* 完売御礼ボタン */
.sold_out2_icon100 {
 background: #eee;
 border-color: #adabab;
 color: #333;
 box-shadow: none;
 text-shadow: none;
}

/* 準備中ボタン */
.junbi_icon100 {
 background: #90f;
 border-color: #90f;
 box-shadow: none;
 text-shadow: none;
}




/* 削除するボタン */
.trashButton a {
 display: block;
 color:#333;
 text-decoration:
 none;
 float:right;
 width:19%;
 background:#eee;
 font-size:16px;
 font-weight:normal;
 text-align:center;
 margin:5px 0px;
 padding:10px 0px;
 border-radius: 5px;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 -moz-box-shadow: 0px 3px 0px #adabab;
 -ms-box-shadow: 0px 3px 0px #adabab;
 -o-box-shadow: 0px 3px 0px #adabab;
 box-shadow: 0px 3px 0px #adabab;
 border: 1px solid #adabab;
}
.trashButton a::before {
font-family: FontAwesome /*FontAwesomeをフォント指定*/;
padding-right: 3px;
content: '\f014';
}
.trashButton a:hover {cursor:pointer;
 opacity: 0.5;
color: #333;
}





/*　IEでの高さ調整　*/
.ie .list-name_SP{ height: 3.9em; overflow: hidden;}
.ie .product-info-comment_SP{ height: 4.5em; overflow: hidden;}
.ie .product-info-icon_SP {min-height: 19px;}
.ie .result-product-info-point_SP {min-height: 1.3em;}

/*========================================================================================================================
  商品枠　検索結果 _SR
========================================================================================================================*/

/***** product-frame：外枠 *****/
.product-1box_SR { border: solid 1px #ccc;margin-bottom: 10px;padding: 12px 15px; position: relative;}
.product-2box_SR, .product-3box_SR, .product-4box_SR {display: flex;}
.ipad .product-2box_SR, .ipad .product-3box_SR, .ipad .product-4box_SR {display:box;}

.product-1box_SR::after, .product-2box_SR::after, .product-3box_SR::after, .product-4box_SR::after, .product-5box_SR::after {content: ""; display: block; clear: both;}

/***** 商品枠 *****/
.product-waku_SR {box-sizing: border-box; margin: 0px 3px 10px 0px;padding:22px 15px 12px; position: relative;}

/* 1枠 */
.product-1box_SR .product-waku_SR { width: 100%; border: 0px; margin: 0px; padding: 0px; position: static;}

/* 2枠 */
.product-2box_SR .product-waku_SR {width: 49%; float:left;}

/* 3枠 */
.product-3box_SR .product-waku_SR { width: 32.5%;float:left;}

/* 4枠 */
.product-4box_SR .product-waku_SR { width: 24%;float:left;}

/* 5枠 */
.product-5box_SR .product-waku_SR { width: 19.3%;float:left; padding:20px 5px 3px;}

/* リスト表示 */
table.product-list_SR { border-top: 1px solid #999; border-right: 1px solid #999; border-collapse: collapse; width: 100%; margin-bottom:15px; margin-top:-15px;}
table.product-list_SR th, table.product-list td { border-left: 1px solid #999; border-bottom: 1px solid #999; padding: 10px;}
table.product-list_SR th { background-color: #eeeeee; text-align: center;}
table.product-list_SR td img { max-width: 100%; min-width: 80px;}


/*** 見出し ***/
.product-midashi_SR { background-color: rgba( 0, 0, 0, 0.5); position: absolute; top: 0px; left: 0; width: calc( 100% - 10px); padding: 3px 5px; text-align: center; color: #fff; z-index: 99;}
.product-1box_SR .product-midashi_SR { display: none;}

/*** 画像とスペック情報 ***/
.waku1-img_SR, .waku-img_SR {text-align: center; margin-top: 10px;}
.waku-img_SR img{ width: 160px; min-width: 40px;}
.product-1box_SR .waku-img_SR img{ width: 250px;}

.waku-img_SR a{ padding: 0px;}
.waku1-img_SR a:hover, .waku-img a:hover {opacity: 0.5;}
.waku1-spec_SR, .waku-spec_SR {text-align: left;}
.waku-spec_SR {text-align: left;}



/*** 画像とスペック情報を横に並べる ***/
.waku1-img_SR {float:left;width:30%;}
.waku1-spec_SR {float:right;width:70%;text-align: left;position: relative;}

.product-1box_SR .waku-img_SR {float:left; width:30%; margin-right: 15px;}
.product-1box_SR .waku-spec_SR {float:right;width:calc( 70% - 15px);text-align: left;}

/* メーカー名 */
.list-maker_SP_SR {font-size:12px; margin-bottom: 5px;line-height: 1.3em;}
.list-maker_SP_SR a {color: #06f;font-weight: normal; margin-bottom: 5px;}
.list-maker_SP_SR a:hover {color:#06f;}

/* 商品名 */
.list-name_SP_SR {margin-bottom: 5px;line-height: 1.3em;}
.list-name_SP_SR a {color: #06F;font-weight: normal; padding: 0px;}
.list-name_SP_SR a:hover {color:#06f; text-decoration: underline;}

/* 分類名 */
.product_detail_medium_category_SR {font-size: 12px; color: #999;font-weight: normal;line-height: 1.3em;}

/* 税抜価格 */
.result-product-info-price_SP_SR{font-weight:bold;color:#f00;font-size:16px;text-align: center}
.result-product-info-price_SP_SR span {font-weight:normal;padding-left: 2px;font-size: 12px;}

/* 税込価格 */
.result-product-info-taxdisp_SP_SR {color:#444;font-size:11px;margin-bottom: 5px;text-align: center}

/* ポイントサービス */
.result-product-info-point_SP_SR {font-weight:bold;color:#f90;line-height: 1.3em;text-align: center}
.result-product-info-point_SP_SR span {font-weight:normal;color:#f90;font-size: 12px}

/* 発売日 */
.result-product-ReleaseDate_SR {font-size:12px;font-weight:normal;color:#333;line-height: 1.3em;margin-bottom: 5px;;text-align: center}

/* 商品ステータス */
.product-info-icon_SP_SR {color:#6c0;font-size:12px;margin-bottom: 5px;font-weight: bold;text-align: center}

/* 商品コメント */
.product-info-comment_SP_SR {color:#777;text-align: left;line-height: 1.5em;}



/*========================================================================================================================
  セール枠
========================================================================================================================*/
/***** sale-frame：外枠 *****/
.sale-1box, .sale-2box, .sale-3box, .sale-4box, .sale-5box, .sale-etc {margin: 0 0 15px; padding: 0;}

.sale-1box::after, .sale-2box::after, .sale-3box::after, .sale-4box::after, .sale-5box::after,.sale-etc::after {content: ""; display: block; clear: both}

/***** 各セール枠 *****/
/* 1枠 */
.sale-waku1  {position: relative;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
border: solid 1px #ccc;margin: 0 5px 10px 0;padding:3px 5px; float:left; display: block;
width: 100%;
}

/* 2枠 */
.sale-waku2  {position: relative;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
border: solid 1px #ccc;margin: 0 5px 10px 0;padding:3px 5px; float:left; display: block;
width: 49.1%;
}

/* 3枠 */
.sale-waku3  {position: relative;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
border: solid 1px #ccc;margin: 0 5px 10px 0;padding:3px 5px; float:left; display: block;
width: 32.4%;
}

/* 4枠 */
.sale-waku4  {position: relative;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
border: solid 1px #ccc;margin: 0 5px 10px 0;padding:3px 5px; float:left; display: block;
width: 24.1%;
}

  /* 5枠 */
.sale-waku5  {position: relative;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
border: solid 1px #ccc;margin: 0 5px 10px 0;padding:3px 5px; float:left; display: block;
width: 19.1%;
}

.sale-waku1:hover, .sale-waku2:hover, .sale-waku3:hover, .sale-waku4:hover, .sale-waku5:hover {cursor:pointer;opacity: 0.8;}

.sale-waku1 .category-title, .sale-waku2 .category-title, .sale-waku3 .category-title, .sale-waku4 .category-title, .sale-waku5 .category-title
{
position: absolute;bottom: 0;left: 0;
width: 100%;text-align: center;font-size: 12px;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
padding: 5px 3px;background-color: rgba(0,0,0,0.6);color: #fff;font-weight: normal;}

a .banner-img {max-width: 100% ;height: auto ;display: block;margin:0 auto;}
a:hover .banner-img {opacity: 0.5;}


/*========================================================================================================================
  説明枠
========================================================================================================================*/

.setumei-box{margin: 0;padding: 0;}
.setumei-box .product-waku{ border: 0; margin: 0;}/*** 商品枠を組み込んだ場合 ***/

.setumei-box .setumei-wakuRight{border: solid 1px #ccc; margin-bottom:10px; padding:10px;}
.setumei-box .setumei-wakuLeft{border: solid 1px #ccc; margin-bottom:10px; padding:10px;}

/*** 1枠と2枠のクリア処理 ***/
.setumei-box .setumei-wakuRight::after, .setumei-wakuLeft::after {content: ""; display: block; clear: both;}


/*** 写真2割とテキスト8割の場合 ***/
.setumei-box .waku-leftImg20 { float:left; width: calc(20% - 5px); text-align: center; margin-right: 10px;}
.setumei-box .waku-rightSpec80 { float:right; width: calc(80% - 5px); text-align: left;}

.setumei-box .waku-rightImg20 { float:right; width: calc(20% - 5px); text-align: center; margin-left: 10px;}
.setumei-box .waku-leftSpec80 { float:left; width: calc(80% - 5px); text-align: left;}

/*** 写真3割とテキスト7割の場合 ***/
.setumei-box .waku-leftImg { float:left; width: calc(30% - 5px); text-align: center; margin-right: 10px;}
.setumei-box .waku-rightSpec { float:right; width: calc(70% - 5px); text-align: left;}

.setumei-box .waku-rightImg { float:right; width: calc(30% - 5px); text-align: center; margin-left: 10px;}
.setumei-box .waku-leftSpec { float:left; width: calc(70% - 5px); text-align: left;}

/*** 写真4割 テキスト6割の場合 ***/
.setumei-box .waku-leftImg40 { float:left; width: calc(40% - 5px); text-align: center; margin-right: 10px;}
.setumei-box .waku-rightSpec60 { float:right; width: calc(60% - 5px); text-align: left;}

.setumei-box .waku-rightImg40 { float:right; width: calc(40% - 5px); text-align: center; margin-left: 10px;}
.setumei-box .waku-leftSpec60 { float:left; width: calc(60% - 5px); text-align: left;}

/*** 写真6割 テキスト4割の場合 ***/
.setumei-box .waku-leftImg60 { float:left; width: calc(60% - 5px); text-align: center; margin-right: 10px;}
.setumei-box .waku-rightSpec40 { float:right; width: calc(40% - 5px); text-align: left;}

.setumei-box .waku-rightImg60 { float:right; width: calc(60% - 5px); text-align: center; margin-left: 10px;}
.setumei-box .waku-leftSpec40 { float:left; width: calc(40% - 5px); text-align: left;}

/*** 写真5割 テキスト5割の場合 ***/
.setumei-box .waku-leftImg50 { float:left; width: calc(50% - 5px); text-align: center; margin-right: 10px;}
.setumei-box .waku-rightSpec50 { float:right; width: calc(50% - 5px); text-align: left;}

.setumei-box .waku-rightImg50 { float:right; width: calc(50% - 5px); text-align: center; margin-left: 10px;}
.setumei-box .waku-leftSpec50 { float:left; width: calc(50% - 5px); text-align: left;}


/*========================================================================================================================
  アコーディオン説明枠
========================================================================================================================*/
div.contents-accordion {
	width: 98%;
	margin: 5px auto;
}

div.contents-accordion > a.toggle{
	display: block;
	color: #333;
	font-size: 16px;
	text-decoration: none;
	background-color: #eee;
	cursor: pointer;
	position: relative;
	padding: 10px !important;
	border-radius: 5px;
}
div.contents-accordion > a.toggle:hover {
	background-color: #9cf !important;
	color: #333 !important;
}
div.contents-accordion > a.toggle::before {
	content: "\f0fe";
	font-family: FontAwesome;
	color: #aaa !important;
	margin-right: 10px;
}

div.contents-accordion > a.toggle.active::before {
	content: "\f146";
	font-family: FontAwesome;
}

div.contents-accordion > a.toggle::after{
	font-size: 16px;
	position: absolute;
	right: 10px;
	top: 10px;
	color: #fff !important;
	content: "\f078";
	font-family: FontAwesome;
}
div.contents-accordion > a.toggle.active::after {
	content: "\f077";
	font-family: FontAwesome;
}

div.contents-accordion > div, div.contents-accordion > p, div.contents-accordion > ul, div.contents-accordion > ol{
	margin: 5px 10px 20px;
	padding: 1em 1.5em;
	border: 1px solid #ddd;
	border-bottom: 2px solid #aaa;
	display: none;
}
div.contents-accordion > ul, div.contents-accordion > ol{ padding-left: 2.5em; padding-bottom: 0.5em;}


/*========================================================================================================================
  タブ切り替え説明枠
========================================================================================================================*/
section.tab-box { margin: 0; padding: 0; width: 100%; border-bottom: 2px dotted #ccc; margin-bottom: 30px;}

/*** タブ部分 ***/
section.tab-box .tab-group{ display: flex; justify-content: center; margin: 0; padding: 0;}
section.tab-box .tab{
 flex-grow: 1;
 list-style:none;
 cursor:pointer;
 padding: 5px 15px;
 margin: 0;
 border-bottom: 1px solid #ccc;
}

section.tab-box .tab.active-tab {
 transition: all 0.2s ease-out;
 border: 1px solid #ccc;
 border-bottom: none;
 border-radius: 5px 5px 0 0;
 color: #000;
}

/*** 表示コンテンツ枠 ***/
section.tab-box .panel-group{ margin-bottom: 15px;}
section.tab-box .panel-group.border {
	border: 1px solid #ccc;
	border-top: none;
	border-radius: 0 0 5px 5px;
}
section.tab-box .panel{ display:none; padding: 15px;}
section.tab-box .panel.show-panel{ display:block;}





/*========================================================================================================================
  動画枠
========================================================================================================================*/
.movie-wrap {
    position: relative;
    width: 96%;
    max-width: 800px;
    padding-bottom: 40%;
    padding-top: 30px;
    margin: 5px auto;
    height: 0;
    overflow: hidden;
}
.movie-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



/* テキスト枠 */
.topics-waku  {
border: 1px #ccc solid; margin-bottom: 20px;}

.topics-waku b {
font-size: 16px;
padding: 5px 10px 3px;
color: #000;
background: #eee;
display: block;
}

.topics-waku p { padding: 10px; line-height: 2em;}

/*========================================================================================================================
 横並び画像BOX
========================================================================================================================*/
.parallel_box {
 margin: 0 0 15px 10px;
 padding: 0;
 display: -webkit-box;
 display: -moz-box;
 display: -ms-box;
 display: -webkit-flexbox;
 display: -moz-flexbox;
 display: -ms-flexbox;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: flex;
 -webkit-box-lines: multiple;
 -moz-box-lines: multiple;
 -webkit-flex-wrap: wrap;
 -moz-flex-wrap: wrap;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
}

.parallel_box .contents-box {
 position: relative;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 margin: 0 10px 10px 0;
 padding: 26px 0 5px;
 display: inline-block;
 overflow: hidden;
}

.parallel_box.border .contents-box { border: #ccc 1px solid;}
.parallel_box.radius .contents-box { border-radius: 10px;}
.parallel_box.shadow .contents-box { box-shadow: 3px 3px 3px #ccc;}

.parallel_box.cell2 .contents-box { width: calc( 50% - 10px);}
.parallel_box.cell3 .contents-box { width: calc( 33.33% - 10px);}
.parallel_box.cell4 .contents-box { width: calc( 25% - 10px);}
.parallel_box.cell5 .contents-box { width: calc( 20% - 10px);}

.parallel_box .contents-box .title { padding: 0; background-color: rgba(0,0,0,0.6); color: #fff; text-align: center; position: absolute; top: 0; width: 100%;}

.parallel_box .contents-box .img-box { padding: 0; margin: 0 auto; text-align: center;}
.parallel_box .contents-box .img-box img{ max-width: 100%; vertical-align: bottom;}

.parallel_box .contents-box .txt-box { padding: 0 10px 5px; margin: 0 !important; color: #222;}



/*========================================================================================================================
  お知らせ枠
========================================================================================================================*/
/* お知らせ */
.news {padding: 20px; border: solid 5px #dddddd;}
.news h1{margin-top: 0; margin-bottom: 5px; font-size: 18px; color: #666;}
.news ul{margin: 0; padding: 0; list-style: none;}
.news li a {display: block;
 padding: 5px;
 border-bottom: dotted 2px #dddddd;
 color: #000000;
 font-size: 14px;
 text-decoration: none;}

.news li a:hover{background-color: #eeeeee;}
.news time {color: #888888; font-weight: bold;}
.news a::after{content: ""; display: block; clear: both;}
.news time {float: left; width: 60px;}
.news .text {float: none; width: auto; margin-left: 60px;}


/* SNSメニュー */
.follow ul {margin: 0; padding: 0; list-style: none;}
.follow li a{display: block;margin-bottom:10px;padding:10px ;border-radius: 4px;color: #fff; font-size:14px;text-decoration:none;}
.follow li a:hover {opacity: 0.8;}
.follow-tw {background-color: #63bafb;}
.follow-fb {background-color: #5288f7;}
.follow-gp {background-color: #f65d4a;}

.follow i{margin-right: 10px;font-size: 24px;vertical-align: middle;}


/* 補足説明 */
.follow-info{margin-top: 0; margin-bottom: 20px;padding: 10px;background-color: #dddddd;font-size: 14px;text-align: center;}

.follow-info { position: relative; background: #dddddd;}
.follow-info::after {top: 100%;left: 50%;border: solid transparent;content: " ";
height: 0;width: 0;position: absolute;border-color: rgba(221, 221, 221, 0);
border-top-color: #dddddd;border-width: 15px;margin-left: -15px;
}

/* SNSのシェアボタン */
.share  {margin-top: 40px;}

.share ul {margin: 0;
  padding: 0;
  list-style: none;}

.share li a {display: block;
  padding: 10px 5px;
  color: #ffffff;
  font-size: 14px;
  text-align: center;
  text-decoration: none;}

.share-tw {background-color: #55acee;}
.share-fb {background-color: #3b5998;}
.share-gp {background-color: #dd4b39;}

.share li a:hover {opacity: 0.8;}
.share ul::after {content: ""; display: block; clear: both;}
.share li {float: left; width: 33.3333%;}


/* floatクリア */
.clearfix {zoom:1;}
.clearfix::after {
  content: ""; 
  display: block; 
  clear: both;
}/*float解除*/


/*=== 蛍光テキスト装飾 ===*/
/* 蛍光イエロー */
.keikou_yellow {
background: linear-gradient(transparent 60%, #ff6 60%);font-weight: bold;
}
/* 蛍光ピンク */
.keikou_red {
background: linear-gradient(transparent 60%, #fb84b2 60%);font-weight: bold;
}
/* 蛍光ブルー */
.keikou_blue {
background: linear-gradient(transparent 60%, #6cf 60%);font-weight: bold;
}
/* 蛍光グリーン */
.keikou_green {
background: linear-gradient(transparent 60%, #6fc 60%);font-weight: bold;
}


/*=============================================================================================
 Plus CSS
===============================================================================================*/

/****************** margin ******************/
/* margin-all */
.mga0 {margin:0px !important;}
.mga5 {margin:5px !important;}
.mga10{margin:10px !important;}
.mga15{margin:15px !important;}
.mga20{margin:20px !important;}
.mga30{margin:30px !important;}
.mga40{margin:40px !important;}
.mga50{margin:50px !important;}

/* margin-top */
.mgt0 {margin-top:0px !important;}
.mgt5 {margin-top:5px !important;}
.mgt10{margin-top:10px !important;}
.mgt15{margin-top:15px !important;}
.mgt20{margin-top:20px !important;}
.mgt30{margin-top:30px !important;}
.mgt40{margin-top:40px !important;}
.mgt50{margin-top:50px !important;}

/* margin-left */
.mgl0 {margin-left:0px !important;}
.mgl5 {margin-left:5px !important;}
.mgl10{margin-left:10px !important;}
.mgl15{margin-left:15px !important;}
.mgl20{margin-left:20px !important;}
.mgl30{margin-left:30px !important;}
.mgl40{margin-left:40px !important;}
.mgl50{margin-left:50px !important;}

/* margin-bottom */
.mgb0 {margin-bottom:0px !important;}
.mgb5 {margin-bottom:5px !important;}
.mgb10{margin-bottom:10px !important;}
.mgb15{margin-bottom:15px !important;}
.mgb20{margin-bottom:20px !important;}
.mgb30{margin-bottom:30px !important;}
.mgb40{margin-bottom:40px !important;}
.mgb50{margin-bottom:50px !important;}

/* margin-right */
.mgr0 {margin-right:0px !important;}
.mgr5 {margin-right:5px !important;}
.mgr10{margin-right:10px !important;}
.mgr15{margin-right:15px !important;}
.mgr20{margin-right:20px !important;}
.mgr30{margin-right:30px !important;}
.mgr40{margin-right:40px !important;}
.mgr50{margin-right:50px !important;}

/****************** padding ******************/
/* padding-all */
.pda0 {padding:0px !important;}
.pda5 {padding:5px !important;}
.pda10{padding:10px !important;}
.pda15{padding:15px !important;}
.pda20{padding:20px !important;}
.pda30{padding:30px !important;}
.pda40{padding:40px !important;}
.pda50{padding:50px !important;}

/* padding-top */
.pdt0 {padding-top:0px !important;}
.pdt5 {padding-top:5px !important;}
.pdt10{padding-top:10px !important;}
.pdt15{padding-top:15px !important;}
.pdt20{padding-top:20px !important;}
.pdt30{padding-top:30px !important;}
.pdt40{padding-top:40px !important;}
.pdt50{padding-top:50px !important;}

/* padding-left */
.pdl0 {padding-left:0px !important;}
.pdl5 {padding-left:5px !important;}
.pdl10{padding-left:10px !important;}
.pdl15{padding-left:15px !important;}
.pdl20{padding-left:20px !important;}
.pdl30{padding-left:30px !important;}
.pdl40{padding-left:40px !important;}
.pdl50{padding-left:50px !important;}

/* padding-bottom */
.pdb0 {padding-bottom:0px !important;}
.pdb5 {padding-bottom:5px !important;}
.pdb10{padding-bottom:10px !important;}
.pdb15{padding-bottom:15px !important;}
.pdb20{padding-bottom:20px !important;}
.pdb30{padding-bottom:30px !important;}
.pdb40{padding-bottom:40px !important;}
.pdb50{padding-bottom:50px !important;}

/* padding-right */
.pdr0 {padding-right:0px !important;}
.pdr5 {padding-right:5px !important;}
.pdr10{padding-right:10px !important;}
.pdr15{padding-right:15px !important;}
.pdr20{padding-right:20px !important;}
.pdr30{padding-right:30px !important;}
.pdr40{padding-right:40px !important;}
.pdr50{padding-right:50px !important;}

/****************** width ******************/
.wauot{width:auto !important;}
.w100{width:100% !important;}
.w95 {width: 95% !important;}
.w90 {width: 90% !important;}
.w80 {width: 80% !important;}
.w70 {width: 70% !important;}
.w60 {width: 60% !important;}
.w50 {width: 50% !important;}
.w40 {width: 40% !important;}
.w30 {width: 30% !important;}
.w20 {width: 20% !important;}
.w10 {width: 10% !important;}

/****************** テキスト寄せ ******************/
.tac { text-align: center !important;}
.tar { text-align: right !important;}
.tal { text-align: left !important;}

/****************** 改行禁止 ******************/
.nobr { white-space: nowrap;}


/****************** ボーダーなし ******************/
.contents .noborder{ border-style: none !important;}
.contents .noborder-t{ border-top-style: none !important;}
.contents .noborder-b{ border-bottom-style: none !important;}
.contents .noborder-l{ border-left-style: none !important;}
.contents .noborder-r{ border-right-style: none !important;}

/****************** 文字サイズ 0.6/0.8/1.0/1.2/1.4/1.6/1.8/2.0 ******************/
.contents .fs06{ font-size: 0.6em !important;}
.contents .fs08{ font-size: 0.8em !important;}
.contents .fs10{ font-size: 1.0em !important;}
.contents .fs12{ font-size: 1.2em !important;}
.contents .fs14{ font-size: 1.4em !important;}
.contents .fs16{ font-size: 1.6em !important;}
.contents .fs18{ font-size: 1.8em !important;}
.contents .fs20{ font-size: 2.0em !important;}

/****************** 文字色　赤/白/灰/黒/青/黄色 ******************/
.contents .fc-blk{ color: black !important;}
.contents .fc-wht{ color: white !important;}
.contents .fc-gry{ color: gray !important;}
.contents .fc-red{ color: red !important;}
.contents .fc-yel{ color: yellow !important;}
.contents .fc-blu{ color: blue !important;}


/****************** 太文字/通常文字 ******************/
.contents .fw-bol{ font-weight: bold !important;}
.contents .fw-no{ font-weight: normal !important;}


/* ################################################################## 359px以下 ################################################################## */
@media screen and (max-width: 359px) {

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

/*============================================================
 コンテンツ記事
============================================================*/
/*** 見出し ***/
.contents-main h1 {font-size: 1.4em;}
.contents-main h2 {font-size: 1.2em;}
.contents-main h3 {font-size: 1.1em;}
.contents-main h4 {font-size: 1.0em;}
.contents-main h5 {font-size: 0.9em;padding: 0.3em;}
.contents-main .lead {font-size:0.9em;}
.contents-main p {font-size:0.9em;}


/*** リンクナビの1列化 ***/
.contents-main .mokuji-navi5 li, .contents-main .mokuji-navi4 li, .contents-main .mokuji-navi3 li, .contents-main .mokuji-navi2 li {width: 100%;}
.etc-navi .cell5 li,.etc-navi .cell4 li,.etc-navi .cell3 li,.etc-navi .cell2 li {width: calc( 100% - 12px);}

/*** リンクナビの2列化 ***/
.contents-main .mokuji-navi5.sp-cell2 li, .contents-main .mokuji-navi4.sp-cell2 li, .contents-main .mokuji-navi3.sp-cell2 li, .contents-main .mokuji-navi2.sp-cell2 li {width: 50%;}
.etc-navi .cell5.sp-cell2 li,.etc-navi .cell4.sp-cell2 li,.etc-navi .cell3.sp-cell2 li,.etc-navi .cell2.sp-cell2 li {width: calc( 50% - 12px);}

/*** リンクナビの3列化 ***/
.contents-main .mokuji-navi5.sp-cell3 li, .contents-main .mokuji-navi4.sp-cell3 li, .contents-main .mokuji-navi3.sp-cell3 li, .contents-main .mokuji-navi2.sp-cell3 li {width: 33.33%;}
.etc-navi .cell5.sp-cell3 li,.etc-navi .cell4.sp-cell3 li,.etc-navi .cell3.sp-cell3 li,.etc-navi .cell2.sp-cell3 li {width: calc( 33.33% - 12px);}

/*** リンクナビの4列化 ***/
.contents-main .mokuji-navi5.sp-cell4 li, .contents-main .mokuji-navi4.sp-cell4 li, .contents-main .mokuji-navi3.sp-cell4 li, .contents-main .mokuji-navi2.sp-cell4 li {width: 25%;}
.etc-navi .cell5.sp-cell4 li,.etc-navi .cell4.sp-cell4 li,.etc-navi .cell3.sp-cell4 li,.etc-navi .cell2.sp-cell4 li {width: calc( 25% - 12px);}

.product-midashi {font-size: 0.8em;}
.detail-Button100 a, .cart-inButton100 a, .cart-inButton100 input, .cart-inButton100 button, .reservButton100 a, .not_sale_icon100, .sold_out_icon100, .sold_out2_icon100, .junbi_icon100 {
 padding: 4px 0px; font-weight: normal;}
.cart-inButton100 a:hover, .cart-inButton100 input:hover, .cart-inButton100 button:hover, .trashButton a:hover {opacity:0.5;}

.cart-inButton a {float:left;width:79%; padding:8px 0px; font-weight:normal;}

.trashButton a {width:100%;padding:8px 0px;font-weight:normal;}


.inquiryForm {width:auto;font-size:10px;}


/*============================================================
 ナビゲーションメニュー
============================================================*/
.menu li a  {padding: 10px 7px; font-size: 11px;}


/*============================================================
 キャッチコピー
============================================================*/
.catch  {padding: 5px 10px; font-size: 12px;}


/*============================================================
 引用
============================================================*/
.topics-link {text-align: center;}
.topicsLink-image {width: 100%; float: none;}
.topicsLink-txt  {width: 100%;text-align: left; float: none;}

/***** 商品枠 *****/
.product-waku {width: 100% !important;float: none !important;overflow:hidden;}
.product-2box, .product-3box, .product-4box, .product-5box {display: block;}

.product-1box .waku-img {width:100%; float: none;}
.product-1box .waku-spec {width:100%; float: none; margin-top: 10px; min-height: 90px;}
.product-1box .waku-img img{ width: 100%; max-width: 160px;}
.product-1box .favoriteButton { width: calc( 100% - 30px); right: auto; left: auto;}/* 20180227修正 */

.product-waku .waku-img {width:30% !important; float:left !important; margin-right:0px !important; }
.product-waku .waku-spec {width:68% !important; float:right !important; margin-top: 10px; min-height: 90px;}

.list-name_SP {font-size: 0.8em;}
.result-product-info-price_SP{font-size: 0.8em;}
.result-product-info-point_SP {font-size: 0.7em;}
.result-product-info-point_SP span {font-size: 0.9em;}
.product-info-comment_SP {display:none;}

.active { white-space: normal !important; }
.product-waku .waku-img img { width: 100%; max-width: 120px !important; }
.kanbai div.waku-img::after { width: 120px !important;}/* 完売御礼表示 */

.osusume .waku-img img { width: 100%; max-width: 120px !important; }
a.kanren-link {font-size: 1.0em;}

/*** リスト商品枠 ***/
table.product-list_SR th, table.product-list td { padding: 5px;}
table.product-list th {	font-size: 0.8em;}

/*** ランキング商品枠 ***/
.ranking div.product-waku div.waku-img::after { width: 30%;}



/***** セール枠 *****/
.sale-waku1, .sale-waku2, .sale-waku3, .sale-waku4, .sale-waku5 {width: 100%;float: none; text-align: center;}

/* セール枠 スマホ時に縮小 */
.sale-etc .sale-waku2 , .sale-etc .sale-waku3 , .sale-etc .sale-waku4 , .sale-etc .sale-waku5{
float:left !important;
width:48% !important;
padding:0;
margin:6px 1%;
background-image: url("../../system_icon_sp/go_rightg.gif");
background-repeat: no-repeat;
background-position: right center;
border-radius: 2px;
}
.sale-etc .waku-img {
margin: 0;
}
.sale-etc .waku-img img {
display: none;
} 
.sale-etc .category-title {
float: left; 
position: static !important;
width: calc(100% - 25px);
background-color: #fff;
color: #06f;
text-align: left;
font-size: 11px;
line-height: 16px;
 height: 40px;
}
/*** 説明枠 ***/
.setumei-box .waku-leftImg, .setumei-box .waku-rightImg, 
.setumei-box .waku-leftImg20, .setumei-box .waku-rightImg20, 
.setumei-box .waku-leftImg40, .setumei-box .waku-rightImg40, 
.setumei-box .waku-leftImg60, .setumei-box .waku-rightImg60, 
.setumei-box .waku-leftImg80, .setumei-box .waku-rightImg80, 
.setumei-box .waku-leftImg50, .setumei-box .waku-rightImg50 {width:100%;text-align: center; float: none; margin: 0;}

.setumei-box .waku-rightSpec, .setumei-box .waku-leftSpec, 
.setumei-box .waku-rightSpec20, .setumei-box .waku-leftSpec20, 
.setumei-box .waku-rightSpec40, .setumei-box .waku-leftSpec40, 
.setumei-box .waku-rightSpec60, .setumei-box .waku-leftSpec60, 
.setumei-box .waku-rightSpec80, .setumei-box .waku-leftSpec80, 
.setumei-box .waku-rightSpec50, .setumei-box .waku-leftSpec50  {width:100%; float: none;}

section.tab-box .panel { padding: 5px 0;}


/*========================================================================================================================
  横並び画像BOX
========================================================================================================================*/
div.parallel_box .contents-box { width: calc( 100% - 10px) !important; float: none;}
div.parallel_box.sp-cell2 .contents-box { width: calc( 50% - 10px) !important; float: left;}





} /* ################################# 359px以下 ここまで */



/* ################################################################## 599px以下 ################################################################## */
@media screen and (min-width:360px) and (max-width: 599px) {

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

/*============================================================
 メインコンテンツ記事
============================================================*/
.contents-main h1 {font-size: 1.6em;}
.contents-main h2 {font-size: 1.4em;}
.contents-main h3 {font-size: 1.2em;}
.contents-main h4 {font-size: 1.1em;}
.contents-main h5 {font-size: 1.0em; padding: 0.3em;}
.contents-main .lead {font-size:1.0em;}
.contents-main p {font-size:1.0em;}


/*** リンクナビの1列化 ***/
.contents-main .mokuji-navi5 li, .contents-main .mokuji-navi4 li, .contents-main .mokuji-navi3 li, .contents-main .mokuji-navi2 li {width: 100%;}
.etc-navi .cell5 li,.etc-navi .cell4 li,.etc-navi .cell3 li,.etc-navi .cell2 li {width: calc( 100% - 12px);}

/*** リンクナビの2列化 ***/
.contents-main .mokuji-navi5.sp-cell2 li, .contents-main .mokuji-navi4.sp-cell2 li, .contents-main .mokuji-navi3.sp-cell2 li, .contents-main .mokuji-navi2.sp-cell2 li {width: 50%;}
.etc-navi .cell5.sp-cell2 li,.etc-navi .cell4.sp-cell2 li,.etc-navi .cell3.sp-cell2 li,.etc-navi .cell2.sp-cell2 li {width: calc( 50% - 12px);}

/*** リンクナビの3列化 ***/
.contents-main .mokuji-navi5.sp-cell3 li, .contents-main .mokuji-navi4.sp-cell3 li, .contents-main .mokuji-navi3.sp-cell3 li, .contents-main .mokuji-navi2.sp-cell3 li {width: 33.33%;}
.etc-navi .cell5.sp-cell3 li,.etc-navi .cell4.sp-cell3 li,.etc-navi .cell3.sp-cell3 li,.etc-navi .cell2.sp-cell3 li {width: calc( 33.33% - 12px);}

/*** リンクナビの4列化 ***/
.contents-main .mokuji-navi5.sp-cell4 li, .contents-main .mokuji-navi4.sp-cell4 li, .contents-main .mokuji-navi3.sp-cell4 li, .contents-main .mokuji-navi2.sp-cell4 li {width: 25%;}
.etc-navi .cell5.sp-cell4 li,.etc-navi .cell4.sp-cell4 li,.etc-navi .cell3.sp-cell4 li,.etc-navi .cell2.sp-cell4 li {width: calc( 25% - 12px);}

.product-midashi {font-size: 0.8em;}
.detail-Button100 a, .cart-inButton100 a, .cart-inButton100 input, .cart-inButton100 button, .reservButton100 a, .not_sale_icon100, .sold_out_icon100, .sold_out2_icon100, .junbi_icon100 {
 padding:4px 0px; font-weight:normal;}
.cart-inButton100 a:hover, .cart-inButton100 input:hover, .cart-inButton100 button:hover, .trashButton a:hover {opacity:0.5;}
.cart-inButton a {float:left;width:79%; padding:8px 0px; font-weight:normal;}
.trashButton a {width:100%;padding:8px 0px;font-weight:normal;}
.inquiryForm {width:auto;font-size:10px;}


/*============================================================
 ナビゲーションメニュー
============================================================*/
.menu li a  {padding: 10px 7px; font-size: 11px;}


/*============================================================
 キャッチコピー
============================================================*/
.catch  {padding: 5px 10px; font-size: 12px;}


/*============================================================
 引用
============================================================*/
.topics-link {text-align: center;}
.topicsLink-image {width: 100%; float: none;}
.topicsLink-txt  {width: 100%;text-align: left; float: none;}


/***** 商品枠 *****/
.product-2box, .product-3box, .product-4box, .product-5box {display: block;}
.product-waku {width: 100% !important;float: none !important; overflow: hidden;}

.product-1box .waku-img {width:100%;}
.product-1box .waku-spec {width:100%; margin-top: 10px; min-height: 90px;}
.product-1box .waku-img img{ width: 100%; max-width: 160px;}
.product-1box .favoriteButton { width: calc( 100% - 30px); right: auto; left: auto;}/* 20180227修正 */

.product-waku .waku-img {width:30% !important; float:left !important; margin-right:0px !important; }
.product-waku .waku-spec {width:68% !important; float:right !important; margin-top: 10px; min-height: 90px;}

.list-name_SP {font-size: 0.8em;}
.result-product-info-price_SP{font-size: 0.8em;}
.result-product-info-point_SP {font-size: 0.7em;}
.result-product-info-point_SP span {font-size: 0.9em;}
.product-info-comment_SP {display:none;}
.active { white-space: normal !important; }
.product-waku .waku-img img { width: 100%; max-width: 120px !important; }
.kanbai div.waku-img::after { width: 120px !important;}/* 完売御礼表示 */

.osusume .waku-img img { width: 100%; max-width: 120px !important; }
a.kanren-link {font-size: 1.0em;}

/*** リスト商品枠 ***/
table.product-list_SR th, table.product-list td { padding: 5px;}
table.product-list th {	font-size: 0.8em;}

/*** ランキング商品枠 ***/
.ranking div.product-waku div.waku-img::after { width: 30%;}



/***** セール枠 *****/
.sale-waku1, .sale-waku2, .sale-waku3, .sale-waku4, .sale-waku5 {width: 100%;float: none; text-align: center;}


/* セール枠 スマホ時に縮小 */
.sale-etc .sale-waku2 , .sale-etc .sale-waku3 , .sale-etc .sale-waku4 , .sale-etc .sale-waku5{
float:left !important;
width:48% !important;
padding:0;
margin:6px 1%;
background-image: url("../../system_icon_sp/go_rightg.gif");
background-repeat: no-repeat;
background-position: right center;
border-radius: 2px;
}
.sale-etc .waku-img {
margin: 0;
}
.sale-etc .waku-img img {
width: 40px;
height: 30px;
border: 1px solid #ccc;
float: left;
margin: 5px;
display: block;
} 
.sale-etc .category-title {
float: left; 
position: static !important;
width: calc(100% - 75px);
background-color: #fff;
color: #06f;
text-align: left;
font-size: 11px;
line-height: 16px;
}

/*** 説明枠 ***/
.setumei-box .waku-leftImg, .setumei-box .waku-rightImg, 
.setumei-box .waku-leftImg20, .setumei-box .waku-rightImg20, 
.setumei-box .waku-leftImg40, .setumei-box .waku-rightImg40, 
.setumei-box .waku-leftImg60, .setumei-box .waku-rightImg60, 
.setumei-box .waku-leftImg80, .setumei-box .waku-rightImg80, 
.setumei-box .waku-leftImg50, .setumei-box .waku-rightImg50 {width:100%;text-align: center; margin: 0;}

.setumei-box .waku-rightSpec, .setumei-box .waku-leftSpec, 
.setumei-box .waku-rightSpec20, .setumei-box .waku-leftSpec20, 
.setumei-box .waku-rightSpec40, .setumei-box .waku-leftSpec40, 
.setumei-box .waku-rightSpec60, .setumei-box .waku-leftSpec60, 
.setumei-box .waku-rightSpec80, .setumei-box .waku-leftSpec80, 
.setumei-box .waku-rightSpec50, .setumei-box .waku-leftSpec50  {width:100%;}

section.tab-box .panel { padding: 5px 0;}



/*========================================================================================================================
  横並び画像BOX
========================================================================================================================*/
div.parallel_box .contents-box { width: calc( 100% - 10px) !important; float: none;}
div.parallel_box.sp-cell2 .contents-box { width: calc( 50% - 10px) !important; float: left;}




} /* ################################# 599px以下 ここまで */


/* ################################################################## 670px以下 ################################################################## */
@media screen and (min-width:600px) and (max-width: 670px) {

.product-waku .waku-img {width:30% !important; float:left !important; margin-right:0px !important; }
.product-waku .waku-spec {width:68% !important; float:right !important; margin-top: 10px; min-height: 90px;}
.product-midashi {font-size: 0.8em;}

.list-name_SP {font-size: 0.8em;}
.result-product-info-price_SP{font-size: 0.8em;}
.result-product-info-point_SP {font-size: 0.7em;}
.result-product-info-point_SP span {font-size: 0.9em;}
.product-info-comment_SP {display:none;}
.active { white-space: normal !important; }
.product-waku .waku-img img { width: 100%; max-width: 120px !important; }
.detail-Button100 a, .cart-inButton100 a, .cart-inButton100 input, .cart-inButton100 button, .reservButton100 a, .not_sale_icon100, .sold_out_icon100, .sold_out2_icon100, .junbi_icon100 {
 padding:4px 0px; font-weight:normal;}
.kanbai div.waku-img::after { width: 120px !important;}/* 完売御礼表示 */

.osusume .waku-img img { width: 100%; max-width: 120px !important; }
a.kanren-link {font-size: 1.0em;}

/*** リスト商品枠 ***/
table.product-list_SR th, table.product-list td { padding: 5px;}
table.product-list th {	font-size: 0.8em;}


} /* ################################# 670px以下 ここまで */





/* ################################################################## 767px以下 ################################################################## */
@media screen and (min-width:600px) and (max-width: 767px) {

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



/***** 商品枠 *****/
.product-2box, .product-3box, .product-4box, .product-5box {display: block;}
.product-midashi {font-size: 0.8em;}

.product-waku {width: 100% !important;float: none !important;overflow:hidden;}
.product-waku .waku-img {width:30% !important; float:left !important; margin-right:0px !important; min-height: 212px; }
.product-waku .waku-spec {width:68% !important; float:right !important; margin-top: 10px; min-height: 90px;}
.product-waku .waku-img img{max-width: 150px;}
.kanbai div.waku-img::after { width: 120px !important;}/* 完売御礼表示 */

.product-1box .waku-img {width:100%;}
.product-1box .waku-spec {width:100%; margin-top: 10px; min-height: 90px;}
.product-1box .waku-img img{ width: 100%; max-width: 160px;}
.product-1box .favoriteButton { width: calc( 100% - 30px); right: auto; left: auto;}/* 20180227修正 */

/*** ランキング商品枠 ***/
.ranking div.product-waku div.waku-img::after { width: 30%;}


/***** セール枠 *****/
.sale-waku1, .sale-waku2, .sale-waku3, .sale-waku4, .sale-waku5 {width: 100%;float: none; text-align: center;}


/* セール枠 スマホ時に縮小 */
.sale-etc .sale-waku2 , .sale-etc .sale-waku3 , .sale-etc .sale-waku4 , .sale-etc .sale-waku5{
float:left !important;
width:48% !important;
padding:0;
margin:6px 1%;
background-image: url("../../system_icon_sp/go_rightg.gif");
background-repeat: no-repeat;
background-position: right center;
border-radius: 2px;
}
.sale-etc .waku-img {
margin: 0;
}
.sale-etc .waku-img img {
width: 40px;
height: 30px;
border: 1px solid #ccc;
float: left;
margin: 5px;
display: block;
}
.sale-etc .category-title {
float: left;
position: static !important;
width: calc(100% - 75px);
background-color: #fff;
color: #06f;
text-align: left;
font-size: 11px;
line-height: 16px;
}

/*========================================================================================================================
  横並び画像BOX
========================================================================================================================*/
div.parallel_box .contents-box { width: calc( 100% - 10px) !important; float: none;}
div.parallel_box.sp-cell2 .contents-box { width: calc( 50% - 10px) !important; float: left;}



} /* ################################# 767px以下 ここまで */


/* ################################################################## 768px以上 ################################################################## */
@media screen and (min-width:768px) and (max-width: 899px) {

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


/*============================================================
 BOX
============================================================*/


/* BOX4-1とBOX4-2を横に並べる設定 */
.box4::after {content: ""; display: block; clear: both;}
.box4-1 {float: left; width: 70%; padding-right: 35px;  -moz-box-sizing: border-box;  -webkit-box-sizing: border-box; box-sizing: border-box;}
.box4-2 {float: left; width: 30%}

/* BOX6-1、BOX6-2、BOX6-3を横に並べる設定 */
.box6::after {content: ""; display: block; clear: both;}
.box6-1 {float: left; width: 32%; margin-right: 2%;}
.box6-2 {float: left; width: 32%; margin-right: 2%;}
.box6-3 {float: left; width: 32%;}

.waku1-img img { width: 90%;}



} /* ################################# 768px以下 ここまで */



/* ################################################################## 900px以上 ################################################################## */
@media screen and (min-width:900px) and (max-width: 1189px) {

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


/*============================================================
 contents-Bodyとcontents-Leftを横に並べる設定
============================================================*/
.contents-inner::after {content: ""; display: block; clear: both;}

/* ボディのみ */
.contents-body100 {width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
/* 左カラムあり */
.contentsBody-right70 {float: right; width: 70%; padding-left: 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.contentsSide-left30 {float: left; width: 30%;}
/* 右カラムあり */
.contentsBody-left70 {float: left; width: 70%; padding-right: 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.contentsSide-right30 {float: right; width: 30%;}

} /* ################################# 900px以上 ここまで */



/* ################################################################## 1190px以上 ################################################################## */
@media screen and (min-width: 1190px) {

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


/*============================================================
 全体の横幅を固定
============================================================*/
.contents-inner, .footer-inner, .box3, .box4, .box6{
width: 1170px; margin-left: auto;  margin-right: auto;}

.waku1-img img { width: 100%;}

/*============================================================
 contents-Bodyとcontents-Leftを横に並べる設定
============================================================*/
.contents-inner::after {content: ""; display: block; clear: both;}
/* ボディのみ */
.contents-body100 {width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
/* 左カラムあり */
.contentsBody-right70 {float: right; width: 70%; padding-left: 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.contentsSide-left30 {float: left; width: 30%;}
/* 右カラムあり */
.contentsBody-left70 {float: left; width: 70%; padding-right: 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.contentsSide-right30 {float: right; width: 30%;}


} /* ################################# 1190px以上 ここまで */






/* ################### iPhone専用 ################### */

/***** 商品枠 *****/
.iphone .product-2box, .iphone .product-3box, .iphone .product-4box .product-5box {display: block;}
.iphone .product-waku {width: 100% !important;float: none !important;}

/***** セール枠 *****/
.iphone .sale-waku1, .iphone .sale-waku2, .iphone .sale-waku3, .iphone .sale-waku4, .iphone .sale-waku5 {width: 100%;float: none; text-align: center;}

/*** 説明枠 ***/
.iphone .setumei-box .waku-leftImg, .iphone .setumei-box .waku-rightImg, 
.iphone .setumei-box .waku-leftImg20, .iphone .setumei-box .waku-rightImg20, 
.iphone .setumei-box .waku-leftImg40, .iphone .setumei-box .waku-rightImg40, 
.iphone .setumei-box .waku-leftImg60, .iphone .setumei-box .waku-rightImg60, 
.iphone .setumei-box .waku-leftImg80, .iphone .setumei-box .waku-rightImg80, 
.iphone .setumei-box .waku-leftImg50, .iphone .setumei-box .waku-rightImg50 {width:100%;text-align: center; margin: 0;}

.iphone .setumei-box .waku-rightSpec, .iphone .setumei-box .waku-leftSpec, 
.iphone .setumei-box .waku-rightSpec40, .iphone .setumei-box .waku-leftSpec40, 
.iphone .setumei-box .waku-rightSpec60, .iphone .setumei-box .waku-leftSpec60, 
.iphone .setumei-box .waku-rightSpec80, .iphone .setumei-box .waku-leftSpec80, 
.iphone .setumei-box .waku-rightSpec50, .iphone .setumei-box .waku-leftSpec50  {width:100%;}

.iphone .product-1box .waku-img {width:100%;}
.iphone .product-1box .waku-spec {width:100%; margin-top: 10px;}
.iphone .product-1box .waku-img img{ width: 100%; max-width: 160px;}
.iphone .product-1box .favoriteButton { width: calc( 100% - 30px); right: auto; left: auto;}/* 20180227修正 */

/*** ランキング商品枠 ***/
.iphone .ranking div.product-waku div.waku-img::after { width: 30%;}

/*========================================================================================================================
  横並び画像BOX
========================================================================================================================*/
.iphone div.parallel_box .contents-box { width: calc( 100% - 10px) !important; float: none;}
.iphone div.parallel_box.sp-cell2 .contents-box { width: calc( 50% - 10px) !important; float: left;}


/* ################### iPhone専用ここまで ################### */