:root {
    --news__primary-color: rgb(21 128 61);
}

html {
    scroll-behavior: smooth;
}

.news__text-muted {
    color: #6c757d;
    font-size: 14px;
}

.news__list-by-cate {
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding: 1rem;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

@media (min-width: 640px) {
    .news__list-by-cate {
        width: 75%
    }
}

@media (min-width: 1024px) {
    .news__list-by-cate {
        width: 50%
    }
}

.news__list-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap
}

.news__list-breadcrumbs--link {
    font-weight: 600;
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity));
    -webkit-text-decoration-line: none;
    text-decoration-line: none
}

.news__list-breadcrumbs--link:hover {
    --tw-text-opacity: 1;
    color: rgb(21 128 61 / var(--tw-text-opacity))
}

.news__list-breadcrumbs--separator {
    display: inline;
    height: 1rem;
    width: 1rem;
    overflow: visible;
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity))
}

.news__list-posts {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-top: 0.5rem;
    display: flex;
    list-style-type: none;
    flex-direction: column;
    gap: 2rem;
    padding-left: 0px
}

.news__post-item {
    display: flex;
    align-items: center;
    gap: 0.5rem
}

@media (min-width: 768px) {
    .news__post-item {
        gap: 1rem
    }
}

.news__post-item a {
    min-width: fit-content;
}

.news__post-item--image {
    height: 5rem;
    width: 7rem;
    border-radius: 0.25rem;
    -o-object-fit: cover;
    object-fit: cover;
    min-width: 7rem;
    cursor: pointer;
}

@media (min-width: 768px) {
    .news__post-item--image {
        height: 8rem;
        width: 13rem;
        min-width: 13rem;
    }
}

.news__post-item--info {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    flex-grow: 1
}

.news__post-item--title {
    font-weight: 600;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity));
    -webkit-text-decoration-line: none;
    text-decoration-line: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.news__post-item--title:hover {
    --tw-text-opacity: 1;
    color: rgb(21 128 61 / var(--tw-text-opacity))
}

@media (min-width: 1024px) {
    .news__post-item--title {
        font-size: 1.125rem;
        line-height: 1.3rem
    }
}

.news__posts-item--date {
    margin-top: 0.25rem;
    font-size: 0.75rem;
    line-height: 1rem;
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity));
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.news__posts-item--date svg {
    display: inline;
    height: 1rem;
    width: 1rem;
    vertical-align: bottom
}

.news__post-item--brief {
    margin: 0px;
    margin-top: 0.5rem;
    display: none;
    font-size: 0.875rem;
    line-height: 1.25rem;
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity))
}

@media (min-width: 768px) {
    .news__post-item--brief {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden
    }
}

.news__detail-item {
    width: 100%
}

@media (min-width: 640px) {
    .news__detail-item {
        max-width: 640px
    }
}

@media (min-width: 768px) {
    .news__detail-item {
        max-width: 768px
    }
}

@media (min-width: 1024px) {
    .news__detail-item {
        max-width: 1024px
    }
}

@media (min-width: 1280px) {
    .news__detail-item {
        max-width: 1280px
    }
}

@media (min-width: 1536px) {
    .news__detail-item {
        max-width: 1536px
    }
}

