/*
 * みなしるべ｜調査・編集方針
 * editorial-policy-v2.1a-top-refine.css
 * 2026-09-16
 *
 * 目的:
 * - トップページ v2.3 系のデザイン言語へ寄せる
 * - 今回はページ冒頭〜「どんな情報を使うのか」までを対象
 * - 既存 editorial-policy-v2.0.css の後に読み込む差分CSS
 *
 * HTML側で別途行う変更:
 * 1) 「みなしるべ実査」→「みなしるべ自身で確かめる」
 * 2) 「みなしるべの分析」→「みなしるべ編集部の分析」
 *
 * 情報源の表示順はCSSで P → T → S → A に整える。
 */


/* =========================================================
   01. HERO
   ========================================================= */

body.page-id-117 .ms-policy-hero {
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
  column-gap: 52px !important;
  align-items: center !important;

  margin-bottom: 24px !important;
  padding: 42px 0 38px !important;

  border-top: 3px solid var(--ms-navy) !important;
  border-bottom: 1px solid var(--ms-border) !important;
}

/* 英語の EDITORIAL POLICY は削除せず非表示にする */
body.page-id-117 .ms-policy-eyebrow {
  display: none !important;
}

body.page-id-117 .ms-policy-hero h1 {
  margin: 0 !important;
  padding: 0 !important;

  color: var(--ms-navy) !important;
  background: transparent !important;
  border: 0 !important;

  font-size: clamp(34px, 3.25vw, 43px) !important;
  line-height: 1.28 !important;
  letter-spacing: 0.015em !important;
}

body.page-id-117 .ms-policy-hero-copy {
  padding-bottom: 0 !important;
}

body.page-id-117 .ms-policy-lead {
  max-width: 680px !important;
  margin: 0 0 9px !important;

  color: #46535c !important;
  font-size: 15.5px !important;
  line-height: 1.78 !important;
}

body.page-id-117 .ms-policy-lead:last-child {
  margin-bottom: 0 !important;
}


/* HERO直下のビジュアルは現時点では維持。
   後工程で「灯台を直接描かない」画像へ差し替え候補。 */
body.page-id-117 .ms-policy-visual-hero {
  margin-bottom: 42px !important;
}


/* =========================================================
   02. SECTION HEAD
   トップページ／記事ページに近い
   「縦線 + 下線」の見出しへ統一
   ========================================================= */

body.page-id-117 .ms-policy-section {
  padding: 42px 0 48px !important;
}

body.page-id-117 .ms-policy-section-head {
  display: block !important;
  margin-bottom: 24px !important;
}

/* 01 / HOW WE RESEARCH 等は非表示 */
body.page-id-117 .ms-policy-section-index {
  display: none !important;
}

body.page-id-117 .ms-policy-section-title {
  max-width: none !important;
}

body.page-id-117 .ms-policy-section-title h2 {
  position: relative !important;

  margin: 0 0 12px !important;
  padding: 0 0 10px 15px !important;

  color: var(--ms-navy) !important;
  background: transparent !important;

  border: 0 !important;
  border-bottom: 1px solid var(--ms-border) !important;

  font-size: clamp(25px, 2.6vw, 31px) !important;
  line-height: 1.38 !important;
  letter-spacing: 0.01em !important;
}

body.page-id-117 .ms-policy-section-title h2::before {
  content: "" !important;
  display: block !important;

  position: absolute !important;
  left: 0 !important;
  top: 0.16em !important;
  bottom: calc(10px + 0.16em) !important;

  width: 4px !important;
  background: var(--ms-navy) !important;
}

body.page-id-117 .ms-policy-section-title p {
  max-width: 820px !important;
  margin: 0 !important;

  color: #46535c !important;
  font-size: 15px !important;
  line-height: 1.72 !important;
}


/* =========================================================
   03. 「調べて、比べて、確かめて、判断する」
   ========================================================= */

