@charset "UTF-8";

/*
===========================================
デザインと横幅合わせています。不要でしたら削除してください。
===========================================
*/
.k-momoko .container {
    max-width: 1170px;
}

.site-sidenav {
    max-width: 220px;
}

.k-momoko .site-main {
    max-width: 910px;
}


/*
===========================================
レスポンシブしやすいようにimgの設定を変更
===========================================
*/
.p-index img {
    width: 100%;
    height: auto;
}


/*
===========================================
内側に線を引く
===========================================
*/
.site-main * {
    box-sizing: border-box;
}


/*
===========================================
フォント読み込み
===========================================
*/

/*
@font-face {
  font-family: 'Hannari';
  font-style: normal;
  src: url("../fonts/hannari.eot");
  src: url("../fonts/hannari.woff2") format("woff2"), url("../fonts/hannari.woff") format("woff"), url("../fonts/hannari.ttf") format("truetype"), url("../fonts/hannari.otf") format("opentype");
}

@font-face {
  font-family: 'Din';
  font-style: normal;
  src: url("../fonts/din.eot");
  src: url("../fonts/din.woff2") format("woff2"), url("../fonts/din.woff") format("woff"), url("../fonts/din.ttf") format("truetype"), url("../fonts/din.otf") format("opentype");
}/*


/*
===========================================
共通スタイル
===========================================
*/
.c-font-normal {
    font-family: Helvetica, Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
}

.c-ttl-style01Wrap {
    margin-bottom: 2vmin !important;
}

@media (min-width: 768px) {
    .c-ttl-style01Wrap {
        margin-bottom: 20px !important;
    }
}

.c-ttl-style01 {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    font-size: 24px;
    font-weight: bold;
    color: #fff;
}

@media screen and (max-width: 767px) {
    .c-ttl-style01 {
        font-size: 24px !important;
        font-weight: bold!important;
    }
}

.c-ttl-style01 .eng {
    display: inline-block;
    margin: 0 0 0 16px;
    font-size: 16px;
}

@media (min-width: 768px) {
    .c-ttl-style01 {
        font-size: 3.2rem !important;
    }
}


.c-ttl-style01En {
    width: 100%;
    height: 64px;
    margin: 0 0 48px !important;
    padding: 10px 16px !important;
    background-image: url(https://kurashikimomoko.itembox.design/item/img/common/h1_bg.jpg);
    background-position: top right;
}

@media screen and (max-width: 767px) {
    .c-ttl-style01En {
        height: 48px;
        margin: 0 0 24px !important;
        padding: 6px 8px !important;
    }
}

.c-contents {
    position: relative;
    /*padding-top: 14vmin !important;*/
    /* padding-bottom: 14vmin !important; */
    padding-bottom: 52.5px !important;
}

@media (min-width: 768px) {
    .c-contents {
        padding-bottom: 90px !important;
    }
}

.c-bnr-style01 {
    display: block;
    width: 100%;
    max-width: 780px;
    margin-right: auto !important;
    margin-left: auto !important;
}

/*
===========================================
.slider-main
===========================================
*/
.slider-main {
    margin-bottom: 15vmin !important;
}

@media (min-width: 768px) {
    .slider-main {
        margin-bottom: 90px !important;
    }
}

.slider-main-mv {
    margin-bottom: 3vmin !important;
    position: relative;
    margin-left: calc(((100vw - 100%) / 2) * -1) !important;
    margin-right: calc(((100vw - 100%) / 2) * -1) !important;
}

@media (min-width: 768px) {
    .slider-main-mv {
        margin-bottom: 20px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

.slider-main-mvImg:focus,
.slider-main-thumbnailImg:focus {
    outline: none !important;
}

.slider-main-thumbnailImg {
    margin-right: 5px !important;
    margin-left: 5px !important;
}

.slider-main-thumbnail .slick-current img {
    /*  border: 4px solid #e2e2e2;*/
    box-sizing: border-box;
}

.slider-main-thumbnail .slick-current {
    position: relative;
    top: 0
}

.slider-main-thumbnail .slick-current::before {
    content: '';
    display: block;
    border: 2px solid #e2e2e2;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* width:193px;
    height:82px; */
}

@media (min-width: 768px) {
    .slider-main-thumbnail .slick-current::before {
        border: 4px solid #e2e2e2;
    }
}

.slider-arw {
    display: block;
    z-index: 1000;
    position: absolute;
    width: 15px;
    z-index: 1000;
    top: 50%;
    transform: translateY(-50%);
    display: block;
}

.slick-prev::before,
.slick-next::before {
    display: none;
}

#fs_Top > div.fs-l-page > main > section > div > main > section.p-ranking > div.c-contents.p-ranking-contents.js-ranking > div > a.slick-prev.ranking-icon-prevSp.ranking-arw-sp.ranking-arw.slick-arrow {
    position: absolute !important;
    left: 0 !important;
    top: 40%;
}

#fs_Top > div.fs-l-page > main > section > div > main > section.p-ranking > div.c-contents.p-ranking-contents.js-ranking > div > a.slick-next.ranking-icon-nextSp.ranking-arw-sp.ranking-arw.slick-arrow {
    position: absolute !important;
    right: 15px !important;
    top: 40%;
}
@media (max-width: 767px) {
    #fs_Top > div.fs-l-page > main > section > div > main > section.p-ranking > div.c-contents.p-ranking-contents.js-ranking > div > a.slick-next.ranking-icon-nextSp.ranking-arw-sp.ranking-arw.slick-arrow {
        right: -3px !important;
        top: 40%;
    }
    #fs_Top > div.fs-l-page > main > section > div > main > section.p-ranking > div.c-contents.p-ranking-contents.js-ranking > div > a.slick-prev.ranking-icon-prevSp.ranking-arw-sp.ranking-arw.slick-arrow {
        left: -3px !important;
        top: 40%;
    }
}

