@charset "utf-8";

/* TOPスライダー微調整
--------------------------------------*/
.brand_slider .slick-arrow{
  z-index: 3;
}

.brand_slider .slick-prev {
  left: -7.5px;
}

.brand_slider .slick-next {
  right: 7.5px;
}

.slick-prev:before, .slick-next:before {
    font-size: 35px !important;
    color: #ffffffc2
}

/* カート数量
--------------------------------------*/
.Re.HeaderNavigationMenu_cart,
.sp-cart {
  position: relative;
}

span.fs-client-cart-count.fs-client-cart-count--0 {
  display: none;
}

span.fs-client-cart-count {
  position: absolute;
  color: #fff;
  line-height: 0.9;
  width: 13.5px;
  height: 13.5px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #d10000;
  border-radius: 50%;
  right: -15%;
  top: -5%;
}

@media screen and (max-width: 768px) {
  span.fs-client-cart-count {
    font-size: 10px;
  }
}

/* オリジナルの追加要素
--------------------------------------*/
/*LINEバナー*/
.banner {
  position: fixed;
  margin: 0;
  z-index: 98;
  bottom: 0;
  right: 0;
}

.banner a {
  text-decoration: none;
}

.banner-icon {
  color: #f8f8f8;
  font-size: 40px;
}

.banner-back {
  width: 200px;
  background-color: #fff;
}

.banner-copy {
  font-size: 18px;
  position: relative;
}

.banner-copy::after {
  font-family: 'Font Awesome 6 Free';
  font-size: 20px;
  content: '\f054';
  color: #006EB0;
  position: absolute;
  margin-top: 11px;
  top: 0;
  right: 18px;
}

.banner-bottom {
  padding: 0;
  line-height: 1.6;
  border: 1px solid #000;
}

.banner-body {
  width: 200px;
  -webkit-box-shadow: 0 0 7px rgb(0 0 0 / 40%);
  box-shadow: 0 0 7px rgb(0 0 0 / 40%);
}

.banner-body:hover {
  transition: opacity 0.3s ease;
  opacity: 0.7;
}

.banner-close {
  font-weight: bold;
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 99999;
  padding: 0px 7px;
  border: none;
  color: #fff;
  background-color: #000;
  border-radius: 12px;
  cursor: pointer;
  -webkit-box-shadow: 0 0 7px rgb(0 0 0 / 40%);
  box-shadow: 0 0 7px rgb(0 0 0 / 40%);
  padding-bottom: 2px;
}

@media screen and (max-width: 768px) {
  .banner {
    position: fixed;
    margin: 0;
    z-index: 98;
    bottom: 0;
    right: 0;
    width: 100%;
  }

  .banner a {
    text-decoration: none;
  }

  .banner-icon {
    color: #f8f8f8;
    font-size: 40px;
  }

  .banner-back {
    background-color: #fff;
    width: 100%;
    margin: 0px;
    border-radius: 0px;
  }

  .banner-copy {
    font-size: 18px;
    position: relative;
  }

  .banner-copy::after {
    font-family: 'Font Awesome 6 Free';
    font-size: 20px;
    content: '\f054';
    color: #006EB0;
    position: absolute;
    margin-top: 11px;
    margin-left: 12px;
    top: initial;
    right: initial;
  }

  .banner-bottom {
    padding: 0;
    border: 1px solid #000;
  }

  .banner-body {
    width: 100%;
    -webkit-box-shadow: 0 0 7px rgb(0 0 0 / 40%);
    box-shadow: 0 0 7px rgb(0 0 0 / 40%);
  }

  .banner-body:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }

  .banner-close {
    font-weight: bold;
    position: absolute;
    top: 7px;
    right: 7px;
    z-index: 99999;
    padding: 0px 7px;
    border: none;
    color: #fff;
    background-color: #000;
    border-radius: 12px;
    cursor: pointer;
    -webkit-box-shadow: 0 0 7px rgb(0 0 0 / 40%);
    box-shadow: 0 0 7px rgb(0 0 0 / 40%);
    padding-bottom: 2px;
  }

}

