フォントファミリー拡張

html/ie.html

@@ -59,7 +59,7 @@
             font-size: 14px;
             line-height: 24px;
             color: #454545;
-            font-family: "Hiragino Kaku Gothic Pro", "Noto Sans JP", "ヒラギノ角ゴ Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
+            font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Apple WebExp Icons Custom", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
             overflow-y: scroll
         }
 

src/assets/styles/index.scss

@@ -22,7 +22,7 @@ body {
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
-  font-family: "Hiragino Kaku Gothic Pro", "Noto Sans JP", "ヒラギノ角ゴ Pro",  Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
+  font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Apple WebExp Icons Custom", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 
 label {
@@ -122,7 +122,7 @@ aside {
   display: block;
   line-height: 32px;
   font-size: 16px;
-  font-family: "Hiragino Kaku Gothic Pro", "Noto Sans JP", "ヒラギノ角ゴ Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
+  font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Apple WebExp Icons Custom", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
   color: #2c3e50;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;