@charset "UTF-8";
/* ==========================================================================
   LP11 — Indeed PLUS × Meta / 採用広告 × WEB広告
   共通: destyle.css / lp-base.css / lp-header.css / lp-footer.css に上乗せ
   セクションを上から順に追記していく
   ========================================================================== */

/* ===== 01 FV ===== */
/* 背景+右ロゴのみ画像(lp11-fv-bg.png)。左テキスト/バッジ/ボタンは全てHTML */
/* ヘッダーは position:fixed 95px・透過でFVに重なる → padding-topでクリア */
.lp11-fv {
  position: relative;
  /* 画像がFV左端まで覆っていない場合の下地(白余白防止＆カンプ同様のダーク左) */
  background-color: #0A1533;
  background-size: cover;
  background-position: left center; /* 一番左（左端）を基準に */
  background-repeat: no-repeat;
  min-height: 820px;
  padding: 150px 0 60px;
}

/* 左テキストを読みやすくする左→右のダークグラデ（右のロゴ/写真は透けさせる） */
.lp11-fv::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10,21,51,0.92) 0%, rgba(10,21,51,0.55) 34%, rgba(10,21,51,0) 60%);
  pointer-events: none;
  z-index: 0;
}

.lp11-fv__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 116rem;      /* /site/ の .site-mv__inner と横位置を統一(横paddingなし) */
  margin-inline: auto;
  padding: 0;
}

.lp11-fv__label {
  margin-bottom: 16px;
}

.lp11-fv__label-txt {
  display: inline-block;
  position: relative;
  font-family: "Fustat", "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 800;
  font-size: 24px;
  line-height: 1.4;
  letter-spacing: 1.92px;
  color: #F0F0F0;
  padding-bottom: 10px;
}

.lp11-fv__label-txt::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  /* レインボー（見出し横線と同じグラデ） */
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
}

.lp11-fv__title {
  margin-bottom: 26px;
}

.lp11-fv__title-hl {
  display: inline-block;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 64px;
  line-height: 1.2;
  letter-spacing: 1.28px;
  color: #050D29;
  background: #fff;
  padding: 8px 24px;
}

.lp11-fv__sub {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.6;
  letter-spacing: 1.2px;
  color: #fff;
  margin-bottom: 40px;
}

.lp11-fv__badges {
  display: flex;
  gap: 20px;
  margin-bottom: 44px;
}

.lp11-fv__badge {
  width: 166.556px;
  height: 166.556px;
  flex-shrink: 0;
  border-radius: 1000px;
  /* レインボーのグラデ枠：内側#161F37 + 枠にグラデ（border-radius対応の2枚背景手法） */
  border: 3px solid transparent;
  background:
    linear-gradient(#161F37, #161F37) padding-box,
    linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%) border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  padding: 12px;
}

.lp11-fv__badge-top {
  font-size: 12px;
  letter-spacing: 0.04em;
  margin-bottom: 2px;
}

.lp11-fv__badge-main {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  line-height: 1.1;
  color: #fff;
}

.lp11-fv__badge-main em {
  font-style: normal;
}

.lp11-fv__badge-sub {
  display: inline-block;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 16.76px;
  line-height: 1.4;
  letter-spacing: 0.335px;
  color: #fff;
}

.lp11-fv__badge-cap {
  margin-top: 8px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 12.08px;
  line-height: 1.5;
  letter-spacing: 0.242px;
  color: #fff;
}

/* badge1: 対応業種 / 20業種以上 */
.lp11-fv__badge--work .lp11-fv__badge-main {
  font-size: 16px; /* 「業種以上」= Figma未指定のため暫定 */
}
.lp11-fv__badge--work .lp11-fv__badge-main em {
  font-size: 38.436px;
  line-height: 0.8;
  letter-spacing: 0.769px;
}
.lp11-fv__badge--work .lp11-fv__badge-cap {
  font-size: 10.677px;
  letter-spacing: 0.214px;
}

/* badge2: 最短1週間 / で支援スタート */
.lp11-fv__badge--speed .lp11-fv__badge-main {
  font-size: 24.76px;
  letter-spacing: 0.495px;
}
.lp11-fv__badge--speed .lp11-fv__badge-main em {
  font-size: 35.76px;
  letter-spacing: 0.715px;
}

/* badge3: 地方採用 / の成功事例多数 */
.lp11-fv__badge--area .lp11-fv__badge-main {
  font-size: 29.895px;
  line-height: 1.1;
  letter-spacing: 0.598px;
}
.lp11-fv__badge--area .lp11-fv__badge-sub {
  font-size: 17.083px;
  letter-spacing: 0.342px;
}

