@charset "UTF-8";


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

/*=============================================================
#kv
=============================================================*/
	
	#kv {
		box-sizing: border-box;
		width: 100%;
		height: calc(56.25vw - clamp(60px,6.0vw,85px));
		max-height: calc(100vh - clamp(60px,6.0vw,85px));
		min-height: 600px;
		background-image: url("../images/top/kv.jpg");
		background-size: cover;
		overflow: hidden;
		position: relative;
	}

/*kv3分割スライド*/
	
	.cover1,
	.cover2,
	.cover3 {
		width: 100%;
		display: block;
		animation: cover 1.5s cubic-bezier(.4, 0, .2, 1) forwards;
		background: #fff;
		height: calc(100%/3);
		left: 0;
		pointer-events: none;
		position: absolute;
		right: 0;
		z-index: 5;
		border-radius: 0 -50% -50% 0;
	}

	.cover1 {
	  top: 0;
	}

	.cover2 {
	  animation-delay: .2s;
	  top: calc(100%/3);
	}

	.cover3 {
	  animation-delay: .4s;
	  top: calc(100%/3*2);
	}
	
	@keyframes cover {
	  100% {
		transform: translateX(100%);
		}
	}
	
	#kv .wrap {
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
	}

/*kv大見出し*/
	
	#kv .wrap .box h1 {
		color: #fff;
		font-size: clamp(3.8rem,4.0vw, 5.2rem);
		font-weight: bold;
		letter-spacing: 0.025em;
		text-align: center;
		box-sizing: border-box;
		padding:0 .5em .2em;
		background-image: url("../images/top/bg_line.png");
		background-size: contain;
		background-position: bottom;
		background-repeat: no-repeat;
	}
	
	#kv .wrap .box p {
		color: #fff;
		line-height: 2;
		font-weight: bold;
		text-align: center;
		font-size: clamp(1.7rem,1.8vw, 2.3rem);
	}
	
	#kv .wrap .box p:first-of-type {
		margin-top: clamp(30px,2.8vw,40px);
	}
	
	.slide_up {
		transform: translate(0,40%);
		opacity: 0;
		transition: all 1s;
		animation: up 1.5s cubic-bezier(.06,.65,.3,1) forwards;
		animation-delay: 1.0s;
	  }
	
	.slide_up:nth-child(2) {
		animation-delay: 1.5s;
	}
	.slide_up:nth-child(3) {
		animation-delay: 1.75s;
	}
	
	@keyframes up {
	  100% {
		  transform: translate(0,0);
		  opacity: 1;
		}
	}

/*scroll矢印*/
	
	.scroll_arrow {
		position: absolute;
		padding-bottom: 10px;
		bottom: 70px;
		left: calc(50% - 12px);
		z-index: 2;
		display: inline-block;
		transform: translate(0, -10%);
		animation: fade 1s ease forwards;
		animation-delay: 2s;
		opacity: 0;
	}
	
	@keyframes fade {
	  100% {
		  transform: translate(0,0);
		  opacity: .9;
		}
	}
	
	.scroll_arrow p {
		color: #fff;
		font-size: 1.5rem;
		line-height: 1;
		opacity: .9;
	}

	.scroll_arrow span {
		position: absolute;
		top: 0;
		left: 50%;
		width: 24px;
		height: 24px;
		margin-left: -12px;
		border-left: 1px solid #fff;
		border-bottom: 1px solid #fff;
		transform: rotate(-45deg);
		animation: sdb 2s infinite;
		opacity: 0;
		box-sizing: border-box;
	}
	
	.scroll_arrow span:nth-of-type(1) {
		animation-delay: 0s;
		top: 16px;
	}
	.scroll_arrow span:nth-of-type(2) {
		top: 32px;
		animation-delay: .15s;
	}
	.scroll_arrow span:nth-of-type(3) {
		top: 48px;
		animation-delay: .3s;
	}
	
	@keyframes sdb {
		0% {
			opacity: 0;
		}
		50% {
			opacity: 1;
		}
		100% {
			opacity: 0;
		}
	}
	
/*=============================================================
#company
=============================================================*/
	
	section#company {
		margin-top: min(7.0vw,100px);
	}
	
	#company .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: max(3vw,((100vw - 1400px)/2));
		margin-right: 0;
		position: relative;
		z-index: 2;
	}
	
	#company .outer::before{
		position: absolute;
		content: "";
		width: calc(100% - min(7.0vw,100px));
		height: calc(100% - min(7.0vw,100px));
		padding-top: min(7.0vw,100px);
		box-sizing: border-box;
		top: 0;
		right: 0;
		background-color: #5b8b55;
		z-index: -1;
	}

	#company .outer h2 {
		display: flex;
		align-items: center;
		padding-top: min(5.6vw,80px);
		color: #fff;
	}
	
	#company .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #fff;
		margin-left: 1em;
	}
	
	#company .outer .inner {
		display: flex;
		justify-content: space-between;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
		padding-top: min(5.6vw,80px);
		box-sizing: border-box;
	}

	#company .outer .inner .image {
		width: 30%;
		max-width: 420px;
		align-self: flex-end;
	}
	
	#company .outer .inner .wrap {
		width: calc(70% - 3vw);
		box-sizing: border-box;
		margin-right: max(3vw,((100vw - 1400px)/2));
		margin-left: min(3vw,50px);
		display: flex;
		flex-direction: column;
	}
	
	#company .outer .inner .wrap h3 {
		color: #fff;
		font-size: clamp(2.0rem,2.4vw,2.8rem);
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#company .outer .inner .wrap .box {
		background-color: #fff;
		margin-top: min(3vw,42px);
		flex-grow: 1;
		box-sizing: border-box;
		padding: clamp(20px,3vw,42px) clamp(20px,3vw,42px) 0;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	
	#company .outer .inner .wrap .box p {
		text-align: justify;
		margin-top: 1em;
	}
	#company .outer .inner .wrap .box p:first-of-type {
		margin-top: 0;
	}
	
	#company .outer .inner .wrap .box .btnA {
		margin-top: min(5.6vw,80px);
	}

