@charset "utf-8";

/* common
-------------------------------------------------------*/
:root {
	--green: #91c6a3;
	--text: #333333;
	--bg-beige: #faf9f7;
	--bg-gray: #f6f6f6;
	--red: #e6181c;
	--navy: #2e3e55;
	--beige: #c2a688;
}
#wrapper {
	overflow: hidden;
}
body {
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
	font-weight: 500;
	color: #333;
}
.sp {
	display: none;
}
.tb {
	display: none;
}
.area {
	padding: 70px 20px;
	box-sizing: border-box;
}
.serif {
	font-family: 'Noto Serif JP', serif;
}
.sawarabi {
	font-family: 'Sawarabi Gothic', sans-serif;
}
.damion {
	font-family: 'Damion', cursive;
}
.roboto {
	font-family: "Roboto", sans-serif;
}
.lato {
	font-family: "Lato", sans-serif;
	font-weight: 700;
}
.inner {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	box-sizing: border-box;
}
/* scroll animation（rebita参考）
   - .js-parallax: 画像を125%で下端基準に配置し、JSでtranslateY 0→20%を付与
   - .js-reveal: 画面に入ったら .is-view が付与されてふわっと表示 */
.js-parallax {
	position: relative;
	overflow: hidden;
}
.js-parallax > img {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 125%;
	object-fit: cover;
	object-position: center;
	will-change: transform;
}
.js-parallax--strong > img {
	height: 150%; /* はみ出し量が大きいほど視差も大きい */
}
/* 慣性スムーススクロール（PCのみ、JSが html に .is-smooth を付与） */
html.is-smooth #wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	will-change: transform;
}
html.is-smooth,
html.is-smooth body {
	overscroll-behavior: none;
}
.js-reveal {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 1s cubic-bezier(.22,.61,.36,1), transform 1s cubic-bezier(.22,.61,.36,1);
	will-change: opacity, transform;
}
.js-reveal.is-view {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.js-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
	.js-parallax > img {
		transform: none !important;
	}
}
.ttl_script {
	color: var(--green);
	font-size: 2.6rem;
	line-height: 1.4;
}
.ttl01 {
	font-size: 3.6rem;
	font-weight: 700;
	letter-spacing: 6px;
	line-height: 1.5;
}
@media screen and (min-width:768px) and ( max-width:1080px) {
	.pc {
		display: none;
	}
	.tb {
		display: block;
	}
}
@media screen and (max-width:768px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.area {
		padding: 40px 20px;
	}
	.inner {
		max-width: 100%;
	}
	.ttl_script {
		font-size: 2.2rem;
	}
	.ttl01 {
		font-size: 2.2rem;
		letter-spacing: 3px;
	}
}


/* header
-------------------------------------------------------*/
#header.area {
	padding: 20px;
	background: #fff;
}
#header .inner {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: space-between;
}
#header .logo img {
	max-width: 171px;
}
.nav_list {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: flex-end;
	font-size: 1.5rem;
	font-weight: 700;
}
.nav_list li {
	margin-left: 50px;
}
.nav_list li.btn_book a {
	color: #fff;
	display: block;
	font-size: 1.6rem;
	background: var(--red);
	padding: 10px 35px;
	border-radius: 50px;
	text-align: center;
}
.nav_list li.btn_book span {
	font-size: 1.2rem;
	color: var(--red);
	background: #fff;
	padding: 2px 5px;
	border-radius: 3px;
	margin-right: 10px;
	position: relative;
}
.nav_list li.btn_book span::after {
	position: absolute;
	display: block;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-left: 5px solid #fff;
	border-right: 0;
	right: -5px;
	top: 50%;
	transform: translate(0,-50%);
}
.hamburger {
	display: none;
}
@media screen and (max-width:900px) {
	.nav_list li {
		margin-left: 30px;
	}
}
@media screen and (max-width:768px) {
	#header.area {
		padding: 15px 20px;
	}
	.hamburger {
		width: 35px;
		height: 24px;
		position: fixed;
		top: 15px;
		right: 10px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		background: none;
		border: none;
		cursor: pointer;
		z-index: 1000;
	}
	.hamburger span {
		display: block;
		width: 100%;
		height: 2px;
		background: #767674;
		border-radius: 2px;
		transition: all 0.3s ease;
	}
	.hamburger.open span:nth-child(1) {
		transform: translateY(10px) rotate(45deg);
	}
	.hamburger.open span:nth-child(2) {
		opacity: 0;
	}
	.hamburger.open span:nth-child(3) {
		transform: translateY(-10px) rotate(-45deg);
	}
	#nav {
		position: fixed;
		top: 0;
		right: -100%;
		width: 100%;
		height: 100vh;
		background: rgba(255,255,255,0.9);
		transition: right 0.4s ease;
		z-index: 100;
		padding: 55px 30px 0;
	}
	#nav.open {
		right: 0;
	}
	.nav_list {
		flex-flow: column;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.nav_list li {
		margin-left: 0;
		font-size: 1.6rem;
		width: 100%;
	}
	.nav_list li:not(:last-child) {
		border-bottom: 1px solid #767674;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	.nav_list li a {
		display: block;
		padding: 0 20px;
	}
	.nav_list li.btn_book a {
		font-size: 1.8rem;
		padding: 15px 20px;
	}
}


