@charset "UTF-8";






/****************************************************
 * トップページ｜メインビジュアル
 ****************************************************/

/* .skin-grayish.front-top-page .container .header-container .header {
	background-position: top center;
}
@media screen and (max-width: 1023px) {
	.skin-grayish.front-top-page .container .header-container .header {
		background-image: url(https://11neko.com/wp-content/uploads/top_thumbnail_sp.webp);
		background-position: center center;
	}
} */



/****************************************************
 * トップページ｜セクション
 ****************************************************/

.front-page-article .entry-content .top-section h2:not(.topH2),
.front-page-article .entry-content .top-section h3:not(.topH3),
.front-page-article .entry-content .topCompare-section h2:not(.topH2),
.front-page-article .entry-content .topCompare-section h3:not(.topH3),
.front-page-article .entry-content .topInfoSection h2:not(.topH2),
.front-page-article .entry-content .topInfoSection h3:not(.topH3),
.front-page-article .entry-content .topPriceMain-section h2:not(.topH2),
.front-page-article .entry-content .topPriceMain-section h3:not(.topH3) {
	background: transparent;
	background-color: transparent;
	border: none;
	border-left: none;
	border-right: none;
	border-bottom: none;
	box-shadow: none;
	margin: 0;
	padding: 0;
}

.front-page-article .entry-content .top-section h2::before,
.front-page-article .entry-content .top-section h2::after,
.front-page-article .entry-content .top-section h3::before,
.front-page-article .entry-content .top-section h3::after,
.front-page-article .entry-content .topCompare-section h2::before,
.front-page-article .entry-content .topCompare-section h2::after,
.front-page-article .entry-content .topCompare-section h3::before,
.front-page-article .entry-content .topCompare-section h3::after,
.front-page-article .entry-content .topInfoSection h2::before,
.front-page-article .entry-content .topInfoSection h2::after,
.front-page-article .entry-content .topInfoSection h3::before,
.front-page-article .entry-content .topInfoSection h3::after,
.front-page-article .entry-content .topPriceMain-section h2::before,
.front-page-article .entry-content .topPriceMain-section h2::after,
.front-page-article .entry-content .topPriceMain-section h3::before,
.front-page-article .entry-content .topPriceMain-section h3::after {
	display: none;
	content: none;
}

.top-section {
	padding: 60px 25px;
}



/****************************************************
 * トップページ｜CTAボタン
 ****************************************************/

.top-section .buttonCTA,
.topPriceMain-section .buttonCTA {
	margin-top: 3em;
}

