@font-face { font-family: Gotham-Black; src: url('./fonts/Gotham-Black.otf'); }
@font-face { font-family: Gotham-BlackItalic; src: url('./fonts/Gotham-BlackItalic.otf'); }
@font-face { font-family: Gotham-Bold; src: url('./fonts/Gotham-Bold.otf'); }
@font-face { font-family: Gotham-BoldItalic; src: url('./fonts/Gotham-BoldItalic.otf'); }
@font-face { font-family: Gotham-Book; src: url('./fonts/Gotham-Book.otf'); }
@font-face { font-family: Gotham-BookItalic; src: url('./fonts/Gotham-BookItalic.otf'); }
@font-face { font-family: Gotham-Light; src: url('./fonts/Gotham-Light.otf'); }
@font-face { font-family: Gotham-LightItalic; src: url('./fonts/Gotham-LightItalic.otf'); }
@font-face { font-family: Gotham-Medium; src: url('./fonts/Gotham-Medium.otf'); }
@font-face { font-family: Gotham-MediumItalic; src: url('./fonts/Gotham-MediumItalic.otf'); }
@font-face { font-family: Gotham-Thin; src: url('./fonts/Gotham-Thin.otf'); }
@font-face { font-family: Gotham-ThinItalic; src: url('./fonts/Gotham-ThinItalic.otf'); }
@font-face { font-family: Gotham-Ultra; src: url('./fonts/Gotham-Ultra.otf'); }
@font-face { font-family: Gotham-UltraItalic; src: url('./fonts/Gotham-UltraItalic.otf'); }
@font-face { font-family: Gotham-XLight; src: url('./fonts/Gotham-XLight.otf'); }
@font-face { font-family: Gotham-XLightItalic; src: url('./fonts/Gotham-XLightItalic.otf'); }
@font-face { font-family: MADE-SAONARA-PERSONAL-USE; src: url('./fonts/MADE-SAONARA-PERSONAL-USE.otf'); }

/* hard fix */
.html-blog p,
.html-homepage p { line-height: 1.5; text-align: initial; text-align-last: initial; }
.html-blog .headerTop,
.html-homepage .headerTop { float: none; }
.html-blog header .wrapNav,
.html-homepage header .wrapNav { float: none; }

