@charset "UTF-8";

/*
---
title: 
name: Mypage
category: Mypage
---
*/

/*
# Setting

## 各種設定

***
*/

/*
# compassで使用できるmixinのインポート
*/

/*
# 画像
*/

/*
# フォント
*/

/*
# カラー設定
*/

/*
# コンテンツ幅
*/

/*
# ベースとなる余白幅
*/

/*
# ベースとなる角丸の角度
*/

/*
# slash hack
*/

/*
# easing
*/

/*
# Mixin

## 汎用的なミックスインなど

***
*/

/*
# nounit
*/

/*
# margin
*/

/*
# roundedCorners
*/

/*
# gradient
*/

/*
# stripeBg
*/

/*
# calc
*/

/*
# fontSize
*/

/*
# shadow
*/

/*
# invisibilityElem
*/

/*
# hideTxt
*/

/*
# overflow
*/

/*
# lineClamp
*/

/*
# landscape
*/

/*
# buttonClickEffects
*/

.btnEffects {
  position: relative;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
}

.btnEffects > .ripple {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 100;
  width: 200px;
  height: 200px;
  background-color: rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transform: scale(0);
  transform: scale(0);
}

.btnEffects.dim > .ripple {
  background-color: rgba(0, 0, 0, 0.2);
}

/*
# mediaquery
*/

/*
# flexBox
*/

/*
# clearfix
*/

.clearfix,
.discountDetailsTableWrap,
.calculationTableWrap,
.addressPaymentInfo,
.cart .orderFlow,
.cart .sumAreaCartListWrap,
.csvDirect .csvOrderFlow,
.csvDirect .csvUpFlow,
.customer .customerCategList,
.itemDetail #detailPriceTable .detailPriceBtnWarp,
.itemDetail .toDetailFixedArea .toDetailFixdBybtn,
.itemDetail .colItemDataWrap,
.itemDetail .colItemDataWrap .colItemData .itemScore,
#imageModal #modalImagePrevArea,
#imageModal #modalImagePrevArea .thumImg,
.itemDetail #colImgArea #imagePrevArea .thumImg,
.itemDetail #colImgArea .relatedWord,
.itemDetail #colItemsWrap,
.supRecommend .supRecommendInner,
.login .loginColWrap,
.alertCategory .frameType01,
.alertSup #searchResultsWrap #searchResultsArea .supplierList li .supHdWrap,
.mypageTop #mypageColWrap,
.mypageTop #mypageColWrap #mypageColMainArea .usageHistory,
.mypageTop #mypageColWrap #mypageColMainArea .userService,
.purchase .purchaseInfo,
.cedynaRegist .merit,
.cedynaRegist .registFlow,
.npCreditRegist .merit,
.npCreditRegist .registFlow,
.paidRegist .registFlow,
.checkallWrap,
.usageDetail .usageDetailNav dl,
#searchResultsWrap,
#searchResultsWrap #searchResultsArea .searchResultsBookmark,
.search .showcaseWrap,
.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore,
.search .showcaseWrap.listView .showcaseType01 .showcaseBox .itemScore,
.supFeature .rankingItemShowcase,
.buyerRegister .buyingFlow,
.buyerRegister .customerCategList,
.headerUpside,
.secVoice .voiceArea,
.secFlow .flowArea,
.newitem .moreInfo,
.newitem .showcaseWrap,
.ranking .showcaseWrap,
#topColWrap,
.supList .supNameList,
#topHoldFeature .featureBanner,
#topRanking .generalRankingItems,
#topRanking .topRankingItems {
  /zoom: 1;
}

.clearfix:after,
.discountDetailsTableWrap:after,
.calculationTableWrap:after,
.addressPaymentInfo:after,
.cart .orderFlow:after,
.cart .sumAreaCartListWrap:after,
.csvDirect .csvOrderFlow:after,
.csvDirect .csvUpFlow:after,
.customer .customerCategList:after,
.itemDetail #detailPriceTable .detailPriceBtnWarp:after,
.itemDetail .toDetailFixedArea .toDetailFixdBybtn:after,
.itemDetail .colItemDataWrap:after,
.itemDetail .colItemDataWrap .colItemData .itemScore:after,
#imageModal #modalImagePrevArea:after,
#imageModal #modalImagePrevArea .thumImg:after,
.itemDetail #colImgArea #imagePrevArea .thumImg:after,
.itemDetail #colImgArea .relatedWord:after,
.itemDetail #colItemsWrap:after,
.supRecommend .supRecommendInner:after,
.login .loginColWrap:after,
.alertCategory .frameType01:after,
.alertSup #searchResultsWrap #searchResultsArea .supplierList li .supHdWrap:after,
.mypageTop #mypageColWrap:after,
.mypageTop #mypageColWrap #mypageColMainArea .usageHistory:after,
.mypageTop #mypageColWrap #mypageColMainArea .userService:after,
.purchase .purchaseInfo:after,
.cedynaRegist .merit:after,
.cedynaRegist .registFlow:after,
.npCreditRegist .merit:after,
.npCreditRegist .registFlow:after,
.paidRegist .registFlow:after,
.checkallWrap:after,
.usageDetail .usageDetailNav dl:after,
#searchResultsWrap:after,
#searchResultsWrap #searchResultsArea .searchResultsBookmark:after,
.search .showcaseWrap:after,
.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore:after,
.search .showcaseWrap.listView .showcaseType01 .showcaseBox .itemScore:after,
.supFeature .rankingItemShowcase:after,
.buyerRegister .buyingFlow:after,
.buyerRegister .customerCategList:after,
.headerUpside:after,
.secVoice .voiceArea:after,
.secFlow .flowArea:after,
.newitem .moreInfo:after,
.newitem .showcaseWrap:after,
.ranking .showcaseWrap:after,
#topColWrap:after,
.supList .supNameList:after,
#topHoldFeature .featureBanner:after,
#topRanking .generalRankingItems:after,
#topRanking .topRankingItems:after {
  display: block;
  clear: both;
  content: ".";
  height: 0;
  visibility: hidden;
}

/*
# bookmark alert

## ブックマーク 通知設定

*/

#rmBkAlertConfig .bmAlertConfig .alertCheckList li {
  margin-bottom: 16px;
}

#rmBkAlertConfig .bmAlertConfig .alertCheckList li:last-child {
  margin-bottom: 0;
}

#rmBkAlertConfig .bmAlertConfig .alertCheckList li.disabled {
  opacity: 0.6;
}

#rmBkAlertConfig .bmAlertConfig .alertCheckList li label {
  cursor: pointer;
}

#rmBkAlertConfig .bmAlertConfig .alertCheckList li .bmAlertConfigSelect {
  width: 85px;
  margin-right: 8px;
}

#rmBkAlertConfig .bmAlertConfig .verticalLineBtn {
  margin-top: 32px;
}

#rmBkAlertConfig .bmAlertConfig .verticalLineBtn [class*="btnType"] {
  width: 80%;
  margin: 0 auto 24px;
}

#rmBkAlertConfig .bmAlertConfig .verticalLineBtn [class*="btnType"]:last-child {
  margin-bottom: 0;
}

/*
# bookmark

## ブックマーク一覧

*/

.bookmark {
  /* 1カラム商品ブロック */
}

.bookmark .showcaseType03 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  position: relative;
  min-height: 168px;
  margin-top: -1px;
  padding-left: 156px;
  border-top: 1px dotted #cccccc;
  border-bottom: 1px dotted #cccccc;
}

.bookmark .showcaseType03 .showcaseItemsCheckBlock {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 8px;
  width: 26px;
  height: 26px;
  margin: auto;
}

.bookmark .showcaseType03 .showcaseItemsImgBlock {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  display: block;
  position: absolute;
  top: 50%;
  left: 36px;
  width: 120px;
}

.bookmark .showcaseType03 .showcaseItemsImgBlock.ItemsSoldout {
  position: relative;
  position: absolute;
}

.bookmark .showcaseType03 .showcaseItemsImgBlock.ItemsSoldout:after {
  display: block;
  position: absolute;
  content: "\54C1\5207\308C\4E2D";
}

.bookmark .showcaseType03 .showcaseItemsImgBlock.ItemsSoldout:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 45px;
  left: 0;
  width: 100%;
  line-height: 30px;
  background-color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
}

.bookmark .showcaseType03 .showcaseItemsImgBlock .showcaseItemsImg {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 120px;
  background-color: #ffffff;
}

