@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:700');
*,
*::before,
*::after {
    box-sizing: border-box;
    outline: none;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

select::-ms-expand {
    display: none;
}

::selection {
    background: #fff;
    color: #1a1414;
}

::-moz-selection {
    background: #fff;
    color: #1a1414;
}

/* clearfix */

.cf::after {
    content: "";
    display: block;
    clear: both;
}

.complete_message {
    line-height: 1.6;
}

/*
 * base
 */

/* 縦書き */

.v_write {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
}

/* テキストカット */

.text_cut {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.line-through {
    text-decoration: line-through;
}

/* 変更項目~ */

/**
* common
*/

body {
    background: #1a1414;
    color: #fff;
    font-size: 1.5rem;
    font-family: "Hiragino Mincho ProN", 游明朝, "Yu Mincho", YuMincho, HGS明朝E, メイリオ, Meiryo, serif;
    line-height: 1.4;
}



a,button {
    color: currentColor;
}

a:hover,
.btn:hover {
    text-decoration: none;
    opacity: 0.7;
    transition: all .3s;
}

img {
    width: 100%;
}

a img {
    vertical-align: middle;
}

#contents {
    transition-duration: .3s;
}

@media screen and (max-width:768px) {
    /**
    * common
    */
    body {
        font-size: 15px;
    }


    .fs_14 {
        font-size: 3.75vw;
    }
    .fs_18 {
        font-size: 4.26vw;
    }


}

/* wrap */

.inner_container {
    width: 100%;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
}

@media screen and (max-width:768px) {
    /* wrap */
    .inner_container {
        padding-left: 5.3vw;
        padding-right: 5.3vw;
        width: auto;
        max-width: none;
    }

    .s_inner {
        padding-right: 0;
        padding-left: 0;
    }
}

/* border */

.img_border {
    border: 1px solid #000;
}

/* heading */

.heading {
    font-size: 36px;
    font-family: 'Playfair Display',"Hiragino Mincho ProN", 游明朝, "Yu Mincho", YuMincho, HGS明朝E, メイリオ, Meiryo, serif;
    letter-spacing: 1px;
    line-height: 1.7;
    padding: 220px 0 40px;
    text-align: center;
}

#page_help_about .heading {
    background: url(../img/about/about_heading.jpg) no-repeat center;
    background-size: cover;
    padding: 220px 0 150px;
}

.heading2 {
    font-size: 22px;
    font-family: "Hiragino Mincho ProN", 游明朝, "Yu Mincho", YuMincho, HGS明朝E, メイリオ, Meiryo, serif;
    letter-spacing: 2.5px;
    line-height: 1.8;
}

.heading2 + span {
    display: block;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: .6px;
    margin: 10px 0 30px;
}


.heading3 {
    font-family: 'Playfair Display',"Hiragino Mincho ProN", 游明朝, "Yu Mincho", YuMincho, HGS明朝E, メイリオ, Meiryo, serif;
    font-size: 30px;
    letter-spacing: 6px;
    line-height: 30px;
    margin:0 0 -8px;
    position: relative;
    text-align: left;
    text-transform: uppercase;
    width: auto;
}

.heading4 {
    border-style: solid;
    border-width: 0 0 8px;
    -moz-border-image: url(../img/common/border.png) 8 7 8 8 round;
    -webkit-border-image: url(../img/common/border.png) 8 7 8 8 round;
    -o-border-image: url(../img/common/border.png) 8 7 8 8 round;
    border-image: url(../img/common/border.png) 8 7 8 8 round;
    font-size: 1.4rem;
}

.heading5 {
    font-size: 2rem;
    margin-bottom: 30px;
    padding-left: 29px;
    position: relative;
}

.heading5::before {
    background: #333;
    content: "";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    top: calc(50% - 0.5px);
    width: 15px;
}

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

    .heading {
        font-size: 5.8vw;
        padding: 100px 0 20px;
    }
    #page_help_about .heading {
        background: url(../img/about/about_heading_sp.jpg) no-repeat center;
        background-size: cover;
        padding: 28.6vw 0 23.3vw;
    }
    .heading img {
        max-height: 65px;
    }
    .heading2 {
        font-size: 5.3vw;
        line-height: 1.75;
    }
    .heading2 + span {
        font-size: 3.2vw;
    }
    .heading3 {
        font-size: 5.3vw;
        margin: 0 0 5.6vw;
    }

}

/* breadcrumbs */

.breadcrumb {
    border-top: 1px #140e0e solid;
    font-family: 'Playfair Display',"Hiragino Mincho ProN", 游明朝, "Yu Mincho", YuMincho, HGS明朝E, メイリオ, Meiryo, serif;
    margin: auto;
    max-width: 1200px;
    padding: 40px 0;
}

.breadcrumb_font,
.breadcrumb_font:hover {
    color: #fff;
}

/**
* header
*/

.header_top {
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1000;
}


.header_bottom,
.header_system {
    background: #F9F7F5;
    margin: auto;
    z-index: 999;
}

.header_top .inner_container,
.header_bottom .inner_container,
.header_system .inner_container {
    height: 100px;
}

.logo {
    width: 95px;
}

/* header_category */

#header .header_cate_nav .header_cate {
    background: #fff;
    border-top: 1px solid #d9d9d9;
    border-bottom: 1px solid #d9d9d9;
}

#header .category_nav a {
    border-bottom: 1px solid #e8e8e8;
    color: #fff;
}

#header .category_nav li {
    background: #fff;
}

/* header_nav */

.navbtn {
    cursor: pointer;
    display: block;
    height: 30px;
    overflow: hidden;
    position: relative;
    width: 30px;
}

.navbtn span {
    background: #fff;
    height: 1px;
    left: 0;
    position: absolute;
    top: calc(50% - .5px);
    transition-duration: 1.8s;
    width: 100%;
}

.navbtn span::before,
.navbtn span::after {
    background: #fff;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    transition-duration: 1.8s;
    width: 100%;
}

.navbtn span::before {
    transform: translateY(-10px);
}

.navbtn span::after {
    transform: translateY(10px);
}

.nav_open.navbtn span {
    background: #191313;
    transform: rotate(-405deg);
}

.nav_open.navbtn span::before {
    background: #191313;
    transform: rotate(90deg) translate(-15px, -15px);
    transform-origin: left top;
    width: 12px;
}

.nav_open.navbtn span::after {
    background: #191313;
    transform: rotate(90deg) translate(5px, -15px);
    transform-origin: left top;
    width: 12px;
}


.nav_wrap {
    background: rgba(255, 255, 255, 0.9);
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    height: 100vh;
    letter-spacing: 2px;
    position: fixed;
    right: -25vw;
    top: 0;
    transition-duration: 1.8s;
    width: 18.75vw;
    z-index: 999;
}

.nav_wrap.nav_open {
    right: 0;
}

.nav_list {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 75%;
}

.nav_list li {
    border-bottom: 1px solid #c5b4b4;
}

.nav_list a {
    display: block;
    color: #140e0e;
    padding: 30px 0;
}

#contents.nav_open {
    -webkit-filter: blur(5px);
    filter: blur(5px);
}

.nav_layer {
    cursor: pointer;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: -100;
}

.nav_layer.nav_open {
    z-index: 990;
}

@media screen and (max-width:768px) {
    /**
    * header
    */
    .header_top {
        top: 0;
    }

    .header_top .inner_container,
    .header_bottom .inner_container,
    .header_system .inner_container {
        height: auto;
    }
    .logo {
        width: 12.66vw;
    }
    .nav_wrap {
        right: -50vw;
        width: 50vw;
    }
    .nav_list {
        top: 70px;
        transform: translateY(0);
    }
    .nav_list a {
        padding: 15px 0;
    }

}

/**
* footer
*/

.footer {
    background: #0a0505;
}



.footer_sns_block {
    top: -11px;
    right: 0;
}

.guide_link_wrap {
    top: 10px;
    right: 0;
}

.footer_link,
.footer_link:hover,
.copyright {}

.copyright {
    font-size: 1.4rem;
}

.footer_nav {
    display: flex;
    justify-content: center;
    padding: 40px 0;
}

.footer_nav_border {
    border-right: 1px dotted rgba(255, 255, 255, .7);
    line-height: 16px;
    padding: 3px 20px;
}

.footer_nav_border:nth-child(5) {
    border-right: none;
}

.footer_guide_block {
    /*background: #eee;*/
}

.guide_list_wrap {
    margin-left: -20px;
}

.guide_list {
    width: 31%;
    line-height: 2.2;
}

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

    /* drawer */
    .searchform {
        background: #ebebeb;
    }

    .search_input {
        border-bottom: 1px solid #ccc;
    }

    /**
    * footer
    */
    .footer_nav {
        flex-wrap: wrap;
        font-size: 3.2vw;
        margin: auto;
        padding: 20px 0;
        width: 80%;
    }
    .footer_nav_border {
        margin: 2rem 0;
        padding: 0 4vw;
    }
    .footer_nav_border:nth-child(3),
    .footer_nav_border:nth-child(5) {
        border-right: none;
    }
    .footer_fb {
        font-size: 3.2vw;
        margin: 1.7rem 0;
        width: 1rem;
    }
    .copyright {
        font-size: 2.6vw;
    }

}

/**
* ブロック
*/

/* お知らせ */

.news_block {}

.info_heading {
    background: url(../img/top/info_bg.gif) repeat;
    width: 100%;
}

.info_heading span {
    display: block;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    font-size: 3.6rem;
    letter-spacing: 2.6px;
    margin: 0 auto;
    max-width: 1200px;
    padding: 66px 0;
    text-align: left;
}


