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

/*-----------------------------------------------
sky   #C8DCFF 200,220,255
blue  #2873FA  40,115,250
-----------------------------------------------*/

/*-----------------------------------------------
  title
-----------------------------------------------*/
#activity .title_text {
top: calc(50% - 8vw);
left: 0;
text-align: center;
}
@media screen and (max-width: 800px) {
	#activity .title_text {
	top: calc(50% - 10vw);
	}
}

/*-----------------------------------------------
  activity
-----------------------------------------------*/
#activity .activity {
padding: 20px 4%;
color: #FFF;
background: linear-gradient(to bottom, #2873FA, #00B9BE);
}
#activity .activity_grid {
display: flex;
justify-content: space-between;
align-items: center;
padding: 40px 0;
}
#activity .activity_grid:nth-child(even) {
flex-flow: row-reverse;
}
#activity .activity_photo {
width: 44%;
}
#activity .activity_text {
width: 52%;
}
#activity .activity_en {
font-size: 1.2em;
line-height: 1.25;
color: #73E1FF;
}
#activity .activity_head {
position: relative;
margin-top: 1em;
font-size: 2.5em;
line-height: 1.25;
}
#activity .activity_head::before {
position: absolute;
right: 0;
bottom: -0.05em;
font-size: 4em;
line-height: 1;
font-style: italic;
color: rgba(255,255,255,0.2);
}
#activity .activity_grid:nth-child(1) .activity_head::before {
content: "1";
}
#activity .activity_grid:nth-child(2) .activity_head::before {
content: "2";
}
#activity .activity_grid:nth-child(3) .activity_head::before {
content: "3";
}
#activity .activity_grid:nth-child(4) .activity_head::before {
content: "4";
}
#activity .activity_body {
margin-top: 2em;
font-size: 1.1em;
text-align: justify;
}
#activity .activity_sign {
margin-top: 1.5em;
}
#activity .activity_sign img {
width: 60%;
margin-left: auto;
}
#activity .activity_grid:nth-child(even) .activity_sign img {
margin-left: 0;
}
@media screen and (max-width: 800px) {
	#activity .activity {
	padding: 8% 4%;
	}
	#activity .activity_grid {
	display: block;
	padding: 4% 0;
	}
	#activity .activity_photo {
	width: 80%;
	max-width: 320px;
	margin: auto;
	}
	#activity .activity_text {
	width: 100%;
	margin-top: 4%;
	}
	#activity .activity_en {
	padding-left: 4.5em;
	font-size: 1em;
	}
	#activity .activity_head {
	margin-top: 2%;
	padding-left: 3em;
	font-size: 1.5em;
	}
	#activity .activity_head::before {
	left: 0;
	}
	#activity .activity_body {
	margin-top: 4%;
	font-size: 1em;
	}
	#activity .activity_sign {
	margin-top: 2%;
	}
	#activity .activity_sign img {
	width: 50%;
	}
	#activity .activity_grid:nth-child(even) .activity_sign img {
	margin-left: auto;
	}
}