/* PC·모바일 공통 글꼴과 기본 유틸리티. 각 화면의 보조 CSS보다 먼저 불러옵니다. */
@font-face {
  font-family: BebasNeuePro;
  src: url(/fonts/BebasNeuePro/Bebas-Neue-Pro-Thin.woff) format("woff");
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: BebasNeuePro;
  src: url(/fonts/BebasNeuePro/Bebas-Neue-Pro-Light.woff) format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: BebasNeuePro;
  src: url(/fonts/BebasNeuePro/Bebas-Neue-Pro-Regular.woff) format("woff");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: BebasNeuePro;
  src: url(/fonts/BebasNeuePro/Bebas-Neue-Pro-Book.woff) format("woff");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: BebasNeuePro;
  src: url(/fonts/BebasNeuePro/Bebas-Neue-Pro-Bold.woff) format("woff");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: NEXON1;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON%20Lv1%20Gothic%20OTF%20Light.woff) format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: NEXON1;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON%20Lv1%20Gothic%20OTF.woff) format("woff");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: NEXON1;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON%20Lv1%20Gothic%20OTF%20Bold.woff) format("woff");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: NEXON2;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON%20Lv2%20Gothic%20Light.woff) format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: NEXON2;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON%20Lv2%20Gothic.woff) format("woff");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: NEXON2;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON%20Lv2%20Gothic%20Bold.woff) format("woff");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: Gmarket;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff) format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: Gmarket;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff) format("woff");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Gmarket;
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff) format("woff");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: Noto Sans KR;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/roboto/v29/KFOmCnqEu92Fr1Mu4mxK.woff2) format("woff2");
  unicode-range: U+0041-005a,U+0061-007a,U+0030-0039;
}

@font-face {
  font-family: Noto Sans KR;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/roboto/v29/KFOlCnqEu92Fr1MmEU9fABc4EsA.woff2) format("woff2");
  unicode-range: U+0041-005a,U+0061-007a,U+0030-0039;
}

.noto_sans {
  font-family: Noto Sans KR !important;
}

.roboto {
  font-family: Roboto,sans-serif !important;
}

.nova {
  font-family: Proxima Nova !important;
}

.nexon1 {
  font-family: NEXON1 !important;
}

.nexon2 {
  font-family: NEXON2 !important;
}

.bebas {
  font-family: BebasNeuePro !important;
}

.gmarket {
  font-family: Gmarket !important;
}

.text-extra-small {
  font-size: .688rem;
  line-height: 1.5;
}

.text-small {
  font-size: .75rem;
  line-height: 1.5;
}

.text-extra-medium {
  font-size: .875rem;
  line-height: 1.5;
}

.text-medium {
  font-size: 1rem;
  line-height: 1.5;
}

.text-large {
  font-size: 1.125rem;
  line-height: 1.5;
}

.text-extra-large {
  font-size: 1.25rem;
  line-height: 1.5;
}

.text-ultra-large {
  font-size: 1.5rem;
  line-height: 1.5;
}

.title-extra-small {
  font-size: 2rem;
  line-height: 1.5;
}

.title-small {
  font-size: 2.5rem;
  line-height: 1.5;
}

.title-medium {
  font-size: 2.813rem;
  line-height: 1.5;
}

.title-large {
  font-size: 6.25rem;
  line-height: 1.5;
}

.title-extra-large {
  font-size: 8.125rem;
  line-height: 1.5;
}

.font-size-11 {
  font-size: 1.1rem !important;
}

.font-size-12 {
  font-size: 1.2rem !important;
}

.font-size-13 {
  font-size: 1.3rem !important;
}

.font-size-14 {
  font-size: 1.4rem !important;
}

.font-size-15 {
  font-size: 1.5rem !important;
}

.font-size-16 {
  font-size: 1.6rem !important;
}

.font-size-17 {
  font-size: 1.7rem !important;
}

.font-size-18 {
  font-size: 1.8rem !important;
}

.font-size-19 {
  font-size: 1.9rem !important;
}

.font-size-20 {
  font-size: 2rem !important;
}

.font-size-22 {
  font-size: 2.2rem !important;
}

.font-size-24 {
  font-size: 2.4rem !important;
}

.font-size-26 {
  font-size: 2.6rem !important;
}

.font-size-28 {
  font-size: 2.8rem !important;
}

.font-size-29 {
  font-size: 2.9rem !important;
}

.font-size-30 {
  font-size: 3rem !important;
}

.font-size-31 {
  font-size: 3.1rem !important;
}

.font-size-32 {
  font-size: 3.2rem !important;
}