.news__detail-item {
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding: 0.5rem;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

@media (min-width: 1024px) {
    .news__detail-item {
        padding: 1rem
    }
}

.news__detail-item * {
    box-sizing: border-box
}

.news__detail-info {
    margin-top: 1rem;
    margin-bottom: 1rem
}

.news__detail-info > .news__list-breadcrumbs {
    font-size: 0.75rem;
    line-height: 1rem
}

.news__detail-title {
    margin-bottom: 0px;
    margin-top: 1rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

@media (min-width: 1024px) {
    .news__detail-title {
        font-size: 1.875rem;
        line-height: 2.125rem;
    }
}

.news__detail-title.no-right-content {
    text-align: center;
}

.news__detail-row {
    display: flex;
    flex-wrap: wrap
}

.news__detail-left {
    width: 100%;
    margin: 0 auto
}

@media (min-width: 1024px) {
    .news__detail-left {
        width: 66.666667%;
    }
}

.news__detail-right {
    width: 100%;
    margin: 0 auto
}

@media (min-width: 1024px) {
    .news__detail-right {
        width: 33.333333%;
        padding-left: 1rem
    }
}

.news__detail-main {
    display: flex;
    flex-direction: column;
    row-gap: 0.25rem;
    border-radius: 0.25rem;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    padding: 0.5rem;
    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

@media (min-width: 1024px) {
    .news__detail-main {
        padding: 1rem
    }
}

.news__detail-date {
    font-size: 0.75rem;
    line-height: 1rem;
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity));
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.news__detail-date svg {
    display: inline;
    height: 1rem;
    width: 1rem;
    vertical-align: bottom
}

.news__detail-thumbnail {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
    max-height: 24rem;
    border-radius: 0.25rem;
    -o-object-fit: cover;
    object-fit: cover
}

.news__detail-desc {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500
}

.news__detail-same-domain > .news__list-by-cate,
.news__detail-related > .news__list-by-cate {
    width: 100%;
    padding-left: 0px;
    padding-right: 0px
}

@media (min-width: 1024px) {
    .news__detail-related .news__list-by-cate .news__post-item--brief {
        display: none
    }
}

@media (min-width: 1280px) {
    .news__detail-related .news__list-by-cate .news__post-item--brief {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden
    }
}

@media (min-width: 1024px) {
    .news__detail-related .news__list-by-cate .news__post-item--image {
        height: 5rem;
        width: 7rem;
        object-fit: cover;
        min-width: 7rem;
    }
}

@media (min-width: 1280px) {
    .news__detail-related .news__list-by-cate .news__post-item--image {
        height: 8rem;
        width: 13rem;
        object-fit: cover;
        min-width: unset;
    }
}

.news__detail-content figcaption {
    text-align: center;
    font-size: 12px;
    font-style: italic;
    line-height: 1.3;
    margin-top: 3px;
}

.news__detail-content ul {
    list-style: disc;
    margin-left: 1.5rem;
    margin-bottom: 1.5rem
}

.news__detail-content h1 {
    font-size: 2rem;
}

.news__detail-content h2 {
    font-size: 1.75rem;
}

.news__detail-content h3 {
    font-size: 1.5rem;
}

.news__detail-content h4 {
    font-size: 1.25rem;
}

.news__detail-content h5 {
    font-size: 1rem;
}

.news__detail-content h6 {
    font-size: 0.75rem;
}

.news__detail-content figure.table,
.news__detail-content table {
    width: 100%;
    border-collapse: collapse;
}

.news__detail-content table,
.news__detail-content th,
.news__detail-content td {
    border: 1px solid #c1c1c1;
}

.news__detail-content th,
.news__detail-content td {
    padding: 3px 5px;
    font-size: 14px;
}

.news__detail-content a:hover {
    color: rgb(5 122 85 / 1);
}

.news__detail-content img {
    object-fit: cover;
    margin-top: 10px;
    margin-bottom: 10px;
}

.news__detail-content figure.image {
    margin-right: auto;
    margin-left: auto;
}

.news__detail-content figure.image.image-style-side {
    margin-right: 0;
    margin-left: auto;
}

.news__detail-content .text-tiny {
    font-size: 0.75rem;
}

.news__detail-content .text-small {
    font-size: 0.875rem;
}

.news__detail-content .text-big {
    font-size: 1.125rem;
}

.news__detail-content .text-huge {
    font-size: 1.25rem;
}

.news__list-categories {
    display: flex;
    flex-direction: column;
}

.news__category-item {
    padding: 10px 0;
    font-weight: 500;
    color: rgb(62, 66, 76);
}

.news__category-item:hover {
    color: rgb(5 122 85 / 1);
}

.news__category-item:not(:last-child) {
    border-bottom: 1px solid #c1c1c1;
    max-width: 10rem;
}

.news__paging {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-top: 2rem;
    gap: 0.5rem;
}

@media (min-width: 768px) {
    .news__paging {
        flex-direction: row;
    }
}

.news__paging-title {
    font-size: 0.875rem;
    color: rgb(107, 112, 121);
}

.news__page {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    height: 2.1rem;
    border-radius: 0.25rem;
    background-color: rgb(255 255 255);
    box-shadow: 0 0.8rem 2rem rgb(90 97 129 / 5%);
}

.news__page-numbers, .news__page-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0.4rem;
    font-size: 0.875rem;
    cursor: pointer;
}

.news__page-btn,
.news__page-numbers:hover {
    color: var(--news__primary-color);
}

.news__page-numbers,
.news__page-btn {
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 0.25rem;
}

.news__page-numbers.active {
    color: rgb(255, 255, 255);
    background: var(--news__primary-color);
    font-weight: 600;
    border: 1px solid var(--news__primary-color);
}
img{
    max-width: 100%;
}
@media (max-width: 768px) {
    .news__list-by-cate{
        margin: 0;
    }
}

.news__detail-item figure {
    z-index: 1 !important;
}
