body {
    margin: 0;
    line-height: normal;
}

:root {
    /* fonts */
    --font-hiragino-sans: "Hiragino Sans";
    --font-corporate-logo-rounded-ver3: "Corporate Logo Rounded ver3";
    --font-yellowtail: Yellowtail;
    --font-yugothic: YuGothic;
    --font-hiragino-kaku-gothic-pro: "Hiragino Kaku Gothic Pro";

    /* font sizes */
    --font-size-base: 16px;
    --font-size-61xl: 80px;
    --font-size-45xl: 64px;
    --font-size-71xl: 90px;
    --font-size-9xl: 28px;
    --font-size-lg: 18px;
    --font-size-5xl: 24px;
    --font-size-29xl: 48px;
    --font-size-xl: 20px;
    --font-size-21xl: 40px;
    --font-size-53xl: 72px;
    --font-size-sm: 14px;
    --font-size-13xl: 32px;
    --font-size-xs: 12px;

    /* Colors */
    --color-white: #fff;
    --color-skyblue: #51caf0;
    --color-gray-100: #222;
    --color-gray-200: #222221;
    --color-gray-300: rgba(34, 34, 34, 0);
    --color-gray-400: #222222;
    --color-lightcoral-100: #f37f86;
    --color-darkslategray-100: #38363d;
    --color-whitesmoke-100: #eff1f1;
    --color-whitesmoke-200: #eee;
    --color-black: #000;
    --color-lightsteelblue-100: #bdccdb;
    --color-lightcyan: #d6f0f9;
    --color-gainsboro: #ddd;
    --color-steelblue-100: #1a8aad;
    --color-steelblue-200: #2265a3;
    --color-aliceblue: #dbedf2;
    --color-mediumseagreen-100: #5eb982;

    /* Gaps */
    --gap-5xl: 24px;
    --gap-7xl: 26px;
    --gap-5xs: 8px;
    --gap-xs: 12px;
    --gap-4xs: 9px;
    --gap-21xl: 40px;
    --gap-7xs: 6px;

    /* Paddings */
    --padding-5xs: 8px;
    --padding-5xl: 24px;
    --padding-base: 16px;
    --padding-lg: 18px;
    --padding-xs: 12px;
    --padding-29xl: 48px;
    --padding-21xl: 40px;
    --padding-221xl: 240px;
    --padding-13xl: 32px;

    /* Border radiuses */
    --br-5xs: 8px;
    --br-5xl: 24px;
    --br-xs: 12px;
    --br-25xl: 44px;
}