@charset "utf-8";

:root {
    --sans: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    --en: "Hind", "Noto Sans JP", sans-serif;

    --fs-white: #fff;
    --fs-navy: #1b2d41;
    --fs-salmon: #f3815e;
    --fs-blue: #1892ce;
    --fs-sky: #d7e6ed;
    --fs-sky-l: #99cbe3;
    --fs-yellow: #ffe898;

    --ls-text: .02em;
    --ls-num: .01em;
}

* { box-sizing: border-box }

.mafv :where(p, h1, ul, li) { margin: 0 }
.mafv :where(ul) { padding: 0; list-style: none }

.mafv .nw { white-space: nowrap }

.mafv__person img { display: block; width: 100%; height: auto }

html { -webkit-text-size-adjust: 100% }

body {
    margin: 0;
    background: var(--fs-white);
    font-family: var(--sans);
    font-weight: 700;
    color: var(--fs-navy);
    line-height: 1.8;
}

.mafv a { text-decoration: none }

.mafv {
    position: relative;
    background: var(--fs-blue);
}

.mafv__inr { position: relative; overflow: hidden }
.mafv__inr::before {
    position: absolute;
    font-family: var(--en);
    font-weight: 700;
    color: var(--fs-white);
    opacity: .1;
    z-index: 0;
    pointer-events: none;
    line-height: 1;
    white-space: nowrap;
}
.mafv__inr::before { content: "M&A" }

