@charset "utf-8";
/*
FUNCTION
================================================ */
:root {
	--back: #387A6B;
	--mv: #2A554B;
	--title: #00A783;
	--text: #594E40;
}
html {
	scroll-behavior: smooth;
}
body {
	width: 100%;
	margin: 0 auto;
	position: relative;
	background: linear-gradient(to bottom, #BBFFDC 0, #D6F8FF 390px, #FFFCF1 800px);
	font-family: 'Noto Sans JP', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: clamp(0.03125rem, -0.1117rem + 0.274vw, 0.09375rem);
	color: var(--text);
	box-sizing: border-box;
}
img {
	width: 100%;
	height: auto;
	-o-object-fit: contain;
	object-fit: contain;
	vertical-align: middle;
}
a {
	text-decoration: none;
}
li {
	list-style: none;
}
.PC-none {
	display: none;
}
.SP-none {
	display: flex;
}
.nowrap {
	white-space: nowrap;
}
/*
MAIN
================================================ */
main {
	position: relative;
	top: -1px;
}
section {
	padding-bottom: clamp(5rem, 2.1404rem + 5.4795vw, 6.25rem);
}
.container {
	width: 100%;
	max-width: 72.75rem;
	margin: 0 auto;
	padding-right: 2rem;
	padding-left: 2rem;
	overflow: hidden;
	overflow-wrap: break-word;
}
.container h1 {
	font-size: 3.4375rem;
	font-weight: 500;
	letter-spacing: 1.5px;
}
.container h2 {
	font-size: clamp(2.125rem, 0.4092rem + 3.2877vw, 2.875rem);
	font-weight: 500;
	color: var(--title);
	letter-spacing: clamp(0.09375rem, -0.4067rem + 0.9589vw, 0.3125rem);
}
.container .top-ttl h1, .container .top-ttl h2 {
	margin-top: 12.5rem;
	color: #2a554b;
}
.container .sub-ttl {
	font-size: 1.125rem;
}
.container .border {
	position: relative;
}
.container .border-style {
	position: absolute;
	content: "";
	top: 55%;
	width: clamp(18rem, -6.3065rem + 46.5753vw, 28.625rem);
	height: 1px;
	background-color: #594E40;
	margin-left: clamp(6rem, 4.8562rem + 2.1918vw, 6.5rem);
}
.container .border-style::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
	width: 0.3em;
	height: 0.3em;
	background-color: #594E40;
}
/* Voice */
#Voice .coment-top .coment-inline {
	display: flex;
	justify-content: space-between;
	margin: 3.75rem 0 0;
	gap: clamp(1rem, 0.1761rem + 3.3803vw, 2.5rem);
	font-weight: 500;
}
#Voice .coment .coment-box {
	width: clamp(22.8125rem, -9.6816rem + 62.2642vw, 33.125rem);
	padding: clamp(1.5625rem, 1.0577rem + 1.9231vw, 2.5rem) clamp(1.5625rem, 1.0577rem + 1.9231vw, 2.5rem) 3.2rem;
	border: solid #d2a730 1px;
	position: relative;
	font-weight: 500;
}
#Voice .coment .coment-box-img {
	margin-bottom: 0.8rem;
}
#Voice .coment-box .coment-txt {
	display: inline-block;
	line-height: clamp(2rem, 1.8283rem + 0.7042vw, 2.3125rem);
	text-decoration: underline;
	text-decoration-color: #d2a730;
	text-decoration-style: dotted;
	text-underline-offset: 5px;
	-webkit-text-underline-offset: 5px;
}
#Voice .coment-box {
	background-color: white;
}
.mask-name {
	width: clamp(10.625rem, 4.717rem + 11.3208vw, 12.5rem);
	height: 2.875rem;
	display: flex;
	justify-content: center;
	align-items: center;
	box-shadow: 4px 6px 2px rgba(180, 219, 210, 0.44);
	font-size: clamp(0.875rem, 0.4811rem + 0.7547vw, 1rem);
	font-weight: 700;
	position: absolute;
}
.masking-tape-t .mask-name {
	right: -1.25rem;
	bottom: 4rem;
}
.masking-tape-y .mask-name {
	right: -1rem;
	bottom: clamp(0.9375rem, 0.0792rem + 3.5211vw, 2.5rem);
}
.masking-tape-t .mask-name {
	background: #bbedff;
	transform: rotate(2.83deg);
}
.masking-tape-y .mask-name {
	background: #C1FFBB;
	transform: rotate(-2.83deg);
}
#Voice .coment-button {
	display: flex;
	justify-content: center;
	margin-top: 3rem;
}
/* Message */
.top-message {
	display: flex;
	align-items: flex-start;
	margin-top: 2.5rem;
	gap: clamp(1.8rem, -2.661rem + 8.5479vw, 3.75rem);
}
.top-message-img {
	width: clamp(19.375rem, 2.2175rem + 32.8767vw, 26.875rem);
}
.top-message-text {
	font-size: 1rem;
	font-weight: 500;
	line-height: clamp(1.8rem, 0.8849rem + 1.7534vw, 2.2rem);
}
.bold {
	font-weight: 700;
}
.top-message-text .signature {
	padding-top: 1.25rem;
	font-size: 1.25rem;
	text-align: right;
}
/* Contact */
.top-contact {
	margin-bottom: 6.25rem;
	padding-bottom: 4.8125rem;
	position: relative;
	overflow: hidden;
	border-bottom: solid 2px #D2A730;
}
.line-decoration {
	content: '';
	position: absolute;
	top: -57.4vw;
	left: 50%;
	width: 200vw;
	height: 200vw;
	background: linear-gradient(135deg, #FFFCF1 0%, #DCFFD5 40%);
	border-left: 3px solid #D2A730;
	border-top: 3px solid #D2A730;
	transform: translateX(-50%) rotate(45deg) skew(-35deg, -35deg);
	z-index: -1;
}
.line-decoration-bottom {
	content: '';
	position: absolute;
	top: -5.5vw;
	left: 50%;
	width: 30vw;
	height: 30vw;
	background: transparent;
	border-left: 3px solid #D2A730;
	border-top: 3px solid #D2A730;
	transform: translateX(-50%) rotate(45deg) skew(-35deg, -35deg);
}
#Contact .container {
	padding-top: clamp(8rem, 1.137rem + 13.1507vw, 11rem);
	display: flex;
	justify-content: space-between;
}
.top-contact-box .border {
	margin-bottom: 1.25rem;
}
.top-contact-text {
	font-size: 1rem;
	font-weight: 500;
	line-height: clamp(1.5rem, -0.1014rem + 3.0685vw, 2.2rem);
}
.top-contact-link {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 2.375rem;
}
.top-contact-block {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.top-contact-block .top-contact-attention {
	position: relative;
	display: inline-block;
	margin-bottom: 7px;
	padding-inline: .4em;
	color: var(--title);
	font-weight: 700;
}
.top-contact-attention::before, .top-contact-attention::after {
	position: absolute;
	content: "";
	top: 60%;
	width: 20px;
	height: 1px;
	background-color: var(--title);
}
.top-contact-block .attention-label1::before {
	left: 0;
	transform: translateX(-100%) rotate(53deg);
}
.top-contact-block .attention-label1::after {
	right: 0;
	transform: translateX(100%) rotate(-53deg);
}
.top-contact-block .attention-label2::before {
	left: 0;
	transform: translateX(-100%) rotate(53deg);
}
.top-contact-block .attention-label2::after {
	right: 0;
	transform: translateX(100%) rotate(-53deg);
}
.top-button {
	width: clamp(18rem, -3.7329rem + 41.6438vw, 27.5rem);
	height: clamp(4rem, 0.2825rem + 7.1233vw, 5.625rem);
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--title);
	font-size: clamp(1.0625rem, 0.6336rem + 0.8219vw, 1.25rem);
	color: #FFFCF5;
	text-decoration: underline;
	text-underline-offset: 5px;
	-webkit-text-underline-offset: 5px;
	border-radius: 5rem;
}
.top-button .arrow {
	width: clamp(1.5625rem, 0.8476rem + 1.3699vw, 1.875rem);
	height: 1.5px;
	margin: clamp(0.3125rem, -1.8322rem + 4.1096vw, 1.25rem);
	position: relative;
	display: inline-block;
	border-radius: 9999px;
	background-color: #FFFCF5;
}
.top-button .arrow::before, .top-button .arrow::after {
	right: 0;
	width: 6px;
	height: 1.5px;
	content: "";
	position: absolute;
	border-radius: 9999px;
	background-color: #FFFCF5;
	transform-origin: calc(100% - 0.5px) 50%;
}
.top-button .arrow::before {
	transform: rotate(45deg);
}
.top-button .arrow::after {
	transform: rotate(-45deg);
}
/* About us */
.top-company-inner {
	width: 100%;
	margin-top: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.top-company-details {
	height: 100%;
	font-size: 1rem;
	font-weight: 500;
	word-break: keep-all;
	overflow-wrap: break-word;
	white-space: normal;
	line-break: strict;
	line-height: clamp(1.8rem, 0.8849rem + 1.7534vw, 2.2rem);
}
.top-company-details dt {
	color: var(--back);
	font-weight: 700;
	float: left;
}
.top-company-details dd {
	-webkit-margin-start: 7.625rem;
	margin-inline-start: 7.625rem;
	padding-left: clamp(1rem, -2.453rem + 6.6165vw, 3.75rem);
}
.top-company-details .top-company-break {
	word-break: break-word;
	overflow-wrap: anywhere;
	white-space: normal;

}
.top-company-map iframe {
	width: clamp(26.25rem, 3.6592rem + 43.2877vw, 36.125rem);
	height: auto;
	border: 1px solid #594E40;
	aspect-ratio: 289 / 159;
}
.top-company-inner .under {
	margin-top: 1.25rem;
	margin-left: auto;
	font-size: 1.25rem;
	color: var(--title);
	text-decoration: underline;
	text-underline-offset: 5px;
	-webkit-text-underline-offset: 5px;
}
/* ページトップへ戻るボタン */
.pagetop-btn {
	right: clamp(3rem, 0.1404rem + 5.4795vw, 4.25rem);
	bottom: 3rem;
	padding-top: 1.875rem;
	position: fixed;
	text-align: center;
	color: #D2A730;
	letter-spacing: 1px;
	cursor: pointer;
	z-index: 997;
}
.line-top, .line-bottom {
	position: absolute;
}
.line-top::before, .line-top::after, .line-bottom::before, .line-bottom::after {
	content: "";
	position: absolute;
	width: 65px;
	height: 1.25px;
	background-color: #D2A730;
	top: 0;
}
.line-top {
	top: 0;
	transform: translateX(-50%);
}
.line-top::before {
	left: -65px;
	transform: rotate(-20deg);
	transform-origin: right center;
}
.line-top::after {
	right: -65px;
	transform: rotate(20deg);
	transform-origin: left center;
}
.line-bottom {
	top: .5rem;
	transform: translateX(-50%);
}
.line-bottom::before {
	width: 50px;
	left: -50px;
	transform: rotate(-20deg);
	transform-origin: right center;
}
.line-bottom::after {
	width: 50px;
	right: -50px;
	transform: rotate(20deg);
	transform-origin: left center;
}
.pagetop-btn p {
	font-size: 1rem;
	margin: 0;
	color: #D2A730;
	font-weight: normal;
}
.pagetop-btn span {
	letter-spacing: 0.5px;
}
@media(max-width:834px) {
	body {
		background: linear-gradient(to bottom, #BBFFDC 0, #D6F8FF clamp(18.75rem, 13.0435rem + 21.7391vw, 24.375rem), #FFFCF1 800px);
	}
	.PC-none {
		display: flex;
	}
	.SP-none {
		display: none;
	}
	/*
	MAIN
	================================================ */
	section {
		padding-bottom: 2.5rem;
	}
	#Message, #Aboutus {
		padding-bottom: 2.5rem;
	}
	.container {
		padding-right: 1.5625rem;
		padding-left: 1.5625rem;
	}
	.container h1 {
		font-size: clamp(1.875rem, 0.8605rem + 3.8647vw, 2.875rem);
		margin-bottom: .625rem;
	}
	.container h2 {
		font-size: clamp(1.625rem, 0.3569rem + 4.8309vw, 2.875rem);
	}
	.container .top-ttl h1, .container .top-ttl h2 {
		margin-top: 6.25rem;
	}
	.container .sub-ttl {
		font-size: clamp(0.875rem, 0.6214rem + 0.9662vw, 1.125rem);
	}
	.container .border-style {
		width: calc(100% - clamp(5rem, 3.4783rem + 5.7971vw, 6.5rem));
		max-width: 100%;
		margin-left: clamp(5rem, 3.4783rem + 5.7971vw, 6.5rem);
	}
	/* Voice */
	#Voice .coment .coment-inline {
		margin-top: clamp(1.25rem, -1.2862rem + 9.6618vw, 3.75rem);
		flex-direction: column;
		gap: clamp(1.25rem, -1.2862rem + 9.6618vw, 3.75rem);
	}
	#Voice .coment .coment-box {
		width: 100%;
	}
	#Voice .coment .coment-box .coment-txt {
		font-size: clamp(0.875rem, 0.7482rem + 0.4831vw, 1rem);
	}
	.mask-name {
		height: clamp(1.8125rem, 1.3687rem + 1.6908vw, 2.25rem);
		font-size: clamp(0.875rem, 0.4811rem + 0.7547vw, 1rem);
	}
	.masking-tape-t .mask-name {
		right: 0;
		bottom: 1rem;
	}
	.coment-center .masking-tape-t .mask-name {
		right: clamp(-1.5rem, -1.8043rem + 1.1594vw, -1.2rem);
		bottom: 1.75rem;
	}
	#Voice .coment-button {
		margin-top: clamp(1.25rem, -0.5254rem + 6.7633vw, 3rem);
	}
	/* Message */
	.top-message {
		flex-direction: column;
		margin-top: 0.9375rem;
		gap: 1rem;
	}
	.top-message-img {
		width: 100%;
	}
	.top-message-text {
		font-size: clamp(0.875rem, 0.7482rem + 0.4831vw, 1rem);
		line-height: 2rem;
	}
	.top-message-text .signature {
		padding-top: 0.625rem;
		font-size: clamp(0.875rem, 0.7482rem + 0.4831vw, 1rem);
	}
	/* Contact */
	.top-contact {
		margin-bottom: 2.75rem;
		padding-bottom: 2.75rem;
	}
	.line-decoration {
		top: -36.3vw;
		width: 300vw;
		height: 300vw;
		background: linear-gradient(135deg, #FFFCF1 0%, #DCFFD5 60%);
		border-left: 2px solid #D2A730;
		border-top: 2px solid #D2A730;
		transform: translateX(-50%) rotate(45deg) skew(-25deg, -25deg);
	}
	.line-decoration-bottom {
		top: -1vw;
		width: 40vw;
		height: 40vw;
		border-left: 2px solid #D2A730;
		border-top: 2px solid #D2A730;
		transform: translateX(-50%) rotate(45deg) skew(-25deg, -25deg);
	}
	#Contact .container {
		padding-top: clamp(6rem, 0.9275rem + 19.3237vw, 11rem);
		flex-direction: column;
	}
	.top-contact-box h2 {
		text-align: center;
	}
	.top-contact-box p {
		font-size: clamp(0.875rem, 0.7482rem + 0.4831vw, 1rem);
		line-height: 2rem;
	}
	.top-contact-link {
		margin-top: clamp(1.25rem, -0.0181rem + 4.8309vw, 2.5rem);
		align-items: center;
		gap: 1.25rem;
	}
	.top-button {
		width: 100%;
		max-width: 21.25rem;
		height: 4rem;
		font-size: 1.0625rem;
	}
	.top-button .arrow {
		width: 1.25rem;
		margin: 0.9375rem;
	}
	/* About us */
	.top-company-inner {
		margin-top: 1.25rem;
		flex-direction: column;
	}
	.top-company-details {
		width: 100%;
		font-size: clamp(0.875rem, 0.7482rem + 0.4831vw, 1rem);
		line-height: 2rem;
		order: 2;
	}
	.top-company-details dd {
		-webkit-margin-start: 7rem;
		margin-inline-start: 7rem;
		padding-left: clamp(1rem, -3.902rem + 20.915vw, 7rem);
	}
	.top-company-map {
		width: 100%;
		margin-bottom: clamp(1.25rem, 0.4891rem + 2.8986vw, 2rem);
		order: 1;
	}
	.top-company-map iframe {
		width: 100%;
		aspect-ratio: 20 / 11;
	}
	.top-company-inner .PC-none {
		width: 100%;
		order: 2;
	}
	.top-company-inner .under {
		font-size: clamp(1.0625rem, 0.8723rem + 0.7246vw, 1.25rem);
	}
	/* ページトップへ戻るボタン */
	.pagetop-btn {
		right: 1.8rem;
		bottom: 6.0625rem;
		padding-top: 1.875rem;
	}
	.line-top::before, .line-top::after, .line-bottom::before, .line-bottom::after {
		width: 50px;
	}
	.line-top::before {
		left: -50px;
	}
	.line-top::after {
		right: -50px;
	}
	.line-bottom {
		top: .5rem;
		transform: translateX(-50%);
	}
	.line-bottom::before {
		width: 35px;
		left: -35px;
	}
	.line-bottom::after {
		width: 35px;
		right: -35px;
	}
	.pagetop-btn p {
		font-size: .8125rem;
	}
}