.re__border--std {
    border: 1px solid #F2F2F2;
    border-radius: 4px;
    box-sizing: border-box
}

@keyframes gradient-animation-card-skeleton {
    from {
        left: 0%
    }

    to {
        left: 100%
    }
}

.clear-both::after {
    content: "";
    clear: both;
    display: block
}

.re__clear-box {
    display: block;
    clear: both;
    height: 16px
}

.re__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    display: block;
    background: rgba(0, 0, 0, 0.3);
    -webkit-backdrop-filter: blur(64px);
    backdrop-filter: blur(64px)
}

.visible-hidden {
    visibility: hidden
}

.visible {
    visibility: visible
}

.display-none {
    display: none
}

.display-block {
    display: block
}

.re__divide {
    content: " ";
    display: block;
    height: 1px;
    line-height: 1px;
    background: #F2F2F2;
    width: 100%
}

.re__divide::after {
    content: "";
    clear: both;
    display: block
}

.re__divide-8 {
    content: " ";
    display: block;
    height: 8px;
    line-height: 8px;
    background: #F2F2F2;
    width: 100%
}

.re__divide-8::after {
    content: "";
    clear: both;
    display: block
}

.re__mar-v-24 {
    margin-top: 24px;
    margin-bottom: 24px
}

.re__mar-b-24 {
    margin-bottom: 24px
}

.re__vertical-align-middle {
    display: table
}

.re__vertical-align-middle>* {
    display: table-cell;
    vertical-align: middle
}

.re__bg-grey {
    background-color: #F2F2F2
}

.re__bg-grey-50 {
    background-color: rgba(242, 242, 242, 0.5)
}

.re__bg-media {
    background-color: unset;
    z-index: 9999
}

.re__nowrap {
    white-space: nowrap
}

img.lazyload {
    content: url(/images/common/lazyload-preview.svg);
    object-fit: cover
}

img.lazyloading {
    background-color: #F2F2F2
}

.no-photo-md {
    content: url(/images/common/no-photo-pixiu-md.svg);
    object-fit: scale-down !important;
    background-color: #F2F2F2;
    display: inline-block;
    width: 100%;
    height: 100%
}

.no-photo-sm {
    content: url(/images/common/no-photo-sisu-sm.svg);
    object-fit: scale-down !important;
    background-color: #F2F2F2;
    display: inline-block;
    width: 100%;
    height: 100%
}

.no-photo-xs {
    content: url(/images/common/no-photo-sisu-xs.svg);
    object-fit: scale-down !important;
    background-color: #F2F2F2;
    display: inline-block;
    width: 100%;
    height: 100%
}

.error-photo-md {
    content: url(/images/common/error-photo-pixiu-md.svg);
    object-fit: scale-down !important;
    background-color: #F2F2F2;
    display: inline-block;
    width: 100%;
    height: 100%
}

.error-photo-sm {
    content: url(/images/common/error-photo-sm.svg);
    object-fit: scale-down !important;
    background-color: #F2F2F2;
    display: inline-block;
    width: 100%;
    height: 100%
}

.error-photo-xs {
    content: url(/images/common/error-photo-xs.svg);
    object-fit: scale-down !important;
    background-color: #F2F2F2;
    display: inline-block;
    width: 100%;
    height: 100%
}

.re__footer-link {
    position: relative;
    display: block;
    padding: 24px 16px;
    margin: auto;
    background: #fff;
    border-top: 1px solid #F2F2F2;
    clear: both;
    width: auto
}

.re__footer-link .re__footer-link-items:not(.re__active) {
    max-height: 444px
}

.re__footer-link .re__footer-link-items {
    overflow: hidden;
    transition: height 0.5s ease
}

.re__footer-link .re__footer-link-items>ul::after {
    content: "";
    clear: both;
    display: block
}

.re__footer-link .re__footer-link-items>ul>li {
    display: block;
    float: left;
    width: calc((100% - 16px)/2);
    margin-right: 16px;
    margin-bottom: 12px
}

.re__footer-link .re__footer-link-items>ul>li:nth-child(2n+2) {
    margin-right: 0
}

.re__footer-link .re__footer-link-items>ul>li>a {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important;
    color: #505050;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    vertical-align: middle
}

