@charset "UTF-8";

/* ----ツールチップ---- */

.balloontip {
  min-width: 20px;
  padding: 10px;
  border-radius: 6px;
  opacity: 1;
  z-index: 32767;
  text-align: left;
  font-size: 12px;
  border: 1px solid rgb(119, 119, 119);
  box-shadow: rgb(85, 85, 85) 4px 4px 4px;
  color: rgb(255, 255, 255);
  background: #333;
}

/* フロート */
.leftfloat_ {
  float: left;
  display: inline;
}

.rightfloat_ {
  float: right;
  display: inline;
}

img.leftfloat_ {
  margin: 0 10px 10px 0;
}

img.rightfloat_ {
  margin: 0 0 10px 10px;
}

/* 文字サイズ */
.xlarge_ {
  font-size: 144%;
}

.small_ {
  font-size: 80%;
}

.xsmall_ {
  font-size: 64%;
}

/* ----clearfix---- */
.clearfix_:before,
.clearfix_:after {
  content: "";
  display: table;
}

.clearfix_:after {
  clear: both;
}

.clearfix_ {
  zoom: 1;
}

/* 特定メッセージ（ブロック） */
div.block_message_ {
  font-size: 14px;
  background-color: #fff;
  border: solid 1px #666;
  padding: 4px;
  margin: 4px 0;
}

div.error_,
table.error_ {
  background-color: #fff;
  border: solid 1px #e61d50;
  padding: 4px;
  margin: 4px 0;
}

div.notice_,
table.notice_ {
  background-color: #fff;
  border: solid 1px #966;
  padding: 4px;
  margin: 4px 0;
}

div.info_,
table.info_ {
  background-color: #fff;
  border: solid 1px #666;
  padding: 4px;
  margin: 4px 10px;
}

ul.error_ {
  margin-left: 16px;
}

.common_headline1_ {
  margin-bottom: 5.333vw;
  padding-left: 3.733vw;
  font-size: 5.333vw;
  font-weight: bold;
  color: #333;
  font-size: 4.266vw;
  background: transparent;
  margin-top: 10px;
  font-size: 5.5vw;
  padding-left: 10px;
  padding-left: 0;
  margin-bottom: 10px;
  font-size: 20px;
}

.common_headline1_::before {
  content: none;
}

.common_headline2_ {
  font-size: 16px;
  padding: 10px 0 10px 21px;
  position: relative;
  background: #f6f6f6;
  white-space: nowrap;
  z-index: -1;
  margin: 10px 0;
  padding-left: 10px;
  margin: 20px 0 10px;
  font-weight: bold;
}

