@charset "utf-8";
/* Copyright 2021 FSFIELD All Rights Reserved. */

@media print, screen and (min-width:768px){ /* 表示領域が768px以上の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

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

	システム建築

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

	/* グローバルナビアクティブ
	---------------------------------------------- */
	.nav_global > ul > li.g03 > a::before{
		display: block;
		transform: scaleX(1);
	}

	/* 共通
	---------------------------------------------- */
	.sec_system01{text-align: center;}

	.sec_system02{
		border-bottom: 1px solid #E5E5E5;
		padding: 100px 0;
	}

	.ttl_system{
		font-size: 3.6rem;
		font-weight: bold;
		margin-bottom: 5px;
	}

	.ttl_system span{
		display: block;
		margin-top: 8px;
	}

	.ttl_system span img{
		width: auto;
		height: 21px;
	}

	.txt_system01{
		font-size: 2.6rem;
		font-weight: bold;
		margin-bottom: 35px;
	}

	.txt_system02{
		line-height: 2.2;
		margin: 0 auto;
	}

	.image_system{margin-bottom: 40px;}

	.system_inner{
		line-height: 2.2;
		margin-bottom: 30px;
	}

	.system_inner:last-child{margin-bottom: 0;}

	.system_inner .heading02{margin-bottom: 5px;}

	/* 施工例 */
	.example_inner{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-bottom: -30px;
	}

	.example_inner figure{
		width: 536px;
		margin-bottom: 30px;
	}

	.example_inner figure img{
		width: 100%;
		height: auto;
	}


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

	メタルビル建築

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

	/* メタルビル建築とは
	---------------------------------------------- */
	#metal01 .txt_system02{
		width: 680px;
		margin-bottom: 50px;
	}

	.metal_inner{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-bottom: -25px;
	}

	.metal_inner figure{margin-bottom: 25px;}

	.metal_inner figure img{margin-bottom: 5px;}

	.metal_inner figcaption{
		font-size: 2.3rem;
		font-weight: bold;
		line-height: 1.2;
		text-align: center;
	}

	/* メタルビル建築のメリット
	---------------------------------------------- */
	.wrap_merit{
		background: #F0F0F0;
		padding: 25px;
		margin-top: 40px;
		position: relative;
	}

	.wrap_merit::after{
		content: "";
		display: block;
		width: 56px;
		height: 56px;
		background: url(../img/ico_point01.png) no-repeat 0 0;
		background-size: 100%;
		position: absolute;
		top: -28px;
		left: -28px;
		z-index: 1;
	}

	.ttl_merit{
		color: #DF3131;
		font-size: 1.8rem;
		font-weight: bold;
	}

	.txt_merit{
		line-height: 1.8;
		padding-left: 8px;
	}

	/* いちいち基礎工法
	---------------------------------------------- */
	#metal03.sec_system02 .heading01{margin-bottom: 30px;}

	.construction_inner{
		display: flex;
		justify-content: space-between;
	}

	.construction_content{width: 525px;}

	.construction_content .txt_note{
		font-size: 1.2rem;
		line-height: 1.2;
		text-align: right;
		margin-top: 10px;
	}

	.image_construction a{display: block;}

	/* 施工例
	---------------------------------------------- */
	#metal04.sec_system02{
		border-bottom: none;
		padding-bottom: 90px;
	}

	#metal04.sec_system02 .heading01{margin-bottom: 60px;}


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

	yess建築

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

	/* yess建築とは
	---------------------------------------------- */
	#yess01.sec_system01 .txt_system02{width: 800px;}

	/* 特長
	---------------------------------------------- */
	#yess02.sec_system02{padding-top: 75px;}

	/* 施工例
	---------------------------------------------- */
	#yess04.sec_system02{
		border-bottom: none;
		padding-bottom: 60px;
	}

	#yess04.sec_system02 .heading01{margin-bottom: 60px;}

	/* 問い合わせ
	---------------------------------------------- */
	.btn_contact{
		width: 1100px;
		margin: 0 auto;
	}

	.btn_contact a{
		display: block;
		color: #FFF;
		font-size: 2.6rem;
		font-weight: bold;
		line-height: 1.5;
		text-align: center;
		background: #DF3131;
		padding: 40px 0;
	}

	.btn_contact a:hover{opacity: .7;}


}/*--@media--*/