/* visual
-------------------------------------------------------*/
#visual {
	position: relative;
	max-width: 1440px;
	margin-inline: auto;
	background: #fff;
}
#visual .mv_img {
	width: 84.5%;
}
#visual .mv_img img {
	width: 100%;
	height: auto;
	object-fit: cover;
	object-position: bottom;
}
#visual .mv_img,
#visual .mv_txt {
	opacity: 0;
	transition: opacity 1s cubic-bezier(.22,.61,.36,1);
}
#visual .mv_txt {
	position: absolute;
	top: 15.3%;
	right: 4.5%;
	left: auto;
	color: #333;
	transform: translateY(20px);
	transition: opacity 1s cubic-bezier(.22,.61,.36,1), transform 1s cubic-bezier(.22,.61,.36,1);
}
body.is-loaded #visual .mv_img,
body.is-loaded #visual .mv_txt {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	#visual .mv_img,
	#visual .mv_txt {
		opacity: 1;
		transform: none;
		transition: none;
	}
}
#visual .mv_txt .catch {
	font-size: clamp(2.4rem, 3vw, 4.3rem);
	font-weight: 700;
	letter-spacing: 8px;
	line-height: 1.6;
	white-space: nowrap;
}
#visual .mv_txt .sub {
	font-family: 'Sawarabi Gothic', sans-serif;
	font-size: clamp(1.2rem, 1.25vw, 1.8rem);
	letter-spacing: 6px;
	line-height: 1.8;
	margin-top: 4.2em;
	margin-left: 40%;
	white-space: nowrap;
}
#visual .mv_txt .sub span {
	font-size: 111%;
}
@media screen and (max-width:768px) {
	#visual .mv_img {
		width: 100%;
	}
	#visual .mv_img img {
		height: 61vw;
		object-fit: cover;
	}
	#visual .mv_txt {
		position: static;
		padding: 40px 30px;
	}
	#visual .mv_txt .catch {
		font-size: 2.6rem;
	}
	#visual .mv_txt .sub {
		font-size: 1.8rem;
		margin-top: 20px;
		margin-left: 0;
	}
}


/* intro
-------------------------------------------------------*/
#intro.area {
	padding: 160px 64px;
}
#intro .inner {
	max-width: 1000px;
}
.intro_box {
	display: flex;
	flex-flow: row nowrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 22px;
}
.intro_box .col_main {
	flex: 1;
	max-width: 706px;
}
.intro_box .col_main .img {
	margin-bottom: 45px;
}
.intro_box .col_sub {
	width: 27.2%;
	max-width: 272px;
}
.intro_box .ttl_script {
	margin-bottom: 10px;
}
.intro_box .txt {
	font-size: 1.5rem;
	letter-spacing: 0.9px;
	line-height: 2.4;
	font-feature-settings: "halt" 1;
}
@media screen and (max-width:768px) {
	#intro.area {
		padding: 30px 30px 50px;
	}
	.intro_box {
		flex-flow: column;
	}
	.intro_box .col_main .img {
		margin-bottom: 0;
	}
	.intro_box .col_main {
		max-width: 100%;
		display: contents;
	}
	.intro_box .col_sub {
		width: 55%;
		order: 2;
	}
	.intro_box .col_main .img {
		order: 1;
	}
	.intro_box .ttl_script {
		order: 3;
		margin: 10px 0 0;
	}
	.intro_box .txt {
		order: 4;
	}
}