body.page-id-117 .ms-policy-method-grid {
  border-top: 1px solid var(--ms-border) !important;
  border-left: 1px solid var(--ms-border) !important;
}

body.page-id-117 .ms-policy-method-card {
  min-height: 0 !important;
  padding: 18px 18px 20px !important;

  border-right: 1px solid var(--ms-border) !important;
  border-bottom: 1px solid var(--ms-border) !important;
}

/* 上端の短いブランドカラー線は廃止 */
body.page-id-117 .ms-policy-method-card::before {
  content: none !important;
  display: none !important;
}

/* 01〜04の数字はトップページと同じく非表示 */
body.page-id-117 .ms-policy-method-no {
  display: none !important;
}

body.page-id-117 .ms-policy-method-card h3 {
  margin: 0 0 10px !important;
  padding: 6px 9px 6px 13px !important;

  color: var(--ms-navy) !important;
  border: 0 !important;

  font-size: 17px !important;
  line-height: 1.28 !important;
  font-weight: 700 !important;
}

body.page-id-117 .ms-policy-method-card h3::before {
  content: "" !important;
  display: block !important;

  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;

  width: 3px !important;
  background: currentColor !important;
}

/* h3 の縦線を背景の高さに合わせる */
body.page-id-117 .ms-policy-method-card h3 {
  position: relative !important;
}

/* ブランドカラーの淡い背景 */
body.page-id-117 .ms-policy-method-card.is-research h3 {
  background: #f0f2f3 !important;
  color: var(--ms-navy) !important;
}

body.page-id-117 .ms-policy-method-card.is-compare h3 {
  background: #eef2f4 !important;
  color: var(--ms-bluegray) !important;
}

body.page-id-117 .ms-policy-method-card.is-verify h3 {
  background: #eef3ef !important;
  color: var(--ms-sage) !important;
}

body.page-id-117 .ms-policy-method-card.is-decide h3 {
  background: #fff5e6 !important;
  color: var(--ms-gold) !important;
}

/* 見出し文字自体は濃紺で可読性を確保 */
body.page-id-117 .ms-policy-method-card h3 {
  color: var(--ms-navy) !important;
}

/* 縦線だけカード別カラー */
body.page-id-117 .ms-policy-method-card.is-research h3::before {
  background: var(--ms-navy) !important;
}
body.page-id-117 .ms-policy-method-card.is-compare h3::before {
  background: var(--ms-bluegray) !important;
}
body.page-id-117 .ms-policy-method-card.is-verify h3::before {
  background: var(--ms-sage) !important;
}
body.page-id-117 .ms-policy-method-card.is-decide h3::before {
  background: var(--ms-gold) !important;
}

body.page-id-117 .ms-policy-method-card p:last-child {
  margin: 0 !important;

  color: var(--ms-text) !important;
  font-size: 14.5px !important;
  line-height: 1.66 !important;
}


/* =========================================================
   04. 「どんな情報を使うのか」
   P → T → S → A
   ========================================================= */

body.page-id-117 .ms-policy-visual-sources {
  margin-bottom: 24px !important;
}

body.page-id-117 .ms-policy-source-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

  border-top: 1px solid var(--ms-border) !important;
  border-left: 1px solid var(--ms-border) !important;
}

/* 表示順を現在の正式順へ */
body.page-id-117 .ms-policy-source-card.is-primary {
  order: 1 !important;
}
body.page-id-117 .ms-policy-source-card.is-thirdparty {
  order: 2 !important;
}
body.page-id-117 .ms-policy-source-card.is-field {
  order: 3 !important;
}
body.page-id-117 .ms-policy-source-card.is-analysis {
  order: 4 !important;
}

body.page-id-117 .ms-policy-source-card {
  min-height: 0 !important;
  padding: 22px 24px 22px 26px !important;

  border-right: 1px solid var(--ms-border) !important;
  border-bottom: 1px solid var(--ms-border) !important;
}

