@charset "UTF-8";
/* =========================================================
   WINXCY ホームページ制作LP たたき台
   デザイン言語: sitte.page 完コピ仕様 (mirror/spec_*.md 準拠)
   基調: 黒#000 × 黄#ea4335 / グレー#f7f6f5 / クリーム#fce8e6
   1rem = 10px (html 62.5%)
========================================================= */

/* ---------- reset ---------- */
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}
ol li,ul li{list-style:none}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
[id]{scroll-margin-top:100px}
/* scroll-behavior:smoothは検証環境でアニメーションが完了せずクリックしても
   スクロールしないという不具合を確認したため、確実性を優先してautoのまま使用 */
html,body{
	color:#000;font-size:62.5%;
	font-family:YakuHanJP,'Roboto Condensed','Noto Sans JP','游ゴシック体','Yu Gothic',YuGothic,sans-serif;
	font-feature-settings:'palt';-webkit-text-size-adjust:100%;
	box-sizing:border-box;background-color:#fff;
}
*,*:before,*:after{box-sizing:inherit}
main{overflow:hidden}
a{text-decoration:none;color:#000}
img{max-width:100%;height:auto;vertical-align:middle}
em{font-style:normal}
::selection{background:#ea4335}

/* ---------- 背景・セクション余白 ---------- */
.bg_base,.bg,.bg__fff{padding:120px 0}
@media screen and (max-width:640px){.bg_base,.bg,.bg__fff{padding:50px 0}}
.bg{background-color:#f7f6f5}
.bg__fff{background-color:#fff}
.bg__orange{background-color:#ea4335;padding:100px 0}
@media screen and (max-width:1024px){.bg__orange{padding:50px 0}}

/* パターン背景ループ(CSSストライプ。※本番はロゴタイル画像に差し替え) */
.bg__animation{
	background-color:#ea4335;
	background-image:repeating-linear-gradient(45deg, rgba(0,0,0,0.045) 0 24px, transparent 24px 75px);
	background-size:150px 150px;
	animation:bgiLoop 5s linear infinite;
}
@keyframes bgiLoop{0%{background-position:0 0}100%{background-position:150px -150px}}

/* ---------- コンテナ ---------- */
.l-wrap__inner_1080{max-width:1080px;margin:0 auto;width:80%}
@media screen and (max-width:896px){.l-wrap__inner_1080{width:90%}}
.l-wrap__inner_1300{max-width:1300px;margin:0 auto;width:80%}
@media screen and (max-width:1080px){.l-wrap__inner_1300{width:90%}}
.l-wrap__inner_900{max-width:900px;margin:0 auto}
@media screen and (max-width:960px){.l-wrap__inner_900{width:90%}}

/* ---------- スクロール出現演出 ----------
   出現アニメーションは全てGSAP(js/main.js)側で制御。
   CSSでは初期非表示にしない=GSAP未ロード時も全表示(フェイルオープン)。
   .left-to-right / .right-to-left はJSが方向を読むためのマーカー。 */
.js-on .o-c-common__headline::after{transform:scaleX(0);transition:transform .6s ease .35s}
.js-on .o-c-common__headline.head-in::after{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{animation:none !important;transition:none !important}
	.js-on .o-c-common__headline::after{transform:scaleX(1)}
}

/* ---------- 共通見出し ---------- */
.o-c-common__headline{text-align:center;margin-bottom:100px;position:relative}
@media screen and (max-width:640px){.o-c-common__headline{margin:0 0 40px}}
.o-c-common__headline__en{
	font-size:17rem;color:#fce8e6;font-weight:300;line-height:1;
	text-transform:uppercase;font-family:'Roboto Condensed',sans-serif;padding-bottom:10px;
}
@media screen and (max-width:1080px){.o-c-common__headline__en{font-size:14rem}}
@media screen and (max-width:896px){.o-c-common__headline__en{font-size:10rem}}
@media screen and (max-width:640px){.o-c-common__headline__en{font-size:7rem}}
.o-c-common__headline__en.en__white{color:#fff}
.o-c-common__headline__en.en__white__feature{color:rgba(255,255,255,0.5)}
.o-c-common__headline__ja{
	margin-top:-10px;font-size:2.4rem;font-weight:bold;letter-spacing:0.24em;
	display:flex;flex-wrap:wrap;justify-content:center;width:90%;margin-left:auto;margin-right:auto;
}
@media screen and (max-width:1080px){.o-c-common__headline__ja{font-size:2rem}}
@media screen and (max-width:896px){.o-c-common__headline__ja{font-size:1.8rem}}
@media screen and (max-width:640px){.o-c-common__headline__ja{font-size:1.6rem}}
.o-c-common__headline::after{content:"";display:block;margin:50px auto 0;width:60px;height:4px;background:#ea4335}
@media screen and (max-width:640px){.o-c-common__headline::after{height:2px;width:40px;margin-top:32px}}
.bg__orange .o-c-common__headline::after{background:#fff}

.sec_lead{text-align:center;font-size:1.6rem;line-height:2;margin:-60px auto 70px;max-width:760px;width:90%}
@media screen and (max-width:640px){.sec_lead{font-size:1.3rem;margin:-10px auto 40px}}
.sec_lead .hl{background:#f6aea9;font-weight:bold;padding:0 4px}

/* ---------- ボタン(ピル型・hover白黒反転) ---------- */
.o_c_b{
	display:inline-block;background-color:#000;color:#fff;text-align:center;
	padding:15px 36px;border-radius:100px;border:3px solid #000;
	font-size:1.6rem;font-weight:bold;transition:all .2s ease;
}
.o_c_b:hover{background-color:#fff;color:#000}
@media screen and (max-width:640px){.o_c_b{padding:12px 24px;font-size:1.4rem}}
.o_c_b-big{
	display:block;background-color:#000;color:#fff;text-align:center;
	max-width:420px;width:100%;margin:0 auto;padding:22px 0;border-radius:100px;
	border:3px solid #000;font-size:1.8rem;font-weight:bold;letter-spacing:0.08em;transition:all .2s ease;
}
.o_c_b-big:hover{background-color:#fff;color:#000}
@media screen and (max-width:640px){.o_c_b-big{padding:16px 0;font-size:1.5rem}}

/* ---------- プレースホルダー(画像挿入箇所) ---------- */
.ph{
	position:relative;background:
		repeating-linear-gradient(-45deg, rgba(0,0,0,0.06) 0 12px, rgba(255,255,255,0.5) 12px 24px),#fdeeed;
	border:2px dashed #c5221f;border-radius:6px;
	display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.ph__label{
	display:inline-block;background:#fad2cf;color:#8c1d18;font-size:1.2rem;font-weight:bold;
	line-height:1.6;padding:8px 14px;border-radius:4px;text-align:center;box-shadow:0 1px 4px rgba(0,0,0,.15);
}
.ph--tall{min-height:380px}
.ph--wide{min-height:320px}
.ph--icon{width:110px;height:110px;border-radius:50%;margin:0 auto}
.ph--icon .ph__label{font-size:0.9rem;padding:4px 6px}
.ph--human{width:150px;height:150px;border-radius:50%}
.ph--human .ph__label{font-size:0.9rem;padding:4px 6px}
.ph--step{width:64px;height:64px;margin:6px auto 0}
.ph--step .ph__label{font-size:0.8rem;padding:2px 4px}

/* ---------- ヘッダー ---------- */
.l-header{
	position:fixed;width:100%;height:100px;top:0;left:0;z-index:300;padding:0 20px;
	display:flex;align-items:center;transition:all .3s;
}
.l-header__logo{position:absolute;top:50%;left:20px;transform:translateY(-50%);line-height:1}
.l-header__logo__img{height:44px;width:auto}
@media screen and (max-width:640px){.l-header__logo__img{height:32px}}
.l-header__scroll{background-color:#000;height:60px}
.l-header__scroll .l-header__logo__img{filter:brightness(0) invert(1)}
.l-header__menu{margin-left:auto;margin-right:70px;display:flex;align-items:center;gap:28px}
@media screen and (max-width:640px){.l-header__menu{display:none}}
.l-header__menu__item{font-size:1.3rem;font-weight:bold}
.l-header__bk-underline{position:relative;padding-bottom:4px}
.l-header__bk-underline::after{
	content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background-color:#000;transition:width .3s;
}
.l-header__bk-underline:hover::after{width:100%}
.l-header__scroll .l-header__bk-underline{color:#fff}
.l-header__scroll .l-header__bk-underline::after{background:#fff}
.l-header__bk-block{background:#000;color:#fff;padding:12px 22px;border-radius:4px;transition:opacity .2s}
.l-header__bk-block:hover{opacity:.75}
.l-header__scroll .l-header__bk-block{background:#ea4335;color:#000}
.l-header__bk-outline{background:transparent;color:#000;border:2px solid #000;padding:10px 20px;border-radius:4px;transition:all .2s}
.l-header__bk-outline:hover{background:#000;color:#fff}
.l-header__scroll .l-header__bk-outline{color:#fff;border-color:#fff}
.l-header__scroll .l-header__bk-outline:hover{background:#fff;color:#000}

/* ハンバーガー */
.l-header__hamburger__button{
	position:fixed;top:37px;right:20px;width:35px;height:25px;background:none;border:none;cursor:pointer;
	transition:all .3s;z-index:310;
}
.l-header__scroll ~ * .l-header__hamburger__button{top:18px}
.l-header__hamburger__button__bar{
	display:block;width:35px;height:3px;background-color:#000;position:absolute;left:0;
	transition:all .2s;transform-origin:0 0;transform:translateY(-50%);
}
.l-header__scroll .l-header__hamburger__button__bar{background-color:#fff}
.l-header__hamburger__button__bar1{top:3px}
.l-header__hamburger__button__bar2{top:53%}
.l-header__hamburger__button__bar3{bottom:-1px}
.l-header__hamburger__button.active .l-header__hamburger__button__bar{width:42px}
.l-header__hamburger__button.active .l-header__hamburger__button__bar1{transform:rotate(0.55rad) translateY(-50%);top:3px}
.l-header__hamburger__button.active .l-header__hamburger__button__bar2{opacity:0}
.l-header__hamburger__button.active .l-header__hamburger__button__bar3{transform:rotate(-0.57rad);top:calc(100% - 2px)}
.l-header__hamburger__nav{
	position:fixed;top:70px;right:20px;width:220px;background:#fff;box-shadow:0 4px 24px rgba(0,0,0,.18);
	border-radius:6px;overflow:hidden;
	max-height:0;transition:max-height .4s ease;z-index:305;
}
.l-header__hamburger__nav.open{max-height:520px}
.l-header__hamburger__nav li a{
	display:block;padding:14px 18px;font-size:1.3rem;font-weight:bold;background:#f7f6f5;
	border-bottom:1px solid #fff;transition:background .2s;
}
.l-header__hamburger__nav li a:hover{background:#ea4335}

/* ---------- ローディング ---------- */
.o-p-loader{display:none}
.js-on .o-p-loader{
	position:fixed;inset:0;background:#ea4335;z-index:900;
	display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
}
.o-p-loader.done{opacity:0;pointer-events:none;transition:opacity .3s}
.o-p-loader__spinner{
	width:40px;height:40px;border:4px solid #000;border-top-color:transparent;border-radius:50%;
	animation:spin 1s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.o-p-loader__text{font-size:1.4rem;font-weight:bold;letter-spacing:0.2em}

/* ---------- 固定CTAボタン ---------- */
.main_visual__wrap__btn.fixed_page{
	position:fixed;right:24px;bottom:24px;z-index:250;opacity:0;pointer-events:none;transition:opacity .3s;
}
.main_visual__wrap__btn.fixed_page.show{opacity:1;pointer-events:auto}
.main_visual__wrap__btn.fixed_page.footer-act{opacity:0;pointer-events:none}
.main_visual__wrap__btn span{
	display:inline-block;background:#000;color:#fff;font-weight:bold;
	padding:12px 20px;border-radius:50px;letter-spacing:0.12em;font-size:1.3rem;
	box-shadow:0 4px 16px rgba(0,0,0,.25);
}

/* ---------- ヒーロー ---------- */
.main_visual{position:relative;background:#f7f6f5;height:850px;overflow:hidden}
@media screen and (max-width:1080px){.main_visual{height:768px}}
@media screen and (max-width:896px){.main_visual{height:auto;padding-bottom:40px}}
.main_visual::before{
	content:"";position:absolute;top:0;right:0;width:62%;height:100%;background:#ea4335;
	clip-path:polygon(26% 0,100% 0,100% 100%,0 100%);
}
@media screen and (max-width:896px){
	.main_visual::before{width:100%;height:46%;top:auto;bottom:0;clip-path:polygon(0 30%,100% 0,100% 100%,0 100%)}
}
.main_visual__wrap{position:relative;height:100%}
.main_visual__wrap__box{
	max-width:1200px;width:90%;margin:0 auto;height:100%;
	display:flex;justify-content:space-between;align-items:center;padding:120px 0 90px;position:relative;
}
@media screen and (max-width:896px){
	.main_visual__wrap__box{flex-direction:column;padding:120px 0 40px;gap:36px}
}
.main_visual__wrap__box__content{width:48%;position:relative;z-index:2}
@media screen and (max-width:896px){.main_visual__wrap__box__content{width:100%}}
.hero_en{
	font-family:'Roboto Condensed',sans-serif;font-weight:700;font-size:1.4rem;
	letter-spacing:0.3em;text-transform:uppercase;margin-bottom:18px;
}
.main_copy{font-size:3.8rem;font-weight:bold;line-height:1.55;letter-spacing:0.02em;margin-bottom:24px}
@media screen and (max-width:1300px){.main_copy{font-size:3.2rem}}
@media screen and (max-width:1080px){.main_copy{font-size:2.7rem}}
@media screen and (max-width:640px){.main_copy{font-size:2.1rem}}
.main_copy .line{display:block}
.main_copy .mk{background:#000;color:#fff;padding:0 8px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.sub_copy{font-size:2rem;font-weight:bold;line-height:2;margin-bottom:10px}
@media screen and (max-width:640px){.sub_copy{font-size:1.3rem;line-height:1.8}}
.js-on .typ2{opacity:0}
.js-on .typ2 span{opacity:0}
.main_visual .text{font-size:1.4rem;line-height:2.4;margin-bottom:30px}
@media screen and (max-width:640px){.main_visual .text{font-size:1.2rem;font-weight:bold}}
.main_visual .text .hl{background:#f6aea9;padding:0 3px}
.hero_btns{display:flex;gap:16px;flex-wrap:wrap}
.hero_btn_sub{background:#fff;color:#000}
.hero_btn_sub:hover{background:#000;color:#fff}
/* イラストは拡大し、下端をヒーロー下端に揃える(絶対配置) */
.main_visual__wrap__box__images{
	position:absolute;right:-2%;bottom:-36px;width:60%;z-index:2;
}
@media screen and (max-width:896px){
	.main_visual__wrap__box__images{position:static;width:88%;margin:0 auto}
}
.hero_mock{width:100%;filter:drop-shadow(0 18px 40px rgba(0,0,0,.2))}

/* ---------- PROBLEM (中央イラスト+放射状吹き出し) ---------- */
.problem__radial{position:relative;max-width:1080px;margin:0 auto;height:820px}
.problem__center{
	position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:300px;
}
.problem__center img{display:block;width:100%}
.problem__bubble{
	position:absolute;width:320px;background:#fff;border:3px solid #000;border-radius:24px;
	padding:22px 24px;box-shadow:7px 7px 0 0 #c5221f;
}
.problem__bubble h3{
	font-size:1.8rem;font-weight:bold;letter-spacing:0.04em;line-height:1.55;margin-bottom:8px;
	display:flex;align-items:center;gap:10px;
}
.problem__bubble h3 > span + *{min-width:0}
.problem__x{
	min-width:32px;width:32px;height:32px;border-radius:50%;background:#000;color:#ea4335;
	display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;font-weight:bold;flex:none;
}
.problem__bubble p{font-size:1.3rem;line-height:1.8}
/* 放射配置: 左 / 左上 / 上左 / 上右 / 右上 / 右 */
.problem__bubble--p1{left:0;top:54%}
.problem__bubble--p2{left:2%;top:22%}
.problem__bubble--p3{left:19%;top:0}
.problem__bubble--p4{right:19%;top:0}
.problem__bubble--p5{right:2%;top:22%}
.problem__bubble--p6{right:0;top:54%}
/* 吹き出しのしっぽ(黒縁2枚重ね・中央のイラストの方向へ) */
.problem__bubble::before,
.problem__bubble::after{content:"";position:absolute;border-style:solid}
/* 左側の吹き出し→右向きしっぽ */
.problem__bubble--p1::before,
.problem__bubble--p2::before{right:-19px;top:50%;margin-top:-11px;border-width:11px 0 11px 19px;border-color:transparent transparent transparent #000}
.problem__bubble--p1::after,
.problem__bubble--p2::after{right:-13px;top:50%;margin-top:-7px;border-width:7px 0 7px 13px;border-color:transparent transparent transparent #fff}
/* 右側の吹き出し→左向きしっぽ */
.problem__bubble--p5::before,
.problem__bubble--p6::before{left:-19px;top:50%;margin-top:-11px;border-width:11px 19px 11px 0;border-color:transparent #000 transparent transparent}
.problem__bubble--p5::after,
.problem__bubble--p6::after{left:-13px;top:50%;margin-top:-7px;border-width:7px 13px 7px 0;border-color:transparent #fff transparent transparent}
/* 上段の吹き出し→下向きしっぽ */
.problem__bubble--p3::before,
.problem__bubble--p4::before{bottom:-19px;left:50%;margin-left:-11px;border-width:19px 11px 0 11px;border-color:#000 transparent transparent transparent}
.problem__bubble--p3::after,
.problem__bubble--p4::after{bottom:-13px;left:50%;margin-left:-7px;border-width:13px 7px 0 7px;border-color:#fff transparent transparent transparent}
@media screen and (max-width:1080px){
	.problem__bubble{width:300px}
	.problem__bubble--p3{left:14%}
	.problem__bubble--p4{right:14%}
}
/* タブレット以下は縦積みフォールバック */
@media screen and (max-width:896px){
	.problem__radial{height:auto;display:flex;flex-direction:column;gap:20px;align-items:center}
	.problem__center{position:relative;left:auto;bottom:auto;transform:none;width:190px;order:-1;margin-bottom:6px}
	.problem__bubble{position:relative;width:100%;max-width:520px;left:auto !important;right:auto !important;top:auto !important}
	.problem__bubble::before,
	.problem__bubble::after{display:none}
}
@media screen and (max-width:640px){
	.problem__bubble{padding:16px 18px}
	.problem__bubble h3{font-size:1.5rem}
	.problem__bubble p{font-size:1.2rem}
}

/* ---------- SOLUTION (CONCEPTスタイル) ---------- */
.concept.bg__fff{padding:120px 0}
@media screen and (max-width:640px){.concept.bg__fff{padding:50px 0}}
.concept__contents{display:flex;align-items:flex-start;flex-wrap:wrap;justify-content:space-between}
@media screen and (max-width:1080px){.concept__contents{justify-content:center;gap:40px}}
.concept__contents__image{max-width:500px;width:46%}
@media screen and (max-width:1080px){.concept__contents__image{width:100%}}
.concept__contents__unit{width:52%}
@media screen and (max-width:1080px){.concept__contents__unit{width:100%;max-width:490px}}
.concept__contents__unit__headline{font-size:5.2rem;line-height:1.6;font-weight:bold;letter-spacing:0.04em;margin-bottom:30px}
@media screen and (max-width:1300px){.concept__contents__unit__headline{font-size:4.6rem}}
@media screen and (max-width:896px){.concept__contents__unit__headline{font-size:3.8rem}}
@media screen and (max-width:640px){.concept__contents__unit__headline{font-size:2.8rem}}
.concept__contents__unit__text{font-size:1.6rem;line-height:2;margin-bottom:34px}
.concept__contents__unit__text span{display:inline-block}
.concept_btn{width:100%;max-width:380px;padding:15px 0;text-align:center}

/* ---------- APPROACH (ABOUTスタイル) ---------- */
.mech__flow{
	display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-bottom:70px;
}
.mech__flow__item{
	background:#fff;border-radius:10px;padding:28px 22px;text-align:center;width:190px;
	box-shadow:0 6px 24px rgba(0,0,0,.08);
}
.mech__flow__item p{font-size:1.5rem;font-weight:bold;line-height:1.6;margin-top:14px}
.mech__flow__icon{display:block;width:110px;height:110px;object-fit:contain;margin:0 auto}
@media screen and (max-width:896px){.mech__flow__icon{width:84px;height:84px}}
.mech__flow__arrow{font-size:2.6rem;font-weight:bold;color:#ea4335}
@media screen and (max-width:896px){
	.mech__flow{gap:10px}
	.mech__flow__item{width:150px;padding:18px 12px}
	.mech__flow__arrow{font-size:2rem}
}
@media screen and (max-width:640px){
	.mech__flow{flex-direction:column}
	.mech__flow__arrow{transform:rotate(90deg)}
	.mech__flow__item{width:80%}
}
.mech__closing{text-align:center;max-width:760px;margin:0 auto}
.mech__closing__headline{font-size:2.8rem;font-weight:bold;letter-spacing:0.08em;line-height:1.7;margin-bottom:22px}
@media screen and (max-width:640px){.mech__closing__headline{font-size:1.8rem}}
.mech__closing__text{font-size:1.6rem;line-height:2.2}
@media screen and (max-width:640px){.mech__closing__text{font-size:1.3rem;line-height:2}}

/* ---------- 中間/末尾CTAバナー ---------- */
.banner__content{padding:80px 5%;text-align:center}
@media screen and (max-width:640px){.banner__content{padding:50px 5%}}
.banner__content .message{
	font-size:3.4rem;font-weight:bold;letter-spacing:0.1em;margin-bottom:44px;position:relative;display:inline-block;
}
.banner__content .message em{background:#000;color:#ea4335;padding:2px 10px}
.banner__content .message::before,
.banner__content .message::after{
	content:"＼";position:absolute;top:0;font-size:3rem;font-weight:bold;
}
.banner__content .message::before{left:-52px}
.banner__content .message::after{content:"／";right:-52px}
@media screen and (max-width:896px){.banner__content .message{font-size:2.4rem}}
@media screen and (max-width:640px){
	.banner__content .message{font-size:1.7rem;margin-bottom:28px}
	.banner__content .message::before{left:-30px;font-size:1.8rem}
	.banner__content .message::after{right:-30px;font-size:1.8rem}
}
.banner__content__btns{position:relative;max-width:640px;margin:0 auto}
.banner__content__btns .human{position:absolute;right:-240px;bottom:-56px;width:220px}
.banner__content__btns .human img{display:block;width:100%}
@media screen and (max-width:1080px){
	.banner__content__btns .human{position:relative;right:auto;bottom:auto;width:170px;margin:0 auto 20px}
}
.banner__cta_set{display:flex;gap:28px;justify-content:center;flex-wrap:wrap}
.banner__cta_unit{flex:1;min-width:260px;max-width:320px}
.banner__cta_unit p{font-size:1.5rem;font-weight:bold;margin-bottom:12px}
.banner__cta_unit small{display:block;font-size:1.1rem;margin-top:8px}
.o_c_b-big--line{background:#fff;color:#000}
.o_c_b-big--line:hover{background:#000;color:#fff}

/* ---------- REASON (MERITスタイル) ---------- */
.merit .merit__unit{max-width:960px;width:90%;margin:0 auto 70px;position:relative}
.merit .merit__unit + .merit__unit{margin-top:150px}
@media screen and (max-width:896px){.merit .merit__unit + .merit__unit{margin-top:60px}}
.merit__unit__content{
	position:relative;padding:60px 50px;background:#fff;max-width:540px;width:56%;z-index:3;
	box-shadow:0 10px 40px rgba(0,0,0,.06);
}
@media screen and (max-width:1080px){
	.merit__unit__content{max-width:none;width:100%;padding:36px 28px}
}
/* 交互配置: 奇数(1,3,5)=コンテンツ左/サムネ右、偶数(2,4)=コンテンツ右/サムネ左 */
.merit__unit__thumb{position:absolute;top:-40px;z-index:1;width:52%;max-width:520px}
.merit__unit:nth-of-type(odd) .merit__unit__thumb{right:-120px}
.merit__unit:nth-of-type(even) .merit__unit__thumb{left:-120px}
.merit__unit:nth-of-type(even) .merit__unit__content{margin-left:auto}
@media screen and (max-width:1080px){
	.merit__unit__thumb{position:relative;top:auto;right:auto !important;left:auto !important;width:100%;margin-bottom:20px}
}
.merit__unit__content__number{
	font-family:'Montserrat',sans-serif;font-size:4rem;letter-spacing:-2px;color:#ea4335;font-weight:bold;
	margin-bottom:8px;position:relative;padding-left:26px;
}
.merit__unit__content__number::before{
	content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
	width:16px;height:16px;background:#ea4335;border-radius:50%;
}
.merit__unit__content__headline{font-size:2.6rem;font-weight:bold;letter-spacing:0.12em;line-height:1.7;margin-bottom:18px}
.merit__unit__content__headline span{display:block}
@media screen and (max-width:1080px){.merit__unit__content__headline{font-size:2.2rem}}
@media screen and (max-width:640px){.merit__unit__content__headline{font-size:1.9rem}}
.merit__unit__content__text{font-size:1.6rem;line-height:2;margin-bottom:18px}
@media screen and (max-width:640px){.merit__unit__content__text{font-size:1.3rem;text-align:justify}}
.merit__tags{display:flex;flex-wrap:wrap;gap:8px}
.merit__tags span{
	background:#ea4335;color:#000;font-size:1.2rem;font-weight:bold;
	padding:5px 14px;border-radius:100px;
}

/* ---------- SERVICE (FEATUREスタイル) ---------- */
.feature .feature__unit{display:flex;justify-content:space-between;flex-wrap:wrap}
.feature__unit__item{
	width:100%;padding:50px;margin-bottom:80px;background:#fff;position:relative;
	box-shadow:7px 7px 0 0 #c5221f;
}
@media screen and (max-width:640px){.feature__unit__item{padding:30px 22px;margin-bottom:40px}}
.feature__unit__item:nth-of-type(1){width:100%}
.feature__unit__item:nth-of-type(1) .feature__unit__item__box{display:flex;justify-content:space-between}
.feature__unit__item:nth-of-type(1) .inner{width:48%}
.feature__unit__item:nth-of-type(1) .feature__unit__item__box__images{width:46%;min-height:280px}
@media screen and (max-width:896px){
	.feature__unit__item:nth-of-type(1) .feature__unit__item__box{flex-direction:column;gap:26px}
	.feature__unit__item:nth-of-type(1) .inner{width:100%}
	.feature__unit__item:nth-of-type(1) .feature__unit__item__box__images{width:100%;min-height:200px}
}
/* 2-3件目=2列 / 4-6件目=3列 (SITTEと同じ1+2+3グリッド) */
.feature__unit__item:nth-of-type(2),
.feature__unit__item:nth-of-type(3){width:48%;padding:50px}
@media screen and (max-width:1080px){
	.feature__unit__item:nth-of-type(2),
	.feature__unit__item:nth-of-type(3){width:49%}
}
.feature__unit__item:nth-of-type(4),
.feature__unit__item:nth-of-type(5),
.feature__unit__item:nth-of-type(6){width:31%;padding:30px}
@media screen and (max-width:1080px){
	.feature__unit__item:nth-of-type(4),
	.feature__unit__item:nth-of-type(5),
	.feature__unit__item:nth-of-type(6){width:32%}
}
@media screen and (max-width:896px){
	.feature__unit__item:nth-of-type(2),
	.feature__unit__item:nth-of-type(3),
	.feature__unit__item:nth-of-type(4),
	.feature__unit__item:nth-of-type(5),
	.feature__unit__item:nth-of-type(6){width:100%;padding:40px 30px}
}
.feature__unit__item__number{
	font-family:'Montserrat',sans-serif;font-weight:bold;color:#000;font-size:6rem;line-height:1;margin-bottom:16px;
}
.feature__unit__item__headline{font-size:2rem;font-weight:bold;letter-spacing:0.1rem;line-height:1.6;margin-bottom:16px}
.feature__list{margin-bottom:18px}
.feature__list li{
	font-size:1.4rem;line-height:1.9;padding-left:18px;position:relative;
}
.feature__list li::before{
	content:"";position:absolute;left:0;top:0.65em;width:9px;height:9px;background:#ea4335;
}
.feature__unit__item__text{font-size:1.5rem;line-height:1.9;opacity:.8}

/* ---------- PRICE ---------- */
.price__cards{display:flex;gap:30px;justify-content:center;align-items:stretch;flex-wrap:wrap}
.price__card{
	background:#fff;border:3px solid #000;border-radius:10px;padding:40px 30px;width:31%;min-width:280px;
	display:flex;flex-direction:column;position:relative;box-shadow:7px 7px 0 0 #c5221f;
}
@media screen and (max-width:1080px){.price__card{width:46%}}
@media screen and (max-width:768px){.price__card{width:100%;max-width:420px}}
.price__card--popular{border-color:#000;border-width:4px}
.fukidashi{
	position:absolute;top:-22px;left:50%;transform:translateX(-50%);
	background:#000;color:#ea4335;font-size:1.4rem;font-weight:bold;letter-spacing:0.1em;
	padding:8px 26px;border-radius:100px;white-space:nowrap;
}
.price__card__name{font-size:2rem;font-weight:bold;text-align:center;letter-spacing:0.12em;margin-bottom:18px}
.price__card__price{text-align:center;margin-bottom:6px}
.price__card__price .num{
	font-family:'Montserrat',sans-serif;font-size:5.4rem;font-weight:700;letter-spacing:-1px;line-height:1;
	font-variant-numeric:tabular-nums;display:inline-block;text-align:right;
}
.price__card__price small{font-size:1.3rem;font-weight:bold}
.price__card__note{
	text-align:center;font-size:1.3rem;font-weight:bold;background:#fce8e6;border-radius:100px;
	padding:5px 0;margin-bottom:22px;
}
.price__card__list{flex:1;margin-bottom:26px}
.price__card__list li{
	font-size:1.4rem;line-height:1.8;padding:7px 0 7px 24px;position:relative;border-bottom:1px dashed #ddd;
}
.price__card__list li::before{
	content:"✓";position:absolute;left:2px;top:7px;color:#ea4335;font-weight:bold;font-size:1.5rem;
}
.price__card__btn{display:block;width:100%;padding:14px 0}
.price__card__caution{font-size:1.1rem;margin-top:12px;line-height:1.6}
.price__footnote{text-align:center;font-size:1.4rem;margin-top:44px;line-height:1.8}

/* ---------- PRICE 比較表 ---------- */
.price__compare{margin-top:50px}
.price__compare__label{text-align:center;font-size:1.5rem;font-weight:bold;letter-spacing:0.08em;margin-bottom:16px}
.price__compare__wrap{
	background:#fff;border:3px solid #000;border-radius:10px;box-shadow:7px 7px 0 0 #c5221f;
	overflow-x:auto;-webkit-overflow-scrolling:touch;
}
.price__compare table{width:100%;min-width:640px;border-collapse:collapse}
.price__compare th,.price__compare td{padding:14px 18px;font-size:1.3rem;text-align:center;border-bottom:1px dashed #ddd;white-space:nowrap}
.price__compare thead th{background:#000;color:#fff;font-weight:bold;letter-spacing:0.04em}
.price__compare thead th.is-popular{background:#ea4335;color:#000}
.price__compare tbody th{text-align:left;font-weight:bold;background:#f7f6f5;white-space:nowrap}
.price__compare tbody td.is-popular{background:#fce8e6;font-weight:bold;white-space:normal}
.price__compare tbody tr:last-child th,.price__compare tbody tr:last-child td{border-bottom:none}
@media screen and (max-width:640px){
	.price__compare{margin-top:34px}
	.price__compare__label{font-size:1.3rem;margin-bottom:10px}
	.price__compare th,.price__compare td{padding:10px 14px;font-size:1.15rem}
}
@media screen and (max-width:480px){
	.price__compare__wrap{overflow-x:visible;-webkit-overflow-scrolling:auto}
	.price__compare table{min-width:0;table-layout:fixed}
	.price__compare thead th:first-child,.price__compare tbody th{width:23%}
	.price__compare thead th:not(:first-child),.price__compare tbody td{width:25.67%}
	.price__compare th,.price__compare td{
		/* 2026-09-24: 0.62rem(=6.2px)で読めなかったため11pxへ。横スクロールなしで
		   4列に収める方針はそのまま、セル内の折り返しで対応する */
		padding:8px 4px;font-size:1.1rem;line-height:1.45;
		white-space:normal;word-break:normal;overflow-wrap:anywhere;letter-spacing:0;
	}
	.price__compare thead th{font-size:1.1rem;padding:9px 3px}
	.price__compare tbody th{white-space:normal;padding-left:6px}
	.price__compare thead th:first-child,.price__compare tbody th{width:21%}
	.price__compare thead th:not(:first-child),.price__compare tbody td{width:26.33%}
}

/* ---------- WORKS (スライダー) ---------- */
.works__slider{position:relative;padding:0 54px}
@media screen and (max-width:640px){.works__slider{padding:0 40px}}
.works__track{
	display:flex;gap:26px;overflow-x:auto;scroll-snap-type:x mandatory;
	scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:6px 2px 14px;
}
.works__track::-webkit-scrollbar{display:none}
.works__track li{flex:0 0 300px;scroll-snap-align:start}
@media screen and (max-width:640px){.works__track li{flex:0 0 230px}}
.works__track li a{display:block;transition:transform .25s ease}
.works__track li a:hover{transform:translateY(-6px)}
.works__track img{
	width:100%;aspect-ratio:4/3;object-fit:cover;object-position:top;
	background:#fff;box-shadow:5px 5px 0 0 #c5221f;border:1px solid #eee;
}
.works__track span{display:block;font-size:1.3rem;font-weight:bold;line-height:1.6;margin-top:12px}
@media screen and (max-width:640px){.works__track span{font-size:1.1rem}}
.works__nav{
	position:absolute;top:50%;transform:translateY(-50%);z-index:5;
	width:44px;height:44px;border-radius:50%;background:#000;color:#fff;border:3px solid #000;
	font-size:2.2rem;line-height:1;cursor:pointer;transition:all .2s ease;
	display:flex;align-items:center;justify-content:center;padding-bottom:4px;
}
.works__nav:hover{background:#fff;color:#000}
.works__nav--prev{left:0}
.works__nav--next{right:0}
@media screen and (max-width:640px){.works__nav{width:36px;height:36px;font-size:1.8rem}}

/* ---------- FLOW (STEPスタイル) ---------- */
.step.bg__fff{padding:120px 0}
@media screen and (max-width:640px){.step.bg__fff{padding:50px 0}}
.step__contents{max-width:760px;margin:0 auto}
.step__contents__unit{display:flex;gap:36px;padding:34px 0;align-items:flex-start}
@media screen and (max-width:640px){.step__contents__unit{gap:16px;padding:22px 0}}
.step__contents__unit__left{
	background:#ea4335;text-align:center;min-width:120px;width:120px;padding:14px 8px 16px;position:relative;
}
.step__contents__unit__left p{
	font-family:'Montserrat',sans-serif;font-size:1.5rem;font-weight:bold;letter-spacing:0.05em;
}
.step__icon{display:block;width:38px;height:38px;margin:10px auto 2px}
.step__contents__unit__left:not(.step__last)::after{
	content:"";position:absolute;left:50%;bottom:-16px;transform:translateX(-50%);
	border-style:solid;border-width:16px 14px 0 14px;border-color:#ea4335 transparent transparent transparent;
}
@media screen and (max-width:640px){
	.step__contents__unit__left{min-width:86px;width:86px}
}
.step__contents__unit__right{flex:1}
.step__contents__unit__right__headline{
	font-size:2rem;font-weight:bold;letter-spacing:0.06em;margin-bottom:10px;display:flex;align-items:center;flex-wrap:wrap;gap:10px;
}
@media screen and (max-width:640px){.step__contents__unit__right__headline{font-size:1.5rem}}
.step__contents__unit__right__headline .chk{color:#ea4335;font-size:2.2rem;font-weight:bold}
.step__badge{
	background:#000;color:#ea4335;font-size:1.1rem;font-weight:bold;padding:3px 12px;border-radius:100px;
}
.step__contents__unit__right p{font-size:1.4rem;line-height:1.9}
@media screen and (max-width:640px){.step__contents__unit__right p{font-size:1.2rem}}

/* ---------- SEO(検索結果の見え方で強みを説明) ---------- */
.seo__mark{
	display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
	width:26px;height:26px;border-radius:50%;background:#ea4335;color:#000;
	font-family:'Montserrat',sans-serif;font-weight:bold;font-size:1.3rem;line-height:1;
}
.seo__anatomy{
	max-width:1080px;width:90%;margin:0 auto;
	display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:72px;align-items:center;
}
/* 検索結果の模式図 */
.seo__serp{
	margin:0;background:#fff;border-radius:14px;padding:34px 36px 30px 82px;
	box-shadow:0 10px 40px rgba(0,0,0,.06);
}
.seo__serp .seo__mark{position:absolute;left:-50px;top:50%;transform:translateY(-50%)}
.seo__serp__query{
	position:relative;display:flex;align-items:center;gap:12px;
	border:1px solid #dcdcdc;border-radius:100px;padding:13px 22px;
	font-size:1.6rem;font-weight:bold;letter-spacing:.04em;margin-bottom:30px;
}
.seo__serp__query svg{width:18px;height:18px;fill:none;stroke:#888;stroke-width:2;stroke-linecap:round}
.seo__serp__result{padding-left:0}
.seo__serp__result > p{position:relative}
.seo__serp__url{display:grid;grid-template-columns:28px 1fr;column-gap:10px;align-items:center;font-size:1.3rem;line-height:1.4}
.seo__serp__url i{grid-row:span 2;width:28px;height:28px;border-radius:50%;background:#f7f6f5;border:1px solid #e6e6e6}
.seo__serp__url small{font-size:1.15rem;color:#666;font-family:'Roboto Condensed',sans-serif}
.seo__serp__title{font-size:1.9rem;line-height:1.5;color:#1a0dab;margin:10px 0 8px;font-weight:bold}
.seo__serp__desc{font-size:1.35rem;line-height:1.8;color:#4d5156}
.seo__serp__other{margin-top:26px;padding-top:24px;border-top:1px solid #eee}
.seo__serp__other i{display:block;height:9px;border-radius:5px;background:#eee;margin-bottom:10px}
.seo__serp__other i:nth-child(1){width:38%}
.seo__serp__other i:nth-child(2){width:84%;height:12px;background:#e4e4ee}
.seo__serp__other i:nth-child(3){width:92%;margin-bottom:0}
.seo__serp__other + .seo__serp__other{margin-top:20px}
/* 番号ごとの説明 */
.seo .sec_lead,.seo__serp__title,.seo__serp__desc,.seo__note,.seo__plan__list li{word-break:auto-phrase}
.seo__note{padding:26px 0;border-top:1px solid #ddd}
.seo__note:last-child{border-bottom:1px solid #ddd}
.seo__note h3{display:flex;align-items:center;gap:12px;font-size:1.9rem;font-weight:bold;letter-spacing:.06em;line-height:1.5;margin-bottom:10px}
.seo__note p{font-size:1.5rem;line-height:2;padding-left:38px}
/* 公開前 / 公開後 */
.seo__plan{
	max-width:1080px;width:90%;margin:110px auto 0;
	display:grid;grid-template-columns:1fr 1fr;
}
.seo__plan__col{background:#fff;padding:48px 52px}
.seo__plan__col--after{background:#000;color:#fff}
.seo__plan__head{font-size:2.1rem;font-weight:bold;letter-spacing:.08em;line-height:1.5;margin-bottom:24px}
.seo__plan__head small{display:block;font-size:1.25rem;font-weight:normal;letter-spacing:.04em;margin-top:4px;color:#666}
.seo__plan__col--after .seo__plan__head{color:#ea4335}
.seo__plan__col--after .seo__plan__head small{color:#bbb}
.seo__plan__list li{position:relative;font-size:1.5rem;line-height:1.8;padding:12px 0 12px 30px;border-top:1px solid #eee}
.seo__plan__col--after .seo__plan__list li{border-top-color:#333}
.seo__plan__list li::before{
	content:"";position:absolute;left:2px;top:21px;width:13px;height:7px;
	border-left:2.5px solid #ea4335;border-bottom:2.5px solid #ea4335;transform:rotate(-45deg);
}
.seo__plan__col:not(.seo__plan__col--after) .seo__plan__list li::before{border-color:#000}
.seo__plan__list a{color:#ea4335;text-decoration:underline;text-underline-offset:3px}
.seo__article{max-width:1080px;width:90%;margin:40px auto 0;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px;font-size:1.5rem;line-height:1.8}
.seo__article a{font-weight:bold;text-decoration:underline;text-decoration-color:#ea4335;text-decoration-thickness:3px;text-underline-offset:6px;word-break:auto-phrase}
.seo__article a em{display:inline-block;margin-left:8px;transition:transform .2s}
.seo__article a:hover em{transform:translateX(4px)}
.seo__caution{max-width:1080px;width:90%;margin:20px auto 0;font-size:1.25rem;line-height:1.8;color:#666}
@media screen and (max-width:1080px){
	.seo__anatomy{gap:48px}
	.seo__serp{padding:28px 26px 24px 70px}
	.seo__serp .seo__mark{left:-46px}
	.seo__plan__col{padding:40px 36px}
}
@media screen and (max-width:896px){
	.seo__anatomy{grid-template-columns:1fr;gap:36px;max-width:640px}
	.seo__plan{grid-template-columns:1fr;max-width:640px;margin-top:70px}
}
@media screen and (max-width:640px){
	.seo__serp{padding:20px 16px 18px 16px;border-radius:10px}
	.seo__serp .seo__mark{position:static;transform:none;width:20px;height:20px;font-size:1.1rem;margin-right:6px;vertical-align:2px}
	.seo__serp__query{font-size:1.4rem;padding:10px 14px;gap:8px;margin-bottom:20px}
	.seo__serp__query .seo__mark{margin-right:0}
	.seo__serp__url{display:flex;flex-wrap:wrap;align-items:center;font-size:1.2rem}
	.seo__serp__url i{display:none}
	.seo__serp__url small{flex-basis:100%;padding-left:26px;margin-top:2px}
	.seo__serp__title{font-size:1.6rem;margin:8px 0 6px}
	.seo__serp__desc{font-size:1.25rem;line-height:1.75}
	.seo__serp__other{margin-top:18px;padding-top:16px}
	.seo__serp__other + .seo__serp__other{display:none}
	.seo__note{padding:20px 0}
	.seo__note h3{font-size:1.6rem;gap:10px;margin-bottom:6px}
	.seo__note p{font-size:1.3rem;line-height:1.9;padding-left:0}
	.seo__plan{margin-top:50px}
	.seo__plan__col{padding:30px 22px}
	.seo__plan__head{font-size:1.7rem;margin-bottom:14px}
	.seo__plan__list li{font-size:1.3rem;padding:10px 0 10px 26px}
	.seo__plan__list li::before{top:17px;width:11px;height:6px}
	.seo__article{margin-top:30px;font-size:1.3rem;flex-direction:column;align-items:flex-start}
	.seo__article a{font-size:1.4rem}
	.seo__caution{font-size:1.1rem}
}

/* ---------- FAQ ---------- */
.faq__list{max-width:760px;margin:0 auto}
.faq__item{
	background:#fff;border-radius:8px;margin-bottom:16px;box-shadow:0 4px 18px rgba(0,0,0,.05);overflow:hidden;
}
.faq__item summary{
	list-style:none;cursor:pointer;font-size:1.6rem;font-weight:bold;line-height:1.7;
	padding:22px 60px 22px 58px;position:relative;
}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary::before{
	content:"Q";position:absolute;left:20px;top:20px;
	font-family:'Montserrat',sans-serif;font-weight:bold;font-size:1.8rem;color:#fff;
	background:#ea4335;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
}
.faq__item summary::after{
	content:"＋";position:absolute;right:22px;top:50%;transform:translateY(-50%);
	font-size:2rem;font-weight:bold;transition:transform .25s;
}
.faq__item[open] summary::after{content:"−"}
.faq__item p{
	font-size:1.4rem;line-height:2;padding:0 24px 24px 58px;position:relative;
}
.faq__item p::before{
	content:"A";position:absolute;left:20px;top:-2px;
	font-family:'Montserrat',sans-serif;font-weight:bold;font-size:1.8rem;
	background:#000;color:#ea4335;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
}
@media screen and (max-width:640px){
	.faq__item summary{font-size:1.3rem;padding:16px 44px 16px 50px}
	.faq__item p{font-size:1.2rem;padding-left:50px}
}

/* ---------- フッター ---------- */
.l-footer-sub{padding:34px 20px 26px;text-align:center}
.l-footer-nap{margin-bottom:18px}
.l-footer-nap__name{font-size:1.5rem;font-weight:bold;margin-bottom:6px}
.l-footer-nap__info{font-size:1.3rem;line-height:1.9}
.l-footer-nap__info a{font-weight:bold}
.l-footer-nap__area{font-size:1.2rem;color:#555;margin-top:4px}
.l-footer-sub__copy{font-size:1.2rem}
.l-footer{background-color:#ea4335;padding:34px 20px}
.l-footer__menu__list{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 30px}
.l-footer__menu__list__item a{font-size:1.2rem;font-weight:bold;position:relative;padding-bottom:3px}
.l-footer__menu__list__item a::after{
	content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:#000;transition:width .3s;
}
.l-footer__menu__list__item a:hover::after{width:100%}

/* ハンバーガー内の他ページリンク */
.l-header__hamburger__nav__sub a{background:#fff !important;font-weight:normal !important;color:#555}
.l-header__hamburger__nav__sub:first-of-type{border-top:2px solid #ea4335}

/* =========================================================
   SP全面改修 (デザイナーパネル3体の統合案・2026-07-29)
   原則: 640px以下(一部896px)限定でPC承認版に副作用を出さない。
   例外=全幅バグ修正: FAQ「Q」コントラスト / 黄地上の黄マーカー
========================================================= */

/* ---- 全幅バグ修正 ---- */
.faq__item summary::before{color:#000}
.bg__orange .sec_lead .hl{background:#000;color:#ea4335;padding:2px 6px}

/* ---- ヒーロー価格行 (PC=旧2行目とほぼ同じ見え方) ---- */
.hero_price{font-size:2rem;font-weight:bold;line-height:1.8;margin-bottom:10px}
.js-on .typ2{opacity:0}

/* ================= 640px以下: SP再設計 ================= */
@media screen and (max-width:640px){

	/* --- ヘッダー64px+ハンバーガー48px当たり判定 --- */
	.l-header{height:64px}
	.l-header__hamburger__button{width:48px;height:48px;top:8px;right:12px}
	.l-header__hamburger__button__bar{left:6px}
	.l-header__hamburger__button__bar1{top:14px}
	.l-header__hamburger__button__bar3{bottom:10px}
	.l-header__hamburger__nav{top:60px}

	/* --- ヒーロー: 縦圧縮+キャッチ強化+価格ジャンプ+CTA同幅 --- */
	.main_visual{padding-bottom:0}
	.main_visual__wrap__box{padding:80px 0 0;gap:20px}
	.hero_en{font-size:1.1rem;letter-spacing:0.22em;margin-bottom:10px}
	.main_copy{font-size:2.4rem;line-height:1.6;margin-bottom:14px}
	.main_copy .mk{padding:2px 8px}
	.main_copy .line:nth-child(3),
	.main_copy .line:nth-child(4){display:inline-block}
	.sub_copy{font-size:1.3rem;line-height:1.7;margin-bottom:4px}
	.hero_price{font-size:1.4rem;margin-bottom:8px;display:flex;align-items:baseline;gap:4px}
	.hero_price__num{
		font-family:'Roboto Condensed',sans-serif;font-weight:700;font-size:3.8rem;line-height:1.1;
		background:#f6aea9;padding:0 8px;letter-spacing:0;
	}
	.hero_price__unit{font-size:1.6rem;font-weight:bold}
	.main_visual .text{font-size:1.4rem;line-height:1.9;margin-bottom:18px}
	.main_visual .text .hl{padding:2px 4px}
	.hero_btns{flex-direction:column;gap:12px}
	.hero_btns .o_c_b{width:100%;max-width:330px}
	/* イラスト接地+黄帯再調整 */
	.main_visual::before{height:52%;clip-path:polygon(0 22%,100% 0,100% 100%,0 100%)}
	.main_visual__wrap__box__images{width:96%;margin:0 auto;padding:14px 0 0}
	.hero_mock{filter:drop-shadow(0 10px 24px rgba(0,0,0,.15))}

	/* --- タイポ階調の再構築 --- */
	.o-c-common__headline__ja{font-size:2.2rem;letter-spacing:0.12em}
	.o-c-common__headline{margin:0 0 32px}
	.sec_lead{font-size:1.4rem;line-height:1.9}
	.bg_base,.bg,.bg__fff{padding:64px 0}
	.bg__orange{padding:64px 0}
	/* 白背景セクションのゴースト英字を1段濃く */
	.bg__fff .o-c-common__headline__en{color:#f1ede4}

	/* --- PROBLEM: 左右交互+しっぽ再設計+中央イラスト座布団 --- */
	.problem__radial{gap:26px;align-items:stretch}
	.problem__center{
		position:relative;width:170px;height:170px;margin:0 auto 6px;order:-1;
		background:#fff;border:3px solid #000;border-radius:50%;overflow:hidden;
		box-shadow:5px 5px 0 0 #c5221f;
	}
	.problem__center img{width:100%;height:100%;object-fit:cover;object-position:top}
	.problem__bubble{width:88%;max-width:480px}
	.problem__bubble--p1,.problem__bubble--p3,.problem__bubble--p5{align-self:flex-start;transform:rotate(-0.6deg)}
	.problem__bubble--p2,.problem__bubble--p4,.problem__bubble--p6{align-self:flex-end;transform:rotate(0.6deg)}
	.problem__bubble::before,.problem__bubble::after{inset:auto;margin:0;border:none;display:block}
	.problem__bubble--p1::before,.problem__bubble--p3::before,.problem__bubble--p5::before{
		content:"";position:absolute;right:36px;bottom:-14px;
		border-style:solid;border-width:14px 0 0 16px;border-color:#000 transparent transparent transparent}
	.problem__bubble--p1::after,.problem__bubble--p3::after,.problem__bubble--p5::after{
		content:"";position:absolute;right:39px;bottom:-7px;
		border-style:solid;border-width:9px 0 0 10px;border-color:#fff transparent transparent transparent}
	.problem__bubble--p2::before,.problem__bubble--p4::before,.problem__bubble--p6::before{
		content:"";position:absolute;left:36px;bottom:-14px;
		border-style:solid;border-width:14px 16px 0 0;border-color:#000 transparent transparent transparent}
	.problem__bubble--p2::after,.problem__bubble--p4::after,.problem__bubble--p6::after{
		content:"";position:absolute;left:39px;bottom:-7px;
		border-style:solid;border-width:9px 10px 0 0;border-color:#fff transparent transparent transparent}
	.problem__bubble h3{font-size:1.6rem}
	.problem__bubble p{font-size:1.4rem;line-height:1.9}

	/* --- CONCEPT: 自然折返し+黄座布団 --- */
	.concept__contents{gap:28px}
	.concept__contents__image{width:86%;margin:0 auto;box-shadow:8px 8px 0 0 #ea4335}
	.concept__contents__unit__text{font-size:1.4rem;line-height:1.95;margin-bottom:26px}
	.concept__contents__unit__text span{display:inline}

	/* --- ABOUT: フロー2×2グリッド --- */
	.mech__flow{display:grid;grid-template-columns:1fr 1fr;gap:14px;counter-reset:mech}
	.mech__flow__arrow{display:none}
	.mech__flow__item{width:auto;padding:20px 10px 16px;position:relative;counter-increment:mech;border-radius:10px}
	.mech__flow__item::before{
		content:counter(mech,decimal-leading-zero);position:absolute;top:-10px;left:-6px;
		background:#000;color:#ea4335;font-family:'Montserrat',sans-serif;font-weight:bold;font-size:1.2rem;
		width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center}
	.mech__flow__icon{width:64px;height:64px}
	.mech__flow__item p{font-size:1.3rem;margin-top:10px}
	.mech__closing__text{font-size:1.4rem;line-height:1.9}

	/* --- CTAバナー: 人物を右下に添える+見出し強化 --- */
	.banner__content{padding:64px 5%}
	.banner__content .message{font-size:2rem}
	.banner__content__btns .human{position:absolute;right:-4px;bottom:-30px;width:96px;margin:0;z-index:0}
	.banner__content__btns .o_c_b-big{position:relative;z-index:1;max-width:82%}
	.banner__cta_set{gap:18px}
	.banner__cta_unit p{font-size:1.3rem}
	.banner__cta_unit small{font-size:1.2rem}

	/* --- FUNCTION: 02〜06をコンパクト行型+黒影 --- */
	.feature__unit__item{margin-bottom:32px;padding:24px 20px;box-shadow:5px 5px 0 0 rgba(0,0,0,.85)}
	.feature__unit__item__number{float:left;font-size:3.4rem;line-height:1;margin:0 14px 4px 0}
	.feature__unit__item__headline{font-size:1.7rem;margin-bottom:10px;padding-top:6px}
	.feature__unit__item__text{font-size:1.3rem}
	.feature__unit__item:nth-of-type(1){padding:30px 22px}
	.feature__unit__item:nth-of-type(1) .feature__unit__item__number{float:none;font-size:6rem}

	/* --- FLOW: 点線の背骨+本文14px --- */
	.step__contents{position:relative}
	.step__contents::before{content:"";position:absolute;left:43px;top:20px;bottom:20px;border-left:2px dashed #f2b8b5;z-index:-1}
	.step__contents__unit__right p{font-size:1.4rem;line-height:1.9}
	.step__badge{font-size:1.2rem}

	/* --- PRICE: 組版事故修正+黒影+人気カード強調 --- */
	.price__cards{gap:38px}
	.price__card{box-shadow:5px 5px 0 0 rgba(0,0,0,.85)}
	.price__card--popular{transform:scale(1.02);margin:10px 0}
	.price__card__price .num{font-size:4.2rem}
	.price__card__price small{white-space:nowrap;font-size:1.2rem}
	.price__card__caution{font-size:1.2rem}

	/* --- WORKS / FAQ --- */
	.works__track span{font-size:1.2rem;line-height:1.5}
	.faq__item summary{font-size:1.4rem;min-height:56px}
	.faq__item p{font-size:1.4rem;line-height:1.9}

	/* --- 特徴(MERIT)の間隔圧縮(重なりは896px側で定義) --- */
	.merit .merit__unit + .merit__unit{margin-top:48px}

	/* --- フッター: タップ領域確保 --- */
	.l-footer__menu__list{gap:4px 18px}
	.l-footer__menu__list__item a{display:inline-block;padding:10px 4px}

	/* --- 下部固定CTAバー(固定LINEボタンを置換) --- */
	.fixed_page{display:none !important}
	body{padding-bottom:60px}
	.sp_ctabar{
		position:fixed;left:0;bottom:0;width:100%;height:60px;z-index:400;
		display:flex;border-top:3px solid #000;
	}
	.sp_ctabar a{
		flex:1;display:flex;align-items:center;justify-content:center;
		font-size:1.05rem;font-weight:bold;letter-spacing:0.04em;
	}
	.sp_ctabar__tel{background:#fff;color:#000;border-right:3px solid #000}
	.sp_ctabar__inquiry{background:#fff;color:#000;border-right:3px solid #000}
	.sp_ctabar__dl{background:#000;color:#fff}
	.sp_ctabar__line{background:#fff;color:#000}
}

/* PCでは下部バー非表示 */
@media screen and (min-width:641px){
	.sp_ctabar{display:none}
}

/* ============ 896px以下: 特徴の重なりレイアウト ============ */
@media screen and (max-width:1080px){
	.merit__unit__thumb{width:86%;margin-bottom:0}
	.merit__unit__thumb.right-to-left{margin-left:auto}
	.merit__unit__thumb.left-to-right{margin-right:auto}
	.merit__unit__content{
		width:92%;margin-top:-36px;position:relative;z-index:2;
		box-shadow:5px 5px 0 0 #c5221f;
	}
	.merit__unit:has(.right-to-left) .merit__unit__content{margin-right:auto;margin-left:0}
	.merit__unit:has(.left-to-right) .merit__unit__content{margin-left:auto;margin-right:0}
}

/* 本文内リンク（地域SEO文脈リンク）を本文に馴染ませる 2026-07-30 */
.merit__unit__content__text a{color:inherit;text-decoration:underline;text-underline-offset:2px;font-weight:700;}
.merit__unit__content__text a:hover{opacity:.7;}

/* One-sentence service definition placed under the hero sub-copy.
   Kept visually quiet but present as real text so AI answers and search
   snippets can quote a clean definition of each service. */
.svc-definition{
  margin:14px 0 0;
  font-size:13px;
  line-height:1.85;
  color:#4a5560;
  max-width:60ch;
}
@media(max-width:768px){
  .svc-definition{font-size:12px;line-height:1.8;margin-top:10px}
}

/* 2026-09-24 端末差の補正: 見出しが画面幅によって「〜来な／い」のように
   1文字だけ次行に落ちていたため、文節単位で折り返す(非対応ブラウザは従来どおり) */
h1,h2,h3,h4,.price__compare th,.price__compare td{word-break:auto-phrase;text-wrap:pretty;overflow-wrap:anywhere}

/* =========================================================
   /seo 専用 (2026-10-09)
   共通部品は homepage.css の複製(上)をそのまま使い、
   このページ固有の「検索画面の図・沖縄の4項目・比較表・料金1枚」だけをここに足す
========================================================= */

/* ---------- ヒーロー右: 地図の枠＋検索結果の図 ---------- */
.main_visual--seo .main_visual__wrap__box__images{
	right:3%;bottom:auto;top:50%;transform:translateY(-44%);width:min(500px,40%);
}
.serpmap{
	margin:0;background:#fff;border:3px solid #000;border-radius:16px;padding:22px 22px 18px;
	box-shadow:9px 9px 0 0 #000;font-size:1.3rem;line-height:1.5;
}
.serpmap__query{
	display:flex;align-items:center;gap:10px;border:1px solid #d6d6d6;border-radius:24px;
	padding:10px 18px;font-size:1.6rem;font-weight:bold;letter-spacing:.04em;margin-bottom:16px;
}
.serpmap__query svg{width:18px;height:18px;fill:none;stroke:#888;stroke-width:2;stroke-linecap:round;flex:none}
.serpmap__map{position:relative;height:128px;border-radius:10px 10px 0 0;background:#eef1e8;overflow:hidden}
.serpmap__roads{position:absolute;inset:0;width:100%;height:100%}
.serpmap__roads path{fill:none;stroke:#fff;stroke-width:9;stroke-linecap:round}
.serpmap__roads path.thin{stroke-width:4}
.serpmap__pin{
	position:absolute;width:28px;height:28px;margin:-36px 0 0 -14px;border-radius:50%;
	background:#9aa0a6;color:#fff;font-family:'Roboto Condensed',sans-serif;
	font-weight:700;font-size:1.3rem;display:grid;place-items:center;
}
.serpmap__pin::after{
	content:"";position:absolute;left:50%;top:100%;margin-left:-6px;border:6px solid transparent;border-top:9px solid #9aa0a6;border-bottom:0;
}
.serpmap__pin.is-you{background:#000;color:#ea4335;width:34px;height:34px;margin:-44px 0 0 -17px;box-shadow:0 0 0 4px #ea4335}
.serpmap__pin.is-you::after{border-top-color:#000}
.serpmap__places{border:1px solid #e3e3e3;border-top:none;border-radius:0 0 10px 10px;margin-bottom:16px}
.serpmap__places li{display:flex;align-items:center;gap:12px;padding:9px 14px;border-top:1px solid #eee}
.serpmap__places li:first-child{border-top:none}
.serpmap__places b{
	flex:none;width:22px;height:22px;border-radius:50%;background:#9aa0a6;color:#fff;font-size:1.1rem;
	display:grid;place-items:center;font-family:'Roboto Condensed',sans-serif;
}
.serpmap__places li > span{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;font-weight:bold}
.serpmap__places small{font-weight:normal;font-size:1.15rem;color:#666}
.serpmap__places i,.serpmap__organic--other i{display:block;height:8px;border-radius:4px;background:#ececec}
.serpmap__places i:first-child{width:46%}
.serpmap__places i:last-child{width:70%}
.serpmap__places li.is-you{background:#fce8e6}
.serpmap__places li.is-you b{background:#000;color:#ea4335}
.serpmap em{
	flex:none;font-size:1.1rem;font-weight:bold;background:#000;color:#ea4335;padding:3px 8px;border-radius:4px;letter-spacing:.06em;
}
.serpmap__organic{position:relative;padding:12px 14px;border-radius:8px}
.serpmap__organic.is-you{background:#fce8e6;padding-right:64px}
.serpmap__organic.is-you em{position:absolute;right:12px;top:12px}
.serpmap__organic small{display:block;font-size:1.15rem;color:#666;font-family:'Roboto Condensed',sans-serif}
.serpmap__organic p{font-size:1.6rem;font-weight:bold;color:#1a0dab;margin-top:4px;line-height:1.5}
.serpmap__organic--other{padding-top:14px}
.serpmap__organic--other i{margin-bottom:8px}
.serpmap__organic--other i:nth-child(1){width:34%}
.serpmap__organic--other i:nth-child(2){width:80%;height:11px;background:#e4e4ee}
.serpmap__organic--other i:nth-child(3){width:90%;margin-bottom:0}
@media screen and (max-width:1080px){
	.main_visual--seo .main_visual__wrap__box__content{width:52%}
}
@media screen and (max-width:896px){
	.main_visual--seo .main_visual__wrap__box__images{position:relative;right:auto;top:auto;transform:none;width:100%;max-width:460px}
	.main_visual--seo .main_visual__wrap__box__content{width:100%}
}
@media screen and (max-width:640px){
	.main_visual--seo .main_visual__wrap__box__images{padding:6px 0 40px}
	.serpmap{padding:16px 14px 14px;border-radius:12px;box-shadow:6px 6px 0 0 #000}
	.serpmap__query{font-size:1.4rem;padding:8px 14px;margin-bottom:12px}
	.serpmap__map{height:96px}
	.serpmap__places li{padding:8px 10px}
	.serpmap__organic p{font-size:1.4rem}
}

/* ---------- お悩み(4つ版): 上側の弧だけを使うので高さを詰める ---------- */
.problem__radial--four{height:700px}
.problem__radial--four .problem__bubble--p2,
.problem__radial--four .problem__bubble--p5{top:40%}
.problem__radial--four .problem__bubble--p3,
.problem__radial--four .problem__bubble--p4{top:4%}
.problem__radial--four .problem__bubble--p2::before,
.problem__radial--four .problem__bubble--p2::after{right:auto}
.problem__radial--four .problem__bubble--p2::before{right:-19px}
.problem__radial--four .problem__bubble--p2::after{right:-13px}
@media screen and (max-width:896px){.problem__radial--four{height:auto}}

/* ---------- 地域検索の4項目 ---------- */
.okinawa__list{border-top:2px solid #000}
.okinawa__row{display:grid;grid-template-columns:200px 1fr;gap:40px;padding:44px 0;border-bottom:1px solid #ddd}
.okinawa__ill{margin:0;width:160px}
.okinawa__ill svg{display:block;width:100%;height:auto;overflow:visible}
.okinawa__ill svg *{fill:none;stroke:#000;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.okinawa__ill .ill-w{fill:#fff}
.okinawa__ill .ill-a,.okinawa__ill .ill-pin{fill:#ea4335}
.okinawa__ill .ill-s{fill:#fce8e6}
.okinawa__ill .ill-t{stroke:#999;stroke-width:2}
.okinawa__ill .ill-h{stroke-width:7}
.okinawa__ill .ill-c{stroke:#ea4335;stroke-width:4.5}
.okinawa__body h3{font-size:2.4rem;font-weight:bold;letter-spacing:.06em;line-height:1.5;margin-bottom:16px}
.okinawa__body p{font-size:1.5rem;line-height:2.1;max-width:44em;word-break:auto-phrase}
.okinawa__query{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.okinawa__query span{
	display:inline-flex;align-items:center;gap:8px;font-size:1.4rem;font-weight:bold;letter-spacing:.04em;
	padding:6px 14px 6px 12px;border:1px solid #cfcfcf;border-radius:4px;background:#fff;line-height:1.5;
}
.okinawa__query span::before{
	content:"";width:9px;height:9px;border:2px solid #888;border-radius:50%;flex:none;
	box-shadow:4px 4px 0 -2px #888;
}
.area{margin-top:80px;display:grid;grid-template-columns:200px 1fr;gap:40px}
.area__head{font-size:2.2rem;font-weight:bold;letter-spacing:.1em;line-height:1.5}
.area__head small{display:block;font-size:1.3rem;font-weight:normal;letter-spacing:.04em;line-height:1.8;margin-top:10px;color:#444}
.area__list > div{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:14px 0;border-top:1px solid #eee}
.area__list > div:last-child{border-bottom:1px solid #eee}
.area__list dt{font-size:1.4rem;font-weight:bold;letter-spacing:.06em}
.area__list dd{font-size:1.4rem;line-height:1.9}
@media screen and (max-width:896px){
	.okinawa__row,.area{grid-template-columns:1fr;gap:16px}
	.okinawa__ill{width:130px}
}
@media screen and (max-width:640px){
	.okinawa__row{padding:32px 0}
	.okinawa__ill{width:104px}
	.okinawa__body h3{font-size:1.9rem;margin-bottom:12px}
	.okinawa__body p{font-size:1.4rem;line-height:1.95}
	.okinawa__query{gap:8px}
	.okinawa__query span{font-size:1.25rem;padding:5px 10px}
	.area{margin-top:52px}
	.area__head{font-size:1.9rem}
	.area__list > div{grid-template-columns:1fr;gap:4px;padding:12px 0}
	.area__list dd{font-size:1.3rem}
}

/* ---------- 実施内容の本文リンク ---------- */
.feature__unit__item__text a{color:inherit;text-decoration:underline;text-underline-offset:2px;font-weight:700}

/* ---------- 比較表 ---------- */
.compare__wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.compare__table{width:100%;min-width:760px;border-collapse:collapse;table-layout:fixed}
.compare__table th,.compare__table td{padding:20px 18px;font-size:1.4rem;line-height:1.7;border-bottom:1px solid #e3e3e3;vertical-align:top;text-align:left}
.compare__table thead th{font-size:1.5rem;font-weight:bold;letter-spacing:.06em;border-bottom:2px solid #000;padding-top:0;vertical-align:bottom}
.compare__table thead th:first-child{width:17%}
.compare__table tbody th{font-weight:bold;letter-spacing:.04em;white-space:nowrap}
.compare__table .is-us{background:#fce8e6}
.compare__table thead th.is-us{background:#ea4335;padding-top:18px;border-radius:10px 10px 0 0}
.compare__table td.is-us strong{font-size:1.6rem}
.compare__table td:not(.is-us){color:#555}
.compare__note{font-size:1.25rem;color:#666;margin-top:16px;line-height:1.8}
@media screen and (max-width:640px){
	.compare__wrap{margin-right:-5vw;padding-right:5vw}
	.compare__table{min-width:600px}
	.compare__table th,.compare__table td{padding:14px 12px;font-size:1.25rem}
	.compare__table td.is-us strong{font-size:1.4rem}
}

/* ---------- 料金(1プラン): カード＋内訳表 ---------- */
.price__single{display:grid;grid-template-columns:420px 1fr;gap:56px;align-items:center;max-width:1000px;margin:0 auto}
.price--single .price__card{width:100%;min-width:0}
.price__detail{background:#fff;border:3px solid #000;border-radius:10px;padding:16px 34px 26px}
.price__detail table{width:100%;border-collapse:collapse}
.price__detail th,.price__detail td{padding:16px 0;font-size:1.5rem;line-height:1.6;border-bottom:1px dashed #ccc;text-align:left;vertical-align:top}
.price__detail th{width:9.5em;font-weight:bold;letter-spacing:.04em}
.price__detail__why{font-size:1.3rem;line-height:1.8;color:#333;padding-top:14px;border-top:2px solid #000}
.price--single .price__footnote{max-width:46em;margin-left:auto;margin-right:auto;word-break:auto-phrase}
@media screen and (max-width:1080px){.price__single{grid-template-columns:1fr;gap:40px;max-width:560px}}
@media screen and (max-width:640px){
	.price__detail{padding:8px 18px 18px}
	.price__detail th,.price__detail td{font-size:1.3rem;padding:12px 0}
	.price__detail th{width:7.6em}
	.price--single .price__footnote{font-size:1.3rem;text-align:left}
}

/* ---------- FAQ下のブログ導線(homepageのSEO節と同じ見た目) ---------- */
.faq .seo__caution{width:auto;max-width:none}

/* 比較表: スマホは項目ごとの縦積み(WINXCYを先頭に強調、他2列は小さく) */
@media screen and (max-width:640px){
	.compare__wrap{overflow:visible;margin-right:0;padding-right:0}
	.compare__table,.compare__table tbody,.compare__table tr,.compare__table th,.compare__table td{display:block;width:auto;min-width:0}
	.compare__table thead{display:none}
	.compare__table tr{padding:18px 0;border-bottom:1px solid #e3e3e3}
	.compare__table tr:first-child{border-top:2px solid #000}
	.compare__table th,.compare__table td{padding:0;border:none}
	.compare__table tbody th{font-size:1.5rem;margin-bottom:10px}
	.compare__table td{display:grid;grid-template-columns:7.5em 1fr;gap:10px;font-size:1.25rem;line-height:1.7;padding:6px 0}
	.compare__table td::before{content:attr(data-label);font-weight:bold;color:#000;font-size:1.15rem}
	.compare__table td.is-us{padding:10px 12px;border-radius:6px;margin-bottom:4px}
	.compare__table td.is-us::before{color:#000}
}
@media screen and (max-width:640px){
	.compare__table td.is-us{display:block}
	.compare__table td.is-us::before{display:block;margin-bottom:2px}
}
.main_visual--seo .sub_copy{word-break:auto-phrase;text-wrap:pretty}

/* ---------- 出典 ---------- */
.merit__source{font-size:1.2rem;line-height:1.7;margin-top:16px;color:#555}
.merit__source a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.merit__source cite{font-style:normal}

/* ---------- 関連記事 ---------- */
.related{margin-top:48px;border-top:2px solid #000;padding-top:22px}
.related__head{font-size:1.8rem;font-weight:bold;letter-spacing:.06em;margin-bottom:8px}
.related__list li{border-bottom:1px solid #ddd}
.related__list a{display:block;padding:16px 0;font-size:1.5rem;font-weight:bold;line-height:1.7;word-break:auto-phrase}
.related__list small{display:block;font-size:1.15rem;font-weight:normal;color:#555;letter-spacing:.08em}
.related__list em{display:inline-block;margin-left:8px;font-style:normal;color:#ea4335;transition:transform .2s}
.related__list a:hover em{transform:translateX(4px)}
@media screen and (max-width:640px){
	.related{margin-top:36px}
	.related__head{font-size:1.6rem}
	.related__list a{font-size:1.4rem;padding:14px 0}
}