@charset "utf-8";
/*======================================
下層ページ
========================================*/
/*------------------------------
ページヘッダー
------------------------------*/
.panlist{
	font-size: 1.2rem;
	width: 94%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 2em 0;
}
.panlist ul{
	display: flex;
	flex-wrap: wrap;
}
.panlist ul li{
	margin-bottom: 0.5em;
}
.panlist ul li::after{
	content: '/';
	display: inline-block;
	margin: 0 0.5em;
}
.panlist ul li:last-of-type::after{
	display: none;
}
.panlist ul li a{
	color: var(--black_color);
}

.page_header{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	width: 94%;
	margin: 0 auto;
}
.page_header h1{
	font-size: clamp(3.4rem,5.4vw,5.4rem);
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	letter-spacing: 0.07em;
	color: #A72E22;
}
.page_header h1 .sub_h1{
	display: block;
	font-size: 0.5em;
}

/*------------------------------
セクション
------------------------------*/
.section_wrap{
	font-size: clamp(1.6rem,1.8vw,1.8rem);
	line-height: 1.6;
}
.normal_section,
.box_section{
	max-width: 1080px;
}
.section_wrap .normal_section:first-of-type,
.section_wrap .box_section:first-of-type{
	margin-top: 0;
}
.normal_section{
	width: 94%;
}
.box_section{
	width: 88%;
	border: solid 1px var(--shadow_color);
	background-color: #fff;
	box-shadow: 0.75em 0.75em 0 0 var(--shadow_color);
}

.ttl_type01{
	font-size: clamp(2.8rem,3.8vw,3.8rem);
	font-weight: bold;
	color: var(--red_d_color);
	margin-bottom: 1em;
	padding: 0.25em 0 0.25em 0.5em;
	border-left: solid 0.2em var(--green_l_color);
}

/*****
教材セットカラー
*****/
.bg_list_red{
	background-color: var(--list_red);
}
.bg_list_blue{
	background-color: var(--list_blue);
}
.bg_list_green{
	background-color: var(--list_green);
}
.bg_list_pink{
	background-color: var(--list_pink);
}

/*****
資料請求ボタン
*****/
.btn_request{
	width: 80%;
	max-width: 520px;
	margin: 2em auto;
}
.btn_request a{
	display: flex;
	justify-content: center;
	font-size: clamp(1.8rem,2.2vw,2.2rem);
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	background-image: url("../img/nav_icon05.svg"),linear-gradient(to bottom,#f769c3 0, #f121a6 100%);
	background-repeat: no-repeat,repeat;
	background-size: 1.5em auto,auto;
	background-position: left 1em center,center center;
}


/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	/*------------------------------
	ページヘッダー
	------------------------------*/
	.page_header{
		aspect-ratio: 16 / 3;
	}
	
	/*------------------------------
	セクション
	------------------------------*/
	.section_wrap{
		padding: 4.5em 0;
	}
	.normal_section,
	.box_section{
		margin: 4em auto 0 auto;
	}
	.box_section{
		padding: 3.5em 4.5em;
	}
	
	/*****
	資料請求ボタン
	*****/
	.btn_request a{
		padding: 1.5em 3em;
		border-radius: 0.5em;
	}
	.btn_request a:hover{
		opacity: 0.65;
	}
}

/* スマホ----------------------------- */
@media (max-width: 767px){
	/*------------------------------
	ページヘッダー
	------------------------------*/
	.page_header{
		aspect-ratio: 2 / 1;
	}
	
	/*------------------------------
	セクション
	------------------------------*/
	.section_wrap{
		padding: 3em 0;
	}
	.normal_section,
	.box_section{
		margin: 3em auto 0 auto;
	}
	.box_section{
		padding: 1.5em 1em;
	}
	
	/*****
	資料請求ボタン
	*****/
	.btn_request a{
		padding: 1em 3em;
		border-radius: 10em;
	}
}
