@charset "UTF-8";

/* ====================================================
  ■■　追従ナビ　■■
====================================================== */
#chatpluscontent #eye_catcher {
    display: none !important;
}

.site-header {
    display: block;
    width: 100%;
    background: rgba(225, 213, 199, 0.90);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    position: fixed;
    bottom: 0;
    z-index: 999;
    transition: 0.2s;
}

.pcdevice .site-header {
    background: var(--v24-cream);
    bottom: auto;
    top: 0;
    border-bottom: 1px solid #ccc;
    min-height: 12.890625vw;
}

.pcdevice .site-header.on_hover+.after_layer {
    display: block;
    position: absolute;
    top: 12.890625vw;
    left: 0;
    right: 0;
    bottom: -200vh;
    /* background-color: var(--v24-black);
    opacity: 0.5; */
    background: rgba(67, 57, 47, 0.50);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    z-index: 900;
}

.pcdevice .site-header+.after_layer {
    display: none;
}

.site-header.hide {
    transform: translateY(100%) !important;
}
.pcdevice .site-header.hide {
    transform: translateY(0) !important;
}

.pcdevice .site-header.hide,
.pcdevice .site-header.scroll-dwn {
    transform: translateY(-100%);
}

.site-header .fnav {
    padding: 10px 20px 15px;
    /* max-height: 165px; */
    max-height: 130px;
}

@media only screen and (min-width: 1281px) {
    .pcdevice .site-header {
        min-height: 165px;
    }

    .pcdevice .site-header.on_hover+.after_layer {
        top: 165px;
    }
}

/* メニュー挙動 制御(SP) */
.fnav > p.title {
    display: block;
    margin-bottom: 10px;
    line-height: 1.6;
}

.fnav__menu.ver_sp {
    display: flex;
    flex-wrap: nowrap;
    gap: 15px;
}

.fnav__menu.ver_sp li {
    width: 100%;
    border-radius: 90px;
}

.fnav__menu.ver_sp li>a {
    padding: 20px 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-radius: 90px;
}

.fnav__menu.ver_sp li:nth-child(1)>a {
    background-color: var(--v24-btnred);
}

.fnav__menu.ver_sp li:nth-child(2)>a {
    padding-right: 10px;
    background: center right 15px / 8px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 7 12"><path fill="%23FFFFFF" id="Icon_ionic-ios-arrow-back" data-name="Icon ionic-ios-arrow-back" d="M4.89,6,.257,1.462a.842.842,0,0,1,0-1.211A.892.892,0,0,1,1.5.251L6.745,5.391a.844.844,0,0,1,.026,1.182L1.5,11.75a.893.893,0,0,1-1.239,0,.842.842,0,0,1,0-1.211Z"/></svg>') no-repeat var(--v24-btnblue);
}

.fnav__menu.ver_sp.storever li:nth-child(2)>a {
    padding-right: 10px;
    background: center right 10px / 13px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140 140"><path fill="%2343392F" id="icon_x5F_link_00000133515484282774806390000015775604897463366029_" class="st0" d="M120,76.67v40,	c0,12.86-10.47,23.33-23.33,23.33H23.33C10.46,140,0,129.53,0,116.67V43.33C0,30.46,10.46,20,23.33,20h40c5.52,0,10,4.48,10,10,	s-4.48,10-10,10h-40C21.49,40,20,41.49,20,43.33v73.34c0,1.84,1.49,3.33,3.33,3.33h73.34c1.84,0,3.33-1.49,3.33-3.33v-40,c0-5.52,4.47-10,10-10S120,71.15,120,76.67z M139.23,6.18c-1.01-2.45-2.96-4.4-5.41-5.41C132.6,0.27,131.3,0,130,0H90,c-5.53,0-10,4.48-10,10s4.47,10,10,10h15.86L49.6,76.26c-3.91,3.91-3.91,10.23,0,14.14c1.95,1.95,4.51,2.93,7.07,2.93,s5.12-0.98,7.07-2.93L120,34.14V50c0,5.52,4.47,10,10,10c5.53,0,10-4.48,10-10V10C140,8.7,139.74,7.4,139.23,6.18z"/></svg>') no-repeat #FCC73F;
}

.fnav__menu.ver_sp li .fnav__menu_inner p {
    text-align: center;
    font-weight: bold;
    line-height: 1.0;
    color: #fff;
}

