@charset "UTF-8";


/*****************************************************
　ページメインビジュアル　
*****************************************************/
.page_main-visual_inner{
	background:url('../img/kojinin/main-visual.jpg') no-repeat center center;
	background-size:cover;
	-webkit-background-size:cover;
}


/*****************************************************
　リード文 
*****************************************************/
.lead{
	text-align:center;
	margin:100px 0;
}
.lead p{
	font-size:15px;
	font-size:1.5rem;
	line-height:1.9;
	letter-spacing:0.18em;
	color:#4e4e4e;
}
.lead p + p{
	margin:1.5em 0 0;
}
.lead .img{
	margin:50px 0 0;
	text-align:center;
}


/*****************************************************
　共通 
*****************************************************/
/* スライダー 
------------------------------------------------- */
.sample_itemlist{
	padding:0 35px;
	display:flex;
	justify-content:space-between;
}
.sample_itemlist.slick-dotted.slick-slider{
	margin-bottom:125px;
}
.sample_itemlist .sample_item{
	max-width:220px;
	width:21%;
	margin:0 30px;
}
/* ----- 矢印 ----- */
.sample_itemlist .slick-prev,
.sample_itemlist .slick-next{
	/*width:24px;*/
	width:2.1%;
	height:52px;
	top:24%;
}
.sample_itemlist .slick-prev:before,
.sample_itemlist .slick-next:before{
	content:'';
	width:100%;
	height:100%;
	display:block;
}
.sample_itemlist .slick-prev:before{
	background:url('../img/common/arrow_24x52_reverse.svg') no-repeat center center;
	background-size:contain;
	-webkit-background-size:contain;
}
.sample_itemlist .slick-next:before{
	background:url('../img/common/arrow_24x52.svg') no-repeat center center;
	background-size:contain;
	-webkit-background-size:contain;
}
.sample_itemlist .slick-prev{
	left:0;
}
.sample_itemlist .slick-next{
	right:0;
}
/* ----- ドット ----- */
.sample_itemlist .slick-dots{
	margin:45px 0 0;
	position:static;
}
.sample_itemlist .slick-dots li button,
.sample_itemlist .slick-dots li button:before{
	font-size:100%;
}
.sample_itemlist .slick-dots li button:before{
	transition:all 0.3s ease-out;
}
/* 完成までの流れ 
------------------------------------------------- */
.flow{
	margin:0 auto;
	max-width:906px;
	width:100%;
}
/* ----- タイトル ----- */
.flow .ttl{
	font-size:34px;
	font-size:3.4rem;
	font-weight:normal;
	letter-spacing:0.28em;
	line-height:1.8;
	margin:0 0 45px;
	text-align:center;
}
/* ----- .flow_itemlist ----- */
.flow_itemlist .flow_item{
	align-items:center;
	display:flex;
	padding:33px 55px 28px 100px;
}
.flow_itemlist .flow_item + .flow_item{
	border-top:1px solid #707070;
}
.flow_itemlist .flow_item .num{
	position:relative;
	width:70px;
}
.flow_itemlist .flow_item .num:after{
	background:#000;
	content:'';
	display:block;
	height:44px;
	position:absolute;
	right:-35px;
	top:50%;
	transform:translate(0,-50%) rotate(45deg);
	width:1px;
	z-index:0;
}
.flow_itemlist .flow_item .img{
	margin:0 29px 0 74px;
	width:71px;
}
.flow_itemlist .flow_item .txt{
	font-size:21px;
	font-size:2.1rem;
	letter-spacing:0.28em;
	line-height:1.6;
}
.flow .notice{
	font-size:15px;
	font-size:1.5rem;
	letter-spacing:0.18em;
	line-height:1.7;
	margin:29px 0 42px;
	text-align:center;
}
/* ----- 表 ----- */
.flow .in-block_table{
	margin:0 auto;
	max-width:585px;
	width:100%;
}
.flow .in-block_table thead th{
	font-size:18px;
	font-size:1.8rem;
	letter-spacing:0.18em;
}
.flow .in-block_table thead th span{
	font-size:11px;
	font-size:1.1rem;
	letter-spacing:0.18em;
}
.flow .in-block_table tbody th,
.flow .in-block_table tbody td{
	text-align:left;
}
.flow .in-block_table tbody th{
	padding:15px 35px;
	width:63%;
}
.flow .in-block_table tbody td{
	padding:15px 25px;
	width:37%;
}


