/* CSS Document */
nav ul li:nth-child(3) a
{
	color: var(--link-color);
	pointer-events:none;
}

#sp_navi ul li:nth-child(3) a
{
	color: var(--link-color) !important;
}


#head h2
{
	text-align: center;
}

#head p
{
	text-align: center;
	margin-bottom: 60px;
}

#head ul
{
	text-align: center;
	display: block;
	margin: 0px;
	padding: 0px;
}

#head ul li
{
	text-align: center;
	display: inline-block;
	padding: 0px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 0px;
	margin-left: 10px;
	list-style-type: none;
}


#head ul li a img
{
	transition: 1s all;
}

#head ul li a:hover img
{
	transform:scale(1.1,1.1);
	transition:1s all;

	opacity: 1.0;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
}

section .head_box
{
	text-align: center;
	margin-bottom: 60px;
}

section .head_box h3
{
	font-size: 36px;
	line-height: 1;
	text-align: center;
	margin-bottom: 30px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	background: linear-gradient(to right, #a6deeb, #f9f1c8);
	display: inline-block;
	width: 600px;
	padding-top: 10px;
	padding-bottom: 10px;

	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
}

section .head_box p
{
	text-align: center;
	position: relative;
	z-index: 10;
}

section .head_box p strong
{
	font-size: 24px;
	line-height: 1.2;
	color: #4c9bb0;
}

#technology h3{	background: linear-gradient(to right, #f9f1c8, #a6deeb);}
#cad h3{	background: linear-gradient(to right, #db7a97, #f4c1b8);}
#construction h3{	background: linear-gradient(to right, #efc7d6, #c1bad9);}

#technology .sample_box ul
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 30px; /* 横のスペース */
	row-gap: 20px; /* 縦のスペース */
	margin: 0px;
	padding: 0px;
}

#technology .sample_box ul li
{
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	text-align: center;
}

#technology .sample_box ul li a img,
#technology .sample_box ul li a p
{
	transition: 1s all;
	height: auto;
	width: auto;
}

#technology .sample_box ul li a:hover img,
#technology .sample_box ul li a:hover p
{
	transform:scale(1.1,1.1);
	transition:1s all;

	opacity: 1.0;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
}

#technology .sample_box ul li p
{
	text-align: center;
}

#technology .sample_box ul li p:after
{
	font-family: "Font Awesome 6 Free";
	content: '\f1c1';
	font-weight: 900;
	margin-left: 10px;
	color: #ff1d25;
}

section .comment_box
{
	width: 600px;
	margin-right: auto;
	margin-left: auto;
}

section .comment_box h4
{
	font-size: 24px;
	line-height: 1.2;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000;
	padding-bottom: 4px;
}

section .comment_box ul li::marker
{
	content: "・";
}


#cad ul li
{
	font-size: 24px;
	line-height: 1.6;
}


#construction .head_box p strong
{
	color: #eaaf40;
}





/* PCのみ設定  768 以上*/
@media screen and (min-width:768px)
{



}

/* タブレットレイアウト : 768 px 〜 959 px*/
@media screen and (max-width:1199px)
{

#head ul
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 10px; /* 横のスペース */

}

#head ul li
{
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

#head ul li img
{
	width:auto;
	height:auto;
}


section .head_box h3
{
	font-size: 28px;
	line-height: 1;
	text-align: center;
	margin-bottom: 30px;
	width: auto;
	min-width: 16em;
}


section .comment_box
{
	width: auto;
}



}

/* スマホ設定  768 以下*/
@media screen and (max-width:767px)
{


}


/* スマホ設定  599 以下*/
@media screen and (max-width:599px)
{
#head h2,
#head p
{
	text-align: justify;
}

#head ul
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 10px; /* 横のスペース */
	row-gap: 10px; /* 縦のスペース */

}


section .head_box h3
{
	font-size: 28px;
	line-height: 1;
	text-align: center;
	margin-bottom: 30px;
	width: auto;
	min-width: initial;
	display: block;
}

section .head_box p
{
	text-align: justify;
}

#technology .sample_box ul
{
	grid-template-columns: repeat(2, 1fr);
	column-gap: 10px; /* 横のスペース */
	row-gap: 10px; /* 縦のスペース */
}



}
