@charset "UTF-8";

@media screen and (max-width: 768px){

/*====================================
下層ページ共通
=====================================*/
#main.sub {

}
/* ページタイトル */
#sub_kv {
	width: 100%;
	height: 15em;
	margin: 0 auto 0;
	padding: 7em 0 0;
	border-bottom: 3px solid #0e3963;
	position: relative;
}
	#sub_kv:before {
		position: absolute;
		content: '';
		display: block;
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0;
		background: rgba(0,0,0,0.4);
		top: 0;
		left: 0;
		z-index: 5;
	}
	#sub_kv.about {
		background: url(../images/sub/about_kv.jpg) center center / cover no-repeat;
	}
	#sub_kv.lumber {
		background: url(../images/sub/about_00.jpg) center center / cover no-repeat;
	}
	#sub_kv.estate {
		background: url(../images/sub/about_01.jpg) center center / cover no-repeat;
	}
	#sub_kv.scaffold {
		background: url(../images/sub/about_02.jpg) center center / cover no-repeat;
	}
	#sub_kv.farm {
		background: url(../images/sub/about_03.jpg) center center / cover no-repeat;
	}
	#sub_kv.koya {
		background: url(../images/sub/about_04.jpg) center center / cover no-repeat;
	}
	#sub_kv.company {
		background: url(../images/sub/company_kv.jpg) center center / cover no-repeat;
	}
	#sub_kv.recruit {
		background: url(../images/sub/recruit_kv.jpg) center center / cover no-repeat;
	}
	#sub_kv.contact {
		background: url(../images/sub/contact_kv.jpg) center center / cover no-repeat;
	}
	#sub_kv h3 {
		margin: 0 auto;
		padding: 0;
		font-size: 7.0vw;
		line-height: 110%;
		font-weight: 700;
		color: #fff;
		font-family: 'Vesper Libre', serif;
		position: relative;
		z-index: 10;
	}
		#sub_kv h3:after {
			position: absolute;
			content: '';
			display: block;
			width: 2em;
			height: 3px;
			margin: 0 auto;
			padding: 0;
			background: #fd924b;
			bottom: 0;
			left: 0;
			right: 0;
		}
	#sub_kv h4 {
		margin: 1% auto 0;
		padding: 0;
		font-size: 4.0vw;
		line-height: 140%;
		font-weight: 300;
		color: #fff;
		position: relative;
		z-index: 10;
	}

	h4.cont_ttl {
		margin: 0 auto;
		padding: 3%;
		font-size: 6.0vw;
		line-height: 140%;
		font-weight: 500;
		font-family: 'Vesper Libre', serif;
		border-top: 1px solid #0e3963;
		border-bottom: 1px solid #0e3963;
	}
		h4.cont_ttl span {
			display: block;
			margin: 0 auto;
			padding: 0;
			font-size: 4.0vw;
			line-height: 140%;
			font-weight: 300;
			font-family: 'Noto Sans JP', sans-serif;
		}
div.contact_btn {
	margin: 3% auto 0;
	padding: 0;
}
	div.contact_btn a {
		display: inline-block;
		width: 60%;
		margin: 0 auto;
		padding: 3% 0;
		font-size: 3.8vw;
		line-height: 160%;
		font-weight: 400;
		color: #fff;
		text-decoration: none;
		background: #0e3963;
		position: relative;
	}
		div.contact_btn a:before {
			position: absolute;
			content:'\f0e0';
			font-family:'Font Awesome 5 Free';
			font-weight:900;
			font-size: 4.4vw;
			top: 50%;
			transform: translateY(-50%);
			-webkit- transform: translateY(-50%);
			left: 5%;
			margin: auto;
		}


/*====================================
About
=====================================*/
div.pic_cont {
	margin: 0 auto;
	padding: 0 3% 0;
}
	div.pic_cont ul {
		margin: 0 auto;
		padding: 0;
		list-style: none;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		align-items: flex-start;
	}
		div.pic_cont ul li {
			display: inline-block;
			width: 46%;
			margin: 3% 2% 0;
			padding: 0;
		}
			div.pic_cont ul li a img {
				width: 100%;
				height: 8em;
				vertical-align: bottom;
			}
				div.pic_cont ul li a img.object-fit-img {
					object-fit: cover;
					font-family: 'object-fit: cover;'
				}
		div.pic_cont ul li p {
			margin: 1% auto 0;
			padding: 0;
			font-size: 3.4vw;
			line-height: 160%;
		}
