/*!
 * app.css for master
 * Author wzcoder.com
 * @Copyright 2005-2021 wzcoder.com (http://www.wzcoder.com)
 * @version 1.0
 * @date 2021-03-05-1:59 PM
 */

/*--------------------------------------------------------------
# 加载组件样式
--------------------------------------------------------------*/
@import "navbar.css";
@import "hero.css";
@import "footer.css";

/*--------------------------------------------------------------
# App通用
--------------------------------------------------------------*/


.main-color {
    color: var(--primary-color);
}

.pagination .page-item {
    margin-right: 10px;
}

.page-item .page-link {
    border-radius: 0 !important;
    color: initial;
}

.pagination li.active span {
    background-color: var(--focus-color) !important;
    border-color: var(--focus-color) !important;
    color: #ffffff;
}

/*glightbox*/
#glightbox-slider h4 {
    margin-bottom: 0;
}

/*nav-tabs*/
.nav-tabs {
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 1rem;
}

.nav-tabs li .nav-link {
    border: none;
    border-radius: 0;
    font-size: 18px;
    color: initial;
    margin-right: 30px;
    padding-left: 0;
    padding-right: 0;
}

.nav-tabs li > button > i {
    margin-right: 10px;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    border-bottom: 1px solid;
    color: var(--primary-color);
    border-color: var(--primary-color);
}

@media (max-width: 768px) {
    .nav-tabs li .nav-link {
        font-size: 15px;
        margin-right: 10px;
    }
}

/*btn*/
.btn-wrapper i {
    position: absolute;
    right: -16px;
    top: 4px;
    font-size: 22px;
    transition: 0.5s;
    color: var(--border-color);
    background-color: #FFFFFF;
}

.w-btn-default-outline:hover i, .w-btn-default-outline:focus i, .w-btn-default-outline:active i {
    color: var(--primary-color);
}

/*section-title*/
.section-title__main h2 {
    color: var(--primary-color);
    font-size: 48px;
}

.section-title__main p {
    font-size: 45px;
    margin-top: -60px;
    color: var(--text-color-light);
    font-weight: 300;
}

.section-title__v3 {
    border-bottom: 2px solid var(--border-color);
    padding-bottom: 10px;
}

.section-title__v3 h2, .section-title__v4 h2 {
    color: var(--primary-color);
    font-size: 26px;
    font-weight: 600;
}

.section-title__v4 h2 span {
    font-size: 18px;
    color: var(--text-color-secondary);
}

.section-line {
    width: 100%;
    max-width: 560px;
    height: 1px;
    background: #444;
    margin-top: 30px;
    position: relative;
    display: inline-block;
    margin-bottom: 40px;
}

.section-bd {
    font-size: 20px;
}

.circle-box {
    width: 180px;
    height: 65px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-block;
}

.circle-box:before {
    width: 48px;
    height: 46px;
    position: absolute;
    content: "";
    background: url(data:image/jpeg;base64,/9j/4QCkRXhpZgAASUkqAAgAAAABAJiCAgB/AAAAGgAAAAAAAADmqKHmnb/lhoXlrrnku4Xkvpvlj4LogIPvvIzljYPlm77nvZHmmK/mraPniYjllYbkuJrlm77lupPvvIzmiYDmnInljp/liJvkvZzlk4HvvIjlkKvpooTop4jlm77vvInlnYflj5fokZfkvZzmnYPms5Xkv53miqTjgILokZcAAAAA/+wAEUR1Y2t5AAEABAAAADwAAP/hBXRodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wUmlnaHRzPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvcmlnaHRzLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bXBSaWdodHM6TWFya2VkPSJUcnVlIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6QjRCQkFCODVFRjA3RUQxMUIwNzJFNTUwNDBERTE5MEIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzQ4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);
    top: 6px;
    left: 66px;
}

/*banner*/
.banner-inner {
    background-size: cover;
    background-position: center center;
    min-height: 20vh;
}

@media (min-width: 992px ) {
    .banner-inner-wrapper.about-inner {
        margin-bottom: 70px;
    }
}

.banner-inner-wrapper h3 {
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    color: #ffffff;
    margin-bottom: 30px;
}

/*--------------------------------------------------------------
# count
--------------------------------------------------------------*/
.count {
    position: relative;
    z-index: 200;
}

