@charset "utf-8";
.page-header{
	position : relative;
	display : block;
	width : 100%;
	height : 380px;
}
.page-header figure{
	position : relative;
	display : block;
	width : 100%;
	height : 100%;
}
.page-header figure img{
	position : relative;
	display : block;
	width : 100%;
	height : 100%;
	object-fit : cover;
	object-position : left center;
}
.page-title{
	position : absolute;
	display : flex;
	align-items : center;
	line-height : 1;
	font-size : var(--24px);
	font-weight : bold;
	top : 50%;
	transform: translateY(-50%);
	left : 7%;
}
.page-section{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	padding : 50px 15px;
	overflow : hidden;
}
.page-section:last-of-type .wrap{
	padding-bottom : 100px;
}
.page-section .wrap{
	position : relative;
	display : block;
	width : 1200px;
	height : auto;
	margin : 0 auto;
}
.section-headline{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	text-align : center;
	font-size : var(--24px);
	font-weight : bold;
	margin-bottom : 50px;
}
.page-section .flex{
	position : relative;
	display : flex;
	flex-wrap : wrap;
	justify-content : space-between;
	column-gap : 50px;
}
.page-section .flex .box{
	position : relative;
	display : block;
	flex-grow : 1;
	flex-shrink : 1;
	flex-basis : 0;
}

.page-section .list{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	margin : 0 auto;
}
.page-section .list .group{
	position : relative;
	display : flex;
	flex-wrap : wrap;
	justify-content : flex-start;
	width : 100%;
	height : auto;
	border-bottom : 1px solid var(--font-color);
}
.page-section .list .group dt{
	position : relative;
	display : block;
	width : 200px;
	height : auto;
	padding : 15px 0;
}
.page-section .list .group dd{
	position : relative;
	display : block;
	width : calc(100% - 200px);
	height : auto;
	padding : 15px 0;
}
/* # =================================================================
#### responsive
# ================================================================= */
/* # =================================================================
#### 1200px
# ================================================================= */
@media screen and (max-width: 1200px){
.page-section .wrap{
	width : 100%;
}
}/*** 1200px ***/
/* # =================================================================
#### 1024px
# ================================================================= */
@media screen and (max-width: 1024px){

}/*** 1024px ***/
/* # =================================================================
#### 896px
# ================================================================= */
@media screen and (max-width: 896px){

}/*** 896px ***/
/* # =================================================================
#### 600px
# ================================================================= */
@media screen and (max-width: 600px){

}/*** 600px ***/
/* # =================================================================
#### 480px
# ================================================================= */
@media screen and (max-width: 480px){

}/*** 480px ***/
/* # =================================================================
#### 320px
# ================================================================= */
@media screen and (max-width: 320px){

}/*** 320px ***/