.newslist {
    background: #f1eded;
    color: #1a1414;
    font-size: 1.4rem;
    margin-top: -40px;
    padding: 35px 40px;
}

.newslist a {
    color: #1a1414;
}


.news_more {
    background: #1a1414;
}

.shop_info {
    background: url(../img/top/info_bg.gif) repeat;
    padding: 30px;
    /* width: 640px; */
    width: 100%;
    justify-content: space-evenly;
}

.shop_info dt {
    font-size: 1.4rem;
    line-height: 1.7;
}

.shop_info dd {
    font-size: 1.2rem;
    line-height: 2;
    margin-bottom: 2rem;
}

@media screen and (max-width:768px) {
    .info_heading span {
        font-size: 5.86vw;
        padding: 13.3vw 5.3vw;
    }
    .newslist {
        font-size: 3.73vw;
        margin-top: -2.6vw;
        padding: 8vw 5.3vw;
    }
    .shop_info {
        padding: 10.6vw 0;
        width: 100%;
    }

    .shop_info dt {
        font-size: 3.73vw;
    }

    .shop_info dd {
        font-size: 3.2vw;
    }
}



/**
* トップ
*/

/* メインイメージ */



.point {
    background: #140e0e;
    background: -moz-linear-gradient(left, #140e0e 0%, #140e0e 50%, transparent 50%);
    background: -webkit-linear-gradient(left, #140e0e 0%, #140e0e 50%, transparent 50%);
    background: linear-gradient(to right, #140e0e 0%, #140e0e 50%, transparent 50%);
    padding: 110px 0;
}

.point_text {
    left: 50px;
    line-height: 2;
    top: 50%;
    transform: translateY(-50%);
}

.topcontent_wrap {
    width: 100%;
}

h2.topcontent > span:first-child {
    display: block;
    font-size: 2.4rem;
    letter-spacing: 2.6px;
    margin-bottom: 10px;
}

h2.topcontent > span:nth-child(2) {
    display: block;
    font-size: 3.4rem;
    letter-spacing: 2.6px;
    margin-bottom: 10px;
}

h2.topcontent > span:nth-child(3) {
    display: block;
    font-size: 1.4rem;
    letter-spacing: .6px;
}

h2.topcontent {
    margin-top: 100px;
}

h2.topcontent.visible_effect::after {
    animation: topcontent 1s 2s 1 forwards;
    background: #fff;
    content: "";
    display: block;
    height: 0;
    margin-bottom: 180px;
    left: 50%;
    position: relative;
    top: 30px;
    width: 1px;
}

@keyframes topcontent {
    0% {
        height: 0;
        margin-bottom: 180px;
    }
    100% {
        height: 100px;
        margin-bottom: 80px;
    }
}

.topcontent_photo {
    width: 50vw;
}

.topcontent_photo_bg {
    background: #140e0e;
    bottom: 0;
    position: absolute;
    z-index: -1
}

.topcontent_text {
    line-height: 2;
    margin: 0 auto;
    text-align: justify;
    width: 420px;
}

.topcontent_01 {
    height: 37.969vw;
    margin-bottom: 60px;
    position: relative;
}

.topcontent_01 .topcontent_inner.visible_illust {
    background: url(../img/top/smoke_01_illust.svg) no-repeat;
    background-position: calc(50vw + 50vw / 2) 80%;
    background-size: 294px 217px;
    width: 100%;
}

.topcontent_01 .topcontent_photo_bg {
    height: 18.75vw;
    right: calc(50% - 3.125vw);
    width: 31.25vw;
}

.topcontent_02 {
    height: 35.7vw;
    margin-bottom: 60px;
    position: relative;
}

.topcontent_02 .topcontent_inner.visible_illust {
    background: url(../img/top/smoke_02_illust.svg) no-repeat;
    background-position: calc((50vw - 420px)/4) bottom;
    background-size: 264px 181px;
    width: 100%;
}

.topcontent_02 .topcontent_photo_bg {
    height: 21.31vw;
    left: calc(50% - 3.75vw);
    width: 18.75vw;
}

.topcontent_03 {
    height: 36.48vw;
    margin-bottom: 60px;
    position: relative;
}

.topcontent_03 .topcontent_inner.visible_illust {
    background: url(../img/top/smoke_03_illust.svg) no-repeat;
    background-position: calc(50vw + 50vw / 2) bottom;
    background-size: 247px 223px;
    width: 100%;
}

.topcontent_03 .topcontent_photo_bg {
    height: 15.63vw;
    right: calc(50% - 3.125vw);
    width: 23.44vw;
}


@media screen and (max-width:1281px) {
    .topcontent_01 .topcontent_inner.visible_illust,
    .topcontent_03 .topcontent_inner.visible_illust {
        background-position: right bottom;
    }
    .topcontent_02 .topcontent_inner.visible_illust {
        background-position: left bottom;
    }
    .topcontent_01,
    .topcontent_02,
    .topcontent_03 {
        height: auto;
        margin-bottom: 8.6vw;
    }}

@media screen and (max-width:768px) {
    h2.topcontent {
        margin-top: 13.3vw;
    }
    h2.topcontent span:first-child {
        font-size: 4.5vw;
        margin-bottom: 5.3vw;
    }
    h2.topcontent span:nth-child(2) {
        font-size: 5.86vw;
        margin-bottom: 5.3vw;
    }
    h2.topcontent span:nth-child(3) {
        font-size: 3.2vw;
    }
    h2.topcontent::after {
        height: 75px;
    }
    .topcontent_photo {
        width: 100vw;
    }
    .topcontent_text {
        padding: 10.6vw 5.3vw 0;
        width: 100%;
    }

    .topcontent_01 .topcontent_inner.visible_illust,
    .topcontent_02 .topcontent_inner.visible_illust,
    .topcontent_03 .topcontent_inner.visible_illust {
        background-position: right bottom;
        padding-bottom: 15vw;
    }
    .topcontent_01 .topcontent_inner.visible_illust {
        background-size: 39.3vw 28.93vw;
    }
    .topcontent_02 .topcontent_inne.visible_illustr {
        background-size: 35.6vw 24.8vw;
    }
    .topcontent_03 .topcontent_inner.visible_illust {
        background-size: 32.93vw 28.6vw;
    }
}

.message_heading {
    background: url(../img/top/message.jpg) no-repeat center;
    background-size: cover;
    width: 100%;
}

.message_heading span {
    display: block;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    font-size: 3.6rem;
    letter-spacing: 2.6px;
    margin: 0 auto;
    max-width: 1200px;
    padding: 186px 0;
    text-align: left;
}

.message_inner {
    background: #140e0e;
    display: flex;
    justify-content: space-between;
    margin-top: -50px;
    padding: 100px 60px;
}

.message_text p {
    line-height: 2.8;
}



.product_heading {
    background: url(../img/top/products.jpg) no-repeat center top;
    background-size: cover;
    background-attachment: fixed;
    margin-bottom: 100px;
    width: 100%;
}

.product_heading span {
    display: block;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    font-size: 3.6rem;
    letter-spacing: 2.6px;
    margin: 0 auto;
    max-width: 1200px;
    padding: 186px 0;
    text-align: left;
}

.product_heading::after {
    background: #fff;
    bottom: -50px;
    content: "";
    display: block;
    height: 80px;
    left: 50%;
    position: relative;
    width: 1px;
}

.product_list_block .product_list {
    border-left: none;
    border-top: none;
    margin: 0 0 65px;
    width: 30%;
}


.product_list {
    margin-bottom: 50px;
}

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

    .message_heading span,
    .product_heading span {
        font-size: 5.86vw;
        padding: 13.3vw 5.3vw;
    }
    .message_inner {
        flex-wrap: wrap-reverse;
        margin: -.75vw 5.3vw 0;
        padding: 10.6vw 5.3vw;
    }
    .message_photo {
        margin: 0 auto 8vw;
        width: 61.3vw;
    }
    .message_text {
        font-size: 3.2vw;
        line-height: 2.5;
    }
    .point {
        background: none;
        padding: 13.3vw 0;
    }
    .point_text {
        left: 0;
        padding: 0 5.3vw 13.3vw;
        top: 0;
        transform: none;
    }
    .product_heading {
        background: url(../img/top/products_sp.jpg) no-repeat;
        background-attachment: initial;
        background-size: cover;
        position: relative;
    }

    .product_heading::after {
        position: absolute;
    }
    .product_list_block {
        padding: 0;
    }
    .product_list_block .product_list {
        margin: 0 0 30px;
        width: 42.6vw;
    }
}


/*表示エフェクト*/

.img_effect {
    opacity: 0;
}

.text_effect {
    position: relative;
}
.text_effect::before {
    background: #1a1414;
    content: "";
    height: 100%;
    position: absolute;
    transform-origin: right;
    width: 100%;
    z-index: 2;
}
.text_effect.effect_start::before {
    animation: txt_e 1.6s 1.3s 1 forwards;
}
.point .text_effect.effect_start::before {background: #140e0e;}
@keyframes txt_e {
    0% {
        transform: scaleX(1);
    }
    100% {
        transform: scaleX(0);
    }
}

.heading2 + span span {
    font-weight: bold;
}

@keyframes opa {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.slideup_effect {
    opacity: 0;
    transform: translateY(50px);
    transition-delay: 1s;
    transition-duration: 1.3s;
}

.visible_effect {
    opacity: 1;
}

.img_effect.visible_effect {
    -webkit-mask: url(../img/top/smoke.png);
    mask: url(../img/top/smoke.png);
    -webkit-mask-size: 1800% 100%;
    mask-size: 1800% 100%;
    -webkit-animation: mask-play 1.3s steps(17) forwards;
    animation: mask-play 1.3s steps(17) forwards;

}

@-webkit-keyframes mask-play {
    from {
        -webkit-mask-position: 100% 0;
        mask-position: 100% 0;
    }
    to {
        -webkit-mask-position: 0% 0;
        mask-position: 0% 0;
    }
}

@keyframes mask-play {
    from {
        -webkit-mask-position: 100% 0;
        mask-position: 100% 0;
    }
    to {
        -webkit-mask-position: 0% 0;
        mask-position: 0% 0;
    }
}



.slideup_effect.visible_effect {
    overflow: hidden;
    position: relative;
    transform: translateY(0);
}


@media screen and (max-width:768px) {
    .slideup_effect {
        transition-delay: .3s;
    }
.point .text_effect.effect_start::before {background: #1a1414;}
}

/**
* 商品一覧
*/

/**
* 商品詳細
*/

.product_tag_list {
    margin-right: 5px;
    padding: 4px 7px;
    background: #000;
    border-radius: 5px;
    color: #fff;
}

.freearea {
    border: 1px #fff solid;
    margin: 40px 0;
}
.freearea dl {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    padding: 20px 40px;
}
.freearea dt,.freearea dd {
    border-bottom: 1px #fff solid;
    padding: 20px 0;
}
.freearea dt:last-of-type,.freearea dd:last-of-type {
    border-bottom: none;
}
.freearea dt {
    width: 25%;
}
.freearea dd {
    width: 75%;
}

@media screen and (max-width:768px) {
    .freearea dl {
        padding: 10px 20px;
    }
    .freearea dt {
        width: 100%;
    }
    .freearea dt:last-of-type {
        border-bottom: 1px #fff solid;
    }
    .freearea dd {
        border-bottom: none;
        width: 100%;
    }
}

/* 関連商品 */

.related_product_block {
    margin-bottom: 40px;
    padding-top: 20px;
    padding-bottom: 20px;
    background: #eee;
}

/* レビュー */

.product_review_block {
    margin-bottom: 10px;
    padding-top: 20px;
    padding-bottom: 35px!important;
    background: #140e0e;
}

#product_review_recommend_level {
    line-height: 1.8;
}

/**
* マイページ
*/

/* メニュー */

.mypage_nav_border1 {
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
}

.mypage_nav_border2 {
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.mypage_nav_color {
    color: #333;
}

.mypage_nav_list .active,
.mypage_nav_list:hover .active {
    color: #de5d50;
}

.maypage_history_bg {
    background: #1a1414;
}

.maypage_login_bg {
    background: #1a1414;
}

/**
* カート
*/

.cart_head_bg {
    background: #140e0e;
}
/* Cart > index.twig css変更分 2018-04-24 */



.cart_item .product_img {
    max-width: 80px;
    margin: 0;
}

.cart_item .product_name {
    margin-bottom: 0;
}

.cart_item .product_price {
    text-align: center;
    font-weight: bold;
    margin-bottom: 0;
}

.cart_item .icon_cart_remove::before,
.cart_item .icon_cart_remove::after {
    content: "";
    display: block;
    position: absolute;
    top: calc(50% - 2px);
    left: calc(50% - 14px);
    width: 28px;
    height: 4px;
    background: #dedede;
}

.cart_item .icon_cart_remove::before {
    transform: rotate(45deg);
}

.cart_item .icon_cart_remove::after {
    transform: rotate(135deg);
}
/* お届け先の複数指定 */

.shipping_multiple_bg {
    background: #f4f4f4;
}



/* ~変更項目 */

/**
* base
*/

/**
* text color
*/

.text_default {
    color: #fff;
}

.text_primary {
    color: #de5d50
}

.text_success {
    color: #18a689;
}

.text_info {
    color: #31708f;
}

.text_warning {
    color: #9a947e;
}

.text_danger {
    color: #de5d50;
}

.text_link {
    color: #0092c4;
}

/**
* bg color
*/

.bg_default {
    color: #333;
    background-color: #fff;
}

.bg_primary {
    color: #fff;
    background-color: #de5d50;
}

.bg_primary-border {
    color: #de5d50;
    border: 2px solid #de5d50;
    background: #fff;
}

.bg_success {
    background-color: #dff0d8;
}

.bg_success-border {
    color: #c93329;
    border: 2px solid #c93329;
    background: #fff;
}

.bg_info {
    background-color: #d9edf7;
}

.bg_warning {
    background-color: #fcf8e3;
}

.bg_danger {
    color: #fff;
    background-color: #f99;
}

/**
* button
*/

.btn {
    display: inline-block;
    width: 100%;
    padding: 10px 16px;
    border: 1px solid transparent;
    font-size: 1.6rem;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    box-sizing: border-box;
    line-height: 1.4;
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn,
.btn.disabled:hover,
.btn[disabled]:hover,
fieldset[disabled] .btn:hover,
.btn.disabled:focus,
.btn[disabled]:focus,
fieldset[disabled] .btn:focus,
.btn.disabled:active,
.btn[disabled]:active,
fieldset[disabled] .btn:active,
.btn.disabled.active,
.btn[disabled].active,
fieldset[disabled] .btn.active {
    opacity: 0.5;
}

.btn_default,
.btn_common {
    color: #fff;
    background-color: #f5f7f8;
    border-color: #d7dadd;
}

.btn_primary,
.btn_add {
    color: #fff;
    background-color: #ad2b24;
    border-color: #ad2b24;
}

.btn_success {
    color: #fff;
    background-color: #c93329;
    border-color: #c93329;
}

.btn_info,
.btn_review {
    display: block;
    color: #fff;
    background-color: #0a0505;
    border-color: #0a0505;
}

.btn_warning {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #f0ad4e;
}

.btn_danger,
.btn_soldout {
    color: #fff;
    background-color: #d9534f;
    border-color: #d9534f;
}

.btn_link {
    font-weight: normal;
    background-color: #d2df76;
    color: #fff;
    cursor: pointer;
    border-radius: 0;
}

.btn_search {
    color: #fff;
    background: #666;
}

.btn_circle {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 25px;
    height: 25px;
    background: #b8bec4;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
}

.btn_other {
    width: auto;
    padding: 10px;
    color: #fff;
    background-color: #333;
    border-color: #222;
    font-size: 1.4rem;
    font-weight: normal;
}

/*product_link*/

.product_link {
    border: 1px #c5b4b4 solid;
    box-sizing: border-box;
    color: #fefefe;
    display: block;
    font-size: 1.8rem;
    height: 50px;
    line-height: 46px;
    margin: auto;
    padding: 0;
    position: relative;
    text-align: center;
    width: 90%;
}

.product_link .inner_border {
    box-sizing: border-box;
    display: block;
    height: 50px;
    left: -0.5px;
    position: absolute;
    top: -0.5px;
    width: 100%;
    z-index: 2;
}

.product_link::before,
.product_link::after,
.product_link .inner_border::before,
.product_link .inner_border::after {
    background: #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    transition-duration: 1s;
    width: 0;
    z-index: 3;
}

.product_link::before {
    height: 1px;
    right: -1px;
    top: -1px;
}

.product_link:hover::before {
    width: 100%;
}

.product_link::after {
    bottom: -1px;
    height: 1px;
    right: -1px;
    transition-delay: .1s;
}

.product_link:hover::after {
    width: 100%;
}

.product_link .inner_border::before {
    right: -1.5px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.product_link:hover .inner_border::before {
    height: 50px;
}

.product_link .inner_border::after {
    left: -1px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.product_link:hover .inner_border::after {
    height: 50px;
}

.product_link .outer_border {
    border: 1px #c5b4b4 solid;
    box-sizing: border-box;
    height: 50px;
    left: -4px;
    line-height: 50px;
    padding: 0;
    position: absolute;
    top: -4px;
    width: calc(100% + 2px);
}

.product_link .outer_border span {
    box-sizing: border-box;
    display: block;
    height: 50px;
    left: -0.5px;
    position: absolute;
    top: -0.5px;
    width: 100%;
    z-index: 2;
}

.product_link .outer_border::before,
.product_link .outer_border::after,
.product_link .outer_border span::before,
.product_link .outer_border span::after {
    background: #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    transition-duration: 1s;
    width: 0;
    z-index: 3;
}

.product_link .outer_border::before {
    height: 1px;
    left: -1px;
    top: -1px;
}

.product_link .outer_border:hover::before {
    width: 100%;
}

.product_link .outer_border::after {
    bottom: -1px;
    height: 1px;
    left: -1px;
    transition-delay: .1s;
}

.product_link .outer_border:hover::after {
    width: 100%;
}

.product_link .outer_border span::before {
    right: -1.5px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.product_link .outer_border:hover span::before {
    height: 50px;
}

.product_link .outer_border span::after {
    left: -1px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.product_link .outer_border:hover span::after {
    height: 50px;
}

.blank_link {

    display: none;
}

/**
* form
*/

label {
    font-weight: normal;
}

input:focus,
select:focus {
    outline: none;
}

input[type="number"] {
    text-align: right;
}

.form-group .errormsg {
    margin-top: 3px;
    font-size: 12px;
    font-size: 1.2rem;
    font-weight: bold;
}

dd.form-group .errormsg {
    margin-bottom: 0;
}

.form-control {
    background: #fff;
    border: 1px solid #C4CCCE;
    border-radius: 3px !important;
    box-shadow: none;
    font-size: 16px;
    font-size: 1.6rem;
    height: 40px;
    padding: 6px 12px;
    width: auto;
    line-height: 1.5;
    box-sizing: border-box;
}

.form-control:focus {
    border-color: #3c8dbc !important;
    box-shadow: none
}

.has-success .form-control:focus,
.has-warning .form-control:focus,
.has-error .form-control:focus {
    box-shadow: none;
    background: none;
}

.has-success .form-control {
    border-color: #0d8969;
    background: #e7f6f3;
}

.has-warning .form-control {
    border-color: #e99133;
    background: #fdf7ed;
}

.has-error .form-control {
    border-color: #cf3f34;
    background: #fdf1f0;
}

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline {
    color: inherit;
    background: #fdf1f0;
}

.form-control::-moz-placeholder {
    color: #bbb;
    opacity: 1
}

.form-control:-ms-input-placeholder {
    color: #bbb
}

.form-control::-webkit-input-placeholder {
    color: #bbb
}

.form-control:not(select) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #666;
}

.form-group .form-control {
    width: 100%;
}

.form-inline .form-control {
    width: auto;
}

.form-group.lange input[type="text"],
.form-group.lange label {
    display: inline-block;
    margin-bottom: 0;
    margin-left: 1%;
    margin-right: 1%;
    vertical-align: middle;
}

.form-group.lange input[type="text"] {
    width: 28%;
}

.input_tel input {
    display: inline-block;
    margin-bottom: 0;
    margin-left: 1px;
    margin-right: 1px;
    max-width: 5em;
    vertical-align: middle;
    width: 30%;
}

.form-group.input_tel input:first-child {
    margin-left: 0;
}

.form-group.input_name {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    justify-content: space-between;
}

.form-group.input_name input {
    display: block;
    margin-bottom: 0;
    vertical-align: middle;
    width: 48%;
}

.form-group.input_name input:first-child {
    margin-left: 0;
}

.form-group.input_zip input {
    display: inline-block;
    margin-left: 1%;
    margin-right: 1%;
    max-width: 5em;
    vertical-align: middle;
    width: 30%;
}

.form-group.input_zip .question-circle {
    font-size: 11px;
    display: inline-block;
    width: 15px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    vertical-align: middle;
    background: #fff;
    border-radius: 50%;
    color:#333;
}

.form-group.input_zip .question-circle .cb-question {
    fill: #fff;
}

.form-group .item_price input,
.form-group .item_quantity input {
    margin: 0 1%;
    text-align: right;
    width: 50%;
}

.form-inline label {
    margin: 0 10px 0 0;
}

.form-inline label:first-child + select,
.form-inline label:first-child + input {
    margin-right: 10px;
}

.form-inline .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: top;
}

.checkbox-inline,
.radio-inline {
    cursor: pointer;
    margin-left: 20px;
}

.checkbox-inline:first-child,
.radio-inline:first-child {
    margin-left: 0;
}

span.required {
    color: #DE5D50;
    font-weight: normal !important;
    margin-left: 1em;
    font-size: 12px;
    font-size: 1.2rem;
}

#entry_birth select {
    margin: 0 8px;
}

#entry_birth select:first-child {
    margin-left: 0;
}

#entry_sex .radio {
    display: inline-block;
    margin-right: 10px;
}

#entry_sex .radio input[type="radio"] {
    position: relative;
    -webkit-appearance: button;
    appearance: button;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    content: "";
    background-color: #FFFFFF;
    border: 1px solid #999999;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    vertical-align: middle;
    cursor: pointer;
}

#entry_sex .radio input[type="radio"]:checked:after {
    display: block;
    position: absolute;
    top: 3px;
    left: 3px;
    content: "";
    width: 12px;
    height: 12px;
    background: #0c0144;
    -webkit-border-radius: 12px;
    border-radius: 12px;
}

.form_wrap .form-group:not(:first-child) {
    padding-top: 16px;
}

.form_wrap .zip-search {
    margin: 16px 0;
}

/* メルマガ */

#entry_mailmaga_flg .radio {
    display: inline-block;
    margin-right: 10px;
}

/**
* list
*/

.list_wrap {
    -webkit-display: flex;
    -ms-display: flex;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
}

.list2 {
    width: 48%;
    margin-right: 4%;
    box-sizing: border-box;
}

.list2:nth-child(2n) {
    margin-right: 0;
}

.list3 {
    width: 31%;
    margin-right: 3.5%;
    box-sizing: border-box;
}

.list3:nth-child(3n) {
    margin-right: 0;
}

.list4 {
    width: 22%;
    margin-right: 4%;
    box-sizing: border-box;
}

.list4:nth-child(4n) {
    margin-right: 0;
}

.list5 {
    width: 16.8%;
    margin-right: 4%;
    box-sizing: border-box;
}

.list5:nth-child(5n) {
    margin-right: 0;
}

.list6 {
    width: 13.75%;
    margin-right: 3.5%;
    box-sizing: border-box;
}

.list6:nth-child(6n) {
    margin-right: 0;
}

/**
* pagination
*/

.pagination {
    width: 95%;
    margin: 16px auto;
    position: relative;
    clear: both;
}

.pagination ul {
    list-style-type: none;
    margin: 0 auto;
    padding: 1em 0;
    text-align: center;
}

.pagination ul li {
    display: inline-block;
    min-width: 29px;
    padding: 0 3px 0 2px;
    text-align: center;
    position: relative;
}

.pagination ul li a {
    color: #fff;
    display: block;
    line-height: 1.8;
    padding: 5px 1em;
    text-decoration: none;
}

.pagination ul li a:hover,
.pagination ul li a:focus {
    background: #f1f1f1;
}

.pagination ul li.active a {
    background: #F3F3F3;
    text-decoration: none;
}

.pagination ul li.active a:hover,
.pagination ul li.active a:focus {
    background: #F3F3F3;
}

.pagination ul li.disabled a {
    color: #9797A0;
    text-decoration: none;
}

.pagination ul li.disabled a:hover,
.pagination ul li.disabled a:focus {
    color: #9797A0;
}

/**
* common
*/

#svgicon {
    display: block;
    width: 0;
    height: 0;
    overflow: hidden;
}

.textarea textarea {
    width: 100%;
    height: 6em;
}

/**
* header
*/

/* カレンダー */

/* #calendar {
    margin-bottom: 20px;
    margin-top: 50px;
} */

.calendar_title {
    font-weight: bold;
    padding-left: 10px;
}

/* #calendar table {
    margin-top: 10px;
    padding: 0;
    border-collapse: collapse;
    width: 100%;
} */

.calendar table {
    border-bottom: 1px #fff solid;
    width: 100%;
}

.calendar tr {
    text-align: center;
}

.calendar td {
    font-size: 1.4rem;
    padding: 9px 0;
    text-align: center;
}

.calendar .holiday {
    background: #c93329;
    color: #fff;
}

.calendar .holiday_red {
    background: #c93329;
    color: #fff;
}

.calendar_heading {
    font-size: 1.6rem;
    margin-bottom: 16px;
}

.calendar thead {
    border-bottom: 1px #fff solid;
    border-top: 1px #fff solid;
    font-size: 1.4rem;
}

.calendar thead th {
    padding: 15px 12px;
}

@media screen and (max-width:768px) {
    .calendar table {
        margin-bottom: 40px;
    }
    .calendar_heading {
        font-size: 4.26vw;
        margin-bottom: 4vw;
    }
    .calendar thead {
        font-size: 3.73vw;
    }
    .calendar thead th {
        padding: 4vw 0;
    }
    .calendar td {
        font-size: 3.73vw;
        padding: 2.63vw 2.68vw;
    }
}

/**
* ブロック
*/

/* お知らせ */

.newslist {
    line-height: 1.7;
}

.news_more {
    top: 50%;
    transform: translateY(-50%);
    right: 16px;
}

.news_more_icon {
    transition: all .3s;
}

.newslist .active .news_more_icon {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

/**
* TOP
*/

/*loading*/

.loading {
    background: url(../img/common/bg_loading.svg) #5E4947;
    height: 100vh;
    left: 0;
    position: fixed;
    top: 0;
    transition-duration: 2s;
    width: 100vw;
    z-index: 3000;
}


/* slider */

.main_slider .slick-loading .slick-list {
    background: #fff url('ajax-loader.gif') center center no-repeat;
}

.main_slider .slick-slide img {
    width: 95%;
    height: auto;
    margin: auto;
}

/* Arrow */

.slick-prev,
.slick-next {
    position: absolute;
    top: -160px;
    width: 40px;
    height: 40px;
    font-size: 0;
    line-height: 40px;
}

.slick-prev {
    left: 18%;
}

.slick-next {
    right: 18%;
}

/* Dotted */

.slick-dots {
    position: absolute;
    bottom: -30px;
    display: block;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 20px;
    height: 20px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
    outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
    opacity: 1;
}

.slick-dots li button:before {
    content: " ";
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 12px;
    height: 12px;
    text-align: center;
    opacity: .25;
    background-color: black;
    border-radius: 50%;

}

.slick-dots li.slick-active button:before {
    opacity: .75;
    background-color: black;
}

.slick-dots li button.thumbnail img {
    width: 0;
    height: 0;
}

/**
* 商品一覧
*/

.product_img {
    display: block;
    margin-bottom: 30px;
    overflow: hidden;
}

.product_img img {
    transition-duration: .6s;
}

.product_img:hover {
    opacity: 1;
}

.product_img:hover img {
    transform: scale(1.15);
}

.product_comment {
    font-size: 1.2rem;
    margin-bottom: 15px;
}

.product_name {
    display: inline-block;
    font-size: 16px;
    /* height: 4rem; */
    margin-bottom: 10px;
}

.product_code {
    display: inline-block;
    font-size: 12px;
    margin-bottom: 10px;
}

.product_price {
    font-size: 16px;
    margin-bottom: 30px;
    text-align: right;
}


@media screen and (max-width:768px) {
    .product_comment {
        font-size: 3.2vw;
        margin-bottom: 10px;
    }

    .product_name {
        display: block;
        font-size: 3.73vw;
        /* height: 3.6em; */
        margin-bottom: 20px;
    }

    .product_code {
        display: block;
        font-size: 3.125vw;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .product_price {
        font-size: 4.3vw;
    }
}



/**
* 商品詳細
*/

.product_detail .slick-slide img {
    display: block;
    margin: auto;
}

.product_detail .slick-initialized .slick-slide {
    height: auto;
}
.product_detail_content {
    margin-bottom: 80px;
}
.detail_img .slick-dots {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 20px;
}

.detail_img .slick-dots li {
    width: 18%;
    margin-right: 2.5%;
    box-sizing: border-box;
}

.detail_img .slick-dots li:nth-child(5n) {
    margin-right: 0;
}

.product_detail .form-control {
    width: 100%;
}

.prduct_detail_description,
.prduct_list_description {
    line-height: 2;
}

/* 関連商品 */

/* レビュー */

.review_more {
    top: 17px;
    right: 20px;
}

.review_icon {
    transition: all .3s;
}

.active .review_icon {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.product_review_page textarea {
    vertical-align: top;
}

.product_review_page #product_review_sex .radio {
    display: inline-block;
    margin-right: 10px;
}

.product_review_page #product_review_sex .radio input[type="radio"] {
    margin-right: 10px;
}

/**
* マイページ
*/

.mypage_delivery .address,
.mypage_history .adoress,
.mypage_history .history {
    line-height: 1.2;
}

/* 会員登録内容変更 */

.mypage_formarea dl {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px dotted #ccc;
}

/* お届け先編集 */

.mypage_delivery .btn_common {
    padding: 10px;
}

/* お気に入り一覧 */

.favorite_delete {
    top: 10px;
    right: 10px;
}

/* ご注文履歴詳細 */

.mypage_history .product_img {
    max-width: 80px;
    max-height: 96px;
}

/* 退会手続き */

.withdraw_text {
    line-height: 1.7;
}

/**
* 新規会員登録
*/

.entry_formarea dl {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px dotted #ccc;
}

/**
* カート
*/

/* 購入フロー */

.flowline {
    position: relative;
    margin: 0;
    padding: 8px 0 16px;
}

.flowline ul {
    display: flex;
    position: relative;
    margin: 0 auto;
}

.flowline ul::before {
    content: "";
    height: 4px;
    background: #fff;
    position: absolute;
    top: 20px;
    margin: 0;
    border-radius: 2px;
    z-index: 0;
    color: #333;
}

.flowline.step3 ul {
    max-width: 450px;
}

.flowline.step3 ul::before {
    width: 66.66666666%;
    left: 16.6666666%;
}

.flowline.step4 ul {
    max-width: 550px;
}

.flowline.step4 ul::before {
    width: 75%;
    left: 12.5%;
}

.flowline ul li {
    position: relative;
    text-align: center;
    white-space: nowrap;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
    z-index: 1;
}

.flowline.step3 ul li {
    width: 33.33333333333333%;
}

.flowline.step4 ul li {
    width: 25%;
}

.flowline li .flow_number {
    line-height: 42px;
    width: 42px;
    height: 42px;
    margin-bottom: 5px;
    font-size: 20px;
    font-size: 2rem;
    background: #fff;
    color: #333;
    top: 0;
    left: 18px;
    display: inline-block;
    margin-bottom: 5px;
    text-align: center;
    vertical-align: middle;
    border-radius: 50%;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Arial", "Meiryo", sans-serif;
}

.flowline li.active {
    color: #c93329;
}

.flowline li.active .flow_number {
    background: #c93329;
    color: #fff;
}

.cart_item .product_img {
    max-width: 80px;
    margin: 0;
}

.cart_item .product_price {
    text-align: left;
    font-weight: bold;
}

/* お客様情報 */

.shopping_form .btn_edit {
    position: absolute;
    top: 0;
    right: 0;
}

.customer_detail input {
    border: 1px solid #ddd;
    margin: 3px;
    padding: 5px;
}

/* お届け先の複数指定 */

.shipping_multiple_item .product_img {
    max-width: 200px;
}

/**
* アバウト
*/

.about {
    line-height: 1.7;
}



.help_about_box {
    margin-left: auto;
    width: 880px;
}

.help_about_box dl {
    border-top: 1px #fff solid;
    padding: 40px 0;
}

.help_about_box dl:last-child {
    border-bottom: 1px #fff solid;
}

.about_text {
    line-height: 2;
}
.about_profile {
    margin-bottom: 100px;
}
.profile_photo {
    margin-left: 20px;
    max-width: 460px;
    width: 100%;
}
.profile_text {
    margin-left: auto;
    width: 680px;
}
.about_outline {
    background: #140e0e;
    padding: 100px 0;
}
.about_map {
    padding-top: 100px;
    padding-bottom: 100px;

}
.map_wrap {
    height: 495px;
    margin-left: auto;
    width: 880px;
}
@media screen and (max-width:768px) {
    .help_about_box,.profile_text,.map_wrap  {
        margin: 0;
        width: 100%;
    }
    .help_about_box dl {
        padding: 5.3vw 0;
    }
    .about_profile {
        margin-bottom: 13.3vw;
    }
    .profile_photo {
        margin-left: auto;
        margin-right: auto;
        max-width: 61.3vw;
        width: 100%;
    }
    .profile_text {
        margin-top: 30px;
    }
    .about_outline,.about_map {
        padding-bottom: 13.3vw;
        padding-top: 13.3vw;
    }
    .map_wrap {
        height: 50.2vw;
    }

}

/* 問合わせ */

@media screen and (max-width:768px) {
    /**
    * list
    */
    .list_wrap .list2,
    .list_wrap .list3,
    .list_wrap .list4,
    .list_wrap .list5,
    .list_wrap .list6 {
        margin-right: auto;
    }

    .s_list1 {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 15px;
    }

    .s_list1:last-child {
        margin-bottom: 0;
    }

    .s_list2 {
        width: 48%;
        margin-left: 4%;
        box-sizing: border-box;
    }

    .s_list2:nth-child(2n + 1) {
        margin-left: 0;
    }

    .s_list3 {
        width: 31%;
        margin-left: 3.5%;
        box-sizing: border-box;
    }

    .s_list3:nth-child(3n + 1) {
        margin-left: 0;
    }

    .s_list4 {
        width: 22%;
        margin-left: 4%;
        box-sizing: border-box;
    }

    .s_list4:nth-child(4n + 1) {
        margin-left: 0;
    }

    .s_list5 {
        width: 16.8%;
        margin-left: 4%;
        box-sizing: border-box;
    }

    .s_list5:nth-child(5n + 1) {
        margin-left: 0;
    }

    .s_list6 {
        width: 13.75%;
        margin-left: 3.5%;
        box-sizing: border-box;
    }

    .s_list6:nth-child(6n + 1) {
        margin-left: 0;
    }

    /**
    * btn
    */
    .btn_search {
        color: #333;
        background: none;
    }
    .product_link {
        font-size: 3.73vw;
        height: 10.6vw;
        line-height: 10.6vw;
    }
    .product_link .inner_border,
    .product_link:hover .inner_border::before,
    .product_link:hover .inner_border::after,
    .product_link .outer_border,
    .product_link .outer_border span,
    .product_link .outer_border:hover span::before,
    .product_link .outer_border:hover span::after {
        height: 10.6vw;
    }



    /* drawer */
    .drawer,
    .drawer_02 {
        position: fixed;
        top: 50%;
        left: 0;
        width: 100%;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        z-index: -1;
        visibility: hidden;
        transition: visibility 0.3s, top .3s;
        transform: translateY(-50%);
    }



    .drawer_open .drawer {
        visibility: visible;
        z-index: 3;
    }

    .drawer_open_02 .drawer_02 {
        right: 0;
        height: 100%;
        visibility: visible;
    }

    #contents,
    #header,
    #footer,
    .pagetop {
        transition: transform 0.3s;
    }

    .drawer_open,
    .drawer_open_02 {
        z-index: 1;
    }

    /*
    .drawer_open #contents,
    .drawer_open #header,
    .drawer_open #footer,
    .drawer_open .pagetop,
    .drawer_open_02 #contents,
    .drawer_open_02 #header,
    .drawer_open_02 #footer,
    .drawer_open_02 .pagetop {
        transform: translateX(-260px);
    }
*/
    /* Overlay */
    .overlay {
        visibility: hidden;
        z-index: 2;
    }

    .overlay.is_visible {
        visibility: visible;
    }
    .overlay_top,
    .overlay_bottom {
        background: #fff;
        display: block;
        height: 50vh;
        position: fixed;
        transition-timing-function: ease;
        transition-duration: .5s;
        width: 0;
        z-index: 2;
    }
    .overlay_top {
        right: 0;
        top: 0;
    }
    .overlay_bottom {
        bottom: 0;
        left: 0;
    }


    /* nav_icon */
    .nav_icon {
        display: block;
        position: fixed;
        width: 32px;
        height: 3px;
        background: #333;
        transition: background .3s;
        -webkit-transform: translateX(-35px);
        transform: translateX(-35px);
    }

    .nav_icon::before,
    .nav_icon::after {
        content: "";
        display: block;
        position: absolute;
        width: 32px;
        height: 3px;
        background: #333;
        transition: all .3s;
    }

    .nav_icon::before {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }

    .nav_icon::after {
        -webkit-transform: translateY(8px);
        transform: translateY(8px);
    }

    .drawer_open .nav_icon,
    .drawer_open_02 .nav_icon {
        background: transparent;
    }

    .drawer_open .nav_icon::before,
    .drawer_open_02 .nav_icon::before {
        -webkit-transform: translateY(0) rotate(45deg);
        transform: translateY(0) rotate(45deg);
    }

    .drawer_open .nav_icon::after,
    .drawer_open_02 .nav_icon::after {
        -webkit-transform: translateY(0) rotate(-45deg);
        transform: translateY(0) rotate(-45deg);
    }
    .drawer_nav {
        margin: auto;
        width: 94%;
    }
    .drawer_nav li {
        opacity: 0;
        transform: translateY(5px);
        transition-delay: .1s;
        transition-duration: .3s;
        transform: rotateX()
    }
    .drawer_nav li a {
        display: block;
        padding: 20px;
        text-align: center;
    }
    .drawer_nav li a img {
        display: none;
    }
    /* 検索 */
    .searchform select {
        width: 100%;
    }

    .searchform input[type="search"] {
        height: 50px;
        width: 100%;
        font-size: 16px;
        font-size: 1.6rem;
        border: 0 none;
        padding: 0.5em 0;
        box-shadow: none;
        background: none;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }


    img.w_20 {
        width: 6.25vw;
    }



    /**
    * ブロック
    */
    /* お知らせ */
    .news_more {
        top: 15px;
        right: 5px;
    }

    /* ランキング */
    .ranking_block .product_list:nth-child(n + 4) {
        display: none;
    }

    /* 最近チェックした商品 */
    .checked_block .product_list:nth-child(n + 4) {
        display: none;
    }

    /**
    * TOP
    */
    /* slider */
    .main_slider .slick-slide img {
        width: 100%;
    }

    /**
    * 商品一覧
    */
    .product_item {
        line-height: 1.2;
    }

    /**
    * 商品詳細
    */
    .detail_img .slick-dots {
        justify-content: center;
    }

    .detail_img .slick-dots li {
        width: auto;
        margin-right: 0;
    }

    /* カート */
    #cart_item__info.message {
        line-height: 2;
    }

    .customer_detail .btn[disabled] {
        display: none;
    }

    /* レビュー */
    .product_review_block {
        padding-bottom: 19px!important;
    }

    /**
    * マイページ
    */
    /* 会員登録内容変更 */
    .mypage_formarea dl {
        flex-wrap: wrap;
    }

    /**
    * 新規会員登録
    */
    .entry_formarea dl {
        flex-wrap: wrap;
    }
    /* アバウト */


}

/*font-family*/

.ff_gothic {
    font-family: "Hiragino Kaku Gothic ProN", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック Medium", YuGothic, メイリオ, Meiryo, sans-serif;
}

.ff_mincho {
    font-family: "Hiragino Mincho ProN", 游明朝, "Yu Mincho", YuMincho, HGS明朝E, メイリオ, Meiryo, serif;
}


/* font-awesome */

.fa_size_10::before {
    font-size: 1rem;
}

.fa_size_11::before {
    font-size: 1.1rem;
}

.fa_size_12::before {
    font-size: 1.2rem;
}

.fa_size_13::before {
    font-size: 1.3rem;
}

.fa_size_14::before {
    font-size: 1.4rem;
}

.fa_size_15::before {
    font-size: 1.5rem;
}

.fa_size_16::before {
    font-size: 1.6rem;
}

.fa_size_17::before {
    font-size: 1.7rem;
}

.fa_size_18::before {
    font-size: 1.8rem;
}

.fa_size_19::before {
    font-size: 1.9rem;
}

.fa_size_40::before {
    font-size: 2rem;
}

.fa_size_21::before {
    font-size: 2.1rem;
}

.fa_size_22::before {
    font-size: 2.2rem;
}

.fa_size_23::before {
    font-size: 2.3rem;
}

.fa_size_24::before {
    font-size: 2.4rem;
}

.fa_size_25::before {
    font-size: 2.5rem;
}

.fa_size_26::before {
    font-size: 2.6rem;
}

.fa_size_27::before {
    font-size: 2.7rem;
}

.fa_size_28::before {
    font-size: 2.8rem;
}

.fa_size_29::before {
    font-size: 2.9rem;
}

.fa_size_30::before {
    font-size: 3rem;
}

.fa_size_31::before {
    font-size: 3.1rem;
}

.fa_size_32::before {
    font-size: 3.2rem;
}

.fa_size_33::before {
    font-size: 3.3rem;
}

.fa_size_34::before {
    font-size: 3.4rem;
}

.fa_size_35::before {
    font-size: 3.5rem;
}

.fa_size_36::before {
    font-size: 3.6rem;
}

.fa_size_37::before {
    font-size: 3.7rem;
}

.fa_size_38::before {
    font-size: 3.8rem;
}

.fa_size_39::before {
    font-size: 3.9rem;
}

.fa_size_40::before {
    font-size: 4rem;
}

.fa_size_41::before {
    font-size: 4.1rem;
}

.fa_size_42::before {
    font-size: 4.2rem;
}

.fa_size_43::before {
    font-size: 4.3rem;
}

.fa_size_44::before {
    font-size: 4.4rem;
}

.fa_size_45::before {
    font-size: 4.5rem;
}

.fa_size_46::before {
    font-size: 4.6rem;
}

.fa_size_47::before {
    font-size: 4.7rem;
}

.fa_size_48::before {
    font-size: 4.8rem;
}

.fa_size_49::before {
    font-size: 4.9rem;
}

.fa_size_50::before {
    font-size: 5rem;
}

@media screen and (max-width:768px) {
    /* font-awesome */
    .s_fa_size_10::before {
        font-size: 10px;
    }
    .s_fa_size_11::before {
        font-size: 11px;
    }
    .s_fa_size_12::before {
        font-size: 12px;
    }
    .s_fa_size_13::before {
        font-size: 13px;
    }
    .s_fa_size_14::before {
        font-size: 14px;
    }
    .s_fa_size_15::before {
        font-size: 15px;
    }
    .s_fa_size_16::before {
        font-size: 16px;
    }
    .s_fa_size_17::before {
        font-size: 17px;
    }
    .s_fa_size_18::before {
        font-size: 18px;
    }
    .s_fa_size_19::before {
        font-size: 19px;
    }
    .s_fa_size_40::before {
        font-size: 20px;
    }
    .s_fa_size_21::before {
        font-size: 21px;
    }
    .s_fa_size_22::before {
        font-size: 22px;
    }
    .s_fa_size_23::before {
        font-size: 23px;
    }
    .s_fa_size_24::before {
        font-size: 24px;
    }
    .s_fa_size_25::before {
        font-size: 25px;
    }
    .s_fa_size_26::before {
        font-size: 26px;
    }
    .s_fa_size_27::before {
        font-size: 27px;
    }
    .s_fa_size_28::before {
        font-size: 28px;
    }
    .s_fa_size_29::before {
        font-size: 29px;
    }
    .s_fa_size_30::before {
        font-size: 30px;
    }
    .s_fa_size_31::before {
        font-size: 31px;
    }
    .s_fa_size_32::before {
        font-size: 32px;
    }
    .s_fa_size_33::before {
        font-size: 33px;
    }
    .s_fa_size_34::before {
        font-size: 34px;
    }
    .s_fa_size_35::before {
        font-size: 35px;
    }
    .s_fa_size_36::before {
        font-size: 36px;
    }
    .s_fa_size_37::before {
        font-size: 37px;
    }
    .s_fa_size_38::before {
        font-size: 38px;
    }
    .s_fa_size_39::before {
        font-size: 39px;
    }
    .s_fa_size_40::before {
        font-size: 40px;
    }
    .s_fa_size_41::before {
        font-size: 41px;
    }
    .s_fa_size_42::before {
        font-size: 42px;
    }
    .s_fa_size_43::before {
        font-size: 43px;
    }
    .s_fa_size_44::before {
        font-size: 44px;
    }
    .s_fa_size_45::before {
        font-size: 45px;
    }
    .s_fa_size_46::before {
        font-size: 46px;
    }
    .s_fa_size_47::before {
        font-size: 47px;
    }
    .s_fa_size_48::before {
        font-size: 48px;
    }
    .s_fa_size_49::before {
        font-size: 49px;
    }
    .s_fa_size_50::before {
        font-size: 50px;
    }
}

/*
 * common
 */

.section_heading {
    text-align: center;
    margin-right: auto;
    margin-left: auto;
}

.section_heading img {
    margin-right: auto;
    margin-left: auto;
}

.contents_heading {
    color: #2B1A16;
    font-size: 20px;
    font-weight: bold;
    font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    line-height: 2.3;
}




/*
 * main
 */

/* common */

.btn_top a {
    background: url('../img/common/bg_btn.png') #5b4746;
}

.head_lh {
    line-height: 46px;
}

.section_caption {
    letter-spacing: 0.07em;
    line-height: 2;
    text-align: justify;
}

/* mainvisual */

.mainvisual {
    height: 100vh;
    overflow: hidden;
    position: relative;
    z-index: 2000;
}

.mv_wrap {
    width: 100%;
}

.mv_01,
.mv_02,
.mv_03 {
    height: 100vh;
    transform: scale(1.07) rotate(0.1deg);
    width: 100%;
}


.mv_02 {
    background: url(../img/top/mv_01.jpg) no-repeat center;
    background-size: cover;
}

.mv_03 {
    background: url(../img/top/mv_02.jpg) no-repeat center;
    background-size: cover;
}

.mv_01 {
    background: url(../img/top/mv_03.jpg) no-repeat center;
    background-size: cover;
}

.mv_01.slick-current,
.mv_02.slick-current,
.mv_03.slick-current {
    animation: back 5.4s 0s linear 1 forwards;
}
@keyframes back {
    0% {transform: scale(1) rotate(0deg)}
    100% {transform: scale(1.07)  rotate(0.1deg)}
}

.mainvisual .mv_text {
    color: #fff;
    height: 100vh;
    left: 0;
    position: fixed;
    text-align: center;
    text-shadow: 1px 1px 1px #7c7c7c;
    top: calc(50% - (18.829vw + 40px)/2);
    width: 100%;
}

.mv_text img {
    transition-duration: 1s;
    width: 39.14vw;
}

.mv_text img, .mv_ja,.mv_en {
    opacity: 0;
    position: relative;
    z-index: 3010;
}
.text_span {
    opacity: 0;
}
.mv_en .text_span {
    font-weight: bold;
}
.mv_ja {
    display: block;
    font-size: 1.72vw;
    font-weight: bold;
    margin-bottom: 20px;
}

.mv_en {
    display: block;
    font-size: 1.25vw;
    font-weight: bold;
}

/*mv_button*/

.mv_button {
    border: 1px #c5b4b4 solid;
    bottom: 40px;
    box-sizing: border-box;
    color: #fefefe;
    font-size: 1.8rem;
    height: 50px;
    line-height: 50px;
    padding: 0;
    position: absolute;
    right: 40px;
    text-align: center;
    width: 180px;
    z-index: -1;
}

.mv_button .inner_border {
    box-sizing: border-box;
    display: block;
    height: 50px;
    left: -0.5px;
    position: absolute;
    top: -0.5px;
    width: 180px;
    z-index: 2;
}

.mv_button::before,
.mv_button::after,
.mv_button .inner_border::before,
.mv_button .inner_border::after {
    background: #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    transition-duration: 1s;
    width: 0;
    z-index: 3;
}

.mv_button::before {
    height: 1px;
    right: -1px;
    top: -1px;
}

.mv_button:hover::before {
    width: 180px;
}

.mv_button::after {
    bottom: -1px;
    height: 1px;
    right: -1px;
    transition-delay: .1s;
}

.mv_button:hover::after {
    width: 180px;
}

.mv_button .inner_border::before {
    right: .5px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.mv_button:hover .inner_border::before {
    height: 50px;
}

.mv_button .inner_border::after {
    left: -1px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.mv_button:hover .inner_border::after {
    height: 50px;
}

.mv_button .outer_border {
    border: 1px #c5b4b4 solid;
    box-sizing: border-box;
    height: 50px;
    left: -4px;
    line-height: 50px;
    padding: 0;
    position: absolute;
    top: -4px;
    width: 180px;
}

.mv_button .outer_border span {
    box-sizing: border-box;
    display: block;
    height: 50px;
    left: -0.5px;
    position: absolute;
    top: -0.5px;
    width: 180px;
    z-index: 2;
}

.mv_button .outer_border::before,
.mv_button .outer_border::after,
.mv_button .outer_border span::before,
.mv_button .outer_border span::after {
    background: #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    transition-duration: 1s;
    width: 0;
    z-index: 3;
}

.mv_button .outer_border::before {
    height: 1px;
    left: -1px;
    top: -1px;
}

.mv_button .outer_border:hover::before {
    width: 180px;
}

.mv_button .outer_border::after {
    bottom: -1px;
    height: 1px;
    left: -1px;
    transition-delay: .1s;
}

.mv_button .outer_border:hover::after {
    width: 180px;
}

.mv_button .outer_border span::before {
    right: .5px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.mv_button .outer_border:hover span::before {
    height: 50px;
}

.mv_button .outer_border span::after {
    left: -1px;
    top: -0.5px;
    transition-delay: .2s;
    width: 1px;
}

.mv_button .outer_border:hover span::after {
    height: 50px;
}


.mv_line {
    background: #c5b4b4;
    bottom: 0;
    display: block;
    height: 80px;
    left: calc(50% - .5px);
    position: absolute;
    width: 1px;
    z-index: -1;
}

.mv_line::before {
    animation: mv_line 4s 1s infinite normal;
    border-color: transparent transparent #fff transparent;
    border-style: solid;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    width: 0;

}

@keyframes mv_line {
    0% {
        border-width: 0;
        bottom: 80px;
        left: 0;
    }
    35% {
        border-width: 0 1.5px 20px 1.5px;
        bottom: 60px;
        left: -1px;
    }
    75% {
        border-width: 0 1.5px 20px 1.5px;
        bottom: 0;
        left: -1px;
    }
    100% {
        border-width: 0 1.5px 0 1.5px;
        bottom: 0;
        left: -1px;
    }
}

@media screen and (max-width:768px) {
    .mainvisual .mv_text {
        top: calc(50% - (32.814vw + 40px)/2);
    }
    .mv_text img {
        width: 66.8vw;
    }

    .mv_ja {
        font-size: 3.2vw;
        margin-bottom: 10px;
    }

    .mv_en {
        font-size: 2.6vw;
    }
    .mv_02 {
        background: url(../img/top/mv_01_sp.jpg) no-repeat center;
        background-size: cover;
    }

    .mv_03 {
        background: url(../img/top/mv_02_sp.jpg) no-repeat center;
        background-size: cover;
    }

    .mv_01 {
        background: url(../img/top/mv_03_sp.jpg) no-repeat center;
        background-size: cover;
    }
    .mv_button {
        bottom: 30px;
        font-size: 3.2vw;
        height: 8vw;
        line-height: 8vw;
        right: 20px;
        width: 29.3vw;
    }

    .mv_button .inner_border {
        height: 8vw;
        width: 29.3vw;
    }


    .mv_button:hover::before {
        width: 29.3vw;
    }

    .mv_button:hover::after {
        width: 29.3vw;
    }


    .mv_button:hover .inner_border::before {
        height: 8vw;
    }

    .mv_button:hover .inner_border::after {
        height: 8vw;
    }

    .mv_button .outer_border {
        height: 8vw;
        line-height: 8vw;
        width: 29.3vw;
    }

    .mv_button .outer_border span {
        height: 8vw;
        width: 29.3vw;
    }


    .mv_button .outer_border:hover::before {
        width: 29.3vw;
    }


    .mv_button .outer_border:hover::after {
        width: 29.3vw;
    }


    .mv_button .outer_border:hover span::before {
        height: 8vw;
    }



    .mv_button .outer_border:hover span::after {
        height: 8vw;
    }

}



/* about */

.bg_about {
    background: url('../img/bg_about.jpg') no-repeat;
    background-size: cover;
}

.bg_baobab {
    width: calc(50% + 20px);
    top: -20px;
    left: -20px;
    background: url('../img/bg_baobab.jpg') no-repeat;
    background-size: 100%;
}

.bg_baobab::before {
    content: "";
    display: block;
    padding-top: 80%;
}

.baobab_right {
    min-height: 440px;
}

.bg_txt_wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: block;
    width: 100%;
    border: 1px solid #51312a;
    z-index: 1;
}

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

    .bg_about_spoon {
        top: 0;
        right: 0;
        max-width: 693px;
        width: 54.140625%;
        height: 530px;
        background: url('../img/bg_about_spoon.png') no-repeat;
        background-size: contain;
        background-position: top right;
    }

}

/* power */

.power {
    background: #f7efe8;
}

.power .section_heading {
    margin-bottom: 111px;
}

.power_row {
    margin-bottom: 111px;
}

.power_orn_left,
.power_orn_right {
    position: absolute;
    bottom: 22.5%;
    width: 18.33333333%;
}

.power_orn_left::before,
.power_orn_right::before {
    content: "";
    display: block;
    padding-top: 300%;
}

.power_orn_left {
    left: 0px;
}

.power_orn_right {
    right: 0px;
}

.orn_01 {
    background: url('../img/power/ornament-01.png') no-repeat;
}

.orn_02 {
    background: url('../img/power/ornament-02.png') no-repeat;
}

.orn_03 {
    background: url('../img/power/ornament-03.png') no-repeat;
}

.power_orn_left,
.power_orn_right {
    background-size: contain;
}

.power_title_right::after,
.power_title_left::after {
    content: "";
    position: relative;
    display: block;
    width: calc(100% + 50px);
    height: 5px;
    margin-top: 7px;
    z-index: 2;
}

.power_title_right::after {
    margin-left: -50px;
    background: url('../img/power/line-right.png') no-repeat;
}

.power_title_left::after {
    margin-right: -50px;
    background: url('../img/power/line-left.png') no-repeat;
}

/* secret */

.secret {
    background: #f9f7f5;
    padding-bottom: 110px;
}

.secret_row {
    margin-bottom: 130px;
}

.secret_left {
    width: 56.25%;
}

.secret_right {
    flex: 1;
}

.secret_right_tag {
    top: -93px;
    right: 39px;
    width: 134px;
    height: 94px;
    background: url('../img/secret/cookie-tag.png') no-repeat;
}

.secret_recipe_wrap {
    max-width: 1200px;
}

.secret_recipe {
    max-width: 1100px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    border: 2px solid #6D5049;
}

.secret_recipe::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 8px;
    display: block;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border: 2px solid #6D5049;
}

.recipe_tag {
    top: -50px;
    left: -51px;
    background: url('../img/secret/recipe_tag.png') no-repeat;
    width: 450px;
    height: 142px;
}

.recipe_title span::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 6px;
    display: block;
    width: calc(100% + 15px);
    margin-left: -9px;
    margin-right: -6px;
    height: 13px;
    background: url('../img/secret/greenline.png') no-repeat;
    background-size: 100%;
    z-index: -1;
}

