/* =========================================================
   お知らせ一覧ページ (slug: news)
   デザインカンプ node 560:5779 (9_news) 準拠。top.css / pages.css の後に読み込む。
   ヒーローはフルブリード写真 + ピンクグラデ。リストは全行同スタイル（常時強調なし）。
   ========================================================= */

.nws-page { background: #fff; padding-bottom: 0; }

/* ---------- ヒーロー（フルブリード写真 + ピンクグラデ） ---------- */
.nws-hero {
    position: relative;
    width: 100vw;
    left: calc(50% - 50vw);
    height: 657px;
    overflow: hidden;
    background: #e9e3df;
}
.nws-hero__photo,
.nws-hero__photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.nws-hero__photo img { object-fit: cover; object-position: center 35%; }

.nws-hero__overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 49.3%;
    background: linear-gradient(to bottom, rgba(229, 177, 177, 0), #fc9291);
}

.nws-hero__inner {
    position: absolute;
    left: max(44px, calc((100% - 1280px) / 2 + 44px));
    bottom: 60px;
    color: #fff;
}
.nws-hero__crumb {
    margin: 0 0 8px;
    font-weight: 500;
    font-size: 10px;
    letter-spacing: 2px;
    line-height: 1.6;
}
.nws-hero__en {
    margin: 0;
    font-family: var(--ff-josefin);
    font-weight: 400;
    font-size: 50px;
    line-height: 1;
    letter-spacing: 1.5px;
}

/* ---------- お知らせリスト ---------- */
.nws-index { background: #fff; padding: 74px 0 150px; }
.nws-wrap { max-width: 1024px; margin: 0 auto; padding: 0 24px; }

.nws-index__head { margin-bottom: 34px; }
.nws-index__en {
    margin: 0;
    font-family: var(--ff-josefin);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1.4px;
    color: var(--c-pink);
}
.nws-index__ja {
    margin: 10px 0 0;
    color: var(--c-brown);
    font-weight: 700;
    font-size: 36px;
    letter-spacing: 3.6px;
    line-height: 1.4;
}

.nws-list { list-style: none; margin: 0; padding: 0; }
.nws-list__item { border-bottom: 1px solid #d9d9d9; }

.nws-list__link {
    display: flex;
    align-items: baseline;
    gap: 36px;
    padding: 14px 0 14px 20px;
    text-decoration: none;
    transition: color .2s ease;
}
.nws-list__date {
    flex: 0 0 auto;
    font-family: var(--ff-josefin);
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 1.4px;
    color: var(--c-pink);
    line-height: 31px;
}
.nws-list__title {
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 2.24px;
    line-height: 31px;
    color: #4b4b4b;
}

.nws-list__link:hover .nws-list__title,
.nws-list__link:focus-visible .nws-list__title { color: var(--c-pink); }

/* ---------- ページャー ---------- */
.nws-pager {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 56px;
}
.nws-pager__num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid #e3e3e3;
    border-radius: 3px;
    font-family: var(--ff-josefin);
    font-weight: 500;
    font-size: 14px;
    color: #8a8a8a;
    text-decoration: none;
    background: #fff;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.nws-pager__num:hover {
    border-color: var(--c-pink);
    color: var(--c-pink);
}
.nws-pager__num.is-current {
    background: #f7766d;
    border-color: #f7766d;
    color: #fff;
}

@media (max-width: 820px) {
    .nws-hero { height: 360px; }
    .nws-hero__inner { left: 20px; bottom: 34px; }
    .nws-hero__en { font-size: 34px; }
    .nws-index { padding: 44px 0 60px; }
    .nws-wrap { padding: 0 18px; }
    .nws-index__head { margin-bottom: 24px; }
    .nws-index__ja { font-size: 26px; letter-spacing: 2.5px; }
    .nws-list__link { gap: 14px; padding: 14px 0 14px 4px; }
    .nws-list__title { letter-spacing: 1.2px; line-height: 1.7; }
    .nws-pager { gap: 7px; margin-top: 40px; flex-wrap: wrap; }
}

@media (max-width: 480px) {
    .nws-list__link {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding-left: 0;
    }
    .nws-list__date { line-height: 1.6; }
}

/* SPレビュー反映: 初期表示は写真全面 + 左下パンくず/ページ名。 */
@media (max-width: 820px) {
    .nws-hero {
        height: min(calc(100vh - 60px), 760px) !important;
        height: min(calc(100svh - 60px), 760px) !important;
    }

    .nws-hero__overlay {
        height: 58% !important;
        background: linear-gradient(to bottom, rgba(229, 177, 177, 0), rgba(252,146,145,.72)) !important;
    }

    .nws-hero__inner {
        left: 24px !important;
        right: 24px !important;
        bottom: 46px !important;
    }
}
