﻿.flex-row {
    display: flex;
    flex-direction: row
}

.flex-col {
    display: flex;
    flex-direction: column
}

.position-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

@font-face {
    font-family: "Hansief";
    src: url(../font/Hansief.woff)
}

.swiper-slide {
    cursor: grab
}
.pagination .page-item:last-child{
    display: none;
}
.pagination .page-item:first-child{
    display: none;
}
.num-font {
    font-family: "Hansief"
}

.cos-container {
    width: 1300px;
    margin: 0 auto
}

.swiper-pagination-bullet-active {
    background: #b93443
}

html,
body {
    font-size: 16px
}

a {
    color: #222222
}

header {
    position: sticky;
    top: 0;
    z-index: 999;
    background: #fff
}

header .pc-header {
    justify-content: space-between;
    align-items: stretch;
    padding: 0 3.13rem;
    position: relative;
    background: #ffffff;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.24)
}

header .pc-header .logo {
    flex-shrink: 0;
    margin: 1.88rem 0;
    width: 20.63rem;
    margin-right: 3.38rem
}

header .pc-header .lang-group {
    position: relative;
    justify-content: center;
    align-items: center;
    flex-shrink: 0
}

header .pc-header .lang-group .lang-pic-box {
    width: 8.88rem;
    min-height: 1.88rem
}

header .pc-header .lang-group .lang-pic {
    transition: all .2s;
    cursor: pointer
}

header .pc-header .lang-group .lang-default {
    display: block
}

header .pc-header .lang-group .lang-height {
    display: none
}

header .pc-header .lang-group .lang-menus {
    position: absolute;
    width: 100%;
    top: 100%;
    left: 50%;
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #cacaca;
    padding: .94rem;
    transform: translate(-50%, -50%);
    z-index: 3;
    display: none
}

header .pc-header .lang-group .lang-menus a {
    font-size: 1rem;
    color: #222222;
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .31rem;
    transition: all .2s
}

header .pc-header .lang-group .lang-menus a .icon {
    width: .44rem;
    flex-shrink: 0;
    margin-left: 1.25rem
}

header .pc-header .lang-group .lang-menus a:hover {
    color: #b93443
}

header .pc-header .lang-group:hover .lang-default {
    display: none
}

header .pc-header .lang-group:hover .lang-height {
    display: block
}

header .pc-header .nav-groups {
    justify-content: flex-start;
    align-items: center;
    flex: 1
}

header .pc-header .nav-groups .nav-item {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

header .pc-header .nav-groups .nav-item .children {
    width: 100%;
    padding: 3.13rem;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 3;
    background-color: #eeeeee;
    display: none
}

header .pc-header .nav-groups .nav-item .children .childre-item {
    padding-right: 1.88rem;
    margin-right: 1.88rem;
    position: relative
}

header .pc-header .nav-groups .nav-item .children .childre-item .child-href {
    font-size: 1.13rem;
    transition: all .2s;
    color: #222222
}

header .pc-header .nav-groups .nav-item .children .childre-item .child-href:hover {
    color: #b93443
}

header .pc-header .nav-groups .nav-item .children .childre-item::after {
    content: "";
    display: block;
    width: 1px;
    height: 80%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: #222222
}

header .pc-header .nav-groups .nav-item .children .childre-item:last-child::after {
    display: none
}

header .pc-header .nav-groups .nav-item .nav-href {
    font-size: 1.38rem;
    color: #111;
    font-weight: bold;
    white-space: nowrap;
    transition: all .2s;
    position: relative;
    padding-right: 2.19rem;
    margin-right: 2.19rem
}

header .pc-header .nav-groups .nav-item .nav-href::after {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%) skewX(-10deg);
    content: "";
    display: block;
    width: 1px;
    height: 70%;
    border-right: 1px solid #a8a8a8
}

header .pc-header .nav-groups .nav-item .active {
    color: #b93443
}

header .pc-header .nav-groups .nav-item .nav-href:hover {
    color: #b93443
}

header .pc-header .nav-groups .nav-item:last-child .nav-href::after {
    display: none
}

header .mobile-header {
    justify-content: space-between;
    align-items: stretch;
    padding: 0 .94rem
}

header .mobile-header .logo {
    width: 50%
}

header .mobile-header .logo .mob-logo-pic {
    margin: 1rem 0
}

header .mobile-header .lang-groups {
    position: relative;
    width: 40%;
    justify-content: flex-end
}

header .mobile-header .lang-groups .lang-pic {
    width: 60%;
    flex-shrink: 0;
    object-fit: contain
}

header .mobile-header .lang-groups .mob-langs {
    position: absolute;
    top: 100%;
    left: 0%;
    z-index: 3;
    background-color: #fff;
    padding: .63rem 1.25rem;
    border-radius: 0 0 .63rem .63rem;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.24);
    display: none
}

header .mobile-header .lang-groups .mob-langs .mob-lang-link {
    font-size: 1.13rem
}

header .mobile-header .lang-groups .mob-menu {
    width: 2.85rem;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    padding: .19rem;
    margin-left: 1.88rem
}

header .mobile-header .mob-navs {
    width: 100vh;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 4;
    display: none
}

header .mobile-header .mob-navs .mob-nav-header {
    height: 3.75rem;
    width: 3.75rem;
    margin-left: auto;
    padding: .63rem
}

header .mobile-header .mob-navs .mob-navs-group {
    width: 100vw;
    height: 80%;
    background-color: #fff;
    overflow-y: scroll
}

header .mobile-header .mob-navs .mob-navs-group .slide-menu {
    width: 3.13rem;
    padding: .63rem
}

header .mobile-header .mob-navs .mob-navs-group .mob-nav-item:last-child .first-menu {
    border-bottom: none
}

