@charset 'UTF-8';
/* ----------------------------------------------
　PC設定
------------------------------------------------*/
.p-blog
{
    margin-bottom: var(--m180);
}
.p-blog__list
{
    display: flex;

    flex-wrap: wrap;
    grid-gap: var(--m60) 3.3333%;
}
.p-blog__list-box
{
    width: 22.5%;
}
.p-blog__list-link
{
    display: flex;
    overflow: hidden;
    flex-direction: column-reverse;

    border: 1px solid var(--gray01);
    border-radius: var(--m10);

    align-items: center;
}
.p-blog__list-inner
{
    padding: var(--m16) var(--m20) var(--m60);
}
.p-blog__list-date
{
    font-size: 14px;
    font-weight: bold;

    display: block;

    margin-bottom: 1em;

    text-align: right;
}
.p-blog__list-text
{
    font-size: var(--fs16_18);
    font-weight: bold;
}
.p-blog__list-image
{
    overflow: hidden;

    aspect-ratio: 270/183;
}
.p-blog__list-image img
{
    height: 100%;

    -o-object-fit: cover;

       object-fit: cover;
}

.l-contents:has(.p-blog-detail) .c-breadcrumb
{
    margin-bottom: var(--m75);
}

.p-blog-detail
{
    margin-bottom: var(--m200);
}
.p-blog-detail__date
{
    font-size: var(--fs16_24);
    font-weight: bold;

    margin-bottom: 1em;

    text-align: right;
}
.p-blog-detail__image
{
    overflow: hidden;

    margin-bottom: var(--m80);

    aspect-ratio: 12/7;
}
.p-blog-detail__image img
{
    height: 100%;

    -o-object-fit: cover;

       object-fit: cover;
}
.p-blog-detail__detail
{
    margin-bottom: var(--m140);
}
.p-blog-detail__detail h1,
.p-blog-detail__detail h2,
.p-blog-detail__detail h3,
.p-blog-detail__detail h4,
.p-blog-detail__detail p
{
    font-size: revert;
    font-weight: revert;
    line-height: 2;
    margin: revert;
    color: revert;
}
.p-blog-detail__detail b,
.p-blog-detail__detail strong
{
    font-size: revert;

    color: revert;
}
.p-blog-detail__detail p
{
    min-height: 1em;
}
.p-blog-detail__detail p:has(img)
{
    text-align: center;
}
.p-blog-detail__detail img
{
    max-width: 800px;
    margin: 1rem 0;
}
.p-blog-detail__detail a:has(img)
{
    display: block;

    max-width: -moz-fit-content;

    max-width: fit-content;
    margin: 0 auto;

    text-align: center;
}
.p-blog-detail .c-button
{
    max-width: 253px;
    margin-right: auto;
    margin-left: auto;
}

/* ----------------------------------------------
　PAD以下設定
------------------------------------------------*/
@media all and (max-width: 1024px)
{
    .p-blog__list-box
    {
        width: 31.11%;
    }
}
/* ----------------------------------------------
　SP調整
------------------------------------------------*/
@media all and (max-width: 620px)
{
    .p-blog__list-box
    {
        width: 48.33%;
    }
}