@charset "utf-8";
/* CSS Document */

.conA{
	padding-top: 84px;
}

.conA .container{
	max-width: 1100px;
	margin: 0 auto 100px;
	height: 80vh;
	
}

.conA-menu{
	display: flex;
	justify-content: center;
	align-items: center;
}


.conA-menu ul{
	display: flex;
	flex-flow: column;
	gap:20px;
	width: 90%;

}




.conA-menu a{
	display: block;
	width: 100%;
	height: 100%;
	background:#3675bb;
	color: #fff;
	font-size: 16px;
	border-bottom-left-radius: 50px;
	border-bottom-right-radius: 50px;
	border-top-left-radius: 50px;
	border-top-right-radius: 50px;
	padding: 0.8em 3em;
	box-sizing: border-box;
	
	position: relative;
  display: block;
  overflow: hidden;
  transition: 0.5s;

}

.conA-menu a::after{

  font-family: "FontAwesome";
  content: "\f105";
  position: absolute;
	top:16px;
  right: 20px;
  transition: all 0.2s;
	font-weight: 300;

}

.conA-menu a:hover::after{
  right: 15px;
}



.conA-img{
	background-image:url("../img/index/main.jpg");
	height: 65%;
	background-position: center center;
	position: relative;
	margin-bottom: 20px;
}


.conA-img .text{
	position: absolute;
	right: 10px;
	bottom: 10px;
	font-weight: 700;
	text-shadow:
    -1px -1px 0 white, /* 左上 */
     1px -1px 0 white, /* 右上 */
    -1px  1px 0 white, /* 左下 */
     1px  1px 0 white, /* 右下 */
     0 0 5px white, /* 軽いぼかし */
     0 0 10px white; /* 強めのぼかし */
	font-size: 18px;
		
	
}



@media print, screen and (min-width: 768px){
	
	.conA{
	padding-top:150px;
}
	
	.conA .container{
		display: flex;
		flex-direction: row-reverse;
		height: 400px;
		margin-bottom: 80px;
	}
	
	.c-midashi{
		font-size: 24px;
	}
	
	.conA-img{
		width: 60%;
		border-top-left-radius: 50px;
		border-bottom-left-radius: 50px;
		height: 100%;
		margin-bottom: 0;
	}
	
	
	.conA-menu{
		width: 40%;
	}
	
	
	.conA-menu ul{
		gap:30px;
		width: 80%;
	}
	
	.conA-menu a{
		font-size: 21px;
		letter-spacing: 0.1em;
	}
	
	.conA-menu a::after{
	top:20px;
}

	
.conA-img .text{
	font-size: 28px;
		
	
}	
	
	
}



/*お知らせ*/


.info .container{
	max-width: 960px;
	margin: 0 auto 80px;
}


.info table{
	width: 90%;
	max-width: 800px;
	margin: 0 auto;
}


.info th{
	
	padding: 0.5em 0.5em 0 0.5em;
	box-sizing: border-box;
	text-align: left;
	font-weight: normal;
	display: block;
	font-weight: bold;
	
}

.info td{
	border-bottom: 1px dashed #3675bb;
	padding: 0.1em 0.5em 0.5em 1em;
	box-sizing: border-box;
	display: block;
}


@media print, screen and (min-width: 768px){
	
	.info .container{
		margin-bottom: 100px;
	}	
	
.info th{
	padding:0.8em 1em;
	box-sizing: border-box;
	text-align: left;
	font-weight: normal;
	display: table-cell;
	width: 20%;
	white-space: nowrap;
	border-bottom: 1px dashed #3675bb;
}
	
.info td{
	display: table-cell;
	width: 70%;
	padding: 0.5em;
}	
	
	
	
}



/*サービス内容*/


.conB .container{
	max-width: 1000px;
	margin: 0 auto;
	padding: 1em;
	box-sizing: border-box;
}

.conB h3{
	text-align: center;
	margin-bottom: 0.5em;
	font-weight: 500;
	font-size: 20px;
}

.conB .text{
	margin-bottom: 20px;
}

.conB.service .text{
	margin-bottom: 40px;
}

.conB img{
	display: block;
	width: 90%;
	margin: 0 auto 10px;
}


.text_box{
     text-align:center;
}

.text_box p{
     display:inline-block;
     text-align:left;
}


@media print, screen and (min-width: 768px){
	
.conB .container{
	display: flex;
	gap:30px;
	margin-bottom: 100px;
}	
	
	
	.conB .text{
		flex: 1;
		margin-bottom: 0;
	}
	
	
	.conB h3{
		font-size: 20px;
	}	
	

}


/*料金について*/


.price .container{
	width: 90%;
	max-width: 860px;
	margin: 0 auto 50px;
	border-radius: 20px;
	box-shadow: 0px 0px 5px #a39e9f;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
}

.price01{
	font-weight: 500;
	line-height: 1.6em;
	text-align: center;
	margin-bottom: 20px;
	font-size: 18px;
}

.price02{
	font-weight: 500;
	line-height: 1.6em;
	text-align: center;
	margin-bottom: 20px;
	font-size: 18px;
}

