@charset "UTF-8";

/* ==========================================================================
   周年記念動画・企業イベント動画（single-case-event.php / URL: /case/event/）
   デザイン: 260917_周年記念 / 1440px アートボード（本文幅 960px）
   ※このファイル以外（style.css 等の共用CSS）は変更しないこと
   ========================================================================== */

/* --------------------------------------------------------------------------
   FV（l-containerHead：左にテキスト／右に動画）
   Figma 1440px 時点で テキスト650px + gap34px + 動画516px = 1200px
   -------------------------------------------------------------------------- */
.l-container .l-containerHead .p-mem__kvVideo {
    position: relative;
    z-index: 3;
    width: 100%;
    margin-top: 32px;
    aspect-ratio: 516 / 339;
    background: #000;
}

.l-container .l-containerHead .p-mem__kvVideo iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

@media (min-width: 1000px) {
    .l-container .l-containerHead__inner {
        display: flex;
        gap: 34px;
        align-items: center;
    }

    .l-container .l-containerHead .p-mem__kvBody {
        flex: 1 1 0;
        min-width: 0;
        align-self: center;
        margin-top: 38px; /* 動画の margin-top と揃えて、動画に対して上下中央 */
    }

    /* 既定は旧FV画像ぶんの幅を空けているため、動画カラム構成では全幅に戻す */
    .l-container .l-containerHead .p-mem__kvBody .l-containerHead__text {
        width: 100%;
        font-size: 16px;
        line-height: 24px;
    }

    .l-container .l-containerHead__inner {
        align-items: flex-start;
        padding-bottom: 68px;
    }

    .l-container .l-containerHead .p-mem__kvBody .c-heading01 {
        line-height: 60px;
    }

    .l-container .l-containerHead .p-mem__kvBody .c-heading01 ._small {
        margin-bottom: 1px;
    }

    .l-container .l-containerHead .p-mem__kvBody .l-containerHead__text {
        margin-top: 49px;
    }

    .l-container .l-containerHead .p-mem__kvBody .c-btnWrap {
        margin-top: 39px;
    }

    .l-container .l-containerHead .p-mem__kvVideo {
        flex: 0 1 516px;
        width: 516px;
        margin-top: 38px;
    }

    /* 右の赤い円（共通 ::after の画像を拡大）。円の中心を動画の右端から 84px 右・FV下端から 53px 上に置く */
    .l-container .l-containerHead::after {
        right: auto;
        bottom: -2px;
        left: calc(80% - 409px);
        width: 1315px;
        height: 668px;
        background-size: 1315px 668px;
        transform: none;
    }
}

@media (min-width: 1400px) {
    .l-container .l-containerHead::after {
        left: calc(50% + 11px);
    }
}

/* --------------------------------------------------------------------------
   セクション共通
   白セクション同士の間隔は 120px、グレー（担当者の悩み）の上下は 90px
   -------------------------------------------------------------------------- */
.page-memorial .c-sec {
    background: #fff;
}

.page-memorial .c-sec:not(.p-contact__sec) {
    padding-top: 40px;
    padding-bottom: 40px;
}

.page-memorial .c-sec.p-mem__kinds {
    padding-top: 50px;
}

.page-memorial .c-sec.p-mem__faq {
    padding-bottom: 80px;
}

@media (min-width: 1000px) {
    .page-memorial .c-sec:not(.p-contact__sec) {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .page-memorial .c-sec.p-mem__kinds {
        padding-top: 100px;
    }

    .page-memorial .c-sec.p-mem__pattern {
        padding-bottom: 120px;
    }

    .page-memorial .c-sec.p-mem__worries {
        padding-top: 90px;
        padding-bottom: 90px;
    }

    .page-memorial .c-sec.p-mem__answer {
        padding-top: 120px;
    }

    .page-memorial .c-sec.p-mem__faq {
        padding-bottom: 180px;
    }
}

@media (min-width: 1000px) {
    .l-container:not(.p-top) .page-memorial .c-sec .c-sec__inner {
        max-width: 960px;
    }
}

/* 見出し（c-heading02 _border = 38px + 7px 赤バー） */
.page-memorial .p-mem__heading {
    margin-top: 0;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__heading {
        line-height: 1.4;
    }
}

/* 見出し下のキャッチ（左に赤い短線） */
.page-memorial .p-mem__catch {
    position: relative;
    margin-top: 20px;
    padding-left: 22px;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.5;
    color: #222;
}

.page-memorial .p-mem__catch::before {
    position: absolute;
    top: 0.75em;
    left: 0;
    width: 14px;
    height: 2px;
    content: "";
    background: #c8000f;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__catch {
        margin-top: 32px;
        padding-left: 31px;
        font-size: 27px;
    }

    .page-memorial .p-mem__catch::before {
        width: 19px;
    }
}

