/* サイドメニュー絞り込み検索 */


/*------------------------- 絞り込み全体 -------------------------*/
.item-group-search {
  margin-bottom: 10px;
}
.item-group-search .accordion a {
  display: block;
  background: #1a75bc;
  color: #fff;
  padding: 8px 20px;
}
.item-group-search .select ul li {
  background: #eee;
  margin: 0;
  border-bottom: 1px solid #ccc;
}
.item-group-search .select ul li:last-child {
  border: none;
}
@media (min-width: 992px) {
	.item-group-search .container-lg {
    padding: 0 10px;
  }
  .item-group-search .search_area {
    background: #eee;
    padding: 10px 5px;
  }
  .item-group-search .tab_select {
    background: #eee;
  }
}


/*------------------------- PC時サイド -------------------------*/
@media (min-width: 992px)  {
  .item-group-search .select_box .content {
    display: flex;
    flex-flow: column;
  }/*縦並び*/
  .item-group-search .select_box .tab-content > .tab-pane {
    display: block;
  }
  .item-group-search .select_box .content .collapse {
    display: block;
    height: auto!important;
  }/*常時開*/
  .item-group-search .tab_select, .item-group-search .related_products, .item-group-search .otherseries {
    display: block!important;
  }
  .item-group-search .select_box .content .col-open span, .item-group-search .select_box .content .col-close span {
    display: none;
  }/*開閉アイコン無効*/
  .item-group-search .accordion a {
    pointer-events: none;
  }/*開閉無効*/
}/*デスクトップ*/


/*------------------------- スマホ時タブ切り替え -------------------------*/
@media (max-width: 992px) {
  .item-group-search .search_area {
    padding: 0 3px!important;
  }
  .item-group-search .wrap {
    background: #f5f5f5;
    padding: 10px 10px 0;
  }/*タブパネルの背景*/
  .select_box ul.tab {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-flow: row nowrap;
    width: 98%;
    height: 5rem;
    margin: auto;
  }
  .select_box ul.tab li {
    position: absolute;
    width: 22%;
    bottom: 0;
  }
  .select_box ul.tab li.tab4 {
    width: 39%;
    right: 0;
  }/*絞り込み*/
  .select_box ul.tab li.tab3 {
    left: 40%;
  }/*並び順*/
  .select_box ul.tab li.tab2 {
    left: 19%;
  }/*関連商品*/
  .select_box ul.tab li.tab1 {
    left: 0;
    width: 21%;
  }/*他のシリーズ*/
  .select_box ul.tab li.active {
    z-index: 2;
  }/*タブimg クリック時*/
  .select_box ul.tab li img.on {
    display: none;
  }/*タブimg アクセス時*/
  .select_box ul.tab li.active img.off {
    display: none;
  }/*タブimg クリック時 off*/
  .select_box ul.tab li.active img.on {
    display: block;
  }/*タブimg クリック時 on*/
  .select_box ul.tab li a {
    list-style: none;
    font-size: 14px;
    display: block;
    width: 100%;
    text-align: center;
    color: #1a75bc;
  }/*タブ*/
  .select_box ul.tab li.tab1 a {
    color: #fff;
    font-size: 11px;
  }/*他のシリーズ*/
  .select_box ul.tab li a span {
    position: absolute;
    bottom: 8px;
    left: 0;
    right: 0;
    line-height: 1.2;
  }/*タブの中の文字*/
  .select_box ul.tab li a img {
    width: 100%;
  }/*タブのimg*/
  .select_box .content:before {
    content: '';
    display: block;
    border-bottom: 6px solid #1a75bc;
    position: relative;
    z-index: 10;
    margin-top: -5px;
  }/*タブ下のライン*/
  .select_box .content {
    z-index: 99;
  }/*タブ*/
  .item-group-search .area {
    display: none;
    height: auto!important;
  }/*タブ　閉*/
  .select_box ul li.active a {
    color: #fff;
  }/*タブ選択時*/
  .item-group-search .accordion .oc .status {
    transition: all 0.1s ease-in-out;
    opacity: 0;
  }/*選択後に項目の横に出るチェック*/
  .item-group-search .accordion .oc .status.checked:before, .item-group-search .accordion .oc .status.checked:after {
    position: absolute;
    left: 5em;
    font-size: 18px;
    line-height: 1.2;
  }
  .item-group-search .accordion .oc .status.checked {
    opacity: 1;
  }
  .item-group-search .accordion .oc .status.checked:before {
    content: "\f111";
    font-family: FontAwesome;
    color: #fff;
    font-size: 20px;
    margin: -3px 0 0 -10px;
  }/*まる*/
  .item-group-search .accordion .oc .status.checked:after {
    content: "\f00c";
    font-family: FontAwesome;
    color: #e92636;
  }/*チェックマーク*/
  .item-group-search .accordion a.col-open .collapse-icon:after,
  .item-group-search .accordion a.col-close .collapse-icon:after {
    color: #fff;
    position: absolute;
    right: 20px;
  }/*開閉ボタン*/
  .item-group-search .accordion a.col-close .collapse-icon:after {
    content: "\f067";
    font-family: FontAwesome;
  }/*開閉ボタン*/
  .item-group-search .accordion a.col-open .collapse-icon:after {
    content: "\f068";
    font-family: FontAwesome;
  }/*開閉ボタン*/
  .item-group-search .select_box #select_wrap li {
    width: 98%;
    margin: auto;
    border-bottom: 1px solid rgba(255,255,255,1);
    box-shadow: 0px -2px 0px rgba(0,0,0,0.3) inset;
  }/*チェックボックスのリスト*/
  .item-group-search .select_box #select_wrap li:last-child {
    border-bottom: none;
    box-shadow: none;
  }
  .item-group-search .accordion a.oc {
    border-bottom: 1px solid rgba(255,255,255,0.5);
    box-shadow: 0px -1px 0px rgba(0,0,0,0.3) inset;
  }
}/*モバイル*/
@media (min-width: 600px) and (max-width: 992px) {
  .select_box ul.tab {
    height: 10rem;
  }
  .select_box ul.tab li a span {
    bottom: 12px;
  }
  .select_box ul.tab li a {
		font-size: 19px;
	}
  .select_box ul.tab li.tab1 a {
		font-size: 17px;
	}/*他のシリーズ*/
  .select_box ul.tab li a:hover , .select_box ul.tab li a img:hover {
    opacity: 1!important;
  }
}/*中間*/
@media (max-width: 360px) {
	.select_box ul.tab li a {
		font-size: 12px;
	}
  .select_box ul.tab li a span {
    bottom: 6px;
  }
  .select_box ul.tab li.tab1 a {
		font-size: 8px;
	}/*他のシリーズ*/
}/*最小*/