.fnav__menu.ver_sp.storever li:nth-child(2) .fnav__menu_inner p {
    color: var(--v24-black);
}

.fnav__menu.ver_sp li:nth-child(1)>a .fnav_icon {
    width: 20px;
    height: 20px;
    background: center / 20px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path class="cls-2" d="M87.39,85,77.12,69.57a5.9,5.9,0,0,0-6.39-2.49,15.67,15.67,0,0,0-7.94,5.61,6,6,0,0,1-6.73,2q-.53-.18-1.11-.42c-4.52-1.86-9-5.86-12.29-10.42-19.67-27-12-32.71-10.84-33.2,8.13-3.39,12.41-2.87,12.36-9.31a6,6,0,0,0-1-3.21l-10-15.18A6,6,0,0,0,26.83.41c-11.32,2.76-13,9.4-13,9.4-6,15.1,1.08,38.66,13.22,56.37C50.49,100.42,73.5,99.72,73.5,99.72c5.72.44,10.65-4.15,13.52-7.62A6,6,0,0,0,87.39,85Z" fill="%23FFFFFF"/></svg>') no-repeat;
}

.fnav__menu.ver_sp li:nth-child(2)>a .fnav_icon {
    width: 20px;
    height: 20px;
    background: center / 20px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path class="cls-2" d="M53.3,56.26,100,31.16V18.5a6,6,0,0,0-6-6H6a6,6,0,0,0-6,6V30.66l47.62,25.6A6,6,0,0,0,53.3,56.26Z" fill="%23FFFFFF"/><path class="cls-2" d="M53.76,69.64a6,6,0,0,1-2.83.71c-.16,0-.31,0-.47,0s-.31,0-.47,0a6,6,0,0,1-2.83-.71L0,44.29V81.5a6,6,0,0,0,6,6H94a6,6,0,0,0,6-6V44.78Z" fill="%23FFFFFF"/></svg>') no-repeat;
}

.fnav__menu.ver_sp.storever li:nth-child(2)>a .fnav_icon {
    width: 20px;
    height: 20px;
    background: center / 20px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path class="cls-2" d="M57.46,43.12v4a3,3,0,0,1-3,3h-9a3,3,0,0,1-3-3v-4a3,3,0,0,1,3-3h9A3,3,0,0,1,57.46,43.12Zm17-3h-9a3,3,0,0,0-3,3v4a3,3,0,0,0,3,3h9a3,3,0,0,0,3-3v-4A3,3,0,0,0,74.46,40.12Zm-40,0h-9a3,3,0,0,0-3,3v4a3,3,0,0,0,3,3h9a3,3,0,0,0,3-3v-4A3,3,0,0,0,34.46,40.12Zm20,15h-9a3,3,0,0,0-3,3v4a3,3,0,0,0,3,3h9a3,3,0,0,0,3-3v-4A3,3,0,0,0,54.46,55.12Zm20,0h-9a3,3,0,0,0-3,3v4a3,3,0,0,0,3,3h9a3,3,0,0,0,3-3v-4A3,3,0,0,0,74.46,55.12Zm-40,0h-9a3,3,0,0,0-3,3v4a3,3,0,0,0,3,3h9a3,3,0,0,0,3-3v-4A3,3,0,0,0,34.46,55.12Zm20,15h-9a3,3,0,0,0-3,3v4a3,3,0,0,0,3,3h9a3,3,0,0,0,3-3v-4A3,3,0,0,0,54.46,70.12Zm-20,0h-9a3,3,0,0,0-3,3v4a3,3,0,0,0,3,3h9a3,3,0,0,0,3-3v-4A3,3,0,0,0,34.46,70.12ZM100,12.77V94a6,6,0,0,1-6,6H6a6,6,0,0,1-6-6V12.77a6,6,0,0,1,6-6H20V6.09a6,6,0,0,1,12,0v.68H68V6A6,6,0,0,1,80,6v.77H94A6,6,0,0,1,100,12.77ZM88,32H12V88H88Z" fill="%2343392F"/></svg>');
}

/* -- 店舗関連ページ表示 */
.fnav__menu.ver_sp.storever li {
    width: calc((100% - 1px) / 2);
    padding: 0;
    background: none;
    height: 60px;
}