.recipe_left {
    width: 39.15724563%;
}

.recipe_right {
    width: 52.82631038%;
}

.recipe_juice_title::after {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    margin-top: 16px;
    margin-bottom: 13px;
    background: url('../img/secret/line-dotted_03.png');
}

.juice_tag {
    bottom: 20px;
    left: -20px;
    background: url('../img/secret/juice-tag.png') no-repeat;
}

.center_line span {
    position: relative;
    background: #f9f7f5;
    z-index: 2;
}

.center_line::after {
    content: "";
    position: absolute;
    top: calc(50% - 1px);
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background: #000;
    z-index: 1;
}

/* shop */

.shop {
    background: #F7EFE8;
}

.shop::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 45.7815%;
    height: 610px;
    background: url('../img/shop/bg_shop-pc.png') no-repeat;
    background-size: contain;
    background-position: right top;
}

/* products */

.product_data {}

.btn_products {
    margin-top: 22.5px;
}

.btn_products a {
    position: relative;
    background: url('../img/common/bg_btn_product.png');
}

.btn_products a::after {
    content: "\03e";
    position: absolute;
    top: 33%;
    right: 20px;
    display: block;
    color: white;
    font-size: 1.4rem;
}

.products_border_ver::before,
.products_border_ver::after {
    content: "";
    position: absolute;
    top: 22px;
    display: block;
    width: 3px;
    height: calc(100% - 44px);
    background: url('../img/common/base_dotted_vertical.png') repeat-y;
}