.topPriceMain-section .buttonCTA-microcopy {
	color: #FFF;
}
.topPriceMain-section .buttonCTA-text {
	background-image: linear-gradient(to right, #ffc3a0 0%, #ffafbd 100%);
}


/****************************************************
 * トップページ｜補足・追加情報
 ****************************************************/

.topSupplement {
	margin: -1em auto 7em;
	font-size: 12px;
	color: #666;
	text-align: right;
}

.topCompare-kicker {
	display: flex;
	width: fit-content;
	margin: 0 auto 16px;
	padding: 8px 14px;
	border-radius: 999px;
	background: linear-gradient(135deg, #f7fffc 0%, #edf9f4 100%);
	color: #0f8167;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: 0 12px 24px rgba(15, 129, 103, 0.08);
}

.topCompare-section .compareTable-title {
	margin-bottom: 1em;
}

.topCompare-section {
	position: relative;
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 80px 28px;
	background:
		radial-gradient(circle at 12% 14%, rgba(255, 214, 153, 0.18), transparent 18%),
		radial-gradient(circle at 86% 18%, rgba(20, 163, 131, 0.14), transparent 20%),
		linear-gradient(180deg, #fffdfa 0%, #f7fbf9 52%, #f3faf6 100%);
	box-sizing: border-box;
	overflow: hidden;
}

.topCompare-inner {
	position: relative;
	z-index: 1;
	max-width: 1080px;
	margin: 0 auto;
}

.topCompare-section .topCompare-subtitle {
	margin-top: 1.6em;
	margin-bottom: 1em;
}

.topCompare-subKicker {
	display: flex;
	width: fit-content;
	margin: 0 auto 14px;
	padding: 8px 14px;
	border-radius: 999px;
	background: linear-gradient(135deg, #f7fffc 0%, #edf9f4 100%);
	color: #0f8167;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: 0 12px 24px rgba(15, 129, 103, 0.08);
}

.topCompare-section .topCompare-subtitle {
	position: relative;
	width: 100%;
	max-width: none;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 1em;
	text-align: center;
	display: block;
}

.topCompare-subtitle::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 92px;
	height: 5px;
	border-radius: 999px;
	background: linear-gradient(90deg, #14a383 0%, #ffd47c 100%);
	box-shadow: 0 10px 20px rgba(20, 163, 131, 0.12);
}

.topCompare-section .topCompare-subtitle,
.topCompare-section .topCompare-subtitle span {
	text-align: center;
}

.topInfoGrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	max-width: 1080px;
	margin: 0 auto;
}

.topInfoGrid-two {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.topInfoSection {
	position: relative;
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 84px 28px;
	box-sizing: border-box;
	overflow: hidden;
}

.topInfoSection-media {
	background:
		radial-gradient(circle at 12% 16%, rgba(20, 163, 131, 0.14), transparent 18%),
		radial-gradient(circle at 88% 18%, rgba(255, 214, 153, 0.18), transparent 20%),
		linear-gradient(180deg, #f7fbf9 0%, #eef8f4 100%);
}

.topInfoSection-delivery {
	background:
		radial-gradient(circle at 14% 20%, rgba(255, 214, 153, 0.18), transparent 18%),
		radial-gradient(circle at 86% 16%, rgba(20, 163, 131, 0.12), transparent 18%),
		linear-gradient(180deg, #fffdfa 0%, #f7faf6 100%);
}

.topInfoSection-inner {
	position: relative;
	z-index: 1;
	max-width: 1080px;
	margin: 0 auto;
}

.topInfoSection-kicker {
	display: flex;
	width: fit-content;
	margin: 0 auto 16px;
	padding: 8px 14px;
	border-radius: 999px;
	background: linear-gradient(135deg, #f7fffc 0%, #edf9f4 100%);
	color: #0f8167;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: 0 12px 24px rgba(15, 129, 103, 0.08);
}

.topInfoSection .topInfoSection-title {
	margin-bottom: 1em;
}

.topInfoSection-lead {
	max-width: 48em;
	margin: 0 auto 34px;
	color: #48605a;
	font-size: 15px;
	line-height: 1.9;
	text-align: center;
}

.topInfoSection-leadBreak {
	display: none;
}

.topInfoCard {
	position: relative;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 252, 251, 0.96) 100%);
	border: 1px solid rgba(21, 104, 86, 0.08);
	border-radius: 26px;
	padding: 28px 24px 24px;
	box-shadow: 0 16px 30px rgba(16, 61, 51, 0.08);
	overflow: hidden;
}

.topInfoCard-label {
	display: inline-flex;
	margin: 0 0 12px;
	color: #0f8167;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.topInfoCard-media {
	margin: 0 0 16px;
	border-radius: 18px;
	overflow: hidden;
	background: linear-gradient(145deg, #eff8f5 0%, #fffdfa 100%);
	box-shadow: 0 14px 24px rgba(16, 61, 51, 0.08);
}

.topInfoCard-media img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: 180px;
	object-fit: cover;
}

.topInfoCard .topInfoTitle {
	color: #156856;
	font-size: 22px;
	line-height: 1.45;
	margin-bottom: 1em;
}

.topInfoCard p {
	color: #4b625a;
	line-height: 1.8;
	margin-bottom: 0;
}

.topInfoList {
	margin: 0.9em 0 0;
	padding-left: 0;
	list-style: none;
}

.topInfoList li {
	position: relative;
	margin-bottom: 0.8em;
	padding-left: 22px;
	line-height: 1.8;
	color: #4b625a;
}

.topInfoList li::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 0;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: linear-gradient(135deg, #14a383 0%, #ffd47c 100%);
	box-shadow: 0 0 0 6px rgba(20, 163, 131, 0.1);
}

.topInfoCard .topInfoNote {
	margin-top: 1.2em;
	padding: 12px 14px;
	border: 1px solid rgba(20, 163, 131, 0.16);
	border-radius: 14px;
	background: linear-gradient(180deg, rgba(20, 163, 131, 0.06) 0%, rgba(255, 255, 255, 0.92) 100%);
	font-size: 13px;
	color: #6c7f79;
	line-height: 1.8;
}

.topReviews-section {
	position: relative;
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 88px 28px;
	background:
		radial-gradient(circle at 10% 18%, rgba(255, 214, 153, 0.16), transparent 18%),
		radial-gradient(circle at 88% 16%, rgba(80, 214, 181, 0.14), transparent 20%),
		linear-gradient(145deg, #17333a 0%, #1b4545 44%, #24595a 100%);
	box-sizing: border-box;
	overflow: hidden;
}

.topReviews-inner {
	position: relative;
	z-index: 1;
	max-width: 1080px;
	margin: 0 auto;
}

.topReviews-kicker {
	display: flex;
	width: fit-content;
	margin: 0 auto 16px;
	padding: 8px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	color: #e3fff7;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	backdrop-filter: blur(10px);
	box-shadow: 0 12px 24px rgba(4, 20, 18, 0.16);
}

.topReviews-title {
	margin-bottom: 1em;
	color: #fff;
}

.site-top .topH2.topReviews-title span {
	color: #fff;
	background: repeating-linear-gradient(-45deg, #2b4f84 0 2px, transparent 2px 4px) bottom left / 100% 0.8em no-repeat;
}

.topReviews-lead {
	max-width: 44em;
	margin: 0 auto 34px;
	color: rgba(255, 255, 255, 0.86);
	font-size: 15px;
	line-height: 1.9;
	text-align: center;
}

.topReviews-leadBreak {
	display: none;
}

.topReviews-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.topReviews-card {
	margin-top: 0;
	padding: 26px 24px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 28px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 252, 251, 0.96) 100%);
	box-shadow: 0 22px 36px rgba(7, 24, 27, 0.22);
}

.topReviews-card .boxReview-person {
	flex-basis: 96px;
	margin-right: 20px;
}

.topReviews-card .boxReview-image img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border: 4px solid rgba(20, 163, 131, 0.1);
	box-shadow: 0 10px 20px rgba(16, 61, 51, 0.08);
}

.topReviews-card .boxReview-name {
	margin-top: 10px;
}

.topReviews-card .boxReview-star {
	font-size: 16px;
	letter-spacing: 0.08em;
}

.topReviews-card .boxReview-reviewQuote {
	padding: 0;
}

.topReviews-card .topReviews-quote {
	position: relative;
}

.topReviews-card .topReviews-quote::before {
	top: -10px;
	left: 0;
}

.topReviews-card .topReviews-quote::after {
	right: 0;
	bottom: -10px;
}

.topReviews-card .boxReview-reviewQuote p {
	font-size: 14px;
	line-height: 1.95;
	color: #4b625a;
}

.topReviews-card .boxReview-reviewQuote p:last-of-type {
	margin-bottom: 0;
}

.topReviews-card .boxReview-reviewQuote p b {
	color: #0f8167;
}

.topReviews-card .boxReview-reviewQuote cite {
	display: block;
	margin-top: 15px;
	padding-top: 14px;
	border-top: 1px dashed rgba(73, 93, 85, 0.28);
}

.topReviews-card .boxReview-reviewQuote cite a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #536862;
	font-size: 13px;
	font-weight: 700;
}

.topReviews-card .boxReview-reviewQuote cite a::before {
	content: "引用元";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 5px 9px;
	border-radius: 999px;
	background: rgba(20, 163, 131, 0.1);
	color: #0f8167;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.08em;
}

.topReviews-section .buttonCTA {
	max-width: 1080px;
	width: 100%;
	margin: 3em auto 0;
}

.topReviews-section .buttonCTA-microcopy {
	color: rgba(255, 255, 255, 0.84);
}

.topReviews-section .buttonCTA-text {
	background: linear-gradient(145deg, #ffd37b 0%, #ffab70 100%);
	color: #15343a;
	box-shadow: 0 10px 22px rgba(7, 24, 27, 0.22), inset 0 2px 2px rgba(255, 255, 255, 0.45);
}

.topReviews-section .buttonCTA-text:hover {
	color: #15343a;
	box-shadow: 0 14px 28px rgba(7, 24, 27, 0.28), inset 0 2px 2px rgba(255, 255, 255, 0.55);
}

.topFaq-section {
	position: relative;
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 88px 28px;
	background:
		radial-gradient(circle at 12% 18%, rgba(255, 214, 153, 0.18), transparent 18%),
		radial-gradient(circle at 88% 16%, rgba(20, 163, 131, 0.12), transparent 20%),
		linear-gradient(180deg, #fffdf8 0%, #f8fbf9 52%, #eef8f3 100%);
	box-sizing: border-box;
	overflow: hidden;
}

.topFaq-inner {
	position: relative;
	z-index: 1;
	max-width: 1080px;
	margin: 0 auto;
}

.topFaq-kicker {
	display: flex;
	width: fit-content;
	margin: 0 auto 16px;
	padding: 8px 14px;
	border-radius: 999px;
	background: linear-gradient(135deg, #f7fffc 0%, #edf9f4 100%);
	color: #0f8167;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: 0 12px 24px rgba(15, 129, 103, 0.08);
}

.topFaq-title {
	margin-bottom: 1em;
}

.topFaq-lead {
	max-width: 44em;
	margin: 0 auto 34px;
	color: #4c625b;
	font-size: 15px;
	line-height: 1.9;
	text-align: center;
}

.topFaq-leadBreak {
	display: none;
}

.topFaq-list {
	display: grid;
	gap: 16px;
}

.topFaq-item {
	padding: 24px 24px 22px;
	border-radius: 24px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 252, 251, 0.96) 100%);
	border: 1px solid rgba(21, 104, 86, 0.08);
	box-shadow: 0 16px 30px rgba(16, 61, 51, 0.08);
}

.topFaq-question {
	position: relative;
	padding-left: 58px;
	color: #173b31;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.5;
}

.topFaq-question::before {
	content: "Q";
	position: absolute;
	top: 2px;
	left: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: linear-gradient(145deg, #ffb07c 0%, #ff8d82 100%);
	color: #fff;
	font-size: 18px;
	font-weight: 800;
	box-shadow: 0 10px 18px rgba(255, 141, 130, 0.22);
}

.topFaq-answer {
	position: relative;
	margin-top: 16px;
	padding: 16px 0 0 58px;
	padding-left: 0;
	border-top: 1px dashed rgba(73, 93, 85, 0.2);
}

.topFaq-answer p {
	margin-bottom: 0;
	color: #4b625a;
	font-size: 15px;
	line-height: 1.9;
}

.topFlow-section {
	position: relative;
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 88px 28px;
	background:
		radial-gradient(circle at 10% 18%, rgba(255, 214, 153, 0.14), transparent 18%),
		radial-gradient(circle at 88% 14%, rgba(97, 184, 210, 0.12), transparent 20%),
		linear-gradient(145deg, #e9f1f1 0%, #dfeaea 44%, #e8f3ef 100%);
	box-sizing: border-box;
	overflow: hidden;
}

.topFlow-inner {
	position: relative;
	z-index: 1;
	max-width: 1080px;
	margin: 0 auto;
}

.topFlow-kicker {
	display: flex;
	width: fit-content;
	margin: 0 auto 16px;
	padding: 8px 14px;
	border-radius: 999px;
	background: linear-gradient(135deg, #f7fffc 0%, #edf9f4 100%);
	color: #0f8167;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: 0 12px 24px rgba(15, 129, 103, 0.08);
}

.topFlow-title {
	margin-bottom: 1em;
}

.topFlow-lead {
	max-width: 44em;
	margin: 0 auto 34px;
	color: #4c625b;
	font-size: 15px;
	line-height: 1.9;
	text-align: center;
}

.topFlow-leadBreak {
	display: none;
}

.topFlow-section .topApplication {
	max-width: 920px;
	margin: 0 auto;
}

.topFlowList {
	display: grid;
	gap: 18px;
	max-width: 1080px;
	margin: 0 auto;
}

.topFlowItem {
	position: relative;
	display: grid;
	grid-template-columns: 132px minmax(0, 1fr);
	gap: 22px;
	padding: 22px 24px;
	border-radius: 26px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 252, 251, 0.96) 100%);
	border: 1px solid rgba(21, 104, 86, 0.08);
	box-shadow: 0 16px 30px rgba(16, 61, 51, 0.08);
	overflow: hidden;
}

.topFlowItem::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	border-radius: 24px 24px 0 0;
	background: linear-gradient(90deg, #14a383 0%, #ffd47c 100%);
}

.topFlowItem-step {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: start;
	min-height: 52px;
	padding: 0 18px;
	border-radius: 999px;
	background: linear-gradient(145deg, #eff8f5 0%, #fffdfa 100%);
	color: #0f8167;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.topFlowItem-body {
	min-width: 0;
}

.topFlowItem-title {
	color: #173b31;
	font-size: 24px;
	font-weight: 800;
	line-height: 1.4;
	margin-bottom: 12px;
}

.topFlowItem-body p {
	margin-bottom: 12px;
	color: #4b625a;
	font-size: 15px;
	line-height: 1.9;
}

.topFlowItem-body p:last-child {
	margin-bottom: 0;
}

.topFlowItem-featured .topFlowItem-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 20px;
	align-items: start;
}

.topFlowItem-figure {
	display: block;
	text-decoration: none;
}

.topFlowItem-figure figure {
	margin: 0;
}

.topFlowItem-figure img {
	display: block;
	width: 100%;
	border-radius: 20px;
	box-shadow: 0 16px 28px rgba(16, 61, 51, 0.12);
}

.topFlowItem-figure figcaption {
	margin-top: 10px;
	color: #5f756d;
	font-size: 12px;
	font-weight: 700;
}

.topFlow-summary {
	margin-top: 36px;
}

.topFlow-summaryLeadMobile {
	display: none;
}

@media screen and (max-width: 768px) {
	.topFaq-section {
		padding: 64px 18px;
	}

	.topFaq-lead {
		margin-bottom: 26px;
		font-size: 14px;
		line-height: 1.85;
	}

	.topFaq-leadBreak {
		display: block;
	}

	.topFaq-item {
		padding: 20px 18px 18px;
		border-radius: 20px;
	}

	.topFaq-question {
		padding-left: 50px;
		font-size: 18px;
	}

	.topFaq-question::before {
		width: 34px;
		height: 34px;
		font-size: 16px;
	}

	.topFaq-answer {
		margin-top: 14px;
		padding-top: 14px;
		padding-left: 0;
	}

	.topFaq-answer p {
		font-size: 14px;
		line-height: 1.8;
	}

	.topFlow-section {
		padding: 64px 18px;
	}

	.topFlow-lead {
		margin-bottom: 26px;
		font-size: 14px;
		line-height: 1.85;
	}

	.topFlow-leadBreak {
		display: block;
	}

	.topFlow-summaryLeadDesktop {
		display: none;
	}

	.topFlow-summaryLeadMobile {
		display: block;
	}

	.topFlowItem {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 20px 18px;
		border-radius: 22px;
	}

	.topFlowItem::before {
		border-radius: 20px 20px 0 0;
	}

	.topFlowItem-title {
		font-size: 20px;
		text-align: center;
	}

	.topFlowItem-body p {
		font-size: 14px;
		line-height: 1.8;
	}

	.topFlowItem-featured .topFlowItem-body {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 900px) {
	.topInfoGrid {
		grid-template-columns: 1fr;
	}
	.topInfoGrid-two {
		grid-template-columns: 1fr;
	}
	.topSupplement {
		margin-top: 0.6em;
		text-align: right;
	}

	.topReviews-grid {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 768px) {
	.topInfoSection {
		padding: 64px 18px;
	}

	.topInfoSection-lead {
		margin-bottom: 26px;
		font-size: 14px;
		line-height: 1.85;
	}

	.topInfoSection-leadBreak {
		display: block;
	}

	.topInfoCard {
		padding: 24px 18px 20px;
		border-radius: 22px;
	}

	.topInfoCard-media img {
		height: 160px;
	}

	.topInfoCard .topInfoTitle {
		font-size: 20px;
	}

	.topReviews-section {
		padding: 64px 18px;
	}

	.topReviews-lead {
		margin-bottom: 26px;
		font-size: 14px;
		line-height: 1.85;
	}

	.topReviews-leadBreak {
		display: block;
	}

	.topReviews-card {
		padding: 22px 18px;
		border-radius: 22px;
	}
}