.common_headline2_::before {
  content: "";
  width: 6px;
  height: 30px;
  background: #4cae8d;
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

div.common_headline2_::before {
  content: "";
  width: 6px;
  height: 30px;
  background: #4cae8d;
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

/* 共通クラス(その他) */
.disp_none_ {
  display: none;
}

.hidden_ {
  visibility: hidden;
  clear: both;
}

.nocell_ {
  border: none !important;
  background-color: transparent !important;
}

.hiddenEnter_ {
  width: 0;
  height: 0;
}

/* 価格表示 */
.price_pop_ {
  color: #e61d50;
  font-size: 80%;
  display: none;
}

.price_ {
  color: #e61d50;
  font-weight: bold;
  font-size: 4vw;
}

.exclude_price_ {
  color: #333;
  font-weight: bold;
  font-size: 4vw;
}

div.g_price_ > span.small_ {
  font-size: 100%;
  color: #333;
}

.g_price_ {
  position: relative;
}

.g_price_::after {
  content: "";
  width: 8px;
  height: 8px;
  border: 0;
  border-top: solid 2px #676767;
  border-right: solid 2px #676767;
  top: -25%;
  transform: translateY(-50%) rotate(45deg);
  position: absolute;
  right: 6.133vw;
  content: none;
}

/* --------------------------------------------------------------------
  トップページ
-------------------------------------------------------------------- */
div.flash_ctrl_ {
  white-space: nowrap;
  text-align: right;
  float: right;
}

div.search_ {
  white-space: nowrap;
}

.category_list_title_ {
  background: #676767;
  color: #fff;
  font-size: 4.266vw;
  font-weight: 300;
  text-align: center;
  padding: 3.2vw 0;
  margin-top: 20px;
}

.genre_list_title_ {
  background: #676767;
  color: #fff;
  font-size: 4.266vw;
  font-weight: 300;
  text-align: center;
  padding: 3.2vw 0;
  margin-top: 20px;
}

.catalog_list_title_ {
  background: #676767;
  color: #fff;
  font-size: 4.266vw;
  font-weight: 300;
  text-align: center;
  padding: 3.2vw 0;
  margin-top: 20px;
}

/* トピック詳細 */
.topic_head_ {
  font-size: 20px;
}

.topic_head_::before {
  content: "";
}

h2.topic_title_ {
  display: flex;
  align-items: center;
}

h2.topic_title_ .new-icon {
  margin-left: 10px;
}

.topiclist_body_ {
  padding: 3.46vw;
  padding-left: 10px;
  padding-right: 10px;
  padding: 10px 0;
}

/* 商品一覧 */
table.approval_ {
  text-align: left;
  margin-bottom: 10px;
  font-size: 12px;
}

table.approval_ {
  border: 1px solid #ccc;
}

table.approval_ td {
  padding: 3px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

table.approval_ .goods_ {
  width: 20%;
}

table.approval_ .qty_ {
  width: 16%;
  text-align: right;
}

table.approval_ .amt_ {
  width: 20%;
  text-align: right;
}

table.approval_ .money_ {
  width: 20%;
  text-align: right;
}

table.approval_ th {
  text-align: left;
  white-space: nowrap;
  font-weight: normal;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  background-color: #e5f3ff;
  padding: 3px;
}

div.block_ .qty_ input[type="text"] {
  width: 3em;
  padding: 2px 1px;
  width: 46px;
  margin: 3px;
  text-align: right;
}

.top_comment_ {
  margin-bottom: 10px;
}

div.supplier_event_ .top_comment_ {
  margin-top: 10px;
}

/* --------------------------------------------------------------------
  common　ヘッドライン
-------------------------------------------------------------------- */
h1.goods_name_ {
  margin-bottom: 10px;
  margin-top: 10px;
  font-weight: bold;
  color: #333;
  font-size: 20px;
}

h1.category_name_ {
  margin-bottom: 10px;
  margin-top: 10px;
  font-size: 20px;
  font-weight: bold;
  color: #333;
}

h1.event_name_ {
  margin-bottom: 10px;
  font-weight: bold;
  color: #333;
  font-size: 4.266vw;
  background: transparent;
  margin-top: 10px;
  font-size: 20px;
}

h1.event_name_::before {
  content: none;
}

h1.supplier_name_ {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: bold;
  color: #333;
  background: transparent;
}

h1.event_title_ {
  font-size: 4.266vw;
  color: #606060;
  position: relative;
  padding-left: 20px;
  font-size: 4.266vw;
  color: #606060;
  position: relative;
  padding-left: 20px;
  background: #f6f6f6;
  font-size: 16px;
  padding: 10px 0 10px 10px;
  position: relative;
  margin: 20px 0 10px;
}

h1.event_title_ a {
  color: #606060;
}

/* --------------------------------------------------------------------
  common　ナビゲーション
-------------------------------------------------------------------- */
/* パンくず */
.navitopicpath_ {
  margin: 2.4vw 0 10px 2.933vw;
  margin-left: 0;
  font-size: 2.66vw;
  line-height: 1.5;
  text-align: left;
}

.navitopicpath_ a {
  margin: 0 0.5em;
  color: #333;
}

.navitopicpath_ span.current_ {
  margin: 0 0.5em;
}

.navitopicpath_ li {
  display: inline;
}

.navitopicpath_ li:last-of-type a {
  text-decoration: underline;
}

/* ページジャンプ */
.navipage_ {
  text-align: right;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  align-items: center;
  margin: 20px 0;
}

.navipage_.top_ {
  /* ページジャンプ上部 */
  width: 100%;
}

.navipage_.bottom_ {
  /* ページジャンプ下部 */
  margin-top: 5px;
}

.navipage_ .navipage_sum_ {
  margin-bottom: 5px;
  display: block;
  width: 100%;
}

.navipage_ .navipage_first_ a {
  padding-left: 14px;
  background: url(../../img/usr/sp/navifirst.gif) left center no-repeat;
}

.ui-widget.ui-widget-content .navipage_ .navipage_first_ a {
  padding-top: 9px !important;
  padding-bottom: 8px !important;
}

.navipage_ .navipage_prev_ a {
  padding-left: 10px;
  background: url(../../img/usr/sp/naviprev.gif) left center no-repeat;
}

.ui-widget.ui-widget-content .navipage_ .navipage_prev_ a {
  padding-top: 9px !important;
  padding-bottom: 8px !important;
}

.navipage_ .navipage_next_ a {
  padding-right: 10px;
  background: url(../../img/usr/sp/navinext.gif) right center no-repeat;
}

.ui-widget.ui-widget-content .navipage_ .navipage_next_ a {
  padding: 8px 10px 9px !important;
  top: 0 !important;
}

.navipage_ .navipage_last_ a {
  padding-right: 14px;
  background: url(../../img/usr/sp/navilast.gif) right center no-repeat;
}

.ui-widget.ui-widget-content .navipage_ .navipage_last_ a {
  padding: 8px 14px 9px 6px !important;
  top: 0 !important;
}

.navipage_ a {
  white-space: nowrap;
  margin: 0 1px;
  padding: 6px 6px;
  line-height: 30px;
  background-color: #fff;
  border: 1px solid #4cae8d;
}

.navipage_ > a {
  padding: 2px 6px 1px;
}

.navipage_now_ {
  margin: 0 1px;
  padding: 2px 6px 1px;
  line-height: 30px;
  color: #c00;
  font-weight: bold;
  text-decoration: none;
  background: #fee;
  border: 1px solid #f99;
}

.navipage_ .navipage_reverse_ {
  margin-right: 1px;
}

.navipage_ .navipage_forward_ {
  margin-left: 1px;
  margin-top: 1px;
}

/* 並び替え */
.navisort_ {
  margin: 2px 0;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.navisort_ dt {
  width: 70px;
  text-align: right;
  font-weight: normal;
  font-size: 13px;
}

.navisort_ dd {
  width: calc(100% - 70px);
  font-size: 13px;
}

.navisort_now_ {
  color: #c00;
  text-decoration: none;
  margin: 2px 5px;
  white-space: nowrap;
  font-weight: bold;
}

.navisort_ a {
  margin: 2px 5px;
  white-space: nowrap;
}

/* 表示切替 */
.navistyle_ {
  margin: 2px 0;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.goods_filter_ .navistyle_ {
  text-align: left;
}

.goods_filter_ {
  margin-bottom: 10px;
}

.navistyle_ dt {
  width: 70px;
  text-align: right;
  font-weight: normal;
  font-size: 13px;
}

.navistyle_ dd {
  width: calc(100% - 70px);
  font-size: 13px;
}

.navistyle_#goods_class_filter_ dd {
  display: flex;
  flex-wrap: wrap;
}

.navistyle_now_ {
  color: #c00;
  text-decoration: none;
  margin: 2px 5px;
  white-space: nowrap;
  font-weight: bold;
}

.navistyle_ a {
  margin: 2px 5px;
  white-space: nowrap;
}

/* ブランド絞込 */
.brand_name_ {
  width: 100%;
  overflow: hidden;
}

.brand_name_now_ {
  color: #c30;
  text-decoration: none;
  margin: 2px 5px;
  white-space: nowrap;
  font-weight: bold;
}

.brand_name_ a {
  margin: 2px 5px;
  white-space: nowrap;
}

/* メーカー絞込 */
.maker_name_ {
  width: 100%;
  overflow: hidden;
}

.maker_name_now_ {
  color: #c30;
  text-decoration: none;
  margin: 2px 2px 2px 2px;
  white-space: nowrap;
  font-weight: bold;
}

.maker_name_ a {
  margin: 2px 2px 2px 2px;
  white-space: nowrap;
}

/* 商品分類絞込 */
#goods_class_filter_ {
  padding-top: 3px;
  text-align: left;
}

#goods_class_filter_ .class_filter_ {
  margin-left: 4px;
  margin-bottom: 5px;
}

#goods_class_filter_ .class_filter_ select {
  padding: 8px 0;
  font-size: 13px;
}

#goods_class_filter_ .class_filter_ .selected_ {
  background-color: #fef;
}