/* リード文 */
.page-memorial .p-mem__lead {
    margin-top: 20px;
    font-size: 15px;
    line-height: 1.85;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__lead {
        margin-top: 32px;
        font-size: 18px;
        line-height: 32px;
    }
}

/* 中見出し */
.page-memorial .p-mem__subHeading {
    margin-top: 32px;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.6;
    color: #222;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__subHeading {
        margin-top: 44px;
        font-size: 22px;
    }
}

/* 注釈 */
.page-memorial .p-mem__note {
    margin-top: 24px;
    font-size: 13px;
    line-height: 1.8;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__note {
        margin-top: 56px;
        font-size: 16px;
        line-height: 30px;
    }
}

/* ボタン */
.page-memorial .p-mem__btnWrap {
    margin-top: 28px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__btnWrap {
        margin-top: 48px;
    }
}

/* 共用 js/common.js が全ページのCTAに差し込む
   「『動画を作ってよかった！』の声多数」はこのページのデザインには無いので消す。
   共用JSは触らず、このページのCSSだけで打ち消す */
.page-memorial .c-btnWrap .c-btn._cta .cta-copy {
    display: none;
}

/* 同JSが2ボタン並びのときに付ける .addMargin（コピー用の余白）も不要 */
.page-memorial .c-btnWrap .c-btn._cta.addMargin {
    margin-top: 0;
}

/* ボタン同士の間隔（デザイン実測 約31px。inline の空白ぶん約5pxを差し引く） */
@media (min-width: 1000px) {
    .page-memorial .p-mem__btnWrap .c-btn+.c-btn {
        margin-left: 26px;
    }
}

/* --------------------------------------------------------------------------
   01 周年記念・企業イベントの種類（2カラム）
   デザイン: カード 472px / サムネ 150×230 / 番号26px・見出し24px・本文18px
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__kindsList {
    display: grid;
    gap: 12px;
    margin-top: 28px;
    list-style: none;
}

@media (min-width: 768px) {
    .page-memorial .p-mem__kindsList {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsList {
        margin-top: 40px;
    }
}

.page-memorial .p-mem__kindsItem {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 10px;
    border: 2px solid #ddd;
    border-radius: 10px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsItem {
        gap: 44px;
    }
}

.page-memorial .p-mem__kindsThumb {
    flex-shrink: 0;
    width: 100px;
    overflow: hidden;
    aspect-ratio: 150 / 230;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsThumb {
        width: 150px;
    }
}

.page-memorial .p-mem__kindsThumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-memorial .p-mem__kindsBody {
    flex: 1 1 auto;
    min-width: 0;
    padding: 8px 4px 12px 0;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsBody {
        padding: 19px 20px 8px 0;
    }
}

.page-memorial .p-mem__kindsHead {
    display: flex;
    gap: 12px;
    align-items: center;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsHead {
        gap: 19px;
    }
}

.page-memorial .p-mem__kindsNum {
    flex-shrink: 0;
    padding-right: 12px;
    font-family: "Oswald", sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    color: #c8000f;
    text-align: center;
    white-space: nowrap;
    border-right: 1px solid #ddd;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsNum {
        padding-right: 22px;
        font-size: 26px;
        line-height: 30px;
    }
}

.page-memorial .p-mem__kindsTtl {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    color: #222;
    line-break: strict;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsTtl {
        max-width: 160px;
        font-size: 24px;
    }

    /* デザインでは「内定式・入社式」だけ1行（他は6文字前後で折り返し） */
    .page-memorial .p-mem__kindsItem:nth-child(5) .p-mem__kindsTtl {
        max-width: none;
        white-space: nowrap;
    }
}

.page-memorial .p-mem__kindsTxt {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.85;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__kindsTxt {
        margin-top: 18px;
        font-size: 18px;
        line-height: 32px;
    }
}

