﻿
.tf-container { position: relative; margin-left: auto; margin-right: auto; padding-right: 15px; padding-left: 15px; width: 1440px; max-width: 100%; }

.tf-blog { padding: 50px 0px; }
.detail-inner { margin-right: 30px; }
.detail-inner .image { margin-bottom: 31px; }
.detail-inner .title { display: flex; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; align-items: flex-start; justify-content: space-between; flex-direction: column; }
.detail-inner .content-inner { margin-bottom: 21px; }

.image-description { display: flex; justify-content: space-between; align-items: flex-start; margin: 10px 0px 30px 0px; padding: 0px; width: 100%; }
.full-image { width: 100%; }

.bist-campaign { background-color: var(--primary-color5); color: #141B22; padding: 5px 10px; border-radius: 13px; font-family: 'Alexandria', sans-serif; font-size: 14.8px; line-height: 37.2px; text-align: center; cursor: pointer; border-radius: 8px; font-weight: 600; display: inline-flex; align-items: center; gap: 10px; border: 1.34px solid #FFB800; }
.bist-campaign:hover { background-color: #080b0e; }
.bist-campaign:focus, .bist-campaign:focus-visible { background-color: var(--primary-color5); color: #141B22; outline: 2px solid #141B22; outline-offset: 2px; }
.bist-campaign:focus:not(:focus-visible) { outline: none; }

.header-content { display: flex; align-items: center; gap: 1rem; }
.header-content h1 { font-family: 'Alexandria', sans-serif; font-size: 40px; line-height: 42px; font-weight: 300; }

.breadcrumb { margin-top: 0.5rem; background-color: transparent; }
.breadcrumb a { font-family: 'Alexandria', sans-serif; font-size: 20px; font-weight: 300; color: #FBB034; text-decoration: none; }
.breadcrumb span { font-family: 'Alexandria', sans-serif; font-size: 20px; font-weight: 300; color: #FBB034; text-decoration: none; }

.tf-news { padding: 60px 0 60px; }
.tf-news .header-content h1 { font-family: 'Alexandria', sans-serif; font-size: 60px; line-height: 64px; font-weight: bolder; }
.tf-news .breadcrumb a { font-family: 'Alexandria', sans-serif; font-size: 20px; line-height: 20px; font-weight: 500; color: #FBB034; text-decoration: none; }
.tf-news .breadcrumb span { font-family: 'Alexandria', sans-serif; font-size: 20px; line-height: 20px; font-weight: 500; color: #FBB034; text-decoration: none; }
.news { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; }
.news-items { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 20px; }
.news-items li { background: var(--product-color20); padding: 20px; border-radius: 10px; display: flex; gap: 20px; transition: transform 0.3s ease, box-shadow 0.3s ease; justify-content: space-between; align-items: center; }
.news-items li a.news-link { font-family: 'Urbanist', sans-serif; font-size: 16.7px; font-weight: 700; line-height: 17px; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFFFFF; display: contents; }
.news-items li a.news-link .news-content-title .title { font-family: 'Alexandria', sans-serif; font-size: 13px; font-weight: 600; line-height: normal; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFFFFF; display: contents; }
.news-items li a.news-link .news-date { font-family: 'Alexandria', sans-serif; font-size: 10px; font-weight: 600; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #6E7A88; display: contents; }
.news-items li img { width: 223.08px; height: 109.83px; object-fit: cover; border-radius: 10px; }
.news-title { display: flex; justify-content: center; margin: 60px 0px; }
.news-title h3 { font-family: 'Urbanist', sans-serif; font-weight: 800; font-size: 38.3px; line-height: 44px; position: relative; display: inline-block; color: white; margin-bottom: 20px; padding-bottom: 0; }
.news-title h3::before { content: ""; position: absolute; height: 16px; background: linear-gradient(to right, #FFC700 0%, transparent); bottom: -1px; left: -4px; width: 70%; z-index: -1; border-radius: 2px; clip-path: polygon(10px -40%, 100% 0%, 100% 100%, 0% 100%); }
.news-content { display: flex; flex-direction: column; align-items: center; gap: 30px; }
.news-content-title { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-evenly; gap: 30px; }
.tf-news .breadcrumb { padding: .75rem 0; }
.tf-news .sub-title { font-family: 'Urbanist', sans-serif; font-weight: 200; font-size: 30px; line-height: 30px; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #6E7A88; }
.top-news { }
.top-news .news-items { width: 100%; margin: 120px 0 60px 0; }
.top-news .news-items li a.news-link .news-content-title .title { font-family: 'Alexandria', sans-serif; font-size: 40px; font-weight: 600; line-height: normal; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFFFFF; display: contents; }
.top-news .news-items li a.news-link .news-content-title .sub-title { font-family: 'Urbanist', sans-serif; font-size: 20px; font-weight: 300; line-height: 30px; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: var(--primary-color); }
.top-news .news-items li a.news-link .news-content-title .button { font-family: 'Alexandria', sans-serif; font-size: 24px; font-weight: 600; line-height: normal; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFB800; }
.top-news .news-items li .image { flex: 0 0 45%; display: flex; align-items: center; justify-content: center; }
.top-news .news-items li .image img { width: 512.55px; height: 356.09px; object-fit: cover; border-radius: 10px; }
.news-general-list { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin: 60px 0; }
.news-general-list .news-items li a.news-link .news-content-title .title { font-family: 'Alexandria', sans-serif; font-size: 19.75px; font-weight: 600; line-height: normal; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFFFFF; display: contents; }
.news-general-list .news-items li a.news-link .news-content-title .sub-title { font-family: 'Urbanist', sans-serif; font-size: 13.88px; font-weight: 300; line-height: 14.8px; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #F4F6F8; }
.news-general-list .news-items li a.news-link .news-content-title .button { font-family: 'Alexandria', sans-serif; font-size: 11.85px; font-weight: 600; line-height: normal; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFB800; }
.news-general-list .news-items li .image { flex: 0 0 45%; display: flex; align-items: center; justify-content: center; }
.news-general-list .news-items li img { aspect-ratio: 1.439 / 1; width: 523.08px; height: 173.83px; object-fit: cover; border-radius: 10px; }
.padding-0 { padding: 0px; }
.tf-blog .header-content h1 { font-family: 'Alexandria', sans-serif; font-size: 60px; line-height: 64px; font-weight: 700; }
.tf-blog .breadcrumb { margin: 3rem 0px; padding: 0px; background-color: transparent; }
.tf-blog .breadcrumb a { font-family: 'Alexandria', sans-serif; font-size: 20px; line-height: 20.1px; font-weight: 600; color: #FBB034; text-decoration: none; }
.tf-blog .breadcrumb span { font-family: 'Alexandria', sans-serif; font-size: 20px; font-weight: 600; color: #FBB034; text-decoration: none; }
.tf-news .image-description { display: flex; justify-content: center; align-items: center; margin: 10px 0px 60px 0px; padding: 0px; width: 100%; }
.tf-news .image-container h1 { font-family: 'Alexandria', sans-serif; font-size: 40px; font-weight: 600; line-height: normal; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFFFFF; display: contents; }
.tf-blog.tf-news .image img, .tf-blog.tf-news .image-container .image.full-image img { width: 100%; max-width: 1266px; height: auto; aspect-ratio: 1266 / 685; object-fit: contain; border-radius: 30px; margin: 0 auto; }
.tf-news .text-content .news-info { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 20px; }
.tf-news .text-content .news-info p { font-family: "Urbanist", sans-serif; font-size: 20px; font-weight: 300; line-height: 30px; text-underline-position: from-font; text-decoration-skip-ink: none; color: #F4F6F8; }
.tf-news .text-content .news-info p img { width: 15px; height: 15px; margin-bottom: 5px; }
.tf-blog.tf-news p { font-family: "Urbanist", sans-serif; font-size: 32px; font-weight: 300; line-height: 34px; text-underline-position: from-font; text-decoration-skip-ink: none; color: #FFFFFF; }
