

.kv_tit{
	margin: 0 auto;
	padding: 0 0 ;
	position:relative;
	text-align:center;
	background: url(../../images/initiative/sp_kv_bg.jpg) no-repeat center center;
	background-size:cover;
	min-width:auto;
	height:810px;
}

.kv_tit:after {
	content: "";
	width:100%;
	height:20px;
	position:absolute;
	bottom:-1px;
	left:0;
	background: url(../../images/base/wave_bg.svg) repeat-x center bottom ;
	background-size:auto 20px;
	z-index:10;
}

.kv_tit h2{
	margin: 0 auto ;
	padding: 280px 0 60px;
	position:relative;
font-weight: 500;
font-size: 52px;
letter-spacing: 0.05em;
text-align: center;
color: #fff;
text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);

}
.kv_tit p{
	margin: 0 auto ;
	padding: 0 0 0;
	position:relative;
font-weight: 500;
font-size: 23px;
line-height: 41px;
text-align: center;
color: #fff;
text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
letter-spacing:1px;
}





.section_wrap{
	margin: 0 auto;
	padding: 50px 0 50px;
	position:relative;
	min-width:auto;
}

.section_inner{
	margin: 0 auto;
	padding: 0 0;
	position:relative;
	min-width:auto;
	text-align:center;
}

h3.h3_style{
	margin:0 0 50px;
	padding: 0 0 50px;
	position: relative;
font-weight: 500;
font-size: 33px;
line-height: 48px;
text-align: center;
color: #3e3e3e;
	background-image: url(../../images/base/h2_bg.svg);
	background-repeat: no-repeat;
	background-position: center bottom 0px;
	background-size: auto;
}

h3.h3_style.h3_img1 {
	display:inline-block;
}
/*
h3.h3_style.h3_img1:before {
	position: absolute;
	top: -5px;
	left:-45px;
	content: '';
	margin:auto;
	width:30px;
	height:50px;
	background-image: url(../../images/initiative/h3_img1.png);
	background-repeat: no-repeat;
	background-position: center top 0px;
	background-size: auto 50px;
	display:inline-block;

}
h3.h3_style.h3_img1:after {
	position: absolute;
	top: -5px;
	right:-45px;
	content: '';
	margin:auto;
	width:30px;
	height:50px;
	background-image: url(../../images/initiative/h3_img1.png);
	background-repeat: no-repeat;
	background-position: center top 0px;
	background-size: auto 50px;
	display:inline-block;
}
*/


h3.h3_style.h3_img2:before {
  position: absolute;
  top: -60px;
  left:0px;
  right:0;
  margin:auto;
  content: url(../../images/initiative/sp_h3_img2.svg?2);
}
h3.h3_style.h3_img2:after {
  position: absolute;
  top: -50px;
  left:0px;
  right:0;
  margin:auto;
  content: url(../../images/initiative/h3_img2_fish.svg);
  animation: float2 4s ease-in-out infinite;
}
@keyframes float2 {
  0% {
    transform: translateY(0) scale(0.9);
  }
  50% {
    transform: translateY(-10px) scale(0.9);
  }
  100% {
    transform: translateY(0) scale(0.9);
  }
}
h3.h3_style.h3_img3 {
	margin:0 0 150px;
	padding: 0 0 50px;
}

h3.h3_style.h3_img3:before {
  position: absolute;
  top: 70px;
  left: -110px;
  content: url(../../images/initiative/h3_img3.svg);
  transform: scale(0.5);
}
h3.h3_style.h3_img3:after {
  position: absolute;
  top: 40px;
  left:0px;
  content: url(../../images/initiative/h3_img3_fish.svg);
	animation: moveFish4 30s linear infinite;
}
@keyframes moveFish4 {
  0%, 100% {
	left:-150px;
    transform: scaleX(-1) scale(0.5);
  }
  49.9% {
  left: calc(100% + 0px);
    transform: scaleX(-0.9) scale(0.5);
  }
  50% {
  left: calc(100% + 0px);
    transform: scaleX(1) scale(0.5);
  }
  99.9% {
	left:-150px;
    transform: scaleX(0.9) scale(0.5);
  }
}
.council_block{
	margin: 0 auto;
	padding: 0 0 20px;
	position:relative;
	width:auto;
	text-align:center;

}

