@charset "utf-8";
/*======================================
お知らせ
========================================*/
/*------------------------------
ページヘッダー
------------------------------*/
.page_header_wrap{
	background-image: url("../../../img/index_touroku.jpg");
}

/*------------------------------
講習について
------------------------------*/
/*****
受講資格・受講対象者
*****/
.kosyu_lead_box{}
.kosyu_lead_box::after{
	color: '';
	display: block;
	clear: both;
}
.float_r{
	float: right;
	margin: 0 0 0.5em 0.5em;
}

/*****
宅建登録講習のポイント
*****/
.point_ttl{
	font-size: 1.1em;
	font-weight: bold;
	margin-top: 1.5em;
}
.point_ttl .point_icon{
	display: inline-block;
	color: #fff;
	margin-right: 0.5em;
	padding: 0.25em 0.5em;
	border-radius: 0.25em;
	background-color: var(--main_color);
}
.point_text{
	margin-top: 0.5em;
}

/***グラフ***/
.graph_area{
	margin-top: 1em;
}
.graph_img{
	max-width: 1000px
}

.graph_caption{
	font-size: 0.85em;
}
.graph_caption li{}
.graph_caption li::before{
	content: '';
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-right: 0.5em;
}
.graph_caption li:nth-of-type(1)::before{
	border-radius: 50%;
	background-color: #79ab75;
}
.graph_caption li:nth-of-type(2)::before{
	border-radius: 50%;
	background-color: #fba5b1;
}
.graph_caption li:nth-of-type(3)::before{
	border-radius: 50%;
	background-color: #508bb8;
}
.graph_caption li:nth-of-type(4)::before{
	background-color: #bacad8;
}
.graph_caption li:nth-of-type(5)::before{
	background-color: #7b6b98;
}

/*****
コースの種類・受講料
*****/
/*****
学習内容・教材
*****/
.learning_box{
	margin-top: 1em;
}
.learning_box dt{
	margin-bottom: 0.5em;
	padding: 0.5em;
	background-color: var(--sub02_color);
}
.learning_box dd{
	margin-bottom: 1.5em;
}

.teaching_material{
	margin-top: 1em;
	padding: 0.5em;
	border: solid 4px var(--main_color);
}
.teaching_ttl{
	color: var(--sub_color);
}

/*****
学習カリキュラム
*****/

.apply_flow{
	margin-top: 2em;
}
.apply_flow dt{
	text-align: center;
	color: #fff;
	padding: 0.5em;
	background-color: var(--main_color);
}
.apply_flow dd{
	padding: 0.5em;
	border: solid 1px var(--main_color);
}

.curriculum_box{
	margin-bottom: 3.5em;
	position: relative;
}
.apply_flow dd .curriculum_box:last-of-type{
	margin-bottom: 0;
}
.curriculum_box::after{
	content: '';
	display: block;
	width: 3em;
	height: 1.5em;
	background-color: var(--sub_color);
	clip-path: polygon(0 0,100% 0,50% 100%);
	position: absolute;
	top: calc(100% + 1em);
	left: 50%;
	transform: translateX(-50%);
}
.apply_flow dd .curriculum_box:last-of-type::after{
	display: none;
}

.curriculum_text{
	margin-bottom: 0.5em;
	padding-bottom: 0.5em;
	border-bottom: dashed 1px var(--main_color);
}

.apply_flow_after{
	text-align: center;
	color: #fff;
	margin-top: 3.5em;
	padding: 0.5em;
	border-radius: 0.25em;
	background-color: var(--main_color);
	position: relative;
}
.apply_flow_after::before{
	content: '';
	display: block;
	width: 3em;
	height: 1.5em;
	background-color: var(--main_color);
	clip-path: polygon(0 0,100% 0,50% 100%);
	position: absolute;
	bottom: calc(100% + 1em);
	left: 50%;
	transform: translateX(-50%);
}

/*------------------------------
会場一覧
------------------------------*/
.course_schedule{
	display: flex;
	justify-content: space-between;
}
.course_box{
	text-align: center;
	padding: 0.5em;
	border: solid 1px var(--tbl_border);
	border-radius: 0.25em;
}
.course_ttl{
	color: #fff;
	border-radius: 0.25em;
}

/***コースカラー***/
.april_color{
	background-color: #f159bc;
}
.may_color{
	background-color: #f37f31;
}
.june_color{
	background-color: #5388e9;
}
.june02_color{
	background-color: #2087af;
}
.july_color{
	background-color: #329f6d;
}

/*****
地域アンカーナビ
*****/
.place_nav{}