div.about_cont {
	margin: 10% auto 0;
	padding: 0 0 10%;
}
	div.about_cont div.about_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}
	div.about_cont div.about_cont_in {
		margin: 0 auto;
		padding: 5% 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
		border-bottom: 1px solid #ccc;
	}
		div.about_cont div.about_cont_in:last-of-type {
			border: none;
		}
		div.about_cont div.about_cont_in .img {
			width: 70%;
			margin: 0 auto;
			padding: 0;
		}
			div.about_cont div.about_cont_in .img img {
				width: 100%;
				height: auto;
			}
		div.about_cont div.about_cont_in .txt {
			width: 100%;
			margin: 0 auto;
			padding: 0;
			text-align: left;
		}
			div.about_cont div.about_cont_in h5 {
				margin: 3% 0 2%;
				padding: 0;
				font-size: 4.0vw;
				line-height: 120%;
				font-weight: 300;
			}
			div.about_cont div.about_cont_in .txt .btn {
				margin: 5% auto 0;
				padding: 0;
				text-align: center;
			}
				div.about_cont div.about_cont_in .txt .btn a {
					display: inline-block;
					width: 60%;
					margin: 0 auto;
					padding: 3% 0;
					font-size: 3.4vw;
					line-height: 160%;
					font-weight: 300;
					color: #333;
					text-decoration: none;
				}
					div.about_cont div.about_cont_in .txt .btn a img {
						display: inline-block;
						width: 2.5em;
						height: auto;
						margin: 0 2% 0 0;
						padding: 0;
						vertical-align: -0.6em;
					}
				div.about_cont div.about_cont_in .txt .btn.btn_lumber a {
					background: rgba(46,17,0,1);
					color: #fff;
				}
				div.about_cont div.about_cont_in .txt .btn.btn_estate a {
					border: 1px solid #000;
				}
				div.about_cont div.about_cont_in .txt .btn.btn_scaffold a {
					background: rgba(253,146,75,1);
				}
				div.about_cont div.about_cont_in .txt .btn.btn_farm a {
					background: rgba(0,135,19,1);
					color: #fff;
				}
				div.about_cont div.about_cont_in .txt .btn.btn_koya a {
					background: rgba(0,174,255,1);
					color: #fff;
				}

div.vision_cont {
	margin: 0 auto;
	padding: 10% 0 15%;
	background: #fff;
}
	div.vision_cont div.vision_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}

div.estate_service_cont,
div.lumber_service_cont {
	margin: 10% auto 0;
	padding: 0 0 10%;
}
	div.estate_service_cont div.service_top,
	div.estate_new_arrival div.service_top,
	div.lumber_service_cont div.service_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
		text-align: left;
	}

div.lumber_performance_cont {
	margin: 0 auto;
	padding: 10% 0 15%;
	background: #fff;
}

div.estate_new_arrival {
	margin: 0 auto;
	padding: 10% 0 10%;
	background: #fff;
}

div.estate_performance_cont {
	margin: 0 auto;
	padding: 10% 0 15%;
}
	div.estate_performance_cont div.performance_top,
	div.lumber_performance_cont div.performance_top {
		margin: 30px auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}

div.scaffold_service_cont {
	margin: 10% auto 0;
	padding: 0 0 10%;
}
	div.scaffold_service_cont div.service_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
		text-align: left;
	}

div.koya_service_cont {
	margin: 10% auto 0;
	padding: 0 0 10%;
}
	div.koya_service_cont div.koya_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}
		div.koya_service_cont div.koya_top .img {
			width: 100%;
			margin: 0 auto;
			padding: 0;
		}
			div.koya_service_cont div.koya_top .img img {
				width: 70%;
				height: auto;
			}
		div.koya_service_cont div.koya_top .txt {
			width: 100%;
			margin: 0;
			padding: 3% 0;
			text-align: left;
		}

div.scaffold_performance_cont {
	margin: 0 auto;
	padding: 10% 0 15%;
	background: #fff;
}
	div.scaffold_performance_cont div.performance_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}

div.farm_service_cont {
	margin: 10% auto 0;
	padding: 0 0 10%;
}
	div.farm_service_cont div.service_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
		text-align: left;
	}