/*共通
--------------------------------------*/
.fs-body-top .fs-c-productMark__mark {
  border-radius: 3.5px !important;
}

/*TOPページ
--------------------------------------*/
.section_btn {
    max-width: 500px;
  border-radius: 100px !important;
  padding: 2rem 0px !important;
}

@media screen and (max-width: 768px) {
  .section_btn {
      width: 87.5%;
      padding: 1.75rem 0px !important;
  }
}

/*新着アイテム
--------------------------------------*/
section#new-arrival {
    max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
}

.slide_new_arrival.fs-c-productListCarousel.fs-c-slick {
    padding: 0 3.75%;
}

.new-arrival .fs-c-productListCarousel__list__item {
    min-width: clamp(166px, -16.692px + 48.718vw, 185px) !important;
    margin: 0 4px;
}

@media screen and (min-width: 600px) {
    .new-arrival .fs-c-productListCarousel__list__item {
        min-width: calc(((100vw - 7.5% - 96px) / 6.875)) !important;
        margin: 0 8px;
    }
}

.new-arrival .fs-c-productListCarousel__ctrl {
  display: flex;
  align-items: center;
  justify-content: center;
}

.new-arrival .fs-c-button--carousel {
  width: 35px !important;
  height: 35px !important;
}

.new-arrival .fs-c-button--carousel::before {
  content: " " !important;
  width: 33px !important;
  height: 33px !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}

