@charset "utf-8";
/* ===================================================
	facility CSS
====================================================== */
/* ---------------------------------------------------
sec01
------------------------------------------------------ */
#sec01{ padding: 90px 0;}
#sec01 .main{ margin-bottom: 10px;}

#sec01 [class^=detail]{
	margin-bottom: 10px;
	display: flex; justify-content: space-between;
}
#sec01 .detail_left{ flex-direction: row-reverse;}

#sec01 [class^=detail] .photo_block{ width: 545px;}
#sec01 [class^=detail] .txt_block{ padding-top: 50px; width: calc(96% - 545px);}
.txt_block2{ padding-top: 50px; width: calc(96% - 545px);}
#sec01 .detail_left:first-of-type .txt_block{ padding-top: 70px;}
#sec01 .detail_right .txt_block{ display: flex; flex-direction: column;}

#sec01 .photo_block li:first-child{ margin-bottom: 5px;}

#sec01 .float_block{ width: 100%;}
#sec01 .float_block .space{ height: calc(100% - 163px); float: right;}
#sec01 .float_block .img{ clear: both; float: right; margin: 5px 0 0 15px;}
#sec01 .float_block::after{
	display: block; content: "."; height: 0px;
	clear: both; visibility: hidden; font-size: 0;
}
#sec01 .inner_md{width: 86%;flex-direction: row-reverse;}
#sec01 .flex_col{width: 100%;}
#sec01 .flex_col .tit_icon_line span{justify-content: initial;}

@media screen and (max-width: 1304px) {
	#sec01 [class^=detail] .photo_block{ width: 49.5%;}
	#sec01 [class^=detail] .txt_block{ width: 45.5%;}
}


@media screen and (max-width: 600px) {
	
	#sec01{ padding: 10vw 0 2vw;}
	#sec01 .main img{ height: 60vw;}
	#sec01 [class^=detail]{ margin-bottom: 10vw; flex-direction: column;}
	#sec01 .detail_left{ flex-direction: column;}	
	#sec01 [class^=detail] .photo_block{ margin-bottom: 10vw; width: 100%;}
	#sec01 [class^=detail] .photo_block img{ height: 60vw;}
	#sec01 [class^=detail] .txt_block{ padding-top: 0; width: 100%;}
	#sec01 .tit_icon_line span{ justify-content: center;}
	#sec01 .tit_txt{ margin-bottom: 5vw; text-align: center;}

	#sec01 .detail_left:first-of-type .txt_block{ padding-top: 0;}
	#sec01 .photo_block li:first-child{ margin-bottom: 10px;}
	#sec01 .float_block{ display: flex; flex-direction: column;}
	#sec01 .float_block .space{ display: none;}
	#sec01 .float_block .img{ float: none; margin: 5vw auto 0; order: 2;}
	#sec01 .float_block  p{ order: 1; }
	#sec01 .float_block::after{ display: none;}
	#sec01 .inner_md{margin: 0 auto;width: 86%;max-width: 1100px;flex-direction: column;}
	#sec01 .flex_col{    width: 100%;}
	.txt_block2{width: initial;}
}


/* ---------------------------------------------------
sec02 - sec06共通
------------------------------------------------------ */
.btm_bg_l,
.btm_bg_r{
	position: relative; overflow: hidden;
}

.btm_bg_l::after{
	display: block; content: ''; width: 1089px; height: 408px;
	right: calc(50% + 220px); bottom: 0; position: absolute; z-index: -1;
	background: url(../../facilities/img/sec_bg_left_pc.png) no-repeat right top;
	background-size: 100% auto;
}
.btm_bg_r::after{
	display: block; content: ''; width: 1089px; height: 400px;
	left: calc(50% + 194px); bottom: 0; position: absolute; z-index: -1;
	background: url(../../facilities/img/sec_bg_right_pc.png) no-repeat left top;
	background-size: 100% auto;
}