/* --------------------------------------------------------------------
  Ajax　Zip
-------------------------------------------------------------------- */
#suggestZipArea {
  background-color: #fff;
  border: 1px solid #999;
  display: none;
  padding: 2px 0;
  font-size: 12px;
  position: absolute;
  z-index: 9999;
}

#suggestZipArea .itemNotFound {
  padding: 0 4px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  color: #999;
  font-style: italic;
}

#suggestZipArea .itemLine {
  padding: 0 4px;
  height: 20px;
  line-height: 20px;
  list-style: none;
  white-space: nowrap;
  color: #000;
  font-size: 12px;
}

#suggestZipArea .selected {
  background-color: #fdd;
  color: #c00000;
}

#suggestZipArea .itemLine .itemCode {
  float: left;
  font-weight: bold;
  margin-right: 4px;
  font-size: 11px;
}

/* --------------------------------------------------------------------
  商品検索
--------------------------------------------------------------------- */
dl.goodssearch_ dt,
dl.goodssearch_ dd {
  display: block;
  white-space: nowrap;
}

dl.goodssearch_ dt {
  margin-left: 5px;
  padding: 8px 0 8px 8px;
  background: #eef8f5;
  margin-bottom: 6px;
  margin-left: 0;
}

dl.goodssearch_ dd {
  margin-bottom: 10px;
}

