/* CSS Document */
/* Special Feature — Part 13 css
**********************/
/*@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@500;700;800&display=swap');*/

:root{
	--hitachiColor: #b1000e;
	--mainColor: #210701;
	--width: 1006px;
	--shadow: 5px 5px 16px rgba(55,4,4,0.3);
	--t-shadow: 1px 2px 0 rgba(255,255,255,0.6);
	--t-shadow-pale: 1px 2px 0 rgba(255,255,255,0.3);
	--rotate: rotateZ(0.03deg);
}

body{
  min-width:1180px;
  position: relative;
  font-family: Arial,Helvetica,sans-serif,'Noto Sans Japanese';
  font-weight: 500;
  font-style: normal;
}
#main {
  background: url("/image/global/science-edu/micro/content13/common_01.png") #eee no-repeat center top;
}
#main * {
  box-sizing: border-box;
	font-family: Arial,Helvetica,sans-serif,'Noto Sans Japanese';
}
#main.index .content-wrap{
	padding-bottom: 80px;
	color: var(--mainColor);
}
ruby{
	font-size: inherit;
}
[data-ruby]{
	position: relative;
}
[data-ruby]::before {
	content: attr(data-ruby);
	display: inline-block;
	position: absolute;
	top: -0.8em;
	left: 0;
	right: 0;
	margin: auto;
	font-size: 0.5em;
	line-height: 100%;
	white-space: nowrap;
	text-align: center;
	transform: var(--rotate);
}
[data-ruby] rt{
	display: none;
}
.w700{
	font-weight: 700;
}
.w800{
	font-weight: 800;
}

/*--title--*/
#main.index #pageTitle {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;
  margin-top: 78px;
  margin-bottom: 31px;
}
#main.index #pageTitle p.label {
  background: #E60027;
  color: #FFF;
  font-size: 13px;
  display: inline-block;
  border-radius: 50px;
  padding: 3px 15px;
  text-align: center;
  min-width: 68px;
  margin-right: 22px;
	transform:rotateZ(0.03deg);
}
#main.index #pageTitle h2{
	font-weight: bold;
	font-size: 26px;
}
#main.index #pageTitle div p {
  font-size: 32px;
}
#main.index #pageTitle div p ruby::before{
	font-size: 11px;
}

/*--about_paperCont--*/
#aboutCont{
	display: block;
	margin: 0 auto 30px auto;
	background: #FFF;
	border: #a1e1e0 solid 4px;
	border-radius: 5px;
	position: relative;
}
#aboutCont h2{
	display: block;
	width: 330px;
	height: 60px;
	font-size: 17px;
	font-weight: 700;
	padding: 19px 5px 5px 35px;
	color: #FFF;
	background: url("/image/global/science-edu/micro/content13/index_05.png") no-repeat left top / 100% 100%;
	position: absolute;
	top: 5px;
	left: -10px;
	z-index: 2;
}
#aboutCont h2 div{
	transform: var(--rotate);
}
#aboutCont p.read{
	line-height: 1.8;
	transform: var(--rotate);
	font-weight: 300;
	padding: 60px 20px 14px 20px;
	width: calc(100% - 32px);
	background: url("/image/global/science-edu/micro/content13/index_06.png") repeat left 9px top 9px;
	border: #e8e8e8 solid 1px;
	margin: 18px auto 19px auto;
}

/*--about_paperCont--*/
#about_paperCont {
	display: block;
	width: 100%;
	min-height: 800px;
	padding-top: 75px;
	background: url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center top;
	box-sizing: border-box;
}
#about_paperCont  h2{
	display: block;
	text-align: center;
	font-weight: 800;
	font-size: 26px;
	text-shadow: var(--t-shadow);
}
#about_paperCont  .read{
	display: block;
	text-align: center;
	max-width: var(--width);
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 25px auto 20px auto;
	transform: var(--rotate);
	background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 8%, rgba(255,255,255,0.75) 92%, rgba(255,255,255,0) 100%);
}
#about_worldMap{
	display: block;
	width: 100%;
	max-width: var(--width);
	background: url("/image/global/science-edu/micro/content13/index_01.png") no-repeat center center;
	height: 530px;
	margin: 0 auto;
	position: relative;
}
#about_paperCont a:hover{
	text-decoration: none !important;
}
#about_paperCont a:hover span{
	filter: brightness(0.8);
	transition: all 0.3s ease;
}
#about_paperCont a{
	display: block;
	width: 100%;
	max-width: 214px;
	position: absolute;
}
#about_paperCont .canada{
	top: 140px;
	left: 610px;
}
#about_paperCont .china{
	top: 217px;
	left: 255px;
}
#about_paperCont a img{
	margin-left: 66px;
}
#about_paperCont a span::before{
	content: "";
	display: block;
	width: 18px;
	height: 20px;
	background: url("/image/global/science-edu/micro/content13/common_03.png") no-repeat center center / 100% auto;
	position: absolute;
	top: calc(50% - 9px);
	right: 17px;
}
#about_paperCont a span{
	display: block;
	max-width: 100%;
	height: 55px;
	background: url("/image/global/science-edu/micro/content13/index_03.png") no-repeat center center / 100% auto;
	font-size: 16px;
	margin-top: 5px;
	padding: 15px 10px 0 0;
	text-shadow: var(--t-shadow);
	text-align: center;
	color: #000;
	position: relative;
}