/*------------------------- 対象商品件数リボン -------------------------*/
.item-group-search .total_items {
  display: inline-block;
  position: relative;
  padding: 5px;
  width: 110%;
  color: #fff;
  background: #1a75bc;
  margin-left: -15px;
}/*対象商品リボン*/
.item-group-search .total_items:before {
  position: absolute;
  content: '';
  top: 100%;
  right: 0;
  border: none;
  border-bottom: solid 60px transparent;
  border-left: solid 60px #0e578b;
  z-index: -100;
}/*折り返し部分*/
.item-group-search .total_items .total_num {
  padding-left: 50px;
}
.item-group-search .total_items .total_num div {
  line-height: 1.2;
}
.item-group-search .total_items .total_num div:nth-child(1) {
  font-size: 14px;
}
.item-group-search .total_items .total_num div:nth-child(2) span {
  font-size: 30px;
  margin-right: 5px;
}


/*------------------------- 並び順 --------------------------*/
.item-group-search .tab_content {
  z-index: 1;
}
.item-group-search .tab_filter .sort {
  background: #1a75bc;
}
.item-group-search .tab_filter .sort ul {
  margin: 10px auto;
}
.item-group-search .tab_filter .sort li {
  text-align: center;
}
.item-group-search .tab_filter .sort li label {
  background: none;
  display: block;
  border: 1px solid #fff;
  color: #fff;
}
.item-group-search .tab_filter .sort li input[type=radio]:checked + label{
  background: #fff;
  color: #1a75bc;
  box-shadow: none;
}
@media (min-width: 992px) {
  .content-wrap .sort {
    position: relative;
    height: 30px;
    margin-bottom: 30px;
  }
  .content-wrap .sort, .content-wrap .sort .dropmenu ul li label.btn {
    font-size: 1.6rem;
  }
  .content-wrap .sort span {
    color: #fff;
    background: #1a75bc;
    padding: 5px 10px;
    position: absolute;
    top: 0;
    left: 0;
  }
  .content-wrap .sort span:after {
    content: "\f04b";
    font-family: FontAwesome;
    position: absolute;
    top: -2px;
    right: -8px;
    font-size: 24px;
    color: #1a75bc;
    z-index: -1;
  }
  .content-wrap .sort .filter {
    position: absolute;
    top: 0;
    left: 110px;
    margin: 0;
    padding: 0;
    text-align: center;
  }
  .content-wrap .sort .dropmenu ul li input[type=radio]  {
    display: none;
  }
  .content-wrap .sort .dropmenu ul {
    display: flex;
    justify-content: flex-start;
  }
  .content-wrap .sort .dropmenu:hover ul li {
    height: 34px;
  }
  .content-wrap .sort .dropmenu ul li label.btn {
    width: 100%;
    padding: 5px 10px;
    background: #fff;
    text-align: left;
    border-radius: 0;
    z-index: 1;
    position: relative;
    border: none;
    color: #bbb;
  }
  .content-wrap .sort .dropmenu ul li {
    border-right: 1px solid #ccc;
    padding: 0 10px;
  }
  .content-wrap .sort .dropmenu ul li:last-child {
    border: none;
  }
  .content-wrap .sort .dropmenu ul li label.btn:active {
    box-shadow: none;
  }
  .content-wrap .sort .dropmenu ul li:hover label.btn {
    background: #eee;
    color: #333;
  }
  .content-wrap .sort .dropmenu ul li input[type=radio]:checked + label {
    z-index: 9;
    position: relative;
    color: #333;
  }
}/*並び順PC*/

