body {
	font-family: "Noto Sans JP", sans-serif;
	font-size: 14px;
}

@media screen and (min-width:768px) {
	body {
		font-size: 16px;
	}
}

p {
	line-height: 1.75;
}

.sp-none {
	display: none;
}

@media screen and (min-width:768px) {
	.tab-none {
		display: none;
	}
	.sp-none {
		display: inline;
	}
}

@media screen and (min-width:900px) {
	.pc-none {
		display: none;
	}
	.l-inner {
		max-width: 1200px;
		margin-inline: auto;
	}
}

.header {
	padding: 30px;
	.logo {
		width: 53px;
	}
}

@media screen and (min-width:768px) {
	.header {
		.logo {
			width: 90px;
		}
	}
}

.main-bg {
	background: url("img/main_bg.webp") no-repeat;
	background-size: cover;
	padding-bottom: 100px;
	.main-title {
		margin: 100px auto 0;
		width: 90%;
		max-width: 500px;
	}
	.button-wrap {
		margin-inline: auto;
		width: 246px;
		.button-green {
			font-family: "Kite One", sans-serif;
			font-size: 30px;
			margin-top: 20px;
			transform: skewY(-5deg);
		}
	}
}

@media screen and (min-width:768px) {
	.main-bg {
		background: url("img/main_bg_pc.webp") no-repeat;
		background-size: cover;
		padding-bottom: 120px;
		.main-title {
			margin: 0 auto;
			width: 400px;
		}
		.button-wrap {
			width: 400px;
		}
	}
}

@media screen and (min-width:900px) {
	.main-bg {
		background-position-x: 50%;
		padding: 0 10vw 300px;
		.l-inner {
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-end;
			.header {
				flex: 0 0 100%;
				padding-bottom: 0;
			}

		}
	}
}

