﻿@charset "UTF-8";

/* 今までのファイル継承したうえで */
/* レスポンシブ　768px以上（/css/sys/内まとめてこのファイルに） */

/*--- base_misc.css */
@media screen and (min-width: 768px) {
  .pagination-num {
    gap: 0 2.5rem;
  }
    .pagination li a,
  .pagination li span {
    width: 4.4rem;
    height: 4.0rem;
    font-size: 1.6rem;
    font-weight: 500;
    font-family: var(--font-jost);
  }
  .pagination li a:hover {
    opacity: 0.8;
  }
  .pager-first a,
  .pager-first a,
  .pager-previous a,
  .pager-last a,
  .pager-last a,
  .pager-next a {
    width: 3.2rem!important;
  }
  .pager-first a:before,
  .pager-first a:after,
  .pager-previous a:before,
  .pager-last a:before,
  .pager-last a:after,
  .pager-next a:before {
    width: 0.5rem;
    height: 0.5rem;
  }

  .block-goods-list--pager-top {
    margin-top: 1.0rem;
  }
  .pager-total .pager-count {
    font-size: 1.5rem;
  }
  .pager-total .pager-count > span {
    font-size: 2.5rem;
  }
    
}
/*--- block_commons.css */
@media screen and (min-width: 768px) {
  .pane-topic-path > .container {
    width: auto;
    max-width: calc(1280px + 40px);
    padding: 0 20px;
  }
  .block-topic-path--list::before, .block-topic-path--list::after {
    display: none;
  }
  .block-topic-path {
    margin: 1.0rem 0 4.0rem;
  }
  .block-top-topic--contents {
    display: grid;
    grid-template-columns: 32% 60%;
    grid-template-rows: auto 1fr;
    gap: 0 8%;
  }
  .block-top-topic--contents .top-common-tit01 {
    grid-row: 1;
    grid-column: 1;
    margin-bottom: 5.0rem;
  }
  .block-top-topic--contents .block-top-topic--next-page {
    grid-row: 2;
    grid-column: 1;
    margin: 0;
  }
  .block-top-topic--next-page a {
    font-size: 1.8rem;
    font-weight: 500;
    padding: 1.8rem;
    transition: all 0.3s;
  }
  .block-top-topic--next-page a:hover {
    text-decoration: none;
    background: #ffffff;
    color: #000000;
  }
  .block-top-topic--contents .block-topic--items-frame,
  .block-top-topic--contents .block-topic--items {
    grid-row: 1 / span 2;
    grid-column: 2;
  }
.block-topic--items li {
  border-bottom: 1px solid #d9d9d9;
  padding: 4.8rem 0;
}
.block-topic--items dl {
}
.block-topic--items dt {
  font-size: 1.5rem;
}
.block-topic--items dd {
  margin: 0.7rem 0 0;
  font-size: 1.6rem;
  display: block;
	overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}  
.block-topic--items a:hover {
  text-decoration: none;
}
.block-topic--items a:hover dd {
  text-decoration: underline;
}
}