header .mobile-header .mob-navs .mob-navs-group .first-menu {
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f1f1f1;
    flex: 1;
    height: 3.75rem;
    padding: 0 .94rem
}

header .mobile-header .mob-navs .mob-navs-group .first-menu .mob-nav-link {
    flex: 1
}

header .mobile-header .mob-navs .mob-navs-group .mob-children {
    padding: 0 1.88rem;
    background-color: #f1f1f1;
    display: none
}

header .mobile-header .mob-navs .mob-navs-group .mob-children .mob-childre-item {
    padding: .63rem 0
}

footer .pc-footer {
    border-top: 1px solid #dedede;
    background-color: #f8f8f8
}

footer .pc-footer .cos-container {
    padding-top: 3.75rem;
    padding-bottom: 2.5rem
}

footer .pc-footer .cos-container .footer-navs {
    justify-content: space-between;
    align-items: stretch
}

footer .pc-footer .cos-container .nav-item-title {
    font-size: 1.13rem;
    font-weight: bold;
    margin-bottom: 1.88rem;
    color: #222222;
    padding-bottom: 1.88rem;
    border-bottom: 1px solid #cecece;
    position: relative
}

footer .pc-footer .cos-container .nav-item-title::after {
    content: "";
    display: block;
    width: 1.25rem;
    height: 3px;
    background-color: #0268b3;
    position: absolute;
    left: 0;
    bottom: -2px
}

footer .pc-footer .cos-container .footer-nav-item:nth-child(2) .nav-item-title::after {
    background-color: #04aeb6
}

footer .pc-footer .cos-container .footer-nav-item:nth-child(3) .nav-item-title::after {
    background-color: #f2b705
}

footer .pc-footer .cos-container .footer-nav-item:nth-child(4) .nav-item-title::after {
    background-color: #dd4761
}

footer .pc-footer .cos-container .f-link {
    color: #555555;
    font-size: 1rem;
    display: block;
    margin-bottom: 1.25rem;
    transition: all .2s
}

footer .pc-footer .cos-container .footer-nav-link:last-child .f-link {
    margin-bottom: 0
}

footer .pc-footer .cos-container .f-link:hover {
    color: #b93443
}

footer .pc-footer .cos-container .tel-title {
    font-size: 1.25rem;
    color: #222222;
    font-weight: bold;
    margin-bottom: 1rem;
    justify-content: flex-end
}

footer .pc-footer .cos-container .tel-title .tel-icon {
    width: 1.5rem;
    flex-shrink: 0;
    margin-right: 6px
}

footer .pc-footer .cos-container .tel-num {
    color: #b93443;
    font-size: 1.88rem;
    font-weight: bold;
    margin-bottom: 1rem;
    letter-spacing: 2px
}

footer .pc-footer .cos-container .qrcode-box {
    margin-left: auto;
    text-align: center;
    width: max-content
}

footer .pc-footer .cos-container .qrcode-box .qrcode {
    width: 5.63rem
}

footer .pc-footer .cos-container .qrcode-box .qrmark {
    font-size: 1rem;
    color: #222222
}

footer .pc-footer .footer-copy {
    background-color: #f3f3f3;
    color: #555555;
    font-size: .88rem;
    text-align: center;
    padding: 1.75rem 0
}

footer .pc-footer .footer-copy a {
    color: #555;
    font-size: .88rem;
    transition: all .2s
}

footer .pc-footer .footer-copy a:hover {
    color: #b93443
}

footer .mob-footer {
    background-color: #f3f3f3
}

footer .mob-footer .footer-cp {
    font-size: 1rem;
    color: #222222;
    text-align: center;
    padding: .94rem 0
}

footer .mob-footer .footer-cp p {
    margin: 0
}

footer .mob-footer .footer-cp a {
    font-size: 1rem;
    color: #222222
}

@media (max-width:1400px) {
    html {
        font-size: 14px
    }

    .cos-container {
        width: 1300px
    }
}

@media (max-width:1200px) {
    html {
        font-size: 10px
    }

    .cos-container {
        width: 992px
    }
}

@media (max-width:992px) {
    html {
        font-size: 10px
    }

    .cos-container {
        width: 768px
    }
}

@media (max-width:768px) {
    html {
        font-size: 12px
    }

    .cos-container {
        width: 576px
    }
}

@media (max-width:576px) {
    html {
        font-size: 12px
    }

    .cos-container {
        width: 95%;
        margin: 0 auto;
        overflow: hidden
    }
}

.section-title {
    font-size: 2.88rem;
    color: #b93443;
    font-weight: bold;
    text-align: center;
    margin: 0 auto;
    padding-top: 6.25rem;
    padding-bottom: 3.13rem;
    margin-bottom: 3.75rem;
    position: relative;
    border-bottom: 1px solid #eee;
    width: max-content
}

.pagination {
    justify-content: center
}

.section-title::after {
    content: "";
    display: block;
    width: 2.5rem;
    height: .44rem;
    background-color: #b93443;
    position: absolute;
    bottom: -0.19rem;
    left: 50%;
    transform: translateX(-50%);
    border-radius: .25rem
}

.index-about {
    position: relative
}

.index-about .about-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1
}

.index-about .section-content {
    width: 66.88rem;
    margin: 0 auto;
    text-align: center;
    font-size: 1.3rem;
    color: #222222;
    line-height: 1.7
}

.index-about .section-content .section-img {
    transform: translateY(-15%);
    z-index: -1;
    position: relative
}

.index-product .section-top {
    background-color: #fef8f8;
    padding-bottom: 5.31rem
}

.index-product .section-top .product-categorys {
    justify-content: space-between;
    align-items: flex-start
}

