@charset "utf-8";/*文字コード指定*/

:root {/*変数定義-----------------------------------------------------------------------↓*/
    --bi_gree_pres: 15%;
    /*bi_gree_pres_copy,bi_gree_pres_imgのheight指定*/
}/*変数定義------------------------------------------------------------------------------↑*/

/*メモ帳
{{スマホを基本設計にする}}
    - 〜479px：SP縦
    - 480px〜599px：SP横
    - 600px〜959px：タブレット
    - 960px〜1279px：小型PC
    - 1280px〜：大型PC
*/

/*-------------------------------------------------------------------------------------------*/
/*▼SP_CSS ウィンドウ幅が480px~599pxの場合に適用                                       */
/*-------------------------------------------------------------------------------------------
@media screen and (min-width: 480px) {
    
}/*SP_CSS END*/

/*-------------------------------------------------------------------------------------------*/
/* ▼タブレット_CSS ウィンドウ幅が600px~959pxの場合に適用                           */
/*-------------------------------------------------------------------------------------------*/
@media screen and (min-width: 600px) {
    /*表示アニメ設定*/
    .animation-box{
        background-size:200%;
    }
    .animation-box.active{
        background-size:102%;
    }
    .bi_top {
        margin-bottom: 50px;
    }
    .bi_top_text {
        width: 55%;
        color: white;
        margin: 13% 0 0 10%;
    }
    .bi_top_text h1 {
        font-size: calc(2.6rem + ((1vw - 0.64rem) * 0.7143));
    }
    .bi_top_img {
        height: 50vw;
    }
    .container {
        width: 90%;
    }
    .container h2 {
        font-size: calc(2.3rem + ((1vw - 0.64rem) * 0.7143));
        margin-bottom: 15px;
        border-image: linear-gradient(to right, #c8161d 30%, #004994 100%)1;
        border-bottom: 5px solid #e6e6e6;
    }
    .container h3 {
        font-size: calc(2.1rem + ((1vw - 0.64rem) * 0.7143));
        margin-bottom: 10px;
        border-image: linear-gradient(to right, #c8161d 30%, #004994 100%)1;
        border-bottom: 5px solid #e6e6e6;
    }
    .container p {
        font-size:  calc(1.7rem + ((1vw - 0.64rem) * 0.7143));
    }
    .container p strong {
        font-size:  calc(1.8rem + ((1vw - 0.64rem) * 0.7143));
    }
    .bi_main p:nth-of-type(2) {
        margin-bottom: 60px;
    }
    .bi_main p:nth-of-type(3) {
        margin-bottom: 40px;
    }
    .bi_main p:nth-of-type(4) {
        margin-bottom: 65px;
    }
    .bi_main p:nth-of-type(5) {
        margin-bottom: 150px;
    }
    .bi_main img {
        width: 40%;
    }
}/*▼タブレット_CSS END*/

/*-------------------------------------------------------------------------------------------*/
/* ▼小型PC_CSS ウィンドウ幅が960px~の場合に適用                               */
/*-------------------------------------------------------------------------------------------*/
@media screen and (min-width: 960px) {
    .bi_top {
        margin-top: 120px;
        margin-bottom: 100px;
    }
    .bi_top_text {
        margin: 9% 0 0 20%;
        width: 43%;
        color: white;
    }
    .bi_top_text h1 {
        font-size: calc(3.0rem + ((1vw - 0.64rem) * 0.7143));
        line-height: 5rem;
    }
    .bi_top_img {
        height: 35vw;
        background-position: center top 4%;
    }
    .container {
        width: 60%;
    }
    .container h2 {
        font-size: calc(2.5rem + ((1vw - 0.64rem) * 0.7143));
        margin-bottom: 30px;
        line-height: 2;
    }
    .container h3 {
        font-size: calc(2.4rem + ((1vw - 0.64rem) * 0.7143));
        margin-bottom: 20px;
        display: block;
    }
    .container p {
        font-size:  calc(1.5rem + ((1vw - 0.64rem) * 0.7143));
    }
    .container p strong {
        font-size:  calc(1.7rem + ((1vw - 0.64rem) * 0.7143));
    }
    .bi_main p:nth-of-type(2) {
        margin-bottom: 100px;
    }
    .bi_main p:nth-of-type(3) {
        margin-bottom: 40px;
    }
    .bi_main p:nth-of-type(4) {
        margin-bottom: 100px;
    }
    .bi_main p:nth-of-type(5) {
        margin-bottom: 200px;
    }
}/*小型PC_CSS END*/

/*-------------------------------------------------------------------------------------------*/
/* ▼大型PC_CSS ウィンドウ幅が1280px以上の場合に適用                                    */
/*-------------------------------------------------------------------------------------------
@media screen and (min-width: 1280px) {
    
}/*大型PC_CSS END*/