/* --------------------------------------------------------------------------
   02 構成・演出のパターン
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__patternList {
    display: grid;
    gap: 12px;
    margin-top: 16px;
    list-style: none;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__patternList {
        gap: 22px;
    }

    .page-memorial .p-mem__patternList._col4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .page-memorial .p-mem__patternList._col5 {
        grid-template-columns: repeat(5, 1fr);
        gap: 10px;
    }
}

@media (max-width: 999px) {
    .page-memorial .p-mem__patternList {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 374px) {
    .page-memorial .p-mem__patternList {
        grid-template-columns: 1fr;
    }
}

.page-memorial .p-mem__patternItem {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    padding: 10px 10px 20px;
    text-align: center;
    border: 2px solid #ddd;
    border-radius: 5px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__patternItem {
        gap: 22px;
    }
}

.page-memorial .p-mem__patternNum {
    font-family: "Oswald", sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 32px;
    color: #c8000f;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__patternNum {
        font-size: 24px;
    }
}

/* アイコン: img/memorial/pattern01〜09.svg（01〜04 は 80px、05〜09 は 60px） */
.page-memorial .p-mem__patternIcon {
    width: 64px;
    height: 64px;
}

.page-memorial .p-mem__patternIcon._small {
    width: 50px;
    height: 50px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__patternIcon {
        width: 80px;
        height: 80px;
    }

    .page-memorial .p-mem__patternIcon._small {
        width: 60px;
        height: 60px;
    }
}

.page-memorial .p-mem__patternIcon img {
    display: block;
    width: 100%;
    height: 100%;
}

.page-memorial .p-mem__patternTtl {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
    color: #000;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__patternList._col4 .p-mem__patternTtl {
        font-size: 18px;
        line-height: 32px;
    }

    .page-memorial .p-mem__patternList._col5 .p-mem__patternTtl {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 64px;
        font-size: 20px;
        line-height: 32px;
    }
}

.page-memorial .p-mem__patternTxt {
    margin-top: -4px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.8;
    color: #000;
    text-align: left;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__patternTxt {
        margin-top: -12px;
    }

    .page-memorial .p-mem__patternList._col4 .p-mem__patternTxt {
        font-size: 18px;
        line-height: 32px;
    }

    .page-memorial .p-mem__patternList._col5 .p-mem__patternTxt {
        font-size: 16px;
        line-height: 32px;
    }
}

/* --------------------------------------------------------------------------
   03 担当者の悩み
   -------------------------------------------------------------------------- */
.page-memorial .c-sec.p-mem__worries {
    background: #f4f4f4;
}

.page-memorial .p-mem__worriesBox {
    margin-top: 24px;
    padding: 24px 20px;
    background: #fff;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__worriesBox {
        margin-top: 44px;
        padding: 40px;
    }
}

.page-memorial .p-mem__worriesList {
    display: flex;
    flex-direction: column;
    gap: 12px;
    list-style: none;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__worriesList {
        gap: 16px;
    }
}

.page-memorial .p-mem__worriesItem {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding-bottom: 8px;
    border-bottom: 1px solid #ddd;
}

.page-memorial .p-mem__worriesIcon {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 4px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__worriesIcon {
        width: 21px;
        height: 21px;
        margin-top: 6px;
    }
}

.page-memorial .p-mem__worriesTxt {
    font-size: 14px;
    line-height: 1.8;
    color: #000;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__worriesTxt {
        font-size: 18px;
        line-height: 32px;
    }
}

.page-memorial .p-mem__worriesTxt b {
    font-weight: 700;
    color: #c8000f;
}

.page-memorial .p-mem__worriesNote {
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.8;
    color: #000;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__worriesNote {
        margin-top: 24px;
        font-size: 18px;
        line-height: 32px;
    }
}

/* --------------------------------------------------------------------------
   04 私たちが出来ること（3カラム、見出しは中央・本文は左揃え）
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__answerList {
    display: grid;
    gap: 16px;
    margin-top: 28px;
    list-style: none;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__answerList {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px 30px;
        margin-top: 44px;
    }
}

@media (min-width: 600px) and (max-width: 999px) {
    .page-memorial .p-mem__answerList {
        grid-template-columns: repeat(2, 1fr);
    }
}

.page-memorial .p-mem__answerItem {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 28px 20px 24px;
    background: #fff;
    filter: drop-shadow(0 1px 7.5px rgba(0, 0, 0, 0.15));
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__answerItem {
        padding: 44px 18px 24px;
    }
}

/* アイコン: img/memorial/answer01〜06.svg（100px） */
.page-memorial .p-mem__answerIcon {
    width: 80px;
    height: 80px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__answerIcon {
        width: 100px;
        height: 100px;
    }
}