/*--- block_goods.css */
@media screen and (min-width: 768px) {
  .block-icon > span:has(img) {
    height: 2.5rem;
  }
  .block-icon img {
    max-height: 2.5rem;
  }
  .block-goods-comment {
    font-size: 1.6rem;
  }
  .default-price {
    font-size: 1.4rem;
  }

  .block-add-cart .block-add-cart--btn,
  .block-contact-about-goods--btn,
  .block-goods-favorite--btn,
  .block-goods-favorite-registed--btn {
    font-size: 1.8rem;
    padding: 1.8rem;
  }
  .block-goods-set {
    margin: 3.0rem 0;
  }
  .block-goods-set .block-goods-set--header {
    font-size: 1.8rem;
  }
  .table.block-goods-set--item-list th {
    font-size: 1.6rem;
    padding: 0.5rem 1.5rem;
  }
  .table.block-goods-set--item-list th {
    font-size: 1.6rem;
    padding: 1.0rem 2.4rem;
  }
  .table.block-goods-set--item-list .block-goods-set--item-name > a figure {
    width: 7rem;
    min-width: 7rem;
    margin-right: 4rem;
  }
  .table.block-goods-set--item-list .block-goods-set--item-qty {
    font-size: 2.0rem;
  }


  .block-goods-ship-schedule--text1 {
    font-size: 1.6rem;
  }
  .block-goods-ship-schedule--text2 {
    font-size: 1.4rem;
  }
  .block-goods-not-available-method,
  .block-goods-ship-schedule + .block-goods-not-available-method {
    margin-top: 2.0rem;
  }
  .goodsdetail-accordion-section > dt::before,
  .goodsdetail-accordion-section > dt::after {
    left: 0;
    right: 0;
  }
  .goodsdetail-accordion-section > dt span {
    cursor: pointer;
    padding: 2.3rem 4.0rem 2.3rem 2.0rem;
    font-size: 1.8rem;
  }
  .goodsdetail-accordion-section > dt span::before,
  .goodsdetail-accordion-section > dt span::after {
    right: 2.0rem;
  }
  .goodsdetail-accordion-section > dd {
    padding: 3.0rem 2.0rem;
  }
  .block-accessory-list {
    margin-top: 5.0rem;
    margin-bottom: 3.0rem;
    padding-top: 5.0rem;
  }
  .block-accessory-list::before {
    left: calc((100% - var(--fullWindowSize)) / 2);
    right: calc((100% - var(--fullWindowSize)) / 2);
  }
  /* goods detail 関連イベント */
  #goodsdetail_eventlist {
    position: relative;
    margin-bottom: 3.0rem;
  }
  #goodsdetail_eventlist #goodsdetail_eventlist_title {
    margin-top: 5.0rem;
    padding-top: 5.0rem;
  }
  #goodsdetail_eventlist #goodsdetail_eventlist_title::before {
    left: calc((100% - var(--fullWindowSize)) / 2);
    right: calc((100% - var(--fullWindowSize)) / 2);
  }
  #goodsdetail_eventlist-wrap {
    overflow: hidden;
  }
  #goodsdetail_eventlist .swiper-eventlist-content {
    margin: 0 -1.25%;
    width: 102.5%;
    overflow-y: visible;
    overflow-x: hidden;
    /*user-select: none;*/
  }
  #goodsdetail_eventlist .swiper-eventlist-content .swiper-wrapper::before, #goodsdetail_eventlist .swiper-eventlist-content .swiper-wrapper::after {
    display: none;
  }
  #goodsdetail_eventlist .swiper-eventlist-content .swiper-wrapper {
    gap: 0;
  }
  #goodsdetail_eventlist .swiper-eventlist-content .swiper-wrapper .swiper-slide {
    width: calc(100% / 3);
    padding: 0 calc(100% / 3 * 0.036);
  }
  .block-eventlist li p.date {
    font-size: 1.3rem;
  }
  .block-eventlist li p.ttl {
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 1024px) {
  #goodsdetail_eventlist .swiper-eventlist-content .swiper-wrapper .swiper-slide {
    width: calc(100% / 4);
  }
}
@media screen and (min-width: 768px) {
  #goodsdetail_eventlist .block-eventlist-item--title {
    font-size: 1.4rem;
    font-weight: normal;
  }
  #goodsdetail_eventlist #goodsdetail_eventlist_content-wrap:has(.swiper-initialized) ~ #swiper-eventlist-navigation {
    position: absolute;
    display: block;
    left: auto;
    right: 0.5rem;
    top: 5.2rem;
    width: 7.2rem;
    height: 1.0rem;
  }
  #goodsdetail_eventlist #swiper-eventlist-navigation.hidden {
    display: none;
  }
  #goodsdetail_eventlist .swiper-eventlist-content:not(.swiper-initialized) {
    margin: 0 -1.6rem;
    width: calc(100% + 3.2rem);
    overflow-y: visible;
    overflow-x: visible;
    /*user-select: none;*/
  }
  #goodsdetail_eventlist .swiper-eventlist-content:not(.swiper-initialized) .swiper-wrapper::before, #goodsdetail_eventlist .swiper-eventlist-content:not(.swiper-initialized) .swiper-wrapper::after {
    display: none;
  }
  #goodsdetail_eventlist .swiper-eventlist-content:not(.swiper-initialized) .swiper-wrapper .swiper-slide {
    width: 25%;
    padding: 0 1.6rem;


  }
  .goodsdetail--btns {
    max-width: 500px;
  }

  .js-sub-goodslist .block-top-event--goods {
    position: relative;
  }

  .js-sub-goodslist .swiper-buttons {
    position: absolute;
        left: auto;
        right: 0.5rem;
        bottom: calc(100% + 2.5rem);
        width: 7.2rem;
        height: 1.0rem;
  }
  .js-sub-goodslist .block-top-event--goods:not(:has(.swiper-initialized)) .swiper-buttons {
    display: none;
  }
  .js-sub-goodslist .swiper-buttons .swiper-button-next {
    margin: 0;
  }
  
  
  #goodsdetail_eventlist .swiper-eventlist-prev,
  #goodsdetail_eventlist .swiper-eventlist-next {
    margin: 0;
    top: 0;
  }
  #goodsdetail_eventlist .swiper-eventlist-prev { left: 0; }
  #goodsdetail_eventlist .swiper-eventlist-next { right: 0; }

  /* thumbnail-t */
  .block-thumbnail-t--items {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4.0rem;
  }
  
  .block-thumbnail-t--goods {
    width: calc((100% - 4.0rem * 3) / 4);
    margin: 0;
  }
  .block-thumbnail-t--goods-image a img {
    transition: opacity 0.3s;
  }
  .block-thumbnail-t--goods-image a:hover img {
    opacity: 0.7;
  }