@media (min-width: 992px) {
    .count {
        padding: 0;
        margin-top: -40px;
    }
}

.count-box {
    /*min-height: 300px;*/
    padding: 20px;
    border-radius: var(--border-radius);
    transition: 0.3s;
}

/*.cb-1, .cb-3 {*/
/*    background-color: var(--secondary-color);*/
/*}*/
.cb-1, .cb-3,
.cb-2, .cb-4 {
    background-color: var(--primary-color);

}

.count-box i {
    font-size: 38px;
    color: #ffffff;
}

.count-box:hover {
    background-color: var(--secondary-color);
    box-shadow: 0px 0 25px 0 rgba(0, 0, 0, 0.1);
    transform: translateY(-10px);
}

.count-box .img {
    width: 35px;
    height: 35px;

}

.count p {
    font-size: 18px;
    color: #FFFFFF;
    margin-bottom: 0;
}

.count p.cb-num {
    font-size: 18px;
    font-weight: 600;
    margin: 0.5rem;
}

.gun-wrapper {
    border: 1px solid var(--border-color);
    padding: 10px 20px;
    font-size: 18px;
    margin: 20px 0;
    border-radius: var(--border-radius)
}


/*--------------------------------------------------------------
# service-index
--------------------------------------------------------------*/
.service-index .service-box {
    padding: 60px 40px;
    transition: 0.3s;
    border-radius: 10px;
    background-color: #ffffff;
    position: relative;
}

.service-index .service-box:hover, .service-index .service-box:active {
    box-shadow: 0 0 5px rgba(243, 152, 0, 0.6);
}

.service-index .service-box i {
    font-size: 42px;
    transition: 0.3s;
}


.service-index .service-box h6 {
    font-size: 18px;
    margin: 1.5rem 0;
    font-weight: 600;
    transition: 0.3s;
}

.service-index .service-box:hover h6, .service-index .service-box:hover i {
    color: var(--primary-color);
}

.service-index .service-box p {
    /*text-align: center;*/
    color: var(--text-color-secondary);
}

.service-index .service-box::after,
.service-index .service-box::before {
    content: "";
    position: absolute;
    top: 80%;
    left: 0.35714rem;
    bottom: 1.07143rem;
    width: 50%;
    max-width: 21.42857rem;
    z-index: -1;
    transition: 0.3s;
    opacity: 0;
    visibility: hidden;
}

.service-index .service-box::after,
.service-index .service-box::before {
    box-shadow: 0 20px 15px rgba(243, 152, 0, 0.6);
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
}

.service-index .service-box::after {
    left: auto;
    right: 0.35714rem;
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
}

.service-index .service-box:hover::after,
.service-index .service-box:hover::before,
.service-index .service-box:active::after,
.service-index .service-box:active::before {
    opacity: 1;
    visibility: visible;
}

@media (max-width: 768px) {
    .service-index .service-box {
        padding: 10px;
    }
}

/*--------------------------------------------------------------
# solution
--------------------------------------------------------------*/
.swiper-solution {
    overflow: initial !important;
}

.swiper-solution [class*=row] {
    background-color: #FFFFFF;
    box-shadow: 0px 0 15px rgba(0, 0, 0, 0.1);
}

.swiper-solution .detail {
    padding: 20px 10px;
}

.swiper-solution .detail h3 {
    font-weight: 600;
}

.swiper-solution .detail h5 {
    font-size: 20px;
    color: initial !important;
}

.swiper-solution .detail p {
    color: var(--text-color-secondary);
}

.swiper-solution .detail a.w-btn-default {
    font-size: initial;
    padding: 0.253rem 2.078rem;
    border-radius: 0;
}

.swiper-solution .swiper-pagination {
    width: 100px !important;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    background: var(--light-bg-color);
    left: 51.333333% !important;
}

.swiper-solution .swiper-pagination-bullet {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 16.6666667%;
    color: #b4b4b4;
    margin: 0 !important;
    border-bottom: 1px solid var(--border-color);
    border-radius: 0;
    font-size: 30px;
}

.swiper-solution .swiper-pagination-bullet:last-child {
    border-bottom: none;
}

.swiper-solution .swiper-pagination-bullet-active {
    background: var(--focus-color);
    left: 66.666667%;
    color: #ffffff;
}