.re__footer-link .re__footer-link-items>ul>li>a:hover {
    text-decoration: underline
}

.re__footer-link .re__box-view-more {
    bottom: 24px;
    cursor: pointer;
    left: 0;
    position: absolute;
    width: 100%
}

.re__footer-link .re__box-view-more .re__gradient {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
    height: 40px;
    width: 100%
}

.re__footer-link .re__box-view-more .re__view-more {
    background: #fff;
    text-align: center;
    width: 100%
}

.re__footer-link .re__box-view-less {
    width: 100%;
    background: #fff;
    text-align: center;
    margin-top: 0
}

.re__list-standard-1line--sm {
    display: flex;
    flex-direction: row;
    align-items: center
}

.re__list-standard-1line--sm:last-of-type {
    border-bottom: 0
}

.re__list-standard-1line-no-underline--sm {
    display: flex;
    flex-direction: row;
    align-items: center
}

.re__list-standard-1line--md {
    display: flex;
    flex-direction: row;
    align-items: center
}

.re__list-standard-1line--md:last-of-type {
    border-bottom: 0
}

.re__list-standard-1line-no-underline--md {
    display: flex;
    flex-direction: row;
    align-items: center
}

.re__list-standard-1line--lg {
    display: flex;
    flex-direction: row;
    align-items: center
}

.re__list-standard-1line--lg:last-of-type {
    border-bottom: 0
}

.re__list-standard-1line-no-underline--lg {
    display: flex;
    flex-direction: row;
    align-items: center
}

.lg-outer .lg-sub-html {
    position: absolute;
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    height: 40px;
    padding: 0 24px;
    bottom: 64px !important;
    top: auto !important;
    color: #fff;
    background: rgba(0, 0, 0, 0.8) !important
}

.lg-outer .lg-sub-html .re__album-header-desc {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 4px
}

.lg-outer .lg-sub-html .re__album-header-only-title {
    margin-top: 20px
}

.lg-outer .lg-toolbar {
    top: 0 !important;
    bottom: inherit !important;
    height: 56px;
    background-color: rgba(0, 0, 0, 0.8) !important;
    margin: 0 auto
}

.lg-outer .lg-toolbar .lg-icon {
    width: 24px;
    padding: 16px 0;
    margin-right: 16px
}

.lg-outer .lg-toolbar .lg-close {
    padding-top: 16px !important
}

.lg-outer .lg-toolbar #lg-counter {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    padding-top: 16px
}

.lg-outer .lg-toolbar .album-category {
    float: right;
    text-align: center;
    width: 100%;
    margin-top: 8px;
    display: block;
    overflow-x: scroll;
    scroll-behavior: smooth;
    scrollbar-width: none;
    white-space: nowrap
}

.lg-outer .lg-toolbar .album-category::-webkit-scrollbar {
    display: none
}

.lg-outer .lg-toolbar .album-category button {
    position: relative;
    display: inline-block;
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    background-color: inherit;
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-sizing: border-box;
    border-radius: 40px;
    color: #fff;
    padding: 5px 15px;
    margin-right: 8px
}

.lg-outer .lg-toolbar .album-category button:first-child {
    margin-left: 16px
}

.lg-outer .lg-toolbar .album-category button:last-child {
    margin-right: 16px
}

.lg-outer .lg-toolbar .album-category button i {
    vertical-align: middle;
    margin-right: 8px
}

.lg-outer .lg-toolbar .album-category button .re__icon-play--sm {
    color: #fff
}

.lg-outer .lg-toolbar .album-category .current {
    background: #fff;
    color: #000
}

.lg-outer .lg-toolbar .album-category .current .re__icon-play--sm {
    color: #000
}

.lg-outer .lg-inner {
    background-color: #000
}

.lg-outer .lg-actions .lg-icon {
    color: #2C2C2C !important;
    background: #fff !important;
    border: solid 1px #ccc !important;
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    padding: 5px 11px;
    box-sizing: border-box;
    border-radius: 4px
}

.lg-outer .lg-actions .lg-icon:active {
    color: #2C2C2C !important;
    background: #F2F2F2 !important;
    border: solid 1px #ccc !important
}

