@charset "utf-8";

/*#inner_title*/
.inner_copy{margin-top: 4%;}
.inner_img > img{object-position: 15%;}

/* 愛和ライフサポートの強み
---------------------------------------------------------------*/
#strengths{padding-top: 15px;}
#strengths > div{align-items: center;}
.strengths_text{
	max-width: 725px;
	width: 55%;
}
.strengths_img{
	width: 45%;
	margin-right: -4.5%;
}

/* レンタル商品
---------------------------------------------------------------*/
.rental-li{
	max-width: 1400px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
.rental-li li{
	width: 23%;
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	padding-bottom: 25px;
	margin: 1%;
	box-shadow: 0 0 5px #67726e33;
}
.rental-li li > div:first-child{
	border-bottom: solid 1px #ccc;
	margin-bottom: 30px;
}
.rental-li li > div:last-child{padding: 0 20px;}
.rental-li li img{width: 100%;}
.rental-li li h3{
	font-size: 18px;
	margin-bottom: 25px;
	font-family: "BIZUDPGothic-Bold";
}
.rental-li li p{
	line-height: 1.6;
	margin-bottom: 30px;
}
.rental-li li a{
	display: block;
	width: fit-content;
	text-decoration: underline;
	color: #33a981;
	position: relative;
	padding-left: 25px;
	margin: 0 0 0 auto;
	transition: 0.3s;
}
.rental-li li a::before{
	content: "";
	width: 17px;
	aspect-ratio: 17 / 21;
	background: url("../images/catalog_icon.svg") center / contain no-repeat;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.rental-li li a:hover{opacity: .7;}

/* 住宅改修・リフォーム
---------------------------------------------------------------*/
#renovation h3{
	width: fit-content;
	position: relative;
	padding: 0 40px;
	margin: 0 auto;
}
#renovation h3::before,#renovation h3::after{
	content: "";
	width: 25px;
	aspect-ratio: 25 / 4;
	background: url("../images/subtitle_g.webp") center / contain no-repeat;
	position: absolute;
	top: 0.6rem;
}
#renovation h3::before{left: 0;}
#renovation h3::after{right: 0;}
#renovation{background: url("../images/renovation_bg.webp") bottom / contain no-repeat;}
.renovation_li{
	max-width: 1400px;
	margin: 0 auto;
}
.renovation_li li,.renovation_li li > div{position: relative;}
.renovation_li li{
	width: 32%;
	background: #fff;
	border: solid 1px #33a981;
}
.renovation_li li > div{padding: 40px 35px;}
.renovation_li li > div::before,.renovation_li li > div::after,.renovation_li li::before,.renovation_li li::after{
	content: "";
	width: 8px;
	aspect-ratio: 1;
	background: #33a981;
	position: absolute;
}
.renovation_li li::before,.renovation_li li::after{top: -4px;}
.renovation_li li::before,.renovation_li li > div::before{left: -4px;}
.renovation_li li::after,.renovation_li li > div::after{right: -4px;}
.renovation_li li > div::before,.renovation_li li > div::after{bottom: -4px;}
.renovation_li li img{
	border-radius: 10px;
	margin-bottom: 35px;
}
.renovation_li li h4{
	font-family: "BIZUDPGothic-Bold";
	font-size: 18px;
	color: #33a981;
	margin-bottom: 30px;
}
.renovation_li li p{line-height: 1.8;}

/* 要介護認定の申請からサービスを受けるまで
---------------------------------------------------------------*/
.application{margin-bottom: 100px;}
.application img{
	display: block;
	margin: 0 auto;
}