@media (max-width: 768px) {
    .swiper-solution .detail {
        padding: 20px 10px;
    }
}

@media (min-width: 992px) {
    .swiper-solution .detail {
        padding: 20px 30px 20px 50px;
        line-height: 2;
    }
}

/*--------------------------------------------------------------
# cta
--------------------------------------------------------------*/
.cta {
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
}

.cta .cta-text {
    font-size: 20px;
    margin-bottom: 0;
}

.cta .cta-title {
    color: var(--primary-color);
    font-size: 40px;
}

.cta .cta-line {
    display: inline-block;
    position: relative;
    width: 50%;
    height: 1px;
    background-color: #000000;
    margin: 1rem 0;
}

.cta .cta-line:before {
    content: '';
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 20%;
    height: 3px;
    background-color: var(--primary-color);
}

.cta .cta-contact i.bx {
    font-size: 40px;
    color: var(--primary-color);
}

.cta .cta-contact p {
    font-size: 20px;
}

/*--------------------------------------------------------------
# about
--------------------------------------------------------------*/

.about .detail {
    margin-top: 20px;
    line-height: 2;
    font-size: 18px;
    text-align: center;
}

.btn-wrapper .w-btn-default-outline {
    position: relative;
}


/*--------------------------------------------------------------
# photos
--------------------------------------------------------------*/


.photo-box {
    padding: 10px;
    border: 1px solid var(--border-color);
}

.photo-box .item {
    position: relative;
    padding-bottom: 62.5%;
    height: 0;
    overflow: hidden;
}

.photo-box .item.a4 {
    padding-bottom: 141.43%;
}