.lg-outer .lg-actions .lg-icon:disabled {
    color: #999 !important;
    background: #fff !important;
    border: solid 1px #ccc !important;
    cursor: unset !important
}

.lg-outer .lg-actions .lg-icon:before {
    content: none
}

.lg-outer .lg-actions .lg-icon:after {
    content: none
}

.lg-outer .lg-actions .lg-prev {
    left: 16px
}

.lg-outer .lg-actions .lg-next {
    right: 16px
}

.lg-outer .lg-thumb-outer {
    height: 64px !important;
    background-color: #000;
    padding: 16px 0;
    padding-left: 16px
}

.lg-outer .lg-thumb-outer .lg-thumb {
    padding: 0;
    margin: 0
}

.lg-outer .lg-thumb-outer .lg-thumb .lg-thumb-item {
    position: relative;
    margin-right: 4px !important;
    margin-bottom: 0px !important;
    border: none;
    border-radius: 0;
    opacity: 0.64
}

.lg-outer .lg-thumb-outer .lg-thumb .lg-thumb-item .re__icon-play {
    position: absolute;
    left: calc(50% - 12px);
    top: calc(50% - 12px);
    color: #fff;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%
}

.lg-outer .lg-thumb-outer .lg-thumb .lg-thumb-item.active {
    opacity: 1;
    border: 2px solid #fff;
    box-sizing: border-box
}

.lg-outer .lg-thumb-outer .lg-toogle-thumb {
    display: none
}

.re__margin-right--sm {
    margin-right: 8px
}

.re__fl {
    float: left
}

.re__fr {
    float: right
}

.re__white-color {
    color: #fff
}

.re__margin-top--md {
    margin-bottom: 16px
}

.re__margin-bottom--lg {
    margin-bottom: 24px
}

.re__padding-lf-rg--md {
    padding: 0 16px
}

.re__search-inside__search-button-bar--fixed {
    background-color: #fff;
    bottom: 0;
    left: 0;
    padding: 0 16px 16px;
    position: fixed;
    right: 0
}

.re__search-inside__search-button-bar--fixed .re__btn {
    box-sizing: border-box;
    width: 100%
}

