.archive_container .container{
    display: flex;
    justify-content:space-between;
    align-items: flex-start;
}


/*投稿一覧*/
.archive_container .container .post_wrapper,
.post{
    width:66.96%;
} 
.archive_container .container .post_wrapper .post_content{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
}
.archive_container .container .post_wrapper .post_content::after{
    content:"";
    display: block;
    width:calc((100% - 3% ) / 3);
}
.archive_container .container .post_content article{
    width:calc((100% - 3% ) / 3);
    margin-top:1.25rem;
}
.archive_container .container .post_content article a,
.new_post article a{
    color:white;
    transition: .3s;
}
.archive_container .container .post_content article a:hover,
.new_post article a:hover{
    opacity: .8;
}
.archive_container .container .post_content article a:hover .blog_thumbnail img,
.new_post article a:hover .blog_thumbnail img{
    transform: scale(1.1);
}
.archive_container .container .post_content article .blog_thumbnail,
.new_post article .blog_thumbnail{
    width: 100%;
    aspect-ratio: 350 / 220; /* 比率を固定 */
    overflow: hidden;   
}
.archive_container .container .post_content article .blog_thumbnail img,
.new_post article .blog_thumbnail img{
    width:100%;
    height:100%;
    object-fit: cover;
    transition: .3s;
}
.archive_container .container .post_content article h3,
.new_post article h3{
    font-size: 1.125rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;      /* 行数を指定 */
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top:1.25rem;
    margin-bottom:.5rem;
}
.archive_container .container .post_content article .date,
.new_post article .date{
    font-size: 0.875rem;
}


/*ページネーション*/
.page-nation{
    margin:6.25rem auto 0 auto;
    text-align: center;
}
.wp-pagenavi .pages{
    display: none;
}
.wp-pagenavi span.current{
    border-color: transparent !important;
    background-color: white;
}
.wp-pagenavi a{
    color:white;
}
.wp-pagenavi a, .wp-pagenavi span{
    border:none !important;
}



/*サイドバー*/
.side_bar{
    width:calc((100% - 66.96%) - 5%);
}
.cat_wrapper{
    width:100%;
    background-color: #273243;
    padding:1.875rem 0;
    color:white;
}
.cat_area{
    width:80%;
    margin:0 auto;
}
.cat_area h3{
    font-size: 1.25rem;
    margin-left:1.25rem;
    position: relative;
    margin-bottom:10px;
}
.cat_area h3::after{
    content:"";
    display: block;
    width:10px;
    height:10px;
    background-color: #FFC400;
    border-radius: 9999px;
    position: absolute;
    top:50%;
    left:-20px;
    transform: translateY(-50%);
}
.cat_area ul li{
    list-style: none;
    margin-top:1.25rem;
}
.cat_area ul .cat_sel a{
    color:#FFC400;
    pointer-events: none;
}

.cat_area ul li a{
    color:white;
    font-weight: 700;
    transition: .3s;
}
.cat_area ul li a:hover{
    color:#FFC400;
}

.new_post{
    margin-top:3.75rem;
}
.new_post .side_ttl{
    width:100%;
    border-bottom:solid 1px white;
    color:white;
    padding-bottom:10px;
}
.new_post article{
    width:calc(100% - 3.75rem);
    margin:1.875rem auto 0 auto;
}




/*投稿ページ*/
.container.pank{
    padding:0 !important;
}
.pan_list{
    margin-top:98px;
    display: flex;
    flex-wrap: wrap;
}
.post{
    color:white;
}
.post_ttl h2{
    font-size: 1.25rem;
    padding:10px 0 1.25rem 0;
    border-bottom:solid 1px white;
}

.content{
    margin-top:2.5rem;
}

.archive_btn{
    width:100%;
    margin:5rem auto 3.75rem auto;
    text-align: center;
}
.archive_btn a{
    display: inline-block;
    padding:1.25rem 3.125rem;
    text-align: center;
    background-color: #273243;
    color:white;
    font-size: 1.25rem;
    font-weight: bold;
    transition: .3s;
}
.archive_btn a:hover{
    opacity: .8;
}

.content h1, .content h2, .content h3 , .content h4{
    margin:1rem 0;
}
.content h2{
    background-color: #273243;
    padding:1.25rem;
    width:calc(100% - 2.5rem);
}
.content h3{
    border-bottom:solid 1px white;
    padding-bottom:10px;
}
.content h4{
    color:#FFC400;
}
.content p {
    line-height:30px;
}


/*------------------------------------------------------------------
                                レスポンシブ
--------------------------------------------------------------------*/

@media(max-width:1440px){
    /*投稿ページ*/
    .pan_list{
        margin-top: 6.81vw;
    }
}


@media(max-width:1024px){
    /*投稿一覧*/
    .archive_container .container .post_wrapper article{
        width: calc((100% - 8%) / 2);
    }

    /*投稿ページ*/
    .pan_list{
        margin-top: 7.81vw;
    }
}


@media(max-width:768px){
    .archive_container .container{
        flex-flow: column;
    }
    .archive_container .container .post_wrapper,
    .post {
        width: 100%;
    }
    .archive_container .container .post_wrapper article{
        width: calc((100% - 5%) / 3);
    }

    .side_bar {
        width: 100%;
        margin-top:3.75rem;
    }
    .new_post_wrapper{
        width:100%;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        flex-wrap: wrap;
    }
    .new_post article{
        width: calc((100% - 3%) / 3);
        margin: 1.875rem 0 0 0;
    }


    /*投稿ページ*/
    .pan_list{
        margin-top: 80px;
    }
}


@media(max-width:600px){
    .archive_container .container .post_content article,
    .new_post article{
        width: calc((100% - 3%) / 2);
    }

}


@media(max-width:425px){
    .archive_container .container{
        padding:2.5rem 0 3.75rem 0 !important;
    }

    /*投稿ページ*/
    .pan_list{
        margin-top: 60px;
    }
    .archive_btn{
        margin:2.5rem 0 3.75rem 0;
    }
    .archive_btn a{
        width:100%;
        padding:1.25rem 0;
    }
}