/*=============================================================
#service
=============================================================*/
	
	#service .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: 0;
		margin-right: max(3vw,((100vw - 1400px)/2));
		position: relative;
	}
	
	#service .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	#service .outer h2::before {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-right: 1em;
	}
	
	#service .outer h2 .en {
		order: 5;
		padding-right: 0;
		padding-left: .5em;
	}
	
	#service .inner {
		padding-top: min(4.9vw,70px);
	}
	
	#service .inner .main_text {
		color: #d28054;
		font-size: clamp(2.0rem,2.4vw,2.8rem);
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#service .inner ul {
		margin-top: min(6.3vw,90px);
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	
	#service .inner ul li {
		width: 33.3333%;
		box-sizing: border-box;
		padding: 0 2%;
		text-align: center;
	}
	
	#service .inner ul li:nth-child(4),
	#service .inner ul li:nth-child(5) {
		margin-top: min(5.6vw,80px);
	}
	
	#service .inner ul li .image {
		border-radius: 50%;
		overflow: hidden;
		position: relative;
		filter: drop-shadow(min(1.4vw,20px) min(1.4vw,20px) 0px #eaeaea);
	}
	
	#service .inner ul li h3 {
		margin: min(5.6vw,80px) auto 0;
		font-size: clamp(1.6rem,2.0vw,2.4rem);
		font-weight: bold;
		position: relative;
		z-index: 2;
		display: inline-block;
		padding: 0 .1em 5px;
	}
	
	#service .inner ul li h3::before{
		position: absolute;
		font-family: 'Roboto', sans-serif;
		font-size: clamp(1.5rem,1.8vw,2.0rem);
		top: -1.5em;
		left: 0;
	}
	
	#service .inner ul li:nth-child(1) h3::before{
		content: "01";
	}
	#service .inner ul li:nth-child(2) h3::before{
		content: "02";
	}
	#service .inner ul li:nth-child(3) h3::before{
		content: "03";
	}
	#service .inner ul li:nth-child(4) h3::before{
		content: "04";
	}
	#service .inner ul li:nth-child(5) h3::before{
		content: "05";
	}
	
	#service .inner ul li h3::after {
		content: "";
		position: absolute;
		background-color: rgba(210,128,84,.8);
		width: 100%;
		height: 45%;
		left: 0;
		bottom: 0;
		z-index: -1;
	}
	
	#service .btnA {
		margin: min(8.4vw,120px) auto 0;
	}
	
/*=============================================================
#price
=============================================================*/
	
	#price {
		background-color: #eaeaea;
		position: relative;
	}
	#price::before {
		content: "";
		background-color: #fff;
		position: absolute;
		width: 100%;
		font-size: clamp(1.3rem,1.575vw,2.35rem);/*emのサイズを定義*/
		height: 1em;
		top: 0;
		z-index: 1;
	}
	
	#price::after {
		content: "";
		background-color: #fff;
		position: absolute;
		width: 100%;
		font-size: 1.6em;
		height: 1.5em;
		bottom: 0;
		z-index: 1;
	}
	
	
	#price .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: max(3vw,((100vw - 1400px)/2));
		margin-right: 0;
		position: relative;
	}
	
	#price .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		z-index: 2;
		position: relative;
	}

	#price .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-left: 1em;
	}
	
	#price .inner {
		padding: 0 4.5vw;
	}
	
	#price .inner h3 {
		font-size: clamp(2.1rem,2.6vw,3.0rem);
		color: #d28054;
		font-weight: bold;
		letter-spacing: .025em;
		text-align: center;
		margin: min(5.6vw,80px) auto 0;
	}
	
	#price .inner dl {
		margin: min(7.0vw,100px) auto 0;
		display: flex;
		flex-wrap: wrap;
		position: relative;
		z-index: 2;
	}
	
	#price .inner dl::before,
	#price .inner dl::after {
		content: "";
		position: absolute;
		width: min(3vw,42px);
		height: min(3vw,42px);
		background-color: #d28054;
		z-index: -1;
	}
	
	#price .inner dl::before {
		bottom: calc(100% - min(1.5vw,21px));
		right: calc(100% - min(1.5vw,21px));
	}
	#price .inner dl::after {
		top: calc(100% - min(1.5vw,21px));
		left: calc(100% - min(1.5vw,21px));
	}
	
	#price .inner dt,
	#price .inner dd {
		border-bottom: 1px solid #eaeaea;
		border-right: 1px solid #eaeaea;
		box-sizing: border-box;
		padding: 1em;
		background-color: #fff;
		display: flex;
		flex-direction: column;
	}
	
	#price .inner dt.head,
	#price .inner dd.head {
		text-align: center;
		font-weight: bold;
	}
	
	#price .inner dt {
		width: 9em;
		text-align: center;
		justify-content: center;
	}
	
	#price .inner dd.spec {
		width: calc(100% - 18em);
	}
	
	#price .inner dd.yen {
		width: 9em;
		justify-content: center;
		text-align: center;
	}
	
	#price .inner .btnA {
		margin: min(8.4vw,120px) auto 0;
	}
	
	#price .inner .btnA a{
		position: relative;
		z-index: 2;
	}

