/**
Regular: 400 || normal
 */
@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_Rg.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_Rg.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_It.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_It.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

/**
Light: 300
 */
@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_Lt.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_Lt.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_LtIt.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_LtIt.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

/**
Bold: 700 || bold
 */
@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_Bd.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_Bd.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_BdIt.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_BdIt.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

/**
SemiBold: 600
 */
@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_SBd.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_SBd.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_SBdIt.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_SBdIt.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

/**
Black: 900
 */
@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_Blk.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_Blk.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'RakutenSansUI';
    src: url('woff2/RakutenSansUI_W_BlkIt.woff2') format('woff2'),
    url('woff/RakutenSansUI_W_BlkIt.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}