@media print, screen and (min-width: 768px){
	
	
.price .container{
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding:40px 30px;
	margin-bottom: 100px;
}	
	
	
	.price01{
		border-right: 1px solid #3e3a39;
		font-size: 24px;
		padding-right: 1em;
		box-sizing: border-box;
		text-align: left;
	}
	
	.price02{
		font-size: 24px;
		box-sizing: border-box;
		text-align: left;
	}	
	
	
}


/*ご利用の流れ*/


	.conB.flow{
		margin-bottom: 50px;
	}	

.s-box{
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	box-shadow: 0px 0px 5px #a39e9f;
	font-weight: 500;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	background: #fff;
	
}

.s-box img{
	width: 30px;
	margin:0;
	margin-right: 10px;
}

.conB.flow .container{
	
}

@media print, screen and (min-width: 768px){
	
	.conB.flow{
		margin-bottom: 100px;
	}	
	
.conB.flow .container{
	margin-bottom: 20px;
}	
	
	.s-box{
		display: block;
		text-align: center;
		font-size: 18px;
		
	}	

.s-box img{
	width: 80%;
	margin: 0 auto 10px;
}
}


/*せいえいは…画像*/



.conB.seiei .container{
	display: flex;
	flex-wrap: wrap;
}
	
	.conB.seiei .text{
		width: 50%;
	}

@media print, screen and (min-width: 768px){
	

.conB.seiei .container{
	gap:10px;
	flex-wrap: wrap;
	margin-bottom: 30px;
}
	
	
	.conB.seiei .text{
		
	}
	
	.conB.seiei img{
		width: 100%;
	}	
	
}



/*せいえいは…テキスト*/


.post .container{
	width: 90%;
	max-width: 800px;
	margin: 0 auto 50px;
}


@media print, screen and (min-width: 768px){
	
	
.post .container{

}	
	
	
	
	.post .container p{
		font-size: 18px;
		line-height: 1.6em;
	}	

}


/*ご依頼例*/


.kakomi{
	width: 90%;
	max-width: 960px;
	margin: 0 auto 50px;
	background: #e7f0f8;
	border:2px dashed #3675bb;
	padding: 20px;
	box-sizing: border-box;
	border-radius: 10px;
}


.kakomi h2{
	margin-bottom: 1em;
	text-align: center;
	color: #3675bb;
}


.kakomi_in p{
	margin-bottom: 0.8em;
}


@media print, screen and (min-width: 768px){
	
	
	.kakomi{
		padding: 30px 40px 20px;
	}
	
	
	.kakomi h2{
		font-size: 22px;
	}
	
	.kakomi_in{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
	}
	
	.kakomi_in p{
		width: 48%;
		font-size: 16px;
	}
	
}




/*ご相談ください*/

.conB.soudan .container{
	margin-bottom: 30px;
}

	.conB.soudan .text{
		display: flex;
		justify-content: center;
		align-items: center;
		
	}

	.conB.soudan .text.t-large{
		font-size: 20px;
	font-weight: 500;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-bottom: 50px;
		
	}


.conB.soudan img{
	display: block;
	width: 80%;
	margin: 0 auto;
}


@media print, screen and (min-width: 768px){
	
	
	.conB.soudan .container{
		margin-bottom: 60px;
	}	
	
	.conB.soudan .text.t-large{
		font-size: 28px;
		line-height: 1.8em;
		
	}
	
	.conB.soudan .text{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
.conB.soudan img{
	width:auto;
}	
	
	
	
}



/*よくあるご質問*/

.qa .container{
	width: 90%;
	max-width: 960px;
	margin: 0 auto 50px;
	border-radius: 20px;
	box-shadow: 0px 0px 5px #a39e9f;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
}

dl{
	margin-bottom: 20px;
}

dt{
	font-weight: 500;
	margin-bottom: 0.3em;
	font-size: 18px;
}

dd{
	margin-bottom: 1.6em;
	padding-left: 18px;
}


dd:last-child{
	margin-bottom: 0;
}


@media print, screen and (min-width: 768px){
	
	
.qa .container{
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding:40px 30px;
	margin-bottom: 100px;
}
	
	dl{
		margin-bottom: 0;
	}
	
dt{
	font-size: 22px;
}	

	dd{
		font-size: 18px;
		padding-left: 22px;
	}
	
	
}





/*お墓のメンテナンスも*/



.conB.mente{
	background: #f5ecd8;
	margin-bottom: 50px;
	padding-top: 30px;
}


.conB.mente .container{
	padding: 10px 10px 10px;
	box-sizing: border-box;
}


.conB.mente .text{
	padding: 20px;
	box-sizing: border-box;
}

.conB.mente .text p{
	margin-bottom: 2em;
}


.conB.mente h2{
	font-family: "Noto Serif JP", serif;
	margin-bottom: 1em;
}

.conB.mente h2.sm{
	text-align: center;
}


@media print, screen and (min-width: 768px){
	
	.conB.mente{
		margin-bottom: 50px;
	}	
	
.conB.mente h2{
	font-size: 30px;
}	
	
.conB.mente .text{
	padding:10px 40px;
}	
.conB.mente .text p{
	font-size: 18px;
}
	
.conB.mente .container{
	padding: 40px 10px 60px;
}
	
	
	
}




/*メディア情報*/


.post.media .container{
	text-align: center;
}


.m-box p{
	margin-bottom: 1em;
}


.m-box{
	margin-bottom: 50px;
}






@media print, screen and (min-width: 768px){
	

	
	
}