@charset "utf-8";

:root {

}

@media (prefers-color-scheme: dark) {
	:root {

	}
}

/* モバイル　ALL */
@media screen and (max-width: 425px) {
	:root {

		/* カード */
		--Fee_Card_Inner_flex-basis: calc( calc( 100% - calc( var(--Gap) * 0 ) ) / 1 );

	}
}

/* タブレット */
@media screen and (min-width:426px) and (max-width: 768px) {
	:root {

		/* カード */
		--Fee_Card_Inner_flex-basis: calc( calc( 100% - calc( var(--Gap) * 1 ) ) / 2 );

	}
}

/* ノートパソコン */
@media screen and (min-width:769px) and ( max-width:1024px) {
	:root {

		/* カード */
		--Fee_Card_Inner_flex-basis: calc( calc( 100% - calc( var(--Gap) * 2 ) ) / 3 );

	}
}

/* ノートパソコン L */
@media screen and (min-width:1025px) and ( max-width:1440px) {
	:root {

		/* カード */
		--Fee_Card_Inner_flex-basis: calc( calc( 100% - calc( var(--Gap) * 3 ) ) / 4 );

	}
}

/* 2K以上 */
@media screen and (min-width:1441px) and ( max-width:2560px) {
	:root {

		/* カード */
		--Fee_Card_Inner_flex-basis: calc( calc( 100% - calc( var(--Gap) * 3 ) ) / 4 );

	}
}


/* 4K以上 */
@media screen and (min-width:2561px) {
	:root {

		/* カード */
		--Fee_Card_Inner_flex-basis: calc( calc( 100% - calc( var(--Gap) * 3 ) ) / 4 );

	}
}








/* ーーーーーーーーーーーーーーーーーーーー
   ガイド
ーーーーーーーーーーーーーーーーーーーー */

section#contents.fee {
	& .main_image {
		position: relative;
		height: var(--MainImage_height);
		background: url('https://ihubjpn.com/wp-content/uploads/header01.jpg');
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
		&  div {
			display: flex;
			justify-content: flex-start;
			align-items: center;
			padding: var(--MainImage_Div_padding);
			width: 100%;
			height: 100%;
			color: var(--Color_FF100);
			font-size: var(--Size_12);
			background: var(--Color_1D080);
		}
	}
}

section#contents.fee {
	& .wrap {
		& h2 {
			
		}
		& p.read {
			padding: 0 0 var(--Size_24);
			text-align: center;
		}
	}
}





/* ーーーーーーーーーーーーーーーーーーーー
料金表
カードタイプ
ーーーーーーーーーーーーーーーーーーーー */


section#contents.fee {
	& .wrap {
		& div#card {
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			gap: var(--Size_12);
			& div.inner {
				flex-basis: var(--Fee_Card_Inner_flex-basis);
				display: flex;
				flex-direction: column;
				background: var(--Color_FF100);
				border-radius: var(--Border-radius_S);
				box-shadow: 0 var(--Size_01) var(--Size_04) 0 var(--Color_1D020);
				overflow: hidden;
				& figure {
					padding: var(--Size_24) var(--Size_06);
					background: url('https://ihubjpn.com/wp-content/uploads/header01.jpg');
					background-repeat: no-repeat;
					background-size: cover;
					background-position: center center;
					& .caption {
						text-align: center;
						font-size: var(--Size_08);
						color: var(--Color_FF100);
					}
					& .title {
						display: flex;
						justify-content: center;
						align-items: baseline;
						gap: var(--Size_02);
						color: var(--Color_FF100);
						& em {
							font-size: var(--Size_10);
							font-weight: 600;
						}
						& strong {
							font-size: var(--Size_12);
							font-weight: 600;
						}
					}
				}
				& dl {
					display: flex;
					flex-wrap: wrap;
					align-items: baseline;
					margin: var(--Size_06) var(--Size_06) 0;
					padding: 0 0 var(--Size_06);
					border-bottom: 1px var(--Color_A040) solid;
					& dt {
						flex-basis: var(--Size_40);
						font-size: var(--Size_08);
					}
					& dd {
						flex: 1;
						text-align: right;
						font-size: var(--Size_10);
					}
				}
				& .text {
					margin: var(--Size_04) 0 0;
					padding: var(--Size_06) var(--Size_06) 0;
					font-size: var(--Size_08);
				}
				& .week {
					display: flex;
					flex-wrap: wrap;
					gap: var(--Size_03);
					padding: var(--Size_06);
					& em {
						display: flex;
						padding: var(--Size_03) var(--Size_04);
						font-size: var(--Size_06);
						line-height: 1;
						border-radius: var(--Border-radius_L);
					}
					& .yes {
							color: var(--Color_FF100);
							background: var(--Color_1D100);
					}
					& .no {
							color: var(--Color_FF100);
							background: var(--Color_1D020);
					}
				}
			}
		}
	}
}













/* ーーーーーーーーーーーーーーーーーーーー
	注意事項
ーーーーーーーーーーーーーーーーーーーー */

section#contents.fee ul {
	display: flex;
	flex-wrap: wrap;
	flex-direction: var(--Flex-direction_CRRRRR);
	gap: var(--Size_12);
	margin: 0 0 var(--Size_36);
	padding: 0;
	list-style: none;
}

section#contents.fee ul li {
	flex-basis: calc( calc( 100% - var(--Size_12) ) / 2 );
	display: flex;
	align-items: center;
	gap: var(--Size_06);
	padding: var(--Size_03);
	background: var(--Color_G020);
	border-radius: var(--Border-radius_S);
}

section#contents.fee ul li figure {
	width: var(--Size_24);
}

section#contents.fee ul li figure img {
	border-radius: var(--Border-radius_L);
}

section#contents.fee ul li em {
	flex: 1;
	color: var(--Color_1D100);
	font-size: var(--Size_08);
	line-height: 1.4;
}