/*=============================================================
#works
=============================================================*/	
	
	#works .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: 0;
		margin-right: max(3vw,((100vw - 1400px)/2));
		position: relative;
	}
	
	#works .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	#works .outer h2::before {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-right: 1em;
	}
	
	#works .outer h2 .en {
		order: 5;
		padding-right: 0;
		padding-left: .5em;
	}
	
	#works .inner {
		padding-top: min(4.9vw,70px);
	}
	
	#works .inner .main_text {
		color: #d28054;
		font-size: clamp(2.0rem,2.4vw,2.8rem);
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#works .inner .sub_text {
		margin-top: min(2.8vw,40px);
		color: #5b8b55;
		font-weight: bold;
		font-size: clamp(1.8rem,2.0vw,2.4rem);
	}
	
	#works .inner ul {
		margin-top: min(2.1vw,30px);
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	#works .inner ul .box {
		margin-top: min(4.9vw,70px);
	}
	
	#works .inner ul .box a {
		width: 100%;
		display: flex;
		box-sizing: border-box;
		border: 1px solid #222;
		box-shadow: min(1.4vw,20px) min(1.4vw,20px) #eaeaea;
		transition: .3s ease;
		position: relative;
	}
	
	#works .inner ul .box a::before {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 0 min(2.1vw,30px) min(2.1vw,30px);
		border-color: transparent transparent #d28054 transparent;
		right: 10px;
		bottom: 10px;
		transition-delay: .1s;
		transition: .2s ease;
	}

	#works .inner ul .box a:hover {
		opacity: 0.7;
	}

	#works .inner ul .box a:hover::before {
		right: 0;
		bottom: 0;
	}
	
	#works .inner ul .text_wrap h3 {
		font-size: clamp(1.7rem,1.9vw,2.0rem);
		font-weight: bold;
	}
	
	#works .inner ul .text_wrap dl {
		display: flex;
		flex-wrap: wrap;
		margin-top: .5em;
	}
	
	#works .inner ul .text_wrap dt {
		width: 5em;
		box-sizing: border-box;
		margin-top: .75em;
		background-color: #d2d2d2;
		padding: .1em .5em;
		text-align: center;
		align-self: flex-start;
	}
	
	#works .inner ul .text_wrap dd {
		width: calc(100% - 6em);
		box-sizing: border-box;
		padding: .1em .5em;
		margin-left: 1em;
		margin-top: .75em;
	}	
	
	#works .inner .btnA {
		margin: min(8.4vw,120px) auto 0;
	}

}

/*施工実績3行2列*/

@media screen and (min-width: 1025px) {
	
	#works .inner ul .box {
		width: calc(48.5% - min(1.4vw,20px));
	}
	
	#works .inner ul .box .image {
		width: 40%;
	}
	
	#works .inner ul .box .image img {
		height: 100%;
		object-fit: cover;
		object-position:left;
	}
	
	#works .inner ul .box .text_wrap {
		width: 60%;
		padding: min(1.4vw,20px);
		box-sizing: border-box;
	}

}

/*施工実績2行3列*/

@media screen and (min-width: 769px) and (max-width: 1024px) {
	
	#works .inner ul .box {
		width: calc(31.5% - min(1.4vw,20px));
	}
	
	#works .inner ul .box a {
		width: 100%;
		flex-direction: column;
	}

	#works .inner ul .box .text_wrap {
		width: 100%;
		padding: min(1.4vw,20px);
		box-sizing: border-box;
		min-height: 20vw;
	}
	
	#works .inner ul .text_wrap dt,
	#works .inner ul .text_wrap dd {
		font-size: clamp(1.3rem,1.4vw,1.6rem);
	}
}

@media screen and (min-width: 769px) {
	
/*=============================================================
#recruit
=============================================================*/

	#recruit .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: max(3vw,((100vw - 1400px)/2));
		margin-right: 0;
		position: relative;
		z-index: 2;
	}
	
	#recruit .outer::before{
		position: absolute;
		content: "";
		width: calc(100% - min(7.0vw,100px));
		height: calc(100% - min(7.0vw,100px));
		padding-top: min(7.0vw,100px);
		box-sizing: border-box;
		top: 0;
		right: 0;
		background-color: #5b8b55;
		z-index: -1;
	}

	#recruit .outer h2 {
		display: flex;
		align-items: center;
		padding-top: min(5.6vw,80px);
		color: #fff;
	}
	
	#recruit .outer h2 .en {
		padding-left: 0.3em;
	}
	
	#recruit .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #fff;
		margin-left: 1em;
	}
	
	#recruit .outer .inner {
		display: flex;
		justify-content: space-between;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
		padding-top: min(5.6vw,80px);
		box-sizing: border-box;
	}

	#recruit .outer .inner .image {
		width: 30%;
		max-width: 420px;
		align-self: flex-end;
	}
	
	#recruit .outer .inner .wrap {
		width: calc(70% - 3vw);
		box-sizing: border-box;
		margin-right: max(3vw,((100vw - 1400px)/2));
		margin-left: min(3vw,50px);
		display: flex;
		flex-direction: column;
	}
	
	#recruit .outer .inner .wrap h3 {
		color: #fff;
		font-size: clamp(2.0rem,2.4vw,2.8rem);
		font-weight: bold;
		letter-spacing: .025em;
		line-height: 1.8;
	}
	
	#recruit .outer .inner .wrap .box {
		background-color: #fff;
		margin-top: min(2vw,28px);
		flex-grow: 1;
		box-sizing: border-box;
		padding: clamp(20px,3vw,42px) clamp(20px,3vw,42px) 0;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	
	#recruit .outer .inner .wrap .box p {
		text-align: justify;
		margin-top: 1em;
	}
	#recruit .outer .inner .wrap .box p:first-of-type {
		margin-top: 0;
	}
	
	#recruit .outer .inner .wrap .box .btnA {
		margin-top: min(5.6vw,80px);
	}
	
/*=============================================================
contact
=============================================================*/

}


@media screen and (min-width: 521px) and (max-width: 768px) {
	
/*=============================================================
#kv
=============================================================*/
	
	#kv {
		box-sizing: border-box;
		aspect-ratio: 4 / 3;
		width: 100%;
		background-image: url("../images/top/kv.jpg");
		background-size: cover;
		background-position: center;
		overflow: hidden;
		position: relative;
	}

/*kv3分割スライド*/
	
	.cover1,
	.cover2,
	.cover3 {
		width: 100%;
		display: block;
		animation: cover 1.5s cubic-bezier(.4, 0, .2, 1) forwards;
		background: #fff;
		height: calc(100%/3);
		left: 0;
		pointer-events: none;
		position: absolute;
		right: 0;
		z-index: 5;
		border-radius: 0 -50% -50% 0;
	}

	.cover1 {
	  top: 0;
	}

	.cover2 {
	  animation-delay: .2s;
	  top: calc(100%/3);
	}

	.cover3 {
	  animation-delay: .4s;
	  top: calc(100%/3*2);
	}
	
	@keyframes cover {
	  100% {
		transform: translateX(100%);
		}
	}
	
	#kv .wrap {
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
	}