.photo-box .item a {
    display: inline-flex;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.photo-box .photo-caption {
    padding: 15px 10px 5px;
}

/*--------------------------------------------------------------
# supply
--------------------------------------------------------------*/
.supply {
    border-top: 10px solid #f6f6f6;
    position: relative;
}

.supply:before {
    content: "";
    width: 98px;
    height: 28px;
    background: url(data:image/jpeg;base64,/9j/4QCkRXhpZgAASUkqAAgAAAABAJiCAgB/AAAAGgAAAAAAAADmqKHmnb/lhoXlrrnku4Xkvpvlj4LogIPvvIzljYPlm77nvZHmmK/mraPniYjllYbkuJrlm77lupPvvIzmiYDmnInljp/liJvkvZzlk4HvvIjlkKvpooTop4jlm77vvInlnYflj5fokZfkvZzmnYPms5Xkv53miqTjgILokZcAAAAA/+wAEUR1Y2t5AAEABAAAADwAAP/hBXRodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wUmlnaHRzPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvcmlnaHRzLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bXBSaWdodHM6TWFya2VkPSJUcnVlIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6QjRCQkFCODVFRjA3RUQxMUIwNzJFNTUwNDBERTE5MEIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MzQ4MUExMDEwRUZFMTFFRDg1NERDMDUzMDE4QzZBQjAiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MzQ4MUExMDAwRUZFMTFFRDg1NERDMDUzMDE4QzZBQjAiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHBob3Rvc2hvcDpBdXRob3JzUG9zaXRpb249IueJuemCgOiuvuiuoeW4iCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjVERkRCNDQ3RjYwRUVEMTE4QkY1Q0NEODg4RjhENzA0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkI0QkJBQjg1RUYwN0VEMTFCMDcyRTU1MDQwREUxOTBCIi8+IDxkYzpyaWdodHM+IDxyZGY6QWx0PiA8cmRmOmxpIHhtbDpsYW5nPSJ4LWRlZmF1bHQiPuaooeadv+WGheWuueS7heS+m+WPguiAg++8jOWNg+Wbvue9keaYr+ato+eJiOWVhuS4muWbvuW6k++8jOaJgOacieWOn+WIm+S9nOWTge+8iOWQq+mihOiniOWbvu+8ieWdh+WPl+iRl+S9nOadg+azleS/neaKpOOAguiRlzwvcmRmOmxpPiA8L3JkZjpBbHQ+IDwvZGM6cmlnaHRzPiA8ZGM6Y3JlYXRvcj4gPHJkZjpTZXE+IDxyZGY6bGk+5Y2D5Zu+572R5Y6f5Yib5L2c5ZOBPC9yZGY6bGk+IDwvcmRmOlNlcT4gPC9kYzpjcmVhdG9yPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pv/tAMpQaG90b3Nob3AgMy4wADhCSU0EBAAAAAAAkhwBWgADGyVHHAIAAAIAAhwCdAB+5qih5p2/5YaF5a655LuF5L6b5Y+C6ICD77yM5Y2D5Zu+572R5piv5q2j54mI5ZWG5Lia5Zu+5bqT77yM5omA5pyJ5Y6f5Yib5L2c5ZOB77yI5ZCr6aKE6KeI5Zu+77yJ5Z2H5Y+X6JGX5L2c5p2D5rOV5L+d5oqk44CC6JGXOEJJTQQlAAAAAAAQDtgmTEqw6NZF2CqgX/cx3f/uAA5BZG9iZQBkwAAAAAH/2wCEAAYEBAQFBAYFBQYJBgUGCQsIBgYICwwKCgsKCgwQDAwMDAwMEAwODxAPDgwTExQUExMcGxsbHB8fHx8fHx8fHx8BBwcHDQwNGBAQGBoVERUaHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fH//AABEIABwAYgMBEQACEQEDEQH/xABjAAEBAAMBAAAAAAAAAAAAAAAAAwECBAgBAQAAAAAAAAAAAAAAAAAAAAAQAAIBBAEEAQMFAAAAAAAAAAECABEhAwQxQVFhEiJxQhOBkaEyshEBAAAAAAAAAAAAAAAAAAAAAP/aAAwDAQACEQMRAD8A9TNiU8WPiBF8brzcd4GkBA5dffD5TgzocGx0xsahh3RusDqgIHNtb64XGHGpzbTCqYV5+rH7RAviOX8a/loMlPkFrSvisDaBsqsxoLwKpgA/tfxAp6J2EDMBAm+FTcWMCLIy8j9YENnVwbOP0yr7AXU8EHuD0MDlGfZ0SF2ic2r9uyB8l8ZAP9QDbefcJx6J9cIs+2Rb6Yx9x88QOnV08GspGMEs13yMaux7sYFwCTQXMCqYOrftAsAAKAUgICAgICAIB5gSfADdbeIEWQioYc9DAwqgAKooBYAQKpgJu1h2gWVVUUApAzAQEBAQEBAQEDDetPlx5gaYfSluf5gUgICAgICB/9k=);
    position: absolute;
    left: 50%;
    margin-left: -49px;
    top: 0;
}

.swiper-photos {
    overflow: hidden;
    position: relative;
    transition: 0.3s;
}

.swiper-button-next, .swiper-button-prev {
    color: var(--border-color);
    transition: 0.3s;
}


.swiper-photos-wrapper:hover .swiper-button-next,
.swiper-photos-wrapper:hover .swiper-button-prev {
    color: var(--primary-color);
}

.supply-box {
    transition: 0.3s;
}

.supply-box:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(70 148 207 / 50%);
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;

}

.supply-box .text {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 20;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}

.supply-box:hover .text, .supply-box:hover:before {
    opacity: 1;
    visibility: visible;
}

.supply-box .text .hr {
    width: 30px;
    height: 2px;
    background-color: #ffffff;
    margin: 1rem 0;
}

.supply-box .text p {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 0;
}

/*--------------------------------------------------------------
# news
--------------------------------------------------------------*/
.img-news {
    position: relative;
    padding-bottom: 62.5%;
    height: 0;
    overflow: hidden;
}

.img-news a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.img-news .caption {
    position: absolute;
    width: 100%;
    height: auto;
    bottom: 0;
    padding: 10px;
    color: #ffffff;
    z-index: 20;
    background-color: rgba(0, 0, 0, .3);
}

.img-news .caption h4 {
    font-size: 16px;
    font-weight: 600;
    margin: 0.5rem 0;
}

.img-news .caption p {
    font-weight: 400;
    margin: 0;
}

.text-news > ul > li {
    border-bottom: 1px dashed var(--border-color);
}

.text-news > ul > li:last-child {
    border-bottom: none;
}

.text-news > ul > li > a {
    padding: 10px 0;
    display: inline-block;
}

.text-news .dot {
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50px;
    margin-right: 8px;
    background-color: var(--text-color-primary);
    position: relative;
    bottom: 3px;
}

.text-news .post-time {
    font-size: 14px;
    color: var(--text-color-secondary);
}


/*--------------------------------------------------------------
# About Page
--------------------------------------------------------------*/
.category-nav-list {
    margin: 1rem 0;
    text-align: center;
}

.category-nav-list li {
    display: inline-block;
    font-size: 20px;
    border: 2px solid #ffffff;
    margin: 0 1rem 15px 0;
    text-align: center;
}

.category-nav-list li.active, .category-nav-list li:hover {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.category-nav-list li a {
    color: #ffffff;
    padding: 8px 28px;
    display: block;
    font-weight: 600;
}

.list-title {
    margin-bottom: 50px;
}

.list-title h2 {
    font-size: 30px;
    color: var(--primary-color);
    font-weight: 600;
}

.list-title span {
    width: 42px;
    height: 5px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAECAMAAADPu10vAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpBM0MwRTJBMzAzQjBFQzExOTBCMEVCNjExNDMwRENBMiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowNTQ0MzBGQTA3NDIxMUVEQkU4RUU0MUQ0QTBENzczMCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowNTQ0MzBGOTA3NDIxMUVEQkU4RUU0MUQ0QTBENzczMCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkE2MEZBNUMyNEEwNkVEMTFBMEU4Rjk2RTUwNUFGMUQyIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkEzQzBFMkEzMDNCMEVDMTE5MEIwRUI2MTE0MzBEQ0EyIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+q/zL+wAAAHhQTFRFDXC4i7rdCm64DnC59/r93ev1VZrN0eTx9vr8ZaTSHHm97PT5banUUpnMyuDvtNPp3uz1UJfMYqLRcavVaabTTZbLVZvO7vX6dK3WKIDA6/P5D3G55O/3xd3uHXq9utbrzOHw+/3+erHYGni8bqnVSpTKCG23////UPrlbwAAACh0Uk5T////////////////////////////////////////////////////AL6qLhgAAABXSURBVHjabI1FDsAwEAM3KTMzk/P/H7abazMnW2PJ1MXtrpiofv4UmXb2mWyKbiA8uJYwYc3sBDCN5ALkc22MU3js+i84lK4k9MlyGYYy0C4fZKVeAQYAVYgVscXXTmUAAAAASUVORK5CYII=);
    display: inline-block;
}

.history-box .text {
    position: relative;
}

.history-box .text h3 {
    font-size: 24px;
    color: var(--focus-color);
    border-bottom: 1px solid var(--focus-color);
    padding-bottom: 0.5rem;
}

.history-box .text p {
    margin-bottom: 0;
}

.history-box .text strong {
    margin: 0.5rem 0;
    display: block;
}

.history-box .text span.l, .history-box .text span.r {
    font-size: 32px;
    color: var(--focus-color);
    position: absolute;
    top: -10px;
}

.history-box .text span.l {
    left: 0;
}

.history-box .text span.r {
    right: 0;
}


.about-supply {
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
}


.about-supply h2 {
    display: inline-block;
    color: #ffffff;
    font-size: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #ffffff;
    margin-bottom: 50px;
    margin-top: 30px;
}

.about-supply .supply-list li {
    display: inline-block;
    font-size: 20px;
    padding: 10px 35px;
    margin-left: 15px;
    margin-right: 15px;
    background-color: var(--light-bg-color);
    margin-bottom: 30px;
    transition: 0.3s;
    cursor: pointer;
}

.about-supply .supply-list li a {
    transition: 0.3s;
}

.about-supply .supply-list li:hover {
    background-color: var(--focus-color);
    color: #ffffff;
}

.about-supply .supply-list li:hover a {
    color: #ffffff;
}

.team .photo-box {
    border: none;
    padding: 0;
}

@media (min-width: 992px ) {
    /*.about-supply {*/
    /*    margin-left: -50px;*/
    /*    margin-right: -50px;*/
    /*}*/
    .about-supply-wrapper {
        padding: 0 50px;
    }

    .about-supply .supply-list li {
        margin-right: 30px;
        margin-left: 0;
    }
}

/*culture*/
/*advantages*/

@media (min-width: 992px ) {
    .about-wrapper {
        background: #fff;
        margin-top: -120px;
        box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
        padding: 50px;
        position: relative;
    }
}

.culture-box {
    background-color: var(--primary-color);
    height: 100%;
}

.about-wrapper .culture-box:last-child .row,
.advantages-box .advantages-box:last-child .row {
    margin-bottom: 0 !important;
}

.culture-box .img-wrapper {
    background-color: #ffffff;
}

.culture-box .text {
    color: #ffffff;
}


.culture-box .text h3,
.advantages-box .text h3 {
    font-size: 22px;
    font-weight: 600;
    margin: 1rem 0;
}

.culture-box .text p,
.advantages-box .text p {
    font-size: 18px;
}

@media (max-width: 768px ) {
    .culture-box .text {
        padding: 10px;
    }

    .culture-box .text h3,
    .advantages-box .text h3 {
        margin: 0 0 0.5rem 0;
    }

}

@media (min-width: 992px ) {
    .culture-box .text,
    .advantages-box .text {
        padding: 20px;
    }
}

.partner-box {
    box-shadow: 3px 3px 5px rgba(0, 0, 0, .15);
    padding: 10px;
    min-height: 130px;
    background-color: #ffffff;
    overflow: hidden;
    transition: 0.3s;
}

/*--------------------------------------------------------------
# service Page
--------------------------------------------------------------*/
.category-nav__service .category-nav-wrapper {
    border-bottom: 2px solid var(--border-color);
}

.category-nav__service a {
    display: inline-block;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    padding: 10px 20px;
    position: relative;
    transition: 0.3s;
}

.category-nav__service a:before {
    content: '';
    position: absolute;
    display: block;
    bottom: -2px;
    left: 0;
    right: 0;
    border-bottom: 4px solid var(--primary-color);
    transition: 0.3s;
    visibility: hidden;
    opacity: 0;
}

.category-nav__service a.active {
    color: var(--primary-color);

}

.category-nav__service a.active:before,
.category-nav__service a:hover:before {
    visibility: visible;
    opacity: 1;
}

.service-list .service-box .text {
    position: absolute;
    padding: 20px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    z-index: 30;
}

.service-list .service-box h3 {
    text-align: center;
    font-size: 18px;
    color: #ffffff;
    line-height: 1.8;
}


.service-list .service-box:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(70 148 207 / 50%);
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}

.service-list .service-box:hover .text, .service-list .service-box:hover::before, .service-list .service-box:active .text, .service-list .service-box:active::before {
    opacity: 1;
    visibility: visible;
}

/*top news*/
.post-item .dt {
    width: 80px;
    float: left;
    height: 80px;
    color: #ffffff;
    background-color: var(--primary-color);
}

.post-item .dt .day {
    font-size: 24px;
    font-weight: 600;
}

.post-item .caption {
    padding-left: 95px;
}

.post-item .caption h4 {
    font-size: 18px;
    font-weight: normal;
}

.post-item .caption .hits {
    font-size: 14px;
    color: var(--text-color-secondary);
}

.post-item .caption a {
    display: block;
}

/*--------------------------------------------------------------
# list Page
--------------------------------------------------------------*/
.category-nav .sidebar-title {
    background-color: var(--primary-color);
    color: #ffffff;
    padding: 18px 0 24px 30px;
}

.category-nav .sidebar-title h4 {
    font-size: 36px;
}

.category-nav .sidebar-title h2 {
    font-size: 35px;
}

.category-nav .sidebar-title p {
    font-size: 24px;
}

.category-nav-sidebar, .sidebar-contact {
    background-color: #e5e5e5;
    padding: 15px 0;
}

.category-nav-sidebar li {
    border-left: 5px solid transparent;
}

.category-nav-sidebar li.active {
    border-color: var(--primary-color);
    background-color: #cdcccc;
    box-shadow: 3px 3px 4px rgba(139, 138, 138, .4);
}

.category-nav-sidebar li:hover {
    background-color: #cdcccc;
}

.category-nav-sidebar a {
    text-align: center;
    display: block;
    font-size: 21px;
    padding: 20px 15px;
    margin-left: -5px;
}

.sidebar-contact {
    padding: 15px;
}

.sidebar-contact h3 {
    font-size: 20px;
    color: var(--primary-color);
}

.sidebar-contact p {
    font-size: 14px;
}

.sidebar-contact p strong {
    min-width: 30px;
    display: inline-block;
}

.sidebar-contact span {
    color: #adadad;
    margin: 0 2px;
    font-size: 12px;
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .category-nav .sidebar-title h4 {
        font-size: 30px;
    }

    .category-nav .sidebar-title h2 {
        font-size: 20px;
    }

    .category-nav .sidebar-title p {
        font-size: 16px;
    }
}

.article-box {
    padding: 10px;
    border: 1px solid var(--border-color);
}

.article-box .article-info {
    padding-bottom: 35px;
}

.article-box .article-info h3 {
    font-size: 20px;
    line-height: 1.5;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--light-bg-color);
}