/* 左端のブランドカラー線は維持 */
body.page-id-117 .ms-policy-source-card::before {
  width: 3px !important;
}

/* P / PRIMARY 等の英語コードは非表示 */
body.page-id-117 .ms-policy-source-code {
  display: none !important;
}

body.page-id-117 .ms-policy-source-card h3 {
  margin: 0 0 8px !important;
  padding: 0 !important;

  color: var(--ms-navy) !important;
  background: transparent !important;
  border: 0 !important;

  font-size: 17px !important;
  line-height: 1.42 !important;
}

body.page-id-117 .ms-policy-source-card h3::before,
body.page-id-117 .ms-policy-source-card h3::after {
  content: none !important;
  display: none !important;
}

body.page-id-117 .ms-policy-source-card p {
  margin: 0 0 8px !important;

  color: var(--ms-text) !important;
  font-size: 14.5px !important;
  line-height: 1.68 !important;
}

body.page-id-117 .ms-policy-source-card ul {
  margin: 8px 0 0 !important;
  padding-left: 1.25em !important;
}

body.page-id-117 .ms-policy-source-card li {
  margin-bottom: 4px !important;

  font-size: 14px !important;
  line-height: 1.60 !important;
}


/* =========================================================
   05. TABLET
   ========================================================= */

@media screen and (min-width: 768px) and (max-width: 1023px) {

  body.page-id-117 .ms-policy-hero {
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr) !important;
    column-gap: 34px !important;
    padding: 36px 0 34px !important;
  }

  body.page-id-117 .ms-policy-hero h1 {
    font-size: 32px !important;
  }

  body.page-id-117 .ms-policy-lead {
    font-size: 14.5px !important;
    line-height: 1.74 !important;
  }

  body.page-id-117 .ms-policy-method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}


/* =========================================================
   06. MOBILE
   ========================================================= */