/*kv大見出し*/
	
	#kv .wrap .box {
		text-align: center;
	}
	
	#kv .wrap .box h1 {
		display: inline-block;
		color: #fff;
		font-size: clamp(3.2rem,4.0vw, 5.2rem);
		font-weight: bold;
		letter-spacing: 0.025em;
		text-align: center;
		box-sizing: border-box;
		padding:0 .5em .2em;
		background-image: url("../images/top/bg_line.png");
		background-size: contain;
		background-position: bottom;
		background-repeat: no-repeat;
	}
	
	#kv .wrap .box p {
		color: #fff;
		line-height: 2;
		font-weight: bold;
		text-align: center;
		font-size: clamp(1.7rem,1.8vw, 2.3rem);
	}
	
	#kv .wrap .box p:first-of-type {
		margin-top: clamp(30px,2.8vw,40px);
	}
	
	.slide_up {
		transform: translate(0,40%);
		opacity: 0;
		transition: all 1s;
		animation: up 1.5s cubic-bezier(.06,.65,.3,1) forwards;
		animation-delay: 1.0s;
	  }
	
	.slide_up:nth-child(2) {
		animation-delay: 1.5s;
	}
	.slide_up:nth-child(3) {
		animation-delay: 1.75s;
	}
	
	@keyframes up {
	  100% {
		  transform: translate(0,0);
		  opacity: 1;
		}
	}

/*scroll矢印*/
	
	.scroll_arrow {
		position: absolute;
		padding-bottom: 10px;
		bottom: 70px;
		left: calc(50% - 12px);
		z-index: 2;
		display: inline-block;
		transform: translate(0, -10%);
		animation: fade 1s ease forwards;
		animation-delay: 2s;
		opacity: 0;
	}
	
	@keyframes fade {
	  100% {
		  transform: translate(0,0);
		  opacity: .9;
		}
	}
	
	.scroll_arrow p {
		color: #fff;
		font-size: 1.5rem;
		line-height: 1;
		opacity: .9;
	}

	.scroll_arrow span {
		position: absolute;
		top: 0;
		left: 50%;
		width: 24px;
		height: 24px;
		margin-left: -12px;
		border-left: 1px solid #fff;
		border-bottom: 1px solid #fff;
		transform: rotate(-45deg);
		animation: sdb 2s infinite;
		opacity: 0;
		box-sizing: border-box;
	}
	
	.scroll_arrow span:nth-of-type(1) {
		animation-delay: 0s;
		top: 16px;
	}
	.scroll_arrow span:nth-of-type(2) {
		top: 32px;
		animation-delay: .15s;
	}
	.scroll_arrow span:nth-of-type(3) {
		top: 48px;
		animation-delay: .3s;
	}
	
	@keyframes sdb {
		0% {
			opacity: 0;
		}
		50% {
			opacity: 1;
		}
		100% {
			opacity: 0;
		}
	}
	
/*=============================================================
#company
=============================================================*/
	
	section#company {
		margin-top:  60px;
	}
	
	#company .outer {
		box-sizing: border-box;
		margin-left: 3vw;
		margin-right: 0;
		position: relative;
		z-index: 2;
	}
	
	#company .outer::before{
		position: absolute;
		content: "";
		width: calc(100% - (60px - 3vw));
		height: 100%;
		padding-top: 60px;
		box-sizing: border-box;
		top: 0;
		right: 0;
		background-color: #5b8b55;
		z-index: -1;
	}

	#company .outer h2 {
		display: flex;
		align-items: center;
		padding-top: 45px;
		color: #fff;
	}
	
	#company .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #fff;
		margin-left: 1em;
	}
	
	#company .outer .inner {
		display: flex;
		justify-content: space-between;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
		padding-top: 45px;
		box-sizing: border-box;
	}

	#company .outer .inner .image {
		width: 60%;
		align-self: flex-start;
	}
	
	#company .outer .inner .wrap {
		width: 80%;
		box-sizing: border-box;
		padding: 6vw 3vw;
		display: flex;
		flex-direction: column;
		background-color: rgba(255,255,255,0.8);
		margin-left: calc(-40% - 3vw);
		margin-right: 3vw;
		margin-top: 60px;
		margin-bottom: 60px;
	}
	
	#company .outer .inner .wrap h3 {
		color: #222;
		font-size: clamp(1.8rem,3.6vw,2.4rem);
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#company .outer .inner .wrap .box {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin-top: 3vw;
	}
	
	#company .outer .inner .wrap .box p {
		text-align: justify;
		margin-top: 1em;
	}
	#company .outer .inner .wrap .box p:first-of-type {
		margin-top: 0;
	}
	
	#company .outer .inner .wrap .box .btnA {
		margin-top: 60px;
		align-self: flex-end;
		margin-right: 3vw;
	}

/*=============================================================
#service
=============================================================*/
	
	#service .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: 0;
		margin-right: max(3vw,((100vw - 1400px)/2));
		position: relative;
	}
	
	#service .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	#service .outer h2::before {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-right: 1em;
	}
	
	#service .outer h2 .en {
		order: 5;
		padding-right: 0;
		padding-left: .5em;
	}
	
	#service .inner {
		padding-top: 45px;
	}
	
	#service .inner .main_text {
		color: #d28054;
		font-size: clamp(1.8rem,3.6vw,2.4rem);
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#service .inner ul {
		margin-top: 45px;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	
	#service .inner ul li {
		width: 33.3333%;
		box-sizing: border-box;
		padding: 0 2%;
		text-align: center;
	}
	
	#service .inner ul li:nth-child(4),
	#service .inner ul li:nth-child(5) {
		margin-top: 45px;
	}
	
	#service .inner ul li .image {
		border-radius: 50%;
		overflow: hidden;
		position: relative;
		filter: drop-shadow(1.5vw 1.5vw 0px #eaeaea);
	}
	
	#service .inner ul li h3 {
		margin: 60px auto 0;
		font-size: 1.6rem;
		font-weight: bold;
		position: relative;
		z-index: 2;
		display: inline-block;
		padding: 0 .1em 5px;
		line-height: 1.8;
	}
	
	#service .inner ul li h3::before{
		position: absolute;
		font-family: 'Roboto', sans-serif;
		font-size: 1.4rem;
		top: -1.5em;
		left: 0;
	}
	
	#service .inner ul li:nth-child(1) h3::before{
		content: "01";
	}
	#service .inner ul li:nth-child(2) h3::before{
		content: "02";
	}
	#service .inner ul li:nth-child(3) h3::before{
		content: "03";
	}
	#service .inner ul li:nth-child(4) h3::before{
		content: "04";
	}
	#service .inner ul li:nth-child(5) h3::before{
		content: "05";
	}
	
	#service .inner ul li h3::after {
		content: "";
		position: absolute;
		background-color: rgba(210,128,84,.8);
		width: 100%;
		height: .8em;
		left: 0;
		bottom: .4em;
		z-index: -1;
	}
	
	#service .btnA {
		margin: 60px auto 0;
	}
	
