html,body{margin:0}
body{background:#fff}
/* =========================================================
   お知らせ一覧「白い紙のエディトリアル」（トップページの紙面に合わせる）
   ・すべて .nw の内側に限定（共通ヘッダー・フッターに影響させない）
   ・site.css は読まない
   ・CSSで初期非表示にする指定は置かない（JS無効・reduced-motion でも全要素が見える）
   ・更新は手作業（WordPressは使わない）。お知らせ1件 = <article class="nw-item"> 1つ
   ========================================================= */
.nw{
  --blue:#479CD9;
  --deep:#1E5F8C;
  --ink:#10161b;
  --muted:#4b5a63;
  --line:#cddce8;
  --paper:#f8fbfd;
  --rule:rgba(16,22,27,.9);
  --hair:rgba(16,22,27,.16);
  --en:'Barlow Condensed','Noto Sans JP',sans-serif;
  --ja:'Noto Sans JP',sans-serif;
  display:block;margin:0;
  font-family:var(--ja);font-size:16px;font-weight:400;line-height:1.85;letter-spacing:normal;
  color:var(--ink);background:#fff;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
.nw:focus{outline:none}
.nw,.nw *,.nw *::before,.nw *::after{box-sizing:border-box}
.nw :where(h1,h2,h3,p,ul,ol,li){margin:0}
.nw h1,.nw h2,.nw h3{color:inherit;font-family:inherit;font-weight:900;letter-spacing:normal}
.nw ul,.nw ol{padding:0;list-style:none}
.nw a{color:inherit}
.nw :focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.nw [id]{scroll-margin-top:calc(var(--na-hh, 84px) + 24px)}
.nw .nw-wrap{width:min(1200px, 100% - 48px);margin-inline:auto}
.nw .nw-kp{word-break:keep-all;overflow-wrap:anywhere}
@supports (word-break:auto-phrase){ .nw .nw-ap{word-break:auto-phrase} }
.nw .nw-ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.nw .nw-ln-in{display:block}
.nw .nw-arr{display:inline-block;font-family:var(--en);font-weight:800;line-height:1;transition:transform .2s}

/* ---------- ボタン（トップの .tb-btn と同じ形） ---------- */
.nw .nw-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:58px;padding:14px 28px;border-radius:999px;
  font-weight:700;font-size:16px;line-height:1.4;text-decoration:none;text-align:center;
  transition:transform .2s, box-shadow .2s, background-color .2s, color .2s;
}
.nw .nw-btn .nw-arr{font-size:1.15em}
.nw .nw-btn:hover .nw-arr{transform:translateX(4px)}
.nw .nw-btn--deep{background:var(--deep);color:#fff;box-shadow:0 12px 26px -14px rgba(30,95,140,.8)}
.nw .nw-btn--deep:hover{background:#174e75;transform:translateY(-2px)}
.nw .nw-btn--outline{border:1.5px solid var(--ink);color:var(--ink);background:#fff;font-size:15px}
.nw .nw-btn--outline:hover{background:var(--paper)}

/* ---------- 英字ラベル ---------- */
.nw .nw-label{
  display:flex;align-items:center;gap:12px;
  font-family:var(--en);font-weight:700;font-size:14px;line-height:1.4;letter-spacing:.26em;color:var(--deep);
}
.nw .nw-label .ja{font-family:var(--ja);letter-spacing:.08em}
.nw .nw-label::after{content:"";flex:1 1 auto;height:1px;background:var(--hair)}

/* ---------- ラベル（3種類。文字と背景のコントラストはすべて4.5:1以上） ---------- */
.nw .nw-chip{
  display:inline-flex;align-items:center;justify-self:start;
  padding:3px 12px;border:1px solid transparent;border-radius:999px;
  font-family:var(--ja);font-size:12.5px;font-weight:700;line-height:1.5;letter-spacing:.06em;white-space:nowrap;
}
.nw .nw-chip--security{background:var(--deep);border-color:var(--deep);color:#fff}
.nw .nw-chip--service{background:#fff;border-color:var(--deep);color:var(--deep)}
.nw .nw-chip--update{background:var(--paper);border-color:var(--line);color:var(--ink)}

/* ---------- 日付 ---------- */
.nw .nw-date{font-family:var(--en);font-weight:700;letter-spacing:.08em;line-height:1.2;font-variant-numeric:tabular-nums}

/* ---------- 1. パンくず ＋ 2. ページ見出し ---------- */
.nw .nw-head{padding:20px 0 72px;background:#fff}
.nw .nw-crumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:13px;font-weight:500;line-height:1.6;color:var(--muted)}
.nw .nw-crumb li{display:flex;align-items:center;gap:10px}
.nw .nw-crumb li + li::before{content:"›";font-family:var(--en);font-size:16px;font-weight:700;line-height:1;color:var(--deep)}
.nw .nw-crumb a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--hair)}
.nw .nw-crumb a:hover{text-decoration-color:var(--ink)}
.nw .nw-masthead{
  margin-top:14px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;
  padding:12px 0 11px;border-bottom:1px solid var(--rule);
  font-family:var(--en);font-weight:700;font-size:13px;line-height:1.4;letter-spacing:.26em;color:var(--ink);
}
.nw .nw-masthead span:nth-child(2){text-align:center;color:var(--deep)}
.nw .nw-masthead span:last-child{text-align:right;color:var(--muted)}
.nw .nw-head-in{margin-top:56px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:64px;align-items:end}
.nw .nw-head h1{margin-top:18px;font-size:clamp(44px, 6.2vw, 96px);line-height:1.12;letter-spacing:.02em}
.nw .nw-lead{padding-bottom:.6em;font-size:16px;font-weight:700;line-height:2;color:var(--ink)}

/* ---------- 3. 目次（お知らせ一覧） ---------- */
.nw .nw-index{padding:72px 0 88px;background:var(--paper);border-top:1px solid var(--hair)}
.nw .nw-index-h{margin-bottom:20px}
.nw .nw-toc{border-top:2px solid var(--rule)}
.nw .nw-toc li{border-bottom:1px solid var(--hair)}
.nw .nw-toc a{
  display:grid;grid-template-columns:118px 132px minmax(0,1fr) 36px;align-items:center;column-gap:20px;
  padding:22px 0;text-decoration:none;transition:background-color .2s;
}
.nw .nw-toc a:hover{background:#fff}
.nw .nw-toc a:focus-visible{outline-offset:2px}
.nw .nw-toc .nw-date{font-size:20px;color:var(--ink)}
.nw .nw-toc-t{font-size:17px;font-weight:700;line-height:1.6;transition:color .2s}
.nw .nw-toc a:hover .nw-toc-t{color:var(--deep)}
.nw .nw-toc-go{
  display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1.5px solid var(--ink);
  font-family:var(--ja);font-weight:700;font-size:15px;line-height:1;
  transition:background-color .2s, color .2s, border-color .2s;
}
.nw .nw-toc-go span{display:block;transition:transform .2s}
.nw .nw-toc a:hover .nw-toc-go{background:var(--deep);border-color:var(--deep);color:#fff}
.nw .nw-toc a:hover .nw-toc-go span{transform:translateY(3px)}

/* ---------- 4. お知らせ本文 ---------- */
.nw .nw-news{padding:96px 0 112px;background:#fff}
.nw .nw-item{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:56px;padding:44px 0 52px;border-top:1px solid var(--hair)}
.nw .nw-item:first-of-type{border-top:2px solid var(--rule)}
.nw .nw-item:last-of-type{border-bottom:1px solid var(--hair)}
.nw .nw-item-meta{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding-top:4px}
.nw .nw-item-meta .nw-date{font-size:30px;font-weight:800;line-height:1;letter-spacing:.06em;color:var(--deep)}
.nw .nw-item-main{min-width:0;max-width:760px}
.nw .nw-item-title{font-size:clamp(22px, 1.2vw + 13px, 30px);line-height:1.5;letter-spacing:.02em}
.nw .nw-item:target .nw-item-title{color:var(--deep)}
.nw .nw-item-body{margin-top:24px}
.nw .nw-item-body p{font-size:16px;line-height:2;color:var(--ink)}
.nw .nw-item-body p + p{margin-top:1em}
.nw .nw-more{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:15px;line-height:1.6;text-decoration:none;color:var(--deep);border-bottom:1.5px solid currentColor;padding-bottom:4px}
.nw .nw-more:hover .nw-arr{transform:translateX(4px)}
.nw .nw-item-link{margin-top:24px}
.nw .nw-item-back{margin-top:32px}
.nw .nw-back{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;line-height:1.6;color:var(--muted);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--hair)}
.nw .nw-back:hover{color:var(--deep);text-decoration-color:currentColor}
.nw .nw-back .nw-arr{font-family:var(--ja);font-weight:700}
.nw .nw-back:hover .nw-arr{transform:translateY(-3px)}

/* ---------- 5. ご相談の帯 ---------- */
.nw .nw-cta{padding:80px 0 88px;background:var(--paper);border-top:1px solid var(--hair)}
.nw .nw-cta-in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:64px;align-items:end;padding-top:32px;border-top:2px solid var(--rule)}
.nw .nw-cta-h{margin-top:18px;font-size:clamp(26px, 2.2vw + 8px, 40px);line-height:1.45;letter-spacing:.02em}
.nw .nw-cta-actions{display:flex;flex-direction:column;gap:12px}
.nw .nw-cta-actions .nw-btn{width:100%}

/* ---------- Responsive ---------- */
@media (max-width: 1100px){
  .nw .nw-toc a{grid-template-columns:110px 124px minmax(0,1fr) 32px;column-gap:16px}
  .nw .nw-toc-go{width:32px;height:32px}
  .nw .nw-item{column-gap:40px}
}
@media (max-width: 899px){
  .nw .nw-wrap{width:calc(100% - 40px)}
  .nw .nw-head{padding:14px 0 52px}
  .nw .nw-masthead{grid-template-columns:1fr auto;font-size:11.5px;letter-spacing:.2em;padding:9px 0 8px}
  .nw .nw-masthead span:nth-child(2){display:none}
  .nw .nw-head-in{margin-top:32px;grid-template-columns:minmax(0,1fr);row-gap:18px}
  .nw .nw-head h1{margin-top:12px;font-size:clamp(40px, 12vw, 64px)}
  .nw .nw-lead{padding-bottom:0;font-size:15.5px;line-height:1.95}

  .nw .nw-index{padding:52px 0 60px}
  .nw .nw-index-h{margin-bottom:16px}
  /* スマホ：1行目に日付とラベル、2行目にタイトル */
  .nw .nw-toc a{
    grid-template-columns:auto minmax(0,1fr) 28px;
    grid-template-areas:"date chip go" "title title go";
    column-gap:12px;row-gap:8px;padding:16px 0;
  }
  .nw .nw-toc .nw-date{grid-area:date;font-size:17px}
  .nw .nw-toc .nw-chip{grid-area:chip}
  .nw .nw-toc-t{grid-area:title;font-size:15.5px;line-height:1.65}
  .nw .nw-toc-go{grid-area:go;width:28px;height:28px;font-size:13px}

  .nw .nw-news{padding:60px 0 76px}
  .nw .nw-item{grid-template-columns:minmax(0,1fr);row-gap:14px;padding:32px 0 40px}
  .nw .nw-item-meta{flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px 14px;padding-top:0}
  .nw .nw-item-meta .nw-date{font-size:24px}
  .nw .nw-item-title{font-size:clamp(20px, 5.4vw, 26px)}
  .nw .nw-item-body{margin-top:18px}
  .nw .nw-item-body p{font-size:15.5px}
  .nw .nw-item-back{margin-top:26px}

  .nw .nw-cta{padding:56px 0 64px}
  .nw .nw-cta-in{grid-template-columns:minmax(0,1fr);row-gap:28px;padding-top:24px}
  .nw .nw-cta-h{font-size:clamp(22px, 6.2vw, 32px)}
  .nw .nw-cta-actions{max-width:480px}
}
/* 日本語見出しの改行：文節で折り返し、最終行が1文字にならないよう整える */ :where(h1,h2,h3){text-wrap:balance;word-break:auto-phrase} :where(h1,h2,h3) .kp, :where(h1,h2,h3).kp{word-break:auto-phrase}