@charset "UTF-8"; 
.page_promo .promo_inner .promo_ttl {
    text-align: center;
    font-size: 4rem;
    letter-spacing: .03em;
    font-family: "Cormorant Garamond", serif;
    margin-bottom: 1rem;
}

.single .page_promo .promo_inner .promo_ttl {
    display: none;
}

/* メイン > ページナビ */
#pager {
    padding-top: 3.5rem;
    /* 30px */
}

#pager, .wp-pagenavi {
    display: flex;
    justify-content: center;
    padding-bottom: 10rem;
}

#pager a, #pager .dot, #pager .extend, #pager .current {
    width: 3rem;
    /* 30px */
    height: 2.8rem;
    /* 28px */
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2rem;
    border: 1px solid #c8c8c8;
    color: #808080;
    margin: 0 .4rem;
    /* 0 4px */
}

#pager a:hover {
    opacity: .7;
}

#pager #current, #pager .current {
    color: #fff;
    border: none;
    background: #003559;
}

#pager .previous_link, #pager .previouspostslink {
    margin-right: 4rem;
    /* 40px */
}

#pager .next_link, #pager .nextpostslink {
    margin-left: 4rem;
    /* 40px */
}

.single main {
    padding-bottom: 19rem;
}

.post_wrap h1 {
    font-size: 3rem;
    letter-spacing: .03em;
    line-height: 1.5333333333;
    margin-bottom: 1rem;
    font-weight: 400;
}

.post_wrap .meta {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-bottom: 4rem;
}

.post_wrap .meta .date {
    font-size: 1.6rem;
    letter-spacing: .03em;
}

.post_wrap .meta .cat {
    font-family: "Cormorant Garamond", serif;
    font-size: 1.8rem;
    letter-spacing: .03em;
    font-weight: 500;
}

.wp-editor.type-post img {
    width: 100%;
}

.post_img {
    display: grid;
    gap: 4rem;
    margin-bottom: 4.5rem;
}

.post_img img {
    width: 100%;
}

.post_img figure {
    margin: 0;
}

.wp-editor {
    max-width: 80rem;
    margin-left: auto;
    line-height: 2.25;
}

p.archive_btn a {
    font-size: 2rem;
    letter-spacing: .03em;
    font-weight: 500;
    font-family: "Cormorant Garamond", serif;
    padding-right: 3.5rem;
    position: relative;
    margin-left: auto;
    display: table;
    margin-top: 5rem;
}

p.archive_btn a::after {
    position: absolute;
    content: "";
    mask: url(../images/common/arrow.svg) no-repeat 50% / contain;
    width: 2.6rem;
    height: .6rem;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: 0;
    background: #000;
    transition: transform 2s ease;
}

p.archive_btn a:hover::after {
    transform: rotate3d(1,0,0,720deg);
    transition: 2s;
}

