///////////////////////////////////////
// フォントCSS
///////////////////////////////////////

// //Font Awesome
// @import "fontawesome";

//フォントサイズ
@for $i from 12 through 22 {
  .fz-#{$i}px { font-size: #{$i}px; }
  .wp-admin-fz-#{$i}px .cocoon-block-wrap { font-size: #{$i}px; }
}

$i: 24;
@while $i <= 48 {
  .fz-#{$i}px { font-size: #{$i}px; }
  .wp-admin-fz-#{$i}px .cocoon-block-wrap { font-size: #{$i}px; }
  $i: $i + 4;
}
// @for $i from 24 through 36 {
//   .fz-#{$i}px { font-size: #{$i}px; }
//   $i: $i + 1;
// }

//フォントウエイト
@for $i from 1 through 9 {
  .fw-#{$i*100} { font-weight: #{$i*100}; }
  .wp-admin-fw-#{$i*100} .cocoon-block-wrap { font-weight: #{$i*100}; }
}

//フォントファミリー
.ff-meiryo,
.wf-loading body,
.wp-admin-ff-meiryo .cocoon-block-wrap {
  font-family: Meiryo, "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
}
.ff-yu-gothic,
.wp-admin-ff-yu-gothic .cocoon-block-wrap {
  font-family: YuGothic, "Yu Gothic", Meiryo, "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
}
// .ff-hiragino{
//   font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
// }
.ff-ms-pgothic,
.wp-admin-ff-ms-pgothic .cocoon-block-wrap {
  font-family: "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.ff-noto-sans-jp,
.wf-active .ff-noto-sans-jp,
.wp-admin-ff-noto-sans-jp .cocoon-block-wrap {
  font-family: "Noto Sans JP" ,sans-serif;
}
.ff-noto-serif-jp,
.wf-active .ff-noto-serif-jp,
.wp-admin-ff-noto-serif-jp .cocoon-block-wrap {
  font-family: "Noto Serif JP" ,sans-serif;
}
.ff-mplus-1p,
.wf-active .ff-mplus-1p,
.wp-admin-ff-mplus-1p .cocoon-block-wrap {
  font-family: "M PLUS 1p" ,sans-serif;
}
.ff-rounded-mplus-1c,
.wf-active .ff-rounded-mplus-1c,
.wp-admin-ff-rounded-mplus-1c .cocoon-block-wrap {
  font-family: "M PLUS Rounded 1c" ,sans-serif;
}
.ff-kosugi,
.wf-active .ff-kosugi,
.wp-admin-ff-kosugi .cocoon-block-wrap {
  font-family: "Kosugi" ,sans-serif;
}
.ff-kosugi-maru,
.wf-active .ff-kosugi-maru,
.wp-admin-ff-kosugi-maru .cocoon-block-wrap {
  font-family: "Kosugi Maru" ,sans-serif;
}
// .ff-hannari,
// .wf-active .ff-hannari{
//   font-family: "Hannari" ,sans-serif;
// }
// .ff-kokoro,
// .wf-active .ff-kokoro{
//   font-family: "Kokoro" ,sans-serif;
// }
.ff-sawarabi-gothic,
.wf-active .ff-sawarabi-gothic,
.wp-admin-ff-sawarabi-gothic .cocoon-block-wrap {
  font-family: "Sawarabi Gothic" ,sans-serif;
}
.ff-sawarabi-mincho,
.wf-active .ff-sawarabi-mincho,
.wp-admin-ff-sawarabi-mincho .cocoon-block-wrap {
  font-family: "Sawarabi Mincho" ,sans-serif;
}
.ff-noto-sans-korean,
.wf-active .ff-noto-sans-korean,
.wp-admin-ff-noto-sans-korean .cocoon-block-wrap {
  font-family: "Noto Sans KR", sans-serif;
}
.ff-pretendard,
.wf-active .ff-pretendard,
.wp-admin-ff-pretendard .cocoon-block-wrap {
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}
.ff-microsoft-jhenghei,
.wf-active .ff-microsoft-jhenghei,
.wp-admin-ff-microsoft-jhenghei .cocoon-block-wrap {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Microsoft JhengHei", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
.ff-noto-sans-tc,
.wf-active .ff-noto-sans-tc,
.wp-admin-ff-noto-sans-tc .cocoon-block-wrap {
  font-family: "Noto Sans TC", sans-serif;
}


.sub-caption{
  font-family: Tunga, "Trebuchet MS", Tahoma, Verdana, "Segoe UI", var(--cocoon-default-font);
  font-weight: 400;
  font-size: 0.75em;
  opacity: 0.5;
}
span.sub-caption{
  opacity: 0.8;
}

//英字設定の場合のナビカードリボンのフォントサイズ
html[lang="en"] .ribbon-top-left {
  span{
    font-size: 7px;
  }
  &::before{
    right: 8px;
  }
  &::after{
    bottom: 10px;
  }
}