/* css/client.css functions.phpで設定=========================================================
  LUX LP + HMZ AD SPEC + TERMS（完全統合・重複排除版）
  &#x2705; これを “1つの <style>” にして貼ってください
========================================================= */

/* =========================================================
  0) Shared Tokens（全体の共通トーン）
========================================================= */
:root,
.lux-theme{
  --bg:#f2f6ff;
  --panel:rgba(255,255,255,.82);
  --text:#0b0f18;
  --muted:rgba(11,15,24,.68);
  --line:rgba(15,23,42,.12);
  --shadow:0 16px 60px rgba(2,6,23,.10);

  --c1:#2bb8ff; /* blue */
  --c2:#ff2f73; /* pink */
  --c3:#34d399; /* green */
  --c4:#ffb84b; /* amber */
}

/* =========================================================
  1) LUX LP（luxlp-）
========================================================= */

/* ---------- Window layer（動画の上に透過webpを重ねる） ---------- */
.luxlp-window-layer{
  position:relative;
  overflow:hidden;
}

/* 親が .luxlp-media-frame のときは比率で高さを作る（重要） */
.luxlp-media-frame{
  position:relative;
  aspect-ratio: 16/10;
  background: radial-gradient(800px 500px at 30% 30%, rgba(41,182,246,.18), rgba(0,0,0,.18));
  overflow:hidden;
}

.luxlp-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:1;
}

/*.luxlp-video.is-tilt{
  --p: 900px; --ry: -45deg; --rx: 0deg; --s: 1.1; --tx: -18%; --ty: -1%;
  transform: perspective(var(--p)) rotateY(var(--ry)) rotateX(var(--rx)) scale(var(--s)) translate(var(--tx), var(--ty));
}*/

.luxlp-window-layer{
  --p: 900px;
  --ry: 0deg;
  --rx: 0deg;
  --rz: 0deg;          /* ✅追加（右下がり用） */
  --s: 1;
  --tx: 0%;
  --ty: 0%;
  --origin: center center;
}

.luxlp-video.is-tilt{
  /* ✅ translateを一番左にして「最後に位置合わせ」 */
  transform:
    translate(var(--tx), var(--ty))
    perspective(var(--p))
    rotateY(var(--ry))
    rotateX(var(--rx))
    rotateZ(var(--rz))  /* ✅右下がりはコレ */
    scale(var(--s));
}


/* overlay（透過webp全面固定） */
.luxlp-overlay-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:2;
  pointer-events:none;
  display:block;
  opacity:1;
  transition: opacity .25s ease;
}

/* JSで一瞬付ける用（任意） 
.luxlp-overlay-img.is-fading{
  opacity:0;
}*/
.luxlp-overlay-img.is-fading{ opacity:.35; }

/* =========================================
  Hero mode switch
  .luxlp-window-layer: is-image / is-video / is-both
========================================= */

/* すべて共通：フェードを効かせる（任意） */
.luxlp-window-layer .luxlp-video,
.luxlp-window-layer .luxlp-overlay-img{
  transition: opacity .25s ease, visibility .25s ease;
}