.bookmark .showcaseType03 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.bookmark .showcaseType03 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  width: 100%;
  color: #333333;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  display: table-cell;
  padding: 20px;
  vertical-align: middle;
  word-break: break-all;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(1) {
  width: auto;
  vertical-align: top;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(2) {
  width: 220px;
  text-align: right;
  word-break: normal;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(2) a.btnType06 {
  width: auto;
  margin: 0 4px;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(3) {
  width: 110px;
  text-align: center;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(3) button {
  width: auto;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(3) a.switchNotificationBtn {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  font-size: 12px;
  font-size: 0.75rem;
  display: block;
  margin-bottom: 32px;
  color: #333333;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(3) a.switchNotificationBtn i.fa {
  font-size: 28px;
  font-size: 1.75rem;
  display: block;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(3) a.switchNotificationBtn i.fa.fa-toggle-on {
  color: #ffa200;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(3) a.switchNotificationBtn i.fa.fa-toggle-off {
  color: #999999;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock:nth-child(3) a.switchNotificationBtn:hover {
  opacity: 0.7;
  text-decoration: none;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock p {
  margin: 0;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .showcaseAddDate {
  font-size: 12px;
  font-size: 0.75rem;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .showcaseHd {
  margin-bottom: 6px;
  line-height: 1.5;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .showcaseHd > a {
  display: block;
  color: #333333;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .showcaseSupInfo {
  margin-top: 20px;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .showcaseSupInfo .showcaseSupName {
  display: inline;
  margin-right: 8px;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .showcaseSupInfo .showcaseSupName a {
  color: #333333;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .showcaseSupInfo .discountLabel {
  display: inline;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .discountPop.balloonWrap {
  position: static;
  width: auto;
  height: auto;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .discountPop.balloonWrap .balloonCont {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 4px 8px;
  text-align: left;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .discountBalloon {
  position: relative;
  position: relative;
  font-size: 13px;
  font-size: 0.8125rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  display: inline-block;
  margin-bottom: 8px;
  padding: 2px 4px;
  border: 2px solid #e60012;
  background-color: #ffffff;
  color: #e60012;
  font-weight: bold;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .discountBalloon:before {
  display: block;
  position: absolute;
  content: "";
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .discountBalloon:after {
  display: block;
  position: absolute;
  content: "";
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .discountBalloon:before {
  bottom: -10px;
  right: 12px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 7px 0 7px;
  border-color: #e60012 transparent transparent transparent;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .discountBalloon:after {
  bottom: -7px;
  right: 14px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 5px 0 5px;
  border-color: #ffffff transparent transparent transparent;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .priceBox .price {
  font-weight: bold;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .priceBox .price.discount {
  text-decoration: line-through;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .priceBox .price span {
  font-size: 12px;
  font-size: 0.75rem;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .priceBox .afterPrice {
  color: #e60012;
  font-weight: bold;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock .priceBox .afterPrice span {
  font-size: 12px;
  font-size: 0.75rem;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock a.toDetailBtn {
  font-size: 14px;
  font-size: 0.875rem;
  position: relative;
  margin-top: 16px;
  padding: 4px;
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock a.toDetailBtn:after {
  display: block;
  position: absolute;
  content: "";
}

.bookmark .showcaseType03 .showcaseBox > .showcaseBlock a.toDetailBtn:after {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  right: 6px;
  content: "\F054";
  font-family: FontAwesome;
}

/*doc
---
title: 合計金額テーブル
name: amountTable
category: cart
parent:
---

※カートページ以外にも注文明細周りで併用。

*/

.amountTable th {
  width: 80%;
}

.amountTable th,
.amountTable td {
  padding-top: 0;
  padding-bottom: 8px;
  text-align: right;
}

.amountTable td {
  font-weight: bold;
  /* クーポンクリアボタン */
  /* 旧注文のまとめ割引金額 */
}

.amountTable td p {
  margin-bottom: 0;
}

.amountTable td .deleteBtn,
.amountTable td .supplierDeleteBtn {
  font-size: 13px;
  font-size: 0.8125rem;
  display: none;
  width: 86px;
  font-weight: normal;
}

.amountTable td .discountPrice {
  text-decoration: line-through;
  color: #999999;
}

.amountTable tr:last-child th,
.amountTable tr:last-child td {
  padding-bottom: 0;
}

.amountTable .taxUnit {
  font-size: 12px;
  font-size: 0.75rem;
}

.amountTable .sumTotal {
  font-weight: bold;
}

.amountTable .sumTotal th,
.amountTable .sumTotal td {
  padding-top: 8px;
}

.amountTable .sumTotal th {
  font-size: 18px;
  font-size: 1.125rem;
}

.amountTable .sumTotal td {
  font-size: 24px;
  font-size: 1.5rem;
  color: #e60012;
}

.amountTable .sumTotal .unit {
  font-size: 16px;
  font-size: 1rem;
}

.sumArea {
  position: relative;
  margin: 24px auto;
  text-align: right;
}

.sumArea .stockUpLabel {
  font-size: 14px;
  font-size: 0.875rem;
}

/* 注文詳細 */

.purchase .amountTable .sumTotal th,
.purchase .amountTable .sumTotal td {
  border-top: 1px dotted #999999;
}

/* カート以降 */

.buy .amountTable .sumTotal th,
.buy .amountTable .sumTotal td,
.csvDirect .amountTable .sumTotal th,
.csvDirect .amountTable .sumTotal td {
  border-top: 1px solid #999999;
}

/* 割引詳細テーブル */

.discountDetailsTableWrap .discountDetailsTable {
  float: right;
  width: 60%;
  border: 1px solid #999999;
}

.discountDetailsTableWrap .discountDetailsTable th,
.discountDetailsTableWrap .discountDetailsTable td {
  border-right: none;
  border-bottom: none;
  background-color: #ffffff;
  text-align: right;
  font-weight: normal;
}

.discountDetailsTableWrap .discountDetailsTable td {
  width: 32%;
}

.discountDetailsTableWrap .discountDetailsTable > thead tr th {
  border-bottom: 1px dotted #999999 !important;
  background-color: #ffffff;
  text-align: center;
  font-weight: bold;
  color: #333333;
}

.discountDetailsTableWrap .discountDetailsTable .classificationHd {
  width: 15%;
  border-right: 1px dotted #999999 !important;
  background-color: #f2f2f2;
}

.discountDetailsTableWrap .discountDetailsTable .proratedTable th,
.discountDetailsTableWrap .discountDetailsTable .proratedTable td {
  border-top: 1px dotted #999999;
}

/*
# calculationTable

## 注文時 計算表

*/

.calculationTableWrap {
  margin-bottom: 24px;
  text-align: center;
}

.calculationTableWrap .calculationTable {
  display: table;
  margin: 0 auto 16px;
}

.calculationTableWrap .calculationTable li {
  display: table-cell;
}

.calculationTableWrap .calculationTable li dl {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 120px;
  height: 160px;
  background-color: #eeeeee;
  border: 2px solid #999999;
  font-weight: bold;
}

.calculationTableWrap .calculationTable li dl dt {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 17px;
  font-size: 1.0625rem;
  position: relative;
  height: 80px;
  border-bottom: 1px dotted #999999;
}

.calculationTableWrap .calculationTable li dl dt sup {
  font-size: 12px;
  font-size: 0.75rem;
  position: absolute;
  top: -4px;
  right: 4px;
  line-height: 1;
}

.calculationTableWrap .calculationTable li dl dt sup.supMallCoupon {
  top: 0;
  right: 11px;
}

.calculationTableWrap .calculationTable li dl dd {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  height: 80px;
}

.calculationTableWrap .calculationTable li dl dd a {
  display: block;
}

.calculationTableWrap .calculationTable li dl p {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  margin-bottom: 0;
  text-align: center;
}

.calculationTableWrap .calculationTable li.addition {
  position: relative;
  padding-left: 32px;
}

.calculationTableWrap .calculationTable li.addition:before {
  display: block;
  position: absolute;
  content: "\FF0B";
}

.calculationTableWrap .calculationTable li.addition:before {
  font-size: 24px;
  font-size: 1.5rem;
  top: 64px;
  left: 4px;
  font-weight: bold;
}

.calculationTableWrap .calculationTable li.subtraction {
  position: relative;
  padding-left: 32px;
  /* クーポンクリアボタン */
}

.calculationTableWrap .calculationTable li.subtraction:before {
  display: block;
  position: absolute;
  content: "\2212";
}

.calculationTableWrap .calculationTable li.subtraction:before {
  font-size: 24px;
  font-size: 1.5rem;
  top: 64px;
  left: 4px;
  font-weight: bold;
}

.calculationTableWrap .calculationTable li.subtraction .deleteBtn,
.calculationTableWrap .calculationTable li.subtraction .supplierDeleteBtn {
  font-size: 13px;
  font-size: 0.8125rem;
  display: none;
  position: absolute;
  bottom: 6px;
  left: 0;
  right: 0;
  width: 90px;
  height: 22px;
  line-height: 1;
  margin: auto;
  font-weight: normal;
}

.calculationTableWrap .calculationTable li.totalAmount {
  position: relative;
  padding-left: 40px;
}

.calculationTableWrap .calculationTable li.totalAmount:before {
  display: block;
  position: absolute;
  content: "\FF1D";
}

.calculationTableWrap .calculationTable li.totalAmount:before {
  font-size: 24px;
  font-size: 1.5rem;
  top: 64px;
  left: 8px;
  font-weight: bold;
}

.calculationTableWrap .calculationTable li.totalAmount dl {
  width: 220px;
}

.calculationTableWrap .calculationTable li.totalAmount dl dd {
  font-size: 21px;
  font-size: 1.3125rem;
  color: #e60012;
}

.couponNoticeTxt {
  font-size: 12px;
  font-size: 0.75rem;
  float: right;
  padding-left: 1em;
  text-indent: -1em;
  text-align: left;
}

/*
# addressPaymentInfo

## お届先・支払情報選択

*/

.addressPaymentInfo {
  display: table;
  margin-bottom: 24px;
}

.addressPaymentInfo dl {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table-cell;
  width: 50%;
  padding: 16px;
}

.addressPaymentInfo dl:first-child {
  border-right: 1px dotted #6f6f6f;
}

.addressPaymentInfo dl dt {
  font-size: 18px;
  font-size: 1.125rem;
  margin: 16px 0 4px;
  font-weight: bold;
}

.addressPaymentInfo dl dt:first-child {
  margin-top: 0;
}

.addressPaymentInfo dl dd {
  margin-bottom: 12px;
  padding-left: 16px;
}

.addressPaymentInfo dl dd .addressArea {
  font-size: 14px;
  font-size: 0.875rem;
  margin-top: 12px;
  padding-left: 28px;
}

.addressPaymentInfo dl dd .addressArea th {
  width: 154px;
  padding-left: 0;
}

.addressPaymentInfo dl dd .addressArea input.inputName {
  width: 38%;
  width: calc(50% - 1.6em);
  margin: 0 4px;
}

.addressPaymentInfo dl dd .addressArea.tableType04 {
  display: none;
  margin-bottom: 0;
}

.addressPaymentInfo dl dd .cardPaymentInput {
  font-size: 14px;
  font-size: 0.875rem;
  margin-top: 12px;
  padding-left: 28px;
}

.addressPaymentInfo dl dd .cardPaymentInput .cardInputTable {
  margin-bottom: 0;
}

.addressPaymentInfo dl dd .cardPaymentInput .cardInputTable th {
  width: 165px;
  padding-left: 0;
}

.addressPaymentInfo dl dd .cardPaymentInput .securitycodeTxt {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 8px;
}

.addressPaymentInfo dl dd .cardPaymentInput .securitycodeImg {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: 24px;
  padding: 8px;
  border: 1px solid #999999;
  text-align: center;
}

.addressPaymentInfo dl dd .cardPaymentInput .securitycodeImg img {
  max-width: 100%;
}

.addressPaymentInfo dl dd .npLogoImg {
  width: auto;
  height: 20px;
  padding: 2px 0 0 8px;
}

.addressPaymentInfo dl dd .npPaymentInfo,
.addressPaymentInfo dl dd .bankPaymentInfo {
  font-size: 14px;
  font-size: 0.875rem;
  display: none;
  margin-top: 12px;
  padding-left: 28px;
}

.addressPaymentInfo dl dd .infoLink {
  font-size: 14px;
  font-size: 0.875rem;
  position: relative;
  display: block;
  padding-right: 1.5em;
  text-align: right;
}

.addressPaymentInfo dl dd .infoLink:after {
  display: block;
  position: absolute;
  content: "\F2D2";
}

.addressPaymentInfo dl dd .infoLink:after {
  top: 0;
  right: 0;
  font-family: FontAwesome;
}

.addressPaymentInfo .cardBrandIcon {
  width: 36px;
  padding-left: 8px;
  vertical-align: middle;
}

/*
# cart csv

## カート csv

*/

.cart .csvDirectLink {
  position: absolute;
  top: 6px;
  right: 8px;
  width: 260px;
  text-align: right;
}

.cart .csvDirectLink a.aboutCsvLink {
  position: relative;
  font-size: 14px;
  font-size: 0.875rem;
  display: block;
  margin-bottom: 2px;
  padding-right: 1em;
}

.cart .csvDirectLink a.aboutCsvLink:after {
  display: block;
  position: absolute;
  content: "\F105";
}

.cart .csvDirectLink a.aboutCsvLink:after {
  bottom: 0;
  right: 4px;
  font-family: FontAwesome;
}

.cart .csvDirectLink a.csvOrderLink {
  background-color: #3399dd;
  color: #ffffff;
}

/*
# cart orderFlow

## カート 注文フロー

*/

.cart .orderFlow {
  width: 680px;
  margin: 24px auto 32px;
}

.cart .orderFlow li {
  font-size: 14px;
  font-size: 0.875rem;
  position: relative;
  float: left;
  width: 120px;
  margin-right: 64px;
  color: #e60012;
  font-weight: bold;
  text-align: center;
}

.cart .orderFlow li:after {
  display: block;
  position: absolute;
  content: "";
}

.cart .orderFlow li span {
  font-size: 24px;
  font-size: 1.5rem;
  border-radius: 60px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 40px;
  height: 40px;
  line-height: 35px;
  margin: 0 auto 4px;
  background-color: #ffffff;
  border: 3px solid #e60012;
}

.cart .orderFlow li span.current {
  background-color: #e60012;
  color: #ffffff;
}

.cart .orderFlow li:after {
  top: 12px;
  left: 86px;
  width: 130px;
  height: 20px;
  background: radial-gradient(circle at center, #e60012 0%, #e60012 30%, #ffffff 30%, #ffffff 100%) center 0 repeat-x;
  background-size: 15px 15px;
}

.cart .orderFlow li:last-child {
  margin-right: 0;
}

.cart .orderFlow li:last-child:after {
  display: none;
}

.cart .orderFlow.reserve {
  width: 880px;
}

.cart .orderFlow.reserve li {
  margin-right: 32px;
}

.cart .orderFlow.reserve li i.fa {
  font-size: 40px;
  font-size: 2.5rem;
  display: block;
  opacity: 0.4;
  margin: 0 auto 4px;
}

.cart .orderFlow.reserve li i.fa.current {
  opacity: 1;
}

.cart .orderFlow.reserve li:after {
  width: 100px;
}

.cart .orderFlow.reserve li:last-child {
  margin-right: 0;
}

/*
# cart supList

## 仕入れカート一覧購入履歴

*/

.cart .orderHistoryWrap {
  margin-top: 24px;
}

.cart .orderHistoryWrap .orderHistoryList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock {
  width: 32%;
  width: calc(33% - 17px);
  margin-right: 16px;
  padding-right: 16px;
  border-right: 1px dotted #999999;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock:last-child {
  margin-right: 0;
  padding-right: 0;
  border-right: none;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin-bottom: 8px;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem .orderHistoryImg {
  position: relative;
  width: 60px;
  height: 60px;
  margin-right: 8px;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem .orderHistoryImg .orderHistoryThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem .orderHistoryHdWrap {
  max-width: 80%;
  max-width: calc(100% - 60px);
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem .orderHistoryHdWrap .orderHistoryDay {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 2px;
  color: #e60012;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem .orderHistoryHdWrap .orderHistoryHd {
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  overflow: hidden;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem .orderHistoryHdWrap .orderHistoryHd .orderHistoryHdSign {
  font-size: 12px;
  font-size: 0.75rem;
  position: relative;
  top: -2px;
  margin-right: 2px;
  color: #e60012;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryItem .orderHistoryHdWrap .orderHistoryDetail {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 0;
  color: #999999;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 94px;
  margin-bottom: 12px;
  padding: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: #f7f7f7;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet [data-supballoon] {
  display: inline-block;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet [data-supballoon] .discountPop.balloonWrap {
  position: static;
  width: auto;
  height: auto;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet [data-supballoon] .discountPop.balloonWrap .balloonBox {
  font-size: 12px;
  font-size: 0.75rem;
  z-index: 2;
  padding: 4px 8px;
  text-align: left;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 14px;
  font-size: 0.875rem;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .unitPriceDiscount {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 0;
  text-decoration: line-through;
  color: #999999;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .unitPrice {
  margin-bottom: 0;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .unitPrice .unitPriceTax {
  font-size: 12px;
  font-size: 0.75rem;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .unitPrice.discount {
  color: #e60012;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .quantityBlock {
  position: relative;
  position: relative;
  margin-bottom: 0;
  text-align: center;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .quantityBlock:before {
  display: block;
  position: absolute;
  content: "\D7";
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .quantityBlock:after {
  display: block;
  position: absolute;
  content: "\D7";
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .quantityBlock:before {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  left: 0;
  width: 24px;
  height: 24px;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .quantityBlock:after {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  right: 0;
  width: 24px;
  height: 24px;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .quantityBlock .quantitySet {
  margin: 0 24px;
  text-align: center;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .quantityBlock .quantitySet .setUnit {
  font-size: 12px;
  font-size: 0.75rem;
  display: block;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .setQuantityBlock {
  text-align: center;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .setQuantityBlock .inputFormType01 {
  width: 65px;
  text-align: center;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistorySet .orderHistoryPrice .setQuantityBlock .setQuantitySet {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 0;
}

.cart .orderHistoryWrap .orderHistoryList .orderHistoryBlock .orderHistoryBtn .btnType06 {
  display: block;
  width: 160px;
  margin: auto;
  padding: 8px 0;
}

/*
# cart supList

## 仕入れカート一覧、お届先・支払方法選択のサプライヤークーポン表示

*/

/* 仕入れカート一覧ページ */

.cart .sumAreaCartListWrap {
  margin-top: 24px;
}

.cart .sumAreaCartListWrap .sumArea {
  width: 49.5%;
  width: calc(100% - 479px);
  float: right;
  margin: 0;
}

.cart .sumAreaCartListWrap .sumArea .amountTable th {
  width: auto;
}

.cart .sumAreaCartListWrap .sumArea .amountTable td {
  width: 210px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.cart .sumAreaCartListWrap .sumArea .continueStockBtn {
  position: static;
}

.cart .sumAreaCartListWrap .cartDiscountArea {
  float: left;
  width: 455px;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap {
  padding: 16px;
  background-color: #f7f7f7;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartSupplierCouponTtl {
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartSupplierCouponReach {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 12px;
  padding: 4px 0;
  border: 2px solid #e60012;
  border-radius: 3px;
  background-color: #ffffff;
  font-weight: bold;
  color: #e60012;
  text-align: center;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartSupplierCouponSliderWrap {
  width: 380px;
  margin: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartSupplierCouponSliderWrap .supplierCouponSlider .couponSliderBlock {
  padding: 0 4px;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartSupplierCouponSliderWrap .supplierCouponSlider .couponSliderBlock:focus {
  outline: none;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartSupplierCouponSliderWrap .supplierCouponSlider.soloSlide.slick-dotted.slick-slider {
  margin-bottom: 0;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartSupplierCouponSliderWrap .supplierCouponSlider.soloSlide .slick-dots {
  display: none;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  position: relative;
  width: 100%;
  height: 100%;
  margin: auto;
  padding: 12px;
  background-color: #f5f9fb;
  border: 3px solid #27d2ec;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap.initialBuyerLimited {
  font-size: 14px;
  font-size: 0.875rem;
  background-color: #f0f3f1;
  border: 3px solid #44bb77;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap.initialBuyerLimited .initialBuyerLabel {
  border-radius: 20px;
  position: relative;
  width: 140px;
  margin: 0 auto 8px;
  padding: 8px 0 6px;
  background-color: #ffffff;
  color: #e60012;
  text-align: center;
  font-weight: bold;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap.initialBuyerLimited .initialBuyerLabel:before {
  display: block;
  position: absolute;
  content: "";
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap.initialBuyerLimited .initialBuyerLabel:before {
  top: -2px;
  right: -8px;
  width: 30px;
  height: 40px;
  background: url(/pc/assets/image/static/special/regular/coupon/ico_beginner01.png) no-repeat left 2px;
  background-size: 30px auto;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponHd {
  font-size: 15px;
  font-size: 0.9375rem;
  word-break: break-word;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .discountCont {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  color: #e60012;
  text-align: center;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .discountCont .order {
  font-size: 17px;
  font-size: 1.0625rem;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .discountCont .discountAmount {
  font-size: 20px;
  font-size: 1.25rem;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetailsHd {
  position: relative;
  padding: 4px;
  background-color: rgba(0, 0, 0, 0.1);
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetailsHd:before {
  display: block;
  position: absolute;
  content: "";
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetailsHd:before {
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  content: "\F078";
  top: 50%;
  right: 8px;
  font-family: FontAwesome;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetailsHd.open:before {
  -webkit-transform: translateY(-50%) rotate(180deg);
  transform: translateY(-50%) rotate(180deg);
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetails {
  display: none;
  width: 100%;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetails .couponNotice {
  font-size: 13px;
  font-size: 0.8125rem;
  margin: 8px auto 0;
  text-align: right;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetails .cartCouponDescription {
  font-size: 15px;
  font-size: 0.9375rem;
  padding: 8px;
  border: 1px solid #999999;
  background-color: #ffffff;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetails .cartCouponDescription .cartCouponDescriptionHd {
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid #999999;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponDetails .cartCouponDescription .cartCouponDescriptionTxt {
  word-break: break-word;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponCode {
  width: 100%;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponCode .note {
  font-size: 13px;
  font-size: 0.8125rem;
  margin: 8px 0;
  text-align: center;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponCode .inputFormType01.couponCode {
  font-size: 15px;
  font-size: 0.9375rem;
  width: 64%;
  vertical-align: middle;
  text-align: center;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponCode .copyBtn {
  font-size: 15px;
  font-size: 0.9375rem;
  width: 30%;
  margin-left: 4%;
  padding: 5px;
  vertical-align: middle;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .cartCouponWrap .cartCouponCode .couponPeriod {
  font-size: 15px;
  font-size: 0.9375rem;
  margin: 8px auto;
  font-weight: bold;
  text-align: center;
  word-break: break-word;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .slick-prev {
  left: -25px;
  width: 25px;
  height: 100%;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .slick-prev:before {
  font-size: 30px;
  font-size: 1.875rem;
  position: absolute;
  top: 50%;
  left: 0;
  color: #333333;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .slick-next {
  right: -25px;
  width: 25px;
  height: 100%;
}

.cart .sumAreaCartListWrap .cartDiscountArea .cartSupplierCouponWrap .slick-next:before {
  font-size: 30px;
  font-size: 1.875rem;
  position: absolute;
  top: 50%;
  right: 0;
  color: #333333;
}

.cart .sumAreaCartListWrap .bulkDiscountWrap {
  margin-bottom: 24px;
  padding: 16px;
  background-color: #f7f7f7;
}

.cart .sumAreaCartListWrap .bulkDiscountWrap .bulkDiscountTtl {
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 8px;
  font-weight: bold;
}

/* お届先・支払方法選択ページ */

.cart.buy #orderSupplierCouponWrap {
  max-width: 1000px;
  margin: auto;
  padding-bottom: 24px;
  clear: both;
}

.cart.buy #orderSupplierCouponWrap .orderSupplierCouponhd {
  text-align: left;
}

.cart.buy #orderSupplierCouponWrap .orderSupplierCouponhd .orderSupplierCouponhdTxt {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: normal;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider {
  width: 934px;
  margin: 0 auto 30px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .couponSliderBlock {
  padding: 0 4px;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .couponSliderBlock:focus {
  outline: none;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .couponSliderBlock .supplierCouponWrap {
  margin-top: 0;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .couponSliderBlock .supplierCouponWrap .supCouponDetails {
  text-align: left;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .couponSliderBlock .supplierCouponWrap.initialBuyerLimited .supCouponCode .initialBuyerLabel {
  margin-bottom: 8px;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .couponSliderBlock .supplierCouponWrap .supCouponCode {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .couponSliderBlock .supplierCouponWrap .supCouponCode .note {
  margin: 4px 0 0;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider.soloSlide {
  width: 100%;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider.soloSlide .orderSupplierCouponSlider {
  margin-bottom: 0;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider.soloSlide .slick-dots {
  display: none;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .slick-prev {
  left: -33px;
  width: 33px;
  height: 100%;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .slick-prev:before {
  font-size: 36px;
  font-size: 2.25rem;
  position: absolute;
  top: 40%;
  left: 0;
  color: #333333;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .slick-next {
  right: -33px;
  width: 33px;
  height: 100%;
}

.cart.buy #orderSupplierCouponWrap .supplierCouponSlider .slick-next:before {
  font-size: 36px;
  font-size: 2.25rem;
  position: absolute;
  top: 40%;
  right: 0;
  color: #333333;
}

/*
# cart supList

## カート サプごとのリスト

*/

.cart,
.csvDirect {
  /* アンカーリンク */
  /* サプごと */
}

.cart .supCartList,
.csvDirect .supCartList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  width: 100%;
}

.cart .supCartList li,
.csvDirect .supCartList li {
  font-size: 14px;
  font-size: 0.875rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 20%;
  margin-bottom: 16px;
  padding: 4px 8px 4px 40px;
  border-right: 1px dotted #6f6f6f;
}

.cart .supCartList li:last-child,
.csvDirect .supCartList li:last-child {
  border-right: none;
}

.cart .supCartList li a,
.csvDirect .supCartList li a {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  display: block;
}

.cart .supCartList li a:before,
.csvDirect .supCartList li a:before {
  display: block;
  position: absolute;
  content: "\F07A";
}

.cart .supCartList li a:before,
.csvDirect .supCartList li a:before {
  font-size: 20px;
  font-size: 1.25rem;
  top: -4px;
  left: -24px;
  font-family: FontAwesome;
}

.cart .supCart,
.csvDirect .supCart {
  position: relative;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  letter-spacing: 0.02em;
}

.cart .supCart .supCartHd,
.csvDirect .supCart .supCartHd {
  position: relative;
  padding-left: 2em;
  padding-right: 280px;
}

.cart .supCart .supCartHd:before,
.csvDirect .supCart .supCartHd:before {
  display: block;
  position: absolute;
  content: "\F07A";
}

.cart .supCart .supCartHd a,
.csvDirect .supCart .supCartHd a {
  color: #333333;
}

.cart .supCart .supCartHd span,
.csvDirect .supCart .supCartHd span {
  vertical-align: middle;
  font-weight: normal;
}

.cart .supCart .supCartHd:before,
.csvDirect .supCart .supCartHd:before {
  font-size: 24px;
  font-size: 1.5rem;
  top: 4px;
  left: 8px;
  font-family: FontAwesome;
}

.cart .supCart .cartAllDeleteBtn,
.csvDirect .supCart .cartAllDeleteBtn {
  position: relative;
  top: -8px;
  text-align: right;
}

.cart .supCart .cartAllDeleteBtn .deleteBtn,
.csvDirect .supCart .cartAllDeleteBtn .deleteBtn {
  font-size: 12px;
  font-size: 0.75rem;
  width: auto;
}

.cart .supCart .taxInfoTxt,
.csvDirect .supCart .taxInfoTxt {
  font-size: 14px;
  font-size: 0.875rem;
  position: absolute;
  top: 0;
  left: 0;
}

.cart .supCart .directItemDownload,
.csvDirect .supCart .directItemDownload {
  position: absolute;
  top: 24px;
  right: 24px;
  width: 260px;
}

.cart .supCart .directItemDownload a,
.csvDirect .supCart .directItemDownload a {
  position: relative;
  font-size: 12px;
  font-size: 0.75rem;
  padding: 4px 4px 4px 2em;
}

.cart .supCart .directItemDownload a:after,
.csvDirect .supCart .directItemDownload a:after {
  display: block;
  position: absolute;
  content: "\F019";
}

.cart .supCart .directItemDownload a:after,
.csvDirect .supCart .directItemDownload a:after {
  font-size: 16px;
  font-size: 1rem;
  top: 2px;
  left: 14px;
  font-family: FontAwesome;
}

.cart .supCart .directItemDownload a.disabled,
.csvDirect .supCart .directItemDownload a.disabled {
  background-color: #eeeeee;
  color: #cccccc;
  border-color: #cccccc;
  cursor: default;
}

.cart .supCart .cartItemsAccBtn,
.csvDirect .supCart .cartItemsAccBtn {
  position: relative;
  font-size: 16px;
  font-size: 1rem;
  display: block;
  width: 40%;
  margin: 16px auto;
  padding-bottom: 16px;
}

.cart .supCart .cartItemsAccBtn:after,
.csvDirect .supCart .cartItemsAccBtn:after {
  display: block;
  position: absolute;
  content: "\F107";
}

.cart .supCart .cartItemsAccBtn:after,
.csvDirect .supCart .cartItemsAccBtn:after {
  font-size: 18px;
  font-size: 1.125rem;
  top: 24px;
  right: 0;
  left: 0;
  margin: auto;
  font-family: FontAwesome;
}

.cart .supCart .continueStockBtn,
.csvDirect .supCart .continueStockBtn {
  font-size: 16px;
  font-size: 1rem;
  position: absolute;
  bottom: 24px;
  left: 24px;
  width: 180px;
}

/*
# cart

## 仕入れカート

*/

.cart .cartHd,
.csvDirect .cartHd {
  position: relative;
  padding-top: 16px;
}

.cart .orderAdvanceBtn,
.csvDirect .orderAdvanceBtn {
  width: 100%;
  margin: 24px auto 56px;
  text-align: right;
}

.cart .orderAdvanceBtn [class*="btnType"],
.csvDirect .orderAdvanceBtn [class*="btnType"] {
  font-size: 21px;
  font-size: 1.3125rem;
  width: 440px;
  margin-right: 16px;
}

.cart .orderAdvanceBtn [class*="btnType"].backBtn,
.csvDirect .orderAdvanceBtn [class*="btnType"].backBtn {
  font-size: 16px;
  font-size: 1rem;
  width: 260px;
}

.cart .orderAdvanceBtn [class*="btnType"]:last-child,
.csvDirect .orderAdvanceBtn [class*="btnType"]:last-child {
  margin-right: 0;
}

/*
# cartItems

## カートの商品リスト

*/

.cart .cartItemsHdTable,
.csvDirect .cartItemsHdTable {
  font-size: 14px;
  font-size: 0.875rem;
  border: none;
}

.cart .cartItemsHdTable > thead th,
.csvDirect .cartItemsHdTable > thead th {
  border: none;
  padding: 8px 12px;
  background-color: #eeeeee;
  color: #333333;
}

.cart .cartItemsHdTable > thead th:nth-child(1),
.csvDirect .cartItemsHdTable > thead th:nth-child(1) {
  width: auto;
}

.cart .cartItemsHdTable > thead th:nth-child(2),
.csvDirect .cartItemsHdTable > thead th:nth-child(2) {
  width: 140px;
  padding-left: 0;
}

.cart .cartItemsHdTable > thead th:nth-child(3),
.csvDirect .cartItemsHdTable > thead th:nth-child(3) {
  width: 80px;
}

.cart .cartItemsHdTable > thead th:nth-child(4),
.csvDirect .cartItemsHdTable > thead th:nth-child(4) {
  width: 160px;
}

.cart .cartItemsHdTable > thead th:nth-child(5),
.csvDirect .cartItemsHdTable > thead th:nth-child(5) {
  width: 140px;
  padding-left: 0;
}

.cart .cartItemsHdTable > thead th:nth-child(6),
.csvDirect .cartItemsHdTable > thead th:nth-child(6) {
  width: 60px;
  padding-right: 0;
}

.cart .cartItems,
.csvDirect .cartItems {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  display: table;
  width: 100%;
  padding-left: 60px;
  border-bottom: 1px dotted #999999;
}

.cart .cartItems a,
.csvDirect .cartItems a {
  color: #333333;
}

.cart .cartItems .cartItemsBlock,
.csvDirect .cartItems .cartItemsBlock {
  display: table-cell;
  padding: 12px;
  vertical-align: middle;
}

.cart .cartItems .cartItemsBlock p,
.csvDirect .cartItems .cartItemsBlock p {
  margin-bottom: 0;
}

.cart .cartItems .cartItemsBlock:nth-child(1),
.csvDirect .cartItems .cartItemsBlock:nth-child(1) {
  width: auto;
}

.cart .cartItems .cartItemsBlock:nth-child(2),
.csvDirect .cartItems .cartItemsBlock:nth-child(2) {
  width: 20px;
  padding: 0;
  text-align: center;
}

.cart .cartItems .cartItemsBlock:nth-child(3),
.csvDirect .cartItems .cartItemsBlock:nth-child(3) {
  width: 140px;
  padding-left: 0;
  text-align: right;
}

.cart .cartItems .cartItemsBlock:nth-child(4),
.csvDirect .cartItems .cartItemsBlock:nth-child(4) {
  width: 80px;
  text-align: center;
}

.cart .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet,
.csvDirect .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet {
  position: relative;
  position: relative;
  width: 80%;
  height: 24px;
  margin: 0 auto;
}

.cart .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:before,
.csvDirect .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:before {
  display: block;
  position: absolute;
  content: "\D7";
}

.cart .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:after,
.csvDirect .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:after {
  display: block;
  position: absolute;
  content: "\D7";
}

.cart .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:before,
.csvDirect .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:before {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  left: -20px;
  width: 24px;
  height: 24px;
}

.cart .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:after,
.csvDirect .cartItems .cartItemsBlock:nth-child(4) .QuantityInSet:after {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  right: -20px;
  width: 24px;
  height: 24px;
}

.cart .cartItems .cartItemsBlock:nth-child(5),
.csvDirect .cartItems .cartItemsBlock:nth-child(5) {
  width: 160px;
  text-align: center;
}

.cart .cartItems .cartItemsBlock:nth-child(5) input:not([type="radio"]):not([type="checkbox"]).inputFormType01,
.csvDirect .cartItems .cartItemsBlock:nth-child(5) input:not([type="radio"]):not([type="checkbox"]).inputFormType01 {
  width: 40%;
  width: calc(100% - 6em);
  margin-right: 4px;
  text-align: right;
}

.cart .cartItems .cartItemsBlock:nth-child(5) .setNumUnit,
.csvDirect .cartItems .cartItemsBlock:nth-child(5) .setNumUnit {
  font-size: 12px;
  font-size: 0.75rem;
}

.cart .cartItems .cartItemsBlock:nth-child(6),
.csvDirect .cartItems .cartItemsBlock:nth-child(6) {
  width: 140px;
  padding-left: 0;
  font-weight: bold;
  text-align: right;
}

.cart .cartItems .cartItemsBlock:nth-child(7),
.csvDirect .cartItems .cartItemsBlock:nth-child(7) {
  width: 60px;
  padding-right: 0;
  text-align: right;
}

.cart .cartItems .cartItemsBlock:nth-child(7) .deleteBtn,
.csvDirect .cartItems .cartItemsBlock:nth-child(7) .deleteBtn {
  width: 60px;
  padding: 4px;
}

.cart .cartItems .cartItemsBlock .csvItemId,
.csvDirect .cartItems .cartItemsBlock .csvItemId {
  font-size: 12px;
  font-size: 0.75rem;
}

.cart .cartItems .cartItemsBlock .cartItemsHd,
.csvDirect .cartItems .cartItemsBlock .cartItemsHd {
  margin-bottom: 8px;
  line-height: 1.5;
}

.cart .cartItems .cartItemsBlock .itemDetail,
.csvDirect .cartItems .cartItemsBlock .itemDetail {
  font-size: 12px;
  font-size: 0.75rem;
  color: #999999;
}

.cart .cartItems .cartItemsBlock .ordersReceived,
.csvDirect .cartItems .cartItemsBlock .ordersReceived {
  font-size: 12px;
  font-size: 0.75rem;
  display: block;
  margin-top: 4px;
}

.cart .cartItems .cartItemsBlock .price,
.csvDirect .cartItems .cartItemsBlock .price {
  font-size: 14px;
  font-size: 0.875rem;
}

.cart .cartItems .cartItemsBlock .price.discount,
.csvDirect .cartItems .cartItemsBlock .price.discount {
  font-size: 12px;
  font-size: 0.75rem;
  text-decoration: line-through;
  color: #999999;
}

.cart .cartItems .cartItemsBlock .discount + .price,
.csvDirect .cartItems .cartItemsBlock .discount + .price {
  color: #e60012;
}

.cart .cartItems .cartItemsBlock .taxUnit,
.csvDirect .cartItems .cartItemsBlock .taxUnit {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: normal;
}

.cart .cartItems .cartItemsBlock .discountPop.balloonWrap,
.csvDirect .cartItems .cartItemsBlock .discountPop.balloonWrap {
  position: static;
  width: auto;
  height: auto;
  margin-bottom: 2px;
}

.cart .cartItems .cartItemsBlock .discountPop.balloonWrap .balloonCont,
.csvDirect .cartItems .cartItemsBlock .discountPop.balloonWrap .balloonCont {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 4px 8px;
  text-align: left;
}

.cart .cartItems .cartItemsBlock .attentionTxt,
.csvDirect .cartItems .cartItemsBlock .attentionTxt {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  color: #6f6f6f;
}

.cart .cartItems .cartItemsBlock .attentionTxt em,
.csvDirect .cartItems .cartItemsBlock .attentionTxt em {
  color: #e60012;
  font-weight: bold;
}

.cart .cartItems .cartItemsBlock .modifyBtn,
.csvDirect .cartItems .cartItemsBlock .modifyBtn {
  width: auto;
  margin-left: 6px;
}

.cart .cartItems .cartItemsBlock .deleteBtn,
.csvDirect .cartItems .cartItemsBlock .deleteBtn {
  font-size: 12px;
  font-size: 0.75rem;
}

.cart .cartItems .cartItemsImgBlock,
.csvDirect .cartItems .cartItemsImgBlock {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 60px;
  height: 60px;
  margin: auto;
}

.cart .cartItems .cartItemsImgBlock > a,
.csvDirect .cartItems .cartItemsImgBlock > a {
  display: block;
}

.cart .cartItems .cartItemsImgBlock > a > img,
.csvDirect .cartItems .cartItemsImgBlock > a > img {
  max-width: 60px;
  max-height: 60px;
}

/*
# csv orderFlow

## カート 注文フロー

*/

.csvDirect .csvOrderFlow {
  width: 680px;
  margin: 24px auto 32px;
}

.csvDirect .csvOrderFlow li {
  font-size: 14px;
  font-size: 0.875rem;
  position: relative;
  float: left;
  width: 120px;
  margin-right: 64px;
  color: #3399dd;
  font-weight: bold;
  text-align: center;
}

.csvDirect .csvOrderFlow li:after {
  display: block;
  position: absolute;
  content: "";
}

.csvDirect .csvOrderFlow li span {
  font-size: 24px;
  font-size: 1.5rem;
  border-radius: 60px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 40px;
  height: 40px;
  line-height: 35px;
  margin: 0 auto 4px;
  background-color: #ffffff;
  border: 3px solid #3399dd;
}

.csvDirect .csvOrderFlow li span.current {
  background-color: #3399dd;
  color: #ffffff;
}

.csvDirect .csvOrderFlow li:after {
  top: 12px;
  left: 86px;
  width: 130px;
  height: 20px;
  background: radial-gradient(circle at center, #3399dd 0%, #3399dd 30%, #ffffff 30%, #ffffff 100%) center 0 repeat-x;
  background-size: 15px 15px;
}

.csvDirect .csvOrderFlow li:last-child {
  margin-right: 0;
}

.csvDirect .csvOrderFlow li:last-child:after {
  display: none;
}

/*
# csvUpFlow

## csvダイレクト 使い方

*/

.csvDirect .csvUpFlow {
  margin: 16px auto 16px;
}

.csvDirect .csvUpFlow li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 31.9%;
  width: calc(100% / 3 - 14px);
  position: relative;
  float: left;
  min-height: 230px;
  margin-right: 20px;
  padding: 16px;
  border: 1px solid #999999;
  text-align: center;
}

.csvDirect .csvUpFlow li:after {
  display: block;
  position: absolute;
  content: "\F054";
}

.csvDirect .csvUpFlow li .flowHd {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.csvDirect .csvUpFlow li p {
  margin-bottom: 0;
}

.csvDirect .csvUpFlow li:last-child {
  margin-right: 0;
}

.csvDirect .csvUpFlow li:last-child:after {
  display: none;
}

.csvDirect .csvUpFlow li:after {
  font-size: 18px;
  font-size: 1.125rem;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-family: FontAwesome;
  top: 50%;
  right: -18px;
}

.csvDirect a.howtoMoreLink {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  display: block;
  margin-top: 8px;
  padding-right: 1em;
  text-align: right;
}

.csvDirect a.howtoMoreLink:after {
  display: block;
  position: absolute;
  content: "\F105";
}

.csvDirect a.howtoMoreLink:after {
  top: 0;
  right: 2px;
  font-family: FontAwesome;
}

/*
# customer

## 取引申請設定

*/

.customer {
  /* 一括取引申請 */
  /* 取引申請状況詳細 */
}

.customer .searchState {
  text-align: center;
  padding-bottom: 24px;
  margin-bottom: 40px;
  border-bottom: 1px dotted #6f6f6f;
}

.customer .searchState ul {
  margin: 0 auto 24px;
}

.customer .searchState ul li {
  vertical-align: middle;
}

.customer .searchState ul li .selectState {
  width: 180px;
  margin: 0 4px 0 8px;
}

.customer .searchState ul li .inputSupName {
  width: 260px;
  margin: 0 4px 0 8px;
}

.customer .tableType03 input[type="checkbox"].checkFormType03 + label {
  display: inline;
}

.customer .toBulkAppBtn {
  position: absolute;
  top: 12px;
  right: 32px;
  width: 20%;
}

.customer .toBulkAppBtn i.fa {
  font-size: 20px;
  font-size: 1.25rem;
  vertical-align: middle;
}

.customer #bulkApplication {
  margin-top: 40px;
  padding-top: 24px;
}

.customer .customerCategList {
  margin-bottom: 24px;
}

.customer .customerCategList > li {
  width: 20%;
  width: calc(100% / 5 - 16px);
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  margin-right: 16px;
}

.customer .customerCategList > li .categHd {
  position: relative;
  padding-left: 2em;
  cursor: pointer;
}

.customer .customerCategList > li .categHd:after {
  display: block;
  position: absolute;
  content: "\F055";
}

.customer .customerCategList > li .categHd:after {
  font-size: 24px;
  font-size: 1.5rem;
  top: -10px;
  left: 0;
  font-family: FontAwesome;
  color: #999999;
}

.customer .customerCategList > li .categHd.open:after {
  content: "\F056";
}

.customer .customerCategList > li .categListEach {
  display: none;
  margin-top: 12px;
}

.customer .customerCategList > li .categListEach .listChilds {
  margin-top: 12px;
  padding-left: 1.5em;
}

.customer .customerCategList > li .categListEach .listChilds li {
  margin-bottom: 12px;
}

.customer .supInfo {
  position: relative;
}

.customer .supInfo .supInfoLink {
  position: absolute;
  top: 18px;
  right: 0;
}

.customer .supInfo .supInfoLink li {
  display: inline-block;
  margin: 0 8px;
}

.customer .supInfo .supInfoLink li a {
  position: relative;
  display: inline-block;
  padding-right: 1em;
}

.customer .supInfo .supInfoLink li a:after {
  display: block;
  position: absolute;
  content: "\F105";
}

.customer .supInfo .supInfoLink li a:after {
  top: 0;
  right: 0;
  font-family: FontAwesome;
}

/*
# company

## 会社情報・キャンペーン詳細

*/

.company {
  /* キャンペーン情報 */
  /* 店舗情報 */
  /* 取引申請・アラート登録 */
}

.company img {
  max-width: 100%;
}

.company .supplierHdWrap {
  position: relative;
  padding: 8px;
  margin-bottom: 24px;
  padding-right: 14em;
  border-bottom: 1px solid #666666;
}

.company .supplierHdWrap .supplierHd {
  font-size: 24px;
  font-size: 1.5rem;
  display: inline;
  font-weight: bold;
}

.company .supplierHdWrap .supplierHd .companyHdTxt {
  font-size: 18px;
  font-size: 1.125rem;
  padding-left: 8px;
  font-weight: normal;
}

.company .supplierHdWrap .linkItems {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
}

.company #searchResultsArea h2:first-child {
  margin-top: 0;
}

.company .campainDetail {
  position: relative;
}

.company .campainDetail .campaignEndDate {
  position: relative;
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 0;
  padding-left: 20px;
  color: #6f6f6f;
}

.company .campainDetail .campaignEndDate:after {
  display: block;
  position: absolute;
  content: "\F017";
}

.company .campainDetail .campaignEndDate:after {
  font-size: 16px;
  font-size: 1rem;
  top: 3px;
  left: 0;
  line-height: 1;
  font-family: FontAwesome;
}

.company .campainDetail .campaignHd {
  font-size: 21px;
  font-size: 1.3125rem;
  margin: 8px auto 24px;
  padding: 4px 8px;
  border-bottom: 3px solid #27d2ec;
  font-weight: bold;
}

.company .shopBanner {
  margin-bottom: 24px;
  text-align: center;
}

.company .shopInfoWrap h3:first-child {
  margin-top: 0;
}

.company .shopInfoWrap .imgListType01 {
  margin: 0 auto;
}

.company .sideInquiryBtn {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 16px;
  letter-spacing: -0.02em;
}

.company .sideInquiryBtn i.fa {
  font-size: 16px;
  font-size: 1rem;
  margin-left: -4px;
  font-weight: bold;
}

.company .companyLinks {
  position: relative;
}

.company .companyLinks [data-supballoon] {
  position: absolute;
}

.company .companyLinks [data-supballoon] .balloonWrap > .balloonSymbol {
  font-size: 13px;
  font-size: 0.8125rem;
  color: #ffffff !important;
}

.company .companyLinks [data-supballoon] .balloonCont {
  font-size: 13px;
  font-size: 0.8125rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 8px;
}

.company .companyLinks.customerLink [data-supballoon] {
  top: 0;
  right: 43px;
}

.company .companyLinks.alertLink [data-supballoon] {
  top: 0;
  right: 17px;
}

/*
# aboutItemHd

## 商品紹介・商品詳細タイトル

*/

.itemDetail .aboutItemHd {
  font-size: 18px;
  font-size: 1.125rem;
  position: relative;
  position: relative;
  margin: 24px 0 16px;
  padding: 6px;
  border-bottom: 1px solid #6f6f6f;
}

.itemDetail .aboutItemHd:before {
  display: block;
  position: absolute;
  content: "";
}

.itemDetail .aboutItemHd:after {
  display: block;
  position: absolute;
  content: "";
}

.itemDetail .aboutItemHd span {
  font-size: 14px;
  font-size: 0.875rem;
  padding-left: 4px;
  font-weight: normal;
}

.itemDetail .aboutItemHd:before {
  bottom: -10px;
  left: 19px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 9px 0 9px;
  border-color: #6f6f6f transparent transparent transparent;
}

.itemDetail .aboutItemHd:after {
  bottom: -8px;
  left: 20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 8px 0 8px;
  border-color: #ffffff transparent transparent transparent;
}

/*
# dealConditionArea

## 商品詳細 取引条件

*/

.itemDetail #dealConditionArea {
  position: relative;
  margin-bottom: 24px;
  padding: 24px 0;
  border-bottom: 1px solid #999999;
}

.itemDetail #dealConditionArea .tabType01 .tabBox {
  width: 45%;
}

.itemDetail #dealConditionArea .dealConditionNotice {
  font-size: 14px;
  font-size: 0.875rem;
  position: absolute;
  top: 34px;
  right: 16px;
}

.itemDetail #dealConditionArea .dealConditionBox {
  margin: 0 16px;
}

.itemDetail #dealConditionArea #paymentMethodsSec .paymentMethodsTable {
  max-width: 1000px;
}

.itemDetail #dealConditionArea #paymentMethodsSec .paymentMethodsTable th {
  font-size: 15px;
  font-size: 0.9375rem;
  text-align: center;
  font-weight: normal;
}

.itemDetail #dealConditionArea #paymentMethodsSec .paymentMethodsTable td {
  font-size: 13px;
  font-size: 0.8125rem;
  text-align: center;
  font-weight: normal;
  vertical-align: middle;
}

.itemDetail #dealConditionArea #paymentMethodsSec .paymentMethodsTable td i.fa {
  font-size: 30px;
  font-size: 1.875rem;
}

.itemDetail #dealConditionArea #paymentMethodsSec .paymentMethodsTable td .txtListType02 li {
  margin-right: 4px;
}

.itemDetail #dealConditionArea #paymentMethodsSec .paymentMethodsTable td .txtListType02 li:last-child {
  margin-right: 0;
}

.itemDetail #dealConditionArea #paymentMethodsSec .codFeeTable {
  width: 400px;
}

.itemDetail #dealConditionArea #paymentMethodsSec .codFeeTable th {
  width: 65%;
  text-align: right;
}

.itemDetail #dealConditionArea #paymentMethodsSec .codFeeTable td {
  text-align: right;
}

.itemDetail #dealConditionArea #salesConditionSec .salesConditionTable th {
  width: 20%;
}

/*
# detailPriceTable

## 商品詳細 内訳表

*/

.itemDetail #detailPriceTable {
  margin-bottom: 40px;
}

.itemDetail #detailPriceTable table th {
  font-size: 14px;
  font-size: 0.875rem;
  text-align: center;
}

.itemDetail #detailPriceTable table td {
  font-size: 14px;
  font-size: 0.875rem;
}

.itemDetail #detailPriceTable table td:nth-child(2) {
  font-size: 16px;
  font-size: 1rem;
}

.itemDetail #detailPriceTable table td p {
  margin-bottom: 0;
}

.itemDetail #detailPriceTable table td .beforePrice {
  text-decoration: line-through;
}

.itemDetail #detailPriceTable table td .taxUnit {
  font-size: 12px;
  font-size: 0.75rem;
}

.itemDetail #detailPriceTable table td .discountPop.balloonWrap {
  position: static;
  width: auto;
  height: auto;
  margin-bottom: 2px;
}

.itemDetail #detailPriceTable table td .discountPop.balloonWrap .balloonCont {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 4px 8px;
  text-align: left;
}

.itemDetail #detailPriceTable table td input:not([type="radio"]):not([type="checkbox"]).inputFormType01 {
  width: 70%;
  width: calc(100% - 3.5em);
  margin-right: 0.5em;
  text-align: right;
}

.itemDetail #detailPriceTable .stockUpTxt {
  font-size: 14px;
  font-size: 0.875rem;
  text-align: right;
}

.itemDetail #detailPriceTable .detailPriceBtnWarp .detailPriceBtn {
  float: right;
  width: 340px;
}

.itemDetail #detailPriceTable .detailPriceBtnWarp .detailPriceBtn:first-child {
  margin-left: 20px;
}

.itemDetail #detailPriceTable .detailPriceBtnWarp .detailPriceBtn a.added i.fa {
  color: #e84505;
}

.itemDetail #detailPriceTable .detailPriceBtnWarp .detailPriceBtn .addToCartBtn {
  font-size: 24px;
  font-size: 1.5rem;
  display: block;
  margin: 0 0 0 auto;
}

.itemDetail #detailPriceTable .detailPriceBtnWarp .detailPriceBtn .addToCartBtn i.fa {
  font-size: 28px;
  font-size: 1.75rem;
}

.itemDetail #detailPriceTable .detailPriceBtnWarp .detailPriceBtn .registBtn {
  font-size: 21px;
  font-size: 1.3125rem;
  display: block;
  width: 340px;
  margin: 0 0 0 auto;
}

.itemDetail #detailPriceTable .detailPriceBtnWarp .detailPriceBtn .registBtn span {
  font-size: 16px;
  font-size: 1rem;
}

/*
# toDetailFixedArea

## 商品詳細 追従ボタン

*/

.itemDetail .toDetailFixedArea {
  display: none;
  position: fixed;
  right: 0;
  bottom: 100px;
  z-index: 10;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 12px;
  background-color: #f8f8f8;
  text-align: right;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn .minMainImg {
  float: left;
  width: 84px;
  height: 84px;
  margin-right: 12px;
  border: 1px solid #999999;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn .toDetailCol {
  float: right;
  width: 198px;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn .toDetailCol .toDetailPrice {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 4px;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn .toDetailCol .toDetailPrice .beforePrice {
  display: block;
  text-decoration: line-through;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn .toDetailCol .toDetailPrice .price {
  font-size: 18px;
  font-size: 1.125rem;
  color: #e60012;
  font-weight: bold;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn .toDetailCol [class*="btnType"] {
  font-size: 16px;
  font-size: 1rem;
}

.itemDetail .toDetailFixedArea .toDetailFixdBybtn .toDetailCol [class*="btnType"] i.fa-angle-double-down {
  font-size: 20px;
  font-size: 1.25rem;
  vertical-align: middle;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 320px;
  padding: 6px 0 6px 6px;
  background-color: #eeeeee;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol {
  position: relative;
  position: relative;
  display: block;
  min-height: 98px;
  background-color: #ffffff;
  color: #333333;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol:after {
  display: block;
  position: absolute;
  content: "";
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol:hover {
  opacity: 0.8;
  text-decoration: none;
  cursor: pointer;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol:after {
  position: absolute;
  top: 5px;
  left: 0;
  width: 88px;
  height: 17px;
  background: url(/pc/assets/image/common/layout/buy/item_detail/todetail_fixd_cpnflag.png) no-repeat;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol .toDetailName {
  width: 280px;
  margin: auto;
  padding: 34px 0 5px;
  font-weight: bold;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol .toDetailName p:first-child {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 2px;
  padding-bottom: 2px;
  border-bottom: dashed 1px #333333;
  line-height: 1.4;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol .toDetailName p:nth-child(2) {
  font-size: 18px;
  font-size: 1.125rem;
  margin-bottom: 0;
}

.itemDetail .toDetailFixedArea .toDetailFixdCoupon .toDetailCol .toDeatailGuidetxt {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 0;
  padding: 0 4px 4px 0;
  text-align: right;
  line-height: 1;
  font-weight: bold;
}

.itemDetail .toDetailFixedArea .toDetailFixdBookmark {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 320px;
  margin-bottom: 20px;
  padding: 12px;
  background-color: #f8f8f8;
}

.itemDetail .toDetailFixedArea .toDetailFixdBookmark a {
  font-size: 16px;
  font-size: 1rem;
}

.itemDetail .toDetailFixedArea .toDetailFixdBookmark a.added i.fa {
  color: #e84505;
}

/*
# image zoom

## 商品詳細 メイン画像拡大

*/

.itemDetail #colImgArea #imagePrevArea .imageMouseOver {
  font-size: 12px;
  font-size: 0.75rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 11;
  width: 160px;
  height: 160px;
  padding: 40px 0 8px;
  background-color: rgba(255, 255, 255, 0.85);
  border: 1px solid #cccccc;
  text-align: center;
}

.zoomContainer {
  z-index: 1;
}

.zoomContainer .zoomWindowContainer .zoomWindow {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
}

/*
# item data

## 商品詳細 商品内容テーブル

*/

.itemDetail .colItemDataWrap {
  margin-bottom: 24px;
}

.itemDetail .colItemDataWrap .colItemData {
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  width: 64%;
}

.itemDetail .colItemDataWrap .colItemData .labelType03 {
  margin-top: 4px;
}

.itemDetail .colItemDataWrap .colItemData .brandLink {
  color: #333333;
}

.itemDetail .colItemDataWrap .colItemData .itemScore {
  margin-top: 8px;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li {
  float: left;
  position: relative;
  margin-right: 12px;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li:last-child {
  margin-right: 0;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 20px;
  margin-left: 2px;
  line-height: 1;
  vertical-align: middle;
  letter-spacing: 0.15em;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating:before {
  display: block;
  position: absolute;
  content: "";
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating:before {
  font-size: 16px;
  font-size: 1rem;
  top: 0;
  left: 0;
  content: "\F091\F091\F091";
  width: 100%;
  font-family: FontAwesome;
  color: #cccccc;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating.threeScore .itemScoreRatingItem {
  width: 100%;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating.twoScore .itemScoreRatingItem {
  width: 66.666%;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating.oneScore .itemScoreRatingItem {
  width: 33.333%;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating .itemScoreRatingItem {
  position: relative;
  overflow: hidden;
  text-indent: -200%;
  white-space: nowrap;
  height: 100%;
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating .itemScoreRatingItem:before {
  display: block;
  position: absolute;
  content: "";
}

.itemDetail .colItemDataWrap .colItemData .itemScore li .itemScoreRating .itemScoreRatingItem:before {
  font-size: 16px;
  font-size: 1rem;
  top: 0;
  left: 0;
  content: "\F091\F091\F091";
  text-indent: 0;
  font-family: FontAwesome;
  color: #ffc000;
}

.itemDetail .colItemDataWrap .colItemData .itemInquiryBtn {
  font-size: 16px;
  font-size: 1rem;
  margin: 12px 12px 0 0;
  padding: 4px;
}

.itemDetail .colItemDataWrap .colItemData .itemMaterialDlBtn {
  display: inline-block;
  position: relative;
}

.itemDetail .colItemDataWrap .colItemData .itemMaterialDlBtn a {
  margin: 12px auto 0;
}

.itemDetail .colItemDataWrap .colItemData .itemMaterialDlBtn .aboutAlertConfig {
  position: absolute;
  top: 9px;
  right: -20px;
  width: 18px;
  height: 34px;
  text-align: left;
}

.itemDetail .colItemDataWrap .colItemData .itemMaterialDlBtn .aboutAlertConfig .balloonCont {
  font-size: 14px;
  font-size: 0.875rem;
  padding: 8px;
}

.itemDetail .colItemDataWrap .colAvailableInfo {
  font-size: 12px;
  font-size: 0.75rem;
  float: right;
  width: 35%;
}

.itemDetail .colItemDataWrap .colAvailableInfo th,
.itemDetail .colItemDataWrap .colAvailableInfo td {
  padding: 4px;
  text-align: center;
  font-weight: normal;
}

.itemDetail .colItemDataWrap .colAvailableInfo th i.fa,
.itemDetail .colItemDataWrap .colAvailableInfo td i.fa {
  font-size: 15px;
  font-size: 0.9375rem;
}

.itemDetail .colItemDataWrap .colAvailableInfo th {
  width: 75%;
}

.itemDetail .colItemDataWrap .colAvailableInfo td {
  width: 25%;
}

.itemDetail .itemDescriptionTxt {
  position: relative;
  overflow: hidden;
  padding: 12px 12px 0;
}

.itemDetail .itemDescriptionTxt .itemDescriptionHd {
  padding: 4px 8px;
  margin-bottom: 16px;
  background-color: #eeeeee;
  font-weight: bold;
}

.itemDetail .itemDescriptionTxt .userHtmlView {
  margin-bottom: 24px;
}

.itemDetail .itemDescriptionTxt #descriptionViewCover.openBtn {
  background: -svg-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6), #ffffff);
  background: -owg-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6), #ffffff);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(rgba(255, 255, 255, 0.6)), to(#ffffff));
  background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6), #ffffff);
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.itemDetail .itemDescriptionTxt #descriptionViewCover.openBtn [class*="btnType"] {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  top: 50px;
  display: block;
  width: 260px;
  margin: auto;
  border: 2px solid #999999;
}

.itemDetail .itemDescriptionTxt #descriptionViewCover:not(.openBtn) [class*="btnType"] {
  font-size: 16px;
  font-size: 1rem;
  display: block;
  width: 260px;
  margin: 16px auto;
  border: 2px solid #999999;
}

/*
# item image modal

## 商品詳細のモーダル

*/

#imageModal {
  height: 725px;
}

#imageModal #modalImagePrevArea {
  position: relative;
  width: 100%;
}

#imageModal #modalImagePrevArea .mainImageViewer {
  float: left;
  width: 600px;
  height: 627px;
}

#imageModal #modalImagePrevArea .mainImageViewer .viewerBox {
  position: relative;
  width: 600px;
  height: 600px;
  background-color: #ffffff;
}

#imageModal #modalImagePrevArea .mainImageViewer .viewerBox img {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  max-width: 600px;
  max-height: 600px;
  vertical-align: middle;
}

#imageModal #modalImagePrevArea .mainImageViewer .imgCaption {
  font-size: 12px;
  font-size: 0.75rem;
  margin: 8px 0 0;
}

#imageModal #modalImagePrevArea .mainImageViewer.imageCover .viewerBox {
  position: relative;
}

#imageModal #modalImagePrevArea .mainImageViewer.imageCover .viewerBox:before {
  display: block;
  position: absolute;
  content: "";
}

#imageModal #modalImagePrevArea .mainImageViewer.imageCover .viewerBox:before {
  z-index: 10;
  width: 100%;
  height: 100%;
  background: url(/pc/assets/image/common/layout/dot.gif) repeat;
}

#imageModal #modalImagePrevArea .thumImg {
  float: right;
  width: 208px;
  margin-bottom: 8px;
}

#imageModal #modalImagePrevArea .thumImg > li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  float: left;
  width: 100px;
  height: 100px;
  margin-right: 8px;
  margin-bottom: 8px;
  border: 1px solid #cccccc;
  cursor: pointer;
}

#imageModal #modalImagePrevArea .thumImg > li:nth-child(even) {
  margin-right: 0;
}

#imageModal #modalImagePrevArea .thumImg > li img {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

#imageModal #modalImagePrevArea .thumImg > li.slick-active {
  border: 1px solid #6f6f6f;
}

#imageModal .inrCloseBtn {
  position: relative;
  z-index: 10;
  float: right;
  width: 208px;
  margin-top: -34px;
}

/*
# item slider

## 商品詳細の画像スライド

*/

.slick-slider {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before {
  display: table;
  content: '';
}

.slick-track:after {
  display: table;
  content: '';
  clear: both;
}

.slick-loading .slick-track,
.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

[dir='rtl'] .slick-slide {
  float: right;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/*
# colImgArea

## 商品詳細 メイン画像

*/

.itemDetail #colImgArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  width: 400px;
}

.itemDetail #colImgArea #imagePrevArea {
  display: none;
  position: relative;
  width: 100%;
}

.itemDetail #colImgArea #imagePrevArea .mainImageViewer {
  width: 100%;
  height: 400px;
  margin: 16px auto;
}

.itemDetail #colImgArea #imagePrevArea .mainImageViewer .viewerBox {
  position: relative;
  width: 400px;
  height: 400px;
  margin-bottom: 8px;
  background-color: #ffffff;
}

.itemDetail #colImgArea #imagePrevArea .mainImageViewer .viewerBox img {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  max-width: 400px;
  max-height: 400px;
  vertical-align: middle;
}

.itemDetail #colImgArea #imagePrevArea .mainImageViewer.imageCover .viewerBox {
  position: relative;
}

.itemDetail #colImgArea #imagePrevArea .mainImageViewer.imageCover .viewerBox:before {
  display: block;
  position: absolute;
  content: "";
}

.itemDetail #colImgArea #imagePrevArea .mainImageViewer.imageCover .viewerBox:before {
  z-index: 10;
  width: 100%;
  height: 100%;
  background: url(/pc/assets/image/common/layout/dot.gif) repeat;
}

.itemDetail #colImgArea #imagePrevArea .thumImg {
  margin-bottom: 8px;
}

.itemDetail #colImgArea #imagePrevArea .thumImg > li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  float: left;
  width: 73.6px;
  height: 73.6px;
  margin-right: 8px;
  margin-bottom: 8px;
  border: 1px solid #cccccc;
  cursor: pointer;
}

.itemDetail #colImgArea #imagePrevArea .thumImg > li:nth-child(5n) {
  margin-right: 0;
}

.itemDetail #colImgArea #imagePrevArea .thumImg > li img {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.itemDetail #colImgArea .imageHidden {
  padding: 24px 0;
}

.itemDetail #colImgArea .relatedWord {
  margin-bottom: 24px;
}

.itemDetail #colImgArea .relatedWord > li {
  position: relative;
  float: left;
  margin-right: 8px;
  padding-right: 8px;
}

.itemDetail #colImgArea .relatedWord > li:after {
  display: block;
  position: absolute;
  content: "";
}

.itemDetail #colImgArea .relatedWord > li:after {
  top: 4px;
  right: 0;
  width: 1px;
  height: 14px;
  border-right: 1px solid #333333;
}

.itemDetail #colImgArea .relatedWord > li:first-child,
.itemDetail #colImgArea .relatedWord > li:last-child {
  margin-right: 0;
  padding-right: 0;
}

.itemDetail #colImgArea .relatedWord > li:first-child:after,
.itemDetail #colImgArea .relatedWord > li:last-child:after {
  border-right: none;
}

.itemDetail #colImgArea.fixArea {
  position: fixed;
  top: 0;
}

.itemDetail #colImgArea.underFixArea {
  position: absolute;
  bottom: 0;
}

/*
# sold out

## 商品詳細 品切れ表示

*/

#soldOut {
  width: 100%;
  margin-bottom: 56px;
  padding: 32px 0;
  background-color: #eeeeee;
  text-align: center;
  background-image: linear-gradient(-45deg, #eeeeee 40%, #dfdfdf 40%, #dfdfdf 50%, #eeeeee 50%, #eeeeee 90%, #dfdfdf 90%, #dfdfdf);
  background-size: 8px 8px;
}

#soldOut .soldOutTxt {
  font-size: 21px;
  font-size: 1.3125rem;
  margin-bottom: 0;
  color: #6f6f6f;
}

/*
# structure

## 商品詳細 構成

*/

.itemDetail #colItemsWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  width: 100%;
}

.itemDetail #colItemsWrap #colInfoArea {
  width: 0;
  width: calc(100% - 440px);
  float: right;
  min-width: 560px;
  max-width: 860px;
  margin-bottom: 40px;
  /* 商品詳細専用ヨコ並びボタン*/
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn {
  width: 100%;
  margin: 24px auto 56px;
  text-align: center;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn [class*="btnType"] {
  width: 45%;
  margin-right: 20px;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn [class*="btnType"]:last-child {
  margin-right: 0;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn [class*="btnType"].added i.fa {
  color: #e84505;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn [class*="btnType"] i.fa-angle-double-down {
  font-size: 28px;
  font-size: 1.75rem;
  vertical-align: middle;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn .sideByBtnBookmark {
  position: relative;
  display: inline;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn .sideByBtnBookmark .bookmarkTooltip {
  width: 0;
  width: calc(100% - 25px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 0.875rem;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
  display: none;
  position: absolute;
  top: 39px;
  left: 0;
  z-index: 10;
  padding: 9px;
  border: 2px solid #999999;
  border-radius: 3px;
  opacity: 0;
  background: #ffffff;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn .sideByBtnBookmark .bookmarkTooltip:before,
.itemDetail #colItemsWrap #colInfoArea .sideByBtn .sideByBtnBookmark .bookmarkTooltip:after {
  display: block;
  position: absolute;
  top: -5px;
  left: 50%;
  width: 14px;
  height: 14px;
  margin: 0 0 0 -7px;
  background: #ffffff;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  content: "";
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn .sideByBtnBookmark .bookmarkTooltip:before {
  top: -8px;
  background: #999999;
}

.itemDetail #colItemsWrap #colInfoArea .sideByBtn .sideByBtnBookmark:hover .bookmarkTooltip {
  display: block;
  opacity: 1;
}

/*
# summaryPriceTable

## 商品詳細 小さい内訳表

*/

.itemDetail .summaryPriceTableWrap #detailsVarietyNum {
  display: none;
}

.itemDetail .summaryPriceTableWrap .summaryPriceTable {
  font-size: 14px;
  font-size: 0.875rem;
}

.itemDetail .summaryPriceTableWrap .summaryPriceTable th {
  width: 60%;
}

.itemDetail .summaryPriceTableWrap .summaryPriceTable td {
  width: 40%;
}

.itemDetail .summaryPriceTableWrap .summaryPriceTable td .price {
  font-size: 18px;
  font-size: 1.125rem;
  color: #e60012;
  font-weight: bold;
}

.itemDetail .summaryPriceTableWrap .summaryPriceTable td .beforePrice {
  position: relative;
  display: inline-block;
  padding-right: 2em;
  text-decoration: line-through;
}

.itemDetail .summaryPriceTableWrap .summaryPriceTable td .beforePrice:after {
  display: block;
  position: absolute;
  content: "\F061";
}

.itemDetail .summaryPriceTableWrap .summaryPriceTable td .beforePrice:after {
  top: 0;
  right: 0.5em;
  font-family: FontAwesome;
}

.itemDetail .summaryPriceTableWrap .summaryPriceAccBtn {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 0.875rem;
  display: none;
  height: 48px;
  margin-top: -25px;
  padding: 6px;
  background-color: #eeeeee;
  border-top: 1px solid #ffffff;
  border-bottom: 1px solid #999999;
  text-align: center;
  font-weight: bold;
  cursor: pointer;
}

.itemDetail .summaryPriceTableWrap .summaryPriceAccBtn .numberOfCases {
  position: relative;
  margin-bottom: 0;
}

.itemDetail .summaryPriceTableWrap .summaryPriceAccBtn .numberOfCases:after {
  display: block;
  position: absolute;
  content: "\F107";
}

.itemDetail .summaryPriceTableWrap .summaryPriceAccBtn .numberOfCases:after {
  font-size: 18px;
  font-size: 1.125rem;
  top: 14px;
  right: 0;
  left: 0;
  margin: auto;
  font-family: FontAwesome;
}

/*
# sup recommend

## フッター上おすすめ商品欄

*/

.supRecommend {
  width: 100%;
  margin-top: 64px;
}

.supRecommend .supRecommendInner {
  padding: 32px 32px 32px 0;
  border: 1px dashed #999999;
}

.supRecommend .supRecommendInner .showcaseType02 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  width: 25%;
  width: calc(100% / 4);
  position: relative;
  float: left;
  padding-left: 32px;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseItemsImgBlock {
  display: block;
  position: relative;
  width: 180px;
  margin: auto;
  padding-top: 180px;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseItemsImgBlock.ItemsSoldout {
  position: relative;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseItemsImgBlock.ItemsSoldout:after {
  display: block;
  position: absolute;
  content: "\54C1\5207\308C\4E2D";
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseItemsImgBlock.ItemsSoldout:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 75px;
  left: 0;
  width: 100%;
  line-height: 30px;
  background-color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseItemsImgBlock .showcaseItemsImg {
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 180px;
  height: 180px;
  background-color: #ffffff;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseItemsImgBlock a.btnType01 {
  font-size: 14px;
  font-size: 0.875rem;
  margin-top: 8px;
  padding: 4px;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  color: #333333;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  padding: 4px;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock p {
  margin: 0;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock:nth-child(2) {
  width: auto;
  vertical-align: top;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock:nth-child(3) {
  position: relative;
  height: 90px;
  text-align: right;
  vertical-align: bottom;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .showcaseHd {
  font-size: 13px;
  font-size: 0.8125rem;
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
  margin: 6px auto;
  line-height: 1.5;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .showcaseHd > a {
  display: block;
  color: #333333;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountLabel span {
  font-size: 11px;
  font-size: 0.6875rem;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountPop.balloonWrap {
  position: static;
  width: auto;
  height: auto;
  text-align: right;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountPop.balloonWrap .balloonCont {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 4px 8px;
  text-align: left;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountBalloon {
  position: relative;
  position: relative;
  font-size: 13px;
  font-size: 0.8125rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  display: inline-block;
  margin-bottom: 8px;
  padding: 2px 4px;
  border: 2px solid #e60012;
  background-color: #ffffff;
  color: #e60012;
  font-weight: bold;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountBalloon:before {
  display: block;
  position: absolute;
  content: "";
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountBalloon:after {
  display: block;
  position: absolute;
  content: "";
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountBalloon:before {
  bottom: -10px;
  right: 12px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 7px 0 7px;
  border-color: #e60012 transparent transparent transparent;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .discountBalloon:after {
  bottom: -7px;
  right: 14px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 5px 0 5px;
  border-color: #ffffff transparent transparent transparent;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .priceBox {
  position: absolute;
  bottom: 0;
  right: 4px;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .priceBox .price {
  font-weight: bold;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .priceBox .price.discount {
  text-decoration: line-through;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .priceBox .price span {
  font-size: 12px;
  font-size: 0.75rem;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .priceBox .afterPrice {
  color: #e60012;
  font-weight: bold;
}

.supRecommend .supRecommendInner .showcaseType02 .showcaseBox > .showcaseBlock .priceBox .afterPrice span {
  font-size: 12px;
  font-size: 0.75rem;
}

/*
# supplierinfo

## 商品詳細 サプ情報

*/

.itemDetail .supplierHdWrap {
  position: relative;
  margin: 0 0 24px;
  border-bottom: 1px solid #999999;
  /* 取引拒否の場合 */
}

.itemDetail .supplierHdWrap .supplierHd {
  font-size: 21px;
  font-size: 1.3125rem;
  position: relative;
  padding: 8px 10.5em 8px 0;
  font-weight: bold;
}

.itemDetail .supplierHdWrap .supplierHd a {
  display: block;
  color: #333333;
}

.itemDetail .supplierHdWrap .dealNoticeMsg {
  color: #e60012;
  font-weight: bold;
  text-align: right;
}

.itemDetail .supplierHdWrap .supDiscountLabel {
  margin: 8px 0 16px;
}

.itemDetail .supplierHdWrap .stockUpTxt {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 16px;
}

.itemDetail .supplierHdWrap .campaignLink {
  width: 60%;
  margin: 0 auto 16px;
}

/*
# login

## ログイン

*/

.login {
  position: relative;
}

.login .supLoginBtn {
  position: absolute;
  width: auto;
  top: 0;
  right: 40px;
  padding: 6px 8px;
}

.login .loginColWrap {
  width: 1000px;
  margin: 32px auto;
  padding-bottom: 0;
}

.login .loginColWrap .loginInputArea {
  float: left;
  width: 482px;
  border: none;
}

.login .loginColWrap .appealArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: right;
  width: 486px;
  height: 486px;
  border: 1px solid #999999;
}

.login .loginColWrap .appealArea a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.login .loginColWrap .appealArea a:hover {
  opacity: 0.7;
}

/*
# account

## 登録情報管理ページ

*/

.account .frameType01 .magazineList {
  margin-left: 24px;
}

.account .frameType01 .magazineList > li {
  position: relative;
}

.account .frameType01 .magazineList > li .magaTtl {
  position: relative;
  margin-top: 0;
  padding-left: 32px;
}

.account .frameType01 .magazineList > li .magaTtl:before {
  display: block;
  position: absolute;
  content: "";
}

.account .frameType01 .magazineList > li .magaTtl:before {
  font-size: 20px;
  font-size: 1.25rem;
  top: 2px;
  left: 2px;
  width: 20px;
  line-height: 1;
  font-family: FontAwesome;
  content: "\F003";
  color: #333333;
}

.account .frameType01 .magazineList > li > p {
  padding-left: 32px;
}

.account .frameType01 .magazineList > li .prosCons {
  position: absolute;
  top: 0;
  right: 0;
}

.account .frameType01 .magazineList > li:last-child > p {
  margin-bottom: 0;
}

.account .frameType01 .agreement {
  margin-top: 24px;
}

.account .frameType01 .agreement .inner {
  font-size: 14px;
  font-size: 0.875rem;
  height: 260px;
  padding: 12px;
  border: 1px solid #999999;
  background-color: #ffffff;
  overflow-y: scroll;
}

.account .frameType01 .agreement .inner .listSecondLayers li {
  list-style-type: none;
  list-style-position: inside;
  counter-increment: cnt;
}

.account .frameType01 .agreement .inner .listSecondLayers li:before {
  display: marker;
  content: "(" counter(cnt) ") ";
}

.account .frameType01 .agreement .agreeCheckArea {
  margin-top: 32px;
  text-align: center;
}

.account .frameType01 .apiInfoAreaTokenCode .tokenCodeText {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px 10px;
}

.account .frameType01 .apiInfoAreaTokenCode .tokenCodeText .copyBtn {
  width: 80px;
  margin: 0 24px;
}

/*
# alert

## 新着入荷アラート

*/

/* カテゴリ選択 */

.alertCategory .frameType01 .categList {
  width: 33.333%;
  width: calc(100% / 3);
  float: left;
  margin-bottom: 0;
}

.alertCategory .frameType01 .categList > li:before {
  display: none;
}

/* サプライヤー選択 */

.alertSup #searchResultsWrap #searchResultsArea {
  width: 0;
  width: calc(100% - 230px);
  float: right;
  min-width: 770px;
  max-width: 1070px;
}

.alertSup #searchResultsWrap #searchResultsArea .categoryPath {
  font-size: 13px;
  font-size: 0.8125rem;
  width: 100%;
  margin: 8px auto;
  color: #4d4c4c;
}

.alertSup #searchResultsWrap #searchResultsArea .categoryPath > li {
  position: relative;
  display: inline-block;
  margin-left: 0.4em;
  padding-left: 1.2em;
}

.alertSup #searchResultsWrap #searchResultsArea .categoryPath > li:before {
  display: block;
  position: absolute;
  content: "";
}

.alertSup #searchResultsWrap #searchResultsArea .categoryPath > li:before {
  font-size: 15px;
  font-size: 0.9375rem;
  top: 0;
  left: 0;
  margin-top: -2px;
  font-family: FontAwesome;
  content: "\F105";
  color: #999999;
}

.alertSup #searchResultsWrap #searchResultsArea .categoryPath > li:first-child {
  margin-left: 0;
  padding-left: 0;
}

.alertSup #searchResultsWrap #searchResultsArea .categoryPath > li:first-child:before {
  display: none;
}

.alertSup #searchResultsWrap #searchResultsArea .categoryPath > li > a:hover {
  color: #005ce6;
}

.alertSup #searchResultsWrap #searchResultsArea .supplierList {
  margin-bottom: 72px;
  border-top: 1px solid #6f6f6f;
}

.alertSup #searchResultsWrap #searchResultsArea .supplierList li {
  position: relative;
}

.alertSup #searchResultsWrap #searchResultsArea .supplierList li .supHdWrap {
  position: relative;
  width: 60%;
}

.alertSup #searchResultsWrap #searchResultsArea .supplierList li .supHdWrap .hdType03 {
  margin-top: 4px;
}

.alertSup #searchResultsWrap #searchResultsArea .supplierList li .supHdWrap .itemCount {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 8px;
}

.alertSup #searchResultsWrap #searchResultsArea .supplierList li .supHdWrap .supInfoBtn {
  font-size: 14px;
  font-size: 0.875rem;
  width: 120px;
  margin-right: 8px;
  padding: 4px;
}

.alertSup #searchResultsWrap #searchResultsArea .supplierList li .supSelectBtn {
  position: absolute;
  top: 40px;
  right: 0;
  width: 35%;
}

/*
# Inquiry Detail

## 問合せ詳細

*/

.inquiryDetail .inquiryMainContents {
  margin: 0 auto 40px;
  padding-bottom: 40px;
  border-bottom: 1px dotted #999999;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner {
  width: 920px;
  margin: 0 auto;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .txtListType02 {
  padding-left: 1em;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .txtListType02 li {
  position: relative;
  margin: 0 40px 8px 0;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .txtListType02 li:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .txtListType02 li:after {
  top: 0;
  right: -20px;
  width: 1px;
  height: 20px;
  border-right: 1px solid #999999;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .txtListType02 li:last-child:after {
  display: none;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .senderName {
  margin-bottom: 16px;
  padding-left: 1em;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .inquiryMainMessage {
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  margin: 0 auto;
  padding: 24px;
  background-color: #eeeeee;
  border: 2px solid #999999;
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .inquiryMainMessage:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiryDetail .inquiryMainContents .inquiryMainInner .inquiryMainMessage:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  top: 8px;
  bottom: 8px;
  left: 8px;
  right: 8px;
  border: 2px solid #999999;
}

.inquiryDetail .inquiryReplyContents {
  margin: 0 auto 56px;
}

.inquiryDetail .inqMesTtl {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  margin-bottom: 8px;
  padding: 0 216px 8px 3em;
  text-indent: -3em;
  font-weight: bold;
  border-bottom: 1px dotted #999999;
}

.inquiryDetail .inqMesTtl .date {
  font-size: 14px;
  font-size: 0.875rem;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  font-weight: normal;
}

.inquiryDetail .inqMesTxt {
  margin-bottom: 0;
  line-height: 1.8;
  word-wrap: break-word;
}

.inquiryDetail .inquiryMyMessage {
  position: relative;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 920px;
  margin: 0 0 32px auto;
  padding: 24px;
  background-color: #eeeeee;
  border: 2px solid #999999;
}

.inquiryDetail .inquiryMyMessage:before {
  display: block;
  position: absolute;
  content: "";
}

.inquiryDetail .inquiryMyMessage:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiryDetail .inquiryMyMessage:before {
  bottom: 16px;
  right: -20px;
  z-index: 2;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 0 9px 20px;
  border-color: transparent transparent transparent #eeeeee;
}

.inquiryDetail .inquiryMyMessage:after {
  bottom: 14px;
  right: -24px;
  width: 0;
  height: 0;
  z-index: 1;
  border-style: solid;
  border-width: 11px 0 11px 23px;
  border-color: transparent transparent transparent #999999;
}

.inquiryDetail .inquiryYourMessage {
  position: relative;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 920px;
  margin: 0 auto 32px 0;
  padding: 24px;
  background-color: #ffffff;
  border: 2px solid #999999;
}

.inquiryDetail .inquiryYourMessage:before {
  display: block;
  position: absolute;
  content: "";
}

.inquiryDetail .inquiryYourMessage:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiryDetail .inquiryYourMessage:before {
  bottom: 16px;
  left: -20px;
  z-index: 2;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 20px 9px 0;
  border-color: transparent #ffffff transparent transparent;
}

.inquiryDetail .inquiryYourMessage:after {
  bottom: 14px;
  left: -24px;
  width: 0;
  height: 0;
  z-index: 1;
  border-style: solid;
  border-width: 11px 23px 11px 0;
  border-color: transparent #999999 transparent transparent;
}

.inquiryDetail .inquiryYourMessage.newMsg {
  border-color: #e60012;
}

.inquiryDetail .inquiryYourMessage.newMsg:after {
  border-color: transparent #e60012 transparent transparent;
}

.inquiryDetail .inquiryYourMessage.newMsg .inqMesTtl {
  position: relative;
  text-indent: 1em;
}

.inquiryDetail .inquiryYourMessage.newMsg .inqMesTtl:after {
  display: block;
  position: absolute;
  content: "NEW!";
}

.inquiryDetail .inquiryYourMessage.newMsg .inqMesTtl:after {
  font-size: 14px;
  font-size: 0.875rem;
  top: 0;
  left: 0;
  width: 46px;
  padding: 0 4px;
  background-color: #e60012;
  text-indent: 0;
  text-align: center;
  font-weight: normal;
  color: #ffffff;
}

.inquiryDetail .inquirySupportMessage {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 920px;
  margin: 0 auto;
  padding: 24px;
  background-color: #f7f7f7;
  border: 2px solid #999999;
}

.inquiryReply .inquiryMainContents {
  width: 920px;
  margin: 40px auto 56px;
}

.inquiryReply .inquiryMainContents .txtListType02 {
  padding-left: 1em;
}

.inquiryReply .inquiryMainContents .txtListType02 li {
  position: relative;
  margin: 0 40px 8px 0;
}

.inquiryReply .inquiryMainContents .txtListType02 li:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiryReply .inquiryMainContents .txtListType02 li:after {
  top: 0;
  right: -20px;
  width: 1px;
  height: 20px;
  border-right: 1px solid #999999;
}

.inquiryReply .inquiryMainContents .txtListType02 li:last-child:after {
  display: none;
}

.inquiryReply .inquiryMainContents .senderName {
  margin-bottom: 16px;
  padding-left: 1em;
}

.inquiryReply .inquiryMainContents .inquiryMainMessage {
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  margin: 0 auto 24px;
  padding: 24px;
  background-color: #eeeeee;
  border: 2px solid #999999;
}

.inquiryReply .inquiryMainContents .inquiryMainMessage:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiryReply .inquiryMainContents .inquiryMainMessage #inqTtl {
  position: absolute;
  top: 20px;
  left: 80px;
}

.inquiryReply .inquiryMainContents .inquiryMainMessage #otherTxt {
  display: none;
}

.inquiryReply .inqMesTtl {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  margin-bottom: 8px;
  padding: 0 0 8px 3em;
  text-indent: -3em;
  font-weight: bold;
}

.inquiryReply .textareaFormType02 {
  height: 300px;
}

.inquiryReply #nowLoading {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 200px;
  height: 200px;
  margin: auto;
}

/*
# inquiry

## 問合せ一覧

*/

.inquiry .inqTypeCell > a {
  position: relative;
}

.inquiry .inqTypeCell > a:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiry .inqTypeCell > a:after {
  top: -8px;
  right: -18px;
  font-family: FontAwesome;
  content: "\F2D2";
}

.inquiry .subject > a {
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 8px;
}

.inquiry .subject i {
  position: relative;
  font-size: 17px;
  font-size: 1.0625rem;
  display: inline-block;
  width: 17px;
  height: 17px;
  padding-right: 8px;
}

.inquiry .subject i:after {
  display: block;
  position: absolute;
  content: "";
}

.inquiry .subject i.read:after {
  top: -2px;
  left: 0;
  font-family: FontAwesome;
  content: "\F2B7";
  color: #999999;
}

.inquiry .subject i.unread:after {
  top: -2px;
  left: 0;
  font-family: FontAwesome;
  content: "\F003";
  color: #fa4c07;
}

.inquiry .subject > p {
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  overflow: hidden;
  margin-bottom: 0;
}

/*
# magazine

## メルマガ受信設定ページ

*/

.magazine .frameType01 {
  width: 970px;
  margin: 0 auto 24px;
}

.magazine .frameType01 .magazineList {
  margin-left: 24px;
}

.magazine .frameType01 .magazineList > li {
  position: relative;
}

.magazine .frameType01 .magazineList > li .magaTtl {
  position: relative;
  padding-left: 32px;
}

.magazine .frameType01 .magazineList > li .magaTtl:before {
  display: block;
  position: absolute;
  content: "";
}

.magazine .frameType01 .magazineList > li .magaTtl:before {
  font-size: 20px;
  font-size: 1.25rem;
  top: 2px;
  left: 2px;
  width: 20px;
  line-height: 1;
  font-family: FontAwesome;
  content: "\F003";
  color: #333333;
}

.magazine .frameType01 .magazineList > li > p {
  padding-left: 32px;
}

.magazine .frameType01 .magazineList > li .prosCons {
  position: absolute;
  top: 0;
  right: 0;
}

.magazine .frameType01 .supCount {
  font-size: 21px;
  font-size: 1.3125rem;
  padding: 0 4px;
  font-weight: bold;
}

.magazine.edit .magazineList > li {
  border-bottom: 1px dotted #999999;
}

.magazine.edit .magazineList > li:last-child {
  border-bottom: none;
}

/*
# mypageTop

## マイページトップ

*/

.mypageTop #mypageColWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}

.mypageTop #mypageColWrap #mypageColPrArea {
  float: right;
  width: 180px;
  min-height: 1px;
  margin-left: 24px;
}

.mypageTop #mypageColWrap #mypageColPrArea .supPr li {
  position: relative;
}

.mypageTop #mypageColWrap #mypageColPrArea .supPr li:after {
  display: block;
  position: absolute;
  content: "PR";
}

.mypageTop #mypageColWrap #mypageColPrArea .supPr li:after {
  font-size: 11px;
  font-size: 0.6875rem;
  top: 4px;
  left: 4px;
  width: 27px;
  line-height: 15px;
  border: 1px solid #333333;
  background-color: #ffffff;
  text-align: center;
}

.mypageTop #mypageColWrap #mypageColPrArea .supPr li a {
  display: block;
  color: #333333;
}

.mypageTop #mypageColWrap #mypageColPrArea .supPr li img {
  width: 180px;
  height: 180px;
}

.mypageTop #mypageColWrap #mypageColPrArea .supPr li .prItemTtl {
  font-size: 14px;
  font-size: 0.875rem;
  margin: 8px auto;
}

.mypageTop #mypageColWrap #mypageColPrArea .supPr li p {
  font-size: 12px;
  font-size: 0.75rem;
}

.mypageTop #mypageColWrap #mypageColPrArea .prBnrArea {
  margin-top: 56px;
}

.mypageTop #mypageColWrap #mypageColPrArea .prBnrArea li {
  position: relative;
}

.mypageTop #mypageColWrap #mypageColPrArea .prBnrArea li:after {
  display: block;
  position: absolute;
  content: "PR";
}

.mypageTop #mypageColWrap #mypageColPrArea .prBnrArea li:after {
  font-size: 11px;
  font-size: 0.6875rem;
  top: -24px;
  left: 0;
  width: 27px;
  line-height: 15px;
  border: 1px solid #333333;
  background-color: #ffffff;
  text-align: center;
}

.mypageTop #mypageColWrap #mypageColPrArea .prBnrArea li a {
  display: block;
  color: #333333;
}

.mypageTop #mypageColWrap #mypageColPrArea .prBnrArea li img {
  display: block;
  margin: 0 auto;
}

.mypageTop #mypageColWrap #mypageColPrArea .prBnrArea li .prItemTtl {
  font-size: 14px;
  font-size: 0.875rem;
  margin: 8px auto;
}

.mypageTop #mypageColWrap #mypageColAsideArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  width: 264px;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  margin-bottom: 24px;
  border: 1px solid #6f6f6f;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea p {
  margin-bottom: 0;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .buyerStatusHd {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px 3px 0 0;
  padding: 12px;
  background-color: #eeeeee;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .buyerStatusHd .statusTxt {
  font-size: 16px;
  font-size: 1rem;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .buyerStatusHd .statusTxt span {
  padding-right: 16px;
  font-weight: bold;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .buyerStatusHd .statusTxt [data-supballoon] {
  display: inline-block;
  top: -24px;
  right: 18px;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .buyerStatusHd .statusTxt [data-supballoon] .balloonCont {
  font-size: 14px;
  font-size: 0.875rem;
  padding: 8px;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 12px;
  font-size: 0.75rem;
  padding: 16px;
  border-bottom: 1px dotted #333333;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li:last-child {
  border-bottom: none;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .paymentInfoHd {
  font-size: 11px;
  font-size: 0.6875rem;
  margin-bottom: 12px;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .paymentInfoHd img {
  padding-right: 4px;
  vertical-align: bottom;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .available {
  font-size: 16px;
  font-size: 1rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 220px;
  margin: 0 auto 8px;
  padding: 4px;
  border: 2px solid #333333;
  text-align: center;
  font-weight: bold;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .termsLink {
  position: relative;
  display: inline-block;
  margin-top: 8px;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .termsLink:after {
  display: block;
  position: absolute;
  content: "\F105";
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .termsLink:after {
  font-size: 14px;
  font-size: 0.875rem;
  top: -2px;
  right: -10px;
  font-family: FontAwesome;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .cedynaAmount dt {
  padding: 4px 4px 0;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .cedynaAmount dd {
  font-size: 14px;
  font-size: 0.875rem;
  padding: 0 4px 4px;
  border-bottom: 1px dotted #333333;
  text-align: right;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .cedynaAmount dd:last-child {
  border-bottom: none;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .paidImplement {
  text-align: center;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .paidImplement img.paidImplementBtn {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .paidImplement img.paidImplementBtn:not(.tb):hover {
  -webkit-box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li.premiumBuyerPr {
  padding: 8px;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .cedynaImplement {
  text-align: center;
}

.mypageTop #mypageColWrap #mypageColAsideArea #buyerStatusArea .paymentInfo ul li .cedynaImplement a {
  font-size: 11px;
  font-size: 0.6875rem;
  width: 220px;
  border: 1px solid #333333;
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideHd {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  position: relative;
  margin: 0 0 16px;
  padding: 6px;
  border-bottom: 1px solid #6f6f6f;
  font-weight: bold;
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideHd:before {
  display: block;
  position: absolute;
  content: "";
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideHd:after {
  display: block;
  position: absolute;
  content: "";
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideHd:before {
  bottom: -10px;
  left: 19px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 9px 0 9px;
  border-color: #6f6f6f transparent transparent transparent;
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideHd:after {
  bottom: -8px;
  left: 20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 8px 0 8px;
  border-color: #ffffff transparent transparent transparent;
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideInr {
  margin: 0 8px 16px;
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideInr ul > li {
  line-height: 1.9;
}

.mypageTop #mypageColWrap #mypageColAsideArea .mypageAsideBtn {
  font-size: 15px;
  font-size: 0.9375rem;
  padding: 6px;
}

.mypageTop #mypageColWrap #mypageColMainArea {
  width: 52%;
  width: calc(100% - 492px);
  float: right;
  min-width: 508px;
  max-width: 808px;
}

.mypageTop #mypageColWrap #mypageColMainArea .importantInfo p:last-child {
  margin-bottom: 0;
}

.mypageTop #mypageColWrap #mypageColMainArea .usageHistory li,
.mypageTop #mypageColWrap #mypageColMainArea .userService li {
  width: 0;
  width: calc(100% / 4 - 9px);
  float: left;
  margin-right: 12px;
}

.mypageTop #mypageColWrap #mypageColMainArea .usageHistory li:last-child,
.mypageTop #mypageColWrap #mypageColMainArea .userService li:last-child {
  margin-right: 0;
}

.mypageTop #mypageColWrap #mypageColMainArea .usageHistory li a,
.mypageTop #mypageColWrap #mypageColMainArea .userService li a {
  color: #122546;
}

.mypageTop #mypageColWrap #mypageColMainArea .usageHistory li a i.fa,
.mypageTop #mypageColWrap #mypageColMainArea .userService li a i.fa {
  font-size: 45px;
  font-size: 2.8125rem;
  display: block;
  margin: 8px auto;
}

.mypageTop #mypageColWrap #mypageColMainArea .usageHistory li a:hover,
.mypageTop #mypageColWrap #mypageColMainArea .userService li a:hover {
  text-decoration: none;
}

.mypageTop #mypageColWrap #mypageColMainArea .userService li a {
  font-size: 16px;
  font-size: 1rem;
}

.mypageTop #mypageColWrap #mypageColMainArea .userService li a i.fa {
  font-size: 30px;
  font-size: 1.875rem;
}

/*
# profile

## 自己紹介情報変更

*/

.profile .balloonWrap {
  position: relative;
  position: static;
  width: auto;
  height: auto;
  margin-bottom: 24px;
  padding-left: 20px;
  cursor: pointer;
}

.profile .balloonWrap:after {
  display: block;
  position: absolute;
  content: "\F06A";
}

.profile .balloonWrap:after {
  font-size: 18px;
  font-size: 1.125rem;
  top: 0;
  left: 0;
  font-family: FontAwesome;
}

.profile .balloonWrap > .balloonBox {
  left: 20px;
  top: 24px;
  z-index: 10;
}

.profile .balloonWrap .balloonCont {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 720px;
  height: 300px;
  padding: 24px;
}

/*
# purchase

## 注文・予約履歴

*/

.purchase .purchaseInfo {
  display: table;
  margin-bottom: 56px;
}

.purchase .purchaseInfo dl {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table-cell;
  width: 50%;
  padding: 16px;
}

.purchase .purchaseInfo dl:first-child {
  border-right: 1px dotted #6f6f6f;
}

.purchase .purchaseInfo dl dt {
  font-size: 18px;
  font-size: 1.125rem;
  margin: 16px 0 4px;
  font-weight: bold;
  /* ！マーク付メッセージ */
}

.purchase .purchaseInfo dl dt:first-child {
  margin-top: 0;
}

.purchase .purchaseInfo dl dt .exclamMsg {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  padding-left: 1.8em;
  color: #e60012;
}

.purchase .purchaseInfo dl dt .exclamMsg:before {
  display: block;
  position: absolute;
  content: "\F06A";
}

.purchase .purchaseInfo dl dt .exclamMsg:before {
  font-size: 18px;
  font-size: 1.125rem;
  top: -6px;
  left: 10px;
  font-family: FontAwesome;
}

.purchase .purchaseInfo dl dd {
  font-size: 14px;
  font-size: 0.875rem;
  padding-left: 24px;
}

.purchase .purchaseInfo dl dd .infoLink {
  position: relative;
  display: block;
  padding-right: 1em;
  text-align: right;
}

.purchase .purchaseInfo dl dd .infoLink:after {
  display: block;
  position: absolute;
  content: "\F105";
}

.purchase .purchaseInfo dl dd .infoLink:after {
  top: 0;
  right: 0;
  font-family: FontAwesome;
}

.purchase .statementTable {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 16px;
}

.purchase .statementTable td p {
  margin-bottom: 0;
}

.purchase .statementTable td p.discount {
  text-decoration: line-through;
  color: #999999;
}

.purchase .statementTable td .taxUnit {
  font-size: 12px;
  font-size: 0.75rem;
}

.purchase .sideByBtn .invoiceBtn {
  display: block;
  margin: 0 auto 40px;
}

.purchase .purchaseCsvDl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 16px;
}

.purchase .purchaseCsvDl .sortBox {
  margin-bottom: 0;
}

.purchase .purchaseCsvDl .sortBox .paginationTxt {
  margin: 0;
  float: none;
}

.purchase .purchaseCsvDl .csvBtn {
  font-size: 14px;
  font-size: 0.875rem;
  width: 24%;
  padding: 4px;
}

/*
# cedyna

## cedyna申し込み

*/

.cedynaRegist .secHd {
  font-size: 22px;
  font-size: 1.375rem;
  margin-bottom: 12px;
  padding: 10px 16px;
  border-left: #c4283b 6px solid;
  background: #f5f5f5;
  font-weight: bold;
}

.cedynaRegist .merit {
  margin: 16px auto 24px;
}

.cedynaRegist .merit li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 32%;
  width: calc(100% / 3 - 8px);
  float: left;
  min-height: 120px;
  margin-right: 12px;
  border: 1px solid #999999;
}

.cedynaRegist .merit li .meritHd {
  font-size: 14px;
  font-size: 0.875rem;
  padding: 8px 0;
  background-color: #f1f1f1;
  font-weight: bold;
  text-align: center;
}

.cedynaRegist .merit li p {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 0;
  padding: 8px;
}

.cedynaRegist .merit li:last-child {
  margin-right: 0;
}

.cedynaRegist .registFlow {
  margin: 16px auto 24px;
}

.cedynaRegist .registFlow li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 18.2%;
  width: calc(100% / 5 - 16px);
  position: relative;
  float: left;
  min-height: 102px;
  margin-right: 20px;
  padding: 8px;
  border: 1px solid #999999;
  text-align: center;
}

.cedynaRegist .registFlow li:after {
  display: block;
  position: absolute;
  content: "\F054";
}

.cedynaRegist .registFlow li .flowHd {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.cedynaRegist .registFlow li p {
  margin-bottom: 0;
}

.cedynaRegist .registFlow li:last-child {
  margin-right: 0;
}

.cedynaRegist .registFlow li:last-child:after {
  display: none;
}

.cedynaRegist .registFlow li:after {
  font-size: 18px;
  font-size: 1.125rem;
  font-family: FontAwesome;
  top: 40px;
  right: -18px;
}

/*
# np_credit

## NP掛け払い申し込み

*/

.npCreditRegist .secHd {
  font-size: 22px;
  font-size: 1.375rem;
  margin-bottom: 12px;
  padding: 10px 16px;
  border-left: #c4283b 6px solid;
  background: #f5f5f5;
  font-weight: bold;
}

.npCreditRegist .merit {
  margin: 16px auto 24px;
}

.npCreditRegist .merit li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 32%;
  width: calc(100% / 3 - 8px);
  float: left;
  min-height: 120px;
  margin-right: 12px;
  border: 1px solid #999999;
}

.npCreditRegist .merit li .meritHd {
  font-size: 18px;
  font-size: 1.125rem;
  padding: 8px 0;
  background-color: #f1f1f1;
  font-weight: bold;
  text-align: center;
}

.npCreditRegist .merit li p {
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 0;
  padding: 8px;
}

.npCreditRegist .merit li:last-child {
  margin-right: 0;
}

.npCreditRegist .registFlow {
  margin: 16px auto 24px;
}

.npCreditRegist .registFlow li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 18.2%;
  width: calc(100% / 3 - 16px);
  position: relative;
  float: left;
  min-height: 128px;
  margin-right: 24px;
  padding: 8px;
  border: 1px solid #999999;
  text-align: center;
}

.npCreditRegist .registFlow li:after {
  display: block;
  position: absolute;
  content: "\F054";
}

.npCreditRegist .registFlow li .flowHd {
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.npCreditRegist .registFlow li p {
  margin-bottom: 0;
}

.npCreditRegist .registFlow li:last-child {
  margin-right: 0;
}

.npCreditRegist .registFlow li:last-child:after {
  display: none;
}

.npCreditRegist .registFlow li:after {
  font-size: 18px;
  font-size: 1.125rem;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  right: -21px;
  font-family: FontAwesome;
}

.npCreditRegist .faqList dt {
  margin-bottom: 8px;
  color: #122546;
  font-weight: bold;
}

.npCreditRegist .faqList dd {
  margin-bottom: 24px;
  padding-left: 2em;
  text-indent: -2em;
}

.npCreditRegist .faqList dd table {
  margin-top: 16px;
  padding-left: 0;
  text-indent: 0;
}

.npCreditRegist .applyBtn {
  font-size: 22px;
  font-size: 1.375rem;
  display: block;
  width: 640px;
  margin: 56px auto;
  padding: 16px 0;
}

.npCreditRegist .phoneNum {
  font-size: 28px;
  font-size: 1.75rem;
  color: #14cae5;
}

.npCreditRegist .phoneNum .businessHours {
  font-size: 14px;
  font-size: 0.875rem;
  color: #6f6f6f;
}

.npCreditRegist .supportAddress {
  font-size: 20px;
  font-size: 1.25rem;
  margin-bottom: 0;
  color: #14cae5;
}

/*
# paid

## paid申し込み

*/

.paidRegist .paidHd {
  margin: 0 auto 24px;
}

.paidRegist .secHd {
  font-size: 22px;
  font-size: 1.375rem;
  margin-bottom: 12px;
  padding: 10px 16px;
  border-left: #c4283b 6px solid;
  background: #f5f5f5;
  font-weight: bold;
}

.paidRegist .merit {
  width: 960px;
  margin: 0 auto;
}

.paidRegist .applyBtn {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
  width: 700px;
  height: 79px;
  margin: 32px auto 56px;
  background-image: url(/pc/assets/image/common/layout/regist/paid/btn_regist01.png);
  border: none;
}

.paidRegist .applyBtn:hover {
  opacity: 0.8;
}

.paidRegist .registFlow {
  margin: 16px auto 16px;
}

.paidRegist .registFlow li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 23.3%;
  width: calc(100% / 4 - 15px);
  position: relative;
  float: left;
  min-height: 128px;
  margin-right: 20px;
  padding: 8px;
  border: 1px solid #999999;
  text-align: center;
}

.paidRegist .registFlow li:after {
  display: block;
  position: absolute;
  content: "\F054";
}

.paidRegist .registFlow li .flowHd {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.paidRegist .registFlow li p {
  margin-bottom: 0;
}

.paidRegist .registFlow li:last-child {
  margin-right: 0;
}

.paidRegist .registFlow li:last-child:after {
  display: none;
}

.paidRegist .registFlow li:after {
  font-size: 18px;
  font-size: 1.125rem;
  font-family: FontAwesome;
  top: 50px;
  right: -18px;
}

.paidRegist .faqList dt {
  margin-bottom: 8px;
  color: #122546;
  font-weight: bold;
}

.paidRegist .faqList dd {
  margin-bottom: 24px;
  padding-left: 2em;
  text-indent: -2em;
}

.paidRegist .faqList dd table {
  margin-top: 16px;
  padding-left: 0;
  text-indent: 0;
}

/*
# structure

## 構成

*/

/* 全てにチェックと横並びボタン */

.checkallWrap {
  margin: 12px 0 12px 8px;
}

.checkallWrap input[type="checkbox"].checkFormType01.checkFormType01 + label.checkallTxt {
  vertical-align: bottom;
}

.checkallWrap .deleteBtn,
.checkallWrap .readEndBtn,
.checkallWrap .alertConfigBtn {
  position: relative;
  font-size: 12px;
  font-size: 0.75rem;
  width: auto;
  margin: 0 12px;
}

.checkallWrap .deleteBtn:after,
.checkallWrap .readEndBtn:after,
.checkallWrap .alertConfigBtn:after {
  display: block;
  position: absolute;
  content: "";
}

.checkallWrap .readEndBtn,
.checkallWrap .alertConfigWrap {
  position: relative;
  float: right;
}

.checkallWrap .alertConfigWrap {
  margin-right: 1em;
}

.checkallWrap .aboutAlertConfig {
  position: absolute;
  top: -4px;
  right: -8px;
  width: 18px;
  height: 34px;
}

.checkallWrap .aboutAlertConfig .balloonCont {
  font-size: 14px;
  font-size: 0.875rem;
  padding: 8px;
}

/* パスワード変更アラート */

.passAlert {
  position: fixed;
  top: 0 !important;
  right: 0;
  left: 0;
  bottom: 0;
  height: 90%;
  max-height: 460px;
  margin: auto !important;
}

.passAlert .alertModalInner {
  overflow: hidden;
  height: 100%;
}

.passAlert .alertModalInner .alertModalCont {
  height: 80%;
  height: calc(100% - 50px);
  overflow-y: auto;
}

/* シーセンスの商品一覧 */

.cxenseReccomend {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  margin: 40px auto;
  padding: 24px;
}

.cxenseReccomend iframe {
  max-width: 100%;
}

/* バイヤーマイページ ヘッドテキスト */

.mypageTxtAd {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: 24px;
  padding: 8px;
  background-color: #fff0cc;
}

/* 問合せテキストボックス */

.supportInquiryTxt {
  height: 300px;
}

/*
# table

## テーブルの個別デザイン

*/

/* テーブル一番下のボーダー削除 */

.frameType01 table.bdBtmN > tbody tr:last-child th,
.frameType01 table.bdBtmN > tbody tr:last-child td {
  border-bottom: none;
}

/*
# usage detail

## ご利用明細ページ

*/

.usageDetail {
  position: relative;
}

.usageDetail .usageDetailNav {
  border-radius: 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  margin-bottom: 40px;
  padding: 24px;
  background-color: #f8f8f8;
}

.usageDetail .usageDetailNav dl dt {
  font-size: 18px;
  font-size: 1.125rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.usageDetail .usageDetailNav dl dd {
  font-size: 16px;
  font-size: 1rem;
  margin-right: 24px;
  float: left;
}

.usageDetail .usageDetailNav dl dd a {
  position: relative;
  display: block;
  padding-left: 24px;
}

.usageDetail .usageDetailNav dl dd a:before {
  display: block;
  position: absolute;
  content: "";
}

.usageDetail .usageDetailNav dl dd a:before {
  top: 0;
  left: 10px;
  content: "\F105";
  font-family: FontAwesome;
}

.usageDetail .usageDetailNav dl dd a:after {
  bottom: 0;
}

.usageDetail .selectTermWrap {
  margin-bottom: 40px;
  text-align: center;
}

.usageDetail .selectTermWrap .selectTerm {
  margin: 0 auto 24px;
}

.usageDetail .selectTermWrap .selectTerm li {
  vertical-align: middle;
}

.usageDetail .selectTermWrap .selectTerm li #labelCurrentN {
  display: inline-block;
}

.usageDetail .selectTermWrap .selectTerm li .pastYear {
  width: 120px;
  margin-right: 4px;
}

.usageDetail .selectTermWrap .selectTerm li .pastMonth {
  width: 120px;
  margin: 0 4px 0 8px;
  vertical-align: middle;
}

.usageDetail .selectTermSumTotal {
  border-radius: 3px;
  width: 800px;
  margin: 8px auto 56px;
  border: 3px solid #999999;
}

.usageDetail .selectTermSumTotal table.selectTermSumTable {
  width: 100%;
  margin: 0 auto;
  border-collapse: collapse;
}

.usageDetail .selectTermSumTotal table.selectTermSumTable tr {
  border-bottom: 3px solid #999999;
}

.usageDetail .selectTermSumTotal table.selectTermSumTable tr:last-child {
  border-bottom: none;
}

.usageDetail .selectTermSumTotal table.selectTermSumTable th,
.usageDetail .selectTermSumTotal table.selectTermSumTable td {
  padding: 16px;
  vertical-align: middle;
}

.usageDetail .selectTermSumTotal table.selectTermSumTable th {
  font-size: 21px;
  font-size: 1.3125rem;
  background-color: #eeeeee;
  font-weight: bold;
}

.usageDetail .selectTermSumTotal table.selectTermSumTable td {
  font-size: 30px;
  font-size: 1.875rem;
  width: 40%;
  line-height: 1;
  text-align: right;
}

.usageDetail .selectTermSumTotal table.selectTermSumTable td span {
  padding-left: 8px;
}

.usageDetail .selectTermResult .notice {
  width: 800px;
  margin: 48px auto 0;
}

.usageDetail .selectTermResult .selectTermDetailWrap .headingTable {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 0;
}

.usageDetail .selectTermResult .selectTermDetailWrap .headingTable th,
.usageDetail .selectTermResult .selectTermDetailWrap .headingTable td {
  padding: 8px;
}

.usageDetail .selectTermResult .selectTermDetailWrap .statementTable {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 8px;
  border-top: none;
  border-bottom: 3px solid #999999;
}

.usageDetail .selectTermResult .selectTermDetailWrap .statementTable th,
.usageDetail .selectTermResult .selectTermDetailWrap .statementTable td {
  padding: 8px;
}

.usageDetail .selectTermResult .selectTermDetailWrap .statementTable td {
  vertical-align: top;
}

.usageDetail .selectTermResult .selectTermDetailWrap .statementTable td p {
  margin-bottom: 0;
}

.usageDetail .selectTermResult .selectTermDetailWrap .statementTable td .taxUnit {
  font-size: 12px;
  font-size: 0.75rem;
}

.usageDetail .selectTermResult .selectTermDetailWrap .detailAmount {
  text-align: right;
}

.usageDetail .selectTermResult .selectTermDetailWrap .detailAmount.subtotal {
  border-top: 1px dotted #999999;
}

.usageDetail .selectTermResult .selectTermDetailWrap .taxInfoTxt {
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 16px;
  text-align: right;
}

.usageDetail .selectTermResult .selectTermDetailWrap .discountDetailsTableWrap {
  margin-bottom: 32px;
}

.usageDetail .selectTermResult .selectTermDetailWrap .discountDetailsTableWrap .discountDetailsTable > tbody th,
.usageDetail .selectTermResult .selectTermDetailWrap .discountDetailsTableWrap .discountDetailsTable > tbody td {
  font-size: 14px;
  font-size: 0.875rem;
}

/*
# search ad

## 商品一覧内広告

*/

.search .adInList {
  margin: 24px auto 0;
  padding-bottom: 24px;
  text-align: center;
}

.search .adInList iframe {
  max-width: 100%;
}

.search .showcaseWrap.listView + .adInList {
  border-bottom: 1px dotted #cccccc;
}

.search .showcaseWrap.gridView + .adInList {
  position: relative;
  top: -30px;
  margin: 0 auto;
  padding-bottom: 0;
}

/*
# searchCategoryPath

## カテゴリー導線

*/

.search .searchCategoryPath {
  margin-top: 56px;
}

.search .searchCategoryPath .searchCategoryListWarp {
  padding: 0 8px;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
  margin-bottom: 8px;
  padding-left: 1em;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList:before {
  display: block;
  position: absolute;
  content: "\2514";
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList:before {
  top: 2px;
  left: 0;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList.categoryAll {
  padding-left: 0;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList.categoryAll:before {
  display: none;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList.categoryLarge {
  margin-left: 16px;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList.categoryMedium {
  margin-left: 32px;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList.categorySmall {
  margin-left: 48px;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList li {
  margin: 0 8px 8px 0;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList li.categorySmallNonumber {
  margin-right: 16px;
}

.search .searchCategoryPath .searchCategoryListWarp .searchCategoryList li span {
  font-size: 14px;
  font-size: 0.875rem;
}

/*
# searchColumn

## 左カラム検索

*/

#searchResultsWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}

#searchResultsWrap #searchToolArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  width: 190px;
}

#searchResultsWrap #searchToolArea a:not([class*="btnType"]) {
  color: #333333;
}

#searchResultsWrap #searchToolArea .searchToolHd {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  position: relative;
  margin: 0 0 16px;
  padding: 6px;
  border-bottom: 1px solid #6f6f6f;
  font-weight: bold;
}

#searchResultsWrap #searchToolArea .searchToolHd:before {
  display: block;
  position: absolute;
  content: "";
}

#searchResultsWrap #searchToolArea .searchToolHd:after {
  display: block;
  position: absolute;
  content: "";
}

#searchResultsWrap #searchToolArea .searchToolHd span {
  font-size: 14px;
  font-size: 0.875rem;
  padding-left: 4px;
  font-weight: normal;
}

#searchResultsWrap #searchToolArea .searchToolHd:before {
  bottom: -10px;
  left: 19px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 9px 0 9px;
  border-color: #6f6f6f transparent transparent transparent;
}

#searchResultsWrap #searchToolArea .searchToolHd:after {
  bottom: -8px;
  left: 20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 8px 0 8px;
  border-color: #ffffff transparent transparent transparent;
}

#searchResultsWrap #searchToolArea .searchToolInr {
  margin: 0 0 16px;
  padding: 0 8px;
}

#searchResultsWrap #searchToolArea .searchToolInr .inputFormType01 {
  font-size: 14px;
  font-size: 0.875rem;
  height: 32px;
  margin-bottom: 8px;
}

#searchResultsWrap #searchToolArea .searchToolInr .inputFormType01.retailPrice {
  width: 126px;
  margin-right: 4px;
}

#searchResultsWrap #searchToolArea .searchToolInr .selectFormType01 select {
  font-size: 14px;
  font-size: 0.875rem;
}

#searchResultsWrap #searchToolArea .searchToolInr ul {
  margin-bottom: 16px;
}

#searchResultsWrap #searchToolArea .searchToolInr ul input[type="checkbox"].checkFormType02.checkFormType02 + label {
  letter-spacing: -0.03em;
}

#searchResultsWrap #searchToolArea .categoryListWrap span {
  font-size: 12px;
  font-size: 0.75rem;
  color: #6f6f6f;
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList {
  margin: 8px 0 0 8px;
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList li {
  margin-bottom: 8px;
  line-height: 1.4;
  font-weight: normal;
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList li.currentCate {
  position: relative;
  font-weight: bold;
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList li.currentCate:after {
  display: block;
  position: absolute;
  content: "\F105";
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList li.currentCate:after {
  top: 0;
  left: -10px;
  font-family: FontAwesome;
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList li.currentCate > .categoryList {
  margin-bottom: 24px;
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList li.underCateLine {
  margin-left: 1em;
  text-indent: -1em;
}

#searchResultsWrap #searchToolArea .categoryListWrap .categoryList li .labelType02 {
  margin-right: 4px;
  color: #ffffff;
}

#searchResultsWrap #searchToolArea .categoryListWrap .supplierList {
  font-size: 12px;
  font-size: 0.75rem;
  margin-top: 8px;
}

#searchResultsWrap #searchToolArea .categoryListWrap .supplierList li {
  position: relative;
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: 1px dotted #d9d9d9;
}

#searchResultsWrap #searchToolArea .categoryListWrap .supplierList li:after {
  display: block;
  position: absolute;
  content: "";
}

#searchResultsWrap #searchToolArea .categoryListWrap .supplierList li .labelType02 {
  margin-right: 4px;
  color: #ffffff;
}

#searchResultsWrap #searchToolArea .categoryListWrap .supplierList li:last-child {
  border-bottom: none;
}

#searchResultsWrap #searchToolArea .moreRefineSearchTool {
  position: relative;
  margin: 48px auto 24px;
}

#searchResultsWrap #searchToolArea .moreRefineSearchTool:before {
  display: block;
  position: absolute;
  content: "";
}

#searchResultsWrap #searchToolArea .moreRefineSearchTool .searchToolDetailHd {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  font-weight: bold;
}

#searchResultsWrap #searchToolArea .moreRefineSearchTool > .searchToolInr {
  border-bottom: 1px dotted #6f6f6f;
}

#searchResultsWrap #searchToolArea .moreRefineSearchTool > .searchToolInr:last-child {
  border-bottom: none;
}

#searchResultsWrap #searchToolArea .moreRefineSearchTool:before {
  top: -32px;
  right: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: auto;
  border-style: solid;
  border-width: 16px 16px 0 16px;
  border-color: #eeeeee transparent transparent transparent;
}

#searchResultsWrap #searchToolArea .refineSearchTool {
  margin: 24px auto 24px;
}

#searchResultsWrap #searchToolArea .refineSearchTool .searchToolDetailHd {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  font-weight: bold;
}

#searchResultsWrap #searchToolArea .refineSearchTool > .searchToolInr {
  border-bottom: 1px dotted #6f6f6f;
}

#searchResultsWrap #searchToolArea .refineSearchTool > .searchToolInr:last-child {
  border-bottom: none;
}

#searchResultsWrap #searchToolArea .searchToolBtn {
  font-size: 15px;
  font-size: 0.9375rem;
  padding: 6px;
}

#searchResultsWrap #searchToolArea .searchDetailClear {
  display: block;
  margin: 24px auto 0;
  color: #6f6f6f;
  text-align: center;
}

#searchResultsWrap #searchResultsArea {
  width: 0;
  width: calc(100% - 230px);
  float: right;
  min-width: 770px;
  max-width: 1070px;
}

#searchResultsWrap #searchResultsArea .materialDlBtn {
  position: relative;
  margin: 0 0 16px 0;
  text-align: right;
}

#searchResultsWrap #searchResultsArea .materialDlBtn a {
  font-size: 16px;
  font-size: 1rem;
  width: auto;
  line-height: 1;
}

#searchResultsWrap #searchResultsArea .materialDlBtn .aboutAlertConfig {
  position: absolute;
  top: -5px;
  right: -20px;
  width: 18px;
  height: 34px;
  text-align: left;
}

#searchResultsWrap #searchResultsArea .materialDlBtn .aboutAlertConfig .balloonCont {
  font-size: 14px;
  font-size: 0.875rem;
  padding: 8px;
}

#searchResultsWrap #searchResultsArea .searchResultsBookmark {
  margin: 0 0 16px 0;
}

#searchResultsWrap #searchResultsArea .searchResultsBookmark > div {
  float: right;
  margin-bottom: 0;
}

#searchResultsWrap #searchResultsArea .searchResultsBookmark .materialDlBtn {
  margin: 0 30px 0 0;
}

/*
# search help

## ノーヒット時

*/

.search .searchHelpHd {
  font-size: 18px;
  font-size: 1.125rem;
  position: relative;
  margin: 24px auto;
  padding: 8px;
  border-bottom: 1px solid #999999;
}

.search .searchHelpHd .hdTxt .itemName {
  font-weight: bold;
  color: #cd0010;
}

.search .searchHelpHd .hdTxt del {
  color: #999999;
}

/*
# showcase gridView

## 商品一覧 グリッド表示

*/

.search .showcaseWrap.gridView {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /* グリッド5カラム商品ブロック */
}

.search .showcaseWrap.gridView .showcaseType01 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  width: 20%;
  width: calc(100% / 5);
  float: left;
  position: relative;
  min-width: 196px;
  margin: 0 0 48px;
  padding: 0 8px;
  border-right: 1px dotted #cccccc;
}