.council_txt{
	margin: 0 auto;
	padding: 0 0;
	position:relative;
	width:auto;
}

.council_txt h4{
	margin: 30px 0 20px;
	padding: 0 0;
	position:relative;
font-weight: 500;
font-size: 25px;
letter-spacing: 0.05em;
line-height: 39px;
text-align: center;
color: #3e3e3e;

}
.council_txt h4:before {
	position: absolute;
	top: -47px;
	left:38px;
	margin:auto;
	content: url(../../images/initiative/h4_img.svg);
    transform: scale(0.7);
}
.council_txt h4:after {
	position: absolute;
	top: -38px;
	right:0;
	margin:auto;
	content: url(../../images/initiative/h4_img_fish.svg);
	animation: float 5s ease-in-out infinite;
}
@keyframes float {
  0% {
    transform: translateY(0) scale(0.65);
  }
  50% {
    transform: translateY(-6px) scale(0.65);
  }
  100% {
    transform: translateY(0) scale(0.65);
  }
}

.council_txt p{
	margin: 0 25px 30px;
	padding: 0 0 50px;
	position:relative;
font-weight: normal;
font-size: 18px;
line-height: 1.7;
text-align: left;
color: #3e3e3e;

}

.council_img{
	margin: 0 auto;
	padding: 0 0;
	position:relative;
	text-align:center;
}
.council_img img{
	width:90%;
	height:auto;
}
@keyframes moveFish3 {
  0%, 100% {
	left:-80px;
    transform: scaleX(-1);
  }
  49.9% {
  left: calc(100% + 60px);
    transform: scaleX(-0.9);
  }
  50% {
  left: calc(100% + 60px);
    transform: scaleX(1);
  }
  99.9% {
	left:-80px;
    transform: scaleX(0.9);
  }
}
.fish_img1{
	position:absolute;
	bottom:0;
	left:30px;
	animation: moveFish3 25s linear infinite;
	z-index:1;
}
.fish_img1 img{
	width:70px;
	height:auto;
}

@keyframes moveFish {
  0%, 100% {
  right: -60px;
    transform: scaleX(1);
  }
  49.9% {
  right: calc(100% + 60px);
    transform: scaleX(0.9);
  }
  50% {
  right: calc(100% + 60px);
    transform: scaleX(-1);
  }
  99.9% {
  right: -60px;
    transform: scaleX(-0.9);
  }
}

.fish_img2{
	position:absolute;
	top:-64px;
	animation: moveFish 30s linear infinite;
}
.fish_img2 img{
	width:60px;
	height:auto;
}
.fish_img2_sp{
	position:absolute;
	bottom:-20px;
	right:40px;
	animation: moveFish 30s linear infinite;
}
.fish_img2_sp img{
	width:60px;
	height:auto;
}


.section_wrap.bg_color{
	margin: 0 auto;
	padding: 100px 0 180px;
	position:relative;
	min-width:auto;
	background: url(../../images/base/wave_bg2.svg) repeat-x center top ;
	background-size:auto 20px;
	background-color:#DEEDFF;
}
.section_wrap.bg_color:after {
	content: "";
	width:100%;
	height:20px;
	position:absolute;
	bottom:0;
	background: url(../../images/base/wave_bg.svg) repeat-x center top ;
	background-size:auto 20px;
	z-index:10;
}

.section_wrap.bg_color:before {
	content: "";
	width:100%;
	height:155px;
	position:absolute;
	bottom:0;
	background: url(../../images/initiative/sp_fish_img4.svg?2) no-repeat center bottom -10px;
	background-size:auto;


}


