@charset "utf-8";

/* ==================================

  『キーワードで検索』SP Style

================================== */

/* ----------------------------------

  Section

---------------------------------- */

/* Product LineUp
---------------------------------- */
.keyword-search .product-list { padding: 0 0 calc(170 / 750 * 100%); }
.keyword-search .product-lineup { display: block; }

.keyword-search .product-item { margin: 0 0 calc(90 / 750 * 100%); }
.keyword-search .product-lineup.pl2 { margin: calc(20 / 750 * 100%) 0 0; }
.keyword-search .product-lineup.pl2.is-active { margin: calc(20 / 750 * 100%) 0 calc(100 / 750 * 100vw) }

.gra { height: calc(500 / 750 * 100vw); }

/* もっと見る */
.more-see span { font-size: calc(24 / 750 * 100vw); }

/* 件数表示 */
.product-item-pager {
  bottom: calc(80 / 750 * 100vw);
  font-size: calc(22 / 750 * 100vw);
}

/* Search By Feature
---------------------------------- */
.keyword-search .search { padding: 0 0 calc(180 / 750 * 100%); }
.keyword-search .search:first-of-type {
  padding: 0 0 calc(100 / 750 * 100%);
  margin: 0;
}
.keyword-search .search:last-of-type {
  padding: 0 0 calc(145 / 750 * 100%);
  margin: 0;
}
.keyword-search .search .inner { padding: 0; }
.keyword-search .search-wrap { width: 100%; }
.keyword-search .search p {
  line-height: calc(60 / 24);
  margin: 0;
}
.keyword-search .search p .tag { font-size: calc(24 / 750 * 100vw); }

/* ----------------------------------

  Pagination By Keyword

---------------------------------- */
.pagination {
  font-size: calc(24 / 750 * 100vw);
  margin: calc(135 / 750 * 100%) 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pagination a { margin: 0; }
.pagination .curt-num { margin: 0; }
/* Product LineUp
 * ---------------------------------- */
.product-lineup {
  display: block;
}
.product-item {
  width: 100%;
  margin: 0 0 calc(90 / 750 * 100%);
}
.product-item.new::before {
  top: calc(111 / 750 * 100vw / 2 * -1);
  left: calc(111 / 750 * 100vw / 4 * -1);
  width: calc(111 / 750 * 100vw);
  height: calc(111 / 750 * 100vw);
}
.product-item dl dt {
  font-size: calc(24 / 750 * 100vw * 1.111111);
  line-height: calc(44 / 24);
  margin: calc(15 / 750 * 100%) 0 calc(30 / 750 * 100%);
}
.product-item dl dt small { font-size: calc(24 / 30 * 1em * 1.111111); }
.product-item dl dd p { line-height: calc(40 / 24); }
.product-item dl dd:last-of-type { margin: 10px 0 0; }
.tag {
  font-size: calc(20 / 750 * 100vw);
  letter-spacing: 0.025em;
}

.product-item-num {
  font-size: calc(24 / 750 * 100vw);
  margin: 0 0 calc(50 / 750 * 100%);
}

/* Search By Feature
 * ---------------------------------- */
.search { padding: 0 0 calc(120 / 750 * 100%); }
.search .inner { padding: 0; }
.search hr { margin: 0 0 calc(75 / 750 * 100%); }
.search h2 {
  font-size: calc(40 / 750 * 100vw);
  margin: 0 0 calc(60 / 750 * 100%);
}
.search p {
  line-height: calc(60 / 24);
  margin: 0 0 calc(50 / 750 * 100%);
}
.search p .tag { font-size: calc(24 / 750 * 100vw); }
.search-wrap { width: 100%; }

/* Fixed Search Button
 * --------------------------------- */
.fixed-search-btn {
  z-index: 8889;
  transform: translate(50%, 0);
  top: initial;
  right: 50%;
  bottom: calc(120 / 750 * 100vw);
  width: calc(400 / 750 * 100%);
  line-height: initial;
  font-size: calc(24 / 750 * 100vw);
  color: #3a3937;
  background-color: #ffffff;
  border: solid 1px #d7d7d7;
  padding: 1em 5em;
}
.fixed-search-btn::before {
  left: 40px;
  background-image: url(../images/detail/glass_sp.svg);
}

.modal-content {
  bottom: 50%;
  transform: translate(-50%, 50%);
  width: calc(680 / 750 * 100%);
  height: auto;
  max-width: initial;
  padding: calc(75 / 750 * 100%) calc(40 / 750 * 100%) calc(60 / 750 * 100%);
}
.modal-content h2 {
  font-size: calc(40 / 750 * 100vw);
  margin: 0 auto calc(60 / 750 * 100%);
}
.modal-content p { margin: 0 0 calc(35 / 750 * 100%); }
.modal-content p .tag { font-size: calc(24 / 750 * 100vw); }
a.js-modal-close {
  top: calc(30px * .75);
  transform: scale(.75);
}