/*
OSC - FONT
v 1.2.1
date: 2018. 10. 24
*/

// @import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-kr.css);
@font-face {
  font-family: 'Spoqa Han Sans';
  font-weight: 400;
  font-display: block;
  src: local('Spoqa Han Sans Regular'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Regular.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Regular.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Spoqa Han Sans';
  font-weight: 700;
  font-display: block;
  src: local('Spoqa Han Sans Bold'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Bold.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Bold.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Spoqa Han Sans';
  font-weight: 300;
  font-display: block;
  src: local('Spoqa Han Sans Light'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Light.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Light.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Light.ttf') format('truetype');
}

@font-face {
  font-family: 'Spoqa Han Sans';
  font-weight: 100;
  font-display: block;
  src: local('Spoqa Han Sans Thin'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Thin.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Thin.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Spoqa_Han_Sans_Thin.ttf') format('truetype');
}

// @import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR');
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: local('Noto Sans KR Regular'), local('NotoSansKR-Regular'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Regular.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Regular.woff') format('woff'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Regular.otf') format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: local('Noto Sans KR Bold'), local('NotoSansKR-Bold'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Bold.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Bold.woff') format('woff'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Bold.otf') format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: local('Noto Sans KR Black'), local('NotoSansKR-Black'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Black.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Black.woff') format('woff'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Black.otf') format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: local('Noto Sans KR Light'), local('NotoSansKR-Light'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Light.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Light.woff') format('woff'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Light.otf') format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: local('Noto Sans KR Medium'), local('NotoSansKR-Medium'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Medium.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Medium.woff') format('woff'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Medium.otf') format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  font-display: block;
  src: local('Noto Sans KR Thin'), local('NotoSansKR-Thin'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Thin.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Thin.woff') format('woff'),
  url('~osc-style/style_variables/fonts/NotoSansKR-Thin.otf') format('opentype');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: local('Roboto'), local('Roboto-Regular'),
  url('~osc-style/style_variables/fonts/Roboto-Regular.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Roboto-Regular.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Roboto-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: local('Roboto'), local('Roboto-Bold'),
  url('~osc-style/style_variables/fonts/Roboto-Bold.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Roboto-Bold.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Roboto-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: local('Roboto'), local('Roboto-Light'),
  url('~osc-style/style_variables/fonts/Roboto-Light.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Roboto-Light.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Roboto-Light.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: local('Roboto'), local('Roboto-Medium'),
  url('~osc-style/style_variables/fonts/Roboto-Medium.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Roboto-Medium.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Roboto-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  font-display: block;
  src: local('Roboto'), local('Roboto-Thin'),
  url('~osc-style/style_variables/fonts/Roboto-Thin.woff2') format('woff2'),
  url('~osc-style/style_variables/fonts/Roboto-Thin.woff') format('woff'),
  url('~osc-style/style_variables/fonts/Roboto-Thin.ttf') format('truetype');
}

.font-spoqa-han-sans {
  font-family: 'Spoqa Han Sans', 'Sans-serif';
}

.font-noto-sans-kr {
  font-family: 'Noto Sans KR', Sans-serif;
}

.font-roboto {
  font-family: 'Roboto', Sans-serif;
}

h1 {
  font-weight: bold;
  font-size: 55px;
}

h2 {
  font-weight: bold;
  font-size: 36px;
}

h3 {
  font-size: 36px;
}

h4 {
  font-size: 30px;
}

h5 {
  font-size: 24px;
  font-weight: bold;
}

h6 {
  font-size: 24px;
}

h7 {
  font-size: 20px;
}

h8 {
  font-size: 18px;
}

.subtitle-1 {
  font-size: 16px;
}

.subtitle-2 {
  font-size: 14px;
}

.body-1 {
  font-size: 14px;
}

.body-2 {
  font-size: 12px;
  font-weight: bold;
}

.body-3 {
  font-size: 12px;
}

.caption {
  font-size: 10px;
}