@charset "utf-8";

/*-------------------------------
	横並び要素
-------------------------------*/
/*--------コンテンツ幅内　2列基本----------*/
.flex02__block{
	width: 100%;
	display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
	gap: 8rem;
}
	.flex02__block.reverse{ /*-逆*/
		flex-direction: row-reverse;
	}
.flex02__item{
	width: calc((100% - 8rem) / 2);
		min-width: 40rem;
}
/*--------コンテンツ幅内　2列基本----------*/
/*--------コンテンツ幅内　3列基本----------*/
.flex03__block{
	width: 100%;
	display: flex;
		align-items: flex-start;
		justify-content: center;
		flex-wrap: wrap;
	gap: 2rem;
}
.flex03__item{
	width: calc((100% - (2rem * 2)) / 3);
		min-width: 28rem;
}
	/*---最後の行左寄せ
	.flex03__block.flex03__lastLeft{ 
		justify-content: space-between;
	}
		.flex03__block.flex03__lastLeft::after{
			width: calc((100% - (2rem * 2)) / 3);
			content:"";
			display: block;
		}--*/
/*--------コンテンツ幅内　3列基本----------*/
/*--------インナーflex　HTML＝txtbox→imgbox----------*/
.inner_flex__block{ 
	display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
}
	.inner_flex__item{

	}

/*--------インナーflex　HTML＝txtbox→imgbox----------*/
/*--------横にはみ出るflex----------*/
.P-wideout_flex__block{
	display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
}	
	.P-wideout_flex__txtbox {
		width: 50%;
		flex: 0 0 59.4rem;
	}
	.P-wideout_flex__imgbox { /*---画像が左*/
		width: calc(100vw / 2);
		flex: 1;
			margin-right: calc(50% - 50vw);
		display: block;
	}
	.P-wideout_flex__img{
		width: 100%;
		height: 100%;
			border-radius: 2rem 0 0 2rem;
		display: block;
		overflow: hidden;
	}
	/*----------リバース----*/
	.P-wideout_flex__block.reverse{/*---画像が右*/
		flex-direction: row-reverse;
	}		
		.P-wideout_flex__block.reverse .P-wideout_flex__imgbox {/*---画像が右*/
					margin-right: unset;
				margin-left: calc(50% - 50vw);
		}		
		.P-wideout_flex__block.reverse .P-wideout_flex__img{
			width: 100%;
			height: 100%;
				border-radius: 0 2rem 2rem 0;
		}
/*--------横にはみ出るflex----------*/

@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){
	/*---最後の行左寄せ
	.flex03__block.flex03__lastLeft{ 
		justify-content: space-between;
	}
		.flex03__block.flex03__lastLeft::after{
			content:"";
			display: block;
		}--*/
}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){
	/*--------コンテンツ幅内　2列基本----------*/
	.flex02__block{	
		gap: 10rem;
	}
	.flex02__block,
	.flex02__block.reverse{
		flex-direction: column;
	}
	.flex02__item{
		width: 100%;
			min-width: unset;
	}
	/*--------コンテンツ幅内　2列基本----------*/
}