/*--canada_paperCont--*/
#canada_paperCont {
	display: block;
	width: 100%;
	min-height: 800px;
	padding-top: 72px;
	background: url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center top;
	box-sizing: border-box;
}
#canada_paperCont  h2{
	display: block;
	min-height: 1.65em;
	text-align: center;
	font-weight: 800;
	font-size: 26px;
	text-shadow: var(--t-shadow);
}
#canada_worldMap{
	display: block;
	width: 100%;
	max-width: var(--width);
	background: url("/image/global/science-edu/micro/content13/canada_01.jpg") no-repeat center center / cover;
	height: 518px;
	border: #FFF solid 3px;
	border-radius: 3px;
	box-shadow: var(--shadow);
	margin: 21px auto 22px auto;
	position: relative;
}
#canada_worldMap .place{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 7px;
	width: 130px;
	height: 50px;
	font-size: 16px;
	background: #FFF;
	border-radius: 0 0 5px 5px;
	position: absolute;
	top: 0;
	left: 8px;
}
#canada_worldMap .place span{
	transform: var(--rotate);
}
#canada_worldMap #kasekiCount{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 7px;
	width: 250px;
	height: 50px;
	font-size: 16px;
	background: #FFF;
	border-radius: 0 0 5px 5px;
	position: absolute;
	top: 0;
	left: 145px;
}
#canada_worldMap #kasekiCount > span,
#canada_worldMap #kasekiCount > div{
	transform: var(--rotate);
}
#canada_worldMap #kasekiCount > span{
	font-size: 14px;
	padding-top: 2px;
	padding-left: 26px;
	background: url(/image/global/science-edu/micro/content13/canada_10.png) no-repeat center left / 20px auto;
}
#canada_worldMap #kasekiCount > div small{
	font-size: 14px;
}
#canada_worldMap #kasekiCount #countNumber{
	font-size: 18px;
	transform: var(--rotate);
}
#canada_worldMap #kasekiCount > div:has(.red){
	color: #e60027;
}
#canada_worldMap .clickKey:not(.hide){
	position: absolute;
	opacity: 1;
	cursor: pointer;
	user-select: none;
}
#canada_worldMap .clickKey.hide{
	opacity: 0;
	pointer-events: none;
}
#canada_worldMap .clickKey.key0{
	top: 372px;
	left: 150px;
}
#canada_worldMap .clickKey.key1{
	top: 428px;
	left: 95px;
}
#canada_worldMap .clickKey.key2{
	top: 360px;
	left: 260px;
}
#canada_worldMap .clickKey.key3{
	top: 457px;
	left: 300px;
}
#canada_worldMap .clickKey.key4{
	top: 470px;
	left: 468px;
}
#canada_worldMap .clickKey.key5{
	top: 405px;
	left: 600px;
}
#canada_worldMap .clickKey.key6{
	top: 346px;
	left: 685px;
}
#canada_worldMap .clickKey i{
	display: block;
	width: 30px;
	height: 30px;
	transform:  scale(0) rotate(0deg);
	opacity: 0;
	background: url("/image/global/science-edu/micro/content13/common_44.png") no-repeat center center / 30px auto;
	position: absolute;
	top: -10px;
	right: -10px;
}
#canada_worldMap .clickKey.kiraKick i{
	animation: stoneKira 0.8s forwards;
}

/*--china_paperCont--*/
#china_paperCont {
	display: block;
	width: 100%;
	min-height: 800px;
	padding-top: 72px;
	background: url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center top;
	box-sizing: border-box;
}
#china_paperCont  h2{
	display: block;
	min-height: 1.65em;
	text-align: center;
	font-weight: 800;
	font-size: 26px;
	text-shadow: var(--t-shadow);
}
#china_worldMap{
	display: block;
	width: 100%;
	max-width: var(--width);
	background: url("/image/global/science-edu/micro/content13/china_01.jpg") no-repeat center center / cover;
	height: 518px;
	border: #FFF solid 3px;
	border-radius: 3px;
	box-shadow: var(--shadow);
	margin: 21px auto 22px auto;
	position: relative;
}
#china_worldMap .place{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 7px;
	width: 130px;
	height: 50px;
	font-size: 16px;
	background: #FFF;
	border-radius: 0 0 5px 5px;
	position: absolute;
	top: 0;
	left: 8px;
}
#china_worldMap .place span{
	transform: var(--rotate);
}
#china_worldMap #kasekiCount{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 7px;
	width: 250px;
	height: 50px;
	font-size: 16px;
	background: #FFF;
	border-radius: 0 0 5px 5px;
	position: absolute;
	top: 0;
	left: 145px;
}
#china_worldMap #kasekiCount > span,
#china_worldMap #kasekiCount > div{
	transform: var(--rotate);
}
#china_worldMap #kasekiCount > span{
	font-size: 14px;
	padding-top: 2px;
	padding-left: 26px;
	background: url(/image/global/science-edu/micro/content13/china_10.png) no-repeat center left / 20px auto;
}
#china_worldMap #kasekiCount > div small{
	font-size: 14px;
}
#china_worldMap #kasekiCount #countNumber{
	font-size: 18px;
	transform: var(--rotate);
}
#china_worldMap #kasekiCount > div:has(.red){
	color: #e60027;
}
#china_worldMap .clickKey:not(.hide){
	position: absolute;
	opacity: 1;
	cursor: pointer;
	user-select: none;
}
#china_worldMap .clickKey.hide{
	opacity: 0;
	pointer-events: none;
}
#china_worldMap .clickKey.key0{
	top: 329px;
	left: 551px;
}
#china_worldMap .clickKey.key1{
	top: 426px;
	left: 652px;
}
#china_worldMap .clickKey.key2{
	top: 454px;
	left: 534px;
}
#china_worldMap .clickKey.key3{
	top: 296px;
	left: 418px;
}
#china_worldMap .clickKey.key4{
	top: 340px;
	left: 250px;
}
#china_worldMap .clickKey.key5{
	top: 469px;
	left: 233px;
}
#china_worldMap .clickKey.key6{
	top: 453px;
	left: 50px;
}
#china_worldMap .clickKey i{
	display: block;
	width: 30px;
	height: 30px;
	transform:  scale(0) rotate(0deg);
	opacity: 0;
	background: url("/image/global/science-edu/micro/content13/common_45.png") no-repeat center center / 30px auto;
	position: absolute;
	top: -10px;
	right: -10px;
}
#china_worldMap .clickKey.kiraKick i{
	animation: stoneKira 0.8s forwards;
}
		@keyframes stoneKira {
			0% {
				transform:  scale(0) rotate(0deg);
				opacity: 0;
			}
			50% {
				transform:  scale(1) rotate(60deg);
				opacity: 1;
			}
			100% {
				transform:  scale(0) rotate(120deg);
				opacity: 0;
			}
		}