.search .showcaseWrap.gridView .showcaseType01:nth-child(5n) {
  border-right: none;
}

.search .showcaseWrap.gridView .showcaseType01:last-child {
  border-right: none;
}

@media all and (max-width: 1290px) {
  .search .showcaseWrap.gridView .showcaseType01 {
    /* MonitorSize Under 1290px */
    width: 25%;
    width: calc(100% / 4);
    min-width: 192px;
    padding: 0 4px;
  }

  .search .showcaseWrap.gridView .showcaseType01:nth-child(5n) {
    border-right: 1px dotted #cccccc;
  }

  .search .showcaseWrap.gridView .showcaseType01:nth-child(4n) {
    border-right: none;
  }
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock {
  display: block;
  position: relative;
  width: 180px;
  margin: auto;
  padding-top: 180px;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
  width: 100%;
  height: 100%;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock a:hover {
  opacity: 0.7;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout {
  position: relative;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  display: block;
  position: absolute;
  content: "\54C1\5207\308C\4E2D";
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  line-height: 30px;
  background-color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg {
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 180px;
  height: 180px;
  background-color: #ffffff;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  padding: 4px;
  color: #333333;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox p {
  margin: 0;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseHd {
  font-size: 13px;
  font-size: 0.8125rem;
  margin: 8px auto;
  min-height: 60px;
  line-height: 1.5;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseHd > a {
  display: block;
  color: #333333;
  word-break: break-all;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore {
  margin-bottom: 4px;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore li {
  font-size: 11px;
  font-size: 0.6875rem;
  float: left;
  margin-right: 6px;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore li:last-child {
  margin-right: 0;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore li .itemScoreIcons {
  position: relative;
  display: inline-block;
  margin-left: 2px;
  padding-left: 14px;
  font-family: FontAwesome;
  color: #ffc000;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore li .itemScoreIcons:after {
  display: block;
  position: absolute;
  content: "";
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .itemScore li .itemScoreIcons:after {
  font-size: 13px;
  font-size: 0.8125rem;
  content: "\F091";
  top: -3px;
  left: 0;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .availabilityLabel i.fa {
  padding-left: 4px;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .paymentLabel span {
  font-size: 10px;
  font-size: 0.625rem;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo {
  margin: 8px auto;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupInfoBtn {
  font-size: 14px;
  font-size: 0.875rem;
  display: block;
  padding: 2px 16px;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupInfoBtn .showcaseSupInfoName {
  font-size: 11px;
  font-size: 0.6875rem;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupName {
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  font-size: 13px;
  font-size: 0.8125rem;
  margin-bottom: 4px;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupName a {
  color: #333333;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName {
  position: relative;
  font-size: 12px;
  font-size: 0.75rem;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName:after {
  display: block;
  position: absolute;
  content: "\30D6\30E9\30F3\30C9\FF1A";
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName:after {
  font-size: 11px;
  font-size: 0.6875rem;
  top: 1px;
  left: 0;
  letter-spacing: -0.1em;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName a {
  white-space: nowrap;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
  text-indent: 4.2em;
  color: #999999;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBlock {
  position: relative;
  width: 100%;
  margin: 4px auto;
  text-align: right;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .discountPop.balloonWrap {
  position: static;
  width: auto;
  height: auto;
  text-align: right;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .discountPop.balloonWrap .balloonCont {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 4px 8px;
  text-align: left;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .discountBalloon {
  position: relative;
  position: relative;
  font-size: 13px;
  font-size: 0.8125rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  display: inline-block;
  margin-bottom: 8px;
  padding: 2px 4px;
  border: 2px solid #e60012;
  background-color: #ffffff;
  color: #e60012;
  font-weight: bold;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .discountBalloon:before {
  display: block;
  position: absolute;
  content: "";
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .discountBalloon:after {
  display: block;
  position: absolute;
  content: "";
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .discountBalloon:before {
  bottom: -10px;
  right: 12px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 7px 0 7px;
  border-color: #e60012 transparent transparent transparent;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .discountBalloon:after {
  bottom: -7px;
  right: 14px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 5px 0 5px;
  border-color: #ffffff transparent transparent transparent;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .retailPriceArea {
  display: none;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox .price {
  font-weight: bold;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox .price.discount {
  text-decoration: line-through;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox .price span {
  font-size: 12px;
  font-size: 0.75rem;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox .afterPrice {
  color: #e60012;
  font-weight: bold;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox .afterPrice span {
  font-size: 12px;
  font-size: 0.75rem;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox a.registBtn {
  font-size: 14px;
  font-size: 0.875rem;
  display: block;
  text-align: center;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox .priceHide {
  font-size: 14px;
  font-size: 0.875rem;
}

.search .showcaseWrap.gridView .showcaseType01 .showcaseBox .priceBox .priceHide a.dealBtn {
  display: block;
  text-align: center;
}

/*
# showcase listView

## 商品一覧 リスト表示

*/

.search .showcaseWrap.listView {
  /* リスト1カラム商品ブロック */
}

.search .showcaseWrap.listView .showcaseType01 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  position: relative;
  min-height: 184px;
  padding-left: 140px;
  border-bottom: 1px dotted #cccccc;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock {
  display: block;
  position: absolute;
  top: 16px;
  left: 0;
  width: 130px;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
  width: 100%;
  height: 100%;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock a:hover {
  opacity: 0.7;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout {
  position: relative;
  position: absolute;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  display: block;
  position: absolute;
  content: "\54C1\5207\308C\4E2D";
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  line-height: 30px;
  background-color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 130px;
  background-color: #ffffff;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 80%;
  width: calc(100% - 220px);
  min-height: 162px;
  padding: 16px;
  color: #333333;
  vertical-align: middle;
  word-break: break-all;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox p {
  margin: 0;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseHd {
  margin-bottom: 6px;
  line-height: 1.5;
  font-weight: bold;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseHd > a {
  display: block;
  color: #333333;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .itemScore li {
  font-size: 12px;
  font-size: 0.75rem;
  float: left;
  margin-right: 8px;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .itemScore li:last-child {
  margin-right: 0;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .itemScore li .itemScoreIcons {
  position: relative;
  display: inline-block;
  margin-left: 4px;
  padding-left: 16px;
  font-family: FontAwesome;
  color: #ffc000;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .itemScore li .itemScoreIcons:after {
  display: block;
  position: absolute;
  content: "";
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .itemScore li .itemScoreIcons:after {
  font-size: 14px;
  font-size: 0.875rem;
  content: "\F091";
  top: -2px;
  left: 0;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .availabilityLabel,
.search .showcaseWrap.listView .showcaseType01 .showcaseBox .paymentLabel,
.search .showcaseWrap.listView .showcaseType01 .showcaseBox .supDiscountLabel {
  display: inline-block;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .availabilityLabel i.fa {
  padding-left: 4px;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo {
  margin: 12px auto 0;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupInfoBtn {
  font-size: 14px;
  font-size: 0.875rem;
  display: inline-block;
  width: auto;
  padding: 2px 16px;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupInfoBtn .showcaseSupInfoName {
  font-size: 11px;
  font-size: 0.6875rem;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupName {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 4px;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseSupName a {
  color: #333333;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName {
  position: relative;
  font-size: 12px;
  font-size: 0.75rem;
  text-indent: 5em;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName:after {
  display: block;
  position: absolute;
  content: "\30D6\30E9\30F3\30C9\FF1A";
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName:after {
  top: 0;
  left: -5em;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .showcaseSupInfo .showcaseBrandName a {
  color: #999999;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBlock {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  right: 0;
  width: 220px;
  margin: auto;
  padding: 16px;
  text-align: right;
  word-break: normal;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .discountPop.balloonWrap {
  position: static;
  width: auto;
  height: auto;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .discountPop.balloonWrap .balloonCont {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 4px 8px;
  text-align: left;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .discountBalloon {
  position: relative;
  position: relative;
  font-size: 13px;
  font-size: 0.8125rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  display: inline-block;
  margin-bottom: 8px;
  padding: 2px 4px;
  border: 2px solid #e60012;
  background-color: #ffffff;
  color: #e60012;
  font-weight: bold;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .discountBalloon:before {
  display: block;
  position: absolute;
  content: "";
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .discountBalloon:after {
  display: block;
  position: absolute;
  content: "";
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .discountBalloon:before {
  bottom: -10px;
  right: 12px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 7px 0 7px;
  border-color: #e60012 transparent transparent transparent;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .discountBalloon:after {
  bottom: -6px;
  right: 14px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 5px 0 5px;
  border-color: #ffffff transparent transparent transparent;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .retailPriceArea {
  font-size: 13px;
  font-size: 0.8125rem;
  margin: 6px auto;
  text-align: center;
  color: #999999;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .retailPriceArea .retailPrice {
  text-align: right;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .retailPriceArea .retailPrice span {
  font-size: 11px;
  font-size: 0.6875rem;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox .price {
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox .price.discount {
  text-decoration: line-through;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox .price span {
  font-size: 12px;
  font-size: 0.75rem;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox .afterPrice {
  font-size: 18px;
  font-size: 1.125rem;
  color: #e60012;
  font-weight: bold;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox .afterPrice span {
  font-size: 12px;
  font-size: 0.75rem;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox a.registBtn {
  font-size: 14px;
  font-size: 0.875rem;
  display: block;
  text-align: center;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox .priceHide {
  font-size: 14px;
  font-size: 0.875rem;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .priceBox .priceHide a.dealBtn {
  display: block;
}

.search .showcaseWrap.listView .showcaseType01 .showcaseBox .bookmarkBtn {
  position: absolute;
  top: 147px;
  left: 0;
}

/*
# supplier

## サプ商品一覧

*/

.search .supplierHdWrap {
  position: relative;
  padding: 8px;
  margin-bottom: 24px;
  padding-right: 14em;
  border-bottom: 1px solid #666666;
}

.search .supplierHdWrap .supplierHd {
  font-size: 24px;
  font-size: 1.5rem;
  display: inline;
  font-weight: bold;
}

.search .supplierHdWrap .supplierHd .companyHdTxt {
  font-size: 18px;
  font-size: 1.125rem;
  padding-left: 8px;
  font-weight: normal;
}

.search .supplierHdWrap .linkItems {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
}

.search .supplierArea {
  margin-bottom: 40px;
}

.search .supplierArea img {
  max-width: 100%;
}

.search .supplierArea .supDiscountLabel {
  margin-bottom: 20px;
}

.search .supplierArea .shopBanner,
.search .supplierArea .brandImage {
  margin-bottom: 24px;
  text-align: center;
}

.search .supplierArea .shopBanner img,
.search .supplierArea .brandImage img {
  max-height: 300px;
}

.search .supplierArea .shopPrComment {
  font-size: 15px;
  font-size: 0.9375rem;
}

.search .supplierArea .shopInfoArea h3:first-child {
  margin-top: 0;
  padding-top: 0;
}

.search .supplierArea .shopInfoArea .supplierFeatureWrap {
  padding: 0 8px;
}

.search .supplierArea .shopInfoArea .supplierFeatureWrap > a {
  display: block;
  color: #333333;
}

.search .supplierArea .shopInfoArea .supplierFeatureWrap .featureEndDate {
  position: relative;
  font-size: 13px;
  font-size: 0.8125rem;
  margin: 0 auto 8px;
  padding-left: 20px;
  color: #6f6f6f;
}

.search .supplierArea .shopInfoArea .supplierFeatureWrap .featureEndDate:after {
  display: block;
  position: absolute;
  content: "\F017";
}

.search .supplierArea .shopInfoArea .supplierFeatureWrap .featureEndDate:after {
  font-size: 16px;
  font-size: 1rem;
  top: 1px;
  left: 0;
  line-height: 1;
  font-family: FontAwesome;
}

.search .supplierArea .shopInfoArea .supplierFeatureWrap .supFeatureHd {
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.search .supplierArea .shopInfoArea .supplierFeatureWrap .supFeatureImg {
  display: block;
  margin: 0 auto 24px;
}

.search .searchFieldType01 {
  float: left;
  width: 40%;
}

/*
# featureList

## 特集一覧

*/

#openFeature .featureList,
#pastFeature .featureList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-bottom: 48px;
  padding: 0 12px;
}

#openFeature .featureList li,
#pastFeature .featureList li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 32.4%;
  width: calc(100% / 3 - 8px);
  margin-right: 12px;
  margin-bottom: 12px;
  padding: 12px;
}

#openFeature .featureList li:nth-child(3n),
#pastFeature .featureList li:nth-child(3n) {
  margin-right: 0;
}

#openFeature .featureList li a,
#pastFeature .featureList li a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

#openFeature .featureList li a:hover,
#pastFeature .featureList li a:hover {
  opacity: 0.7;
}

#openFeature .featureList li img,
#pastFeature .featureList li img {
  width: 100%;
}

#openFeature .featureList li .update,
#pastFeature .featureList li .update {
  font-size: 12px;
  font-size: 0.75rem;
  color: #cd0010;
}

#openFeature .featureList li p,
#pastFeature .featureList li p {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 0;
}

#pastFeature {
  background-color: whitesmoke;
}

#pastFeature .hdType06 {
  margin-top: 0;
  padding-top: 0;
}

#pastFeature .featureList {
  margin-bottom: 0;
}

#pastFeature .featureList li {
  height: auto;
}

#pastFeature .featureList li .update {
  color: #333333;
}

/* トップのみ */

@media all and (max-width: 1300px) {
  /* MonitorSize Under 1300px */

  #topColMainArea #openFeature li {
    width: 49%;
    width: calc(100% / 2 - 12px);
  }

  #topColMainArea #openFeature li:nth-child(3n) {
    margin-right: 24px;
  }

  #topColMainArea #openFeature li:nth-child(2n) {
    margin-right: 0;
  }
}

/*
# supplier feature list

## サプライヤーオリジナル特集 リスト

*/

.supFeatureList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 0 12px;
}

.supFeatureList li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 32.4%;
  width: calc(100% / 3 - 8px);
  margin-right: 12px;
  margin-bottom: 12px;
  padding: 12px;
}

.supFeatureList li:nth-child(3n) {
  margin-right: 0;
}

.supFeatureList li.endFeature {
  background-color: #eeeeee;
}

.supFeatureList li a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  color: #333333;
}

.supFeatureList li a:hover {
  opacity: 0.7;
}

.supFeatureList li img {
  width: 100%;
  max-height: 110px;
}

.supFeatureList li .supName {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 4px;
  font-weight: bold;
}

.supFeatureList li .featureEndDate {
  position: relative;
  font-size: 13px;
  font-size: 0.8125rem;
  margin: 8px auto 4px;
  padding-left: 20px;
  color: #6f6f6f;
}

.supFeatureList li .featureEndDate:after {
  display: block;
  position: absolute;
  content: "\F017";
}

.supFeatureList li .featureEndDate:after {
  font-size: 16px;
  font-size: 1rem;
  top: 1px;
  left: 0;
  line-height: 1;
  font-family: FontAwesome;
}

.supFeatureList li .supFeatureHd {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 0;
}

/*
# supplier feature

## サプライヤーオリジナル特集 構成

*/

.supFeature .searchState {
  text-align: center;
  padding-bottom: 24px;
  margin-bottom: 40px;
}

.supFeature .searchState ul {
  margin: 0 auto 24px;
}

.supFeature .searchState ul li {
  vertical-align: middle;
}

.supFeature .searchState ul li .selectState {
  width: 240px;
}

.supFeature .searchState ul li .closeCamp {
  margin-left: 12px;
}

.supFeature #saleFeatureWrap,
.supFeature #newitemFeatureWrap,
.supFeature #recommFeatureWrap {
  margin-bottom: 24px;
}

.supFeature .featureMoreLink {
  margin-top: -8px;
}

/*
# supplier feature

## サプライヤーオリジナル特集 商品

*/

.supFeature {
  /* ランキング */
}

.supFeature .supFeatureShowcaseWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.supFeature .supFeatureShowcaseWrap a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
}

.supFeature .supFeatureShowcaseWrap a:hover {
  opacity: 0.7;
  text-decoration: none;
}

.supFeature .supFeatureShowcaseWrap.col2 {
  /* グリッド2カラム商品ブロック */
  width: 90%;
  max-width: 840px;
  margin: 24px auto 0;
}

.supFeature .supFeatureShowcaseWrap.col2 .supFeatureShowcase {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 47.6%;
  width: calc(100% / 2 - 20px);
  position: relative;
  margin: 0 32px 40px 0;
}

.supFeature .supFeatureShowcaseWrap.col2 .supFeatureShowcase:nth-child(2n) {
  margin-right: 0;
}

.supFeature .supFeatureShowcaseWrap.col3 {
  /* グリッド3カラム商品ブロック */
}

.supFeature .supFeatureShowcaseWrap.col3 .supFeatureShowcase {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 31%;
  width: calc(100% / 3 - 22px);
  position: relative;
  margin: 0 32px 40px 0;
}

.supFeature .supFeatureShowcaseWrap.col3 .supFeatureShowcase:nth-child(3n),
.supFeature .supFeatureShowcaseWrap.col3 .supFeatureShowcase:last-child {
  margin-right: 0;
}

.supFeature .supFeatureShowcaseWrap.col4 {
  /* グリッド4カラム商品ブロック */
}

.supFeature .supFeatureShowcaseWrap.col4 .supFeatureShowcase {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 23%;
  width: calc(100% / 4 - 24px);
  position: relative;
  margin: 0 32px 32px 0;
}

.supFeature .supFeatureShowcaseWrap.col4 .supFeatureShowcase:nth-child(4n),
.supFeature .supFeatureShowcaseWrap.col4 .supFeatureShowcase:last-child {
  margin-right: 0;
}

.supFeature .supFeatureShowcaseWrap.col5 {
  /* グリッド5カラム商品ブロック */
}

.supFeature .supFeatureShowcaseWrap.col5 .supFeatureShowcase {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 17.9%;
  width: calc(100% / 5 - 19.2px);
  position: relative;
  margin: 0 24px 32px 0;
}

.supFeature .supFeatureShowcaseWrap.col5 .supFeatureShowcase:nth-child(5n),
.supFeature .supFeatureShowcaseWrap.col5 .supFeatureShowcase:last-child {
  margin-right: 0;
}

.supFeature .supFeatureShowcaseWrap.col5 .supFeatureShowcase .discount {
  font-size: 16px;
  font-size: 1rem;
  position: absolute;
  bottom: -4px;
  right: -4px;
  width: 54px;
  height: 54px;
  line-height: 1.1;
  padding: 8px;
  background-color: rgba(230, 0, 18, 0.9);
  color: #ffffff;
  text-align: center;
}

.supFeature .supFeatureShowcaseWrap.col5 .supFeatureShowcase .discount em {
  font-size: 21px;
  font-size: 1.3125rem;
}

.supFeature .supFeatureShowcaseWrap .showcaseItemsImgBlock {
  display: block;
  position: relative;
  max-width: 100%;
  margin: auto;
  padding-top: 100%;
}

.supFeature .supFeatureShowcaseWrap .showcaseItemsImgBlock .showcaseItemsImg {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ffffff;
}

.supFeature .supFeatureShowcaseWrap .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.supFeature .supFeatureShowcaseWrap .showcaseItemsImgBlock .discount {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 50%;
  font-size: 20px;
  font-size: 1.25rem;
  position: absolute;
  bottom: -4px;
  right: -4px;
  width: 65px;
  height: 65px;
  line-height: 1.1;
  padding: 8px;
  background-color: rgba(230, 0, 18, 0.9);
  color: #ffffff;
  text-align: center;
}

.supFeature .supFeatureShowcaseWrap .showcaseItemsImgBlock .discount em {
  font-size: 26px;
  font-size: 1.625rem;
}

.supFeature .supFeatureShowcaseWrap .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  padding-top: 8px;
  color: #333333;
}

.supFeature .supFeatureShowcaseWrap .showcaseBox .showcaseHd {
  font-size: 13px;
  font-size: 0.8125rem;
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  height: 38px;
  margin: 0 auto 8px;
  line-height: 1.5;
  color: #333333;
}

.supFeature .supFeatureShowcaseWrap .showcaseBox .showcaseSupMore {
  position: relative;
  font-size: 16px;
  font-size: 1rem;
}

.supFeature .supFeatureShowcaseWrap .showcaseBox .showcaseSupMore:after {
  display: block;
  position: absolute;
  content: "\F054";
}

.supFeature .supFeatureShowcaseWrap .showcaseBox .showcaseSupMore:after {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  right: 8px;
  font-family: FontAwesome;
  color: #ffffff;
}

.supFeature .rankingItemShowcase {
  margin-top: 40px;
  padding-bottom: 24px;
  counter-reset: ranknumber;
}

.supFeature .rankingItemShowcase a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  position: relative;
  display: block;
  color: #333333;
}

.supFeature .rankingItemShowcase a:hover {
  opacity: 0.7;
  text-decoration: none;
}

.supFeature .rankingItemShowcase a .showcaseItemsImg {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 234px;
  background-color: #ffffff;
  border: 1px solid #eeeeee;
}

.supFeature .rankingItemShowcase a .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.supFeature .rankingItemShowcase a .rankShowcaseHd {
  font-size: 13px;
  font-size: 0.8125rem;
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  height: 38px;
  margin: 4px auto 0;
  line-height: 1.5;
}

.supFeature .rankingItemShowcase .rankingItemShowcase01 {
  float: left;
  width: 320px;
  margin-right: 16px;
}

.supFeature .rankingItemShowcase .rankingItemShowcase01 figure {
  width: 100%;
  height: 320px;
}

.supFeature .rankingItemShowcase .rankingItemShowcase02 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  float: left;
  width: 616px;
  margin-bottom: 20px;
}

.supFeature .rankingItemShowcase .rankingItemShowcase02 li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 23%;
  width: calc(100% / 4 - 12px);
  margin-right: 16px;
}

.supFeature .rankingItemShowcase .rankingItemShowcase02 li:nth-child(4n) {
  margin-right: 0;
}

.supFeature .rankingItemShowcase .rankingItemShowcase02 li figure {
  width: 100%;
  height: 142px;
}

.supFeature .rankingItemShowcase .rankingItemShowcase03 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  float: left;
  width: 616px;
}

.supFeature .rankingItemShowcase .rankingItemShowcase03 li {
  width: 23%;
  width: calc(100% / 5 - 9.6px);
  margin-right: 12px;
}

.supFeature .rankingItemShowcase .rankingItemShowcase03 li:nth-child(5n) {
  margin-right: 0;
}

.supFeature .rankingItemShowcase .rankingItemShowcase03 li figure {
  width: 100%;
  height: 114px;
}

.supFeature .rankingItemShowcase .rankCrown {
  position: relative;
  -webkit-transform: rotate(15deg);
  transform: rotate(15deg);
  position: absolute;
  top: -20px;
  right: -10px;
  z-index: 1;
}

.supFeature .rankingItemShowcase .rankCrown:after {
  display: block;
  position: absolute;
  content: "";
}

.supFeature .rankingItemShowcase .rankCrown:after {
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  margin: auto;
  counter-increment: ranknumber;
  content: counter(ranknumber);
  color: #ffffff;
  font-weight: bold;
  text-align: center;
}

.supFeature .rankingItemShowcase .crownIco1 {
  font-size: 36px;
  font-size: 2.25rem;
  width: 80px;
  height: 60px;
  line-height: 66px;
  background: url(/pc/assets/image/static/special/event/one_company/ico_crown01.png) no-repeat top center;
}

.supFeature .rankingItemShowcase .crownIco2,
.supFeature .rankingItemShowcase .crownIco3,
.supFeature .rankingItemShowcase .crownIco4 {
  font-size: 24px;
  font-size: 1.5rem;
  width: 60px;
  height: 42px;
  line-height: 50px;
  background: url(/pc/assets/image/static/special/event/one_company/ico_crown02.png) no-repeat top center;
}

.supFeature .rankingItemShowcase .crownIco3 {
  background: url(/pc/assets/image/static/special/event/one_company/ico_crown03.png) no-repeat top center;
}

.supFeature .rankingItemShowcase .crownIco4 {
  background: url(/pc/assets/image/static/special/event/one_company/ico_crown04.png) no-repeat top center;
}

.supFeature .rankingItemShowcase .crownIco5 {
  font-size: 15px;
  font-size: 0.9375rem;
  top: -16px;
  width: 44px;
  height: 33px;
  line-height: 40px;
  background: url(/pc/assets/image/static/special/event/one_company/ico_crown05.png) no-repeat top center;
}

/*
# supplier feature

## サプライヤーオリジナル特集 本体

*/

.supFeature #supFeatureMainVisual {
  margin-bottom: 24px;
}

.supFeature .supFeatureNav {
  margin-bottom: 32px;
}

.supFeature .supFeatureNav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.supFeature .supFeatureNav ul li {
  width: 24.2%;
  width: calc(97% / 4);
  margin-right: 1%;
  margin-bottom: 8px;
}

.supFeature .supFeatureNav ul li:nth-child(4n) {
  margin-right: 0;
}

.supFeature .supFeatureNav ul li:last-child {
  margin-right: 0;
}

.supFeature .supFeatureNav ul li a {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  position: relative;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
  padding: 16px 8px;
  padding-left: 40px;
  background-color: #ffffff;
  border: 6px solid #6f6f6f;
  color: #333333;
}

.supFeature .supFeatureNav ul li a:after {
  display: block;
  position: absolute;
  content: "\F078";
}

.supFeature .supFeatureNav ul li a:after {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  left: 16px;
  font-family: FontAwesome;
}

.supFeature .supFeatureNav ul li a:hover {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
}

.supFeature #featureCouponWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 24px;
  background-color: #eeeeee;
}

.supFeature #featureCouponWrap .ftCouponMainhd {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 0;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1em;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}

.supFeature .categoryListWrap {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: 48px;
  padding: 24px;
  padding-bottom: 0;
  background-color: #ffffff;
}

.supFeature .supFeatureItemHd {
  font-size: 24px;
  font-size: 1.5rem;
  margin: 0 0 8px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1em;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}

.supFeature .subHd {
  font-size: 16px;
  font-size: 1rem;
  text-align: center;
}

.supFeature .supInfoLinkArea {
  text-align: center;
}

.supFeature .supInfoLinkArea a {
  font-size: 20px;
  font-size: 1.25rem;
  display: inline-block;
  margin-bottom: 24px;
}

/*
# buyer register

## バイヤー会員登録

*/

.buyerRegister {
  /* 仕入れの流れ */
  /* 登録後取引申請 */
}

.buyerRegister .mainVisual {
  width: 700px;
  margin: 0 auto 16px;
  border: 2px solid #6f6f6f;
}

.buyerRegister .availableId {
  width: 320px;
  margin-top: 12px;
}

.buyerRegister .availableId dt {
  font-weight: bold;
}

.buyerRegister .availableId dd {
  margin-bottom: 4px;
}

.buyerRegister .availableId dd a {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  padding: 4px;
  background-color: #eeeeee;
}

.buyerRegister .paidEntrySec h3.hdType06 img {
  padding-right: 8px;
  vertical-align: middle;
}

.buyerRegister .paidEntrySec h3.hdType06 .labelType02 {
  margin-left: 8px;
}

.buyerRegister .buyerTerms {
  overflow-y: scroll;
  height: 300px;
}

.buyerRegister .industryPopupArea {
  position: relative;
}

.buyerRegister .industryPopupArea .industryPopupBox {
  position: relative;
  position: relative;
  -webkit-box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: none;
  position: absolute;
  top: -700px;
  right: 120px;
  z-index: 10;
  width: 690px;
  padding: 16px;
  background-color: #ffffff;
  border-radius: 8px;
  border: solid 1px #bbbbbb;
}

.buyerRegister .industryPopupArea .industryPopupBox:before {
  display: block;
  position: absolute;
  content: "";
}

.buyerRegister .industryPopupArea .industryPopupBox:after {
  display: block;
  position: absolute;
  content: "";
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock {
  float: left;
  width: 320px;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock:nth-child(2n) {
  margin: 0 0 16px 16px;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock:last-child {
  margin-bottom: 0;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock h4 {
  font-size: 15px;
  font-size: 0.9375rem;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock h4 span {
  margin-right: 4px;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock h5 {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: normal;
  color: #ffffff;
  padding: 2px 8px 2px;
  background-position: 4px 2px;
  background-repeat: no-repeat;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock h5 i.fa {
  font-size: 20px;
  font-size: 1.25rem;
  padding-right: 8px;
  vertical-align: middle;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock .itemBox {
  border: solid 1px #d5d4d4;
}

.buyerRegister .industryPopupArea .industryPopupBox .itemBlock .itemBox p {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 0;
  padding: 8px;
}

.buyerRegister .industryPopupArea .industryPopupBox h4 .item01 h4 span {
  color: #ee88bb;
}

.buyerRegister .industryPopupArea .industryPopupBox .item02 h4 span {
  color: #bb7722;
}

.buyerRegister .industryPopupArea .industryPopupBox .item03 h4 span {
  color: #99cc33;
}

.buyerRegister .industryPopupArea .industryPopupBox .item04 h4 span {
  color: #ee8833;
}

.buyerRegister .industryPopupArea .industryPopupBox .item05 h4 span {
  color: #667AB3;
}

.buyerRegister .industryPopupArea .industryPopupBox .item06 h4 span {
  color: #aa88dd;
}

.buyerRegister .industryPopupArea .industryPopupBox .item07 h4 span {
  color: #757575;
}

.buyerRegister .industryPopupArea .industryPopupBox .item08 h4 span {
  color: #44bbcc;
}

.buyerRegister .industryPopupArea .industryPopupBox .item01 h5 {
  background-color: #ee88bb;
}

.buyerRegister .industryPopupArea .industryPopupBox .item02 h5 {
  background-color: #bb7722;
}

.buyerRegister .industryPopupArea .industryPopupBox .item03 h5 {
  background-color: #99cc33;
}

.buyerRegister .industryPopupArea .industryPopupBox .item04 h5 {
  background-color: #ee8833;
}

.buyerRegister .industryPopupArea .industryPopupBox .item05 h5 {
  background-color: #667AB3;
}

.buyerRegister .industryPopupArea .industryPopupBox .item06 h5 {
  background-color: #aa88dd;
}

.buyerRegister .industryPopupArea .industryPopupBox .item07 h5 {
  background-color: #757575;
}

.buyerRegister .industryPopupArea .industryPopupBox .item08 h5 {
  background-color: #44bbcc;
}

.buyerRegister .industryPopupArea .industryPopupBox .item01 .itemBox,
.buyerRegister .industryPopupArea .industryPopupBox .item02 .itemBox,
.buyerRegister .industryPopupArea .industryPopupBox .item07 .itemBox,
.buyerRegister .industryPopupArea .industryPopupBox .item08 .itemBox {
  height: 100px;
}

.buyerRegister .industryPopupArea .industryPopupBox .item03 .itemBox,
.buyerRegister .industryPopupArea .industryPopupBox .item04 .itemBox {
  height: 120px;
}

.buyerRegister .industryPopupArea .industryPopupBox .item05 .itemBox,
.buyerRegister .industryPopupArea .industryPopupBox .item06 .itemBox {
  height: 80px;
}

.buyerRegister .industryPopupArea .industryPopupBox .closeBtn {
  position: absolute;
  top: 5px;
  right: 16px;
  font-size: 30px;
  color: #6f6f6f;
  cursor: pointer;
}

.buyerRegister .industryPopupArea .industryPopupBox:before {
  bottom: -20px;
  right: 50px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 18px 0 18px;
  border-color: #999999 transparent transparent transparent;
}

.buyerRegister .industryPopupArea .industryPopupBox:after {
  bottom: -19px;
  right: 51px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 19px 17px 0 17px;
  border-color: #ffffff transparent transparent transparent;
}

.buyerRegister .buyingFlow {
  margin: 16px auto 16px;
}

.buyerRegister .buyingFlow li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  width: 23.3%;
  width: calc(100% / 4 - 15px);
  position: relative;
  float: left;
  min-height: 143px;
  margin-right: 20px;
  padding: 8px;
  border: 1px solid #999999;
}

.buyerRegister .buyingFlow li:after {
  display: block;
  position: absolute;
  content: "\F054";
}

.buyerRegister .buyingFlow li .flowHd {
  font-size: 15px;
  font-size: 0.9375rem;
  margin-bottom: 8px;
  font-weight: bold;
}

.buyerRegister .buyingFlow li p {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 0;
}

.buyerRegister .buyingFlow li:last-child {
  margin-right: 0;
}

.buyerRegister .buyingFlow li:last-child:after {
  display: none;
}

.buyerRegister .buyingFlow li:after {
  font-size: 18px;
  font-size: 1.125rem;
  font-family: FontAwesome;
  top: 60px;
  right: -18px;
}

.buyerRegister .customerCategList {
  margin-bottom: 24px;
}

.buyerRegister .customerCategList > li {
  width: 23.3%;
  width: calc(100% / 4 - 16px);
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  margin-right: 16px;
}

.buyerRegister .customerCategList > li .categHd {
  font-size: 16px;
  font-size: 1rem;
  font-weight: bold;
}

.buyerRegister .customerCategList > li .categListEach {
  margin-top: 12px;
}

.buyerRegister .customerCategList > li .categListEach .listChilds {
  margin-top: 12px;
  padding-left: 1.5em;
}

.buyerRegister .customerCategList > li .categListEach .listChilds li {
  margin-bottom: 12px;
}

/*
# campaign

## キャンペーン

*/

.campaign {
  /* キャンペーン一覧 */
}

.campaign .searchState {
  text-align: center;
  padding-bottom: 24px;
  margin-bottom: 40px;
}

.campaign .searchState ul {
  margin: 0 auto 24px;
}

.campaign .searchState ul li {
  vertical-align: middle;
}

.campaign .searchState ul li .selectState {
  width: 240px;
}

.campaign .searchState ul li .closeCamp {
  margin-left: 12px;
}

.campaign .campaignListWrap {
  border-top: 1px solid #6f6f6f;
}

.campaign .campaignList {
  overflow: hidden;
  border-bottom: 1px dotted #999999;
}

.campaign .campaignList a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: table;
  width: 100%;
  color: #333333;
}

.campaign .campaignList a:not(.tb):hover {
  background-color: #f5fdfe;
}

.campaign .campaignList.campaignNewLabel {
  position: relative;
}

.campaign .campaignList.campaignNewLabel:after {
  display: block;
  position: absolute;
  content: "NEW!";
}

.campaign .campaignList.campaignNewLabel:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 13px;
  font-size: 0.8125rem;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -12px;
  right: -40px;
  width: 100px;
  padding-top: 24px;
  background-color: #27d2ec;
  color: #ffffff;
  font-weight: bold;
  text-align: center;
}

.campaign .campaignList.campaignEndLabel {
  background-color: #eeeeee;
}

.campaign .campaignList.campaignEndLabel a:not(.tb):hover {
  background-color: #f6f6f6;
}

.campaign .campaignList .campaignListBlock {
  display: table-cell;
  padding: 16px;
  vertical-align: middle;
}

.campaign .campaignList .campaignListBlock.supName {
  width: 25%;
  padding-right: 32px;
}

.campaign .campaignList .campaignListBlock .campaignEndDate {
  position: relative;
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 0;
  padding-left: 20px;
  color: #6f6f6f;
}

.campaign .campaignList .campaignListBlock .campaignEndDate:after {
  display: block;
  position: absolute;
  content: "\F017";
}

.campaign .campaignList .campaignListBlock .campaignEndDate:after {
  font-size: 16px;
  font-size: 1rem;
  top: 3px;
  left: 0;
  line-height: 1;
  font-family: FontAwesome;
}

.campaign .campaignList .campaignListBlock .campaignHd {
  margin-top: 4px;
  font-weight: bold;
}

.campaign .campaignList .campaignListBlock .campaignHd span {
  font-size: 12px;
  font-size: 0.75rem;
  padding-right: 4px;
  font-weight: normal;
}

/* トップのみ */

#topCampaign {
  margin: 0 auto 40px;
}

#topCampaign .campaignListWrap {
  overflow-y: scroll;
  max-height: 400px;
}

/*
# categoryNav

## トップカテゴリナビ

*/

#categoryNav {
  position: absolute;
  top: -33px;
  left: 32px;
  width: 240px;
}

#categoryNav .categoryNavInner {
  width: 240px;
}

#categoryNav .categoryHd {
  font-size: 15px;
  font-size: 0.9375rem;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  top: 0;
  z-index: 1001;
  width: 160px;
  padding: 4px 16px;
  background-color: #ffffff;
  border: 1px solid #999999;
  border-bottom: none;
  cursor: pointer;
}

#categoryNav .categoryHd:after {
  display: block;
  position: absolute;
  content: "\F078";
}

#categoryNav .categoryHd:after {
  font-size: 12px;
  font-size: 0.75rem;
  top: 8px;
  right: 16px;
  font-family: FontAwesome;
}

#categoryNav .categoryListWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  display: none;
  position: absolute;
  top: 33px;
  left: 0;
  z-index: 1001;
  width: 240px;
  height: 394px;
  padding: 16px 0;
  background-color: rgba(255, 255, 255, 0.9);
  border: 1px solid #999999;
}

#categoryNav .categoryListWrap .categoryList > li > a {
  position: relative;
  display: block;
  padding: 8px 1.5em 8px 24px;
  color: #333333;
  font-weight: bold;
}

#categoryNav .categoryListWrap .categoryList > li > a:after {
  display: block;
  position: absolute;
  content: "\F054";
}

#categoryNav .categoryListWrap .categoryList > li > a:after {
  top: 8px;
  right: 16px;
  font-family: FontAwesome;
}

#categoryNav .categoryListWrap .categoryList > li > a:hover,
#categoryNav .categoryListWrap .categoryList > li > a.categoryHover {
  background-color: #dfdfdf;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  font-size: 15px;
  font-size: 0.9375rem;
  display: none;
  position: absolute;
  top: -1px;
  left: 238px;
  z-index: 1;
  width: 760px;
  min-height: 394px;
  padding: 16px;
  background-color: #ffffff;
  border-left: 1px solid #999999;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .catePaneList {
  display: inline-block;
  margin-bottom: 6px;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .catePaneList li {
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  padding: 0 6px;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .catePaneList li:after {
  display: block;
  position: absolute;
  content: "";
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .catePaneList li:after {
  top: 4px;
  right: -2px;
  width: 1px;
  height: 12px;
  border-right: 1px solid #999999;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .catePaneList li.subCateTop:after,
#categoryNav .categoryListWrap .categoryList > li .subCatePanel .catePaneList li:last-child:after {
  border-right: none;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .subCatePanelInr {
  margin-bottom: 8px;
  border-bottom: 1px dotted #999999;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .subCatePanelInr .subCateHd {
  display: inline-block;
  margin-bottom: 6px;
  font-weight: bold;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .subCatePanelTable {
  margin-bottom: 4px;
  border-bottom: 1px dotted #999999;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .subCatePanelTable .subCateHd {
  display: table-cell;
  white-space: nowrap;
  vertical-align: top;
  font-weight: bold;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel .subCatePanelTable .catePaneListWrap {
  display: table-cell;
}

#categoryNav .categoryListWrap .categoryList > li .subCatePanel > div:last-child {
  border-bottom: none;
}

@media all and (min-width: 1300px) {
  /* MonitorSize More 1300px */

  #categoryNav {
    position: relative;
    top: -1px;
    left: 0;
    width: 240px;
    height: 394px;
    margin: 0;
  }

  #categoryNav .categoryHd {
    display: none;
    visibility: hidden;
  }

  #categoryNav .categoryListWrap {
    display: block;
    top: 0;
  }
}

/*
# document request

## サプライヤー資料請求

*/

#contentsArea.documentRequest {
  padding: 0;
}

#contentsArea.documentRequest #mainVisual {
  max-width: 1300px;
  margin: 0 auto;
}

#contentsArea.documentRequest #mainVisual .mainVisualInner .mainHd img {
  max-width: 100%;
}

.headerUpside {
  background: #ffffff;
  height: 60px;
  padding: 0 32px;
}

.headerUpside .upsideSupport {
  float: right;
  width: 340px;
}

#contentInner #entry {
  width: 1000px;
  margin: 0 auto;
}

#contentInner .secHd {
  margin: 0 auto;
  padding-top: 56px;
  text-align: center;
}

#contentInner .enteyBtn {
  width: 700px;
  height: 105px;
  border: none;
  background: url(/pc/assets/image/common/layout/document/request/btn_01_off.png) no-repeat center top;
  cursor: pointer;
}

#contentInner .enteyBtn:hover {
  background: url(/pc/assets/image/common/layout/document/request/btn_01_on.png) no-repeat center top;
}

.secPoint {
  margin: 72px auto 0;
  background-color: #f1f2f2;
}

.secPoint .merritArea {
  margin: 50px auto 0;
  max-width: 1000px;
}

.secPoint .merrit01 {
  float: left;
  width: 490px;
  padding-bottom: 32px;
}

.secPoint .merrit01 img {
  padding-bottom: 24px;
}

.secPoint .merrit02 {
  float: right;
  width: 443px;
  margin-top: 14px;
  margin-right: 8px;
}

.secPoint .merrit03 {
  float: right;
  width: 490px;
}

.secPoint .merrit03 img {
  padding-bottom: 24px;
}

.buttonArea {
  background-image: url(/pc/assets/image/common/layout/document/request/bg_box_02.png);
  text-align: center;
}

.buttonArea .buttonAreaInner {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  width: 1000px;
  margin: 0 auto;
  padding: 32px;
}

.buttonArea .buttonAreaInner a.jumpBtn {
  overflow: hidden;
  text-indent: -200%;
  white-space: nowrap;
  display: block;
  width: 700px;
  height: 133px;
  margin: 0 auto 24px;
  background: url(/pc/assets/image/common/layout/document/request/btn_02_off.png) no-repeat center top;
}

.buttonArea .buttonAreaInner a.jumpBtn:hover {
  background: url(/pc/assets/image/common/layout/document/request/btn_02_on.png) no-repeat center top;
}

.buttonArea .buttonAreaSupport {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 690px;
  margin: 0 auto;
  padding: 12px;
  border: 3px solid #79b7f6;
  background-color: #ffffff;
}

.buttonArea .buttonWoman {
  position: absolute;
  bottom: 0;
  right: 0;
}

.secVoice {
  background: url(/pc/assets/image/common/layout/document/request/bg_box_03.png) repeat;
  width: 100%;
  margin: 0 auto;
}

.secVoice .voiceArea {
  width: 1000px;
  margin: 40px auto 0;
}

.secVoice .voiceArea li {
  float: left;
  width: 300px;
  padding-right: 48px;
}

.secVoice .voiceArea li:last-child {
  padding-right: 0;
}

.secVoice .voiceArea li .voiceHd {
  font-size: 18px;
  font-size: 1.125rem;
  margin-bottom: 16px;
  padding: 8px;
  background-color: #333333;
  text-align: center;
  color: #ffffff;
}

.secVoice .voiceArea li > p {
  font-size: 16px;
  font-size: 1rem;
}

.secFlow {
  width: 100%;
  margin: 0 auto;
  padding: 0 0 40px;
  background: url(/pc/assets/image/common/layout/document/request/bg_let_01.png) repeat;
}

.secFlow .flowArea {
  width: 1000px;
  margin: 48px auto 0;
}

.secFlow .flowArea li {
  float: left;
  width: 235px;
  margin-right: 20px;
}

.secFlow .flowArea li:last-child {
  margin-right: 0;
}

.secFlow .flowArea li .flowHd {
  margin-bottom: 16px;
}

.secFlow .flowArea li > p {
  font-size: 15px;
  font-size: 0.9375rem;
}

.secFaq {
  width: 100%;
  margin: 0 auto;
  padding: 0px 0px 40px;
  background: url(/pc/assets/image/common/layout/document/request/bg_let_01.png) repeat;
}

.faqArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 48px auto 0;
  padding: 48px 52px;
  width: 1000px;
  border: 10px #e9e5da solid;
  background-color: #ffffff;
}

.faqArea dt {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 16px;
  padding-left: 48px;
  background: url(/pc/assets/image/common/layout/document/request/icon_question01.png) no-repeat center left;
  background-size: auto 100%;
  color: #e60012;
  font-weight: bold;
}

.faqArea dd {
  margin-bottom: 24px;
  padding-left: 48px;
}

.faqArea img {
  vertical-align: -22px;
  margin-right: 10px;
}

.kiyakuArea {
  border: 10px #e9e5da solid;
  padding: 40px 60px;
  margin: 40px auto 0 auto;
  max-width: 880px;
  background-color: #ffffff;
}

.kiyakuArea span {
  color: #CC0000;
  font-weight: bold;
}

.kiyakuArea .termLink {
  font-size: 21px;
  font-size: 1.3125rem;
  margin-bottom: 0;
  padding-top: 24px;
  border-top: 1px dotted #333333;
  text-align: center;
}

.section_thanks {
  margin: 0 auto;
  max-width: 870px;
  padding: 30px 70px 30px 10px;
}

.section_thanks .sec_ttl_sp {
  display: none;
}

.section_thanks ul {
  margin: 30px 0;
  padding: 20px 20px 20px 50px;
  border: #CCC solid 1px;
  background: #FFF;
}

/*
# hotWord

## 注目ワード

*/

#hotWord {
  margin: 24px auto 16px;
}

#hotWord .hotWordList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

#hotWord .hotWordList li {
  margin-right: 12px;
}

#hotWord .hotWordList li:last-child {
  margin-right: 0;
}

#hotWord .hotWordList li.hotWordHd {
  margin-right: 24px;
  font-weight: bold;
}

#hotWord .hotWordList li a {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
  border: 1px solid #cccccc;
  padding: 4px 12px;
  color: #333333;
}

#hotWord .hotWordList li a:hover {
  -webkit-box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  background: #eeeeee;
  text-decoration: none;
}

/*
# topMainVisual

## トップメインビジュアル

*/

#topMainVisual {
  position: relative;
  width: auto;
  min-width: 750px;
  padding: 0 0 32px;
}

#topMainVisual #topMainVisualInner {
  position: relative;
  width: 100%;
  height: 394px;
}

#topMainVisual #topMainVisualInner .mainImageSlider {
  width: 100%;
  visibility: hidden;
}

#topMainVisual #topMainVisualInner .mainImageSlider.slick-initialized {
  visibility: visible;
}

#topMainVisual #topMainVisualInner .mainImageSlider .sliderBlock {
  position: relative;
  width: 750px;
  height: 394px;
  background-color: #ffffff;
}

#topMainVisual #topMainVisualInner .mainImageSlider .sliderBlock img {
  width: 750px;
  height: 394px;
  vertical-align: middle;
}

#topMainVisual #topMainVisualInner .mainImageSlider .sliderBlock a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
}

#topMainVisual #topMainVisualInner .mainImageSlider .sliderBlock a:hover {
  opacity: 0.7;
}

#topMainVisual #topMainVisualInner .mainImageSlider .slick-prev,
#topMainVisual #topMainVisualInner .mainImageSlider .slick-next {
  position: relative;
  position: absolute;
  display: block;
  z-index: 1000;
  width: 32px;
  height: 100%;
}

#topMainVisual #topMainVisualInner .mainImageSlider .slick-prev:after,
#topMainVisual #topMainVisualInner .mainImageSlider .slick-next:after {
  display: block;
  position: absolute;
  content: "";
}

#topMainVisual #topMainVisualInner .mainImageSlider .slick-prev:before,
#topMainVisual #topMainVisualInner .mainImageSlider .slick-next:before {
  font-size: 36px;
  font-size: 2.25rem;
  opacity: 0.3;
  position: absolute;
  top: 48%;
  left: 0;
  z-index: 1002;
  width: 100%;
  color: #333333;
  text-align: center;
}

#topMainVisual #topMainVisualInner .mainImageSlider .slick-prev:after,
#topMainVisual #topMainVisualInner .mainImageSlider .slick-next:after {
  opacity: 0.8;
  top: -1px;
  left: 0;
  z-index: 1001;
  width: 100%;
  height: 101%;
  background-color: #ffffff;
}

#topMainVisual #topMainVisualInner .mainImageSlider .slick-prev:hover:before,
#topMainVisual #topMainVisualInner .mainImageSlider .slick-next:hover:before {
  opacity: 1;
}

#topMainVisual #topMainVisualInner .mainImageSlider .slick-prev {
  left: 0;
}

#topMainVisual #topMainVisualInner .mainImageSlider .slick-next {
  right: 0;
}

#topMainVisual #topMainVisualInner .mainImageSlider .transit {
  background-color: transparent;
}

@media all and (min-width: 1300px) {
  /* MonitorSize More 1300px */

  #topMainVisual {
    /* IEで崩れるので横幅は入れておく */
    max-width: 868px;
  }
}

/*
# topNewSupSale

## 新規サプ週替わりセール

*/

#topNewSupSale {
  margin: 0 auto 48px;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg,
#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 100%;
  background-color: #ffffff;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:hover,
#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg:hover {
  -webkit-box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg a,
#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg a {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg a .discountTxt,
#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg a .discountTxt {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 18px;
  font-size: 1.125rem;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  bottom: -12px;
  right: -46px;
  z-index: 1;
  width: 140px;
  line-height: 1;
  padding: 4px 0 24px;
  background-color: rgba(230, 0, 18, 0.9);
  text-align: center;
  color: #ffffff;
  font-weight: bold;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg a .discountTxt .discountNum,
#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg a .discountTxt .discountNum {
  font-size: 24px;
  font-size: 1.5rem;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum,
#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

#topNewSupSale .hdCatch {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  font-size: 20px;
  font-size: 1.25rem;
  left: -8px;
  display: inline-block;
  height: 34px;
  margin-right: 8px;
  padding: 1px 26px 0 8px;
  background-color: #ffa200;
  color: #ffffff;
  vertical-align: middle;
}

#topNewSupSale .hdCatch:after {
  display: block;
  position: absolute;
  content: "";
}

#topNewSupSale .hdCatch:after {
  top: 0;
  right: 0;
  z-index: 2;
  border-width: 17px 12px;
  border-style: solid;
  border-color: transparent;
  border-right-color: #ffffff;
}

#topNewSupSale .showcaseWrap {
  margin: 0 auto;
  /* サプブロック */
  /* スライダー用 */
}