.circulation_block{
	margin: 0 auto;
	padding: 0 0;
	position:relative;
	width:auto;
	text-align:center;

}

.circulation_img{
	margin: 0 auto 30px;
	padding: 0 0;
	position:relative;
	text-align:center;

}
.circulation_img img{
	width:100%;
	height:auto;
}


img.question1{
	position:absolute;
	top:35vw;
	left:35vw;
	width:50px;
	height:auto;
}

img.question2{
	position:absolute;
	top:82vw;
	left:42vw;
	width:50px;
	height:auto;
}

img.question3{
	position:absolute;
	top:89vw;
	left:75vw;
	width:50px;
	height:auto;
}

img.question4{
	position:absolute;
	top:106vw;
	left:48vw;
	width:50px;
	height:auto;
}

img.question5{
	position:absolute;
	bottom:17vw;
	left:28vw;
	width:50px;
	height:auto;
}

img.question6{
	position:absolute;
	top:53vw;
	left:9vw;
	width:50px;
	height:auto;
}

img.question7{
	position:absolute;
	bottom:38vw;
	right:2vw;
	width:55px;
	height:auto;
}
.circulation_img a img{
cursor: pointer;
}


/* popup_question */

.mfp-bg {
background: #000 !important;
opacity: 0.6 !important;
}
.popup_question-block{padding:0 0;text-align:left;max-width:330px;margin:0 auto;position:relative}

.question_block{
	box-sizing: border-box;
	margin: 0 auto;
	padding: 20px 20px 20px 20px;

	position:relative;
	text-align:center;

	background-color:#fff;
	border-radius: 30px; 
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border:5px solid #e8212d;
}

.question_block h3.h3_question{
	margin: 0 0 10px;
	padding: 0 0;
	position: relative;
	text-align:left;

font-weight: 600;
font-size: 20px;
letter-spacing: 0.05em;
line-height: 1.5;
text-align: left;
color: #603813

}

.question_block p{
	margin: 0 0;
	padding: 0 0;
	position: relative;
	text-align:left;

font-weight: 400;
font-size: 13px;
letter-spacing: 0.05em;
line-height: 1.8;
text-align: left;
color: #603813

}


.question_block.waku_color2{
	border:5px solid #e66c17;
}
.question_block.waku_color3{
	border:5px solid #0066ba;
}
.question_block.waku_color4{
	border:5px solid #22a02b;
}
.question_block.waku_color5{
	border:5px solid #f25d8b;
}
.question_block.waku_color6{
	border:5px solid #9e4a92;
}
.question_block.waku_color7{
	border:5px solid #42b4ed;
}


.question_block.waku_color5 p{
	padding-bottom:40px;
}

.question1_img{
	margin: 0 auto 0;
	padding: 20px 0 0;
	position:relative;
	text-align: center;
}

.question1_img img{
	width:100%;
	height:auto;
}


.question5_img{
	position:absolute;
	bottom:0;
	right:0;
	margin-top:30px;
}

.question5_img img{
	width:120px;
	height:auto;
}

img.question6_img{
	float:right;
	margin-left:5px;
	width:100px;
	height:auto;
}

.question_block.waku_color6 p:after, .question_block.waku_color6 p:before {
	content: "";
	clear: both;
	display: block;
}



.question_popup_close{
	position: absolute;
	top: -15px;
	right: -10px;
	cursor: pointer;
}

.question_popup_close a{
	display:block;
}

.question_popup_close img{
	width:35px;
	height:auto;
}

.mfp-close{
	display:none !important;
}




.btn_style{
	margin: 0 auto;
	padding: 0 0;
	position:relative;
	text-align: center;
	display:inline-block;
}

.btn_style a{
	margin: 0 0;
	padding: 20px 0;
	position:relative;
	width:330px;
	display:block;

font-weight: 500;
font-size: 18px;
letter-spacing: 0.03em;
text-align: center;
color: #fff;

border:0px solid #F79D44;
	background-color:#F79D44;
	border-radius: 35px; 
	-webkit-border-radius: 35px;
	-moz-border-radius: 35px;
}
.btn_style a b{
position:absolute;
top:15px;
right:40px;
font-weight: normal;
}