.index-product .section-top .product-categorys .category-item {
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    color: #111;
    flex: 1;
    transition: all .2s
}

.index-product .section-top .product-categorys .category-item .item-title {
    margin-top: .81rem;
    font-weight: bold;
    text-align: center
}

.index-product .section-top .product-categorys .category-item:hover {
    color: #b93443
}

.index-product .section-top .product-categorys .category-item:last-child {
    margin-right: 0
}

.index-product .section-bottom {
    padding-top: 7.5rem;
    padding-bottom: 8.44rem;
    margin: 0 5.63rem
}

.index-product .section-bottom .box-img {
    width: 100%;
    transition: all .4s ease-in-out
}

.index-product .section-bottom .section-box:hover .box-img {
    transform: scale(1.1)
}

.index-product .section-bottom .section-bottom-one {
    margin-bottom: 1.88rem
}

.index-product .section-bottom .section-bottom-one .section-box {
    border: .44rem solid #e14f61;
    position: relative;
    overflow: hidden
}

.index-product .section-bottom .section-bottom-one .section-box .box-title {
    position: absolute;
    background: #e14f61;
    color: #fff;
    writing-mode: vertical-lr;
    font-size: 1rem;
    top: 1.25rem;
    right: 1.25rem;
    padding: .38rem .63rem;
    letter-spacing: 2px;
    z-index: 3
}

.index-product .section-bottom .section-bottom-two .section-box {
    border: .44rem solid #f6b800;
    position: relative;
    overflow: hidden
}

.index-product .section-bottom .section-bottom-two .section-box .box-title {
    position: absolute;
    background: #f6b800;
    color: #fff;
    writing-mode: vertical-lr;
    font-size: 1rem;
    top: 1.25rem;
    right: 1.25rem;
    padding: .38rem .63rem;
    letter-spacing: 2px;
    z-index: 3
}

.index-kehu {
    background-color: #fffcf8;
    padding-bottom: 9.38rem;
    position: relative
}

.index-kehu .swiper-box {
    position: relative;
    margin: 0 10.94rem
}

.index-kehu .swiper {
    width: 86.25rem;
    height: 30.63rem;
    padding-bottom: 3.75rem;
    margin-left: auto;
    margin-right: auto
}

.index-kehu .swiper-slide {
    height: calc(100% / 3.2) !important;
    display: flex;
    justify-content: center;
    align-items: center
}

.index-kehu .swiper-slide img {
    height: 100%;
    width: 100%;
    object-fit: contain
}

.index-kehu .swiper-button-next {
    width: 3.44rem;
    height: 3.44rem;
    top: 45%;
    border-radius: 50%;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-image: url(../image/arrow-right.png)
}

.index-kehu .swiper-button-next::after {
    display: none
}

.index-kehu .swiper-button-prev {
    width: 3.44rem;
    height: 3.44rem;
    top: 45%;
    border-radius: 50%;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-image: url(../image/arrow-left.png)
}

.index-kehu .swiper-button-prev::after {
    display: none
}

.index-kehu .color-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.inside-banner {
    position: relative
}

.inside-banner .inside-banner-content {
    justify-content: center;
    align-items: center;
    white-space: nowrap
}

.inside-banner .inside-banner-content .banner-desc {
    color: #b93443;
    font-size: 1.38rem;
    margin-top: 1.69rem
}

.inside-navs {
    justify-content: center;
    align-items: center;
    background-color: #fff;
    padding: 1.5rem 0
}

.inside-navs .inside-nav-item {
    font-size: 1rem;
    color: #222222;
    padding: 0 3.75rem;
    transition: all .2s
}

.inside-navs .inside-nav-item:hover {
    color: #b93443
}

.inside-navs .active {
    color: #b93443
}

.process-inside-navs {
    background-color: #f9f9f9
}

#description {
    background-color: #fffcf8;
    padding-top: 9.06rem;
    padding-bottom: 8.13rem
}

#description .desc-about {
    margin-bottom: 3.75rem
}

#description .desc-about .desc-left .desc-title {
    font-size: 2.75rem;
    color: #222222;
    padding-bottom: 1.88rem;
    position: relative;
    margin-bottom: 1.88rem
}

#description .desc-about .desc-left .desc-title::after {
    content: "";
    display: block;
    width: 4.38rem;
    height: .38rem;
    background-color: #b93443;
    position: absolute;
    left: 0;
    bottom: 0
}

#description .desc-about .desc-left .desc-content {
    color: #222222;
    font-size: 1.13rem;
    line-height: 2;
    padding-right: 3.13rem;
    text-align: justify
}

#description .desc-lists {
    margin-bottom: 6.56rem
}

#description .desc-lists .list-item {
    font-size: 1.25rem;
    color: #222222;
    margin-bottom: 1.88rem;
    display: flex;
    justify-content: flex-start;
    align-items: center
}

#description .desc-lists .list-item::before {
    content: "";
    display: block;
    width: 1.13rem;
    height: 1.13rem;
    background-color: #b93443;
    border-radius: .25rem;
    flex-shrink: 0;
    margin-right: 1.25rem
}

#description .icon-groups {
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap
}

#description .icon-groups .icon-item {
    width: 17%;
    margin-right: 2.5rem
}

#description .icon-groups .icon-item:last-child {
    margin-right: 0
}

#history {
    background-image: url(../image/history-bg.jpg);
    background-position: center;
    background-size: cover;
    padding-top: 7.5rem;
    padding-bottom: 5rem
}

#history .history-title {
    font-size: 2.5rem;
    color: #222222;
    text-align: center
}

