@charset "UTF-8";
/*
Author: あそびラボ
yoriaiSEO 紹介ページ専用CSS
配色 accent #E66342 / green #EFF8F1 / yellow #F8E633 / text #222
画像 /images/yoriai-seo/pc/ ・ /images/yoriai-seo/sp/
*/

/*=======================================================
ページ共通
=======================================================*/
/* 和文の字送り。ブラウザ既定の0だと文字が詰まって見えるため全体に少し空ける。
   このページ専用CSSなので、article＝このテンプレートの範囲だけに効く。
   詰まり／空きすぎを感じたらこの1箇所の数値を変えれば全体に反映される */
article {
	letter-spacing: 0.06em;
}

/* ページ下部の共通パーツ（サービス一覧・CTA）の上余白。
   共通CSSではなくページ別CSS側で定義する作りなので、他ページと同じ値をここでも指定する */
.bl_service_postLink {
	padding-top: 50px;
}

/*=======================================================
MV（このページは共通の下層MV帯を使わない）
=======================================================*/
.bl_lower_mv {
	display: none;
}
.bl_breadcrumbs {
	padding-top: 0;
	position: relative;
	z-index: 2;
	margin-bottom: -30px;
}
.bl_breadcrumbs_inner > li {
	color: #5a4a2a;
}

.bl_mv {
	background: url(../images/yoriai-seo/pc/mv-img-bg.webp) top center/100% auto no-repeat;
	background-color: #F6DD81;
	text-align: center;
	margin-top: -13px;
	padding-bottom: 76px;
}
.bl_mv .bl_ctaBtnWrapper {
	margin-top: 12px;
}
/* イラスト部分（画像の上から54.1%）と同じ高さを確保する */
.bl_mv_art {
	aspect-ratio: 4000 / 2031;
}
.bl_mv_ttl {
	padding-top: 6.4%;
	font-size: 46px;
	font-weight: bold;
	line-height: 1.5;
	letter-spacing: 0.06em;
	color: #3c3226;
	text-shadow: 0 2px 0 rgba(255, 255, 255, 0.45);
}
.bl_mv_lead {
	padding-top: 30px;
	font-size: 17px;
	line-height: 2;
	font-weight: bold;
	color: #4a3c22;
}

/* 実績バッジ */
.bl_badgeUnit {
	display: flex;
	justify-content: center;
	/* 素材の葉が円の外まで伸びているぶん、隙間なしで中心間隔がデザインの243pxになる */
	gap: 0;
	margin-top: 34px;
	margin-bottom: 34px;
}
.bl_badge {
	width: 244px;
	height: 244px;
	background: url(../images/yoriai-seo/pc/circle01-img.webp) center/contain no-repeat;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	/* 素材の白い円がボックス中央からずれている（横+8.4px／縦-13.6px）ので、
	   その分をpaddingで打ち消して文字を円の中心に合わせる */
	padding: 0 4px 27px 21px;
	position: relative;
}
.bl_badge_lbl {
	font-size: 16px;
	line-height: 1.5;
	color: #555;
}
.bl_badge_num {
	margin-top: 4px;
	font-size: 32px;
	font-weight: bold;
	color: #E66342;
	line-height: 1.2;
}
.bl_badge_unit {
	font-size: 15px;
}
.bl_badge_att {
	position: absolute;
	bottom: -28px;
	left: 0;
	width: 100%;
	font-size: 14px;
	color: #7a6a4a;
}