.products_border_ver::before {
    left: 22px;
}

.products_border_ver::after {
    right: 22px;
}

.products_border_hor::before,
.products_border_hor::after {
    content: "";
    position: absolute;
    left: 20px;
    display: block;
    width: calc(100% - 34px);
    height: 3px;
    background: url('../img/common/base_dotted_horizontal.png') repeat-x;
}

.products_border_hor::before {
    top: 11px;
}

.products_border_hor::after {
    bottom: 12px;
}

.set_box_left {
    width: 38.12824956%;
}

.set_box_right {
    top: 0px;
    right: 42px;
}

.pageSideMenu {
    right: 20px;
    bottom: 0;
    visibility: hidden;
    z-index: 1000;
}

.pagetop a {
    color: #fff;
    display: block;
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    font-size: 1.2rem;
    position: relative;
}

.pagetop a::after {
    background: #fff;
    content: "";
    display: block;
    height: 60px;
    left: 50%;
    letter-spacing: 1px;
    margin-top: 5px;
    position: relative;
    width: 1px;
}

.otherpage_text {
    font-size: 1.4rem;
    line-height: 2;
    margin-left: auto;
    max-width: 880px;
    width: 100%;
}

.otherpage_text dl {
    border-top: 1px #fff solid;
}
.otherpage_text dl:last-child {
    border-bottom: 1px #fff solid;
}
#page_help_privacy .otherpage_text {
    max-width: 100%;
}
.quantity dd input.form-control {
    padding: 16px 10px 15px;
    height: auto;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
    border: 1px solid #6d5049;
    font-size: 18px;
    text-align: center;
    color: #1a1414;
}

