@charset "utf-8";
/*======================================
カリキュラム
========================================*/
.box_section .curri_section:first-of-type{
	margin-top: 0;
}


.curri_ttl{
	font-size: clamp(1.7rem,2.6vw,2.6rem);
	text-align: center;
	margin: 2em 0 1em 0;
	padding: 0.5em;
}

.curri_area{}
.curri_set{
	margin-top: 1.5em;
}
.curri_img{
	text-align: center;
}
.curri_set_ttl{
	text-align: center;
	color: #fff;
	margin: 0.5em 0;
	padding: 0.25em 1em;
	border-radius: 2em;
	background-color: var(--red_color);
}
.curri_set_cap{
	font-size: 0.85em;
}

/*****
表組関連
*****/
.curri_tbl_wrap,
.curri_tbl_wrap3{
	margin-top: 2em;
}
.curri_tbl{
	width: 100%;
	border-top: solid 1px #333;
	border-left: solid 1px #333;
}
.curri_tbl td{
	text-align: center;
	width: 50%;
	padding: 0.5em;
	border-bottom: solid 1px #333;
	border-right: solid 1px #333;
}

.curri_tbl_ttl{
	font-weight: bold;
	color: #fff;
}

.bg_n5{
	background-color: #0068b7;
}
.bg_n5_l{
	background-color: #eaecf5;
}
.bg_n4{
	background-color: #008e5c;
}
.bg_n4_l{
	background-color: #e6f2ef;
}
.bg_n3{
	background-color: #6fba2c;
}
.bg_n3_l{
	background-color: #edf6ea;
}
.bg_n2{
	background-color: #ed6c00;
}
.bg_n2_l{
	background-color: #fdf0e5;
}

/***合計時間***/
.total_time_are{
	text-align: center;
}

.total_time_text{
	font-size: 1.2em;
	font-weight: bold;
	margin: 2em auto;
	padding: 0.5em;
	position: relative;
}
.total_time_text::after{
	content: '';
	display: block;
	width: 1.5em;
	height: 1em;
	clip-path: polygon(0 0,100% 0,50% 100%);
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%,-1px);
}
.total_time_are .total_time_text.bg_list_blue::after{
	background-color: var(--list_blue);
}
.total_time_are .total_time_text.bg_list_green::after{
	background-color: var(--list_green);
}
.total_time_are .total_time_text.bg_list_pink::after{
	background-color: var(--list_pink);
}

.total_time{
	display: inline-block;
	font-size: clamp(2.6rem,3.6vw,3.6rem);
	font-weight: bold;
	color: var(--red_color);
	padding: 0.25em 1em;
	border: solid 4px var(--red_color);
	background-color: #fffada;
}

.all_total_time_are{
	text-align: center;
	border: solid 4px var(--shadow_color);
}
.all_total_time_text{
	font-size: clamp(1.9rem,2.3vw,2.3rem);
	font-weight: bold;
	color: #fff;
	padding: 0.5em;
	position: relative;
	background-color: var(--shadow_color);
}
.all_total_time_text::after{
	content: '';
	display: block;
	width: 1.5em;
	height: 1em;
	background-color: var(--shadow_color);
	clip-path: polygon(0 0,100% 0,50% 100%);
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%,-1px);
}
.all_total_time{
	font-size: clamp(3rem,4.6vw,4.6rem);
	font-weight: bold;
	color: var(--red_color);
	padding: 0.5em;
	background-color: #fffada;
}

/*Myスケジュール*/
.curri_mysche{
	color: #fff;
	margin: 3em auto 1em auto;
	padding: 1em 1.5em;
	border-radius: 10em;
	background-color: var(--shadow_color);
	position: relative;
}
.curri_mysche::after{
	content: '';
	display: block;
	width: 1.5em;
	height: 1em;
	background-color: var(--shadow_color);
	clip-path: polygon(0 0,100% 0,50% 100%);
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%,-1px);
}
.curri_myimg{
	text-align: center;
	margin-top: 1em;
}


/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	.curri_section{
		margin-top: 8em;
	}
	
	.curri_area{
		display: flex;
		justify-content: space-between;
		padding-top: 1em;
	}
	.curri_set{}
	.curri_area .curri_set:nth-of-type(1){
		width: 35%;
	}
	.curri_area .curri_set:nth-of-type(2){
		width: 60%;
	}
	.curri_img{
		display: flex;
		justify-content: center;
		align-items: flex-end;
	}
	.curri_img img{
		width: auto;
		height: auto;
		max-width: 100%;
		max-height: 100%;
	}
	.curri_area .curri_set:nth-of-type(1) .curri_img{
		aspect-ratio: 292 / 200;
	}
	.curri_area .curri_set:nth-of-type(2) .curri_img{
		aspect-ratio: 501 / 200;
	}
	
	/*****
	表組関連
	*****/
	.curri_tbl_wrap{
		width: 35%;
	}
	.curri_tbl_wrap3{
		width: 30%;
	}
	.curri_tbl{}
	
	/***合計時間***/
	.total_time_text{
		width: 85%;
	}
	
	/*Myスケジュール*/
	.curri_mysche{
		display: inline-block;
		padding: 1em 4em;
	}
	.curri_myimg{
		width: 48%;
	}
}

/* スマホ----------------------------- */
@media (max-width: 767px){
	.curri_section{
		margin-top: 6em;
	}
	
	.curri_area .curri_set:nth-of-type(1) .curri_img{
		width: 70%;
		margin: 0 auto;
	}
	
	/*****
	表組関連
	*****/
	.curri_tbl_wrap,
	.curri_tbl_wrap3{
		width: 80%;
		margin: 2em auto 0 auto;
	}
	.curri_tbl{}
	
	/*Myスケジュール*/
	.curri_mysche{
		text-align: left;
	}
	.curri_myimg{}
}