.lp11-fv__badge-tag {
  display: inline-block;
  margin-bottom: 5px;
  padding: 0 8.541px;
  border-radius: 25.624px;
  background: #F2F2F2;
  color: #0A2C43;
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600;
  font-size: 10.677px;
  letter-spacing: 0.214px;
}

/* FVのボタンは共通 .lp-cta__btns を使うが、FVでは左寄せ */
.lp11-fv__cta {
  justify-content: flex-start;
}

@media (max-width: 768px) {
  .lp11-fv {
    min-height: 0;
    padding: 120px 0 50px;
  }
  .lp11-fv__inner {
    padding: 0 20px; /* SPは端張り付き防止で横paddingを戻す */
  }
  .lp11-fv__title-hl {
    white-space: nowrap;
    font-size: clamp(24px, 8.5vw, 32px);
    letter-spacing: 0.5px;
    padding: 6px 12px;
  }
  .lp11-fv__sub {
    font-size: 14px;
    margin-bottom: 28px;
  }
  .lp11-fv__badges {
    gap: 10px;
    margin-bottom: 32px;
  }
  .lp11-fv__badge {
    width: 31%;
    height: auto;
    aspect-ratio: 1 / 1;
    padding: 6px;
  }
  .lp11-fv__badge-top {
    font-size: 9px;
    margin-bottom: 1px;
  }
  .lp11-fv__badge-main {
    font-size: 12px;
  }
  .lp11-fv__badge-main em {
    font-size: 18px;
  }
  .lp11-fv__badge-sub {
    font-size: 9px;
  }
  .lp11-fv__badge-cap {
    font-size: 8px;
    line-height: 1.4;
    margin-top: 3px;
  }
  .lp11-fv__badge-tag {
    font-size: 8px;
    padding: 0 5px;
    margin-bottom: 2px;
  }
  /* 種類別の数字・文字（丸が縦に伸びて崩れないようSPで縮小） */
  .lp11-fv__badge--work .lp11-fv__badge-main {
    font-size: 10px;
  }
  .lp11-fv__badge--work .lp11-fv__badge-main em {
    font-size: 22px;
  }
  .lp11-fv__badge--work .lp11-fv__badge-cap {
    font-size: 8px;
  }
  .lp11-fv__badge--speed .lp11-fv__badge-main {
    font-size: 12px;
  }
  .lp11-fv__badge--speed .lp11-fv__badge-main em {
    font-size: 18px;
  }
  .lp11-fv__badge--area .lp11-fv__badge-main {
    font-size: 16px;
  }
  .lp11-fv__badge--area .lp11-fv__badge-sub {
    font-size: 9px;
  }
  .lp11-fv__cta {
    flex-direction: column;
    gap: 14px;
  }
}

/* ===== 02 PROBLEM ===== */
/* 斜め下辺(右上がり=右高・左低)は共通 .lp-slash--bottom を使用。padding-bottomでクリップ分を確保 */
.lp11-problem {
  background: #ffffff;
  padding: 80px 0 calc(184px + 40px);
}

.lp11-problem__inner {
  max-width: 1320px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.lp11-problem__title {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px; /* 他のlp11見出しと統一 */
  line-height: 1.4;
  letter-spacing: 0.06em;
  text-align: center;
  color: #14213D;
  margin-bottom: 48px;
}

.lp11-problem__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 34px;
}

.lp11-problem__card {
  width: calc((100% - 68px) / 3); /* 3列 / gap34px×2。5枚目・6枚目は中央寄せ */
  background: #E6E6E6;
  border: 1px solid #FFF;
  border-radius: 4px;
  padding: 32px 28px 34px;
}

.lp11-problem__icon {
  text-align: center;
  margin-bottom: 16px;
}

.lp11-problem__icon img {
  width: 140px;
  height: auto;
}