.fnav__menu.ver_sp.storever li a.fnav__menu_inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 100%;
    padding: 0 10px 0 0;
}

/* メニュー(PC) */
.pcdevice .fnav {
    width: 100%;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    padding: 1.5625vw 3.125vw;
}

/* メニュー(PC) 上段 */
.pcdevice .fnav__menu.ver_pc.nav_upper {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    max-height: 4.6875vw;
}

.pcdevice .nav_upper .fnav__menu_logo .fnav_left,
.pcdevice .nav_upper .fnav__menu_logo .fnav_left a img {
    width: 14.0625vw;
    height: 4.375vw;
    object-fit: cover;
    /* ロゴ画像によって調整 */
    bottom: -1px;
    /* 調整値 */
}

.pcdevice .nav_upper .fnav__menu_cta .fnav_right {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 2.34375vw;
}

.pcdevice .nav_upper .fnav__menu_cta .fnav_right .fnav__menu_tel p {
    line-height: 1.3;
}

.pcdevice .nav_upper .fnav__menu_cta .fnav_right li .fnav__menu_tel_inner p:nth-child(1) {
    color: var(--v24-redtext);
    font-weight: bold;
    padding-left: 3.90625vw;
    background: center left / 3.515625vw url('/wp-content/themes/bsportal/assets/img/icon/logo_freedial2.svg') no-repeat;
}

.pcdevice.delivery .nav_upper .fnav__menu_cta .fnav_right li .fnav__menu_tel_inner p:nth-child(1) {
    padding-left: 2.34375vw;
    background: center left / 1.5625vw url('/wp-content/themes/bsportal/assets/img/icon/icon_tel.svg') no-repeat;
}

.pcdevice .nav_upper .fnav__menu_cta .fnav_right li.fnav__menu_web a {
    width: 20.3125vw;
    padding: 1.171875vw 3.515625vw 1.171875vw 2.734375vw;
    border-radius: 4.6875vw;
    background: center left 2.734375vw / 1.40625vw url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path class="cls-2" d="M53.3,56.26,100,31.16V18.5a6,6,0,0,0-6-6H6a6,6,0,0,0-6,6V30.66l47.62,25.6A6,6,0,0,0,53.30,56.26Z" fill="%23ffffff"/><path class="cls-2" d="M53.76,69.64a6,6,0,0,1-2.83.71c-.16,0-.31,0-.47,0s-.31,0-.47,0a6,6,0,0,1-2.83-.71L0,44.29V81.5a6,6,0,0,0,6,6H94a6,6,0,0,0,6-6V44.78Z" fill="%23ffffff"/></svg>') no-repeat,
        center right 1.5625vw / 0.625vw url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 55.04 89.69"><path class="cls-1" d="M7.52,89.69C3.38,89.71.01,86.36,0,82.22c0-2.09.86-4.1,2.4-5.52l34.12-31.83L2.4,13.01C-.64,10.19-.81,5.43,2.02,2.39c2.83-3.04,7.58-3.21,10.62-.38h0l40,37.34c3.04,2.82,3.22,7.56.4,10.6-.13.14-.26.27-.4.4L12.64,87.69c-1.39,1.29-3.22,2.01-5.12,2Z" fill="%23ffffff"/></svg>') no-repeat var(--v24-btnblue);
    color: #fff;
    text-align: right;
    font-weight: bold;
    line-height: 1.6;
}

/* メニュー(PC) 下段 */
.pcdevice .nav_lower {
    display: flex;
    flex-wrap: nowrap;
    padding-top: 1.953125vw;
}

.pcdevice .nav_lower>li.menu-item {
    display: flex;
    align-items: center;
    width: calc((93.75vw) / 6);
    height: 3.125vw;
    padding: 0 0.78125vw;
    border-left: 1px solid var(--v24-lightgray);
}

.pcdevice .nav_lower li:last-child {
    border-right: 1px solid var(--v24-lightgray);
}

.pcdevice .nav_lower>li.menu-item>a {
    width: 14.0625vw;
    height: 100%;
    margin: 0 auto;
    text-align: center;
    font-weight: bold;
}

.pcdevice .nav_lower>li.menu-item>a:hover,
.pcdevice .nav_lower>li.menu-item>a.menu-pulldown.active {
    background: var(--v24-beige);
    color: var(--v24-brown);
    border-radius: 0.78125vw;
}

