@charset "utf-8";

#greeting {
    display: flex;
    flex-flow: column;
    row-gap: 30px;
}

#greeting dl.body {
    display: flex;
    flex-flow: column;
    row-gap: 2em;
}

#greeting dl.body>dt {
    font-weight: bold;
}

#greeting dl.body>dd {
    display: flex;
    flex-flow: column;
    row-gap: 1em;
}

#greeting .photo {
    display: flex;
    flex-flow: wrap;
    align-items: flex-end;
    justify-content: space-between;
}

#greeting .photo .img {
    width: calc(260/470 * 100%);
}

#greeting .photo .name {
    width: calc(173/470 * 100%);
}

@media (min-width: 769px) {
    #greeting {
        flex-flow: wrap;
        justify-content: space-between;
    }

    #greeting dl.body {
        width: calc(552/920 * 100%);
    }

    #greeting .photo {
        width: calc(320/920 * 100%);
        justify-content: flex-end;
        row-gap: 15px;
    }

    #greeting .photo .img {
        width: 100%
    }

    #greeting .photo .name {
        width: calc(196/320 * 100%);
    }
}