div.farm_performance_cont {
	margin: 0 auto;
	padding: 10% 0 15%;
	background: #fff;
}
	div.farm_performance_cont div.performance_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}

div.koya_performance_cont {
	margin: 0 auto;
	padding: 10% 0 15%;
	background: #fff;
}
	div.koya_performance_cont div.koya_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}
	div.koya_performance_cont div.koya_cont {
		margin: 0 auto;
		padding: 0 3% 0;
	}
		div.koya_performance_cont div.koya_cont dl {
			margin: 0 auto;
			padding: 0;
		}
			div.koya_performance_cont div.koya_cont dl dt {
				width: 100%;
				margin: 10% 0 0;
				padding: 0;
			}
			div.koya_performance_cont div.koya_cont dl dt:first-of-type {
				margin: 5% 0 0;
			}
				div.koya_performance_cont div.koya_cont dl dt a {
					transition: 0.2s linear;
				}
					div.koya_performance_cont div.koya_cont dl dt a:hover {
						opacity: 0.8;
					}
					div.koya_performance_cont div.koya_cont dl dt a img {
						width: 60%;
						height: 12em;
						vertical-align: bottom;
					}
						div.koya_performance_cont div.koya_cont dl dt a img.object-fit-img {
							object-fit: cover;
							font-family: 'object-fit: cover;'
						}
			div.koya_performance_cont div.koya_cont dl dd {
				width: 100%;
				margin: 0;
				padding: 2% 0 0;
				font-size: 3.4vw;
				line-height: 160%;
				font-weight: 300;
				text-align: left;
			}

/*====================================
Company
=====================================*/
div.company_cont {
	margin: 10% auto 0;
	padding: 0 0 10%;
}
	div.company_cont .company_prof {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
		text-align: left;
	}
		div.company_cont .company_prof dt {
			display: block;
			width: 100%;
			margin: 0;
			padding: 3%;
			background: #eee;
		}
		div.company_cont .company_prof dd {
			display: block;
			width: 100%;
			margin: 0;
			padding: 3%;
			background: #fff;
		}
div.map_cont {
	margin: 0 auto;
	padding: 10% 0;
	background: #fff;
}
div.map_cont2 {
	margin: 0 auto;
	padding: 10% 0;
	background: #fff;
}
	div.map_cont div.map_top,
	div.map_cont2 div.map_top {
		margin: 3% auto 0;
		padding: 0;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}
	div.map_cont div.gmap,
	div.map_cont2 div.gmap {
		height: 0;
		margin: 3% auto 0;
		padding: 0 0 120%;
		position: relative;
	}
		div.map_cont div.gmap iframe,
		div.map_cont2 div.gmap iframe {
			position: absolute;
			display: block;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
		}
div.greeting_cont {
	margin: 0 auto;
	padding: 10% 0 15%;
	background: #fff;
}
	div.greeting_cont div.greeting_cont_in {
		margin: 0 auto;
		padding: 5% 3% 0;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}
/*
		div.greeting_cont div.greeting_cont_in .img {
			width: 70%;
			margin: 0 auto;
			padding: 0;
		}
			div.greeting_cont div.greeting_cont_in .img img {
				width: 100%;
				height: auto;
			}
*/
		div.greeting_cont div.greeting_cont_in .img {
			display: none;
		}
		div.greeting_cont div.greeting_cont_in .txt {
			width: 100%;
			/*margin: 3% auto 0;*/
			margin: 0 auto;
			padding: 0;
			text-align: left;
		}
			div.greeting_cont div.greeting_cont_in .txt p {
				margin: 3% 0 0;
			}
				div.greeting_cont div.greeting_cont_in .txt p:first-of-type {
					margin: 0;
				}
			div.greeting_cont div.greeting_cont_in .txt p.txt_btm {
				text-align: right;
			}

/*====================================
Recruit
=====================================*/
div.recruit_cont {
	margin: 10% auto 0;
	padding: 0 0 15%;
}
	div.recruit_cont div.recruit_cont_in {
		margin: 0 auto;
		padding: 5% 3% 0;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
	}
		div.recruit_cont div.recruit_cont_in .img {
			width: 70%;
			margin: 0 auto;
			padding: 0;
		}
			div.recruit_cont div.recruit_cont_in .img img {
				width: 100%;
				height: auto;
			}
		div.recruit_cont div.recruit_cont_in .txt {
			width: 100%;
			margin: 3% auto 0;
			padding: 0;
			text-align: left;
		}
			div.recruit_cont div.recruit_cont_in .txt p {
				margin: 3% 0 0;
			}
				div.recruit_cont div.recruit_cont_in .txt p:first-of-type {
					margin: 0;
				}