dl.goodssearch_ + input {
  /*width: 48vw;
  margin: 0 25vw 10px;
  background: #000;
  border-radius: 2px;
  border: none;
  color: #fff;
  font-size: 3.2vw;*/
}

#search_suggest_area_ {
  width: 80%;
}

.comment_middle_ {
  word-break: break-all;
}

/* --------------------------------------------------------------------
  ジャンル
-------------------------------------------------------------------- */
/* ジャンル一覧 */

div.GenreStyle_ {
  border-bottom: 1px solid #ccc;
  margin-bottom: 5.333vw;
  font-size: 3.466vw;
}

div.GenreStyle_ div.name_ {
  margin: 0;
  padding: 2px 10px 2px 0;
  line-height: 28px;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  color: #000;
  font-weight: bold;
}

div.genre_list_ div.GenreStyle_ div.name_ {
  background-color: #fff;
}

div.GenreStyle_ .img_ {
  float: left;
  margin: 0;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  content: "";
  border-style: solid;
  border-width: 6px 0 6px 8px;
  border-color: transparent transparent transparent #4cae8d;
}

div.GenreStyle_ .img_show_ {
  content: none;
  border: none;
  width: 60px;
  height: 61px;
  right: 0;
  left: unset;
}

div.GenreStyle_ .img_hidden_ {
  content: none;
  border: none;
  width: 60px;
  height: 61px;
  right: 0;
  left: unset;
}

