@charset "utf-8";
body {
	background-color: #fff;
}
img {
	width: 100%;
}
section {
	padding: 60px 0;
}
section.bg-green {
	background-image: url(/wp-content/uploads/greeting/bg-green.png);
	position: relative;
	height: 110vh;
	padding: 0;
}


section.bg-green:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	background-image:url(/wp-content/uploads/greeting/bg01.png);
	background-repeat: no-repeat;
	background-size: 100%;
	height: 100vh;
	width: 60%;
}

section.bg-green:after {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	background-image:url(/wp-content/uploads/greeting/bg02.png);
	background-repeat: no-repeat;
	background-size: 100%;
	height: 100vh;
	width: 50%;
}

.container {
	max-width: 1100px;
	margin: 0 auto;
}

h1 {
	position: absolute;
	top: 20px;
	left: 40px;
}

header {
	max-width: 1100px;
	margin: 0 auto;
	position: relative;
	height: 100vh;
}

.catch-right{
	position: absolute;
	bottom: 10%;
	right: 0;
	font-size: 18px;
	line-height: 2.3;
	text-align: right;
	font-family: serif;
	font-weight: bold;
	z-index: 1;
} 
.catch-left {
	position: absolute;
	top: 12vw;
	left: 0;
	font-size: 40px;
	font-weight: bold;
	font-family: serif;
	z-index: 1;
}

section.bg-wave {
	padding: 60px 0;
	position: relative;
}
section.bg-wave:before {
	content: '';
	position: absolute;
	background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201440%20120%22%20width%3D%22100%25%22%20preserveAspectRatio%3D%22none%22%3E%0A%20%20%0A%20%20%3Cpath%20d%3D%22M%200%2060.00%20C%2030.00%2064.08%2C%2060.00%2068.17%2C%2090.00%2072.12%20C%20120.00%2076.07%2C%20150.00%2079.89%2C%20180.00%2083.45%20C%20210.00%2087.02%2C%20240.00%2090.32%2C%20270.00%2093.27%20C%20300.00%2096.21%2C%20330.00%2098.79%2C%20360.00%20100.93%20C%20390.00%20103.06%2C%20420.00%20104.75%2C%20450.00%20105.93%20C%20480.00%20107.12%2C%20510.00%20107.80%2C%20540.00%20107.96%20C%20570.00%20108.12%2C%20600.00%20107.76%2C%20630.00%20106.88%20C%20660.00%20106.01%2C%20690.00%20104.62%2C%20720.00%20102.77%20C%20750.00%20100.91%2C%20780.00%2098.59%2C%20810.00%2095.88%20C%20840.00%2093.17%2C%20870.00%2090.06%2C%20900.00%2086.67%20C%20930.00%2083.27%2C%20960.00%2079.58%2C%20990.00%2075.73%20C%201020.00%2071.87%2C%201050.00%2067.84%2C%201080.00%2063.77%20C%201110.00%2059.69%2C%201140.00%2055.58%2C%201170.00%2051.56%20C%201200.00%2047.54%2C%201230.00%2043.61%2C%201260.00%2039.90%20C%201290.00%2036.20%2C%201320.00%2032.71%2C%201350.00%2029.55%20C%201380.00%2026.39%2C%201410.00%2023.57%2C%201440.00%2021.17%20L%201440%20120%20L%200%20120%20Z%22%20fill%3D%22%23ffffff%22%20%2F%3E%0A%3C%2Fsvg%3E");
	background-size: 100% 100%;
	background-repeat: no-repeat;	
	width: 100%;
	height: 120px;
	top: -120px;
}

h2.heading-1 {
	font-size: 80px;
	color: #4B933A;
	text-align: center;
	font-family: serif;
}
h2.heading-1 span{
	display: block;
	font-size: 18px;
	text-align: center;
	font-family: serif;
	color: #000;
	letter-spacing: 10px;
}

.hook {
	margin-top: 80px;
	text-align: center;
	font-size: 18px;
	line-height: 2;
	padding: 0 10px;
}

.message-wrap {
	display: flex;
	gap: 40px;
	margin-top: 80px;
	padding: 0 10px;
	position: relative;
}
.message-inner {
	width: 50%;
	display: flex;
	flex-direction: column;
	gap: 30px 0;
}
.message-wrap:before {
	position: absolute;
	content: '';
	background: url(/wp-content/uploads/greeting/bg-logo.png);
	background-repeat: no-repeat;
	background-size: contain;
	width: 600px;
	height: 386px;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
}

