@charset "UTF-8";

/* common */

html {
    scroll-behavior: smooth;
    scroll-padding-top: 70px;
}

.container {
    margin: 40px auto;
    text-align: center;
}

.aside {
    display: none;
}

.wrapper .__inner {
    max-width: 1920px !important;
}

.wrapper.wrapper--column-2 .__inner .main {
    width: 100% !important;

}

.wrapper--home .__inner .main {
    padding: 0 !important;
}

.c-heading-main {
    text-align: center;
    margin-top: 50px;
    margin-bottom: 15px;
    border-bottom: 0;
    border-top: 0;
    /* font-family: "Montserrat", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; */
}

@media screen and (min-width:600px) {
    .c-heading-main {
        margin-bottom: 20px;
    }

}

@media screen and (min-width:960px) {
    .c-heading-main {
        border-bottom: 0;
        border-top: 0;
    }

}

.c-news-label.c-news-label--color-3 {
    /* background-color: #CEAF7B; */
}

.header .__banner .__wrap .__view-cart a span.__counter {
    background-color: #CEAF7B;
}

@media screen and (min-width:600px) {
    .header .__banner .__wrap .__view-cart a span.__counter {
        position: absolute;
        top: -6px;
        right: 2px;
        padding: 0 .4em;
        font-size: .85em;
        background-color: #CEAF7B;
        color: #fff;
        border-radius: 2em;
    }

}

.__block--news {
    width: 97%;
}

@media screen and (min-width:600px) {
    .__block--news {
        width: 70%;
    }
}


@media screen and (min-width: 960px) {
    .wrapper .__inner .main, .wrapper .__inner .aside {
        padding: 1.5em;
    }
}

/* カート投入時のボーダー */

.jconfirm .jconfirm-box.jconfirm-type-green{

    border-top: solid 7px #616161 !important;
    animation-name: type-green !important;
}

@keyframes type-green{
    1%,100%{
        border-color:#616161;
    }

    50%{
        border-color: #D9D9D9;
    }
}

/* header */

.header .__banner {
    margin: 0 !important;
}

.announcement {
    text-align: center;
    background: #686868;
    color: #fff;
    margin: 0;
    line-height: 34px;
}

@media screen and (min-width:600px) {
    .announcement {
        padding-left: 130px;
        text-align: left;

    }
}


.header figure {
    margin: 0 !important;
}

.header_logo {
    width: 50%;
}

@media screen and (min-width:600px) {
    .header_logo {
        width: 35%;
    }
}


.img_container {
    display: none;

}

@media screen and (min-width:600px) {

    .top_header {
        display: flex;
        justify-content: center;
    }

}







@media screen and (min-width:600px) {
    .header .__banner .__wrap a.__logo img {
        padding-left: 100px;
    }
}


@media screen and (min-width:600px) {

    .img_container {
        position: absolute;
        display: flex;
        align-items: center;
        top: 50px;
        right: 3%;
    }

    .contact_line a {
        display: none;
    }

    .account_icon {
        width: 37px;
        margin-left: 10px;
    }

    .header .__banner .__wrap .img_container .__view-cart {
        display: block;
        margin-left: 10px;
    }

}

@media screen and (min-width:800px) {

    .contact_line a {
        display: block;
        color: #fff;
        border: solid #5DBA60 1px;
        background-color: #5DBA60;
        padding: 10px 20px;
        border-radius: 13px;
        font-weight: 800;
    }
}


.header .__banner .__wrap .__view-cart a:before {
    font-size: 2.5em;
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    content: "";
}

/* nav */

.gnav-pc .__menu.__menu--custom {
    /* position: relative; */
}