.bg_detail_cart {
    border: none;
    font-size: 2rem;
    padding: 25px 10px;
}

textarea.form-control {
    display: block;
    margin-bottom: 16px;
}

select.form-control {
    padding-right: 26px;
    background: url('../img/common/btn_angle_down.png') no-repeat;
    background-position: right 10px top 15px;
    background-color: #fff;
    color: #1a1414;
}

@media screen and (max-width:768px) {
  html,body {
    overflow-x: hidden;
  }

    .head_lh {
        line-height: 2;
    }

    .section_caption {
        line-height: 2.15;
    }



    .drawer_header {

        margin-left: -1px;
    }



    .mainvisual .inner {
        background: url('../img/MV-sp.jpg') no-repeat;
        background-size: contain;
    }

    .mainvisual .inner::before {
        padding-top: 75%;
    }

    .mainvisual_caption_sp {
        right: 11px;
        bottom: 11px;
    }

    .section_heading {
        /*width: 80%;*/
        margin-right: auto;
        margin-left: auto;
    }
    .pageSideMenu {
        bottom: 0;
        right: 20px;
    }
    .pagetop a::after {
        height: 30px;
    }
    /* about */
    .bg_baobab {
        top: -12px;
        right: -12px;
        left: -12px;
        width: calc(100% + 24px);
    }

    .bg_baobab::before {
        padding-top: 75%;
    }

    .baobab_right {
        min-height: 0;
    }

    .bg_about_spoon img {
        right: -12px;
        top: -10px;
    }

    /* power */
    .power .section_heading {
        margin-bottom: 74px;
    }

    .power_row {
        margin-bottom: 60px;
    }

    .power .power_row:nth-of-type(3) {
        margin-bottom: 42px;
    }

    .power_title_right::after,
    .power_title_left::after {
        width: 100%;
        margin-top: 1px;
        margin-left: 0;
        margin-right: 0;
        background-size: contain;
    }

    /* secret */
    .secret {
        padding-bottom: 73px;
    }

    .secret_row {
        margin-bottom: 75px;
    }

    .secret_left {
        width: 100%;
    }

    .secret_right {
        flex: none;
    }

    .secret_right_tag {
        right: 0;
    }

    .recipe_left,
    .recipe_right {
        width: 100%;
    }

    .recipe_juice_title::after {
        margin-bottom: 7px;
    }

    .recipe_tag {
        top: -4px;
        left: -6.213%;
        margin-top: -11%;
        width: 80.9352518%;
        height: auto;
        background: url('../img/secret/recipe_tag-sp.png') no-repeat;
        background-size: contain;
    }

    .recipe_tag::before {
        content: "";
        display: block;
        padding-top: 31.55555556%;
    }

    /* shop */
    .shop::before {
        background: none;
    }

    /* products */
    .btn_products a::after {
        top: calc(50% - 9.5px);
        right: 10px;
    }

    .set_box_left {
        width: 100%;
    }

    .set_box_sp {
        left: -10px;
        right: -10px;
        width: calc(100% + 20px);
        z-index: 10;
    }

    /* 詳細ページボタン */
    .bg_detail_cart {
        padding-top: 18px;
        padding-bottom: 18px;
    }
    .blank_link {
        display: block;
    }
    .blank_link::before {
        background: url(../img/common/icon_blanklink.png) no-repeat center;
        background-size: cover;
        content: "";
        display: inline-block;
        height: 1.4rem;
        margin-right: 17px;
        vertical-align: middle;
        width: 1.4rem;
    }

}