/* 画像モード：動画を非表示（ロードはしてても見せない） */
.luxlp-window-layer.is-image .luxlp-video{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* 画像モード：overlayは表示 */
.luxlp-window-layer.is-image .luxlp-overlay-img{
  opacity: 1;
  visibility: visible;
}

/* 動画モード：動画表示 */
.luxlp-window-layer.is-video .luxlp-video{
  opacity: 1;
  visibility: visible;
}

/* 動画モード：overlay非表示（窓フレームを消す） */
.luxlp-window-layer.is-video .luxlp-overlay-img{
  opacity: 0;
  visibility: hidden;
}

/* 両方モード：両方表示（動画 + 透過webpフレーム） */
.luxlp-window-layer.is-both .luxlp-video{
  opacity: 1;
  visibility: visible;
}
.luxlp-window-layer.is-both .luxlp-overlay-img{
  opacity: 1;
  visibility: visible;
}

/* ---------- Page base ---------- */
.luxlp{ position:relative; isolation:isolate; color:var(--text); }
.luxlp-wrap{ max-width:90%; margin:0 auto; padding:10 10px; }

@media (max-width: 767px) {
  .luxlp-wrap{ max-width:100%; }
}

/* Background (light) */
.luxlp-bg{
  position:absolute; inset:0; z-index:-3;
  background:
    radial-gradient(900px 600px at 18% 10%, rgba(41,182,246,.18), transparent 60%),
    radial-gradient(700px 520px at 85% 25%, rgba(255,0,90,.10), transparent 55%),
    radial-gradient(900px 700px at 60% 90%, rgba(56,238,39,.12), transparent 60%),
    linear-gradient(180deg, #fbfdff 0%, var(--bg) 45%, #fbfdff 100%);
}
.luxlp-noise{
  position:absolute; inset:0; z-index:-2;
  opacity:.025; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}

/* ---------- Hero ---------- */
/*.luxlp-hero{ padding:110px 0 36px; }*/
.luxlp-hero-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:32px; align-items:center; }
@media (max-width:980px){
  .luxlp-hero{ padding-top:20px; }
  .luxlp-hero-grid{ grid-template-columns:1fr; }
}

.luxlp-badge{
  /*display:inline-block; */
  width:90%;
  margin: 0 auto;
  padding:.5em .85em; border-radius:999px;
  color:#fff;
  text-align: center;
  font-size:1.2rem; letter-spacing:.12em;
  background: rgba(255,0,0);
  /*border: 3px solid #000;*/
  backdrop-filter: blur(10px);
}

/* 文字サイズに合わせて伸びる「回る枠」 */
.border-box{
  --ring: 5px;     /* 枠の太さ（好みで） */
  --r: 999px;       /* 角丸（pillにしたいなら大きく） */
  --speed: 3s;

  position: relative;
  display: inline-block;   /* &#x2705; 文字量で幅が決まる */
  padding: var(--ring);    /* &#x2705; ここが枠の厚み分 */
  border-radius: var(--r);
  overflow: hidden;        /* はみ出し隠す */

  /* 外側の固定黒（任意） */
  background: #ffffff;
}

/* 回る色（外周用） */
.border-box::before{
  content:"";
  position:absolute;
  inset:-280%; /* &#x2705; デカくして欠け防止 */
  background: conic-gradient(
    #25f7ff,
    #4c7dff,
    #ff3aa6,
    #ffb703,
    #3cff6f,
    #25f7ff
  );
  animation: rotate var(--speed) linear infinite;
}

/* 内側（文字の背景） */
.border-box .content{
  position: relative;
  z-index: 1;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 14px 42px;     /* &#x2705; 文字周りの余白でサイズ調整 */
  background: #222;
  color:#fff;
  border-radius: calc(var(--r) - var(--ring));
  font-family: sans-serif;
  white-space: nowrap;    /* &#x2705; 1行固定（改行したいなら消す） */
}

/* 回転アニメ */
@keyframes rotate{
  to{ transform: rotate(360deg); }
}

/* heroコピー内でバッジだけ中央に */
.luxlp-hero-copy .border-box{
  display: inline-block;   /* 文字幅にフィット */
  margin: 0 auto;     /* ✅ 左右中央 + 下に余白 */
}

/* inline-block を margin:auto で中央にするための土台 */
.luxlp-hero-copy{
  text-align: center;      /* ✅ border-box を中央に */
}

/* h1/lead/cta は今まで通り左寄せに戻したい場合 */
.luxlp-hero-copy .luxlp-lead,
.luxlp-hero-copy .luxlp-cta,
.luxlp-hero-copy .luxlp-kpi{
  text-align: left;
}
/*---------end----*/

.luxlp-h1{
  margin:14px 0 10px;
  font-size: clamp(2rem, 4.2vw, 3.4rem);
  line-height:1.1; letter-spacing:.04em;
  text-align:center;
}
.luxlp-grad{
  background: linear-gradient(90deg, rgba(41,182,246,1), rgba(255,0,90,1), rgba(56,238,39,1));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.luxlp-lead{ margin:0 0 18px; color: rgba(11,15,24,.78); line-height:1.75; font-size:1.02rem; }

.luxlp-cta{ display:flex; gap:12px; flex-wrap:wrap; margin:18px 0; }
.luxlp-btn{
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; padding:.9em 1.25em;
  text-decoration:none; font-weight:650; letter-spacing:.06em;
  border: 1px solid rgba(15,23,42,.14);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  user-select:none;
}
.luxlp-btn:hover{ transform: translateY(-2px); }
.luxlp-btn-primary{
  background: linear-gradient(90deg, rgba(41,182,246,1), rgba(255,0,90,1));
  box-shadow: 0 14px 34px rgba(41,182,246,.18);
  color:#fff;
}
.luxlp-btn-ghost{ background: rgba(255,255,255,.78); }
.luxlp-btn-full{ width:100%; background-color:rgba(114, 210, 230, 0.34); }

/* KPI */
.luxlp-kpi{ display:flex; gap:12px; flex-wrap:wrap; margin-top:10px; }
.luxlp-kpi-item{
  flex:1; min-width:180px;
  padding:12px 14px; border-radius:18px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}
.luxlp-kpi-num{ font-weight:800; letter-spacing:.08em; }
.luxlp-kpi-txt{ color: rgba(11,15,24,.68); font-size:.92rem; margin-top:4px; }

/* Media card */
.luxlp-media-card{
  border-radius:22px; overflow:hidden;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: var(--shadow);
  backdrop-filter: blur(12px);
}
.luxlp-media-top{
  background: rgba(11,15,24,.92);
  display:flex; align-items:center; gap:8px;
  padding:10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.luxlp-dot{ width:10px; height:10px; border-radius:999px; background: rgba(255,255,255,.22); }
.luxlp-media-label{ margin-left:auto; font-size:.86rem; color: rgba(255,255,255,.78); display:flex; gap:.5em; align-items:center; white-space:nowrap; }
.luxlp-media-label b{ font-weight:800; color: rgba(255,255,255,.9); }

/* cases */
.luxlp-cases{ display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 980px){ .luxlp-cases{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px){ .luxlp-cases{ grid-template-columns: 1fr; } }
.luxlp-case{
  position: relative;
  overflow: hidden;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 14px 40px rgba(2,6,23,.10);
  background: rgba(255,255,255,.72);
}
.luxlp-cases .luxlp-case:nth-child(1){ background: linear-gradient(135deg, rgba(0,140,255,.22), rgba(41,182,246,.14), rgba(255,255,255,.72)); }
.luxlp-cases .luxlp-case:nth-child(2){ background: linear-gradient(135deg, rgba(255,0,120,.18), rgba(164,124,255,.14), rgba(255,255,255,.72)); }
.luxlp-cases .luxlp-case:nth-child(3){ background: linear-gradient(135deg, rgba(0,200,120,.18), rgba(56,238,39,.12), rgba(255,255,255,.72)); }
.luxlp-cases .luxlp-case:nth-child(4){ background: linear-gradient(135deg, rgba(255,140,0,.18), rgba(255,210,0,.12), rgba(255,255,255,.72)); }
.luxlp-case h3{ margin:0 0 6px; font-weight:600; color:#0b0f18; }
.luxlp-case p{ margin:0; color: rgba(11,15,24,.78); line-height: 1.7; }

/* Tags */
.luxlp-media-tags{
  background: rgba(255,255,255,.78);
  border-top: 1px solid rgba(15,23,42,.10);
  display:flex; flex-wrap:wrap; gap:8px;
  padding:12px;
}
.luxlp-tag{
  appearance:none;
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(15,23,42,.06);
  color: rgba(11,15,24,.86);
  font-size:.86rem;
  padding:.38em .72em;
  border-radius:999px;
  cursor:pointer;
  line-height:1;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.luxlp-tag:hover{ transform: translateY(-1px); }
.luxlp-tag.is-active{
  background: rgba(0, 76, 255, 0.92);
  border-color: rgba(0, 76, 255, 0.92);
  color:#fff;
}

/* Sections */
.luxlp-section{ padding:52px 0; }
.luxlp-head{ text-align:center; margin-bottom:22px; }
.luxlp-h2{ margin:0 0 6px; font-size: clamp(1.5rem, 2.6vw, 2.2rem); letter-spacing:.06em; font-weight:600; }
.luxlp-sub{ margin:0 auto; max-width:820px; color: rgba(11,15,24,.78); line-height:1.75; }

/* Trust row */
.luxlp-trust{ padding-top:12px; padding-bottom:12px; }
.luxlp-trust-row{
  display:flex; gap:14px; flex-wrap:wrap; align-items:center; justify-content:center;
  padding:12px;
  border-radius:20px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}
.luxlp-mini{ margin:0; color: rgba(11,15,24,.68); font-weight:700; letter-spacing:.08em; }
.luxlp-chipset{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.luxlp-chip{
  padding:.35em .7em; border-radius:999px;
  background: rgb(93 255 73 / 52%);
  border: 1px solid rgba(15,23,42,.10);
  font-size:.88rem;
}

/* Cards / Services / Flow / Apply / FAQ */
.luxlp-card,.luxlp-service,.luxlp-flow li,.luxlp-apply-box,.luxlp-faq-item{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}

/* Cards */
.luxlp-cards3{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:16px; }
@media (max-width:980px){ .luxlp-cards3{ grid-template-columns:1fr; } }
.luxlp-card{ padding:18px; border-radius:20px; }
.luxlp-card h3{ margin:0 0 6px; letter-spacing:.06em; font-weight:600; }
.luxlp-card p{ margin:0; color: rgba(11,15,24,.76); line-height:1.75; }

.luxlp-card01 {background:linear-gradient(135deg, rgba(255,0,120,.18), rgba(164,124,255,.14), rgba(255,255,255,.72));}
.luxlp-card02 {background: linear-gradient(135deg, rgba(0,200,120,.18), rgba(56,238,39,.12), rgba(255,255,255,.72));}
.luxlp-card03 {background: linear-gradient(135deg, rgba(0,140,255,.22), rgba(41,182,246,.14), rgba(255,255,255,.72));}
/* =========================================
   ONLY: #why #services #cases background
   - 全体背景は暗くしない（光だけ）
========================================= */

#why.luxlp-section,
#services.luxlp-section,
#cases.luxlp-section{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: transparent;
}

/* 光レイヤー（暗くならない） */
#why.luxlp-section::before,
#services.luxlp-section::before,
#cases.luxlp-section::before{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:-1;
  pointer-events:none;

  opacity:.42;            /* 濃さ：0.25〜0.55 */
  mix-blend-mode: screen; /* 暗くせず光だけ */
}

/* うっすら質感（任意） */
#why.luxlp-section::after,
#services.luxlp-section::after,
#cases.luxlp-section::after{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:-1;
  pointer-events:none;
  opacity:.12;
  mix-blend-mode: overlay;
  background:
    repeating-linear-gradient(-18deg,
      rgba(255,255,255,.08) 0px,
      rgba(255,255,255,.08) 1px,
      transparent 1px,
      transparent 12px
    );
}

/* WHY：ブルー×シアン 
#why.luxlp-section::before{
  background:
    radial-gradient(1100px 560px at 16% 18%, rgba(2,198,253,.55), transparent 60%),
    radial-gradient(900px 520px at 78% 22%, rgba(34,86,255,.55), transparent 58%);
}*/

/* SERVICES：ピンク×ブルー */
#services.luxlp-section::before{
  background:
    radial-gradient(1200px 620px at 18% 18%, rgba(34,86,255,.55), transparent 60%),
    radial-gradient(950px 560px at 86% 22%, rgba(253,41,123,.50), transparent 58%);
}

/* CASES：グリーン×シアン */
#cases.luxlp-section::before{
  background:
    radial-gradient(1100px 580px at 20% 18%, rgba(56,238,39,.45), transparent 60%),
    radial-gradient(900px 520px at 82% 18%, rgba(2,198,253,.45), transparent 58%);
}

/* スマホは少し薄く */
@media (max-width: 768px){
  #why.luxlp-section::before,
  #services.luxlp-section::before,
  #cases.luxlp-section::before{ opacity:.34; }

  #why.luxlp-section::after,
  #services.luxlp-section::after,
  #cases.luxlp-section::after{ opacity:.09; }
}

/* =========================================
   ONLY: .luxlp-cards3 background
   - 全体は暗くしない（光だけ）
========================================= */

.luxlp-cards3{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 24px;   /* 角丸（好みで） */
  padding: 28px;         /* 背景が見える余白 */
}

/* 光 */
.luxlp-cards3::before{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:-1;
  pointer-events:none;

  opacity:.40;               /* 濃さ 0.25〜0.55 */
  mix-blend-mode: screen;    /* 暗くせず光だけ */
  background:
  /*  radial-gradient(900px 420px at 18% 18%, rgba(3, 252, 77, 0.38), transparent 60%),
radial-gradient(760px 420px at 82% 22%, rgba(194, 252, 41, 0.35), transparent 58%),
radial-gradient(640px 360px at 52% 85%, rgba(255, 161, 34, 0.35), transparent 60%);*/
}

/* うっすらガラス感（任意） */
.luxlp-cards3::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;

  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-radius: 24px;
}

/* 中のカードが背景に埋もれる時の保険 */
.luxlp-cards3 > *{
  position: relative;
  z-index: 1;
}

/* スマホは少し薄く */
@media (max-width: 768px){
  .luxlp-cards3{ padding: 18px; border-radius: 18px; }
  .luxlp-cards3::before{ opacity:.32; }
  .luxlp-cards3::after{ border-radius: 18px; }
}


/* Services */
.luxlp-services{ display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:16px; }
@media (max-width:980px){ .luxlp-services{ grid-template-columns:1fr; } }
.luxlp-service{ padding:18px; border-radius:22px; }
.luxlp-service-badge{ color:#fff; display:inline-block; margin-bottom:10px; padding:.35em .7em; border-radius:999px; background:#e2730b; font-weight:800; letter-spacing:.1em; font-size:.82rem; }
.luxlp-service-badge2{ background:#e9075e; }
.luxlp-service h3{ margin:0 0 8px; letter-spacing:.06em; font-weight:600; }
.luxlp-service ul{ margin:0; padding-left:1.1em; color: rgba(11,15,24,.76); line-height:1.8; }
.luxlp-note{ margin:10px 0 0; color: rgba(11,15,24,.70); font-size:.92rem; }

/* PROJECTION */
.luxlp-service01{
 /* background:
 radial-gradient(800px 320px at 18% 18%, rgba(255,255,255,.55), transparent 60%),
radial-gradient(700px 320px at 85% 25%, rgba(255,140,0,.22), transparent 62%),
linear-gradient(to bottom right, rgba(255, 188, 124, 0.28), rgba(255, 143, 88, 0.34) 45%, #ffcfb1);*/
  border: 4px solid rgba(226, 115, 11, 0.5);
  box-shadow: 0 18px 45px rgba(255,143,87,.18);
}

/* LED */
.luxlp-service02{
/*   background:
   radial-gradient(800px 320px at 18% 18%, rgba(255,255,255,.55), transparent 60%),
radial-gradient(700px 320px at 85% 25%, rgba(255,0,128,.16), transparent 62%),
linear-gradient(to bottom right, #ffc3d7, rgba(255, 157, 201, 0.29) 48%, #ffe0ec);*/
  border: 4px solid rgba(233, 7, 94, 0.5);
  box-shadow: 0 18px 45px rgba(255,111,176,.18);
}

/* Flow（旧の丸アイコン版） */
.luxlp-flow{ list-style:none; padding:0; margin:0 auto; max-width:980px; display:grid; gap:10px; }
.luxlp-flow li{ display:flex; gap:12px; align-items:center; padding:14px 16px; border-radius:18px; color:#0b0f18; }
.luxlp-flow li span{
  width:44px; height:44px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  font-weight:900; letter-spacing:.08em;
  background: rgba(41,182,246,.18);
  border: 1px solid rgba(41,182,246,.35);
}

/* Apply */
.luxlp-apply-box{ display:grid; grid-template-columns: 1.05fr .95fr; gap:16px; padding:18px; border-radius:26px; }
@media (max-width:980px){ .luxlp-apply-box{ grid-template-columns:1fr; } }
.luxlp-apply-points{
  margin-top:14px; padding:12px 14px; border-radius:18px;
  background: rgba(0,0,0,.06);
  border: 1px solid rgba(15,23,42,.10);
  color: rgb(11 9 126);
  line-height:1.8;
}

/* Form base */
.luxlp-form{ border-radius:22px; background: rgba(255,255,255,.82); border: 1px solid rgba(15,23,42,.12); overflow:hidden; }
.luxlp-form-title{ margin:0; padding:14px; font-weight:600; letter-spacing:.08em; border-bottom: 1px solid rgba(15,23,42,.10); color:#0b0f18; }

/* Form colorful */
:root{ --luxlp-color-strength: .34; }
.luxlp-form-inner{
  position: relative;
  padding: 18px 18px 22px;
  border-radius: 18px;
  background:
    radial-gradient(900px 420px at 10% 6%, rgba(43,184,255, calc(var(--luxlp-color-strength) * .70)), transparent 60%),
    radial-gradient(800px 380px at 92% 18%, rgba(255,75,134, calc(var(--luxlp-color-strength) * .55)), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78));
  border: 1px solid rgba(11,18,32,.08);
  box-shadow: 0 18px 54px rgba(11,18,32,.10);
}
.luxlp-form-inner::before{
  content:"";
  position:absolute; inset:-10px;
  border-radius: 22px;
  pointer-events:none;
  background:
    conic-gradient(from 210deg at 18% 10%,
      rgba(43,184,255, calc(var(--luxlp-color-strength) * .85)),
      rgba(255,75,134, calc(var(--luxlp-color-strength) * .60)),
      rgba(122,123,255, calc(var(--luxlp-color-strength) * .70)),
      rgba(43,184,255, calc(var(--luxlp-color-strength) * .85)));
  filter: blur(18px);
  opacity: .55;
  z-index: 0;
}
.luxlp-form-inner > *{ position: relative; z-index: 1; }

.luxlp-form label{ display:grid; gap:6px; color: rgba(11,15,24,.85); font-weight:600; }
.luxlp-form-inner label{ padding-bottom:6px; border-bottom: 1px solid rgba(11,18,32,.08); }

.luxlp-form input, .luxlp-form textarea, .luxlp-form select{
  width:100%;
  border-radius:14px;
  padding:12px;
  border: 1px solid rgba(15,23,42,.14);
  background: rgba(255,255,255,.92);
  color:#0b0f18;
  outline:none;
}
.luxlp-form-inner input[type="text"],
.luxlp-form-inner input[type="email"],
.luxlp-form-inner input[type="tel"],
.luxlp-form-inner textarea,
.luxlp-form-inner select{
  background:
    radial-gradient(520px 220px at 12% 0%, rgba(43,184,255,.10), transparent 55%),
    radial-gradient(520px 220px at 88% 0%, rgba(255,75,134,.07), transparent 60%),
    rgba(255,255,255,.96) !important;
  border-color: rgba(43,184,255,.34) !important;
}
.luxlp-form input:focus, .luxlp-form textarea:focus, .luxlp-form select:focus{
  border-color: rgba(41,182,246,.6);
  box-shadow: 0 0 0 4px rgba(41,182,246,.12), 0 0 0 7px rgba(255,75,134,.06), 0 16px 40px rgba(11,18,32,.08) !important;
}
.luxlp-form-inner .req{
  background: rgba(255,63,122,.10) !important;
  border-color: rgba(255,63,122,.95) !important;
  color: #ff2f73 !important;
}
.luxlp-form-inner .wpcf7-form-control-wrap{ margin-top:10px; }

/* Submit big + colorful */
.luxlp-form-inner input.wpcf7-submit,
.luxlp-form-inner input[type="submit"].luxlp-btn,
.luxlp-form-inner .luxlp-btn{
  width: min(640px, 100%) !important;
  min-height: 74px !important;
  padding: 20px 34px !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.55) !important;
  background-image: linear-gradient(135deg, #2bb8ff6b 0%, #6c7bffb0 36%, #ff4b8691 72%, #ffb84b 100%) !important;
  color: #fff !important;
  box-shadow:
    0 24px 70px rgba(43,184,255,.22),
    0 18px 54px rgba(108,123,255,.18),
    0 14px 46px rgba(255,75,134,.14);
  position: relative;
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}
.luxlp-form-inner input.wpcf7-submit::before,
.luxlp-form-inner input[type="submit"].luxlp-btn::before,
.luxlp-form-inner .luxlp-btn::before{
  content:"";
  position:absolute;
  inset:-40%;
  background: conic-gradient(from 180deg,
    rgba(255,255,255,.50),
    rgba(43,184,255,.45),
    rgba(255,75,134,.35),
    rgba(255,184,75,.35),
    rgba(255,255,255,.50));
  filter: blur(14px);
  opacity: .55;
  animation: luxlpGlowSpin 5.8s linear infinite;
  z-index:-1;
}
.luxlp-form-inner input.wpcf7-submit:hover,
.luxlp-form-inner input[type="submit"].luxlp-btn:hover,
.luxlp-form-inner .luxlp-btn:hover{
  transform: translateY(-3px) scale(1.01) !important;
  filter: brightness(1.06) saturate(1.15) !important;
  box-shadow:
    0 30px 86px rgba(43,184,255,.28),
    0 22px 68px rgba(108,123,255,.22),
    0 18px 58px rgba(255,75,134,.18);
}
.luxlp-form-inner input.wpcf7-submit:active,
.luxlp-form-inner input[type="submit"].luxlp-btn:active,
.luxlp-form-inner .luxlp-btn:active{
  transform: translateY(-1px) scale(.995) !important;
}
@media (max-width:520px){
  .luxlp-form-inner input.wpcf7-submit,
  .luxlp-form-inner input[type="submit"].luxlp-btn,
  .luxlp-form-inner .luxlp-btn{
    min-height: 68px !important;
    font-size: 20px !important;
    padding: 18px 26px !important;
  }
}

/* Honeypot hide */
.luxlp-form-inner .hp-wrap,
.luxlp-form-inner input[name="hp_field"],
.luxlp-form-inner textarea[name="hp_field"],
.luxlp-form-inner .wpcf7-form-control-wrap.hp_field{
  display:none !important;
}

/* FAQ */
.luxlp-faq{ max-width:980px; margin:0 auto; display:grid; gap:10px; }
.luxlp-faq-item{ border-radius:18px; overflow:hidden; }
.luxlp-faq-item summary{ cursor:pointer; padding:14px 16px; font-weight:600; letter-spacing:.06em; color:#0b0f18; }
.luxlp-faq-item p{ margin:0; padding:0 16px 14px; color: rgba(11,15,24,.78); line-height:1.75; }
.luxlp-footer-cta{ text-align:center; margin-top:16px; }

/* FAQ 見た目の指定（あなたの指定そのまま） */
.luxlp-faq-item p{
  color:#00448f;
  font-family:"Meiryo","Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;
  padding-left:5%!important;
}

/* Spots */
.luxlp-dl{ display:grid; gap:12px; max-width:620px; margin:0 auto; }
.luxlp-spots{ display:grid; gap:16px; margin-top:18px; }
.luxlp-spot{
  display:grid;
  grid-template-columns: minmax(320px, 560px) 1fr;
  gap:24px;
  align-items:start;
  padding:16px;
  border-radius:18px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(11,18,32,.08);
  box-shadow: 0 10px 26px rgba(11,18,32,.06);
}
.luxlp-spot-body{ min-width:0; }
@media (max-width:900px){ .luxlp-spot{ grid-template-columns:1fr; } }

.luxlp-spot .luxlp-spot-media{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
  align-items:stretch;
}
.luxlp-spot .luxlp-spot-media > img{
  width:100%;
  height:100%;
  aspect-ratio: 16 / 9;
  object-fit:cover;
  border-radius:18px;
  display:block;
}
@media (max-width:640px){
  .luxlp-spot .luxlp-spot-media{ grid-template-columns: 1fr; }
}
.luxlp-spot-title{ margin:4px 0 10px; font-size:1.05rem; }
.luxlp-spot-list{ margin:0; padding-left:1.1em; color: rgba(11,18,32,.78); }
.luxlp-map{ margin-top:14px; }
.luxlp-map-cta{ margin-top:14px; text-align:center; }

/* LP width（recruit-lp の中だけ） */
#recruit-lp .luxlp-wrap{
  width:90%;
  max-width:none;
  margin:0 auto;
  padding:10px 10px;
}
@media (max-width: 767px) {
  #recruit-lp .luxlp-wrap{ width:100%; max-width:none; }
  body { font-size: 16px; }
}

/* recruit spots override */
#recruit-lp .luxlp-spots{ display:grid; gap:16px; }
#recruit-lp .luxlp-spot{
  display:grid !important;
  grid-template-columns: 520px 1fr;
  gap:24px;
  align-items:start;
  padding:16px;
  border-radius:18px;
  background: rgba(255,255,255,.72);
  border:1px solid rgba(11,18,32,.08);
  box-shadow:0 10px 26px rgba(11,18,32,.06);
}
#recruit-lp .luxlp-spot-media{
  display:grid !important;
  grid-template-columns: 1fr 1fr;
  gap:12px;
  align-items:stretch;
}
#recruit-lp .luxlp-spot-media > img{
  width:100% !important;
  height:160px !important;
  object-fit:cover;
  border-radius:14px;
  display:block;
}
#recruit-lp .luxlp-spot-body{ min-width:0; }
@media (max-width: 900px){
  #recruit-lp .luxlp-spot{ grid-template-columns: 1fr; }
  #recruit-lp .luxlp-spot-media > img{ height:200px !important; }
}
@media (max-width: 640px){
  #recruit-lp .luxlp-spot-media{ grid-template-columns: 1fr; }
}

/* Spots color */
#recruit-lp #spots .luxlp-spot{ border-color: rgba(11,18,32,.10) !important; }
#recruit-lp #spots .luxlp-spot:nth-child(-n+2){
  background: linear-gradient(to bottom right, rgba(255, 157, 54, 0.39), rgba(255, 255, 255, 0.86)) !important;
}
#recruit-lp #spots .luxlp-spot:nth-child(n+3){
  background: linear-gradient(to bottom right, rgba(86, 255, 48, 0.18), rgba(255, 255, 255, 0.86)) !important;
}