.re__clamp-1-lines {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

.re__project-editor {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    line-height: 24px;
    color: #2C2C2C;
    padding-top: 8px
}

.re__project-editor strong {
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important
}

.re__project-editor h1,
.re__project-editor h2,
.re__project-editor h3,
.re__project-editor h4,
.re__project-editor h1 strong,
.re__project-editor h2 strong,
.re__project-editor h3 strong,
.re__project-editor h4 strong {
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 16px;
    line-height: 24px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    line-height: 24px;
    margin-bottom: 8px
}

.re__project-editor p,
.re__project-editor div,
.re__project-editor span {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    line-height: 24px
}

.re__project-editor p,
.re__project-editor figure,
.re__project-editor img {
    margin: 0 0 16px 0
}

.re__project-editor p ul,
.re__project-editor p ol,
.re__project-editor figure ul,
.re__project-editor figure ol,
.re__project-editor img ul,
.re__project-editor img ol {
    margin-bottom: 8px;
    margin-left: 19px
}

.re__project-editor p ul li,
.re__project-editor p ol li,
.re__project-editor figure ul li,
.re__project-editor figure ol li,
.re__project-editor img ul li,
.re__project-editor img ol li {
    list-style: inherit;
    margin-bottom: 4px
}

.re__project-editor p li ul,
.re__project-editor p li ol,
.re__project-editor figure li ul,
.re__project-editor figure li ol,
.re__project-editor img li ul,
.re__project-editor img li ol {
    margin-top: 4px
}

.re__project-editor figure img {
    margin-bottom: 0
}

.re__project-editor figcaption {
    text-align: center;
    margin-top: 8px;
    color: #999
}

.re__project-editor figure.image {
    text-align: center
}

.re__project-editor img {
    max-width: 100%
}

.re__project-editor img[src^="http://file1"] {
    width: auto !important;
    height: auto !important;
    content: url(/images/ProjectNet/error-image/content-error-image-wap.svg)
}

.re__project-editor img[src^="https://file1"] {
    width: auto !important;
    height: auto !important;
    content: url(/images/ProjectNet/error-image/content-error-image-wap.svg)
}

.re__project-editor ul,
.re__project-editor ol {
    margin-bottom: 16px;
    margin-left: 19px
}

.re__project-editor ul li,
.re__project-editor ol li {
    list-style: inherit;
    margin-bottom: 4px
}

.re__project-editor li ul,
.re__project-editor li ol {
    margin-top: 4px
}

.re__project-editor a {
    color: #007C80
}

.re__project-editor a:hover {
    color: #009BA1
}

.re__project-editor>*:last-child {
    margin-bottom: 0
}

.re__prj-wap-popup {
    position: fixed;
    padding: 16px 24px 24px 24px;
    z-index: 10000;
    background: #fff;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0 !important;
    display: none;
    box-sizing: border-box;
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #2C2C2C
}

.re__prj-wap-popup-fix {
    overflow: scroll !important;
    height: calc(100vh - 50px) !important
}

.re__contact {
    background: rgba(0, 0, 0, 0.6);
    overflow: hidden
}

.re__display-none {
    display: none
}

.re__truncate-1-lines {
    overflow: hidden !important;
    text-overflow: ellipsis;
    white-space: nowrap
}

.re__mb48 {
    margin-bottom: 48px
}

.re__margin-top-sm {
    margin-top: 8px
}

.re__select-popup-advance .selection-content .selection-content-options li:before,
.re__select-popup-advance .selection-content .selection-content-options li.selected:before,
.re__select-popup-advance .selection-content .selection-content-options li li:before,
.re__select-popup-advance .selection-content .selection-content-options li li.selected:before {
    font-family: "font-icon-bds";
    font-size: 16px;
    line-height: 1;
    content: "";
    color: #ccc;
    width: 16px;
    height: 16px;
    top: 12px;
    left: initial;
    right: 16px;
    position: absolute
}

.re__select-popup-advance {
    position: relative;
    min-height: 32px
}

.re__select-popup-advance .select-popup-text {
    width: 100%;
    display: block;
    height: auto !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #2C2C2C;
    background: #fff;
    border: 1px solid #ccc;
    padding: 5px 29px 5px 15px;
    border-radius: 4px;
    position: absolute;
    top: 0px;
    left: 0px
}

.re__select-popup-advance .selection-box {
    display: none;
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    bottom: 0 !important;
    background: rgba(0, 0, 0, 0.6);
    z-index: 999999
}

.re__select-popup-advance .selection-content {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
    width: 100%;
    box-shadow: 0px 8px 20px rgba(182, 182, 182, 0.42);
    border-radius: 16px 16px 0 0;
    z-index: 99999;
    border: none
}

.re__select-popup-advance .selection-content .selection-content-header {
    text-align: center;
    padding: 16px;
    border-bottom: 1px solid #F2F2F2
}

.re__select-popup-advance .selection-content .selection-content-header span {
    width: calc(100% - 40px);
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 16px;
    line-height: 24px;
    font-weight: normal !important;
    letter-spacing: -.2px
}

.re__select-popup-advance .selection-content .selection-content-header i {
    width: 24px;
    float: right;
    color: #999
}

.re__select-popup-advance .selection-content .selection-content-options {
    max-height: calc(100vh - 278px);
    padding: 16px;
    padding-top: 8px;
    overflow-y: auto
}

.re__select-popup-advance .selection-content .selection-content-options li {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #2C2C2C;
    cursor: pointer;
    padding-top: 14px;
    padding-bottom: 13px;
    padding-right: 24px;
    border-bottom: 1px solid #F2F2F2;
    position: relative;
    overflow: hidden
}

.re__select-popup-advance .selection-content .selection-content-options li:last-child {
    border-bottom: none
}

.re__select-popup-advance .selection-content .selection-content-options li:before {
    right: 0 !important;
    top: calc(50% - 8px) !important
}

.re__select-popup-advance .selection-content .selection-content-options li>i {
    float: left;
    margin-top: 2px;
    margin-right: 12px
}

.re__select-popup-advance .selection-content .selection-content-options li>span {
    margin-left: 30px
}

.re__select-popup-advance .selection-content .selection-content-options li>span.re__text {
    float: left;
    margin-left: 0px
}

.re__select-popup-advance .selection-content .selection-content-options li>span.re__text::before {
    content: none
}

.re__select-popup-advance .selection-content .selection-content-options li.selected:before {
    color: #74150F;
    content: ""
}

.re__select-popup-advance .selection-content .selection-content-options li li:before {
    content: ""
}

.re__select-popup-advance .selection-content .selection-content-options li li.selected:before {
    color: #74150F;
    content: ""
}

.re__select-popup-advance .selection-content .selection-content-options::-webkit-scrollbar {
    width: 4px
}

.re__select-popup-advance .selection-content .selection-content-options::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px #ccc;
    border-radius: 8px
}