/*--puzzle_paperCont--*/
#puzzle_paperCont {
	display: block;
	width: 100%;
	min-height: 800px;
	padding-top: 80px;
	background: url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center top;
	box-sizing: border-box;
}
#puzzle_paperCont  h2{
	display: block;
	text-align: center;
	font-weight: 800;
	font-size: 26px;
	text-shadow: var(--t-shadow);
}
#puzzleTitle{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 60px;
	margin: 30px auto 0 auto;
	padding-top: 0;
	color: #FFF;
	font-size: 18px;
	font-weight: 700;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	background: url("/image/global/science-edu/micro/content13/common_17.png") no-repeat center center;
}
#puzzleTitle span{
	transform: var(--rotate);
}
#puzzleArea{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 70px;
	width: 100%;
	max-width: var(--width);
	margin: 25px auto 30px auto;
	background: url("/image/global/science-edu/micro/content13/common_46.png") no-repeat left 445px center;
	position: relative;
}
#dropArea{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 422px;
	height: 340px;
	padding: 7px;
	background-color: #894f22;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 422px auto;
}
#puzzleArea.puzzle0 #dropArea{
	background-image: url("/image/global/science-edu/micro/content13/puzzle0_01.jpg");
}
#puzzleArea.puzzle1 #dropArea{
	background-image: url("/image/global/science-edu/micro/content13/puzzle1_01.jpg");
}
#puzzleArea.puzzle2 #dropArea{
	background-image: url("/image/global/science-edu/micro/content13/puzzle2_01.jpg");
}
#puzzleArea.puzzle3 #dropArea{
	background-image: url("/image/global/science-edu/micro/content13/puzzle3_01.jpg");
}
#puzzleArea.puzzle4 #dropArea{
	background-image: url("/image/global/science-edu/micro/content13/puzzle4_01.jpg");
}
#puzzleArea.puzzle5 #dropArea{
	background-image: url("/image/global/science-edu/micro/content13/puzzle5_01.jpg");
}
#puzzleArea.puzzle6 #dropArea{
	background-image: url("/image/global/science-edu/micro/content13/puzzle6_01.jpg");
}
#dropArea .drop{
	display: block;
	height: 326px;
	position: relative;
}
#puzzleArea.drop_p3 #dropArea .drop{
	width: 204px;
	height: 163px;
}
#puzzleArea.drop_p3 #dropArea .drop:nth-child(2n){
	border-left: #754116 solid 1px;
}
#puzzleArea.drop_p3 #dropArea .drop:nth-child(-n+2){
	border-bottom: #754116 solid 1px;
}
#puzzleArea.drop_p5 #dropArea .drop{
	width: 136px;
	height: 163px;
	border-left: #754116 solid 1px;
}
#puzzleArea.drop_p5 #dropArea .drop:nth-child(3n+1){
	border-left: none;
}
#puzzleArea.drop_p5 #dropArea .drop:nth-child(-n+3){
	border-bottom: #754116 solid 1px;
}