.button-green {
	display: block;
	color: #fff;
	background-image: linear-gradient(to right, #29B4A9 25%, #79FFD7 50%, #79FFD7 100%);
	background-size: 200% 100%;
	padding: 10px 0;
	text-align: center;
	transition: background-position .5s ease;
}
@media screen and (min-width:900px) {
	.button-green:hover {
		background-position: 20% 0;
		transition: background-position .5s ease;
	}
}

.button-yellow {
	display: block;
	color: #fff;
	background-image: linear-gradient(to right, #B7A500, 25%, #E5CE00 50%, #E5CE00 100%);
	background-size: 200% 100%;
	padding: 10px 0;
	text-align: center;
	transition: background-position .5s ease;
}
@media screen and (min-width:900px) {
	.button-yellow:hover {
		background-position: 20% 0;
		transition: background-position .5s ease;
	}
}

@media screen and (min-width:900px) {
	.button-green,
	.button-yellow {
		padding: 20px 0;
	}
}

.event-container {
	background-image: linear-gradient(to right, #03756C, #009B9B);
	color: #fff;
	padding: 80px 20px 100px;
	transform: skewY(-5deg);
	position: relative;
	top: -40px;
	.title {
		font-family: "Kite One", sans-serif;
		font-size: 40px;
		text-align: center;
		transform: skewY(5deg);
	}
	.event-list {
		margin: 30px auto 0;
		transform: skewY(5deg);
		max-width: 600px;
		.list-item {
			.date {
				font-weight: 700;
			}
			&:not(:first-child) {
				margin-top: 20px;
			}
		}
	}
}

@media screen and (min-width:900px) {
	.event-container {
		padding: 150px 20px;
		top: -100px;
		.l-inner {
			display: flex;
			transform: skewY(5deg);
			.title {
				transform: skewY(0deg);
			}
			.event-list {
				transform: skewY(0deg);
				margin-top: 0;
				max-width: 100%;
				.list-item {
					a:hover {
						text-decoration: underline;
					}
				}
			}
		}
	}
}

.about-container {
	padding: 60px 0 100px;
	.about-title {
		display: block;
		text-align: center;
		img {
			width: 102px;
		}
		h2 {
			font-size: 24px;
			font-weight: bold;
			margin-top: 20px;
		}
	}
	.about-list {
		padding: 80px 0;
		overflow: hidden;
		.list-item {
			background: #000;
			padding: 10px 60px 10px 20px;
			transform: skewY(-5deg) translateX(10vw);
			&:not(:first-child) {
				margin-top: 20px;
			}
			.text-wrap {
				background-image: linear-gradient(to right, #29B4A9, 60%, #79FFD7);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
				font-size: 21px;
				&::before {
					content: "# ";
				}
			}
		}
	}
	.message {
		margin-inline: auto;
		width: 80vw;
	}
}

@media screen and (min-width:768px) {
	.about-container {
		.about-list {
			display: flex;
			flex-wrap: wrap;
			align-items: start;
			margin-inline: auto;
			width: calc(310px * 2 + 40px);
			.list-item {
				flex: 0 0 auto;
				width: 310px;
				margin: 20px 10px 0;
				padding: 10px 20px;
				transform: skewY(-5deg) translateX(0);
				&:nth-child(even) {
					margin-top: 30px;
				}
				.text-wrap {
					background-image: linear-gradient(to right, #29B4A9, 60%, #79FFD7);
					-webkit-background-clip: text;
					-webkit-text-fill-color: transparent;
					font-size: 21px;
					&::before {
						content: "# ";
					}
				}
			}
		}
	}
}

@media screen and (min-width:768px) {
	.about-container {
		.message {
			width: calc(310px * 2 + 40px);
		}
	}
}

.entry-container {
	background-image: linear-gradient(to right, #03756C, #009B9B);
	color: #fff;
	padding: 100px 20px 110px;
	/*clip-path: polygon(0 6%, 100% 0%, 100% 94%, 0% 100%);*/
	transform: skewY(-5deg);
	position: relative;
	z-index: 2;
	.title {
		font-family: "Kite One", sans-serif;
		font-size: 40px;
		text-align: center;
	}
	.button-wrap {
		margin: 30px auto 0;
		max-width: 600px;
		a {
			font-size: 21px;
			border-radius: 4px;
			box-shadow: 8px 8px 0 0 #037870;
			margin-top: 8px;
		}
		.button-green {
			background-image: linear-gradient(to right, #16AAA0 25%, #00D3C7 50%, #00D3C7 100%);
		}
	}
}

@media screen and (min-width:900px) {
	.entry-container {
		.button-wrap {
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			width: 90vw;
			max-width: 1200px;
			a {
				flex: 0 0 49%;
				margin-top: 20px;
			}
		}
	}
}

.staff-section {
	background: #f3f3f3;
	padding: 40px 0 0;
	position: relative;
	top: -40px;
	margin-bottom: -40px;
	z-index: 1;
}

@media screen and (min-width:900px) {
	.staff-section {
		padding: 120px 0 0;
		top: -80px;
		margin-bottom: -80px;
	}
}

.staff-container {
	margin-inline: auto;
	padding: 80px 0 40px;
	width: 80vw;
	.staff-title {
		display: block;
		margin-inline: -5vw;
		h2 {
			font-size: 24px;
			background-image: linear-gradient(to right, #03756C, #009B9B);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			font-weight: bold;
			font-feature-settings: "palt";
			transform: rotate(-5deg);
			&::before {
				content: "#";
			}
			.none {
				display: none;
			}
		}
		.name {
			margin-top: 10px;
			img {
				height: 38px;
			}
		}
	}
	.tags-bg {
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 250px;
		margin-top: 20px;
		margin-inline: 0 -10vw;
		&.kato {
			background: url("img/kenta-kato.png") no-repeat;
			background-position: right center;
			background-size: contain;
		}
		&.miyata {
			background: url("img/issei-miyata.png") no-repeat;
			background-position: right center;
			background-size: contain;
		}
	}
	.tags {
		margin-left: -10vw;
		width: 250px;
		.tags-item {
			display: inline-block;
			background: #000;
			padding: 5px 10px;
			&:not(:first-child) {
				margin-top: 5px;
			}
			.text-wrap {
				background-image: linear-gradient(to right, #29B4A9, 60%, #79FFD7);
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent;
				font-size: 16px;
				line-height: 1;
				&::before {
					content: "# ";
				}
			}
		}
	}
	.message {
		margin-top: 40px;
	}
	.staff-image {
		display: none;
	}
}

@media screen and (min-width:768px) {
	.staff-container {
		.staff-text {
			.staff-title {
				margin-inline: auto 0;
				.name {
					margin-top: 20px;
					img {
						height: 50px;
					}
				}
			}
			.tags-bg {
				height: 300px;
				background-position: 10% center;
				margin-inline: auto;
				.tags {
					margin-inline: auto 0;
					width: 270px;
					.tags-item {
						.text-wrap {
							font-size: 18px;
							line-height: 1.4;
						}
					}
				}
			}
		}
	}
}

@media screen and (min-width:900px) {
	.staff-container {
		display: flex;
		justify-content: space-between;
		.staff-text {
			order: 2;
			flex: 0 0 60%;
			.staff-title {
				h2 {
					font-size: 32px;
					.none {
						display: inline;
					}
				}
			}
			.tags-bg {
				background: none !important;
				height: auto;
				.tags {
					margin-inline: 0;
					width: 400px;
					.tags-item {
						.text-wrap {
							font-size: 24px;
							line-height: 1.4;
						}
					}
				}
			}
		}
		.staff-image {
			order: 1;
			flex: 0 0 35%;
			display: block;
		}
	}
}

.ceo-container {
	.ceo-inner {
		height: 440px;
		transform: skewY(-5deg);
		position: relative;
		overflow: hidden;
		z-index: 2;
		.title {
			position: absolute;
			bottom: 20px;
			left: 5vw;
			width: 90vw;
			z-index: 2;
			background: rgb(0 0 0 / 0.3);
			padding: 15px;
			h2 {
				color: #fff;
				font-size: 21px;
				font-weight: 500;
				font-feature-settings: "palt";
				&::before {
					content: "#";
				}
			}
			p {
				text-align: right;
				transform: skewY(5deg);
				img {
					height: 32px;
				}
			}
		}
		.ceo-bg {
			background: url(img/yasuda.webp) no-repeat;
			background-size: cover;
			background-position: 70% center;
			width: 100%;
			height: 120%;
			margin: auto;
			transform: skewY(5deg) translateY(-40px);
		}
	}
	.tsuji-inner {
		/*height: 330px;*/
		height: 150px;
		/*transform: skewY(-5deg);*/
		position: relative;
		/*top: 40px;*/
		top: 130px;
		overflow: hidden;
		z-index: 2;
		.title {
			position: absolute;
			bottom: 20px;
			left: 10vw;
			width: 80vw;
			z-index: 2;
			h2 {
				color: #fff;
				font-size: 21px;
				font-weight: 500;
				font-feature-settings: "palt";
				&::before {
					content: "#";
				}
			}
			p {
				text-align: right;
				transform: skewY(5deg);
				img {
					height: 32px;
				}
			}
		}
		/*.ceo-bg {
			background: url(img/tsuji.webp) no-repeat;
			background-size: cover;
			background-position: center center;
			width: 100%;
			height: 120%;
			margin: auto;
			transform: skewY(5deg) translateY(-40px);
		}*/
	}
	.message {
		background: #222;
		color: #fff;
		padding: 180px 10vw 100px;
		position: relative;
		z-index: 1;
		top: -50px;
		h3 {
			font-size: 28px;
			font-weight: 700;
			&::before {
				content: "#";
			}
		}
		.text {
			margin-top: 40px;
		}
	}
}

.ceo-container.tsuji {
	/*margin-top: 80px;*/
	margin-top: 0;
	.message {
		padding: 220px 10vw 180px;
		transform: skewY(-5deg);
		h3 {
			transform: skewY(5deg);
		}
		.text {
			transform: skewY(5deg);
		}
	}
}

.ceo-container.yasuda {
	position: relative;
	top: -100px;
}

@media screen and (min-width:768px) {
	.ceo-container {
		.ceo-inner {
			height: 400px;
			.title {
				width: 300px;
				h2 {
					font-size: 24px;
				}
				p {
					text-align: left;
					margin-top: 30px;
				}
			}
			.ceo-bg {
				background-position: center center;
			}
		}
		.tsuji-inner {
			/*height: 600px;*/
			height: 180px;
			top: 220px;
			.title {
				h2 {
					font-size: 24px;
				}
				p {
					text-align: left;
					margin-top: 30px;
				}
			}
		}
	}
	.ceo-container.tsuji {
		.message {
			padding-top: 300px;
		}
	}
}

@media screen and (min-width:900px) {
	.ceo-container {
		.ceo-inner {
			height: 800px;
			.title {
				width: 750px;
				h2 {
					font-size: 50px;
				}
				p {
					margin-top: 50px;
					img {
						height: 76px;
					}
				}
			}
			.ceo-bg {
				width: 100%;
				height: 120%;
				margin: auto;
				transform: skewY(5deg) translateY(-100px);
			}
		}
		.message {
			/*padding: 300px 25vw 300px;*/
			padding: 300px 25vw 300px;
			top: -80px;
		}
		.tsuji-inner {
			/*height: 800px;*/
			height: 300px;
			top: 320px;
			.title {
				h2 {
					font-size: 50px;
				}
				p {
					margin-top: 50px;
					img {
						height: 76px;
					}
				}
			}
			/*.ceo-bg {
				width: 100%;
				height: 120%;
				margin: auto;
				transform: skewY(5deg) translateY(-80px);
				z-index: 2;
			}*/
		}
	}
	.ceo-container.tsuji {
		.message {
			padding: 450px 25vw 300px;
		}
	}
}

.entry01 {
	position: relative;
	top: -170px;
	z-index: 2;
}

@media screen and (min-width:900px) {
	.entry01 {
		top: -300px;
	}
}

.service-about-container {
	margin-inline: auto;
	padding-bottom: 80px;
	width: 80vw;
	.kbc-about-title {
		h2 {
			font-family: "Kite One", sans-serif;
			font-size: 42px;
			text-align: center;
		}
		p {
			font-size: 24px;
			font-weight: 700;
			margin-top: 80px;
			&::before {
				content: "#";
			}
		}
	}
	.kizuki-about-title {
		margin-top: 170px;
		text-align: center;
		h2 {
			font-family: "Kite One", sans-serif;
			font-size: 42px;
		}
		p {
			font-size: 24px;
			font-weight: 700;
			&::before {
				content: "#";
			}
		}
	}
	.lead {
		font-size: 18px;
		font-weight: 700;
		margin-top: 40px;
		text-align: center;
	}
	.lead-big {
		font-size: 21px;
		font-weight: 700;
		margin-top: 80px;
	}
	.message {
		margin: 40px auto 0;
		max-width: 600px;
	}
}

@media screen and (min-width:900px) {
	.service-about-container {
		margin-inline: auto;
		max-width: 800px;
		.kbc-about-title {
			p {
				text-align: center;
			}
		}
		.lead-big {
			text-align: center;
		}
		.message {
			margin-bottom: 80px;
		}
	}
}

.case-container {
	.case-image {
		img {
			width: 100%;
		}
	}
	.case-text {
		margin-inline: auto;
		padding-bottom: 40px;
		width: 80vw;
		.case-number {
			font-family: "Merriweather", serif;
			display: flex;
			justify-content: center;
			align-items: center;
			background: #000;
			color: #fff;
			font-size: 21px;
			font-weight: 900;
			line-height: 1.5;
			text-align: center;
			width: 100px;
			height: 100px;
			position: relative;
			top: -100px;
			right: calc(-80vw + 100px);
			margin-bottom: -100px;
		}
		.case-title {
			font-size: 21px;
			margin-top: 40px;
		}
		.text-wrap {
			margin-top: 30px;
			.text-title {
				display: flex;
				font-family: "Kite One", sans-serif;
				font-size: 18px;
				&::after {
					content: "";
					display: block;
					border-bottom: 1px solid;
					flex: 1 0 auto;
					margin-left: 10px;
					margin-bottom: 10px;
				}
				&.after {
					color: #03756C;
				}
			}
			.text-detail {
				margin-top: 15px;
			}
		}
	}
}

@media screen and (min-width:768px) {
	.case-container {
		.case-text {
			.case-number {
				top: -130px;
			}
		}
	}
}

@media screen and (min-width:1000px) {
	.case-container {
		display: flex;
		margin-inline: auto;
		padding-bottom: 80px;
		max-width: 80vw;
		.case-image {
			flex: 0 0 35%;
			margin-right: 40px;
		}
		.case-text {
			hgroup {
				display: flex;
				align-items: center;
				.case-number {
					flex: 0 0 100px;
					margin: 0 40px 0 0;
					position: static;
					top: auto;
					right: auto;
				}
				.case-title {
					font-size: 28px;
					margin: 0;
				}
			}
			.text-content {
				display: flex;
				justify-content: space-between;
				.text-wrap {
					flex: 0 0 47%;
				}
			}
		}
	}
}

.entry02 {
	margin-top: 40px;
}

.manage-section {
	background-image: linear-gradient(to bottom, #fff 12%, #f3f3f3 12%);
}
.manage-section-title {
	font-size: 24px;
	background-image: linear-gradient(to right, #03756C, #009B9B);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-weight: bold;
	margin: 80px auto 0;
	width: 80vw;
	transform: rotate(-5deg);
}
.manage-container {
	margin-inline: auto;
	padding: 40px 0 0;
	.manage-title {
		display: block;
		margin-inline: auto;
		width: 80vw;
		h3 {
			font-size: 20px;
			background-image: linear-gradient(to right, #03756C, #009B9B);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			font-weight: bold;
			font-feature-settings: "palt";
			transform: rotate(-5deg);
			&::before {
				content: "#";
			}
			.none {
				display: none;
			}
		}
	}
	.name-bg {
		height: 240px;
		margin-top: 40px;
		margin-inline: auto;
		width: 80vw;
		position: relative;
		z-index: 2;
		&.miyata {
			background: url("img/miyata_issei.webp") no-repeat;
			background-position: right center;
			background-size: contain;
		}
		&.takano {
			background: url("img/takano_yuka.webp") no-repeat;
			background-position: right center;
			background-size: contain;
		}
		.name {
			margin-top: 30px;
			height: 120px;
		}
	}
	.message {
		padding: 0 10vw 0;
		position: relative;
		margin-top: 40px;
		z-index: 1;
	}
	.manage-image {
		display: none;
	}
}

@media screen and (min-width:768px) {
	.manage-section {
		background-image: linear-gradient(to bottom, #fff 15%, #f3f3f3 15%);
	}
	.manage-container {
		.manage-title {
			h3 {
				font-size: 24px;
				.none {
					display: inline;
				}
			}
		}
		.name-bg {
			display: flex;
			align-items: center;
			height: 350px;
			.name {
				height: 160px;
			}
		}
	}
}

@media screen and (min-width:900px) {
	.manage-section {
		background-image: linear-gradient(to bottom, #fff 13%, #f3f3f3 13%);
	}
	.manage-section-title {
		font-size: 40px;
	}
	.manage-container {
		display: flex;
		justify-content: space-between;
		margin-top: 80px;
		max-width: 80vw;
		.manage-text {
			order: 2;
			flex: 0 0 55%;
			margin-top: -40px;
			.manage-title {
				width: auto;
				h3 {
					font-size: 28px;
				}
				.name {
					margin-top: 0;
					height: 130px;
				}
			}
			.name-bg {
				background: none !important;
				width: auto;
				height: auto;
			}
			.message {
				background: none;
				position: static;
				top: auto;
				padding: 0;
			}
		}
		.manage-image {
			order: 1;
			flex: 0 0 35%;
			display: block;
		}
	}
}

.foot-main {
	text-align: center;
	padding-bottom: 60px;
	img {
		width: 90vw;
		max-width: 500px;
		margin-top: 80px;
	}
}

@media screen and (min-width:900px) {
	.foot-main {
		padding-bottom: 100px;
	}
}

footer {
	background: #000;
	padding: 20px 0 10px;
	font-size: 14px;
	.footer-navi {
		li {
			margin-top: 20px;
			text-align: center;
			a {
				color: #fff;
			}
		}
	}
	.copyright {
		color: #fff;
		font-size: 12px;
		margin-top: 30px;
		text-align: center;
	}
}

@media screen and (min-width:900px) {
	footer {
		.footer-navi {
			li {
				a:hover {
					text-decoration: underline;
				}
			}
		}
	}
}