#topNewSupSale .showcaseWrap a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
}

#topNewSupSale .showcaseWrap a:hover {
  opacity: 0.7;
  text-decoration: none;
}

#topNewSupSale .showcaseWrap .showcaseType01 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseItemsImgBlock {
  display: block;
  position: relative;
  width: 35%;
  margin-right: 24px;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: calc(65% - 24px);
  color: #333333;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .saleInfo {
  margin-bottom: 24px;
  padding: 4px 8px;
  border: 1px solid #999999;
  background-color: #ffffff;
  text-align: center;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .saleInfo .onSaleTxt {
  font-size: 21px;
  font-size: 1.3125rem;
  padding-right: 1em;
  color: #e60012;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .supNameArea {
  position: relative;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .supNameArea .supName {
  font-size: 18px;
  font-size: 1.125rem;
  margin-bottom: 16px;
  padding-right: 6em;
  font-weight: bold;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .supNameArea .supName > a {
  color: #333333;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .supNameArea .supItemLink {
  position: relative;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  right: 0;
  padding-right: 1.5em;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .supNameArea .supItemLink:after {
  display: block;
  position: absolute;
  content: "";
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .supNameArea .supItemLink:after {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  right: 8px;
  content: "\F105";
  font-family: FontAwesome;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .appealKeyword {
  margin-bottom: 8px;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .appealKeyword [class*="labelType"] {
  margin-right: 4px;
  margin-bottom: 8px;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 24px;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li {
  display: block;
  position: relative;
  width: 23.5%;
  margin-right: 2%;
  padding-top: 23.5%;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li:last-child {
  margin-right: 0;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg a .discountTxt {
  font-size: 12px;
  font-size: 0.75rem;
  bottom: -14px;
  right: -34px;
  width: 100px;
  padding: 4px 0 24px;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .showcaseItemsSmallImgList li .showcaseItemsSmallImg a .discountTxt .discountNum {
  font-size: 16px;
  font-size: 1rem;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .discountItemLink {
  text-align: right;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .discountItemLink > a {
  position: relative;
  display: inline-block;
  width: 60%;
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .discountItemLink > a:after {
  display: block;
  position: absolute;
  content: "";
}

#topNewSupSale .showcaseWrap .showcaseType01 .showcaseBox .discountItemLink > a:after {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
  right: 8px;
  content: "\F054";
  font-family: FontAwesome;
}

#topNewSupSale .showcaseWrap .slick-prev,
#topNewSupSale .showcaseWrap .slick-next {
  position: relative;
  position: absolute;
  display: block;
  z-index: 1000;
  width: 24px;
  height: 100%;
}

#topNewSupSale .showcaseWrap .slick-prev:after,
#topNewSupSale .showcaseWrap .slick-next:after {
  display: block;
  position: absolute;
  content: "";
}

#topNewSupSale .showcaseWrap .slick-prev:before,
#topNewSupSale .showcaseWrap .slick-next:before {
  font-size: 36px;
  font-size: 2.25rem;
  opacity: 0.3;
  position: absolute;
  top: 48%;
  left: 0;
  z-index: 1002;
  width: 100%;
  color: #333333;
  text-align: center;
}

#topNewSupSale .showcaseWrap .slick-prev:after,
#topNewSupSale .showcaseWrap .slick-next:after {
  opacity: 0.8;
  top: 0;
  left: 0;
  z-index: 1001;
  width: 100%;
  height: 101%;
  background-color: #ffffff;
}

#topNewSupSale .showcaseWrap .slick-prev:hover:before,
#topNewSupSale .showcaseWrap .slick-next:hover:before {
  opacity: 1;
}

#topNewSupSale .showcaseWrap .slick-prev {
  left: -24px;
}

#topNewSupSale .showcaseWrap .slick-next {
  right: -24px;
}

/*
# showcase newitem

## 新規出品情報一覧

*/

.newitem .supNameHd {
  margin: 16px 0;
  padding: 8px;
  background-color: #eeeeee;
  font-weight: bold;
}

.newitem .moreInfo {
  margin-bottom: 16px;
}

.newitem .moreInfo .supInfoBtn {
  font-size: 14px;
  font-size: 0.875rem;
  float: right;
  width: auto;
  line-height: 1;
  margin-left: 8px;
  padding: 8px;
}

.newitem .showcaseWrap.gridView {
  /* グリッド3カラム商品ブロック */
}

.newitem .showcaseWrap.gridView .showcaseType01 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  width: 33.3333%;
  width: calc(100% / 3 - 2px);
  float: left;
  position: relative;
  height: 400px;
  min-width: 196px;
  margin: 0 0 40px;
  padding: 0 8px;
  border-right: 1px dotted #cccccc;
}

.newitem .showcaseWrap.gridView .showcaseType01:last-child {
  border-right: none;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock {
  display: block;
  position: relative;
  width: 180px;
  margin: auto;
  padding-top: 180px;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout {
  position: relative;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  display: block;
  position: absolute;
  content: "\54C1\5207\308C\4E2D";
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  top: 75px;
  left: 0;
  width: 100%;
  line-height: 30px;
  background-color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg {
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 180px;
  height: 180px;
  background-color: #ffffff;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock a.btnType01 {
  font-size: 14px;
  font-size: 0.875rem;
  margin-top: 8px;
  padding: 4px;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  color: #333333;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  padding: 4px;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock p {
  margin: 0;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock:nth-child(1) {
  width: auto;
  vertical-align: top;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock:nth-child(2) {
  position: absolute;
  bottom: 56px;
  left: 0;
  width: 100%;
  height: 96px;
  padding: 0 12px;
  text-align: right;
  vertical-align: bottom;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseHd {
  font-size: 13px;
  font-size: 0.8125rem;
  height: 64px;
  margin: 6px auto 92px;
  line-height: 1.5;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseHd > a {
  display: block;
  color: #333333;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .paymentLabel span {
  font-size: 10px;
  font-size: 0.625rem;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .retailPriceArea {
  font-size: 13px;
  font-size: 0.8125rem;
  height: 42px;
  margin: 6px auto;
  text-align: center;
  color: #999999;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .retailPriceArea .retailPrice {
  text-align: right;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .retailPriceArea .retailPrice span {
  font-size: 11px;
  font-size: 0.6875rem;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox {
  width: 88%;
  width: calc(100% - 24px);
  position: absolute;
  bottom: 0;
  right: 12px;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox .price {
  font-weight: bold;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox .price.discount {
  text-decoration: line-through;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox .price span {
  font-size: 12px;
  font-size: 0.75rem;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox .afterPrice {
  color: #e60012;
  font-weight: bold;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox .afterPrice span {
  font-size: 12px;
  font-size: 0.75rem;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox a.registBtn {
  font-size: 14px;
  font-size: 0.875rem;
  display: block;
  text-align: center;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox .priceHide {
  font-size: 14px;
  font-size: 0.875rem;
}

.newitem .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .priceBox .priceHide a.dealBtn {
  display: block;
  text-align: center;
}

/*
# news

## お知らせページ

*/

/* NETSEAからのお知らせ */

.newsList > li {
  margin-bottom: 4px;
  padding-left: 6.5em;
  text-indent: -6.5em;
}

.newsList > li > span {
  padding-right: 16px;
}

.newsDetail .date {
  font-size: 13px;
  font-size: 0.8125rem;
  position: relative;
  top: 24px;
  left: 8px;
}

.newsDetail h2 {
  font-size: 24px;
  font-size: 1.5rem;
  margin: 24px 0;
  padding: 8px 8px;
  border-bottom: 1px solid #666666;
  font-weight: bold;
}

.newsDetail #main {
  border-radius: 3px;
  width: 700px;
  margin: 0 auto !important;
  padding: 24px;
  border: 1px solid #999999;
}

/*
# showcase gridView

## ランキング 総合表示

*/

.ranking h2.hdType07 {
  counter-reset: ranknumber;
}

.ranking .showcaseWrap.gridView {
  /* グリッド5カラム商品ブロック */
}

.ranking .showcaseWrap.gridView .showcaseType01 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  width: 20%;
  width: calc(100% / 5);
  float: left;
  position: relative;
  margin: 0 0 40px;
  padding: 0 8px;
  border-right: 1px dotted #cccccc;
}

.ranking .showcaseWrap.gridView .showcaseType01:last-child {
  border-right: none;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock {
  display: block;
  position: relative;
  max-width: 180px;
  margin: auto;
  padding-top: 100%;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock a:hover {
  opacity: 0.7;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout {
  position: relative;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  display: block;
  position: absolute;
  content: "\54C1\5207\308C\4E2D";
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  line-height: 30px;
  background-color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg {
  position: relative;
  position: relative;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ffffff;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:before {
  display: block;
  position: absolute;
  content: "";
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:after {
  display: block;
  position: absolute;
  content: "";
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -8px;
  right: -28px;
  z-index: 1;
  opacity: 0.8;
  width: 80px;
  height: 40px;
  background-color: #999999;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:after {
  font-size: 18px;
  font-size: 1.125rem;
  top: 2px;
  right: 8px;
  z-index: 2;
  counter-increment: ranknumber;
  content: counter(ranknumber);
  color: #ffffff;
  font-weight: bold;
}

.ranking .showcaseWrap.gridView .showcaseType01:nth-child(1) .showcaseItemsImg:before {
  background-color: #e3c951;
}

.ranking .showcaseWrap.gridView .showcaseType01:nth-child(2) .showcaseItemsImg:before {
  background-color: #a3bac2;
}

.ranking .showcaseWrap.gridView .showcaseType01:nth-child(3) .showcaseItemsImg:before {
  background-color: #b77331;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  color: #333333;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  padding: 4px;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock p {
  margin: 0;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock:nth-child(1) {
  width: auto;
  vertical-align: top;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseHd {
  font-size: 13px;
  font-size: 0.8125rem;
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  height: 35px;
  margin: 6px auto 16px;
  line-height: 1.5;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseHd > a {
  display: block;
  color: #333333;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseSupInfo {
  margin-bottom: 12px;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseSupInfo .showcaseSupName {
  display: -webkit-box;
  display: box;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  font-size: 13px;
  font-size: 0.8125rem;
  height: 35px;
  line-height: 1.5;
}

.ranking .showcaseWrap.gridView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseSupInfo .showcaseSupName a {
  color: #333333;
}

/*
# showcase listView

## ランキング カテゴリ表示

*/

.ranking h1.hdType01 {
  counter-reset: ranknumber;
}

.ranking .showcaseWrap.listView {
  /* リスト1カラム商品ブロック */
}

.ranking .showcaseWrap.listView .showcaseType01 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  position: relative;
  min-height: 162px;
  padding-left: 140px;
  border-bottom: 1px dotted #cccccc;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock {
  display: block;
  position: absolute;
  top: 16px;
  left: 0;
  width: 130px;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock a:hover {
  opacity: 0.7;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout {
  position: relative;
  position: absolute;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  display: block;
  position: absolute;
  content: "\54C1\5207\308C\4E2D";
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock.ItemsSoldout:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  line-height: 30px;
  background-color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg {
  position: relative;
  position: relative;
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 130px;
  background-color: #ffffff;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:before {
  display: block;
  position: absolute;
  content: "";
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:after {
  display: block;
  position: absolute;
  content: "";
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -8px;
  right: -28px;
  z-index: 1;
  opacity: 0.8;
  width: 80px;
  height: 40px;
  background-color: #999999;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseItemsImgBlock .showcaseItemsImg:after {
  font-size: 18px;
  font-size: 1.125rem;
  top: 2px;
  right: 8px;
  z-index: 2;
  counter-increment: ranknumber;
  content: counter(ranknumber);
  color: #ffffff;
  font-weight: bold;
}

.ranking .showcaseWrap.listView .showcaseType01:nth-child(1) .showcaseItemsImg:before {
  background-color: #e3c951;
}

.ranking .showcaseWrap.listView .showcaseType01:nth-child(2) .showcaseItemsImg:before {
  background-color: #a3bac2;
}

.ranking .showcaseWrap.listView .showcaseType01:nth-child(3) .showcaseItemsImg:before {
  background-color: #b77331;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  width: 100%;
  min-height: 162px;
  color: #333333;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  display: table-cell;
  padding: 16px;
  vertical-align: middle;
  word-break: break-all;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock:nth-child(1) {
  width: auto;
  vertical-align: top;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock:nth-child(2) {
  width: 150px;
  text-align: right;
  word-break: normal;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock p {
  margin: 0;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseHd {
  margin-bottom: 6px;
  line-height: 1.5;
  font-weight: bold;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseHd > a {
  display: block;
  color: #333333;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .catchCopy {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 16px;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li {
  font-size: 12px;
  font-size: 0.75rem;
  position: relative;
  margin-bottom: 4px;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li:last-child {
  margin-bottom: 0;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 20px;
  margin-left: 2px;
  line-height: 1;
  vertical-align: middle;
  letter-spacing: 0.15em;
  text-align: left;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating:before {
  display: block;
  position: absolute;
  content: "";
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating:before {
  font-size: 16px;
  font-size: 1rem;
  top: 0;
  left: 0;
  content: "\F091\F091\F091";
  width: 100%;
  font-family: FontAwesome;
  color: #cccccc;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating.threeScore .itemScoreRatingItem {
  width: 100%;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating.twoScore .itemScoreRatingItem {
  width: 66.666%;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating.oneScore .itemScoreRatingItem {
  width: 33.333%;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating .itemScoreRatingItem {
  position: relative;
  overflow: hidden;
  text-indent: -200%;
  white-space: nowrap;
  height: 100%;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating .itemScoreRatingItem:before {
  display: block;
  position: absolute;
  content: "";
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .itemScore li .itemScoreRating .itemScoreRatingItem:before {
  font-size: 16px;
  font-size: 1rem;
  top: 0;
  left: 0;
  content: "\F091\F091\F091";
  text-indent: 0;
  font-family: FontAwesome;
  color: #ffc000;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseSupInfo {
  margin: 12px auto;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseSupInfo .showcaseSupName {
  font-size: 14px;
  font-size: 0.875rem;
}

.ranking .showcaseWrap.listView .showcaseType01 .showcaseBox > .showcaseBlock .showcaseSupInfo .showcaseSupName a {
  color: #333333;
}

/*
# ranking

## ランキング

*/

.ranking .tabType01 .tabBox {
  width: 50%;
}

.ranking .rankContents {
  position: relative;
}

.ranking .updatedDate {
  font-size: 14px;
  font-size: 0.875rem;
  position: absolute;
  top: -52px;
  right: 0;
}

/*
# kyoryuFestCampaign1903

## 100人に1人！注文金額クーポン還元キャンペーン

*/

#kyoryuFestCampaign1903 {
  margin-bottom: 24px;
  padding-bottom: 16px;
  background-color: #f4f5f7;
}

#kyoryuFestCampaign1903 .kyoryuFestCampaign1903Hd img {
  max-width: 100%;
}

#kyoryuFestCampaign1903 .kyoryuFestCampInr {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 3px;
  font-size: 14px;
  font-size: 0.875rem;
  overflow-y: scroll;
  max-height: 240px;
  margin: 16px 16px 0;
  padding: 16px;
  border: 1px solid #999999;
  background-color: #ffffff;
}

/* 注文完了ページの当選モーダル */

#campaignAlertModal .alertModalInner {
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  text-align: center;
}

#campaignAlertModal .campaignDetailBtn {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 9px;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -webkit-box-shadow: 0 6px 0 0 #cc8200;
  box-shadow: 0 6px 0 0 #cc8200;
  position: absolute;
  bottom: 40px;
  left: 0;
  right: 0;
  width: 420px;
  line-height: 60px;
  margin: auto;
  background-color: #ffa200;
  color: #ffffff;
  text-align: center;
  vertical-align: middle;
}

#campaignAlertModal .campaignDetailBtn > img {
  vertical-align: middle;
}

#campaignAlertModal .campaignDetailBtn:hover {
  -webkit-box-shadow: 0 2px 0 0 #cc8200;
  box-shadow: 0 2px 0 0 #cc8200;
  bottom: 36px;
}

/*
# netsea top

## トップ 構成

*/

#topSearchField {
  z-index: 2000;
  width: 700px;
  margin: 0 auto 8px;
  padding-top: 24px;
}

#newExhibitInfo {
  text-align: center;
}

#newExhibitInfo .txtListType02 {
  width: 50%;
  margin: 0 auto 24px;
}

#newExhibitInfo .txtListType02 .itemsNum {
  font-size: 24px;
  font-size: 1.5rem;
  padding: 0 4px 0 8px;
}

#topHeadContainer {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  position: relative;
  width: auto;
  min-width: 1064px;
  max-width: 1364px;
  margin: 0 auto 24px;
  padding: 0 32px;
}

#topHeadContainer #topPrArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: auto;
  height: 394px;
  margin-bottom: 24px;
  padding: 16px;
  background-color: #f2f2f2;
}

#topHeadContainer #topPrArea .topPrHd {
  font-size: 12px;
  font-size: 0.75rem;
  margin-bottom: 8px;
  background-color: #ffffff;
  border: 1px solid #333333;
  text-align: center;
}

#topHeadContainer #topPrArea .topPr {
  width: 160px;
  margin: 0 auto;
}

#topHeadContainer #topPrArea .topPr li {
  margin-bottom: 16px;
}

#topHeadContainer #topPrArea .topPr li:last-child {
  margin-bottom: 0;
}

#topHeadContainer #topPrArea .topPr li a {
  display: block;
}

#topColWrap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}

#topColWrap #topColAsideArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 0.875rem;
  float: left;
  width: 264px;
}

#topColWrap #topColAsideArea .topAsideHd {
  font-size: 18px;
  font-size: 1.125rem;
  position: relative;
  position: relative;
  margin: 32px 0 16px;
  padding: 6px;
  border-bottom: 1px solid #6f6f6f;
  font-weight: bold;
}

#topColWrap #topColAsideArea .topAsideHd:before {
  display: block;
  position: absolute;
  content: "";
}

#topColWrap #topColAsideArea .topAsideHd:after {
  display: block;
  position: absolute;
  content: "";
}

#topColWrap #topColAsideArea .topAsideHd:first-child {
  margin-top: 0;
}

#topColWrap #topColAsideArea .topAsideHd:before {
  bottom: -10px;
  left: 19px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 9px 0 9px;
  border-color: #6f6f6f transparent transparent transparent;
}

#topColWrap #topColAsideArea .topAsideHd:after {
  bottom: -8px;
  left: 20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 8px 0 8px;
  border-color: #ffffff transparent transparent transparent;
}

#topColWrap #topColAsideArea .topAsideInr {
  margin: 0 8px 24px;
}

#topColWrap #topColAsideArea .topAsideInr .featureBnrList > li {
  margin-bottom: 16px;
}

#topColWrap #topColAsideArea .topAsideInr .featureBnrList > li > a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
}

#topColWrap #topColAsideArea .topAsideInr .featureBnrList > li > a:hover {
  opacity: 0.7;
}

#topColWrap #topColAsideArea .topAsideInr .featureBnrList > li > a > img {
  max-width: 100%;
}

#topColWrap #topColAsideArea .topAsideInr .featureTxtList > li {
  position: relative;
  padding: 8px 0;
  border-bottom: 1px dotted #999999;
}

#topColWrap #topColAsideArea .topAsideInr .featureTxtList > li > a {
  display: block;
  color: #333333;
}

#topColWrap #topColAsideArea .topAsideInr a.topAsideMoreLink {
  font-size: 16px;
  font-size: 1rem;
  position: relative;
  display: block;
  margin-top: 8px;
  padding-right: 1em;
  text-align: right;
}

#topColWrap #topColAsideArea .topAsideInr a.topAsideMoreLink:after {
  display: block;
  position: absolute;
  content: "\F105";
}

#topColWrap #topColAsideArea .topAsideInr a.topAsideMoreLink:after {
  top: 0;
  right: 2px;
  font-family: FontAwesome;
}

#topColWrap #topColAsideArea .topAsideBtn {
  font-size: 15px;
  font-size: 0.9375rem;
  padding: 6px;
}

#topColWrap #topColMainArea {
  width: 0;
  width: calc(100% - 304px);
  float: right;
  min-width: 696px;
  max-width: 996px;
}

#topColWrap #topColMainArea #topBigBanner {
  margin-bottom: 24px;
  text-align: center;
}

#topColWrap #topColMainArea #topBigBanner img {
  max-width: 100%;
}

#sucouponBnrArea img {
  max-width: 100%;
}

.featureListLink {
  position: relative;
  top: -48px;
}

/* 閲覧履歴 */

#recommend,
#viewRecommend,
#viewHistory {
  margin-bottom: 48px;
}

#recommend iframe,
#viewRecommend iframe,
#viewHistory iframe {
  width: 100% !important;
  max-width: 100%;
}

@media all and (max-width: 480px) {
  /* MonitorSize Max 480px */

  /* スマホ表示対策 */

  #recommend iframe,
  #viewRecommend iframe,
  #viewHistory iframe {
    width: auto;
    max-width: 480px;
  }
}

/*
# supList

## 問屋・卸会社（サプライヤー）名一覧

*/

.supList .sortBox {
  border-bottom: 1px dotted #cccccc;
}

.supList .supNameList {
  font-size: 14px;
  font-size: 0.875rem;
}

.supList .supNameList li {
  white-space: nowrap;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  width: 32%;
  width: calc(100% / 3 - 16px);
  float: left;
  margin: 8px 16px 8px 0;
}

.supList .supNameList li a {
  color: #333333;
}

/*
# topHoldFeature

## 開催中の特集

*/

#topHoldFeature {
  margin: 0 auto 40px;
}

#topHoldFeature .featureBanner li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  width: 50%;
  padding: 0 16px;
}

#topHoldFeature .featureBanner li a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
  margin-bottom: 4px;
}

