@charset "utf-8";
/* CSS Document */
/*---------------------トップバナー-----------------------*/
#top_contents{
width: 100% ;
    height: 100%;
	position: relative;
	background:rgba(180,180,180,1.00);
}
.top_logo{
	position: absolute;
	width: 250px;
	height: 88px;
	max-width: 250px;
	top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
	z-index: 10;

}
.logo_anime_wrapper{
	width: 100%;
	position: relative;
}
.logo_anime,.logo_anime2,.logo_anime3,.logo_anime4{
	position: absolute;
		width: 100%;
	opacity: 0;
}

.back_img{
	position: relative;
	    width: 100%;
   
    overflow: hidden;
    text-align: center;
}
.slider{
	height: 100%;
}
.slider li{
width: 100%;
 animation-duration: 7.5s;/* アニメーション時間 */
  animation-name: zoomOut;/* アニメーション名 */

}
 @keyframes zoomOut {
 0% {
	 transform: scale(1.2)rotate(0.00001deg);

-webkit-transform: scale(1.2)rotate(0.00001deg);
}
 100% {
	 transform: scale(1)rotate(0.00001deg);

-webkit-transform: scale(1)rotate(0.00001deg);
}
}

.bx-wrapper,.bx-viewport{
	width: 100% !important;
    height: 100% !important;
	z-index: 0;
}
.header_logo{
	position: absolute;
	width: 20%;
	top:20px;
	left: 20px;
	max-width: 130px;
	z-index: 100;
}
.top_back1{
    background: url(../img/top/top_back/1.jpg);
	    height: 100%;
    background-size: cover;
    background-position: center;

}
.top_back2{
    background: url(../img/top/top_back/2.jpg);
	    height: 100%;
    background-size: cover;
    background-position: center;

}
.top_back3{
    background: url(../img/top/top_back/3.jpg);
	    height: 100%;
    background-size: cover;
    background-position: center;

	
}
.top_back4{
    background: url(../img/top/top_back/4.jpg);
	    height: 100%;
    background-size: cover;
    background-position: center;

}
.top_back5{
    background: url(../img/top/top_back/5.jpg);
	    height: 100%;
    background-size: cover;
    background-position: center;

}
.nav_top{
	
	position: fixed;
	right: 50px;
	top:20px;
	z-index: 15;
	    transition: all .4s;
	animation-duration: 1.5s;/* アニメーション時間 */
  animation-name: RightToLeft;/* アニメーション名 */
}
@keyframes RightToLeft {
  0% {
   
    transform: translateX(100px);/* X軸方向に50px */
  }
  100% {
    
    transform: translateX(0);
  }
}
.nav_top ul{
	color: #FFF;
	z-index: 10;

}
.nav_top li{
padding: 10px 0px;
}
.nav_top li a{
	display: inline-block;
padding: 10px 0px 0px;
border-bottom: 1px solid #FFF;
	text-decoration: none;
	color: #FFF;	
	border-collapse: collapse;
	transition: 2s;
}

.nav_top li a:after {
content: '';
	width: 0;
	padding-bottom: 1px;
	transition: all 0.3s ease;
	border-bottom: 1px solid #FFF;
	border-collapse: collapse;
	display: block;

}
.nav_top li a:hover:after {
width: 100%;
	border-bottom: 1px solid #FFF;
		border-collapse: collapse;
}

.change_color li a{
	transition: 2s;
	color: #000;
	border-bottom: 1px solid #000;
}
.change_color li a:hover:after {
width: 100%;
	border-bottom: 1px solid #000;
		border-collapse: collapse;
}
/*---------------------トップ-----------------------*/

#top{
	text-align: center;
padding: 40px 0px 0px;
	margin-bottom: 200px;
}
.top_title{
		font-family: 'Noto Serif JP', serif;
	font-weight: bold;
		font-size: 2.5em;
	
	margin: 50px 0px;
		letter-spacing: 0.1em
}
.top_bottom{
	font-family: 'Noto Serif JP', serif;
		font-size:1.3em;
		letter-spacing: 0.1em
}
.last_copy{
	font-size:1.5em;
	padding-top: 25px;
		letter-spacing: 0.1em
}



