@charset "utf-8";

/* common */

body {
font-family: 'Noto Sans JP', メイリオ, Meiryo, "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", sans-serif;
font-weight: 400 !important;
font-size: 14px;
line-height: 1.8;
color: #000 !important;
-webkit-animation: fadeIn 1.5s ease 0s 1 normal;
animation: fadeIn 1.5s ease 0s 1 normal;
overflow-x: hidden;
}
header {
background-image: url("../images/mv/bg01.png")
}
  @keyframes fadeIn {
    0% {
      opacity: 0
    }

    100% {
      opacity: 1
    }
  }

  @-webkit-keyframes fadeIn {
    0% {
      opacity: 0
    }

    100% {
      opacity: 1
    }
  }
 
 
@media all and (max-width: 640px) {
body {font-size: 12px;}
}
h1,h2,h3,h4 { margin: 0 !important; }

.fn_en { font-family: "Barlow Semi Condensed", sans-serif; font-weight: 400; }
.fn_ent { font-family: "Barlow Semi Condensed", sans-serif; font-weight: 300; }
.color_DB { color: #12263f !important; }
.color_PK { color: #e8a8b9 !important; }
.color_SB { color: #4bc1fe !important; }
img { max-width: 100%; height: auto; }

.ps_rlt { position: relative; }
.al_center { margin: 0 auto; }

.pcB, .pcB2, .pcB3 { display: inherit; }
.spB, .spB2, .spB3 { display: none; }
@media all and (max-width: 900px) {
.pcB { display: none; }
.spB { display: inherit; }
}
@media all and (max-width: 640px) {
.pcB2 { display: none; }
.spB2 { display: inherit; }
}
@media all and (max-width: 480px) {
.pcB3 { display: none; }
.spB3 { display: inherit; }
}

a img {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
	filter:alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;
}
a img:hover {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}




.container { width: 100%; max-width: 1680px !important; padding: 100px 30px !important; margin: 0 auto; }
.container2 { width: 100%; max-width: 1080px !important; padding: 100px 30px !important; margin: 0 auto; }
.container3 { width: 100%; max-width: 1280px !important; padding: 100px 30px !important; margin: 0 auto; }

@media all and (max-width: 640px) {
.container,.container2,.container3 { padding: 60px 20px !important; }
}




/* footer */
.footer { 
padding: 16px 20px;
background-color: #1d3048;
}
.footer p.cr_txt { font-size: 12px !important; margin-top: 5px; color: #e0e3e9; text-align: center; letter-spacing: 0.5px; }
@media all and (max-width: 640px) {
.footer p.cr_txt { font-size: 10px !important; }
}

/* ページトップ */
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
	width: 30px;
	height: auto;
	display: block;
	-webkit-transition: 0.2s ease-in; transition: 0.2s ease-in;
}
#page-top img {
	width: 100%;
	height: auto;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;}
#page-top:hover img {
	filter:alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;}

img { max-width:100%; height: auto; }


@media print {
 a[href]:after {
 content: "" !important;
 }
 
 abbr[title]:after {
 content: "" !important;
 }
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}


.flex_wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-content: center; align-items: center; }
.flex_wrap2 { display: flex; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; }



a {
    color: #2648a1;
    text-decoration: none;
}


.mv_area { 
width: 100%;
background-image: url("../images/mv/bg02.png");
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
position: relative;
z-index: 1;
-webkit-animation: fadeIn 3.5s ease 0s 1 normal;
animation: fadeIn 3.5s ease 0s 1 normal;
height: 44vw;
display: block;
}
@media screen and (min-width: 641px){
.ttl1_1 { position: absolute; right: 0;
    top: 50%;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
	width: 50%; }
.ttl1_2 {
position: absolute;
left: 3%;
top: 50%;
transform: translate(0, -50%);
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
width: 44%;
}}

.logo_area { width: 100%; display: block; position: relative; }
.mhlw_logo { position: absolute; top: 10px; left: 10px; width: 200px; }
.site_ttl {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
	width: 600px;
}
@media screen and (max-width: 1080px){
.site_ttl { width: 68%; max-width: 540px; right: -10px; left: auto;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0); }
}
@media screen and (max-width: 640px){
.mv_area { height: auto; }
.site_ttl { width: 45%; right: 10px; top: 10px; }
.ttl1_1 { 
padding-top: 10vh !important;
text-align: right; }
.ttl1_1 img { 
width: 90%; }
.ttl1_2 { padding: 20px; }
}
@media screen and (max-width: 480px){
.site_ttl { width: 45%; right: 10px; top: 10px; }
.mhlw_logo { width: 40%; }
}


/* flex */
.fb_img { width: 40%; }
.fb_txt { width: 57%; }
@media screen and (min-width:769px){.flex_r { flex-flow: row-reverse; } }

@media screen and (max-width:768px){
.fb_img, .fb_txt { width: 100%; }
.fb_img { padding: 30px 0 15px; text-align: center; }
.fb_img img { display: inline-block; max-width: 320px; width: 80%; }}