/*****************************************************
　３人の匠による表札・看板 
*****************************************************/
/* タイトル 
------------------------------------------------- */
.takumi .section-ttl_border br.sp{
	display:none;
}
/* .takumi-list 
------------------------------------------------- */
.takumi-list{
	align-items:center;
	display:flex;
	justify-content:space-between;
	margin:60px auto 50px;
	max-width:930px;
	width:100%;
}
.takumi-list .takumi_item{
	max-width:249px;
	width:27%;
}
.takumi-list .takumi_item .img{
	text-align:center;
}
.takumi-list .takumi_item + .takumi_item .img{
	position:relative;
}
.takumi-list .takumi_item + .takumi_item .img:before{
	background:url('../img/nameplate-signboard/kakeru.png') no-repeat center center;
	background-size:contain;
	-webkit-background-size:contain;
	content:'';
	display:block;
	height:60px;
	left:-60px;
	position:absolute;
	top:50%;
	transform:translate(0,-50%);
	width:36px;
	z-index:0;
}
.takumi-list .takumi_item .ttl{
	font-size:24px;
	font-size:2.4rem;
	font-weight:normal;
	letter-spacing:0.28em;
	line-height:1.8;
	margin:20px 0 0;
	text-align:center;
}
.takumi-list .takumi_item .ttl span{
	color:#4e4e4e;
	display:block;
	font-size:20px;
	font-size:2.0rem;
	letter-spacing:0.18em;
	margin:0 0 5px;
}
/* テキスト 
------------------------------------------------- */
.takumi > .text{
	color:#4e4e4e;
	font-size:15px;
	font-size:1.5rem;
	letter-spacing:0.18em;
	line-height:1.8;
	margin:0 0 85px;
	text-align:center;
}


/*****************************************************
　アンカーリンク 
*****************************************************/
.anchor-link{
	display:flex;
	justify-content:center;
	list-style-type:none;
}
.anchor-link li{
	font-size:21px;
	font-size:2.1rem;
	letter-spacing:0.28em;
}
.anchor-link li + li:before{
	content:'/';
	font-size:21px;
	font-size:2.1rem;
	letter-spacing:0.28em;
	margin:0 0.5em;
}


/*****************************************************
　表札 
*****************************************************/
.nameplate{
	margin:95px 0 0;
}
/* テキスト 
------------------------------------------------- */
.nameplate > .inner > .text{
	color:#4e4e4e;
	font-size:15px;
	font-size:1.5rem;
	letter-spacing:0.18em;
	line-height:1.8;
	margin:60px 0 55px;
	text-align:center;
}


/*****************************************************
　看板 
*****************************************************/
.signboard{
	margin:135px 0 115px;
}
/* テキスト 
------------------------------------------------- */
.signboard > .inner > .text{
	color:#4e4e4e;
	font-size:15px;
	font-size:1.5rem;
	letter-spacing:0.18em;
	line-height:1.8;
	margin:60px 0 55px;
	text-align:center;
}
/* 完成までの流れ 
------------------------------------------------- */
/* ----- .flow_itemlist ----- */
.signboard .flow_itemlist .flow_item:nth-child(1) .txt{
	font-size:18px;
	font-size:1.8rem;
}