.font-size-33 {
  font-size: 3.3rem !important;
}

.font-size-34 {
  font-size: 3.4rem !important;
}

.text-white {
  color: #fff !important;
}

.text-black {
  color: #000 !important;
}

.text-extra-dark-gray {
  color: #232323;
}

.text-dark-gray {
  color: #626262;
}

.text-extra-medium-gray {
  color: #757575;
}

.text-medium-gray {
  color: #939393;
}

.text-extra-light-gray {
  color: #b7b7b7;
}

.text-light-gray {
  color: #d6d5d5;
}

.text-very-light-gray {
  color: #ededed;
}

.text-deep-pink {
  color: #ff214f;
}

.text-aqua {
  color: #21d0f6;
}

.text-aqua-light {
  color: #b5cfdf;
}

.text-blue {
  color: #439ff1;
}

.text-sky {
  color: #36c7c3;
}

.text-sky-light {
  color: #9ab2d1;
}

.text-orange {
  color: #fe860a;
}

blockquote {
  padding: 20px 30px;
}

blockquote p {
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 17px !important;
  font-weight: 300;
}

blockquote {
  border-left: 2px solid;
  padding: 15px 40px;
  margin: 45px 0;
}

blockquote footer {
  color: #939393;
}

.blog-image blockquote {
  padding: 60px;
  border: 0;
  margin: 0;
}

.blog-image blockquote h6:before {
  content: "\e67f";
  font-family: themify;
  font-size: 40px;
  top: 5px;
  position: relative;
  margin-right: 12px;
  color: #ff214f;
}

a.text-link-white,
a.text-link-white i {
  color: #fff;
}

a.text-link-white:focus,
a.text-link-white:focus i,
a.text-link-white:hover,
a.text-link-white:hover i {
  color: #ff214f;
}

a.text-link-black,
a.text-link-black i {
  color: #000;
}

a.text-link-dark-gray {
  color: #939393;
}

.text-link-dark-gray:focus,
a.text-link-dark-gray:hover,
a.text-link-extra-dark-gray {
  color: #232323;
}

a.text-link-extra-dark-gray:focus,
a.text-link-extra-dark-gray:hover {
  color: #000;
}

a.text-link-deep-pink,
a.text-link-deep-pink i {
  color: #ff214f;
}

a.text-link-deep-pink:focus,
a.text-link-deep-pink:focus i,
a.text-link-deep-pink:hover,
a.text-link-deep-pink:hover i {
  color: #fff;
}

a.text-white-hover:focus,
a.text-white-hover:hover {
  color: #fff !important;
}

a.text-black-hover:focus,
a.text-black-hover:hover {
  color: #000 !important;
}

a.text-deep-pink-hover:focus,
a.text-deep-pink-hover:hover {
  color: #ff214f !important;
}

a.text-extra-dark-gray-hover:hover {
  color: #232323 !important;
}

a.text-dark-gray-hover:hover {
  color: #626262 !important;
}

a.text-extra-medium-gray-hover:hover {
  color: #757575 !important;
}

a.text-medium-gray-hover:hover {
  color: #939393 !important;
}

a.text-extra-light-gray-hover:hover {
  color: #b7b7b7 !important;
}

a.text-light-gray-hover:hover {
  color: #d6d5d5 !important;
}

a.text-very-light-gray-hover:hover {
  color: #ededed !important;
}

.no-letter-spacing {
  letter-spacing: 0;
}

.letter-spacing-1 {
  letter-spacing: 1px;
}

.letter-spacing-2 {
  letter-spacing: 2px;
}

.letter-spacing-3 {
  letter-spacing: 3px;
}

.letter-spacing-4 {
  letter-spacing: 4px;
}

.letter-spacing-5 {
  letter-spacing: 5px;
}

.letter-spacing-6 {
  letter-spacing: 6px;
}

.letter-spacing-7 {
  letter-spacing: 7px;
}

.letter-spacing-8 {
  letter-spacing: 8px;
}

.letter-spacing-9 {
  letter-spacing: 9px;
}

.letter-spacing-10 {
  letter-spacing: 10px;
}

.letter-spacing-minus-05 {
  letter-spacing: -.5px;
}

.letter-spacing-minus-1 {
  letter-spacing: -1px;
}

.letter-spacing-minus-2 {
  letter-spacing: -2px;
}

.letter-spacing-minus-3 {
  letter-spacing: -3px;
}

.letter-spacing-minus-4 {
  letter-spacing: -4px;
}

.letter-spacing-minus-5 {
  letter-spacing: -5px;
}

.letter-spacing-minus-6 {
  letter-spacing: -6px;
}