#dragArea{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 490px;
	height: 376px;
	padding-top: 23px;
	padding-bottom: 23px;
	background: url("/image/global/science-edu/micro/content13/common_19.png") no-repeat center top;
	box-sizing: border-box;
}
#puzzleArea.drop_p3 #dragArea .dragParts{
	width: 204px;
	height: 163px;
}
#puzzleArea.drop_p5 #dragArea .dragParts{
	width: 136px;
	height: 163px;
}
#puzzleArea.puzzle0 #dragArea .dragParts:nth-child(2){
	background: url("/image/global/science-edu/micro/content13/puzzle0_06.jpg") no-repeat center center;
}
#puzzleArea.puzzle0 #dragArea .dragParts:nth-child(4){
	background: url("/image/global/science-edu/micro/content13/puzzle0_07.jpg") no-repeat center center;
}
#puzzleArea.puzzle0 #dragArea .dragParts:nth-child(1){
	background: url("/image/global/science-edu/micro/content13/puzzle0_08.jpg") no-repeat center center;
}
#puzzleArea.puzzle0 #dragArea .dragParts:nth-child(3){
	background: url("/image/global/science-edu/micro/content13/puzzle0_09.jpg") no-repeat center center;
}
#puzzleArea.puzzle1 #dragArea .dragParts:nth-child(3){
	background: url("/image/global/science-edu/micro/content13/puzzle1_06.jpg") no-repeat center center;
}
#puzzleArea.puzzle1 #dragArea .dragParts:nth-child(2){
	background: url("/image/global/science-edu/micro/content13/puzzle1_07.jpg") no-repeat center center;
}
#puzzleArea.puzzle1 #dragArea .dragParts:nth-child(1){
	background: url("/image/global/science-edu/micro/content13/puzzle1_08.jpg") no-repeat center center;
}
#puzzleArea.puzzle1 #dragArea .dragParts:nth-child(4){
	background: url("/image/global/science-edu/micro/content13/puzzle1_09.jpg") no-repeat center center;
}
#puzzleArea.puzzle2 #dragArea .dragParts:nth-child(5){
	background: url("/image/global/science-edu/micro/content13/puzzle2_08.jpg") no-repeat center center;
}
#puzzleArea.puzzle2 #dragArea .dragParts:nth-child(6){
	background: url("/image/global/science-edu/micro/content13/puzzle2_09.jpg") no-repeat center center;
}
#puzzleArea.puzzle2 #dragArea .dragParts:nth-child(3){
	background: url("/image/global/science-edu/micro/content13/puzzle2_10.jpg") no-repeat center center;
}
#puzzleArea.puzzle2 #dragArea .dragParts:nth-child(1){
	background: url("/image/global/science-edu/micro/content13/puzzle2_11.jpg") no-repeat center center;
}
#puzzleArea.puzzle2 #dragArea .dragParts:nth-child(2){
	background: url("/image/global/science-edu/micro/content13/puzzle2_12.jpg") no-repeat center center;
}
#puzzleArea.puzzle2 #dragArea .dragParts:nth-child(4){
	background: url("/image/global/science-edu/micro/content13/puzzle2_13.jpg") no-repeat center center;
}
#puzzleArea.puzzle3 #dragArea .dragParts:nth-child(2){
	background: url("/image/global/science-edu/micro/content13/puzzle3_08.jpg") no-repeat center center;
}
#puzzleArea.puzzle3 #dragArea .dragParts:nth-child(6){
	background: url("/image/global/science-edu/micro/content13/puzzle3_09.jpg") no-repeat center center;
}
#puzzleArea.puzzle3 #dragArea .dragParts:nth-child(1){
	background: url("/image/global/science-edu/micro/content13/puzzle3_10.jpg") no-repeat center center;
}
#puzzleArea.puzzle3 #dragArea .dragParts:nth-child(4){
	background: url("/image/global/science-edu/micro/content13/puzzle3_11.jpg") no-repeat center center;
}
#puzzleArea.puzzle3 #dragArea .dragParts:nth-child(3){
	background: url("/image/global/science-edu/micro/content13/puzzle3_12.jpg") no-repeat center center;
}
#puzzleArea.puzzle3 #dragArea .dragParts:nth-child(5){
	background: url("/image/global/science-edu/micro/content13/puzzle3_13.jpg") no-repeat center center;
}
#puzzleArea.puzzle4 #dragArea .dragParts:nth-child(3){
	background: url("/image/global/science-edu/micro/content13/puzzle4_06.jpg") no-repeat center center;
}
#puzzleArea.puzzle4 #dragArea .dragParts:nth-child(1){
	background: url("/image/global/science-edu/micro/content13/puzzle4_07.jpg") no-repeat center center;
}
#puzzleArea.puzzle4 #dragArea .dragParts:nth-child(2){
	background: url("/image/global/science-edu/micro/content13/puzzle4_08.jpg") no-repeat center center;
}
#puzzleArea.puzzle4 #dragArea .dragParts:nth-child(4){
	background: url("/image/global/science-edu/micro/content13/puzzle4_09.jpg") no-repeat center center;
}
#puzzleArea.puzzle5 #dragArea .dragParts:nth-child(3){
	background: url("/image/global/science-edu/micro/content13/puzzle5_06.jpg") no-repeat center center;
}
#puzzleArea.puzzle5 #dragArea .dragParts:nth-child(2){
	background: url("/image/global/science-edu/micro/content13/puzzle5_07.jpg") no-repeat center center;
}
#puzzleArea.puzzle5 #dragArea .dragParts:nth-child(4){
	background: url("/image/global/science-edu/micro/content13/puzzle5_08.jpg") no-repeat center center;
}
#puzzleArea.puzzle5 #dragArea .dragParts:nth-child(1){
	background: url("/image/global/science-edu/micro/content13/puzzle5_09.jpg") no-repeat center center;
}
#puzzleArea.puzzle6 #dragArea .dragParts:nth-child(3){
	background: url("/image/global/science-edu/micro/content13/puzzle6_08.jpg") no-repeat center center;
}
#puzzleArea.puzzle6 #dragArea .dragParts:nth-child(2){
	background: url("/image/global/science-edu/micro/content13/puzzle6_09.jpg") no-repeat center center;
}
#puzzleArea.puzzle6 #dragArea .dragParts:nth-child(6){
	background: url("/image/global/science-edu/micro/content13/puzzle6_10.jpg") no-repeat center center;
}
#puzzleArea.puzzle6 #dragArea .dragParts:nth-child(4){
	background: url("/image/global/science-edu/micro/content13/puzzle6_11.jpg") no-repeat center center;
}
#puzzleArea.puzzle6 #dragArea .dragParts:nth-child(5){
	background: url("/image/global/science-edu/micro/content13/puzzle6_12.jpg") no-repeat center center;
}
#puzzleArea.puzzle6 #dragArea .dragParts:nth-child(1){
	background: url("/image/global/science-edu/micro/content13/puzzle6_13.jpg") no-repeat center center;
}


/*--bottomBtn--*/
#main.index .bottomBtn{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 30px;
}
#main.index  .bottomBtn .hide{
	display: none;
}
#main.index  .bottomBtn a,
#main.index  .bottomBtn div{
	width: 100%;
	max-width: 330px;
	height: 93px;
	padding: 34px 0 0 0;
	text-align: center;
	letter-spacing: 0.05em;
	font-weight: 800;
	color: var(--mainColor);
	font-size: 18px;
	text-shadow: var(--t-shadow-pale);
	position: relative;
	cursor: pointer;
}
#main.index .bottomBtn a:hover,
#main.index .bottomBtn div:hover{
	color: var(--mainColor);
	text-decoration: none;
	filter: brightness(0.8);
	transition: all 0.3s ease;
}
#main.index  .bottomBtn a span,
#main.index  .bottomBtn div span{
	text-transform: var(--rotate);
}
#main.index  .bottomBtn .left{
	padding-left: 5px;
}
#main.index  .bottomBtn .right{
	padding-right: 5px;
}
#main.index  .bottomBtn .left::before{
	content: "";
	display: block;
	width: 22px;
	height: 23px;
	background: url("/image/global/science-edu/micro/content13/common_04.png") no-repeat center center / 100% auto;
	position: absolute;
	top: calc(50% - 11px);
	left: 38px;
}
#main.index  .bottomBtn .right::before{
	content: "";
	display: block;
	width: 22px;
	height: 23px;
	background: url("/image/global/science-edu/micro/content13/common_03.png") no-repeat center center / 100% auto;
	position: absolute;
	top: calc(50% - 11px);
	right: 38px;
}
#main.index  .bottomBtn .canada,
#main.index  .bottomBtn .china,
#main.index  .bottomBtn .hakkutu{
	background: url("/image/global/science-edu/micro/content13/common_05.png") no-repeat center center / 100% auto;
}
#main.index  .bottomBtn .map,
#main.index  .bottomBtn .back{
	background: url("/image/global/science-edu/micro/content13/common_06.png") no-repeat center center / 100% auto;
}


