body {
/* for Pretendard in Safari */
font-synthesis: none; // 이게 중요✨
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased; // 폰트 계단 현상 제거
-moz-osx-font-smoothing: grayscale;
letter-spacing: -0.3px;
font-family: 'Pretendard Variable', 'Noto Sans KR', 'Apple SD Gothic Neo', '맑은 고딕', 'Malgun Gothic', sans-serif;
}사파리는 다른 브라우저들보다 유독 synthesis가 과하게되어 발생하는 문제라고한다.
font-synthesis란?
지정된 폰트에 굵기, 기울림꼴, 소문자, 아래첨자 혹은 위첨자 글꼴이 없는 경우 브라우저가 해당 글꼴을 합성할지 여부를 지정할 수 있는 속성이다.
참고문서 Browser font rendering inconsistencies(브라우저마다 다른 폰트 렌더링) CSS : font-synthesis 속성으로 모바일 IOS Safari 글꼴 굵게 표시되는 버그 수정하기