@charset "UTF-8";
/* bootstrap reset*/
/* line 8, ../../app/assets/stylesheets/item_list_vue.scss */
.nav > li > a:hover, .nav > li > a:focus {
  text-decoration: unset;
  background-color: unset;
}

/* line 15, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue {
  overflow-x: hidden;
  /* 以下全部 pc styleなので、あとで mediaに囲む */
}
/* line 19, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block-container {
  min-height: 600px;
}
/* line 22, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block-container .coming-soon-list {
  height: 600px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
/* line 29, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block-container .coming-soon-list h5 {
  font-size: 1.6rem;
}
/* line 34, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block-container .coming-soon-list .button-block .res-btn {
  line-height: 2.2rem;
  margin-top: 5px;
}
/* line 42, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .slide {
  position: relative;
  background-color: lightgray;
  overflow: hidden;
}
/* line 47, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .slide img {
  width: 100%;
}
/* line 51, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .slide a {
  display: inline-block;
}
/* line 56, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  /* not tested */
  /* not tested */
}
/* line 61, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item {
  cursor: pointer;
}
/* line 64, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item a {
  text-decoration: none;
  color: black;
}
/* line 69, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image {
  position: relative;
  background-color: white;
  overflow: hidden;
  border: 1px solid white;
}
/* line 75, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image:hover {
  border: 1px solid lightgray;
}
/* line 79, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image:before {
  content: "";
  display: block;
  padding-top: 133.33% !important;
  /* 4:3 - 75%, 3:4 - 133.33%,  16:9  - 56.25% , 3:2 - 66.66%, 8:5 - 62.5% */
}
/* line 86, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image .main-image:hover {
  opacity: 0;
}
/* line 91, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image img {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1.01);
  z-index: 2;
}
/* line 100, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image .like {
  background-color: #f7f7f7;
  position: absolute;
  top: 2%;
  right: 2%;
  z-index: 3;
  width: 24px;
  height: 24px;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}
/* line 113, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image .like:before {
  content: '☆';
}
/* line 117, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .image .like.saved:before {
  content: '★';
}
/* line 123, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .brand {
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* line 132, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .name {
  font-size: 1.2rem;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* line 140, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .price {
  font-size: 1.5rem;
  line-height: 1.2;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
/* line 148, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .price.discount .proper-price {
  text-decoration: line-through;
  color: grey;
  font-size: 1.2rem;
  font-style: normal;
  padding-right: 2px;
  line-height: 22px;
}
/* line 157, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .price.discount .sale-price {
  color: #DC0000;
  padding-right: 2px;
  line-height: 22px;
}
/* line 163, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block .item .price.discount .off-rate {
  font-size: 1.2rem;
  color: #DC0000;
  line-height: 22px;
}
/* line 172, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.two-column {
  margin-right: -7.5px;
  margin-left: -7.5px;
}
/* line 176, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.two-column .item {
  width: calc(50% - 15px);
  margin: 7.5px;
}
/* line 183, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.three-column {
  margin-right: -10px;
  margin-left: -10px;
}
/* line 187, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.three-column .item {
  width: calc(33.333% - 20px);
  margin: 10px;
}
/* line 193, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.four-column {
  margin-right: -10px;
  margin-left: -10px;
}
/* line 197, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.four-column .item {
  width: calc(25% - 20px);
  margin: 10px;
}
/* line 204, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.five-column {
  margin-right: -10px;
  margin-left: -10px;
}
/* line 208, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .item-block.five-column .item {
  width: calc(20% - 20px);
  margin: 10px;
}
/* line 217, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container {
  min-height: 30vh;
}
/* line 220, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container.not-found {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* line 226, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .brand-desc {
  padding: 10px 20px;
  font-size: 1.1rem;
  line-height: 1.6rem;
}
/* line 232, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .item-list {
  padding-left: 0;
}
/* line 235, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .item-list .list-title {
  display: none;
}
/* line 240, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info {
  /* for banner style */
}
/* line 243, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner {
  position: relative;
  overflow-y: hidden;
}
/* line 247, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner img {
  width: 100%;
}
/* line 251, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner .brandtext {
  position: absolute;
  left: 395px;
  top: 105px;
  width: 565px;
  text-align: center;
  color: white;
  line-height: 24px;
}
/* line 261, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner .brandtextss {
  position: absolute;
  left: 395px;
  top: 105px;
  width: 565px;
  text-align: center;
  color: black;
  line-height: 24px;
}
/* line 271, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner .brandtext2 {
  width: 56%;
  height: 100%;
  position: absolute;
  top: 0;
  margin-left: 43.2%;
  padding-right: 5px;
}
/* line 280, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner .brandtext2 p {
  font-family: 'Helvetica Neue', 'Helvetica', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic Pro', 'Arial', sans-serif;
  width: 100%;
  font-size: 1.2rem;
  text-align: left;
  line-height: 2.0rem;
  color: #fff;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* line 294, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner .brandtext2 h3 {
  font-size: 30px;
  line-height: 30px;
  display: none;
}
/* line 300, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .category-info .brandbanner .brandtext2 span {
  border-bottom: 1px solid white;
  position: relative;
  top: 1px;
}
/* line 308, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .sorter {
  position: relative;
}
@media (max-width: 767px) {
  /* line 312, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter .sorter-btn {
    position: relative;
    z-index: 20;
    border-left: solid #bfbfbf;
    border-left-width: 0.5px;
    max-width: 94px;
  }
}
/* line 321, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .sorter .sorter-option {
  background-color: #fff;
  border: 0.5px solid #000;
  position: absolute;
  bottom: -100px;
  right: 3%;
  padding: 8px 10px;
  text-align: center;
  z-index: 50;
}
/* line 331, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .sorter .sorter-option > li {
  line-height: 2.4rem;
}
/* line 338, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .pagination {
  width: 100%;
  text-align: center;
  font-size: 1.8rem;
  display: flex;
  align-items: stretch;
  justify-content: center;
  padding: 0 10px;
}
/* line 347, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .pagination .page {
  min-width: 26px;
  margin: 2px;
}
/* line 351, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .pagination .page:hover {
  background-color: lightgray;
}
/* line 355, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .pagination .page a {
  text-decoration: none;
  color: black;
}
/* line 360, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .pagination .page.current {
  text-decoration: underline;
}
/* line 366, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .pagination .next a {
  text-decoration: none;
  color: black;
}
/* line 373, ../../app/assets/stylesheets/item_list_vue.scss */
#list-vue .list-container .pagination .prev a {
  text-decoration: none;
  color: black;
}
@media (min-width: 768px) {
  /* line 15, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue {
    overflow-x: unset;
  }
  /* line 387, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .item-block-container .coming-soon-list h5 {
    font-size: 1.8rem;
  }
  /* line 391, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .item-block-container .coming-soon-list .button-block {
    display: flex;
    justify-content: center;
  }
  /* line 395, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .item-block-container .coming-soon-list .button-block .res-btn {
    line-height: 2.8rem;
    margin: 0 10px;
    width: 200px;
    padding: 8px 12px !important;
  }
  /* line 405, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container {
    display: flex;
    align-items: flex-start;
    justify-content: center;
  }
  /* line 410, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter {
    margin-top: 30px;
    position: relative;
    display: flex;
    justify-content: flex-end;
  }
  /* line 416, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter .sorter-btn {
    z-index: 20;
    position: unset;
    border: none;
    font-size: 1.2rem;
  }
  /* line 422, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter .sorter-btn a {
    color: black;
    display: inline-block;
  }
  /* line 427, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter .sorter-btn ul {
    width: 76px;
    position: absolute;
    background-color: #fff;
    z-index: 100;
    margin: 0 -8px 0 -3px;
    padding: 10px 8px 3px 3px;
    right: 0;
    text-align: right;
  }
  /* line 437, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter .sorter-btn ul li {
    cursor: pointer;
  }
  /* line 441, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter .sorter-btn ul:hover {
    display: block;
  }
  /* line 445, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .sorter .sorter-btn ul a {
    padding: 0;
  }
  /* line 456, ../../app/assets/stylesheets/item_list_vue.scss */
  #list-vue .list-container .item-list {
    width: calc(100% - 230px);
    margin-top: 38px;
    min-height: 689px;
  }
}