.block-thumbnail-t--goods-name {
  font-size: 1.6rem;
}
.block-thumbnail-t--goods .block-thumbnail-t--price-infos {
  font-size: 1.3rem;
}
.block-thumbnail-t--goods .price {
  font-size: 2.0rem;
}
body.page-top .block-thumbnail-t--goods .price {
  font-size: 2.6rem;
}
.block-thumbnail-t--goods .default-price {
  font-size: 1.5rem;
}


  .js-sub-goodslist .block-thumbnail-t-wrap {
    overflow: hidden;
  }
  .js-sub-goodslist .block-thumbnail-t-wrap .block-thumbnail-t:not(.swiper-initialized) {
    margin: 0 -14px;
  }
  .js-sub-goodslist .block-thumbnail-t-wrap .block-thumbnail-t.block-thumbnail-t__noslide:not(.swiper-initialized) {
    margin: 0 0;
  }
  .js-sub-goodslist .block-thumbnail-t:not(.block-thumbnail-t__noslide):not(.swiper-initialized) .block-thumbnail-t--items {
  }
  .js-sub-goodslist .block-thumbnail-t:not(.block-thumbnail-t__noslide):not(.swiper-initialized) .block-thumbnail-t--goods {
    width: calc(100% / 4);
    min-width: calc(100% / 4);
    padding: 0 14px;
  }
}
@media screen and (min-width: 1024px) {
  .js-sub-goodslist .block-thumbnail-t:not(.block-thumbnail-t__noslide):not(.swiper-initialized) .block-thumbnail-t--goods {
    width: calc(100% / 5);
    min-width: calc(100% / 5);
    padding: 0 14px;
  }
}
@media screen and (min-width: 768px) {  
  /* thumbnail-h */
  .block-thumbnail-h-wrap:not(.swiper-initialized) .block-thumbnail-h {
    overflow-x: hidden;
    overflow-y: hidden;
  }
  .block-thumbnail-h-wrap:not(.swiper-initialized) .block-thumbnail-h::before,
  .block-thumbnail-h-wrap:not(.swiper-initialized) .block-thumbnail-h::after {
    display: none;
  }
  
  .block-thumbnail-h .block-thumbnail-h--item {
    width: calc(100% / 7);
    min-width: calc(100% / 7);
    margin: 0;
    padding: 0 0.5rem;
    position: relative;
  }
  .goodsdetail-pane-contents--body-comments {
    margin: 3.0rem 0;
  }

  .block-thumbnail-h-wrap.swiper-initialized .block-thumbnail-h .block-thumbnail-h--item {
    padding: 0;
  }

  .block-thumbnail-h-wrap.swiper-initialized .block-thumbnail-h .block-thumbnail-h--item {
    min-width: auto;
  }
  .block-thumbnail-h--goods-description {
    margin-top: 0.8rem;
  }
  .block-thumbnail-h--goods .block-thumbnail-h--goods-name {
    font-size: 1.6rem;
    font-weight: 500;
  }
  /* ranking-r */
  .block-ranking-r--rank {
    width: 3.5rem;
    height: 3.5rem;
    font-size: 1.8rem;
    font-weight: 500;
  }




  .block-goods-list--sort-order-items .js-sort-modal--btn span {
    cursor: pointer;
  }
  .block-goods-list--sort-order-items .js-sort-modal--body {
    left: auto;
    right: 0;
    min-width: 250px;
  }
  .block-goods-list--sort-order-items .js-sort-modal--body ul {
    flex-flow: column;
    gap: 1.5rem;
  }
  .block-goods-list--sort-order-items .js-sort-modal--body ul li {
    width: 100%;
  }

  .block-genre-style,.block-category-style-l {
    margin: 3.0rem 0;
    gap: 2.4rem;
    font-size: 1.6rem;
  }
  .block-genre-style li,
  .block-category-style-l li {
    width: auto;
  }
  .block-genre-style li a,
  .block-category-style-l li a {
  }

  /* 絞り込み */
  #filter-controll {
    position: relative;
    z-index: 10;
    margin: 0;
  }
  #filter-controll::before {
    display: block;
    content: '';
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: calc((100% - var(--fullWindowSize)) / 2);
    right: calc((100% - var(--fullWindowSize)) / 2);
    background: #F9F8F6;
  }
  #filter-controll-in {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0.8rem 0;
  }
  #filter-controll .filter-controll-list::before,
  #filter-controll .filter-controll-list::after {
    display: none;
  }
  #filter-controll .filter-box--sub > .filter-box--sub-body {
    right: auto;
    min-width: calc(600 / 1280 * 100%);
  }
  #filter-controll .filter-box--sub > .filter-box--sub-body dl {
    padding: 2.5rem 2.0rem;
  }
  #filter-controll .filter-box--sub > .filter-box--sub-body dl dt {
    margin: 0 0 2.0rem;
    font-size: 1.8rem;
  }
  #filter-controll .filter-box--sub > .filter-box--sub-body .filter-box--sub-submit {
    width: 300px;
    font-size: 1.5rem;
    padding: 1.0rem;
  }
  #filter-controll .filter-box--sub > .filter-box--sub-btn {
    font-size: 1.4rem;
    cursor: pointer;
  }
  #filter-controll .filter-controll-list .filter-controll--btn {
    font-size: 1.4rem;
    padding: 0.6rem 1.0rem 0.6rem 4.0rem;
    text-decoration: none!important;
  }

  .block-filtermodal--bg {
    background: rgba(0, 0, 0, 0.7);
  }