@media (min-width: 768px) {

    .mafv { --fvw: min(100vw, 1440px) }

    .mafv__inr { padding: calc(var(--fvw) * 24 / 1440) 0 calc(var(--fvw) * 32 / 1440) }

    .mafv__inr::before {
        font-size: calc(var(--fvw) * 250 / 1440);
        top: calc(var(--fvw) * 150 / 1440);
        left: 50%;
        transform: translateX(-50%);
    }

    .mafv__container {
        position: relative;
        z-index: 1;
        width: 92%;
        max-width: 1100px;
        margin: 0 auto;
        text-align: center;
    }

    .mafv__person {
        flex: none;
        width: calc(var(--fvw) * 330 / 1440);
        align-self: flex-end;
        filter: drop-shadow(0 calc(var(--fvw) * 6 / 1440) calc(var(--fvw) * 18 / 1440) rgba(0, 0, 0, .3));

        border-bottom: calc(var(--fvw) * 2 / 1440) solid var(--fs-white);
    }
    .mafv__person .sp-only { display: none }

    .mafv__logo {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: calc(var(--fvw) * 12 / 1440);
        margin-bottom: calc(var(--fvw) * 18 / 1440);
    }
    .mafv__logo img {
        display: block;
        width: calc(var(--fvw) * 210 / 1440);
        height: auto;
    }
    .mafv__logo .ma {
        font-family: var(--en);
        font-weight: 700;
        font-size: max(16px, calc(var(--fvw) * 27 / 1440));
        line-height: 1;
        padding: .24em .46em .2em;
        background: var(--fs-white);
        color: var(--fs-blue);
        border-radius: .18em;
        box-shadow: 0 2px 0 rgba(0, 0, 0, .12);
    }

    .mafv__copy-main {
        font-size: calc(var(--fvw) * 62 / 1440);
        font-weight: 900;
        line-height: 1.38;
        letter-spacing: .03em;
        color: var(--fs-white);
        text-shadow: 0 calc(var(--fvw) * 2 / 1440) calc(var(--fvw) * 8 / 1440) rgba(0, 0, 0, .18);
    }

    .mafv__copy-main .hl { color: var(--fs-yellow) }

    .mafv__copy-sub {
        display: inline-block;
        margin-top: calc(var(--fvw) * 16 / 1440);
        padding: calc(var(--fvw) * 8 / 1440) calc(var(--fvw) * 28 / 1440);
        background: var(--fs-navy);
        color: var(--fs-white);
        font-size: max(15px, calc(var(--fvw) * 32 / 1440));
        font-weight: 900;
        line-height: 1.4;
        letter-spacing: .04em;
        border-radius: 999px;
    }

    .mafv__cond {
        display: flex;
        justify-content: center;
        column-gap: calc(var(--fvw) * 14 / 1440);
        margin-top: calc(var(--fvw) * 18 / 1440);
    }
    .mafv__cond li {
        flex: none;
        min-width: calc(var(--fvw) * 250 / 1440);
        background: var(--fs-white);
        border-radius: calc(var(--fvw) * 10 / 1440);
        padding: calc(var(--fvw) * 12 / 1440) calc(var(--fvw) * 8 / 1440) calc(var(--fvw) * 14 / 1440);
        box-shadow: 0 calc(var(--fvw) * 5 / 1440) calc(var(--fvw) * 12 / 1440) rgba(0, 0, 0, .14);
        line-height: 1.4;
    }
    .mafv__cond .lbl {
        display: block;
        font-size: max(14px, calc(var(--fvw) * 15 / 1440));
        color: #4a6076;
        margin-bottom: calc(var(--fvw) * 4 / 1440);
    }
    .mafv__cond b {
        font-size: max(16px, calc(var(--fvw) * 19 / 1440));
        font-weight: 900;
        color: var(--fs-navy);
        white-space: nowrap;
    }

    .mafv__btm {
        display: flex;
        align-items: flex-end;
        justify-content: center;
        column-gap: calc(var(--fvw) * 60 / 1440);
        margin-top: calc(var(--fvw) * 14 / 1440);
        margin-bottom: calc(var(--fvw) * 30 / 1440);
    }
    .mafv__btm .item {
        flex: none;
        width: max(170px, calc(var(--fvw) * 216 / 1440));
        aspect-ratio: 1;
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 0 calc(var(--fvw) * 12 / 1440);
        line-height: 1.3;
        text-align: center;
    }
    .mafv__btm .lbl { font-size: max(14px, calc(var(--fvw) * 17 / 1440)) }
    .mafv__btm .val {
        font-variant-numeric: tabular-nums;
        letter-spacing: var(--ls-num);
        font-size: max(30px, calc(var(--fvw) * 54 / 1440));
        line-height: 1.05;
        white-space: nowrap;
        margin: calc(var(--fvw) * 2 / 1440) 0;
    }
    .mafv__btm .val b { font-weight: 900 }
    .mafv__btm .val .unit { font-size: max(17px, calc(var(--fvw) * 28 / 1440)); font-weight: 900 }
    .mafv__btm .cap { font-size: max(14px, calc(var(--fvw) * 17 / 1440)); font-weight: 900 }
    .mafv__btm .ribbon {
        width: calc(var(--fvw) * 172 / 1440);
        height: calc(var(--fvw) * 56 / 1440);
        bottom: calc(var(--fvw) * -26 / 1440);
    }

    .mafv__cta {
        display: flex;
        justify-content: center;
        column-gap: calc(var(--fvw) * 20 / 1440);
        margin-top: calc(var(--fvw) * 20 / 1440);
    }
    .mafv__cta .btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: calc(var(--fvw) * 440 / 1440);
        min-height: 56px;
        padding: calc(var(--fvw) * 12 / 1440) calc(var(--fvw) * 16 / 1440);
        border-radius: 999px;
        line-height: 1.35;
        letter-spacing: var(--ls-text);
    }

    .mafv__cta .btn:only-child { width: calc(var(--fvw) * 520 / 1440) }
    .mafv__cta .ttl { font-size: max(16px, calc(var(--fvw) * 26 / 1440)); font-weight: 900 }
    .mafv__cta .sub { font-size: max(14px, calc(var(--fvw) * 16 / 1440)) }

    .mafv__cta .btn--main {
        background: var(--fs-salmon);
        color: var(--fs-white);
        box-shadow: 0 calc(var(--fvw) * 6 / 1440) 0 #c85f40;
    }
    .mafv__cta .btn--main .sub { color: #ffe5da }
    .mafv__cta .btn--sub {
        background: var(--fs-white);
        color: var(--fs-navy);
        box-shadow: 0 calc(var(--fvw) * 6 / 1440) 0 #0f6f9e;
    }
    .mafv__cta .btn--sub .sub { color: #4a6076 }

    .mafv__talk {
        text-align: center;
        color: var(--fs-white);
        font-size: max(15px, calc(var(--fvw) * 20 / 1440));
        font-weight: 900;
        line-height: 1.7;
        letter-spacing: var(--ls-text);
        margin-top: 0;
    }
    .mafv__talk .hl { color: var(--fs-yellow) }

    .mafv__sup {
        margin-top: calc(var(--fvw) * 20 / 1440);
        font-size: max(14px, calc(var(--fvw) * 14 / 1440));
        line-height: 1.7;
        color: var(--fs-white);
    }
}

@media (max-width: 767px) {

    .mafv__inr { padding: 5vw 0 10vw }

    .mafv__inr::before {
        font-size: 38vw;
        top: 22vw;
        left: 50%;
        transform: translateX(-50%);
    }

    .mafv__container {
        position: relative;
        z-index: 1;
        width: 90%;
        margin: 0 auto;
        text-align: center;
    }

    .mafv__logo {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 2.6vw;
        margin-bottom: 3.4vw;
    }
    .mafv__logo img {
        display: block;
        width: 38vw;
        height: auto;
    }
    .mafv__logo .ma {
        font-family: var(--en);
        font-weight: 700;
        font-size: 5.2vw;
        line-height: 1;
        padding: .24em .46em .2em;
        background: var(--fs-white);
        color: var(--fs-blue);
        border-radius: .18em;
        box-shadow: 0 2px 0 rgba(0, 0, 0, .12);
    }

    .mafv__copy-main {
        font-size: 8.6vw;
        font-weight: 900;
        line-height: 1.45;
        letter-spacing: .02em;
        color: var(--fs-white);
        text-shadow: 0 2px 6px rgba(0, 0, 0, .18);
    }
    .mafv__copy-main .hl { color: var(--fs-yellow) }

    .mafv__copy-sub {
        display: inline-block;
        margin-top: 2.6vw;
        padding: 1.8vw 5vw;
        background: var(--fs-navy);
        color: var(--fs-white);
        font-size: 4.6vw;
        font-weight: 900;
        line-height: 1.4;
        letter-spacing: .03em;
        border-radius: 999px;
    }

    .mafv__cond {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2.4vw;
        margin-top: 4.4vw;
    }
    .mafv__cond li {
        background: var(--fs-white);
        border-radius: 2vw;
        padding: 2.2vw 1.6vw 2.6vw;
        box-shadow: 0 2px 6px rgba(0, 0, 0, .14);
        line-height: 1.4;
    }
    .mafv__cond .lbl {
        display: block;
        font-size: 3.4vw;
        color: #4a6076;
    }
    .mafv__cond b {
        font-size: 4vw;
        font-weight: 900;
        color: var(--fs-navy);
        white-space: nowrap;
    }

    .mafv__btm {
        margin-top: 3.4vw;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        column-gap: 4vw;
        row-gap: 4.4vw;
        margin-bottom: 7vw;
    }

    .mafv__person {
        order: -1;
        position: relative;
        flex: 0 0 72vw;
        margin-bottom: 0;
        filter: drop-shadow(0 3px 10px rgba(0, 0, 0, .3));
        border-bottom: 2px solid var(--fs-white);
    }
    .mafv__person .pc-only { display: none }
    .mafv__credit {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        writing-mode: vertical-rl;
        font-size: 3.05vw;
        font-weight: 700;
        line-height: 1.5;
        letter-spacing: .04em;
        color: var(--fs-white);
        text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
    }
    .mafv__credit span { display: block }
    .mafv__person .sp-only { display: block; vertical-align: bottom }

    .mafv__btm .item {
        flex: 0 0 41vw;
        aspect-ratio: 1;
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 0 1.6vw;
        line-height: 1.3;
        text-align: center;
    }
    .mafv__btm .lbl { font-size: 3.6vw }
    .mafv__btm .val {
        font-variant-numeric: tabular-nums;
        letter-spacing: var(--ls-num);
        font-size: 10vw;
        line-height: 1.05;
        white-space: nowrap;
        margin: .6vw 0;
    }
    .mafv__btm .val b { font-weight: 900 }
    .mafv__btm .val .unit { font-size: 5.4vw; font-weight: 900 }
    .mafv__btm .cap { font-size: 3.6vw; font-weight: 900 }
    .mafv__btm .ribbon { width: 34vw; height: 11vw; bottom: -5vw }

    .mafv__talk {
        text-align: center;
        color: var(--fs-white);
        font-size: 4vw;
        font-weight: 900;
        line-height: 1.75;
        letter-spacing: var(--ls-text);
        margin-top: 0;
    }
    .mafv__talk .hl { color: var(--fs-yellow) }
    .mafv__cta { margin-top: 4vw }
    .mafv__cta .btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 56px;
        padding: 2.6vw 4vw;
        border-radius: 999px;
        line-height: 1.35;
        letter-spacing: var(--ls-text);
    }
    .mafv__cta .btn + .btn { margin-top: 3.2vw }
    .mafv__cta .ttl { font-size: 4.6vw; font-weight: 900 }
    .mafv__cta .sub { font-size: 3.5vw }
    .mafv__cta .btn--main {
        background: var(--fs-salmon);
        color: var(--fs-white);
        box-shadow: 0 4px 0 #c85f40;
    }
    .mafv__cta .btn--main .sub { color: #ffe5da }
    .mafv__cta .btn--sub {
        background: var(--fs-white);
        color: var(--fs-navy);
        box-shadow: 0 4px 0 #0f6f9e;
    }
    .mafv__cta .btn--sub .sub { color: #4a6076 }

    .mafv__sup {
        margin-top: 4.4vw;
        font-size: 3.4vw;
        line-height: 1.75;
        color: var(--fs-white);
    }
}

.mafv__btm .item {
    position: relative;

    background: linear-gradient(177deg,
        #fffdf0 0%, #ffeeae 18%, #ffd964 38%, #f5c02f 56%,
        #e0a51c 72%, #ffe38f 88%, #fff6cf 100%);
    color: var(--fs-navy);
    border: 0;

    box-shadow: 0 .35em .9em rgba(0, 0, 0, .22);
}
.mafv__btm .val,
.mafv__btm .lbl,
.mafv__btm .cap { color: var(--fs-navy) }

.mafv__btm .ribbon {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background: #c8940f;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 62%, 0 100%);
    z-index: -1;
}