.after-service,
.flow{
	max-width: 1100px;
	margin: 0 auto;
}
/* .ttl02{
	font-size: 26px;
	font-weight: bold;
	background: #F5F4F4;
	padding: 20px;
	margin: 80px 0 40px;
} */
.ttl02 {
    padding: 24px ;
    font-size: 26px;
    background: #fee6ae;
    color: #000;
    line-height: 1;
    width:100%;
/*     border:3px solid #0c295b; */
    outline: 1px solid #fff; /* 線幅、線のスタイル、カラー */
outline-offset: -10px; /* 対象の要素からの距離、マイナス(内側)にも対応 */
/* padding:2%; */
text-align: center;
line-height: 1.8;
	margin: 40px 0 20px;
}
/* .ttl03{
	font-size: 20px;
	font-weight: bold;
	border: 1px solid #707070;
	background: #FFF;
	padding: 10px;
	margin: 60px 0 20px;	
} */
.ttl03{
    background: #007a66;
    font-size: 22px;
    margin:40px 0 20px;
     color: #fff; 
    border-left: 4px solid #d4dade;
    padding: 10px;
    line-height: 1;
}
.ttl04{
	font-size: 18px;
	font-weight: bold;
	border-bottom: 3px solid #707070;
	padding-bottom: 1rem;
	margin-bottom: 20px;
}
.after-service p,
.flow p{
	font-size: 16px;
	margin-top: 10px;
}

/*----------------------

aftet-service

----------------------*/

.after-service .copy{
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	line-height: 1.8;
	padding: 60px;
	    margin-bottom: 30px;
}
.after-service .link-list{
	max-width: 1100px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 auto;
}
.after-service .link-list li{
	width: 20%;
	max-width: 200px;
	height: 130px;
}
.after-service .link-list li a{
	background:#b7c3ca;
	width: 100%;
	height: 100%;
	font-size: 18px;
	color: #000;
	text-align: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: .3s;
}
.after-service .link-list li a:hover{
	text-decoration: none;
	background: #007a66;
    color: #fff;
}
.after-service .service{
	margin-bottom: 200px;
}
.after-service .service .inner{
	margin: 100px 0;
}
.after-service .service .listarea{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 40px;
}
.after-service .service .listarea .list{
	width: 25%;
	background: #F5F4F4;
	border:1px solid #707070;
	position: relative;
}
.after-service .service .listarea dl+dl{
	margin-left: 2%;
}
.after-service .service .listarea01 .list:first-child::before{
	content: "";
	width: 330px;
	height: 72px;
	background: url("/wpcms/wp-content/themes/nakayashiki/img/after-service/img-after-before.png") no-repeat;
	background-size: contain;
	display: inline-block;
	position: absolute;
	top: -74px;
}
.after-service .service .listarea01 .list:first-child::after{
	display: none;
}
.after-service .service .listarea .list::after{
	content: "";
	width: 23px;
	height: 23px;
	background: url("/wpcms/wp-content/themes/nakayashiki/img/after-service/icon-right.png") no-repeat;
	background-size: contain;
	display: inline-block;
	position: absolute;
	top: 0;
	left: -41.5px;
	bottom: 0;
	margin: auto;
}
.after-service .service .listarea .list dt{
	background: #007a66;
	color: #FFF;
	font-size: 16px;
	text-align: center;
	padding: 10px;
}
.after-service .service .listarea .list dd{
	font-size: 16px;
	padding: 10px;
}
/*
.after-service .service .listarea02{
	margin-left: 40px;
}
.after-service .service .listarea02 .list{
	width: 25%;
}*/