.article-box .article-info .post-desc {
    font-size: 14px;
    color: var(--text-color-secondary);
}

.article-box .article-info .post-more {
    font-size: 14px;
    position: absolute;
    bottom: 5px;
    left: calc(var(--bs-gutter-x) * .5);
    right: calc(var(--bs-gutter-x) * .5);

}

.article-box .article-info .post-more, .article-box .article-info .post-more a {
    color: var(--text-color-secondary);
}

.post-btn a {
    background-color: var(--focus-color);
    color: #ffffff !important;
    display: inline-block;
    padding: 5px 10px;
}

/*--------------------------------------------------------------
# article Page
--------------------------------------------------------------*/
.article .article-title h2 {
    font-size: 30px;
    text-align: center;
}

.article .article-title p {
    color: var(--text-color-secondary);
    text-align: center;
}

.article-footer {
    padding: 10px 20px;
    font-size: 14px;
}


.article .article-body img {
    max-width: 100%;
    height: auto;
}


/*--------------------------------------------------------------
# join us
--------------------------------------------------------------*/
#job-nav {
    margin-top: -40px;
}

.category-nav-tabs {
    width: 100%;
    padding: 20px 30px;
    border-radius: 10px;
    background-color: #e5e5e5;
}

.category-nav-tabs li {
    display: inline-block;
}