.message-inner img {
	border-radius: 30px;
}

.message {
	position: relative;
	padding-left: 40px;
	font-size: 24px;
	font-family: serif;
}

.message:before {
	content: '';
	left: 0;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 1px;
	background: #000;
}

.message-title {
	font-size: 32px;
	font-family: serif;
	font-weight: bold;
}
.message-text {
	font-size: 18px;
	line-height: 2;
}

.name {
	font-size: 14px;
	display: flex;
	align-items: end;
	justify-content: end;
}
.name img {
	width: auto;
}
.promise {
	background-image: url(/wp-content/uploads/greeting/egg.png);
	width: calc(100% - 20px);
	margin: 0 auto;
	background-size: cover;
	padding-bottom: 120px;
	border-radius: 30px;
}
.promise > h2.heading-1{
	transform: translateY(-50%);
	color: #E75328;
}
.promise-wrap {
	display: flex;
	gap: 50px 0;
	flex-wrap: wrap;
}
.promise-inner {
	display: flex;
	gap: 20px;
	width: 50%;
	align-items: center;
	font-family: serif;
	font-weight: bold;
}
.promise-inner h3{
	font-size: 32px;
	margin-bottom: 15px;
}
.promise-inner img{
	width: 92px;
}
.copy {
	text-align: center;
	padding-bottom: 20px;
	display: block;
}
.sp-only {
	display: none;
}
/* ページトップ */

.pagetop {
	position: fixed;
	bottom: 20px;
	right: 5%;
	z-index: 1;
	display: flex;
	justify-content: center;
}

@media (max-width: 767px) {
	.pagetop {
		width: 70px;
		justify-content: flex-end;
	}
}

/* @media (max-width: 480px) {
  .pagetop {
    right: 0;
    width: 68px;
  }
} */

.pagetop a {
	white-space: nowrap;
	display: inline-block;
	position: relative;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	padding: 0;
	background: #4B933A;
	color: #fff;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	text-decoration: none;
}

@media (max-width: 767px) {
	.pagetop a {
		width: 68px;
		height: 68px;
	}
}

.pagetop a:after {
	content: "";
	display: block;
	position: absolute;
	top: 42%;
	left: 50%;
	margin: auto;
	width: 10px;
	height: 10px;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	-webkit-transform: translate(-50%, -20%) rotate(45deg);
	transform: translate(-50%, -20%) rotate(45deg);
	-webkit-transition: 0.2s;
	transition: 0.2s;
}

.pagetop a:hover:after {
	top: 30%;
}

.pagetop span {
	padding-bottom: 10px;
	font-size: 12px;
}
@media(max-width:768px) {
	section.bg-green:before {
		content: '';
		height: 100vh;
		width: 80%;
		background-image: url(/wp-content/uploads/greeting/bg01-sp.png);
	}
	section.bg-green:after {
		content: '';
		top: 90px;
		width: 60%;
		height: 100vh;
		background-image: url(/wp-content/uploads/greeting/bg02-sp.png);
	}
	.catch-right {
		position: absolute;
		bottom: 10%;
		right: 0;
		font-size: 16px;
		line-height: 2.3;
		text-align: left;
		font-family: serif;
		font-weight: bold;
	}

	.catch-left {
		position: absolute;
		top: 24vw;
		left: 10%;
		font-size: 24px;
		font-weight: bold;
		font-family: serif;
	}
	h2.heading-1 {
		font-size: 36px;
	}
	.hook {
		font-size: 16px;
		text-align: left;
		margin-top: 40px;
	}
	.message-wrap {
		flex-direction: column;
		margin-top: 40px;
	}
	.message-wrap:before {
		width: 300px;
		height: 193px;
		}
	.message-inner {
		gap: 20px;
		width: 100%;
	}
	.message {
		font-size: 16px;
	}
	.message-title {
		font-size: 20px;
	}
	.message-text {
		font-size: 16px;
	}
	.promise {
		background-image: url(/wp-content/uploads/greeting/egg-sp.png);
		padding-bottom: 60px;
		width: 100%;
		border-radius: 0;
	}
	.promise-wrap {
		flex-direction: column;
	}
	.promise-inner {
		flex-direction: column;
		width: 100%;
		text-align: center;
	}
	.promise-inner h3 {
		font-size: 20px;
	}
	.promise-inner img {
		width: 56px;
	}
	.sp-only{
		display: block;
	}
}