.slider-icon-prev {
    left: 0.5%;
}

.slider-icon-next {
    right: 0.5%;
}

/*
===========================================
Attention
===========================================
*/

.attention_img {
    margin-bottom: 70px !important;
}

@media screen and (max-width: 480px) {
    .attention_img {
        margin-bottom: 35px !important;
    }
}


/*
===========================================
Ranking
===========================================
*/
.p-ranking-ttl::before,
.p-ranking-ttl::after {
    width: 8vmin;
    height: 8vmin;
}

.p-ranking-ttl::before {
    background-image: url(https://kurashikimomoko.itembox.design/item/img/index/title-ranking-illust-left.png);
    margin-right: 2%;
}

@media (min-width: 768px) {
    .p-ranking-ttl::before {
        width: 46px;
        height: 37px;
        margin-right: 20px;
    }
}

.p-ranking-ttl::after {
    background-image: url(https://kurashikimomoko.itembox.design/item/img/index/title-ranking-illust-right.png);
    margin-left: 2%;
}

@media (min-width: 768px) {
    .p-ranking-ttl::after {
        width: 45px;
        height: 34px;
        margin-left: 20px;
    }
}

.p-ranking-ttlWrap {
    counter-reset: number;
}

.p-ranking-listCount {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-number-bg.png) no-repeat center center/contain;
    width: 12vmin;
    height: 10vmin;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 5vmin auto 3vmin !important;
    /* font-family: 'Din', sans-serif !important; */
    color: #ffffff;
}

.ranking-top {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-01.png) no-repeat center center/contain;
}

.ranking-2 {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-02.png) no-repeat center center/contain;
}

.ranking-3 {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-03.png) no-repeat center center/contain;
}

.ranking-4 {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-04.png) no-repeat center center/contain;
}

.ranking-5 {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-05.png) no-repeat center center/contain;
}

.ranking-6 {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-06.png) no-repeat center center/contain;
}

.ranking-7 {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-07.png) no-repeat center center/contain;
}