div.GenreStyle_ .img_show_::before,
div.GenreStyle_ .img_show_::after,
div.GenreStyle_ .img_hidden_::before,
div.GenreStyle_ .img_hidden_::after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  width: 11px;
  height: 2px;
  border: 0;
  margin: 0;
  transition: all 0.3s;
  background-color: #4cae8d;
}

div.GenreStyle_ .img_hidden_::after {
  transform: rotate(-90deg);
}

div.GenreStyle_ div.genre_list_block0_ > div.link_ {
  position: relative;
  padding: 2vw 0 2vw 0;
  border-right: none;
  border-left: none;
}

div.genre_list_ div.GenreStyle_ div.genre_list_block0_ > div.link_ {
  position: relative;
}

div.GenreStyle_ div.genre_list_block1_ > div.name_ {
  background: #f6f6f6;
  position: relative;
  padding: 2vw 0 2vw 20px;
  border-right: none;
  border-left: none;
}

div.GenreStyle_ div.genre_list_block2_ > div.name_ {
  padding: 2vw 0 2vw 40px;
  position: relative;
  background: #f6f6f6;
  border-right: none;
  border-left: none;
}

div.GenreStyle_ div.genre_list_block3_ > div.name_ {
  padding: 2vw 0 2vw 60px;
  position: relative;
  background: #f6f6f6;
  border-right: none;
  border-left: none;
}

div.GenreStyle_ .comment_ {
  display: none;
}

/* --------------------------------------------------------------------
  イベント
-------------------------------------------------------------------- */
/* イベント詳細 */
/* イベント一覧 */
div.event_ {
  margin-bottom: 10px;
}

div.event_ h1.event_title_ {
  background: #f6f6f6;
  font-size: 16px;
  padding: 10px 0 10px 10px;
  position: relative;
  margin: 20px 0 10px;
}

h1.event_title_::before {
  content: "";
  width: 6px;
  height: 30px;
  background: #4cae8d;
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  left: 10px;
  left: 0;
}

div.event_ h1.event_title_ a {
  color: #606060;
}

.event_ ul.goods_p_ li .block_ {
  position: relative;
}

/* --------------------------------------------------------------------
  カタログ
-------------------------------------------------------------------- */
/* カタログメニューリスト */

div.CatalogStyle_ {
  border-bottom: 1px solid #ccc;
  margin-bottom: 5.333vw;
  font-size: 3.466vw;
}

div.CatalogStyle_ div.name_ {
  margin: 0;
  padding: 2px 10px 2px 0;
  line-height: 28px;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  color: #000;
  font-weight: bold;
  background-color: #fff;
}

div.CatalogStyle_ .img_ {
  float: left;
  left: 0;
  top: 0;
  margin: 0;
  margin-right: 2px;
  width: 30px;
  height: 28px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 8px;
  border-color: transparent transparent transparent #4cae8d;
  position: absolute;
  top: 50%;
  left: 86.66vw;
}

div.CatalogStyle_ div.catalog_list_block_ > div.link_ {
  position: relative;
  padding: 4.267vw 0 4.267vw 20px;
  border-right: none;
  border-left: none;
}

/* カタログ索引画像・商品画像登録画面 */
.catalog-img-title,
.goods-img-title {
  border: 1px solid #ccc;
  background-color: #eef8f5;
  padding: 8px 8px 6px;
}

.catalog-img-content,
.goods-img-content {
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 8px 8px 6px;
  margin-bottom: 10px;
}

.catalog-sub-title,
.goods-img-sub-title {
  font-weight: bold;
  margin-bottom: 5px;
}

.goods-img-sub-title + div + div {
  margin-top: 5px;
}

.catalog-size-wrapper,
.goods-size-wrapper {
  display: flex;
  margin-bottom: 5px;
}

.catalog-img-result,
.goods-img-result {
  margin: 10px 0;
}