/*=======================================================
共通パーツ
=======================================================*/
.el_secEn {
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 0.14em;
	color: #E66342;
	text-align: center;
	margin-bottom: 8px;
}
.el_secTtl {
	font-size: 32px;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	letter-spacing: 0.08em;
	color: #222;
}
.el_secTtl__light {
	color: #fff;
}
.el_secLead {
	margin-top: 16px;
	font-size: 17px;
	line-height: 1.9;
	text-align: center;
	color: #555;
}
.el_secLead__light {
	color: #d6d9ee;
}
.el_marker {
	background: linear-gradient(transparent 62%, #F8E633 62%);
	padding: 0 4px;
}
.txt_accent {
	color: #E66342;
}
.txt_bold {
	font-weight: bold;
}
.el_pill {
	display: inline-block;
	margin-top: 16px;
	padding: 8px 20px;
	border: 2px solid #E66342;
	border-radius: 999px;
	background: #fff;
	color: #cf4d2d;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.4;
}

/* CTAボタン（背景に合わせて色を変える） */
.bl_ctaBtnWrapper {
	text-align: center;
}
.el_ctaBtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 280px;
	padding: 17px 48px;
	background: #E66342;
	border-radius: 999px;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 0.08em;
	box-shadow: 0 5px 0 #cf4d2d;
	transition: transform 0.15s, box-shadow 0.15s;
}
.el_ctaBtn:hover {
	transform: translateY(3px);
	box-shadow: 0 2px 0 #cf4d2d;
}
.el_ctaBtn__navy {
	background: #2C56A8;
	box-shadow: 0 5px 0 #1e3d7c;
}
.el_ctaBtn__navy:hover {
	box-shadow: 0 2px 0 #1e3d7c;
}
.el_ctaBtn__green {
	background: #1F9E92;
	box-shadow: 0 5px 0 #157a71;
}
.el_ctaBtn__green:hover {
	box-shadow: 0 2px 0 #157a71;
}

/*=======================================================
こんなお悩みを抱えていませんか？
=======================================================*/
.bl_worry {
	background: url(../images/yoriai-seo/pc/problem-down-bg.webp) top center/100% auto no-repeat;
	background-color: #1C1D77;
	padding: 0 0 90px;
	position: relative;
	margin-top: -1px;
}
/* 砂の稜線（MVの黄色から紺へ切り替わる帯）
   road-img は上が透過・下端が左で深く右で浅い。
   その最上端と最下端がほぼ同じ34%なので、背景を34%で黄色／紺に分けると継ぎ目が出ない。 */
.bl_worry_deco {
	aspect-ratio: 4000 / 1092;
	background: url(../images/yoriai-seo/pc/worry-deco.webp) top center/100% 100% no-repeat;
	margin-bottom: -1px;
}

.bl_worry_head {
	padding-top: 70px;
	margin-bottom: 46px;
}
.bl_worry_list {
	display: flex;
	flex-wrap: wrap;
	gap: 24px 22px;
}
.bl_worry_item {
	width: calc((100% - 44px) / 3);
	background: #EDEFF6;
	border-radius: 12px;
	padding: 26px 24px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}
.bl_worry_ttl {
	font-size: 22px;
	font-weight: bold;
	line-height: 1.5;
	color: #1F213A;
	margin-bottom: 12px;
}
.bl_worry_txt {
	font-size: 17px;
	line-height: 1.8;
	color: #4a4f66;
}