.fish_img3{
	position:absolute;
	top:-40px;
	left:30px;
  animation: moveFish3 30s linear infinite;
  z-index:1;
}
.fish_img3 img{
	width:60px;
	height:auto;
}

.fish_img4{
	position:absolute;
	bottom:-50px;
	right:20px;
  animation: moveFish 30s linear infinite;
  z-index:1;
}
.fish_img4 img{
	width:60px;
	height:auto;
}

.fish_img4_kani{
	display:inline-block;
  position: absolute;
  bottom: -230px;
  right: 170px;
  animation: kani_move 14s ease-in-out infinite;
  z-index:100;
}
@keyframes kani_move {
  0%, 100% {
    transform: translateX(0) translateY(0) scale(0.9);
  }
  50% {
    transform: translateX(-50px) translateY(12px) scale(0.9);
  }
}
.fish_img4_fish img{
	display:inline-block;
  position: absolute;
  bottom: -140px;
  right: 65px;
  animation: float3 6s ease-in-out infinite;
  z-index:200;
}
@keyframes float3 {
  0% {
    transform: translateY(0) scale(1.0);
  }
  50% {
    transform: translateY(-10px) scale(1.0);
  }
  100% {
    transform: translateY(0) scale(1.0);
  }
}
.section_wrap.bg_fish{
	margin: -2px auto 0;
	padding: 60px 0 150px;
	position:relative;
	min-width:auto;
	background: url(../../images/initiative/fish_img5.svg) no-repeat right bottom, white;
	background-size:320px auto;
}


ul.activity_list{
	margin: 0 15px 0;
	padding: 0 0 ;
	position:relative;
text-align: center;
display: flex;
align-items:stretch;
justify-content:space-between;
flex-wrap:wrap;
	max-width:auto;
}

ul.activity_list li{
	margin: 0 0 15px;
	padding: 0 0 ;
	position:relative;
	width:48%;
	cursor: pointer;
}

ul.activity_list li em{
	position:absolute;
	top:11vw;
	left:0;
	right:0;
	margin:auto;
font-weight: 500;
font-size: 14px;
letter-spacing: 0.05em;
line-height: 13px;
text-align: center;
color: #3e3e3e;
}
ul.activity_list li strong{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left:0;
	right:0;
	margin:auto;
font-weight: 600;
font-size: 17px;
letter-spacing: 0.05em;
line-height: 22px;
text-align: center;
color: #0163a0;
white-space:nowrap;
}
ul.activity_list li span{
	position:absolute;
	bottom:7vw;
	left:0;
	right:0;
	margin:auto;
font-weight: 500;
font-weight: normal;
font-size: 13px;
letter-spacing: 0.05em;
line-height: 17px;
text-align: center;
color: #3e3e3e;
}
ul.activity_list li img{
	width:100%;
	height:auto;

}



/* popup */

.mfp-bg {
background: #fff !important;
opacity: 0.8; }
.white-popup-block{padding:0 0;text-align:left;max-width:800px;margin:0 auto;position:relative}
.mfp-hide{display:none!important}