/* --------------------------------------------------------------------
  購入履歴詳細画面
-------------------------------------------------------------------- */
/* キャンセルダイアログ */
#gmobillpayment_dialog {
  text-align: center;
}

#gmobillpayment_dialog_msg {
  margin-top: 10px;
}

/* 注文拡張情報 */
dl.salesappend_ dd span {
  display: block;
}

dl.salesappend_ dt {
  margin-top: 10px;
  margin-bottom: 10px;
}

div.method_box_ div.method_box_content_ dl.salesappend_ dd.salesappend_textbox input {
  margin-top: 0;
}

dl.salesappend_ dd.salesappend_radio input,
dl.salesappend_ dd.salesappend_checkbox input {
  display: block;
  float: left;
  clear: left;
  margin-top: 0;
  margin-bottom: 5px;
}

dl.salesappend_ dd.salesappend_radio label,
dl.salesappend_ dd.salesappend_checkbox label {
  display: block;
  clear: none;
  margin-bottom: 5px;
  margin-left: 20px;
}

/* ---------------------------------------------------
bx-slider
-----------------------------------------------------*/

div.bx-viewport * {
  max-width: initial;
}

.bx-wrapper {
  box-shadow: none;
  margin-left: auto;
  margin-right: auto;
}

.bx-wrapper img {
  width: 100%;
}

.bx-wrapper .bx-controls-direction a {
  background: inherit;
  display: block;
  width: 15px;
  height: 30px;
  width: 16px;
  opacity: 1;
  top: 46%;
  z-index: 2 !important;
}

.bx-wrapper .bx-controls-direction a.bx-next::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-top: -5px;
  border-top: solid 1px #7dc788;
  border-right: solid 1px #7dc788;
  transform: rotate(45deg);
  position: absolute;
  right: 6px;
  top: 52%;
  z-index: 2 !important;
}

.bx-wrapper .bx-controls-direction a.bx-prev::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-top: -5px;
  border-top: solid 1px #7dc788;
  border-right: solid 1px #7dc788;
  transform: rotate(225deg);
  position: absolute;
  right: 2px;
  top: 51%;
  z-index: 2 !important;
}

.bx-wrapper .bx-pager {
  width: 100%;
  text-align: center;
  position: relative;
  z-index: 5;
  padding: 0;
  bottom: -8px;
}

.bx-wrapper .bx-pager.bx-default-pager a {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #dcdcdc;
  margin: 0 6px;
  display: inline-block;
}

.wrapper_ .bx-wrapper .bx-pager.bx-default-pager a:hover,
.wrapper_ .bx-wrapper .bx-pager.bx-default-pager a.active,
.wrapper_ .bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #4ca259;
}

.bx-wrapper {
  box-shadow: inherit;
}

#gallery .bx-viewport .bx-wrapper {
  height: 60px;
  width: 100%;
}

#search_suggest_area_ {
  position: absolute;
  display: block;
  z-index: 1000;
  text-align: left;
  background-color: #fff;
  border: solid 1px #ccc;
  padding: 5px;
}

.suggest_keyword_ {
  padding: 2px;
}

.suggest_keyword_entry_ {
  display: block;
  color: #000;
  text-decoration: none;
}

.suggest_goods_ {
  width: 370px;
  min-height: 60px;
  padding: 2px;
  display: block;
  clear: both;
  display: flex;
}

.suggest-goods-info-wrapper {
  margin-left: 10px;
}

.suggest-goods-info-wrapper p.suggest_semiclosed_value_ {
  word-break: break-all;
}

.suggest_goods_img_ {
  display: inline-block;
  width: 60px;
  flex-shrink: 0;
}

.suggest_goods_img_ img {
  width: 60px;
  height: 60px;
}

.suggest_keyword_:hover,
.suggest_goods_:hover {
  background-color: #dedede;
  cursor: pointer;
  cursor: hand;
}