/*=======================================================
プロ級のSEO対策をかんたんに実現するAIツール
=======================================================*/
.bl_solution {
	background: url(../images/yoriai-seo/pc/resolve-img-bg.webp) top center/cover no-repeat;
	background-color: #29247A;
	padding: 0;
	position: relative;
}
/* 上部の樹林帯（スクロールで左右に開く） */
.bl_solution_tree {
	position: relative;
	isolation: isolate;
	width: 100%;
	aspect-ratio: 1000 / 163;
	margin-bottom: 200px;
	overflow: hidden;
	z-index: 2;
	/* 上はお悩みの紺、下は夜空の色。木が開いても段差が出ない */
	background: linear-gradient(#1C1D77 0%, #1F2179 46%, #29247A 100%);
}
.bl_solution_tree::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 42%;
	background: linear-gradient(rgba(41, 36, 122, 0), #29247A 88%);
	z-index: 2;
}
.bl_solution_tree_side {
	position: absolute;
	top: 0;
	width: 51%;
	height: 100%;
	will-change: transform;
}
.bl_solution_tree_side__l {
	left: 0;
	background: url(../images/yoriai-seo/pc/tree-img-left.webp) top left/100% 100% no-repeat;
}
.bl_solution_tree_side__r {
	right: 0;
	background: url(../images/yoriai-seo/pc/tree-img-right.webp) top right/100% 100% no-repeat;
}
.bl_solution_body {
	display: flex;
	align-items: center;
	gap: 40px;
	margin-top: 40px;
}
.bl_solution_imgWrapper {
	width: 480px;
	flex: none;
}
.bl_solution_imgWrapper img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}
.bl_solution_txtArea {
	flex: 1;
}
.bl_solution_txt {
	font-size: 17px;
	line-height: 1.9;
	color: #eceafa;
}
.bl_solution_txt + .bl_solution_txt {
	margin-top: 14px;
}
.bl_tagList {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 20px;
}
.bl_tag {
	background: #E66342;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	padding: 6px 16px;
	border-radius: 4px;
}
/* 下端の草むら（眠る犬）＋左右の雲 */
.bl_solution_grass {
	position: relative;
	z-index: 5;
	margin-top: 60px;
	background: url(../images/yoriai-seo/pc/resolve-img.webp) bottom center/100% auto no-repeat;
	aspect-ratio: 4000 / 844;
	position: relative;
}
/* 開く雲（夜空の下端・道の下端で共用） */
.bl_cloudCurtain {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	aspect-ratio: 1000 / 260;
	transform: translateY(73%);
	pointer-events: none;
	overflow: hidden;
	z-index: 5;
}
.bl_cloudCurtain_side {
	position: absolute;
	bottom: 0;
	width: 56%;
	height: 100%;
	will-change: transform;
}
.bl_cloudCurtain_side__l {
	left: 0;
	background: url(../images/yoriai-seo/pc/cloud-img-left.webp) bottom left/100% 100% no-repeat;
}
.bl_cloudCurtain_side__r {
	right: 0;
	background: url(../images/yoriai-seo/pc/cloud-img-right.webp) bottom right/100% 100% no-repeat;
}

/*=======================================================
FEATURE 01〜06
=======================================================*/
.bl_feature {
	background: url(../images/yoriai-seo/pc/parallax-img-bg.webp) top center/cover no-repeat;
	background-color: #9FC4EF;
	padding: 0 0 84px;
	position: relative;
	overflow: hidden;
}
.bl_feature .ly_cont_inner {
	padding-top: 14%;
	z-index: 1;
}
.bl_feature .el_secLead {
	color: #40506b;
}
.bl_feature_list {
	margin-top: 44px;
}
.bl_feature_item {
	display: flex;
	align-items: center;
	gap: 36px;
	background: #fff;
	border-radius: 14px;
	padding: 28px;
	box-shadow: 0 6px 20px rgba(40, 60, 100, 0.08);
}
.bl_feature_item + .bl_feature_item {
	margin-top: 28px;
}
.bl_feature_imgWrapper {
	width: 448px;
	flex: none;
}
.bl_feature_imgWrapper img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}
.bl_feature_body {
	flex: 1;
}
.bl_feature_no {
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 0.12em;
	color: #E66342;
}
.bl_feature_ttl {
	margin: 4px 0 14px;
	font-size: 26px;
	font-weight: bold;
	line-height: 1.4;
}
.bl_feature_txt {
	font-size: 17px;
	line-height: 1.9;
	color: #444;
}
.bl_feature_txt + .bl_feature_txt {
	margin-top: 10px;
}
.bl_feature .bl_ctaBtnWrapper {
	margin-top: 60px;
}

