﻿@charset "UTF-8";

.product-search-list .sidebar-goods-search-modal-btn,
.product-search-list .search-facet-cloase{display: none;}

/* レイアウト */
.product-search-list .container_ .contents_{
        display: flex;
        gap: 38px;
		max-width: 1200px;
		margin: 62px auto 120px auto;
}

.product-search-list .mainframe_{width: 100%;}
.product-search-list .sidebar-goods-search-modal{width: 263px;}

.search-facet-header h2{
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	border-bottom: solid 2px #455D33;
  border-radius: 2px;
	padding-bottom: 12px;
  margin: 0;
  color: #455D33;
  letter-spacing: 0.1em;
}

/* 検索ボタン */
.product-search-list .search-facet-submit-btn{
  text-align: center;
  margin-top: 30px;
  width: 240px;
  margin: 30px auto 0 auto;
}

.product-search-list .search-facet-submit-btn .u-btn{
	cursor: pointer;
	width: 240px;
	height: 56px;
	font-size: 16px;
  font-weight: 400;
	border-radius: 3px;
	border: none;
	background: #444;
	color: #fff;
  letter-spacing: 0.1em;
}

.product-search-list .search-facet-submit-btn.submit-fixed{
  position: fixed;
  bottom: 0;
  width: 240px;
  background: rgba(255, 255, 255, .8);
  margin: 0 11px;
  border-radius: 3px 3px 0 0;    
}

.product-search-list .search-facet-submit-btn a{
	display: inline-block;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;  
	font-size: 15px;
  font-weight: 400;	
	text-decoration:underline;
}

.product-search-list .search-facet-submit-btn .u-btn:hover,
.product-search-list .search-facet-submit-btn a:hover{opacity: .7;}

/* MV */
.product-search-list h1.page-product-block-ttl{
  font-size: 28px;
  font-weight: 600;
  text-align: center;
  margin-top: 60px;
}

.product-search-list .page-product-mv{
  max-width: 1200px;
  margin: 40px auto 0 auto;  
}

.product-search-list .page-product-mv > div{display: none;}

/* Accordion */
.u-accordion {width: 100%;}
.u-accordion * {font-size: 14px;}
.u-accordion li {
  position: relative;
  border-bottom: 2px solid #B1BBB0;
}

.u-accordion li > ul > li{border-bottom: none;}

/* u-form-checkbox */
.u-form-name {
  cursor: pointer;
    position: relative;
    padding: 0 0 0 30px;
    font-size: 14px;
    display: block;
}

.u-form-label span::before,
.u-form-label span::after {
    content: "";
    display: block;
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
}

.u-form-checkbox label span::before,
.u-form-checkbox label span::after {
  width: 20px;
  height: 20px;
  left: 5px;
}

.u-form-checkbox label span::before {background: url(../../img/usr/product_search/form-checkbox-off.svg) no-repeat center center;}
.u-form-checkbox input[type="checkbox"]:checked + label span::after {background: url(../../img/usr/product_search/form-checkbox-on.svg) no-repeat center center;}

.u-accordion a {
  position: relative;
  display: block;
  width: 100%;
  padding: 17px 15px 17px 10px;
  background: #fff;
  cursor: pointer;
  box-sizing: border-box;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  color: #444;
  letter-spacing: 0.1em;
}