.page-memorial .p-mem__answerIcon img {
    display: block;
    width: 100%;
    height: 100%;
}

.page-memorial .p-mem__answerTtl {
    margin-top: 20px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    color: #222;
    text-align: center;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__answerTtl {
        margin-top: 30px;
        font-size: 20px;
    }
}

.page-memorial .p-mem__answerTxt {
    align-self: stretch;
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.8;
    color: #333;
    text-align: left;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__answerTxt {
        margin-top: 10px;
        font-size: 18px;
        line-height: 32px;
    }
}

/* --------------------------------------------------------------------------
   05 費用の目安
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__priceList {
    display: grid;
    gap: 16px;
    margin-top: 28px;
    list-style: none;
}

@media (min-width: 768px) {
    .page-memorial .p-mem__priceList {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceList {
        margin-top: 40px;
    }
}

.page-memorial .p-mem__priceItem {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    padding: 24px 20px;
    border: 1px solid #ccc;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceItem {
        gap: 20px;
        padding: 40px;
    }
}

.page-memorial .p-mem__priceHead {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceHead {
        gap: 28px;
        padding-bottom: 14px;
    }
}

.page-memorial .p-mem__priceCol {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    width: 130px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceCol {
        gap: 24px;
        width: 155px;
    }
}

.page-memorial .p-mem__priceLabel {
    padding: 0 10px;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
    color: #fff;
    background: #c8000f;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceLabel {
        font-size: 22px;
    }
}

.page-memorial .p-mem__priceNum {
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    color: #222;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceNum {
        font-size: 32px;
    }
}

.page-memorial .p-mem__priceNum ._num {
    font-family: "Oswald", sans-serif;
    font-size: 42px;
    font-weight: 700;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceNum ._num {
        font-size: 55px;
    }
}

.page-memorial .p-mem__priceIcon {
    flex-shrink: 0;
    width: 120px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceIcon {
        width: 165px;
    }
}

.page-memorial .p-mem__priceIcon img {
    display: block;
    width: 100%;
    height: auto;
}

.page-memorial .p-mem__priceTxt {
    width: 100%;
    max-width: 330px;
    font-size: 14px;
    line-height: 1.8;
    color: #000;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__priceTxt {
        font-size: 18px;
        line-height: 32px;
    }
}

/* --------------------------------------------------------------------------
   06 制作事例（管理画面で登録／共用の videos-item でモーダル再生）
   共用 style.css の .c-videos__item（幅・右余白）をこのページだけ上書き
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__works.c-videos {
    margin-top: 28px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__works.c-videos {
        margin-top: 40px;
    }
}

.page-memorial .p-mem__works.c-videos .c-videos__list {
    display: grid;
    gap: 32px;
    list-style: none;
}

@media (min-width: 600px) {
    .page-memorial .p-mem__works.c-videos .c-videos__list {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 24px;
    }
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__works.c-videos .c-videos__list {
        grid-template-columns: repeat(3, 1fr);
        gap: 50px 30px;
    }
}

.page-memorial .p-mem__works.c-videos .c-videos__item {
    width: auto;
    margin: 0;
}

/* YouTube の hqdefault（4:3・上下黒帯）を16:9で切り抜く */
.page-memorial .p-mem__works .c-videos__thumb {
    aspect-ratio: 16 / 9;
}

.page-memorial .p-mem__works .c-videos__thumb > img:not(.videos-thumb-gif) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-memorial .p-mem__works.c-videos .c-videos__detail:not(:first-child) {
    margin-top: 16px;
}

.page-memorial .p-mem__works .c-videos__name {
    font-size: 17px;
    line-height: 1.5;
    color: #222;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__works .c-videos__name {
        font-size: 20px;
    }
}

.page-memorial .p-mem__worksCat {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
    color: #999;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__worksCat {
        font-size: 14px;
    }
}

.page-memorial .p-mem__worksTtl {
    display: block;
}

.page-memorial .p-mem__works .c-videos__item .p-mem__worksTxt {
    display: block;
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.8;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__works .c-videos__item .p-mem__worksTxt {
        margin-top: 10px;
        font-size: 16px;
        line-height: 31px;
    }
}

.page-memorial .p-mem__works .c-videos__item .p-mem__worksSpec {
    display: block;
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.8;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__works .c-videos__item .p-mem__worksSpec {
        margin-top: 15px;
        font-size: 14px;
    }
}