.tooltip .tooltip-text {
    opacity: 0;
    background: rgba(10, 13, 20, 0.8);
    border-radius: 4px;
    color: #fff;
    padding: 6px 12px;
    line-height: 20px;
    font-size: 14px;
    box-sizing: border-box;
    position: absolute;
    z-index: 9;
    bottom: 28px;
    right: calc(50% - 51px);
    margin-bottom: 16px
}

.tooltip .tooltip-text.tooltip-text-only {
    bottom: 72px;
    right: calc(50% - 75px)
}

.tooltip .tooltip-text.tooltip-text-only::before {
    content: none
}

.tooltip .tooltip-text::before {
    position: absolute;
    bottom: -10px;
    left: calc(50% - 2.5px);
    content: '';
    display: block;
    border: 5px solid transparent;
    border-top: 5px solid rgba(10, 13, 20, 0.8)
}

.filter-search-projectnet .filter-search--header {
    box-shadow: none;
    padding-bottom: 8px
}

.filter-search-projectnet .filter-search--tab {
    display: none !important
}

.filter-search-projectnet .filter-search--body-content {
    padding-top: 0
}

.filter-search-projectnet .filter-search--body-content .filter-search--input-search {
    margin-top: 0
}

.filter-search--ui-autocomplete .filter-search-projectnet .filter-search--header {
    box-shadow: 0px 4px 8px rgba(182, 182, 182, 0.18)
}

.filter-search--ui-autocomplete .ui-autocomplete {
    top: 64px !important
}

.re__prj-card-image img[src^="http://file1"] {
    content: url(/images/Product/error-image/card-compact-error-image.png)
}

.re__prj-card-image img[src^="https://file1"] {
    content: url(/images/Product/error-image/card-compact-error-image.png)
}

.re__project-list {
    background-color: #fff;
    padding: 16px 16px 24px
}

.re__project-list__header {
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 18px;
    line-height: 28px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    color: #2C2C2C
}

.re__project-list__summary-bar {
    display: flex;
    margin: 8px 0 16px
}

.re__project-list__summary-bar__project-counting {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #2C2C2C;
    align-self: center
}

.re__project-list__summary-bar__project-counting span {
    font-weight: 500
}

.re__project-list .re__project-sort {
    margin-left: auto;
    min-width: 140px;
    position: relative;
    height: 32px
}

.re__project-list .re__project-sort .re__select--sm {
    display: block;
    height: 100%
}

/* .re__project-list .re__project-sort select {
    opacity: 0;
    position: absolute;
    right: 0;
    top: 3px
} */

.re__project-list .re__project-sort .re__filter-label {
    color: #2C2C2C
}

.re__project-list .re__loading {
    display: none;
    float: left;
    height: 30px;
    margin: -45px 0 36px;
    text-align: center;
    width: 100%;
    z-index: 5
}

.re__project-list .re__loading img {
    background-color: transparent;
    height: 80px
}

.re__project-list .re__more-projects {
    text-align: center
}

.re__project-list .re__listing-empty {
    text-align: center;
    margin: 0 16px
}

.re__project-list .re__listing-empty::before {
    content: " ";
    background-image: url(/images/ProjectNet/icon/empty-property.svg);
    background-size: contain;
    width: 130px;
    height: 130px;
    display: block;
    margin: 24px auto 0px auto
}

.re__project-list .re__listing-empty p {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #999;
    text-align: center;
    margin-bottom: 4px
}

.re__project-list .re__listing-empty .re__btn {
    margin-top: 16px
}