#topHoldFeature .featureBanner li a:hover {
  opacity: 0.7;
}

#topHoldFeature .featureBanner li img {
  max-width: 100%;
}

/*
# topRanking

## トップのランキング

*/

#topRanking {
  position: relative;
  min-height: 342px;
  margin: 0 auto 40px;
}

#topRanking .topRankingHd {
  font-size: 21px;
  font-size: 1.3125rem;
  margin: 0 0 16px;
  padding: 8px;
  font-weight: bold;
}

#topRanking .tabType02 {
  font-size: 12px;
  font-size: 0.75rem;
}

#topRanking .tabType02 .tabBox {
  margin: 0 4px;
}

#topRanking .rankLoading {
  height: 82%;
  height: calc(100% - 107px);
  position: absolute;
  top: 110px;
  z-index: 10;
  width: 100%;
  text-align: center;
  background-color: #ffffff;
}

#topRanking .rankLoading i.fa-spinner {
  top: 48%;
  top: calc(50% - 30px);
  font-size: 60px;
  font-size: 3.75rem;
  position: absolute;
  color: #999999;
}

#topRanking .updatedDate {
  font-size: 14px;
  font-size: 0.875rem;
  position: relative;
  top: -8px;
  margin-left: 8px;
  margin-bottom: 0;
  counter-reset: ranknumber;
}