/*=======================================================
メリット ／ 導入までの流れ（道の背景）
=======================================================*/
.bl_road {
	background: url(../images/yoriai-seo/pc/road-img-bg.webp) top center/100% auto no-repeat;
	background-color: #DCCDB2;
	padding: 0;
	position: relative;
}
/* 道の上端に空の色を継ぐ（road-img-bg の上7%が透過しているため） */
.bl_road::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1000 / 80;
	background: linear-gradient(#B7D3F4 0, #CFDDEB 56%, #DCCDB2 100%);
	z-index: -1;
}
/* 道の起点でごはんを食べる犬 */
.bl_road_dog {
	width: 250px;
	margin: -1.5% auto 0;
	aspect-ratio: 956 / 600;
	background: url(../images/yoriai-seo/pc/dog-eat-img.webp) center center/contain no-repeat;
}
.bl_merit {
	padding-top: 40px;
}
.bl_merit_list {
	display: flex;
	gap: 26px;
	margin-top: 34px;
}
.bl_merit_item {
	width: calc((100% - 26px) / 2);
	background: #fff;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(60, 50, 30, 0.14);
}
.bl_merit_imgWrapper img {
	width: 100%;
	height: auto;
}
.bl_merit_body {
	padding: 22px 26px 26px;
	text-align: center;
}
.bl_merit_ttl {
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 10px;
}
.bl_merit_txt {
	font-size: 17px;
	line-height: 1.8;
	color: #555;
	text-align: left;
}

.bl_flow {
	margin-top: 74px;
}
.bl_flow_list {
	max-width: 840px;
	margin: 30px auto 0;
	background: #fff;
	border-radius: 14px;
	padding: 10px 40px;
	box-shadow: 0 6px 20px rgba(60, 50, 30, 0.14);
}
.bl_flow_item {
	display: flex;
	gap: 26px;
	padding: 22px 0;
	border-bottom: 1px dashed #ddd6c6;
}
.bl_flow_item:last-child {
	border-bottom: none;
}
.bl_flow_no {
	flex: none;
	width: 54px;
	text-align: center;
}
.bl_flow_no_en {
	display: block;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 0.1em;
	color: #E66342;
}
.bl_flow_no_num {
	display: block;
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
	color: #E66342;
}
.bl_flow_ttl {
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 5px;
}
.bl_flow_txt {
	font-size: 17px;
	line-height: 1.8;
	color: #555;
}
.bl_flow .bl_ctaBtnWrapper {
	margin-top: 52px;
}
/* 下端の草むら（走る犬）と雲 */
.bl_road_grass {
	position: relative;
	z-index: 5;
	margin-top: 40px;
	background: url(../images/yoriai-seo/pc/merit-img.webp) bottom center/100% auto no-repeat;
	aspect-ratio: 4000 / 884;
	position: relative;
}
/*=======================================================
料金プラン
=======================================================*/
.bl_sunset {
	background: url(../images/yoriai-seo/pc/plan-img-bg.webp) top center/100% auto no-repeat;
	background-color: #EEDBAF;
	position: relative;
}
.bl_price {
	padding: 14% 0 80px;
	position: relative;
}
.bl_sunset::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1000 / 120;
	background: linear-gradient(#fff, rgba(255, 255, 255, 0));
	pointer-events: none;
}
.bl_price_plan {
	max-width: 780px;
	margin: 40px auto 0;
	background: #fff;
	border-radius: 14px;
	padding: 0 0 34px;
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(80, 60, 40, 0.14);
}
.bl_price_planHead {
	background: #E66342;
	color: #fff;
	text-align: center;
	padding: 20px;
}
.bl_price_planLbl {
	font-size: 17px;
	font-weight: bold;
}
.bl_price_planAmt {
	margin-top: 4px;
}
.bl_price_planAmt_num {
	font-size: 40px;
	font-weight: bold;
	letter-spacing: 0.02em;
}
.bl_price_planAmt_sm {
	font-size: 17px;
	font-weight: bold;
}
.bl_price_planTerm {
	display: inline-block;
	margin-top: 8px;
	padding: 3px 16px;
	background: rgba(255, 255, 255, 0.22);
	border-radius: 999px;
	font-size: 14px;
}
.bl_price_spec {
	display: flex;
	flex-wrap: wrap;
	padding: 6px 34px 0;
}
.bl_price_specRow {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 50%;
	padding: 14px 16px;
	border-bottom: 1px solid #eee;
}
.bl_price_specRow__wide {
	width: 100%;
}
.bl_price_specTtl {
	font-size: 14px;
	color: #666;
}
.bl_price_specData {
	font-size: 17px;
	font-weight: bold;
}
.bl_price_initTtl {
	margin: 26px 34px 16px;
	font-size: 17px;
	font-weight: bold;
	color: #666;
}
.bl_price_initList {
	display: flex;
	gap: 20px;
	padding: 0 34px;
}
.bl_price_initItem {
	width: calc((100% - 20px) / 2);
	background: #F2F2F2;
	border-radius: 12px;
	padding: 24px 22px;
	position: relative;
}
.bl_price_initItem__reco {
	background: #FDEEE7;
}
.bl_price_initItem__reco::before {
	content: "より充実";
	position: absolute;
	top: -12px;
	left: 22px;
	background: #E66342;
	color: #fff;
	font-size: 11px;
	font-weight: bold;
	padding: 3px 14px;
	border-radius: 999px;
}
.bl_price_initName {
	font-size: 17px;
	font-weight: bold;
}
.bl_price_initAmt {
	margin: 2px 0 10px;
	color: #222;
}
.bl_price_initAmt_num {
	font-size: 26px;
	font-weight: bold;
}
.bl_price_initAmt_sm {
	font-size: 14px;
	font-weight: bold;
}
.bl_price_initTxt {
	font-size: 14px;
	line-height: 1.7;
	color: #666;
}

