.LogoBox {
    /* 外側で--TypographyBaseSizeを指定し、指定がなければ50pxがデフォルト値 */
    --BaseSize: var(--LogoSize, 50px);
    display: flex;
    align-items: center;
    line-height: 1;

    .LeftGrid {
        width: var(--BaseSize);
        height: var(--BaseSize);
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;

        .GridItem {
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: calc(var(--BaseSize) * 0.45);
        }
    }
        
    .RightText {
        height: var(--BaseSize);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: calc(var(--BaseSize) * 1);
        margin-left: calc(var(--BaseSize) * 0.1);
        
        font-weight: 500;

        /* 整列の視覚的誤差を微調整 */
        margin-top: -2px;
    }
}