/*================================================================================================
*  スマートフォン向けデザイン
================================================================================================*/
@media screen and (max-width: 768px) {
    .page_promo .promo_inner .promo_ttl {
        font-size: 5.2rem;
        text-align: left;
    }

    #pageTitle {
        height: auto;
    }

    .single main {
        padding-bottom: 0;
    }

    #index .contents {
        min-width: auto;
        width: var(--base_width02);
        padding: 0;
    }

    /* サイド */
    #index #sidebar {
        width: 100%;
        height: 8rem;
        margin-bottom: 8.4rem;
    }

    .single #index #sidebar {
        display: none;
    }

    #index #sidebar .cat_select select {
        display: flex;
        align-items: center;
        border: .2rem solid #C8C8C8;
        background: url(../images/common/select_arrow.svg) no-repeat;
        background-position: right 4vw center;
        background-size: 2.4rem auto;
        background-color: #fff;
        font-size: 3.2rem;
        padding: 0 9rem 0 4rem;
        width: 98%;
        height: 8rem;
        border-radius: .6rem;
        appearance: none;
        margin: 0 auto;
    }
    
    .post_wrap h1 {
        font-size: 4.4rem;
        line-height: 1.6363636363;
        margin-bottom: 1rem;
    }

    .post_wrap .meta {
        align-items: center;
    }

    .post_wrap .meta .date {
        font-size: 3.2rem;
        letter-spacing: .03em;
    }
    
    .post_wrap .meta .cat {
        font-size: 3.2rem;
    }

    /* メイン */
    #index #main_column {
        width: 100%;
        padding-top: 0;
    }

    #index #main_column ul.post_list2 {
        margin-bottom: 6rem;
    }

    #index #main_column ul.post_list2 li {
        padding: 5.2rem 0;
    }

    #index #main_column ul.post_list2 li .img_area {
        width: 15rem;
        height: 15rem;
    }

    #index #main_column ul.post_list2 li .img_area img {
        border-radius: 2rem;
    }

    #index #main_column ul.post_list2 li .text_area {
        width: calc(100% - 18.8rem);
        padding-top: 0;
    }

    #index #main_column ul.post_list2 li .text_area .date {
        font-size: 2.8rem;
    }

    #index #main_column ul.post_list2 li .text_area .cat {
        font-size: 2.2rem;
        padding: .8rem 1.8rem;
        margin-left: 3rem;
    }

    #index #main_column ul.post_list2 li .text_area h3 a {
        font-size: 3rem;
        line-height: 1.5;
        margin-top: 1rem;
    }

    /* メイン > ページナビ */
    #pager_sp .page_number {
        text-align: center;
        font-size: 2.6rem;
        margin-bottom: 2.4rem;
    }

    #pager_sp .pager_nav {
        display: flex;
        border: .1rem solid var( --theme_m_color);
        border-right: none;
        width: 96%;
        height: 10rem;
        margin: 0 auto;
    }

    #pager_sp .pager_nav li, #pager_sp .pager_nav li a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        flex-shrink: 0;
        font-size: 2.6rem;
        color: var( --theme_m_color);
    }

    #pager_sp .pager_nav li {
        width: 34%;
        border-right: .2rem solid var( --theme_m_color);
    }

    #pager_sp .pager_nav li:nth-of-type(1), #pager_sp .pager_nav li:nth-of-type(4) {
        width: 16%;
    }

    /* メイン > single */
    .single #index #main_column {
        padding-top: 0;
    }

    .single #index #main_column .meta {
        margin-bottom: 2.4rem;
    }

    .single #index #main_column .meta .date {
        font-size: 2.8rem;
        margin-right: 1em;
    }

    .single #index #main_column .meta .cat {
        font-size: 2.4rem;
        padding: .8rem 2rem;
        min-width: 14rem;
        height: 4.4rem;
    }

    .single #index #main_column h1 {
        font-size: 4rem;
        line-height: 1.5;
        margin-bottom: 5rem;
    }

    /* メイン > single > slick */
    .slider-container {
        margin-top: 6rem;
    }

    .slick-prev, .slick-next {
        top: calc(50% - 13.333vw - 0.5em);
        padding: 13.333vw 1.333vw;
        font-size: 6.667vw;
    }

    .slide .item {
        width: 100%;
        height: 51.2vw;
    }

    /* メイン > single > slick > ナビ */
    .slide-navigation {
        margin: 4vw -0.5rem -1rem;
        /* -5px -10px */
    }

    .slide-navigation .item {
        width: calc(25% - 1rem);
        /* 10px */
        margin: 0 .5rem 1rem;
        /* 5px 10px */
    }

    /* メイン > single > 戻るボタン */
    .single #index #main_column .return {
        margin-top: 16vw;
    }

    .single #index #main_column .return a {
    }

    .single #index #main_column .return a::before {
        width: 3rem;
        height: 3rem;
    }

    #pager a, #pager .dot, #pager .extend, #pager .current {
        width: 6rem;
        height: 6rem;
        font-size: 3.2rem;
        font-weight: 400;
        background: #fff;
        color: inherit;
        border: 1px solid;
    }

    #pager, .wp-pagenavi {
        padding-bottom: 0;
    }

    p.archive_btn a {
        font-size: 3.6rem;
        width: 43rem;
        height: 10rem;
        border: 1px solid #000;
        display: grid;
        justify-content: center;
        align-items: center;
        margin: 14rem auto 0;
        padding: 0;
    }

    p.archive_btn a::after {
        content: none;
    }
}