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

body{background:#fff;}

/*共有*/
.pc{display:block;}
.sp{display:none;}
.page_wrap{overflow: hidden;}
.ank{position:relative;top:-100px;}

/*ヘッダー*/
header{
	background-color: rgba(255,255,255,.8);
	height:70px;
	position:fixed;
	width:100%;
	z-index:900;
	}
header .logo{max-width:450px;width:60%;float:left;padding:15px 0 0 15px;}

/*メイン*/
.main_wrap{
	background:#FFF;
	height:50vw;
	background:url(../img/top/main_img.webp) no-repeat;
	background-size:70vw;
	background-position: right -20vw top;
	}
.main_copy{
	font-size:2.5vw;
	width:100%;
	max-width:1060px;
	line-height:1.8em;
	margin:0 auto;
	padding:17vw 0 17vw 5vw;
	font-weight:bold;
	color:#444;
	}


/*タイトル*/
h3.title{font-size:80px;color:#006934;font-weight:bold;}
h3.title span{font-size:0.5em;display:block;color:#1a1a1a;padding:0.5em 0;}

/*table_wrap*/
.table_wrap{display:table;width:100%;margin-top:3%;}
.table_wrap li{display:table-cell;width:47%;padding:0 3% 0 0;}
.table_wrap li:nth-child{2n}{padding:0 0 0 3%;}
.table_wrap li a img{display:block;border-radius: 20px;}
.table_wrap li h4{font-size:36px;color:#006934;text-align:center;padding:0.5em 0 0.2em;}
.table_wrap li p{padding-bottom:1em;}

/*ボタン*/
.black_btn{
	background:#000;
	display:block;
	margin:1em auto;
	padding:1em 2em;
	max-width:270px;
	border-radius:40px;
	}
.black_btn img{
	display:block;
	max-width:270px;
	margin:0 auto;
	}
.black_btn:hover{background:#039;}
.black_btn:hover img{
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	}


.white_btn{
	border:1px #333 solid;
	display:block;
	margin:1em auto;
	padding:1em 2em;
	border-radius:40px;
	}
.white_btn img{
	display:block;
	max-width:270px;
	margin:0 auto;
	}
.white_btn:hover{
	border:1px #333 solid;
	background:#ccc;
}
.white_btn:hover img{
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	}

.blue_btn{
	background:#005bab;
	display:block;
	margin:1em auto;
	padding:1em 2em;
	border-radius:40px;
	max-width:360px;
	}
.blue_btn img{
	display:block;
	max-width:305px;
	margin:0 auto;
	}
.blue_btn:hover{
	background:#06F;
}
.blue_btn:hover img{
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	}	
		
/*white_wrap*/
.white_wrap{
	background-color: rgba(255,255,255,0.8);
	border-radius:30px;
	padding:2em 2em 1em;
	width:50%;
	}

.white_wrap .black_btn{
	margin:1em 0;
	}
	
/*compnay_wrap*/
.company_wrap{
	margin-top:10%;
	padding:5% 0;
	background:url(../img/top/company_bg.webp) right center no-repeat;
	}

/*recruit_wrap*/
.recruit_wrap{
	margin-top:10%;
	padding:5% 0;
	background:url(../img/top/recruit_bg.webp) left center no-repeat;
	}
.recruit_wrap .white_wrap{float:right;}


/*works_wrap*/
.works_wrap{
	margin:5% 0;
	}
.works_bg{
	background:url(../img/top/works_bg.webp) top center no-repeat;
	background-size:100% 25vw;
	padding:5% 0;
	}
.works_wrap h3.title{color:#FFF;text-align:center;}
.works_wrap h3.title span{color:#FFF;}

.works_wrap ul{margin-top:20px;}
.works_wrap li{float:left;width:22%;margin-right:4%;}
.works_wrap li:last-child{margin-right:0%;}


/*社長ブログ*/
.blog_wrap{padding:0 0 5% 0;}
.blog_wrap a{display:block;max-width:800px;margin:0 auto;}


/*フッター*/
footer{padding:5% 0 0;background:#eee;border-top:5px #005bab solid;}
footer .copyright{padding:3% 0 2%;text-align:center;}
footer .ftr_wrap{display:table;}
footer .ftr_wrap .left{display:table-cell;padding-right:3%;width:47%;}
footer .ftr_wrap .left h3{max-width:490px;}
footer .ftr_wrap .right{display:table-cell;padding-left:3%;width:47%;border-left:1px #888 solid;}


/*サブページ*/
.sub_page{margin-top:70px;}

.sub_main{position:relative;height:35vw;}
.sub_main .img_wrap{
	width:50%;
	position:absolute;
	right:0;
	top:0;
	}
.sub_main .img_wrap img{
	border-radius:20px 0 0 20px;
	display:block;
	}
.sub_main .img_wrap .pankuzu{
	text-align:right;
	font-size:0.8em;
	padding-right:1em;
	padding-top:1em;
	}
	
.sub_main .gr_wrap{
	width:60%;
	background:#eee;
	border-radius:0 20px 20px 0;
	position:absolute;
	left:0;
	top:5vw;
	height:22vw;
	}

.gr_wrap .title{
	position: absolute;
    right: 0;
    top: 6vw;
    line-height: 1em;
    font-size: 6vw;
    max-width:760px;
	width:95%;
	}
.gr_wrap .title span{
	line-height:0.5em;
	}
	
.center_title{font-size:5vw;font-weight:bold;color:#005bab;text-align:center;padding-bottom:1em;}

.photo_right{margin-bottom:8%;}
.photo_right .text_area{float:left;width:48%;padding-right:2%;}
.photo_right .img_wrap{float:right;width:50%;}
.photo_right .img_wrap img{border-radius:20px;}

.photo_left{margin-bottom:8%;}
.photo_left .text_area{float:right;width:48%;padding-left:2%;}
.photo_left .img_wrap{float:left;width:50%;}
.photo_left .img_wrap img{border-radius:20px;}

.num_title{padding-bottom:2%;}
.num_title img{display:block;max-width:375px;width:70%;}


/*ビジネス*/
.business section{margin-bottom:10%;}

/*ビジネス*/
.recruit section{margin-bottom:10%;}
.youkou_wrap table{width:100%;}
.youkou_wrap th{width:9em;text-align:left;vertical-align:top;border-bottom:1px #888 solid;padding:1em 0;}
.youkou_wrap td{border-bottom:1px #888 solid;padding:1em 0;}

/*会社概要*/
.company section{margin-bottom:10%;}
.gaiyo_wrap table{width:100%;}
.gaiyo_wrap th{width:9em;text-align:left;vertical-align:top;border-bottom:1px #888 solid;padding:1em 0;}
.gaiyo_wrap td{border-bottom:1px #888 solid;padding:1em 0;}

.gmap {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}

/*お問い合わせ*/
.contact section{margin-bottom:10%;}
.contact_wrap .table_up_text{padding-bottom:2em;}
.contact_wrap table{width:100%;}
.contact_wrap th{
	white-space:nowrap;
	line-height:1.4em;
	width:14em;
	text-align:left;
	vertical-align:top;
	border-bottom:1px #888 solid;
	padding:1em 1em 1em 0;
	}
.contact_wrap td{
	border-bottom:1px #888 solid;
	padding:1em 0;
	position:relative;
	}

.contact_wrap td input{
	padding:0.5em;
	width:100%; box-sizing:border-box;
	}
.contact_wrap td textarea{
	padding:0.5em;
	width:100%; box-sizing:border-box;
	}
	
.contact_wrap td select{
	font-size: 1.2em;
	line-height: 1em;
	padding: 0.2em 0.5em 0;
	margin-bottom: 0.5em;
  }
.contact_wrap .required{
	background:#F00;
	width:3em;
	padding:0.2em 1em;
	line-height:1em;
	border-radius:0.5em;
	color:#FFF;
	font-size:0.8em;
	margin-left:1em;
	white-space: nowrap;
	position: relative;
	top: -0.1em;
	}
	
.btn_submit{
	background:#005bab;
	display:block;
	margin:1em auto;
	padding:1em 3em;
	border-radius:40px;
	border:none;
	color:#FFF;
	font-size:25px;
	font-weight:bold;
	white-space: nowrap;
	cursor:pointer;
	}

.btn_submit:hover{
	background:#06F;
}

/*個人情報*/
.privacy_wrap{padding:1em;border:1px #888 solid;height:300px;margin:60px 0 30px;overflow-y: scroll;}
.privacy_wrap h3{text-align:center;color:#069;font-size:1.4em;font-weight:bold;padding-bottom:0.5em;}
.privacy_wrap ul.num_list li{padding-left:1em;text-indent:-1em;}
.privacy_wrap ul.indent li{padding-left:1em;text-indent:-1em;}


/*サンクスページ*/
.thank_wrap h3.center_title{line-height:1.2em;font-size:1.4em;}


.contact_btn_wrap{padding:2em 0;text-align:center;}
.contact_btn_wrap input{padding:0.5em 1em;border-radius:1em;border:none;cursor:pointer;font-size:1.2em;}


/*施工事例*/
.works_c_wrap{margin-bottom:10%;}
.works_c_wrap .wp-block-image{
	float: left;
	width: 24%;
	margin: 0.5% 0.5%;
	list-style: none;
	}
.works_c_wrap .wp-block-image:nth-child(4n+1){
	content: "";         /* 擬似要素を実体化 */
    clear: both;        /* floatを解除する */
    display: block;     /* ブロック要素にする */
	}
.works_c_wrap .wp-block-image img{height:100%;}
.works_c_wrap .wp-block-image a{
	display: block;
	overflow: hidden;
	height:24vw;
	background: #ccc;

	max-width: 300px;
	max-height: 300px;
}
.works_c_wrap .wp-block-image a img{
	height: auto;
	min-width: 300px;
	width:32vw;
	height:auto;
	object-fit: cover;
}

.works_c_wrap figcaption{font-size:0.9em;line-height:1.4em;padding:0.5em 0;}




	
@media screen and (min-width:1400px) {
.gr_wrap .title{
    top:100px;
    font-size: 90px;
	}
}


@media screen and (min-width:1200px) {

/*メイン*/
.main_wrap{
	height:632px;
	background-size:936px;
	background-position: right -150px top;
	}

.main_copy{
	font-size:30px;
	width:100%;
	max-width:1200px;
	line-height:1.8em;
	margin:0 auto;
	padding-top:200px;
	padding-left:0;
	}

/*compnay_wrap*/
.company_wrap{
	margin-top:100px;
	padding:50px 0;
	}
/*compnay_wrap*/
.recruit_wrap{
	margin-top:50px;
	padding:50px 0;
	}

.works_bg{
	background:url(../img/top/works_bg.webp) top center no-repeat;
	background-size:100% 300px;
	padding:50px 0;
	}

/*フッター*/
footer{padding:50px 0 0;}
footer .copyright{padding:30px 0 20px;t}

/*サブページ*/
main.sub_page{}

.center_title{font-size:60px;padding-bottom:50px;}

/*ビジネス*/
.business section{margin-bottom:100px;}

/*施工事例*/
.works_c_wrap{margin-bottom:150px;}


}


@media screen and (max-width:760px) {
/*共通*/
.pc{display:none;}
.sp{display:block;}

/*ヘッダー*/
header{height:50px;}

/*メイン*/
.main_wrap{
	background:#FFF;
	height:58vw;
	background:url(../img/top/main_img.webp) no-repeat;
	background-size:60vw;
	background-position: right -20vw top;
	}
.main_copy{
	font-size:3.6vw;
	width:100%;
	max-width:1060px;
	line-height:1.8em;
	margin:0 auto;
	padding:16vw 0 0 5vw;
	}
	
/*タイトル*/
h3.title{font-size:8vw;text-align:center;}
h3.title span{padding:0.2em 0;}

/*table_wrap*/
.table_wrap{display:block;width:100%;}
.table_wrap li{display:block;width:100%;padding:1.5% 0 1.5% 0;}
.table_wrap li:nth-child{2n}{padding:1.5% 0 1.5% 0;}
.table_wrap li h4{font-size:5.5vw;color:#006934;}
.table_wrap li p{padding-bottom:1em;}

/*ボタン*/
.black_btn{width:60%;}
.black_btn img{width:80%;}

	
/*compnay_wrap*/
.business_wrap{
	margin-bottom:20%;
	}
	
/*white_wrap*/
.white_wrap{
	float:none;
	border-radius:20px;
	padding:2em;
	width:auto;
	margin:5% 0;
	}

.white_wrap .black_btn{
	margin:1em auto;
	}

.works_bg{
	background-size:100% 35vw;
	padding:5% 0 0;
	}
.works_wrap ul{margin-top:10px;}


/*フッター*/
footer{}
footer .copyright{}
footer .ftr_wrap{display:block;}
footer .ftr_wrap .left{text-align:center;display:block;padding:0 0 3%;width:100%;}
footer .ftr_wrap .left h3{max-width:490px;margin:0 auto;width:80%;}
footer .ftr_wrap .right{display:block;padding:3% 0 2%;width:100%;border-left:none;border-top:1px #888 solid;}
footer .ftr_wrap .right p{font-size:0.9em;}
footer .ftr_wrap .right a{display:block;width:60%;}



/*サブページ*/
.sub_main .img_wrap{width:60%;}
.sub_main .gr_wrap{
	width:60%;
	top:7vw;
	height:22vw;
	}

	
.gr_wrap .title{text-align:left;}
.gr_wrap .title span{text-align:left;}
	
.sub_main .img_wrap .pankuzu{
	font-size:3vw;
	}

.center_title{font-size:6vw;}

/*ビジネス*/
.photo_right .text_area{float:none;width:100%;padding:0 0 3%;}
.photo_right .img_wrap{float:none;width:100%;}

.photo_left .text_area{float:none;width:100%;padding:0 0 3%;}
.photo_left .img_wrap{float:none;width:100%;}


/*採用情報*/
.youkou_wrap th{
	width:100%;
	text-align:center;
	border:none;
	padding:0.5em 0;
	float:left;
	background:#006934;
	color:#FFF;
	}
.youkou_wrap td{
	width:100%;
	border-bottom:none;
	padding:0.5em 0;
	float:left;
	text-align:center;
	}

/*会社概要*/
.gaiyo_wrap th{
	width:100%;
	text-align:center;
	border:none;
	padding:0.5em 0;
	float:left;
	background:#006934;
	color:#FFF;
	}
.gaiyo_wrap td{
	width:100%;
	border-bottom:none;
	padding:0.5em 0;
	float:left;
	text-align:center;
	}
	
	
/*お問い合わせ*/
.contact_wrap table{float:left;}
.contact_wrap .table_up_text{padding:2em 0;font-size:0.9em;}

.contact_wrap th{
	width:100%;
	text-align:center;
	border:none;
	padding:0.5em 0;
	float:left;
	background:#006934;
	color:#FFF;
	}
.contact_wrap td{
	position:relative;
	width:100%;
	border-bottom:none;
	padding:0.5em 0;
	float:left;
	text-align:center;
	}
	
.contact_wrap td input{
	padding:0.5em;
	width:100%;
	box-sizing:border-box;
	}

.contact_wrap .required{
	background:#F00;
	width:3em;
	padding:0.2em 1em;
	line-height:1em;
	border-radius:40px;
	color:#FFF;
	font-size:0.8em;
	margin-left:1em;
	white-space: nowrap
	}
	
.privacy_wrap{height:200px;margin:30px 0 15px;overflow-y: scroll;}


.btn_submit{
	font-size:4vw;
	}

/*施工事例*/
.wp-block-gallery{
width: 100%;
  margin: 0 auto;
}
.works_c_wrap .wp-block-image{
	float: left;
	width: 48%;
	margin: 1% 1%;
	list-style: none;
	}
.works_c_wrap .wp-block-image a{
	display: block;
	overflow: hidden;
	height:35vw;
	background: #ccc;

	max-width: 300px;
	max-height: 300px;
}
.works_c_wrap .wp-block-image a img{
	height: auto;
	min-width: 300px;
	width:32vw;
	object-fit: cover;
}

.works_c_wrap .wp-block-image:nth-child(4n+1){
    clear:none;
	float:left;
	}
.works_c_wrap .wp-block-image:nth-child(2n+1){
	content: "";         /* 擬似要素を実体化 */
    clear: both;        /* floatを解除する */
    display: block;     /* ブロック要素にする */
	}


}


@media screen and (max-width:560px) {
/*ヘッダー*/
header .logo{width:70%;padding:3vw 0 0 2vw;}
}