/* benefit
-------------------------------------------------------*/
#benefit {
	background: var(--bg-beige);
}
#benefit.area {
	padding: 80px 64px 120px;
}
#benefit .inner {
	max-width: 1120px;
}
#benefit .ttl_box {
	text-align: center;
	margin-bottom: 80px;
}
.list_benefit li {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: center;
	gap: 64px;
}
.list_benefit li:not(:last-child) {
	margin-bottom: 80px;
}
.list_benefit .txt_box {
	width: 490px;
	max-width: 100%;
}
.list_benefit .img {
	width: 480px;
	max-width: 48%;
}
.list_benefit .ttl_row {
	display: flex;
	align-items: center;
	gap: 13px;
	border-bottom: 1px dotted #888787;
	padding-bottom: 14px;
	margin-bottom: 16px;
}
.list_benefit .num {
	width: 60px;
	height: 60px;
	min-width: 60px;
	border-radius: 50%;
	background: rgba(145,198,163,0.25);
	color: #333;
	font-size: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.list_benefit .ttl {
	font-size: 2.6rem;
	font-weight: 700;
	letter-spacing: 1px;
	line-height: 1.6;
}
.list_benefit .txt {
	font-size: 1.5rem;
	line-height: 2;
	letter-spacing: 1.2px;
	text-align: justify;
	font-feature-settings: "halt" 1;
}
#benefit .btm_box {
	margin-top: 96px;
}
#benefit .btm_box .icon {
	margin-bottom: 20px;
}
#benefit .btm_box .icon img {
	width: 42px;
	height: auto;
}
#benefit .btm_box .txt {
	font-size: 1.5rem;
	letter-spacing: 0.9px;
	line-height: 2.4;
	margin-bottom: 20px;
	font-feature-settings: "halt" 1;
}
#benefit .btm_box .big_txt {
	font-size: 3.2rem;
	letter-spacing: 6.4px;
	line-height: 2;
	font-feature-settings: "halt" 1;
}
@media screen and (min-width:768px) and ( max-width:1080px) {
	.list_benefit li {
		gap: 30px;
	}
}
@media screen and (max-width:768px) {
	#benefit.area {
		padding: 50px 20px 60px;
	}
	#benefit .ttl_box {
		margin-bottom: 50px;
	}
	.list_benefit li {
		flex-flow: column;
		align-items: stretch;
		gap: 20px;
	}
	.list_benefit li:not(:last-child) {
		margin-bottom: 60px;
	}
	.list_benefit li.reverse .img {
		order: 2;
	}
	.list_benefit li.reverse .txt_box {
		order: 1;
	}
	.list_benefit .txt_box {
		width: 100%;
	}
	.list_benefit .img {
		width: 100%;
		max-width: 100%;
	}
	.list_benefit .num {
		width: 46px;
		height: 46px;
		min-width: 46px;
		font-size: 1.6rem;
	}
	.list_benefit .ttl {
		font-size: 2rem;
	}
	#benefit .btm_box {
		margin-top: 60px;
	}
	#benefit .btm_box .big_txt {
		font-size: 2rem;
		letter-spacing: 3px;
	}
}


