@charset "utf-8";
/**********************************************************************/
/*column_title*/
.column_title_cont {
    width: 100%;
    max-width: 1200px;
    margin: 10rem auto 0rem auto;
}
.column_title_cont h1 {
    font-size: 40px;
    color: #122b86;
    padding-bottom: 30px;
    border-bottom: 1px solid #122b86;
}
.column_title_cont p.date {
    font-size: 20px;
    padding: 20px 0;
}
/*fv_column*/
.fv_column_cont {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}
/* WPのアイキャッチは width/height 属性付きで出力されるため、幅だけ指定すると比率が崩れる */
.fv_column_cont img,
section#column_cont img {
    height: auto;
}
.fv_cont p {
    font-size: 12px;
    text-align: right;
}
/*column_cont*/
section#column_cont {
    width: 100%;
    max-width: 940px;
    margin: 60px auto;
}
section#column_cont h3 {
    font-size: 24px;
    font-weight: bold;
    color: #122b86;
    padding-bottom: 16px;
    border-bottom: 1px solid #122b86;
    margin-bottom: 16px;
}
section#column_cont h3:empty,
section#column_cont p:empty {
    display: none;
}

section#column_cont p {
    margin-bottom: 60px;
}
section#column_cont img {
    margin-bottom: 60px;
    object-fit: contain;

}
section#column_cont p.sub_ttl {
    position: relative;
    font-size: 20px;
    font-weight: 600;
    color: #123b86;
    padding-bottom: 15px;
    width: 100%;
    margin-bottom: 0;
}
section#column_cont p.sub_ttl:before {
    content: "■";
    padding-right: 5px;
}

@media screen and (min-width: 1025px) and (max-width: 1180px) {
    /*fv_column*/
    .fv_column_cont {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }
    .fv_column_cont img {
        width: 100%;
    }
}
@media screen and (min-width: 600px) and (max-width: 1024px) {
    /*column_title*/
    .column_title_cont {
        width: 100%;
        max-width: 94vw;
        /* 現行は margin: 0 auto で、769〜1024px では固定ヘッダー（高さ139px）の裏にタイトルが隠れていた */
        margin: 10rem auto 0;
    }
    .column_title_cont h1 {
        font-size: 36px;
        color: #122b86;
        padding-bottom: 14px;
        border-bottom: 1px solid #122b86;
    }
    .column_title_cont p.date {
        font-size: 18px;
        padding: 4px 0 20px;
    }
    /*fv_column*/
    .fv_column_cont {
        width: 100%;
        max-width: 94vw;
        margin: 0 auto;
    }
    .fv_column_cont img {
        width: 100%;
    }
    .fv_cont p {
        font-size: 12px;
        text-align: right;
    }
    /*column_cont*/
    section#column_cont {
        width: 100%;
        max-width: 86vw;
        margin: 40px auto 40px;
    }
    section#column_cont h3 {
        font-size: 22px;
        font-weight: bold;
        color: #122b86;
        padding-bottom: 10px;
        border-bottom: 1px solid #122b86;
        margin-bottom: 10px;
    }
    section#column_cont p {
        margin-bottom: 20px;
        font-size: 16px;
        line-height: 1.6;
    }
    section#column_cont img {
        width: 100%;
        margin-bottom: 40px;
    }
    section#column_cont p.sub_ttl {
        position: relative;
        font-size: 20px;
        font-weight: 600;
        color: #123b86;
        padding-bottom: 10px;
        width: 100%;
        margin: 20px 0 0;
    }
}
@media screen and (max-width: 768px) {
    /*column_title*/
    .column_title_cont {
        width: 100%;
        max-width: 94vw;
		margin: 4.85rem auto 0 ;
    }
    .column_title_cont h1 {
        font-size: 5vw;
        color: #122b86;
        padding-bottom: 14px;
        border-bottom: 1px solid #122b86;
		padding: 1.5rem 0 1rem 0;
    }
    .column_title_cont p.date {
        font-size: 3vw;
        padding: 4px 0 20px;
    }
    /*fv_column*/
    .fv_column_cont {
        width: 100%;
        max-width: 94vw;
        margin: 0 auto;
    }
    .fv_column_cont img {
        width: 100%;
    }
    .fv_cont p {
        font-size: 12px;
        text-align: right;
    }
    /*column_cont*/
    section#column_cont {
        width: 100%;
        max-width: 94vw;
        margin: 20px auto;
    }
    section#column_cont h3 {
        font-size: min(5.5vw, 20px);
        line-height: 1.4;
        font-weight: bold;
        color: #122b86;
        padding-bottom: 10px;
        border-bottom: 1px solid #122b86;
        margin-bottom: 10px;
    }
    section#column_cont p {
        margin-bottom: 20px;
        font-size: min(5vw, 16px);
        line-height: 1.7;
    }
    section#column_cont img {
        width: 100%;
        margin-bottom: 40px;
    }
    section#column_cont p.sub_ttl {
        position: relative;
        font-size: 4vw;
        font-weight: 600;
        color: #123b86;
        padding-bottom: 10px;
        width: 100%;
        margin: 20px 0 0;
    }
}

/* 記事上部の画像は元画像の幅を上限に中央表示（04-style.css の img{width:100%} で拡大されるのを防ぐ）。
   上のメディアクエリの width:100% より後に置くこと。
   revert-layer で width 属性の値に戻す（auto だと読み込み前が 0×0 になりレイアウトがずれる） */
.fv_column_cont img {
    display: block;
    width: auto;
    width: revert-layer;
    max-width: 100%;
    margin: 0 auto;
}