.lp11-problem__ttl {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: 1.32px;
  background: linear-gradient(47deg, #1005B8 -2.66%, #0092D6 94.53%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 16px;
}

.lp11-problem__txt {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.lp11-problem__txt p {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.96px;
  color: #333;
}

/* 太字＋レインボー下線（線と文字の間に約2pxすきま） */
.lp11-problem__mark {
  font-weight: 700;
  color: #333;
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%) no-repeat;
  background-size: 100% 2px;
  background-position: 0 100%;
  padding-bottom: 4px;
}

@media (max-width: 768px) {
  .lp11-problem {
    padding: 60px 0 calc(13.4vw + 60px);
  }
  .lp11-problem__inner {
    padding: 0 20px;
  }
  .lp11-problem__title {
    font-size: 23px;
    margin-bottom: 32px;
    white-space: nowrap;
  }
  .lp11-problem__grid {
    gap: 20px;
  }
  .lp11-problem__card {
    width: 100%;
    padding: 28px 24px 30px;
  }
  .lp11-problem__icon {
    margin-bottom: 16px;
  }
  .lp11-problem__ttl {
    font-size: 18px;
    margin-bottom: 14px;
  }
  .lp11-problem__txt p {
    font-size: 14px;
  }
}

/* ===== 03 SOLUTION ===== */
/* 上辺の斜めは共通 .lp-slash--top（PROBLEMの --bottom と噛み合う＝右高・左低） */
.lp11-solution {
  background: #F5F7FA;
  padding-bottom: 86px;
}

.lp11-solution__inner {
  max-width: 1160px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

/* 斜め線付きラベル（lp10 Utilization / lp09 Reason と同じスタイル） */
.lp11-solution__header {
  margin-bottom: 24px;
}

.lp11-solution__header::before {
  width: 600px;
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
}

.lp11-solution__label {
  /* 1つ目=文字用グラデ / 2つ目=背景マスク(セクション色 #F5F7FA)で線を隠す */
  background-image: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%), linear-gradient(#F5F7FA, #F5F7FA);
}

.lp11-solution__title {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: #14213D;
  margin-bottom: 28px;
}

.lp11-solution__lead {
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 2;
  letter-spacing: 1.08px;
  color: #080C17;
  margin-bottom: 56px;
}

.lp11-solution__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}

.lp11-solution__card {
  background: #FAFAFA;
  border: 1px solid rgba(0, 0, 0, 0.30);
  border-radius: 2px;
  /* 上40 / 下48 / 左右は カード幅540pxに対する36px = 6.6667% */
  padding: 40px 6.6667% 48px;
}

.lp11-solution__num {
  font-family: "Fustat", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1;
  color: rgba(15, 23, 43, 0.40);
  margin-bottom: 6px;
}

.lp11-solution__num span {
  margin-left: 3px;
  font-family: "Fustat", sans-serif;
  font-weight: 400;
  font-size: 48px;
  line-height: 1;
  /* レインボー */
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lp11-solution__ttl {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.4;
  letter-spacing: 1.44px;
  color: #1F5FC7;
  margin-bottom: 0;
}

.lp11-solution__img {
  text-align: center;
  margin: 0;
}

.lp11-solution__img img {
  display: block;
  margin-inline: auto; /* 左右中央 */
  height: auto;
  max-width: 100%;
}

/* 4枚とも実寸が違うので個別指定（幅＋aspect-ratioで高さ算出、狭い時は縮小） */
.lp11-solution__card:nth-child(1) .lp11-solution__img img { width: 279px; aspect-ratio: 1 / 1; }
.lp11-solution__card:nth-child(2) .lp11-solution__img img { width: 272px; aspect-ratio: 95 / 73; }
.lp11-solution__card:nth-child(3) .lp11-solution__img img { width: 291px; aspect-ratio: 133 / 117; }
.lp11-solution__card:nth-child(4) .lp11-solution__img img { width: 309px; aspect-ratio: 309 / 215; }

.lp11-solution__txt {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.lp11-solution__txt p {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.84px;
  color: #242424;
}

.lp11-solution__mark {
  border-bottom: 1px solid #A9B7CE;
  padding-bottom: 1px;
}

/* ===== 04 CTA（背景のみlp11指定。中身は共通 .lp-cta / .lp-fv__btn。LP内5箇所で共用） ===== */
.lp-cta--lp11 {
  background-color: #0A1A4F; /* 画像読込前/端の下地 */
  background-image: url('../lp-img/lp11-cta.png');
  /* background-size:cover / position:center は共通 .lp-cta 側で指定済み */
}

.lp-cta--lp11 .lp-cta__title {
  font-size: 40px; /* 共通48px→lp09に合わせて40px */
  margin-bottom: 48px; /* 見出し〜テキスト */
}

.lp-cta--lp11 .lp-cta__text {
  color: #FFF;
  text-align: center;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.96px;
  margin-bottom: 72px; /* テキスト〜ボタン */
}

/* ===== 05 ABOUT INDEED（Indeedとは・ダークセクション） ===== */
.lp11-about {
  background: radial-gradient(120% 90% at 82% 24%, #16265F 0%, #0A1533 58%);
  /* 下辺スラッシュ(.lp-slash--bottom)のクリップ分を確保 */
  padding: 96px 0 calc(184px + 40px);
}

.lp11-about__inner {
  max-width: 1160px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.lp11-about__head {
  text-align: center;
  margin-bottom: 56px;
}

.lp11-about__label {
  display: inline-block;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: #fff;
  padding-bottom: 8px;
  /* 「Indeedとは」の下だけレインボー下線 */
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%) no-repeat;
  background-size: 100% 2px;
  background-position: 0 100%;
}

.lp11-about__title {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: #fff;
  margin-top: 18px;
}

.lp11-about__lead {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 920px;
  margin: 26px auto 0;
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.03em;
  color: #E4E9F3;
}

.lp11-about__body {
  display: flex;
  align-items: center;
  gap: 44px;
}

.lp11-about__cards {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 50%;
  flex-shrink: 0;
}

.lp11-about__card {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 32px;
  align-items: start;
  background: #FAFAFA;
  border-radius: 2px;
  padding: 26px 30px 30px;
}

.lp11-about__num {
  grid-column: 1;
  grid-row: 1 / span 2;
  font-family: "Fustat", sans-serif;
  font-weight: 400;
  font-size: 56px;
  line-height: 1;
  /* レインボー */
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 0;
}

.lp11-about__ttl {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: #1F5FC7; /* 明るいカード用・暫定 */
  margin-bottom: 14px;
}

.lp11-about__txt {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lp11-about__txt p {
  font-size: 13px;
  line-height: 1.75;
  letter-spacing: 0.02em;
  color: #333; /* 明るいカード用・暫定 */
}

/* 下線マーク：リード=白文字太字+レインボー下線 / カード内=青文字+青下線 */
.lp11-about__mark {
  border-bottom: 1px solid #5B9BFF;
  padding-bottom: 1px;
}

.lp11-about__lead .lp11-about__mark {
  font-weight: 700;
  color: #fff;
  border-bottom: none;
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%) no-repeat;
  background-size: 100% 2px;
  background-position: 0 100%;
  padding-bottom: 4px;
}

.lp11-about__card .lp11-about__mark {
  color: #6DA2FF;
  border-bottom-color: #6DA2FF;
}

.lp11-about__figure {
  width: 50%;
  min-width: 0; /* flexアイテムのmin-width:auto解除（縦長画像のはみ出し防止） */
  text-align: center;
}

.lp11-about__figure img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}

@media (max-width: 768px) {
  .lp11-about {
    padding: 60px 0 64px;
  }
  .lp11-about__head {
    margin-bottom: 36px;
  }
  .lp11-about__title {
    font-size: 23px;
    margin-top: 14px;
  }
  .lp11-about__lead {
    font-size: 14px;
    text-align: left;
    margin-top: 20px;
  }
  .lp11-about__body {
    flex-direction: column;
    gap: 28px;
  }
  .lp11-about__cards,
  .lp11-about__figure {
    width: 100%;
  }
  .lp11-about__figure {
    order: -1; /* SPは図を先頭に */
  }
}

/* ===== 06 REASON（なぜIndeedが強いのか・白セクション） ===== */
/* 上辺=ABOUT、下辺=FEATURE の両方を斜めに。
   lp-slash--top の margin-top/padding-top は継承し、clip-pathだけ上下スラッシュに上書き */
.lp11-reason {
  background: #ffffff;
  clip-path: polygon(0 187px, 100% 0, 100% calc(100% - 187px), 0 100%);
  padding-bottom: calc(184px + 40px);
}

.lp11-reason__inner {
  max-width: 1160px;
  width: 100%;
  margin: 0 auto;
  /* 右paddingは0＝写真を右端まで（左は20px維持） */
  padding: 0 0 0 20px;
}

/* 斜め線付きラベル（lp09 Reason と同仕様。マスク色=白セクション） */
.lp11-reason__header {
  margin-bottom: 16px;
}

.lp11-reason__header::before {
  width: 600px;
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
}

.lp11-reason__label {
  background-image: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%), linear-gradient(#ffffff, #ffffff);
}

.lp11-reason__title {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: #14213D;
  margin-bottom: 44px;
}

.lp11-reason__body {
  display: flex;
  align-items: center;
  gap: 48px;
}

.lp11-reason__list {
  width: 52%;
  flex-shrink: 0;
}

.lp11-reason__item + .lp11-reason__item {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.30);
}

.lp11-reason__num {
  font-family: "Fustat", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1;
  color: rgba(15, 23, 43, 0.40);
  margin-bottom: 6px;
}

.lp11-reason__num span {
  margin-left: 3px;
  font-family: "Fustat", sans-serif;
  font-weight: 400;
  font-size: 48px;
  line-height: 1;
  /* レインボー */
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lp11-reason__ttl {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.4;
  letter-spacing: 1.44px;
  color: #1F5FC7;
  margin-bottom: 14px;
}

.lp11-reason__txt {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lp11-reason__txt p {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-size: 13px;
  line-height: 1.75;
  letter-spacing: 0.02em;
  color: #333;
}

.lp11-reason__mark {
  border-bottom: 1px solid #6F9BE6;
  padding-bottom: 1px;
}

.lp11-reason__figure {
  width: 48%;
  min-width: 0; /* flexアイテムのmin-width:auto解除。縦長画像で右にはみ出す→切れるのを防ぐ */
  text-align: center;
}

.lp11-reason__figure img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}

@media (max-width: 768px) {
  .lp11-reason {
    clip-path: polygon(0 5.7rem, 100% 0, 100% calc(100% - 5.7rem), 0 100%);
    padding-bottom: 8.6rem;
  }
  .lp11-reason__title {
    font-size: 23px;
    margin-bottom: 28px;
  }
  .lp11-reason__body {
    flex-direction: column;
    gap: 28px;
  }
  .lp11-reason__list,
  .lp11-reason__figure {
    width: 100%;
  }
  .lp11-reason__figure {
    order: -1;
  }
  .lp11-reason__ttl {
    font-size: 18px;
  }
}

/* ===== 07 FEATURE（Indeed広告の特徴 + 比較表・ライトグレー） ===== */
.lp11-feature {
  background: #E8E9EE;
  /* padding-top は lp-slash--top（184px / SP 5.6rem）に任せる */
  padding-bottom: 90px;
}

.lp11-feature__inner {
  max-width: 1160px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.lp11-feature__header {
  margin-bottom: 16px;
}

.lp11-feature__header::before {
  width: 600px;
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
}

.lp11-feature__label {
  background-image: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%), linear-gradient(#E8E9EE, #E8E9EE);
}

.lp11-feature__title {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: #14213D;
  margin-bottom: 24px;
}

.lp11-feature__lead {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: 0.03em;
  color: #333;
  margin-bottom: 44px;
}

.lp11-feature__cards {
  display: flex;
  gap: 30px;
  margin-bottom: 64px;
}

.lp11-feature__card {
  width: calc((100% - 60px) / 3);
  background: #FAFAFA;
  border: 1px solid rgba(0, 0, 0, 0.20);
  border-radius: 2px;
  padding: 28px 26px 30px;
}

.lp11-feature__num {
  font-family: "Fustat", sans-serif;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.06em;
  color: #9AA3B2;
  margin-bottom: 6px;
}

.lp11-feature__num span {
  font-size: 22px;
  font-weight: 700;
  color: #1F5FC7;
  margin-left: 3px;
}

.lp11-feature__ttl {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.4;
  letter-spacing: 1.44px;
  color: #0F172B;
  margin-bottom: 18px;
}

.lp11-feature__img {
  text-align: center;
  margin-bottom: 18px;
}

.lp11-feature__img img {
  display: block;
  width: 100%;
  border-radius: 2px;
  object-fit: cover;
}

.lp11-feature__txt {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lp11-feature__txt p {
  font-size: 13px;
  line-height: 1.75;
  letter-spacing: 0.02em;
  color: #333;
}

.lp11-feature__mark {
  border-bottom: 1px solid #A9B7CE;
  padding-bottom: 1px;
}

/* --- 比較表 --- */
.lp11-feature__table-title {
  text-align: center;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 28px;
  letter-spacing: 0.04em;
  color: #14213D;
  margin-bottom: 28px;
}

.lp11-table-wrap {
  overflow-x: auto;
}

.lp11-table-wrap img {
  display: block;
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
}

/* 比較表・フェーズ図のSP横スクロール用ヒント（PCでは非表示） */
.lp11-scroll-hint {
  display: none;
}

.lp11-table {
  width: 100%;
  min-width: 860px;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
  text-align: center;
}

.lp11-table thead th {
  padding: 14px 10px;
  color: #fff;
  font-weight: 700;
  background: #5B6B85;
  border: 1px solid #fff;
}

.lp11-table__cat {
  background: #3A4A66 !important;
  width: 128px;
}

.lp11-table__indeed {
  background: #1B3A8F !important;
  font-size: 15px;
}

.lp11-table tbody th {
  padding: 14px 10px;
  width: 128px;
  background: #EDEEF2;
  color: #333;
  font-weight: 700;
  border: 1px solid #fff;
}

.lp11-table tbody td {
  padding: 14px 14px;
  background: #fff;
  border: 1px solid #E4E7EE;
  vertical-align: top;
  line-height: 1.5;
  color: #333;
}

.lp11-table tbody td.is-indeed {
  background: #EAF1FC;
}

.lp11-table__mk {
  display: block;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 6px;
}

.lp11-table__mk--o { color: #1F5FC7; }
.lp11-table__mk--t { color: #8893A5; }
.lp11-table__mk--x { color: #AAB0BC; }

/* ===== 08 STRENGTH（採用トラストの強み・白） ===== */
.lp11-strength {
  background: #fff;
  padding: 80px 0 90px;
}

.lp11-strength__inner {
  max-width: 1160px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.lp11-strength__header {
  margin-bottom: 16px;
}

.lp11-strength__header::before {
  width: 600px;
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%);
}

.lp11-strength__label {
  background-image: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%), linear-gradient(#ffffff, #ffffff);
}

.lp11-strength__title {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: #14213D;
  margin-bottom: 48px;
}

.lp11-strength__block {
  margin-bottom: 56px;
}

.lp11-strength__block-num {
  font-family: "Fustat", sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1;
  color: #1F5FC7;
  margin-bottom: 8px;
}

.lp11-strength__block-ttl {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 600;
  font-size: 28px;
  line-height: 1.4;
  letter-spacing: 1.68px;
  color: #0F172B;
  margin-bottom: 32px;
}

/* --- PDCA --- */
.lp11-pdca {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lp11-pdca__row {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0;
  background: #FAFAFA;
  border: 1px solid rgba(0, 0, 0, 0.30);
  border-radius: 2px;
  padding: 26px 30px 26px 16px;
}

/* カード左上のドット（PLANの左） */
.lp11-pdca__row::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 30px;
  width: 16px;
  height: 16px;
  border-radius: 1000px;
  background: #1F5FC7;
}

.lp11-pdca__label {
  flex-shrink: 0;
  width: 170px; /* ACTION/CHECKが1行で収まる幅 */
  padding-left: 32px; /* ドット分＋余白 */
  margin-right: 31px; /* ラベル〜テキストの間 */
  text-align: left;
  white-space: nowrap;
}

.lp11-pdca__word {
  display: block;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1;
  letter-spacing: 1.44px;
  /* 「LAN」等はレインボー */
  background: linear-gradient(47deg, #1005B8 -2.66%, #0092D6 94.53%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lp11-pdca__word em {
  font-style: normal;
  font-size: 48px;
  letter-spacing: 2.88px;
  /* 大文字（P等）は48px単色 */
  -webkit-text-fill-color: #0F172B;
}

.lp11-pdca__ja {
  display: block;
  margin-top: 6px;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.84px;
  color: #242424;
}

.lp11-pdca__main {
  flex: 0 0 39.13%; /* 460pxから10%短く（43.48%×0.9） */
  min-width: 0;
  margin-top: 8px; /* 見出しを英語ラベルの小文字(LAN等)の高さに合わせる */
}

.lp11-pdca__ttl {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.5;
  color: #1F5FC7;
  margin-bottom: 12px;
}

.lp11-pdca__txt {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.lp11-pdca__txt p {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.84px;
  color: #242424;
}

/* 太字＋レインボー下線 */
.lp11-pdca__mark {
  font-weight: 700;
  color: #242424;
  background: linear-gradient(46.7deg, #1005B8 -2.66%, #0092D6 94.53%) no-repeat;
  background-size: 100% 2px;
  background-position: 0 100%;
  padding-bottom: 4px;
}

.lp11-pdca__img {
  flex-shrink: 0;
  width: 38.37%; /* 406px ÷ row内容幅1058px */
  margin-left: auto; /* 画像を右端寄せ */
}

.lp11-pdca__img img {
  width: 100%;
  border-radius: 2px;
}

/* --- Caution --- */
.lp11-caution {
  max-width: 1035px;
  margin: 0 auto 56px;
  background: #F2DB69;
  border-radius: 6px;
  padding: 30px 40px;
  text-align: center;
}

.lp11-caution__ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 800;
  font-size: 32px;
  line-height: 1.4;
  letter-spacing: 1.92px;
  color: #000;
  margin-bottom: 16px;
}

.lp11-caution__icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
}

.lp11-caution__txt {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 1.28px;
  text-align: center;
  color: #000;
}

/* --- 02 総合支援 --- */
.lp11-strength__block-sub {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.4;
  letter-spacing: 1.44px;
  color: #1F5FC7;
  margin-bottom: 20px;
}

.lp11-strength__note {
  position: relative;
  background: #FAFCFF;
  padding: 24px 28px 24px 42px;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: 36px;
}

/* 左のたて線＝レインボー */
.lp11-strength__note::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 6px;
  background: linear-gradient(180deg, #1005B8, #0092D6);
}

.lp11-strength__note p {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 0.96px;
  color: #242424;
}

.lp11-strength__phase {
  text-align: center;
}

.lp11-strength__phase img {
  max-width: 100%;
}

@media (max-width: 768px) {
  /* FEATURE */
  .lp11-feature__title,
  .lp11-strength__title {
    font-size: 24px;
  }
  .lp11-feature__lead {
    font-size: 14px;
  }
  .lp11-feature__cards {
    flex-direction: column;
    gap: 20px;
    margin-bottom: 44px;
  }
  .lp11-feature__card {
    width: 100%;
  }
  .lp11-feature__table-title {
    font-size: 21px;
  }
  /* STRENGTH / PDCA */
  .lp11-strength__block-ttl {
    font-size: 18px;
    margin-bottom: 24px;
  }
  .lp11-pdca__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding: 22px;
  }
  /* SPはドット削除し、その分ラベルを左詰め */
  .lp11-pdca__row::before {
    display: none;
  }
  .lp11-pdca__label {
    display: flex;
    align-items: baseline;
    gap: 10px;
    width: auto;
    padding-left: 0;
    text-align: left;
  }
  .lp11-pdca__ja {
    margin-top: 0;
  }
  .lp11-pdca__img {
    width: 100%;
  }
  .lp11-caution {
    padding: 24px 22px;
  }
  .lp11-caution__ttl {
    font-size: 19px;
  }
}

/* ===== 10 PRICE（制作料金・ダーク） ===== */
.lp11-price {
  background: radial-gradient(120% 90% at 80% 28%, #16265F 0%, #0A1533 60%);
  padding: 80px 0 90px;
  text-align: center;
}

/* Priceラベルは白文字（グラデ解除） */
.lp11-price .lp-section-label {
  font-family: "Fustat", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: 1.6px;
  background: none;
  -webkit-text-fill-color: #fff;
  color: #fff;
}

.lp11-price__inner {
  max-width: 1160px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.lp11-price__title {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 34px;
  letter-spacing: 0.06em;
  color: #fff;
  margin: 14px 0 40px;
}

.lp11-price__box {
  max-width: 600px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #F1F5F9;
  border-radius: 6px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
  padding: 44px 40px 24px;
}

.lp11-price__amount {
  display: flex;
  align-items: baseline;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 6px;
  padding-bottom: 24px;
}

.lp11-price__num {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 56px;
  line-height: 60px;
  color: #1F5FC7;
}

.lp11-price__man {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 60px;
  color: #1F5FC7;
}

.lp11-price__unit {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  color: #5E5E5E;
}

.lp11-price__tax {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-left: 10px;
  padding: 4px 24px;
  background: rgba(43, 127, 255, 0.12);
  border-radius: 32px;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 28px;
  color: #5E5E5E;
  align-self: center;
}

.lp11-price__note {
  display: inline-block;
  margin-top: 24px;
  padding: 4.81%;
  border: 1px solid #F1F5F9;
  border-radius: 4px;
  background: #F2F5F8;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.84px;
  color: #666;
  text-align: center;
}

/* ===== 12 FLOW（導入までの流れ・ライト） ===== */
.lp11-flow {
  background: #E8E9EE;
  padding: 70px 0 80px;
}

.lp11-flow__inner {
  max-width: 1160px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.lp11-flow__title {
  text-align: center;
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 700;
  font-size: 32px;
  letter-spacing: 0.06em;
  color: #14213D;
  margin: 8px 0 44px;
}

.lp11-flow__steps {
  display: flex;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.lp11-flow__step {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
  padding: 0 4px;
}

/* STEPラベル間の破線コネクタ */
.lp11-flow__step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 50%;
  width: 100%;
  height: 2px;
  background: #97ACC9;
  z-index: 0;
}

.lp11-flow__step-num {
  position: relative;
  z-index: 1;
  display: inline-block;
  background: #E8E9EE;
  padding: 0 8px;
  font-family: "Fustat", sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 1;
  letter-spacing: 0.08em;
  color: #1F5FC7;
  margin-bottom: 16px;
}

.lp11-flow__step-icon {
  /* アイコン画像に白い円が含まれるため、CSSの紺丸背景は削除 */
  width: 116px;
  height: 116px;
  margin: 0 auto 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lp11-flow__step-icon img {
  width: 116px;
  height: 116px;
  object-fit: contain;
}

.lp11-flow__step-text {
  font-family: "Hiragino Sans", "ヒラギノ角ゴシック", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.84px;
  color: #333;
  text-align: center;
}

@media (max-width: 768px) {
  .lp11-price__title {
    font-size: 24px;
    margin-bottom: 28px;
  }
  .lp11-price__box {
    padding: 32px 24px 24px;
  }
  .lp11-price__num {
    font-size: 48px;
  }
  .lp11-price__note {
    display: block;
    margin-top: 20px;
    padding: 18px 16px;
  }
  .lp11-flow__title {
    font-size: 23px;
    margin-bottom: 32px;
  }
  .lp11-flow__steps {
    flex-direction: column;
    align-items: center;
    row-gap: 24px;
  }
  .lp11-flow__step {
    flex: 0 0 auto;
    width: 100%;
    max-width: 300px;
  }
  .lp11-flow__step:not(:last-child)::after {
    display: none; /* SPは破線コネクタ非表示 */
  }
}

@media (max-width: 768px) {
  .lp11-solution__title {
    font-size: 24px;
    margin-bottom: 20px;
  }
  .lp11-solution__lead {
    font-size: 14px;
    gap: 16px;
    margin-bottom: 40px;
  }
  .lp11-solution__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .lp11-solution__card {
    padding: 28px 24px;
  }
  .lp11-solution__ttl {
    font-size: 19px;
    margin-bottom: 20px;
  }
  /* Point番号・写真を少し小さく */
  .lp11-solution__num span {
    font-size: 40px;
  }
  .lp11-solution__card:nth-child(1) .lp11-solution__img img,
  .lp11-solution__card:nth-child(2) .lp11-solution__img img,
  .lp11-solution__card:nth-child(3) .lp11-solution__img img,
  .lp11-solution__card:nth-child(4) .lp11-solution__img img {
    width: 72%;
    max-width: 72%;
  }
}

/* ===== SP 全体の追い込み（セクション余白の縮小・細部の抜け補完） ===== */
@media (max-width: 768px) {
  /* FV：英字ラベルを縮小 */
  .lp11-fv__label-txt {
    font-size: 18px;
    letter-spacing: 1.2px;
  }

  /* SOLUTION：下余白 */
  .lp11-solution {
    padding-bottom: 60px;
  }

  /* ABOUT：見出しラベル・カード内を縮小 */
  .lp11-about__label {
    font-size: 23px;
  }
  .lp11-about__card {
    column-gap: 16px;
    padding: 22px 20px 24px;
  }
  .lp11-about__num {
    font-size: 40px;
  }
  .lp11-about__ttl {
    font-size: 16px;
    margin-bottom: 10px;
  }

  /* FEATURE：下余白 */
  .lp11-feature {
    padding-bottom: 60px;
  }

  /* STRENGTH：セクション余白・見出し・総合支援ノート */
  .lp11-strength {
    padding: 60px 0 64px;
  }
  .lp11-strength__block {
    margin-bottom: 40px;
  }
  .lp11-strength__block-num {
    font-size: 32px;
  }
  .lp11-strength__block-sub {
    font-size: 18px;
  }
  .lp11-strength__note {
    padding: 20px 18px 20px 28px;
    margin-bottom: 28px;
  }
  .lp11-strength__note p {
    font-size: 14px;
  }

  /* PRICE：セクション余白 */
  .lp11-price {
    padding: 60px 0 64px;
  }

  /* FLOW：セクション余白 */
  .lp11-flow {
    padding: 56px 0 60px;
  }

  /* CTA：見出し/テキストのSPサイズ（lp09に合わせる）＋余白を詰める */
  .lp-cta--lp11 .lp-cta__title {
    font-size: 24px;
    margin-bottom: 28px;
  }
  .lp-cta--lp11 .lp-cta__text {
    font-size: 15px;
    margin-bottom: 40px;
    text-align: left;
  }

  /* 比較表・フェーズ図：SPは縮小せず横スクロール（右にスクロール）＋ヒント表示 */
  .lp11-scroll-hint {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    font-size: 11px;
    color: rgba(0, 0, 0, 0.5);
    margin-top: 8px;
  }
  .lp11-table-wrap {
    -webkit-overflow-scrolling: touch;
  }
  .lp11-table-wrap img {
    width: 900px;
    max-width: none;
  }
  .lp11-strength__phase {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    text-align: left;
  }
  .lp11-strength__phase img {
    width: 900px;
    max-width: none;
  }
}