/* ============================================================
   エンゲージリレー サービスページ専用CSS
   - インラインstyleは使用禁止（本ファイルにクラスとして集約）
   - 例外: ツール画面カルーセル .lp-shot の background-image と
     GTM noscript の iframe（規定スニペット）のみHTML側に残す
   ============================================================ */

/* ============ ページ基盤 ============ */
html { scroll-behavior: smooth; }
/* gpol共通ヘッダー（固定90px）分の余白＋LP本文の地色・書体（ヘッダー/フッターは style.css に委ねる） */
.dc-page {
  padding-top: 90px;
  overflow-x: hidden;
  background: #ffffff;
  color: #241d33;
  font-family: YakuHanJP, "Noto Sans JP", "Hiragino Kaku Gothic Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", serif;
  -webkit-font-smoothing: antialiased;
}
.dc-page a { color: #7d3ff2; text-decoration: none; }
@media (hover: hover){ .dc-page a:hover { color: #5b21b6; } }
/* gpol style.css の img リセット（max-width:100%/width:100%）からLP本文の装飾画像を保護 */
.dc-page img { max-width: none; }
.dc-page .lp-blogSec img { max-width: 100%; }
#issues, #solution, #strength, #faq { scroll-margin-top: 110px; }

/* 角丸バンド（gpol .round-wrap 準拠：80px角丸・-80px重ね／SP40px） */
.lp-band { margin-bottom: -80px; }
.lp-card { position: relative; border-radius: 80px; margin-bottom: -80px; }

/* ============ 共通パーツ ============ */
.lp-container { max-width: 1200px; margin: 0 auto; }

/* セクション見出し */
.lp-secHead { text-align: center; margin-bottom: 64px; }
.lp-secHead--lg { margin-bottom: 80px; }
.lp-secHead__label { margin: 0 0 14px; color: #7d3ff2; font-weight: 700; font-size: 12px; letter-spacing: 0.28em; }
.lp-secHead__ttl { margin: 0 0 22px; font-size: 48px; font-weight: 600; color: #1c1529; }
.lp-secHead__lead { margin: 0 0 24px; font-size: 15px; line-height: 1.9; color: #6b6478; }
.lp-secHead__bar { width: 56px; height: 4px; border-radius: 99px; background: linear-gradient(90deg, #7d3ff2, #d9366b); margin: 0 auto; }

/* ボタン行 */
.lp-btnRow { display: flex; justify-content: center; gap: 18px; }

/* グリッド */
.lp-grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 28px; }
.lp-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }

/* 写真の色味調整（イラスト素材をブランドカラーへ寄せる） */
.lp-imgTone { filter: hue-rotate(38deg) saturate(0.85) brightness(1.1); }

/* SP専用改行（PCでは非表示） */
.lp-brSp { display: none; }

/* hover演出 */
.lp-hov-lift { transition: transform .2s, box-shadow .2s; }
.lp-hov-bg { transition: background .2s; }
@media (hover: hover){
  .lp-hov-lift:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(125,63,242,0.12); }
  .lp-hov-lift--pink:hover { box-shadow: 0 16px 32px rgba(217,54,107,0.12); }
  .lp-hov-bg:hover { background: rgba(255,255,255,0.11); }
}

/* ページラベル（MV左上／gpol .p-pageLead-header__ttl 準拠） */
.lp-page-label { position: absolute; top: 70px; left: 135px; z-index: 3; margin: 0; font-size: 16px; font-weight: 600; line-height: 1.5; color: #707070; width: fit-content; padding: 10px 20px; border: 1px solid #707070; }

/* パンくず（MV内・右上／gpol service.css 準拠） */
.lp-breadcrumb { position: absolute; top: 70px; right: 135px; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0; padding: 0; }
.lp-breadcrumb li { display: flex; align-items: center; font-size: 12px; line-height: 1.5; color: #707070; }
.lp-breadcrumb li + li::before { content: ""; width: 16px; height: 1px; background: #707070; margin: 0 10px; flex-shrink: 0; }
.dc-page .lp-breadcrumb li a { color: #707070; text-decoration: none; }
@media (hover: hover){ .dc-page .lp-breadcrumb li a:hover { color: #707070; text-decoration: underline; } }

/* 他サービスページ（lower2024）準拠：1025px以下は左右40pxへ */
@media (max-width: 1025px){
  .lp-page-label { left: 40px; }
  .lp-breadcrumb { right: 40px; }
}

/* ============ Hero ============ */
.lp-hero { position: relative; padding: 170px 32px 150px; text-align: center; background: linear-gradient(180deg, #f8f5fd 0%, #ffffff 55%, #f4eefb 100%); overflow: hidden; }
.lp-hero__blob { position: absolute; border-radius: 50%; }
.lp-hero__blob--1 { width: 520px; height: 520px; background: #e9dcfb; filter: blur(110px); opacity: 0.55; top: -180px; left: -160px; }
.lp-hero__blob--2 { width: 560px; height: 560px; background: #fbdce8; filter: blur(120px); opacity: 0.5; top: 40px; right: -200px; }
.lp-hero__inner { max-width: 880px; margin: 0 auto; position: relative; z-index: 1; }
.lp-hero__logoWrap { margin: 0 0 30px; }
/* MV冒頭のロゴ（旧ヘッダーのロゴを拡大配置） */
.lp-hero-logo { height: 76px; width: auto; max-width: 100%; display: inline-block; vertical-align: middle; }
.lp-hero__badge { display: inline-block; margin: 0 0 28px; padding: 8px 22px; border-radius: 99px; border: 1px solid #dcc9f8; background: rgba(255,255,255,0.7); color: #7d3ff2; font-weight: 700; font-size: 14px; letter-spacing: 0.12em; }
.lp-hero__ttl { margin: 0 0 28px; font-size: 48px; line-height: 1.4; font-weight: 700; letter-spacing: 0.01em; color: #1c1529; }
.lp-hero__lead { margin: 0 auto 48px; max-width: 720px; font-size: 19px; line-height: 2; color: #55506a; font-weight: 500; }
.lp-marker { font-weight: 700; color: #241d33; padding: 0 2px; background: linear-gradient(to top, #f3d9f0 32%, transparent 32%); }

/* ============ アンカーリスト（gpol .p-anchorList 準拠） ============ */
.lp-anchorList { max-width: 1200px; margin: 0 auto 80px; }
.lp-anchorList ul { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.lp-anchorList li { margin: 0 30px 25px 0; }
.lp-anchorList li:last-child { margin: 0 0 25px; }
.dc-page .lp-anchorList a { position: relative; display: flex; align-items: center; color: #222; text-decoration: none; }
.lp-anchorList__icon { width: 34px; min-width: 34px; height: 34px; display: block; border: 1px solid #222; border-radius: 50%; position: relative; margin-right: 10px; transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1); }
.lp-anchorList__icon::after { content: ""; display: block; width: 0; height: 0; border-style: solid; border-width: 6px 4px 0 4px; border-color: #333 transparent transparent transparent; position: absolute; top: 14px; left: 12px; transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1); }
.lp-anchorList__txt { font-size: 15px; line-height: 1.2; color: #222; transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1); }
@media (hover: hover){
  .dc-page .lp-anchorList a:hover .lp-anchorList__icon { border-color: #a8aeb3; transform: translateY(3px); }
  .dc-page .lp-anchorList a:hover .lp-anchorList__icon::after { border-color: #a8aeb3 transparent transparent transparent; }
  .dc-page .lp-anchorList a:hover .lp-anchorList__txt { color: #a8aeb3; }
}

/* ============ Issues：よくある課題 ============ */
.lp-issues { padding: 56px 32px 110px; background: #ffffff; }
.lp-issues__grid { margin-bottom: 40px; }
.lp-issueCard { background: #ffffff; border: 1px solid #e9e3f4; border-radius: 20px; overflow: hidden; }
.lp-issueCard__img { height: 230px; overflow: hidden; }
.lp-issueCard__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lp-issueCard__img--zoom img { transform: scale(1.25) translateY(-6%); }
.lp-issueCard__body { padding: 28px; }
.lp-issueCard__ttl { margin: 0 0 12px; font-size: 19px; font-weight: 700; color: #1c1529; }
.lp-issueCard__txt { margin: 0; font-size: 14px; line-height: 1.9; color: #6b6478; }

/* 「何から始めるべきか分からない」 */
.lp-nayamiWrap { padding: 40px 40px 0; text-align: center; }
.lp-nayami { margin: 0 0 14px; font-size: 32px; font-weight: 900; color: #241d33; }
.lp-nayami span { color: #7d3ff2; border-bottom: 2px solid #7d3ff2; padding-bottom: 3px; }
.lp-nayamiWrap__txt { margin: 0; font-size: 15px; line-height: 1.9; color: #6b6478; }
.lp-nayamiWrap__txt strong { font-weight: 700; color: #241d33; }
.lp-nayamiWrap__img { height: 200px; overflow: hidden; display: flex; justify-content: center; margin-top: -30px; }
.lp-nayamiWrap__img img { display: block; height: 240px; width: auto; object-fit: cover; object-position: top; }

/* なぜエンゲージメントを高める必要があるのか（濃色ボックス） */
.lp-whyBox { background: linear-gradient(150deg, #4a2a75 0%, #6a3a94 55%, #93417e 100%); color: #ffffff; border-radius: 28px; padding: 64px; position: relative; overflow: hidden; }
.lp-whyBox__blob { position: absolute; top: -120px; right: -100px; width: 340px; height: 340px; border-radius: 50%; background: rgba(217,54,107,0.18); filter: blur(60px); }
.lp-whyBox__ttl { margin: 0 0 40px; font-size: 28px; font-weight: 900; text-align: center; position: relative; }
.lp-whyBox__lead { margin: 0; font-size: 20px; font-weight: 700; text-align: center; position: relative; line-height: 1.8; }
.lp-whyBox__lead span { color: #f7c9db; }
/* 満足度 vs エンゲージメント比較 */
.lp-vs { display: grid; grid-template-columns: 1fr 56px 1fr; align-items: stretch; margin-bottom: 40px; position: relative; }
.lp-vs__arrow { display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 900; color: rgba(255,255,255,0.6); }
.lp-vsCard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: 18px; padding: 32px 34px; }
.lp-vsCard__label { margin: 0 0 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.14em; color: rgba(255,255,255,0.55); }
.lp-vsCard__ttl { margin: 0 0 6px; font-size: 22px; font-weight: 900; color: rgba(255,255,255,0.85); }
.lp-vsCard__pill { margin: 8px 0 18px; display: inline-block; padding: 5px 14px; border-radius: 99px; background: rgba(255,255,255,0.12); font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.75); }
.lp-vsCard__txt { margin: 0; font-size: 14px; line-height: 2; color: rgba(255,255,255,0.75); }
.lp-vsCard--strong { background: rgba(255,255,255,0.14); border-color: #f7c9db; box-shadow: 0 12px 32px rgba(0,0,0,0.25); }
.lp-vsCard--strong .lp-vsCard__label { color: #f7c9db; }
.lp-vsCard--strong .lp-vsCard__ttl { color: #ffffff; }
.lp-vsCard--strong .lp-vsCard__pill { background: #f7c9db; color: #3d1d5c; }
.lp-vsCard--strong .lp-vsCard__txt { color: rgba(255,255,255,0.9); }
.lp-vsCard--strong .lp-vsCard__txt strong { color: #ffffff; }
.lp-vsCard--strong .lp-vsCard__txt .lp-vsCard__em { color: #f7c9db; font-size: 17px; margin: 0 2px; }

/* ============ Approach：3つのポイント ============ */
.lp-approach { padding: 190px 32px; background: #f8f5fd; }
.lp-approach .lp-secHead__ttl { margin-bottom: 18px; }
.lp-pointCard { background: #ffffff; border: 1px solid #e9e3f4; border-radius: 22px; overflow: hidden; }
.lp-pointCard__img { height: 200px; overflow: hidden; }
.lp-pointCard__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lp-pointCard__body { padding: 32px; }
.lp-pointCard__head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.lp-pointCard__badge { color: #ffffff; font-size: 11px; font-weight: 700; letter-spacing: 0.02em; padding: 6px 12px; border-radius: 8px; flex-shrink: 0; }
.lp-pointCard--purple .lp-pointCard__badge { background: linear-gradient(90deg, #7d3ff2, #a855f7); }
.lp-pointCard--pink .lp-pointCard__badge { background: linear-gradient(90deg, #d9366b, #ef6a94); }
.lp-pointCard--plum .lp-pointCard__badge { background: linear-gradient(90deg, #b03aae, #d16ac9); }
.lp-pointCard__ttl { margin: 0; font-size: 19px; font-weight: 700; color: #1c1529; }
.lp-pointCard--purple .lp-pointCard__ttl span { color: #7d3ff2; }
.lp-pointCard--pink .lp-pointCard__ttl span { color: #d9366b; }
.lp-pointCard--plum .lp-pointCard__ttl span { color: #b03aae; }
.lp-pointCard__txt { margin: 0; font-size: 14px; line-height: 1.9; color: #6b6478; }

/* ============ Solution：3つのツール ============ */
.lp-solution { padding: 110px 32px 190px; background: #ffffff; }
.lp-solution .lp-secHead__ttl { line-height: 1.5; }
.lp-toolList { display: flex; flex-direction: column; gap: 120px; }
.lp-toolRow { display: flex; align-items: center; gap: 56px; }
.lp-toolRow--rev { flex-direction: row-reverse; }
.lp-tool-text { flex: 1; }
.lp-tool__badge { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.02em; padding: 7px 16px; border-radius: 99px; margin-bottom: 22px; }
.lp-toolRow--purple .lp-tool__badge { background: #f1e9fd; color: #7d3ff2; }
.lp-toolRow--pink .lp-tool__badge { background: #fbe7ee; color: #d9366b; }
.lp-toolRow--plum .lp-tool__badge { background: #f9e6f8; color: #b03aae; }
.lp-tool__ttl { margin: 0 0 22px; font-size: 22px; font-weight: 700; line-height: 1.6; color: #1c1529; }
.lp-tool__ttl span { font-size: 32px; font-weight: 900; display: inline-block; margin-top: 6px; }
.lp-toolRow--purple .lp-tool__ttl span { color: #7d3ff2; }
.lp-toolRow--pink .lp-tool__ttl span { color: #d9366b; }
.lp-toolRow--plum .lp-tool__ttl span { color: #b03aae; }
.lp-tool__txt { margin: 0 0 24px; font-size: 15px; line-height: 2; color: #55506a; }
.lp-tool__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; font-size: 14px; color: #44405a; }
.lp-tool__list li { display: flex; align-items: center; gap: 12px; }
.lp-tool__check { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 900; flex-shrink: 0; }
.lp-toolRow--purple .lp-tool__check { background: #f1e9fd; color: #7d3ff2; }
.lp-toolRow--pink .lp-tool__check { background: #fbe7ee; color: #d9366b; }
.lp-toolRow--plum .lp-tool__check { background: #f9e6f8; color: #b03aae; }

/* ツール画面カルーセル（Swiper使用・旧DCカルーセルの見た目を踏襲） */
.lp-shotSlider { flex: 1; position: relative; border-radius: 18px; border: 1px solid #e9e3f4; overflow: hidden; height: 300px; box-shadow: 0 20px 40px rgba(28,21,41,0.08); }
.lp-shotSlider .swiper { width: 100%; height: 100%; }
.lp-shotSlider--purple .swiper-slide { background: #f4effc; }
.lp-shotSlider--pink .swiper-slide { background: #fdf0f5; }
.lp-shotSlider--plum .swiper-slide { background: #f9e6f8; }
.lp-shot { width: 100%; height: 100%; background-size: cover; background-position: top center; background-repeat: no-repeat; }
.lp-shot-prev, .lp-shot-next { position: absolute; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; border: none; color: #ffffff; cursor: pointer; font-size: 16px; font-weight: 700; z-index: 3; display: flex; align-items: center; justify-content: center; line-height: 1; padding: 0 0 3px; transition: transform .3s ease; }
.lp-shot-prev { left: 10px; }
.lp-shot-next { right: 10px; }
.lp-shot-prev:hover, .lp-shot-next:hover { transform: translateY(-50%) scale(0.9); }
.lp-shotSlider--purple .lp-shot-prev, .lp-shotSlider--purple .lp-shot-next { background: #7d3ff2; box-shadow: 0 4px 12px rgba(125,63,242,0.4); }
.lp-shotSlider--pink .lp-shot-prev, .lp-shotSlider--pink .lp-shot-next { background: #d9366b; box-shadow: 0 4px 12px rgba(217,54,107,0.4); }
.lp-shotSlider--plum .lp-shot-prev, .lp-shotSlider--plum .lp-shot-next { background: #b03aae; box-shadow: 0 4px 12px rgba(176,58,174,0.4); }
.lp-shotSlider .swiper-pagination { bottom: 14px; }
.lp-shotSlider .swiper-pagination-bullet { width: 8px; height: 8px; border-radius: 99px; background: rgba(28,21,41,0.18); opacity: 1; transition: all .3s; }
.lp-shotSlider .swiper-pagination-bullet-active { width: 20px; background: #7d3ff2; }

/* ============ Strength：圧倒的な使いやすさ ============ */
.lp-strength { padding: 110px 32px; background: linear-gradient(160deg, #4a2a75 0%, #6a3a94 60%, #93417e 100%); color: #ffffff; position: relative; overflow: hidden; }
.lp-strength__blob { position: absolute; top: -200px; right: -160px; width: 560px; height: 560px; border-radius: 50%; background: rgba(217,54,107,0.16); filter: blur(90px); }
.lp-strength .lp-container { position: relative; }
.lp-strength .lp-secHead__label { color: #ef9dbd; }
.lp-strength .lp-secHead__ttl { line-height: 1.5; color: #ffffff; }
.lp-strength .lp-secHead__lead { margin-bottom: 28px; line-height: 2; color: rgba(255,255,255,0.75); }
.lp-strength .lp-secHead__bar { background: linear-gradient(90deg, #ef9dbd, #7d3ff2); }
.lp-strCard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 22px; padding: 36px; text-align: center; }
/* 丸アイコン：iOS Safariの absolute配置＋filter＋円形クリップ不具合を避けるため background-image 方式 */
.lp-strCard__icon { width: 76px; height: 76px; border-radius: 50%; margin: 0 auto 24px; background-color: #cfe6f7; background-repeat: no-repeat; filter: hue-rotate(38deg) saturate(0.85) brightness(1.1); }
.lp-strCard--01 .lp-strCard__icon { background-image: url(/service/engage-relay/img/strength_01.webp); background-size: 560px auto; background-position: -236px -106px; }
.lp-strCard--02 .lp-strCard__icon { background-image: url(/service/engage-relay/img/strength_02.webp); background-size: 330px auto; background-position: -110px -90px; }
.lp-strCard--03 .lp-strCard__icon { background-image: url(/service/engage-relay/img/strength_03.webp); background-size: 460px auto; background-position: -195px -102px; }
.lp-strCard__ttl { margin: 0 0 14px; font-size: 18px; font-weight: 700; }
.lp-strCard__txt { margin: 0; font-size: 14px; line-height: 1.9; text-align: left; color: rgba(255,255,255,0.75); }

/* 3ツール連携の好循環 */
.lp-cycle { margin-top: 56px; background: #ffffff; color: #241d33; border-radius: 24px; padding: 44px; text-align: center; box-shadow: 0 24px 48px rgba(0,0,0,0.25); }
.lp-cycle__ttl { margin: 0 0 24px; font-size: 28px; font-weight: 700; color: #1c1529; }
.lp-cycle__flow { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; font-size: 14px; font-weight: 700; }
.lp-cycle__pill { padding: 8px 18px; border-radius: 99px; }
.lp-cycle__pill--pink { background: #fbe7ee; color: #d9366b; }
.lp-cycle__pill--purple { background: #f1e9fd; color: #7d3ff2; }
.lp-cycle__pill--rose { background: #fdeaf3; color: #db4a90; }
.lp-cycle__arrow { color: #b9aed0; }
.lp-cycle__txt { margin: 24px 0 0; font-size: 14px; line-height: 1.9; color: #6b6478; }

/* ============ Option：関連サービス ============ */
.lp-option { padding: 180px 32px; background: #f8f5fd; }
.lp-option__head { margin-bottom: 48px; }
.lp-option__headRow { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.lp-option__tag { background: #ffffff; border: 1px solid #dcc9f8; color: #7d3ff2; font-size: 11px; font-weight: 700; letter-spacing: 0.02em; padding: 7px 14px; border-radius: 8px; white-space: nowrap; flex-shrink: 0; }
.lp-option__ttl { margin: 0; font-size: 28px; font-weight: 600; line-height: 1.6153846154; color: #1c1529; }
.lp-option__lead { margin: 0; font-size: 14px; line-height: 1.9; color: #6b6478; }
.lp-optCard { background: #ffffff; border: 1px solid #e9e3f4; border-radius: 22px; overflow: hidden; display: flex; flex-direction: column; }
.lp-optCard__img { position: relative; height: 220px; overflow: hidden; border-bottom: 1px solid #e9e3f4; }
.lp-optCard--purple .lp-optCard__img { background: #f4effc; }
.lp-optCard--pink .lp-optCard__img { background: #fdf0f5; }
.lp-optCard__body { padding: 32px; display: flex; flex-direction: column; flex-grow: 1; }
.lp-optCard__head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.lp-optCard__icon { width: 40px; height: 40px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.lp-optCard--purple .lp-optCard__icon { background: #f1e9fd; color: #7d3ff2; }
.lp-optCard--pink .lp-optCard__icon { background: #fbe7ee; color: #d9366b; }
.lp-optCard__ttl { margin: 0; font-size: 18px; font-weight: 700; color: #1c1529; }
.lp-optCard__txt { margin: 0 0 24px; font-size: 14px; line-height: 1.9; color: #6b6478; }
/* 未導入/導入後の比較ボックス */
.lp-baBox { margin-top: auto; display: flex; flex-direction: column; gap: 12px; background: #f8f6fb; border: 1px solid #eeeaf6; border-radius: 16px; padding: 18px; }
.lp-baBox__row { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; color: #8a8499; }
.lp-baBox__row--after { font-weight: 500; color: #241d33; }
.lp-baBox__tag { background: #e6e2ee; color: #6b6478; padding: 4px 8px; border-radius: 6px; font-size: 12px; font-weight: 700; flex-shrink: 0; }
.lp-optCard--purple .lp-baBox__row--after .lp-baBox__tag { background: #7d3ff2; color: #ffffff; }
.lp-optCard--pink .lp-baBox__row--after .lp-baBox__tag { background: #d9366b; color: #ffffff; }
.lp-baBox__txt { line-height: 1.8; }

/* ============ FAQ（gpol .faq / .faq-list 準拠：左見出し＋罫線リスト＋常時表示） ============ */
.lp-faqSec { padding: 120px 20px 190px; background: #f8f5fd; }
.lp-faq { max-width: 1260px; margin: 0 auto; padding: 0 30px; position: relative; }
.lp-faq__ttl { position: absolute; top: 0; left: 30px; margin: 0; font-size: 38px; line-height: 1.5; font-weight: 600; color: #222; }
.lp-faq__body { margin-left: 325px; }
.lp-faqList { border-top: 1px solid #a8aeb3; }
.lp-faqList__item { border-bottom: 1px solid #a8aeb3; padding: 35px 40px 35px 30px; }
.lp-faqList__ttl { position: relative; padding: 8px 0 0 60px; margin: 0 0 20px; font-size: 20px; font-weight: 400; color: #333; }
.lp-faqList__ttl span { font-size: 30px; font-family: "nimbus-sans", sans-serif; font-weight: 400; position: absolute; top: 0; left: 0; }
.lp-faqList__txt { margin: 0; font-size: 15px; line-height: 1.6; padding-left: 60px; color: #333; }

/* ============ 関連ブログ（gpol .p-cardSlider の実クラスを使用。カード・矢印の装飾は style.css 側） ============ */
.lp-blogSec { padding: 200px 0 140px; background: #ffffff; }
.lp-blog { max-width: 1260px; margin: 0 auto; padding: 0 30px; }
.lp-blog__ttl { margin: 0 0 20px; font-size: 38px; line-height: 1.5; font-weight: 600; color: #222; }
.dc-page .p-cardSlider__inner { color: #222; text-decoration: none; }

/* ============ CTA ============ */
.lp-cta { padding: 160px 32px 90px; position: relative; background: #ffffff; overflow: hidden; text-align: center; }

/* 中間CTA（SOLUTIONセクション末尾・ボタンのみ。lp-toolList の gap で余白確保） */
.lp-ctaMid { text-align: center; }
.lp-cta__blob { position: absolute; bottom: -320px; left: 50%; transform: translateX(-50%); width: 820px; height: 620px; border-radius: 50%; background: linear-gradient(90deg, #eee0fb, #fbdce8); filter: blur(90px); opacity: 0.7; }
.lp-cta__inner { max-width: 760px; margin: 0 auto; position: relative; }
.lp-cta__ttl { margin: 0 0 28px; font-size: 48px; font-weight: 600; line-height: 1.4; color: #1c1529; }
.lp-cta__txt { margin: 0 0 44px; font-size: 16px; line-height: 2.1; color: #55506a; }

/* ============ ボタン（gpol .c-btn-primary 準拠：ピル型・白スライドhover） ============ */
.lp-btn { display: flex; justify-content: center; align-items: center; text-align: center; width: 320px; height: 60px; position: relative; border-radius: 50px; overflow: hidden; padding: 0 20px; line-height: 1.2; cursor: pointer; transition: all .3s cubic-bezier(0.215, 0.61, 0.355, 1); }
.lp-btn::before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 50px; background-color: #fff; transform: translateX(-101%); transition: transform .3s ease; }
.lp-btn::after { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 50px; z-index: 2; }
@media (hover: hover){ .lp-btn:hover::before { transform: translateX(0); } }
.lp-btn__txt { font-size: 14px; letter-spacing: .06em; display: inline-block; padding-bottom: 2px; position: relative; z-index: 2; transition: color .3s; }
.lp-btn--black { background: #222; }
.lp-btn--black::after { border: 1px solid #222; }
.dc-page .lp-btn--black { color: #fff; text-decoration: none; }
.dc-page .lp-btn--black .lp-btn__txt { color: #fff; }
@media (hover: hover){ .dc-page .lp-btn--black:hover .lp-btn__txt { color: #222; } }
.lp-btn--gray { background: #a8aeb3; }
.lp-btn--gray::after { border: 1px solid #a8aeb3; }
.dc-page .lp-btn--gray { color: #fff; text-decoration: none; }
.dc-page .lp-btn--gray .lp-btn__txt { color: #fff; }
@media (hover: hover){ .dc-page .lp-btn--gray:hover .lp-btn__txt { color: #a8aeb3; } }

/* ============ SP対応（gpol準拠 750pxブレークポイント） ============ */
@media (max-width: 750px){
  .dc-page { padding-top: 60px; }
  .lp-card { border-radius: 40px; }
  .lp-breadcrumb { display: none; }
  .lp-page-label { position: static; margin: 0 auto 24px; font-size: 12px; padding: 8px 16px; }
  .lp-hero-logo { height: 52px; }
  /* セクション余白 */
  .lp-hero { padding: 40px 20px 120px; }
  .lp-issues { padding: 40px 20px 60px; }
  .lp-approach { padding: 140px 20px; }
  .lp-solution { padding: 60px 20px 140px; }
  .lp-strength { padding: 60px 20px; }
  .lp-option { padding: 140px 20px; }
  .lp-faqSec { padding: 48px 20px 160px; }
  .lp-blogSec { padding: 160px 20px 80px; }
  .lp-cta { padding: 80px 20px 140px; }
  /* SP専用改行を有効化 */
  .lp-brSp { display: inline; }
  /* 見出し */
  .lp-secHead__ttl, .lp-hero__ttl, .lp-option__ttl, .lp-cta__ttl { font-size: 26px; line-height: 1.5; }
  .lp-hero__ttl { font-size: 22px; }
  .lp-faq__ttl { font-size: 24px; }
  .lp-blog__ttl { font-size: 24px; }
  /* Hero：サブコピーの改行を解除し、サイズ調整 */
  .lp-hero__lead { font-size: 14px; }
  .lp-hero__lead br { display: none; }
  /* CTA本文：PC用改行を解除して自然折返しに */
  .lp-cta__txt br { display: none; }
  /* ボタン行：縦積み・幅フィット */
  .lp-btnRow { flex-direction: column; align-items: center; gap: 14px; }
  .lp-btn { width: min(320px, 100%); }
  /* グリッド類：1カラム化 */
  .lp-grid3 { grid-template-columns: 1fr; }
  .lp-grid2 { grid-template-columns: 1fr; }
  /* 満足度vsエンゲージメント比較：縦積み＋矢印を下向きに */
  .lp-vs { grid-template-columns: 1fr; }
  .lp-vs__arrow { transform: rotate(90deg); padding: 8px 0; }
  /* 濃色ボックスの内側余白を圧縮（コンテンツ幅を確保） */
  .lp-whyBox { padding: 40px 24px; }
  /* 見出しを他セクション見出しと同じ級数・行間に（26pxで「か？」の段落落ちも解消） */
  .lp-whyBox__ttl { font-size: 26px; line-height: 1.5; }
  .lp-vsCard { padding: 28px 24px; }
  .lp-vsCard__ttl { font-size: 20px; }
  /* 好循環フロー：見出し行間を他見出しと統一、縦積み＋下矢印 */
  .lp-cycle__ttl { line-height: 1.5; }
  .lp-cycle__flow { flex-direction: column; }
  .lp-cycle__arrow { transform: rotate(90deg); }
  /* オプション見出し行：縦積み（タグの縦割れ防止） */
  .lp-option__headRow { flex-direction: column; align-items: flex-start; gap: 12px; }
  .lp-optCard__ttl { font-size: 16px; }
  /* ツール行：縦積み（バッジ → 見出し → 画像 → 説明 → リスト の順に並べ替え） */
  .lp-toolRow, .lp-toolRow--rev { flex-direction: column; gap: 0; align-items: stretch; }
  .lp-tool-text { display: contents; }
  .lp-tool__badge { order: 1; align-self: flex-start; }
  .lp-tool__ttl { order: 2; font-size: 18px; }
  .lp-tool__ttl span { font-size: 26px; }
  .lp-toolRow > .lp-shotSlider { order: 3; flex: none; width: 100%; height: 220px; margin: 0 0 24px; }
  .lp-tool__txt { order: 4; }
  .lp-tool__list { order: 5; }
  /* Solutionツール間の余白を詰める */
  .lp-toolList { gap: 64px; }
  /* アンカーリスト（gpol SP準拠：2列） */
  .lp-anchorList { margin-bottom: 40px; }
  .lp-anchorList li { width: 50%; margin: 0 0 15px; }
  .lp-anchorList li:last-child { margin: 0 0 15px; }
  .lp-anchorList__txt { font-size: 12px; }
  /* FAQ・Blog：内側コンテナの余白二重加算を解消 */
  .lp-faq { padding: 0; }
  .lp-blog { padding: 0; }
  /* FAQ体裁 */
  .lp-faq__ttl { position: static; margin: 0 0 30px; }
  .lp-faq__body { margin: 0; }
  .lp-faqList__item { padding: 20px 0; }
  .lp-faqList__ttl { font-size: 14px; margin: 0 0 15px; padding: 4px 0 0 30px; }
  .lp-faqList__ttl span { font-size: 20px; }
  .lp-faqList__txt { font-size: 12px; padding-left: 30px; }
  /* 「何から始めるべきか分からない」：1行化＋折返し時も下線が乱れないように */
  .lp-nayamiWrap { padding: 40px 0 0; }  /* 左右余白を撤廃し nowrap 見出しのはみ出し（中央ズレ）を防ぐ */
  .lp-nayami { font-size: 21px; line-height: 1.7; }
  .lp-nayami span { display: inline-block; white-space: nowrap; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
}
