@charset "UTF-8";

/* ----サイトカラー設定---- */

/* ボーダーカラー */

.border-color {
  border-color: var(--cl-bdr) !important;
}

/* テキストカラー */

.text-color {
  color: #da9f34 !important;
}

/* テキストホバー時カラー */

.text-hover-color {
  -webkit-transition: all .4s ease;
  -moz-transition: all .4s ease;
  transition: all .4s ease;
}

.text-hover-color:hover {
  color: #5aabc2 !important;
}

/* 背景カラー */

.bg-color {
  background-color: #5aabc2 !important;
}

.bg-before-color:before {
  background-color: #000000 !important;
}

.bg-after-color:after {
  background-color: #000000 !important;
}

/* ボタンカラー */

.btn-default {
  border: 1px solid #000000;
  background-color: #ffffff;
  color: #000000;
}

.btn-primary {
  color: #fff;
  background-color: #000000;
}

#cart_gift {
  color: #fff;
  background-color: #000000 !important;
}

.btn-secondary {
  border: 1px solid #000000;
  background-color: #ffffff;
  color: #000000;
}

.btn-danger {
  border: 1px solid #000000;
  background-color: #ffffff;
  color: #000000;
}

/* 一覧ページ/絞り込み(表示方法)アクティブ */

.block-goods-list--display-style-items .active,
.block-goods-list--sort-order-items .active {
  background-color: var(--cl-rd);
  color: #ffffff !important;
}

/* 一覧ページ/ページャーアクティブ */

.pagination > li.pager-current span {
  background-color: var(--cl-rd) !important;
  color: #ffffff !important;
}

/* マイページ/リンクホバー */

/* モーダルヘッダー */

.modal-header {
  background: #000000 !important;
}

/* ラジオ,チェックボックス */

input[type="radio"]:checked + input + label,
input[type="radio"]:checked + label {
  color: #000000;
}

input[type="radio"]:checked + input + label::after,
input[type="radio"]:checked + label::after {
  background: #000000;
}

input[type="checkbox"]:checked + input + label,
input[type="checkbox"]:checked + label {
  color: #000000;
}

input[type="checkbox"] + input + label::after,
input[type="checkbox"] + label::after {
  border-bottom: 2px #000000 solid;
  border-left: 2px #000000 solid;
}

/* 左メニュー/絞り込み表示 */

.pane-left-menu #block_of_filter {
  display: none;
}

/* 左メニュー/現在地 */

.block-category-tree--item__open > a,
.block-genre-tree--item__open > a {
  color: #5aabc2;
  font-weight: bold;
}