/*--------------------btn----------------------*/

.btn_wrapper{
	display: flex;
	 align-items: center;
	margin:50px 0% 0px 10%;
	width: 300px;

}

.btn_wrapper2{
	display: flex;
	 align-items: center;
	flex-direction: row;
	margin:50px 10% 0px 00%;
width: 300px;
float: right
}
.btn_wrapper3{
	display: flex;
	 align-items: center;
	flex-direction: row;
	
	margin:50px 10% 0px 00%;
	
	width: 300px;
}
.yajirushi{
	width: 10%;
	margin-right: 5%;
}

.btn_page{
	width: 85%;
}
.btn_page a{
	 position: relative;
	  display: inline-block;
	width: 100%;
	text-align: center;
	background: #000;
	color: #FFF;
	padding: 5px;
	text-decoration: none;
		font-size:1.1em;
		letter-spacing: 0.3em;
	  outline: none;
	  z-index: 2;
	border: 2px solid #333;
}

.btn_page a::before,
.btn_page a::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}



.btn_page a,
.btn_page a::before,
.btn_page a::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
	
}

.btn_page a:hover {
  background: #FFF;
	color: #000;
}
.btn_page a::before,
.btn_page a::after {
  left: 0;
  width: 100%;
  height: 50%;
  background-color: #333;
}
.btn_page a::before {
  top: 0;
}
.btn_page a::after {
  bottom: 0;
}
.btn_page a:hover::before,
.btn_page a:hover::after {
  height: 0;
}





/*--------------------contents1----------------------*/