.re__prj-wap-line-gray {
    height: 8px;
    width: 100%;
    background-color: #F2F2F2
}

.re__prj-wap-article {
    width: 100%
}

.re__prj-news-box {
    position: relative;
    padding: 0 16px
}

.re__prj-news-box .re__box-title {
    color: #2C2C2C;
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 18px;
    line-height: 28px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    margin: 24px 0px 16px 0px
}

.re__prj-news-box .re__link-more {
    position: absolute;
    top: 4px;
    right: 16px
}

.re__prj-news-box .re__link-more>span {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important
}

.re__scard-news {
    position: relative;
    width: 100%;
    height: 167px
}

.re__scard-news .re__scard-news-wrap {
    border-radius: 4px;
    width: 100%;
    height: 100%
}

.re__scard-news .swiper-slide {
    width: 242px;
    height: 167px;
    margin-right: 16px
}

.re__scard-news .swiper-slide:last-child {
    margin-right: 0
}

.re__scard-news .re__bg-item {
    height: 100%
}

.re__scard-news .re__bg-item>img {
    width: 100%;
    height: 100%;
    border-radius: 4px;
    object-fit: cover
}

.re__scard-news .re__bg-item>i {
    position: absolute;
    top: calc(50% - 16px);
    left: calc(50% - 16px)
}

.re__scard-news .re__scard-gradient {
    position: absolute;
    width: 100%;
    height: 90px;
    bottom: 0px;
    border-radius: 4px;
    left: 0px;
    border-radius: 4px;
    background: linear-gradient(180deg, rgba(44, 44, 44, 0) 0%, rgba(44, 44, 44, 0.8) 100%);
    mix-blend-mode: multiply
}

.re__scard-news .re__bottom-item {
    position: absolute;
    max-height: 90px;
    bottom: 12px;
    left: 12px;
    margin-right: 16px
}

.re__scard-news .re__bottom-item .re__link-title {
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    margin-bottom: 4px;
    color: #fff
}

.re__scard-news .re__bottom-item .re__time {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important;
    opacity: 0.8;
    color: #fff
}

.re__scard-news .re__left {
    z-index: 1;
    left: 15px;
    position: absolute;
    top: calc(50% - 16px)
}

.re__scard-news .re__right {
    z-index: 1;
    right: 15px;
    position: absolute;
    top: calc(50% - 16px)
}

.re__scard-news .swiper-pagination {
    position: absolute;
    right: 16px;
    bottom: 16px;
    width: auto;
    margin: 0 auto;
    left: auto
}

.re__scard-news .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: #FFFFFF;
    opacity: 0.3
}

.re__scard-news .swiper-pagination-bullet-active {
    opacity: 1
}

.re__scard-news .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 0 0 6px
}

.re__hcard-news:first-child {
    padding-top: 0
}

.re__hcard-news:last-child {
    border-bottom: none
}

.re__hcard-news {
    padding: 16px 0;
    border-bottom: 1px solid #F2F2F2;
    position: relative
}

.re__hcard-news>.re__left-item {
    float: left;
    width: 120px;
    height: 90px;
    position: relative
}

.re__hcard-news>.re__left-item>a>img {
    border-radius: 4px;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.re__hcard-news>.re__left-item>a>i {
    position: absolute;
    top: calc(50% - 12px);
    left: calc(50% - 12px)
}

.re__hcard-news>.re__right-item {
    float: left;
    width: calc(100% - 136px);
    padding-left: 16px
}

.re__hcard-news>.re__right-item>.re__link-title a {
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    color: #505050
}

.re__hcard-news>.re__right-item>.re__time {
    position: absolute;
    color: #999;
    bottom: 19px;
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important
}

.re__hcard-news::after {
    content: "";
    display: table;
    clear: both
}

.re__prj-hightlight {
    width: 100%;
    position: relative
}

.re__prj-hightlight .re__prj-item {
    position: relative;
    height: calc(100vw * 240/360)
}

.re__prj-hightlight .re__prj-item>img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.re__prj-hightlight .re__prj-item::before {
    content: '';
    width: 100%;
    height: calc(100vw * 156/360);
    background: linear-gradient(180deg, rgba(44, 44, 44, 0) 0%, #2C2C2C 108.75%);
    bottom: 0;
    left: 0;
    position: absolute
}

.re__prj-hightlight .re__prj-info {
    position: absolute;
    bottom: 16px;
    padding: 0 16px;
    width: 100%;
    box-sizing: border-box
}

.re__prj-hightlight .re__prj-info .re__prj-tag-info {
    padding: 4px 8px
}

.re__prj-hightlight .re__prj-title {
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 24px;
    line-height: 32px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    color: #fff;
    margin-bottom: 4px;
    margin-top: 12px
}

.re__prj-hightlight .re__prj-address {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: rgba(255, 255, 255, 0.8);
    width: calc(100% - 85px)
}

.re__prj-hightlight .swiper-pagination {
    position: absolute;
    right: 16px;
    bottom: 16px;
    text-align: right;
    left: auto
}

.re__prj-hightlight .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: #FFFFFF;
    opacity: 0.6
}

.re__prj-hightlight .swiper-pagination-bullet-active {
    opacity: 1
}

.re__prj-hightlight .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 0 0 6px
}