@media screen and (max-width:1024px){
	/*****************************************************
	　リード文 
	*****************************************************/
	.lead{
		text-align:left;
		margin:13.76vw 0;
	}
	.lead p{
		font-size:3.14vw;
	}
	.lead p br.pc{
		display:none;
	}
	.lead .img{
		margin:6.76vw 0 0;
	}


	/*****************************************************
	　共通 
	*****************************************************/
	/* スライダー 
	------------------------------------------------- */
	.sample_itemlist{
		margin:8.45vw 0 0;
		padding:0 3.38vw;
	}
	.sample_itemlist.slick-dotted.slick-slider{
		margin-bottom:17.14vw;
	}
	.sample_itemlist .sample_item{
		max-width:none;
		width:37.68vw;
		/*margin:0 40px;*/
		margin:0 2.65vw;
	}
	.sample_itemlist .sample_item .thumb{
		border:0.24vw solid #f5f5f5;
		margin:0 0 3.62vw;
	}
	.sample_itemlist .sample_item .subttl{
		font-size:2.17vw;
		line-height:1.4;
		margin:0 0 3.62vw;
	}
	.sample_itemlist .sample_item .ttl{
		font-size:2.89vw;
		line-height:2;
	}
	/* ----- 矢印 ----- */
	.sample_itemlist .slick-prev,
	.sample_itemlist .slick-next{
		width:2.41vw;
		height:5.31vw;
	}
	/* ----- ドット ----- */
	.sample_itemlist .slick-dots{
		margin:9.66vw 0 0;
	}
	.sample_itemlist .slick-dots li{
		width:3.62vw;
		height:3.62vw;
		margin:0 1.69vw;
	}
	.sample_itemlist .slick-dots li button:before{
		width:3.62vw;
		height:3.62vw;
		line-height:3.62vw;
	}
	/* 完成までの流れ 
	------------------------------------------------- */
	/* ----- タイトル ----- */
	.flow .ttl{
		font-size:5.79vw;
		margin:0 0 6.03vw;
	}
	/* ----- .flow_itemlist ----- */
	.flow_itemlist .flow_item{
		padding:4.34vw 2.41vw 3.62vw;
	}
	.flow_itemlist .flow_item + .flow_item{
		border-top-width:0.24vw;
	}
	.flow_itemlist .flow_item .num{
		width:9.66vw;
	}
	.flow_itemlist .flow_item .num:after{
		height:6.03vw;
		right:-4.83vw;
		width:0.24vw;
	}
	.flow_itemlist .flow_item .img{
		margin:0 3.86vw 0 10.14vw;
		width:9.66vw;
	}
	.flow_itemlist .flow_item .txt{
		font-size:3.62vw;
		width:calc(100% - 9.66vw - 10.14vw - 9.66vw - 3.86vw);
	}
	.flow_itemlist .flow_item .txt br{
		display:none;
	}
	.flow .notice{
		font-size:3.14vw;
		margin:3.86vw 0 5.79vw;
	}
	/* ----- 表 ----- */
	.flow .in-block_table{
		max-width:none;
	}
	.flow .in-block_table table{
		width:120vw;
	}
	.flow .in-block_table thead th{
		font-size:3.14vw;
	}
	.flow .in-block_table thead th span{
		font-size:1.93vw;
	}
	.flow .in-block_table tbody th{
		padding:1.93vw 4.83vw;
	}
	.flow .in-block_table tbody td{
		padding:1.93vw 3.38vw;
	}


	/*****************************************************
	　３人の匠による表札・看板 
	*****************************************************/
	/* タイトル 
	------------------------------------------------- */
	.takumi .section-ttl_border:before{
		margin:0 8vw 0 0;
	}
	.takumi .section-ttl_border:after{
		margin:0 0 0 8vw;
	}
	.takumi .section-ttl_border br.sp{
		display:block;
	}
	/* .takumi-list 
	------------------------------------------------- */
	.takumi-list{
		display:block;
		margin:8.21vw auto 6.76vw;
	}
	.takumi-list .takumi_item{
		max-width:none;
		width:100%;
	}
	.takumi-list .takumi_item + .takumi_item{
		margin:9.66vw 0 0;
	}
	.takumi-list .takumi_item + .takumi_item .img:before{
		height:8.21vw;
		left:50%;
		top:-9.66vw;
		transform:translate(-50%,0);
		width:4.83vw;
	}
	.takumi-list .takumi_item .ttl{
		font-size:4.83vw;
		margin:2.65vw 0 0;
	}
	.takumi-list .takumi_item .ttl span{
		font-size:3.38vw;
		margin:0 0 0.72vw;
	}
	/* テキスト 
	------------------------------------------------- */
	.takumi > .text{
		font-size:2.89vw;
		margin:0 0 11.59vw;
		text-align:left;
	}
	.takumi > .text br.pc{
		display:none;
	}


	/*****************************************************
	　アンカーリンク 
	*****************************************************/
	.anchor-link li,
	.anchor-link li + li:before{
		font-size:3.62vw;
	}


	/*****************************************************
	　表札 
	*****************************************************/
	.nameplate{
		margin:13.04vw 0 0;
	}
	/* テキスト 
	------------------------------------------------- */
	.nameplate > .inner > .text{
		font-size:2.89vw;
		margin:8.21vw 0 7.48vw;
		text-align:left;
	}
	.nameplate > .inner > .text br.pc{
		display:none;
	}


	/*****************************************************
	　看板 
	*****************************************************/
	.signboard{
		margin:18.35vw 0 15.7vw;
	}
	/* テキスト 
	------------------------------------------------- */
	.signboard > .inner > .text{
		font-size:2.89vw;
		margin:8.21vw 0 7.48vw;
		text-align:left;
	}
	.signboard > .inner > .text br.pc{
		display:none;
	}
	/* 完成までの流れ 
	------------------------------------------------- */
	/* ----- .flow_itemlist ----- */
	.signboard .flow_itemlist .flow_item:nth-child(1) .txt{
		font-size:3.14vw;
	}
}