/* FLOW（縦・STEP01-04） */
#flow .flow-steps{ list-style:none; padding:0; display:grid; gap:18px; }
#flow .flow-item{
  display:grid;
  grid-template-columns: 150px 1fr;
  gap: 18px;
  align-items:start;
  padding: 22px 22px;
  border-radius: 18px;
  background: rgba(224, 245, 255, 1);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: var(--shadow);
  position:relative;
  overflow:hidden;
}
#flow .flow-item::after{
  content:"";
  position:absolute;
  inset: 12px 14px 12px 42%;
  border-radius: 16px;
  clip-path: polygon(10% 0, 100% 0, 92% 100%, 0 100%);
  pointer-events:none;
  opacity: .95;
}
#flow .flow-item.is-1::after{ background: rgba(11,45,107,.06); }
#flow .flow-item.is-2::after{ background: rgba(11,45,107,.14); }
#flow .flow-item.is-3::after{ background: rgba(11,45,107,.24); }
#flow .flow-item.is-4::after{ background: rgba(11,45,107,.34); }

#flow .flow-step{
  z-index:1;
  display:grid;
  align-content:start;
  justify-items:start;
  gap:6px;
  padding-left: 6px;
}
#flow .flow-step__label{ font-weight:900; letter-spacing:.14em; color:#0b2d6b; font-size:22px; line-height:1; }
#flow .flow-step__num{ font-weight:950; letter-spacing:.04em; color:#0b2d6b; font-size:60px; line-height:.9; }
#flow .flow-body{ z-index:1; }
#flow .flow-ttl{
  margin:0 0 10px;
  font-weight:950;
  letter-spacing:.06em;
  color:#0b2d6b;
  font-size: clamp(24px, 2.2vw, 34px);
  position:relative;
  padding-left:14px;
}
#flow .flow-ttl::before{
  content:"";
  position:absolute;
  left:0;
  top:.22em;
  width:6px;
  height:1.25em;
  border-radius:999px;
  background: linear-gradient(180deg, #2256ff, #02c6fd, #25c9a7);
  box-shadow: 0 10px 22px rgba(34,86,255,.20);
}
#flow .flow-desc{
  margin:0;
  color: rgba(11,15,24,.78);
  line-height: 2;
  font-weight: 700;
  font-size: 15px;
}
@media (max-width:820px){
  #flow .flow-item{ grid-template-columns:1fr; gap:10px; }
  #flow .flow-item::after{
    inset: 78px 14px 12px 14px;
    clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%);
  }
  #flow .flow-step__label{ font-size:18px; }
  #flow .flow-step__num{ font-size:72px; }
}

