.breadcrumbs-bg {
    height: 250px;
    max-height: -moz-fit-content;
    max-height: fit-content;
    position: relative;
    overflow: hidden
}

.breadcrumbs-bg>img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

.breadcrumbs {
    font-size: 13px
}

.breadcrumbs>li {
    color: var(--text-color);
    position: relative
}

.breadcrumbs>li>a:hover {
    color: var(--text-color-1)
}

.breadcrumbs>li:not(:last-child):after {
    content: "|";
    color: var(--text-color);
    font-size: 13px;
    position: absolute;
    top: 0;
    right: -10px
}

.breadcrumbs>li.current {
    font-weight: 500
}

.pagination {
    font-size: 15px
}

.pagination>li>:where(a,span:not(.sr-only)) {
    width: 100%;
    height: 100%;
    color: var(--text-color);
    border: 1px solid #0003;
    border-radius: 9999px;
    justify-content: center;
    align-items: center;
    display: flex
}

:where(.dark,.dark *) .pagination>li>:where(a,span:not(.sr-only)) {
    border: 1px solid #fff3
}

.pagination>li>:where(a,span:not(.sr-only)):hover {
    border-color: var(--text-color-1);
    color: var(--text-color-1)
}

.pagination>li>.current {
    background-color: var(--text-color-1);
    border-color: var(--text-color-1);
    color: #fff
}

.pagination>li>.dots {
    border-color: #0000!important
}

[id^=gallery-] {
    flex-flow: wrap;
    gap: .75rem;
    margin-top: 24px;
    margin-bottom: 24px;
    display: flex
}

@media only screen and (min-width: 48rem) {
    [id^=gallery-] {
        gap:1.5rem
    }
}

[id^=gallery-]>.gallery-item {
    flex: 1 0 auto;
    max-width: 100%;
    margin: 0;
    padding: 0
}

[id^=gallery-]>.gallery-item .gallery-icon {
    height: 100%
}

@media only screen and (max-width: 47.9988rem) {
    [id^=gallery-]>.gallery-item {
        width:100%!important
    }
}

[id^=gallery-].gallery-columns-1>.gallery-item {
    width: 100%
}

[id^=gallery-].gallery-columns-1>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-1>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-2>.gallery-item {
    width: calc(50% - .75rem)
}

[id^=gallery-].gallery-columns-2>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-2>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-3>.gallery-item {
    width: calc(33.3333% - 1rem)
}

[id^=gallery-].gallery-columns-3>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-3>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-4>.gallery-item {
    width: calc(25% - 1.125rem)
}

[id^=gallery-].gallery-columns-4>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-4>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-5>.gallery-item {
    width: calc(20% - 1.2rem)
}

[id^=gallery-].gallery-columns-5>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-5>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-6>.gallery-item {
    width: calc(16.6667% - 1.25rem)
}

[id^=gallery-].gallery-columns-6>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-6>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-7>.gallery-item {
    width: calc(14.2857% - 1.28571rem)
}

[id^=gallery-].gallery-columns-7>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-7>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-8>.gallery-item {
    width: calc(12.5% - 1.3125rem)
}

[id^=gallery-].gallery-columns-8>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-8>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-9>.gallery-item {
    width: calc(11.1111% - 1.33333rem)
}

[id^=gallery-].gallery-columns-9>.gallery-item a {
    height: 100%;
    display: block
}

[id^=gallery-].gallery-columns-9>.gallery-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: block
}

.section.singular .all_category_time_post .terms-links {
    text-transform: uppercase;
    gap: 12px;
    font-size: 11px;
    display: flex
}

.section.singular .all_category_time_post .terms-links svg {
    display: none
}

.section.singular .all_category_time_post .terms-links a {
    color: #fff;
    background-color: var(--color-primary);
    white-space: nowrap;
    text-overflow: ellipsis;
    border: 1px solid #0000;
    border-radius: 9999px;
    flex: auto;
    justify-content: center;
    align-items: center;
    gap: 8px;
    max-width: 280px;
    padding: 4px 12px 3px;
    font-size: 11px;
    font-weight: 500;
    transition: box-shadow .3s;
    display: flex;
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 25px -5px #fe52424d,0 10px 10px -5px #fe52424d
}

.section.singular .all_category_time_post .terms-links a:hover {
    box-shadow: 0 10px 15px -3px #fe5242cc,0 4px 6px -2px #fe5242cc
}

.section.singular .meta .views-svg {
    cursor: pointer;
    background: #f2ecfc;
    border-radius: 6px;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    display: flex
}

.section.singular .sidebar .sidebar-inner {
    position: sticky;
    top: 145px
}

.section.singular .content {
    flex: 1 1 0%;
    min-width: 0
}

.section.singular .content article #toc_container {
    display: none
}

.section.singular .sidebar-toc .sidebar-inner {
    position: sticky;
    top: 145px
}

