@charset "utf-8";
/* ===================================================
	Facilities CSS
====================================================== */

/* ---------------------------------------------------
	Lead
------------------------------------------------------ */
#lead { padding: 55px 0 70px; position: relative; }
.cmn_lead h2 { margin-bottom: 15px; }
#lead p { padding-bottom: 61px; }
#lead::before { content: ''; width: 100%; height: 600px; background: url(../../facilities/img/lead_bg01.jpg) no-repeat top center; position: absolute; top: -40px; right: 0; z-index: -10; }

@media screen and (max-width: 600px) {
	#lead { padding: 20px 0 50px; }
	#lead p { padding-bottom: 35px; }
	#lead::before { top: -65px; background-size: auto 100%; height: 450px; }
}


/* ---------------------------------------------------
	sec01
------------------------------------------------------ */
#sec01 { background: url(../../facilities/img/sec01_bg01.jpg) no-repeat top right; padding-bottom: 80px; }
#sec01 .tit_01 { font-size: 18px; letter-spacing: 0.3em; margin-bottom: 12px; }
#sec01 .tit_01 span { font-size: 15px; letter-spacing: 0; margin-left: 15px; }
#sec01 dl div { display: flex; border-top: 1px solid #444; }
#sec01 dl { border-bottom: 1px solid #444; }
#sec01 dt { width: 180px; padding: 17px 2%; box-sizing: border-box; background: #221713; display: flex; justify-content: center; align-items: center; }
#sec01 dd { display: flex; align-items: center; padding: 17px 30px; flex-grow: 1; }

@media screen and (max-width: 600px) {
	#sec01 { background: none; padding-bottom: 50px; }
	#sec01 .tit_01 { font-size: 16px; margin-bottom: 5px; }
	#sec01 .tit_01 span { font-size: 14px; margin-left: 14px; }
	#sec01 dl div { flex-direction: column; border-top: 1px solid #444; }
	#sec01 dl { border-bottom: 1px solid #444; }
	#sec01 dt { width: 100%; padding: 10px 2%; justify-content: flex-start; }
	#sec01 dd { width: 100%; padding: 10px 2%; }
}


/* ---------------------------------------------------
	sec02
------------------------------------------------------ */
#sec02 { background: #221713; padding: 80px 0; }
#sec02 .inner_md { display: flex; justify-content: space-between;  }
#sec02 .inner_md:nth-child(2) { flex-direction: row-reverse; margin-top: 80px; }
#sec02 .inner_md .guide_block { max-width: 400px; width: 37%; margin: 0 0 0 10px; display: flex; flex-direction: column; justify-content: space-between; }
#sec02 .inner_md .txt h3 { line-height: 1; font-size: 26px; margin-bottom: 20px; display: flex; align-items: center; letter-spacing: 0.18em; }
#sec02 .inner_md .txt h3::before { content: ''; width: 30px; height: 3px; display: inline-block; background: #d6b165; margin-right: 15px; }
#sec02 .inner_md .txt p { line-height: 2; }
#sec02 .inner_md:nth-child(1) .txt { padding: 0 0 0 20px; letter-spacing: 0.15em; }
#sec02 .inner_md:nth-child(1) .txt h3 { margin: 0 0 8px 5px; }
#sec02 .inner_md:nth-child(2) .guide_block { max-width: 450px; width: 41%; margin: 0 10px 0 0; }


@media screen and (max-width: 600px) {
	#sec02 { padding: 40px 0; }
	#sec02 .inner_md { display: block; position: relative; }
	#sec02 .inner_md:nth-child(2) { margin-top: 25px; }
	#sec02 .inner_md .photo_block { position: absolute; bottom: 0; right: 0; width: 50.6%; }
	#sec02 .inner_md .photo_block img,
	#sec02 .inner_md .guide_block .photo img { object-fit: contain; width: 100%; }
	#sec02 .inner_md .guide_block { max-width: none; width: 100%; margin: 0; }
	#sec02 .inner_md .txt h3 { font-size: 20px; margin-bottom: 5px; }
	#sec02 .inner_md .txt h3::before { width: 20px; margin-right: 10px; }
	#sec02 .inner_md .guide_block .photo { width: 48.4%; }
	#sec02 .inner_md .guide_block .txt { margin-bottom: 10px; }
	#sec02 .inner_md .txt p { line-height: 1.5; }
	#sec02 .inner_md:nth-child(1) .txt { padding: 0; }
	#sec02 .inner_md:nth-child(1) .txt h3 { margin: 0 0 10px 0; }
	#sec02 .inner_md:nth-child(2) .photo_block { width: 48.4%; }
	#sec02 .inner_md:nth-child(2) .guide_block .photo { width: 50.8%; }
	#sec02 .inner_md:nth-child(2) .guide_block { max-width: none; width: 100%; margin: 0; }
}


/* ---------------------------------------------------
	sec03
------------------------------------------------------ */
#sec03 { padding: 100px 0 70px; }
#sec03 .cmn_tit_01 { padding-top: 20px; margin-bottom: 30px; }
#sec03 .photo_block { margin-bottom: 25px; display: grid; grid-template-columns: minmax(63%, 700px) 4px minmax(36%, 395px); grid-template-rows: 50% 4px calc(50% - 5px); }
#sec03 .photo_block li:nth-child(1) { grid-row: 1/4; grid-column: 1/2;}
#sec03 .photo_block li:nth-child(2) { grid-row: 1/2; grid-column: 3/4;}
#sec03 .photo_block li:nth-child(3) { grid-row: 3/4; grid-column: 3/4; }
#sec03 .photo_block li img { object-fit: contain; width: 100%; }
#sec03 .photo_block li:nth-child(1) img{ height: 100%; object-fit: cover;}
#sec03 p { text-align: center; line-height: 2; }