.bl_price_option {
	max-width: 780px;
	margin: 26px auto 0;
	background: #fff;
	border-radius: 14px;
	padding: 24px 34px 30px;
	box-shadow: 0 6px 20px rgba(80, 60, 40, 0.14);
}
.bl_price_optionTtl {
	font-size: 20px;
	font-weight: bold;
	padding-bottom: 12px;
	border-bottom: 1px solid #eee;
}
.bl_price_optionList {
	display: flex;
	gap: 26px;
	margin-top: 18px;
}
.bl_price_optionItem {
	width: calc((100% - 26px) / 2);
}
.bl_price_optionName {
	font-size: 17px;
	font-weight: bold;
	color: #E66342;
}
.bl_price_optionAmt {
	margin: 4px 0 8px;
	color: #222;
}
.bl_price_optionAmt_num {
	font-size: 22px;
	font-weight: bold;
}
.bl_price_optionAmt_sm {
	font-size: 14px;
	font-weight: bold;
}
.bl_price_optionTxt {
	font-size: 14px;
	line-height: 1.8;
	color: #666;
}

/*=======================================================
導入企業の実績数字 ／ 導入事例
=======================================================*/
.bl_result {
	padding: 0 0 84px;
}
/* 実績の手前を走る犬（MVと同じ絵） */
.bl_result_dog {
	height: 320px;
	position: relative;
	margin-bottom: 0;
}
.bl_result_dog_img {
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	height: 240px;
	background: url(../images/yoriai-seo/pc/dog-img.webp) center center/auto 100% no-repeat;
	will-change: transform;
}
.bl_result_numList {
	display: flex;
	justify-content: center;
	gap: 5px;
	margin-top: 40px;
}
.bl_result_numItem {
	/* 白い円がデザインの200pxになるサイズ（circle02は白円が画像幅の約82%） */
	width: 245px;
	height: 236px;
	background: url(../images/yoriai-seo/pc/circle02-img.webp) center/contain no-repeat;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	/* 素材の白い円がボックス中央からずれている（横-9.5px／縦-1.9px）ので、
	   その分をpaddingで打ち消して文字を円の中心に合わせる */
	padding: 4px 23px 0 4px;
	text-align: center;
}
.bl_result_numLbl {
	font-size: 16px;
	line-height: 1.5;
	color: #555;
}
.bl_result_numData {
	margin-top: 4px;
	font-size: 32px;
	font-weight: bold;
	color: #E66342;
}
.bl_result_caseList {
	display: flex;
	gap: 24px;
	margin-top: 54px;
}
.bl_result_caseItem {
	width: calc((100% - 48px) / 3);
	background: #fff;
	border-radius: 14px;
	padding: 26px 24px;
	text-align: center;
	box-shadow: 0 6px 20px rgba(80, 60, 40, 0.14);
}
.bl_result_caseItem .el_label {
	display: inline-flex;
	background: #F8E633;
	color: #222;
	font-size: 14px;
	font-weight: bold;
	padding: 4px 14px;
	border-radius: 999px;
}
.bl_result_caseTtl {
	margin: 12px 0 12px;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.5;
}
.bl_result_caseTxt {
	font-size: 15px;
	line-height: 1.9;
	color: #555;
	text-align: left;
}
.bl_result_att {
	margin-top: 30px;
	font-size: 14px;
	color: #7a6a4a;
	text-align: center;
}

