@charset "utf-8";
/* sale.css v3（LP専用）: つめつめ解消 / センター寄せ / ボタン&追従CTAを強制安定 */
.ysl-lp{--bg:#eae9e6;--alt:#e4e5d6;--text:#585d3d;--muted:#6b6b58;--border:#c8c9b5;--primary:#585d3d;--primary2:#a5a492;--radius:18px;--shadow:0 14px 34px rgba(0,0,0,.08);--w:1040px;--g:22px;color:var(--text);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic","Meiryo",sans-serif;line-height:1.85;letter-spacing:.02em;font-size:16px}
.ysl-lp,.ysl-lp *{box-sizing:border-box}
.ysl-lp h1,.ysl-lp h2,.ysl-lp h3,.ysl-lp p,.ysl-lp ul,.ysl-lp ol,.ysl-lp li{margin:0;padding:0}
.ysl-lp ul,.ysl-lp ol{list-style:none}
.ysl-lp img{max-width:100%;height:auto;border:0;vertical-align:middle}
.ysl-lp a{text-decoration:none;color:inherit}
.ysl-lp button{font:inherit;border:0;background:transparent;cursor:pointer}
.ysl-container{width:min(var(--w),calc(100% - (var(--g)*2)));margin:0 auto}

/* テーマ側の「main p」「section padding」などの干渉をLP内で無効化 */
.ysl-lp section,.ysl-lp header,.ysl-lp footer{padding:0 !important}
.ysl-lp p{margin:0}
.ysl-lp [id]{scroll-margin-top:92px}

/* セクション余白（つめつめ解消） */
.ysl-section{padding:72px 0}
.ysl-section--alt{background:var(--alt);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
@media(max-width:600px){.ysl-section{padding:56px 0}.ysl-lp{font-size:15px}}

/* 見出し・本文 */
.ysl-h2{text-align:center;font-size:26px;line-height:1.35;letter-spacing:.05em;margin-bottom:18px}
.ysl-h2:after{content:"";display:block;width:64px;height:4px;border-radius:999px;background:var(--primary);margin:14px auto 0;opacity:.6}
.ysl-h3{font-size:20px;line-height:1.45;margin-bottom:12px}
.ysl-p{font-size:15px;color:var(--text);margin-top:14px !important}
.ysl-p--small{font-size:13px;color:var(--muted)}
.ysl-center{text-align:center}
.ysl-br{display:none}
@media(min-width:768px){.ysl-br{display:inline}}
.ysl-br-sp{display:inline}
@media(min-width:768px){.ysl-br-sp{display:none}}

/* HERO：センターで“LPっぽく” */
.ysl-hero{padding:74px 0 82px;background:linear-gradient(180deg,#e4e5d6,#eae9e6 62%);border-bottom:1px solid var(--border)}
.ysl-hero .ysl-container{text-align:center}
.ysl-hero__kicker{display:inline-flex;align-items:center;gap:8px;font-size:2rem;color:var(--muted);background:rgba(255,255,255,.7);border-radius:10px;padding:9px 25px !important;margin-bottom:14px}
.ysl-hero__title{font-size:40px;line-height:1.22;letter-spacing:.05em}
.ysl-hero__lead{margin-top:16px !important;font-size:16px;color:var(--text)}
.ysl-hero__note{margin:18px auto 0 !important;max-width:950px;font-size:13px;color:var(--muted);background:rgba(255,255,255,.9);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;box-shadow:0 12px 26px rgba(0,0,0,.05);text-align:left}
@media(max-width:420px){.ysl-hero{padding:56px 0 62px}.ysl-hero__title{font-size:30px}.ysl-h2{font-size:22px}}

/* CTA：ボタンを中央揃え＆テーマのボタン定義に負けない */
.ysl-cta{margin-top:22px;text-align:center}
.ysl-btn{display:inline-flex !important;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 22px;border-radius:999px;font-weight:900;letter-spacing:.06em;user-select:none;transition:transform .15s ease,filter .15s ease,box-shadow .15s ease}
.ysl-btn--primary{background:var(--primary) !important;color:#fff !important;box-shadow:0 16px 34px rgba(228,122,140,.32) !important}
.ysl-btn--primary:after{content:"→";font-weight:900;opacity:.95}
.ysl-btn--primary:hover{filter:brightness(1.03);transform:translateY(-1px)}
.ysl-cta__meta{margin-top:10px !important;font-size:12px;color:var(--muted);line-height:1.6}

/* リスト（詰まりすぎを防いで読みやすく） */
.ysl-list{margin-top:14px !important;display:grid;gap:12px}
.ysl-list li{position:relative;padding-left:32px;font-size:15px;color:var(--text)}
.ysl-list li:before{content:"✓";position:absolute;left:10px;top:0;color:var(--primary);font-weight:900}
.ysl-list--inline{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:14px !important}
.ysl-list--inline li{padding:9px 34px;border:1px solid var(--border);border-radius:999px;background:#fff;font-size:13px;color:var(--muted)}
.ysl-list--inline li:before{content:none}

/* ステップ：余白増・カード感 */
.ysl-steps{margin-top:20px !important;display:grid;gap:14px}
.ysl-step{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;padding:18px 18px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 12px 28px rgba(0,0,0,.06);transition:transform .15s ease,box-shadow .15s ease}
.ysl-step:hover{transform:translateY(-1px);box-shadow:0 16px 36px rgba(0,0,0,.08)}
.ysl-step__num{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-weight:900;color:#fff;background:var(--primary)}
.ysl-step__title{font-size:15px;font-weight:900;line-height:2}
.ysl-step__desc{margin-top:7px !important;font-size:13px;color:var(--muted)}
.ysl-steps--compact .ysl-step{padding:16px 18px}
.ysl-steps--compact .ysl-step__desc{display:none}

/* カード（向き不向き/安心/フォーム） */
.ysl-grid2{margin-top:20px !important;display:grid;gap:16px}
@media(min-width:860px){.ysl-grid2{grid-template-columns:1fr 1fr;gap:20px}}
.ysl-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px 20px;box-shadow:var(--shadow)}
.ysl-card--ng{border-left:7px solid #93a2b2}
.ysl-card--ok{border-left:7px solid var(--primary)}
.ysl-metrics{margin-top:20px !important;display:grid;gap:14px}
@media(min-width:720px){.ysl-metrics{grid-template-columns:1fr 1fr;gap:18px}}
.ysl-metric{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:22px 20px;box-shadow:var(--shadow)}
.ysl-metric__label{font-size:20px;color:var(--muted)}
.ysl-metric__value{margin-top:8px !important;font-weight:950;font-size:36px;letter-spacing:.03em}
.ysl-metric__unit{font-size:20px;color:var(--muted);font-weight:normal;margin-left:6px}
.ysl-callout{margin-top:18px !important;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px 20px;box-shadow:var(--shadow)}
.ysl-form{margin-top:18px !important;background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.ysl-form iframe{display:block;width:100%;border:0}

/* フッター（LP内） */
.ysl-footer{padding:26px 0 32px;border-top:1px solid var(--border);background:#fff}
.ysl-top{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--border);color:var(--muted);background:#fff;transition:transform .15s ease,filter .15s ease}
.ysl-top:hover{filter:brightness(1.02);transform:translateY(-1px)}

/* 追従CTA：スリムバー */
.ysl-fixed-cta{position:fixed;left:0;right:0;bottom:0;z-index:99999;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-top:1px solid var(--border);padding:10px 20px;box-shadow:0 -4px 16px rgba(0,0,0,.08)}
.ysl-fixed-cta__txt{font-size:14px;color:var(--text);font-weight:700;flex:1;line-height:1.4}
.ysl-fixed-cta__actions{flex-shrink:0}
.ysl-fixed-cta__btn{min-height:40px;padding:0 20px;border-radius:999px;background:var(--primary) !important;color:#fff !important;font-weight:900;font-size:14px;letter-spacing:.05em;border:0 !important;white-space:nowrap}
.ysl-fixed-cta__btn:hover{filter:brightness(1.03);transform:translateY(-1px)}
/* 下の被り回避（スリムバー分） */
.ysl-lp{padding-bottom:72px}

/* === readability & spacing patch === */
.ysl-lp{font-size:17px;line-height:1.95}
@media(max-width:600px){.ysl-lp{font-size:16px;line-height:1.95}}
.ysl-container{width:min(1060px,calc(100% - 32px))}
@media(max-width:600px){.ysl-container{width:calc(100% - 24px)}}

.ysl-section{padding:92px 0}
@media(max-width:600px){.ysl-section{padding:72px 0}}
.ysl-hero{padding:84px 0 92px}
@media(max-width:600px){.ysl-hero{padding:64px 0 74px}}

.ysl-h2{font-size:30px;margin-bottom:22px;letter-spacing:.06em}
@media(max-width:600px){.ysl-h2{font-size:24px}}
.ysl-hero__title{font-size:44px;line-height:1.18}
@media(max-width:600px){.ysl-hero__title{font-size:32px;line-height:1.22}}

.ysl-p{font-size:20px;margin-top:18px !important}
.ysl-p--small{font-size:14px;line-height:1.8}
.ysl-hero__lead{font-size:20px}
.ysl-hero__note{font-size:20px;line-height:2;padding:20px 22px}

.ysl-list{gap:16px;margin-top:18px !important}
.ysl-list li{font-size:20px;line-height:1.9;padding-left:36px}
.ysl-list li:before{left:12px;top:.05em}

.ysl-steps{gap:18px;margin-top:26px !important}
.ysl-step{padding:22px 22px;gap:16px}
.ysl-step__title{font-size:20px}
.ysl-step__desc{font-size:18px;line-height:1.85;margin-top:9px !important}

.ysl-card{padding:24px 24px}
.ysl-card .ysl-list{gap:14px}
.ysl-card .ysl-list li{font-size:18px}

.ysl-metric{padding:26px 24px}
.ysl-metric__value{font-size:40px}
@media(max-width:600px){.ysl-metric__value{font-size:34px}}

.ysl-cta{margin-top:45px}
.ysl-btn{min-height:56px;padding:0 26px;font-size:16px}
.ysl-cta__meta{font-size:14px;line-height:1.75}

.ysl-form{margin-top:26px !important}
.ysl-callout{padding:24px 24px}

/* === spacing / readability / CTA colors patch v2 === */
.ysl-lp{--primary:#585d3d;--primary2:#a5a492;--fixed:#585d3d;--bg:#eae9e6;--txt:#585d3d;--muted:#6b6b58;font-size:20px;line-height:2;color:var(--txt)}
@media(max-width:600px){.ysl-lp{font-size:16px}}
.ysl-lp .ysl-container{width:min(1100px,calc(100% - 40px))}
@media(max-width:600px){.ysl-lp .ysl-container{width:calc(100% - 28px)}}

/* セクション余白を“強制的に”増やす（詰まりの主因） */
.ysl-lp .ysl-section{padding:80px 0 !important}
@media(max-width:600px){.ysl-lp .ysl-section{padding:30px 0 !important}}
.ysl-lp .ysl-hero{padding:96px 0 110px !important}
@media(max-width:600px){.ysl-lp .ysl-hero{padding:72px 0 84px !important}}

/* 見出し・本文の余白（テンプレ側で潰されても戻す） */
.ysl-lp h1,.ysl-lp h2,.ysl-lp h3{line-height:1.5}
.ysl-lp .ysl-hero__kicker{margin:0 0 40px !important}
.ysl-lp .ysl-hero__title{margin:0 0 22px !important;font-size:40px}
@media(max-width:600px){.ysl-lp .ysl-hero__title{font-size:22px}}
.ysl-lp .ysl-hero__lead{margin:0 0 10px !important;font-size:18px;line-height:2;}
.ysl-lp .ysl-hero__note{margin:22px auto 0 !important;padding:22px 24px;border-radius:16px;text-align: center;}
.ysl-lp .ysl-h2{margin:0 0 35px !important;font-size:30px}
@media(max-width:600px){.ysl-lp .ysl-h2{font-size:20px}}
.ysl-lp .ysl-p{margin:18px auto 0 !important;font-size:20px;line-height:2;max-width: 750px}
.ysl-lp .ysl-p--small{font-size:14px;line-height:1.9;text-align: center;}
.ysl-lp .ysl-section .ysl-cta{margin-top:34px !important}
.ysl-lp .ysl-cta__meta{margin-top:20px !important}

/* リスト/ステップの行間と間隔 */
.ysl-lp .ysl-list{margin:22px auto 0 !important;gap:18px;max-width: 800px}
.ysl-lp .ysl-list li{line-height:2;padding-left:38px}
.ysl-lp .ysl-steps{margin:32px auto 0 !important;gap:18px; max-width: 700px;}
.ysl-lp .ysl-step{padding:30px 24px 24px 55px;gap:16px}
.ysl-lp .ysl-step__desc{margin-top:10px !important;line-height:1.9}

/* カード/数値ブロックも詰まり解消 */
.ysl-lp .ysl-card{padding:26px 15px}
.ysl-lp .ysl-grid2{gap:40px;margin-top:45px !important}
.ysl-lp .ysl-metrics{gap:18px;margin-top:22px !important;max-width: 650px;text-align: center;}
.ysl-lp .ysl-metric{padding:28px 26px}
.ysl-lp .ysl-metric__value{font-size:42px}
@media(max-width:600px){.ysl-lp .ysl-metric__value{font-size:34px}}

/* ページ内CTA（ピンク系） */
.ysl-lp .ysl-btn{background:var(--primary) !important;border:1px solid rgba(0,0,0,.05);min-height:56px;padding:0 28px;border-radius:999px;font-size:15px;box-shadow:0 10px 24px rgba(228,122,140,.25)}
.ysl-lp .ysl-btn:hover{background:var(--primary2) !important;transform:translateY(-1px)}

/* 追従CTA（ページ内ボタンと色を変えて区別） */
.ysl-fixed-cta{position:fixed;left:0;right:0;bottom:14px;display:flex;justify-content:center;z-index:9999;pointer-events:none}
.ysl-fixed-cta__btn{pointer-events:auto;background:var(--fixed) !important;color:#fff !important;border:0 !important;border-radius:999px;min-height:54px;padding:0 26px;font-size:15px;box-shadow:0 14px 30px rgba(47,111,228,.25)}
.ysl-fixed-cta__btn:hover{filter:brightness(1.05)}

/* 固定ボタンと通常CTAが重なるのを防ぐ（最下部に余白を追加） */
.ysl-lp .ysl-section--form{padding-bottom:0px !important}
@media(max-width:600px){.ysl-lp .ysl-section--form{padding-bottom:0px !important}}

/* ページ上部へ戻る（真っ白問題を潰す） */
.pagetop a{background:rgba(0,0,0,.55) !important;color:#fff !important;border:1px solid rgba(255,255,255,.25) !important}
.pagetop a:hover{background:rgba(0,0,0,.75) !important}

/* ===== LP微調整パッチ（さっきのデザイン維持） ===== */
.ysl-lp{margin-top:30px;padding-bottom:90px}
.ysl-container{max-width:1100px;margin:0 auto;padding:0 20px}

/* section間の余白：110→80（PC）、モバイルは少し小さく */
.ysl-section{padding:80px 0}
@media(max-width:900px){.ysl-section{padding:56px 0}}

/* つめつめ解消：見出し/本文の余白と行間をだけ増やす */
.ysl-h2{margin:0 0 22px;line-height:1.35}
.ysl-p{margin:0 auto 18px;line-height:2;font-size:16px;max-width:760px}
.ysl-p--small{font-size:14px;line-height:1.9}
@media(max-width:900px){.ysl-p{font-size:15px}}

/* “左に傾いて見える”対策：主要パーツを中央に */
.ysl-hero,.ysl-section,.ysl-cta{text-align:center}
.ysl-p,.ysl-list,.ysl-steps,.ysl-grid2,.ysl-metrics,.ysl-callout,.ysl-form{margin-left:auto;margin-right:auto;text-align:left}

/* CTAボタンは中央・押しやすく */
.ysl-btn,.ysl-cta .ysl-btn{display:inline-flex;justify-content:center;align-items:center}
.ysl-cta--hero .ysl-btn{min-width:300px}
@media(max-width:480px){.ysl-cta--hero .ysl-btn{min-width:85%}}

/* 追従CTA：ちゃんと追従＋色をページ内ボタンと差別化 */
.ysl-fixed-cta{position:fixed;left:0;right:0;bottom:16px;z-index:9999;display:flex;justify-content:center;padding:0 12px;pointer-events:none}
.ysl-fixed-cta__btn{pointer-events:auto;max-width:520px;width:min(520px,100%);background:#c84d63;color:#fff;border:0;border-radius:999px;padding:14px 18px;font-weight:800;box-shadow:0 14px 30px rgba(200,77,99,.28)}
.ysl-fixed-cta__btn:hover{filter:brightness(1.03)}

/* ページ上部に戻るボタン：白い問題を強制解決 */
.pagetop a{background:#585d3d !important;color:#fff !important;border:1px solid rgba(255,255,255,.35) !important;box-shadow:0 12px 26px rgba(88,93,61,.25) !important}
.pagetop a:hover{filter:brightness(1.05)}

.ysl-text{max-width:760px;margin:0 auto;text-align:left;}

/* ===== HERO 背景画像（最終上書き） ===== */
.ysl-lp .ysl-hero .ysl-container{position: relative;z-index: 2;}

.ysl-lp .ysl-hero__title,.ysl-lp .ysl-hero__kicker{text-shadow: 0 6px 20px rgba(0,0,0,.2);}




/* =================================================
   HERO ファーストビュー制御（最終・最強）
================================================= */

.ysl-lp .ysl-hero{min-height: 100svh;display: grid;align-items: center;padding: 0 !important;}

.ysl-lp .ysl-hero .ysl-container{padding: 0 0 72px;}

.ysl-lp .ysl-hero__fv{text-align: center;}


@media (max-width: 420px){
  .ysl-lp .ysl-hero .ysl-container{padding: 10px 0 40px;}
  .ysl-lp .ysl-hero__title{font-size: 30px;line-height: 1.2;}
}
/* ===== HERO 背景はFVブロックだけに適用 ===== */
.ysl-lp .ysl-hero{background: none !important;padding: 0 !important;}

/* FV＝ファーストビュー領域 */
.ysl-lp .ysl-hero__fv{min-height: 120svh;display: grid;align-items: center;background-image:linear-gradient(180deg, rgba(0,0,0,.35), rgba(255,255,255,.9) 70%),url("../images/sale-images/main.png");background-size: cover;background-position: center;background-repeat: no-repeat;}

.ysl-lp .ysl-hero__fv .ysl-container{position: relative;z-index: 2;margin: 70px 0 0;text-align: center;}

.ysl-lp .ysl-hero__title,.ysl-lp .ysl-hero__kicker{text-shadow: 0 6px 20px rgba(0,0,0,.2);}

/* FVの下は通常背景（白） */
.ysl-lp .ysl-hero__below{background: #fff;padding: 40px 0 0;}

/* スマホ調整 */
@media (max-width: 420px){.ysl-lp .ysl-hero__fv .ysl-container{ padding: 56px 0; }.ysl-lp .ysl-hero__title{ font-size: 20px; line-height: 2; }}

/* hero bg pc/sp + pc right align */
.ysl-lp .ysl-hero__fv{background:url("../images/sale-images/hero-pc.webp") center/cover no-repeat}
@media(max-width:600px){.ysl-lp .ysl-hero__fv{background:url("../images/sale-images/hero-sp.webp") center/cover no-repeat}}
@media(min-width:768px){.ysl-lp .ysl-hero__fv .ysl-container{text-align:center}.ysl-lp .ysl-hero__fv .ysl-container>*{margin-left:auto;margin-right:0}}
@media(max-width:767px){.ysl-lp .ysl-hero__fv .ysl-container{text-align:center}}

/* hero text position adjust */
@media(min-width:768px){
	.ysl-lp .ysl-hero__fv .ysl-container{max-width:850px;margin-left:auto;margin-right:2%;text-align:center;}
}
@media(max-width:767px){
  .ysl-lp .ysl-hero__fv .ysl-container{max-width:100%;margin:0 auto;text-align:center;}
}

@media(max-width:600px){
	.ysl-lp .ysl-hero__fv{min-height: 76svh;}
	.ysl-lp .ysl-hero__kicker{margin:0 0 30px !important;line-height: 1.6;font-size: 24px;}
	.ysl-hero__note{font-size:18px;}
	.ysl-list li{font-size:19px;}
	.ysl-lp .ysl-p {font-size:18px;}
	.ysl-lp .ysl-step{padding: 30px 20px 24px;}
	.ysl-step__num{font-size:20px;font-weight: normal;}
}

/* =========================
   Evidence mini block
========================= */
.ysl-evidence{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;padding:18px 16px 16px;box-shadow:0 10px 24px rgba(0,0,0,.04);}

.ysl-evidence__kicker{
  margin:0 0 10px;
  display:inline-block;
  font-size:13px;
  letter-spacing:.08em;
  padding:6px 10px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:999px;
  opacity:.85;
}

.ysl-evidence__grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}

.ysl-evidence__item{
  border:1px solid rgba(0,0,0,.06);
  border-radius:14px;
  padding:12px;
}

.ysl-evidence__label{
  font-size:18px;
  opacity:.7;
  margin-bottom:6px;
}

.ysl-evidence__value{
  align-items:baseline;
  gap:6px;
}

.ysl-evidence__num{
  font-size:34px;
  font-weight:700;
}

.ysl-evidence__unit{
  font-size:14px;
  opacity:.8;
}

.ysl-evidence__note{
  font-size:12px;
  opacity:.6;
}

.ysl-evidence__desc{
  margin-top:12px;
  font-size:14px;
  line-height:1.7;
}

@media(max-width:820px){
  .ysl-evidence__grid{grid-template-columns:1fr;}
}

/* =========================
   Voices
========================= */
.ysl-voices{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:16px;
  margin-top:16px;
}

.ysl-voice{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  padding:16px 16px 14px;
  box-shadow:0 8px 20px rgba(0,0,0,.04);
}

.ysl-voice__text{
  margin:0;
  line-height:1.75;
  font-size:15px;
}

.ysl-voice__meta{
  margin-top:10px;
  font-size:12px;
  opacity:.7;
}

/* 販売数ありケース */
.ysl-voice__badge{
  display:inline-block;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.12);
  margin-bottom:10px;
  opacity:.85;
}

.ysl-voice--case .ysl-voice__text{
  font-weight:600;
}

.ysl-voice__fine{
  margin-top:10px;
  font-size:11px;
  opacity:.6;
  line-height:1.6;
}

@media (max-width: 820px){
  .ysl-voices{
    grid-template-columns: 1fr;
  }
}
/* =========================
   Unify Patch (FINAL)
   → とにかく統一感を出す
========================= */

/* 変数を一本化（txt/muted等の分裂を吸収） */
.ysl-lp{
  --text: var(--txt, #222);
  --muted: var(--muted, #666);
  --border: #ece6ea;
  --radius: 18px;
  --shadow-soft: 0 10px 24px rgba(0,0,0,.04);
  --shadow-card: 0 12px 28px rgba(0,0,0,.06);
}

/* セクション背景と“カード階層”を整理 */
.ysl-section--alt{
  background: var(--alt) !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

/* カード共通：影・枠・角丸を統一 */
.ysl-step,
.ysl-card,
.ysl-metric,
.ysl-callout,
.ysl-form,
.ysl-voice,
.ysl-evidence{
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-soft) !important; /* 影を全部これに寄せる */
  background: #fff !important;
}

/* hoverでビョンビョン動くと統一感が壊れるので抑える */
.ysl-step:hover{
  transform:none !important;
  box-shadow: var(--shadow-soft) !important;
}

/* Evidence：主張を弱めて“通過点”にする */
.ysl-evidence{
  padding: 16px 16px 14px !important;
}
.ysl-evidence__kicker{
  font-size: 12px !important;
  opacity: .75 !important;
}
.ysl-evidence__num{
  font-size: 32px !important;
}
.ysl-evidence__desc{
  margin: 30px 0 !important;
  font-size: 18px !important;
	line-height: 2;
  color: var(--muted) !important;
  text-align: center !important;
}

/* Voices：カード感を少し柔らかくして“体験談ゾーン”に見せる */
.ysl-voices{ margin-top: 18px !important; }
.ysl-voice{
  background: rgba(255,255,255,.92) !important;
}
.ysl-voice__text{ font-size: 15px !important;text-align: left; }
.ysl-voice__meta{ font-size: 12px !important; }

/* “反響の一例”のバッジをLPのトーンに寄せる */
.ysl-voice__badge{
  background: rgba(228,122,140,.10) !important;
  border-color: rgba(228,122,140,.25) !important;
}

/* 見出し下のバーと余白の一貫性 */
.ysl-h2{ margin-bottom: 26px !important; }
.ysl-h2:after{ opacity: .55 !important; }

/* モバイルのセクション余白が極端に小さいのを戻す（30pxは詰まる） */
@media(max-width:600px){
  .ysl-lp .ysl-section{ padding: 56px 0 !important; }
}

/* =========================
   信頼ストリップ（Hero直下）
========================= */
.ysl-section--trust{
  padding: 32px 0 !important;
  background: #fafafa;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  text-align: center;
}
.ysl-trust__label{
  font-size: 13px;
  color: var(--muted);
  letter-spacing: .08em;
  margin-bottom: 12px;
  opacity: .8;
}
.ysl-section--trust img{
  max-width: 760px;
  width: 100%;
  height: auto;
  margin: 0 auto;
  display: block;
}

/* =========================
   3カードブロック（解決策）
========================= */
.ysl-cards{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 28px !important;
}
@media(max-width: 768px){
  .ysl-cards{ grid-template-columns: 1fr; gap: 14px; }
}
.ysl-card__num{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--primary);
  color: #fff;
  font-weight: 900;
  font-size: 18px;
  display: grid;
  place-items: center;
  margin-bottom: 14px;
}
.ysl-card__title{
  font-size: 18px;
  font-weight: 900;
  line-height: 1.4;
  margin-bottom: 10px;
}
.ysl-card__body{
  font-size: 15px;
  color: var(--muted);
  line-height: 1.8;
}

/* =========================
   収益シミュレーション
========================= */
.ysl-simulation{
  margin: 36px auto 0 !important;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 28px 24px;
  box-shadow: var(--shadow-soft);
  text-align: center;
  max-width: 560px;
}
.ysl-simulation__title{
  font-size: 18px;
  font-weight: 900;
  margin-bottom: 8px;
}
.ysl-simulation__result{
  font-size: 20px;
  margin: 14px 0 10px;
  font-weight: 700;
}
.ysl-simulation__num{
  font-size: 35px;
  font-weight: 900;
  color: var(--primary);
  letter-spacing: .02em;
}
@media(max-width: 600px){
  .ysl-simulation__num{ font-size: 25px; }
}

/* 実績グリッドを3列対応（創業年を追加したため） */
.ysl-evidence__grid{
  grid-template-columns: repeat(3, 1fr) !important;
}
@media(max-width: 820px){
  .ysl-evidence__grid{ grid-template-columns: 1fr !important; }
}

/* ===== 固定CTA：スリムバー（最終上書き） ===== */
.ysl-fixed-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:99999;
  display:flex;align-items:center;justify-content:center;gap:12px;
  background:#fff;border-top:1px solid var(--border);
  padding:10px 20px;box-shadow:0 -4px 16px rgba(0,0,0,.08);
  pointer-events:auto !important;
}
.ysl-fixed-cta__txt{
  font-size:14px;color:#222;font-weight:700;flex:1;line-height:1.4;
}
.ysl-fixed-cta__actions{flex-shrink:0;}
.ysl-fixed-cta__btn{
  pointer-events:auto !important;
  max-width:none !important;width:auto !important;
  min-height:48px;padding:0 28px;border-radius:999px;
  background:var(--primary) !important;color:#fff !important;
  font-weight:900;font-size:16px;letter-spacing:.05em;
  border:0 !important;white-space:nowrap;box-shadow:none !important;
}
.ysl-fixed-cta__btn:hover{filter:brightness(1.03);transform:translateY(-1px);}
.ysl-lp{padding-bottom:72px !important;}
@media(max-width:600px){
  .ysl-fixed-cta{padding:8px 14px;gap:8px;}
  .ysl-fixed-cta__txt{font-size:12px;}
  .ysl-fixed-cta__btn{font-size:13px;padding:0 14px;min-height:36px;}
}

/* ===== 比較リード・解説ポイント ===== */
.ysl-compare__lead{font-size:15px;color:var(--muted);text-align:center;margin:0 0 20px !important;}
.ysl-point{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px;margin-bottom:16px;box-shadow:0 4px 12px rgba(0,0,0,.04);}
.ysl-point__title{font-size:15px;font-weight:900;color:var(--text);padding-bottom:10px;border-bottom:2px solid var(--border);margin-bottom:0;}
.ysl-point p{font-size:14px;line-height:1.85;color:var(--text);margin-top:10px !important;text-align:left !important;}
.ysl-point .ysl-p--small{font-size:12px;color:var(--muted);margin-top:10px !important;}
.ysl-txt--bad{color:#c0392b;}
.ysl-txt--good{color:#b5384e;}

/* ===== 仕入れ比較テーブル ===== */
.ysl-compare{margin:36px auto 0 !important;max-width:700px;}
.ysl-compare__title{font-size:18px;font-weight:900;text-align:center;margin-bottom:16px;letter-spacing:.03em;}
.ysl-compare__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:24px;}
.ysl-compare__tbl{width:100%;border-collapse:collapse;font-size:14px;min-width:420px;}
.ysl-compare__tbl thead th{padding:10px 12px;font-weight:900;font-size:13px;line-height:1.4;border:1px solid var(--border);}
.ysl-compare__tbl td{padding:10px 12px;border:1px solid var(--border);vertical-align:middle;line-height:1.5;}
.ysl-compare__tbl small{font-size:11px;display:block;font-weight:400;}
.ysl-compare__th--label,.ysl-compare__label{background:#f8f8f8;font-weight:700;font-size:13px;color:var(--text);}
.ysl-compare__th--bad{background:#f0f0f0;color:#555;text-align:center;}
.ysl-compare__th--good{background:var(--primary);color:#fff;text-align:center;}
.ysl-compare__bad{background:#f7f7f7;color:#666;text-align:center;font-weight:700;}
.ysl-compare__good{background:rgba(228,122,140,.1);color:#b5384e;text-align:center;font-weight:900;border-left:3px solid var(--primary);}
.ysl-compare .ysl-simulation{max-width:none;margin:0 !important;}

/* ===== シミュレーション：売上＋報酬の2行表示 ===== */
.ysl-simulation__onetime{background:#f9f9f9;border-radius:12px;padding:14px 18px;margin:14px 0 10px;}
.ysl-simulation__row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 0;border-bottom:1px solid var(--border);}
.ysl-simulation__row:last-child{border-bottom:0;}
.ysl-simulation__label{font-size:13px;color:var(--muted);white-space:nowrap;}
.ysl-simulation__val{font-size:18px;font-weight:700;color:var(--text);}
.ysl-simulation__sub{font-size:13px;font-weight:400;color:var(--muted);}
.ysl-simulation__pure{font-size:13px;color:var(--muted);margin-left:6px;}
.ysl-simulation__annual-sales{font-size:24px;color:var(--muted);margin-bottom:6px;}
.ysl-simulation__sales-num{font-weight:700;color:var(--text);}
.ysl-simulation__annual-reward{font-size:16px;font-weight:700;}
@media(max-width:600px){
  .ysl-simulation__val{font-size:16px;}
  .ysl-simulation__row{flex-wrap:wrap;gap:2px;}
}

/* ===== 年間収益シミュレーション ===== */
.ysl-simulation__arrow{
  font-size:15px;color:#666;margin:10px 0 6px;
  font-weight:700;letter-spacing:.03em;
}
.ysl-simulation__result--annual{
  margin:6px 0 10px;background:rgba(228,122,140,.07);
  border-radius:12px;padding:12px 16px;
  border:1px solid rgba(228,122,140,.22);
}
.ysl-simulation__num--annual{
  font-size:35px;font-weight:900;color:var(--primary);letter-spacing:.02em;
}
@media(max-width:600px){
	.ysl-simulation__annual-sales{font-size:18px;color:var(--muted);margin-bottom:6px;}
  .ysl-simulation__num--annual{font-size:25px;}
}


/* =========================================================
   v4（2026-10-19）概要型LP用の追加スタイル
   ※新クラス（ysl4-*, ysl-voices--slide）のみ。既存ページには影響なし
========================================================= */
.ysl4-about{display:grid;grid-template-columns:1.15fr 1fr;gap:28px;align-items:center;margin-top:24px}
.ysl4-about__img img{width:100%;border-radius:var(--radius);box-shadow:0 14px 34px rgba(0,0,0,.08)}
.ysl4-about__text .ysl-p{margin-top:0 !important}
.ysl4-about__text .ysl-list{margin-top:16px !important}
.ysl4-about__text .ysl4-link{margin-top:16px !important;font-size:14px}
.ysl4-link a{color:var(--primary);font-weight:700;border-bottom:1px solid var(--primary);padding-bottom:2px}
@media(max-width:820px){.ysl4-about{grid-template-columns:1fr;gap:18px}}

.ysl4-gallery-wrap{margin-top:32px}
.ysl4-gallery__label{text-align:center;font-size:13px;color:var(--muted);letter-spacing:.08em;margin-bottom:12px}
.ysl4-gallery{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.ysl4-gallery img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;background:#fff}
@media(max-width:820px){.ysl4-gallery{grid-template-columns:repeat(3,1fr)}}

.ysl4-logos{margin-top:22px;text-align:center}
.ysl4-logos__label{font-size:13px;color:var(--muted);letter-spacing:.08em;margin-bottom:10px}
.ysl4-logos img{max-width:760px;width:100%;height:auto;margin:0 auto;display:block}

/* お客様の声：スマホは横スワイプで縦長を回避 */
@media(max-width:820px){
  .ysl-voices--slide{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:10px}
  .ysl-voices--slide .ysl-voice{flex:0 0 82%;scroll-snap-align:start}
}

/* v4：ヒーロー本文をスマホ幅で1行に収める（新ページ専用クラス） */
@media(max-width:480px){.ysl-lp .ysl-hero__lead.ysl-hero__lead--v4{font-size:14px !important;letter-spacing:0 !important}}

/* v4：導入実績（数字カードをやめて一文＋ロゴ） */
.ysl4-usage{text-align:center;font-size:17px;line-height:1.7;margin-top:6px !important}
.ysl4-usage strong{font-size:24px;font-weight:900;color:var(--primary);letter-spacing:.02em}
.ysl4-usage__note{text-align:center;font-size:12px;color:var(--muted);margin-top:6px !important}