#history .history-sub-title {
    font-size: 1.13rem;
    color: #222222;
    margin-top: 1.88rem;
    margin-bottom: 7.5rem;
    text-align: center
}

#history .time-line {
    padding-left: 19.06rem;
    color: #222222;
    font-size: 1.63rem;
    font-weight: bold;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 3.75rem
}

#history .time-line .time-line-item {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center
}

#history .time-line .time-line-item::after {
    content: "";
    display: block;
    flex: 1;
    height: 2px;
    margin: 0 .88rem;
    border-bottom: 1px dashed #d8d8d8
}

#history .history-swiper {
    padding-left: 19.06rem
}

#history .history-swiper .swiper {
    margin-bottom: 4.13rem;
    padding: 1.25rem 0;
    cursor: grab
}

#history .history-swiper .swiper-slide {
    padding: 1.88rem;
    background: #ffffff;
    box-shadow: 0 2px 21px 0 rgba(0, 0, 0, 0.15)
}

#history .history-swiper .swiper-slide .time {
    color: #b93443;
    font-size: 2.75rem;
    padding-bottom: 1.88rem;
    border-bottom: 1px solid #dbdddf;
    margin-bottom: 1.56rem
}

#history .slide-buttons {
    justify-content: center;
    align-items: center
}

#history .slide-buttons .slide-button {
    width: 3.31rem;
    height: 3.31rem;
    border-radius: 50%;
    margin: 0 .88rem;
    cursor: pointer
}

#customer {
    position: relative;
    background-color: #fffcf8;
    padding-bottom: 11.88rem
}

#customer .section-title {
    font-weight: 500;
    font-size: 2.5rem;
    color: #222222;
    border-bottom: none;
    padding-bottom: 0
}

#customer .customer-sub-title {
    font-size: 1.13rem;
    color: #222222;
    text-align: center;
    margin-top: 1.88rem;
    margin-bottom: 7.5rem
}

#customer .section-title::after {
    display: none
}

#customer .swiper-box {
    position: relative;
    margin: 0 10.94rem
}

#customer .swiper {
    width: 86.25rem;
    height: 30.63rem;
    padding-bottom: 3.75rem;
    margin-left: auto;
    margin-right: auto
}

#customer .swiper-slide {
    height: calc(100% / 3.2) !important;
    display: flex;
    justify-content: center;
    align-items: center
}

#customer .swiper-slide img {
    height: 100%;
    width: 100%;
    object-fit: contain
}

#customer .swiper-button-next {
    width: 3.44rem;
    height: 3.44rem;
    border-radius: 50%;
    top: 45%;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-image: url(../image/arrow-right.png)
}

#customer .swiper-button-next::after {
    display: none
}

#customer .swiper-button-prev {
    width: 3.44rem;
    height: 3.44rem;
    top: 45%;
    border-radius: 50%;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-image: url(../image/arrow-left.png)
}

#customer .swiper-button-prev::after {
    display: none
}

.device-section-title {
    font-size: 2.5rem;
    color: #222222;
    font-weight: bold;
    text-align: center;
    margin-bottom: 3.13rem
}

#production {
    background-color: #fef8f8;
    padding-top: 5rem
}

#production .cos-container {
    background-color: #fff;
    padding: 4.38rem;
    box-shadow: 0 4px 28px 0 rgba(0, 0, 0, 0.06)
}

#production .cos-container .production-list-title {
    justify-content: flex-start;
    align-items: center;
    color: #222222;
    font-size: 1.38rem;
    padding-bottom: 1.25rem;
    border-bottom: 3px solid #b93443;
    margin-bottom: 3.44rem
}

#production .cos-container .production-list-title .production-icon {
    width: 2.31rem;
    margin-right: .63rem
}

#production .cos-container .production-lists {
    margin-bottom: 3.44rem
}

#production .cos-container .production-lists .production-list-item {
    align-items: center;
    justify-content: space-between;
    font-size: 1.13rem;
    color: #444;
    margin-bottom: 1.25rem;
    padding-left: 1.56rem
}

#production .cos-container .production-lists .production-list-item .item-title {
    white-space: nowrap;
    flex-direction: 0;
    margin-right: 1.56rem
}

#production .cos-container .production-lists .production-list-item .item-line {
    flex: 1;
    height: 1px;
    border-bottom: 1px dashed #cacfd2
}

#production .cos-container .production-lists .production-list-item .num {
    white-space: nowrap;
    margin-left: .75rem;
    flex-shrink: 0
}

#production .cos-container .production-lists .production-list-item:nth-child(2n + 1) {
    padding-right: 3.13rem
}

#production .cos-container .production-lists .production-list-item:nth-child(2n) {
    padding-left: 3.13rem
}

#production .cos-container .production-lists .production-list-item::before {
    content: "";
    display: block;
    width: .56rem;
    height: .56rem;
    flex-shrink: 0;
    border-radius: 50%;
    background-color: #b93443;
    margin-right: 1rem
}

#production .cos-container .production-pics {
    align-items: stretch
}

#production .cos-container .production-pics .pic-left {
    padding: 0
}

#production .cos-container .production-pics .pic-left img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

#production .cos-container .production-pics .pic-right {
    padding-right: 0;
    justify-content: space-between
}

#production .cos-container .production-pics .pic-right .pic-top {
    flex: 1;
    padding-bottom: .45rem
}

#production .cos-container .production-pics .pic-right .pic-top img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

#production .cos-container .production-pics .pic-right .pic-bottom {
    flex: 1;
    padding-top: .45rem
}

#production .cos-container .production-pics .pic-right .pic-bottom img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

#experiment {
    padding-top: 5rem;
    padding-bottom: 8.75rem;
    background-color: #fef8f8
}

