@charset "utf-8";

.pc-only-inlineblock {
	display: inline-block;
}
.sp-only-inlineblock {
	display: none;
}

.page-server .box01 {
	margin-bottom: 10px;
}
.page-server .box01 .inner {
	width: 100%;
	padding: 40px 0 0;
	background: url(../images/works/bg01.png) no-repeat top left;
}
.page-server .box01 .inner .content1 {
	width: 1000px;
	margin: 0 auto;
	padding: 60px 40px 30px;
	background: #fff;
	border: solid 4px #bdd36c;
	box-sizing: border-box;
}
.page-server .box01 .inner .content1 h1 {
	font-size: 33px;
	font-weight: bold;
	font-family: 'Noto Sans Japanese';
	margin-left: 1.25em;
	margin-bottom: 40px;
}
.page-server .box01 .inner .content1 h2 {
	font-size: 23px;
	font-weight: bold;
	font-family: 'Noto Sans Japanese';
}
.page-server .box01 .inner .content1 img {
	float: right;
	margin: 0 0 14px 14px;
}
.page-server .box01 .inner .content1 p {
	font-size: 14px;
	line-height: 1.6;
	letter-spacing: 0.05em;
}
.page-server .box02 ,
.page-server .box03 .inner {
	width: 1000px;
	display: flex;
	margin: 0 auto 10px;
	border: solid 4px #bdd36c;
	background: #fff;
	padding: 0;
}
.page-server .box03 {
	width: 1180px;
	margin: 0 auto;
	padding: 0 0 160px;
	background: url(../images/works/box03-bg02.png) no-repeat top right;
}
.page-server .box02 h3,
.page-server .box03 h3 {
	width: 22.5%;
	background: #bdd36c;
	font-size: 18px;
	font-weight: bold;
	font-family: 'Noto Sans Japanese';
}
.page-server .box02 p,
.page-server .box03 p {
	width: 77.5%;
	box-sizing: border-box;
	font-size: 14px;
	line-height: 23px;
}
.page-server .box02 h3 {
	padding: 55px 39px;
	line-height: 1.6;
}
.page-server .box02 p {
	padding: 45px 32px;
}
.page-server .box03 h3 {
	padding: 23px 45px;
}
.page-server .box03 p {
	padding: 20px 32px;
}
.page-server .content1 h1+h2 {
	margin-bottom:1em;}


@media screen and (max-width: 768px) {
	.pc-only-inlineblock {
		display: none;
	}
	.sp-only-inlineblock {
		display: inline-block;
	}

	.page-server .breadcrumb > .inner {
		width: 100%;
	}
	.page-server .box01 .inner .content1 {
		width: 100%;
	}
	.page-server .box01 .inner .content1 h1 {
		margin-left: 0;
	}
	.page-server .box01 .inner .content1 img {
		width: 100%;
	}
	.page-server .box02,
	.page-server .box03 .inner {
		width: 100%;
		display: block;
	}
	.page-server .box03 {
		width: 100%;
		padding: 0 0 60px;
	}
	.page-server .box02 h3, .page-server .box03 h3,
	.page-server .box02 p, .page-server .box03 p {
		width: 100%;
	}
	.page-server .box02 h3 {
		padding: 25px 45px;
	}
	.page-server .box02 p {
		padding: 20px 32px;
	}
}