/* woocommerce.php template specific styles */

/* Pagination: 前へ / 次へ のみ */
.woocommerce-pagination--prev-next {
    display: flex;
    justify-content: center;
    gap: 2rem;
    padding: 2rem 0;
}

.woocommerce-pagination--prev-next .prev,
.woocommerce-pagination--prev-next .next {
    display: inline-block;
    background: #fff;
    color: #333 !important;
    text-decoration: none;
    padding: 0.6em 1.4em;
    border-radius: 2em;
    font-size: 0.95rem;
    transition: background 0.2s ease;
    border: .5px solid #ccc;
}

.woocommerce-pagination--prev-next .prev:hover,
.woocommerce-pagination--prev-next .next:hover {
    background: #174f9e;
    color: #fff !important;
    border-color: #174f9e;
}



/* Archive header */
.archi-p {
    max-width: 1980px;
    padding: 0 3rem;
    letter-spacing: 0.096rem;
    margin: 0 auto !important;
}

#page .archi-p p,
#page .archi-p li {
    color: #444 !important;
    font-size: 0.925rem !important;
    text-align: left;
    line-height: 177%;
}

.woocommerce-shop .nwone {
    display: none !important;
}

.page-description {
    margin-bottom: 7rem;
}

.woocommerce-shop .site-main .ktab h2 {
    margin: 3rem 0 0 2rem !important;
    font-size: 2.7rem !important;
}

.ktab-panel {
    /* padding: 0 !important; */
    min-height: 45vh;
    max-width: 100% !important;
    margin: 0 auto;
}

.kk-productslide {
    padding-top: 4rem;
}

/* Shop guide */
.zsearch-guide-grid {
    max-width: 1200px;
    margin: 1.2rem auto !important;
}

.zserach a.dc-guide {
    display: flex;
    align-items: center;
    gap: 16px;
    text-decoration: none;
    max-width: 640px;
    margin: 3rem auto;
    background: #f8f8f8;
    border-radius: 1rem;
    overflow: hidden;
    transition: 0.3s all;
}

.zserach a.dc-guide:hover {
    background: aliceblue;
}

.zserach .dc-guide p {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.4;
}

.zserach .dc-guide p b {
    font-size: large;
    color: #174f9e;
}

.zserach a.dc-guide img {
    height: 128px;
    width: auto;
    display: block;
    flex: 0 0 auto;
    padding: 1rem;
}

.dc-guide-download {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .zserach a.dc-guide img {
        height: 82px;
    }
}

/* Shop list */
.woocommerce-shop .site-main .ktab h2.woocommerce-loop-product__title,
#primary .ktab p.first-title {
    font-size: 88% !important;
}

.ktab .opuna .loopstart li {
    display: inline-block;
}

#primary h2.pxbh2title.lineu {
    font-size: 1.65rem !important;
    padding-top: 8.125rem !important;
}

ul.loopstart.ppap {
    white-space: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none !important;
}

.opuna.prolist {
    overflow: auto;
    scrollbar-width: none !important;
    max-width: 100%;
}

.scroll-btn {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

#primary li.col.product.hurry.kec-product-loop-item {
    display: block;
    width: 100%;
    max-width: 100%;
    vertical-align: top;
}

.archive .opuna .loopstart a {
    display: flex !important;
    align-items: center;
    width: 100%;
}

.archive .opuna .loopstart li.product {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 0 2rem !important;
}

.archive ul.loopstart.ppap {
    white-space: normal !important;
    overflow-x: visible;
}

.archive .ktab .opuna .loopstart li,
.archive .opuna .loopstart li.product {
    display: block !important;
}

/* Login-gated overlay */
.logged-in .wistia_responsive_padding:before {
    display: none !important;
}

body:not(.logged-in) .wistia_responsive_padding:before {
    display: block;
    width: 100%;
    height: 100%;
    content: "myKIKUSUIにログインしてください";
    background: #174f9e;
    z-index: 999999999;
    position: absolute;
    top: 0;
    opacity: 0.5;
    text-align: center;
    padding-top: 25%;
    font-size: 2rem;
    color: #fff;
    font-weight: bold;
}

/* Common blocks used in this template */
.splide__list div:first-child {
    width: 100%;
}

.splide {
    padding: 0 !important;
    margin: 0 auto !important;
    width: 100% !important;
}

iframe.intaractive-banner {
    height: 540px;
    width: 100%;
    border: none;
    margin: 2rem 0;
}

b.akeyoshi {
    display: block;
    padding: 2rem;
    text-align: center;
    font-weight: bold;
    transition: 1.11s all ease;
    color: slategray;
}

b.akeyoshi.active {
    text-align: right;
    font-size: 60%;
    opacity: 0.6;
}

div.moreproducts {
    display: none;
}

.akeyoshi {
    color: red;
    padding: 0;
    text-align: center;
    font-weight: bold;
}

h2.sw-title.nsecti {
    margin-top: -3.5rem;
}

.scroll-btn.right {
    right: 1rem;
}

.scroll-btn.left {
    left: 1rem;
}

@media screen and (max-width: 500px) {
    .top-news-a {
        padding-bottom: 4rem;
    }

    h2.sw-title.nsecti {
        margin-top: 0;
    }

    html .site-main h2.sw-title {
        font-size: 2rem !important;
    }

    html .secti {
        margin-top: 1rem !important;
    }
}

