/* ============================================================
   LP コンテンツ用ベースCSS (PC)
   - .lp-content スコープで LP 内の HTML をリセット
   - 既存テーマCSSと衝突しないよう最低限のリセットのみ
   ============================================================ */

main.lp-main {
  width: 100%;
  margin: 0;
  padding: 0;
  display: block; /* 共通 main { display: flex } を打ち消し (LP は縦並びレイアウト) */
}

/* パンクズ表示エリア (LP 内でも他ページと同じ位置・スタイル感) */
.lp-breadcrumb-wrap {
  max-width: var(--width-main); /* 980px */
  margin: 0 auto;
  padding: 8px 1em 0;
  box-sizing: border-box;
}
.lp-breadcrumb-wrap .bred-crumb-list {
  padding-left: 0;
  padding-right: 0;
}

.lp-content {
  width: 100%;
  max-width: var(--width-main); /* 980px: 既存メインコンテンツ幅と統一 (root-config.css) */
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  color: #333;
  line-height: 1.6;
  font-size: 16px;
}

.lp-content *,
.lp-content *::before,
.lp-content *::after {
  box-sizing: border-box;
}

.lp-content img,
.lp-content picture,
.lp-content video {
  max-width: 100%;
  height: auto;
  display: block;
}

.lp-content a {
  color: inherit;
  text-decoration: none;
}

.lp-content ul,
.lp-content ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lp-content h1,
.lp-content h2,
.lp-content h3,
.lp-content h4,
.lp-content h5,
.lp-content h6 {
  margin: 0;
  font-weight: bold;
}

.lp-content p {
  margin: 0;
}

/* スライド画像を縦に並べる用 (画像化方式の標準パターン) */
.lp-content .lp-slides {
  display: block;
  width: 100%;
}
.lp-content .lp-slides img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0;
}