@charset "utf-8";

/*==================================================
sp
================================================== */

/* ========================================================================
[sp]message
========================================================================= */
.message {
    margin: 0 auto calc(100 * var(--vw-unit));
    width: calc(343 * var(--vw-unit));
}

.message .section__eyebrow {
    margin-bottom: calc(20 * var(--vw-unit));
    font-family: var(--font-sans-serif);
    font-size: calc(16 * var(--vw-unit));
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    background: linear-gradient(90deg, #117DCA 0%, #179AB9 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.message h2 {
    margin-bottom: calc(40 * var(--vw-unit));
    color: #000;
    font-family: var(--font-sans-serif);
    font-size: calc(32 * var(--vw-unit));
    font-style: normal;
    font-weight: 700;
    line-height: 170%;
}


.portrait {
    margin-bottom: calc(40 * var(--vw-unit));
    width: 100%;
    height: auto;
    border-radius: calc(10 * var(--vw-unit));
    overflow: hidden;
}

.portrait img {
    width: 100%;
    height: auto;
}

.message__text+.message__text {
    margin-top: calc(64 * var(--vw-unit));
}


.message__text h3 {
    margin-bottom: calc(24 * var(--vw-unit));
    color: #000;
    font-family: var(--font-sans-serif);
    font-size: calc(24 * var(--vw-unit));
    font-style: normal;
    font-weight: 700;
    line-height: 170%;
}

.message__text p {
    color: #000;
    font-family: var(--font-sans-serif);
    font-size: calc(14 * var(--vw-unit));
    font-style: normal;
    font-weight: 400;
    line-height: 180%;
}

.message__text p+p {
    margin-top: calc(20 * var(--vw-unit));
}

.message__text p+p.message__signature {
    margin-top: calc(40 * var(--vw-unit));
}

.message__text p.message__signature {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
}

.message__text p.message__signature .company-name {
    flex: 0 0 100%;
    text-align: right;
}

.message__text p.message__signature .message__person-title {
    margin-right: calc(10 * var(--vw-unit));
}

.message__text p.message__signature .message__person-name {
    display: inline-block;
    width: calc(140 * var(--vw-unit));
    height: calc(28 * var(--vw-unit));
    background: url("/group/sfe/company/assets/img/signature.webp") no-repeat center center;
    background-size: 100% auto;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
}

.message__text ol {
    list-style: none;
}

.message__text ol li {
    color: #000;
    font-family: var(--font-sans-serif);
    font-size: calc(14 * var(--vw-unit));
    font-style: normal;
    font-weight: 400;
    line-height: 180%;
}

.message__text figure {
    margin-bottom: calc(40 * var(--vw-unit));
}


/* ========================================================================
[sp]organization
========================================================================= */
.organization {
    margin: 0 auto calc(100 * var(--vw-unit));
    width: calc(343 * var(--vw-unit));
}

.organization .section__eyebrow {
    margin-bottom: calc(20 * var(--vw-unit));
    font-family: var(--font-sans-serif);
    font-size: calc(16 * var(--vw-unit));
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    background: linear-gradient(90deg, #117DCA 0%, #179AB9 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.organization h2 {
    margin-bottom: calc(40 * var(--vw-unit));
    color: #000;
    font-family: var(--font-sans-serif);
    font-size: calc(32 * var(--vw-unit));
    font-style: normal;
    font-weight: 700;
    line-height: 170%;
}

.organizational_chart {
    width: calc(343 * var(--vw-unit));
    height: calc(590 * var(--vw-unit));
    background: url("/group/sfe/welfare/health/assets/img/sp_organizational_chart.svg") no-repeat center center;
    background-size: 100% auto;
    position: relative;
}

.organizational_chart__list {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}






/*==================================================
pc
================================================== */
@media print,
screen and (min-width:768px) {



    /* ========================================================================
    [pc]message
    ========================================================================= */
    .message {
        margin: 0 auto 120px;
        width: var(--pc-container);
    }

    .message .section__eyebrow {
        margin-bottom: 20px;
        font-family: var(--font-sans-serif);
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 150%;
        background: linear-gradient(90deg, #117DCA 0%, #179AB9 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .message h2 {
        margin-bottom: 70px;
        color: #000;
        font-family: var(--font-sans-serif);
        font-size: 40px;
        font-style: normal;
        font-weight: 700;
        line-height: 170%;
    }

    .message__inner {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
    }

    .text_wrap {
        width: 54.12371134%;
    }

    .portrait {
        margin: 0;
        width: 434px;
        width: 37.28522337%;
        height: auto;
        border-radius: 10px;
        overflow: hidden;
    }

    .portrait img {
        width: 100%;
        height: auto;
    }

    .message__text {
        width: 100%;
    }

    .message__text+.message__text {
        margin-top: 80px;
    }

    .message__text h3 {
        margin-bottom: 24px;
        color: #000;
        font-family: var(--font-sans-serif);
        font-size: 28px;
        font-style: normal;
        font-weight: 700;
        line-height: 170%;
    }

    .message__text p {
        color: #000;
        font-family: var(--font-sans-serif);
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 180%;
    }

    .message__text p+p {
        margin-top: 30px;
    }

    .message__text p+p.message__signature {
        margin-top: 40px;
    }

    .message__text p+p.message__signature {
        margin-top: 40px;
    }

    .message__text p.message__signature {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        align-items: center;
    }

    .message__text p.message__signature .company-name {
        flex: 0 0 100%;
        text-align: right;
    }

    .message__text p.message__signature .message__person-title {
        margin-right: 25px;
    }

    .message__text p.message__signature .message__person-name {
        display: inline-block;
        width: 140px;
        height: 28px;
        background: url("/group/sfe/company/assets/img/signature.webp") no-repeat center center;
        background-size: 100% auto;
        text-indent: 100%;
        overflow: hidden;
        white-space: nowrap;
    }

    .message__text ol li {
        color: #000;
        font-family: var(--font-sans-serif);
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 180%;
    }

    .message__text figure {
        width: 394px;
        width: 33.84879725%;
    }

    .message__text figure {
        margin-bottom: 80px;
    }

    /* ========================================================================
    [pc]organization
    ========================================================================= */
    .organization {
        margin: 0 auto 120px;
        width: var(--pc-container);
    }

    .organization .section__eyebrow {
        margin-bottom: 20px;
        font-family: var(--font-sans-serif);
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 150%;
        background: linear-gradient(90deg, #117DCA 0%, #179AB9 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .organization h2 {
        margin-bottom: 56px;
        color: #000;
        font-family: var(--font-sans-serif);
        font-size: 40px;
        font-style: normal;
        font-weight: 700;
        line-height: 170%;
    }

    .organizational_chart {
        width: var(--pc-container);
        height: 662px;
        background: url("/group/sfe/welfare/health/assets/img/pc_organizational_chart.svg") no-repeat center center;
        background-size: 100% auto;
        position: relative;
    }

    .organizational_chart__list {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }




}