/*=============================================================
#price
=============================================================*/
	
	#price {
		background-color: #eaeaea;
		position: relative;
		margin-top: 100px;
	}
	#price::before {
		content: "";
		background-color: #fff;
		position: absolute;
		width: 100%;
		font-size: clamp(1.3rem,1.575vw,2.35rem);/*emのサイズを定義*/
		height: 1em;
		top: 0;
		z-index: 1;
	}
	
	#price::after {
		content: "";
		background-color: #fff;
		position: absolute;
		width: 100%;
		font-size: 1.6em;
		height: 1.5em;
		bottom: 0;
		z-index: 1;
	}
	
	
	#price .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: max(3vw,((100vw - 1400px)/2));
		margin-right: 0;
		position: relative;
	}
	
	#price .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		z-index: 2;
		position: relative;
	}

	#price .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-left: 1em;
	}
	
	#price .inner {
		padding: 0 4.5vw;
	}
	
	#price .inner h3 {
		font-size: clamp(1.8rem,3.6vw,2.4rem);
		color: #d28054;
		font-weight: bold;
		letter-spacing: .025em;
		text-align: center;
		margin: 45px auto 0;
	}
	
	#price .inner dl {
		margin: 60px auto 0;
		display: flex;
		flex-wrap: wrap;
		position: relative;
		z-index: 2;
	}
	
	#price .inner dl::before,
	#price .inner dl::after {
		content: "";
		position: absolute;
		width: 3vw;
		height: 3vw;
		background-color: #d28054;
		z-index: -1;
	}
	
	#price .inner dl::before {
		bottom: calc(100% - 1.5vw);
		right: calc(100% - 1.5vw);
	}
	#price .inner dl::after {
		top: calc(100% - 1.5vw);
		left: calc(100% - 1.5vw);
	}
	
	#price .inner dt,
	#price .inner dd {
		border-bottom: 1px solid #eaeaea;
		border-right: 1px solid #eaeaea;
		box-sizing: border-box;
		padding: 1em .5em;
		background-color: #fff;
		display: flex;
		flex-direction: column;
	}
	
	#price .inner dt.head,
	#price .inner dd.head {
		text-align: center;
		font-weight: bold;
	}
	
	#price .inner dt {
		width: 9em;
		text-align: center;
		justify-content: center;
	}
	
	#price .inner dd.spec {
		width: calc(100% - 18em);
	}
	
	#price .inner dd.yen {
		width: 9em;
		justify-content: center;
		text-align: center;
	}
	
	#price .inner .btnA {
		margin: min(8.4vw,120px) auto 0;
	}
	
	#price .inner .btnA a{
		position: relative;
		z-index: 2;
	}

/*=============================================================
#works
=============================================================*/

	#works {
		margin-top: 100px;
	}
	
	#works .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: 0;
		margin-right: max(3vw,((100vw - 1400px)/2));
		position: relative;
	}
	
	#works .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	#works .outer h2::before {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-right: 1em;
	}
	
	#works .outer h2 .en {
		order: 5;
		padding-right: 0;
		padding-left: .5em;
	}
	
	#works .inner {
		padding-top: 45px;
	}
	
	#works .inner .main_text {
		color: #d28054;
		font-size: clamp(1.8rem,3.6vw,2.4rem);
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#works .inner .sub_text {
		margin-top: 45px;
		color: #5b8b55;
		font-size: clamp(1.6rem,3.0vw,2.0rem);
		font-weight: bold;
	}
	
	#works .inner ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	#works .inner ul .box {
		margin-top: 45px;
	}
	
	#works .inner ul .box a {
		width: 100%;
		display: flex;
		box-sizing: border-box;
		border: 1px solid #222;
		box-shadow: 1.5vw 1.5vw #eaeaea;
		transition: .3s ease;
		position: relative;
	}
	
	#works .inner ul .box a::before {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 0 1.5vw 1.5vw;
		border-color: transparent transparent #d28054 transparent;
		right: 1.5vw;
		bottom: 1.5vw;
		transition-delay: .1s;
		transition: .2s ease;
	}
	
	#works .inner ul .text_wrap h3 {
		font-size: 1.7rem;
		font-weight: bold;
	}
	
	#works .inner ul .text_wrap dl {
		display: flex;
		flex-wrap: wrap;
		margin-top: .5em;
	}
	
	#works .inner ul .text_wrap dt {
		width: 5em;
		box-sizing: border-box;
		margin-top: .75em;
		background-color: #d2d2d2;
		padding: .1em .5em;
		text-align: center;
		align-self: flex-start;
	}
	
	#works .inner ul .text_wrap dd {
		width: calc(100% - 6em);
		box-sizing: border-box;
		padding: .1em .5em;
		margin-left: 1em;
		margin-top: .75em;
	}	
	
	#works .inner .btnA {
		margin: 60px auto 0;
	}

	#works .inner ul .box {
		width: calc(48.5% - 1.5vw);
	}
	
	#works .inner ul .box a {
		width: 100%;
		flex-direction: column;
	}

	#works .inner ul .box .text_wrap {
		width: 100%;
		padding: 3vw 1.5vw;
		box-sizing: border-box;
		min-height: 20vw;
	}
	
	#works .inner ul .text_wrap dt,
	#works .inner ul .text_wrap dd {
		font-size: 1.4rem;
	}
	
