@charset "utf-8";
/* ============================================================
   トップ（/）
   本番テーマ lastcompass220713 のCSSより後に読み込むこと。
   画像は ../../images/restyle/ に配置。
   自動生成: build_dist.py — プレビューの適用順をそのまま保持。
   ============================================================ */

/* ---------- lcRestyle ---------- */
/* ============================================================
   SKIN A — ネイビー×ゴールド（リデザイン確定テーマ準拠）
   構成・HTMLは一切変更せず、CSS上書きのみで実現
   ============================================================ */

/* ---- ベース ---- */
body:not(:has(.box-header-02.recruit)){
  font-family:"Noto Sans JP","Inter",-apple-system,sans-serif !important;
  color:#a9b8d0 !important;
  background:
    radial-gradient(1300px 640px at 50% -8%, rgba(96,158,196,.28), transparent 60%),
    radial-gradient(1000px 560px at 90% 30%, rgba(38,96,128,.22), transparent 55%),
    linear-gradient(180deg,#12283f 0%,#0d1e33 40%,#0a1526 100%) !important;
  background-attachment:fixed !important;
}
body:not(:has(.box-header-02.recruit)) main, body:not(:has(.box-header-02.recruit)) main section, .section-home, .articleSlide,
.box-slide-09, .top_seminarList, .top_trainingList{ background:transparent !important; }
html:not(:has(.box-header-02.recruit)){ background:#0a1526 !important; }
body:not(:has(.box-header-02.recruit)) main p, body:not(:has(.box-header-02.recruit)) main li{ color:#a9b8d0; }

/* ---- ヘッダー ---- */
.header-wrap{
  background:rgba(10,21,38,.72) !important;
  backdrop-filter:blur(14px) saturate(150%);
  border-bottom:1px solid rgba(255,255,255,.1);
  box-shadow:none !important;
}
.box-header-02:not(.recruit) .header-nav a{ color:#cfd8e4 !important; font-family:"Open Sans","Noto Sans JP",sans-serif !important; transition:color .2s, box-shadow .2s; }
.box-header-02:not(.recruit) .header-nav a span{ color:#8a97ab !important; transition:color .2s; }

/* ナビホバー：テーマの「白背景＋紺文字」を廃止し、ゴールド文字＋金の下線に */
.box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li > a:hover{
  background:transparent !important;
  color:#d8b877 !important;
  box-shadow:inset 0 -2px 0 #d8b877;
}
/* 日本語サブラベルは::after(content:attr)で描画されている */
.box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li > a::after{ transition:color .2s; }
.box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li > a:hover::after{
  color:rgba(216,184,119,.65) !important;
}

/* ドロップダウン：白パネルをやめてダークガラス＋金の天板ラインに */
.box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li .nav-child{
  border-top:2px solid #d8b877;
  box-shadow:0 18px 40px rgba(5,12,25,.5);
}
.box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li .nav-child > li{
  background:rgba(8,16,30,.96) !important;
}
.box-header-02 .header-nav ul.nav-inner .nav-child a{
  color:#cfd8e4 !important;
  padding:11px 18px !important;
  line-height:1.5 !important;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.box-header-02 .header-nav ul.nav-inner .nav-child a:hover{
  color:#d8b877 !important;
  background:rgba(216,184,119,.08) !important;
  box-shadow:none;
}
/* ドロップダウン項目の横に付く商品名（data-sub由来の::after）：
   テーマが濃紺文字にするためダークパネルで消える → シャンパンで表示 */
.box-header-02 .header-nav .nav-child a::after,
.box-header-02 .header-nav .lc_spNav_inner a::after{
  color:rgba(216,184,119,.68) !important;
}
.box-header-02 .header-nav .nav-child a:hover::after{
  color:#d8b877 !important;
}

/* 集客改善（ProMo）のメニュー項目を非表示（ヘッダーDD・フッター・SPナビ）
   ※本番ではWPメニュー管理から削除するのが正道。それまでのCSS対応 */
.header-nav li:has(> a[href*="/promo"]),
footer li:has(> a[href*="/promo"]),
.footer-wrap li:has(> a[href*="/promo"]),
.lc_spNav_inner li:has(> a[href*="/promo"]){
  display:none !important;
}
.header-logo, .header-logo a{ color:#fff !important; }
/* COMPASS PORT：丸型をやめ、金縁のシャープな矩形に */
.header-btn .btn-inner{
  background:transparent !important;
  border:1px solid rgba(216,184,119,.65) !important;
  border-radius:0 !important;
  color:#d8b877 !important;
  font-family:"Cinzel",serif !important;
  font-weight:700 !important;
  letter-spacing:.14em !important;
  transition:background .2s, border-color .2s;
}
.header-btn .btn-inner span{ color:#d8b877 !important; transition:color .2s, text-shadow .2s; }
/* ホバー挙動は restyle-hbtn-*.css 側で定義する（金ワッシュ背景は金文字と同化するため廃止） */

/* ---- セクション見出し（EN大＋JP小） ---- */
h2.unit-title-08{
  font-family:"Cinzel",serif !important;
  color:#d8b877 !important;
  letter-spacing:.24em !important;
  font-weight:600 !important;
}
h2.unit-title-08 span{
  font-family:"Noto Serif JP",serif !important;
  color:#fff !important;
  letter-spacing:.18em !important;
}
/* このテーマはJPサブタイトルを ::after(content) で描画している */
h2.unit-title-08::after, p.unit-title-08::after{
  background:transparent !important;
  color:#a9b8d0 !important;
  font-family:"Noto Serif JP",serif !important;
  letter-spacing:.22em !important;
  font-weight:500 !important;
}
.unit-title-08 span::after{ background:#C8A668 !important; }
p.unit-title-08{
  font-family:"Cinzel",serif !important;
  color:#d8b877 !important;
  letter-spacing:.24em !important;
}
p.unit-title-08 span{ font-family:"Noto Serif JP",serif !important; color:#fff !important; }

/* ---- ヒーロー ---- */
.slide-txt .txt-main, .slide-txt h2{
  font-family:"Noto Serif JP",serif !important;
  letter-spacing:.06em !important;
  text-shadow:0 2px 24px rgba(5,12,25,.6);
}
.slide-txt .txt-sub{ letter-spacing:.14em !important; }

/* MISSIONスライドにも経営改善資料スライドと同じコンパス透かし（白の極薄） */
.slide-txt:not(.contactSlide)::before{
  content:"";
  position:absolute;
  left:50%; top:46%;
  transform:translate(-50%,-50%);
  width:560px; height:560px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23ffffff' stroke-width='0.5'%3E%3Ccircle cx='24' cy='24' r='21'/%3E%3Ccircle cx='24' cy='24' r='14'/%3E%3Cpath d='M24 1v8M24 39v8M1 24h8M39 24h8'/%3E%3Cpolygon points='24,7 26.6,24 24,41 21.4,24' fill='%23ffffff' stroke='none'/%3E%3Cpolygon points='7,24 24,21.4 41,24 24,26.6' fill='%23ffffff' stroke='none'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity:.08;
  pointer-events:none;
  z-index:-1;
}
@media screen and (max-width:768px){
  .slide-txt:not(.contactSlide)::before{ width:340px; height:340px; }
}

/* MISSIONラベル：大きな見出しをやめ、反対スライドのキッカー
   (LIMITED TIME DOCUMENTS)と同格の小さな金の英字ラベルに */
.slide-txt:not(.contactSlide) .txt-sub{
  font-family:"Cinzel",serif !important;
  font-size:13px !important;
  font-weight:600 !important;
  letter-spacing:.46em !important;
  text-indent:.46em;
  color:rgba(216,184,119,.9) !important;
  margin-bottom:18px !important;
}
@media screen and (max-width:768px){
  .slide-txt:not(.contactSlide) .txt-sub{
    font-size:10px !important;
    letter-spacing:.24em !important;
    text-indent:.24em;
    margin-bottom:12px !important;
  }
}

/* MISSIONスライドのキャッチ
   PC：テーマ標準サイズ(35px)の1行のまま。
   モバイルのみ「成果に直結する／コンサルティングの提供」の2行に分割
   （テーマHTMLが1行のためCSSで置換。スローガン文言変更時はここも更新） */
@media screen and (max-width:768px){
  .slide-list .slide-txt:not(.contactSlide) .txt-main{
    font-size:0 !important;
    line-height:0 !important;
  }
  .slide-list .slide-txt:not(.contactSlide) .txt-main::before{
    content:"成果に直結する\Aコンサルティングの提供";
    white-space:pre;
    display:block;
    font-family:"Noto Serif JP",serif;
    font-size:2.1rem;
    font-weight:600;
    line-height:1.55;
    letter-spacing:.06em;
    color:#fff;
    text-shadow:0 2px 24px rgba(5,12,25,.6);
  }
}

/* ---- 海背景の連続アニメーション ----
   テーマは各スライドの .slide-bg に scaleZoom(4s,1回) を掛け直すため
   切替のたびにリセットされる。両スライドとも同じ画像(slide_bg_09.jpg)なので、
   背景を切り替わらない親(.box-mainvisual-02)の::beforeに1枚だけ敷き、
   無限ループ(往復)でゆっくり漂わせる。テキストのみがクロスフェードする。 */
.box-mainvisual-02{ position:relative; overflow:hidden; }
.box-mainvisual-02::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:url(https://lastcompass.co.jp/wp-content/themes/lastcompass220713/images/top/slide_bg_09.jpg) center/cover no-repeat;
  animation:lcOceanDrift 14s ease-in-out infinite alternate;
  will-change:transform;
}
.box-mainvisual-02::after{
  content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(180deg, rgba(10,21,38,.25), rgba(10,21,38,.55));
  pointer-events:none;
}
.box-mainvisual-02 .mainvisual-slide{ position:relative; z-index:1; }
.box-mainvisual-02 .mainvisual-slide .slide-list .slide-bg{
  opacity:0 !important;
  animation:none !important;
}
@keyframes lcOceanDrift{
  0%{ transform:scale(1.03) translate(0,0); }
  100%{ transform:scale(1.22) translate(-2.6%,1.8%); }
}
@media (prefers-reduced-motion:reduce){
  .box-mainvisual-02::before{ animation:none; }
}
/* 「経営改善資料」の色はヒーロー案(restyle-hero-*.css)側で定義する */

/* ヒーローCTA「期間限定資料を受け取る」：1行のシャープなゴールドボタンに */
.slide-list .contactSlide .txt-sub{ max-width:none !important; }
.slide-list .contactSlide .txt-sub a{
  display:inline-flex !important;
  align-items:center; justify-content:center;
  white-space:nowrap !important;
  width:auto !important;
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
  font-family:"Noto Sans JP",sans-serif !important;
  font-size:1.7rem !important;
  font-weight:700 !important;
  letter-spacing:.14em !important;
  padding:19px 54px 19px 58px !important;
  border-radius:2px !important;
  outline:1px solid rgba(255,255,255,.45);
  outline-offset:-5px;
  box-shadow:0 0 0 1px rgba(216,184,119,.5), 0 14px 36px rgba(200,166,104,.35);
  transition:transform .2s, box-shadow .2s;
}
.slide-list .contactSlide .txt-sub a::before{ display:none !important; } /* 旧グラフアイコンを撤去 */
.slide-list .contactSlide .txt-sub a::after{
  content:"→"; margin-left:16px; font-weight:700; transition:transform .2s;
}
.slide-list .contactSlide .txt-sub a:hover{
  transform:translateY(-2px);
  box-shadow:0 0 0 1px rgba(216,184,119,.7), 0 18px 44px rgba(200,166,104,.45);
}
.slide-list .contactSlide .txt-sub a:hover::after{ transform:translateX(4px); }

/* SPメニュー（ヒーロー境界）とSEMINAR見出しの間隔：モバイルで詰める */
@media screen and (max-width:768px){
  .top_seminarList, .top_trainingList{ padding-top:26px !important; }
  /* モバイルはSEMINAR/TRAINING帯の透過をやめ、下の紺色で塗りつぶす */
  .articleSlide, .top_seminarList, .top_trainingList{
    background:#0c1a2e !important;
  }
}

/* ---- スライダーの上下ぐらつき解消：slickのadaptiveHeightが
   スライドごとに高さをアニメーションさせるため、高さを最大スライドに固定 ---- */
.article_sliderList .slick-list{ height:auto !important; }

/* ---- セミナー・研修カード：サムネを一回り小さく、余白で整える ---- */
.article_sliderList .slick-slide{ padding:0 18px !important; box-sizing:border-box; }
.article-figure img, .linkImg img{
  border-radius:0 !important;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 12px 30px rgba(5,12,25,.45);
  transition:transform .25s, box-shadow .25s;
}
.linkImg:hover img{ transform:translateY(-4px); box-shadow:0 0 0 2px rgba(216,184,119,.4), 0 16px 38px rgba(5,12,25,.55); }
.seminarDate{
  color:#C8A668 !important; font-weight:700 !important;
  font-family:"Inter","Noto Sans JP",sans-serif !important;
  font-size:13px !important; letter-spacing:.08em !important;
  margin-top:14px !important;
}
.seminarTtl{
  color:#eaf1fb !important;
  font-size:14px !important;
  line-height:1.75 !important;
  font-weight:500 !important;
}

/* ---- READ MORE ボタン ---- */
.unit-readmore-01 a{
  font-family:"Cinzel",serif !important;
  color:#d8b877 !important;
  border:1px solid rgba(216,184,119,.5) !important;
  border-radius:0 !important;
  background:transparent !important;
  letter-spacing:.24em !important;
  display:block !important;
  max-width:280px !important;
  margin:0 auto !important;
  text-align:center !important;
  padding:13px 0 !important;
  transition:background .2s, border-color .2s;
}
.unit-readmore-01 a:hover{ background:rgba(216,184,119,.12) !important; border-color:#d8b877 !important; }

/* ---- サービスロゴ帯（SERVICEバンド） ---- */
.pc_subMenu{
  background:rgba(8,16,30,.74) !important;
  backdrop-filter:blur(12px) saturate(140%);
  border-top:1px solid rgba(216,184,119,.3);
  border-bottom:1px solid rgba(255,255,255,.08);
}
/* 見出し・タイルの意匠は restyle-svc-*.css（3案）側で定義する */
.topPc_slide .slick-slide{ padding:0 8px !important; box-sizing:border-box; }
/* 送りボタン（矢印）をゴールドに */
.pc_subMenu .slick-arrow{ color:#d8b877 !important; opacity:.85; transition:opacity .2s; }
.pc_subMenu .slick-arrow:hover{ opacity:1; }
.pc_subMenu .slick-arrow > *::before{ border-color:#d8b877 !important; }

/* ---- フッター ---- */
footer:not(.recruit) .footer-wrap, footer:not(.recruit){
  background:rgba(10,21,38,.65) !important;
  border-top:1px solid rgba(255,255,255,.1);
  color:#8a97ab !important;
}
footer:not(.recruit) a{ color:#a9b8d0 !important; }
footer:not(.recruit) a:hover{ color:#fff !important; }
.footer-copyright{ color:#6f829e !important; background:transparent !important; }

/* ---- 汎用ボタン・リンク（シャープ基調で統一） ---- */
a.btn, .box-link-01 a, input[type=submit]{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
  border-radius:2px !important;
  border:0 !important;
  font-weight:700 !important;
}

/* ---- 固定CV（スマホ・PC共通の帯） ---- */
.unit-fix-07:not(.recruit) .fix-inner{
  background-color:#C8A668 !important;
  color:#16233b !important;
  border-radius:0;
}
.unit-fix-07:not(.recruit) .fix-inner span{ color:#16233b !important; }

/* ============================================================
   HERO 案3 — シャンパングラデーション × コンパス透かし
   金を「白→シャンパンゴールド」の上品なグラデーションに抑え、
   背後にブランドシンボルのコンパスをうっすら透かす。ラグジュアリー路線。
   ============================================================ */
.contactSlide .txt-main{ color:#fff !important; letter-spacing:.08em !important; }
.contactSlide .txt-main span{
  background:linear-gradient(180deg,#ffffff 12%,#f0e2b8 58%,#cfae72 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  color:#ecd9ab !important;
  text-shadow:none !important;
  filter:drop-shadow(0 4px 20px rgba(200,166,104,.35));
}
.contactSlide .txt-main::before{
  content:"LIMITED TIME DOCUMENTS";
  display:block;
  font-family:"Cinzel",serif;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.44em;
  text-indent:.44em;
  color:rgba(216,184,119,.9);
  margin-bottom:24px;
}
/* コンパスの透かし（ブランドシンボル） */
.slide-txt.contactSlide::before{
  content:"";
  position:absolute;
  left:50%; top:46%;
  transform:translate(-50%,-50%);
  width:560px; height:560px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23d8b877' stroke-width='0.5'%3E%3Ccircle cx='24' cy='24' r='21'/%3E%3Ccircle cx='24' cy='24' r='14'/%3E%3Cpath d='M24 1v8M24 39v8M1 24h8M39 24h8'/%3E%3Cpolygon points='24,7 26.6,24 24,41 21.4,24' fill='%23d8b877' stroke='none'/%3E%3Cpolygon points='7,24 24,21.4 41,24 24,26.6' fill='%23d8b877' stroke='none'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity:.13;
  pointer-events:none;
  z-index:-1;
}
@media screen and (max-width:768px){
  .slide-txt.contactSlide::before{ width:340px; height:340px; }
  /* キッカー英字：モバイルでは字間を絞って1行に収める */
  .contactSlide .txt-main::before{
    font-size:10px !important;
    letter-spacing:.22em !important;
    text-indent:.22em !important;
    margin-bottom:16px !important;
  }
}

/* ============================================================
   HERO 案3-C — アウトライン・ミニマル「文字を邪魔しない」
   CTAを金縁アウトライン＋薄いガラス風に格下げし、
   シャンパン文字のタイトルを完全な主役にする。ホバーで金に反転。
   COMPASS PORTと同じ"金縁フレーム"言語で統一感が出る。
   ============================================================ */
.slide-list .contactSlide .txt-main{ margin-bottom:46px !important; }
.slide-list .contactSlide .txt-main span{ font-size:5.4rem !important; }
.slide-list .contactSlide .txt-sub a{
  background:rgba(10,21,38,.28) !important;
  border:1px solid rgba(216,184,119,.75) !important;
  color:#ecd9ab !important;
  outline:none !important;
  box-shadow:none !important;
  backdrop-filter:blur(5px);
  font-size:1.5rem !important;
  padding:16px 52px !important;
  letter-spacing:.22em !important;
  border-radius:0 !important;
  transition:background .25s, color .25s, transform .2s;
}
.slide-list .contactSlide .txt-sub a:hover{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
  transform:translateY(-2px);
}
@media screen and (max-width:768px){
  .slide-list .contactSlide .txt-main span{ font-size:3.2rem !important; }
  .slide-list .contactSlide .txt-sub a{ font-size:1.3rem !important; padding:13px 34px !important; }
}

/* ============================================================
   3-C バランス案3 — 黄金比スケール
   タイトルをわずかに落とし(5rem)、CTA幅をタイトル幅の約62%に。
   「大きな文字 × 小さめの品のいいボタン」の古典的プロポーション。
   ============================================================ */
.contactSlide .txt-main::before{ margin-bottom:20px !important; }
/* 2行の横幅を常に一致させるロックアップ：
   「ラストコンパスの」8字×字間.1em ＝「経営改善資料」6字×字間.06em
   → 2行目のサイズは1行目の約1.36倍（実測補正済み）（em指定なので全画面幅で比率維持） */
.slide-list .contactSlide .txt-main{
  margin-bottom:28px !important;
  font-size:3.6rem !important;
  letter-spacing:.1em !important;
  line-height:1.35 !important;
}
.slide-list .contactSlide .txt-main span{
  font-size:1.362em !important;
  letter-spacing:.06em !important;
}
.slide-list .contactSlide .txt-sub a{
  width:264px !important;
  min-width:0 !important;
  justify-content:center !important;
  font-size:1.35rem !important;
  padding:13px 0 !important;
  letter-spacing:.12em !important;
}
@media screen and (max-width:768px){
  .slide-list .contactSlide .txt-main{
    margin-bottom:20px !important;
    font-size:2.17rem !important;
  }
  .slide-list .contactSlide .txt-main span{ font-size:1.362em !important; }
  .slide-list .contactSlide .txt-sub a{
    width:auto !important;
    font-size:1.25rem !important;
    padding:9px 18px !important;
    letter-spacing:.06em !important;
  }
}

/* ============================================================
   ゴールド削減 案2改 — 白主体＋白透かし（確定版）
   タイトルは純白、キッカーは青灰、コンパス透かしは白の極薄ライン。
   金が残るのはCTAの枠と文字だけ＝「金＝押す場所」が明確。
   ============================================================ */
.contactSlide .txt-main::before{ color:#93a5bd !important; }
.contactSlide .txt-main span{
  background:none !important;
  -webkit-background-clip:initial !important; background-clip:initial !important;
  -webkit-text-fill-color:#fff !important;
  color:#fff !important;
  filter:none !important;
  text-shadow:0 2px 26px rgba(5,12,25,.65) !important;
}
/* コンパス透かし：白の極薄ライン */
.slide-txt.contactSlide::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23ffffff' stroke-width='0.5'%3E%3Ccircle cx='24' cy='24' r='21'/%3E%3Ccircle cx='24' cy='24' r='14'/%3E%3Cpath d='M24 1v8M24 39v8M1 24h8M39 24h8'/%3E%3Cpolygon points='24,7 26.6,24 24,41 21.4,24' fill='%23ffffff' stroke='none'/%3E%3Cpolygon points='7,24 24,21.4 41,24 24,26.6' fill='%23ffffff' stroke='none'/%3E%3C/svg%3E") !important;
  opacity:.08 !important;
}

/* ============================================================
   ヘッダーボタン 案3 — 金グロー（確定版）
   ホバーで枠が満金になり、文字は白ではなく
   「明るいシャンパンゴールド」に増光して金のハローを放つ。
   背面にごく薄いダークガラスを敷いて発光を際立たせる。
   ============================================================ */
.header-btn .btn-inner:hover{
  background:rgba(8,16,30,.55) !important;
  border-color:#e2c88c !important;
  box-shadow:0 0 18px rgba(216,184,119,.55), inset 0 0 12px rgba(216,184,119,.15);
}
.header-btn .btn-inner:hover span{
  color:#f3e3b3 !important;
  text-shadow:0 0 10px rgba(216,184,119,.9), 0 0 22px rgba(216,184,119,.5);
}

/* ============================================================
   SERVICE帯 案3 — ゴールド額装・シャープ
   見出しはCinzelゴールド＋和文もシャンパンで揃える。
   タイルは金の細枠×角丸なしの「額装」。COMPASS PORTボタンや
   ヒーローCTAと同じ金縁言語で、ページ全体のシャープ基調に揃う。
   ============================================================ */
/* 見出しはSEMINAR等の他セクションと同一仕様（白のNoto明朝＋青灰サブ） */
.pc_subMenu .unit-title-08, .pc_subMenu .unit-title-08 span{
  font-family:"Noto Serif JP",serif !important;
  color:#fff !important;
  letter-spacing:.18em !important;
  font-weight:500 !important;
}
.pc_subMenu .unit-title-08::after{
  background:transparent !important;
  color:#a9b8d0 !important;
  font-family:"Noto Serif JP",serif !important;
  letter-spacing:.24em !important;
  font-weight:500 !important;
}
.topPc_slide a{
  display:block;
  border:1px solid rgba(216,184,119,.5) !important;
  border-radius:3px !important;
  background:#fff !important;
  box-shadow:0 10px 26px rgba(5,12,25,.4) !important;
  overflow:hidden;
  transition:transform .25s, box-shadow .25s, border-color .25s;
}
.topPc_slide a img{ border-radius:2px; display:block; }
.topPc_slide a:hover{
  transform:translateY(-3px);
  border-color:#d8b877 !important;
  box-shadow:0 0 18px rgba(216,184,119,.35), 0 14px 32px rgba(5,12,25,.55) !important;
}

/* ============================================================
   SPメニュー 案3・配色3 — シャンパンガラス
   タイルの中に金をごく薄く溶かし込み、枠と文字を明るいシャンパンに。
   3パターン中もっともリッチで、ヒーローの金グローと調和する。
   ============================================================ */
.sp_subMenu{ padding:10px 10px 12px; }
.sp_subMenu .menuList{
  border-top:0 !important;
  display:flex; flex-wrap:wrap;
  gap:6px;
}
.sp_subMenu .menuList li,
.sp_subMenu .menuList li:nth-child(n){
  background:linear-gradient(160deg, rgba(216,184,119,.16), rgba(8,16,30,.82) 55%) !important;
  width:calc((100% - 12px)/3) !important;
  border:1px solid rgba(230,207,150,.6) !important;
  border-radius:0;
  backdrop-filter:blur(8px);
}
.sp_subMenu .menuList li a{
  color:#fff !important;
  font-family:"Cinzel","Open Sans",serif !important;
  letter-spacing:.1em;
  font-size:1.25rem !important;
  padding:1.4em .3em !important;
  text-shadow:0 0 12px rgba(216,184,119,.3);
}
.sp_subMenu .menuList li a::after{
  color:rgba(240,226,184,.65) !important;
  font-family:"Noto Sans JP",sans-serif !important;
  letter-spacing:.02em;
  font-size:.95rem !important;
  text-shadow:none;
}
.sp_subMenu .menuList li a:active{ background:rgba(216,184,119,.28) !important; }

/* ============================================================
   フッターCVバー 案3 — フローティングゴールド
   画面下に浮かせた独立ボタン（左右に余白＋影）。
   バー型よりアプリ的で、コンテンツの視認を妨げない。
   ※本番反映時はリンク先(tel:)を資料ページURLへ変更が必要。採用LP(.recruit)のENTRYバーは対象外
   ============================================================ */
.unit-fix-07:not(.recruit){
  left:14px !important;
  right:14px !important;
  bottom:14px !important;
  width:auto !important;
}
/* 下層ページはバー内に複数リンク（セミナー/資料請求/電話）があるため、
   資料請求(fix-inquery)だけを残してCTA化する。TOPは電話のみ→そのまま置換 */
.unit-fix-07:has(.fix-inquery) .fix-inner:not(.fix-inquery){ display:none !important; }
.unit-fix-07:not(.recruit) .fix-inner .fix-main,
.unit-fix-07:not(.recruit) .fix-inner .fix-sub{ display:none !important; }
.unit-fix-07:not(.recruit) .fix-inner{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  display:flex !important;
  align-items:center; justify-content:center; gap:9px;
  padding:15px 10px !important;
  border-radius:2px !important;
  box-shadow:0 5px 14px rgba(5,12,25,.28), inset 0 0 0 1px rgba(255,255,255,.35);
}
.unit-fix-07:not(.recruit) .fix-inner::before{
  content:"期間限定資料を確認する";
  font-family:"Noto Sans JP",sans-serif;
  font-weight:700;
  font-size:14px;
  letter-spacing:.12em;
  color:#16233b;
  line-height:1;
}
.unit-fix-07:not(.recruit) .fix-inner::after{
  content:"→";
  font-weight:700;
  color:#16233b;
  line-height:1;
}

/* ============================================================
   下層ページ共通の適応（A案ネイビー×ゴールド）
   トップ用スキンは header/footer/ボタン等の共通部を担うため、
   ここでは下層特有の「白背景前提の本文・見出し・パネル」を
   ダークテーマへ適応させる。
   ============================================================ */

/* ---- ページ見出し（h1.unit-title-08）：h2と同じ白明朝＋青灰サブに統一 ---- */
h1.unit-title-08, h1.unit-title-08 span{
  color:#fff !important;
  font-family:"Noto Serif JP",serif !important;
  letter-spacing:.18em !important;
  font-weight:500 !important;
}
h1.unit-title-08::after{
  background:transparent !important;
  color:#a9b8d0 !important;
  font-family:"Noto Serif JP",serif !important;
  letter-spacing:.24em !important;
}

/* ---- 本文テキスト：紺文字前提のものを明色に ---- */
body:not(:has(.box-header-02.recruit)) main p, body:not(:has(.box-header-02.recruit)) main li, body:not(:has(.box-header-02.recruit)) main dd{ color:#c6d2e2; }
body:not(:has(.box-header-02.recruit)) main h3{ color:#fff; }
.read-more .container p, .mv-read-more .container p{
  color:#eaf1fb !important;
  text-shadow:0 1px 12px rgba(5,12,25,.4);
}

/* ---- 下層ヒーロー（box-mainvisual-01）：ネイビーのオーバーレイ ---- */
.box-mainvisual-01{ position:relative; }
.box-mainvisual-01::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,
    rgba(10,21,38,.82) 0%,
    rgba(10,21,38,.55) 32%,
    rgba(10,21,38,.72) 100%);
  pointer-events:none;
}
.box-mainvisual-01 > *{ position:relative; z-index:1; }
/* タイトルSVG（紺塗り画像）を白に反転して浮かび上がらせる
   ※影を強くすると細い文字が黒ずむため控えめに */
.box-mainvisual-01 .logo, .box-mainvisual-01 .mainvisual-logo{
  filter:brightness(0) invert(1) drop-shadow(0 1px 6px rgba(5,12,25,.35));
  opacity:.97;
}
/* タイトルは背景写真の上下中央に配置
   ※.mainvisual-innerは高さ0のため、位置基準をヒーロー本体に変更する */
.box-mainvisual-01 .mainvisual-inner{ position:static !important; }
.box-mainvisual-01 .mainvisual-inner .logo{
  top:50% !important;
  z-index:1;
}

/* ---- コンセプト項目（unit-concept-01） ---- */
.unit-concept-01 .title{
  color:#d8b877 !important;
  font-family:"Noto Serif JP",serif !important;
}
.unit-concept-01 p{ color:#c6d2e2; }

/* ---- 会社概要パネル（box-about-01）
   中のワイドロゴ(紺)を活かすため白カードのまま、金の額装に ---- */
.box-about-01{
  background:linear-gradient(180deg,#ffffff,#f1f3f7) !important;
  border:1px solid rgba(216,184,119,.55);
  border-radius:0 !important;
  box-shadow:0 20px 50px rgba(5,12,25,.5);
}
.box-about-01 p, .box-about-01 dd, .box-about-01 li{ color:#48546a !important; }
.box-about-01 .section-style-01 .dl dl{ border-bottom:1px solid #dfe3e8 !important; }
.box-about-01 .section-style-01 .dl dl dt{ color:#1c2a3c !important; }

/* ---- ページ送り（wp-pagenavi）：ダーク背景で見えるように（全ページ共通） ---- */
.wp-pagenavi a, .wp-pagenavi span{
  background:transparent !important;
  border:1px solid rgba(216,184,119,.45) !important;
  color:#d8b877 !important;
}
.wp-pagenavi span.current{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
  border-color:transparent !important;
  font-weight:700 !important;
}
.wp-pagenavi span.extend{
  border:0 !important;
  color:#8fa2ba !important;
  background:transparent !important;
}
.wp-pagenavi a:hover{
  background:rgba(216,184,119,.14) !important;
  border-color:#d8b877 !important;
}

/* ---- 下層フッター（box-footer-01：淡グレー前提）をダークに ---- */
.box-footer-01:not(.recruit){ background:#0f1c2e !important; }
/* 内側wrapにも同じ半透明が掛かり中央だけ濃くなるため無効化 */
.box-footer-01:not(.recruit) .footer-wrap{ background:transparent !important; }
.box-footer-01:not(.recruit) a, .box-footer-01:not(.recruit) p, .box-footer-01:not(.recruit) li, .box-footer-01:not(.recruit) address{ color:#a9b8d0 !important; }
.box-footer-01:not(.recruit) a:hover{ color:#d8b877 !important; }
/* フッターのメニュー横に付く商品名（data-sub由来の::after）をシャンパンで表示 */
.box-footer-01:not(.recruit) a::after, footer:not(.recruit) .footer-sitemap a::after, .box-footer-01:not(.recruit) .footer-wrap a::after{
  color:rgba(216,184,119,.6) !important;
}
.box-footer-01:not(.recruit) .footer-wrap .footer-info::before{ background:rgba(255,255,255,.14) !important; }
.box-footer-01:not(.recruit) .footer-copyright{ background:#0b1521 !important; color:#6f829e !important; }
/* フッター中央ロゴ（紺画像）を淡い白に反転（TOP含む全ページ共通） */
footer:not(.recruit) .unit-logo-03, .box-footer-01:not(.recruit) .unit-logo-03, .box-footer-01:not(.recruit) .footer-logo{
  filter:brightness(0) invert(.85);
  opacity:.9;
}

/* ---- 採用LP（body.recruitlp）は独自デザインを維持 ---- */
body:has(.box-header-02.recruit){ background:#fff !important; }

/* 携帯版ヒーローCTA サイズ案1 — コンパクト（最小・上品） */
@media screen and (max-width:768px){
  .slide-list .contactSlide .txt-sub a{
    font-size:1.15rem !important;
    padding:8px 14px !important;
    letter-spacing:.05em !important;
  }
}

/* ---------- inline ---------- */
html{background:#fff; color-scheme:light;} .grecaptcha-badge,[class*="grecaptcha"]{display:none !important;}


/* ============================================================
   携帯TOP：6ボタン（.sp_subMenu）がタップ不能だった修正
   スライダー(.mainvisual-slide)が z-index:1 で上に被さり、
   z-index:auto のサブメニューがクリックを受け取れなかった。
   コンテナは pointer-events:none にし、リンクだけ受け取る。
   ============================================================ */
@media screen and (max-width:900px){
  .topSlide_wrap .sp_subMenu{
    z-index:5 !important;
    pointer-events:none !important;
  }
  .topSlide_wrap .sp_subMenu a{
    pointer-events:auto !important;
  }
}


/* ============================================================
   TOP：PCサービスカルーセル（.pc_subMenu）がクリック不能だった修正
   透明なスライダー(z-index:1)が上に被さっていたため前面に出す。
   ============================================================ */
.topSlide_wrap .pc_subMenu{
  z-index:5 !important;
}

/* ============================================================
   TOP：ヒーローCTA「期間限定資料を受け取る」の文字を中央に
   左アイコンと右矢印の幅差で文字が約15px左に寄っていた。
   両方を絶対配置にして文字をボタン中央へ。
   ============================================================ */
.mainvisual-slide .slide-inner a{
  position:relative !important;
}
.mainvisual-slide .slide-inner a::before{
  position:absolute !important;
  left:20px !important; top:50% !important;
  transform:translateY(-50%) !important;
  margin:0 !important;
}
.mainvisual-slide .slide-inner a::after{
  position:absolute !important;
  right:20px !important; top:50% !important;
  transform:translateY(-50%) !important;
  margin:0 !important;
}


/* ============================================================
   携帯TOP：スライド1（経営改善資料）の透かし位置合わせ
   両スライドとも縦中央揃えのため、CTAボタンの分だけ背が高い
   スライド1は英字ラベルが36px上にずれていた。
   MISSIONスライドとラベルの高さが揃うよう下げる。
   ============================================================ */
@media screen and (max-width:900px){
  .mainvisual-slide .slide-txt:has(a){
    margin-top:36px !important;
  }
}


/* ============================================================
   TOP：英字セクション見出し（SERVICE / SEMINAR / TRAINING 等）を
   行書系（Noto Serif JP）からゴシックへ統一
   ============================================================ */
body.home .unit-title-08,
body.home .unit-title-08 span,
body.home .unit-title-08::after{
  font-family:"Open Sans","Noto Sans JP",sans-serif !important;
}


/* ============================================================
   英字セクション見出し（unit-title-08）を行書系からゴシックへ統一
   ページ上部の「SERVICE MENU / サービスメニュー」等も対象
   ============================================================ */
h1.unit-title-08, h2.unit-title-08, p.unit-title-08,
h1.unit-title-08 span, h2.unit-title-08 span, p.unit-title-08 span,
h1.unit-title-08::after, h2.unit-title-08::after, p.unit-title-08::after,
.unit-title-08, .unit-title-08 span, .unit-title-08::after{
  font-family:"Open Sans","Noto Sans JP",sans-serif !important;
}


/* TOPのSERVICE見出し（.pc_subMenu内）は旧指定の詳細度が高く
   行書体のまま残っていたため、同じ詳細度で上書きしてSEMINARと揃える */
.pc_subMenu .unit-title-08,
.pc_subMenu .unit-title-08 span,
.pc_subMenu .unit-title-08::after{
  font-family:"Open Sans","Noto Sans JP",sans-serif !important;
}


/* ---- カルーセルhoverの商品カテゴリ表示（商品戦略など）を少し小さく ---- */
.topPc_slide a[data-sub]::before{
  font-size:15px !important;
  letter-spacing:.08em !important;
}


/* ---- 見出しの太さを統一（SERVICE MENU=500 / SUB MENU=600 と不揃いだった） ---- */
h1.unit-title-08, h2.unit-title-08, p.unit-title-08,
h1.unit-title-08 span, h2.unit-title-08 span, p.unit-title-08 span{
  font-weight:600 !important;
}

/* ---- 導入カードの見出し（unit-title-13）も行書体→ゴシックに ---- */
h2.unit-title-13, .unit-title-13, .unit-title-13 span{
  font-family:"Open Sans","Noto Sans JP",sans-serif !important;
  font-weight:700 !important;
}


/* SERVICE見出し（.pc_subMenu）の太さも600に。
   旧指定(.pc_subMenu付き=詳細度高)が500を維持していて
   SEMINAR(600)と太さが揃っていなかった */
.pc_subMenu .unit-title-08,
.pc_subMenu .unit-title-08 span{
  font-weight:600 !important;
}

/* ---- 修正: 紺グラデーションをキャンバス(html)に適用 ----
   bodyのボックスが1画面分しかなく、下スクロール時に下地の別色紺が
   見えていた問題の解消。ルート要素の背景はキャンバス全体に描画される。 */
html:not(:has(.box-header-02.recruit)){
  background:
    radial-gradient(1300px 640px at 50% -8%, rgba(96,158,196,.28), transparent 60%),
    radial-gradient(1000px 560px at 90% 30%, rgba(38,96,128,.22), transparent 55%),
    linear-gradient(180deg,#12283f 0%,#0d1e33 40%,#0a1526 100%) #0a1526 !important;
  background-attachment:fixed !important;
}
body:not(:has(.box-header-02.recruit)){ background:transparent !important; }

/* ---- 修正: TOPヒーロースライダーのドット位置ぐらつき ----
   slickのadaptiveHeightがスライド切替時に高さを再計算・アニメーションし、
   下部のドットが一瞬上にずれていた。インライン高さを無効化して安定させる
   （article_sliderListと同じ既知対策）。 */
.mainvisual-slide .slick-list{
  height:auto !important;
}


/* ============================================================
   修正: TOP「ラストコンパスの」をひとまわり小さく（携帯・PC同比率）
   「経営改善資料」は従来の絶対サイズを維持するようem比率を再計算
   携帯: 2.17rem×1.362em → 1.95rem×1.516em（経営改善資料=2.956rem維持）
   PC:   3.6rem×1.362em → 3.24rem×1.513em（経営改善資料=4.90rem維持）
   ============================================================ */
.slide-list .contactSlide .txt-main{ font-size:3.24rem !important; }
.slide-list .contactSlide .txt-main span{ font-size:1.513em !important; }
@media screen and (max-width:768px){
  .slide-list .contactSlide .txt-main{ font-size:1.95rem !important; }
  .slide-list .contactSlide .txt-main span{ font-size:1.516em !important; }
}


/* 携帯: 下部CVボタンの幅をTOPの6ボタングリッド(左右10px)と統一 */
@media screen and (max-width:768px){
  .unit-fix-07:not(.recruit){ left:10px !important; right:10px !important; }
}


/* ============================================================
   修正: 携帯TOP スライド1（経営改善資料）の透かし中心を
   MISSIONスライドの透かしと一致させる（実測18pxズレの補正）
   ※PCは3px差でほぼ一致のため対象外
   ============================================================ */
@media screen and (max-width:768px){
  /* 透かし: 両スライドとも4px下げ（-18px→-14px / 46%→46%+4px） */
  .slide-txt.contactSlide::before{ top:calc(46% - 14px) !important; }
  .slide-txt:not(.contactSlide)::before{ top:calc(46% + 4px) !important; }
}

/* キッカー英字の文言変更: LIMITED TIME DOCUMENTS → LIMITED MATERIALS */
.contactSlide .txt-main::before{ content:"LIMITED MATERIALS" !important; }

/* 携帯: キッカー英字を6px下へ（親を1px上げた分を相殺し見た目の位置を維持） */
@media screen and (max-width:768px){
  .contactSlide .txt-main::before{ transform:translateY(6px); }
}


/* ============================================================
   修正: 携帯TOP スライド1の文言＋ボタンを少し上へ(-12px)
   transform方式のため透かし・レイアウトには影響しない
   ============================================================ */
@media screen and (max-width:768px){
  .slide-list .contactSlide .txt-main{
    transform:translateY(-16px) !important;
  }
  /* ボタンは追加で少し上（計-23px） */
  .slide-list .contactSlide .txt-sub{
    transform:translateY(-23px) !important;
  }
  /* MISSIONスライドの「成果に直結する〜」も4px上へ（透かしは不変） */
  .slide-list .slide-txt:not(.contactSlide) .txt-main{
    transform:translateY(-4px) !important;
  }
}
/* PC: ボタンを7px上へ */
@media screen and (min-width:769px){
  .slide-list .contactSlide .txt-sub{
    transform:translateY(-7px) !important;
  }
}



/* ============================================================
   修正: 携帯TOP「ラストコンパスの経営改善資料」を一回り縮小
   （1.95rem→1.85rem、2行目は比率維持で連動縮小。
     高さ減少3.4pxは下側で相殺し、透かし位置は不変）
   ============================================================ */
@media screen and (max-width:768px){
  .slide-list .contactSlide .txt-main{ font-size:1.85rem !important; }
  .slide-list .contactSlide .txt-sub{ margin-bottom:3.4px !important; }
}


/* ============================================================
   修正: PC TOPスライダーの切替矢印を「成果に直結する〜」の
   文字ラインと同じ高さに（実測42px下へ）
   ============================================================ */
@media screen and (min-width:769px){
  .mainvisual-slide .arrow-prev,
  .mainvisual-slide .arrow-next{
    top:calc(50% - 108px) !important;
  }
}


/* ============================================================
   修正: TOPのSEMINAR/TRAINING一覧スライダー下に巨大な空白
   原因: テーマ css/common.css（@import）の .slick-slide{height:100%}
   により、スライドが body{height:100%}=画面高 まで引き伸ばされ、
   実コンテンツ(約376px)との差が空白として残っていた（2カ所）。
   → この2つのスライダーのみ内容の高さに合わせる
   ============================================================ */
.article_sliderList .slick-slide,
.article_sliderList .slick-track{
  height:auto !important;
}


/* ============================================================
   修正: スクロール時にヘッダー下端へ明るい帯が出る問題（案3）
   原因: ヘッダーが半透明(72%)＋ぼかし＋彩度150%のため、
   スクロールでヘッダーの裏に入った明るいヒーロー画像が透けて浮く。
   → 最上部ではガラス調を維持し、スクロールしたら濃紺へ切替（JSで .lc-scrolled 付与）
   ============================================================ */
.header-wrap{
  transition:background-color .25s linear, backdrop-filter .25s linear, -webkit-backdrop-filter .25s linear;
}
body.lc-scrolled .header-wrap{
  background:#0a1526 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}


/* ============================================================
   修正: PCヒーロー 透かし・文字・左右の切替矢印をまとめて5px上げる
   （見た目の紺帯 Y=100〜869 の中心=484 に対し、透かし6px下／
     文字ブロック12px下だったため、全体を5px上げて中央へ寄せる）
   ============================================================ */
@media screen and (min-width:769px){
  /* 透かし（両スライド） */
  .slide-txt.contactSlide::before{ top:calc(46% - 10px) !important; }
  .slide-txt:not(.contactSlide)::before{ top:calc(46% - 10px) !important; }

  /* 文字（キャッチ・ラベル）を5px上げる */
  .slide-list .contactSlide .txt-main,
  .slide-list .slide-txt:not(.contactSlide) .txt-main,
  .slide-list .slide-txt:not(.contactSlide) .txt-sub{
    transform:translateY(-10px) !important;
  }
  /* ボタンは既に-7pxのため-12pxにして同じ5px分上げる */
  .slide-list .contactSlide .txt-sub{
    transform:translateY(-17px) !important;
  }

  /* 左右の切替矢印（-108px → -113px） */
  .mainvisual-slide .arrow-prev,
  .mainvisual-slide .arrow-next{
    top:calc(50% - 118px) !important;
  }
}


/* ============================================================
   修正: PC 「経営改善資料」の行だけ2px上へ
   （「ラストコンパスの」「LIMITED MATERIALS」「ボタン」は動かさない）
   ============================================================ */
@media screen and (min-width:769px){
  .slide-list .contactSlide .txt-main span{
    display:inline-block;
    transform:translateY(-4px);
  }
}