.block-filtermodal--wrapper {
  left: -450px;
}
#block_of_filter.st__open .block-filtermodal--wrapper {
  left: 0;
}

  .block-filtermodal--wrapper {
    width: 390px;
  }


}

/*--- block_no_code_cms.css */
@media screen and (min-width: 768px) {
  .block-no-code-cms--header1 {
    margin: 2.0rem 0 2.5rem;
    font-size: 2.8rem;
  }
  .block-no-code-cms--header2 {
    margin: 1.8rem 0 1.8rem;
    font-size: 2.4rem;
  }
  
  .block-no-code-cms--header3 {
    margin: 1.8rem 0 1.8rem;
    font-size: 2.0rem;
  }
  .block-no-code-cms--text-size-0 {
    font-size: 1.4rem;
  }
  .block-no-code-cms--text-size-1 {
    font-size: 1.6rem;
  }
  .block-no-code-cms--text-size-2 {
    font-size: 1.8rem;
  }
  .block-no-code-cms--button {
    display: inline-block;
    width: 500px;
  }

  .block-no-code-cms--button:hover {
    text-decoration: none;
  }
  
  a.block-no-code-cms--button-color-0:hover,
  #block_no_code_cms a.block-no-code-cms--button-color-0:hover {
    color: #ffffff;
    background-color: #333333;
    border: solid 1px #333333;
  }
  
  a.block-no-code-cms--button-color-1:hover,
  #block_no_code_cms a.block-no-code-cms--button-color-1:hover {
    color: var(--text-color);
    background-color: #ffffff;
    border: solid 1px #333333;
  }
  
  a.block-no-code-cms--button-color-2:hover,
  #block_no_code_cms a.block-no-code-cms--button-color-2:hover {
    color: var(--color-red);
    background: #ffffff;
    border: solid 1px var(--color-red);
  }

  a.block-no-code-cms--button-color-2:hover,
  #block_no_code_cms a.block-no-code-cms--button-color-2:hover {
    color: var(--color-red);
    background: #ffffff;
    border: solid1pxvar(--color-red);
  }
  a.block-no-code-cms--button-color-2:hover,
  #block_no_code_cms a.block-no-code-cms--button-color-2:hover {
    color: var(--color-red);
    background: #ffffff;
    border: solid1pxvar(--color-red);
  }

  a.block-no-code-cms--button-color-2:hover,
  #block_no_code_cms a.block-no-code-cms--button-color-2:hover {
    color: var(--color-red);
    background: #ffffff;
    border: solid1pxvar(--color-red);
  }




  /* 商品ブロック */
  .block-no-code-cms--goods-list {
    margin: 3.0rem 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4.0rem;
  }
  .block-no-code-cms--goods-list--item {
    width: calc((100% - 4.0rem * 3) / 4);
  }
  .block-no-code-cms--price-infos .block-no-code-cms--price.price {
    font-size: 2.5rem;
  }
  .block-no-code-cms--price-infos .block-no-code-cms--price.price::after {
    font-size: 1.3rem;
  }
  .block-no-code-cms--price-infos .default-price {
    font-size: 1.5rem;
  }
  .block-no-code-cms--price-infos .default-price::after {
    font-size: 1.0rem;
  }    
  .block-no-code-cms--goods-name {
    font-size: 1.6rem;
  }
  .block-no-code-cms--two-column > div + div {
  }

  .block-no-code-cms--two-column > div > * {
    margin: 1.4rem 0;
  }
  .block-no-code-cms--two-column > div > *:first-child {
    margin-top: 0;
  }
  .block-no-code-cms--two-column > div > *:last-child {
    margin-bottom: 0;
  }

}