.category-nav-tabs li a {
    display: inline-block;
    font-size: 20px;
    padding: 5px 25px;
}

.category-nav-tabs li.active a {
    font-weight: 600;
    color: var(--primary-color);

}


.job-box {
    padding: 20px 30px;
}

.job-box.bg {
    background-color: var(--light-bg-color);
}

.job-box h3 a {
    font-size: 22px;
}

.job-box .post-other {
    color: var(--text-color-secondary);
}

.job-detail, .job-address, .hr-contact {
    padding: 20px;
    background-color: #ffffff;
    position: relative;
}

.job-address, .hr-contact {
    margin-top: 20px;
}

.job-address, .hr-contact p {
    margin-bottom: 0;
}

@media (min-width: 992px) {
    .job-detail {
        margin-left: 100px;
        padding: 40px 30px;
    }

    .job-detail .article-title {
        position: absolute;
        background-color: var(--primary-color);
        left: -100px;
        min-width: 50%;
        padding: 20px 20px 20px 130px;
        color: #ffffff;
        text-align: left;

    }

    .job-detail .article-title p {
        margin-bottom: 0;
        color: #ffffff;
    }

    .job-detail .article-body {
        padding-top: 150px
    }

    .job-address, .hr-contact {
        margin-left: 100px;
        padding: 30px;
    }

}