.ranking-8 {
    background: url(https://kurashikimomoko.itembox.design/item/img/index/ranking-08.png) no-repeat center center/contain;
}

@media (min-width: 768px) {
    .p-ranking-listCount {
        width: 36px;
        height: 32px;
        margin: 12px auto 35px !important;
        /* font-family: 'Din', sans-serif !important; */
        color: #ffffff
    }
}

/* .p-ranking-listCount::before {
  counter-increment: number;
  content: counter(number);
  font-family: 'Din', sans-serif;
  font-size: 1.6rem;
  color: #fff;
  position: relative;
  bottom: 0.3vmin;
}
@media (min-width: 768px) {
  .p-ranking-listCount::before {
    bottom: 0;
  }
} */

.p-ranking-listItem {
    display: block;
    padding: 0 0.3% !important;
}

@media (min-width: 768px) {
    .p-ranking-listItem {
        padding: 0 25px !important;
    }
}

.p-ranking-listImg {
    margin-bottom: 3.5vmin !important;
}

@media (min-width: 768px) {
    .p-ranking-listImg {
        margin-bottom: 27px !important;
    }
}

.p-ranking-listName {
    font-size: 1.4rem !important;
    color: #191717;
    margin-bottom: 1.5vmin !important;
}

@media (min-width: 768px) {
    .p-ranking-listName {
        margin-bottom: 12px !important;
    }
}

.p-ranking-listPrice {
    font-size: 1.3rem !important;
}

.p-ranking-listPriceEm {
    font-size: 1.6rem !important;
    color: #e72910;
}


.ranking-arw {
    position: absolute;
    z-index: 1000;
    top: 50%;
    transform: translateY(-140%);
}

.ranking-arw::before {
    content: none !important;
}

.ranking-arw-sp {
    width: 14px;
    height: 20px;
}

@media (min-width: 768px) {
    .ranking-arw-pc {
        width: 21px;
        height: 21px;
    }
}

.ranking-icon-prevSp {
    left: 1%;
}

@media (min-width: 768px) {
    .ranking-icon-prevPc {
        left: 1px;
    }
}

.ranking-icon-nextSp {
    right: 1%;
}

@media (min-width: 768px) {
    .ranking-icon-nextPc {
        right: 1px;
    }
}

@media (max-width: 767px) {

    .p-ranking-list .slick-prev {
        left: -10px;
    }

    .p-ranking-list .slick-next {
        right: -10px;
    }

}


/*
===========================================
.p-bnr
===========================================
*/
.p-bnr {
    padding: 15vmin 0 !important;
}

@media (min-width: 768px) {
    .p-bnr {
        padding: 100px 0 !important;
    }
}


/*
===========================================
.p-pickup
===========================================
*/

@media (min-width: 768px) {
    .p-pickup-list {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }
}

.p-pickup-listLink {
    display: block;
}

@media (min-width: 768px) {
    .p-pickup-listItem {
        width: 32%;
    }
}

.p-pickup-listItem:not(:last-child) {
    margin-bottom: 11vmin;
}

@media (min-width: 768px) {
    .p-pickup-listItem:not(:last-child) {
        margin-bottom: 0;
    }

    .p-pickup-listItem:not(:nth-of-type(-n+3)) {
        margin-top: 55px;
    }

    .p-pickup-listItem:not(:nth-child(3n)) {
        margin-right: 2%;
    }
}


.p-pickup-listImg {
    margin-bottom: 2vmin !important;
}

@media (min-width: 768px) {
    .p-pickup-listImg {
        margin-bottom: 20px !important;
    }
}

.p-pickup-listName {
    font-size: 2rem !important;
    margin-bottom: 1.5vmin !important;
    color: #191717;
}

@media (min-width: 768px) {
    .p-pickup-listName {
        font-size: 1.8rem !important;
        margin-bottom: 10px !important;
    }
}

.p-pickup-listText {
    font-size: 1.4rem !important;
    color: #666;
    letter-spacing: 0.1em;
    line-height: 1.8 !important;
}

@media (min-width: 768px) {
    .p-pickup-listText {
        line-height: 1.7 !important;
    }
}


/*
===========================================
.p-search
===========================================
*/
.p-search {
    margin-bottom: 15vmin !important;
}

@media (min-width: 768px) {
    .p-search {
        display: none !important;
    }
}


/*
===========================================
.p-category
===========================================
*/
.p-category {
    margin-bottom: 15vmin !important;
    border-bottom: solid 1px #2c2c2c !important;
}

@media (min-width: 768px) {
    .p-category {
        margin-bottom: 80px !important;
    }
}

/* .p-category-ttl::before {
  background-image: url(https://kurashikimomoko.itembox.design/item/img/index/title-category-illust-left.png);
  margin-right: 3.5%;
}
@media (min-width: 768px) {
  .p-category-ttl::before {
    width: 24px;
    height: 25px;
    margin-right: 20px;
  }
} */

/* .p-category-ttl::after {
  background-image: url(https://kurashikimomoko.itembox.design/item/img/index/title-category-illust-right.png);
  margin-left: 2%;
}
@media (min-width: 768px) {
  .p-category-ttl::after {
    width: 24px;
    height: 25px;
    margin-left: 20px;
  }
} */

.p-category-sec:not(:last-child) {
    position: relative;
    padding-bottom: 13vmin !important;
    margin-bottom: 11vmin !important;
}

@media (min-width: 768px) {
    .p-category-sec:not(:last-child) {
        padding-bottom: 70px !important;
        margin-bottom: 60px !important;
    }
}

.p-category-sec:not(:last-child)::after {
    content: "";
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 3px;
    background: url(https://kurashikimomoko.itembox.design/item/img/index/dot_bg.gif) repeat-x center center / contain;
}

.p-category-secLink {
    display: block;
}

.p-category-secTtl {
    color: #191717;
    text-align: center;
    margin-bottom: 7vmin !important;
    padding-bottom: 8px!important;
    border-bottom: solid 1px #000!important;
}

@media (min-width: 768px) {
    .p-category-secTtl {
        margin-bottom: 56px !important;
    }
}


.p-category-secTtlText {
    text-align: center;
    display: inline-block;
    position: relative;
    font-size: 2.0rem !important;
}

@media (min-width: 768px) {
    .p-category-secTtlText {
        font-size: 2.4rem !important;
    }
}

.p-category-secList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

@media (min-width: 768px) {
    .p-category-secList.u-flesh {
        width: 90%;
        margin-right: auto !important;
        margin-left: auto !important;
    }
}

.p-category-secItem {
    width: 48%;
    margin-bottom: 30px !important;
}

@media (min-width: 768px) {
    .p-category-secItem {
        /* width: 197px; */
        width: calc(25% - 15px);
    }
    .dummy{
        width: calc(25% - 15px) !important;
    }
}



/* .p-category-secItem:not(:nth-child(2n)) {
  margin-right: 4%;
} */

.p-category-secItemName {
    text-align: center;
    font-size: 1.4rem !important;
    color: #191717;
}

@media (min-width: 768px) {
    .p-category-secItemName {
        font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    !important;
        font-size: 1.8rem !important;
    }
}

.p-category-secItemImg {
    margin-bottom: 1vmin !important;
}
.p-category-secItemName{
    margin-bottom: 0.5vmin !important;
}

.img_nenmatsu{
    margin-bottom: 60px !important;
}
@media (max-width: 768px) {
    .img_nenmatsu{
        margin-bottom: 30px !important;
    }
}

/*
===========================================
.p-bnr-list
===========================================
*/
.p-bnr-list {
    display: none;
}

@media (min-width: 768px) {
    .p-bnr-list {
        display: flex;
        justify-content: center;
    }
}

@media (min-width: 768px) {
    .p-bnr-listLink {
        display: block;
    }
}

@media (min-width: 768px) {
    .p-bnr-listWrap {
        margin-bottom: 90px !important;
    }
}

@media (min-width: 768px) {
    .k-momoko .p-bnr-listWrap .p-bnr-list .p-bnr-listItem {
        padding: 0 20px !important;
        width: 33%;
    }
}


/*
===========================================
スライダー
===========================================
*/
@media (min-width: 768px) {
    .k-momoko .thumb-item {
        margin-bottom: 20px;
    }

    /* e2e2e2 */
    .k-momoko .thumb-item-nav {
        display: flex;
        justify-content: center;
        margin-bottom: 100px;
    }

    

    .k-momoko .thumb-item-nav li.slick-current {
        position: relative;
        top: 0;
    }

    .k-momoko .thumb-item-nav .slick-track {
        width: 100% !important;
    }

}

.k-momoko .thumb-item-nav li {
    width: 153px !important;
    margin: 0 5px 10px 5px;
}

/*
.k-momoko .thumb-item-nav li.slick-current::after {
    content: '';
    display: inline-block;
    border: 3px solid #e2e2e2;
    width: 193px;
    height: 84px;
    position: absolute;
    top: 0;
    box-sizing: border-box;
}
*/
.k-momoko .thumb-item {
    margin-bottom: 20px;
    width: auto;
}
@media screen and (max-width: 1135px) {
    .k-momoko .thumb-item-nav li {
        width: 122px !important;
    }
}
@media screen and (max-width: 930px) {
    .k-momoko .thumb-item-nav li {
        width: 98px !important;
    }
}
@media screen and (max-width: 767px) {
    .k-momoko .thumb-item {
        margin-bottom: 20px;
        margin-left: -15px;
        width: 100vw;
    }
}

.k-momoko .thumb-item-nav {
    display: flex;
    justify-content: center;
    margin-bottom: 70px;
}

.k-momoko .thumb-item-nav li.slick-current {
    position: relative;
    top: 0;
}

.k-momoko .thumb-item-nav .slick-track {
    width: 100% !important;
}

@media screen and (max-width: 767px) {
    .k-momoko .thumb-item-nav li {
        width: 85px !important;
        margin: 0 5px 10px 5px;
    }
    
/*
    .k-momoko .thumb-item-nav li.slick-current::after {
        content: '';
        display: inline-block;
        border: 2px solid #e2e2e2;
        width: 85px;
        height: 47px;
        position: absolute;
        top: 0;
        box-sizing: border-box;
    }
    */
}
@media screen and (max-width: 767px) {
    .k-momoko .thumb-item-nav li {
        width: 75px !important;
    }
    .k-momoko .thumb-item-nav {
        display: flex;
        justify-content: center;
        margin-bottom: 30px;
    }
}