.after-service .service .listarea01 .list-last{
	width: 10%;
	background: #555151;
	color: #FFF;
	font-size: 16px;
	text-align: center;
	display: inline-flex;
	align-items: center;
	padding: 10px;
	margin: 0;
	position: relative;
}
.after-service .service .listarea01 .list-last::after{
	content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    top: 0;
    left: -24px;
    bottom: 0;
    margin: auto;
	border-top: 30px solid transparent;
	border-right: 30px solid #555151;
	border-bottom: 30px solid transparent;
}
.after-service .point{
	width: 100%;
  padding: 10px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.after-service .point .list{
	width: 28%;
}
.after-service .point .list dt{
	background:#007a66;
	color: #FFF;
	font-weight: bold;
	padding: 10px;
}
.after-service .point .list dd{
	background: #F5F4F4;
	border:1px solid #707070;
	padding: 0 10px;	
}
.after-service .check-list li{
	font-weight: bold;
	margin: 1.5rem 0 1.5rem 2.5rem;
	position: relative;
}
.after-service .check-list li::before{
	content: "";
	background: url("/wpcms/wp-content/themes/nakayashiki/img/after-service/icon-check.png") no-repeat;
	background-size: cover;
	width: 30px;
	height: 30px;
	display: inline-block;
	position: absolute;
	top: -8px;
	left: -2.5rem;
}
.after-service .point .tablearea{
	width: 70%;
	position: relative;
}
.after-service .point .tablearea::before{
	content: "";
	background: url(/wpcms/wp-content/themes/nakayashiki/img/after-service/icon-bottom.png) no-repeat;
	background-size: cover;
	width: 35px;
	height: 35px;
	position: absolute;
	top: -65px;
	left: 150px;	
}
.after-service .point .tablearea img{
	width: 100%;
	height: auto;	
}
.after-service .tablearea .table01{
	width: 55%;
	background: #FFF;
	border: 3px solid #707070;
	padding: 15px;
	position: absolute;
	top: 190px;
	right: 0;
}
.after-service .tablearea .table01::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  top: -30px;
  right: 40px;
  border-right: 30px solid transparent;
  border-bottom: 30px solid #707070;
  border-left: 30px solid transparent;
}
.after-service .tablearea .table01::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  top: -26px;
  right: 40px;
  border-right: 30px solid transparent;
  border-bottom: 30px solid #FFF;
  border-left: 30px solid transparent;
}
.after-service .tablearea .table01 .img{
	width: 200px;
	height: auto;
}
.after-service .tablearea .table01 .col02{
	display: flex;
}
.after-service .tablearea .table01 img{
	width: 100%;
	height: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.after-service .tablearea .table01 .ttl{
	margin: 0;
	font-weight: bold;
	margin-left: 10px;
}
.after-service .tablearea .table02{
	width: 40%;
}
.after-service .tablearea .table02 p {
    font-size: 11px;
    text-align: left;
    color: #000;
    background: none;
}
.after-service .tablearea .btn-link a{
	color: #FFF;
	background: #817F7F;
	border: 4px solid #FFF;
	border-radius: 20px;
	box-shadow: 0 6px 6px rgba(0,0,0,0.16);
	display: inline-block;
	padding: 5px 40px;
	margin: 5px 0;
	transition: .3s;
}
.after-service .tablearea .btn-link a:hover{
	background: #000;
	text-decoration: none;
}
.after-service .system .jhs{
	display: flex;
	margin: 60px;
}
.after-service .system .jhs .img{
	width: 70%;
	margin-right: 20px;
}
.after-service .system .jhs img{
	width: 100%;
	height: auto;
}
.after-service .system .jhs .txt{
	margin: 0;
}
.after-service .system .inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
}
.after-service .system .img{
	width: 70%;
}
.after-service .system img{
	width: 100%;
	height: auto;
}
.after-service .list-white{
	width: 28%;
	background: #FFF;
	border: 3px solid #707070;
	padding: 20px;
	margin-right: 10px;
}
.after-service .list-white dt{
	font-size: 16px;
	font-weight: bold;
	border-bottom: 3px solid #707070;
	padding-bottom: 10px;
}
.after-service .sink{
	display: flex;
	flex-wrap: wrap;
	margin: 40px 0;
}
.after-service .sink .imgarea{
	width: 70%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.after-service .sink .img{
	width: 49%;
	height: auto;
}
.after-service .sink img{
	width: 100%;
	height: auto;
}
.after-service .support .list{
	display: flex;
	flex-wrap: wrap;
}
.after-service .support .list li{
	width: 50%;
	box-sizing:border-box;
	padding: 20px;
}
.after-service .support .imgarea-col02{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 20px 0;
}
.after-service .support .imgarea-col02 .img{
	width: 48%;
}
.after-service .support .imgarea-col02 .img-long{
	width: 38%;
	height: auto;
}
.after-service .support .imgarea-col02 img{
	width: 100%;
	height: auto;
}
.after-service .support .imgarea-col01 .img{
	width: 100%;
	margin-top: 20px;
}
.after-service .support figcaption{
	margin-top: 10px;
}
.after-service .support .check-list{
	width: 50%;
	height: 100%;
	background: #FFF;
	border: 3px solid #707070;
	padding: 10px;
	margin-right: 10px;
}
.after-service .support .check-list li{
	width: auto;
	padding: 0;
}
.after-service .siro .inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.after-service .siro .img{
	width: 70%;
}
.after-service .siro img{
	width: 100%;
	height: auto;
}
.after-service .inspection p{
	margin-bottom: 40px;
}
.after-service .treatment{
	position: relative;
}
.after-service .treatment .col02{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
.after-service .treatment .col02 .txtarea{
	width: 48%;
}
.after-service .treatment .col02 .img{
	width: 50%;
}
.after-service .treatment img{
	width: 100%;
	height: auto;
}
.after-service .treatment figcaption{
	margin-top: 10px;
}
.after-service .treatment .list{
	margin-bottom: 40px;
}
.after-service .treatment .list dt{
	font-size: 16px;
	font-weight: bold;
	margin: 20px 0 5px;
}
.after-service .treatment .list dd{
	font-size: 16px;
}
.after-service .treatment .list dd::before{
	content: "・";
}
.after-service .treatment .imgarea{
	max-width: 900px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 40px 0;
}
.after-service .treatment .imgarea .img{
	width: 30%;
}
.after-service .insurance .read{
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	line-height: 1.8;
	padding-bottom: 40px;
	margin: 0;
}
.after-service .insurance ul{
	display: flex;
	align-items: center;
	margin-bottom: 60px;
}
.after-service .insurance .list01 li:first-child{
	margin-left: 0;
}
.after-service .insurance .list01 li:first-child::before{
	display: none;
}
.after-service .insurance .list01 li:first-child,
.after-service .insurance .list02 li:last-child{
	background: #FFF;
	color: #000;
	border: 3px solid #707070
}
.after-service .insurance .list02 li:first-child::after{
	content: "";
	width: 200px;
	height: 110px;
	background: url("/wpcms/wp-content/themes/nakayashiki/img/after-service/img-fukidashi.png");
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	top: -85px;
	left: -160px;
	bottom: 0;
	margin: auto;
}
.after-service .insurance li{
	width: 180px;
	height: 100px;
	background: #007a66;
	border: 3px solid #007a66;
	font-size: 16px;
	color: #FFF;
	font-weight: bold;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.after-service .insurance li{
	margin-left: 50px;
	position: relative;
}
.after-service .insurance li::before{
	content: "";
	width: 20px;
	height: 20px;
	background: url("/wpcms/wp-content/themes/nakayashiki/img/after-service/icon-right.png");
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	top: 0;
	left: -40px;
	bottom: 0;
	margin: auto;
}
.after-service .insurance .list02{
	display: flex;
	justify-content: flex-end;
}
.after-service .insurance .box{
	max-width: 900px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	border: 3px solid #707070;
	padding: 20px;
}
.after-service .insurance .txtarea{
	width: 60%;
}
.after-service .insurance .imgarea{
	width: 25%;
	margin-right: 40px;
}
.after-service .insurance .ttl04{
	margin: 0;
}
.after-service .insurance img{
	width: 100%;
	height: auto;
}
.after-service .insurance .txt-bold{
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 30px;
}
.after-service .insurance .img{
	width: 380px;
	margin-top: 30px;
}
.after-service .uchiraku .inner{
	background:#007a66;
	margin: 40px 0;	
}
.after-service .uchiraku .img{
	width: 70%;
	padding: 100px;
	margin: 0 auto;
	box-sizing: border-box;
}
.after-service .uchiraku img{
	width: 100%;
	height: auto;
}
.after-service .uchiraku .btn-link{
	text-align: center;
}
.after-service .uchiraku .btn-link a{
	color: #000;
	background: #ffe6a6;
	border: 4px solid #FFF;
	border-radius: 10px;
	box-shadow: 0 6px 6px rgba(0,0,0,0.16);
	display: inline-block;
	padding: 10px 50px;
	margin: 5px 0;
	transition: .3s;
}
.after-service .uchiraku .btn-link a:hover{
	background: #007a66;
	text-decoration: none;
	color: #fff;
}
/*----------------------

flow

----------------------*/
.flow img{
	width: 100%;
	height: auto;
}
.flow .txt{
	font-size: 24px;
	text-align: center;
}
.flow .main-img{
	width: 100%;
	margin: 60px 0;
}
.flow .proces{
	margin: 40px 0;
}
.flow .process .contents{
	position: relative;
}
.flow .process .contents .ttl03{
	min-width: 540px;
	max-width: 540px;
	position: absolute;
	top: -40px;
	left: 560px;
	z-index: 10;
	box-sizing: border-box;
	margin-top: 40px;
}
.flow .process .contents .txtarea{
	min-width: 540px;
	max-width: 540px;
	position: absolute;
	top: 70px;
	left: 560px;
}
.flow .process .contents .imgarea{
	width: 50%;
	margin-bottom: 60px;
}
.flow .process .contents .img{
	width: 100%;
	height: 300px;
	overflow: hidden;
	position: relative;
}
.flow .process .contents .img img{
	width: 100%;
	height: 300px;
	object-fit: contain;
}
.flow .process .contents .linkarea{
	display: inline-block;
	margin-top: 26px;
	margin-right: 12px;
}
.flow .txtarea p.last{
  margin-top: 8px !important;
  margin-bottom: 24px !important;
}
.flow .process .contents::after{
  content: "";
  clear: both;
  display: block;
  line-height: 0;
  font-size: 0;
  
}
.flow .process .contents .linkarea a{
	color: #000;
	text-decoration: underline;
}
.flow .process .contents .linkarea a:hover{
	color: #00F;
}
.flow .process .contents .linkarea a:before{
	content: "→";
}
@media screen and (max-width: 768px){
	.after-service,
	.flow{
		max-width: auto;
		padding: 15px;
	}
	.after-service .br-pc{
		display: none;
	}
	.ttl02{
		font-size: 20px;
		padding: 10px;
		margin: 40px 0 20px;
	}
	.ttl03{
		font-size: 18px;
		margin: 40px 0 10px;	
	}
	.ttl04{
		margin: 0 0 10px;
	}
	.after-service .copy{
		font-size: 16px;
		padding: 20px;
	}
	.after-service .link-list li{
		width: 100%;
		max-width: 100%;
		height: auto;
		margin-bottom: 10px;
	}
	.after-service .link-list li a{
		padding: 10px;		
	}
	.after-service .service{
		margin-bottom: 60px;
	}
	.after-service .service .inner{
		margin: 100px 0 40px;
	}
	.after-service .service .listarea{
		display: block;
	}
	.after-service .service .listarea .list{
		width: 100%;
		border:1px solid #707070;
		position: relative;
	}
	.after-service .service .listarea dl+dl{
		margin-left: 0;
		margin-top: 40px;
	}
	.after-service .service .listarea01 .list:first-child::before{
		width: 100%;
		background-size: cover;
		top: -76px;
	}
	.after-service .service .listarea .list::after{
		content: "";
		width: 23px;
		height: 23px;
		background: url("/wpcms/wp-content/themes/nakayashiki/img/after-service/icon-right.png") no-repeat;
		background-size: contain;
		transform: rotate(90deg);
		position: absolute;
		top: -35px;
		left: 0;
		right: 0;
		bottom: auto;
		margin: auto;
	}
	.after-service .service .listarea .list dt{
		font-size: 16px;
		text-align: center;
		padding: 10px;
	}
	.after-service .service .listarea .list dd{
		font-size: 16px;
		padding: 10px;
	}
	/*.after-service .service .listarea02{
		margin-left: 0;
	}
	.after-service .service .listarea02 .list{
		width: 100%;
	}*/
	.after-service .service .listarea01 .list-last{
		width: 100%;
		display: block;
		padding: 20px;
		margin-top: 30px;
		box-sizing: border-box;
	}
	.after-service .service .listarea01 .list-last::after{
	    display: block;
	    top: -50px;
	    left: 0;
	    right: 0;
	    bottom: auto;
		border-right: 30px solid transparent;
		border-bottom: 30px solid #555151;
		border-left: 30px solid transparent;
	}
	.after-service .point{
		display: block;
      border: none;
      padding: 0;
	}
	.after-service .point .list{
		width: 100%;
		margin: 0 0 40px;
   	}
	.after-service .point .list dt{
		padding: 10px;
	}
	.after-service .point .list dd{
		padding: 0 10px;	
	}
	.after-service .point .tablearea{
		width: 100%;
		margin-top: 70px;
	}
	.after-service .point .tablearea::before{
		top: -55px;
		left: 0;
		right: 0;
		margin: auto;	
	}
	.after-service .tablearea .table01{
		width: 100%;
		position: relative;
		top: 0;
		box-sizing: border-box;
		margin-top: 40px;
	}
	.after-service .tablearea .table01 .img{
		width: 140px;
	}
	.after-service .tablearea .table01 .col02{
		display: block;
	}
	.after-service .tablearea .table01 .ttl{
		margin-top: 10px;
		margin-left: 0;
	}
	.after-service .tablearea .table02{
		width: 100%;
	}
	.after-service .tablearea .btn-link{
		text-align: center;
	}
	.after-service .system .jhs{
		display: block;
		margin: 0;
	}
	.after-service .system .jhs .img{
		width: 60%;
		margin: 40px auto;
	}
	.after-service .system .jhs .txt{
		margin: 0;
	}
	.after-service .system .inner{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-end;
	}
	.after-service .system .img{
		width: 100%;
	}
	.after-service .list-white{
		width: 100%;
		margin-right: 0;
		box-sizing: border-box;
	}
	.after-service .sink{
		display: block;
		margin: 20px 0;
	}
	.after-service .sink .imgarea{
		width: 100%;
	}
	.after-service .sink .img{
		margin-top: 20px;
	}
	.after-service .support .list{
		display: block;
	}
	.after-service .support .list li{
		width: 100%;
		box-sizing:border-box;
		padding: 20px 0;
	}
	.after-service .support .imgarea-col02{
		display: block;
		margin: 20px 0;
	}
	.after-service .support .imgarea-col02 .img{
		width: 100%;
	}
	.after-service .support .imgarea-col02 .img-long{
		width: 80%;
		margin: 0 auto 20px;
	}
	.after-service .support .imgarea-col01 .img{
		width: 100%;
	}
	.after-service .support .check-list{
		width: 100%;
		box-sizing: border-box;
	}
	.after-service .support .check-list li{
		width: auto;
		padding: 0;
	}
	.after-service .siro .inner{
		display: block;
	}
	.after-service .siro .img{
		width: 100%;
	}
	.after-service .treatment .col02{
		display: block;
	}
	.after-service .treatment .col02 .txtarea{
		width: 100%;
	}
	.after-service .treatment .col02 .img{
		width: 100%;
		margin-bottom: 40px;
	}
	.after-service .treatment .list dt{
		margin: 10px 0 5px;
	}
	.after-service .treatment .imgarea{
		display: block;
		margin: 0;
	}
	.after-service .treatment .imgarea .img{
		width: 100%;
		margin-bottom: 30px;
	}
	.after-service .insurance .read{
		font-size: 16px;
	}
	.after-service .insurance ul{
		display: block;
	}
	.after-service .insurance .list01 li:first-child{
		margin-left: 0;
	}
	.after-service .insurance .list01 li:first-child::before{
		display: none;
	}
	.after-service .insurance .list02 li:first-child::after{
		top: -120px;
		left: -5px;
	}
	.after-service .insurance li{
		width: 180px;
		height: 100px;
		background: #007a66;
		border: 3px solid #007a66;
		font-size: 16px;
		color: #FFF;
		font-weight: bold;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	.after-service .insurance li{
		width: 100%;
		position: relative;
		margin-left: 0;
		margin-bottom: 40px;
		box-sizing: border-box;
	}
	.after-service .insurance li::before{
		background-size: contain;
		transform: rotate(90deg);
		top: -35px;
		left: 0;
		right: 0;
		bottom: auto;
	}
	.after-service .insurance .list02{
		display: block;
		margin-bottom: 20px;
	}
	.after-service .insurance .box{
		display: block;
	}
	.after-service .insurance .txtarea{
		width: 100%;
	}
	.after-service .insurance .imgarea{
		width: 80%;
		margin: 30px auto 0;
	}
	.after-service .insurance .img{
		width: 100%;
	}
	.after-service .uchiraku .img{
		width: 100%;
		padding: 30px;
	}
	/*----------------------

	flow

	----------------------*/
	.flow .txt{
		font-size: 16px;
	}
	.flow .ttl03{
		margin-top: 40px;
	}
	.flow .main-img{
		margin: 20px 0;
	}
	.flow .proces{
		margin: 40px 0;
	}
	.flow .process .contents{
		position: relative;
	}
	.flow .process .contents .ttl03{
		min-width: 100%;
		max-width: 100%;
		position: relative;
		left: 0;
		top: 0;
	}
	.flow .process .contents .imgarea{
		width: 100%;
		margin-bottom: 10px;
	}
	.flow .process .contents .img{
		width: 100%;
		height: 200px;
		overflow: hidden;
		position: relative;
	}
	.flow .process .contents .img img{
		width: 100%;
		height: 200px;
	}
	.flow .process .contents .txtarea{
		min-width: 100%;
		max-width: 100%;
		position: relative;
		top: 0;
		left: 0;
	}
	.flow .process .contents .txtarea .inner{
		padding: 0 0 20px;
	}
	.flow .process .contents .linkarea{
		display: block;
		margin-top: 15px;
		margin-right: 0;
	}
	.sp_only.graph table {
    border: 1px solid;
    border-collapse: collapse;
    width: 90%;
    margin: 20px auto;
}
.sp_only.graph table th {
    padding: 10px 20px;
    background: #ccc;
    text-align: center;
        width: 40%;
    border: 1px solid;
}
.sp_only.graph table td {
    padding: 10px 20px;
    text-align: center;
    border: 1px solid;
    font-size: 16px;
}
}

@media screen and (max-width: 768px){
.flow_graph{
	background: #efefef;
	padding: 20px;
}
.flow_graph table th {
    background: #007a66;
    padding: 10px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    border: 1px solid #ccc;
    border-collapse: collapse;
}
.flow_graph table td {
    padding: 10px;
    text-align: center;
    font-size: 14px;
    border: 1px solid #ccc;
    background: #fff;
    border-collapse: collapse;
}
.flow_graph table {
    margin-top: 20px;
    border: 1px solid #ccc;
    border-collapse: collapse;
    width: 100%;
    text-align: center;
}
}