.section.singular .sidebar-toc #toc_container {
    box-shadow: none;
    background: 0 0;
    border: none;
    padding: 0
}

.section.singular .sidebar-toc #toc_container .toc_title {
    padding: 0;
    font-size: 17px;
    font-weight: 700
}

.section.singular .sidebar-toc #toc_container .toc_title:before,.section.singular .sidebar-toc #toc_container .toc_title:after {
    content: none
}

.section.singular .sidebar-toc #toc_container .toc_title .toc_toggle {
    background: var(--color-primary);
    border-radius: 50%;
    width: 24px;
    height: 24px
}

.section.singular .sidebar-toc #toc_container .toc_title .toc_toggle a:after {
    background-color: #fff
}

.section.singular .sidebar-toc #toc_container .toc_list {
    scrollbar-width: none;
    -ms-overflow-style: none;
    max-height: calc(100vh - 200px);
    margin-left: 0;
    padding-left: 24px;
    position: relative;
    overflow-y: auto
}

.section.singular .sidebar-toc #toc_container .toc_list::-webkit-scrollbar {
    display: none
}

.section.singular .sidebar-toc #toc_container .toc_list:before {
    content: "";
    background-color: #0000001a;
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 3px
}

.section.singular .sidebar-toc #toc_container .toc_list li {
    position: relative
}

.section.singular .sidebar-toc #toc_container .toc_list li a {
    font-size: 14px;
    font-weight: 400;
    transition: color .3s
}

.section.singular .sidebar-toc #toc_container .toc_list li a.active,.section.singular .sidebar-toc #toc_container .toc_list li.active>a {
    color: var(--text-color-1)
}

.section.singular .sidebar-toc #toc_container .toc_list>li:before {
    content: "";
    background-color: #000;
    border-radius: 50%;
    width: 6px;
    height: 6px;
    position: absolute;
    top: 15px;
    left: -23px
}

.section.singular .sidebar-toc #toc_container .toc_list>li>a {
    font-size: 16px;
    font-weight: 500
}

.section.singular .sidebar-toc #toc_container .toc_list>li.active:before {
    background-color: var(--color-primary)
}

.section.singular .entry-content .excerpt {
    margin-bottom: 24px;
    font-weight: 500
}

@media only screen and (min-width: 64rem) {
    .section.singular .entry-content .excerpt {
        margin-bottom:32px
    }
}

.section.singular .entry-content :where(h1,h2,h3,h4,h5,h6) {
    margin-bottom: 16px;
    font-weight: 600
}

.section.singular .entry-content h6 {
    font-size: 16px
}

.section.singular .entry-content h5,.section.singular .entry-content h4 {
    font-size: max(1rem,min(.866071rem + .334821vw,1.1875rem))
}

.section.singular .entry-content h3 {
    font-size: max(1.0625rem,min(.794643rem + .669643vw,1.4375rem))
}

.section.singular .entry-content h2 {
    font-size: max(1.1875rem,min(.785714rem + 1.00446vw,1.75rem))
}

.section.singular .entry-content h1 {
    font-size: max(1.625rem,min(.955357rem + 1.67411vw,2.5625rem))
}

.section.singular .entry-content .h6 {
    font-size: 16px
}

.section.singular .entry-content .h5,.section.singular .entry-content .h4 {
    font-size: max(1rem,min(.866071rem + .334821vw,1.1875rem))
}

.section.singular .entry-content .h3 {
    font-size: max(1.0625rem,min(.794643rem + .669643vw,1.4375rem))
}

.section.singular .entry-content .h2 {
    font-size: max(1.1875rem,min(.785714rem + 1.00446vw,1.75rem))
}

.section.singular .entry-content .h1 {
    font-size: max(1.625rem,min(.955357rem + 1.67411vw,2.5625rem))
}

.section.singular .entry-content :where(ul,ol) {
    margin-bottom: 16px;
    margin-left: 24px
}

.section.singular .entry-content :where(ul,ol) li {
    padding-block-start:4px;padding-block-end:4px}

.section.singular .entry-content ul {
    list-style: outside
}

.section.singular .entry-content ol {
    list-style: decimal
}

.section.singular .entry-content img {
    border-radius: var(--radius-md,6px);
    height: auto
}

.section.singular .entry-content figure figcaption {
    padding-top: 12px;
    font-size: 14px;
    font-weight: 500
}

.section.singular .entry-content blockquote {
    margin-bottom: 32px;
    padding: 24px 12px 24px 40px;
    font-style: italic;
    font-weight: 500;
    position: relative
}