@media only screen and (max-width:767px){ /* 表示領域が767px以下の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	スマートフォン（iPhone,Android)

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

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

	システム建築

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

	/* 共通
	---------------------------------------------- */
	.sec_system01{text-align: center;}

	.sec_system02{
		border-bottom: 1px solid #E5E5E5;
		padding: 50px 0;
	}

	.ttl_system{
		font-size: 2.1rem;
		font-weight: bold;
		margin-bottom: 5px;
	}

	.ttl_system span{
		display: block;
		margin-top: 5px;
	}

	.ttl_system span img{
		width: auto;
		height: 13px;
	}

	.txt_system01{
		font-size: 1.7rem;
		font-weight: bold;
		margin-bottom: 20px;
	}

	.txt_system01 span{display: block;}

	.txt_system02{line-height: 2.2;}

	.image_system{margin-bottom: 30px;}

	.image_system figure img{
		width: 100%;
		height: auto;
	}

	.system_inner{
		line-height: 2.2;
		margin-bottom: 30px;
	}

	.system_inner:last-child{margin-bottom: 0;}

	.system_inner .heading02{margin-bottom: 5px;}

	/* 施工例 */
	.example_inner figure{margin-bottom: 20px;}

	.example_inner figure:last-child{margin-bottom: 0;}

	.example_inner figure img{
		width: 100%;
		height: auto;
	}


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

	メタルビル建築

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

	/* メタルビル建築とは
	---------------------------------------------- */
	#metal01.sec_system01 .txt_system02{margin-bottom: 40px;}

	.metal_inner{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-bottom: -20px;
	}

	.metal_inner figure{
		width: calc(50% - 13px);
		margin-bottom: 20px;
	}

	.metal_inner figure img{
		width: 100%;
		height: auto;
		margin-bottom: 5px;
	}

	.metal_inner figcaption{
		font-size: 1.6rem;
		font-weight: bold;
		line-height: 1.2;
		text-align: center;
	}

	/* メタルビル建築のメリット
	---------------------------------------------- */
	.wrap_merit{
		background: #F0F0F0;
		padding: 25px 25px 20px;
		margin-top: 35px;
		position: relative;
	}

	.wrap_merit::after{
		content: "";
		display: block;
		width: 50px;
		height: 50px;
		background: url(../img/ico_point01.png) no-repeat 0 0;
		background-size: 100%;
		position: absolute;
		top: -25px;
		left: -18px;
		z-index: 1;
	}

	.ttl_merit{
		color: #DF3131;
		font-size: 1.5rem;
		font-weight: bold;
		line-height: 1.5;
		margin-bottom: 8px;
	}

	/* いちいち基礎工法
	---------------------------------------------- */
	.image_construction a{display: block;}

	.image_construction a img{
		width: 100%;
		height: auto;
	}

	.construction_content{margin-bottom: 30px;}

	.construction_content:last-child{margin-bottom: 0;}

	.construction_content .heading02{margin-bottom: 20px;}

	.construction_content .txt_note{
		font-size: 1.1rem;
		line-height: 1.2;
		text-align: right;
		margin-top: 5px;
	}

	/* 施工例
	---------------------------------------------- */
	#metal04.sec_system02{
		border-bottom: none;
		padding-bottom: 40px;
	}


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

	yess建築

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

	/* yess建築とは
	---------------------------------------------- */

	/* 特長
	---------------------------------------------- */
	#yess02.sec_system02{padding-top: 35px;}

	/* 施工例
	---------------------------------------------- */
	#yess04.sec_system02{
		border-bottom: none;
		padding-bottom: 40px;
	}

	/* 問い合わせ
	---------------------------------------------- */
	.btn_contact a{
		display: block;
		color: #FFF;
		font-size: 1.8rem;
		font-weight: bold;
		line-height: 1.5;
		text-align: center;
		background: #DF3131;
		padding: 22px 0 21px;
	}


}/*--@media--*/