/*--kasekiBox--*/
#kasekiBox {
	display: block;
	margin-top: 30px;
}
#kasekiBox h2{
	display: block;
	height: 90px;
	padding-top: 12px;
	text-align: center;
	color: #FFF;
	font-weight: 800;
	font-size: 19px;
	background: url("/image/global/science-edu/micro/content13/common_07.png") no-repeat center center / 494px 100%;
}
#kasekiBox h2 div{
	transform: var(--rotate);
}
#kasekiBox h2 .main{
	margin-bottom: 2px;
}
#kasekiBox h2 .caption{
	display: block;
	background: rgba(255,255,255,0.1);
	max-width: 370px;
	margin: 0 auto;
	border-radius: 15px;
	padding-top: 5px;
	padding-bottom: 4px;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.05em !important;
}
#kasekiBox .boxList{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 126px;
	margin-top: 10px;
	position: relative;
}
#kasekiBox .kasekiKey:not(.active){
	pointer-events: none;
}
#kasekiBox .kasekiKey{
	display: block;
	width: 100%;
	max-width: 155px;
	height: 126px;
	padding: 15px;
	border: #5e2c03 solid 1px;
	background: url("/image/global/science-edu/micro/content13/common_08.jpg") #8a5221 no-repeat center center / 100% auto;
	position: relative;
}
#kasekiBox .kasekiKey:nth-child(4){
	margin-right: 14px;
}
#kasekiBox .kasekiKey:nth-child(2),
#kasekiBox .kasekiKey:nth-child(3),
#kasekiBox .kasekiKey:nth-child(4),
#kasekiBox .kasekiKey:nth-child(6),
#kasekiBox .kasekiKey:nth-child(7){
	border-left: none;
	box-sizing: border-box;
}
#kasekiBox .kasekiKey img{
	border: #FFF solid 3px;
	border-radius: 3px;
	box-sizing: content-box;
}
#kasekiBox .kasekiKey:not(.active) img{
	opacity: 0;
}
#kasekiBox .kasekiKey.active img:hover{
	filter: brightness(0.8);
	transition: all 0.3s ease;
}
#kasekiBox .kasekiKey.active img{
	opacity: 1;
	cursor: pointer;
}
#kasekiBox .kasekiKey.active::before{
	display: block;
	width: 10em;
	color: #FFF;
	font-size: 12px;
	text-align: center;
	line-height: 1.8;
	background: #723113;
	outline: #c49923 solid 2px;
	border-radius: 10px;
	position: absolute;
	top: -7px;
	left: calc(50% - 5em);
	transform: var(--rotate);
}
#kasekiBox .kasekiKey.kaseki0.active::before{
	content: "Marrella";
}
#kasekiBox .kasekiKey.kaseki1.active::before{
	content: "Haplophrentis";
}
#kasekiBox .kasekiKey.kaseki2.active::before{
	content: "Burgessia";
}
#kasekiBox .kasekiKey.kaseki3.active::before{
	content: "Burgessochaeta";
}
#kasekiBox .kasekiKey.kaseki4.active::before{
	content: "Kunmingella";
}
#kasekiBox .kasekiKey.kaseki5.active::before{
	content: "Isoxys";
}
#kasekiBox .kasekiKey.kaseki6.active::before{
	content: "Naraoia";
}
#kasekiBox .placeCaption{
	display: block;
	width: 130px;
	height: 25px;
	padding-top: 5px;
	background: #8a5221;
	color: #FFF;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	line-height: 1;
	border-radius: 0 0 30px 30px;
	position: absolute;
	bottom: -24px;
}
#kasekiBox .placeCaption.canada{
	left: 248px;
}
#kasekiBox .placeCaption.china{
	right: 170px;
}
#kasekiBox .placeCaption span{
	transform: var(--rotate);
}

/*--kasekiBox--*/
.modalStyle{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	transition: all 0.3s ease;
}
.modalStyle:not(.active){
	opacity: 0;
	pointer-events: none;
}
.modalStyle.active{
	opacity: 1;
}
.modalBg{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background: rgba(43,41,38,0.9);
}
.modalCont{
	display: block;
	width: 90%;
	max-width: 680px;
	height: 90dvh;
	max-height: 660px;
	background: #FFF;
	position: relative;
	z-index: 100;
	transition: all 0.15s ease;
}
#puzzleModal .modalCont{
	max-height: 710px;
}
#puzzleModal:has(.wideKey) .modalCont{
	max-width: 880px;
	max-height: 700px;
}
.modalCloseKey{
	font-size: 16px;
	font-weight: 700;
	transform: var(--rotate);
	cursor: pointer;
}
.modalCloseKey:hover{
	color: var(--hitachiColor);
	transition: all 0.3s ease;
}
.modalHeader{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 70px;
	padding: 0 30px;
	background: #f2f2f2;
}
.modalBody{
	display: block;
	padding: 30px;
	height: calc(100% - 70px);
	text-align: center;
	overflow-y: scroll;
}
.modalBody .modalTitle{
	display: block;
	font-weight: 700;
	font-size: 20px;
	text-align: center;
	padding-bottom: 18px;
	transform: var(--rotate);
}