/*=============================================================
#recruit
=============================================================*/

	#recruit .outer {
		box-sizing: border-box;
		margin-left: 3vw;
		margin-right: 0;
		position: relative;
		z-index: 2;
	}
	
	#recruit .outer::before{
		position: absolute;
		content: "";
		width: calc(100% - (60px - 3vw));
		height: 100%;
		padding-top: 60px;
		box-sizing: border-box;
		top: 0;
		right: 0;
		background-color: #5b8b55;
		z-index: -1;
	}

	#recruit .outer h2 {
		display: flex;
		align-items: center;
		padding-top: 45px;
		color: #fff;
	}
	
	#recruit .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #fff;
		margin-left: 1em;
	}
	
	#recruit .outer .inner {
		display: flex;
		justify-content: space-between;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
		padding-top: 45px;
		box-sizing: border-box;
	}

	#recruit .outer .inner .image {
		width: 60%;
		align-self: flex-start;
	}
	
	#recruit .outer .inner .wrap {
		width: 80%;
		box-sizing: border-box;
		padding: 6vw 3vw;
		display: flex;
		flex-direction: column;
		background-color: rgba(255,255,255,0.8);
		margin-left: calc(-40% - 3vw);
		margin-right: 3vw;
		margin-top: 60px;
		margin-bottom: 60px;
	}
	
	#recruit .outer .inner .wrap h3 {
		color: #222;
		font-size: clamp(1.8rem,3.6vw,2.4rem);
		font-weight: bold;
		letter-spacing: .025em;
		line-height: 1.8;
	}
	
	#recruit .outer .inner .wrap .box {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin-top: 3vw;
	}
	
	#recruit .outer .inner .wrap .box p {
		text-align: justify;
		margin-top: 1em;
	}
	#recruit .outer .inner .wrap .box p:first-of-type {
		margin-top: 0;
	}
	
	#recruit .outer .inner .wrap .box .btnA {
		margin-top: 60px;
		align-self: flex-end;
		margin-right: 3vw;
	}
	
/*=============================================================
contact
=============================================================*/
	
}

@media screen and  (max-width: 520px) {
	
/*=============================================================
#kv
=============================================================*/
	
	#kv {
		box-sizing: border-box;
		width: 100%;
		height: 100vw;
		background-image: url("../images/top/kv.jpg");
		background-size: cover;
		background-position: center;
		overflow: hidden;
		position: relative;
	}

/*kv3分割スライド*/
	
	.cover1,
	.cover2,
	.cover3 {
		width: 100%;
		display: block;
		animation: cover 1.5s cubic-bezier(.4, 0, .2, 1) forwards;
		background: #fff;
		height: calc(100%/3);
		left: 0;
		pointer-events: none;
		position: absolute;
		right: 0;
		z-index: 5;
		border-radius: 0 -50% -50% 0;
	}

	.cover1 {
	  top: 0;
	}

	.cover2 {
	  animation-delay: .2s;
	  top: calc(100%/3);
	}

	.cover3 {
	  animation-delay: .4s;
	  top: calc(100%/3*2);
	}
	
	@keyframes cover {
	  100% {
		transform: translateX(100%);
		}
	}
	
	#kv .wrap {
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
	}

/*kv大見出し*/
	
	#kv .wrap .box {
		text-align: center;
	}
	
	#kv .wrap .box h1 {
		display: inline-block;
		color: #fff;
		font-size: clamp(3.0rem,7.0vw, 6.0rem);
		font-weight: bold;
		letter-spacing: 0.025em;
		text-align: center;
		box-sizing: border-box;
		padding:0 .5em .2em;
		background-image: url("../images/top/bg_line.png");
		background-size: contain;
		background-position: bottom;
		background-repeat: no-repeat;
	}
	
	#kv .wrap .box p {
		color: #fff;
		line-height: 2;
		font-weight: bold;
		text-align: center;
		font-size: clamp(1.6rem,4.0vw, 2.25rem);
	}
	
	#kv .wrap .box p:first-of-type {
		margin-top: clamp(30px,2.8vw,40px);
	}
	
	.slide_up {
		transform: translate(0,40%);
		opacity: 0;
		transition: all 1s;
		animation: up 1.5s cubic-bezier(.06,.65,.3,1) forwards;
		animation-delay: 1.0s;
	  }
	
	.slide_up:nth-child(2) {
		animation-delay: 1.5s;
	}
	.slide_up:nth-child(3) {
		animation-delay: 1.75s;
	}
	
	@keyframes up {
	  100% {
		  transform: translate(0,0);
		  opacity: 1;
		}
	}

/*scroll矢印*/
	
	.scroll_arrow {
		position: absolute;
		padding-bottom: 10px;
		bottom: 50px;
		left: calc(50% - 12px);
		z-index: 2;
		display: inline-block;
		transform: translate(0, -10%);
		animation: fade 1s ease forwards;
		animation-delay: 2s;
		opacity: 0;
	}
	
	@keyframes fade {
	  100% {
		  transform: translate(0,0);
		  opacity: .9;
		}
	}
	
	.scroll_arrow p {
		color: #fff;
		font-size: 1.5rem;
		line-height: 1;
		opacity: .9;
	}

	.scroll_arrow span {
		position: absolute;
		top: 0;
		left: 50%;
		width: 12px;
		height: 12px;
		margin-left: -6px;
		border-left: 1px solid #fff;
		border-bottom: 1px solid #fff;
		transform: rotate(-45deg);
		animation: sdb 2s infinite;
		opacity: 0;
		box-sizing: border-box;
	}
	
	.scroll_arrow span:nth-of-type(1) {
		animation-delay: 0s;
		top: 16px;
	}
	.scroll_arrow span:nth-of-type(2) {
		top: 32px;
		animation-delay: .15s;
	}
	.scroll_arrow span:nth-of-type(3) {
		top: 48px;
		animation-delay: .3s;
	}
	
	@keyframes sdb {
		0% {
			opacity: 0;
		}
		50% {
			opacity: 1;
		}
		100% {
			opacity: 0;
		}
	}
	