/*------------------------- 価格スライダー -------------------------*/
.item-group-search .price_box {
  z-index: 1;
  background: #eee;
  width: 98%;
  margin: auto;
}
.item-group-search .price_box .input .row {
  padding-left: 20px;
}
.item-group-search .price_box .price_area {
  padding: 0 5px;
}
.item-group-search .price_box .price_area span {
  font-size: 12px;
  color: #333;
}
.item-group-search .price_box .form-control {
  background: #fff;
  box-shadow: none;
  border: none;
  display: inline-block;
  width: 70%;
  height: 30px;
}
.item-group-search .noUi-connect {
  background: #333;
}
.item-group-search .noUi-handle {
  width: 18px;
  height: 18px;
  top: -6.6px;
  background: #888;
  border: 1px solid #666;
  box-shadow: none;
}
.item-group-search .price_box .input p {
  color: #fff;
}

@media (max-width: 992px) {
  .item-group-search .select_box .price_select .input p {
    color: #333;
  }
  .item-group-search .form-control {
    background: #ddd;
    box-shadow: none;
    border: none;
  }
}

/*------------------------- 絞り込みチェックボックス --------------------------*/
.item-group-search .tab_select .contents .select {
  color: #333;
}
.select_box input[type=checkbox], .select_box input[type=radio]  {
  display: none;
}
label.select_check {
  position: relative;
  padding: 0 0 0 42px;
  margin: 0;
  display: block;
  color: #555;
}/*チェックボックス*/
label.select_check:hover:after {
  border-color: #ccc;
}
label.select_check:after, label.select_check:before {
  position: absolute;
	content: "";
	display: block;
	top: 50%;
}/*チェックボックス*/
label.select_check:after {
  left: 15px;
  margin-top: -10px;
  width: 18px;
  height: 18px;
	border-radius: 100%;
  background: #fff;
  z-index: 1;
  border: 1px solid #eee;
}/*チェックボックス*/
label.select_check:before {
  content: "\f00c";
  font-family: FontAwesome;
  color: #e92636;
  opacity: 0;
  z-index: 2;
  left: 17px;
  margin-top: -12px;
}/*チェックマーク*/
.select_box input[type=checkbox]:checked + label.select_check:before, .select_box input[type=radio]:checked + label.select_check:before {
  opacity: 1;
}/*チェック時*/
.item-group-search .select_box .content ul li {
  padding: 5px;
  position: relative;
  transition: all 0.3s ease-in-out;
}/*チェックボックスのリスト*/
.remove-label {
  opacity: 0!important;
  height: 0!important;
  padding: 0!important;
  margin: 0!important;
}/*選択以外を隠す*/
.remove-label label.select_check {
  transform: translateX(-50px) scale(3);
  opacity: 0;
}/*選択以外を隠す*/

/*------------------------- キーワード検索 --------------------------*/
.item-group-search [name="item-group-notword"] {
  padding: 5px 8px;
  border: solid 1px #ccc;
  margin: 10px;
  width: calc(100% - 20px);
  border-radius: 3px;
}