#experiment .cos-container {
    padding: 4.38rem;
    background-color: #fff;
    box-shadow: 0 4px 28px 0 rgba(0, 0, 0, 0.06);
    align-items: stretch
}

#experiment .exper-left {
    padding: 0
}

#experiment .exper-left .exper-top-pic {
    margin-bottom: 1rem
}

#experiment .exper-left .bottom-left {
    padding-right: .5rem
}

#experiment .exper-left .bottom-right {
    padding-left: .5rem
}

#experiment .exper-right {
    padding-right: 0;
    padding-left: 4.13rem
}

#experiment .exper-right .exper-right-title {
    align-items: center;
    font-size: 1.38rem;
    color: #222222;
    padding-bottom: 1.38rem;
    border-bottom: 3px solid #b93443;
    margin-bottom: 3.13rem;
    justify-content: flex-start
}

#experiment .exper-right .exper-right-title .exper-icon {
    width: 2.25rem;
    margin-right: .75rem
}

#experiment .exper-right .exper-right-list .exper-right-item {
    font-size: 1.13rem;
    color: #444444;
    margin-bottom: 1.38rem;
    justify-content: space-between;
    align-items: center
}

#experiment .exper-right .exper-right-list .exper-right-item::before {
    content: "";
    display: block;
    width: .56rem;
    height: .56rem;
    border-radius: 50%;
    background-color: #b93443;
    margin-right: 1rem;
    flex-shrink: 0
}

#experiment .exper-right .exper-right-list .exper-item-title {
    white-space: nowrap;
    flex-shrink: 0;
    margin-right: .44rem
}

#experiment .exper-right .exper-right-list .exper-item-line {
    flex: 1;
    height: 1px;
    border-bottom: 1px dashed #cacfd2
}

#experiment .exper-right .exper-right-list .exper-item-num {
    white-space: nowrap;
    margin-left: 1.13rem
}

#system {
    background-color: #fef8f8;
    padding-top: 6.25rem;
    padding-bottom: 8.13rem
}

#system .system-section-title {
    font-size: 2.5rem;
    color: #222222;
    font-weight: bold;
    text-align: center;
    margin-bottom: 3.13rem
}

#system .cos-container {
    padding: 0;
    background-color: #fff;
    border: 10px solid;
    border-image: linear-gradient(111deg, #9bcbf1, #dbf, #e68c8c) 10 10
}

#system .cos-container .system-pic {
    margin-bottom: 3.75rem
}

#system .cos-container .system-pic img {
    width: 100%
}

#system .cos-container .system-pic2 {
    background-color: #f4f4f2;
    padding: 5.63rem 1.06rem;
    margin-bottom: 5.63rem
}

#system .cos-container .system-chart {
    align-items: center
}

#system .cos-container .system-chart .chart-left {
    padding: 0;
    padding-right: 1.88rem
}

#system .cos-container .system-chart .chart-left .chart-title {
    background-color: #e14f61;
    color: #fff;
    font-size: 1.88rem;
    text-align: center;
    padding: 1.56rem 0
}

#system .cos-container .system-chart .chart-left .chart-items {
    padding: 4.38rem 2.5rem;
    width: 100%;
    margin: 0 auto;
    background-color: #f4f4f2
}

#system .cos-container .system-chart .chart-left .chart-items .chart-item {
    margin-bottom: 1.75rem
}

#system .cos-container .system-chart .chart-left .chart-items .chart-item .chart-icon {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    margin-right: 1.25rem
}

#system .cos-container .system-chart .chart-right {
    padding-left: 1.88rem
}

#certificate {
    padding-top: 7.5rem;
    padding-bottom: 7.75rem;
    background-image: url(../image/certificate-bg.jpg);
    background-size: cover;
    background-position: center
}

#certificate .system-section-title {
    font-size: 2.5rem;
    color: #222222;
    font-weight: bold;
    text-align: center;
    margin-bottom: 3.13rem
}

#certificate .cos-container {
    padding-bottom: 2.5rem
}

#certificate .cos-container .certificate-wrapper {
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch
}

#certificate .cos-container .certificate-wrapper .cert-item {
    margin-right: 5rem;
    flex-shrink: 0;
    text-align: center
}

#certificate .cos-container .certificate-wrapper .cert-item img {
    border: .94rem solid #e14f61;
    margin: 0 auto
}

#certificate .cos-container .certificate-wrapper .cert-item .cert-item-title {
    font-size: 1.25rem;
    color: #222222;
    font-weight: bold;
    margin-top: 2.81rem
}

#process {
    padding-top: 4.06rem;
    padding-bottom: 4.06rem
}

#process .process-section-title {
    font-size: 2.5rem;
    color: #222222;
    font-weight: bold;
    text-align: center;
    margin-bottom: 3.13rem;
    margin-bottom: 4.38rem
}

#process .process-desc {
    position: relative;
    padding: 2.5rem 3.13rem;
    background-color: #fef8f8;
    margin-bottom: 5rem
}

#process .process-desc .process-icon {
    width: 3.38rem
}

#process .process-desc .right-icon {
    margin-left: auto
}

#process .process-desc .process-desc-content {
    text-align: center;
    font-size: 1.38rem;
    color: #222222;
    line-height: 2;
    padding: 0 3rem
}

#process .process-content img {
    margin: 0 auto
}

.product-wrapper {
    background-image: url(../image/product-bg.jpg);
    background-size: cover;
    background-position: center;
    padding-bottom: 5.5rem
}

.product-wrapper .product-category {
    justify-content: space-between;
    align-items: stretch;
    text-align: center;
    padding: 0 1.38rem;
    background-color: #fff;
    margin-bottom: 5rem
}