/* margin */
.mgBM8 { margin-bottom: -8px !important; }
.mgB0 { margin-bottom: 0 !important; }
.mgB5 { margin-bottom: 5px !important; }
.mgB8 { margin-bottom: 8px !important; }
.mgB10 { margin-bottom: 10px !important; }
.mgB16 { margin-bottom: 16px !important; }
.mgB20 { margin-bottom: 20px !important; }
.mgB24 { margin-bottom: 24px !important; }
.mgB30 { margin-bottom: 30px !important; }
.mgB40 { margin-bottom: 40px !important; }
.mgB20r { margin-bottom: 20px !important; }
.mgB60r { margin-bottom: 60px !important; }
.mgB80r { margin-bottom: 80px !important; }
.mgB100r { margin-bottom: 100px !important; }

.mgT10 { margin-top: 10px !important; }
.mgT20 { margin-top: 20px !important; }
.mgT30 { margin-top: 30px !important; }
.mgT40 { margin-top: 40px !important; }
.mgT50 { margin-top: 50px !important; }
.mgT60 { margin-top: 60px !important; }
.mgT60r { margin-top: 60px !important; }
.mgTM8 { margin-top: -8px !important; }
.mgTM12 { margin-top: -12px !important; }
.mgTM20 { margin-top: -20px !important; }
.pdT0 { padding-top: 0 !important; }

@media screen and (max-width:768px){
.mgB20r { margin-bottom: 14px !important; }
.mgB60r { margin-bottom: 40px !important; }
.mgT60r { margin-top: 40px !important; }
.mgB80r { margin-bottom: 60px !important; }
.mgB100r { margin-bottom: 60px !important; }
}