.gnav-pc .__menu.__menu--custom ul {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.gnav-pc .__menu.__menu--custom ul li {
    margin: 0 20px;
}

.gnav-pc .__menu.__menu--custom ul li:first-child {
    position: relative;
    text-align: center;
    cursor: pointer;
    margin-right: 35px;
    transition-duration: 200ms;
}

.gnav-pc .__menu.__menu--custom ul li:first-child:hover {
    color: #CEAF7B;
}


.gnav-pc .__menu.__menu--custom ul li:first-child::after {
    content: "";
    display: block;
    position: absolute;
    width: 8px;
    height: 8px;
    top: calc(50% - 9px);
    right: -26%;
    border-right: 2px #333 solid;
    border-bottom: 2px #333 solid;
    transform: rotateZ(45deg);
    transition-duration: 200ms;
}

.gnav-pc .__menu.__menu--custom ul li:first-child:hover::after {
    border-right: 2px #CEAF7B solid;
    border-bottom: 2px #CEAF7B solid;
}

.gnav-pc .__menu.__menu--custom ul li a {
    padding: .75em;
    transition-duration: 200ms;
}

.gnav-pc .__menu.__menu--custom ul li a:hover {
    background-image: none;
    color: #CEAF7B;
}



.gnav-pc .__menu.__menu--custom ul .product_open {}

.gnav-pc .__menu.__menu--custom .product_open_list {
    display: block;
    cursor: pointer;
    z-index: -1;
    width: 100vw;
    background-color: #fff;
    position: absolute;
    top: 155px;
    left: 0;
    opacity: 0;
    /* display: grid;
    place-items: center; */
    transition-duration: 150ms;
    transition-timing-function: ease-out;

}



.menu-open .gnav-pc .__menu.__menu--custom .product_open_list {
    display: block;
    cursor: pointer;
    z-index: 10;
    width: 100vw;
    background-color: #fff;
    position: absolute;
    /* top: 0; */
    top: 155px;
    left: 0;
    opacity: 1;
    /* display: grid;
    place-items: center; */

}


.product_open_list_flex {
    /* height: 400px; */
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    align-content: center;
    justify-content: center;
    padding: 50px 10%;
    max-width: 1920px;
}



.product_open_BTN {
    position: relative;
    text-align-last: left;
    border: 1px #333 solid;
    border-radius: 30px;
    padding: 16px;
    width: 40%;
    margin: 35px 10px;
}

@media screen and (min-width:960px) {
    .product_open_BTN {
        width: 20%;
    }

}

.product_open_BTN span::after {
    display: block;
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    top: calc(50% - 4px);
    right: 5%;
    border-right: 2px #666 solid;
    border-bottom: 2px #666 solid;

    transform: rotateZ(-45deg);
}


.product_open_list_flex::after {
    content: "";
    display: block;
    width: calc(40% + 20px);
}

@media screen and (min-width:960px) {
    .product_open_list_flex::after {
        content: "";
        display: block;
        width: calc(40% + 40px);
    }

}


/* hamburger */

.__search--feature {
    display: none;
}






/* top_banner */

/* .slick-prev:before {
    display: none;
}

.slick-next:before {
    display: none;
} */


.slick-prev, .slick-next {
    z-index: 100;
}

.slider .slick-prev {
    left: 25px;
}

.slider .slick-prev::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    border-left: #fff 2px solid;
    border-bottom: #fff 2px solid;
    transform: rotate(45deg);
}

.slider .slick-next {
    right: 25px;
}

.slider .slick-next:before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    border-right: #fff 2px solid;
    border-bottom: #fff 2px solid;
    transform: rotate(315deg);
}


@media screen and (min-width:600px) {
    .slider .slick-prev::before {
        width: 50px;
        height: 50px;
    }

    .slider .slick-prev {
        left: 35px;
    }

    .slider .slick-next {
        right: 70px;
    }

    .slider .slick-next:before {
        width: 50px;
        height: 50px;
    }

}

.slick-slide figure {
    margin: 0;
}

.slider .slick-dots li {
    margin: 0 5px;
}

.slider .slick-dots li button:before {
    content: "";
    background-color: #000;
    width: 25px;
    height: 5px;
}

@media screen and (min-width:600px) {

    .slider .slick-dots li {
        margin: 0 20px;
    }

    .slider .slick-dots li button:before {
        content: "";
        background-color: #000;
        width: 50px;
        height: 5px;
    }


}



/* campaign*/
.campaign_container {
    width: 80%;
    margin: 0 auto;
}

@media screen and (min-width:600px) {
    .campaign_container {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        width: 90%;
    }
}

.campaign_BTN {
    display: block;
    margin: 20px 0;
}

@media screen and (min-width:600px) {
    .campaign_BTN {
        margin: 9px;
        width: 45%;
    }

}

.campaign_container::after {
    content: "";
    display: block;
    width: calc(45% + 18px);
}

.campaign_BTN img {
    width: auto;
}







/* registration */


.regist_BTN {
    background-color: #000;
    color: #fff;
    line-height: 32px;
    padding: 10px 20px;
}


/* news */

.__block--news {
    /* width: 70%; */
    margin: 0 auto;
}






/* category */
.category_BTN {
    display: block;
    width: 95%;
    margin: 5px auto;
    background-color: #D9D9D9;
    padding: 10px 20px;
}


@media screen and (min-width:960px) {
    .category_container {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);

        max-width: 1140px;
        margin: 0 auto;
    }

    .category_BTN {
        padding: 20px 20px;
    }

}


/*ranking */

.__block--pro-ranking {
    width: 90%;
    margin: 0 auto;
}

@media screen and (min-width:960px) {

    .__block--pro-ranking {
        width: 70%;
    }

    .__block--pro-ranking .p-product-block ul.__product {
        display: flex;
        justify-content: space-evenly;
    }
}

@media (max-width: 599px) {
    .p-product-block.p-product-block--compact ul.__product li.__item {
        width: 33.33333%;
    }
}





/* product */
.product_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 860px;
    /* min-width: 375px; */
    margin: 0 auto;
}

.product_BTN {
    position: relative;
    text-align-last: left;
    border: 1px #333 solid;
    padding: 10px;
    width: 46%;
    margin: 6px 6px;
}

