@charset "utf-8";
/* CSS Document */
@media screen and (max-width:850px) {
	html {
		font-size: 8px;
	}
	body {
		max-width: 850px;
	}
	.sec-ttl h4 {
		font-size: 18px;
		text-align: center;
	}
	.sec-ttl span {
		color: #629879;
		font-style:italic;
		font-size: 40px;
		line-height: 1.2;
	}

	/*--- ヘッダー ---*/
	#header {
		width: 100%;
		background: rgba(255,255,255,0.8);
		position: fixed;
		padding: 8px 0;
		top:0;
		left: 50%;
		transform: translate(-50%);
		z-index: 2;
	}
	#header .inner {
		max-width: 90%;
		margin:0  auto;
		align-items: center;
		justify-content: space-between;
	}
	.head-logo {
		max-width: 350px;
	}
	.tel-link {
		display: block;
		color: #629879;
		font-size: 30px;
		font-style: italic;
		text-align: right;
	}
	.tel-link i {
		font-size: 20px;
		margin-right: 10px;
	}
	.g-nav ul {
		gap: 40px;
	}
	.g-nav ul li a {
		font-size: 14px;
		color: #333;
	}
	.g-nav ul li a:hover {
		color: #707070;
	}

	/*--- メインビジュアル ---*/
	.mainvisual {
		width: 100%;
		height: 60vh;
		background: url("../img/mainvisual.jpg");
		background-size: cover;
		background-position: center;
		position: relative;
	}
	.catch-copy {
		width: 950%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}
	.catch-copy h2 {
		font-size: 40px;
		line-height: 1;
		text-align: center;
	}
	.catch-copy h2 span {
		color: #629879;
		font-size: 70px;
	}
	.catch-copy h3 {
		font-size: 30px;
		line-height: 1.5;
		text-align: center;
	}


	/*--- お知らせ ---*/
	#news .inner {
		width: 90%;
		margin: auto;
	}
	#news .inner dl {
		width: 100%;
		justify-content: space-between;
	}
	#news .inner dl dt,
	#news .inner dl dd {
		font-size: 14px;
	}
	#news .inner dl dt {
		width: 20%;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		padding: 8px 0;
		box-sizing: border-box;
		color: #629879;
		text-align: center;
	}
	#news .inner dl dd {
		width: 80%;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		box-sizing: border-box;
		padding: 8px 0;
	}


	/*--- ご挨拶 ---*/
	#greeting {
		background: url("../img/bg-greeting.png");
		background-size: cover;
		background-position: center;
	}
	.greeting-message {
		width: 90%;
		margin: auto;
	}
	.greeting-message p {
		font-size: 14px;
		text-align: center;
		line-height: 2;
	}
	.wbg-tel {
		width: 350px;
		margin: 5rem auto 0 auto;
		background: #fff;
		padding: 8px 0;
	}
	.wbg-tel .tel-link {
		text-align: center;
	}


	/*--- 事業内容 ---*/
	#works .inner {
		width: 100%;
	}
	#works .inner .item {
		width: 40%;
	}
	.work-link {
		width: 100%;
		padding: 12rem 0;
		background: rgba(51,51,51,0.6);
	}
	.work-link a {
		display: block;
		font-size: 24px;
		text-align: center;
	}
	.page-link {
		width: 300px;
		margin: 8rem auto 0 auto;
		background: #629879;
		padding: 20px 0;
	}
	.page-link a {
		display: block;
		font-size: 24px;
		text-align: center;
	}
	.page-link:hover {
		background: rgba(127,156,101,1.00);
	}


	/*--- 採用情報 ---*/
	#recruit {
		width: 100%;
		background: url("../img/bg-recruit.png");
		background-size: cover;
		background-position: center;
	}
	#recruit .inner {
		width: 80%;
		margin: auto;
		background: rgba(255,255,255,0.7);
	}
	.recruit-message p {
		text-align: center;
		font-size: 14px;
		line-height: 2;
	}

	/*--- フッター ---*/
	#footer {
		margin-top: 10rem;
	}
	.foot-nav {
		max-width: 90%;
		margin: auto;
		padding-bottom: 8px;
		border-bottom: 1px solid #ccc;
	}
	.foot-nav ul {
		width: 100%;
		justify-content: center;
		gap:5rem;
	}
	.foot-nav ul li a {
		font-size: 14px;
		color: #333;
	}
	.foot-logo {
		width: 350px;
		margin: 5rem auto 2rem auto;
	}
	.foot-adress {
		font-size: 18px;
		text-align: center;
	}
	#footer .wbg-tel {
		margin: 1rem auto 0 auto;
	}

	.copy {
		text-align: center;
		font-size: 12px;
	}


	/*------ 下層 ------*/

	/*--- メインビジュアル ---*/
	.s-mainvisual {
		width: 100%;
		height: 45vh;
		background: url("../img/s-mainvisual.png");
		background-size: cover;
		background-position: center;
		position: relative;
	}
	.pagettl {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%);
	}
	.pagettl h2 {
		font-size: 50px;
		line-height: 1;
		text-align: center;
	}
	.s_sec-ttl {
		width: 50%;
		margin-right: auto;
		border-bottom: 20px solid rgba(98,152,121,0.7);
		padding-bottom: 5px;
		padding-left: 30px;
	}
	.s_sec-ttl h3 {
		font-size: 30px;
	}


	/*--- 事業内容 ---*/
	.work-item .inner {
		width: 90%;
		margin: 5rem auto;
		justify-content: space-between;
		align-items: center;
	}
	.work-item .inner .img {
		width: 50%;
	}
	.work-item .inner .txt {
		width: 45%;
	}
	.work-item .inner .txt p {
		font-size: 16px;
		line-height: 2;
	}

	#works-bottom {
		background: #E8F3EB;
		padding: 5rem 0;
	}
	.wb-message p {
		text-align: center;
		font-size: 20px;
		line-height: 2;
	}


	/*--- 採用情報 ---*/
	#staff-wanted .inner {
		width: 90%;
		margin: 5rem auto;
		justify-content: space-between;
		align-items: center;
	}
	#staff-wanted .inner .txt {
		width: 45%;
	}
	#staff-wanted .inner .txt p {
		font-size: 16px;
		line-height: 2;
		text-align: center;
	}
	#staff-wanted .inner .img {
		width: 50%;
	} 
	.gbg-tel {
		width: 380px;
		margin: 5rem auto 0 auto;
		background: #ECFEF2;
		padding: 8px 0;
	}
	.gbg-tel .tel-link {
		text-align: center;
	}
	#AR .inner {
		width: 700px;
	}


	/*--- 会社概要 ---*/
	#company-info .inner {
		width: 90%;
		margin: 5rem auto;
	}
	#company-info .inner table {
		width: 100%;
	}
	#company-info .inner table th {
		width: 25%;
		background: rgba(150,204,191,0.5);
		padding: 20px 0;
		font-size: 16px;
		text-align: center;
		border: 1px solid rgba(187,188,188,0.7);
	}
	#company-info .inner table td {
		width: 75%;
		padding: 20px 0 20px 20px;
		font-size: 16px;
		border: 1px solid rgba(187,188,188,0.7);
	}
}