.new-arrival .fs-c-button--carousel--prev::before {
  background-image: url(https://ucollection.itembox.design/item/icon_arrow_left.png) !important;
}

.new-arrival .fs-c-button--carousel--next::before {
  background-image: url(https://ucollection.itembox.design/item/icon_arrow_right.png) !important;
}

@media screen and (max-width: 768px) {
  .new-arrival .fs-c-button--carousel {
    width: 20px !important;
    height: 20px !important;
  }

  .new-arrival .fs-c-button--carousel::before {
    width: 18px !important;
    height: 18px !important;
  }

  .new-arrival .fs-c-productListCarousel.fs-c-slick span.fs-c-productListCarousel__ctrl.fs-c-productListCarousel__ctrl--prev.slick-arrow {
    left: 0%;
    z-index: 1;
  }

  .new-arrival .fs-c-productListCarousel.fs-c-slick span.fs-c-productListCarousel__ctrl.fs-c-productListCarousel__ctrl--next.slick-arrow {
    right: 0% !important;
  }

}

/*TOPブランド一覧
--------------------------------------*/
.brand-list {
    justify-content: space-between !important;
    gap: initial !important;
}

.brand-list .fs-pt-column__item {
    width: calc(92.5% / 4) !important;
}

.fs-pt-column__heading {
    margin: 1.75rem 0 4.25rem !important;
}

.brand-list .fs-pt-column__image::after {
  content: initial !important;
}

.fs-pt-column__image>img {
  width: 100%;
}

@media screen and (max-width: 768px) {

    .brand-list {
        padding: 0 3.75% !important;
    }

    .brand-list .fs-pt-column__item {
        width: calc(96.25% / 2) !important
    }


    .fs-pt-column__heading {
        font-size: 14px !important;
        margin: 1.25rem 0 2rem !important;
    }

}

/*おすすめ商品
--------------------------------------*/
.fs-c-productListCarousel {
    justify-content: center;
    align-items: center;
    padding: 0 3.75%;
}

@media screen and (min-width: 600px) {
    .fs-c-productListCarousel__list__item  {
        min-width: calc(((100vw - 7.5% - 96px) / 6.875)) !important;
        margin: 0 8px;
    }
}

.recommend-items .fs-c-productListCarousel__ctrl {
  display: flex;
  align-items: center;
  justify-content: center;
}

.recommend-items .fs-c-button--carousel {
  width: 35px !important;
  height: 35px !important;
}

.recommend-items .fs-c-button--carousel::before {
  content: " " !important;
  width: 33px !important;
  height: 33px !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}

.recommend-items .fs-c-button--carousel--prev::before {
  background-image: url(https://ucollection.itembox.design/item/icon_arrow_left.png) !important;
}

.recommend-items .fs-c-button--carousel--next::before {
  background-image: url(https://ucollection.itembox.design/item/icon_arrow_right.png) !important;
}

@media screen and (max-width: 768px) {
  .recommend-items .fs-c-button--carousel {
    width: 20px !important;
    height: 20px !important;
  }

  .recommend-items .fs-c-button--carousel::before {
    width: 18px !important;
    height: 18px !important;
  }

  .recommend-items .fs-c-productListCarousel.fs-c-slick span.fs-c-productListCarousel__ctrl.fs-c-productListCarousel__ctrl--prev.slick-arrow {
    left: 0%;
    z-index: 1;
  }

  .recommend-items .fs-c-productListCarousel.fs-c-slick span.fs-c-productListCarousel__ctrl.fs-c-productListCarousel__ctrl--next.slick-arrow {
    right: 0% !important;
  }

}


/*おすすめ特集
--------------------------------------*/
.featured-list {
  justify-content: space-between !important;
  gap: initial !important;
}

.featured-items .fs-pt-column__image>img {
  width: 100%;
}

.featured-items .fs-pt-column__heading {
  margin: 2.5rem 0 1.25rem !important;
}

.featured-list .fs-pt-column__image::after {
  content: "特集を見る" !important;
  width: 100px !important;
  padding: 0.5% 0;
  background-color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
}

@media screen and (min-width: 1200px) {
  .featured-list {
    padding: 0 8.5% !important;
  }
}

@media screen and (max-width: 768px) {
  .featured-list {
    padding: 0 3.75% !important;
  }

  .fs-pt-column__description {
    margin-bottom: 5rem !important;
  }
}

@media screen and (max-width: 768px) {

  .featured-list {
    padding: 0 3.75% !important;
  }

}

/*スタッフのおすすめ
--------------------------------------*/
.voice-list {
  padding: 0 3.5% !important;
}

.voice-list .fs-pt-column__heading {
  margin: 2.5rem 0 1rem !important;
}

.voice-list .fs-pt-column__description {
  margin-bottom: 1.75rem;
}

@media screen and (min-width: 1200px) {
  .voice-list {
    padding: 0 8.5% !important;
  }
}

@media screen and (max-width: 768px) {
  .voice-list .fs-pt-column__description {
    margin-bottom: 1.75rem !important;
  }
}

@media screen and (max-width: 640px) {
  .voice-list {
    justify-content: center !important;
  }


  .voice-list .staff_voice_item {
      width: 85% !important;
      margin-bottom: 4.5rem !important;
    }
}


/*動画一覧
--------------------------------------*/
#movie_Wrap {
  padding: 0 5% !important;
}

@media screen and (min-width: 1200px) {
  #movie_Wrap {
    padding: 0 10% !important;
  }
}


@media screen and (max-width: 768px) {
  #movie_Wrap {
    padding: 0 3.5% !important;
  }
}

/*商品詳細 画像拡大アイコン
--------------------------------------*/
img.expand-icon {
  position: absolute;
  width: 5%;
  right: 72.5%;
  bottom: 2.5%;
  pointer-events: none;
}

.fs-c-productMainImage__image,
.fs-c-productThumbnail__image {
  cursor: pointer;
}

.fs-c-productImageModal,
.fs-c-productImageModal * {
  touch-action: auto !important;
}


@media screen and (max-width: 768px) {
  img.expand-icon {
    position: absolute;
    width: 7.5%;
    right: 5%;
    bottom: initial;
    top: 2.5%;
  }
}

/*購入導線ボタンカラー
--------------------------------------*/
a.fs-c-button--purchaseHere.fs-c-button--primary {
border: 1px solid #d10000 !important;
background-color: #d10000 !important;
}

a.fs-c-button--unregisteredUserPurchase.fs-c-button--secondary {
border: 1px solid #d10000 !important;
background-color: #d10000 !important;
}

button.fs-c-button--confirmOrder.fs-c-button--primary {
border: 1px solid #d10000 !important;
background-color: #d10000 !important;
}