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

.number{
	font-family: "Poppins", sans-serif;
	color: var(--color-base);
	font-weight: 500;
}
.flex_img_l .ttl,.flex_system .ttl{
	font-weight: 500;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

.flex_system{
	border-radius: 1rem;
	padding: 1.4rem;
	margin-bottom: 2rem;
		box-sizing: border-box;
		border: 1px solid var(--color-gray2);
	}

.number_list dl{
	background: var(--color-gray); }

.number_list dt{
	padding: 0.5rem 0;
	box-sizing: border-box;
	text-align: center;
	background: #ECECEC;
}
.number_list dd{
	text-align: center;
	padding: 1rem 0.5rem;
	box-sizing: border-box;
}

.flotation{position: relative;}

.flotation .main_frame{
	padding-top: 2rem;
	padding-bottom: calc(25vw + 5rem);
	background:var(--color-gray);
}
.flotation .list{
	margin-top: 1rem;}

	.flotation .list li{
		list-style-type: disc;
		list-style-position:inside;

	}


.flotation_midasi{
	color: var(--color-base);
	font-size: 1.4rem;
	margin-bottom: 0.6rem;
}


@keyframes infinity-scroll-left {
	from {
	  transform: translateX(0);
	}
	  to {
	  transform: translateX(-100%);
	}
}

.scroll-infinity__wrap {
bottom: 5rem;
left: 0;
width: 100vw;
position: absolute;
display: flex;
overflow: hidden;
}


.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}



.scroll-infinity__list li{
	margin-right: 2rem;
	border: 1px solid #f3f3f3;
	position: relative;
	overflow: hidden;
	width: 840px;
	height: 250px;
 padding: 500px 0 0;
	border-radius: 5rem;
	box-sizing: border-box;
}

.scroll-infinity__list li img{
	width: 100%;
	height: auto;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate3d(-50%, -50%, 0);
	transform: translate3d(-50%, -50%, 0);
}



.scroll-infinity__list--left {
  animation: infinity-scroll-left 400s infinite linear 0.01s both;
}
.scroll-infinity__item{
  width: calc(100vw / 6);
}
.scroll-infinity__item>img {
  width: 100%;
}




@media screen and (min-width: 790px) {
.flex_img_l .ttl{
	font-size: 1.8rem;
	margin-top: 0.8rem;
	margin-bottom: 0.8rem;
}
	
.flex_img_l{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
	.flex_img_l+.flex_img_l{
		margin-top: 5rem;
	}
.flex_img_l{
	flex-direction: row-reverse;
}
.flex_img_r .text,.flex_img_r .img,.flex_img_l .text,.flex_img_l .img{
	width: calc( 50% - 2rem );
}
	.flex_system_list{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.flex_system{
	border-radius: 1.5rem;
	padding: 3.5rem 2rem;
	margin-bottom: 4rem;
	width: calc( 50% - 2rem );
	}
	.flex_system .ttl{
		margin-top: 1rem;
		margin-bottom: 1rem;
	}
	
	.number_list{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.number_list dl{
		margin-bottom: 4rem;
		width: calc( 33% - 2rem );
	}
	.number_list dl:nth-child(5){
		width: calc( 66% - 2rem );
	}
	.number_list dl:nth-child(6){
		width: calc( 66% - 2rem );
	}
	/*.number_list dl:nth-child(6) img{
		max-width: 50%;
	}*/
	.number_list dd{
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 2rem;
		box-sizing: border-box;
	}
	
.flotation .main_frame{
		text-align: center;
	padding-top: 15rem;
	padding-bottom: 56rem;
	border-radius: 5rem;
	background-position: right center;
	background-repeat: no-repeat;
	background-size: contain;
		position: relative;
}
.flotation_midasi{
	width: 100%;
	text-align: center;
	position: absolute;
	top: -7rem;
	left: 0;
	font-size: 12rem;
	color: #fff;
}
	
	
	
.flotation .list{
		margin-left: auto;
		margin-right: auto;
		max-width: 500px;
		text-align: left;
		margin-bottom: 2rem;
	}
	
	.flotation .midasi_sabu{
	font-weight: 600;
    font-size: 5rem;}

}/*@media screen and (min-width: 790px)*/




@media screen and (max-width: 789px) {
.flex_img_l .img{
	text-align: center;
	margin-top: 1rem;
}
		.scroll-infinity__wrap{
		bottom: 3rem;
	}
	
	.scroll-infinity__list li{
	 width: 40vw;
    height: 27vw;
		padding: 0;
		border-radius: 2.5rem;
		box-sizing: border-box;
	}
	
	
	
	
}/*@media screen and (max-width: 789px) {*/