/* reason
-------------------------------------------------------*/
#reason .hero {
	width: 79.44%; /* 1144/1440 右寄せ配置（Figma準拠） */
	height: 525px;
	margin: 70px 0 40px auto;
	overflow: hidden;
}
#reason .hero img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
#reason .ttl_area {
	padding: 30px 64px 0;
}
#reason .ttl_area .inner {
	max-width: 1120px;
}
#reason .ttl_area .ttl_script {
	margin-bottom: 5px;
}
#reason .reason_body {
	padding: 100px 64px 120px;
}
#reason .reason_body .inner {
	max-width: 1120px;
}
.list_reason > li {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: center;
	gap: 64px;
	position: relative;
}
.list_reason > li:not(:last-child) {
	margin-bottom: 80px;
}
.list_reason .bg_word {
	position: absolute;
	line-height: 1;
	white-space: nowrap;
	z-index: -1;
	pointer-events: none;
}
.list_reason .bg_word img {
	height: auto;
	width: auto;
	max-width: none;
	vertical-align: top;
}
.list_reason .bg_word_text {
	color: #faf9f7;
	font-size: 10rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0;
}
.list_reason {
	position: relative;
	z-index: 1;
}
.list_reason .row01 .bg_word {
	left: -35px;
	top: 234px;
}
.list_reason .row02 .bg_word {
	left: 623px;
	top: 383px;
}
.list_reason .row03 .bg_word {
	left: -44px;
	top: 259px;
}
.list_reason .row04 .bg_word {
	left: 656px;
	top: 202px;
}
.list_reason .row01 .bg_word img {
	width: 449.5px;
}
.list_reason .row02 .bg_word img {
	width: 523px;
}
.list_reason .row03 .bg_word img {
	width: 366.5px;
}
.list_reason .row04 .bg_word img {
	width: 488px;
}
.list_reason .txt_box {
	flex: 1;
	min-width: 0;
}
/* Reason画像は場所ごとにデザインが異なるため個別クラスで指定 */
.reason_img01 {
	width: 50%;
	max-width: 560px;
}
.reason_img01 img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
.reason_img02 {
	width: 480px;
	min-width: 480px;
}
.reason_img02 img {
	width: 100%;
	height: auto;
	aspect-ratio: 480 / 618;
	object-fit: cover;
}
.reason_img03 {
	width: 480px;
	min-width: 480px;
}
.reason_img03 img {
	width: 100%;
	height: auto;
	aspect-ratio: 480 / 618;
	object-fit: cover;
}
.reason_img04 {
	width: 560px;
	min-width: 0;
}
.reason_img04 img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
.list_reason .ttl {
	font-size: 2.4rem;
	font-weight: 700;
	letter-spacing: 1px;
	line-height: 1.8;
	border-bottom: 1px dotted #888787;
	padding-bottom: 14px;
	margin-bottom: 16px;
}
.list_reason .txt {
	font-size: 1.5rem;
	line-height: 2;
	letter-spacing: 1.2px;
	text-align: justify;
	font-feature-settings: "halt" 1;
}
.reason_subs03 {
	display: flex;
	gap: 24px;
	justify-content: center;
	margin-top: 80px;
}
.reason_subs03 p {
	width: 276px;
}
.reason_subs03 img {
	width: 100%;
	height: auto;
	aspect-ratio: 276 / 163;
	object-fit: cover;
}
.reason_subs04 {
	display: flex;
	margin-top: 80px;
}
.reason_subs04 p {
	width: 276px;
}
.reason_subs04 img {
	width: 100%;
	height: auto;
	aspect-ratio: 276 / 163;
	object-fit: cover;
}
@media screen and (min-width:768px) and ( max-width:1080px) {
	.list_reason > li {
		gap: 30px;
	}
	.reason_img01,
	.reason_img04 {
		width: 45%;
		min-width: 0;
	}
	.reason_img02,
	.reason_img03 {
		width: 40%;
		min-width: 0;
	}
	.list_reason .row01 .bg_word img {
		width: 314.65px;
	}
	.list_reason .row02 .bg_word img {
		width: 366.1px;
	}
	.list_reason .row03 .bg_word img {
		width: 256.55px;
	}
	.list_reason .row04 .bg_word img {
		width: 341.6px;
	}
}
@media screen and (max-width:768px) {
	#reason .hero {
		width: 100%;
		height: 46vw; /* 400:184 */
		margin: 0;
	}
	#reason .ttl_area {
		padding: 32px 30px 0;
		text-align: center;
	}
	#reason .reason_body {
		padding: 40px 30px 70px;
	}
	.list_reason > li {
		flex-flow: column;
		align-items: stretch;
		gap: 0;
	}
	.list_reason > li:not(:last-child) {
		margin-bottom: 40px;
	}
	/* SP表示順: タイトル → 本文 → メイン画像 → サブ画像 */
	.list_reason > li .txt_box {
		display: contents;
	}
	.list_reason .ttl {
		order: 1;
		font-size: 2rem;
	}
	.list_reason .txt {
		order: 2;
	}
	.list_reason .bg_word {
		position: absolute;
		margin: 0;
		z-index: -1;
	}
	.list_reason .row01 .bg_word {
		left: auto;
		right: 0;
		top: 204px;
	}
	.list_reason .row02 .bg_word,
	.list_reason .row03 .bg_word {
		left: auto;
		right: 0;
		top: 209px;
	}
	.list_reason .row04 .bg_word {
		left: auto;
		right: 0;
		top: 295px;
	}
	.list_reason .row01 .bg_word img {
		width: 270px;
	}
	.list_reason .row02 .bg_word img {
		width: 314px;
	}
	.list_reason .row02 .bg_word_text {
		font-size: 6rem;
	}
	.list_reason .row03 .bg_word img {
		width: 220px;
	}
	.list_reason .row04 .bg_word img {
		width: 293px;
	}
	.reason_img01,
	.reason_img02,
	.reason_img03,
	.reason_img04 {
		order: 4;
		width: 100%;
		min-width: 0;
		max-width: 100%;
		margin-top: 40px;
	}
	.reason_img01 img,
	.reason_img02 img,
	.reason_img03 img,
	.reason_img04 img {
		aspect-ratio: 340 / 191;
	}
	.reason_subs03,
	.reason_subs04 {
		order: 5;
		flex-flow: column;
		gap: 8px;
		margin-top: 24px;
	}
	.reason_subs03 p,
	.reason_subs04 p {
		width: 100%;
	}
	.reason_subs03 img,
	.reason_subs04 img {
		aspect-ratio: 340 / 150;
	}
}