/* ===== 申し込みへリンク　四角め大ボタン ===== */
.mousikomihe {padding-top:30px;width:80%;margin:0 auto; text-align:center;}
.luxlp-applyBtn{
  display:block;
  width:100%;
  max-width: 520px;
  padding: 22px 22px;
  border-radius: 14px;
  text-decoration:none;
  color:#0b0f18;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(148,163,184,.45);
  box-shadow: 0 18px 48px rgba(2,6,23,.12);
  backdrop-filter: blur(10px);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  position: relative;
  overflow:hidden;
}
.luxlp-applyBtn:hover{
  transform: translateY(-2px);
  border-color: rgba(99,102,241,1);
  box-shadow: 0 22px 60px rgba(2,6,23,.5);
}
.luxlp-applyBtn:active{ transform: translateY(0); }
.luxlp-applyBtn::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(900px 260px at 20% 0%,
    rgba(99,102,241,.18),
    rgba(236,72,153,.10),
    transparent 60%);
  pointer-events:none;
}
.luxlp-applyBtn__line{
  display:block;
  font-weight: 800;
  font-size: 18px;
  line-height: 1.35;
  letter-spacing: .02em;
}
.luxlp-applyBtn__line + .luxlp-applyBtn__line{ margin-top: 6px; }
.luxlp-applyBtn__line:last-child{
  margin-top: 12px;
  font-size: 16px;
  font-weight: 900;
  color:#1d4ed8;
}
@media (max-width: 980px){
  .luxlp-applyBtn{ max-width: 100%; padding: 20px 18px; }
  .luxlp-applyBtn__line{ font-size: 16px; }
  .luxlp-applyBtn__line:last-child{ font-size: 14px; }
}