/* txt */
.fw_5 { font-weight: 500; }
.txt_c, .txt_cl { text-align: center !important; }
.txt_rc, .txt_rl2, .txt_rlc { text-align: right !important; }
.txt_200 { font-size: 200% !important; }
.txt_180 { font-size: 180% !important; }
.txt_160 { font-size: 160% !important; }
.txt_140 { font-size: 140% !important; }
.txt_120 { font-size: 120% !important; }
.txt_110 { font-size: 110% !important; }
.txt_90 { font-size: 90% !important; }
.txt_80 { font-size: 80% !important; }
.txt_70 { font-size: 70% !important; }
.txt_60 { font-size: 60% !important; }
.lh_16 { line-height: 1.6 !important; }
.lh_14 { line-height: 1.4 !important; }
h2 { font-size: 160%; letter-spacing: 0.5px; line-height: 1.3; }
h3 { font-size: 140%; letter-spacing: 0.5px; }
h4 { font-size: 125%; letter-spacing: 1px; font-weight: 600; color: #1e0d4a; margin-bottom: 40px !important; line-height: 1.4; }

.h2_ttl1 {
 margin-bottom: 40px !important;
}
.h2_ttl1 span { padding: 10px 40px;
background: linear-gradient(135deg, #f0a8ba 0 10px, transparent 10px),
        linear-gradient(-45deg, #f0a8ba 0 10px, transparent 10px);}

@media screen and (max-width: 991px){
.txt_rl2, .txt_rlc { text-align: left !important; } }
@media screen and (max-width: 768px){
.h2_ttl1 span { display: block; padding: 10px; }
.txt_rc, .txt_rlc { text-align: center !important; }
.txt_cl { text-align: left !important; }
.txt_160 { font-size: 140% !important; line-height: 1.45; }
}
@media screen and (max-width: 640px){h3{line-height: 1.3;}}

/* マウス */
.mouse {
  width: 30px;
  height: 50px;
  border: 2px solid #fff;
  border-radius: 60px;
  position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);}
.mouse::before {
    content: '';
    width: 5px;
    height: 5px;
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    border-radius: 50%;
    opacity: 1;
    animation: wheel 2s infinite;
    -webkit-animation: wheel 2s infinite;
  }
.scroll_text {
  position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
	color: #fff;
	letter-spacing: 1px;
}
@media screen and (max-width: 640px){
.mouse{width: 24px; height: 44px;
    left: auto;
	right: 14px;
	bottom: 34px;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
}
.scroll_text {
    left: auto;
	right: 10px;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
}}

@keyframes wheel {
  to {
    opacity: 0;
    top: 30px;
  }
}

@-webkit-keyframes wheel {
  to {
    opacity: 0;
    top: 30px;
  }
}


/* ブロック指定 */

  

.fadeIn_left {
  opacity: 0;
  transform: translateX(-100px);
  transition: 1s;
}
.fadeIn_left.is-show {
  transform: translateX(0);
  opacity: 1;
}
.fadeIn_right {
  opacity: 0;
  transform: translateX(100px);
  transition: 1s;
}
.fadeIn_right.is-show {
  transform: translateX(0);
  opacity: 1;
}

.block02 { position: relative; padding-bottom: 34vw; }
.block02_txt {
color: #fff;
background-color: #e8a8b9;
border-radius: 0 30px 30px 0;
width: 50%;
padding: 152px 13% 120px 40px;
background-image: url("../images/bg02.png");
background-size: 100% auto;
background-position: left bottom;
background-repeat: no-repeat;
}
.block02_img { 
position: absolute;
top: 152px;
right: 0;
width: 60%;
}
.block02_img img {
border-radius:  30px 0 0 30px;
width: 100%;
}
.block03 { position: relative; padding-bottom: 26vw; }
.block03_txt {
color: #fff;
background-color: #4bc1fe;
border-radius: 30px 0 0 30px;
width: 50%;
margin-left: 50%;
padding: 152px 40px 120px 13%;
background-image: url("../images/bg03.png");
background-size: 100% auto;
background-position: right bottom;
background-repeat: no-repeat;
}
.block03_img { 
position: absolute;
top: 152px;
left: 0;
width: 60%;
}
.block03_img img {
border-radius: 0 30px 30px 0;
width: 100%;
}


.block02_txt h2, .block03_txt h2 {
margin-bottom: 40px !important;
position: absolute;
top: 80px;
}
.block03_txt h2 { left: 0; padding: 0 20px 0 60px; }

.block02 .catch { font-size: 180%; color: #e8a8b9; position: absolute; right: 40px; top: 60px; letter-spacing: 2px; }
.block03 .catch { font-size: 180%; color: #4bc1fe; position: absolute; left: 40px; top: 60px; letter-spacing: 2px; }
@media screen and (max-width: 1500px){
.block02 { padding-bottom: 26vw; }
.block03 { padding-bottom: 20vw; }
}
@media screen and (max-width: 1300px){
.block02 { padding-bottom: 22vw; }
.block03 { padding-bottom: 16vw; }
}
@media screen and (max-width: 1180px){
.block02 .catch, .block03 .catch { font-size: 140%; letter-spacing: 1px; }
.block02 { padding-bottom: 16vw; }
.block03 { padding-bottom: 12vw; }
.block02_txt { padding-right: 26%; width: 58%; }
.block03_txt { padding-left: 26%; width: 58%; margin-left: 42%; }
.block02_img, .block03_img { width: 66%; }
}
@media screen and (max-width: 950px){
.block02 .catch { font-size: 180%; position: relative; right: auto; top: auto; padding: 0 30px; line-height: 1; }
.block03 .catch { font-size: 180%; position: relative; left: auto; top: auto; padding: 0 30px; text-align: right; line-height: 1; }
.block02 { padding-bottom: 140px; }
.block03 { padding-bottom: 80px; }
.block03_txt h2 { padding: 0 20px 0 40px; }
.block02_txt { padding-right: 40px; width: 96%; }
.block03_txt { padding-left: 40px; width: 96%; margin-left: 10%; }
.block02_img { position: relative; top: auto; right: auto; width: 80%; margin-left: 20%; margin-top: -80px; }
.block03_img { position: relative; top: auto; left: auto; width: 80%; margin-top: -80px; }
}

@media screen and (max-width: 640px){
.block02 .catch, .block03 .catch { top: -10px; }
.block02_txt h2, .block03_txt h2 { position: relative; top: auto; margin-bottom: 24px !important; }
.block03_txt h2 { padding: 0; }
.block02_txt, .block03_txt { padding: 50px 30px 120px 30px; }
.block03_txt { padding-right: 44px; }
.block03_txt, .block02_img img { border-radius: 20px 0 0 20px; }
.block02_txt, .block03_img img { border-radius: 0 20px 20px 0; }
}
@media screen and (max-width: 480px){
.block02 .catch, .block03 .catch { letter-spacing: 0.5px; font-size: 150%; }
.block02 { padding-bottom: 80px; }
.block03 { padding-bottom: 40px; }
}


.block04 {
color: #fff;
background-image: url("../images/bg04.png");
background-size: cover;
background-position: top center;
}
.block04 .container2 { padding-top: 160px !important; }

.block05 {
color: #12263f;
background-image: url("../images/bg05.png");
background-size: cover;
background-position: center center;
}


/* ボタン */
.btn { background-color: #fff; width: 220px; font-size: 14px; font-weight: 400; padding: 8px;
  border-radius: 100vh;
  background-position: right 20px center;
  background-size: 12px 12px;
  background-repeat: no-repeat;
  }
a.btn.b_pk {
  border-bottom: 4px solid #b9687c;
  color: #b9687c;
  background-image: url("../images/btn_pk.png");
}
a.btn.b_pk:hover {
  margin-top: 2px;
  border-bottom: 2px solid #b9687c;
}

a.btn.b_sb {
  border-bottom: 4px solid #1d86bd;
  color: #1d86bd;
  background-image: url("../images/btn_sb.png");
}
a.btn.b_sb:hover {
  margin-top: 2px;
  border-bottom: 2px solid #1d86bd;
}

a.btn.b_db {
  border-bottom: 4px solid #12263f;
  color: #12263f;
  background-image: url("../images/btn_db.png");
}
a.btn.b_db:hover {
  margin-top: 2px;
  border-bottom: 2px solid #12263f;
}