@charset "utf-8";

/* ===========================================================================
    message
=========================================================================== */
.keyvisual { margin-bottom:0; }
.main h2 { color:#396fb9; font-size:20px; font-weight:normal; line-height:1.54; margin:40px 0 30px; }

/* mainvisual */
.main .mainvisual { margin:0 -20px; }
.main .mainvisual img { width:100%; }
.main .mainvisual p { background:#487ac0; background-image:linear-gradient(-45deg, #487ac0 50%, #396fb9 50%, #396fb9 100%); background-image:-webkit-linear-gradient(-45deg, #487ac0 50%, #396fb9 50%, #396fb9 100%); background-image:-moz-linear-gradient(-45deg, #487ac0 50%, #396fb9 50%, #396fb9 100%); background-image:-ms-linear-gradient(-45deg, #487ac0 50%, #396fb9 50%, #396fb9 100%); color:#fff; font-size:13px; font-weight:bold; line-height:1.7; position:relative; margin:-29px 13px 0; padding:7px 10px 10px 20px; z-index:2; }
.main .mainvisual p strong { font-size:17px; }

@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
}


@media screen and (min-width: 640px) {
.keyvisual { margin-bottom:0; }
.main p { font-size:1.14em; line-height:2.25; max-width:730px; margin:35px auto 0; padding:0 20px; }
.main h2 { font-size:3.1em; text-align:center; margin:127px 40px 68px; }

/* mainvisual */
.main .mainvisual { position:relative; margin:0; }
.main .mainvisual p { display:inline-block; font-size:1.65em; line-height:1.6; max-width:initial; position:absolute; top:50%; left:0; right:40%; margin:0; padding:24px 40px 32px; transform:translate(0,-50%); }
.main .mainvisual p strong { font-size:1.65em; }
}

@media screen and (min-width: 1400px) {
/* mainvisual */
.main .mainvisual p { right:auto; }
}


@media only screen and (min-width: 639px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-width: 639px) and (min-device-pixel-ratio: 2) {
}