#contents1{
	width: 100%;
	height: auto;
	position: relative;
}
.back_contents1{
	height: 350px;
  background-image: url(../img/top/contents1/back-img.jpg);   
	background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.wrapper_contents1{
	position: relative;
	z-index: 1;
	background: #FFF;
	max-width: 1200px;
		width: 90%;
padding:5% 0px;
	height:auto;
	margin:0 auto;
}
.title_contents1{
	width:18%;
	padding:0% 0px 3%;
	display: inline-block;
}

.copy_wrapper_contents1{
	max-width: 700px;
	width: 60%;
	height:auto;
	padding-top: 23%;
	position: relative;
}
.copy1_contents1{
	position: absolute;
	width: 18%;
	top:0;
	left: 0;
		opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents1{
	position: absolute;
	width: 6.5%;
	top:15%;
	left:22.1%;
	opacity: 0;
		 animation-duration: 1.4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents1{
	position: absolute;
	width: 11%;
	top:6%;
	left:32.5%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents1{
	position: absolute;
	width: 5.5%;
	top:3%;
	left:47%;
	opacity: 0;
			 animation-duration: 2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents1{
	position: absolute;
	width: 8.6%;
	top:11%;
	left:57%;
	opacity: 0;
			 animation-duration:1.9s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents1{
	position: absolute;
	width: 13%;
	top:7%;
	left:69.5%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents1{
	position: absolute;
	width: 8.26%;
	top:15%;
	left:85%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents1{
	position: absolute;
	width: 2.26%;
	top:35%;
	right: 3%;
	opacity: 0;
			 animation-duration: 2.1s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents1{
	position: absolute;
	width: 18%;
bottom:0%;
	left:20%;
	opacity: 0;
			 animation-duration: 2.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents1{
	position: absolute;
	width: 12.6%;
	bottom:9%;
	left:42%;
	opacity: 0;
			 animation-duration: 1.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy11_contents1{
	position: absolute;
	width: 5.3%;
bottom:4%;
	left:62%;
	opacity: 0;
			 animation-duration: 2.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy12_contents1{
	position: absolute;
	width: 9.9%;
	bottom:9%;
	left:79%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy13_contents1{
	opacity: 0;
	position: absolute;
	width:3.9%;
	bottom:0%;
	left:92%;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}

.text_contents1{
	display: flex;
	  flex-direction: row-reverse;
	width: 100%;	
	margin-top:5%;

}
.text_contents1 p{

	display: inline-block;
			font-size:1.3em;
	line-height: 2.5;
	letter-spacing: 0.1em

}



/*--------------------contents2----------------------*/


#contents2{
	width: 100%;
	height: auto;
	position: relative;
}
.back_contents2{
	height: 350px;
  background-image: url(../img/top/contents2/back-img.jpg);   
	background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.wrapper_contents2{
	position: relative;
	z-index: 1;
	background: #FFF;
	max-width: 1200px;
		width: 90%;
padding:5% 0px;
	height:auto;
	margin:0 auto;
	
}
.title_contents2{
	width: 18.7%;
	padding:0% 0px 3%;
	display: inline-block;
float: right;
}

.copy_wrapper_contents2{
	float: right;
	max-width: 700px;
	width: 60%;
	height:auto;
	padding-top: 23%;
	position: relative;
}
.copy1_contents2{
	position: absolute;
	width: 18%;
	top:0;
	left: 0;
	opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents2{
	position: absolute;
	width: 15%;
	top:18%;
	left:22.1%;
	opacity: 0;
		 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents2{
	position: absolute;
	width: 7%;
	top:10%;
	left:40%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents2{
	position: absolute;
	width: 11%;
	top:10%;
	left:52%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents2{
	position: absolute;
	width: 8.6%;
	top:15%;
	left:66%;
	opacity: 0;
			 animation-duration:2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents2{
	position: absolute;
	width: 3%;
	top:30%;
	left:77%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents2{
	position: absolute;
	width: 16%;
bottom:-2%;
	left:43%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents2{
	position: absolute;
	width: 15%;
bottom:-15%;
	left:64%;
	opacity: 0;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents2{
	position: absolute;
	width: 15%;
bottom:0%;
	left:83%;
	opacity: 0;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents2{
	position: absolute;
	width: 4%;
	bottom:3%;
	right: -4%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.text_contents2{
	display:block;
	width: 100%;	
	margin-top:5%;

}
.text_contents2 p{

	display: inline-block;
	font-size:1.3em;
	line-height: 2.5;
	letter-spacing: 0.1em

}



/*--------------------contents3----------------------*/


#contents3{
	width: 100%;
	height: auto;
	position: relative;
}
.back_contents3{
	height: 350px;
  background-image: url(../img/top/contents3/back-img.jpg);   
	background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.wrapper_contents3{
	position: relative;
	z-index: 1;
	background: #FFF;
	max-width: 1200px;
		width: 90%;
padding:5% 0px;
	height:auto;
	margin:0 auto;
}
.title_contents3{
	width: 19.7%;
	padding:0% 0px 3%;
	display: inline-block;
}

.copy_wrapper_contents3{

	width: 100%;
	height:auto;
	padding-top: 27%;
	position: relative;
}
.copy1_contents3{
	position: absolute;
	width: 8%;
	top: 3%;
	left: 0;
		opacity: 0;
	 animation-duration: 2.4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents3{
	position: absolute;
	width: 2%;
	top:37%;
	left:10.1%;
	opacity: 0;
		 animation-duration: 1.4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents3{
	position: absolute;
	width: 8.5%;
	top:0%;
	left:13.5%;
	opacity: 0;
			 animation-duration: 4.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents3{
	position: absolute;
	width: 2%;
	top:28%;
	left:24%;
	opacity: 0;
			 animation-duration: 1.6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents3{
	position: absolute;
	width: 7.6%;
	top:9%;
	left:29%;
	opacity: 0;
			 animation-duration:3s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents3{
	position: absolute;
	width: 8.5%;
	top:3%;
	left:38.5%;
	opacity: 0;
			 animation-duration: 4.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents3{
	position: absolute;
	width: 7.5%;
	top:14%;
	left:49.5%;
	opacity: 0;
			 animation-duration: 3.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents3{
	position: absolute;
	width: 7%;
	top:14%;
	left:59.5%;
	opacity: 0;
			 animation-duration: 5.1s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents3{
	position: absolute;
	width: 2%;
	top:37%;
	left:68%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents3{
	position: absolute;
	width: 6.6%;
	bottom:4%;
	left:0%;
	opacity: 0;
			 animation-duration: 2.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy11_contents3{
	position: absolute;
	width: 6.3%;
bottom:-1%;
	left:8%;
	opacity: 0;
			 animation-duration: 3.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy12_contents3{
	position: absolute;
	width: 4.9%;
	bottom:8%;
	left:17%;
	opacity: 0;
			 animation-duration:2.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy13_contents3{
	opacity: 0;
	position: absolute;
	width:10.9%;
	bottom:-4%;
	left:25%;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy14_contents3{
	opacity: 0;
	position: absolute;
	width:7.9%;
	bottom:-1%;
	left:38%;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy15_contents3{
	opacity: 0;
	position: absolute;
	width:2.9%;
	bottom:10%;
	left:49%;
			 animation-duration: 4.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy16_contents3{
	opacity: 0;
	position: absolute;
	width:5.9%;
	bottom:0%;
	left:55%;
			 animation-duration: 6.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy17_contents3{
	opacity: 0;
	position: absolute;
	width:5.9%;
	bottom:0%;
	left:64%;
			 animation-duration: 1.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy18_contents3{
	opacity: 0;
	position: absolute;
	width:3.9%;
	bottom:8%;
	left:72%;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy19_contents3{
	opacity: 0;
	position: absolute;
	width:2%;
	bottom:0%;
	left:79%;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.text_contents3{
		display: inline-block;	
	margin-top:5%;
float: right;
}
.text_contents3 p{
	font-size:1.3em;
	line-height: 2.5;
	letter-spacing: 0.1em;


}
.text2{
		margin-bottom:20px;
}



/*--------------------contents4----------------------*/


#contents4{
	width: 100%;
	height: auto;
	position: relative;
	padding-bottom: 5%
}
.back_contents4{
	height: 350px;
  background-image: url(../img/top/contents4/back-img.jpg);   
	background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.wrapper_contents4{
	position: relative;
	z-index: 1;
	background: #FFF;
	max-width: 1200px;
		width: 90%;
padding:5% 0px;
	height:auto;
	margin:0 auto;
	
}
.title_contents4{
	width: 23.7%;
	padding:0% 0px 3%;
	display: inline-block;
float: right;
}





.copy_wrapper_contents4{
	float: right;

	width: 80%;
	height:auto;
	padding-top: 23%;
	position: relative;
}
.copy1_contents4{
	position: absolute;
	width: 14%;
	top:0%;
	left: 0;
	opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents4{
	position: absolute;
	width: 13%;
	top:-5%;
	left:17.1%;
	opacity: 0;
		 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents4{
	position: absolute;
	width: 5%;
	top:18%;
	left:33%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents4{
	position: absolute;
	width: 10%;
	top:6%;
	left:42%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents4{
	position: absolute;
	width: 3.6%;
	top:2%;
	left:56%;
	opacity: 0;
			 animation-duration:2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents4{
	position: absolute;
	width: 8%;
	top:11%;
	left:64%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents4{
	position: absolute;
	width: 8%;
top:10%;
	left:75.5%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents4{
	position: absolute;
	width: 5%;
top:4%;
	left:86.5%;
	opacity: 0;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents4{
	position: absolute;
	width: 2%;
top:25%;
	left:95%;
	opacity: 0;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents4{
	position: absolute;
	width: 11%;
	bottom:0%;
	left: 2%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}

.copy11_contents4{
	position: absolute;
	width: 3%;
	bottom:6%;
	left: 17%;
	opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy12_contents4{
	position: absolute;
	width: 6%;
	bottom:4%;
	left:23.1%;
	opacity: 0;
		 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy13_contents4{
	position: absolute;
	width: 6%;
	bottom:7%;;
	left:32%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy14_contents4{
	position: absolute;
	width: 6%;
	bottom:3%;
	left:40.5%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy15_contents4{
	position: absolute;
	width: 5%;
	bottom:3%;
	left:49%;
	opacity: 0;
			 animation-duration:2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy16_contents4{
	position: absolute;
	width: 11%;
	bottom:3%;
	left:57%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy17_contents4{
	position: absolute;
	width: 4%;
bottom:5%;
	left:72%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy18_contents4{
	position: absolute;
	width: 6%;
bottom:5%;
	left:80%;
	opacity: 0;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy19_contents4{
	position: absolute;
	width: 8.5%;
bottom:0%;
	left:89%;
	opacity: 0;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy20_contents4{
	position: absolute;
	width: 2%;
	bottom:3%;
	right: -1%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}

.float{
	float: right;
}



.text_contents4{
	display:block;
	width: 100%;	
	margin-top:5%;

}
.text_contents4 p{

	display: inline-block;
	font-size:1.3em;
	line-height: 2.5;
	letter-spacing: 0.1em

}
@media (max-width: 1100px) {
.back_contents1{
		height: 350px;
  background-image: url(../img/top/contents1/back-img_sp.jpg);   
	background-attachment:inherit;
  background-position: center;
  background-size:cover;
  background-repeat: no-repeat;

}
.back_contents2{
		height: 350px;
  background-image: url(../img/top/contents2/back-img_sp.jpg);   
background-attachment:inherit;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}	
	
	.back_contents3{
	height: 350px;
  background-image: url(../img/top/contents3/back-img_sp.jpg);   
	background-attachment:inherit;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.back_contents4{
	height: 350px;
  background-image: url(../img/top/contents4/back-img_sp.jpg);   
background-attachment:inherit;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}	
	
	
}


@media (max-width: 769px) {
	.top_back4{
    background: url(../img/top/top_back/4_sp.jpg);
	    height: 100%;
    background-size: cover;
    background-position: center;

}
	
/*---------------------トップバナー-----------------------*/

.top_logo{
	position: absolute;
	width: 200px;
	height: 70px;
	top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
	z-index: 10;

}

/*---------------------トップ-----------------------*/

#top{
	text-align: center;

	margin-bottom:60px;
}
.top_title{
		font-family: 'Noto Serif JP', serif;
	font-weight: bold;
		font-size: 1.4em;
	
	margin: 30px 0px;
		letter-spacing: 0em;
	
}
.top_bottom{
	font-family: 'Noto Serif JP', serif;
		font-size:1em;
	width: 93%;
	margin:0 auto;
		letter-spacing: 0em;
	text-align: justify;

}
.last_copy{
	font-size:1.3em;
		letter-spacing: 0em;
	text-align: center;
	    padding-top:25px;
}
	.s_main br{
		display: none;
	}


/*--------------------btn----------------------*/

.btn_wrapper{
	display: flex;
	 align-items: center;
	width: 100%;
	margin: 50px 0% 0px 0%;
	max-width: 250px;

}

.btn_wrapper2{
	display: flex;
	 align-items: center;
	flex-direction: row;
	width: 100%;
margin:50px auto 0px;
	max-width: 250px;
float: right
}
.btn_wrapper3{
	display: flex;
	 align-items: center;
	flex-direction: row;

		margin: 50px auto 0px ;
		max-width: 250px;
float: right
}
.yajirushi{
	width: 10%;
	margin-right: 5%;
}

.btn_page{
	width: 85%;
}
.btn_page a{
	 position: relative;
	  display: block;
	width: 100%;
	text-align: center;
	background: #000;
	color: #FFF;
	padding: 5px;
	text-decoration: none;
		font-size:1.1em;
		letter-spacing: 0.3em;
	  outline: none;
	  z-index: 2;
	border: 2px solid #333;
}

.btn_page a::before,
.btn_page a::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}



.btn_page a,
.btn_page a::before,
.btn_page a::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
	
}

.btn_page a:hover {
  background: #FFF;
	color: #000;
}
.btn_page a::before,
.btn_page a::after {
  left: 0;
  width: 100%;
  height: 50%;
  background-color: #333;
}
.btn_page a::before {
  top: 0;
}
.btn_page a::after {
  bottom: 0;
}
.btn_page a:hover::before,
.btn_page a:hover::after {
  height: 0;
}





/*--------------------contents1----------------------*/


#contents1{
	width: 100%;
	height: auto;
	position: relative;
}
.back_contents1{
	height: 150px;
  background-image: url(../img/top/contents1/back-img_sp.jpg);   
	background-attachment:inherit;
  background-position: center;
  background-size:cover;
  background-repeat: no-repeat;

}
.wrapper_contents1{
	position: relative;

		width: 95%;
padding:15% 0px;
	height:auto;
	margin:0 auto;
}
.title_contents1{
	width: 40%;
	padding:0% 0px 8%;
	display: inline-block;
}

.copy_wrapper_contents1{
	max-width: 700px;
	width:85%;
	height:auto;
	padding-top:35%;
	position: relative;
}
.copy1_contents1{
	position: absolute;
	width: 18%;
	top:0;
	left: 0;
		opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents1{
	position: absolute;
	width: 6.5%;
	top:15%;
	left:22.1%;
	opacity: 0;
		 animation-duration: 1.4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents1{
	position: absolute;
	width: 11%;
	top:6%;
	left:32.5%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents1{
	position: absolute;
	width: 5.5%;
	top:3%;
	left:47%;
	opacity: 0;
			 animation-duration: 2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents1{
	position: absolute;
	width: 8.6%;
	top:11%;
	left:57%;
	opacity: 0;
			 animation-duration:1.9s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents1{
	position: absolute;
	width: 13%;
	top:7%;
	left:69.5%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents1{
	position: absolute;
	width: 8.26%;
	top:15%;
	left:85%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents1{
	position: absolute;
	width: 2.26%;
	top:35%;
	right: 3%;
	opacity: 0;
			 animation-duration: 2.1s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents1{
	position: absolute;
	width: 18%;
bottom:0%;
	left:20%;
	opacity: 0;
			 animation-duration: 2.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents1{
	position: absolute;
	width: 12.6%;
	bottom:9%;
	left:42%;
	opacity: 0;
			 animation-duration: 1.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy11_contents1{
	position: absolute;
	width: 5.3%;
bottom:4%;
	left:62%;
	opacity: 0;
			 animation-duration: 2.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy12_contents1{
	position: absolute;
	width: 9.9%;
	bottom:9%;
	left:79%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy13_contents1{
	opacity: 0;
	position: absolute;
	width:3.9%;
	bottom:0%;
	left:92%;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}

.text_contents1{
	display: flex;
	  flex-direction: row-reverse;
	width: 100%;	
	margin-top:8%;

}
.text_contents1 p{

	display: inline-block;
			font-size:1em;
	line-height: 2.2;
	letter-spacing: 0em

}



/*--------------------contents2----------------------*/


#contents2{
	width: 100%;
	height: auto;
	position: relative;
}
.back_contents2{
	height: 150px;
  background-image: url(../img/top/contents2/back-img_sp.jpg);   
background-attachment:inherit;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.wrapper_contents2{
	position: relative;
	z-index: 1;
	background: #FFF;
	max-width: 1200px;
		width: 95%;
padding:15% 0px;
	height:auto;
	margin:0 auto;
	
}
.title_contents2{
	width: 40.7%;
	padding:0% 0px 8%;
	display: inline-block;
float: right;
}

.copy_wrapper_contents2{
	float: right;
	max-width: 700px;
	width: 85%;
	height:auto;
	padding-top: 35%;
	position: relative;
}
.copy1_contents2{
	position: absolute;
	width: 18%;
	top:0;
	left: 0;
	opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents2{
	position: absolute;
	width: 15%;
	top:18%;
	left:22.1%;
	opacity: 0;
		 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents2{
	position: absolute;
	width: 7%;
	top:10%;
	left:40%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents2{
	position: absolute;
	width: 11%;
	top:10%;
	left:52%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents2{
	position: absolute;
	width: 8.6%;
	top:15%;
	left:66%;
	opacity: 0;
			 animation-duration:2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents2{
	position: absolute;
	width: 3%;
	top:30%;
	left:77%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents2{
	position: absolute;
	width: 16%;
bottom:-2%;
	left:43%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents2{
	position: absolute;
	width: 15%;
bottom:-15%;
	left:64%;
	opacity: 0;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents2{
	position: absolute;
	width: 15%;
bottom:0%;
	left:83%;
	opacity: 0;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents2{
	position: absolute;
	width: 4%;
	bottom:-2%;
	right: -2%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.text_contents2{
	display:block;
	width: 100%;	
	margin-top:8%;

}
.text_contents2 p{

	display: inline-block;
			font-size:1em;
	line-height: 2.2;
	letter-spacing: 0em

}



/*--------------------contents3----------------------*/


#contents3{
	width: 100%;
	height: auto;
	position: relative;
}
.back_contents3{
	height: 150px;
  background-image: url(../img/top/contents3/back-img_sp.jpg);   
	background-attachment:inherit;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.wrapper_contents3{
	position: relative;
	z-index: 1;
	background: #FFF;
	max-width: 1200px;
		width: 95%;
padding:15% 0px;
	height:auto;
	margin:0 auto;
}
.title_contents3{
	width: 41.7%;
	padding:0% 0px 8%;
	display: inline-block;
}

.copy_wrapper_contents3{

	width: 120%;
	height:auto;
	padding-top: 32%;
	position: relative;
}
.copy1_contents3{
	position: absolute;
	width: 8%;
	top: 3%;
	left: 0;
		opacity: 0;
	 animation-duration: 2.4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents3{
	position: absolute;
	width: 2%;
	top:37%;
	left:10.1%;
	opacity: 0;
		 animation-duration: 1.4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents3{
	position: absolute;
	width: 8.5%;
	top:0%;
	left:13.5%;
	opacity: 0;
			 animation-duration: 4.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents3{
	position: absolute;
	width: 2%;
	top:28%;
	left:24%;
	opacity: 0;
			 animation-duration: 1.6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents3{
	position: absolute;
	width: 7.6%;
	top:9%;
	left:29%;
	opacity: 0;
			 animation-duration:3s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents3{
	position: absolute;
	width: 8.5%;
	top:3%;
	left:38.5%;
	opacity: 0;
			 animation-duration: 4.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents3{
	position: absolute;
	width: 7.5%;
	top:14%;
	left:49.5%;
	opacity: 0;
			 animation-duration: 3.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents3{
	position: absolute;
	width: 7%;
	top:14%;
	left:59.5%;
	opacity: 0;
			 animation-duration: 5.1s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents3{
	position: absolute;
	width: 2%;
	top:37%;
	left:68%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents3{
	position: absolute;
	width: 6.6%;
	bottom:4%;
	left:0%;
	opacity: 0;
			 animation-duration: 2.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy11_contents3{
	position: absolute;
	width: 6.3%;
bottom:-1%;
	left:8%;
	opacity: 0;
			 animation-duration: 3.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy12_contents3{
	position: absolute;
	width: 4.9%;
	bottom:8%;
	left:17%;
	opacity: 0;
			 animation-duration:2.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy13_contents3{
	opacity: 0;
	position: absolute;
	width:10.9%;
	bottom:-4%;
	left:25%;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy14_contents3{
	opacity: 0;
	position: absolute;
	width:7.9%;
	bottom:-1%;
	left:38%;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy15_contents3{
	opacity: 0;
	position: absolute;
	width:2.9%;
	bottom:10%;
	left:49%;
			 animation-duration: 4.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy16_contents3{
	opacity: 0;
	position: absolute;
	width:5.9%;
	bottom:0%;
	left:55%;
			 animation-duration: 6.2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy17_contents3{
	opacity: 0;
	position: absolute;
	width:5.9%;
	bottom:0%;
	left:64%;
			 animation-duration: 1.8s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy18_contents3{
	opacity: 0;
	position: absolute;
	width:3.9%;
	bottom:8%;
	left:72%;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy19_contents3{
	opacity: 0;
	position: absolute;
	width:2%;
	bottom:0%;
	left:79%;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.text_contents3{
		display: inline-block;	
	margin-top:8%;
float: right;
}
.text_contents3 p{


	font-size:1em;
	line-height: 2.2;
	letter-spacing: 0em;


}
.text2{
		margin-bottom:20px;
}



/*--------------------contents4----------------------*/


#contents4{
	width: 100%;
	height: auto;
	position: relative;
	padding-bottom: 5%
}
.back_contents4{
	height: 150px;
  background-image: url(../img/top/contents4/back-img_sp.jpg);   
background-attachment:inherit;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

}
.wrapper_contents4{
	position: relative;
	z-index: 1;
	background: #FFF;
	max-width: 1200px;
		width: 95%;
padding:15% 0px;
	height:auto;
	margin:0 auto;
	
}
.title_contents4{
	width: 45.7%;
	padding:0% 0px 8%;
	display: inline-block;
float: right;
}





.copy_wrapper_contents4{
	float: right;

	width: 95%;
	height:auto;
	padding-top: 30%;
	position: relative;
}
.copy1_contents4{
	position: absolute;
	width: 14%;
	top:0%;
	left: 0;
	opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy2_contents4{
	position: absolute;
	width: 13%;
	top:-5%;
	left:17.1%;
	opacity: 0;
		 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy3_contents4{
	position: absolute;
	width: 5%;
	top:18%;
	left:33%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy4_contents4{
	position: absolute;
	width: 10%;
	top:6%;
	left:42%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy5_contents4{
	position: absolute;
	width: 3.6%;
	top:2%;
	left:56%;
	opacity: 0;
			 animation-duration:2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy6_contents4{
	position: absolute;
	width: 8%;
	top:11%;
	left:64%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy7_contents4{
	position: absolute;
	width: 8%;
top:10%;
	left:75.5%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy8_contents4{
	position: absolute;
	width: 5%;
top:4%;
	left:86.5%;
	opacity: 0;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy9_contents4{
	position: absolute;
	width: 2%;
top:25%;
	left:95%;
	opacity: 0;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy10_contents4{
	position: absolute;
	width: 11%;
	bottom:0%;
	left: 2%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}

.copy11_contents4{
	position: absolute;
	width: 3%;
	bottom:6%;
	left: 17%;
	opacity: 0;
	 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy12_contents4{
	position: absolute;
	width: 6%;
	bottom:4%;
	left:23.1%;
	opacity: 0;
		 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy13_contents4{
	position: absolute;
	width: 6%;
	bottom:7%;;
	left:32%;
	opacity: 0;
			 animation-duration: 1.7s;/* アニメーション時間 */
  animation-iteration-count:1;
}


.copy14_contents4{
	position: absolute;
	width: 6%;
	bottom:3%;
	left:40.5%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy15_contents4{
	position: absolute;
	width: 5%;
	bottom:3%;
	left:49%;
	opacity: 0;
			 animation-duration:2.5s;/* アニメーション時間 */
  animation-iteration-count:1;
}.copy16_contents4{
	position: absolute;
	width: 11%;
	bottom:3%;
	left:57%;
	opacity: 0;
			 animation-duration: 3s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy17_contents4{
	position: absolute;
	width: 4%;
bottom:5%;
	left:72%;
	opacity: 0;
			 animation-duration: 4s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy18_contents4{
	position: absolute;
	width: 6%;
bottom:5%;
	left:80%;
	opacity: 0;
			 animation-duration: 6s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy19_contents4{
	position: absolute;
	width: 8.5%;
bottom:0%;
	left:89%;
	opacity: 0;
			 animation-duration: 5s;/* アニメーション時間 */
  animation-iteration-count:1;
}
.copy20_contents4{
	position: absolute;
	width: 2%;
	bottom:3%;
	right: -1%;
	opacity: 0;
			 animation-duration: 2s;/* アニメーション時間 */
  animation-iteration-count:1;
}

.float{
	float: right;
}



.text_contents4{
	display:block;
	width: 100%;	
	margin-top:8%;

}
.text_contents4 p{

	display: inline-block;
			font-size:1em;
	line-height: 2.2;
	letter-spacing: 0em

}
	
	.wrapper_contents4 .float{
	margin-top: 20px;
}
	
	
	
	
	
	
}