/* --------------------------------------------------------------------------
   07 制作の流れと期間
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__stepList {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 28px;
    list-style: none;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__stepList {
        gap: 16px;
        margin-top: 40px;
    }
}

.page-memorial .p-mem__stepItem {
    display: flex;
    gap: 14px;
    align-items: center;
    padding: 14px 16px;
    border: 2px solid #c8000f;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__stepItem {
        gap: 25px;
        padding: 13px 40px 13px 27px;
    }
}

/* STEPアイコン: img/memorial/step01〜04.png（表示86px / @2x 180px・円形透過） */
.page-memorial .p-mem__stepIcon {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    background-color: #f1f1f1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border-radius: 50%;
}

.page-memorial .p-mem__stepItem:nth-child(1) .p-mem__stepIcon {
    background-image: url("../img/memorial/step01.png");
}

.page-memorial .p-mem__stepItem:nth-child(2) .p-mem__stepIcon {
    background-image: url("../img/memorial/step02.png");
}

.page-memorial .p-mem__stepItem:nth-child(3) .p-mem__stepIcon {
    background-image: url("../img/memorial/step03.png");
}

.page-memorial .p-mem__stepItem:nth-child(4) .p-mem__stepIcon {
    background-image: url("../img/memorial/step04.png");
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__stepIcon {
        width: 86px;
        height: 86px;
    }
}

.page-memorial .p-mem__stepNum {
    font-family: "Oswald", sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    color: #c8000f;
    letter-spacing: 0.04em;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__stepNum {
        font-size: 16px;
    }
}

.page-memorial .p-mem__stepBody {
    flex: 1 1 auto;
    min-width: 0;
}

.page-memorial .p-mem__stepTtl {
    margin-top: 4px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    color: #222;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__stepTtl {
        margin-top: 8px;
        font-size: 24px;
    }
}

.page-memorial .p-mem__stepTxt {
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.8;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__stepTxt {
        margin-top: 2px;
        font-size: 18px;
        line-height: 32px;
    }
}

/* --------------------------------------------------------------------------
   08 選ばれる理由（見出しの2行目だけ赤）
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__strengthList {
    display: flex;
    flex-direction: column;
    gap: 36px;
    margin-top: 28px;
    list-style: none;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__strengthList {
        gap: 74px;
        margin-top: 44px;
    }
}

.page-memorial .p-mem__strengthItem {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (min-width: 768px) {
    .page-memorial .p-mem__strengthItem {
        flex-direction: row-reverse;
        gap: 24px;
        align-items: center;
    }

    .page-memorial .p-mem__strengthItem._reverse {
        flex-direction: row;
    }
}

/* 強みの画像: img/memorial/strength01〜03.jpg（351×234 / @2x 702×468） */
.page-memorial .p-mem__strengthThumb {
    flex-shrink: 0;
    aspect-ratio: 351 / 234;
    background-color: #d9d9d9;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.page-memorial .p-mem__strengthItem:nth-child(1) .p-mem__strengthThumb {
    background-image: url("../img/memorial/strength01.jpg");
}

.page-memorial .p-mem__strengthItem:nth-child(2) .p-mem__strengthThumb {
    background-image: url("../img/memorial/strength02.jpg");
}

.page-memorial .p-mem__strengthItem:nth-child(3) .p-mem__strengthThumb {
    background-image: url("../img/memorial/strength03.jpg");
}

@media (min-width: 768px) {
    .page-memorial .p-mem__strengthThumb {
        width: 351px;
        max-width: 38%;
    }
}

.page-memorial .p-mem__strengthBody {
    flex: 1 1 auto;
    min-width: 0;
}

.page-memorial .p-mem__strengthTtl {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.45;
    color: #222;
}

.page-memorial .p-mem__strengthTtl ._red {
    color: #c8000f;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__strengthTtl {
        font-size: 28px;
        line-height: 40px;
    }
}

.page-memorial .p-mem__strengthTxt {
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.8;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__strengthTxt {
        margin-top: 16px;
        font-size: 18px;
        line-height: 32px;
    }
}

/* --------------------------------------------------------------------------
   09 社内説明・稟議の材料
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__materialImages {
    display: grid;
    gap: 16px;
    margin-top: 28px;
}

@media (min-width: 768px) {
    .page-memorial .p-mem__materialImages {
        grid-template-columns: repeat(2, 1fr);
        gap: 46px;
    }
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__materialImages {
        margin-top: 44px;
    }
}

/* 材料セクションの画像: img/memorial/material01〜02.jpg（457×250 / @2x 914×500） */
.page-memorial .p-mem__materialImage {
    aspect-ratio: 457 / 250;
    background-color: #d9d9d9;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.page-memorial .p-mem__materialImage:nth-child(1) {
    background-image: url("../img/memorial/material01.jpg");
}