/*=============================================================
#company
=============================================================*/
	
	section#company {
		margin-top:  60px;
	}
	
	#company .outer {
		box-sizing: border-box;
		margin-left: 3vw;
		margin-right: 0;
		position: relative;
		z-index: 2;
	}
	
	#company .outer::before{
		position: absolute;
		content: "";
		width: calc(100% - (50px - 3vw));
		height: 100%;
		padding-top: 50px;
		box-sizing: border-box;
		top: 0;
		right: 0;
		background-color: #5b8b55;
		z-index: -1;
	}

	#company .outer h2 {
		display: flex;
		align-items: center;
		padding-top: 40px;
		color: #fff;
	}
	
	#company .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #fff;
		margin-left: 1em;
	}
	
	#company .outer .inner {
		display: flex;
		justify-content: space-between;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
		padding-top: 40px;
		box-sizing: border-box;
	}

	#company .outer .inner .image {
		width: 90%;
		align-self: flex-start;
	}
	
	#company .outer .inner .wrap {
		width: 90%;
		min-height: 87.3vw;
		box-sizing: border-box;
		padding: 6vw 3vw;
		display: flex;
		flex-direction: column;
		background-color: rgba(255,255,255,0.7);
		margin-left: calc(-80% - 3vw);
		margin-right: 3vw;
		margin-top: 3vw;
		margin-bottom: 50px;
	}
	
	#company .outer .inner .wrap h3 {
		color: #222;
		font-size: 2.25rem;
		font-weight: bold;
		letter-spacing: .025em;
		line-height: 1.8;
	}
	
	#company .outer .inner .wrap .box {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin-top: 3vw;
	}
	
	#company .outer .inner .wrap .box p {
		text-align: justify;
		margin-top: 1em;
	}
	#company .outer .inner .wrap .box p:first-of-type {
		margin-top: 0;
	}
	
	#company .outer .inner .wrap .box .btnA {
		margin-top: 50px;
		align-self: flex-end;
		margin-right: 3vw;
	}

/*=============================================================
#service
=============================================================*/
	
	#service .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: 0;
		margin-right: max(3vw,((100vw - 1400px)/2));
		position: relative;
	}
	
	#service .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	#service .outer h2::before {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-right: 1em;
	}
	
	#service .outer h2 .en {
		order: 5;
		padding-right: 0;
		padding-left: .5em;
	}
	
	#service .inner {
		padding-top: 45px;
	}
	
	#service .inner .main_text {
		color: #d28054;
		font-size: 2.0rem;
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#service .inner ul {
		margin-top: 40px;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	
	#service .inner ul li {
		width: 50%;
		box-sizing: border-box;
		padding: 0 2%;
		text-align: center;
	}
	
	#service .inner ul li:nth-child(3),
	#service .inner ul li:nth-child(4),
	#service .inner ul li:nth-child(5) {
		margin-top: 40px;
	}
	
	#service .inner ul li .image {
		border-radius: 50%;
		overflow: hidden;
		position: relative;
		filter: drop-shadow(1.5vw 1.5vw 0px #eaeaea);
	}
	
	#service .inner ul li h3 {
		margin: 30px auto 0;
		font-size: 1.75rem;
		font-weight: bold;
		position: relative;
		z-index: 2;
		display: inline-block;
		padding: 0 .1em 5px;
		line-height: 1.8;
	}
	
	#service .inner ul li h3::before{
		position: absolute;
		font-family: 'Roboto', sans-serif;
		font-size: 1.5rem;
		top: -1.5em;
		left: 0;
	}
	
	#service .inner ul li:nth-child(1) h3::before{
		content: "01";
	}
	#service .inner ul li:nth-child(2) h3::before{
		content: "02";
	}
	#service .inner ul li:nth-child(3) h3::before{
		content: "03";
	}
	#service .inner ul li:nth-child(4) h3::before{
		content: "04";
	}
	#service .inner ul li:nth-child(5) h3::before{
		content: "05";
	}
	
	#service .inner ul li h3::after {
		content: "";
		position: absolute;
		background-color: rgba(210,128,84,.8);
		width: 100%;
		height: .8em;
		left: 0;
		bottom: .4em;
		z-index: -1;
	}
	
	#service .btnA {
		margin: 50px auto 0;
	}
	
/*=============================================================
#price
=============================================================*/
	
	#price {
		background-color: #eaeaea;
		position: relative;
		margin-top: 100px;
	}
	#price::before {
		content: "";
		background-color: #fff;
		position: absolute;
		width: 100%;
		font-size: 1.75rem;/*emのサイズを定義*/
		height: 1em;
		top: 0;
		z-index: 1;
	}
	
	#price::after {
		content: "";
		background-color: #fff;
		position: absolute;
		width: 100%;
		font-size: 1.6em;
		height: 1.5em;
		bottom: 0;
		z-index: 1;
	}
	
	
	#price .outer {
		max-width: calc(100vw - ((100vw - 1400px)/2));
		box-sizing: border-box;
		margin-left: max(3vw,((100vw - 1400px)/2));
		margin-right: 0;
		position: relative;
	}
	
	#price .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		z-index: 2;
		position: relative;
	}

	#price .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-left: 1em;
	}
	
	#price .inner {
		padding: 0 4.5vw;
	}
	
	#price .inner h3 {
		font-size: 2.0rem;
		color: #d28054;
		font-weight: bold;
		letter-spacing: .025em;
		text-align: center;
		margin: 40px auto 0;
	}
	
	#price .inner dl {
		margin: 50px auto 0;
		display: flex;
		flex-wrap: wrap;
		position: relative;
		z-index: 2;
	}
	
	#price .inner dl::before,
	#price .inner dl::after {
		content: "";
		position: absolute;
		width: 3vw;
		height: 3vw;
		background-color: #d28054;
		z-index: -1;
	}
	
	#price .inner dl::before {
		bottom: calc(100% - 1.5vw);
		right: calc(100% - 1.5vw);
	}
	#price .inner dl::after {
		top: calc(100% - 1.5vw);
		left: calc(100% - 1.5vw);
	}
	
	#price .inner dt,
	#price .inner dd {
		border-bottom: 1px solid #eaeaea;
		border-right: 1px solid #eaeaea;
		box-sizing: border-box;
		padding: 1em .5em;
		background-color: #fff;
		display: flex;
		flex-direction: column;
		font-size: 1.75rem;
	}
	
	#price .inner dt.head,
	#price .inner dd.head {
		text-align: center;
		font-weight: bold;
	}
	
	#price .inner dt {
		width: 6em;
		text-align: center;
		justify-content: center;
	}
	
	#price .inner dd.spec {
		width: calc(100% - 12em);
	}
	
	#price .inner dd.yen {
		width: 6em;
		justify-content: center;
		text-align: center;
	}
	
	#price .inner .btnA {
		margin: min(8.4vw,120px) auto 0;
	}
	
	#price .inner .btnA a{
		position: relative;
		z-index: 2;
	}