.product_BTN span::after {
    display: block;
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    top: calc(50% - 4px);
    right: 5%;
    border-right: 2px #666 solid;
    border-bottom: 2px #666 solid;
    transform: rotateZ(-45deg);
}

@media screen and (min-width:600px) {
    .product_BTN {
        margin: 6px 10px;
        width: 45%;
    }

}

.product_container::after {
    content: "";
    display: block;
    width: calc(46% + 12px);
}

@media screen and (min-width:600px) {
    .product_container::after {
        content: "";
        display: block;
        width: calc(45% + 20px);
    }
}



/* contents */
.contents_container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    margin: 0 auto;
}



.contents_BTN {
    margin: 9px;
    width: 45%;
}

/* @media screen and (min-width:600px) {
    .contents_BTN {
        margin: 9px;
        width: 45%;
    }

} */

.contents_container::after {
    content: "";
    display: block;
    width: calc(45% + 18px);
}

.contents_BTN img {
    width: auto;
}



/* newspage */

.newspage li {
    list-style: none;
    border-top: #95a5a6 1px solid;
}

.newspage li:first-child {
    border-top: none;
}

.newspage li:last-child {
    border-bottom: #95a5a6 1px solid;
}

.newspage li a {
    display: block;
    padding: 30px 5px;
}


/* about */
.wrapper.about {
    max-width: 716px;
    width: 95%;
    margin: 0 auto;
    color: #333;
}


.wrapper.about figure {
    margin: 50px 0
}

.wrapper.about img {
    display: block;
    margin: 0 auto;
}



.about_top_text {
    text-align: center;
    font-size: 21px;
    font-weight: 500;
}

.about_titel {
    font-size: 21px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 50px;
    margin-top: 100px;
}

.about_text {
    width: 87%;
    margin-left: auto;
    margin-right: auto;
    font-size: 16px;
    text-align: center;
}

.about_logo {
    width: 60%;
    margin: 0 auto;
}

.about_product_name {
    font-size: 27px;
    text-align: left;
    font-weight: 400;
    margin-bottom: 12px;
    margin-top: 15px;
}

.about_product_desc {
    font-size: 13px;
    width: 87%;
    margin-left: auto;
    margin-right: auto;
}

.about_product_detail {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 20px;
}

.about_product_detail p {
    font-size: 11px;
}



.wrapper .about_product .about_product_MV {
    margin-bottom: 15px;
}

.wrapper .about_product_detail img {
    width: 60%;
    margin-left: 5px;

}


/* faq */


.faq {
    max-width: 716px;
    width: 95%;
    margin: 0 auto;
}

.faq .faq_nav {
    display: block;
    margin-top: 50px;
    margin-bottom: 50px;
}

@media screen and (min-width:600px) {

    .faq .faq_nav {
        display: flex;
        justify-content: space-between;
    }

}


.faq .faq_nav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition-duration: 200ms;
    border-bottom: #666 1px solid;
    padding-top: 1em;
    padding-bottom: 1em;
}





.faq .faq_nav a::after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-top: #666 1px solid;
    border-right: #666 1px solid;
    transform: rotate(135deg);
    margin-left: 1em;
}

.faq .faq_nav a:hover {
    color: #CEAF7B;
    text-decoration: none;
}

.faq .faq_nav a:hover::after {
    border-top: #CEAF7B 1px solid;
    border-right: #CEAF7B 1px solid;
}













.accordion {
    margin-top: 30px;
    margin-bottom: 60px;
}

.accordion .toggle {
    display: none;
}

.accordion .Label {
    /*タイトル*/
    padding: 2em;
    display: block;
    color: #626262;
    background: #fff;
    border-top: #D9D9D9 .25px solid;
    border-bottom: #D9D9D9 .25px solid;
    margin-top: -1px
}

.accordion .Label::before {
    content: "Q";
    display: inline;
    margin-right: 1em;
}

.accordion .Label .puls {
    position: absolute;
    display: inline-block;
    width: 14px;
    height: 1px;
    border-top: 2px solid #626262;
    top: calc(50% - 2px);
    right: 20px;
    transition: .5s;
}

.accordion .Label .puls::before {
    content: "";
    position: absolute;
    width: 1px;
    height: 14px;
    border-left: 2px solid #626262;
    top: calc(50% - 8px);
    right: 5px;
    transition: .5s;
    transform-origin: center center;
}

.accordion .Label,
.accordion .content {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    transition: all 0.2s;
}

.accordion .content {
    /*本文*/
    height: 0;
    /* margin-bottom: 10px; */
    padding: 0 2em;
    overflow: hidden;
    background-color: #D9D9D9;
}


.accordion .toggle:checked+.Label+.content {
    /*開閉時*/
    height: auto;
    padding: 2em;
    transition: all .2s ease;
    background-color: #D9D9D9;
}

.accordion .content p {
    display: flex;
}

.accordion .content p::before {
    content: "A";
    display: inline;
    margin-right: 1em;
}

.accordion .toggle:checked+.Label .puls::before {
    transform: rotate(90deg) !important;
    opacity: .3;

}