/* =========================================================
   LP COMMON（lp-common.css）最終版
   - 背景は各LP（lp-sales / lp-ses）が持つ（commonは壊さない）
   - H2/H3/H4 基本整形 + has-background/has-font-size に勝つ
   - 画像/ボタンの白フレーム禁止
========================================================= */

:root{
  --lp-wrap: 1120px;

  --lp-h2-top: 56px;
  --lp-h2-btm: 24px;
  --lp-h3-top: 34px;
  --lp-h3-btm: 16px;
  --lp-h4-top: 22px;
  --lp-h4-btm: 10px;
  --lp-p-btm: 18px;

  --lp-shadow: 0 18px 40px rgba(15,23,42,.14);
}

/* ✅背景は “触らない” (lp-sales / lp-ses 側で指定) */
body.lp-common{
  background-color: transparent;
  /* background-image 等はここで指定しない */
  --wp--style--global--content-size: var(--lp-wrap);
  --wp--style--global--wide-size: var(--lp-wrap);
}

/* 本文 */
body.lp-common section.r_side .entry-content{
  max-width: var(--lp-wrap);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  padding-left: 24px;
  padding-right: 24px;

  font-size: 18px;
  line-height: 1.95;
  color: #0f172a;
}

/* Gutenbergの横ズレ抑制 */
body.lp-common section.r_side .entry-content :is(.alignwide,.alignfull,.is-layout-constrained){
  margin-left: auto !important;
  margin-right: auto !important;
}
body.lp-common section.r_side .entry-content :is(.alignwide,.alignfull){
  max-width: var(--lp-wrap) !important;
  width: 100% !important;
}
body.lp-common section.r_side .entry-content .wp-block-group__inner-container.is-layout-constrained{
  max-width: var(--lp-wrap) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* p */
body.lp-common section.r_side .entry-content p{
  margin: 0 0 var(--lp-p-btm) !important;
}

/* =========================================================
   見出し（基本）
========================================================= */
body.lp-common section.r_side .entry-content :is(h2, h2.wp-block-heading){
  font-size: 34px !important;
  line-height: 1.22 !important;
  font-weight: 900 !important;
  margin: var(--lp-h2-top) auto var(--lp-h2-btm) !important;
  padding: 0 !important;
  text-align: center !important;
}
body.lp-common section.r_side .entry-content :is(h3, h3.wp-block-heading){
  font-size: 24px !important;
  line-height: 1.28 !important;
  font-weight: 900 !important;
  margin: var(--lp-h3-top) 0 var(--lp-h3-btm) !important;
  padding: 0 !important;
  text-align: center !important;
}
body.lp-common section.r_side .entry-content :is(h4, h4.wp-block-heading){
  font-size: 18px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  margin: var(--lp-h4-top) 0 var(--lp-h4-btm) !important;
  padding: 0 !important;
}

/* ✅ has-*-font-size が付いても “見出しサイズを維持” */
body.lp-common section.r_side .entry-content :is(h2,h2.wp-block-heading).has-large-font-size,
body.lp-common section.r_side .entry-content :is(h2,h2.wp-block-heading).has-medium-font-size,
body.lp-common section.r_side .entry-content :is(h2,h2.wp-block-heading).has-small-font-size{
  font-size: 34px !important;
}
body.lp-common section.r_side .entry-content :is(h3,h3.wp-block-heading).has-large-font-size,
body.lp-common section.r_side .entry-content :is(h3,h3.wp-block-heading).has-medium-font-size,
body.lp-common section.r_side .entry-content :is(h3,h3.wp-block-heading).has-small-font-size{
  font-size: 24px !important;
}
body.lp-common section.r_side .entry-content :is(h4,h4.wp-block-heading).has-large-font-size,
body.lp-common section.r_side .entry-content :is(h4,h4.wp-block-heading).has-medium-font-size,
body.lp-common section.r_side .entry-content :is(h4,h4.wp-block-heading).has-small-font-size{
  font-size: 18px !important;
}

/* ✅ has-background の巨大padding/巨大fontを抑制（テーマ対策） */
body.lp-common section.r_side .entry-content :is(h2,h2.wp-block-heading).has-background{
  padding: 18px 22px !important;
  border-radius: 18px !important;
}
body.lp-common section.r_side .entry-content :is(h3,h3.wp-block-heading).has-background{
  padding: 14px 18px !important;
  border-radius: 14px !important;
}
body.lp-common section.r_side .entry-content :is(h4,h4.wp-block-heading).has-background{
  padding: 14px 16px !important;
  border-radius: 14px !important;
}

/* =========================================================
   画像／ボタン：白フレーム禁止（完全）
========================================================= */

/* 画像コンテナ */
body.lp-common section.r_side .entry-content figure.wp-block-image,
body.lp-common section.r_side .entry-content .wp-block-image{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
/* 画像本体 */
body.lp-common section.r_side .entry-content figure.wp-block-image img,
body.lp-common section.r_side .entry-content .wp-block-image img{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  border-radius: 18px !important;
  box-shadow: var(--lp-shadow) !important;
  display: block;
  width: 100%;
  height: auto;
}

/* ボタン本体（白枠を殺す） */
body.lp-common section.r_side .entry-content .wp-block-button__link,
body.lp-common section.r_side .entry-content a.wp-element-button{
  border: 0 !important;
  outline: 0 !important;
  border-radius: 999px !important;
  box-shadow: var(--lp-shadow) !important;
  text-decoration: none !important;
}
body.lp-common section.r_side .entry-content .wp-block-button,
body.lp-common section.r_side .entry-content .wp-block-buttons{
  border: 0 !important;
  background: transparent !important;
}

/* SP */
@media (max-width: 768px){
  body.lp-common section.r_side .entry-content{
    padding-left: 14px;
    padding-right: 14px;
    font-size: 16px;
    line-height: 1.9;
  }
  body.lp-common section.r_side .entry-content :is(h2,h2.wp-block-heading){
    font-size: 26px !important;
    margin: 44px auto 18px !important;
  }
  body.lp-common section.r_side .entry-content :is(h3,h3.wp-block-heading){
    font-size: 20px !important;
    margin: 26px 0 12px !important;
  }
  body.lp-common section.r_side .entry-content figure.wp-block-image img,
  body.lp-common section.r_side .entry-content .wp-block-image img{
    border-radius: 14px !important;
  }
}

/* =========================================================
   VK Blocks：vk_borderBox を「角丸なし + body白背景」で統一（最終上書き）
   - lp-sales / lp-ses / lp-engineer すべて対象
   - “ここだけ直らない”対策で強めに !important
========================================================= */
body:is(.lp-sales,.lp-ses,.lp-engineer) section.r_side .entry-content .vk_borderBox,
body:is(.lp-sales,.lp-ses,.lp-engineer) section.r_side .entry-content .vk_borderBox *{
  border-radius: 0 !important; /* 角丸を完全に殺す（再付与対策） */
}

/* 外枠（コンテナ）は角丸なしのまま・はみ出しも防ぐ */
body:is(.lp-sales,.lp-ses,.lp-engineer) section.r_side .entry-content .vk_borderBox{
  overflow: hidden !important; /* 中の白背景が枠からはみ出すのを防ぐ */
}

/* ✅ご要望：vk_borderBox_body に白背景（角丸なし） */
body:is(.lp-sales,.lp-ses,.lp-engineer) section.r_side .entry-content .vk_borderBox .vk_borderBox_body{
  background: rgba(255,255,255,.92) !important;
  border-radius: 0 !important;
}

/* 念のため：中の p がカード化/背景付与されていても borderBox 内では透明に */
body:is(.lp-sales,.lp-ses,.lp-engineer) section.r_side .entry-content .vk_borderBox .vk_borderBox_body p{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* =========================================================
   SP背景を「途切れない固定レイヤー」に統一（lp-common）
   - body::before に背景画像
   - body::after  に白い膜
   - background-attachment: fixed を使わない
========================================================= */

/* 既存の body背景指定があっても干渉しないように保険 */
body.lp-sales,
body.lp-ses,
body.lp-engineer{
  background: none !important;
}

/* 背景画像レイヤー */
body.lp-sales::before,
body.lp-ses::before,
body.lp-engineer::before{
  content:"";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;

  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover; /* ← 途切れ防止の要 */
}

/* 白い膜レイヤー（必要なら濃さ調整） */
body.lp-sales::after,
body.lp-ses::after,
body.lp-engineer::after{
  content:"";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: rgba(255,255,255,.62);
}

/* 各LPの背景画像パス（環境に合わせて統一） */
body.lp-sales::before{
  background-image: url("/wp-content/themes/solal-style/assets/img/SOLAL_back.png");
}
body.lp-ses::before{
  background-image: url("/wp-content/themes/solal-style/assets/img/SOLAL_back.png");
}
body.lp-engineer::before{
  background-image: url("/wp-content/themes/solal-style/assets/img/SOLAL_back.png");
}

/* section 側に残っている背景・膜は透明化（背景連続を邪魔するため） */
body.lp-sales section.r_side,
body.lp-ses section.r_side,
body.lp-engineer section.r_side{
  background: transparent !important;
}
body.lp-sales section.r_side::before,
body.lp-ses section.r_side::before,
body.lp-engineer section.r_side::before{
  content: none !important;
}

/* =========================================================
   LP共通：右上固定お問い合わせボタン
========================================================= */

body.lp-common .lp-floating-contact{
  position: fixed;
  top: 120px;
  right: 24px;
  z-index: 9999;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  min-width: 210px;
  padding: 16px 24px;

  border-radius: 999px;

  background: linear-gradient(
    90deg,
    #2413aa 0%,
    #315bea 48%,
    #4075ff 100%
  );

  color: #ffffff !important;

  font-size: 16px;
  font-weight: 900;
  line-height: 1;

  text-decoration: none !important;

  box-shadow:
    0 10px 30px rgba(15, 23, 42, 0.22);

  transition:
    transform .2s ease,
    box-shadow .2s ease,
    opacity .2s ease;
}


/* マウスを乗せた時 */

body.lp-common .lp-floating-contact:hover{
  transform: translateY(-2px);

  box-shadow:
    0 14px 36px rgba(15, 23, 42, 0.28);

  opacity: .94;
}


/* ↓アイコン */

body.lp-common .lp-floating-contact span{
  font-size: 18px;
  line-height: 1;
}


/* 飛び先が上部に張り付かないようにする */

body.lp-common #lp-contact{
  scroll-margin-top: 110px;
}


/* =========================================================
   スマートフォン
========================================================= */

@media (max-width: 768px){

  body.lp-common .lp-floating-contact{
    top: auto;
    right: 16px;
    bottom: 18px;

    min-width: 150px;
    padding: 13px 18px;

    font-size: 14px;
  }

}