@media screen and (max-width:768px){
	/*--------コンテンツ幅内　2列基本----------*/
	.flex02__block{	
		gap: 10rem;
	}
	.flex02__block,
	.flex02__block.reverse{
		flex-direction: column;
	}
	.flex02__item{
		width: 100%;
			min-width: unset;
	}
	/*--------コンテンツ幅内　2列基本----------*/
	/*--------コンテンツ幅内　3列基本----------*/
	.flex03__block{
		gap: 3rem;
	}
	.flex03__item{
		width: calc((100% - (2rem * 2)) / 3);
			min-width: 28rem;
	}
		.flex03__block.sp02__item{ /*---SP時 2アイテム*/
			width: calc((100% - 3rem) / 2);
		}
	/*--------コンテンツ幅内　3列基本----------*/
	
	/*--------インナーflex　HTML＝txtbox→imgbox----------*/
	
	/*--------インナーflex　HTML＝txtbox→imgbox----------*/

	/*--------横にはみ出るflex----------*/
	.P-wideout_flex__block,
	.P-wideout_flex__block.reverse{ 
		flex-direction: column; 
		gap: 8rem;
	}	
		.P-wideout_flex__txtbox {
			width: 100%;
			flex: unset;
		}
		.P-wideout_flex__imgbox {
			/* width: 100vw;
			flex: 1;
				margin-right: calc(100% - 100vw); */
				width: calc(100% + var(--padding-leftright));
				flex: 1;
				margin-right: 0;
		}
		.P-wideout_flex__img{
				border-radius: 5rem 0 0 5rem;
		}
		.P-wideout_flex__img{
			width: 100%;
		}
		/*----------リバース----*/
			/* .P-wideout_flex__block.reverse .P-wideout_flex__imgbox {
						margin-right: unset;
						margin-left: calc(100% - 100vw);
			} */
			.P-wideout_flex__block.reverse .P-wideout_flex__img{
						border-radius: 0 5rem 5rem 0;
			}
	/*--------横にはみ出るflex----------*/
}


/*-------------------------------
	背景上部カット &
	Scrollhint__table
-------------------------------*/
/*--------------Scrollhint__table---*/
.bg-radiusCut{
	position: relative;
	z-index: 1000;
}
	.bg-radiusCut::before{
		width: 100%;
		height: 100%;
			border-top-left-radius: 5rem;
			border-top-right-radius: 5rem;
		position: absolute;
			left: 0;
			top: 0;
		display: block;
		content: "";
		z-index: 2000;
	}
.bg-radiusCut .sec__inner{
	position: relative;
	z-index: 3000;
}

/*--------------bg-mirror---*/
.bg-mirror{
	position: relative;
	z-index: 1000;
}
	.bg-mirror::after{ 
		width: 100%;
		height: 90.8rem;
			border-top-left-radius: 5rem;
			border-top-right-radius: 5rem;
		position: absolute;
			left: 0;
			top: 0;
		display: block;
		content: "";
		z-index: 2500;
	}
.bg-mirror .sec__inner{
	position: relative;
	z-index: 3000;
}

@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){
	.Scrollhint__table{
		overflow-x: auto; 
		-webkit-overflow-scrolling: touch;  /* モバイル向け */
	}	
}


/*-------------------------------
	parts
-------------------------------*/
.font-grad{	/*テキストグラデーション*/
	font-family: var(--en_font1);
	background: var(--gradcolor);
		-webkit-background: var(--gradcolor);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
}
.sec_intro__txt{ /*------導入テキスト*/
	margin-bottom: 6.75rem; /*9rem;*/
	font-size: 1.8rem; /*2.4rem;*/
		letter-spacing: 0;
		font-weight: 500;
		text-align: center;
		line-height: calc(65 / 18); /*2.0833;*/
}
.C-mds__simple{
	margin-bottom: 1.5rem;
	font-size: 2.1rem; /*2.4rem;*/
		letter-spacing: 0;
		font-weight: 700;
		line-height: 1.3;
}

/*-----画像----*/
.photoimg__box{
	padding: 1rem;
	background: #fff;
}
@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){
	.sec_intro__txt{
		margin-bottom: 7.5rem;
		font-size: 3.2rem; /*2.4rem;*/
		text-align: left;
	}
	/*----------見出し---------*/
	.C-sub-title02{
		margin-bottom: 5.75rem;
		padding: 0.5em 1em;
		font-size: 3.4rem;
			letter-spacing: 0.05em;
	}
	.C-mds__simple{
		margin-bottom: 1.6rem;
		font-size: 3.2rem;
	}
}


/*-------------------------------
	○○
-------------------------------*/


@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}


/*-------------------------------
	○○
-------------------------------*/


@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}


/*-------------------------------
	○○
-------------------------------*/


@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}


/*-------------------------------
	○○
-------------------------------*/


@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}


/*-------------------------------
	○○
-------------------------------*/


@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}


/*-------------------------------
	○○
-------------------------------*/


@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}