/*=======================================================
SP
=======================================================*/
@media screen and (max-width : 750px){
	/* ---- SP専用の背景の割り当て（デザイナー確認済み）----
	   content-bg-img01 … こんなお悩みを〜の上
	   content-bg-img02 … 樹林帯
	   content-bg-img03 … 道（メリット・流れ）の背景
	   content-bg-img04 … あそびラボと一緒に始めるメリットの上
	   content-bg-img05 … 料金プランの上
	   content-bg-img06 … 料金〜実績の夕焼け
	   content-bg-img07 … 導入企業の実績数字の上
	   SPでは雲・木は開かず、1枚絵の帯として静止させる            */
	.bl_worry_deco {
		aspect-ratio: 750 / 458;
		/* content-bg-img01 は透過PNGのため、背景（黄→紺）を焼き込んだものを使う */
		background-image: url(../images/yoriai-seo/sp/worry-deco-sp.webp);
	}
	.bl_solution_tree {
		aspect-ratio: 750 / 398;
		margin-bottom: 280px;
		background: url(../images/yoriai-seo/sp/content-bg-img02.webp) top center/100% 100% no-repeat;
	}
	.bl_solution_tree::after,
	.bl_solution_tree_side,
	.bl_cloudCurtain {
		display: none;
	}
	/* content-bg-img03 は「夜空 → 草むら（眠る犬）→ 雲」までの縦長1枚絵。
	   セクション下端に合わせて敷き、上に余る分は絵の上端色でベタ塗りする */
	.bl_solution {
		padding-top: 0;
		background-image: url(../images/yoriai-seo/sp/content-bg-img03.webp);
		background-position: bottom center;
		background-size: 100% auto;
		background-repeat: no-repeat;
		background-color: #231C80;
	}
	/* 犬・草・雲は上のbackgroundで描くので、ここは重ならないための余白として使う */
	.bl_solution_grass {
		background: none;
		aspect-ratio: 750 / 824;
	}
	.bl_road_dog {
		width: 100%;
		margin: 0;
		aspect-ratio: 750 / 464;
		background: url(../images/yoriai-seo/sp/content-bg-img04.webp) top center/100% 100% no-repeat;
	}
	.bl_road::before {
		display: none;
	}
	/* 雲の下端は透過してフェードアウトするので、雲が全幅を覆う420px以降は
	   道色ではなく料金セクション側の白を敷いておく */
	.bl_road_grass {
		aspect-ratio: 750 / 760;
		background:
			url(../images/yoriai-seo/sp/content-bg-img05.webp) top center/100% 100% no-repeat,
			linear-gradient(#DACDAD 0, #DACDAD 420px, #FDFCFC 420px);
		margin-top: 0;
	}
	.bl_result_dog {
		height: auto;
		aspect-ratio: 750 / 336;
	}
	.bl_result_dog_img {
		position: static;
		width: 100%;
		height: 100%;
		background: url(../images/yoriai-seo/sp/content-bg-img07.webp) top center/100% 100% no-repeat;
		transform: none !important;
	}
	/* MV */
	.bl_breadcrumbs {
		margin-bottom: 0;
	}
	.bl_mv {
		background-image: url(../images/yoriai-seo/sp/mv-bg.webp);
		background-color: #F6DD81;
		margin-top: 0;
		padding-bottom: 54px;
	}
	.bl_mv_art {
		aspect-ratio: 750 / 808;
	}
	.bl_mv_ttl {
		padding-top: 10%;
		font-size: 52px;
	}
	.bl_mv_lead {
		padding-top: 30px;
		font-size: 26px;
		line-height: 1.9;
	}
	.bl_badgeUnit {
		flex-wrap: wrap;
		gap: 40px 20px;
		margin-top: 30px;
	}
	.bl_badge {
		width: 320px;
		height: 320px;
	}
	.bl_badge_lbl {
		font-size: 22px;
	}
	.bl_badge_num {
		font-size: 48px;
	}
	.bl_badge_att {
		bottom: -34px;
		font-size: 22px;
	}




	/* 共通 */
	.el_secTtl {
		font-size: 40px;
	}
	.el_secEn {
		font-size: 22px;
	}
	.el_secLead {
		font-size: 26px;
	}
	.el_ctaBtn {
		min-width: 0;
		width: 100%;
		padding: 26px 20px;
		font-size: 28px;
	}

	/* お悩み */
	.bl_worry {
		padding-bottom: 60px;
	}
	.bl_worry_head {
		padding-top: 54px;
		margin-bottom: 32px;
	}
	.bl_worry_list {
		gap: 16px;
	}
	.bl_worry_item {
		width: 100%;
		padding: 22px 20px;
	}
	.bl_worry_ttl {
		font-size: 30px;
	}
	.bl_worry_txt {
		font-size: 26px;
	}

	/* ソリューション */
	.bl_solution_body {
		display: block;
		margin-top: 28px;
	}
	.bl_solution_imgWrapper {
		width: 100%;
		margin-bottom: 24px;
	}
	.bl_solution_grass {
		margin-top: 40px;
	}

	/* FEATURE */
	/* 直前の雲（content-bg-img03の下端＝純白）から自然につなぐ */
	.bl_feature {
		padding-bottom: 60px;
		background-image: linear-gradient(#FFFFFF 0, #F9FAFC 240px);
		background-color: #F9FAFC;
	}
	.bl_feature .el_secLead {
		color: #555;
	}
	.bl_feature .ly_cont_inner {
		padding-top: 14%;
	}
	.bl_feature_item {
		display: block;
		padding: 22px;
	}
	.bl_feature_imgWrapper {
		width: 100%;
		margin-bottom: 18px;
	}
	.bl_feature_ttl {
		font-size: 34px;
	}
	.bl_feature_no {
		font-size: 22px;
	}
	.bl_feature_txt {
		font-size: 26px;
	}
	.el_pill {
		font-size: 22px;
	}
	.bl_solution_txt {
		font-size: 26px;
	}
	.bl_tag {
		font-size: 22px;
	}
	.bl_feature .bl_ctaBtnWrapper {
		margin-top: 40px;
	}

	/* メリット・流れ */
	/* SPの道エリアはベタの道色。上端205pxだけは content-bg-img04 の
	   透過部分が乗るので、FEATUREの白を継いでおく */
	.bl_road {
		background: linear-gradient(#F9FAFC 0, #F9FAFC 205px, #DACDAD 205px) top center/100% auto no-repeat;
		background-color: #DACDAD;
		padding-top: 0;
	}

	.bl_merit {
		padding-top: 40px;
	}
	.bl_merit_list {
		display: block;
		margin-top: 26px;
	}
	.bl_merit_item {
		width: 100%;
	}
	.bl_merit_item + .bl_merit_item {
		margin-top: 20px;
	}
	.bl_flow {
		margin-top: 54px;
	}
	.bl_flow_list {
		padding: 10px 30px;
	}
	.bl_flow_item {
		align-items: flex-start;
		gap: 24px;
		padding: 28px 0;
	}
	.bl_flow_no {
		width: 96px;
		padding-top: 4px;
	}
	.bl_flow_no_num {
		font-size: 56px;
	}
	.bl_flow_no_en {
		font-size: 22px;
		margin-bottom: 4px;
	}
	.bl_flow_ttl {
		margin-bottom: 8px;
	}
	.bl_flow_ttl {
		font-size: 30px;
	}
	.bl_flow_txt {
		font-size: 26px;
	}
	.bl_merit_ttl {
		font-size: 30px;
	}
	.bl_merit_txt {
		font-size: 26px;
	}


	/* 料金 */
	.bl_sunset {
		background-image: url(../images/yoriai-seo/sp/content-bg-img06.webp);
	}
	.bl_price {
		padding: 22% 0 60px;
	}
	.bl_sunset::before {
		aspect-ratio: 1000 / 200;
	}
	.bl_price_spec {
		display: block;
		padding: 6px 20px 0;
	}
	.bl_price_specRow {
		width: 100%;
		padding: 18px 4px;
	}
	.bl_price_planLbl {
		font-size: 26px;
	}
	.bl_price_planAmt_num {
		font-size: 60px;
	}
	.bl_price_planAmt_sm,
	.bl_price_specData {
		font-size: 26px;
	}
	.bl_price_planTerm,
	.bl_price_specTtl,
	.bl_price_initAmt_sm,
	.bl_price_initTxt,
	.bl_price_optionAmt_sm,
	.bl_price_optionTxt {
		font-size: 22px;
	}
	.bl_price_initTtl,
	.bl_price_initName,
	.bl_price_optionName {
		font-size: 26px;
	}
	.bl_price_optionTtl {
		font-size: 30px;
	}
	.bl_price_initAmt_num {
		font-size: 40px;
	}
	.bl_price_optionAmt_num {
		font-size: 34px;
	}
	.bl_price_initTtl {
		margin: 22px 20px 16px;
	}
	.bl_price_initList {
		display: block;
		padding: 0 20px;
	}
	.bl_price_initItem {
		width: 100%;
	}
	.bl_price_initItem + .bl_price_initItem {
		margin-top: 28px;
	}
	.bl_price_option {
		padding: 22px 20px 26px;
	}
	.bl_price_optionList {
		display: block;
	}
	.bl_price_optionItem {
		width: 100%;
	}
	.bl_price_optionItem + .bl_price_optionItem {
		margin-top: 22px;
	}

	/* 実績・事例 */
	.bl_result {
		padding: 0 0 60px;
	}
	.bl_result_numList {
		flex-wrap: wrap;
		gap: 20px;
	}
	.bl_result_numItem {
		width: calc((100% - 20px) / 2);
		height: auto;
		aspect-ratio: 186 / 179;
	}
	.bl_result_numLbl {
		font-size: 22px;
	}
	.bl_result_numData {
		font-size: 48px;
	}
	.bl_result_caseTtl {
		font-size: 30px;
	}
	.bl_result_caseTxt {
		font-size: 24px;
	}
	.bl_result_caseItem .el_label,
	.bl_result_att {
		font-size: 22px;
	}
	.bl_result_caseList {
		display: block;
		margin-top: 40px;
	}
	.bl_result_caseItem {
		width: 100%;
	}
	.bl_result_caseItem + .bl_result_caseItem {
		margin-top: 20px;
	}
}