@charset "utf-8";
/* ============================================================
   SIMPLE NOTE（service/simplenote）
   本番テーマ 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:#B8945A !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(184,148,90,.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(184,148,90,.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:#B8945A !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:#B8945A !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%,#ECD8A4 58%,#B8945A 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  color:#ECD8A4 !important;
  text-shadow:none !important;
  filter:drop-shadow(0 4px 20px rgba(184,148,90,.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:#ECD8A4 !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(236,216,164,.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(236,216,164,.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;
}

/* 携帯版ヒーロー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;
  }
}

/* ============================================================
   下層ページ共通の適応（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; }

/* ============================================================
   SIMPLE NOTEサービスページ 基礎適応
   「一枚の紙」＝白紙ブランドのページのため、共通ダークスキンを
   このページでは解除し、白地で成立する配色に戻すのが土台。
   見た目の方向性は restyle-snstyle-1〜3.css の3案で切替。
   ============================================================ */

/* ---- ページ全体：白地に戻す（ダーク本文の打ち消し） ---- */
body.simplenote.service{ background:#fff !important; }
html:has(body.simplenote.service){ background:#fff !important; }
body.simplenote.service main p,
body.simplenote.service main li,
body.simplenote.service main dd{ color:#4a5568; }
body.simplenote.service main h3{ color:#1c2a3c; }

/* ---- 見出し（unit-title-08）：共通CSSの白→紺明朝に戻す ---- */
body.simplenote.service h1.unit-title-08, body.simplenote.service h1.unit-title-08 span,
body.simplenote.service h2.unit-title-08, body.simplenote.service h2.unit-title-08 span{
  color:#1c2a3c !important;
  font-family:"Noto Serif JP",serif !important;
}
body.simplenote.service .unit-title-08::after{
  background:transparent !important;
  color:#8a93a3 !important;
  font-family:"Noto Serif JP",serif !important;
  letter-spacing:.24em !important;   /* TOP等の見出しサブと同じ字間 */
}

/* ---- タグ・READMOREボタン：金縁の共通言語 ---- */
body.simplenote.service .unit-tag-01 a, body.simplenote.service .unit-tag-04 a{
  border:1px solid rgba(184,148,90,.6) !important;
  color:#a8834a !important;
  background:transparent !important;
  border-radius:0 !important;
}
body.simplenote.service .box-readmore-01 a{
  border:1px solid rgba(184,148,90,.75) !important;
  color:#a8834a !important;
  background:#fff !important;
  border-radius:0 !important;
  transition:background .25s, color .25s;
}
body.simplenote.service .box-readmore-01 a:hover{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
}

/* ---- REQUESTフォーム：白地用（入力枠・金の送信CTA） ---- */
body.simplenote.service .box-form-01 input[type="text"],
body.simplenote.service .box-form-01 input[type="email"],
body.simplenote.service .box-form-01 input[type="tel"],
body.simplenote.service .box-form-01 select,
body.simplenote.service .box-form-01 textarea{
  background:#fff !important;
  color:#1c222f !important;
  border:1px solid #c9cfd8 !important;
  border-radius:0 !important;
}
body.simplenote.service .box-form-01 input:focus,
body.simplenote.service .box-form-01 select:focus,
body.simplenote.service .box-form-01 textarea:focus{
  outline:none !important;
  border-color:#B8945A !important;
  box-shadow:0 0 0 3px rgba(216,184,119,.25) !important;
}
body.simplenote.service .box-form-01 input[type="checkbox"],
body.simplenote.service .box-form-01 input[type="radio"]{ accent-color:#B8945A; }
/* 送信ボタン：外側ラッパー(btn-submit1)は透明にし、input本体だけ金に
   （両方塗ると二重の帯になる） */
body.simplenote.service .btn-submit1{
  background:transparent !important;
  box-shadow:none !important;
  border:0 !important;
}
body.simplenote.service .box-form-01 .wpcf7-list-item-label{ color:#4a5568 !important; }
body.simplenote.service .wpcf7-submit{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
  border:0 !important;
  border-radius:2px !important;
  font-weight:700 !important;
  letter-spacing:.14em !important;
  cursor:pointer;
  box-shadow:0 0 0 1px rgba(216,184,119,.5), 0 14px 36px rgba(184,148,90,.3);
}

/* ---- フォームのラベル（th）：淡色→紺で読みやすく ---- */
body.simplenote.service .box-form-01 th{
  color:#1c2a3c !important;
  font-weight:600;
}
body.simplenote.service .box-form-01 th a{ color:#1c2a3c !important; }

/* ---- ヘッダー：このページはオリジナル同様の白ヘッダー ---- */
body.simplenote.service .header-wrap{
  background:rgba(255,255,255,.94) !important;
  backdrop-filter:blur(12px);
  border-bottom:1px solid #e6e9ee !important;
}
body.simplenote.service .box-header-02 .header-nav a{ color:#1c2a3c !important; }
body.simplenote.service .box-header-02 .header-nav a span{ color:#8a93a3 !important; }
body.simplenote.service .box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li > a::after{
  color:#8a93a3 !important;
}
/* ホバー：白地では濃いめの金で */
body.simplenote.service .box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li > a:hover{
  color:#a8834a !important;
  box-shadow:inset 0 -2px 0 #B8945A;
}
body.simplenote.service .box-header-02 .header-wrap .header-inner .header-nav ul.nav-inner > li > a:hover::after{
  color:rgba(168,131,74,.8) !important;
}
body.simplenote.service .header-logo, body.simplenote.service .header-logo a{ color:#1c2a3c !important; }
/* COMPASS PORTボタン：白地用の金縁 */
body.simplenote.service .header-btn .btn-inner{
  border:1px solid rgba(184,148,90,.8) !important;
  color:#a8834a !important;
  background:#fff !important;
}

/* ---- ヘッダーのドロップダウン：中身はダークガラスのため明色に戻す
   （白ヘッダー用の紺文字指定がここにも効くと背景と同化する） ---- */
body.simplenote.service .box-header-02 .header-nav .nav-child a{
  color:#cfd8e4 !important;
}
body.simplenote.service .box-header-02 .header-nav .nav-child a span{
  color:rgba(216,184,119,.75) !important;
}
body.simplenote.service .box-header-02 .header-nav .nav-child a::after{
  color:rgba(216,184,119,.75) !important;
}
body.simplenote.service .box-header-02 .header-nav .nav-child a:hover{
  color:#d8b877 !important;
}


/* ============================================================
   REQUEST（資料請求フォーム）をLOGICALTEページと統一
   必須バッジ=ゴールド／白パネル＋金ヘアライン／入力欄ヘアライン／送信=金グラデ
   ============================================================ */
body.simplenote.service .box-form-01 th.required::after{
  background:#b8945a !important;
  color:#fff !important;
  border-radius:2px;
  letter-spacing:.08em;
}
body.simplenote.service .box-form-01 input[type="text"],
body.simplenote.service .box-form-01 input[type="email"],
body.simplenote.service .box-form-01 input[type="tel"],
body.simplenote.service .box-form-01 textarea{
  border:1px solid #d7dbe3 !important;
  background:#fff !important;
  border-radius:0 !important;
}
body.simplenote.service .box-form-01 input:focus,
body.simplenote.service .box-form-01 textarea:focus{
  outline:none !important;
  border-color:#1c2238 !important;
}
body.simplenote.service .box-form-01 table tr{
  border-bottom:1px solid #e3e6ec !important;
}
body.simplenote.service .btn-submit1 input.wpcf7-submit{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
  font-family:"Noto Sans JP",sans-serif !important;
  font-weight:700 !important;
  font-size:15px !important;
  letter-spacing:.14em !important;
  padding:20px 10px !important;
  border:0 !important;
  border-radius:2px !important;
  box-shadow:0 5px 14px rgba(5,12,25,.2), inset 0 0 0 1px rgba(255,255,255,.35) !important;
  transition:filter .2s;
}
body.simplenote.service .btn-submit1 input.wpcf7-submit:hover{
  filter:brightness(1.07);
}

/* ---- フッターはこのページのみ白 ---- */
body.simplenote.service:not(.recruit) .box-footer-01:not(.recruit){
  background:#ffffff !important;
}
body.simplenote.service:not(.recruit) .box-footer-01:not(.recruit) .footer-wrap{
  background:transparent !important;
}
body.simplenote.service:not(.recruit) .box-footer-01:not(.recruit) .footer-copyright{
  background:#F4F4F4 !important;
  color:#6B7280 !important;
}
body.simplenote.service:not(.recruit) .box-footer-01:not(.recruit) .footer-wrap .footer-info::before{
  background:rgba(28,34,47,.12) !important;
}

/* ============================================================
   パンフレット画像：焼き込みのドロップシャドウを弱めた版に差し替え
   （本番では pamphlet.png を pamphlet-soft.png に差し替える）
   ============================================================ */
body.simplenote.service .pamphletBlc figure.img img{
  content:url("../../images/restyle/simplenote-f24c31c6b4.png");
}


/* ============================================================
   サービスページ共通フッター（グレー）
   背景 #F2F2F2 に統一し、フォントは "Open Sans","Noto Sans JP"。
   ============================================================ */
body.service:not(.recruit) .box-footer-01:not(.recruit){
  background:#F2F2F2 !important;
}
/* 内側wrapの二重塗りを無効化 */
body.service:not(.recruit) .box-footer-01:not(.recruit) .footer-wrap{
  background:transparent !important;
}
body.service:not(.recruit) .box-footer-01:not(.recruit) a,
body.service:not(.recruit) .box-footer-01:not(.recruit) p,
body.service:not(.recruit) .box-footer-01:not(.recruit) li,
body.service:not(.recruit) .box-footer-01:not(.recruit) dt,
body.service:not(.recruit) .box-footer-01:not(.recruit) dd,
body.service:not(.recruit) .box-footer-01:not(.recruit) address{
  color:#1C222F !important;
}
body.service:not(.recruit) .box-footer-01:not(.recruit) a:hover{ color:#a8834a !important; }

/* メニュー横の商品名（::after）は金 */
body.service:not(.recruit) .box-footer-01:not(.recruit) a::after,
body.service:not(.recruit) footer:not(.recruit) .footer-sitemap a::after{
  color:#a8834a !important;
}
body.service:not(.recruit) .box-footer-01:not(.recruit) .footer-wrap .footer-info::before{
  background:rgba(28,34,47,.14) !important;
}
body.service:not(.recruit) .box-footer-01:not(.recruit) .footer-copyright{
  background:#E9E9E9 !important;
  color:#6B7280 !important;
}

/* 中央ロゴは原色（反転しない） */
body.service:not(.recruit) footer:not(.recruit) .unit-logo-03,
body.service:not(.recruit) .box-footer-01:not(.recruit) .unit-logo-03,
body.service:not(.recruit) .box-footer-01:not(.recruit) .footer-logo{
  filter:none !important;
  opacity:1 !important;
}

/* ---- フォント統一 ---- */
body.service:not(.recruit) .box-footer-01:not(.recruit),
body.service:not(.recruit) .box-footer-01 a,
body.service:not(.recruit) .box-footer-01 p,
body.service:not(.recruit) .box-footer-01 li,
body.service:not(.recruit) .box-footer-01 dt,
body.service:not(.recruit) .box-footer-01 dd,
body.service:not(.recruit) .box-footer-01 address,
body.service:not(.recruit) .box-footer-01 .footer-copyright{
  font-family:"Open Sans","Noto Sans JP",sans-serif !important;
}

/* ============================================================
   サービスページ共通 — 金の正本化
   テーマ側に残る旧ゴールド #D2C185 を正本の4値に寄せる。

   正本パレット
     #ECD8A4  ペール（濃色背景のグラデ上端）
     #D8B877  ライト（濃色背景の文字）
     #B8945A  スタンダード（罫・枠・面）
     #A8834A  ダーク（明色背景の文字）
   ============================================================ */

/* 問い合わせフォームの表の罫線 */
body.service:not(.recruit) .box-form-01 table td,
body.service:not(.recruit) .box-form-01 table th,
body.service:not(.recruit) .box-table-08 table td,
body.service:not(.recruit) .box-table-08 table th,
body.service:not(.recruit) table th.required,
body.service:not(.recruit) table th.required.nowrap{
  /* テーマ既定の 2px ベタ金は重いので、1pxの淡い金に */
  border-bottom:1px solid rgba(184,148,90,.42) !important;
}

/* 「WEB」などのラベルバッジ */
body.service:not(.recruit) .under-simplenote-sec04 li > span{
  background:#B8945A !important;
  color:#ffffff !important;
}

/* ============================================================
   SEMINAR・ブログ一覧カード（.box-article-01）の左右余白
   携帯で本文が画面端から10px、日付(.time-inner)が右へはみ出していた。
   ============================================================ */
@media screen and (max-width:900px){
  body.service:not(.recruit) .box-article-01 > li{
    padding-left:6px !important;
    padding-right:6px !important;
    box-sizing:border-box !important;
  }
  body.service:not(.recruit) .box-article-01 .time-inner{
    display:inline-block !important;
    max-width:100% !important;
    white-space:normal !important;
    box-sizing:border-box !important;
  }
}

/* CASE一覧（.box-article-04）：親wrapperの余白が10pxしかなく本文が端に寄る */
@media screen and (max-width:1100px){
  body.service:not(.recruit) .box-article-04{
    padding-left:10px !important;
    padding-right:10px !important;
    box-sizing:border-box !important;
  }
}

/* ============================================================
   iPad帯のガター穴を塞ぐ
   テーマは .blc_in / .wrapper に @media(max-width:1000px) でしか
   左右paddingを与えておらず、1001〜1100pxでは max-width:1000px の
   まま余白が5pxしか残らない。
   ※ReNOMAは個別に調整済みのため除外（比較表と白ボックスの幅一致を保つ）
   ============================================================ */
@media screen and (min-width:1001px) and (max-width:1100px){
  body.service:not(.recruit):not(.renoma):not(.simplenote) .blc_in,
  body.service:not(.recruit):not(.renoma):not(.simplenote) .wrapper{
    padding-left:40px !important;
    padding-right:40px !important;
    box-sizing:border-box !important;
  }
}

/* ---------- aosFallback ---------- */
.aos-init{opacity:1 !important; transform:none !important;}

/* ---------- sns1 ---------- */
/* ============================================================
   SIMPLE NOTEページ 案1 — 白紙×金アクセント
   「一枚の紙」の白ミニマルを最大限保持。金は英字キッカー・
   短い金ライン・ボタン・タブの縁のみに絞る
   ============================================================ */

/* 見出し：TOPの「SERVICE」と同じ構成
   （英字は広い字間、直下にテーマの短い金線、その下に日本語サブ） */
body.simplenote.service h2.unit-title-08 span{
  letter-spacing:.18em !important;
}
body.simplenote.service h2.unit-title-08 span::after{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
}

/* 各支援セクションの英字キッカー（data-sub）を金に */
body.simplenote.service .serviceList_ttl::before,
body.simplenote.service .serviceList_ttl::after{
  color:#b8945a !important;
}
body.simplenote.service .serviceList_ttl span{
  color:#1c2a3c !important;
  font-family:"Noto Serif JP",serif !important;
}

/* アンカータブ（設計支援〜その他支援）：角スクエア×金縁、ホバーで紺反転 */
body.simplenote.service a[href*="#ancher"]{
  border:1px solid rgba(184,148,90,.6) !important;
  color:#1c2a3c !important;
  background:#fff !important;
  border-radius:0 !important;
  transition:background .25s, color .25s;
}
body.simplenote.service a[href*="#ancher"]:hover{
  background:#1c2a3c !important;
  color:#f0e2b8 !important;
}

/* 項目カード：見出し(dt)は紺の太字、写真はスクエアのまま */
body.simplenote.service .itemDl dt{ color:#1c2a3c !important; font-weight:700; }
body.simplenote.service .itemDl dd{ color:#4a5568 !important; }

/* ---------- snt1 ---------- */
/* ============================================================
   SIMPLE NOTE サービスタブ 案1 — 金縁アウトライン
   白地×金の縁取り。ホバーで金に充填（ヒーローCTAと同じ言語）
   ============================================================ */
body.simplenote.service a[href*="#ancher"]{
  border:1px solid rgba(184,148,90,.85) !important;
  color:#1c2a3c !important;
  background:#fff !important;
  border-radius:0 !important;
  font-weight:600;
  transition:background .25s, color .25s;
}
body.simplenote.service a[href*="#ancher"]:hover{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  color:#16233b !important;
}

/* ---------- snh1 ---------- */
/* キャッチは改行タグを無効化して常に1行（幅に応じて自動縮小） */
body.simplenote.service .sn_mainTtl .txt01 br{ display:none !important; }
body.simplenote.service .sn_mainTtl .txt01{
  white-space:nowrap !important;
  text-indent:0 !important;      /* テーマの「」ぶら下げインデントを解除 */
  font-family:"Noto Serif JP",serif !important;
}
/* テーマの固定幅500pxを解除し、1行テキストの実幅に合わせる */
body.simplenote.service .sn_mainImg .sn_mainImg_in .sn_mainTtl{
  width:max-content !important;
  max-width:calc(100% - 32px) !important;
}

/* ============================================================
   SIMPLE NOTEヒーロー 案1 — フルブリード写真×中央見出し
   写真を全幅の背景にし、紺のスクリムの上に白の1行キャッチを
   中央配置。もっともドラマチックな案
   ============================================================ */
body.simplenote.service .sn_mainImg{
  position:relative !important;
  display:block !important;
  min-height:calc(100vh - 100px);
  margin-bottom:50px;
}
body.simplenote.service .sn_mainImg .mainImg{
  position:absolute !important; inset:0;
  width:100% !important;   /* テーマの60%幅を解除（insetより幅指定が勝つ） */
  height:100% !important;
  margin:0 !important;
}
body.simplenote.service .sn_mainImg .mainImg img{
  width:100% !important; height:100% !important;
  object-fit:cover; display:block;
}
body.simplenote.service .sn_mainImg::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,21,38,.32), rgba(10,21,38,.16) 45%, rgba(10,21,38,.38));
}
body.simplenote.service .sn_mainImg_in{
  position:relative !important; z-index:2;
  width:100% !important; min-height:calc(100vh - 100px);
  display:flex !important; align-items:center; justify-content:center;
}
body.simplenote.service .sn_mainTtl{
  background:transparent !important; border:0 !important;
  width:auto !important; height:auto !important;
  margin:0 !important; padding:0 18px !important;
  text-align:center;
}
body.simplenote.service .sn_mainTtl .txt01{
  color:#fff !important;
  font-size:clamp(16px, 3.1vw, 38px) !important;
  letter-spacing:.12em;
  text-shadow:0 2px 18px rgba(5,12,25,.5);
  margin-bottom:26px !important;
}
body.simplenote.service .sn_mainTtl .txt02{
  color:#e6edf7 !important;
  text-shadow:0 1px 10px rgba(5,12,25,.5);
}

/* ---------- snHeroImg ---------- */
body.simplenote.service .sn_mainImg .mainImg img{content:url("../../images/restyle/simplenote-2f83ddfb75.jpg");object-fit:cover;}

/* ---------- snp1 ---------- */
body.simplenote.service .sn_mainImg .mainImg img{object-position:center 30% !important;}

/* ---------- snc1 ---------- */
body.simplenote.service .sn_mainTtl{
  text-align:left !important;
  border:0 !important;
}
body.simplenote.service .sn_mainTtl .txt01{
  border-left:0 !important;
  padding-left:0 !important;
  font-weight:600 !important;
}
body.simplenote.service .sn_mainTtl .txt02{
  text-align:left;
  line-height:2.05;
  font-size:clamp(12px, 1.1vw, 14.5px);
  padding-left:25px;   /* 金バー装飾を外した分のインデント */
  white-space:nowrap;  /* 改行は原文の<br>位置のみ（全画面幅共通） */
}
/* テーマはPC幅で<br>を非表示にするため、常に有効化して写真どおりの改行に固定 */
body.simplenote.service .sn_mainTtl .txt02 br{
  display:inline !important;
}
@media screen and (max-width:400px){
  /* 最長行(22字)が320px端末でも収まるサイズに */
  body.simplenote.service .sn_mainTtl .txt02{ font-size:clamp(10.5px, 3.1vw, 12px) !important; }
}

/* ============================================================
   空配置 案1 — 左上コーナー
   写真をやや下げ、空の左上に見出し＋本文。最も自然な新聞的視線
   ============================================================ */
body.simplenote.service .sn_mainImg .mainImg img{ object-position:center 15% !important; }
body.simplenote.service .sn_mainImg_in{
  justify-content:flex-start !important;
  align-items:flex-start !important;
}
body.simplenote.service .sn_mainTtl{ padding:7vh 0 0 6vw !important; }
body.simplenote.service .sn_mainTtl .txt01{
  font-size:clamp(17px, 3.3vw, 42px) !important;
  margin-bottom:24px !important;
}

/* ---- ヘッダー透過：空をヘッダーの裏まで広げる ---- */
body.simplenote.service .header-wrap{
  background:transparent !important;
  backdrop-filter:none !important;
  border-bottom:0 !important;
  box-shadow:none !important;
}
/* 静的ヘッダー（スペーサー）を高さ0にし、ページをy=0から開始
   ※mainはoverflow-x:hiddenのスクロールコンテナのため、負マージンで
   引き上げると上部が切り取られる。スペーサー除去方式が正解 */
body.simplenote.service header.box-header-02{
  height:0 !important;
  min-height:0 !important;
}
body.simplenote.service .sn_mainImg{
  margin-top:0 !important;
  min-height:100vh !important;
}
body.simplenote.service .sn_mainImg_in{
  min-height:100vh !important;
}
/* 文字はヘッダー高さ100pxを避けて配置 */
body.simplenote.service .sn_mainTtl{ padding:calc(100px + 6vh) 0 0 8vw !important; }
@media screen and (max-width:768px){
  body.simplenote.service .sn_mainTtl{ padding:calc(60px + 2.5vh) 16px 0 !important; }
}

/* ---------- snf2 ---------- */
body.simplenote.service .sn_mainImg .mainImg img{ object-position:center 0% !important; }

/* ============================================================
   被り調整 案2 — ミニマム
   キャッチ最大32px・本文も小さめ。最も余白が効いた静かな構成
   ============================================================ */
body.simplenote.service .sn_mainTtl{ padding:calc(100px + 5vh) 0 0 6vw !important; }
body.simplenote.service .sn_mainTtl .txt01{
  font-size:clamp(15px, 2.5vw, 32px) !important;
  margin-bottom:18px !important;
}
body.simplenote.service .sn_mainTtl .txt02{
  font-size:clamp(11px, .98vw, 13px);
  line-height:1.9;
}

/* SP：キャッチは指定の2行構成＋本文ともに中央揃え
   「少ない」という／概念が生み出した優位性 */
@media screen and (max-width:768px){
  body.simplenote.service .sn_mainImg .sn_mainImg_in .sn_mainTtl{
    width:100% !important;          /* max-contentだと僅かに左寄りになる */
    max-width:none !important;
    text-align:center !important;
    padding-left:16px !important;
    padding-right:16px !important;
  }
  body.simplenote.service .sn_mainTtl .txt01{
    white-space:normal !important;      /* 折返し許可（改行はbrで制御） */
    font-size:clamp(19px, 5.6vw, 26px) !important;
    letter-spacing:.08em !important;
    line-height:1.6 !important;
  }
  /* 1つ目のbrだけ有効化 → 「〜という」で改行、2つ目は無効のまま */
  body.simplenote.service .sn_mainTtl .txt01 br:first-of-type{ display:inline !important; }
  body.simplenote.service .sn_mainTtl .txt02{
    text-align:center !important;
    padding-left:0 !important;
  }
  body.simplenote.service .sn_mainTtl > div{ text-align:center; }
}

/* PCは本文を一段大きく */
@media screen and (min-width:769px){
  body.simplenote.service .sn_mainTtl .txt02{
    font-size:clamp(12.5px, 1.1vw, 14px) !important;
  }
}

/* ワイド画面では縦の切り取りが大きく家の下が切れるため、少しだけ下側を見せる */
@media screen and (min-width:1500px){
  body.simplenote.service .sn_mainImg .mainImg img{ object-position:center 18% !important; }
}

/* PC: キャッチ1行だけ左余白8%（ブロック全体は6%のまま、差分2vwを上乗せ） */
@media screen and (min-width:769px){
  body.simplenote.service .sn_mainTtl .txt01{
    margin-left:2vw !important;
  }
  /* 本文は左余白9%（6vw+3vw） */
  body.simplenote.service .sn_mainTtl .txt02{
    margin-left:3vw !important;
    padding-left:0 !important;
  }
}

/* ---------- snhd3 ---------- */
/* ============================================================
   見出し 案3 — ゴシック太字ミニ
   小さく太いゴシック。金線を短く細くしてタグのような佇まい
   ============================================================ */
body.simplenote.service h2.unit-title-08,
body.simplenote.service h2.unit-title-08 span{
  font-family:"Noto Sans JP","Open Sans",sans-serif !important;
  font-weight:700 !important;
  font-size:clamp(15px, 1.5vw, 19px) !important;
  letter-spacing:.28em !important;
}
body.simplenote.service h2.unit-title-08 span::after{
  width:22px !important;
  height:1px !important;
}
body.simplenote.service h2.unit-title-08::after{
  font-family:"Noto Sans JP",sans-serif !important;
  font-weight:500 !important;
  font-size:clamp(9.5px, .9vw, 11px) !important;
}

/* ---------- sncp1 ---------- */
body.simplenote.service a[href*="#ancher"]{
  border:0 !important;
  background:#1c2a3c !important;
  color:#fff !important;
  font-weight:500;
  font-size:1.25rem !important;
  padding:9px 20px !important;
  border-radius:0 !important;
  transition:background .25s, color .25s;
}

/* ============================================================
   紺チップ 案1 — 金ボトムライン
   チップ下端に2pxの金ライン。ホバーで金に反転
   ============================================================ */
body.simplenote.service a[href*="#ancher"]{
  border-bottom:2px solid #B8945A !important;
  padding:9px 20px 7px !important;
}
body.simplenote.service a[href*="#ancher"]:hover{
  background:linear-gradient(135deg,#ecd8a4,#d8b877 45%,#b8945a) !important;
  border-bottom-color:transparent !important;
  color:#16233b !important;
}

/* SP：チップは内容幅で折返し配置（「その他支援」の2行化防止） */
@media screen and (max-width:768px){
  body.simplenote.service ul.anchorLink{
    display:flex !important;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
  }
  body.simplenote.service ul.anchorLink li{
    width:auto !important;
    margin:0 !important;
  }
  body.simplenote.service a[href*="#ancher"]{
    display:inline-block;
    white-space:nowrap;
    font-size:1.15rem !important;
    padding:8px 14px 6px !important;
  }
}

/* ---------- snhz1 ---------- */
/* ============================================================
   見出し拡大 案1 — ゴシック太字 26px
   確定した太字ゴシックの雰囲気のまま一回り大きく
   ============================================================ */
body.simplenote.service h2.unit-title-08,
body.simplenote.service h2.unit-title-08 span{
  font-size:clamp(19px, 2.1vw, 26px) !important;
}
body.simplenote.service h2.unit-title-08::after{
  font-size:clamp(10.5px, 1vw, 12px) !important;
}

/* ---------- sncw1 ---------- */
/* ============================================================
   SPチップ幅 案1 — 3列均等グリッド
   全チップ同幅（3列）。コンパクトに6個が2段で収まる
   ============================================================ */
@media screen and (max-width:768px){
  body.simplenote.service ul.anchorLink{
    display:grid !important;
    grid-template-columns:repeat(3, 1fr);
    gap:8px;
    padding:0 16px;
  }
  body.simplenote.service ul.anchorLink li{ width:auto !important; margin:0 !important; }
  body.simplenote.service a[href*="#ancher"]{
    display:block;
    text-align:center;
    white-space:nowrap;
    font-size:1.15rem !important;
    padding:9px 4px 7px !important;
  }
}

/* ---------- snsq3 ---------- */
body.simplenote.service .pamphletBlc .ttl p{
  display:flex !important;
  align-items:center;
  justify-content:center;
  text-align:center;
  width:70px !important;
  height:70px !important;
  box-sizing:border-box;
  font-family:"Noto Sans JP",sans-serif !important;
  font-weight:600 !important;
  font-size:1.3rem !important;
  letter-spacing:.14em !important;
  line-height:1.55 !important;
  margin:0 0 18px !important;
  padding:0 !important;
}
body.simplenote.service .pamphletBlc .ttl p br{ display:inline !important; }

/* ============================================================
   資料請求スクエア 案3 — 二重金枠（額装）
   外枠＋内側にもう1本の細い金線。最も格式のある正方形
   ============================================================ */
body.simplenote.service .pamphletBlc .ttl p{
  background:#fff !important;
  color:#1c2a3c !important;
  border:1px solid rgba(184,148,90,.85) !important;
  outline:1px solid rgba(184,148,90,.45);
  outline-offset:-5px;
}

/* パネルとリストの重なり防止：横並びレイアウトに固定 */
body.simplenote.service .pamphletBlc .ttl{
  display:flex !important;
  align-items:center;
  gap:24px;
  position:static !important;
}
body.simplenote.service .pamphletBlc .ttl p{
  position:static !important;
  flex:0 0 auto;
}
body.simplenote.service .pamphletBlc .ttl ul{
  margin:0 !important;
  padding:0 !important;
}

/* ---------- snst3 ---------- */
/* ============================================================
   セクション見出し 案3 — ゴシック500・20px 字間広め
   細めのウェイトで少し大きめ。静かで余白の効いた見出し
   ============================================================ */
body.simplenote.service .serviceList_ttl span{
  font-family:"Noto Sans JP","Open Sans",sans-serif !important;
  font-weight:500 !important;
  font-size:clamp(16px, 1.6vw, 20px) !important;
  letter-spacing:.3em !important;
}

/* ---------- snal1 ---------- */
/* ============================================================
   整列 案1 — 完全上下中央揃え
   スクエアの下マージン（ズレの原因）を除去し、リストと
   互いの中心を一致させる
   ============================================================ */
body.simplenote.service .pamphletBlc .ttl{ align-items:center !important; }
body.simplenote.service .pamphletBlc .ttl p{ margin:0 !important; }
body.simplenote.service .pamphletBlc .ttl ul{ margin:0 !important; }

/* PC: 資料請求スクエアを拡大し、リスト3行の実高（82px）と上下を一致。
   ※テーマのulはheight:100%で470pxに膨張するためautoに戻す。リストは1行固定 */
@media screen and (min-width:769px){
  body.simplenote.service .pamphletBlc .ttl{ align-items:flex-start !important; }
  body.simplenote.service .pamphletBlc .ttl p{
    width:82px !important;
    height:82px !important;
    font-size:1.5rem !important;
  }
  body.simplenote.service .pamphletBlc .ttl ul{
    height:auto !important;
    flex:0 0 auto;
    width:auto !important;
  }
  body.simplenote.service .pamphletBlc .ttl ul li{ white-space:nowrap !important; }
}

/* ---------- inline ---------- */
html{background:#fff; color-scheme:light;} .grecaptcha-badge,[class*="grecaptcha"]{display:none !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;
}


/* ---- 見出しの太さを統一（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;
}

/* ---- 修正: 紺グラデーションをキャンバス(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; }


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