@charset "utf-8";
/* ===================================================
	Facilities CSS
====================================================== */
/* ---------------------------------------------------
	Main title
------------------------------------------------------ */
.box_maintit{ background-image: url("../../img/facilities/main_img.jpg");}
.box_maintit .tit{ width: 500px; height: 144px;}

@media screen and (max-width: 600px) {
.box_maintit .tit{ width: 300px; height: 86px; top: 74px; bottom: inherit;}
}


/* ---------------------------------------------------
	Slick Slider Style Overwrite
------------------------------------------------------ */
.slick-arrow {  cursor: pointer; color: transparent; border: none; outline: none; background: transparent; width: 25px; height: 0; padding: 50px 0 0; top: calc(50% - 25px); left: auto; z-index: 10; overflow: hidden; position: absolute;}
.slick-arrow:before { content: ''; width: 35px; height: 35px; position: absolute; top: 50%; left: 50%; opacity: 1; -webkit-box-sizing: border-box; box-sizing: border-box; transform: translate(-50%, -50%) rotate(45deg);}
.slick-prev { left: 0;}
.slick-prev:before { margin: 0 0 0 calc(25px / 2); border-left: 1px solid #fff; border-bottom: 1px solid #fff;}
.slick-next { right: 0;}
.slick-next:before { margin: 0 0 0 calc(-25px / 2); border-right: 1px solid #fff; border-top: 1px solid #fff;}
.slick-dots { text-align: center; padding: 5px 0 0; position: absolute; bottom: 10px; width: 100%;}
.slick-dots li { display: inline-block; margin: 0 10px;}
.slick-dots li button { margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; position: relative; text-indent: -9999px;}
.slick-dots li button:before { content: "●"; font-size: 14px; text-indent: 0px; position: absolute; top: 0; left: 0; color: #ccc; font-family: 'Noto Serif JP'; }
.slick-dots li.slick-active button:before { color: #529b44;}

@media screen and (max-width: 600px) {
.slick-arrow:before { width: 20px; height: 20px;}
.slick-dots { bottom: 10px;}
}


/* ---------------------------------------------------
	Common Parts
------------------------------------------------------ */
/*.section type1*/
.sec_type1{ padding: 100px 0; position: relative; display: flex; flex-direction: row; align-items: flex-start; overflow: hidden; background: #faf7f7;}
.sec_type1:nth-of-type(2n){ background: #fff; flex-direction: row-reverse;}
.sec_type1 .box_slide{ width: 60%; height: 540px;}
.sec_type1 .box_slide img{ width: 100%; height: 540px;}
.sec_type1 .box_txt{ width: 40%; min-width: 400px;}
.sec_type1 .box_txt h2{ width: 400px; margin: 20px auto 20px; font-size: 25px; line-height: 1.7; padding: 25px 0 20px 0; color: #286c35; letter-spacing: 0; border-bottom: solid 1px #ccc;}
.sec_type1 .box_txt p{ width: 400px; margin: 0 auto; font-size: 15px; line-height: 2;}

@media screen and (max-width: 600px) {
.sec_type1{ padding: 30px 0; position: relative; flex-direction: column-reverse;}
.sec_type1:nth-of-type(2n){ flex-direction: column-reverse;}
.sec_type1 .box_slide{ width: 92%; margin: 0 auto 4%; height: auto; clear: both;}
.sec_type1 .box_slide img{ width: 100%; height: auto;}
.sec_type1 .box_txt{ width: 92%; min-width: 0; margin: 0 auto;}
.sec_type1 .box_txt h2{ width: 100%; margin: 0 0 15px 0; font-size: 20px; line-height: 1.5; padding: 0 0 15px 0; text-align: center;}
.sec_type1 .box_txt p{ width: 100%; margin: 15px 0 0; font-size: 14px; line-height: 1.8;}
}

@media screen and (max-width: 320px) {
.sec_type1 .box_txt h2{font-size: 18px;}
}


/* ---------------------------------------------------
	Section 1
------------------------------------------------------ */
#sec1{ padding: 40px 0 0; overflow: hidden;}
#sec1 .tit1{ font-size: 26px; line-height: 1.5; text-align: center; color: #286c35; padding: 0 0 20px;}
#sec1 .txt1{ font-size: 15px; line-height: 2; text-align: center; padding: 0 0 50px;}
#sec1 .slick-slide{ width: 1100px !important; margin: 0 30px;}
#sec1 .slick-prev { left: 50%; margin: 0 0 0 -595px;}
#sec1 .slick-prev:before { border-left: 1px solid #000; border-bottom: 1px solid #000;}
#sec1 .slick-next { right: 50%; margin: 0 -595px 0 0;}
#sec1 .slick-next:before { border-right: 1px solid #000; border-top: 1px solid #000;}

@media screen and (max-width: 600px) {
#sec1{ padding: 30px 0; overflow: hidden; border-bottom: solid 1px #ccc;}
#sec1 .tit1{ font-size: 20px; line-height: 1.5; text-align: center; color: #286c35; padding: 0 4% 15px;}
#sec1 .txt1{ font-size: 14px; line-height: 1.7; text-align: left; padding: 0 4% 30px;}
#sec1 .slick-slide{ width: 92vw!important; margin: 0 4vw;}
#sec1 .slick-prev { margin: 0 0 0 -192px;}
#sec1 .slick-prev:before { border-left: 1px solid #fff; border-bottom: 1px solid #fff;}
#sec1 .slick-next { margin: 0 -192px 0 0;}
#sec1 .slick-next:before { border-right: 1px solid #fff; border-top: 1px solid #fff;}
}

@media screen and (max-width: 320px) {
#sec1 .tit1{ font-size: 18px;}
}


/* ---------------------------------------------------
	Section 2
------------------------------------------------------ */
#sec2 .box_txt h2{ letter-spacing: 0;}


/* ---------------------------------------------------
	Section 8
------------------------------------------------------ */
#sec8{ border-top: solid 1px #ccc; padding: 100px 0 150px;}
#sec8 h2{ margin: 0 0 50px;}
#sec8 dl{ display: table; width: 100%;}
#sec8 dt,
#sec8 dd{ display: table-cell; font-size: 15px; line-height: 2; padding: 23px 0; vertical-align: middle; box-sizing: border-box;}
#sec8 dt{ width: 20%; background: #e4f2e2; border-bottom: solid 1px #fff; font-weight: normal; text-align: center;}
#sec8 dd{ width: 80%; border-bottom: solid 1px #ccc; padding: 23px 0 23px 40px;}

@media screen and (max-width: 600px) {
#sec8{ padding: 40px 0 50px;}
#sec8 h2{ margin: 0 0 20px;}
#sec8 dl{ display: block; width: 100%; margin: 0 0 15px;}
#sec8 dt,
#sec8 dd{ display: block; font-size: 14px; line-height: 1.7; padding: 10px 0;}
#sec8 dt{ width: 100%; border-bottom: none;}
#sec8 dd{ width: 100%; border-bottom: none; padding: 10px; text-align: center;}
#sec8 dd.txt_l{ text-align: left;}
}

