@charset "utf-8";
/* ===================================================
	Spa CSS
====================================================== */
/* ---------------------------------------------------
slider
------------------------------------------------------ */
.slick_dots .slick-slide {
	margin: 0 15px; line-height: 1;
	opacity: .5; transition: opacity .8s;
}
.slick_dots .slick-slide.slick-current { opacity: 1; }

@media screen and (max-width: 600px) {
	.slick_dots .slick-slide { margin: 0;}
}


/* ---------------------------------------------------
sec01
------------------------------------------------------ */
#sec01{ padding: 75px 0 85px;}
#sec01 .txt{ margin-top: 45px; text-align: center;}

@media screen and (max-width: 600px) {
	#sec01{ padding: 10vw 0;}
	#sec01 .txt{ margin-top: 5vw; text-align: left;}

}

/* ---------------------------------------------------
sec02
------------------------------------------------------ */
#sec02{ padding: 75px 0 100px; position: relative;}
#sec02::after{
	display: block; content: ''; width: 1089px; height: 352px;
	left: calc(50% + 175px); bottom: 0; position: absolute; z-index: -1;
	background: url(../../spa/img/sec_bg_pc.png) no-repeat left top;
	background-size: 100% auto;
}
#sec02 .txt{ margin-top: 45px; text-align: center;}

@media screen and (max-width: 600px) {
	#sec02{ padding: 10vw 0 12vw;}
	#sec02::after{
		width: 100%; height: 207px;
		left: 0; right: auto;
		background: url(../../spa/img/sec_bg_sp.png) no-repeat right bottom;
		background-size: contain;
	}
	#sec02 .txt{ margin-top: 5vw; text-align: left;}
}


/* ---------------------------------------------------
sec03
------------------------------------------------------ */
#sec03{ padding: 130px 0 110px;}
#sec03 .flex_col{
	display: flex; justify-content: space-between;
}
#sec03 .item{ width: 46%; max-width: 500px;}
#sec03 .item .photo{ margin-bottom: 35px;}
#sec03 .item .tit_icon_line span{ font-size: 30px; justify-content: center;}
#sec03 .item .txt{ line-height: 2;}

@media screen and (max-width: 600px) {
	#sec03{ padding: 10vw 0 2vw;}
	#sec03 .flex_col{ flex-direction: column;}
	#sec03 .item{ margin: 0 auto 10vw; width: 100%;}
	#sec03 .item .photo{ margin-bottom: 5vw;}
	#sec03 .item .tit_icon_line span{ font-size: 24px;}
	#sec03 .item .txt{ line-height: 1.7;}
}


/* ---------------------------------------------------
sec04
------------------------------------------------------ */
#sec04{ padding: 94px 0 105px;}
#sec04 .flex_col{
	display: flex; justify-content: space-between;
	flex-direction: row-reverse;
}
#sec04 .flex_col .photo_block{ width: calc(94% - 440px); max-width: 590px;}

#sec04 .flex_col .txt_block{ width: 440px; color: #ab7b2f;}
#sec04 .flex_col .txt_block h3{ margin-bottom: 15px;}
#sec04 .flex_col .txt_block h3 span{
	font-size: 17px;
	display: flex; align-items: center;
}
#sec04 .flex_col .txt_block h3 span::before,
#sec04 .flex_col .txt_block h3 span::after{
	display: block; content: ''; height: 1px;
	flex-grow: 1; background: #ab7b2f;
}
#sec04 .flex_col .txt_block h3 span::before{ margin-right: 15px;}
#sec04 .flex_col .txt_block h3 span::after{ margin-left: 15px;}

#sec04 .flex_col .txt_block ol{
	margin-bottom: 40px;
	list-style-type: none;
	counter-reset:num;
}
#sec04 .flex_col .txt_block ol li{
	position: relative;
	margin-bottom: 15px; padding-left: 30px;
  line-height: 1.5;
}
#sec04 .flex_col .txt_block ol li:before {
	counter-increment: num;
	content: counter(num);
	top: 2px; left: 0; position: absolute;
	display: block; width: 22px; height: 22px; padding: 4px 0;
	color: #fff; font-size: 14px; text-align: center; line-height: 1;
	background: #ab7b2f; border-radius: 11px; box-sizing: border-box;
}
::-webkit-full-page-media, :future, :root #sec04 .flex_col .txt_block ol li:before{
	padding: 5px 0 4px;
}

#sec04 .flex_col .txt_block .cmn_linkbtn_01{ margin: 0 auto; width: 80%;}

@media screen and (max-width: 600px) {
	#sec04{ padding: 10vw 0 12vw;}
	#sec04 .flex_col{ flex-direction: column;}
	#sec04 .flex_col .photo_block{ margin-bottom: 7vw; width: 100%; max-width: 100%;}
	#sec04 .flex_col .txt_block{ width: 100%;}
	#sec04 .flex_col .txt_block ol{ margin-bottom: 7vw;}
	#sec04 .flex_col .txt_block .cmn_linkbtn_01{ margin: 0; width: 100%;}
}


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

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