@media screen and (max-width:420px) {
	html {
		font-size: 6px;
	}
	body {
		max-width: 420px;
	}
	.sec-ttl h4 {
		font-size: 18px;
		text-align: center;
	}
	.sec-ttl span {
		color: #629879;
		font-style:italic;
		font-size: 40px;
		line-height: 1.2;
	}
	.pc-only {
		display: none;
	}
	.sp-only {
		display: block;
	}

	/*--- ヘッダー ---*/
	#header .inner {
		max-width: 90%;
		margin:0  auto;
		align-items: center;
		justify-content: space-between;
	}
	.head-logo {
		max-width: 300px;
		margin: auto;
	}
	
	/*--- メインビジュアル ---*/
	.mainvisual {
		height: 70vh;
	}
	.catch-copy {
		width: 95%;
	}
	.catch-copy h2 {
		font-size: 30px;
		line-height: 1;
		text-align: center;
	}
	.catch-copy h2 span {
		color: #629879;
		font-size: 50px;
	}
	.catch-copy h3 {
		font-size: 20px;
		line-height: 1.5;
		text-align: center;
	}


	/*--- お知らせ ---*/
	#news .inner {
		width: 90%;
		margin: auto;
	}
	#news .inner dl {
		width: 100%;
		justify-content: space-between;
		flex-direction: column;
	}
	#news .inner dl dt,
	#news .inner dl dd {
		font-size: 14px;
	}
	#news .inner dl dt {
		width: 20%;
		border-top: none;
		border-bottom: none;
		padding: 8px 0;
		box-sizing: border-box;
		color: #629879;
		text-align: center;
	}
	#news .inner dl dd {
		width: 100%;
		border-top: none;
		border-bottom: 1px solid #ccc;
		box-sizing: border-box;
		padding: 8px 0;
	}


	/*--- ご挨拶 ---*/
	

	/*--- 事業内容 ---*/
	#works .inner {
		width: 90%;
		margin: auto;
		flex-direction: column;
		gap:5rem;
	}
	#works .inner .item {
		width: 100%;
	}
	.page-link {
		width: 300px;
		margin: 8rem auto 0 auto;
		background: #629879;
		padding: 20px 0;
	}
	.page-link a {
		display: block;
		font-size: 24px;
		text-align: center;
	}
	.page-link:hover {
		background: rgba(127,156,101,1.00);
	}


	/*--- 採用情報 ---*/
	#recruit .inner {
		width: 100%;
	}
	.recruit-message p {
		text-align: center;
		font-size: 14px;
		line-height: 2;
	}

	/*--- フッター ---*/
	#footer {
		margin-top: 10rem;
	}
	.foot-nav {
		max-width: 90%;
		margin: auto;
		padding-bottom: 8px;
		border-bottom: 1px solid #ccc;
	}
	.foot-nav ul {
		width: 100%;
		justify-content: center;
		gap:5rem;
	}
	.foot-nav ul li a {
		font-size: 14px;
		color: #333;
	}
	.foot-logo {
		width: 350px;
		margin: 5rem auto 2rem auto;
	}
	.foot-adress {
		font-size: 14px;
		text-align: center;
	}
	#footer .wbg-tel {
		margin: 1rem auto 0 auto;
	}

	.copy {
		text-align: center;
		font-size: 12px;
	}


	/*------ 下層 ------*/

	/*--- メインビジュアル ---*/
	.s-mainvisual {
		width: 100%;
		height: 25vh;
		background: url("../img/s-mainvisual.png");
		background-size: cover;
		background-position: center;
		position: relative;
	}
	.pagettl {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%);
	}
	.pagettl h2 {
		font-size: 30px;
		line-height: 1;
		text-align: center;
	}
	.s_sec-ttl {
		width: 70%;
		margin-right: auto;
		border-bottom: 10px solid rgba(98,152,121,0.7);
		padding-bottom: 5px;
		padding-left: 20px;
	}
	.s_sec-ttl h3 {
		font-size: 20px;
	}


	/*--- 事業内容 ---*/
	.work-item .inner {
		width: 90%;
		margin: 5rem auto;
		flex-direction: column;
		gap:5rem;
	}
	.work-item .inner .img {
		width: 100%;
	}
	.work-item .inner .txt {
		width: 100%;
	}
	.work-item .inner .txt p {
		font-size: 14px;
		line-height: 2;
	}

	#works-bottom {
		background: #E8F3EB;
		padding: 5rem 0;
	}
	.wb-message p {
		text-align: center;
		font-size: 16px;
		line-height: 2;
	}


	/*--- 採用情報 ---*/
	#staff-wanted .inner {
		width: 90%;
		margin: 5rem auto;
		flex-direction: column;
		gap: 5rem;
	}
	#staff-wanted .inner .txt {
		width: 100%;
	}
	#staff-wanted .inner .txt p {
		font-size: 14px;
		line-height: 2;
		text-align: center;
	}
	#staff-wanted .inner .img {
		width: 100%;
	} 
	.gbg-tel {
		width: 350px;
		margin: 5rem auto 0 auto;
		background: #ECFEF2;
		padding: 8px 0;
	}
	.gbg-tel .tel-link {
		text-align: center;
	}
	#AR .inner {
		width: 98%;
		margin: 5rem auto;
	}
	#AR .inner table {
		font-size: 12px;
	}
	#AR .inner table th {
		width: 35%;
	}
	#AR .inner table td {
		width: 65%;
	}



	/*--- 会社概要 ---*/
	#company-info .inner {
		width: 90%;
		margin: 5rem auto;
	}
	#company-info .inner table {
		width: 100%;
	}
	#company-info .inner table th,
	#company-info .inner table td {
		display: block;
	}
	#company-info .inner table th {
		width: 100%;
		padding: 14px 0;
		font-size: 14px;
		text-align: center;
	}
	#company-info .inner table td {
		width: 100%;
		padding: 16px 0;
		font-size: 14px;
		text-align: center;
	}
}