.u-accordion-child a,
.u-accordion-child .u-form-checkbox label,
.u-accordion-child .u-form-radio label {background: #f6f6f6;}
.u-accordion-gchild a,
.u-accordion-gchild .u-form-checkbox label,
.u-accordion-gchild .u-form-radio label {background: #fff;}
/* .u-accordion-gchild a,
.u-accordion-gchild .u-form-checkbox label,
.u-accordion-gchild .u-form-radio label {background: #e8e8e8;} */

.u-accordion-arrow:before {
  content: "";
  position: absolute;
  top: 16px;
  left: 10px;
  z-index: 9;
  display: block;
  width: 19px;
  height: 19px;
  pointer-events: none;
  background: url(../../img/usr/product_search/link_arrow_w.svg) no-repeat;  
}

.u-accordion-btn:before {content: none;}
.u-accordion-btn:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
  display: block;
  width: 13px;
  height: 13px;
  background: url(../../img/usr/product_search/icon-arrow-off_sp.svg) no-repeat center / contain;
  background-size: contain;
  background-position: center;
}

.u-accordion-btn.is-open:after {
  background: url(../../img/usr/product_search/icon-arrow-on_sp.svg) no-repeat;
  background-size: contain;
  background-position: center;
}

.u-accordion > li > .u-accordion-btn.is-open > span:before,
.u-accordion > li > .u-accordion-btn.is-open > span:after {background: #fff;}

.u-accordion-rarrow:before {
  content: "";
  position: absolute;
  transform: rotate(45deg);
  top: 42%;
  left: auto;
  right: 7.7%;
  display: block;
  width: 9px;
  height: 9px;
  border-top: 1px solid #777;
  border-right: 1px solid #777;
}

.u-accordion-double {
  display: flex;
  flex-wrap: wrap;
}

.u-accordion-double li {width: 50%;}
.u-accordion-double li:nth-of-type(odd) {border-right: 1px solid #ddd;}
.u-accordion-double a,
.u-accordion-double label {height: 100%;}
.u-accordion .u-form-checkbox label,
.u-accordion .u-form-radio label {
  position: relative;
  display: flex;
  width: 100%;
  padding: 5px 20px 15px 15px;
  margin: 0;
  box-sizing: border-box;
}

.u-accordion .u-accordion-space {
  display: block;
  padding: 15px 20px 15px 15px;
  background: #fff;
}

.u-accordion .u-accordion-child .u-accordion-space {background: #f6f6f6;}
.u-accordion .u-accordion-gchild .u-accordion-space {background: #eee;}
.u-accordion .u-accordion-ggchild .u-accordion-space {background: #e8e8e8;}
.u-accordion .u-form-checkbox li:before,
.u-accordion .u-form-radio li:before {content: none;}
.u-accordion .u-form-checkbox,
.u-accordion .u-form-radio {cursor: pointer;}
.u-accordion .u-form-checkbox > label:hover{
  opacity: 0.6;
  transition: 0.15s linear;
}

.u-accordion-input[type="checkbox"] {display: none;}

.u-accordion-ggchild a,
.u-accordion .u-accordion-arrow {padding: 15px 20px 15px 40px;}

.search-facet-color figure img{width: 20px;}
.search-facet-color figure{margin-right: 8px;}
.search-facet-color .u-form-label span::before,
.search-facet-color .u-form-label span::after{
  top: 40%;
  left: 20px;
}
.search-facet-color .u-form-name{padding: 0 0 0 40px;}

/* 商品一覧 */
.product-search-list .js-itembox--list,
.product-search-list .block-itemfilter{background: #fff;}
.product-search-list .js-create--list{
	justify-content: initial;
	gap: 20px;
}
.product-search-list .js-itemtab--box .item-elm > a,
.product-search-list .js-itemtab--box .item-elm .item-elm-inner{
	box-shadow: none;	
	padding: 0;
	display: block;
}

.product-search-list .js-itemtab--box .item-elm{width: calc((100% - (20px*3))/4);}
.product-search-list .js-itemtab--box .item-elm a .img-block{
	margin: 0;
	width: 100%;
	height: auto;
	min-height: auto;
	aspect-ratio: 1 / 1;
	background: #eee;
}

.product-search-list .js-itemtab--box .detail-text{height: auto;}
.product-search-list .js-itemtab--box .item-name{
	font-size: 15px;
	font-weight: 400;
}

.product-search-list .js-itemtab--box .item-price{font-size: 11px;}
.product-search-list .js-itemtab--box .item-price .js-add-item-price{
  font-size: 20px;
  font-weight: 400;
}
.product-search-list .js-itemtab--box .item-price .is-tax{font-size: 12px;}
.product-search-list .js-itemtab--box .item-price::before,
.product-search-list .js-itemtab--box .item-price:not(.remited-price)::after{font-size: 11px;}

.product-search-list .js-itemtab--box .item-price::before{color: #999;}
.product-search-list .is-comment{display: none;}
.product-search-list .js-itemtab--box .item-price .default-price{font-size: 11px;}

/* ページャー */
.navipage_.bottom_{margin-top: 50px; }
.navipage_ center{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.navipage_ .navipage_forward_,
.navipage_ .navipage_reverse_{display: flex;}
.navipage_ .navipage_now_{
	display: flex;
	align-items: center;
	justify-content: center;
	background: #444;
	border: solid 1px #444;
	border-radius: 50%;
	color: #fff;
	font-size: 15px;
	font-weight: 400;
	width: 40px;
	height: 40px;
	margin: 0;
  line-height: 40px;
}

.navipage_ a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: solid 1px #ccc;
	border-radius: 50%;
	margin: 0;
  font-size: 15px;
  line-height: 40px;
}

.navipage_ .navipage_first_ a,
.navipage_ .navipage_prev_ a,
.navipage_ .navipage_next_ a,
.navipage_ .navipage_last_ a{
	position: relative;
	text-indent: -9999px;
	width: 40px;
	height: 40px;
  background: none;
}

.navipage_ .navipage_prev_{margin-right: 20px;}
.navipage_ .navipage_next_{margin-right: 5px;}
.navipage_ .navipage_forward_{margin-left: 20px;}
.navipage_ .navipage_reverse_{margin-right: 20px;}

.navipage_ .navipage_prev_ a,
.navipage_ .navipage_next_ a{
	border: solid 1px #ccc;
	border-radius: 50%;
	position: relative;
	text-indent: -9999px;
}

.navipage_ .navipage_prev_ a:after,
.navipage_ .navipage_next_ a:after{
	position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    border-right: solid 2px #222;
    border-bottom: solid 2px #222;
}

.navipage_ .navipage_prev_ a:after{
    transform: translate(-50%, -50%) rotate(135deg);
    margin: 11px 0 0 16px;
}

.navipage_ .navipage_next_ a:after{
    transform: translate(-50%, -50%) rotate(-45deg);
    margin: 10px 0 0 6px;
}

.navipage_ .navipage_first_,
.navipage_ .navipage_prev_,
.navipage_ .navipage_next_,
.navipage_ .navipage_last_{
	display: flex;
	align-items: center;
}

.navipage_ .navipage_first_,
.navipage_ .navipage_last_{display: none;}

.navipage_ a:hover{
  text-decoration: none;
  background-color: #fff;
  border: solid 1px #CBCBCB;
}

/* プレビュー画面の調整 */
.page-product-block-list .smzpreview-article_data_status{
  height: auto;
  position: absolute;
}
