@charset 'UTF-8';
/* ==========================================
   画像系コンポーネント
   ========================================== */
/* --- KVイメージ (bl_post-kv) --- */
.bl_post-kv
{
    overflow: hidden;

    margin-bottom: min(calc(24 / 1440 * 100vw), 24px); 

    border: solid 1px #c4c4c4;
    border-radius: min(calc(8 / 1440 * 100vw), 8px);
}
.bl_post-kv img
{
    display: block;

    width: calc(100% + 2px);
    max-width: none;
    margin-top: -1px;
    margin-left: -1px;
}

/* --- コンテンツ内画像 (bl_post-img) --- */
.bl_post-img
{
    margin-block: min(calc(24 / 1440 * 100vw), 24px);
}
.bl_post-img img
{
    display: block;
    overflow: hidden; 

    width: 100%;

    border-radius: min(calc(8 / 1440 * 100vw), 8px);
}

/* --- 企業ロゴ (bl_post-company_logo) --- */
.bl_post-company_logo
{
    overflow: hidden;

    width: auto;
    height: min(calc(180 / 1440 * 100vw), 180px);
    padding: min(calc(5 / 1440 * 100vw), 5px) 0;

    border: solid 1px #c4c4c4;
    border-radius: min(calc(8 / 1440 * 100vw), 8px);
    background: #fff;

    margin-block: min(calc(16 / 1440 * 100vw), 16px) min(calc(64 / 1440 * 100vw), 64px);
}
.bl_post-company_logo img
{
    display: block;

    height: 100%;
    max-height: 100%;

    margin-inline: auto;
}

/* --- キャプション付き画像 (bl_post-figure) --- */
.bl_post-figure
{
    margin-block: min(calc(24 / 1440 * 100vw), 24px);
}
.bl_post-figure img
{
    display: block;
    overflow: hidden; 

    width: 100%;

    border-radius: min(calc(8 / 1440 * 100vw), 8px);
}
.bl_post-figure-caption
{
    font-size: min(calc(12 / 1440 * 100vw), 12px); 
    line-height: 1.65;

    margin-top: min(calc(8 / 1440 * 100vw), 8px);

    text-align: center;

    color: #565656;
}

/* --- 3列キャプション付き画像 (bl_post-figure_3col) --- */
.bl_post-figure_3col
{
    display: grid;

    margin-top: min(calc(24 / 1440 * 100vw), 24px); 

    grid-template-columns: repeat(3, 1fr);
    gap: min(calc(25 / 1440 * 100vw), 25px) min(calc(24 / 1440 * 100vw), 24px);
}
.bl_post-figure_3col-item-figure-img
{
    overflow: hidden;

    border-radius: min(calc(8 / 1440 * 100vw), 8px);
}
.bl_post-figure_3col-item-figure-img img
{
    display: block;

    width: 100%;
}
.bl_post-figure_3col-item-figure-caption
{
    font-size: min(calc(14 / 1440 * 100vw), 14px); 
    line-height: 1.5;

    margin-top: min(calc(8 / 1440 * 100vw), 8px);

    text-align: center;

    color: #565656;
}

/* --- 画像グループ (bl_post-images) --- */
.bl_post-images
{
    margin-top: min(calc(24 / 1440 * 100vw), 24px);
}
.bl_post-images-item
{
    overflow: hidden;

    border-radius: min(calc(8 / 1440 * 100vw), 8px);
}
.bl_post-images-item img
{
    display: block;

    width: 100%;
}

/* ==========================================
   レスポンシブ（SP）
   ========================================== */
@media only screen and (max-width: 767px)
{
    /* KVイメージ */
    .bl_post-kv
    {
        margin-bottom: calc(24 / 390 * 100vw); 

        border-radius: calc(8 / 390 * 100vw);
    }
    /* コンテンツ内画像 */
    .bl_post-img
    {
        margin-block: calc(24 / 390 * 100vw);
    }
    .bl_post-img img
    {
        border-radius: calc(8 / 390 * 100vw);
    }
    /* 企業ロゴ */
    .bl_post-company_logo
    {
        height: calc(110.95 / 390 * 100vw);

        border-radius: calc(8 / 390 * 100vw);

        margin-block: calc(40 / 390 * 100vw);
    }
    .bl_post-company_logo img
    {
        max-height: 100%;
    }
    /* キャプション付き画像 */
    .bl_post-figure
    {
        margin-block: calc(24 / 390 * 100vw);
    }
    .bl_post-figure img
    {
        border-radius: calc(8 / 390 * 100vw);
    }
    .bl_post-figure-caption
    {
        font-size: calc(12 / 390 * 100vw); 

        margin-top: calc(8 / 390 * 100vw);
    }
    /* 3列キャプション付き画像 */
    .bl_post-figure_3col
    {
        margin-top: calc(16 / 390 * 100vw); 

        grid-template-columns: 1fr;
        gap: calc(16 / 390 * 100vw);
    }
    .bl_post-figure_3col-item-figure-img
    {
        border-radius: calc(8 / 390 * 100vw);
    }
    .bl_post-figure_3col-item-figure-caption
    {
        font-size: calc(14 / 390 * 100vw); 

        margin-top: calc(8 / 390 * 100vw);
    }
    /* 画像グループ */
    .bl_post-images
    {
        margin-top: calc(16 / 390 * 100vw);
    }
    .bl_post-images-item
    {
        border-radius: calc(8 / 390 * 100vw);
    }
}