/* @group @Variables - font-family */

:root {
--font-family: Helvetica, 'Noto Sans JP', 'Noto Sans CJK JP', NotoSansCJKjp, -apple-system, BlinkMacSystemFont, HiraginoSans, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'Meiryo', sans-serif;
--font-family-headline: 'DINWebPro-CondMedium', 'Noto Sans JP', 'Noto Sans CJK JP', NotoSansCJKjp, -apple-system, BlinkMacSystemFont, HiraginoSans, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'Meiryo', sans-serif;
--font-family-headline-secondary: 'DINWebPro-Medium', 'Noto Sans JP', 'Noto Sans CJK JP', NotoSansCJKjp, -apple-system, BlinkMacSystemFont, HiraginoSans, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'Meiryo', sans-serif;
}

/* @end @Variables - font-family */

/* @group @Variables - font-weight */

:root {
--font-weight: 300;
--font-weight-bold: 500;
--font-headline-weight: 300;
--font-headline-weight-bold: 500;
}

/* @end @Variables - font-weight */

/* font --------------------------------------------------------*/

/* @group @Variables - font-size */

:root {
--font-size: 1rem;
--lineheight: 1.5;
--lineheight-icon: 1;
--letter-spacing: .1rem;
--letter-spacing-heading: .25rem;

--font-hero-large: 4.5;
--font-size-hero-large: calc(var(--font-hero-large) * 1rem);
--lineheight-hero-large: 1.083333333;

--font-hero-medium: 3.75;
--font-size-hero-medium: calc(var(--font-hero-medium) * 1rem);
--lineheight-hero-medium: 1.1;

--font-xxxx-large: 3;
--font-size-xxxx-large: calc(var(--font-xxxx-large) * 1rem);
--lineheight-xxxx-large: 1.125;

--font-xxx-large: 2.25;
--font-size-xxx-large: calc(var(--font-xxx-large) * 1rem);
--lineheight-xxx-large: calc(var(--font-xxx-large) / (var(--lineheight) / 7 * 9));

--font-xx-large: 1.875;
--font-size-xx-large: calc(var(--font-xx-large) * 1rem);
--lineheight-xx-large: calc(var(--font-xx-large) / (var(--lineheight) / 9.6 * 10));

--font-x-large: 1.5;
--font-size-x-large: calc(var(--font-x-large) * 1rem);
--lineheight-x-large: calc(var(--font-x-large) / var(--lineheight) * 1.25);

--font-large: 1.25;
--font-size-large: calc(var(--font-large) * 1rem);
--lineheight-large: calc((var(--lineheight) / var(--font-large)) * 1.25);

--font-medium: 1.125;
--font-size-medium: calc(var(--font-medium) * 1rem);
--lineheight-medium: calc(var(--lineheight) / var(--font-medium));

--font-small: .875;
--font-size-small: calc(var(--font-small) * 1rem);
--lineheight-small: calc(var(--lineheight) / var(--font-small));

--font-x-small: .75;
--font-size-x-small: calc(var(--font-x-small) * 1rem);
--lineheight-x-small: calc(var(--lineheight) / var(--font-x-small));

--font-xx-small: .625;
--font-size-xx-small: calc(var(--font-xx-small) * 1rem);
--lineheight-xx-small: calc(var(--lineheight) / var(--font-x-small));
}

/* @end @Variables - font-size */

/* @group @Variables - font-size */

:root {
--line-clamp-1: calc(var(--font-size) * var(--lineheight));
--line-clamp-2: calc(var(--line-clamp-1) * 2);
--line-clamp-3: calc(var(--line-clamp-1) * 3);
--line-clamp-4: calc(var(--line-clamp-1) * 4);
--line-clamp-5: calc(var(--line-clamp-1) * 5);
--line-clamp-6: calc(var(--line-clamp-1) * 6);
--line-clamp-7: calc(var(--line-clamp-1) * 7);
--line-clamp-8: calc(var(--line-clamp-1) * 8);
--line-clamp-9: calc(var(--line-clamp-1) * 9);
--line-clamp-0-75: calc(var(--line-clamp-1) * 0.75);
--line-clamp-1-25: calc(var(--line-clamp-1) * 1.25);
--line-clamp-1-05: calc(var(--line-clamp-1) * 1.5);
--line-clamp-1-75: calc(var(--line-clamp-1) * 1.75);
--line-clamp-2-25: calc(var(--line-clamp-1) * 2.25);
--line-clamp-2-05: calc(var(--line-clamp-1) * 2.5);
--line-clamp-3-05: calc(var(--line-clamp-1) * 3.5);
--line-clamp-4-05: calc(var(--line-clamp-1) * 4.5);
--line-clamp-5-25: calc(var(--line-clamp-1) * 5.25);
--line-clamp-6-75: calc(var(--line-clamp-1) * 6.75);
--line-clamp-7-05: calc(var(--line-clamp-1) * 7.5);
--line-clamp-8-25: calc(var(--line-clamp-1) * 8.25);
--line-clamp-9-75: calc(var(--line-clamp-1) * 9.75);
}

/* @end @Variables - font-size */