/*--stoneAlert--*/
#stoneAlert{
	opacity: 1;
	transition: all 0.3s ease;
}
#stoneAlert:not(.active){
	opacity: 0;
	pointer-events: none;
}
#stoneAlert .modalCont{
	max-height: 300px;
}
#stoneAlert .modalBody{
	padding: 50px 30px 30px 30px;
}
#stoneAlert .hint{
	display: block;
	margin-bottom: 30px;
	line-height: 2;
	font-size: 16px;
	transform: var(--rotate);
}
#stoneAlert .hint span{
	display: inline-block;
	margin-right: 0.8em;
	background: #e60027;
	color: #FFF;
	line-height: 1;
	padding: 4px 1em;
	border-radius: 14px;
}

/*--breakStoneArea--*/
#breakStoneArea{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 280px;
	background: url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center center;
	margin: 0 auto 25px auto;
}
#breakStoneArea:not(.broken){
	cursor: url("/image/global/science-edu/micro/content13/common_16.png") 10 10, auto;
}
#breakStoneArea.shake img{
	animation: stoneShake .15s forwards;
}
		@keyframes stoneShake {
			0% {
				transform: translate(0);
			}
			25% {
				transform: translate(10px);
			}
			50% {
				transform: translate(0);
			}
			75% {
				transform: translate(10px);
			}
			100% {
				transform: translate(0);
			}
		}
#breakStoneArea.broken img{
	opacity: 0;
	pointer-events: none;
}
#breakStoneArea.broken.pattern2{
	background: 
		url("/image/global/science-edu/micro/content13/canada_11.png") no-repeat center center,
		url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center center;
}
#breakStoneArea.broken.pattern3{
	background:
		url("/image/global/science-edu/micro/content13/canada_12.png") no-repeat center center,
		url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center center;
}
#breakStoneArea.broken.pattern5{
	background: 
		url("/image/global/science-edu/micro/content13/canada_13.png") no-repeat center center,
		url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center center;
}
#breakStoneArea.broken.pattern2.china{
	background: 
		url("/image/global/science-edu/micro/content13/china_11.png") no-repeat center center,
		url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center center;
}
#breakStoneArea.broken.pattern3.china{
	background:
		url("/image/global/science-edu/micro/content13/china_12.png") no-repeat center center,
		url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center center;
}
#breakStoneArea.broken.pattern5.china{
	background: 
		url("/image/global/science-edu/micro/content13/china_13.png") no-repeat center center,
		url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center center;
}

#main.index #breakStoneText p{
	font-size: 16px;
	line-height: 1.8;
	transform: var(--rotate);
}
#main.index #breakStoneText .hide{
	display: none;
	pointer-events: none;
}
#main.index #breakStoneText #puzzleEndBtnBox{
	margin-top: 20px;
}