.secti {
    margin-top: -4rem !important;
}

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

@media screen and (max-width: 1024px) {
    .archive .opuna .loopstart a {
        display: flex !important;
    }

    ul.loopstart.ppap {
        display: block;
    }

    #primary li.col.product.hurry.kec-product-loop-item {
        display: inline-block;
        max-width: 100% !important;
    }

    html .product-image {
        width: 140px !important;
    }
}

.site-main h2.sw-title:after {
    display: none;
}

.site-main h2.sw-title,
.page-template .site-main li h2.sw-title {
    background: #174f9e;
    background: linear-gradient(to bottom right, #174f9e 35%, #cf387e 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    position: absolute;
    display: inline-block;
    padding: 1.5rem 0 1.5rem 0;
    font-size: 3.85rem !important;
    opacity: 1;
    letter-spacing: 0.1rem;
    height: auto;
    margin-left: 3rem !important;
    z-index: 9999;
    margin-top: -3rem !important;
}

#top-dc .swiper-button-next:hover,
#top-dc .swiper-button-prev:hover {
    background: rgba(252, 252, 252, 0.9);
}

#top-dc .swiper-button-prev {
    background: rgba(252, 252, 252, 0.5);
    padding: 2rem;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    margin-left: -36px;
    margin-top: -4rem;
}

#top-dc .swiper-button-next {
    background: rgba(252, 252, 252, 0.5);
    padding: 2rem;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    margin-right: -36px;
    margin-top: -4rem;
}

[class*=swiper]:focus {
    outline: none;
}

.slidedesc {
    font-size: 0.8rem;
    color: #666;
    margin-top: 0;
    padding-top: 0;
}

dt.spstitle {
    font-weight: bold;
    margin-top: 9px;
}

.slidedesc dd {
    margin: 5px 0;
}

.page-description .slidedesc dd {
    font-size: 0.929rem !important;
}

.page-description dt.spstitle {
    font-size: 0.7rem;
    margin-bottom: 0.25rem;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing: content-box;
    padding: 8rem 0;
}

p.nisebutton,
a.nisebutton {
    transition: 0.4s ease;
    display: block;
    background: #174f9e;
    border-radius: 10px;
    color: #fff !important;
    padding: 1rem;
    line-height: 0;
    text-align: center !important;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.nisebutton svg {
    fill: #fff;
    height: 12px;
}

.slide-content {
    padding: 0 1rem;
}

.site-main h3.slide-title:after {
    display: none;
}

.site-main h3.slide-title {
    font-size: 0.9rem;
    display: none;
    line-height: 1.4rem;
    margin: 0;
    font-weight: 500;
    font-family: 'Lato', 'Noto Sans JP';
    margin-top: 0.5rem;
}

a.swiper-slide,
div.swiper-slide {
    text-decoration: none;
    background: #fefefe;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 4px 4px 8px #daddd6, -4px -4px 8px #ffffff;
    transition: 0.4s ease;
}

a.swiper-slide:hover {
    background: #fff;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 12px 12px 21px #dadee6, -12px -12px 21px #ffffff;
    margin-top: -0.765rem;
}

.swiper-backface-hidden .swiper-slide:hover .nisebutton {
    background: crimson;
}

#top-dc {
    overflow: hidden;
    max-width: 100%;
    background: #f2f7ff;
    margin: 6rem 0 0 0 !important;
}

#top-bipo {
    overflow: hidden;
    max-width: 100%;
    background: #fcfff7;
    margin: 0 !important;
}

#top-ac {
    overflow: hidden;
    max-width: 100%;
    background: #f4f9f0;
    margin: 0 !important;
}

#top-elo {
    overflow: hidden;
    max-width: 100%;
    background: #eaf3fb;
    margin: 0 !important;
}

#top-sft {
    overflow: hidden;
    max-width: 100%;
    background: #fff7fe;
    margin: 0 !important;
}

.s-inner {
    position: relative;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    margin: 0 auto;
    padding: 0 10rem;
    overflow: hidden;
}

#top-dc .swiper-slide:not(.swiper-slide-visible) .slide,
#top-ac .swiper-slide:not(.swiper-slide-visible) .slide,
#top-elo .swiper-slide:not(.swiper-slide-visible) .slide,
#top-sft .swiper-slide:not(.swiper-slide-visible) .slide {
    pointer-events: none;
    opacity: 0.3;
}

.hads {
    display: none !important;
}

.pick-up {
    margin: 7rem 0 5rem;
}

.pick-up p {
    text-align: center !important;
    font-weight: bold;
    font-size: 1.25rem !important;
}

.pick-up:after {
    content: "";
    background: blanchedalmond;
    height: 4px;
    display: block;
    width: 5rem;
    margin: -1.5rem auto;
}

.ac-panel .slide p {
    margin: revert;
    min-height: inherit;
    padding: 1rem;
}

.slidedesc::-webkit-scrollbar {
    width: 5px;
}

.slidedesc::-webkit-scrollbar-track {
    background-color: #ccc;
}

.slidedesc::-webkit-scrollbar-thumb {
    background-color: #174f9e;
}