@charset "utf-8";

@media screen and (max-width: 767px) {
  .page_inner  ul li a{
		padding: 2rem 5%;
	}
}

.content{
	width: var(--wid-1024);
	margin: auto;
	padding: 6rem 0 0;

	.common_title{
		display: flex;
		gap: 2rem;
		align-items: center;
		flex-direction: row;
		white-space: nowrap;
		&::after{
			content: "";
			height: 1px;
			width: 100%;
		}
	}
	.number:nth-of-type(odd){
		color: var(--main-color);
		.common_title::after{
			border: 1px solid var(--main-color);
		}
	}
	.number:nth-of-type(even){
		color: #00add9;
		.common_title::after{border: 1px solid #00add9;}
		.common_title .en_title{color: #00add9;}
	}
}
.number{
	margin-bottom: 8rem;
  @media screen and (max-width: 767px) {
    margin-bottom: 6rem;
  }
}


@media screen and (max-width: 1279px){
	.content{
		margin-top: 3rem;
		padding: 0;
		.box{
			height: auto;

			.common_title{
				.en_title{
					font-size: 4rem;
				}
				text-align: center;
			}
		}
	}
}

/* 共通 */
.content{
	.title01{
		font-size: 2.4rem;
		font-weight: 700;
		color: #000;
		margin-bottom: 2rem;
	}
	.common_title{
		margin-bottom: 5rem;
	}
	.title02{
		font-size: 2rem;
		font-weight: 700;
		color: #000;
	}
	.size01{
		font-size: 14.8rem;
		font-weight: 400;
		line-height: 1;
		font-family: var(--font-en);
		span {
			font-size: 2rem;
			font-weight: 700;
			&.black{
				color: #000;
			}
		}
	}
	.size02{
		font-size: 13rem;
		font-weight: 400;
		line-height: 1;
		font-family: var(--font-en);
		span {
			font-size: 2rem;
      font-weight: 700;
			.black{
				color: #000;
			}
		}
	}
	.size03{
		font-size: 20.1rem;
		font-weight: 400;
		line-height: 1;
		font-family: var(--font-en);
		span{
			font-size: 2rem;
			&.black{
				color: #000;
			}
		}
	}

	.num_box--sm{
		display: flex;
		gap: 3.5rem;
		justify-content: space-between;
	}
}
@media screen and (max-width: 767px){
	.content{
		.title01{
			font-size: 1.6rem;
			margin-bottom: 0rem;
		}
		.common_title{
			flex-direction: column;
			gap: 2.5rem;
			line-height: .5;
			margin-bottom: 2rem;
		}
		.title02{
			font-size: 1.4rem;
			font-weight: 700;
			color: #000;
		}
		.size01{
			font-size: 4.8rem;
			font-weight: 400;
			line-height: 1;
			font-family: var(--font-en);
			span{
				font-size: 1.6rem;
				font-weight: 700;
				&.black{
					color: #000;
				}
			}
		}
		.size02{
			font-size: 6rem;
			margin: auto;
		}
		.size03{
			font-size: 10rem;
		}
	}
}

/* ブロック1 */
.num01{
	display: flex;
	border-bottom: 1px solid var(--main-color);
	.num_box:nth-child(1){
		border-right: 1px solid var(--main-color);
	}
	.num_box:nth-child(2){
		padding-left: 6rem;
	}
	.num_box{
		width: 50%;
		margin-bottom: 3.5rem;
		position: relative;
	}
	.aicon{
		position: absolute;
		right: 6rem;
		top: -5rem;
	}

	.nute_box{
		display: flex;
		gap: 5rem;
	}
}
@media screen and (max-width: 767px){
	.num01{
		.num_box:nth-child(1){
			padding-bottom: 2rem;
		}
		.num_box:nth-child(2){
			padding-left: 2rem;
		}
		.num_box{
			width: 100%;
			margin-bottom: 1rem;
		}
	}
}


/* ブロック2 */
.num02{
	display: flex;
	gap: 9rem;
	border-bottom: 1px solid var(--main-color);
	padding: 5rem 0;
	.num_p{
		display: flex;
		align-items: center;
		justify-content: center;
		width: calc(100% - 20%);
	}
	.num_p{
		display: flex;
		gap: 6rem;
	}
  @media screen and (max-width: 767px) {
    flex-direction: column;
		gap: 2rem;
		padding: 2rem 0;
		position: relative;
		.aicon {
			position: absolute;
			right: 0;
			width: 15%;
      max-width: 60px;
			top: 2rem;
		}
		.num_p {
			width: 100%;
		}
		.num_p {
			gap: 5rem;
		}
    .num_box--sm {
      justify-content: center;
      gap: calc(5rem + 9px);
    }
  }
}


/* ブロック3 */
.num03{
	display: flex;
	align-items: center;
	border-bottom: 1px solid var(--main-color);
	padding: 5rem 0;
	.num_boxth{
		position: relative;
		width: 50%;
		&:nth-child(1){
			border-right: 1px solid var(--main-color);
			padding: 0 3rem 0 0;
			margin-right: 3rem;
		}
	}
	.aicon{
		position: absolute;
		right: 3rem;
		top: 0;
	}

	.size02{
		padding-left: 2rem;
	}
}
@media screen and (max-width: 767px){
	.num03{
		padding: 2rem 0;
		flex-direction: column;
		.num_boxth{
			width: 100%;
			&:nth-child(1){
				border-bottom: 1px solid var(--main-color);
				border-right: 0;
				padding: 0;
				padding-bottom: 2rem;
				margin-right: 0rem;
			}
			&:nth-child(2){
				padding-top: 2rem;
			}
		}
		.num_box--sm{
			justify-content: center;
		}
		.aicon{
			width: 10%;
		}
	}
}

/* ブロック4 */
.num04{
	display: flex;
	border-bottom: 1px solid #00add9;
	padding-top: 5rem;
	.num_box:nth-child(1){
		border-right: 1px solid #00add9;
	}
	.num_box:nth-child(2){
		padding-left: 6rem;
	}
	.num_box{
		width: 50%;
		margin-bottom: 3.5rem;
		position: relative;
	}
	.aicon{
		position: absolute;
		right: 6rem;
		top: -5rem;
	}

	.nute_box{
		display: flex;
		gap: 3em;
	}
}
@media screen and (max-width: 767px){
	.num04{
		flex-direction: column;
		padding-top: 0rem;
		.num_box{
			width: 100%;
			margin-bottom: 2rem;
			position: relative;

			&:nth-child(1){
				border-bottom: 1px solid #00add9;
				border-right: 0;
				padding-bottom: 2rem;
				/* padding-top: 6rem; */
				.size01{
					text-align: center;
				}
			}
		}
		.aicon{
			width: 15%;
      max-width: 60px;
			top: 0;
      right: 0;
		}
		.num_box:nth-child(2){
			padding-left: 0;
		}
		.nute_box{
			justify-content: center;
			padding-top: 2rem;
		}
	}
}

/* ブロック5 */
.num05{
	display: flex;
	border-bottom: 1px solid #00add9;
	padding: 5rem 0;
	.num_box:nth-child(1){
		border-right: 1px solid #00add9;
	}
	.num_box:nth-child(2){
		padding-left: 6rem;
	}
	.num_box{
		width: 50%;
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.aicon{
		position: absolute;
		right: 6rem;
		top: -0rem;
	}
}
@media screen and (max-width: 767px){
	.num05{
		padding: 3rem 0 2rem;
		.aicon{
      width: 22%;
      top: -1.5rem;
      right: 1rem;
		}
		.num_box:nth-child(2){
			padding-left: 2rem;
		}
	}
}

/* ブロック6 */
.num06{
	display: flex;
	border-bottom: 1px solid #00add9;
	padding: 5rem 0;
	.num_box:nth-child(1){
		border-right: 1px solid #00add9;
	}
	.num_box:nth-child(2){
		padding-left: 6rem;
	}
	.num_box{
		width: 50%;
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		
		.flex{
			align-items: start;
			line-height: 1;
			display: flex;justify-content: space-between;

			.black{
				position: relative;
				top: 2rem;
			}
		}
	}
	.aicon{
		position: absolute;
		right: 6rem;
		top: -0rem;
	}
}
@media screen and (max-width: 767px){
	.num06{
		padding: 2rem 0;
		flex-direction: column;
		.num_box{
			width: 100%;
			.flex{
				justify-content: center;
				gap: 1rem;
			}
		}
		.num_box:nth-child(1){
			border-right: 0px;
			border-bottom: 1px solid #00add9;
			padding-bottom: 2rem;
			.size01{
				text-align: center;
			}
		}
		.num_box:nth-child(2){
			padding-left: 0;
			padding-top: 2rem;
		}
	}
}

/* ブロック7 */
.num07{
	display: flex;
	border-bottom: 1px solid #00add9;
	padding: 5rem 0;
	.num_box:nth-child(1),
	.num_box:nth-child(2){
		border-right: 1px solid #00add9;
	}
	.num_box:nth-child(2),
	.num_box:nth-child(3){
		padding-left: 6rem;
	}
	.num_box{
		width: 50%;
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
}
@media screen and (max-width: 767px){
	.num07{
		padding: 2rem 0;
		flex-wrap: wrap;
		.num_box{
			width: 50%;
			align-items: center;
		}
		.num_box:nth-child(1),
		.num_box:nth-child(2){
			border-right: 0px;
			border-bottom: 1px solid #00add9;
			padding-bottom: 2rem;
		}
		.num_box:nth-child(2),
		.num_box:nth-child(3){
			padding-left: 0rem;
		}
		.num_box:last-of-type{
			padding-top: 2rem;
		}
	}
}

/* ブロック8 */
.num08{
	display: flex;
	border-bottom: 1px solid var(--main-color);
	padding: 0 0 5rem;
	.num_box:nth-child(1){
		border-right: 1px solid var(--main-color);
		width: 30%;
	}
	.num_box:nth-child(2){
		padding-left: 6rem;
		width: 70%;

		.size01{
			padding-left: 2rem;
		}
	}
	.num_box{
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

		.size01{
			position: relative;
		}
		.aicon{
			position: absolute;
			right: 12rem;
			top: 1.5rem;
		}
	}
}
@media screen and (max-width: 767px){
	.num08{
		padding-bottom: 2rem;
		.num_box:nth-child(1){
			width: 50%;
			align-items: center;
		}
		.num_box{
			.aicon{
				width: 50px;
				right: 0;
				top: -3rem;
			}
		}
		.num_box:nth-child(2){
			padding-left: 2rem;
			width: 50%;

			.size01{
				padding-left: 0rem;
			}
		}
	}
}


/* ブロック9 */
.num09{
	display: flex;
	border-bottom: 1px solid var(--main-color);
	padding: 5rem 0;
	.num_box:nth-child(1){
		border-right: 1px solid var(--main-color);
		width: 30%;
	}
	.num_box:nth-child(2){
		padding-left: 6rem;
		width: 70%;
	}
	.num_box{
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.num_boxcg{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.flex{
		display: flex;
		gap: 2rem;
	}
}
@media screen and (max-width: 767px){
	.num09{
		padding: 2rem 0;
		flex-direction: column;
		.num_box:nth-child(1){
			border-right: 0px;
			border-bottom: 1px solid var(--main-color);
			width: 100%;
			align-items: center;
			padding-bottom: 2rem;
		}
		.num_box:nth-child(2){
			padding-left: 0rem;
			width: 100%;
			padding-top: 3rem;
		}
		.flex{
			gap: 2rem;
		}
		.aicon{
			position: absolute;
			width: 15%;
			top: 2rem;
			right: 2rem;
		}
	}
}


/* ブロック10 */
.num10{
	border-bottom: 1px solid var(--main-color);
	padding: 5rem 0;

	.num_boxcg{
		img{
			position: relative;
			left: 4rem;
		}
	}

	.flex{
		display: flex;
		gap: 6rem;
		justify-content: space-between;
	}
}
@media screen and (max-width: 767px){
	.num10{
		position: relative;
		padding: 2rem 0;
		.flex{
			flex-wrap: wrap;
			gap: 2rem;
		}
		.num_boxcg{
			width: calc(50% - 1rem);
			text-align: center;
			img{
				position: absolute;
				left: 15%;
				top: 5rem;
				width: 60px;
			}
		}
	}
}


/* ブロック11 */
.num11{
	border-bottom: 1px solid var(--main-color);
	padding: 5rem 0;
	position: relative;

	.flex{
		display: flex;
		gap: 6rem;
		justify-content: space-between;
	}

	.aicon{
		position: absolute;
		right: 5rem;
		top: 3rem;
	}
}
@media screen and (max-width: 767px){
	.num11{
		.flex{
			display: flex;
			gap: 2rem;
			flex-wrap: wrap;
			margin-top: 2rem;
		}
		.num_boxcg{
			width: calc(50% - 1rem);
			display: flex;
			flex-direction: column;
		}
	}
}


/* ブロック12 */
.num12{
	border-bottom: 1px solid var(--main-color);
	padding: 5rem 0;

	.flex{
		display: flex;
		justify-content: space-between;
		gap: 6rem;

	}
}
@media screen and (max-width: 767px){
	.num12{
		padding: 2rem 0;
		.flex{
			display: flex;
			justify-content: center;
			gap: 2rem;
			flex-wrap: wrap;
			margin-top: 2rem;
		}
		.num_boxcg{
			width: calc(50% - 1rem);
			display: flex;
			flex-direction: column;
		}
	}
}

/* ブロック13 */
.num13{
	display: flex;
	align-items: center;
	border-bottom: 1px solid #00add9;
	padding-bottom: 5rem;

	.num_boxth{
		position: relative;
		width: 50%;
		display: flex;
		flex-direction: column;
		&:nth-child(1){
			border-right: 1px solid #00add9;
			padding: 0 3rem 0 0;
			margin-right: 3rem;
		}
	}
	.num_box{
		width: 50%;
		position: relative;
	}

	.size02{
		padding-left: 2rem;
	}
	.aicon{
		position: absolute;
		right: 6rem;
		top: -4rem;
	}	
}
@media screen and (max-width: 767px){
	.num13{
		padding: 2rem 0;
		flex-direction: column;
		.num_boxth{
			width: 100%;
			&:nth-child(1){
				border-right: 0px;
				border-bottom: 1px solid #00add9;
				padding: 0 0rem 2rem 0;
				margin-right: 0rem;
			}
		}
		.num_box{
			padding-top: 2rem;
			width: calc(50% - 1rem);
			display: flex;
			flex-direction: column;
			&:nth-last-of-type(1){
				width: 100%;
				.size03{
					margin: auto;
				}
			}
			.aicon{
				width: 18%;
				right: 2rem;
				top: 2rem;
			}
		}
		.num_box--sm{
			justify-content: center;
			gap: 2rem;
		}
	}
}

.box01{
	padding: 8rem 0;
	color: #000;
	border-bottom: 1px solid #00add9;

	p{
		text-align: center;
		font-size: 2.4rem;
		padding-bottom: 2rem;
		font-weight: 700;
	}

	ul{
		display: flex;
		gap: 20px;
		flex-wrap: wrap;

		li{
			height: 111px;
			padding: 0 6rem;
			background: rgba(0, 173, 217, .2);
			font-size: 2.8rem;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			text-align: center;
			font-weight: 700;
			line-height: 1.5;
			&:nth-child(even){
				margin-left: auto;
			}
		}
	}
}
@media screen and (max-width: 767px){
	.box01{
		padding: 4rem 0;
		ul{
		gap: 10px;

		li{
			width: 100%;
			font-size: 1.6rem;
			padding: 2rem 5%;
			height: auto;
			}
		}
	}
}

.box02{
	padding-top: 8rem;
	color: #000;

	p{
		text-align: center;
		font-size: 2.4rem;
		padding-bottom: 2rem;
		font-weight: 700;
	}

	ul{
		display: flex;
		gap: 20px;
		flex-wrap: wrap;
		justify-content: center;

		li{
			background: rgba(0, 173, 217, .2);
			height: 213px;
			width: 296px;
			font-size: 2.8rem;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			text-align: center;
			font-weight: 700;
			line-height: 1.5;
		}
	}
}
@media screen and (max-width: 767px){
	.box02{
		padding-top: 4rem;
		ul{
		gap: 10px;

		li{
				max-width: calc(50% - 10px);
				width: 190px;
				height: auto;
				font-size: 1.8rem;
				padding: 2rem 3%;
			}
		}
	}
}

.num-center {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.num-centerUnit {
  transform: translate(10px, -15px);
  @media screen and (max-width: 767px) {
    transform: translate(5px, -5px);
  }
}

@media screen and (max-width: 767px) {
  .num02-add.num02 {
    .num_box--sm {
      justify-content: center;
      gap: 2rem;
    }
    .size01 {font-size: 5.5rem;}
    .aicon {
      height: 72px;
      aspect-ratio: 70 / 112;
    }
  }
}