.re__prj-hightlight .swiper-pagination-fraction {
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important
}

.re__prj-hightlight .swiper-pagination-fraction>div {
    color: #fff;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 4px;
    padding: 2px 8px;
    display: inline-block
}

.re__prj-tag-info {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important;
    background-color: #fff;
    border-radius: 4px;
    display: inline-flex;
    max-width: 100%;
    padding: 6px 12px;
    filter: drop-shadow(0px 4px 16px rgba(44, 44, 44, 0.08))
}

.re__prj-tag-info>label {
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important
}

.re__prj-tag-info>span {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    flex: 1;
    overflow: hidden
}

.re__prj-tag-info>span::before {
    content: '∙';
    font-weight: bold;
    padding: 0 8px
}

.re__prj-tag-info.re__project-prepare {
    background: #FFECEB;
    color: #E03C31
}

.re__prj-tag-info.re__project-open {
    background: #E7FFF4;
    color: #07A35D
}

.re__prj-tag-info.re__project-finish {
    background: #F0EAF4;
    color: #845D9C
}

.re__prj-tag-info.re__project-na {
    background: #F2F2F2;
    color: #999
}

.re__prj-tag-info.re__project-na>label {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important
}

.re__prj-card-full-mobile {
    width: 100%;
    border: 1px solid #F2F2F2;
    box-shadow: 0px 4px 6px rgb(44 44 44 / 4%);
    border-radius: 4px;
    box-sizing: border-box;
    background: #fff;
    margin-bottom: 16px
}

.re__prj-card-full-mobile>a {
    display: block;
    width: 100%;
    height: 100%
}

.re__prj-card-full-mobile>a .re__prj-card-image {
    height: calc((100vw - 32px) * 184 / 328);
    position: relative;
    margin: -1px
}