/* .zoomStoneWrap */
.stoneName{
	display: block;
	max-width: 400px;
	margin: 0 auto;
	padding-top: 13px;
	padding-bottom: 2px;
	color: #743316;
	font-weight: bold;
	text-align: center;
	background: url("/image/global/science-edu/micro/content13/common_02.png") no-repeat center top -30px;
}
.zoomStoneArea{
	display: block;
	width: 400px;
	height: 300px;
	margin: 0 auto 20px auto;
	background-color: #F2F2F2;
	background-position: center;
	background-size: 100% auto;
	background-repeat: no-repeat;
	position: relative;
	transition: all 0.5s ease;
}
.zoomStoneArea.z1x .zoomKey{
	cursor: url("/image/global/science-edu/micro/content13/common_20.png") 10 10, auto;
}
.zoomStoneArea.z2x .zoomImg{
	cursor: url("/image/global/science-edu/micro/content13/common_21.png") 0 0, auto;
}
.zoomStoneArea .zoomKey{
	width: 60px;
	height: 60px;
	border: #FFF dashed 2px;
	border-radius: 50%;
	position: absolute;
}
.zoomStoneArea.puzzle0 .zoomKey:nth-child(1){
	top: 162px;
	left: 90px;
}
.zoomStoneArea.puzzle0 .zoomKey:nth-child(2){
	top: 39px;
	left: 170px;
}
.zoomStoneArea.puzzle0 .zoomKey:nth-child(3){
	top: 166px;
	left: 237px;
}
.zoomStoneArea.puzzle0 .zoomKey:nth-child(4){
	top: 231px;
	left: 244px;
}
.zoomStoneArea.puzzle1 .zoomKey:nth-child(1){
	top: 50px;
	left: 130px;
}
.zoomStoneArea.puzzle1 .zoomKey:nth-child(2){
	top: 117px;
	left: 133px;
}
.zoomStoneArea.puzzle1 .zoomKey:nth-child(3){
	top: 223px;
	left: 150px;
}
.zoomStoneArea.puzzle1 .zoomKey:nth-child(4){
	display: none;
	pointer-events: none;
}
.zoomStoneArea.puzzle2 .zoomKey:nth-child(1){
	top: 11px;
	left: 162px;
}
.zoomStoneArea.puzzle2 .zoomKey:nth-child(2){
	top: 72px;
	left: 177px;
}
.zoomStoneArea.puzzle2 .zoomKey:nth-child(3){
	top: 138px;
	left: 185px;
}
.zoomStoneArea.puzzle2 .zoomKey:nth-child(4){
	top: 110px;
	left: 114px;
}
.zoomStoneArea.puzzle3 .zoomKey:nth-child(1){
	top: 100px;
	left: 55px;
}
.zoomStoneArea.puzzle3 .zoomKey:nth-child(2){
	top: 70px;
	left: 320px;
}
.zoomStoneArea.puzzle3 .zoomKey:nth-child(3){
	top: 227px;
	left: 154px;
}
.zoomStoneArea.puzzle3 .zoomKey:nth-child(4){
	display: none;
	pointer-events: none;
}
.zoomStoneArea.puzzle4 .zoomKey:nth-child(1){
	top: 126px;
	left: 48px;
}
.zoomStoneArea.puzzle4 .zoomKey:nth-child(2){
	top: 80px;
	left: 85px;
}
.zoomStoneArea.puzzle4 .zoomKey:nth-child(3){
	top: 154px;
	left: 100px;
}
.zoomStoneArea.puzzle4 .zoomKey:nth-child(4){
	top: 160px;
	left: 240px;
}
.zoomStoneArea.puzzle5 .zoomKey:nth-child(1){
	top: 223px;
	left: 256px;
}
.zoomStoneArea.puzzle5 .zoomKey:nth-child(2){
	top: 97px;
	left: 154px;
}
.zoomStoneArea.puzzle5 .zoomKey:nth-child(3){
	top: 94px;
	left: 220px;
}
.zoomStoneArea.puzzle5 .zoomKey:nth-child(4){
	display: none;
	pointer-events: none;
}
.zoomStoneArea.puzzle6 .zoomKey:nth-child(1){
	top: 60px;
	left: 20px;
}
.zoomStoneArea.puzzle6 .zoomKey:nth-child(2){
	top: 70px;
	left: 200px;
}
.zoomStoneArea.puzzle6 .zoomKey:nth-child(3){
	top: 160px;
	left: 90px;
}
.zoomStoneArea.puzzle6 .zoomKey:nth-child(4){
	top: 195px;
	left: 230px;
}
.zoomStoneArea.z1x .zoomKey:hover{
	background: rgba(255,255,255,0.3);
	transition: all 0.3s ease;
}
.zoomStoneArea.z2x .zoomKey{
	pointer-events: none;
}
.zoomStoneArea .zoomImg{
	display: block;
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: 100% auto;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 0;
}
.zoomStoneArea.z1x .zoomImg{
	pointer-events: none;
	opacity: 0;
}
.zoomStoneArea.z2x .zoomImg{
	opacity: 1;
	transition: all 0.6s ease;
}
.zoomStoneArea.puzzle0{
	background-image: url("/image/global/science-edu/micro/content13/puzzle0_10.jpg");
}
.zoomStoneArea.puzzle0.z2x.zPos1 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle0_11.jpg");
}
.zoomStoneArea.puzzle0.z2x.zPos2 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle0_12.jpg");
}
.zoomStoneArea.puzzle0.z2x.zPos3 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle0_13.jpg");
}
.zoomStoneArea.puzzle0.z2x.zPos4 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle0_14.jpg");
}
.zoomStoneArea.puzzle1{
	background-image: url("/image/global/science-edu/micro/content13/puzzle1_10.jpg");
}
.zoomStoneArea.puzzle1.z2x.zPos1 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle1_11.jpg");
}
.zoomStoneArea.puzzle1.z2x.zPos2 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle1_12.jpg");
}
.zoomStoneArea.puzzle1.z2x.zPos3 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle1_13.jpg");
}
.zoomStoneArea.puzzle1.z2x.zPos4 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle1_14.jpg");
}
.zoomStoneArea.puzzle2{
	background-image: url("/image/global/science-edu/micro/content13/puzzle2_14.jpg");
}
.zoomStoneArea.puzzle2.z2x.zPos1 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle2_15.jpg");
}
.zoomStoneArea.puzzle2.z2x.zPos2 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle2_16.jpg");
}
.zoomStoneArea.puzzle2.z2x.zPos3 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle2_17.jpg");
}
.zoomStoneArea.puzzle2.z2x.zPos4 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle2_18.jpg");
}
.zoomStoneArea.puzzle3{
	background-image: url("/image/global/science-edu/micro/content13/puzzle3_14.jpg");
}
.zoomStoneArea.puzzle3.z2x.zPos1 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle3_15.jpg");
}
.zoomStoneArea.puzzle3.z2x.zPos2 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle3_16.jpg");
}
.zoomStoneArea.puzzle3.z2x.zPos3 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle3_17.jpg");
}
.zoomStoneArea.puzzle3.z2x.zPos4 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle3_18.jpg");
}
.zoomStoneArea.puzzle4{
	background-image: url("/image/global/science-edu/micro/content13/puzzle4_10.jpg");
}
.zoomStoneArea.puzzle4.z2x.zPos1 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle4_11.jpg");
}
.zoomStoneArea.puzzle4.z2x.zPos2 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle4_12.jpg");
}
.zoomStoneArea.puzzle4.z2x.zPos3 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle4_13.jpg");
}
.zoomStoneArea.puzzle4.z2x.zPos4 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle4_14.jpg");
}
.zoomStoneArea.puzzle5{
	background-image: url("/image/global/science-edu/micro/content13/puzzle5_10.jpg");
}
.zoomStoneArea.puzzle5.z2x.zPos1 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle5_11.jpg");
}
.zoomStoneArea.puzzle5.z2x.zPos2 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle5_12.jpg");
}
.zoomStoneArea.puzzle5.z2x.zPos3 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle5_13.jpg");
}
.zoomStoneArea.puzzle5.z2x.zPos4 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle5_14.jpg");
}
.zoomStoneArea.puzzle6{
	background-image: url("/image/global/science-edu/micro/content13/puzzle6_14.jpg");
}
.zoomStoneArea.puzzle6.z2x.zPos1 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle6_15.jpg");
}
.zoomStoneArea.puzzle6.z2x.zPos2 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle6_16.jpg");
}
.zoomStoneArea.puzzle6.z2x.zPos3 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle6_17.jpg");
}
.zoomStoneArea.puzzle6.z2x.zPos4 .zoomImg{
	background-image: url("/image/global/science-edu/micro/content13/puzzle6_18.jpg");
}

