@charset "utf-8";
/*======================================
教材紹介
========================================*/
/*****
セット内容・金額
*****/
.num_ttl_area{
	font-size: clamp(1.8rem,2.8vw,2.8rem);
	margin-bottom: 1em;
}
.num_icon{
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	line-height: 1;
	color: var(--shadow_color);
	border-radius: 50%;
	background-color: #fff;
}
.num_ttl{
	text-align: center;
	color: #fff;
	border-radius: 4em 0 0 4em;
}

/***セット内容リスト***/
.list_ttl{
	font-size: clamp(1.7rem,2vw,2rem);
	font-weight: bold;
	text-align: center;
	margin: 2em 0 1em 0;
	padding: 0.5em;
}


.setlist_detail::before{
	content: '●';
	display: inline-block;
	margin-right: 0.25em;
}
.setlist_set{}

/*学習専用機「富士」手引き*/
.fuji_set_area{
	font-weight: bold;
}
.fuji_set_area li::before{
	content: '●';
	display: inline-block;
	color: var(--list_red);
	margin-right: 0.25em;
}

/*公式問題集*/
.koshiki_set_area{
	font-weight: bold;
}
.koshiki_set_area .setlist_detail::before{
	color: var(--list_blue);
}

/*文法・表現集*/
.bunpou_set_area{
	font-weight: bold;
}
.bunpou_set_area .setlist_detail::before{
	color: var(--list_green);
}

/*演習問題集*/
.ensyu_set_area{
	font-weight: bold;
}
.ensyu_set_area .setlist_detail::before{
	color: var(--list_pink);
}


/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	/*****
	セット内容・金額
	*****/
	.num_ttl_area{
		position: relative;
	}
	.num_icon{
		width: 2.6em;
		height: 2.6em;
		border: solid 3px var(--shadow_color);
		position: absolute;
		top: 0;
		left: 0;
	}
	.num_ttl{
		padding: 0.5em 0.5em 0.5em 2.6em;
		background-color: var(--shadow_color);
	}
	
	/***セット内容リスト***/
	.setlist_detail{
		flex-grow: 1;
		display: flex;
		align-items: center;
	}
	.setlist_detail::before{
		align-self: flex-start;
	}
	.setlist_detail::after{
		flex-grow: 1;
		content: '';
		display: block;
		width: auto;
		height: 1em;
		margin: 0 0.5em;
		background-image: radial-gradient(circle,#333 0,#333 25%,transparent 25%,transparent 100%);
		background-repeat: repeat-x;
		background-size: 0.5em 0.5em;
		background-position: 0 center;
	}
	.setlist_set{
		flex-shrink: 0;
		transform: translateY(-0.65em);
	}
	.setlist_set b{
		font-size: 1.5em;
	}
	
	.setlist2gyo .setlist_detail::after{
		transform: translateY(-0.65em);
	}
	
	
	/*学習専用機「富士」手引き*/
	.fuji_set_area{
		display: flex;
		justify-content: center;
	}
	.fuji_set_area li{
		margin-right: 2em;
	}
	.fuji_set_area li:last-of-type{
		margin-right: 0;
	}
	
	/*公式問題集*/
	.koshiki_set_area{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 0.5em;
	}
	
	/*文法・表現集*/
	.bunpou_set_area{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 0.5em;
	}
	
	/*演習問題集*/
	.ensyu_set_area{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 0.5em;
	}
}

/* スマホ----------------------------- */
@media (max-width: 767px){
	/*****
	セット内容・金額
	*****/
	.num_ttl_area{
		display: flex;
		align-items: center;
		padding-left: 0.5em;
		background-color: var(--shadow_color);
	}
	.num_icon{
		flex-shrink: 0;
		width: 1.5em;
		height: 1.5em;
	}
	.num_ttl{
		flex-grow: 1;
		padding: 0.5em;
	}
	
	/***セット内容リスト***/
	.setlist_detail{}
	.setlist_set{
		text-align: right;
	}
	.setlist_set b{
		font-size: 1.2em;
	}
	
	/*学習専用機「富士」手引き*/
	.fuji_set_area{}
	
	/*公式問題集*/
	.koshiki_set_area{
		margin-bottom: 1em;
	}
	
	/*文法・表現集*/
	.bunpou_set_area{
		margin-bottom: 1em;
	}
	
	/*演習問題集*/
	.ensyu_set_area{
		margin-bottom: 1em;
	}
}