.section.singular .entry-content blockquote:before {
    content: "";
    background-color: var(--text-color-1);
    width: 2rem;
    height: 2rem;
    position: absolute;
    top: 4px;
    left: 0;
    transform: scaleX(-1)scaleY(-1);
    -webkit-mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M6%206a2%202%200%200%200-2%202v3a2%202%200%200%200%202%202h3a3%203%200%200%201-3%203H5a1%201%200%201%200%200%202h1a5%205%200%200%200%205-5V8a2%202%200%200%200-2-2zm9%200a2%202%200%200%200-2%202v3a2%202%200%200%200%202%202h3a3%203%200%200%201-3%203h-1a1%201%200%201%200%200%202h1a5%205%200%200%200%205-5V8a2%202%200%200%200-2-2z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E);
    mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%20d%3D%22M6%206a2%202%200%200%200-2%202v3a2%202%200%200%200%202%202h3a3%203%200%200%201-3%203H5a1%201%200%201%200%200%202h1a5%205%200%200%200%205-5V8a2%202%200%200%200-2-2zm9%200a2%202%200%200%200-2%202v3a2%202%200%200%200%202%202h3a3%203%200%200%201-3%203h-1a1%201%200%201%200%200%202h1a5%205%200%200%200%205-5V8a2%202%200%200%200-2-2z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

.section.singular .nocomments {
    border-left: 4px solid var(--text-color-1);
    padding-left: 16px;
    border-radius: var(--radius-sm,4px);
    background-color: #0000000d;
    margin-top: 32px;
    padding-block-start:12px;padding-block-end:12px;font-size: 15px
}

:where(.dark,.dark *) .section.singular .nocomments {
    background-color: #ffffff0d
}

#toc_container {
    border-radius: var(--radius-md,var(--radius-md,6px));
    background-color: #f4f4f4;
    border: 1px solid #0000001f;
    max-width: 600px;
    margin: 0 auto 24px;
    padding: 24px;
    box-shadow: inset 0 0 12px #0000000f;
    width: 100%!important
}

:where(.dark,.dark *) #toc_container {
    background-color: #1d1d1d;
    border: 1px solid #ffffff1f;
    box-shadow: inset 0 0 12px #ffffff0f
}

#toc_container .toc_title {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
    padding-left: 52px;
    font-size: max(1rem,min(.866071rem + .334821vw,1.1875rem));
    font-weight: 500;
    display: flex;
    position: relative
}

#toc_container .toc_title:before {
    content: "";
    z-index: 1;
    background-color: #fff;
    border-radius: 50%;
    width: 1.75rem;
    height: 1.75rem;
    padding: 12px;
    position: absolute;
    top: 50%;
    left: 6px;
    transform: translateY(-50%);
    -webkit-mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M10.779%2017.779L4.36%2019.918L6.5%2013.5m4.279%204.279l8.364-8.643a3.027%203.027%200%200%200-2.14-5.165a3.03%203.03%200%200%200-2.14.886L6.5%2013.5m4.279%204.279L6.499%2013.5m2.14%202.14l6.213-6.504M12.75%207.04L17%2011.28%22%2F%3E%3C%2Fsvg%3E);
    mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M10.779%2017.779L4.36%2019.918L6.5%2013.5m4.279%204.279l8.364-8.643a3.027%203.027%200%200%200-2.14-5.165a3.03%203.03%200%200%200-2.14.886L6.5%2013.5m4.279%204.279L6.499%2013.5m2.14%202.14l6.213-6.504M12.75%207.04L17%2011.28%22%2F%3E%3C%2Fsvg%3E);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

#toc_container .toc_title:after {
    content: "";
    background-color: var(--text-color-1);
    border-radius: 50%;
    width: 2.5rem;
    height: 2.5rem;
    position: absolute;
    left: 0;
    box-shadow: 3px 1px 12px #fe524233
}

#toc_container .toc_toggle {
    width: 2rem;
    height: 2rem;
    position: relative
}

#toc_container .toc_toggle .toc_brackets {
    display: none
}

#toc_container .toc_toggle>a {
    font-size: 0
}

#toc_container .toc_toggle>a:after {
    content: "";
    background-color: var(--text-color);
    width: 100%;
    height: 100%;
    transition: rotate .15s ease-in-out;
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    -webkit-mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22m16%2014l-4-4l-4%204%22%2F%3E%3C%2Fsvg%3E);
    mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22m16%2014l-4-4l-4%204%22%2F%3E%3C%2Fsvg%3E);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

#toc_container .toc_list {
    scrollbar-width: thin;
    max-height: 400px;
    margin-top: 20px;
    margin-bottom: 0;
    margin-left: 12px;
    list-style: none;
    overflow: auto
}

#toc_container .toc_list li {
    padding-block-start:0!important;padding-block-end:0!important}

#toc_container .toc_list li a {
    align-items: baseline;
    gap: 8px;
    padding-block-start:5px;padding-block-end:5px;font-size: 15px;
    display: flex
}