.product-wrapper .product-category .category-item {
    padding: 3.75rem 0;
    position: relative;
    flex: 1
}

.product-wrapper .product-category .category-item a {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center
}

.product-wrapper .product-category .category-item img {
    transition: all .2s
}

.product-wrapper .product-category .category-item:hover img {
    transform: scale(1.01)
}

.product-wrapper .product-category .active::after {
    content: "";
    display: block;
    width: 7.5rem;
    height: .5rem;
    background-color: #1c7cc0;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%)
}

.product-wrapper .product-category .category-title {
    font-size: 1.5rem;
    color: #222222;
    text-align: center;
    margin-top: 1.75rem
}

.product-wrapper .product-lists {
    align-items: stretch
}

.product-wrapper .product-lists .product-item {
    margin-bottom: 1.88rem
}

.product-wrapper .product-lists .product-item .item-content {
    height: 100%;
    background-color: #ffffff
}

.product-wrapper .product-lists .product-item .product-pic-box {
    padding: .63rem
}

.product-wrapper .product-lists .product-item .product-pic-box .product-pic {
    width: 100%
}

.product-wrapper .product-lists .product-item .product-name {
    font-size: 1.75rem;
    color: #b93443;
    padding: 2.19rem 1.75rem
}

.product-wrapper .product-lists .product-item .product-desc {
    font-size: 1.13rem;
    color: #666666;
    line-height: 2;
    padding: 2.75rem 1.75rem;
    padding-top: 0;
    margin: 0
}

.factory-wrapper {
    background-color: #fef8f8;
    padding-top: 7.5rem;
    padding-bottom: 10.25rem
}

.factory-wrapper .cos-container .address-lists .address-item {
    background: #ffffff;
    box-shadow: 0 4px 28px 0 rgba(0, 0, 0, 0.06);
    margin-bottom: 4.38rem
}

.factory-wrapper .cos-container .address-lists .address-item .address-text {
    padding: 4.19rem 5.63rem
}

.factory-wrapper .cos-container .address-lists .address-item .address-text .aicon {
    width: 1.69rem;
    margin-right: .81rem
}

.factory-wrapper .cos-container .address-lists .address-item .address-text .address-title {
    align-items: center;
    font-size: 1.88rem;
    color: #b93443;
    padding-bottom: 2.19rem;
    border-bottom: 1px solid #ececec;
    margin-bottom: 3rem
}

.factory-wrapper .cos-container .address-lists .address-item .address-text .infos .info {
    font-size: 1.25rem;
    color: #222222;
    margin-bottom: .81rem
}

.factory-wrapper .cos-container .address-lists .address-item .address-text .infos .info:last-child {
    margin-bottom: 0
}

.factory-wrapper .cos-container .address-lists .address-item .address-pic {
    padding: 1.25rem
}

.contact-wrapper {
    background-color: #fef8f8;
    padding-top: 6.25rem
}

.contact-wrapper .form-title .title {
    font-size: 1.88rem;
    color: #222222;
    margin-bottom: .81rem;
    font-weight: 500
}

.contact-wrapper .form-title .desc {
    font-size: 1rem;
    color: #555555;
    margin-bottom: 2.94rem
}

.contact-wrapper .form-wrapper {
    padding-bottom: 8.13rem
}

.contact-wrapper .form-wrapper .form-content .form-item {
    height: 4.56rem;
    margin-bottom: 1.56rem
}

.contact-wrapper .form-wrapper .form-content .form-item input {
    color: #333;
    height: 100%;
    font-size: 1rem
}

.contact-wrapper .form-wrapper .form-content .button-groups {
    margin-top: 2.25rem
}

.contact-wrapper .form-wrapper .form-content .form-button {
    width: 8.63rem;
    height: 3.13rem;
    border-radius: 1.56rem;
    font-size: 1rem;
    text-align: center;
    line-height: 3rem;
    margin-right: 1.25rem
}

.contact-wrapper .form-wrapper .form-content .reset-button {
    border: 2px solid #b93443;
    color: #b93443
}

.contact-wrapper .form-wrapper .form-content .submit-button {
    background-color: #b93443;
    border: 2px solid #b93443;
    color: #fff
}

.contact-wrapper .form-wrapper .form-content textarea {
    height: 10rem;
    font-size: 1rem;
    color: #333
}

.contact-wrapper .form-wrapper .adres-wrapper {
    margin-bottom: calc(2.25rem + 3.13rem)
}

.contact-wrapper .form-wrapper .adres-wrapper .contact-item {
    margin-bottom: 1.56rem
}

.contact-wrapper .form-wrapper .adres-wrapper .contact-item .citem-cotnent {
    height: 100%;
    background-color: #fff;
    text-align: center;
    padding: 1.88rem
}

.contact-wrapper .form-wrapper .adres-wrapper .contact-item .citem-cotnent .item-cicon {
    width: 3.5rem;
    margin: 0 auto;
    margin-bottom: 1rem
}

.contact-wrapper .form-wrapper .adres-wrapper .contact-item .citem-cotnent .item-ctitle {
    font-size: 1.25rem;
    color: #333333;
    font-weight: 500;
    margin-bottom: .44rem
}

.contact-wrapper .form-wrapper .adres-wrapper .contact-item .citem-cotnent .item-cvalue {
    font-size: 1rem;
    color: #555555;
    margin: 0
}

.contact-wrapper .form-wrapper .adres-wrapper .contact-item:nth-child(n + 3) {
    margin-bottom: 0
}

.map-wrapper {
    height: 32.25rem;
    width: 100%
}

.map-wrapper #TdMap {
    width: 100%;
    height: 100%
}