.re__prj-card-full-mobile>a .re__prj-card-image::after {
    position: absolute;
    width: 100%;
    height: 40px;
    left: 0px;
    bottom: 0px;
    background: linear-gradient(180deg, rgba(44, 44, 44, 0) 0%, #2C2C2C 108.75%);
    content: "";
    z-index: 1
}

.re__prj-card-full-mobile>a .re__prj-card-image.re__prj-card-nomedia::after {
    content: none
}

.re__prj-card-full-mobile>a .re__prj-card-image>img {
    width: 100%;
    height: 100%;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    object-fit: cover
}

.re__prj-card-full-mobile>a .re__prj-card-image>img.error-photo {
    object-fit: scale-down !important;
    content: url(/images/common/error-photo-md.svg) !important
}

.re__prj-card-full-mobile>a .re__prj-card-image .re__prj-card-image-feature {
    position: absolute;
    bottom: 8px;
    right: 16px;
    z-index: 2
}

.re__prj-card-full-mobile>a .re__prj-card-image .re__prj-card-image-feature>i {
    float: left;
    margin-left: 4px;
    color: #fff
}

.re__prj-card-full-mobile>a .re__prj-card-image .re__prj-card-image-feature>span {
    float: left;
    margin: 2px 0px;
    color: #fff
}

.re__prj-card-full-mobile>a .re__prj-card-info {
    position: relative;
    margin: 12px 16px 16px 16px
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-title {
    margin-bottom: 8px;
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 16px;
    line-height: 24px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    color: #2C2C2C;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-tag-info {
    margin-bottom: 8px;
    padding: 4px 8px
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-tag-info>label {
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-tag-info>span {
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-config>span {
    display: block;
    float: left;
    margin-bottom: 8px;
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #2C2C2C
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-config .re__prj-card-config-value {
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #2C2C2C
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-config .re__prj-card-config-value>span {
    display: block;
    float: left;
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-config .re__prj-card-config-value>i {
    display: block;
    float: left;
    margin: 0 0 0 4px
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-config .re__prj-card-config-dot {
    font-family: "Roboto Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #999;
    margin: 0 8px
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-config .re__prj-card-config-dot:last-child {
    display: none
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-config::after {
    content: "";
    clear: both;
    display: block
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-location {
    margin-bottom: 24px;
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #505050;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-contact-button {
    width: 100%;
    height: 32px;
    position: relative
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-contact-button>.re__btn {
    width: 100%;
    font-size: 0;
    box-sizing: border-box
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-contact-button>span>i {
    color: #fff;
    float: none;
    vertical-align: middle
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-contact-button>span>span {
    color: #fff;
    float: none;
    vertical-align: middle
}

.re__prj-card-full-mobile>a .re__prj-card-info .re__prj-card-info-content .re__prj-card-contact-button .tooltip .tooltip-text {
    right: calc(50% - 51px)
}

.re__prj-exp-score-banner {
    position: relative;
    display: flex;
    padding: 13px 13px 13px 15px;
    background: #fff;
    border: 1px solid #F2F2F2;
    box-sizing: border-box;
    box-shadow: 0px 4px 6px rgba(44, 44, 44, 0.04);
    border-radius: 4px;
    margin: 24px 0 16px 0
}

.re__prj-exp-score-banner img {
    width: 56px;
    height: 56px;
    vertical-align: middle;
    margin: auto
}

.re__prj-exp-score-banner .re__info {
    margin: auto;
    vertical-align: middle;
    padding-left: 8px
}

.re__prj-exp-score-banner .re__info label {
    width: 100%;
    margin-bottom: 4px;
    font-family: "Lexend Medium", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    letter-spacing: -.2px;
    color: #2C2C2C
}

.re__prj-exp-score-banner .re__info a {
    width: 100%
}

.re__prj-exp-score-banner .re__btn-box {
    min-width: 28px;
    vertical-align: middle;
    margin: auto;
    text-align: right
}

.re__prj-exp-score-banner .re__btn-box i {
    color: #999
}

.re__fancybox-wrap-select .fancybox-close {
    top: 16px;
    right: 24px;
    color: #fff;
    background-image: url(/images/icons/projects/icon-close-white.svg) !important
}

.re__prj-exp-score-popup {
    position: absolute;
    left: calc(50% - 148px) !important;
    right: calc(50% - 148px) !important;
    top: calc(50% - 140px) !important;
    bottom: calc(50% - 140px) !important;
    background: #fff;
    box-sizing: border-box;
    border-radius: 8px
}

.re__prj-exp-score-popup .re__prj-popup-close {
    position: absolute;
    top: 16px;
    right: 16px
}

.re__prj-exp-score-popup .re__prj-popup-close i {
    color: #fff
}

.re__prj-exp-score-popup img {
    width: 296px;
    height: 115px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px
}

.re__prj-exp-score-popup .re__info {
    vertical-align: middle;
    padding: 16px;
    padding-bottom: 8px
}

.re__prj-exp-score-popup .re__info span {
    width: 100%;
    font-family: "Roboto Regular", Roboto, Arial !important;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal !important;
    color: #2C2C2C
}

.re__prj-exp-score-popup .re__btn-box {
    min-width: 32px;
    vertical-align: middle;
    text-align: center;
    padding: 16px
}

.re__prj-exp-score-popup .re__btn-box .re__btn {
    width: 100%
}

.re__project-breadcrumb {
    margin-bottom: 8px;
    max-height: 40px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: normal
}

.re__project-breadcrumb span {
    color: #999
}

.re__project-breadcrumb :hover {
    overflow: visible
}