.letter-spacing-minus-7 {
  letter-spacing: -7px;
}

.letter-spacing-minus-8 {
  letter-spacing: -8px;
}

.letter-spacing-minus-9 {
  letter-spacing: -9px;
}

.letter-spacing-minus-10 {
  letter-spacing: -10px;
}

.font-weight-100 {
  font-weight: 100;
}

.font-weight-200 {
  font-weight: 200;
}

.font-weight-300 {
  font-weight: 300;
}

.font-weight-400 {
  font-weight: 400;
}

.font-weight-500 {
  font-weight: 500;
}

.font-weight-600 {
  font-weight: 600;
}

.font-weight-700 {
  font-weight: 700;
}

.font-weight-800 {
  font-weight: 800;
}

.font-weight-900 {
  font-weight: 900;
}

.text-transform-unset {
  text-transform: unset;
}

.text-decoration-underline {
  text-decoration: underline;
}

.text-decoration-line-through {
  text-decoration: line-through;
}

.line-height-unset {
  line-height: unset;
}

.line-height-normal {
  line-height: normal;
}

.line-height-none {
  line-height: 0 !important;
}

.word-wrap {
  word-wrap: break-word;
}

.text-nowrap {
  white-space: nowrap;
}

.text-transform-none {
  text-transform: none;
}

.title-line-through {
  padding: 0 15px;
}

.text-middle-line {
  position: relative;
  white-space: nowrap;
}

.text-outside-line {
  position: relative;
}

.text-outside-line:before {
  left: auto;
  right: -60px;
}

.text-outside-line:after,
.text-outside-line:before {
  border-top: 1px solid;
  content: "";
  height: 0;
  position: absolute;
  top: 50%;
  width: 40px;
  opacity: .4;
}

.text-outside-line:after {
  left: auto;
  left: -60px;
}

.text-leftside-line {
  position: relative;
  padding-left: 35px;
}

.text-leftside-line:before {
  border-top: 1px solid;
  content: "";
  height: 0;
  left: auto;
  position: absolute;
  left: 0;
  top: 45%;
  width: 25px;
  opacity: .7;
}

.text-outside-line-full {
  position: relative;
  display: inline-block;
}

.text-outside-line-full:before {
  right: 100%;
  margin-right: 25px;
}

.text-outside-line-full:after,
.text-outside-line-full:before {
  content: "";
  position: absolute;
  top: 50%;
  height: 1px;
  width: 99%;
  display: block;
  border-bottom: 1px solid;
  opacity: .15;
}

.text-outside-line-full:after {
  left: 100%;
  margin-left: 25px;
}

.text-middle-line:before {
  border-bottom: 1px solid;
  position: absolute;
  content: "";
  width: 100%;
  top: 53%;
  opacity: .35;
}

.text-bottom-line {
  width: 1px;
  border-top: 30px solid;
  margin-left: auto;
  margin-right: auto;
}

.text-middle-line-deep-pink:before {
  border-bottom: 1px solid #ff214f;
  position: absolute;
  content: "";
  width: 100%;
  margin-top: 5px;
  margin-left: -20px;
  top: 50%;
  transform: translateY(-50%);
}

.text-decoration-line-through-black,
.text-decoration-line-through-deep-pink {
  position: relative;
}

.text-decoration-line-through-deep-pink:before {
  background: #ff214f;
}

.text-decoration-line-through-black:before {
  background: #000;
}

.text-decoration-line-through-black:before,
.text-decoration-line-through-deep-pink:before {
  content: "";
  height: 1px;
  left: -10px;
  position: absolute;
  top: 53%;
  width: calc(100%+20px);
  transform: translateY(-53%);
}

.line-height-10 {
  line-height: 1rem !important;
}

.line-height-13 {
  line-height: 1.3rem !important;
}

.line-height-14 {
  line-height: 1.4rem !important;
}

.line-height-15 {
  line-height: 1.5rem !important;
}

.line-height-16 {
  line-height: 1.6rem !important;
}

.line-height-18 {
  line-height: 1.8rem !important;
}

.line-height-20 {
  line-height: 2rem !important;
}

.line-height-22 {
  line-height: 2.2rem !important;
}

.line-height-24 {
  line-height: 2.4rem !important;
}

.line-height-26 {
  line-height: 2.6rem !important;
}

.line-height-28 {
  line-height: 2.8rem !important;
}

.line-height-30 {
  line-height: 3rem !important;
}

.line-height-31 {
  line-height: 3.1rem !important;
}

.line-height-35 {
  line-height: 3.5rem !important;
}

.line-height-36 {
  line-height: 3.6rem !important;
}