@media screen and (max-width: 767px) {

  body.page-id-117 .ms-policy-hero {
    display: block !important;

    padding: 28px 0 26px !important;
    margin-bottom: 20px !important;
  }

  body.page-id-117 .ms-policy-hero h1 {
    margin-bottom: 18px !important;
    font-size: 30px !important;
    line-height: 1.34 !important;
  }

  body.page-id-117 .ms-policy-lead {
    font-size: 14px !important;
    line-height: 1.70 !important;
  }

  body.page-id-117 .ms-policy-visual-hero {
    margin-bottom: 30px !important;
  }

  body.page-id-117 .ms-policy-section {
    padding: 34px 0 38px !important;
  }

  body.page-id-117 .ms-policy-section-head {
    margin-bottom: 20px !important;
  }

  body.page-id-117 .ms-policy-section-title h2 {
    padding-left: 12px !important;
    font-size: 24px !important;
  }

  body.page-id-117 .ms-policy-section-title p {
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  body.page-id-117 .ms-policy-method-grid,
  body.page-id-117 .ms-policy-source-grid {
    grid-template-columns: 1fr !important;
  }

  body.page-id-117 .ms-policy-method-card,
  body.page-id-117 .ms-policy-source-card {
    padding: 18px 16px 19px !important;
  }

  body.page-id-117 .ms-policy-source-card h3,
  body.page-id-117 .ms-policy-method-card h3 {
    font-size: 16.5px !important;
  }
}
/* =========================================================
   07. v2.1b — 全体最終調整
   PC / Tablet / Mobile の実表示確認を反映
   ========================================================= */

/* HERO上端のルールを弱め、トップページとのトーン差を縮める */
body.page-id-117 .ms-policy-hero {
  padding: 38px 0 34px !important;
  margin-bottom: 20px !important;
  border-top-width: 2px !important;
}

/* 写真化後はイラスト用の枠・背景を外す */
body.page-id-117 .ms-policy-visual {
  border: 0 !important;
  background: transparent !important;
}

/*
 * HERO画像直下は、画像側のmarginを持たせず
 * 次セクション側のpaddingだけで余白を作る。
 * 旧設定では「画像margin + section padding」で間が開きすぎていた。
 */
body.page-id-117 .ms-policy-visual-hero {
  margin-bottom: 0 !important;
}

/* セクション間隔を少し圧縮し、長ページのリズムを整える */
body.page-id-117 .ms-policy-section {
  padding: 40px 0 44px !important;
}

/* 情報源画像とカードは一つのまとまりに見せる */
body.page-id-117 .ms-policy-visual-sources {
  margin-bottom: 18px !important;
}

/* 12項目：PCでは過度に大きくせず、一覧性を高める */
body.page-id-117 .ms-policy-principle {
  min-height: 104px !important;
  padding: 20px 20px 18px 62px !important;
}

body.page-id-117 .ms-policy-principle-no {
  top: 20px !important;
  left: 20px !important;
  font-size: 16px !important;
}

body.page-id-117 .ms-policy-principle p {
  font-size: 14px !important;
  line-height: 1.62 !important;
}

/*
 * 「広告・AI・更新について」の画像だけ旧仕様で880pxに狭められていたため、
 * 他のセクション画像・カード幅と揃える。
 */
body.page-id-117 .ms-policy-visual-operations {
  width: 100% !important;
  aspect-ratio: 16 / 7 !important;
  margin: 0 0 20px !important;
}

body.page-id-117 .ms-policy-visual-operations img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* 運用4カードも少しだけ密度を整える */
body.page-id-117 .ms-policy-operation-card {
  min-height: 0 !important;
  padding: 25px 28px 24px !important;
}

body.page-id-117 .ms-policy-operation-card h3 {
  margin-bottom: 10px !important;
  font-size: 17.5px !important;
  line-height: 1.42 !important;
}

body.page-id-117 .ms-policy-operation-card p {
  margin-bottom: 8px !important;
  font-size: 14.25px !important;
  line-height: 1.70 !important;
}

/*
 * ページ末尾：
 * 英語ラベルを外し、余白だけが大きく見えていたクロージングを
 * 静かなブランドメッセージのパネルとして整理する。
 */
body.page-id-117 .ms-policy-closing {
  margin: 0 0 46px !important;
  padding: 42px 40px 40px !important;

  background: #F7F5EF !important;
  text-align: center !important;
}

body.page-id-117 .ms-policy-closing-kicker {
  display: none !important;
}

body.page-id-117 .ms-policy-closing-copy {
  max-width: 760px !important;
  margin: 0 auto 12px !important;

  color: var(--ms-navy) !important;
  font-size: 20px !important;
  line-height: 1.55 !important;
  font-weight: 700 !important;
}

body.page-id-117 .ms-policy-closing-sub {
  max-width: 720px !important;
  margin: 0 auto !important;

  color: #46535c !important;
  font-size: 14.5px !important;
  line-height: 1.76 !important;
}

/* ページ末尾に孤立していた「ホーム」パンくずを非表示 */
body.page-id-117 #breadcrumb,
body.page-id-117 .breadcrumb.wrap {
  display: none !important;
}


/* =========================================================
   08. Tablet refinement
   ========================================================= */

@media screen and (min-width: 681px) and (max-width: 1023px) {

  body.page-id-117 .ms-policy-hero {
    padding: 32px 0 30px !important;
    column-gap: 30px !important;
    border-top-width: 2px !important;
  }

  body.page-id-117 .ms-policy-hero h1 {
    font-size: 31px !important;
  }

  body.page-id-117 .ms-policy-section {
    padding: 36px 0 40px !important;
  }

  body.page-id-117 .ms-policy-section-title h2 {
    font-size: 26px !important;
  }

  body.page-id-117 .ms-policy-principle {
    min-height: 96px !important;
    padding: 18px 18px 17px 58px !important;
  }

  body.page-id-117 .ms-policy-principle-no {
    top: 18px !important;
    left: 18px !important;
    font-size: 15.5px !important;
  }

  body.page-id-117 .ms-policy-operation-card {
    padding: 22px 24px 22px !important;
  }

  body.page-id-117 .ms-policy-closing {
    margin-bottom: 36px !important;
    padding: 38px 30px 36px !important;
  }
}


/* =========================================================
   09. Mobile refinement
   ========================================================= */

@media screen and (max-width: 680px) {

  body.page-id-117 .ms-policy-hero {
    padding: 26px 0 24px !important;
    margin-bottom: 18px !important;
    border-top-width: 2px !important;
  }

  body.page-id-117 .ms-policy-hero h1 {
    margin-bottom: 16px !important;
    font-size: 27px !important;
    line-height: 1.34 !important;
  }

  body.page-id-117 .ms-policy-lead {
    font-size: 14px !important;
    line-height: 1.72 !important;
  }

  /*
   * 21:9写真を4:3に強く切り抜くと左右情報が失われるため、
   * モバイルHEROは16:10へ変更。
   */
  body.page-id-117 .ms-policy-visual-hero {
    aspect-ratio: 16 / 10 !important;
    margin-bottom: 0 !important;
  }

  body.page-id-117 .ms-policy-visual-hero img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  body.page-id-117 .ms-policy-section {
    padding: 30px 0 34px !important;
  }

  body.page-id-117 .ms-policy-section-head {
    margin-bottom: 18px !important;
  }

  /*
   * 24pxでは「編集で大切にしている12のこと」が
   * 「12のこ / と」と不自然に折り返したため縮小。
   */
  body.page-id-117 .ms-policy-section-title h2 {
    padding-left: 11px !important;
    padding-bottom: 9px !important;

    font-size: 21px !important;
    line-height: 1.42 !important;
    letter-spacing: 0 !important;

    word-break: auto-phrase !important;
  }

  body.page-id-117 .ms-policy-section-title h2::before {
    width: 3px !important;
    bottom: calc(9px + 0.14em) !important;
  }

  body.page-id-117 .ms-policy-section-title p {
    font-size: 14px !important;
    line-height: 1.70 !important;
  }

  /* 横長写真は元比率に近いまま見せる */
  body.page-id-117 .ms-policy-visual-sources,
  body.page-id-117 .ms-policy-visual-operations {
    width: 100% !important;
    aspect-ratio: 16 / 7 !important;
    margin-bottom: 16px !important;
  }

  body.page-id-117 .ms-policy-visual-sources img,
  body.page-id-117 .ms-policy-visual-operations img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* 4工程 */
  body.page-id-117 .ms-policy-method-card {
    padding: 16px 14px 17px !important;
  }

  body.page-id-117 .ms-policy-method-card h3 {
    margin-bottom: 9px !important;
    padding: 6px 8px 6px 12px !important;
    font-size: 16px !important;
  }

  body.page-id-117 .ms-policy-method-card p:last-child {
    font-size: 14px !important;
    line-height: 1.64 !important;
  }

  /* 4情報源 */
  body.page-id-117 .ms-policy-source-card {
    padding: 18px 16px 18px 20px !important;
  }

  body.page-id-117 .ms-policy-source-card h3 {
    margin-bottom: 7px !important;
    font-size: 16px !important;
  }

  body.page-id-117 .ms-policy-source-card p {
    font-size: 14px !important;
    line-height: 1.66 !important;
  }

  body.page-id-117 .ms-policy-source-card li {
    font-size: 13.5px !important;
    line-height: 1.58 !important;
  }

  /*
   * 12項目は一列のまま可読性を優先。
   * ただし縦方向の長さを圧縮する。
   */
  body.page-id-117 .ms-policy-principle {
    min-height: 0 !important;
    padding: 16px 14px 16px 50px !important;
  }

  body.page-id-117 .ms-policy-principle-no {
    top: 16px !important;
    left: 15px !important;
    font-size: 15px !important;
  }

  body.page-id-117 .ms-policy-principle p {
    font-size: 13.5px !important;
    line-height: 1.58 !important;
  }

  /* 運用4カード */
  body.page-id-117 .ms-policy-operation-card {
    padding: 20px 18px 19px !important;
  }

  body.page-id-117 .ms-policy-operation-card h3 {
    margin-bottom: 9px !important;
    font-size: 16.5px !important;
  }

  body.page-id-117 .ms-policy-operation-card p {
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  /* クロージングをコンパクトに */
  body.page-id-117 .ms-policy-closing {
    margin: 0 0 28px !important;
    padding: 32px 20px 30px !important;
  }

  body.page-id-117 .ms-policy-closing-copy {
    margin-bottom: 10px !important;
    font-size: 17.5px !important;
    line-height: 1.56 !important;
  }

  body.page-id-117 .ms-policy-closing-sub {
    font-size: 14px !important;
    line-height: 1.72 !important;
  }
}
/* =========================================================
   10. v2.1c — PC最終クリーンアップ
   2026-09-18
   - HERO上端線を撤去
   - セクション間の区切り線を撤去
   - 情報源カードの箇条書きを一字分内側へ
   - クロージングを左揃えへ変更
   ========================================================= */

/* HERO：上端の太線と下端の区切り線を撤去 */
body.page-id-117 .ms-policy-hero {
  border-top: 0 !important;
  border-bottom: 0 !important;

  /* 線を外したぶん、上側の空白だけが残らないよう少し圧縮 */
  padding-top: 30px !important;
  padding-bottom: 30px !important;
  margin-bottom: 18px !important;
}

/*
 * 各セクション間の薄いグレー線を撤去。
 * H2自身の「縦線＋下線」は残し、見出しの階層感は維持する。
 */
body.page-id-117 .ms-policy-section,
body.page-id-117 .ms-policy-section + .ms-policy-section {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

/*
 * 「どんな情報を使うのか」
 * 箇条書き全体を本文の出だしから約1字分内側へ。
 */
body.page-id-117 .ms-policy-source-card ul {
  margin: 8px 0 0 1em !important;
  padding-left: 1.15em !important;
}

/*
 * ページ末尾のブランドメッセージ。
 * 中央揃えをやめ、編集方針ページらしい左揃えの読み物として整理。
 */
body.page-id-117 .ms-policy-closing {
  margin: 0 0 30px !important;
  padding: 34px 30px 32px !important;

  text-align: left !important;
}

body.page-id-117 .ms-policy-closing-copy {
  max-width: 800px !important;
  margin: 0 0 12px !important;
}

body.page-id-117 .ms-policy-closing-sub {
  max-width: 800px !important;
  margin: 0 !important;
}


/* Tablet */
@media screen and (min-width: 681px) and (max-width: 1023px) {

  body.page-id-117 .ms-policy-hero {
    border-top: 0 !important;
    border-bottom: 0 !important;
    padding-top: 26px !important;
    padding-bottom: 28px !important;
  }

  body.page-id-117 .ms-policy-source-card ul {
    margin-left: 0.9em !important;
  }

  body.page-id-117 .ms-policy-closing {
    margin-bottom: 28px !important;
    padding: 32px 28px 30px !important;
    text-align: left !important;
  }
}


/* Mobile */
@media screen and (max-width: 680px) {

  body.page-id-117 .ms-policy-hero {
    border-top: 0 !important;
    border-bottom: 0 !important;
    padding-top: 22px !important;
    padding-bottom: 22px !important;
  }

  body.page-id-117 .ms-policy-source-card ul {
    margin-left: 0.65em !important;
    padding-left: 1.15em !important;
  }

  body.page-id-117 .ms-policy-closing {
    margin-bottom: 24px !important;
    padding: 28px 20px 27px !important;
    text-align: left !important;
  }

  body.page-id-117 .ms-policy-closing-copy,
  body.page-id-117 .ms-policy-closing-sub {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}