@media screen and (max-width: 600px) {
	#sec03 { padding: 50px 0 35px; }
	#sec03 .cmn_tit_01 { padding-top: 3vw; margin-bottom: 4vw; }
	#sec03 .photo_block { margin-bottom: 15px; }
	#sec03 p { text-align: left; line-height: 1.5; }
}


/* ---------------------------------------------------
	sec04
------------------------------------------------------ */
#sec04 { background: #221713; padding: 90px 0 95px; }
#sec04 .cmn_tit_01 { padding-top: 22px; margin-bottom: 35px; }
#sec04 .photo_block { margin-bottom: 45px; display: grid; grid-template-columns: minmax(36%, 395px) 4px minmax(63%, 700px); grid-template-rows: 50% 4px calc(50% - 5px); }
#sec04 .photo_block li:nth-child(1) { grid-row: 1/2; grid-column: 1/2;}
#sec04 .photo_block li:nth-child(2) { grid-row: 3/4; grid-column: 1/2;}
#sec04 .photo_block li:nth-child(3) { grid-row: 1/4; grid-column: 3/4; }
#sec04 .photo_block li img { object-fit: contain; width: 100%; }
#sec04 .photo_block li:nth-child(3) img{ height: 100%; object-fit: cover;}
#sec04 > div > p { text-align: center; line-height: 2; }
#sec04 .cat_col { margin: 45px auto 0; width: 700px; display: flex; justify-content: space-between; }
#sec04 .cat_col .photo img { border-radius: 50%; }
#sec04 .cat_col .txt { text-align: center; font-size: 18px; margin-top: 5px;  font-family: "游明朝", YuMincho, "Times New Roman", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif; }


@media screen and (max-width: 600px) {
	#sec04 { padding: 45px 0; }
	#sec04 .cmn_tit_01 { padding-top: 3vw; margin-bottom: 4vw; }
	#sec04 .photo_block { margin-bottom: 15px; }
	#sec04 > div > p { text-align: left; line-height: 1.5; }
	#sec04 .cat_col { margin: 25px auto 0; width: 80%; }
	#sec04 .cat_col li { width: 30%; }
	#sec04 .cat_col .txt { font-size: 16px; line-height: 1.2; }
}


/* ---------------------------------------------------
	sec05
------------------------------------------------------ */
#sec05 { padding: 80px 0 170px; }
#sec05 .cmn_tit_01 { padding-top: 22px; margin-bottom: 60px; }
#sec05 .inner_col { display: flex; justify-content: space-between; flex-wrap: wrap; }
#sec05 .inner_col > div { max-width: 520px; width: 49%; display: flex; flex-direction: column; }
#sec05 .inner_col > div:nth-child(1),
#sec05 .inner_col > div:nth-child(2) { margin-bottom: 80px; }
#sec05 .inner_col > div dl { flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; }
#sec05 .inner_col > div dt { text-align: center; font-size: 24px; line-height: 1.2; font-family: "游明朝", YuMincho, "Times New Roman", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif; margin: 20px 0 15px; }
#sec05 .inner_col > div dt span { font-size: 18px; }
#sec05 .inner_col > div dd { width: 460px; margin: 0 auto; line-height: 2; letter-spacing: 0.05em; }
#sec05 .inner_col > div dd a { width: 90%; max-width: 200px; margin: 18px auto 0; padding: 8px 2%; box-sizing: border-box; border-radius: 20px; font-family: "游明朝", YuMincho, "Times New Roman", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif; }
#sec05 .inner_col > div dd a.cmn_linkbtn_01::after { right: 40px; }
#sec05 .inner_col > div:nth-child(1) dt { display: flex; justify-content: center; }
#sec05 .inner_col > div dt ruby { display: flex; flex-direction: column-reverse; }
#sec05 .inner_col > div dt ruby:nth-child(1) { margin-right: 0.5em; }
#sec05 .inner_col > div dt ruby > rt { text-align: center; font-size: 13px; line-height: 1; margin-bottom: 7px; }


@media screen and (max-width: 600px) {
	#sec05 { padding: 40px 0 100px; }
	#sec05 .cmn_tit_01 { padding-top: 3vw; margin-bottom: 4vw; }
	#sec05 .inner_col > div { max-width: none; width: 100%; }
	#sec05 .inner_col > div:nth-child(1),
	#sec05 .inner_col > div:nth-child(2),
	#sec05 .inner_col > div:nth-child(3) { margin-bottom: 30px; }
	#sec05 .inner_col > div .photo{ text-align: center;}
	#sec05 .inner_col > div dl { flex-grow: 0; }
	#sec05 .inner_col > div dt { font-size: 18px; margin: 15px 0 10px; }
	#sec05 .inner_col > div dt span { font-size: 14px; }
	#sec05 .inner_col > div dd { width: 90%; font-size: 15px; line-height: 1.5; }
	#sec05 .inner_col > div dd a { margin: 15px auto 0; }
	#sec05 .inner_col > div dd a.cmn_linkbtn_01::after { right: 10%; }
	#sec05 .inner_col > div dt ruby > rt { font-size: 12px; margin-bottom: 5px; }
	#sec05 .inner_col > div:nth-child(1) dt { flex-wrap: wrap; }
}