@charset "utf-8";
/* CSS Document */

/*==============================*/
/* メッセージ */
/*==============================*/
.message{
	display: flex; display: -webkit-flex;
	justify-content: space-between; -webkit-justify-content: space-between;
	max-width: 1000px;
	width: 100%;
	margin: 0 auto;
}
    /* ======= SP =======*/
    @media (max-width: 767px) {
        .message{ flex-direction: column; -webkit-flex-direction: column; }
    }


/*-- 画像
------------------------- */
.message > p{ width: calc(45% - 8px);}

    /* ======= SP =======*/
    @media (max-width: 767px) {
        .message > p{ width: 100%;}
    }


/*-- コンテンツ
------------------------- */
.message div{
	position: relative;
	width: calc(55% - 8px);
	padding-top: 18px;
}
.message div:before{
	position: absolute; top: -104px; left: -96px;
	content: "";
	width: 182px;
	height: 180px;
	background: url("/common/img/share/bg_square.png")no-repeat;
	background-size: contain;
}
.message h2{
	position: relative;
	margin-bottom: 18px;
	font-size: 25px;
	font-weight: 600;
	line-height: 1.3em;
    font-family: "Noto Sans Japanese"; letter-spacing: -0.01em;
}
.message h2 span{
	position: relative; top: -3px;
	font-size: 25px;
	color: #006D8B;
	letter-spacing: -0.02em;
	margin: 0 -8px;
}

.message div p:not(:last-child){ margin-bottom: 16px;}

    /* ======= SP =======*/
    @media (max-width: 767px) {
        .message div{
            width: 94%;
            margin: 0 auto;
            padding-top: 0px;
        }
        .message div:before{
            position: absolute; top: -64px; left: -24px;
            width: 92px;
            height: 90px;
        }
        .message h2{
            margin-bottom: 12px;
            font-size: 22px;
        }
        .message h2 span{
            position: relative; top: -3px;
            font-size: 22px;
            color: #006D8B;
            letter-spacing: -0.02em;
            margin: 0 -8px;
        }

        .message div p:not(:last-child){ margin-bottom: 16px;}
    }