/* =========================================================
  2) TERMS（規約セクション）
========================================================= */
#terms{
  background: linear-gradient(180deg, #f8fafc 0%, #eef5ff 100%);
  border-radius: 20px;
  box-shadow: 0 6px 24px rgba(0,0,0,0.05);
  font-family: "Noto Sans JP", sans-serif;
  max-width:100%;
  margin:0 auto;
  padding: 20px 24px;
}
#terms h2{
  font-size: 1.8rem;
  margin-bottom: 0.5em;
  text-align: center;
  color: #0f172a;
}
#terms > p{
  text-align: center;
  color: #475569;
}
#terms details{
  border: 1px solid #dbeafe;
  background: #fff;
  border-radius: 10px;
  margin: 10px 0;
  box-shadow: 0 4px 12px rgba(14,165,233,0.08);
  transition: all 0.3s ease;
}
#terms summary{
  cursor: pointer;
  font-weight: 700;
  font-size: 1rem;
  padding: 14px 16px;
  color: #0f172a;
  position: relative;
  list-style: none;
}
#terms summary::marker{ content:""; }
#terms summary::after{
  content: "＋";
  position: absolute;
  right: 16px;
  top: 12px;
  font-weight: bold;
  color: #0ea5e9;
}
#terms details[open] summary::after{
  content: "－";
  color: #0ea5e9;
}
#terms details[open]{
  background: #f0f9ff;
  border-color: #0ea5e9;
}
#terms details p,
#terms details ul{
  margin: 0;
  padding: 10px 20px 16px 20px;
  color: #1e293b;
  line-height: 1.8;
  font-size: 0.95rem;
}

