/* =========================================================
   お知らせ詳細ページ (slug: news-detail)
   デザインカンプ XoXUw4vzh2C2X6RIfJJVGM node 560:5727 (9_news ニュース詳細)
   写真なしのテキスト記事。top.css の :root 変数前提（pages.css の後に読み込む）。
   ========================================================= */

.news-detail {
    background: #fff;
    padding: 92px 0 0;
}
.news-detail * { box-sizing: border-box; }

/* ---------- 共通: 1024px 左寄せコンテナ ---------- */
.nwd-article,
.nwd-related,
.nwd-back,
.nwd-crumb {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 24px;
}
.nwd-crumb {
    margin-bottom: 52px;
    color: #3b3b3b;
    font-weight: 700;
    font-size: 13px;
    line-height: 1.6;
    letter-spacing: 1.2px;
}

/* ---------- 記事ヘッダー ---------- */
.nwd-article__head {
    max-width: 600px;
    margin: 0 auto 80px;
}
.nwd-article__title {
    margin: 0;
    color: #3b3b3b;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.42;
    letter-spacing: .16em;
}
.nwd-article__date {
    display: block;
    margin: 18px 0 0;
    color: #ff9a92;
    font-family: var(--ff-josefin);
    font-weight: 500;
    font-size: 12px;
    line-height: 2.27;
    letter-spacing: 1.8px;
}

/* ---------- 実投稿(the_content)の本文：中央600px列＋要素整形 ---------- */
.nwd-article__body { max-width: 600px; margin: 0 auto; color: var(--c-brown2); }
.nwd-article__body p { margin: 0 0 1.2em; font-weight: 500; font-size: 16px; line-height: 1.85; letter-spacing: 1px; }
.nwd-article__body img { max-width: 100%; height: auto; border-radius: 4px; margin: 12px auto; display: block; }
.nwd-article__body h2 { margin: 32px 0 16px; padding-left: 14px; color: #3b3b3b; font-weight: 700; font-size: 19px; line-height: 1.5; letter-spacing: 1.4px; border-left: 5px solid var(--c-red); }
.nwd-article__body h3 { margin: 26px 0 12px; padding-left: 12px; color: #3b3b3b; font-weight: 700; font-size: 16px; letter-spacing: 1px; border-left: 4px solid var(--c-pink); }
.nwd-article__body ul, .nwd-article__body ol { margin: 0 0 16px; padding-left: 1.6em; }
.nwd-article__body li { font-weight: 500; font-size: 16px; line-height: 1.85; letter-spacing: 1px; margin: 0 0 4px; }
.nwd-article__body a { color: var(--c-pink); text-decoration: underline; }
.nwd-article__body a:hover { opacity: .8; }

/* ---------- 本文（見出し付きブロック・静的モック用） ---------- */
.nwd-section { max-width: 600px; }
.nwd-section + .nwd-section { margin-top: 64px; }

.nwd-section__heading {
    position: relative;
    margin: 0 0 29px;
    padding-left: 43px;
    color: #3b3b3b;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.7;
    letter-spacing: .16em;
}
.nwd-section__heading::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 6.8px;
    height: 50px;
    background: #e44a3f;
}

.nwd-section__para {
    margin: 0;
    color: #3b3b3b;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.7;
    letter-spacing: .12em;
}
.nwd-section__para + .nwd-section__para { margin-top: 1.7em; }

/* ---------- 関連お知らせ（一覧） ---------- */
.nwd-related { margin-top: 160px; }
.nwd-related__head { margin: 0 0 56px; }
.nwd-related__ja {
    margin: 0;
    color: var(--c-brown, #493215);
    font-weight: 700;
    font-size: 36px;
    line-height: 1.7;
    letter-spacing: .1em;
}
.nwd-related__en {
    margin: 4px 0 0;
    font-family: var(--ff-josefin);
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    letter-spacing: 1.4px;
    color: #ff9a92;
}

.nwd-related__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.nwd-related__item { border-bottom: 1px solid #e7dad8; }
.nwd-related__link {
    display: flex;
    align-items: baseline;
    gap: 36px;
    padding: 18px 20px;
    text-decoration: none;
    transition: color .2s;
}
.nwd-related__date {
    flex: 0 0 auto;
    font-family: var(--ff-josefin);
    font-weight: 500;
    font-size: 14px;
    line-height: 2.21;
    letter-spacing: 1.4px;
    color: #ff9a92;
}
.nwd-related__title {
    color: #4b4b4b;
    font-weight: 600;
    font-size: 14px;
    line-height: 2.21;
    letter-spacing: .16em;
}
.nwd-related__link:hover .nwd-related__title { color: #ff9a92; }

/* ---------- 一覧へ戻る ---------- */
.nwd-back {
    margin-top: 56px;
    text-align: center;
}
.nwd-back__link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 40px;
    border: 1px solid #ff9a92;
    border-radius: 999px;
    background: #fff;
    color: #ff9a92;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .16em;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.nwd-back__arrow { font-weight: 700; }
.nwd-back__link:hover { background: #ff9a92; color: #fff; }

.news-detail + .cta-band { margin-top: 160px; }

/* お知らせ詳細の戻るボタン下は背景色を入れず、本文面と同じ白で統一する。 */
.news-detail,
.nwd-back,
.news-detail + .cta-band {
    background: #fff !important;
}

/* ---------- レスポンシブ ---------- */
@media (max-width: 820px) {
    .news-detail { padding: 88px 0 0; }
    .nwd-article,
    .nwd-related,
    .nwd-back,
    .nwd-crumb { padding: 0 18px; }
    .nwd-crumb { margin-bottom: 34px; font-size: 12px; }

    .nwd-article__head { margin-bottom: 48px; }
    .nwd-article__title { font-size: 20px; letter-spacing: .1em; }

    .nwd-section + .nwd-section { margin-top: 44px; }
    .nwd-section__heading { font-size: 17px; padding-left: 22px; margin-bottom: 20px; }
    .nwd-section__heading::before { width: 5px; height: 38px; }
    .nwd-section__para { font-size: 15px; }

    .nwd-related { margin-top: 80px; }
    .nwd-related__head { margin-bottom: 32px; }
    .nwd-related__ja { font-size: 26px; }
    .nwd-related__link { gap: 18px; padding: 16px 6px; }

    .nwd-back { margin-top: 40px; }
    .news-detail + .cta-band { margin-top: 80px; }
}

@media (max-width: 480px) {
    .nwd-related__link {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 14px 4px;
    }
    .nwd-related__date,
    .nwd-related__title { line-height: 1.6; }
    .nwd-related__title { font-size: 14px; }
}