#main.index .stoneText p{
	line-height: 2;
	margin-bottom: 30px;
	min-height: 4em;
	transform: var(--rotate);
}
#main.index #puzzleEndBtnBox{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 15px;
}
#main.index #puzzleEndBtnBox .modalCloseBtn.hide{
	display: none;
}
#main.index .puzzleLinkBtn,
#main.index #puzzleEndBtnBox .modalCloseBtn,
#main.index .animalWrap .modalCloseBtn,
#main.index .animalWrap .backBtn,
#main.index #stoneAlert #stoneAlertReset{
	display: block;
	width: 100%;
	max-width: 300px;
	height: 74px;
	margin: 0 auto;
	padding: 23px 9px 0 0;
	text-align: center;
	letter-spacing: 0.05em;
	font-weight: 800;
	color: var(--mainColor);
	font-size: 16px;
	text-shadow: var(--t-shadow-pale);
	background: url("/image/global/science-edu/micro/content13/common_05.png") no-repeat center center / 100% 100%;
	position: relative;
	cursor: pointer;
}
#main.index .stoneText .nextBtn{
	display: block;
	width: 100%;
	max-width: 400px;
	height: 74px;
	margin: 0 auto;
	padding: 23px 15px 0 0;
	text-align: center;
	letter-spacing: 0.05em;
	font-weight: 800;
	color: var(--mainColor);
	font-size: 15px;
	text-shadow: var(--t-shadow-pale);
	background: url("/image/global/science-edu/micro/content13/common_05.png") no-repeat center center / 100% 100%;
	position: relative;
	cursor: pointer;
}
#main.index #stoneAlert #stoneAlertReset,
#main.index #puzzleEndBtnBox .modalCloseBtn,
#main.index .animalWrap .modalCloseBtn,
#main.index .animalWrap .backBtn{
	background: url("/image/global/science-edu/micro/content13/common_06.png") no-repeat center center / 100% 100%;
}
#main.index .puzzleLinkBtn:hover,
#main.index #puzzleEndBtnBox .modalCloseBtn:hover,
#main.index .stoneText .nextBtn:hover,
#main.index .animalWrap .modalCloseBtn:hover,
#main.index .animalWrap .backBtn:hover,
#main.index #stoneAlert #stoneAlertReset:hover{
	color: var(--mainColor);
	text-decoration: none;
	filter: brightness(0.8);
	transition: all 0.3s ease;
}
#main.index .puzzleLinkBtn span,
#main.index #puzzleEndBtnBox .modalCloseBtn span,
#main.index .stoneText .nextBtn span,
#main.index .animalWrap .modalCloseBtn span,
#main.index .animalWrap .backBtn span,
#main.index #stoneAlert #stoneAlertReset span{
	transform: var(--rotate);
}
#main.index .puzzleLinkBtn::before,
#main.index #puzzleEndBtnBox .modalCloseBtn::before,
#main.index .stoneText .nextBtn::before,
#main.index .animalWrap .modalCloseBtn::before,
#main.index .animalWrap .backBtn::before,
#main.index #stoneAlert #stoneAlertReset::before{
	content: "";
	display: block;
	width: 18px;
	height: 19px;
	background: url("/image/global/science-edu/micro/content13/common_03.png") no-repeat center center / 100% auto;
	position: absolute;
	top: calc(50% - 9px);
	right: 26px;
}

.animalWrap .animalImg{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 13px 20px;
	margin: 0 auto 20px auto;
}
.animalWrap .animalImg .caption{
	display: block;
	color: #787878;
	transform: var(--rotate);
}
#main .animalWrap .animalImg img{
	width: 100%;
	height: 300px;
	object-fit: cover;
}
.animalWrap .animalText{
	min-height: 4em;
	margin-bottom: 10px;
	transform: var(--rotate);
}
#main.index .animalWrap .animalText p{
	line-height: 1.8;
}

/* 完了の海イメージ */
#seaImage{
	display: block;
  width: 100%;
  max-width: var(--width);
  background: url("/image/global/science-edu/micro/content13/common_36.png") no-repeat center center / cover;
  height: 100%;
  position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
	transition: all 1s ease;
}
#seaImage:not(.show){
	opacity: 0;
	pointer-events: none;
}
#seaImage.show{
	opacity: 1;
}
#seaImage .title{
	display: block;
	width: 100%;
	position: absolute;
	top: 60px;
	left: 0;
	text-align: center;
}
#seaImage .title strong{
	background: linear-gradient(90deg, rgba(255,255,255,0) 2%, rgba(255,255,255,0.9) 15%, rgba(255,255,255,0.9) 85%, rgba(255,255,255,0) 98%);
	color: #2b3f40;
	font-size: 19px;
	font-weight: 700;
	padding: 9px 80px 5px 90px;
	transform: var(--rotate);
}
#seaImage .title p{
	display: block;
	padding-top: 15px;
	color: #FFF;
	font-size: 16px;
	font-weight: 400;
	line-height: 2;
	transform: var(--rotate);
}
#seaImage img{
	position: absolute;
}
#seaImage .ani0{
	width: 186px;
	top: 270px;
	left: 460px;
}
#seaImage .ani1{
	width: 90px;
	top: 280px;
	left: 740px;
	rotate: -40deg;
}
#seaImage .ani2{
	width: 201px;
	top: 330px;
	left: 600px;
	rotate: -28deg;
}
#seaImage .ani3{
	width: 196px;
	top: 350px;
	left: 50px;
	rotate: 30deg;
}
#seaImage .ani4{
	width: 120px;
	top: 50px;
	left: 50px;
}
#seaImage .ani5{
	width: 132px;
	top: 130px;
	left: 830px;
}
#seaImage .ani6{
	width: 176px;
	top: 240px;
	left: 200px;
}
#seaImage .caption{
	padding: 6px 10px;
	text-align: right;
	font-size: 13px;
	line-height: 1;
	border-radius: 3px;
	background: rgba(255,255,255,0.5);
	color: #2b3f40;
	position: absolute;
	right: 12px;
	bottom: 12px;
	transform: var(--rotate);
}