/* 利用規約：サブリストを（1）（2）…にする */
.luxlp-terms-sublist{
  list-style: none;
  counter-reset: luxTerm;
  margin: 0.6em 0 0.6em 1.6em;  /* ←ここで1段下げ */
  margin-left: 0;
}

.luxlp-terms-sublist > li{
  counter-increment: luxTerm;
  position: relative;
  padding-left: 3.2em; /* （1）ぶんの余白 */
  margin: 0.4em 0;
}

.luxlp-terms-sublist > li::before{
  content: "（" counter(luxTerm) "）";
  position: absolute;
  left: 0;
  top: 0;
  white-space: nowrap;
}

/* =========================================================
  3) HMZ AD SPEC（料金表など）- hmz-ad-spec の中だけ
========================================================= */
.hmz-ad-spec{
  background:
    radial-gradient(900px 600px at 10% 0%, rgba(43,184,255,.12), transparent 60%),
    radial-gradient(800px 520px at 92% 18%, rgba(255,47,115,.10), transparent 62%),
    radial-gradient(900px 700px at 60% 95%, rgba(52,211,153,.10), transparent 60%),
    linear-gradient(180deg, #fbfdff 0%, var(--bg) 45%, #fbfdff 100%);
  padding:18px 0;
}
.hmz-ad-spec .wrap{ width:88%; margin:0 auto; padding:0 16px; }

.hmz-ad-spec h2{
  margin:18px 0 10px;
  font-size:1.2rem;
  letter-spacing:.04em;
  display:flex;
  align-items:center;
  gap:.55em;
}
.hmz-ad-spec h2::before{
  content:"";
  width:10px;height:10px;border-radius:999px;
  background:linear-gradient(135deg,var(--c1),var(--c2));
  box-shadow:0 10px 26px rgba(43,184,255,.18);
}
.hmz-ad-spec .note{
  margin:0 0 12px;
  color:var(--muted);
  line-height:1.7;
  font-size:.95rem;
}

/* table card */
.hmz-ad-spec .table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.hmz-ad-spec .table th,
.hmz-ad-spec .table td{
  padding:12px 12px;
  border-bottom:1px solid rgba(15,23,42,.08);
  vertical-align:top;
}
.hmz-ad-spec .table thead th{
  background:rgba(15,23,42,.04);
  font-weight:800;
  text-align:left;
  position:sticky; top:0;
}
.hmz-ad-spec .table tbody tr:nth-child(even) td{ background:rgba(15,23,42,.02); }
.hmz-ad-spec .table tbody tr:last-child td{ border-bottom:none; }

/* chips */
.hmz-ad-spec .chip{
  display:inline-flex;
  align-items:center;
  gap:.45em;
  padding:.28em .7em;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.12);
  background:rgba(15,23,42,.04);
  font-weight:800;
  font-size:.86rem;
  white-space:nowrap;
}
.hmz-ad-spec .chip.blue{ background:rgba(43,184,255,.12); border-color:rgba(43,184,255,.25); }
.hmz-ad-spec .chip.pink{ background:rgba(255,47,115,.10); border-color:rgba(255,47,115,.25); }
.hmz-ad-spec .chip.green{ background:rgba(52,211,153,.12); border-color:rgba(52,211,153,.25); }
.hmz-ad-spec .chip.amber{ background:rgba(255,184,75,.14); border-color:rgba(255,184,75,.28); }