.map-wrapper #TdMap .tdt-infowindow-content-wrapper {
    background-color: #b93443;
    color: #fff
}

.map-wrapper #TdMap .tdt-infowindow-content-wrapper .tdt-infowindow-content {
    margin: 1rem;
    font-size: .88rem;
    line-height: 2
}

.map-wrapper #TdMap .tdt-infowindow-content-wrapper .tdt-infowindow-content .info-logo {
    width: 4.75rem;
    margin-right: .88rem;
    object-fit: contain
}

.map-wrapper #TdMap .tdt-infowindow-content-wrapper,
.map-wrapper #TdMap .tdt-infowindow-tip {
    background-color: #b93443
}

.map-wrapper #TdMap .tdt-control-copyright {
    display: none
}

@media (max-width:1669px) {
    .index-kehu .swiper {
        width: 80%;
        height: 25.63rem;
        padding-bottom: 0
    }

    .index-kehu .swiper-slide {
        height: calc(100% / 3.9) !important
    }

    #customer .swiper {
        width: 80%;
        height: 25.63rem;
        padding-bottom: 0
    }

    #customer .swiper-slide {
        height: calc(100% / 3.9) !important
    }

    #history .history-swiper {
        padding-left: 11rem
    }

    #history .time-line {
        padding-left: 11rem
    }
}

@media (max-width:1400px) {
    .index-kehu .swiper-box {
        margin: 0
    }

    #history .history-swiper {
        padding-left: 3rem
    }

    #history .time-line {
        padding-left: 3rem
    }
}

@media (max-width:1200px) {
    .index-kehu .swiper-box {
        margin: 0 3.13rem
    }

    #customer .swiper-box {
        margin: 0 3.13rem
    }
}

@media (max-width:992px) {
    .index-product .section-bottom .section-bottom-one .section-box {
        margin-bottom: 1.88rem
    }

    .index-product .section-bottom .section-bottom-two .section-box {
        margin-bottom: 1.88rem
    }

    .index-kehu .swiper-box {
        margin: 0
    }

    .index-about .section-content {
        width: 90%
    }

    .index-kehu .swiper {
        width: 80%
    }

    .index-product .section-top .product-categorys {
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start
    }

    .index-product .section-top .product-categorys .category-item {
        width: 17%;
        margin-right: 1.25rem;
        margin-bottom: 1.88rem;
        font-size: 1rem
    }

    #history .history-swiper {
        padding-left: 10rem
    }

    #history .time-line {
        padding-left: 10rem
    }

    #customer .swiper-box {
        margin: 0
    }

    #production .cos-container .production-lists .production-list-item:nth-child(2n) {
        padding-left: 1.56rem
    }

    #production .cos-container .production-lists .production-list-item:nth-child(2n + 1) {
        padding-right: 1.56rem
    }

    #production .cos-container .production-pics .pic-left {
        margin-bottom: 1.88rem
    }

    #production .cos-container .production-pics .pic-right {
        padding-left: 0
    }

    #production .cos-container .production-pics .pic-right .pic-top {
        margin-bottom: 1.88rem;
        padding-bottom: 0
    }

    #production .cos-container .production-pics .pic-right .pic-bottom {
        padding: 0
    }

    #experiment .exper-left .exper-top-pic {
        width: 100%;
        margin-bottom: 1.88rem
    }

    #experiment .exper-left .bottom-left {
        padding: 0;
        margin-bottom: 1.88rem
    }

    #experiment .exper-left .bottom-left img {
        width: 100%
    }

    #experiment .exper-right {
        padding: 0
    }

    #experiment .exper-left .bottom-right {
        padding: 0
    }

    #experiment .exper-left .bottom-right img {
        width: 100%
    }

    #experiment .exper-left .exper-bottom-pics {
        margin: 0;
        margin-bottom: 1.88rem
    }

    #system .cos-container .system-chart .chart-left {
        padding: 0;
        margin-bottom: 1.88rem
    }

    #certificate .cos-container .certificate-wrapper .cert-item {
        margin-right: 0
    }

    #certificate .cos-container .certificate-wrapper .cert-item .cert-item-title {
        margin-top: .94rem
    }

    #certificate {
        padding: 3.13rem 0
    }

    .contact-wrapper .form-wrapper .form-items {
        margin-bottom: 1.88rem
    }

    .contact-wrapper .form-wrapper .adres-wrapper .contact-item:nth-child(n + 3) {
        margin-bottom: 1.56rem
    }

    .factory-wrapper .cos-container .address-lists .address-item .address-pic img {
        width: 100%
    }
}

@media (max-width:768px) {
    .inside-navs .inside-nav-item {
        white-space: nowrap;
        padding: 0 1.25rem
    }

    #history .time-line {
        padding: 0 3.13rem
    }

    #history .history-swiper {
        padding: 0 3.13rem
    }

    #customer .swiper {
        width: 90%
    }

    #customer .swiper-slide {
        height: calc(100% / 4) !important
    }

    .product-wrapper .product-category .category-title {
        font-size: 1.13rem;
        margin-top: .63rem
    }

    .product-wrapper .product-category .category-item {
        padding: 1.75rem 0
    }

    .product-wrapper .product-category {
        padding: 0 1.88rem;
        margin-bottom: 1.88rem
    }

    .product-wrapper .product-lists .product-item {
        padding: 0
    }
}

