@charset "utf-8";
/**
 * MEOサービスページ固有スタイル（meo.css）
 *
 * 概要: MEOページ固有のCSS変数上書き + 全セクション固有スタイル
 * 仕様: 共通スタイルは foundation.css / layout.css / components/*.css で定義済み
 *       CSS変数は .service-meo（bodyクラス）スコープで上書き
 * 制限: 共通コンポーネントの微調整のみここで行う（h2装飾等）
 */


/* === CSS変数（body クラススコープ） ===
-----------------------------------------------------------*/
.service-meo {
	--blue-color-primary: #4285F4;
	--blue-color-primary-rgb: 66, 133, 244;
	--blue-color-second: #1A73E8;
	--blue-color-second-rgb: 26, 115, 232;
	--blue-color-third: #455CB9;
	--blue-color-forth: #87B2FF;
	--blue-color-forth-rgb: 135, 178, 255;
	--green-color-primary: #34A853;
	--green-color-primary-rgb: 52, 168, 83;
	--gbp-yellow-color-primary: #FBBC04;
	--gbp-yellow-color-primary-rgb: 251, 188, 4;
	--gbp-red-color-primary: #EA4335;
	--gbp-red-color-primary-rgb: 234, 67, 53;
	--blue-gradients: linear-gradient(to top, var(--blue-color-primary), #457ae5, #4670d6, #4666c8, var(--blue-color-third));
	--gradientsbg-left: linear-gradient(to left, rgba(var(--blue-color-primary-rgb), .2), rgba(var(--blue-color-forth-rgb), .2));
	--gradientsbg-right: linear-gradient(to right, rgba(var(--blue-color-primary-rgb), .2), rgba(var(--blue-color-forth-rgb), .2));

	/* FAQ テーマ上書き（bg-gradientsカラー） */
	--faq-bg-gradient-color: var(--blue-color-primary);
}


/* === MEO共通 ===
-----------------------------------------------------------*/
.meo-sec h2 { line-height: 1.6; margin-bottom: 40px; }
.meo-sec { margin: 40px 0; padding: 64px 0; }

.red { color: var(--gbp-red-color-primary); }
.blue { color: var(--blue-color-primary); }
.blue2 { color: var(--blue-color-third); }
.yellow { color: var(--gbp-yellow-color-primary); }
.green { color: var(--green-color-primary); }
.blue-mark { font-weight: 900; position: relative; padding: 0 .2em .1em;
	background: linear-gradient(transparent 60%, var(--blue-color-primary) 60%); }

.campaign-ban-wrap { margin-top: 40px; max-width: 800px; }
.campaign-ban img { height: auto; border-radius: 4px; }

.meo-button-wrap { margin-top: 40px; text-align: center; }
.meo-button { width: 480px; }
.meo-button-link {
	color: #fff; font-weight: 900;
	background-size: 400% 100%; visibility: visible; opacity: 1;
	transition: background-position var(--base-duration) var(--base-easing),
	            box-shadow var(--base-duration) var(--base-easing);
	border: none; border: 4px solid rgba(255, 255, 255, .6);
	background-image: var(--blue-gradients);
	box-shadow: 0 4px 16px 0 rgba(var(--blue-color-second-rgb), 0.75);
	position: relative; display: inline-block; font-size: 120%;
	padding: 32px 16px; text-shadow: 1px 1px 1px rgba(0, 0, 0, .6);
}
.meo-button-link:active { background-position: 100% 0; box-shadow: 0 6px 24px 0 rgba(var(--blue-color-second-rgb), 0.85); }
.meo-button-text { color: var(--text-color); font-weight: 900; }
.meo-button-text:before { border-color: var(--text-color) transparent transparent transparent; }
.meo-button-text:after { border-color: transparent transparent var(--text-color) transparent; }

@media (hover: hover) and (pointer: fine) {
	.meo-button-link:hover { background-position: 100% 0; box-shadow: 0 6px 24px 0 rgba(var(--blue-color-second-rgb), 0.85); }
}
@media (max-width: 599px) {
	.meo-sec h2 { line-height: 1.4; margin-bottom: 24px; }
	.meo-button { width: 100%; }
}


/* === plan-feature ===
-----------------------------------------------------------*/
.plan-feature-item { text-align: center; position: relative; }
.plan-feature-item-inner {
	width: 100%; aspect-ratio: 1/1; margin: 0 auto; border-radius: 50%;
	box-shadow: rgba(var(--yellow-color-primary-rgb), 0.2) 0px 8px 24px;
	display: flex; align-items: center; justify-content: center;
}
.plan-feature-item img { height: auto; }
.plan-feature-text {
	font-size: 100%; font-weight: 900; position: relative;
	padding-bottom: 4px; line-height: 1.6; display: inline-block; margin-top: 8px;
}
.plan-sec .plan-feature-item-inner { background-color: #fff; }
.plan-sec .plan-feature-text {
	background: radial-gradient(circle farthest-side, var(--gbp-yellow-color-primary), var(--gbp-yellow-color-primary) 50%, #fff 50%, #fff);
	background-repeat: repeat-x; background-position: left 0 bottom 0; background-size: 8px 8px;
}


/* === horizontal-carousel ===
-----------------------------------------------------------*/
.horizontal-carousel .simplebar-track { background: #fff; border-radius: 8px; }
.horizontal-carousel .simplebar-track.simplebar-horizontal { height: 16px; }
.horizontal-carousel .simplebar-track.simplebar-horizontal .simplebar-scrollbar { height: 16px; }
.horizontal-carousel .simplebar-scrollbar:before {
	opacity: 1 !important; transition: opacity 0s linear;
	background-color: var(--yellow-color-primary); border-radius: 8px;
}
.horizontal-carousel {
	scroll-snap-type: x mandatory; white-space: nowrap; overflow-x: auto;
	counter-reset: number 0; -webkit-overflow-scrolling: touch;
}
.horizontal-carousel-item {
	scroll-snap-align: center; margin: 0px 24px 24px 0px; padding: 40px 32px 40px 40px;
	background-color: #fff; display: inline-block; white-space: normal;
	transition: var(--base-duration) var(--base-easing); overflow: hidden; position: relative;
	box-shadow: 0 2px 4px rgb(0 0 0 / 8%); border-radius: 8px;
}
.horizontal-carousel-item:last-child { margin-right: 4%; }
.horizontal-carousel-item:before {
	counter-increment: number 1; content: counter(number) ""; line-height: 0;
	font-family: 'Impact', sans-serif; font-size: 120px;
	position: absolute; top: 48px; left: 0px; z-index: 3;
}
.horizontal-carousel-item:after {
	position: absolute; right: -40px; bottom: -40px; z-index: 1;
	content: ""; border-radius: 40px; width: 80px; height: 80px;
}
.horizontal-carousel-item figure img { width: 100%; position: relative; z-index: 2; }
.horizontal-carousel-item h3, .horizontal-carousel-item h4 { position: relative; z-index: 2; line-height: 1.4; margin: 8px 0 4px; }
.horizontal-carousel-item p { font-size: 95%; color: rgba(var(--text-color-rgb, 0.9)); line-height: 1.6; }

.intro-horizontal-carousel .horizontal-carousel-item p { font-size: 90%; }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(1):after { background-color: var(--blue-color-primary); }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(1):before { color: var(--blue-color-primary); }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(2):after { background-color: #457ae5; }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(2):before { color: #457ae5; }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(3):after { background-color: #4666c8; }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(3):before { color: #4666c8; }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(4):after { background-color: var(--blue-color-third); }
.intro-horizontal-carousel .horizontal-carousel-item:nth-child(4):before { color: var(--blue-color-third); }
.intro-horizontal-carousel .horizontal-carousel-item { width: 36%; }
.intro-horizontal-carousel h4 { font-size: 160%; }
.intro-horizontal-carousel2 h4 { font-size: 140%; }
.intro-image img { height: auto; }

.flow-horizontal-carousel .horizontal-carousel-item:nth-child(1):after { background-color: var(--blue-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(1):before { color: var(--blue-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(2):after { background-color: var(--gbp-red-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(2):before { color: var(--gbp-red-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(3):after { background-color: var(--gbp-yellow-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(3):before { color: var(--gbp-yellow-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(4):after { background-color: var(--blue-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(4):before { color: var(--blue-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(5):after { background-color: var(--green-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(5):before { color: var(--green-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(6):after { background-color: var(--gbp-red-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item:nth-child(6):before { color: var(--gbp-red-color-primary); }
.flow-horizontal-carousel .horizontal-carousel-item { width: 32%; }

@media (max-width: 1280px) {
	.intro-horizontal-carousel .horizontal-carousel-item { width: 48%; }
	.flow-horizontal-carousel .horizontal-carousel-item { width: 40%; }
}
@media (max-width: 991px) {
	.intro-horizontal-carousel .horizontal-carousel-item { width: 56%; }
	.flow-horizontal-carousel .horizontal-carousel-item { width: 48%; }
}
@media (max-width: 767px) {
	.intro-horizontal-carousel .horizontal-carousel-item,
	.flow-horizontal-carousel .horizontal-carousel-item { width: 56%; padding: 24px 20px 24px 24px; }
}
@media (max-width: 599px) {
	.intro-horizontal-carousel .horizontal-carousel-item { width: 88%; }
	.flow-horizontal-carousel .horizontal-carousel-item { width: 80%; }
	.intro-horizontal-carousel h4 { font-size: 140%; }
	.intro-horizontal-carousel2 h4 { font-size: 120%; }
}


/* === mv-sec ===
-----------------------------------------------------------*/
.mv-sec { position: relative; padding: 24px 0 56px; overflow: hidden; }
.mv-sec { background-color: #fff; }
.mv-sec .inner { position: relative; z-index: 2; }
.main-lead { position: relative; display: inline-block; }
.mv-parts { position: absolute; height: auto; }
.mv-parts1 { width: 128px; top: -16px; right: 120px; }
.mv-parts2 { width: 168px; top: 0px; right: -80px; transform: rotate(8deg); }

.top-lead1 { display: inline-block; border-radius: 24px; padding: 4px 16px; background-color: var(--gbp-yellow-color-primary); font-size: 90%; }
.top-lead2 {
	font-size: 520%; line-height: 1.2; margin-top: 16px; font-weight: 800;
	text-shadow: 4px 4px 0px rgba(var(--blue-color-forth-rgb), .4);
	-webkit-text-stroke: 2.4px #444; color: transparent;
	font-family: "ヒラギノ角ゴシック", Hiragino Sans, Meiryo, sans-serif;
}
.top-lead2 .business { display: none; }
.mv-plan-feature { margin-top: 32px; }
.mv-plan-feature .plan-feature-item { width: calc(48% / 3); }
.mv-plan-feature .plan-feature-item:nth-child(2) { margin: 0 2%; }
.mv-plan-feature .plan-feature-item-inner { background-color: rgba(255, 255, 255, .4); border: 2px solid rgba(var(--blue-color-primary-rgb), .1); }
.mv-plan-feature .plan-feature-item-inner { box-shadow: rgba(135, 178, 255, 0.45) 0px 25px 20px -20px; }
.mv-plan-feature .feature-icon { width: 36%; margin: 0 32%; }
.mv-plan-feature .plan-feature-text { font-size: 90%; }

.mv-price-wrap { margin-top: 24px; align-items: center; }
.mv-price { width: 192px; margin-right: 24px; }
.mv-price img { width: 100%; height: auto; }
.topfeature-list { display: inline-block; }
.topfeature-list li { line-height: 1.4; position: relative; font-weight: 900; padding: 4px 0px 0px 24px; margin-bottom: 4px; }
.topfeature-list li:last-child { margin-bottom: 0px; }
.topfeature-list li:after, .topfeature-list li:before { content: ''; position: absolute; }
.topfeature-list li:before {
	top: 50%; transform: translateY(-50%) rotate(64deg); left: 9px;
	width: 12px; height: 12px; background-color: var(--gbp-yellow-color-primary);
}
.topfeature-list li:after {
	top: 50%; transform: translateY(-50%) rotate(45deg); left: 4px;
	width: 8px; height: 8px; border: 2px solid var(--red-color-primary);
}
.topfeature-list li span { display: inline-block; background: linear-gradient(transparent 56%, rgba(255, 255, 255, .8) 56%); }

.mv-sec .sub-lead { margin-top: 24px; font-size: 85%; }
.gbp-image { width: 600px; position: absolute; bottom: 0; right: 0; z-index: -1; aspect-ratio: 1 / 1; }
.gbp-image svg { max-width: 600px; aspect-ratio: 1 / 1; }
.mvbg1 { position: absolute; top: -80px; right: -80px; max-width: 520px; }
.mvbg2 { position: absolute; bottom: -48px; right: -40px; max-width: 1120px; opacity: .4; }

@media (max-width: 1400px) {
	.mvbg1 { max-width: 400px; }
	.gbp-image { width: 560px; }
}
@media (max-width: 1280px) {
	.mv-parts1, .mv-parts2 { display: none; }
	.mv-plan-feature .plan-feature-item { width: calc(60% / 3); }
	.gbp-image { width: 480px; }
}
@media (max-width: 960px) {
	.mv-plan-feature .plan-feature-item { width: calc(72% / 3); }
	.gbp-image { width: 400px; bottom: -12%; }
	.gbp-image svg { opacity: .6; }
}
@media (max-width: 767px) {
	.top-lead2 .business { display: inline-block; }
	.mv-plan-feature .plan-feature-item { width: calc(88% / 3); }
	.mvbg1 { opacity: .2; }
	.gbp-image svg { opacity: .4; }
}
@media (max-width: 599px) {
	.mv-sec { padding: 16px 0 64px; }
	.top-lead1 { padding: 4px 12px; font-size: 80%; letter-spacing: .8px; }
	.top-lead2 { font-size: 440%; }
	.mv-plan-feature { margin-top: 16px; }
	.mv-plan-feature .plan-feature-item { width: calc(96% / 3); }
	.mv-price { width: 100%; margin-right: 0; }
	.mv-price img { width: 160px; }
	.topfeature-list { margin-top: 12px; }
	.topfeature-list li { font-size: 110%; }
	.gbp-image { width: 320px; bottom: 24%; }
	.gbp-image svg { opacity: .24; }
}
@media (max-width: 480px) {
	.top-lead2 { font-size: 400%; text-shadow: 2px 2px 0px rgba(var(--blue-color-forth-rgb), .4); -webkit-text-stroke: 1.6px #444; color: transparent; }
	.mv-plan-feature .plan-feature-text { font-size: 75%; }
	.gbp-image { width: 320px; bottom: 16%; }
	.mvbg2 { bottom: -8px; width: 120%; right: 16px; }
}
@media (max-width: 420px) {
	.top-lead2 { font-size: 320%; }
}


/* === worries-sec ===
-----------------------------------------------------------*/
.worries-sec { background-color: #fff; padding: 0; margin: 0; }
.worries-sec-inner { background-color: var(--gray-color-second); padding-top: 40px; }
.worries-list { padding: 0px 0px 24px; }
.worries-list-item {
	padding: 24px; border-radius: 24px; font-weight: 900; text-align: center;
	animation: vertical-moving 2.4s ease-in-out infinite alternate; position: relative;
	background-color: #fff;
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
	border: 2px solid var(--gray-color-primary); margin-bottom: 4%;
}
.worries-list-item:nth-child(2n) { animation-delay: .8s; }
.worries-list .worries-list-item:nth-child(3n-1) { margin: 0 4% 4%; }
.worries-iteminner:before {
	content: ''; position: absolute; bottom: -20px; left: 50%; transform: translatex(-50%);
	border-width: 20px 14px 0; border-style: solid; border-color: var(--gray-color-primary) transparent transparent;
}
.worries-iteminner:after {
	content: ''; position: absolute; bottom: -12px; left: 50%; transform: translateX(-50%);
	border-width: 12px 10px 0; border-style: solid; border-color: #fff transparent transparent;
}
.guruguru { width: 64px; height: auto; position: absolute; right: 0px; bottom: 0px; z-index: -1; }

@keyframes vertical-moving {
	0% { transform: translateY(0px); }
	100% { transform: translateY(8px); }
}

.triangle-bottom { width: 100%; overflow: hidden; line-height: 0; background-color: var(--gray-color-primary); }
.triangle-bottom svg { position: relative; display: block; width: calc(100% + 1.3px); height: 64px; }
.triangle-bottom .shape-fill { fill: var(--gray-color-second); }

@media (max-width: 991px) {
	.worries-list .worries-list-item { width: 48%; }
	.worries-list .worries-list-item:nth-child(2n-1) { margin: 0 2% 4% 0; }
	.worries-list .worries-list-item:nth-child(2n) { margin: 0 0 4% 2%; }
	.worries-list .worries-list-item:nth-child(9) { margin: auto; }
}
@media (max-width: 599px) {
	.worries-list .worries-list-item { width: 90%; border-radius: 80px; }
	.worries-list .worries-list-item:nth-child(2n-1) { margin: 0 8% 8% 2%; }
	.worries-list .worries-list-item:nth-child(2n) { margin: 0 2% 8% 8%; }
}


/* === about-sec ===
-----------------------------------------------------------*/
.about-sec { padding: 24px 0 120px; margin: 0; background-color: var(--gray-color-primary); position: relative; overflow: hidden; }
.about-sec:before {
	content: 'LIVALEST'; color: rgba(var(--gbp-yellow-color-primary-rgb), .1); font-size: 1600%;
	position: absolute; letter-spacing: -2px; top: 0; left: 50%; transform: translateX(-50%);
	font-family: 'Impact', sans-serif !important; line-height: 1;
}
.about-sec .inner { position: relative; }
.about-sec .sub-lead {
	font-size: 110%; display: inline-block; background-color: var(--gbp-yellow-color-primary);
	padding: 4px 16px; margin-bottom: 8px;
}
.about-sec .solution-heading { line-height: 1.36; margin-top: 4px; }
.strong-item {
	padding: 24px; background-color: #fff; position: relative;
	border-radius: 8px; box-shadow: rgba(135, 178, 255, 0.45) 0px 25px 20px -20px;
}
.strong-icon { text-align: center; }
.strong-icon img { width: 160px; margin: auto; display: block; }
.strong-item h3 { font-size: 120%; line-height: 1.4; text-align: center; margin: 12px 0 8px; }
.strong-item p { font-size: 95%; }

.about-heading { margin-top: 80px; }
.about-heading span {
	display: inline-block; background-color: var(--blue-color-primary);
	width: 64px; height: 64px;
	color: #fff; font-weight: 900; padding-top: 12px; font-size: 160%;
	margin: 0 2px; line-height: 1; letter-spacing: 0; border-radius: 50%;
}
.intro-box { align-items: center; }
.intro-box .meo-image { width: 32%; margin-right: 4% }
.meo-image img { width: 320px; }
.intro-box .meo-text { width: 64%; }
.appeal-text {
	padding: 12px 16px; background-color: #fff; border: 1px solid #ccc; border-radius: 4px;
	font-weight: 900; max-width: 800px; margin: auto; font-size: 110%; text-align: center;
}
.intro-heading { margin: 64px 0 24px; font-size: 200%; line-height: 1.4; }
.bg-waves { position: absolute; bottom: 0; left: 0; width: 100%; overflow: hidden; line-height: 0; transform: rotate(180deg); }
.bg-waves svg { position: relative; display: block; width: calc(100% + 1.3px); height: 40px; }
.bg-waves .shape-fill { fill: var(--gbp-yellow-color-primary); }

@media (max-width: 1280px) {
	.strong-item h3 { font-size: 100%; }
}
@media (max-width: 960px) {
	.about-heading span { padding-top: 16px; font-size: 140%; }
	.about-sec .strong-list .strong-item { width: 76%; margin: 0 12% 8%; }
	.about-sec .strong-list .strong-item:last-child { margin: 0 12%; }
	.strong-item h3 { font-size: 120%; }
}
@media (max-width: 767px) {
	.about-sec .inner2 { margin: 0; }
	.about-sec .solution-heading { font-size: 160%; }
	.intro-box .meo-image { width: 100%; margin-right: 0%; margin-bottom: 16px; }
	.intro-box .meo-text { width: 100%; }
	.intro-heading { font-size: 160%; }
}
@media (max-width: 599px) {
	.about-sec .sub-lead { font-size: 90%; padding: 4px 12px; border-radius: 16px; line-height: 1.4; letter-spacing: .4px; }
	.about-sec:before { font-size: 560%; }
	.about-sec .strong-list .strong-item { width: 100%; margin: 0 0% 8%; }
	.about-sec .strong-list .strong-item:last-child { margin: 0; }
	.about-heading span { padding-top: 12px; font-size: 120%; width: 48px; height: 48px; }
}
@media (max-width: 480px) {
	.about-sec .solution-heading .line1 { font-size: 80%; letter-spacing: .8px; }
	.about-sec .solution-heading .line2, .about-sec .solution-heading .line3 { font-size: 140% !important; }
	.about-heading span { padding-top: 8px; font-size: 100%; width: 36px; height: 36px; }
	.feature-number { top: 24px; }
	.feature-image img { width: 100%; }
}


/* === plan-sec ===
-----------------------------------------------------------*/
.plan-sec {
	margin: 0; padding-top: 40px; position: relative;
	background-image: linear-gradient(var(--gbp-yellow-color-primary) 0% 8%, var(--gray-color-primary) 8% 100%);
}
.planbg { line-height: 0; position: absolute; top: 8%; }
.cheap-label {
	background-color: #fff; border-radius: 40px; margin-bottom: 12px;
	padding: 8px 24px; font-size: 60%; line-height: 1; color: var(--gbp-yellow-color-primary);
}
.plan-sec .plan-feature-item .feature-icon { width: 40%; margin: 0 30%; }
.plan-list { margin-top: 80px; align-items: center; position: relative; }
.plan-item:nth-child(1), .plan-item:nth-child(3) {
	width: 40%; padding: 40px 24px; background-color: rgba(255, 255, 255, .6); border-radius: 16px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.plan-item:nth-child(2) { width: 20%; text-align: center; }
.plan-item:nth-child(2) img { width: 64px; height: 64px; }
.plan-item:nth-child(1) img, .plan-item:nth-child(3) img { width: 64%; margin: 0 18%; height: auto; }
.plan-item:nth-child(1) .price-image { position: relative; }
.plan-item:nth-child(1) .price-image:before {
	content: ""; position: absolute; z-index: 2;
	border-radius: 4px; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-4deg);
	height: 8px; width: 84%; margin: auto; background-color: var(--gbp-red-color-primary);
}

.plan-item h3 { text-align: center; margin-top: 12px; line-height: 1.4; }
.plan-sec .campaign-ban-wrap { margin: 24px auto 0; }
.service-area { margin-top: 80px; }
.service-item {
	margin-bottom: 2%; background-color: #fff; font-weight: 900;
	border-radius: 8px; padding: 16px 0px; text-align: center;
}
.service-item:nth-child(1), .service-item:nth-child(6), .service-item:nth-child(9) { filter: drop-shadow(4px 4px 0px var(--blue-color-second)); border: 2px solid var(--blue-color-second); }
.service-item:nth-child(2), .service-item:nth-child(5), .service-item:nth-child(10) { filter: drop-shadow(4px 4px 0px var(--red-color-primary)); border: 2px solid var(--red-color-primary); }
.service-item:nth-child(3), .service-item:nth-child(8) { filter: drop-shadow(4px 4px 0px var(--gbp-yellow-color-primary)); border: 2px solid var(--gbp-yellow-color-primary); }
.service-item:nth-child(4), .service-item:nth-child(7) { filter: drop-shadow(4px 4px 0px var(--green-color-primary)); border: 2px solid var(--green-color-primary); }

.notcover-area { margin-top: 40px; }
.notcover-area .notcover-heading { margin-bottom: 0px; }
.notcover-heading .nowrap { background-color: #fff; padding: 24px 80px 0; border-top-right-radius: 40%; border-top-left-radius: 40%; }
.notcover-area-box { background-color: #fff; padding: 40px 8% 32px; margin-top: -24px; border-radius: 16px; }
.notcover-line { align-items: center; }
.notcover-image { width: 160px; height: auto; }
.notcover-line p { width: calc(100% - 184px) }
.notcover-line1 p { margin-left: 24px; }
.notcover-line2 { flex-direction: row-reverse; margin: 12px 0; }
.notcover-line2 p { margin-right: 24px; }

.option-area {
	margin-top: 80px; padding: 48px 0;
	background-image: repeating-linear-gradient(90deg, rgb(245, 245, 243) 0px, rgb(245, 245, 243) 1px, transparent 1px, transparent 96px),
	                   repeating-linear-gradient(0deg, rgb(245, 245, 243) 0px, rgb(245, 245, 243) 1px, transparent 1px, transparent 96px),
	                   repeating-linear-gradient(0deg, rgb(245, 245, 243) 0px, rgb(245, 245, 243) 1px, transparent 1px, transparent 12px),
	                   repeating-linear-gradient(90deg, rgb(245, 245, 243) 0px, rgb(245, 245, 243) 1px, transparent 1px, transparent 12px),
	                   linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
	border-radius: 16px;
}
.option-area h2 { background-image: var(--blue-gradients); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.option-item { margin-bottom: 4%; align-items: center; }
.option-item:nth-child(5), .option-item:nth-child(6) { margin-bottom: 0%; }
.option-image { width: 120px; margin-right: 24px; }
.option-image img { height: auto; }
.option-text { width: calc(100% - 144px); }
.option-text h3 { color: var(--blue-color-primary); margin-bottom: 4px; font-size: 120%; line-height: 1.4; }
.option-text p { font-size: 90%; line-height: 1.5; }

.industry-area { margin-top: 64px; }
.industry-area h2 { background-image: var(--blue-gradients); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.industry-list { justify-content: center; }
.industry-area .industry-list .industry-item {
	background-color: rgba(255, 255, 255, .6);
	border-radius: 12px; margin-bottom: 4%; padding: 24px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}
.industry-icon { text-align: center; }
.industry-icon img { width: 64px; height: 64px; }
.industry-item h3 { margin: 8px 0 12px; }
.industry-inner-item { font-size: 90%; }

@media (max-width: 1280px) {
	.plan-sec .plan-feature-item .feature-icon { width: 36%; margin: 0 32%; }
	.option-service > div:nth-child(3n-1) { margin: 0 18% 4%; }
	.option-area .inner2 { margin: 0 12%; }
	.option-area .option-item { width: 100%; margin: 0 0 4% !important; }
	.option-area .option-item:nth-child(2n) { flex-direction: row-reverse; }
	.option-area .option-item:last-child { margin: 0 !important; }
	.option-text { margin-left: auto; }
	.option-area .option-item:nth-child(2n) .option-text { margin-left: inherit; margin-right: auto; }
	.industry-list { justify-content: center; }
	.industry-area .industry-list .industry-item { width: 48%; margin: 0; margin-bottom: 4%; }
	.industry-area .industry-list .industry-item:nth-child(2n-1) { margin-right: 2%; }
	.industry-area .industry-list .industry-item:nth-child(2n) { margin-left: 2%; }
}
@media (max-width: 991px) {
	.plan-sec { background-image: linear-gradient(var(--gbp-yellow-color-primary) 0% 6%, var(--gray-color-primary) 6% 100%); }
	.planbg { top: 6%; }
}
@media (max-width: 767px) {
	.plan-sec .plan-feature .plan-feature-item:nth-child(2) { margin: 0 4%; }
	.plan-sec .plan-feature-wrap { margin: 0; }
	.plan-list { margin-top: 48px; }
	.service-area .inner2 { margin-left: 0; margin-right: 0; }
	.notcover-heading .nowrap { padding: 24px 24px 0; }
	.option-area { padding: 8% 0; }
	.column3 > div:nth-child(3n-1) { margin: 0 0 4%; }
}
@media (max-width: 599px) {
	.plan-sec .plan-feature .plan-feature-item { width: calc(96% / 3); }
	.plan-sec .plan-feature .plan-feature-item:nth-child(2) { margin: 0 2%; }
	.plan-feature-text { font-size: 75%; letter-spacing: 0; line-height: 1.4; }
	.plan-list-wrap { margin: 0 !important; }
	.plan-item:nth-child(1), .plan-item:nth-child(3) { width: 44%; padding: 16px 8px; }
	.plan-item:nth-child(1) img, .plan-item:nth-child(3) img { width: 84%; margin: 0 8%; }
	.plan-item:nth-child(2) { width: 12%; }
	.plan-item:nth-child(2) img { width: 48px; height: 48px; }
	.plan-item h3 { font-size: 90%; }
	.plan-list { margin-top: 40px; }
	.service-item { font-size: 80%; letter-spacing: .8px; }
	.sp-delete { display: none; }
	.notcover-area-box { padding: 40px 4.8% 32px; }
	.notcover-line { display: block; overflow: hidden; }
	.notcover-image { width: 120px; }
	.notcover-line1 .notcover-image { float: left; margin-right: 12px; }
	.notcover-line2 .notcover-image { float: right; margin-left: 8px; }
	.notcover-line p { width: 100%; margin: 0; }
	.industry-area .inner2 { margin: 0; }
	.option-area .inner2 { margin: 0 4.8%; }
	.option-image { width: 80px; margin: 0; }
	.option-text { width: calc(100% - 104px); }
	.industry-icon img { width: 48px; height: 48px; }
	.industry-inner-item { font-size: 75%; }
}


/* === caution-sec / meo-cta-sec ===
-----------------------------------------------------------*/
.caution-sec { margin: 0; margin-top: 80px; padding: 0; }
.caution-sec .inner { max-width: 640px; padding: 40px; background-color: var(--gbp-yellow-color-primary); position: relative; z-index: 2; }
.caution-sec .inner:before, .caution-sec .inner:after {
	content: ''; position: absolute; left: 0; width: 100%; height: 16px;
	animation-name: warning; animation-duration: 4s; animation-timing-function: linear; animation-iteration-count: infinite;
	background-image: repeating-linear-gradient(45deg, var(--gbp-yellow-color-primary) 0px, var(--gbp-yellow-color-primary) 4px, var(--text-color) 0%, var(--text-color) 50%);
	background-size: 16px 16px;
}
.caution-sec .inner:before { top: 0; }
.caution-sec .inner:after { bottom: 0; animation-direction: reverse; }
.caution-sec .inner h2 { line-height: 1.4; margin-bottom: 16px; }
.caution-list { margin: 8px 12px 12px 8px; }
.caution-item { font-weight: bold; align-items: center; margin-bottom: 8px; line-height: 1.4; }
.caution-item:last-child { margin-bottom: 0px; }
.caution-item .mark { background: linear-gradient(transparent 60%, rgba(var(--yellow-color-second-rgb), .6) 60%); }
.caution-item .checkbox-icon { width: 16px; }
.caution-sec .text-area { position: relative; }
.caution-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: -1; line-height: 0; }
.cautin-text { line-height: 1.4; }

@keyframes warning {
	0% { background-position: 0 0; }
	100% { background-position: 40px 0; }
}

.meo-cta-sec { background-color: rgba(var(--gbp-yellow-color-primary-rgb), .2); margin: 0; padding: 48px 0; margin-top: 120px; }
.meo-cta-sec2 { margin-top: 80px; }
.meo-cta-sec .inner { position: relative; }
.meo-cta-sec h2 { line-height: 1.8; }
.meo-cta-wrap { margin: 64px auto 0; }
.meo-cta-sec .meo-cta-wrap .meo-button { margin: auto; }
.cta-illust { position: absolute; z-index: 2; height: auto; }
.cta-illust1 { width: 360px; top: -120px; left: -2%; }
.cta-illust2 { width: 280px; top: -148px; right: -6%; }
.cta-illust3 { width: 320px; bottom: -56px; left: -4%; }
.cta-illust4 { width: 400px; bottom: -64px; right: -10%; }
.cta-illust5 { width: 200px; top: -120px; left: 50%; transform: translateX(-50%); }
.meo-cta-sec .meo-button-wrap { margin-top: 64px; }

@media (max-width: 1500px) {
	.cta-illust1 { width: 360px; top: -120px; left: -2%; }
	.cta-illust2 { width: 280px; top: -148px; right: -2%; }
	.cta-illust3 { width: 320px; bottom: -56px; left: -4%; }
	.cta-illust4 { width: 320px; bottom: -64px; right: -2%; }
}
@media (max-width: 1280px) {
	.caution-sec .inner { padding: 40px 4%; }
	.meo-cta-sec { padding: 80px 0; margin-bottom: 40px; }
	.cta-illust1 { width: 320px; top: -164px; left: -2%; }
	.cta-illust2 { width: 160px; top: -136px; right: 2%; }
	.cta-illust3 { width: 240px; bottom: -88px; left: -4%; }
	.cta-illust4 { width: 240px; bottom: -120px; right: 0%; }
	.cta-illust5 { width: 160px; top: -128px; left: 64%; }
}
@media (max-width: 599px) {
	.meo-cta-sec h2 { font-size: 200%; }
}
@media (max-width: 480px) {
	.caution-sec { margin-top: 56px; }
	.meo-cta-sec h2 { font-size: 160%; }
}


/* === case-sec ===
-----------------------------------------------------------*/
.casesec {
	background-color: #fff; margin: 0; padding: 80px 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='192' height='192' viewBox='0 0 192 192'%3E%3Cpath fill='%23fbbc04' fill-opacity='0.24' d='M192 15v2a11 11 0 0 0-11 11c0 1.94 1.16 4.75 2.53 6.11l2.36 2.36a6.93 6.93 0 0 1 1.22 7.56l-.43.84a8.08 8.08 0 0 1-6.66 4.13H145v35.02a6.1 6.1 0 0 0 3.03 4.87l.84.43c1.58.79 4 .4 5.24-.85l2.36-2.36a12.04 12.04 0 0 1 7.51-3.11 13 13 0 1 1 .02 26 12 12 0 0 1-7.53-3.11l-2.36-2.36a4.93 4.93 0 0 0-5.24-.85l-.84.43a6.1 6.1 0 0 0-3.03 4.87V143h35.02a8.08 8.08 0 0 1 6.66 4.13l.43.84a6.91 6.91 0 0 1-1.22 7.56l-2.36 2.36A10.06 10.06 0 0 0 181 164a11 11 0 0 0 11 11v2a13 13 0 0 1-13-13 12 12 0 0 1 3.11-7.53l2.36-2.36a4.93 4.93 0 0 0 .85-5.24l-.43-.84a6.1 6.1 0 0 0-4.87-3.03H145v35.02a8.08 8.08 0 0 1-4.13 6.66l-.84.43a6.91 6.91 0 0 1-7.56-1.22l-2.36-2.36A10.06 10.06 0 0 0 124 181a11 11 0 0 0-11 11h-2a13 13 0 0 1 13-13c2.47 0 5.79 1.37 7.53 3.11l2.36 2.36a4.94 4.94 0 0 0 5.24.85l.84-.43a6.1 6.1 0 0 0 3.03-4.87V145h-35.02a8.08 8.08 0 0 1-6.66-4.13l-.43-.84a6.91 6.91 0 0 1 1.22-7.56l2.36-2.36A10.06 10.06 0 0 0 107 124a11 11 0 0 0-22 0c0 1.94 1.16 4.75 2.53 6.11l2.36 2.36a6.93 6.93 0 0 1 1.22 7.56l-.43.84a8.08 8.08 0 0 1-6.66 4.13H49v35.02a6.1 6.1 0 0 0 3.03 4.87l.84.43c1.58.79 4 .4 5.24-.85l2.36-2.36a12.04 12.04 0 0 1 7.51-3.11A13 13 0 0 1 81 192h-2a11 11 0 0 0-11-11c-1.94 0-4.75 1.16-6.11 2.53l-2.36 2.36a6.93 6.93 0 0 1-7.56 1.22l-.84-.43a8.08 8.08 0 0 1-4.13-6.66V145H11.98a6.1 6.1 0 0 0-4.87 3.03l-.43.84c-.79 1.58-.4 4 .85 5.24l2.36 2.36a12.04 12.04 0 0 1 3.11 7.51A13 13 0 0 1 0 177v-2a11 11 0 0 0 11-11c0-1.94-1.16-4.75-2.53-6.11l-2.36-2.36a6.93 6.93 0 0 1-1.22-7.56l.43-.84a8.08 8.08 0 0 1 6.66-4.13H47v-35.02a6.1 6.1 0 0 0-3.03-4.87l-.84-.43c-1.59-.8-4-.4-5.24.85l-2.36 2.36A12 12 0 0 1 28 109a13 13 0 1 1 0-26c2.47 0 5.79 1.37 7.53 3.11l2.36 2.36a4.94 4.94 0 0 0 5.24.85l.84-.43A6.1 6.1 0 0 0 47 84.02V49H11.98a8.08 8.08 0 0 1-6.66-4.13l-.43-.84a6.91 6.91 0 0 1 1.22-7.56l2.36-2.36A10.06 10.06 0 0 0 11 28 11 11 0 0 0 0 17v-2a13 13 0 0 1 13 13c0 2.47-1.37 5.79-3.11 7.53l-2.36 2.36a4.94 4.94 0 0 0-.85 5.24l.43.84A6.1 6.1 0 0 0 11.98 47H47V11.98a8.08 8.08 0 0 1 4.13-6.66l.84-.43a6.91 6.91 0 0 1 7.56 1.22l2.36 2.36A10.06 10.06 0 0 0 68 11 11 11 0 0 0 79 0h2a13 13 0 0 1-13 13 12 12 0 0 1-7.53-3.11l-2.36-2.36a4.93 4.93 0 0 0-5.24-.85l-.84.43A6.1 6.1 0 0 0 49 11.98V47h35.02a8.08 8.08 0 0 1 6.66 4.13l.43.84a6.91 6.91 0 0 1-1.22 7.56l-2.36 2.36A10.06 10.06 0 0 0 85 68a11 11 0 0 0 22 0c0-1.94-1.16-4.75-2.53-6.11l-2.36-2.36a6.93 6.93 0 0 1-1.22-7.56l.43-.84a8.08 8.08 0 0 1 6.66-4.13H143V11.98a6.1 6.1 0 0 0-3.03-4.87l-.84-.43c-1.59-.8-4-.4-5.24.85l-2.36 2.36A12 12 0 0 1 124 13a13 13 0 0 1-13-13h2a11 11 0 0 0 11 11c1.94 0 4.75-1.16 6.11-2.53l2.36-2.36a6.93 6.93 0 0 1 7.56-1.22l.84.43a8.08 8.08 0 0 1 4.13 6.66V47h35.02a6.1 6.1 0 0 0 4.87-3.03l.43-.84c.8-1.59.4-4-.85-5.24l-2.36-2.36A12 12 0 0 1 179 28a13 13 0 0 1 13-13zM84.02 143a6.1 6.1 0 0 0 4.87-3.03l.43-.84c.8-1.59.4-4-.85-5.24l-2.36-2.36A12 12 0 0 1 83 124a13 13 0 1 1 26 0c0 2.47-1.37 5.79-3.11 7.53l-2.36 2.36a4.94 4.94 0 0 0-.85 5.24l.43.84a6.1 6.1 0 0 0 4.87 3.03H143v-35.02a8.08 8.08 0 0 1 4.13-6.66l.84-.43a6.91 6.91 0 0 1 7.56 1.22l2.36 2.36A10.06 10.06 0 0 0 164 107a11 11 0 0 0 0-22c-1.94 0-4.75 1.16-6.11 2.53l-2.36 2.36a6.93 6.93 0 0 1-7.56 1.22l-.84-.43a8.08 8.08 0 0 1-4.13-6.66V49h-35.02a6.1 6.1 0 0 0-4.87 3.03l-.43.84c-.79 1.58-.4 4 .85 5.24l2.36 2.36a12.04 12.04 0 0 1 3.11 7.51A13 13 0 1 1 83 68a12 12 0 0 1 3.11-7.53l2.36-2.36a4.93 4.93 0 0 0 .85-5.24l-.43-.84A6.1 6.1 0 0 0 84.02 49H49v35.02a8.08 8.08 0 0 1-4.13 6.66l-.84.43a6.91 6.91 0 0 1-7.56-1.22l-2.36-2.36A10.06 10.06 0 0 0 28 85a11 11 0 0 0 0 22c1.94 0 4.75-1.16 6.11-2.53l2.36-2.36a6.93 6.93 0 0 1 7.56-1.22l.84.43a8.08 8.08 0 0 1 4.13 6.66V143h35.02z'%3E%3C/path%3E%3C/svg%3E");
}
.intro-case {
	text-align: center; background-color: rgba(255, 255, 255, .64);
	box-shadow: rgba(0, 0, 0, 0.04) 0px 4px 6px; padding: 24px 0;
	border-radius: 8px; position: relative;
}
.case-industry span { display: inline-block; }
.c-industry-multiply { margin: 0 4px; }
.c-industry-industry { background-color: var(--blue-color-primary); padding: 2px 8px; line-height: 1; color: #fff; }
.c-industry-wrap {
	position: relative; text-align: center; width: 80px; height: 80px;
	background: #fff; border: 2px solid var(--blue-color-primary);
	border-radius: 40% 60% 0% 100% / 40% 100% 0% 60%; margin: 8px auto 0;
	box-sizing: content-box; transform: rotate(45deg);
}
.c-industry-icon { width: 96%; height: auto; transform: rotate(-45deg); }
.bar-chart {
	position: relative; display: flex; align-items: flex-end; height: 200px;
	justify-content: center; border-bottom: 2px solid var(--blue-color-forth);
}
.bar { width: 56px; margin: 0 12px; border-radius: 8px 8px 0 0; position: relative; }
.bar-a { height: calc(var(--value-a) / 100 * 240px); background-color: var(--blue-color-forth); }
.bar-b { height: calc(var(--value-b) / 100 * 240px); background-color: var(--blue-color-primary) }
.bar span {
	color: #fff; font-weight: 900; position: absolute; bottom: 0;
	left: 50%; transform: translateX(-50%); letter-spacing: .4px;
}
.perfomance-title { font-weight: 900; margin-top: 8px; font-size: 90%; }
.value-result {
	position: absolute; top: 40px; left: 50%; line-height: 1;
	transform: translateX(-50%) rotate(-8deg); font-size: 200%; letter-spacing: 0;
}
.upper-arrow { position: absolute; width: 80px; height: auto; bottom: 76px; left: 50%; transform: translateX(-50%) rotate(8deg); }

.intro-background { margin-top: 80px; }
.intro-point { counter-reset: number 0; }
.intro-point li {
	position: relative; background: #fff; padding: 12px; border-radius: 4px;
	margin-top: 48px; font-weight: 900;
}
.intro-point li:before {
	counter-increment: number 1; content: counter(number) ""; text-align: center;
	letter-spacing: 0px; line-height: 1;
	font-family: 'Impact', sans-serif; font-size: 28px;
	position: absolute; top: -24px; right: 0;
}
.intro-point li:after {
	content: ""; position: absolute;
	top: 100%; left: 48px; height: 24px;
	transform: skew(25deg); width: 16px; background-color: #fff;
}
.intro-point li:nth-child(1), .intro-point li:nth-child(6), .intro-point li:nth-child(9) { border: 4px solid var(--blue-color-second); }
.intro-point li:nth-child(2), .intro-point li:nth-child(5), .intro-point li:nth-child(10) { border: 4px solid var(--red-color-primary); }
.intro-point li:nth-child(3), .intro-point li:nth-child(8) { border: 4px solid var(--gbp-yellow-color-primary); }
.intro-point li:nth-child(4), .intro-point li:nth-child(7) { border: 4px solid var(--green-color-primary); }
.intro-point li:nth-child(1):before, .intro-point li:nth-child(6):before, .intro-point li:nth-child(9):before { color: var(--blue-color-second); }
.intro-point li:nth-child(2):before, .intro-point li:nth-child(5):before, .intro-point li:nth-child(10):before { color: var(--red-color-primary); }
.intro-point li:nth-child(3):before, .intro-point li:nth-child(8):before { color: var(--gbp-yellow-color-primary); }
.intro-point li:nth-child(4):before, .intro-point li:nth-child(7):before { color: var(--green-color-primary); }
.intro-point li:nth-child(1):after, .intro-point li:nth-child(6):after, .intro-point li:nth-child(9):after { border-left: 4px solid var(--blue-color-second); }
.intro-point li:nth-child(2):after, .intro-point li:nth-child(5):after, .intro-point li:nth-child(10):after { border-left: 4px solid var(--red-color-primary); }
.intro-point li:nth-child(3):after, .intro-point li:nth-child(8):after { border-left: 4px solid var(--gbp-yellow-color-primary); }
.intro-point li:nth-child(4):after, .intro-point li:nth-child(7):after { border-left: 4px solid var(--green-color-primary); }

@media (max-width: 767px) {
	.case-wrap .intro-case { width: 48%; margin-right: 0; }
	.case-wrap .intro-case:nth-child(2n-1) { margin-right: 2%; }
	.case-wrap .intro-case:nth-child(2n) { margin-left: 2%; }
	.case-wrap .intro-case1, .case-wrap .intro-case2 { margin-bottom: 4%; }
	.casesec .inner2 { margin: 0; }
}


/* === voice-sec（MEO固有部分のみ） ===
-----------------------------------------------------------*/
@media (hover: hover) and (pointer: fine) {
	.interview-cover a:hover img { transform: scale(1.08); opacity: 0.9; }
	.interview-cover a:hover .interview-btn:before { transform-origin: left top; transform: scale(1, 1); border-radius: 40px; }
}

.other-support-area { margin-top: 80px; }
.other-support-area-inner { justify-content: space-between; }
.title-area { width: calc(92% / 3); text-align: center; }
.title-area h2 {
	-ms-writing-mode: tb-rl; writing-mode: vertical-rl; display: inline-block; margin-bottom: 0;
	position: sticky; top: 96px; font-size: 160%;
	background-color: rgba(255, 255, 255, .8); padding: 12px 4px; text-align: justify;
}
.case-area {
	width: calc(92% / 3 * 2 + 4%); background-color: #fff; padding: 40px;
	border-radius: 8px; box-shadow: 0 2px 4px rgb(0 0 0 / 8%);
}
.other-support { padding: 24px 0px; }
.other-support figure { text-align: center; }
.other-support img { width: 160px; height: auto; }
.other-support h3 { text-align: center; margin-top: 4px; }

@media (max-width: 1280px) {
	.flow-shape { width: 640px; left: -12%; }
}
@media (max-width: 991px) {
	.case-area-inner .other-support { width: 100%; margin: 0 4% !important; }
	.case-area-inner .other-support:not(:nth-child(-n+1)) { margin-top: 4%; }
}
@media (max-width: 767px) {
	.flow-shape { width: 480px; bottom: -200px; }
}
@media (max-width: 599px) {
	.flow-sec .breakout-right { margin-right: calc(50% - 48vw); }
	.other-support-area { margin-top: 6.4%; }
	.title-area { width: 80px; text-align: left; }
	.title-area h2 { top: 64px; font-size: 132%; padding: 12px 4px; }
	.case-area { width: calc(100% - 80px); padding: 6.4% 4%; }
	.other-support img { width: 240px; }
	.flow-shape { width: 320px; bottom: -120px; }
}


/* === flow-sec ===
-----------------------------------------------------------*/
.flow-sec { padding: 80px 0; position: relative; }
.basis-area {
	margin-top: 80px; padding: 40px;
	background: rgba(255, 255, 255, .8); border-radius: 16px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.basis-area h2 { margin-bottom: 24px; }
.basis-area h3 { line-height: 1.4; margin-bottom: 12px; }
.basis-area p { font-size: 90%; }
.basis-image img { height: auto; }
.basis-image1 img { width: 80%; }
.basis-inner-area2 { align-items: center; }
.chart1-wrap { margin-left: 4%; }
.chart-text1 { width: calc(100% - 4% - 240px); }
.chart { width: 240px; height: 240px; border-radius: 50%; position: relative; margin: auto; }
.chart1 {
	display: flex; align-items: center; justify-content: center;
	background-image: conic-gradient(var(--blue-color-primary) 0deg 230.4deg, var(--gray-color-second) 230.4deg 360deg);
}
.chart1:before { content: ""; position: absolute; width: 120px; height: 120px; border-radius: 50%; background-color: #FFF; }
.number {
	font-size: 36px; z-index: 2; position: absolute;
	font-family: "Helvetica Neue", Arial; letter-spacing: -.4px; font-weight: 900;
}

.summarize {
	font-size: 100%; border-radius: 8px; padding: 8px 16px; margin-top: 16px;
	background-color: rgba(var(--gray-color-second-rgb), .5);
	backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.basis-inner-area2, .basis-inner-area3 { margin-top: 56px; }
.basis-inner-area2 { margin-top: 48px; flex-direction: row-reverse; align-items: center; }
.basis-inner-area3 ul li { font-size: 90%; font-weight: 900; }

@media (max-width: 991px) {
	.chart1-wrap { width: 100%; margin-right: 0%; }
	.chart { margin: 0 auto 12px; }
	.chart-text { margin-top: 16px; }
	.chart-text1 { width: 100%; }
	.chart2-wrap { width: 100%; margin-left: 0%; }
	.chart-text2 { width: 100%; }
}
@media (max-width: 599px) {
	.basis-area { padding: 24px; }
	.basis-image1 img { width: 100%; }
	.flow-sec .left-inner-margin { margin-left: 0; }
}


/* === comparison-blog-sec ===
-----------------------------------------------------------*/
.comparison-blog-sec { padding: 80px 0; margin-top: 120px; position: relative; }
.comparison-blog-sec:before {
	font-family: 'Impact', sans-serif !important;
	-ms-writing-mode: tb-rl; writing-mode: vertical-rl; line-height: .4;
	color: rgba(255, 255, 255, .6);
	content: attr(data-deco); position: absolute; left: 0; top: -8px; font-size: 1600%;
}
.comptable-area { position: relative; z-index: 2; width: 100%; margin: 0 auto; }

.comparison-blog-sec h2 { position: relative; z-index: 3; }
.comptable-livalest {
	position: absolute; bottom: 0px; left: 180px; width: 320px;
	border-radius: 8px; box-shadow: 8px 8px 24px rgb(0 0 0 / 16%);
}
.comptable-livalest-title {
	display: flex; align-items: center; justify-content: center; color: #fff;
	height: 82px; text-align: center; font-weight: 900;
	background-color: var(--blue-color-third); border-radius: 8px 8px 0 0;
}
.line-through { text-decoration: line-through; }
.comptable-livalest p {
	text-align: center; font-weight: 900; height: 56px; line-height: 56px;
	background-color: #fff; border-bottom: 1px solid var(--gray-color-second);
}
.comptable-livalest p.last { height: 64px; line-height: 64px; }

.comptable { border-collapse: collapse; width: 1008px; }
.comptable th {
	height: 64px; text-align: center; vertical-align: middle;
	background-color: var(--gray-color-primary);
	border-top: 1px solid var(--gray-color-second);
	border-right: 1px solid var(--gray-color-second);
}
.comptable th.top-left-th { opacity: 0; border-top: 0; }
.comptable td {
	width: 280px; height: 56px; text-align: center; vertical-align: middle;
	background-color: #fff; z-index: -1; position: relative;
	border-right: 1px solid var(--gray-color-second);
	border-bottom: 1px solid var(--gray-color-second);
}
.comptable td:first-child {
	padding-left: 16px; text-align: left; width: 240px;
	background-color: var(--gbp-yellow-color-primary); border-right: none;
}
.comptable td:nth-child(2) { width: 280px; border: none; }
.comptable-area .graybg { background-color: var(--gray-color-primary); }
.comptable-area .circle {
	position: absolute; top: 50%; left: 50%;
	transform: translate(-50%, -50%); width: 20px; height: 20px;
	border-radius: 50%; border: 4px solid var(--blue-color-primary);
}
.comptable-area .cross { width: 20px; height: 20px; display: inline-block; position: relative; top: 4px; }
.comptable-area .cross:before, .comptable-area .cross:after {
	content: ""; top: 50%; left: 50%; display: block;
	width: 100%; height: 4px; border-radius: 4px; background: var(--gbp-red-color-primary);
	position: absolute; transform: translate(-50%, -50%) rotate(45deg);
}
.comptable-area .cross:after { transform: translate(-50%, -50%) rotate(-45deg); }

.comparison-blog-sec .campaign-ban-wrap { position: relative; z-index: 2; }
.blog-area { margin-top: 80px; position: relative; z-index: 2; }
.blog-area h2 { margin-bottom: 16px; }
.blog-list { margin-top: 40px; position: relative; }
.blog-list-item {
	width: calc(92% / 3); background-color: #fff;
	box-shadow: rgb(149 157 165 / 20%) 0px 8px 24px;
	transition: transform var(--base-duration) var(--base-easing);
}
.blog-list-item:not(:nth-child(-n+3)) { margin-top: 4%; }
.blog-list-item:nth-child(3n-1) { margin-right: 4%; margin-left: 4%; }
.blog-image-head { overflow: hidden; }
.blog-first-image { width: 100%; height: auto; transition: transform var(--base-duration) var(--base-easing); }
.blog-item-body { padding: 16px 24px; }
.modified_date { color: #ccc; font-size: 90%; }
.blog-title { color: var(--text-color); font-weight: 900; line-height: 1.4; font-size: 100%; }
.blog-cat-label { color: var(--yellow-color-primary); font-size: 90%; text-align: right; margin-top: 12px; }
.blog-list-item:active { transform: translateY(-8px); }
.blog-link:active .interview-image { transform: rotate(-4deg) scale(1.1); }

@media (hover: hover) and (pointer: fine) {
	.blog-list-item:hover { transform: translateY(-8px); }
	.blog-link:hover .blog-first-image { transform: rotate(-4deg) scale(1.1); }
}

@media (max-width: 1280px) {
	.comptable-area { overflow-x: scroll; padding: 40px 0 16px; }
	.comptable-area .simplebar-track { background: #fff; border-radius: 8px; }
	.comptable-area .simplebar-track.simplebar-horizontal { height: 16px; bottom: -24px; }
	.comptable-area .simplebar-track.simplebar-horizontal .simplebar-scrollbar { height: 16px; }
	.comptable-area .simplebar-scrollbar:before { opacity: 1 !important; transition: opacity 0s linear; background-color: var(--yellow-color-primary); border-radius: 8px; }
	.comptable-livalest { bottom: 16px; }
}
@media (max-width: 991px) {
	.blog-list-item { width: calc(96% / 2); }
	.blog-list-item:not(:nth-child(-n+2)) { margin-top: 4%; }
	.blog-list-item:nth-child(3n-1) { margin-right: 0%; margin-left: 0%; }
	.blog-list-item:nth-child(2n-1) { margin-right: 2%; }
	.blog-list-item:nth-child(2n) { margin-left: 2%; }
}
@media (max-width: 599px) {
	.blog-list-item:not(:nth-child(-n+1)) { margin-top: 6.4%; }
	.blog-list-item { width: 100%; }
	.blog-list-item:nth-child(2n-1) { margin-right: 0%; }
	.blog-list-item:nth-child(2n) { margin-left: 0%; }
}


/* === question-sec（h2装飾のみ — MEO固有） ===
-----------------------------------------------------------*/
.question-sec h2 { display: flex; justify-content: center; align-items: center; }
.question-sec h2::before, .question-sec h2::after { content: ""; width: 8px; height: 8px; }
.question-sec h2::before { margin: -32px 16px 0 0; border-top: 8px solid var(--blue-color-primary); border-left: 8px solid var(--blue-color-second); }
.question-sec h2::after { margin: 0 0 -32px 16px; border-right: 8px solid var(--blue-color-second); border-bottom: 8px solid var(--blue-color-primary); }

@media (max-width: 960px) {
	.question-sec h2:before { top: -40%; }
}
@media (max-width: 599px) {
	.question-sec h2:before { top: -80%; }
}


/* === floating-banner ===
-----------------------------------------------------------*/
#floating-banner { position: fixed; bottom: 16px; right: 16px; display: none; z-index: 1000; }
#floating-banner img { width: 480px; height: auto; transition: .4s; }
#floating-banner:hover img { animation: swingVertical 1s ease; animation-iteration-count: 1; }
#delete-button { cursor: pointer; position: absolute; left: -32px; top: -32px; z-index: 30; transition: .4s; }
#delete-button:hover { transform: rotate(480deg); }

@keyframes swingVertical {
	15% { transform: translateY(6px) }
	30% { transform: translateY(-6px) }
	50% { transform: translateY(4px) }
	65% { transform: translateY(-2px) }
	80% { transform: translateY(2px) }
	100% { transform: translateY(0) }
}

.delete-icon-inner { fill: #fff; stroke: currentColor; stroke-miterlimit: 10; }

@media (max-width: 600px) {
	#floating-banner { width: 98%; margin: 0 1%; right: inherit; bottom: .6%; }
	#floating-banner img { width: 100%; }
	#delete-button { left: -1%; top: -24px; }
	#delete-button svg { width: 40px; height: 40px; }
}