.hmz-ad-spec .price{
  display:inline-block;
  padding:.35em .75em;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(43,184,255,.22), rgba(255,47,115,.14));
  border:1px solid rgba(43,184,255,.24);
  font-weight:900;
  letter-spacing:.02em;
  white-space:nowrap;
}

/* 2-column blocks */
.hmz-ad-spec .grid2{ display:grid; gap:14px; margin-top:14px; }
@media (min-width:900px){ .hmz-ad-spec .grid2{ grid-template-columns:1fr 1fr; } }

.hmz-ad-spec .miniCard{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.hmz-ad-spec .miniCard .hd{
  display:flex; align-items:center; gap:.6em;
  padding:12px 12px;
  font-weight:900;
  background:linear-gradient(135deg, rgba(43,184,255,.12), rgba(255,47,115,.08));
  border-bottom:1px solid rgba(15,23,42,.08);
}
.hmz-ad-spec .miniCard .hd .dot{
  width:10px; height:10px; border-radius:999px;
  background:linear-gradient(135deg,var(--c1),var(--c2));
}
.hmz-ad-spec .miniCard ul{
  margin:0;
  padding:10px 30px 14px;
  line-height:1.75;
  color:rgba(11,15,24,.86);
}
.hmz-ad-spec .miniCard li{ margin:6px 0; }

/* mobile: table -> card list */
.hmz-ad-spec .mobileCards{ display:none; }
@media (max-width:820px){
  .hmz-ad-spec .tableWrap{ display:none; }
  .hmz-ad-spec .mobileCards{ display:grid; gap:12px; }
  .hmz-ad-spec .rowCard{
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:16px;
    box-shadow:var(--shadow);
    padding:12px;
  }
  .hmz-ad-spec .rowTitle{
    display:flex; align-items:flex-start; justify-content:space-between;
    gap:10px;
    font-weight:900;
    margin-bottom:8px;
  }
  .hmz-ad-spec .kv{
    display:grid;
    grid-template-columns: 110px 1fr;
    gap:8px 10px;
    font-size:.95rem;
    line-height:1.6;
  }
  .hmz-ad-spec .k{ color:var(--muted); font-weight:800; }
  .hmz-ad-spec .v{ color:rgba(11,15,24,.92); font-weight:600; }
}

/* =========================================================
  4) Keyframes（重複はここだけ）
========================================================= */
@keyframes luxlpGlowSpin{ to{ transform: rotate(360deg); } }
@keyframes luxlpPinDrop{
  0%   { opacity:0; transform: translate(-50%,-160px) scale(.6); }
  70%  { opacity:1; transform: translate(-50%,  6px) scale(1.05); }
  100% { opacity:1; transform: translate(-50%,  0px) scale(1); }
}
@keyframes drop{
  0%   { transform: translate(-50%, -300%); opacity: 0; }
  70%  { transform: translate(-50%, -90%);  opacity: 1; }
  100% { transform: translate(-50%, -100%); opacity: 1; }
}

/* =========================================================
  &#x2705; MODAL 下切れ対策（panel max-height + body scroll）
========================================================= */

/* 背景（暗くする） */
.lalux-modal-backdrop,
.modal-overlay,
.modal__backdrop,
.modal-bg{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 9998;
}

/* 画面中央に配置する外枠 */
.lalux-modal,
.modal,
.modal-wrap,
.modal__wrap{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 16px;
}

/* モーダル本体（最大高さ） */
.lalux-modal__panel,
.modal-content,
.modal__content,
.modal-inner{
  width: min(92vw, 720px);
  max-height: min(88vh, 820px);
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(0,0,0,.25);
  display: flex;
  flex-direction: column;
}

/* ヘッダー */
.lalux-modal__head,
.modal-header,
.modal__head{
  padding: 12px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex: 0 0 auto;
}

/* 中身だけスクロール（最重要） */
.lalux-modal__body,
.modal-body,
.modal__body,
.modal-content .inner{
  padding: 14px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  flex: 1 1 auto;
}

.lalux-modal__body img,
.modal-body img,
.modal__body img{
  max-width: 100%;
  height: auto;
  display:block;
}

/* スマホ：svh優先（iPhone下切れ対策） */
@media (max-width: 768px){
  .lalux-modal__panel,
  .modal-content,
  .modal__content,
  .modal-inner{
    width: 94vw;
    max-height: 86svh;
  }
  .lalux-modal__body,
  .modal-body,
  .modal__body,
  .modal-content .inner{
    padding: 12px;
  }
}


/* DLエリア */
.luxlp-dl-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin-top: 18px;
}