.sidebar-article h3 {
    font-size: 22px;
    color: var(--primary-color);
}

.sidebar-article .job-more {
    margin: 1rem 0;
}

.sidebar-article .job-more li {
    border-bottom: 1px dashed #e5e5e5;
    padding: 0.5rem 0;
}

.sidebar-article .job-more li a {
    font-size: 16px;
}

.sidebar-article .job-more li p {
    font-size: 14px;
    color: var(--text-color-secondary);
    margin-bottom: 0;
}

/*--------------------------------------------------------------
# contact
--------------------------------------------------------------*/

.spread_page .center_box {
    border-bottom: 2px solid #ccc
}

.spread_page .map_wrapper {
    position: relative
}


.spread_page .map_wrapper text {
    font-size: .5rem;
    font-weight: 700
}

.spread_page .map_wrapper .legend_box {
    position: absolute;
    left: calc(var(--bs-gutter-x) * .5);
    bottom: 70px
}

.spread_page .map_wrapper .legend_box p {
    margin-top: 20px
}

.spread_page .map_wrapper .legend_box p b {
    font-size: 20px
}

.spread_page .map_wrapper .legend_box img {
    width: 20px;
    vertical-align: middle;
    margin-right: 10px
}

.spread_page .map_wrapper .abridge_pic {
    position: absolute;
    bottom: 70px;
    right: calc(var(--bs-gutter-x) * .5);
}