#topRanking .generalRankingItems li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 25%;
  width: calc(100% / 4);
  float: left;
  position: relative;
  margin: 0 0 24px;
  padding: 0 12px;
}

#topRanking .generalRankingItems li .generalRankHd {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 8px;
  padding: 4px 0;
  background-color: #eeeeee;
  text-align: center;
}

#topRanking .generalRankingItems li .topRankingItemsImg {
  position: relative;
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: auto;
  padding-top: 100%;
  background-color: #ffffff;
  border: 1px solid #cccccc;
}

#topRanking .generalRankingItems li .topRankingItemsImg:before {
  display: block;
  position: absolute;
  content: "";
}

#topRanking .generalRankingItems li .topRankingItemsImg:after {
  display: block;
  position: absolute;
  content: "";
}

#topRanking .generalRankingItems li .topRankingItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

#topRanking .topRankingItems li {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 14.4%;
  width: calc(72% / 5);
  float: left;
  position: relative;
  margin: 0 0 8px;
  padding: 0 8px;
}

#topRanking .topRankingItems li .topRankingItemsImg {
  position: relative;
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: auto;
  padding-top: 100%;
  background-color: #ffffff;
  border: 1px solid #cccccc;
}

#topRanking .topRankingItems li .topRankingItemsImg:before {
  display: block;
  position: absolute;
  content: "";
}