/* plan
-------------------------------------------------------*/
#plan {
	background: var(--bg-beige);
}
#plan.area {
	padding: 80px 0 56px;
}
.plan_ttl {
	text-align: center;
	margin-bottom: 60px;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.plan_ttl .en {
	color: var(--green);
	font-size: 9rem;
	line-height: 1.2;
	display: inline-block;
	position: relative;
	padding-bottom: 50px; /* 下に配置するアイコン分の余白 */
}
.plan_ttl .en .icon {
	width: 95px;
	height: auto;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
}
.plan_ttl .ja {
	font-size: 1.8rem;
	font-weight: 700;
	order: -1;
	margin-left: 40px;
}
.plan_block .hero {
	height: 580px;
	background: var(--bg-gray);
}
.plan_block .hero .hero_word {
	position: absolute;
	left: 73px;
	bottom: 25px;
	color: #fff;
	font-size: 8.8rem;
	font-weight: 700;
	letter-spacing: 26.4px;
	line-height: 1.2;
	white-space: nowrap;
}
.plan_block .card_area {
	padding: 100px 64px;
}
.plan_block .card_area .inner {
	max-width: 1120px;
}
.plan_block .card_frame {
	border: 1px solid #333;
	padding: 64px 40px;
}
.plan_block .top_row {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: center;
	gap: 40px;
	margin-bottom: 60px;
}
.plan_block .detail {
	flex: 1;
	min-width: 0;
	text-align: right;
}
.plan_block .p_name {
	font-size: 5rem;
	font-weight: 700;
	letter-spacing: 15px;
	line-height: 1.2;
	margin-bottom: 16px;
}
.plan_block .p_copy {
	font-size: 1.5rem;
	line-height: 2;
	letter-spacing: 1.2px;
	margin-bottom: 64px;
}
.plan_block .price_box .size {
	font-size: 1.8rem;
	font-weight: 700;
	margin-bottom: 16px;
}
.plan_block .price_flex {
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: 12px;
	margin-bottom: 10px;
}
.plan_block .price_detail {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.plan_block .price_flex .label {
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: 20px;
	white-space: nowrap;
}
.plan_block .price {
	line-height: 1;
	white-space: nowrap;
	display: inline-flex;
	align-items: baseline;
}
.plan_block .price .num {
	font-family: "Roboto", sans-serif;
	font-size: 8rem;
	font-weight: 400;
	margin-right: 5px;
	line-height: 1;
}
.plan_block .price .unit {
	font-size: 3rem;
	font-weight: 500;
	margin-bottom: 1.2rem;
}
.plan_block .price .tax {
	font-size: 1.4rem;
	margin-left: 5px;
	margin-bottom: 1.2rem;
}
.plan_block .price_tax {
	font-size: 1.5rem;
	line-height: 1.4;
	margin-top: 6px;
}
.plan_block .price_caution {
	font-size: 1.2rem;
	line-height: 1.8;
}
.plan_block .floor {
	width: 48.5%;
	max-width: 544px;
}
.plan_block .floor img {
	object-fit: contain;
	max-height: 556px;
}
.feature_grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
}
.feature_grid li {
	background: #fff;
	padding: 16px;
	display: flex;
	gap: 16px;
	align-items: center;
}
.feature_grid .img {
	width: 240px;
	min-width: 240px;
}
.feature_grid .img img {
	height: 135px;
	object-fit: cover;
}
.feature_grid .ttl {
	font-size: 1.6rem;
	font-weight: 700;
	letter-spacing: 1.28px;
	line-height: 1.6;
	margin-bottom: 12px;
}
.feature_grid .txt {
	font-size: 1.5rem;
	line-height: 1.6;
	letter-spacing: 1.2px;
	text-align: justify;
	font-feature-settings: "halt" 1;
}
.plan_note {
	text-align: center;
	font-size: 1.9rem;
	line-height: 1.6;
	max-width: 857px;
	margin: 0 auto;
	padding: 0 20px;
}
.plan_note span {
	font-weight: 700;
}
@media screen and (min-width:768px) and ( max-width:1080px) {
	.plan_block .p_name {
		font-size: 3.6rem;
	}
	.plan_block .price .num {
		font-size: 6rem;
	}
	.feature_grid {
		grid-template-columns: 1fr;
	}
}
@media screen and (max-width:768px) {
	#plan.area {
		padding: 50px 0 40px;
	}
	.plan_ttl {
		margin-bottom: 30px;
	}
	.plan_ttl .en {
		font-size: 7.6rem;
		line-height: 1.25;
		padding-bottom: 50px;
	}
	.plan_ttl .en .icon {
		width: 95px;
	}
	.plan_ttl .ja {
		font-size: 1.8rem;
		margin-left: 0;
	}
	.plan_block .hero {
		height: 40.5vw; /* 400:162 */
	}
	.plan_block .hero .hero_word {
		left: 20px;
		bottom: 0;
		font-size: 4.2rem;
		letter-spacing: 8px;
	}
	.plan_block .card_area {
		padding: 40px 20px;
	}
	.plan_block .card_frame {
		padding: 30px 20px;
	}
	.plan_block .top_row {
		flex-flow: column;
		align-items: stretch;
		gap: 30px;
		margin-bottom: 30px;
	}
	.plan_block .detail {
		text-align: left;
	}
	.plan_block .p_name {
		font-size: 4rem;
		letter-spacing: 8px;
	}
	.plan_block .p_copy {
		margin-bottom: 30px;
	}
	.plan_block .price_box .size {
		font-size: 1.6rem;
		text-align: left;
	}
	.plan_block .price_flex {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
	}
	.plan_block .price_flex .label {
		display: block;
		text-align: left;
		margin-bottom: 12px;
	}
	.plan_block .price_detail {
		align-items: flex-start;
	}
	.plan_block .price .unit {
		font-size: 2.8rem;
		margin-bottom: 1.5rem;
	}
	.plan_block .price .tax {
		font-size: 1.4rem;
		margin-bottom: 1.5rem;
	}
	.plan_block .price .num {
		font-size: clamp(5.6rem, 18vw, 7.2rem);
	}
	.plan_block .price_tax {
		font-size: 1.5rem;
	}
	.plan_block .floor {
		width: 100%;
		max-width: 100%;
	}
	.feature_grid {
		grid-template-columns: 1fr;
	}
	.feature_grid li {
		flex-flow: column;
		align-items: stretch;
	}
	.feature_grid .img {
		width: 100%;
		min-width: 0;
	}
	.feature_grid .img img {
		height: auto;
		aspect-ratio: 16/9;
	}
	.plan_note {
		font-size: 1.5rem;
		text-align: left;
	}
}