@media (min-width: 1200px) {
    .spread_page .map_wrapper {
        height: 1000px;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .spread_page .map_wrapper {
        height: 700px;
    }
}

@media (max-width: 767.98px) {
    .spread_page .map_wrapper {
        height: 400px;
    }

    .spread_page .map_wrapper .abridge_pic {
        bottom: 0;
        width: 50px;
        height: auto;
    }

    .spread_page .map_wrapper .legend_box {
        bottom: -20px;
    }

    .spread_page .map_wrapper .legend_box p {
        margin: 0;
    }
}

.contact-map {
    max-height: 350px;
}


.contact-box {
    padding: 30px;
    border: 1px solid #fff;
    box-shadow: 1px 1px 6px rgba(0, 0, 0, .1);
    overflow: hidden;
    position: relative;
    transition: 0.3s;
}

.contact-box:after {
    content: "";
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: #fff;
    border: 28px solid #fafafc;
    position: absolute;
    right: -58px;
    bottom: -65px;
    z-index: -1;
}

.contact-box:hover {
    border-color: var(--focus-color);
}

.contact-box h3 {
    font-size: 24px;
    margin-bottom: 1rem;
}

.contact-box p {
    font-size: 14px;
    margin-bottom: 0;
    padding: 5px 0;
}

.contact-box p em {
    margin-right: 8px;
    width: 22px;
    color: var(--primary-color);
    text-align: center;
}

.btn-message {
    background-color: var(--primary-color);
    font-size: 18px;
    color: #ffffff;
    border: none;
    padding: 10px 30px;
}

@media (max-width: 768px) {
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        padding-right: calc(var(--bs-gutter-x) * 1.5);
        padding-left: calc(var(--bs-gutter-x) * 1.5);
    }

    body {
        font-size: 14px;
    }

    section {
        padding: 20px 0;
    }

    .section-title__main h2,
    .list-title h2,
    .banner-inner-wrapper h3,
    .about-supply h2,
    .section-title__v3 h2,
    .section-title__v4 h2 {
        font-size: 24px;
    }

    .section-title__main p {
        font-size: 20px;
    }

    .swiper-solution .detail h3 {
        font-size: 20px;
    }

    .count-box {
        min-height: 160px;
        padding: 10px;
    }


    .count p.cb-num {
        font-size: 20px;
        margin: 5px;
    }

    .count p {
        text-align: center;
        font-size: 14px;
        margin: 0;
    }

    .swiper-solution .detail h5 {
        font-size: 16px;
    }

    .about .detail {
        font-size: initial;
    }

    .cta .cta-title {
        font-size: 24px;
    }

    .gun-wrapper {
        font-size: 16px;
    }

    .category-nav-list li a {
        font-size: 16px;
    }

    .history-box .text h3 {
        font-size: 18px;
    }

    .about-supply .supply-list li {
        font-size: 16px;
        margin-bottom: 15px;
    }

    .culture-box .text h3, .advantages-box .text h3 {
        font-size: 18px;
    }

    .category-nav__service a {
        font-size: 18px;
    }

    .post-item .caption h4,
    .article-box .article-info h3 {
        font-size: 16px;

    }

    .article .article-title h2 {
        font-size: 18px;
    }

    .category-nav-tabs li a {
        font-size: 18px;
        padding: 5px 10px;
    }

    .job-box h3 a {
        font-size: 16px;
    }

    .sidebar-article h3 {
        font-size: 18px;
    }

    .contact-box {
        padding: 10px;
    }

    .contact-box h3 {
        font-size: 16px;
    }

    .category-nav-sidebar a {
        font-size: 18px;
        padding: 5px 15px;
    }
}