.html-blog  .blog-container,
.html-homepage .blog-container,
.html-blog .blog-container1091, 
.html-homepage .blog-container1091 { max-width: 1046px; width: 100%; margin: 0 auto; padding-left: 40px; padding-right: 40px; }
.html-blog .blog-container1091, 
.html-homepage .blog-container1091 { max-width: 1091px; }
.html-blog  .blog-container .blog-info-wrapper,
.html-homepage .blog-container .blog-info-wrapper { display: flex; align-items: center; height: 100%; }
.html-blog .blog-header, 
.html-homepage .blog-header { background: url('./images/banner@2x.png') no-repeat; background-size: cover; }
.html-blog .blog-header .blog-info, 
.html-homepage .blog-header .blog-info { background: #fff; border-radius: 5px; color: #5C6265; }
.html-blog .blog-header .blog-info a, 
.html-homepage .blog-header .blog-info a { color: #E5A142; }

.html-blog .blog-list, 
.html-homepage .blog-list { display: flex; flex-wrap: wrap; }
.html-blog .blog-item,
.html-homepage .blog-item { margin-top: 40px; }
.html-blog .blog-item .card, 
.html-homepage .blog-item .card { display: inline-block; }
.html-blog .blog-more-wrapper, 
.html-homepage .blog-more-wrapper { margin-top: 30px; margin-bottom: 100px; }

.html-blog .homepage-blog-section, 
.html-homepage .homepage-blog-section { color: #5C6265; }

.html-blog .blog-detail, 
.html-homepage .blog-detail { margin: 60px 0 72px 0; }
.html-blog .blog-detail .blog-detail-img-wrapper img, 
.html-homepage .blog-detail .blog-detail-img-wrapper img { width: 100%; }
.html-blog .blog-detail .blog-detail-body-wrapper, 
.html-homepage .blog-detail .blog-detail-body-wrapper { color: #5C6265; border-bottom: 1px solid #707070; }
.html-blog .blog-detail .blog-detail-body-wrapper .blog-socials-wrapper, 
.html-homepage .blog-detail .blog-detail-body-wrapper .blog-socials-wrapper { flex: 0 0 15%; margin-top: 30px; }
.html-blog .blog-detail .blog-detail-body-wrapper .blog-content-wrapper, 
.html-homepage .blog-detail .blog-detail-body-wrapper .blog-content-wrapper { flex: 0 0 85%; }

.html-blog .blog-detail .blog-detail-body-wrapper, 
.html-homepage .blog-detail .blog-detail-body-wrapper { margin-top: 40px; padding-bottom: 20px; }
.html-blog .blog-detail .blog-detail-body-wrapper .article-title, 
.html-homepage .blog-detail .blog-detail-body-wrapper .article-title { margin-bottom: 20px; }
.html-blog .blog-detail .blog-detail-body-wrapper .article-date, 
.html-homepage .blog-detail .blog-detail-body-wrapper .article-date { margin-bottom: 40px; }
.html-blog .blog-detail .blog-detail-body-wrapper p, 
.html-homepage .blog-detail .blog-detail-body-wrapper p { margin-bottom: 36px; }
.html-blog .blog-detail .blog-detail-body-wrapper h2, 
.html-homepage .blog-detail .blog-detail-body-wrapper h2 { margin-bottom: 0; }

.html-blog .blog-detail .related-article-wrapper, 
.html-homepage .blog-detail .related-article-wrapper { color: #5C6265; padding-top: 30px; }
.html-blog .blog-detail .blog-item, 
.html-homepage .blog-detail .blog-item { margin-top: 12px; }

/* common */
.html-blog .d-flex, 
.html-homepage .d-flex { display: flex; }
.html-blog .align-items-center, 
.html-homepage .align-items-center { align-items: center; }
.html-blog .h-100, 
.html-homepage .h-100 { height: 100%; }
.html-blog .m-0, 
.html-homepage .m-0 { margin: 0; }
.html-blog .mt-0, 
.html-homepage .mt-0 { margin-top: 0; }
.html-blog .mt-4, 
.html-homepage .mt-4 { margin-bottom: 4px; }
.html-blog .mb-0, 
.html-homepage .mb-0 { margin-bottom: 0; }
.html-blog .mb-1, 
.html-homepage .mb-1 { margin-bottom: 10px; }
.html-blog .mb-2, 
.html-homepage .mb-2 { margin-bottom: 20px; }
.html-blog .ml-1, 
.html-homepage .ml-1 { margin-left: 10px; }
.html-blog .p-2, 
.html-homepage .p-2 { padding: 20px; }
.html-blog .p-3, 
.html-homepage .p-3 { padding: 30px; }
.html-blog .pt-0, 
.html-homepage .pt-0 { padding-top: 0; }
.html-blog .px-2, 
.html-homepage .px-2 { padding-left: 20px; padding-right: 20px; }
.html-blog .py-3, 
.html-homepage .py-3 { padding-top: 30px; padding-bottom: 30px; }
.html-blog .py-4, 
.html-homepage .py-4 { padding-top: 40px; padding-bottom: 40px; }
.html-blog .text-center, 
.html-homepage .text-center { text-align: center; }
.html-blog .text-left, 
.html-homepage .text-left { text-align: left; }
.html-blog .btn2, 
.html-homepage .btn2 { border-radius: 5px; text-transform: uppercase; padding: 10px 22px; color: #fff; }
.html-blog .btn2-primary, .html-homepage .btn2-primary { background-color: #E5A142; }

.html-blog .card, 
.html-homepage .card { border-radius: 5px; text-align: left; text-align-last: left; }
.html-blog .card > img, 
.html-homepage .card > img { width: 100%; }
.html-blog .card .card-body, 
.html-homepage .card .card-body { color: #5C6265; }
.html-blog .card .card-body a, 
.html-homepage .card .card-body a { color: #E5A142; }

.html-blog .font-made-lg-42, 
.html-homepage .font-made-lg-42 { font-family: MADE-SAONARA-PERSONAL-USE !important; font-size: 42px !important; }
.html-blog .font-made-lg-24, 
.html-homepage .font-made-lg-24 { font-family: MADE-SAONARA-PERSONAL-USE !important; font-size: 24px !important; }
.html-blog .font-medium-lg-42, 
.html-homepage .font-medium-lg-42 { font-family: Gotham-Medium !important; font-size: 42px !important; }
.html-blog .font-medium-lg-36, 
.html-homepage .font-medium-lg-36 { font-family: Gotham-Medium !important; font-size: 36px !important; }
.html-blog .font-medium-lg-30, 
.html-homepage .font-medium-lg-30 { font-family: Gotham-Medium !important; font-size: 30px !important; }
.html-blog .font-medium-lg-24, 
.html-homepage .font-medium-lg-24 { font-family: Gotham-Medium !important; font-size: 24px !important; }
.html-blog .font-book-lg-21, 
.html-homepage .font-book-lg-21 { font-family: Gotham-Book !important; font-size: 21px !important; }
.html-blog .font-book-lg-26, 
.html-homepage .font-book-lg-26 { font-family: Gotham-Book !important; font-size: 26px !important; }
.html-blog .font-book-lg-18, 
.html-homepage .font-book-lg-18 { font-family: Gotham-Book !important; font-size: 18px !important; }
.html-blog .font-book-lg-16, 
.html-homepage .font-book-lg-16 { font-family: Gotham-Book !important; font-size: 16px !important; }
.html-blog .font-book-lg-15, 
.html-homepage .font-book-lg-15 { font-family: Gotham-Book !important; font-size: 15px !important; }
.html-blog .font-bold-lg-24, 
.html-homepage .font-bold-lg-24 { font-family: Gotham-bold !important; font-size: 24px !important; }

/* desktop */
@media (min-width: 576px) {
    .html-blog .blog-header .blog-info, 
    .html-homepage .blog-header .blog-info { flex: 0 0 50%; margin: 100px 0; }

    .html-blog .blog-item,
    .html-homepage .blog-item { flex: 0 0 33.333%; margin-top: 40px; }
    .html-blog .blog-item:nth-child(3n+2), 
    .html-homepage .blog-item:nth-child(3n+2) { text-align: center; }
    .html-blog .blog-item:nth-child(3n+3), 
    .html-homepage .blog-item:nth-child(3n+3) { text-align: right; }

    .html-blog .card, 
    .html-homepage .card { max-width: 300px; }

    .html-blog .blog-detail .blog-detail-body-wrapper, 
    .html-homepage .blog-detail .blog-detail-body-wrapper { display: flex; }
}

/* mobile */
@media (max-width: 576px) {
    .html-blog .blog-header .blog-info, 
    .html-homepage .blog-header .blog-info { margin: 50px 0; }

    .html-blog .blog-detail .blog-detail-body-wrapper .blog-socials-wrapper p, 
    .html-homepage .blog-detail .blog-detail-body-wrapper .blog-socials-wrapper p { display: inline-block; margin-right: 20px; }
}

.award-box {
    padding: 20px 10px;
}
.award-box img {
    height: 225px;
    max-width: calc(100% - 20px);
    object-fit: contain;
}