/* voice
-------------------------------------------------------*/
#voice.area {
	padding: 100px 20px;
	background: #fff;
}
#voice .inner {
	max-width: 1120px;
}
.voice_box {
	position: relative;
	padding-bottom: 43px; /* 最終行と緑ボックス下端の余白（Figma準拠） */
}
/* 緑の角丸背景。吹き出しの上端から63px下げて配置（吹き出しが上にはみ出す） */
.voice_box::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 63px;
	bottom: 0;
	background: #f8faf7;
	border-radius: 16px;
	z-index: 0;
}
.voice_box > * {
	position: relative;
	z-index: 1;
}
.voice_box .bubble {
	max-width: 775px;
	margin: 0 auto 32px;
	text-align: center;
	background: #fff;
	border: 1px solid #333;
	border-radius: 6px;
	padding: 28px 25px 30px;
	position: relative;
}
.voice_box .bubble::after {
	content: "";
	position: absolute;
	right: 30px;
	bottom: -24px;
	width: 14px;
	height: 24px;
	background: #fff;
	border-right: 1px solid #333;
	border-left: 1px solid #333;
}
.voice_box .bubble_en {
	color: var(--green);
	font-size: 4rem;
	font-weight: 700;
	letter-spacing: 8px;
	line-height: 1.25;
}
.voice_box .bubble_ja {
	font-size: 1.6rem;
	font-weight: 700;
	letter-spacing: 1.2px;
	line-height: 1.8;
}
.list_voice {
	max-width: 775px;
	margin: 0 auto;
}
.list_voice li {
	display: flex;
	align-items: flex-start;
	gap: 27px;
	width: 580px;
	max-width: 100%;
}
.list_voice li:not(:last-child) {
	margin-bottom: 32px;
}
.voice_num {
	min-width: 79px;
	width: 79px;
}
.voice_num img {
	width: 100%;
	height: auto;
	vertical-align: top;
}
.list_voice .txt {
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.8;
	letter-spacing: 1.28px;
	font-feature-settings: "halt" 1;
}
.voice_box .family {
	position: absolute;
	right: 108px;
	bottom: 111px;
	width: 189px;
}
@media screen and (min-width:768px) and ( max-width:1200px) {
	.voice_box .family {
		right: 30px;
		bottom: 40px;
		width: 140px;
	}
}
@media screen and (max-width:768px) {
	#voice.area {
		padding: 40px 0 38px;
	}
	#voice .inner {
		padding: 0 20px; /* 緑ボックスを360px幅に（Figma準拠） */
	}
	.voice_box {
		padding-bottom: 40px;
	}
	.voice_box::before {
		top: 77px; /* SPは吹き出し上端から76.6px下げて配置 */
	}
	.voice_box .bubble {
		width: calc(100% - 20px); /* 緑背景から左右10pxずつ内側（幅に依らず一定の余白） */
		max-width: none;
		margin: 0 auto 30px;
	}
	.voice_box .bubble {
		padding: 26px 12px;
	}
	.voice_box .bubble_en {
		font-size: 2.8rem;
		letter-spacing: 3px;
	}
	.voice_box .bubble_ja {
		font-size: 1.4rem;
	}
	.list_voice {
		padding: 0 16px; /* VOICE番号・本文を16px内側に */
	}
	.list_voice li {
		width: 100%;
		gap: 18px;
	}
	.voice_box .family {
		position: static;
		margin: 20px auto 0;
		text-align: center;
	}
	.voice_box .family img {
		width: 132px;
	}
}


/* faq
-------------------------------------------------------*/
#faq {
	background: var(--bg-beige);
}
#faq.area {
	padding: 100px 64px 56px;
}
#faq .inner {
	max-width: 1120px;
}
.ttl_faq {
	text-align: center;
	font-size: 3.2rem;
	font-weight: 400;
	letter-spacing: 6.4px;
	line-height: 2;
	margin-bottom: 52px;
}
.ttl_faq .wave {
	display: block;
	width: 200px;
	height: auto;
	margin: 6px auto 0;
}
.list_faq li {
	padding: 20px 0;
}
.list_faq .q_row,
.list_faq .a_row {
	display: flex;
	align-items: flex-start;
	gap: 20px;
}
.list_faq .q_row {
	margin-bottom: 20px;
}
.list_faq .badge {
	width: 34px;
	min-width: 34px;
	border-radius: 4px;
	font-size: 2rem;
	line-height: 1.45;
	text-align: center;
	display: block;
}
.list_faq .badge_q {
	background: #333;
	color: #fff;
}
.list_faq .badge_a {
	background: #fff;
	color: #333;
}
.list_faq .q_txt {
	font-size: 1.8rem;
	line-height: 1.4;
	padding-top: 5px;
}
.list_faq .a_txt {
	font-size: 1.6rem;
	line-height: 2;
}
@media screen and (max-width:768px) {
	#faq.area {
		padding: 50px 20px 30px;
	}
	.ttl_faq {
		font-size: 2.4rem;
		margin-bottom: 30px;
	}
	.list_faq .q_row,
	.list_faq .a_row {
		gap: 12px;
	}
	.list_faq .q_row {
		margin-bottom: 12px;
	}
	.list_faq .badge {
		width: 30px;
		min-width: 30px;
		font-size: 1.8rem;
	}
	.list_faq .q_txt {
		font-size: 1.6rem;
		padding-top: 3px;
	}
	.list_faq .a_txt {
		font-size: 1.4rem;
	}
}