.page-memorial .p-mem__materialImage:nth-child(2) {
    background-image: url("../img/memorial/material02.jpg");
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__material .p-mem__lead {
        margin-top: 40px;
    }
}

.page-memorial .p-mem__materialList {
    margin-top: 24px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__materialList {
        margin-top: 32px;
    }
}

.page-memorial .p-mem__materialItem+.p-mem__materialItem {
    margin-top: 16px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__materialItem+.p-mem__materialItem {
        margin-top: 20px;
    }
}

.page-memorial .p-mem__materialTtl {
    display: inline-block;
    padding: 0 10px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.75;
    color: #fff;
    background: #000;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__materialTtl {
        font-size: 18px;
        line-height: 31px;
    }
}

.page-memorial .p-mem__materialTxt {
    margin-top: 6px;
    font-size: 14px;
    line-height: 1.8;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__materialTxt {
        font-size: 18px;
        line-height: 32px;
    }
}

.page-memorial .p-mem__materialNote {
    margin-top: 24px;
    font-size: 14px;
    line-height: 1.8;
    color: #000;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__materialNote {
        margin-top: 32px;
        font-size: 18px;
        line-height: 32px;
    }

    .page-memorial .p-mem__material .p-mem__btnWrap {
        margin-top: 32px;
    }
}

/* --------------------------------------------------------------------------
   10 よくある質問
   -------------------------------------------------------------------------- */
.page-memorial .p-mem__faqList {
    margin-top: 28px;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__faqList {
        margin-top: 52px;
    }
}

.page-memorial .p-mem__faqItem {
    padding: 20px 0;
    border-bottom: 1px solid #ddd;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__faqItem {
        padding: 24px 0;
    }
}

.page-memorial .p-mem__faqItem:first-child {
    padding-top: 0;
}

.page-memorial .p-mem__faqQ,
.page-memorial .p-mem__faqA {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    line-height: 1.8;
}

.page-memorial .p-mem__faqQ {
    font-size: 16px;
    font-weight: 700;
    color: #222;
}

.page-memorial .p-mem__faqA {
    margin-top: 12px;
    font-size: 14px;
    color: #333;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__faqQ,
    .page-memorial .p-mem__faqA {
        gap: 20px;
    }

    .page-memorial .p-mem__faqQ {
        font-size: 26px;
        line-height: 39px;
    }

    .page-memorial .p-mem__faqA {
        margin-top: 20px;
        font-size: 18px;
        line-height: 30px;
    }
}

.page-memorial .p-mem__faqMark {
    flex-shrink: 0;
    width: 14px;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: inherit;
    color: #222;
}

@media (min-width: 1000px) {
    .page-memorial .p-mem__faqMark {
        width: 16px;
        font-size: 24px;
    }
}

.page-memorial .p-mem__faqA .p-mem__faqMark {
    color: #c8000f;
}

.page-memorial .p-mem__faqBody {
    flex: 1 1 auto;
    min-width: 0;
}

/* --------------------------------------------------------------------------
   関連カテゴリ（共通 template/case-index.php）
   /case/product/ などと同じく灰色背景・白カードなし（case.css の .single-case ._specialty と同じ指定）
   -------------------------------------------------------------------------- */
.page-memorial .c-sec.p-specialtyDetail__sec._specialty {
    padding-top: 42px;
    padding-bottom: 50px;
    background: #f4f4f4;
}

.page-memorial ._specialty::before {
    display: none;
}

.page-memorial ._specialty .c-heading02._border {
    margin-bottom: 60px;
}

.page-memorial ._specialty .c-links {
    padding: 20px 0 0;
    background: none;
    box-shadow: none;
}

@media (max-width: 767px) {
    .page-memorial ._specialty .c-heading02._border {
        margin-bottom: 40px;
    }

    .page-memorial ._specialty .c-links {
        padding-top: 0;
        margin-top: 0;
    }
}

@media (min-width: 1000px) {
    .page-memorial .c-sec.p-specialtyDetail__sec._specialty {
        padding-top: 120px;
        padding-bottom: 120px;
    }
}