#toc_container .toc_list li a .toc_number {
    font-size: 13px;
    font-weight: 500;
    text-decoration: underline
}

#toc_container .toc_list li a:hover {
    color: var(--text-color-1)
}

#toc_container .toc_list li>ul {
    margin-bottom: 0;
    margin-left: 12px;
    list-style: none
}

#toc_container.contracted .toc_toggle>a:after {
    transform-origin: 50%;
    rotate: 180deg
}

#toc_container.contracted .toc_list {
    display: none
}

.suggestion-list ul {
    margin-left: 0!important;
    list-style: none!important
}

.suggestion-list ul li {
    padding-left: 36px;
    font-size: 15px;
    position: relative
}

.suggestion-list ul li:before {
    content: "";
    background-color: var(--text-color-1);
    width: 2.25rem;
    height: 2.25rem;
    transition: opacity .15s ease-in-out;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    -webkit-mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2236%22%20height%3D%2236%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212.1%22%20cy%3D%2212.1%22%20r%3D%221%22%2F%3E%3C%2Fsvg%3E);
    mask-image: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2236%22%20height%3D%2236%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212.1%22%20cy%3D%2212.1%22%20r%3D%221%22%2F%3E%3C%2Fsvg%3E);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat
}

.suggestion-list ul li .title {
    font-weight: 500
}

.suggestion-list ul li .title:hover {
    color: var(--text-color-1)
}

:where(.terms-links,.hashtag-links) {
    margin-top: 16px
}

:where(.terms-links,.hashtag-links) svg {
    color: var(--text-color-1)
}

:where(.terms-links,.hashtag-links) a {
    border-radius: var(--radius-sm,4px);
    border: 1px solid #0003;
    padding: 1px 12px;
    font-size: 14px;
    font-weight: 500
}

:where(.dark,.dark *) :where(.terms-links,.hashtag-links) a {
    border: 1px solid #fff3
}

:where(.terms-links,.hashtag-links) a:hover {
    color: var(--text-color-1)
}

.section.section-author {
    border-top: 1px solid #0000001a
}

:where(.dark,.dark *) .section.section-author {
    border-top: 1px solid #ffffff1a
}

.section.section-author .author-desc {
    font-weight: 300!important
}

.section.section-author .author-desc :where(h2,h3,h4,h5,h6,b,strong) {
    font-weight: 600!important
}

.section.section-related .swiper .swiper-slide {
    width: calc(83.3333% - .125rem);
    height: auto
}

@media only screen and (min-width: 40rem) {
    .section.section-related .swiper .swiper-slide {
        width:calc(50% - .75rem)
    }
}

@media only screen and (min-width: 64rem) {
    .section.section-related .swiper .swiper-slide {
        width:calc(33.3333% - 1rem)
    }
}

.section.section-du-an .tp-portfolio-heading .tp-section-subtitle {
    text-transform: uppercase;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    display: flex;
    position: relative
}

@media only screen and (max-width: 47.9988rem) {
    .section.section-du-an .tp-portfolio-heading .tp-section-subtitle {
        font-size:16px
    }
}

.section.section-du-an .tp-portfolio-heading .tp-section-subtitle:before {
    content: "";
    background-color: #fe5242;
    border-radius: 4px;
    width: 8px;
    height: 8px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%)
}

@media only screen and (max-width: 63.9988rem) {
    .section-du-an.archive .filter-menu {
        text-align:center
    }

    .section-du-an.archive .filter-menu>div {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        display: flex
    }

    .section-du-an.archive .filter-menu .tp-portfolio-inner {
        height: 0;
        overflow: hidden
    }
}

.section-du-an.archive .filter-title {
    position: relative
}

@media only screen and (max-width: 63.9988rem) {
    .section-du-an.archive .tp-portfolio-inner {
        flex-flow:wrap;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-bottom: 20px;
        display: flex
    }
}

.section-du-an.archive .tp-portfolio-inner .tp-portfolio-item {
    padding-left: 32px;
    font-size: 15px;
    transition: all .3s ease-out;
    display: block;
    position: relative
}

.section-du-an.archive .tp-portfolio-inner .tp-portfolio-item:after {
    content: "";
    opacity: .25;
    border: 1px solid #000;
    border-radius: 100px;
    width: 18px;
    height: 18px;
    transition: opacity .3s;
    display: block;
    position: absolute;
    top: 5px;
    left: 0;
    transform: none;
    background: 0 0!important
}

.section-du-an.archive .tp-portfolio-inner .tp-portfolio-item:before {
    content: "";
    background-color: #000;
    border-radius: 100px;
    width: 10px;
    height: 10px;
    transition: transform .3s;
    display: block;
    position: absolute;
    top: 9px;
    left: 4px;
    transform: scale(0)
}

.section-du-an.archive .tp-portfolio-inner .tp-portfolio-item.active:before {
    transform: scale(1)
}