@charset "UTF-8";


/* common
------------------------------------*/
.messageLayout .q_txt {
    background-color: #eab330;
    display: inline-block;
    padding: 10px 20px;
    border-radius: 60px;
    color: #fff;
    font-weight: bold;
    margin-bottom: 30px;
}
.messageLayout .disc_li {
    color: #0071be;
    font-weight: bold;
}
.messageLayout h4 {
    margin-bottom: 30px;
    padding-left: 25px;
    position: relative;
    color: #0071be;
    font-size: 1.2rem;
    font-weight: bold;
}
.messageLayout h4::before {
    position: absolute;
    content: "";
    width: 18px;
    height: 6px;
    top: 11px;
    left: 0;
    background-color: #0071be;
}
.messageLayout #main .cassette p {
    line-height: 3;
}
.messageLayout #main .cassette h4 p {
    line-height: 1.8;
}
.messageLayout #main .cassette h3 p {
    line-height: 1.2;
}

            /* 【スマートフォン用のスタイル記述】 */
            @media screen and (min-width: 760px) {
                .messageLayout .q_txt {
                    padding: 10px 30px;
                    margin-bottom: 40px;
                }
                .messageLayout .disc_li {
                    font-size: 1.4rem;
                }
            }

            /* 【タブレット用のスタイル記述】 */
            @media screen and (min-width: 960px) {
            }


/* c01
------------------------------------*/
.messageLayout #c01 .inner, .messageLayout #c02 .inner {
    max-width: 1800px;
}
.messageLayout #c01 .img {
    position: relative;
}
.messageLayout #c01 .name {
    position: absolute;
    bottom: 20px;
    left: 0;
    padding: 10px;
    background-color: rgba(255,255,255,0.9);
}
.messageLayout #c01 .name img {
    max-width: 200px;
}

            /* 【スマートフォン用のスタイル記述】 */
            @media screen and (min-width: 760px) {
                .messageLayout #c01 .name {
                    bottom: 30px;
                    padding: 20px;
                }
                .messageLayout #c01 .name img {
                    max-width: 250px;
                }
            }

            /* 【タブレット用のスタイル記述】 */
            @media screen and (min-width: 960px) {
                .messageLayout #c01 .name img {
                    max-width: 100%;
                }
            }


/* c02
------------------------------------*/
.messageLayout #c02 h3.text {
    color: #0071be;
    font-size: 1rem;
    text-align: center;
    letter-spacing: 2px;
    margin-bottom: 60px;
}
.messageLayout #c02 h3.text .en {
    font-size: 2.5rem;
    margin-top: 10px;
}
.messageLayout #c02 .ex_bg .mbgextend .bgappear {
    background-image: url("../img/message/message_c02_img01.png");
}
.messageLayout #c02 .ex_bg {
    margin-top: 60px;
}
.messageLayout #c02 .g_box h4 {
    margin-bottom: 20px;
}


            /* 【スマートフォン用のスタイル記述】 */
            @media screen and (min-width: 760px) {
                .messageLayout #c02 h3.text {
                    font-size: 1.5rem;
                }
                .messageLayout #c02 h3.text .en {
                    font-size: 5.5rem;
                }
                .messageLayout #c02 h4 {
                    font-size: 1.4rem;
                }
            }

            /* 【タブレット用のスタイル記述】 */
            @media screen and (min-width: 960px) {
                .messageLayout #c02 h3.text {
                    font-size: 2rem;
                }
                .messageLayout #c02 h3.text .en {
                    font-size: 10.5rem;
                }
                .messageLayout #c02 h4 {
                    margin-bottom: 60px;
                    font-size: 1.4rem;
                }
                .messageLayout #c02 .ex_bg {
                    margin-bottom: 60px;
                }
                .messageLayout #c02 .ex_bg {
                    margin-top: 120px;
                }
            }

/* c03
------------------------------------*/
.messageLayout #c03 .ex_bg .mbgextend .bgappear {
    background-image: url("../img/message/message_c02_img02.png");
}
.messageLayout #c03 .ex_bg {
    margin-bottom: 0;
    padding-bottom: 0;
}


            /* 【スマートフォン用のスタイル記述】 */
            @media screen and (min-width: 760px) {
            }

            /* 【タブレット用のスタイル記述】 */
            @media screen and (min-width: 960px) {
            }


/* c04
------------------------------------*/
.messageLayout #c04 .disc_li li {
    color: #333;
}
.messageLayout #c04 .ex_bg .mbgextend .bgappear {
    background-image: url("../img/message/message_c02_img03.png");
}


            /* 【スマートフォン用のスタイル記述】 */
            @media screen and (min-width: 760px) {
            }

            /* 【タブレット用のスタイル記述】 */
            @media screen and (min-width: 960px) {
                .messageLayout #c04 .ex_bg {
                    padding-bottom: 0;
                }
            }