.pcdevice .nav_lower>li.menu-item>a span {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

@media only screen and (min-width: 1281px) {
    .pcdevice .fnav {
        width: 1280px;
        margin-left: auto;
        margin-right: auto;
        padding: 20px 40px;
    }

    /* メニュー(PC) 上段 */
    .pcdevice .fnav__menu.ver_pc.nav_upper {
        max-height: 60px;
    }

    .pcdevice .nav_upper .fnav__menu_logo .fnav_left,
    .pcdevice .nav_upper .fnav__menu_logo .fnav_left a img {
        width: 180px;
        height: 56px;
    }

    .pcdevice .nav_upper .fnav__menu_cta .fnav_right {
        gap: 30px;
    }

    .pcdevice .nav_upper .fnav__menu_cta .fnav_right li .fnav__menu_tel_inner p:nth-child(1) {
        padding-left: 50px;
        background: center left / 45px url('/wp-content/themes/bsportal/assets/img/icon/logo_freedial2.svg') no-repeat;
    }

    .pcdevice.delivery .nav_upper .fnav__menu_cta .fnav_right li .fnav__menu_tel_inner p:nth-child(1) {
        padding-left: 30px;
        background: center left / 20px url('/wp-content/themes/bsportal/assets/img/icon/icon_tel.svg') no-repeat;
    }

    .pcdevice .nav_upper .fnav__menu_cta .fnav_right li.fnav__menu_web a {
        width: 260px;
        padding: 15px 45px 15px 35px;
        border-radius: 60px;
        background: center left 35px / 18px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path class="cls-2" d="M53.3,56.26,100,31.16V18.5a6,6,0,0,0-6-6H6a6,6,0,0,0-6,6V30.66l47.62,25.6A6,6,0,0,0,53.30,56.26Z" fill="%23ffffff"/><path class="cls-2" d="M53.76,69.64a6,6,0,0,1-2.83.71c-.16,0-.31,0-.47,0s-.31,0-.47,0a6,6,0,0,1-2.83-.71L0,44.29V81.5a6,6,0,0,0,6,6H94a6,6,0,0,0,6-6V44.78Z" fill="%23ffffff"/></svg>') no-repeat,
            center right 20px / 8px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 55.04 89.69"><path class="cls-1" d="M7.52,89.69C3.38,89.71.01,86.36,0,82.22c0-2.09.86-4.1,2.4-5.52l34.12-31.83L2.4,13.01C-.64,10.19-.81,5.43,2.02,2.39c2.83-3.04,7.58-3.21,10.62-.38h0l40,37.34c3.04,2.82,3.22,7.56.4,10.6-.13.14-.26.27-.4.4L12.64,87.69c-1.39,1.29-3.22,2.01-5.12,2Z" fill="%23ffffff"/></svg>') no-repeat var(--v24-btnblue);
    }

    /* メニュー(PC) 下段 */
    .pcdevice .nav_lower {
        padding-top: 25px;
    }

    .pcdevice .nav_lower>li.menu-item {
        width: calc(1200px / 6);
        height: 40px;
        padding: 0 10px;
    }

    .pcdevice .nav_lower>li.menu-item>a {
        width: 180px;
    }

    .pcdevice .nav_lower>li.menu-item>a:hover {
        border-radius: 10px;
    }
}

/* 検証追記 ↓ */
/* .site-header3 {
    transform: translateY(100%);
}

.site-header3.set_sp {
    transform: translateY(0%);
    transition: 0.2s;
} */
/* 検証追記 ↑ */

/* Modal TOC
------------------------------------------ */
@media only screen and (max-width: 767px) {
    .toc2_trigger {
        width: 65px;
        height: 65px;
        background-color: rgba(51,51,51,0.7);
        border: 2px solid #fff;
        border-radius: 50%;
        position: absolute;
        top: -10px;
        right: 0;
        cursor: pointer;
    }
    .toc2_trigger img {
        width: 34px;
        position: absolute;
        top: calc( 50% - 34px / 2 );
        left: calc( 50% - 34px / 2 );
    }
    .toc2_container {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: transparent;
        z-index: 9990;  /* ハンバーガーメニュー・CTAより上 */
    }

    /* overlay背景 */
    #overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(67, 57, 47, 0.50);
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        z-index: 10;
    }

    /* 目次 */
    #toc2_area {
        position: absolute;
        /* top: calc(70px + (100dvh - 70px - 120px) / 2); */
        top: 50%;
        left: 50%;
        transform: translateX(-50%);
    	transform: translate(-50%, -50%);
        /* max-height: calc(100dvh - 85px - 120px - 30px); */
        overflow-y: auto;
        z-index: 999;

        display: flex;
        height: auto;
        flex-direction: column;
        gap: 20px;
        width: calc( 100% - 20px * 2);
        margin: 0 auto;
        padding: 65px 15px 50px;
        background-color: var(--v24-cream);
        border-radius: 30px;
    }
    #toc2_area > .toc_close {
        width: 40px;
        height: 40px;
        position: absolute;
        top: 15px;
        right: 15px;
        border-radius: 50%;
        background: center / 16px url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path class="cls-2" d="M60.61,50,92.8,17.8A7.5,7.5,0,1,0,82.2,7.2L50,39.39,17.8,7.2A7.5,7.5,0,0,0,7.2,17.8L39.39,50,7.2,82.2A7.5,7.5,0,1,0,17.8,92.8L50,60.61,82.2,92.8A7.5,7.5,0,0,0,92.8,82.2Z" fill="%23FFFFFF"/></svg>') no-repeat var(--v24-black);
    }
    #toc2_area .toc2_area_inner > p.title {
        margin-bottom: 5px;
        border-bottom: 1px solid var(--v24-black);
        line-height: 1.6;
    }
    #toc2_area .toc2_area_inner .toc2_lists {
        max-height: calc((10px * 2 + 1.6em + 1px) * 8); /* 8行表示 */
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #999 #eee;
    }
    .vh_l #toc2_area .toc2_area_inner .toc2_lists {
        max-height: calc((10px * 2 + 1.6em + 1px) * 7); /* 7行表示（Lサイズ画面） */
    }
    .vh_m #toc2_area .toc2_area_inner .toc2_lists,
    .vh_s #toc2_area .toc2_area_inner .toc2_lists {
        max-height: calc((10px * 2 + 1.6em + 1px) * 5); /* 5行表示（S,Mサイズ画面） */
    }
    #toc2_area .toc2_area_inner .toc2_lists li a {
        padding: 10px 0 10px 16px;
        border-bottom: 1px solid var(--v24-royalbeige);
    }
    #toc2_area .toc2_area_inner .toc2_lists li a p {
        overflow: hidden;
        display: -webkit-box;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;  /* 1行表示 */
        line-height: 1.6;
    }
    #toc2_area .toc2_area_inner .toc2_lists li.current::before {
        content: '';
        display: inline-block;
        position: absolute;
        top: calc(50% - 4px);
        left: 0;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background-color: var(--buysell-gold);
        animation: blinkAnime 3s infinite;
    }
    #toc2_area .toc2_area_inner .toc2_lists li.current a {
        font-weight: bold;
        color: var(--buysell-gold);
    }

    /* -- おすすめ記事 */
    .draggable-detail .draggable_column_recommends {
        margin-bottom: 0;
    }
    .draggable-detail .draggable_column_recommends > p.title {
        margin-bottom: 10px;
        border-bottom: 1px solid var(--v24-black);
        line-height: 1.6;
    }
    .draggable-detail .draggable_column_recommends ul.recommend_columns {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .vh_s .draggable-detail .draggable_column_recommends ul.recommend_columns li:nth-child(2) {
        display: none; /* 1件表示（Sサイズ画面） */
    }
    .draggable-detail .draggable_column_recommends ul.recommend_columns li a {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 10px;
    }
    .draggable-detail .draggable_column_recommends ul.recommend_columns li a img {
        width: 100px;
        height: 65px;
        object-fit: cover;
        border-radius: 5px;
    }
    .draggable-detail .draggable_column_recommends ul.recommend_columns li a img:hover {
        opacity: 1;
    }
    .draggable-detail .draggable_column_recommends ul.recommend_columns li a p {
        display: block;
        width: calc( 100% - 100px - 10px );
        overflow: hidden;
        display: -webkit-box;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        line-height: 1.4;
    }

}