@media screen and (max-width: 600px) {
	.btm_bg_l::after{
		width: 100%; height: 207px;
		left: 0; right: auto;
		background: url(../../facilities/img/sec_bg_left_sp.png) no-repeat left bottom;
		background-size: contain;
	}
	.btm_bg_r::after{
		width: 100%; height: 207px;
		left: 0; right: auto;
		background: url(../../facilities/img/sec_bg_right_sp.png) no-repeat right bottom;
		background-size: contain;
	}
}


.flex_col{
	padding: 80px 0 60px;
	display: flex; justify-content: space-between;
}

#sec04 .flex_col,
#sec06 .flex_col,
#sec08 .flex_col{
	flex-direction: row-reverse;
}

.flex_col .photo_block{ width: 720px; height: 430px;}
.flex_col .photo_block2{ width: 545px; height: 370px;}
.flex_col .txt_block{ padding-top: 25px; width: calc(94% - 720px);}
.flex_col .tit_icon_line span{ justify-content: center;}

@media screen and (max-width: 1304px) {
	.flex_col .photo_block{ width: 65%;}
	.flex_col .txt_block{ width: 30%;}
}

@media screen and (max-width: 600px) {
	.flex_col{
		padding: 10vw 0;
		flex-direction: column;
	}
	#sec04 .flex_col,
	#sec06 .flex_col,
	#sec08 .flex_col{
		flex-direction: column;
	}
	.flex_col .photo_block{ margin-bottom: 7vw; width:100%; height: auto;}
	.flex_col .photo_block img{ height: 60vw;}
	.flex_col .txt_block{ padding-top: 0; width: 100%;}
	.flex_col .photo_block2{width: 100%;height: initial;}
}


/* ---------------------------------------------------
sec02
------------------------------------------------------ */
#sec02 .border_col{
	margin-bottom: 90px; padding: 38px 30px;
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	background: #fff; border: 1px solid #a7a7a7;
	box-sizing: border-box;
}

#sec02 .border_col .photo_block{ width: 470px;}
#sec02 .border_col .txt_block{
	margin-right: 30px; padding: 50px 0 0;
	width: calc(100% - 470px); box-sizing: border-box;
}
#sec02 .border_col .txt{ margin: 0 auto; width: 375px;}
#sec02 .border_col .txt h3{ margin-bottom: 30px;}
#sec02 .border_col .txt p:not(:last-of-type){ margin-bottom: 30px;}


@media screen and (max-width: 600px) {
	#sec02 .border_col{
		margin-bottom: 10vw; padding: 7vw 5vw;
		flex-direction: column;
	}
	#sec02 .border_col .photo_block{ margin-bottom: 10vw; width: 100%;}
	#sec02 .border_col .txt_block{ margin-right: 0; padding: 0; width: 100%;}
	#sec02 .border_col .txt{ width: 100%;}
	#sec02 .border_col .txt .tit_txt{ text-align: center;}
	#sec02 .border_col .txt h3{ margin-bottom: 5vw;}
	#sec02 .border_col .txt p:not(:last-of-type){ margin-bottom: 5vw;}
}


/* ---------------------------------------------------
sec05
------------------------------------------------------ */
#sec05 .item{ position: relative;}
#sec05 .item span{
	padding: 12px 22px; line-height: 1;
	left: 0; bottom: 0; position: absolute; z-index: 1;
	background: #fcf8ed;
}

@media screen and (max-width: 600px) {
	#sec05 .item span{ font-size: 14px;}
}


/* ---------------------------------------------------
sec08
------------------------------------------------------ */
#sec08 p{ margin-bottom: 30px;}
#sec08 dl{ flex-direction: column;}
#sec08 dt,
#sec08 dd{
	padding: 10px 15px; width: 100%;
	box-sizing: border-box;
}
#sec08 dd{ background: #fff;}


/* ---------------------------------------------------
info
------------------------------------------------------ */
#info{ padding: 70px 0 150px;}

@media screen and (max-width: 600px) {
	#info{ padding: 10vw 0 15vw;}
}