Header

H1 スタイルガイド

H2 スタイルガイド

H3 スタイルガイド

H4 スタイルガイド

H5 スタイルガイド

H6 スタイルガイド

Logo sprites

Icon sprites

Flat buttons

Primary Secondary Info Success Warning Danger Default Health Organization Talent Contents
block sm lg

Addon buttons

Danger Health Organization Talent Contents
Danger Health Organization Talent Contents
sm lg ラベルが長い場合のアドオン付きボタン（大） block

Glow buttons

Danger Health グロー付きアドオン付きボタン グロー付きアドオン付きボタン（大） サービス詳細はこちら（PDF） サービス詳細はこちら（PDF） サービス詳細はこちら（PDF） サービス詳細はこちら（PDF）

Underbar buttons

下線ボタン 下線ボタン 下線ボタン

Badges

Example heading New

Default Danger Health Organization Talent Media

Side groove badges

Example heading New

Default Danger Health Organization Talent Media

Pills

Default Danger Health Organization Talent Media

Header variations

Left border title (health)

Left border title (organization)

Left border title (talent)

Left border title (contents)

Left border title

Left border title inverse (health)

Left border title inverse (organization)

Left border title inverse (talent)

Left border title inverse (contents)

Left border title inverse

Burret title

H1 Horizontal bar title

H2 Horizontal bar title

H3 Horizontal bar title

H4 Horizontal bar title

H5 Horizontal bar title

H6 Horizontal bar title

Box title (base)

Box title (health)

Box title (organization)

Box title (talent)

Box title (contents)

Point phrase title (base)

Point phrase title (health)

Point phrase title (organization)

Point phrase title (talent)

Point phrase title (contents)

Typography

IE以外は游ゴシックを使用します（IEはメイリオにフォールバック）

IEでも游ゴシックを使用します（インライン要素のみ使用可能・行間修正のため）

Font size 40px equiv.

Font size 32px equiv.

Font size 28px equiv.

Font size 24px equiv.

Font size 20px equiv.

Font size 18px equiv.

Font size 16px equiv. (body font size)

Font size 14px equiv.

Font size 12px equiv.

Font size 10px equiv.

Text color danger Text color health Text color organization Text color talent Text color contents

Layout

Container large

Container medium

Container small

Social button

Panel header

Panel body

パネル使用例

Panel body

Colored panel (base) header

Colored panel (base) body

Colored panel (health) header

Colored panel (health) body

Colored panel (health) header

Colored panel (health) body

Colored panel (health) header

Colored panel (health) body

Colored panel (health) header

Colored panel (health) body

Zabuton

Well

Background colors

Health bg color

Organization bg color

Talent bg color

Contents bg color

Health light bg color

Organization light bg color

Talent light bg color

Contents light bg color

Lists

Bordered list
Bordered list
Bordered list

Burret list (base)
Burret list (base)
Burret list (base) Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.