.luxlp-dl-card{
  display: block;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
  transform: translateZ(0);
  transition: transform .18s ease, box-shadow .18s ease;
}

.luxlp-dl-card img{
  display: block;
  width: 100%;
  height: auto;
}

.luxlp-dl-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 40px rgba(0,0,0,.16);
}

.luxlp-dl-note{
  text-align: center;
  margin-top: 18px;
  color: rgba(0,0,0,.65);
  font-size: 16px;
}

/* スマホは縦並び */
@media (max-width: 768px){
  .luxlp-dl-grid{
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* 西条だけ：右が短い形に切り抜く */
.luxlp-video.is-saijo-mask{
  /* 右が短い台形（大体） */
  -webkit-clip-path: polygon(0% 6%, 100% 18%, 100% 88%, 0% 98%);
          clip-path: polygon(0% 6%, 100% 18%, 100% 88%, 0% 98%);
}

/* ★追加：安定化（3Dのはみ出し対策） */
.luxlp-video.is-tilt{
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
}


/* ===== toggle badge (IMAGE / VIDEO) ===== */
.luxlp-tag{
  display: inline-flex;
  align-items: center;
  gap: .5em;
}

.luxlp-tag__txt{ white-space: nowrap; }

.luxlp-tag__badge{
  margin-left: .35em;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  padding: .24em .55em;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.16);
  background: rgba(15,23,42,.06);
}

.luxlp-tag.is-active .luxlp-tag__badge{
  border-color: rgba(255,255,255,.35);
  background: rgba(255,255,255,.18);
  color: #fff;
}

/* ボタン内テキスト＋バッジ */
.luxlp-tag{
  display: inline-flex;
  align-items: center;
  gap: .55em;
}

.luxlp-tag__txt{
  display:inline-block;
}

.luxlp-tag__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  padding: .28em .6em;
  border-radius: 999px;
  background: rgba(0,0,0,.12);
  border: 1px solid rgba(0,0,0,.12);
  color: rgba(0,0,0,.72);
}

/* active時はバッジも見やすく */
.luxlp-tag.is-active .luxlp-tag__badge{
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.25);
  color: #fff;
}

/* ===== badge: IMAGE ⇄ VIDEO（切替できる表示） ===== */
.luxlp-tag__badge{
  display:inline-flex;
  align-items:center;
  gap:.35em;
}

.luxlp-tag__badge .b-im,
.luxlp-tag__badge .b-vi{
  font-weight: 950;
  letter-spacing: .06em;
}

.luxlp-tag__badge .b-sep{
  opacity:.65;
  font-weight: 900;
}

/* 初期：両方見える（非アクティブ側を薄く） */
.luxlp-tag[data-cur="image"]  .luxlp-tag__badge .b-vi{ opacity:.30; }
.luxlp-tag[data-cur="video"]  .luxlp-tag__badge .b-im{ opacity:.30; }
.luxlp-tag[data-state="image"] .luxlp-tag__badge .b-vi{ opacity:.30; }
.luxlp-tag[data-state="video"] .luxlp-tag__badge .b-im{ opacity:.30; }