/*=============================================================
#works
=============================================================*/

	#works {
		margin-top: 100px;
	}
	
	#works .outer {
		box-sizing: border-box;
		margin-left: 0;
		margin-right: 3vw;
		position: relative;
	}
	
	#works .outer h2 {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	#works .outer h2::before {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #222;
		margin-right: 1em;
	}
	
	#works .outer h2 .en {
		order: 5;
		padding-right: 0;
		padding-left: .5em;
	}
	
	#works .inner {
		padding-top: 45px;
	}
	
	#works .inner .main_text {
		color: #d28054;
		font-size: 2.0rem;
		font-weight: bold;
		letter-spacing: .025em;
	}
	
	#works .inner .sub_text {
		margin-top: 20px;
		color: #5b8b55;
		font-size: 1.875rem;
		font-weight: bold;
	}
	
	#works .inner ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	#works .inner ul .box {
		margin-top: 40px;
	}
	
	#works .inner ul .box a {
		width: 100%;
		display: flex;
		box-sizing: border-box;
		border: 1px solid #222;
		box-shadow: 3vw 3vw #eaeaea;
		transition: .3s ease;
		position: relative;
	}
	
	#works .inner ul .box a::before {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 0 4.5vw 4.5vw;
		border-color: transparent transparent #d28054 transparent;
		right: 1.5vw;
		bottom: 1.5vw;
		transition-delay: .1s;
		transition: .2s ease;
	}
	
	#works .inner ul .text_wrap h3 {
		font-size: 2.0rem;
		font-weight: bold;
	}
	
	#works .inner ul .text_wrap dl {
		display: flex;
		flex-wrap: wrap;
		margin-top: 1.0em;
	}
	
	#works .inner ul .text_wrap dt {
		width: 5em;
		box-sizing: border-box;
		margin-top: .75em;
		background-color: #d2d2d2;
		padding: .1em .5em;
		text-align: center;
		align-self: flex-start;
	}
	
	#works .inner ul .text_wrap dd {
		width: calc(100% - 6em);
		box-sizing: border-box;
		padding: .1em .5em;
		margin-left: 1em;
		margin-top: .75em;
	}	
	
	#works .inner .btnA {
		margin: 50px auto 0;
	}

	#works .inner ul .box {
		width: calc(100% - 3vw);
	}
	
	#works .inner ul .box a {
		width: 100%;
		flex-direction: column;
	}

	#works .inner ul .box .text_wrap {
		width: 100%;
		padding: 6vw 3vw;
		box-sizing: border-box;
		min-height: 20vw;
	}
	
	#works .inner ul .text_wrap dt,
	#works .inner ul .text_wrap dd {
		font-size: 1.75rem;
	}
	
/*=============================================================
#recruit
=============================================================*/

	#recruit .outer {
		box-sizing: border-box;
		margin-left: 3vw;
		margin-right: 0;
		position: relative;
		z-index: 2;
	}
	
	#recruit .outer::before{
		position: absolute;
		content: "";
		width: calc(100% - (50px - 3vw));
		height: 100%;
		padding-top: 50px;
		box-sizing: border-box;
		top: 0;
		right: 0;
		background-color: #5b8b55;
		z-index: -1;
	}

	#recruit .outer h2 {
		display: flex;
		align-items: center;
		padding-top: 40px;
		color: #fff;
	}
	
	#recruit .outer h2::after {
		content: "";
		flex-grow: 1;
		border-bottom: 1px solid #fff;
		margin-left: 1em;
	}
	
	#recruit .outer .inner {
		display: flex;
		justify-content: space-between;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
		padding-top: 40px;
		box-sizing: border-box;
	}

	#recruit .outer .inner .image {
		width: 90%;
		align-self: flex-start;
	}
	
	#recruit .outer .inner .wrap {
		width: 90%;
		min-height: 87.3vw;
		box-sizing: border-box;
		padding: 6vw 3vw;
		display: flex;
		flex-direction: column;
		background-color: rgba(255,255,255,0.7);
		margin-left: calc(-80% - 3vw);
		margin-right: 3vw;
		margin-top: 3vw;
		margin-bottom: 50px;
	}
	
	#recruit .outer .inner .wrap h3 {
		color: #222;
		font-size: 2.25rem;
		font-weight: bold;
		letter-spacing: .025em;
		line-height: 1.8;
	}
	
	#recruit .outer .inner .wrap .box {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin-top: 3vw;
	}
	
	#recruit .outer .inner .wrap .box p {
		text-align: justify;
		margin-top: 1em;
	}
	#recruit .outer .inner .wrap .box p:first-of-type {
		margin-top: 0;
	}
	
	#recruit .outer .inner .wrap .box .btnA {
		margin-top: 50px;
		align-self: flex-end;
		margin-right: 3vw;
	}

	
/*=============================================================
contact
=============================================================*/
	
}