#topRanking .topRankingItems li .topRankingItemsImg:after {
  display: block;
  position: absolute;
  content: "";
}

#topRanking .topRankingItems li .topRankingItemsImg .itemsThum {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

#topRanking .topRankingItems li .topRankingItemsImg:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -6px;
  right: -22px;
  z-index: 1;
  opacity: 0.8;
  width: 64px;
  height: 32px;
  background-color: #999999;
}

#topRanking .topRankingItems li .topRankingItemsImg:after {
  font-size: 18px;
  font-size: 1.125rem;
  top: -2px;
  right: 6px;
  z-index: 2;
  counter-increment: ranknumber;
  content: counter(ranknumber);
  color: #ffffff;
  font-weight: bold;
}

#topRanking .topRankingItems li:nth-child(1) {
  width: 28%;
}

#topRanking .topRankingItems li:nth-child(1) .topRankingItemsImg:before {
  top: -18px;
  right: -38px;
  width: 100px;
  height: 60px;
  background-color: #e3c951;
}

#topRanking .topRankingItems li:nth-child(1) .topRankingItemsImg:after {
  font-size: 30px;
  font-size: 1.875rem;
  top: -4px;
  right: 6px;
}

#topRanking .topRankingItems li:nth-child(2) .topRankingItemsImg:before {
  background-color: #a3bac2;
}