/*****
開催会場日程リスト
*****/
.place_area{}
.place_box{
	margin-bottom: 1.5em;
	padding-bottom: 1.5em;
	border-bottom: solid 1px var(--tbl_border);
}
.place_ttl{
	margin-bottom: 0.5em;
}
.place_ttl a{
	display: inline-block;
	font-weight: bold;
	width: 6em;
}
.course_list{}
.course_list .jisshi{
	font-weight: bold;
}
.course_list ul{
	display: flex;
	flex-wrap: wrap;
	font-size: 0.85em;
	line-height: 1;
}
.course_list ul li{
	color: #fff;
	padding: 0.5em 1em;
	margin-right: 0.5em;
	border-radius: 0.25em;
}
.course_list ul li:nth-of-type(1){
	background-color: #f159bc;
}
.course_list ul li:nth-of-type(2){
	background-color: #f37f31;
}
.course_list ul li:nth-of-type(3){
	background-color: #5388e9;
}
.course_list ul li:nth-of-type(4){
	background-color: #2087af;
}
.course_list ul li:nth-of-type(5){
	background-color: #329f6d;
}
.course_list ul li.off_color{
	background-color: #ccc;
}

/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	/*------------------------------
	ページヘッダー
	------------------------------*/
	.header_apply_nav .btn_header_apply{
		width: 100%;
	}
	
	/*------------------------------
	講習について
	------------------------------*/
	/*****
	受講資格・受講対象者
	*****/
	.kosyu_lead_box{
		width: 48%;
	}
	
	/*****
	宅建登録講習のポイント
	*****/
	/***グラフ***/
	.graph_area{
		display: flex;
		align-items: flex-end;
	}
	.graph_img{
		width: 71.5%;
		margin-right: 2em;
	}
	
	/*****
	学習内容・教材
	*****/
	.learning_box{
		flex-shrink: 0;
		width: 60%;
		margin-right: 2em;
	}
	.learning_box dt{}
	.learning_box dd{}
	
	.teaching_material{}
	
	/*****
	学習カリキュラム
	*****/
	.apply_flow{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.apply_flow dt{
		width: 20%;
		margin: 0 5% 3.5em 0;
		border-radius: 0.25em;
		position: relative;
	}
	.apply_flow dt::after{
		content: '';
		display: block;
		width: 3em;
		height: 1.5em;
		background-color: var(--main_color);
		clip-path: polygon(0 0,100% 0,50% 100%);
		position: absolute;
		top: calc(100% + 1em);
		left: 50%;
		transform: translateX(-50%);
	}
	
	.apply_flow dt:last-of-type::after{
		display: none;
	}
	.apply_flow dd{
		width: 75%;
		margin-bottom: 3.5em;
		border-radius: 0.25em;
	}
	.apply_flow dt:last-of-type,
	.apply_flow dd:last-of-type{
		margin-bottom: 0;
	}
	
	/*------------------------------
	会場一覧
	------------------------------*/
	.course_schedule{}
	.course_box{
		width: 18%;
	}
	
	/*****
	地域アンカーナビ
	*****/
	.place_nav a{
		margin: 0 1em 0 0;
	}
	
	/*****
	開催会場日程リスト
	*****/
	.course_list{
		display: flex;
		align-items: center;
		padding-left: 6em;
	}
	.course_list .jisshi{
		line-height: 1;
	}
}

/* スマホ----------------------------- */
@media (max-width: 767px){
	/*------------------------------
	ページヘッダー
	------------------------------*/
	.page_header_wrap{
		margin-top: 7.498em;
	}
	
	/*------------------------------
	講習について
	------------------------------*/
	/*****
	受講資格・受講対象者
	*****/
	.kosyu_lead_box{
		margin-top: 2em;
	}
	.flex_between_pc .kosyu_lead_box:first-of-type{
		margin-top: 0;
	}
	
	/*****
	宅建登録講習のポイント
	*****/
	/***グラフ***/
	.graph_caption{
		display: flex;
		flex-wrap: wrap;
	}
	.graph_caption li{
		display: inline-block;
		margin-right: 1em;
	}
	
	/*****
	学習内容・教材
	*****/
	.learning_box{}
	.learning_box dt{}
	.learning_box dd{}
	
	.teaching_material{}
	
	/*****
	学習カリキュラム
	*****/
	.apply_flow{}
	.apply_flow dt{
		border-radius: 0.25em 0.25em 0 0;
	}
	.apply_flow dd{
		margin-bottom: 3.5em;
		border-radius: 0 0 0.25em 0.25em;
		position: relative;
	}
	.apply_flow dd::after{
		content: '';
		display: block;
		width: 3em;
		height: 1.5em;
		background-color: var(--main_color);
		clip-path: polygon(0 0,100% 0,50% 100%);
		position: absolute;
		top: calc(100% + 1em);
		left: 50%;
		transform: translateX(-50%);
	}
	
	.apply_flow dd:last-of-type{
		margin-bottom: 0;
	}
	.apply_flow dd:last-of-type::after{
		display: none;
	}
	
	/*------------------------------
	会場一覧
	------------------------------*/
	.course_schedule{
		flex-wrap: wrap;
	}
	.course_box{
		width: 48%;
		margin-bottom: 1em;
	}
	
	/*****
	地域アンカーナビ
	*****/
	.place_nav a{
		margin: 0 1em 0.5em 0;
	}
	
	/*****
	開催会場日程リスト
	*****/
	.course_list .jisshi{}
	.course_list ul li{
		margin-top: 0.5em;
	}
}