@media all and (-ms-high-contrast: none) {
    .img_effect {
        transition-duration: 1.3s;
    }
    .header_top .w_38 {
        height: 36px;
    }
}

ul.tab {
    position: absolute;
    width: 245px;
}

ul.tab li {
    cursor: pointer;
    position: absolute;
}

ul.tab li::before {
    content: "";
    cursor: pointer;
    position: absolute;
}



ul.tab li:nth-child(2) {
    right: 0;
}




ul.tab li.active {
    visibility: hidden;
}

table.tabContent {
    display: none;
}

table.active {
    display: table;
}
/* ヘッダーメニュー */
#page_cart .header_menu_link,
#page_shopping .header_menu_link,
#page_shopping_delivery .header_menu_link,
#page_shopping_payment .header_menu_link,
#page_shopping_shipping_change .header_menu_link,
#page_shopping_shipping_edit_change .header_menu_link,
#page_shopping_shipping_multiple_change .header_menu_link,
#page_shopping_confirm .header_menu_link,
#page_shopping_shipping .header_menu_link,
#page_shopping_shipping_multiple .header_menu_link,
#page_shopping_complete .header_menu_link,
#page_shopping_login .header_menu_link,
#page_shopping_nonmember .header_menu_link,
#page_shopping_shipping_edit .header_menu_link,
#page_shopping_shipping_multiple_edit .header_menu_link,
#page_shopping_error .header_menu_link,
#page_cart .drawer_nav_link,
#page_shopping .drawer_nav_link,
#page_shopping_delivery .drawer_nav_link,
#page_shopping_payment .drawer_nav_link,
#page_shopping_shipping_change .drawer_nav_link,
#page_shopping_shipping_edit_change .drawer_nav_link,
#page_shopping_shipping_multiple_change .drawer_nav_link,
#page_shopping_confirm .drawer_nav_link,
#page_shopping_shipping .drawer_nav_link,
#page_shopping_shipping_multiple .drawer_nav_link,
#page_shopping_complete .drawer_nav_link,
#page_shopping_login .drawer_nav_link,
#page_shopping_nonmember .drawer_nav_link,
#page_shopping_shipping_edit .drawer_nav_link,
#page_shopping_shipping_multiple_edit .drawer_nav_link,
#page_shopping_error .drawer_nav_link {
    display: none;
}


/* product list grid style */

.grid_bet {
    display: grid;
    gap: 26px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    margin: 1rem 3rem 2rem;
}
.product_lis_grid {
    border-left: none;
    border-top: none;
    margin: 0 0 4rem;
}
@media screen and (max-width:768px) {
    .grid_bet {
        display: grid;
        gap: 18px;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        margin: 1rem 0 2rem;
    }
    .product_lis_grid {
        border-left: none;
        border-top: none;
        margin: 0 0 2rem;
    }
}