#topRanking .topRankingItems li:nth-child(3) .topRankingItemsImg:before {
  background-color: #b77331;
}

#topRanking .topRankingItems li .moreRankingLink {
  font-size: 14px;
  font-size: 0.875rem;
  overflow: hidden;
  width: 100%;
  margin: auto;
  padding-top: 100%;
  background-color: #ffffff;
  text-align: left;
}

#topRanking .topRankingItems li .moreRankingLink a {
  position: relative;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 84px;
  height: 46px;
  margin: auto;
}

#topRanking .topRankingItems li .moreRankingLink a:after {
  display: block;
  position: absolute;
  content: "\F105";
}

#topRanking .topRankingItems li .moreRankingLink a:after {
  bottom: 0;
  right: 2px;
  font-family: FontAwesome;
}

/*
# supplier feature

## サプライヤーオリジナル特集

*/

#topSupFeature {
  margin: 0 auto 40px;
}

#topSupFeature .hdCatch {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  font-size: 20px;
  font-size: 1.25rem;
  left: -8px;
  display: inline-block;
  height: 34px;
  margin-right: 8px;
  padding: 1px 26px 0 8px;
  background-color: #ffa200;
  color: #ffffff;
  vertical-align: middle;
}

#topSupFeature .hdCatch:after {
  display: block;
  position: absolute;
  content: "";
}

#topSupFeature .hdCatch:after {
  top: 0;
  right: 0;
  z-index: 2;
  border-width: 17px 12px;
  border-style: solid;
  border-color: transparent;
  border-right-color: #ffffff;
}

#topSupFeature .txtLinkType01 {
  margin-top: -8px;
}

/* トップのみ */

@media all and (max-width: 1300px) {
  /* MonitorSize Under 1300px */

  #topSupFeature .supFeatureList li {
    width: 49%;
    width: calc(100% / 2 - 12px);
  }

  #topSupFeature .supFeatureList li:nth-child(3n) {
    margin-right: 24px;
  }

  #topSupFeature .supFeatureList li:nth-child(2n) {
    margin-right: 0;
  }
}

/*
# topTrend

## トレンドマーケット

*/

#topTrend {
  margin: 0 auto 48px;
}

#topTrend .trendTheme01,
#topTrend .trendTheme02 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#topTrend .hdCatch {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  font-size: 20px;
  font-size: 1.25rem;
  left: -8px;
  display: inline-block;
  height: 34px;
  margin-right: 8px;
  padding: 1px 26px 0 8px;
  background-color: #44bb77;
  color: #ffffff;
  vertical-align: middle;
}

#topTrend .hdCatch:after {
  display: block;
  position: absolute;
  content: "";
}

#topTrend .hdCatch:after {
  top: 0;
  right: 0;
  z-index: 2;
  border-width: 17px 12px;
  border-style: solid;
  border-color: transparent;
  border-right-color: #ffffff;
}

#topTrend .hdComment {
  border-radius: 3px;
  display: inline-block;
  padding: 4px 8px;
  background-color: #fff171;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(50%, #fff171));
  background: linear-gradient(transparent 50%, #fff171 50%);
}

#topTrend .trendItemWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 24px 0;
  padding: 24px;
  background-color: #eeeeee;
}

#topTrend .trendItemWrap .trendItem {
  width: 18%;
  width: calc(100% / 5 - 16px);
  position: relative;
}

#topTrend .trendItemWrap .trendItem > a {
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 1px 0 0 0 rgba(0, 0, 0, 0.03), -1px 0 0 0 rgba(0, 0, 0, 0.03);
  position: relative;
  top: 0;
  display: block;
  max-width: 100%;
  padding-top: 100%;
  background-color: #ffffff;
}

#topTrend .trendItemWrap .trendItem > a:hover {
  -webkit-box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2), 4px 0 4px 0 rgba(0, 0, 0, 0.1), -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  opacity: 0.7;
}

#topTrend .trendItemWrap .trendItem > a img {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
}

#topTrend .trendItemWrap .trendItem figcaption {
  margin: 12px 0 0;
  text-align: center;
}

#topTrend .trendItemWrap .trendItem figcaption a {
  font-size: 14px;
  font-size: 0.875rem;
  white-space: nowrap;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: block;
  padding: 4px;
  color: #333333;
}

/*
# cart supList

## カート サプごとのリスト

*/

.cart .supCart .cartItemsAccBtn.open,
.csvDirect .supCart .cartItemsAccBtn.open {
  position: relative;
  padding-top: 16px;
  padding-bottom: 8px;
}

.cart .supCart .cartItemsAccBtn.open:after,
.csvDirect .supCart .cartItemsAccBtn.open:after {
  display: block;
  position: absolute;
  content: "\F106";
}

.cart .supCart .cartItemsAccBtn.open:after,
.csvDirect .supCart .cartItemsAccBtn.open:after {
  top: 0;
}