/*====================================
Contact
=====================================*/
div.contact_cont {
	margin: 10% auto 0;
	padding: 0 0 15%;
}
div.contact_cont.short {
	padding: 0 0 30%;
}
	div.contact_cont div.contact_top {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
		text-align: left;
	}
		div.contact_cont div.contact_top strong {
			font-weight: 500;
		}
	div.contact_cont .contact_form {
		margin: 5% auto 0;
		padding: 0 3%;
		font-size: 3.4vw;
		line-height: 160%;
		font-weight: 300;
		text-align: left;
	}
		div.contact_cont .contact_form dt {
			display: block;
			width: 100%;
			margin: 0;
			padding: 3%;
			background: #eee;
			position: relative;
		}
			div.contact_cont .contact_form dt span {
				position: absolute;
				display: inline-block;
				margin: 0;
				padding: 0 2% 0.5%;
				font-size: 3.0vw;
				line-height: 1.6em;
				background: #0e3963;
				color: #fff;
				top: 1.2em;
				right: 5%;
			}
		div.contact_cont .contact_form dd {
			display: block;
			width: 100%;
			margin: 0;
			padding: 3%;
			background: #fff;
		}
			div.contact_cont .contact_form dd label {
				display: block;
				margin: 0;
				padding: 0;
				font-size: 3.4vw;
				line-height: 180%;
			}
		#name ,#companyname ,#address ,#telno ,#email {
			width: 100%;
			padding: 2% 3%;
			font-size: 3.4vw;
			line-height: 170%;
			font-family: 'Noto Sans JP', sans-serif;
			border: 1px solid #ccc;
			background: #fff;
		}
		#message {
			width: 100%;
			height: 200px;
			padding: 2% 3%;
			font-size: 3.4vw;
			line-height: 170%;
			font-family: 'Noto Sans JP', sans-serif;
			border: 1px solid #ccc;
			background: #fff;
		}
		div.contact_cont .contact_form dd input[type=radio] {
			margin: 0 2% 0 0;
			vertical-align: -0.15em;
		}

	#contact_btn {
		width: 100%;
		margin: 0 auto;
		padding: 40px 0 0;
		text-align: center;
	}

	div.form_btn1 {
		display: inline-block;
		width: 100%;
		margin: 5px 0;
	}
		div.form_btn1 button {
			display: block;
			width: 80%;
			margin: 0 auto;
			padding: 5% 0 4.5%;
			font-size: 3.6vw;
			line-height: 140%;
			background: #0e3963;
			font-family: 'Noto Sans JP', sans-serif;
			color: #fff;
			font-weight: bold;
			cursor: pointer;
			border: none;
			position: relative;
		}
			div.form_btn1 button::before{
				position: absolute;
				content: '';
				display: block;
				width: 6px;
				height: 6px;
				margin: auto;
				padding: 0;
				border-top: 3px solid #fff;
				border-right: 3px solid #fff;
				top: 50%;
				-webkit-transform: translateY(-50%) rotate(45deg);
				transform: translateY(-50%) rotate(45deg);
				left: 5%;
			}

	div.form_btn2 {
		display: inline-block;
		width: 100%;
		margin: 5px 0;
	}
		div.form_btn2 button {
			display: block;
			width: 80%;
			margin: 0 auto;
			padding: 5% 0 4.5%;
			font-size: 3.6vw;
			line-height: 140%;
			background: #4c81b5;
			font-family: 'Noto Sans JP', sans-serif;
			color: #fff;
			font-weight: bold;
			cursor: pointer;
			border: none;
			position: relative;
		}
			div.form_btn2 button::before{
				position: absolute;
				content: '';
				display: block;
				width: 6px;
				height: 6px;
				margin: auto;
				padding: 0;
				border-top: 3px solid #fff;
				border-right: 3px solid #fff;
				top: 50%;
				-webkit-transform: translateY(-50%) rotate(45deg);
				transform: translateY(-50%) rotate(45deg);
				left: 5%;
			}







}