.popup_block{
	box-sizing: border-box;
	margin: 0 auto;
	padding: 35px 20px 0px;

	position:relative;
	text-align:center;

	background-color:#fff;
	border-radius: 30px; 
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border:8px solid #7BCCCC;

	background-image: url(../../images/initiative/sp_pop_bg.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100% auto;
}

.popup_block.waku_color1{
	border:8px solid #448BE1;
}
.popup_block.waku_color2{
	border:8px solid #66B9FF;
}

.popup_block:after, .popup_block:before {
    content: "";
    clear: both;
    display: block;
}

.popup_close{
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
}
.popup_close img{
	width:45px;
	height:auto;
}
.popup_close a{
	display:block;
}

.mfp-close{
	display:none !important;
}

/* Dark overlay, start state */
.my-mfp-zoom-in.mfp-bg {
	opacity: 0;
	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-zoom-in.mfp-ready.mfp-bg {
	opacity: 0.7;
}
/* animate out */
.my-mfp-zoom-in.mfp-removing.mfp-bg {
	opacity: 0;
}

h3.h3_popup{
	margin: 0 0 50px;
	padding: 0 0 0;
	position: relative;

font-weight: 600;
font-size: 28px;
letter-spacing: 0.05em;
line-height: 33px;
text-align: left;
color: #0163a0;
text-shadow: 0px 0px 5px #fff;
}

h3.h3_popup small{
	margin: 0 0 0;
	padding: 0 0 5px 0;
	position: relative;
display:block;
font-weight: 500;
font-size: 20px;
letter-spacing: 0.05em;
line-height: 29px;
text-align: left;
color: #3e3e3e;
text-shadow: 0px 0px 5px #fff;

}

.waku_color1 h3.h3_popup{
	margin: 0 -20px 50px -10px;
font-size: 28px;
letter-spacing:0em;
}


.popup_box{
	margin: 0 0 30px;
	padding: 0 0 0;
	position: relative;
}

.popup_txt{
	margin: 0 0;
	padding: 0 0 0;
	position: relative;
}

h4.h4_popup{
	margin: 0 0 20px;
	padding: 0 0 0;
	position: relative;
font-weight: 500;
font-size: 20px;
text-align: left;
color: #3e3e3e;
}

h4.h4_popup span{
font-size: 19px;
	margin: 0 -20px 20px 0;
	position: relative;
	display:block;
}

.popup_txt p{
	margin: 0 0 20px;
	padding: 0 0 0;
	position: relative;
font-weight: 400;
font-size: 15px;
line-height: 21px;
text-align: left;
color: #3e3e3e;
}

ul.popup_p_list{
	margin: 0 0 ;
	padding: 0 0 0;
	position: relative;
	list-style:none;
display: flex;
align-items:stretch;
justify-content:space-between;
}

ul.popup_p_list li{
	margin: 0 0 0px;
	padding: 0 0 0;
	position: relative;
	list-style:none;
font-weight: normal;
font-size: 13px;
line-height:2.0;
text-align: left;
color: #3e3e3e;
width:48%;
}

ul.popup_p_list li img{
	width:100%;
	height:auto;

}

ul.popup_list{
	margin: 0 0 0;
	padding: 0 0 0;
	position: relative;
	list-style:none;
}

ul.popup_list li{
	margin: 0 0 20px;
	padding: 0 0 0;
	position: relative;
	list-style:none;
}

ul.popup_list li h5{
	margin: 0 0 10px;
	padding: 0 0 0 10px;
	position: relative;
font-weight: 500;
font-size: 17px;
line-height:1.5;
text-align: left;
color: #fff;
width:190px;
height:35px;
background-color:#F79D44;

display: flex;
align-items:center;
box-sizing: border-box;
border-left:12px solid #F7D544;
}

ul.popup_list li h5:after {
  position: absolute;
  top: 0;
  right: 0px;
  width: 0;
  height: 0;
  content: '';
  border-width: 0 25px 35px 0;
  border-style: solid;
  border-color: transparent #fff #F79D44 transparent;

}

ul.popup_list li p{
	margin: 0 5px 0;
	padding: 0 0 0;
	position: relative;
font-weight: 400;
font-weight: normal;
font-size: 15px;
line-height:1.6;
text-align: left;
color: #3e3e3e;

}

ul.popup_list li p em{
	margin: 0 0 ;
	padding: 0 0 0;
	position: relative;
font-weight: 500;
font-size: 16px;
text-align: left;
color: #3e3e3e;
}

ul.popup_list li p img{
vertical-align:top;
margin-top:-35px;
margin-left:25px;
}

img.pop3_p03{
	width:45%;
	height:auto;
	margin-top:10px;
}