/* monitor
-------------------------------------------------------*/
#monitor {
	background: var(--bg-beige);
}
#monitor.area {
	padding: 70px 20px 75px;
}
#monitor .inner {
	max-width: 860px;
}
.monitor_card {
	background: #fff;
	border: 1px solid #333;
	border-radius: 16px;
	padding: 30px;
	position: relative;
	margin-top: 55px;
}
.monitor_card .icon {
	position: absolute;
	left: 38px;
	top: -43px;
	width: 145px;
	height: 145px;
	background: var(--navy);
	color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 4.4rem;
	font-weight: 500;
}
.monitor_card .ttl_box {
	text-align: center;
	border-bottom: 1px dashed #333;
	padding-bottom: 16px;
	margin-bottom: 32px;
	margin-left: 160px;
}
.monitor_card .ttl_s {
	font-size: 2rem;
	font-weight: 700;
}
.monitor_card .ttl_l {
	font-size: 3rem;
	font-weight: 700;
	letter-spacing: 2.4px;
}
.monitor_card .body_flex {
	display: flex;
	align-items: center;
	gap: 32px;
}
.monitor_card .txt {
	flex: 1;
	font-size: 2rem;
	line-height: 1.6;
}
.monitor_card .img {
	width: 301px;
	min-width: 301px;
}
@media screen and (min-width:768px) and ( max-width:1080px) {
	.monitor_card .icon {
		width: 110px;
		height: 110px;
		font-size: 3.2rem;
		top: -30px;
	}
	.monitor_card .ttl_box {
		margin-left: 120px;
	}
	.monitor_card .txt {
		font-size: 1.7rem;
	}
}
@media screen and (max-width:768px) {
	#monitor.area {
		padding: 40px 20px 60px;
	}
	.monitor_card {
		margin-top: 0;
		padding: 20px 20px 40px;
	}
	.monitor_card .icon {
		position: static;
		transform: none;
		margin: 0 auto 12px;
		width: 108px;
		height: 108px;
		font-size: 3.2rem;
	}
	.monitor_card .ttl_box {
		margin-left: 0;
	}
	.monitor_card .ttl_s {
		font-size: 1.5rem;
	}
	.monitor_card .ttl_l {
		font-size: 1.9rem;
	}
	.monitor_card .body_flex {
		flex-flow: column;
		align-items: stretch;
		gap: 25px;
	}
	.monitor_card .img {
		width: 100%;
		min-width: 0;
		order: 1;
	}
	.monitor_card .img img {
		display: block;
		width: 100%;
		height: auto;
	}
	.monitor_card .txt {
		order: 2;
		font-size: 1.5rem;
		line-height: 1.9;
	}
}