/* 介護保険
---------------------------------------------------------------*/
.insurance_box{
	padding: 150px 6%;
	max-width: 1300px;
	margin: 0 auto;
}
.insurance_about{
	max-width: 1000px;
	margin: 0 auto 70px;
	align-items: center;
}
.insurance_about > img{margin-right: 60px;}
.insurance_about > div{width: calc(100% - 217px - 60px);}
.insurance_table{
	background: #fff;
	padding: 45px 60px;
	border-radius: 20px;
}
.insurance_table table{
	table-layout: fixed;
	width: 100%;
	position: relative;
}
.insurance_table table::before,.insurance_table table::after{
    content: "";
    width: 4px;
    height: 100%;
    background: radial-gradient(circle, #33a981 0.8px, transparent 1.6px) center top / 8px 8px repeat-y;
    position: absolute;
    top: 0;
}
.insurance_table table::before{left: 210px;}
.insurance_table table::after{right: calc((100% - 210px) / 2);}
.insurance_table thead tr{background: radial-gradient(circle, #33a981 0.8px, transparent 1.6px) left bottom / 8px 8px repeat-x;}
.insurance_table thead th{
	padding-bottom: 25px;
	text-align: center;
}
.insurance_table tbody tr:not(:last-child){background: radial-gradient(circle, #b3b3b3 0.8px, transparent 1.6px) left bottom / 8px 8px repeat-x;}
.insurance_table tbody td{padding: 30px 35px 35px;}
.insurance_table tbody tr > *{vertical-align: middle;}
.insurance_table .col-1{width: 210px;}
.insurance_table th{
	font-size: 18px;
	font-family: "BIZUDPGothic-Bold";
}
.insurance_table td{line-height: 1.6;}
.disease-box{margin-bottom: 90px;}
.disease-li{
	display: flex;
	flex-wrap: wrap;
}
.disease-li li{margin: 0.5% 0.8%;}
.faq-box{
	max-width: 1150px;
	margin: 0 auto;
}
.faq-box dl > div{
	background: #fff;
	padding: 50px 60px;
	border-radius: 20px;
}
.faq-box dl > div:not(:last-child){margin-bottom: 30px;}
.faq-box dl dt{
	font-size: 18px;
	font-family: "BIZUDPGothic-Bold";
	padding: 0 0 35px 40px;
	border-bottom: solid 1px #e6e6e6;
	margin-bottom: 35px;
	position: relative;
}
.faq-box dl dd{
	line-height: 1.6;
	padding-left: 40px;
	position: relative;
}
.faq-box dl dt::before,.faq-box dl dd::before{
	content: "";
	position: absolute;
	left: 0;
}
.faq-box dl dt::before{
	width: 28px;
	aspect-ratio: 7 / 5;
	background: url("../images/faq_q.webp") center / contain no-repeat;
	top: 0;
}
.faq-box dl dd::before{
	width: 26px;
	aspect-ratio: 13 / 10;
	background: url("../images/faq_a.webp") center / contain no-repeat;
	top: 0.1rem;
}

/* 1025px以下から
------------------------------------------*/
@media only screen and (max-width:1025px){

	/* 愛和ライフサポートの強み
	---------------------------------------------------------------*/
	#strengths{padding-top: 10px;}

	/* レンタル商品
	---------------------------------------------------------------*/
	.rental-li li{
		border-radius: 5px;
		padding-bottom: 20px;
	}
	.rental-li li > div:first-child{margin-bottom: 20px;}
	.rental-li li > div:last-child{padding: 0 15px;}
	.rental-li li h3{
		font-size: 16px;
		margin-bottom: 15px;
	}
	.rental-li li p{margin-bottom: 20px;}
	.rental-li li a{padding-left: 18px;}
	.rental-li li a::before{width: 12px;}
	
	/* 住宅改修・リフォーム
	---------------------------------------------------------------*/
	#renovation h3{padding: 0 30px;}
	#renovation h3::before,#renovation h3::after{width: 20px;}
	.renovation_li li > div{padding: 30px 20px;}
	.renovation_li li img{
		border-radius: 5px;
		margin-bottom: 25px;
	}
	.renovation_li li h4{
		font-size: 16px;
		margin-bottom: 15px;
	}
	
	/* 要介護認定の申請からサービスを受けるまで
	---------------------------------------------------------------*/
	.application img{width: 600px;}
	
	/* 介護保険
	---------------------------------------------------------------*/
	.insurance_box{padding: 90px 6% 80px;}
	.insurance_about{margin-bottom: 60px;}
	.insurance_about > img{
		width: 160px;
		margin-right: 50px;
	}
	.insurance_about > div{width: calc(100% - 180px - 50px);}
	.insurance_table{
		padding: 35px 25px 25px;
		border-radius: 10px;
	}
	.insurance_table table::before,.insurance_table table::after{background: radial-gradient(circle, #33a981 0.5px, transparent 1px) center top / 6px 6px repeat-y;}
	.insurance_table table::before{left: 160px;}
	.insurance_table table::after{right: calc((100% - 160px) / 2);}
	.insurance_table thead tr{background: radial-gradient(circle, #33a981 0.5px, transparent 1px) left bottom / 6px 6px repeat-x;}	
	.insurance_table thead th{padding-bottom: 20px;}
	.insurance_table tbody tr:not(:last-child){background: radial-gradient(circle, #b3b3b3 0.5px, transparent 1px) left bottom / 6px 6px repeat-x;}
	.insurance_table tbody td{padding: 20px 20px 25px;}
	.insurance_table .col-1{width: 160px;}
	.insurance_table th{font-size: 14px;}
	.disease-box{margin-bottom: 90px;}
	.faq-box dl > div{
		padding: 40px 30px;
		border-radius: 10px;
	}
	.faq-box dl > div:not(:last-child){margin-bottom: 20px;}
	.faq-box dl dt{
		font-size: 16px;
		padding: 0 0 20px 30px;
		margin-bottom: 20px;
	}
	.faq-box dl dd{padding-left: 30px;}
	.faq-box dl dt::before{width: 24px;}
	.faq-box dl dd::before{width: 22px;}
}

/* 750px以下から
------------------------------------------*/
@media only screen and (max-width:750px){
	
	/* 愛和ライフサポートの強み
	---------------------------------------------------------------*/
	#strengths{padding-top: 0;}
	.strengths_text{width: 100%;}
	.strengths_img{
		max-width: 590px;
		width: 100%;
		margin: 0 auto;
	}
	.strengths_img{
		order: -1;
		margin-bottom: 40px;
	}
	
	/* レンタル商品
	---------------------------------------------------------------*/
	.rental-li li{width: 48%;}
	.rental-li li img{
		display: block;
		width: 300px;
		margin: 0 auto;
	}
	
	/* 住宅改修・リフォーム
	---------------------------------------------------------------*/
	#renovation{background-image:url("../images/renovation_bgSP.webp");}
	.renovation_li li{
		width: 90%;
		margin: 0 auto;
	}
	.renovation_li li:not(:last-child){margin-bottom: 30px;}
	
	.insurance_about > div{width: 100%;}
	.insurance_about > img{margin: 0 0 20px;}
	.insurance_table colgroup,.insurance_table thead{display: none;}
	.insurance_table table,.insurance_table tbody,.insurance_table tbody *{display: block;}
	.insurance_table td::before{
 		content: attr(data-label);
 		font-weight: bold;
 		margin-bottom: 5px;
		display: block;
	}
	.insurance_table table::before,.insurance_table table::after{display: none;}
	.insurance_table th{
		color: #33a981;
		font-size: 16px;
		margin-bottom: 15px;
	}
	.insurance_table tbody tr:not(:last-child){background: radial-gradient(circle, #33a981 0.5px, transparent 1px) center bottom / 6px 6px repeat-x;}
	.insurance_table tbody tr td{padding: 0 0 15px;}
	.insurance_table tbody tr:not(:last-child) td:last-child{
		padding-bottom: 25px;
		margin-bottom: 25px;
	}
	.insurance_table tbody tr:last-child td:last-child{padding-bottom: 0;}
}

/* 500px以下から
------------------------------------------*/
@media only screen and (max-width:500px){
	body{min-width: inherit!important;width: 100%;}
	
	.rental-li li{
		width: 90%;
		margin: 0 auto;
	}
	.rental-li li:not(:last-child){margin-bottom: 30px;}
	.faq-box dl > div{padding: 25px 15px;}	
	.insurance_box{padding: 90px 3% 80px;}
	.insurance_table{padding: 35px 15px 15px;}
	.disease-li li{margin: 1.5% 0.8%;}
}