@media (max-width:576px) {
    .section-title {
        font-size: 1.75rem;
        padding-top: 3.13rem;
        padding-bottom: 1.25rem
    }

    .index-about .section-content {
        font-size: 1.13rem
    }

    #customer .customer-sub-title {
        padding: 0 10%;
        margin-bottom: 3.13rem
    }

    #customer .section-title {
        font-size: 1.75rem
    }

    #process .process-desc .process-desc-content {
        padding: 0
    }

    .index-product .section-top .product-categorys .category-item {
        width: 31%;
        margin: 0;
        margin-right: 1rem;
        margin-bottom: 1.25rem;
        font-size: 1.13rem
    }

    .index-product .section-top .product-categorys .category-item:nth-child(3n) {
        margin-right: 0
    }

    .index-product .section-top .product-categorys {
        justify-content: flex-start
    }

    .index-product .section-top .product-categorys .category-item .item-title {
        font-size: 1.13rem
    }

    .index-product .section-top {
        padding-bottom: 1.88rem
    }

    .index-product .section-bottom {
        padding: 1.88rem 0;
        margin: 0 1.25rem
    }

    .index-kehu .swiper-button-next {
        display: none
    }

    .index-kehu .swiper-button-prev {
        display: none
    }

    .index-kehu .swiper {
        width: 90%
    }

    .index-kehu .swiper-slide {
        height: calc(100% / 3.9) !important
    }

    .index-kehu {
        padding-bottom: 1.88rem
    }

    .inside-navs .inside-nav-item {
        padding: 0 .94rem
    }

    .inside-navs {
        overflow-x: scroll;
        width: 100vw;
        justify-content: flex-start
    }

    .inside-banner .inside-banner-content .banner-desc {
        font-size: 1rem;
        margin-top: 0
    }

    .inside-banner .inside-banner-content .banner-title {
        width: 50%
    }

    .inside-navs::-webkit-scrollbar {
        height: 4px;
        background-color: #fff
    }

    .inside-navs::-webkit-scrollbar-thumb {
        border-radius: 1px;
        height: 2px;
        background: rgba(141, 23, 23, 0.2)
    }

    #customer .swiper-button-next {
        display: none
    }

    #customer .swiper-button-prev {
        display: none
    }

    #customer {
        padding-bottom: 3.13rem
    }

    #history .time-line {
        width: 100%;
        justify-content: center;
        padding-left: .94rem;
        margin-bottom: .13rem;
        font-size: 1.13rem;
        display: none
    }

    #history .history-swiper {
        padding: 0 1.25rem
    }

    #history .history-swiper .swiper {
        margin-bottom: 1.88rem
    }

    #history {
        padding: 3.13rem 0
    }

    #history .history-sub-title {
        margin-bottom: 3.13rem
    }

    #description {
        padding: 3.13rem 0
    }

    #description .desc-about .desc-left .desc-title {
        font-size: 1.75rem
    }

    #description .desc-about .desc-left .desc-content {
        padding: 0;
        margin-bottom: 1.25rem
    }

    #description .desc-about {
        margin-bottom: 1.88rem
    }

    #description .desc-lists .list-item {
        margin-bottom: .94rem;
        padding-left: 0;
        white-space: pre-wrap
    }

    #description .desc-lists {
        margin: 0
    }

    #description .desc-lists .list-item::before {
        top: 50%
    }

    #description .icon-groups .icon-item {
        width: 48%;
        margin-right: .94rem
    }

    #description .icon-groups .icon-item:nth-child(2n) {
        margin-right: 0
    }

    #description .icon-groups {
        margin-top: 1.88rem
    }

    #production {
        padding: 3.13rem 0
    }

    #production .cos-container {
        padding: 1.88rem
    }

    #experiment .cos-container {
        padding: .63rem
    }

    #experiment {
        padding: 3.13rem 0;
        padding-top: 0
    }

    #system {
        padding: 3.13rem 0
    }

    #system .cos-container {
        padding: 1.88rem;
        border-width: .31rem
    }

    #system .cos-container .system-chart .chart-left .chart-items {
        padding: 1.88rem
    }

    #system .cos-container .system-chart .chart-left .chart-items .chart-item {
        padding-left: 0
    }

    #system .system-section-title {
        font-size: 1.75rem
    }

    #certificate .system-section-title {
        font-size: 1.75rem
    }

    #history .history-title {
        font-size: 1.75rem
    }

    .device-section-title {
        font-size: 1.75rem
    }

    #process .process-section-title {
        font-size: 1.75rem;
        margin-bottom: 1.88rem
    }

    #process .process-desc {
        padding: 1.25rem;
        margin-bottom: 1.88rem
    }

    .product-wrapper .product-category {
        padding: 0 1rem
    }

    .product-wrapper .product-category .category-title {
        font-size: .88rem
    }

    .product-wrapper .product-category .active::after {
        height: .19rem;
        width: 3rem
    }

    .product-wrapper .product-lists .product-item .product-name {
        padding: 1.25rem
    }

    .product-wrapper .product-lists .product-item .product-desc {
        padding: 1.25rem;
        padding-top: 0
    }

    .product-wrapper {
        padding-bottom: 3.13rem
    }

    .contact-wrapper .form-title .title {
        font-size: 1.75rem
    }

    .contact-wrapper {
        padding: 3.13rem 0
    }

    .contact-wrapper .form-wrapper .adres-wrapper {
        padding: 0;
        margin: 0
    }

    .contact-wrapper .form-wrapper {
        padding-bottom: 1.88rem
    }

    .map-wrapper #TdMap .tdt-infowindow-content-wrapper .tdt-infowindow-content {
        font-size: 1rem
    }

    .factory-wrapper {
        padding: 3.13rem 0
    }

    .factory-wrapper .cos-container .address-lists .address-item .address-text {
        padding: 1.88rem 3.13rem
    }

    .factory-wrapper .cos-container .address-lists .address-item .address-text .address-title {
        font-size: 1.75rem;
        padding-bottom: 1.25rem;
        margin-bottom: 1.25rem
    }
}