@charset "utf-8";
.page-section .wrap{
	width : 800px;
}
/* # =================================================================
#### 01 ごあいさつ
# ================================================================= */
.section01{
	
}
.section01 figure{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.section01 figure img{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.section01 h4{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	font-size : var(--24px);
	font-weight : bold;
	margin-bottom : 30px;
}
.section01 p{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	text-align : justify;
	font-size : var(--14px);
	margin-bottom : 50px;
}
.section01 p.name{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	text-align : right;
	font-family : "Noto Serif JP", serif;
	font-size : var(--20px);
	font-weight : bold;
	margin-bottom : 0;
}
.section01 p.name span{
	font-size : var(--16px);
	margin-right : 1em;
}
/* # =================================================================
#### 02 会社概要
# ================================================================= */
.section02{
	
}
.section02 .list .group dd .inner{
	margin-bottom : 5px;
}
.section02 .list .group dd .inner:last-of-type{
	margin-bottom : 0;
}
.section02 .list .group dd .inner h4{
	font-size : var(--16px);
	font-weight : 500;
	text-decoration : underline;
}




/* # =================================================================
#### 03 沿　革
# ================================================================= */
.section03{
	
}
.section03 .list{
	border-top : 1px solid #DEDEDE;
	border-left : 1px solid #DEDEDE;
}
.section03 .list .group{
	border-right : 1px solid #DEDEDE;
	border-bottom : 1px solid #DEDEDE;
}
.section03 .list .group dt{
	border-right : 1px solid #DEDEDE;
	background-color : #F4F4F4;
	padding : 15px;
	width : 150px;
}
.section03 .list .group dd{
	background-color : #FFF;
	padding : 15px;
	width : calc(100% - 150px);
}



/* # =================================================================
#### 04 アクセス
# ================================================================= */
.section04{
	
}
.section04 ul{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	padding-top : 50px;
}
.section04 ul li{
	position : relative;
	display : list-item;
	width : 100%;
	height : auto;
	padding-left : 1em;
	margin-bottom : 5px;
}
.section04 ul li:last-of-type{
	margin-bottom : 0;
}
.section04 ul li::before{
	content : "・";
	position : absolute;
	display : block;
	left : 0;
}



.ggmap{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.ggmap iframe{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	aspect-ratio : 4 / 3;
}
/* # =================================================================
#### 05 グループ会社
# ================================================================= */
.section05{
	
}
.section05 .gpc{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	margin-bottom : 15px;
}
.section05 .gpc h4{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	font-size : var(--26px);
	font-weight : normal;
	margin-bottom : 10px;
}
.section05 .gpc p{
	
}
.section05 .flex{
	margin-bottom : 50px;
}
.section05 .flex figure{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.section05 .flex figure img{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
/* # =================================================================
#### エフェクト
# ================================================================= */
.section01 .flex .box:nth-of-type(1){
	
}
.section01 .flex .box:nth-of-type(2) h4{
	transition : all 0.8s ease-out .1s;
}
.section01 .flex .box:nth-of-type(2) p{
	transition : all 0.8s ease-out .1s;
}
.section01 .flex .box:nth-of-type(2) p.name{
	
}

.section02 .list{
	transition : all 0.8s ease-out .1s;
}
.section03 .list{
	transition : all 0.8s ease-out .1s;
}

.section04 .flex .box:nth-of-type(2){
	transition : all 0.8s ease-out .1s;
}

.section05 .flex .box:nth-of-type(1){
	transition : all 0.8s ease-out .1s;
}
.section05 .flex .box:nth-of-type(2){
	transition : all 0.8s ease-out .2s;
}
/* # =================================================================
#### responsive
# ================================================================= */
/* # =================================================================
#### 1200px
# ================================================================= */
@media screen and (max-width: 1200px){

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

}/*** 1024px ***/
/* # =================================================================
#### 896px
# ================================================================= */
@media screen and (max-width: 896px){
.page-section .wrap{
	width : 100%;
}
}/*** 896px ***/
/* # =================================================================
#### 600px
# ================================================================= */
@media screen and (max-width: 600px){
.page-section .flex{
	display : block;
}
.section01 .flex .box:nth-of-type(1){
	width : 250px;
	margin : 0 auto 30px;
}
.section01 h4{
	font-size : var(--20px);
	margin-bottom : 20px;
}
.section01 p.name{
	font-size : var(--16px);
}
.section01 p.name span{
	font-size : var(--14px);
}
.page-section .list .group{
	display : block;
	border-bottom : none;
}
.page-section .list .group dt{
	width : 100%;
	padding : 10px 15px;
	background-color : #e87d9633;
}
.page-section .list .group dd{
	width : 100%;
	padding : 10px 15px;
}
.section04 ul{
	padding-top : 30px;
}
.section05 .gpc h4{
	font-size : var(--20px);
}
.section05 .flex .box:nth-of-type(1){
	margin-bottom : 30px;
}






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

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

}/*** 320px ***/