@charset "UTF-8";
.sections {
  opacity: 0; /* 初期状態で非表示 */
}

.section01 {
	position: relative;
	height: 100vh;
	overflow: hidden;
	background-image: url(../img/about/about_img01.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover; 
}
/* タイトル アニメーション */
.section01 .animate_titleBox {
	position: absolute;
	top: 34%;
	left: 20%;
	z-index: 2;
	width: 800px;
	height: 100px;
	overflow: hidden;
	display: block;
}


.section02 {
	position: relative;
	height: 900px;
	padding: 100px 50px 0px 50px;
}
.section02 .text_box01 {
	position: absolute;
	top: 300px;
	z-index: 4;
}
.section02 .text_box02 {
	position: absolute;
	top: 200px;
	z-index: 4;
}

.section02 .background_box01,
.section02 .background_box02,
.section02 .background_box03 {
	opacity: 0;
}


.section02 .background_box01 {
	position: absolute;
	top: 50%;
	left: 50px;
/*	width: 1029px;*/
	width: 84vw;
	max-width: 1000px;
	height: 292px;
	background-image: url(../img/about/about_img03.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	transform: translate(0, -10%);
/*	animation: back_box01 4s ease-in-out 1 forwards;*/
	z-index: 2;
}

@keyframes back_box01 {
	0% {
		top: 50%;
		left: 50px;
		opacity: 0;
	}
	70% {
		top: 50%;
		left: 50px;
		opacity: 0;
	}
	100% {
		top: 47%;
		left: 70px;
		opacity: 1;
	}
}
.section02 .background_box02 {
	position: absolute;
	top: 50%;
	left: 50px;
	z-index: 3;
	transform: translate(0, -10%);
/*	animation: back_box02 4s ease-in-out 1 forwards;*/
}
@keyframes back_box02 {
	0% {
		top: 50%;
		left: 50px;
		opacity: 0;
	}
	70% {
		top: 50%;
		left: 50px;
		opacity: 0;
	}
	100% {
		top: 53%;
		left: 30px;
		opacity: 1;
	}
}
.original-gradient {
/*  width: 1029px;*/
	width: 84vw;
	max-width: 1000px;	
	height: 292px;
	background-image: linear-gradient(90deg, rgba(166, 222, 133, 0.8), rgba(72, 136, 129, 0.8));
}

.background_box03 {
	position: absolute;
	top: 10%;
	right: 0;
	width: 900px;
	height: 600px;
	background-image: url(../img/about/about_img02.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 90%;
	transform: scale(0.9);
/*	animation:  fadeIn 3s ease-in forwards, zoomIn 15s ease-in 1s forwards;*/
/*	opacity: 0;*/
	z-index: 1;
}
/* フェードインのアニメーション */
@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 拡大のアニメーション */
@keyframes zoomIn {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}


/* アニメーションの初期スタイル */
.section02 .text_box01 {
	position: absolute;
	top: 50%;
	left: 0%;
	width: 720px;
	transform: translate(25%);
	
}

/* アニメーションの初期スタイル */
.section02 .text_box02 {
	position: absolute;
	top: 63%;
	left: 0%;
	width: 720px;
	transform: translate(22%);
	
}


.section03 {
	padding: 50px 0px;
	position: relative;

}
.sec03_box {
	position: relative;
	width: 1300px;
	height: 800px;
	background-image: url(../img/about/about_img04.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto;
	margin-left: auto;
	margin-right: auto;
	opacity: 0;
}
@keyframes sec03_back_animate {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.sec03_box .text_box01 {

}
.sec03_box .text_box03 {
	
}
.sec03_box .sec03_subbox {
	position: absolute;
	top: 35%;
	left: 0px;
	padding: 30px 50px;
	background-color: rgba(255,255,255,0.5);
}

.section04 {
	padding: 200px 0px 100px 0px;
	position: relative;
	background-image: url(../img/about/about_img06.png);
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: auto;
}
.sec04_box {
	position: relative;
	width: 1300px;
	height: 800px;
	background-image: url(../img/about/about_img05.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto;
	margin-left: auto;
	margin-right: auto;
	opacity: 0;
}
@keyframes sec04_back_animate {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.sec04_box .text_box01 {
	width: 150px;
	margin-left: auto;
}
.sec04_box .text_box03 {
	
}
.sec04_box .sec04_subbox {
	position: absolute;
	top: 35%;
	right: 0px;
	padding: 30px 50px;
	background-color: rgba(255,255,255,0.5);
}