.item-group-search .assistant-block {
  display: block;
  margin: 10px;
  margin-top: 0;
}
.item-group-search .assistant__title {
  font-size: 1rem;
  color: #aaa;
  margin-bottom: 5px;
}

.item-group-search .assistants {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.item-group-search .assistants [data-type="assistant"] {
  cursor: pointer;
  border-radius: 3px;
  padding: 4px 8px;
  border: solid 1px #ddd;
  font-size: 1.2rem;
  background-color: #fff;
}

/*------------------------- 表示とクリア・件数 -------------------------*/
.item-group-search .tab_select .result_preview {
  background: #1a75bc;
}
.item-group-search .tab_select .result_preview > div {
  padding: 10px 5px;
}
.item-group-search .tab_select .result_preview .btn {
  margin: 6px;
  display: block;
  height: 36px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #0693e3;
  box-shadow: 0px 3px 0px rgba(0,0,0,0.3),
  0px 3px 0px #0693e3;
  box-sizing: border-box;
  border-radius: 8px;
  color: #eee;
}/*ボタン*/
.item-group-search .tab_select .result_preview .btn.clear {
  margin-right: 0;
}/*クリア*/
.item-group-search .tab_select .result_preview .btn.preview {
}/*表示ボタン*/
.item-group-search .tab_select .result_preview .btn.preview.green {
  background: #0bbf0a;
  box-shadow: 0px 3px 0px rgba(0,0,0,0.2),
  0px 3px 0px #0bbf0a;
}/*表示ボタン green*/
.item-group-search .tab_select .result_preview .btn span {
  z-index: 1;
}
.item-group-search .tab_select .result_preview .btn.preview span {
  font-weight: bold;
}
.item-group-search .tab_select .result_preview .result .num {
  background: rgba(0,0,0,0.2);
  border-radius: 5px;
  padding: 2px 10px;
  margin-left: 5px;
  min-width: 52px;
  display: inline-block;
  text-align: right;
}/*表示件数 数字*/

@media (min-width: 992px) {
  .item-group-search .tab_select .result_preview {
    background: none;
  }
  .item-group-search .tab_select .result_preview > div {
    padding: 20px 5px;
    border-top: 1px solid #ccc;
  }
  .item-group-search .tab_select .result_preview .btn {
    margin: 0px;
    border: 1px solid rgba(0,0,0,0.2);
    box-shadow: 0px 4px 0px rgba(0,0,0,0.2);
    box-sizing: border-box;
  }
  .item-group-search .tab_select .result_preview .btn.clear {
    margin-right: 3px;
    color: #777;
    background: none;
  }/*PC クリア*/
  .item-group-search .tab_select .result_preview .btn.preview {
    margin-left: 3px;
  }/*PC 表示*/
  .item-group-search .tab_select .result_preview .btn.preview.green {
    border: 1px solid rgba(0,0,0,0.2);
    box-shadow: 0px 4px 0px rgba(0,0,0,0.2),
    0px 4px 0px #02aa09;
    color: #fff;
    background: #02aa09;
  }/*PC 表示*/
  .item-group-search .tab_select .result_preview .btn:hover:before {
    z-index: 0;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.1);
    box-shadow: 0px 4px 0px rgba(0,0,0,0.2);
    border-radius: 8px;
  }/*PC btn hover*/
  .item-group-search .tab_select .result_preview .btn.clear:hover:before {
    margin-right: 3px;
  }/*PC クリア hover*/
  .item-group-search .tab_select .result_preview .btn.preview:hover:before {
    margin-left: 3px;
  }/*PC 表示 hover*/
}


/*------------------------- ページ別 /items?q=(検索結果) -------------------------*/

/*------------------------- AJAX絞り込み 処理中 -------------------------*/

/* AJAX絞り込み 処理中 */
[id="item-group-search"].processing {
  position: relative;
}
[id="item-group-search"]:after {
  content: '';
  display: block;
  height: 0;
  transition: background-color 0.1s ease-in-out;
}
[id="item-group-search"].processing:after {
  height: auto;
  position: fixed;
  left: 0;top: 0;right: 0;bottom: 0;
  cursor: no-drop;
  z-index: 14;
  background-image: url("/common_img/loader/loading.svg");
  background-position: center center;
  background-repeat: no-repeat;
  background-color: rgba(0, 0, 0, 0.2);
}