/* cta
-------------------------------------------------------*/
#cta {
	position: relative;
	padding: 40px 20px;
	background: url(../img/cta_bg.jpg) no-repeat center/cover;
}
#cta::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.4);
}
#cta .inner {
	position: relative;
	max-width: 1200px;
	z-index: 1;
}
#cta .top_txt {
	color: #fff;
	font-size: 2.4rem;
	font-weight: 700;
	text-align: center;
	line-height: 1.8;
	margin: 10px 0 100px;
}
#cta .cta_copy_sp {
	display: none;
}
#cta .box {
	background: #fff;
	border-radius: 10px;
	max-width: 860px;
	margin: 0 auto;
	height: 350px;
	padding: 0 20px 20px;
	position: relative;
	text-align: center;
}
#cta .box .icon {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: -55px;
	width: 110px;
	height: 110px;
	background: var(--beige);
	color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 3rem;
	font-weight: 700;
	line-height: 1.2;
}
#cta .cta_amazon {
	max-width: 677px;
	margin: -15px auto 0;
}
#cta .cta_amazon img {
	width: 100%;
	height: auto;
}
#cta .cta_requirement {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 2.2rem;
	line-height: 1.6;
	margin: -3px 0 7px;
}
#cta .cta_notes {
	max-width: 860px;
	margin: 20px auto 0;
	color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.2rem;
	line-height: 1.8;
}
.btn01 a {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--red);
	width: 100%;
	max-width: 615px;
	border-radius: 50px;
	height: 95px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 3rem;
	font-weight: 700;
	position: relative;
	color: #fff;
	margin: 0 auto;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
}
.btn01 a::after {
	position: absolute;
	display: block;
	content: "";
	background: url(../img/btn_arrow.png) no-repeat right center/23px 25px;
	width: 23px;
	height: 25px;
	right: 30px;
	top: 50%;
	transform: translate(0,-50%);
}
@media screen and (max-width:768px) {
	#cta {
		padding: 55px 20px 50px;
		background-position: center top;
	}
	#cta .top_txt {
		font-size: 2rem;
		line-height: 1.9;
		margin: 0 0 80px;
	}
	#cta .cta_copy_pc {
		display: none;
	}
	#cta .cta_copy_sp {
		display: inline;
	}
	#cta .box {
		height: auto;
		padding: 40px 20px 20px;
	}
	#cta .box .icon {
		top: -50px;
		width: 100px;
		height: 100px;
		font-size: 2.6rem;
	}
	#cta .cta_amazon {
		margin-top: 0;
	}
	#cta .cta_requirement {
		font-size: 1.6rem;
		line-height: 1.6;
		margin: 8px 0 30px;
	}
	.btn01 a {
		height: 70px;
		font-size: 1.8rem;
	}
	#cta .cta_notes {
		margin-top: 25px;
		font-size: 1.2rem;
		line-height: 1.9;
	}
	.btn01 a::after {
		background: url(../img/btn_arrow.png) no-repeat right center/18px 20px;
		width: 18px;
		height: 20px;
		right: 15px;
	}
}


/* floating CTA
-------------------------------------------------------*/
.floating-cta {
	position: fixed;
	right: 24px;
	bottom: -600px; /* 最初は画面の下に隠しておく */
	width: 450px;
	z-index: 999;
	transition: bottom 0.4s ease;
}
.floating-cta.is-show {
	bottom: 24px;
}
.cta_card {
	background: #fff;
	border-radius: 10px;
	box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.14);
	padding: 40px 20px 20px;
}
.cta_card .cta_img {
	margin-bottom: 19px;
}
.cta_card .cta_img img {
	width: 100%;
	height: auto;
}
.cta_card .cta_note {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.6rem;
	font-weight: 500;
	color: #020202;
	text-align: center;
	line-height: 1.6;
	margin-bottom: 19px;
}
.cta_card .cta_btn a {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #e6001b;
	width: 100%;
	max-width: 615px;
	height: 71px;
	border-radius: 50px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 2.1rem;
	font-weight: 700;
	color: #fff;
	margin: 0 auto;
	position: relative;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
}
.cta_card .cta_btn a::after {
	position: absolute;
	display: block;
	content: "";
	background: url(../img/btn_arrow.png) no-repeat right center/18px 20px;
	width: 18px;
	height: 20px;
	right: 15px;
	top: 50%;
	transform: translate(0,-50%);
}
.cta-close-btn {
	position: absolute;
	top: -14px;
	right: 6px;
	width: 54px;
	height: 54px;
	background: #2e3e55;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1000;
	border: none;
}
.cta-close-btn::before,
.cta-close-btn::after {
	content: '';
	position: absolute;
	width: 15px;
	height: 1px;
	background-color: #fff;
}
.cta-close-btn::before { transform: rotate(45deg); }
.cta-close-btn::after  { transform: rotate(-45deg); }
@media screen and (max-width:768px) {
	.floating-cta {
		right: 10px;
		width: min(84vw, 300px);
	}
	.floating-cta.is-show {
		bottom: 10px;
	}
	.cta_card {
		border-radius: 7px;
		box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.14);
		padding: 27px 13px 13px;
	}
	.cta_card .cta_img {
		margin-bottom: 13px;
	}
	.cta_card .cta_note {
		font-size: 1.067rem;
		line-height: 1.6;
		margin-bottom: 13px;
	}
	.cta_card .cta_btn a {
		height: 47px;
		border-radius: 33px;
		font-size: 1.4rem;
		box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.3);
	}
	.cta_card .cta_btn a::after {
		background: url(../img/btn_arrow.png) no-repeat right center/12px 13px;
		width: 12px;
		height: 13px;
		right: 10px;
	}
	.cta-close-btn {
		top: -9px;
		right: 5px;
		width: 36px;
		height: 36px;
	}
	.cta-close-btn::before,
	.cta-close-btn::after {
		width: 12px;
	}
}


/* footer
-------------------------------------------------------*/
#footer {
	text-align: center;
	background: #fff;
}
#footer.area {
	padding: 60px 20px 40px;
}
#footer .logo {
	margin: 0 0 40px;
}
#footer .logo img {
	max-width: 171px;
}
#footer .copy {
	font-size: 1.2rem;
}
@media screen and (max-width:768px) {
	#footer.area {
		padding: 40px 20px 30px;
	}
	#footer .logo {
		margin: 0 0 20px;
	}
}