.contact-section { padding: 100px 0; background-color: var(--background); }
.contact-section .section-box { display: flex; place-items: center; flex-direction: column; width: 35%; margin: 0 auto; }
.contact-section .section-box h2 { font-size: 60px; font-weight: 700; text-align: center; color: var(--font-color); line-height: 1; }
.contact-section .section-box p { font-size: 28px; color: var(--subFont-color); margin-top: 10px; }
.contact-section .section-box .section-btn { display: flex; place-items: center; place-content: center; margin-top: 50px }
.contact-section .section-box .section-btn .btn { border-radius: 30px; font-size: 16px; padding: 10px 24px; background-color: var(--button-background); color: var(--buttonFont-color); display: flex; place-items: center; width: fit-content; gap: 10px; transition: transform .25s ease; font-weight: 700; }
.contact-section .section-box .section-btn .btn svg { width: 32px; fill: var(--buttonFont-color); }
.contact-section .section-box .section-btn .btn .inner-button { display: flex; place-items: center; place-content: center; font-weight: 700; transition: all 0.3s ease-in-out; }
.contact-section .section-box .section-btn .btn .inner-button .icon { width: 25px; fill: var(--buttonFont-color); }
.contact-section .section-box .section-btn .btn:hover { transform: translate3d(0, -3px, 0); }
.contact-section .section-box .section-btn .btn:hover .inner-button { transform: rotate(-45deg); }


.contact-section .feature-logos { display: flex; place-items: center; place-content: center; gap: 20px; margin-top: 50px }
.contact-section .feature-logos .feature-logos__item span { color: var(--subFont-color); font-size: 16px; }
.contact-section .feature-logos .feature-logos__item .feature-logos__wrapper { align-items: center; display: flex; gap: 8px; }

.subscribe-section { padding: 100px 0; background-color: var(--background); }
.subscribe-section .wrap { position: relative; max-width: 500px; margin: 0 auto; z-index: 1; }
.subscribe-section .wrap .container { }
.subscribe-section .wrap .container .widget-title { text-align: center; font-size: 42px; font-weight: 600; margin-bottom: 10px; color: var(--font-color); }
.subscribe-section .wrap .container .widget-desc { color: var(--subFont-color); margin-bottom: 1rem; margin-top: 15px; text-align: center; font-size: 16px; }
.subscribe-section .wrap .container .subscribe-widget { margin-top: 50px }
.subscribe-section .wrap .container .subscribe-widget .dreamit-form { position: relative; font-size: 16px; }
.subscribe-section .wrap .container .subscribe-widget .dreamit-form.errmsg::before { content: ''; position: absolute; left: 20px; bottom: calc(100% - 6px); width: 0; height: 0; color: #fff; border: 6px solid transparent; border-top-color: white; z-index: 2; }
.subscribe-section .wrap .container .subscribe-widget .dreamit-form.errmsg::after { box-sizing: border-box; content: attr(errMsg); position: absolute; bottom: calc(100% + 6px); left: 0; line-height: 1.3; padding: 16px 20px; color: rgba(41, 41, 41, 0.6); background-color: white; border-radius: 4px; box-shadow: 0px 0px 8px 0px rgba(195,195,195,0.50); font-size: 14px; z-index: 1; }

.subscribe-section .wrap .container .subscribe-widget .src-input-box { font-family: inherit; font-size: inherit; line-height: inherit; background: #eee; border-radius: 4px; padding: 16px 60px 16px 20px; border: none; color: #444; display: block; width: 100%; }
.subscribe-section .wrap .container .subscribe-widget .input-btn { cursor: pointer; transition: all 0.3s ease-out 0s; border: none; outline: none; position: absolute; top: 50%; transform: translateY(-50%); right: 7px; width: 36px; height: 36px; border: none; padding: 0 0; background: var(--footer-desc-button-background); border-radius: 3px; color: #fff; display: flex; align-items: center; justify-content: center; }
.subscribe-section .wrap .container .subscribe-widget .input-btn .icon { width: 25px; fill: var(--footer-desc-buttonFont-color) }
.subscribe-section .wrap .container .subscribe-widget .input-btn:hover { opacity: 0.7; }



.banner { position: relative; overflow: hidden; }
.banner .banner-swiper { height: 100%; left: 0; top: 0; width: 100%; }
.banner .banner-swiper .swiper-slide { text-align: center }
.banner .banner-swiper .swiper-slide .bg { background: no-repeat 50% 50%/cover; bottom: 0; left: 0; position: absolute; right: 0; top: 0; }
.banner .banner-swiper .swiper-slide .bg .banner-image { display: flex; flex-direction: column; align-items: self-start; width: 40%; transform-origin: center center; transform: scale(1); }
.banner .banner-swiper .swiper-slide:not(.swiper-slide-active) .banner-transition { display: none; opacity: 0; visibility: hidden; }
.banner .a-flyLeftIn { animation-duration: .4s; animation: 1s ease 0s 1 normal both running flyLeftIn; }

.banner .banner-swiper .swiper-slide .banner-content { width: 1200px; margin: 0 auto; height: 100%; display: flex; align-items: center; }
.banner .banner-swiper .swiper-slide .bg .text { line-height: 1; }
.banner .banner-swiper .swiper-slide .bg .text h2 { font-size: 42px; color: var(--font-color) }
.banner .banner-swiper .swiper-slide .bg .text p { font-size: 16px; color: var(--subFont-color); margin: 30px 0; line-height: 1.8; text-align: left; }
.banner .banner-swiper .swiper-slide .bg .text .btn { white-space: nowrap; padding: 15px 28px; color: var(--buttonFont-color); text-transform: uppercase; border: 0px none; background-color: var(--button-background); font-size: 14px; letter-spacing: 3px; }

.banner .banner-swiper .swiper-slide img { max-width: 100% }
.banner .banner-swiper .swiper-pagination { }
.banner .banner-swiper .swiper-pagination .swiper-pagination-bullet { display: inline-block; width: 14px; height: 14px; border: 2px var(--buttonDef-color) solid; border-radius: 14px; margin: 0 6px; cursor: pointer; color: rgba(255, 255, 255, 0.00) !important; transition: all 0.3s; outline: none }
.banner .banner-swiper .swiper-pagination .swiper-pagination-bullet-active { padding: 0 14px; background-color: rgba(255, 255, 255, 0.00) !important }

.banner .banner-swiper .swiper-pagination-fraction { color: #000; font-weight: 700; font-size: 20px; }
.banner .banner-swiper .swiper-pagination-fraction .swiper-pagination-total { font-size: 16px; }

.banner .banner-swiper .def-prev { width: 46px; height: 46px; cursor: pointer; left: 5% }
.banner .banner-swiper .def-prev:after { content: '' }
.banner .banner-swiper .def-prev img { width: 100% }
.banner .banner-swiper .def-next { width: 46px; height: 46px; cursor: pointer; right: 5% }
.banner .banner-swiper .def-next:after { content: '' }
.banner .banner-swiper .def-next img { width: 100% }


.brand-layout { padding: 80px 120px; background: var(--background); }
.brand-layout .section-header { margin-bottom: 50px }
.brand-layout .section-header h2 { text-align: center; font-size: 16px; color: var(--font-color); font-weight: 700 }
.brand-layout .section-container .grid-layout { display: grid; grid-template-columns: repeat(var(--menu-grid-gap), 1fr); gap: 0px; border-style: solid; border-width: 0; background-clip: border-box; border-color: #D9DEE8; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 1px; }
.brand-layout .section-container .grid-layout .item { cursor: pointer; display: flex; place-items: center; gap: 20px; border-style: solid; border-width: 0; background-clip: border-box; border-color: #D9DEE8; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 0px; padding-top: 24px; padding-right: 24px; padding-bottom: 24px; padding-left: 24px; background-color: #fff }
.brand-layout .section-container .grid-layout .item.no-top-border { border-top-width: 0px; }
.brand-layout .section-container .grid-layout .item h2 { font-size: 16px; font-weight: 700; line-height: 1.4; flex: 1; color: var(--font-color) }
.brand-layout .section-container .grid-layout .item .img-view { width: 80px; height: 80px; flex-shrink: 1; display: flex; place-items: center; place-content: center }
.brand-layout .section-container .grid-layout .item .img-view img { max-height: 100%; max-width: 100% }
.brand-layout .section-container .grid-layout .item:hover { transform: translate3d(0, -2px, 0); transition: all 0.3s; box-shadow: 0 5px 20px rgba(0,0,0,0.1); }

.product-layout { padding: 80px; overflow: hidden; background: var(--background); }
.product-layout .section-header { }
.product-layout .section-header h2 { text-align: center; font-size: 38px; font-weight: bold; position: relative; padding: 0 0 12px 0; color: var(--themes-color) }
.product-layout .section-header h2::after { content: ""; display: block; width: 100px; height: 2px; background: var(--themes-color); position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }
.product-layout .section-header p { opacity: 0.8; text-align: center; margin-top: 24px; font-size: 18px; padding: 0 20%; color: var(--subFont-color); }
.product-layout .product-swiper { margin: 80px 0; position: relative }
.product-layout .product-swiper .controller { position: absolute; bottom: 0; left: 0; width: 100%; z-index: 1; padding: 0 50px 30px 104px }
.product-layout .product-swiper .controller .product-pagination .swiper-pagination-bullet { height: 8px; margin: 0 4px; width: 8px; cursor: pointer }
.product-layout .product-swiper .controller .product-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: var(--button-background); }
.product-layout .product-swiper .controller .warp_ctrl { display: flex; gap: 30px; margin-top: 30px }
.product-layout .product-swiper .controller .product-arrow { border: none; cursor: pointer; display: block; font-size: 0; line-height: 0px; padding: 0; height: 48px; width: 48px; background: transparent; color: transparent; outline: none; }
.product-layout .product-swiper .controller .product-arrow .path01 { fill-opacity: 0; stroke: #000; stroke-width: 1.5px; transition: stroke .2s ease, fill-opacity .2s ease; }
.product-layout .product-swiper .controller .product-arrow .path02 { fill-opacity: 0; stroke: #000; stroke-width: 1.5px; transition: stroke .2s ease, fill-opacity .2s ease; }

.product-layout .product-swiper .controller .product-arrow:not(.swiper-button-disabled):hover svg .path01 { fill: var(--button-background); fill-opacity: 1; stroke: var(--button-background); }
.product-layout .product-swiper .controller .product-arrow:not(.swiper-button-disabled):hover svg .path02 { fill-opacity: 0; stroke: #fff; }

.product-layout .product-swiper .controller .swiper-button-disabled { pointer-events: none; }
.product-layout .product-swiper .controller .swiper-button-disabled svg .path01 { stroke: #9ea1a7 !important; }
.product-layout .product-swiper .controller .swiper-button-disabled svg .path02 { fill: none; stroke: #9ea1a7 !important; }


.product-layout .section-container .item { flex-shrink: 0; width: 50%; height: 100%; position: relative; transition-property: transform; background-color: #fff; padding: 88px 40px 150px 104px; }
.product-layout .section-container .item .content { display: flex; gap: 30px }
.product-layout .section-container .item .content .left-layout { flex: 1 }
.product-layout .section-container .item .content .left-layout h2 { font-size: 24px; color: var(--font-color); line-height: 1.4; }
.product-layout .section-container .item .content .left-layout .number { font-size: 18px; margin-top: 8px; color: var(--subFont-color); }
.product-layout .section-container .item .content .left-layout .lead { font-size: 36px; margin-top: 40px; line-height: 1.4; color: var(--font-color); }
.product-layout .section-container .item .content .left-layout .txt { margin-top: 24px; font-size: 18px; color: var(--subFont-color); line-height: 1.4; }
.product-layout .section-container .item .content .left-layout .btn { margin-top: 48px; }
.product-layout .section-container .item .content .left-layout .btn a { padding: 0 50px 0 40px; color: var(--buttonFont-color); position: relative; min-width: 220px; align-items: center; background: transparent; border: 1px solid var(--buttonDef-color); display: inline-flex; font-size: 1.4rem; height: 44px; justify-content: center; line-height: 1.2; text-align: center; text-decoration: none; transition: background-color .2s ease, border-color .2s ease, color .2s ease; border-radius: 10px; }
.product-layout .section-container .item .content .left-layout .btn a:hover { background: var(--button-background); border-color: var(--button-background); color: #fff; }
.product-layout .section-container .item .content .right-layout { flex: 1; display: flex; place-content: center; place-items: center; max-height: 442px }
.product-layout .section-container .item .content .right-layout img { max-width: 100%; max-height: 100% }


.custompagecomp-section { padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); background-color: var(--background); }
.custompagecomp-section .section-inner { position: relative; max-width: var(--max-width); margin: 0 auto; z-index: 1; }
.custompagecomp-section .section-header h2 { text-align: center; font-size: 38px; font-weight: bold; position: relative; padding: 0 0 12px 0; color: var(--themes-color) }
.custompagecomp-section .section-container { color: var(--font-color) }





.about-layout { padding: 80px; overflow: hidden; background-color: #fff; }
.about-layout .section-container { background-color: var(--background); padding: 120px 160px; border-radius: 10px; position: relative; overflow: hidden }
.about-layout .section-container .section-view { display: flex; flex-direction: row; flex-wrap: wrap; align-items: stretch; position: relative; z-index: 11 }
.about-layout .section-container .column { width: 50%; flex: 0 0 auto; }
.about-layout .section-container .column img { max-width: 100% }
.about-layout .section-container .column:first-child span { display: block; width: 100%; height: 100%; }
.about-layout .section-container .column video { max-width: 100%; border-radius: 5px; }
.about-layout .section-container .column.right { padding-left: 80px; display: flex; flex-direction: column; }
.about-layout .section-container .column.right .feature-text-paired { width: 70%; flex: 1 }
.about-layout .section-container .column.right .title { font-size: 32px; font-weight: 700; text-transform: uppercase; line-height: 1.4; color: var(--font-color); padding-bottom: 15px; }
.about-layout .section-container .column.right .desc { font-size: 16px; line-height: 1.4; }
.about-layout .section-container .column.right .desc p { margin-bottom: 10px; font-size: 18px; line-height: 26px; font-weight: 400; color: var(--subFont-color) }
.about-layout .section-container .column.right .spaced-row { margin-top: 25px; }
.about-layout .section-container .column.right ul li { font-size: 18px; display: flex; place-items: start; padding: 5px 0 }
.about-layout .section-container .column.right ul li .icon { width: 24px; height: 24px; flex-shrink: 0 }
.about-layout .section-container .column.right ul li .icon path { fill: var(--themes-color) }
.about-layout .section-container .column.right ul li span { padding-left: 10px; color: var(--subFont-color) }

.about-layout .section-container .column.right .sub-container { margin-top: 50px; }
.about-layout .section-container .column.right .sub-container .counter-inner { display: flex; gap: 20px }
.about-layout .section-container .column.right .sub-container .counter-inner .count-item { flex: 1 }
.about-layout .section-container .column.right .sub-container .counter-inner .count-item .text { }
.about-layout .section-container .column.right .sub-container .counter-inner .count-item .text .counter { font-size: 42px; font-weight: 700; color: var(--themes-color) }
.about-layout .section-container .column.right .sub-container .counter-inner .count-item .text .unit { font-style: normal; font-size: 16px; padding-left: 5px; color: var(--subFont-color) }
.about-layout .section-container .column.right .sub-container .counter-inner .count-item .lable { font-size: 14px; text-align: center; color: var(--font-color); }


.about-layout .section-container .section-btn { display: flex; place-items: center; place-content: center; margin-top: 120px }
.about-layout .section-container .section-btn .btn { border-radius: 30px; font-size: 16px; padding: 10px 24px; background-color: var(--button-background); color: var(--buttonFont-color); display: flex; place-items: center; width: fit-content; gap: 10px; transition: transform .25s ease; font-weight: 700; }
.about-layout .section-container .section-btn .btn .inner-button { display: flex; place-items: center; place-content: center; font-weight: 700; transition: all 0.3s ease-in-out; }
.about-layout .section-container .section-btn .btn .inner-button .icon { width: 25px; fill: var(--buttonFont-color); }
.about-layout .section-container .section-btn .btn:hover { transform: translate3d(0, -3px, 0); }
.about-layout .section-container .section-btn .btn:hover .inner-button { transform: rotate(-45deg); }


.brand-section { padding: 80px; overflow: hidden; background-color: var(--background) }
.brand-section .section-header { }
.brand-section .section-header h2 { text-align: center; font-size: 38px; font-weight: bold; position: relative; padding: 0 0 12px 0; color: var(--themes-color) }
.brand-section .section-header h2::after { content: ""; display: block; width: 100px; height: 2px; background: var(--themes-color); position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }
.brand-section .section-header p { opacity: 0.8; text-align: center; margin-top: 24px; font-size: 18px; padding: 0 20%; color: var(--subFont-color) }
.brand-section .grid-view { display: grid; grid-gap: 15px; grid-template-columns: repeat(8, 1fr); max-width: 1380px; margin: 0px auto; padding-top: 50px }
.brand-section .grid-view li { width: 158px; height: 70px; overflow: hidden; border-radius: 7px; background-color: #fff }
.brand-section .grid-view li a { width: 158px; height: 70px; display: flex; place-items: center; place-content: center }
.brand-section .grid-view li img { max-height: 100%; max-width: 100% }


.imgTextComp-section { padding: 80px 0; background-color: var(--background) }
.imgTextComp-section .graphics { display: flex; align-items: center; justify-content: center; gap: 100px; }
.imgTextComp-section .graphics .images-box { width: 50%; flex: 1 }
.imgTextComp-section .graphics .images-box img { width: 100% }
.imgTextComp-section .graphics .images-box video { max-width: 100%; }
.imgTextComp-section .graphics .text-content { flex: 1; }
.imgTextComp-section .graphics .text-content .title { font-size: 38px; font-weight: 700; margin-bottom: 15px; color: var(--font-color) }
.imgTextComp-section .graphics .text-content .desc { font-size: 16px; color: var(--subFont-color); margin-bottom: 50px }
.imgTextComp-section .graphics .text-content .desc p { margin-bottom: 10px }
.imgTextComp-section .graphics .text-content .list { margin: 0px 0 70px }
.imgTextComp-section .graphics .text-content .list .item { position: relative; font-size: 18px; padding-left: 15px; margin-bottom: 20px; color: var(--font-color) }
.imgTextComp-section .graphics .text-content .list .item::after { content: ''; position: absolute; top: 50%; left: 0; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: 8px; height: 8px; background-color: var(--themes-color); border-radius: 50% }
.imgTextComp-section .graphics .section-btn { display: flex; place-items: center; }
.imgTextComp-section .graphics .section-btn .btn { border-radius: 30px; font-size: 16px; padding: 10px 24px; background-color: var(--button-background); color: var(--buttonFont-color); display: flex; place-items: center; width: fit-content; gap: 10px; transition: transform .25s ease; font-weight: 700; }
.imgTextComp-section .graphics .section-btn .btn svg { width: 32px; fill: var(--buttonFont-color); }
.imgTextComp-section .graphics .section-btn .btn img { height: 32px }
.imgTextComp-section .graphics .section-btn .btn .inner-button { display: flex; place-items: center; place-content: center; font-weight: 700; transition: all 0.3s ease-in-out; }
.imgTextComp-section .graphics .section-btn .btn .inner-button .icon { width: 25px; fill: var(--buttonFont-color); }
.imgTextComp-section .graphics .section-btn .btn:hover { transform: translate3d(0, -3px, 0); }
.imgTextComp-section .graphics .section-btn .btn:hover .inner-button { transform: rotate(-45deg); }


.imgtextlistcomp-layout { padding: 80px; overflow: hidden; background-color: var(--background) }
.imgtextlistcomp-layout .section-header { position: relative; max-width: 1400px; margin: 0 auto }
.imgtextlistcomp-layout .section-header h2 { text-align: left; font-size: 60px; font-weight: bold; position: relative; color: var(--font-color); width: 50%; line-height: 1.2; }

.imgtextlistcomp-layout .section-header .controller { position: absolute; bottom: 0; right: 0; z-index: 1; }
.imgtextlistcomp-layout .section-header .controller .warp_ctrl { display: flex; gap: 30px; }
.imgtextlistcomp-layout .section-header .controller .product-arrow { border: none; cursor: pointer; display: block; font-size: 0; line-height: 0px; padding: 0; height: 48px; width: 48px; background: transparent; color: transparent; outline: none; }
.imgtextlistcomp-layout .section-header .controller .product-arrow .path01 { fill-opacity: 0; stroke: #000; stroke-width: 1.5px; transition: stroke .2s ease, fill-opacity .2s ease; }
.imgtextlistcomp-layout .section-header .controller .product-arrow .path02 { fill-opacity: 0; stroke: #000; stroke-width: 1.5px; transition: stroke .2s ease, fill-opacity .2s ease; }
.imgtextlistcomp-layout .section-header .controller .product-arrow:not(.swiper-button-disabled):hover svg .path01 { fill: var(--button-background); fill-opacity: 1; stroke: var(--button-background); }
.imgtextlistcomp-layout .section-header .controller .product-arrow:not(.swiper-button-disabled):hover svg .path02 { fill-opacity: 0; stroke: #fff; }
.imgtextlistcomp-layout .section-header .controller .swiper-button-disabled { pointer-events: none; }
.imgtextlistcomp-layout .section-header .controller .swiper-button-disabled svg .path01 { stroke: #9ea1a7 !important; }
.imgtextlistcomp-layout .section-header .controller .swiper-button-disabled svg .path02 { fill: none; stroke: #9ea1a7 !important; }

.imgtextlistcomp-layout .gallery-component-swiper { margin: 80px 0; position: relative }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .picture { padding-bottom: 100%; overflow: hidden; width: 100%; display: flex; position: relative; background-color: #fff; margin-bottom: 25px; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .picture img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; object-fit: cover; max-width: 100%; max-height: 100%; margin: auto; }

.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content { }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .card__text { margin-bottom: 24px; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .card__text .section-title--card { font-size: 24px; line-height: 32px; margin-bottom: 12px; color: var(--font-color); }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .card__text .section-subtitle--paragraph { font-size: 16px; font-weight: 400; line-height: 24px; min-height: 120px; color: var(--subFont-color); }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action { }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link { border: 2px solid #0000; color: var(--buttonFont-color); font-size: 14px; font-weight: 700; line-height: 20px; margin: 0 0 -10px -9px; padding: 4px 8px 10px; position: relative; text-decoration: unset; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link::after, .imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link::before { background: var(--buttonFont-color); bottom: 7px; content: ""; display: block; height: 2px; left: 8px; position: absolute; transition: 1.1s cubic-bezier(.19,1,.22,1); width: calc(100% - 16px); }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link::after { transform-origin: right; transition-delay: .25s; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link::before { transform: scaleX(0); transform-origin: left; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link-arrow { font-size: 16px; line-height: 24px; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link-arrow svg { height: 18px; position: absolute; right: -14px; top: 3px; transition: all .3s; width: 18px; color: #050D1A }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link-arrow svg path { fill: currentColor }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link:hover:before { transform: scaleX(1); transition-delay: .25s; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link:hover:after { transform: scaleX(0); transition-delay: 0s; }
.imgtextlistcomp-layout .gallery-component-swiper .item .content .card__content .link__action .link-arrow:hover svg { color: var(--themes-color); right: -18px; top: 1px; }


.certificates { background-color: var(--background); padding-bottom: 100px; }
.certificates .honor_box { max-width: 1400px; margin: 0 auto; }
.certificates .honor_box .title { padding: 50px 0; font-size: 2.6rem; text-align: center; }
.certificates .honor_box .customize { display: flex; align-items: center; background-color: #fff; padding: 15px; border-radius: 10px; box-shadow: 0 0px 10px #ddd; }
.certificates .honor_box .explain { margin-bottom: 2em; color: #666; line-height: 2; font-size: 1.8rem; padding-right: 50px; width: 55%; }
.certificates .honor_box .customize .imgview { flex: 1 }
.certificates .honor_box .customize .imgview img { width: 100% }
.certificates .honor_box .honor_con { width: 100%; height: 100%; padding: 50px 0; display: grid; grid-gap: 30px; grid-template-columns: repeat(3, 1fr); }
.certificates .honor_box .honor_con .item { background: #fff; box-shadow: 0 8px 30px #ddd; padding-top: 20px; }
.certificates .honor_box .honor_con .item .imgbox { text-align: center; width: 100%; height: 240px; padding: 10px 10px 0; display: flex; place-content: center; place-items: center; }
.certificates .honor_box .honor_con .item .imgbox img { max-width: 100%; max-height: 100%; }
.certificates .honor_box .honor_con .item p { line-height: 1.4; padding-top: 0; text-align: center; color: #636363; font-size: 1.6rem; margin: 20px 0; word-break: break-all; }


.team-section { background-color: var(--background); padding-bottom: 100px }
.team-section .team_box { max-width: 1400px; margin: 0 auto; }
.team-section .team_box .title { padding: 50px 0; font-size: 2.6rem; text-align: center; }
.team-section .team_box .title .svgbox { height: 60px; width: 25%; }
.team-section .team_box .title .svgbox text { font-size: 60px; font-weight: 900; }
.team-section .team_box .title .svgbox text.Stroke { fill: rgba(0, 0, 0, 0); stroke: #d4d4d4; stroke-width: .5; }
.team-section .team_box .title .svgbox text.red { fill: #f9253b; }
.team-section .team_box .content { display: grid; grid-gap: 20px; grid-template-columns: repeat(4, 1fr); }
.team-section .team_box .content .item { cursor: pointer; }
.team-section .team_box .content .item .imgview { height: 400px; display: block; position: relative; transition: .0s all ease; background-size: cover; background-position: center center; background-repeat: no-repeat; }
.team-section .team_box .content .item .desc { position: absolute; bottom: 10px; left: 10px; right: 10px; background: #fff; padding: 20px 15px; opacity: 1; height: 105px; overflow: hidden; transition: .3s all ease; }
.team-section .team_box .content .item .desc h3 { font-weight: 700; text-transform: uppercase; margin-bottom: 10px; font-size: 20px; }
.team-section .team_box .content .item .desc span { color: #b3b3b3; display: block; margin-bottom: 20px; text-transform: uppercase; font-size: 14px; }
.team-section .team_box .content .item .desc .parag { opacity: 1; }
.team-section .team_box .content .item .desc .parag { opacity: 0; transition: .1s all ease; }
.team-section .team_box .content .item .desc .parag p { color: #4d4d4d; font-size: 15px; }
.team-section .team_box .content .item:hover .desc { opacity: 1; margin-top: 10px; height: 160px; }
.team-section .team_box .content .item:hover .desc .parag { opacity: 1; }
.team-section .team_box .content .item.other { background-image: -webkit-linear-gradient(0deg, #62bdfc 0%, #8490ff 100%); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.team-section .team_box .content .item.other .icon { transform: rotate(-90deg); font-size: 38px; }
.team-section .team_box .content .item.other span { font-size: 26px; }
/* 4K 及以上 */
@media (min-width: 1920px) {
    .hidden-xl { display: none !important; opacity: 0; visibility: hidden; }
    /* 样式 */
}
/* 2K 显示器 */
@media (min-width: 1600px) and (max-width: 1919px) {
    .hidden-lg { display: none !important; opacity: 0; visibility: hidden; }

    .page-wrapper .about-layout .section-container { padding: 80px 40px; }
    .page-wrapper .about-layout .section-container .column.right { padding-left: 40px; }
    .page-wrapper .about-layout .section-container .column.right .feature-text-paired { width: 90% }
}

/* 平板横屏 / 笔记本 */
@media (min-width: 992px) and (max-width: 1599px) {
    .hidden-md { display: none !important; opacity: 0; visibility: hidden; }

    .page-wrapper .about-layout .section-container { padding: 40px 20px; }
    .page-wrapper .about-layout .section-container .column.right { padding-left: 20px; }
    .page-wrapper .about-layout .section-container .column.right .feature-text-paired { width: 100% }
}

@media screen and (max-width: 991px) {

    /*banner*/
    .banner { }
    .banner .controller { bottom: 10px; }
    .banner .controller .warp_ctrl { width: unset; justify-content: center; }
    .banner .banner-swiper .swiper-pagination .swiper-pagination-bullet-active { padding: 0 10px; }
    .banner .banner-swiper .swiper-pagination span { width: 10px; height: 10px; margin: 0 3px; }
    .banner .banner-swiper .swiper-slide .banner-content { width: 100%; padding: 20px }
    .banner .banner-swiper .swiper-slide .bg .text { width: 80%; }
    .banner .banner-swiper .swiper-slide .bg .text h2 { font-size: 20px; }
    .banner .banner-swiper .swiper-slide .bg .text p { font-size: 14px; margin: 10px 0; line-height: 1.4 }
    .banner .banner-swiper .swiper-slide .bg .text .btn { padding: 8px 10px; }

    /*  menuSection*/
    .brand-layout { padding: 20px 10px; }
    .brand-layout .section-header { margin-bottom: 20px; }
    .brand-layout .section-container .grid-layout { grid-template-columns: repeat(2, 1fr); }
    .brand-layout .section-container .grid-layout .item { gap: 10px; padding: 15px 10px; border-color: rgb(217 222 232 / 55%) }
    .brand-layout .section-container .grid-layout .item .img-view { width: 45px; height: 45px }
    .brand-layout .section-container .grid-layout .item h2 { font-size: 14px; font-weight: normal; }
    .brand-layout .section-container .grid-layout .item:nth-child(n+3) { border-top-width: 0px; }

    /*product standard*/
    .product-standard-layout { padding: 20px 10px; }
    .product-standard-layout .section-container { padding: 0 }
    .product-standard-layout .section-header { padding: 20px 15px 20px; }
    .product-standard-layout .section-header .title { font-size: 20px; line-height: 1; }
    .product-standard-layout .section-header p { font-size: 14px; margin-top: 5px; }
    .product-standard-layout .section-header h2::after { height: 1px; }
    .product-standard-layout .section-container .grid-view { grid-gap: 10px; grid-template-columns: repeat(2, 1fr); }
    .product-standard-layout .section-container .grid-view .item { }
    .product-standard-layout .section-container .grid-view .item .imgbox { }
    .product-standard-layout .section-container .grid-view .item .textbox { padding: 15px 10px; }
    .product-standard-layout .section-container .grid-view .item .textbox .baseinfo { padding-right: 0px; }
    .product-standard-layout .section-container .grid-view .item .textbox h2 { font-size: 1.6rem; transform: translate(0, 0px); }
    .product-standard-layout .section-container .grid-view .item .textbox .desc { opacity: 1; transition: opacity 0.5s; }
    .product-standard-layout .section-container .grid-view .item .textbox p { line-height: 1.4; padding-bottom: 0; }

    /*product*/
    .product-layout { padding: 20px 0px; }
    .product-layout .product-swiper { margin: 0; padding: 10px 10px }
    .product-layout .product-swiper .controller { position: relative; text-align: center; padding: 10px 0 0; }
    .product-layout .section-container { padding: 0px }
    .product-layout .section-header { padding: 20px 15px 20px; }
    .product-layout .section-header .title { font-size: 20px; line-height: 1; }
    .product-layout .section-header p { font-size: 14px; margin-top: 5px; }
    .product-layout .section-header h2::after { height: 1px; }
    .product-layout .section-container .item { padding: 10px; }
    .product-layout .section-container .item .content { flex-direction: column; gap: 10px; }
    .product-layout .section-container .item .content .right-layout { order: 0; }
    .product-layout .section-container .item .content .left-layout { order: 1 }
    .product-layout .product-swiper .controller .warp_ctrl { display: flex; gap: 10px; margin-top: 10px; place-items: center; place-content: center; }
    .product-layout .product-swiper .controller .product-arrow { height: 39px; width: 39px; }
    .product-layout .section-container .item .content .left-layout .btn { text-align: center; margin-top: 30px; }
    .product-layout .section-container .item .content .left-layout h2 { font-size: 16px }
    .product-layout .section-container .item .content .left-layout .number { font-size: 14px; }
    .product-layout .section-container .item .content .left-layout .lead { font-size: 22px; margin-top: 10px; }
    .product-layout .section-container .item .content .left-layout .txt { font-size: 14px; margin-top: 14px; }
    /*.aboutComp*/
    .about-layout { padding: 10px 10px; }
    .about-layout .section-container { padding: 10px 10px; }
    .about-layout .section-container .section-view { flex-direction: column }
    .about-layout .section-container .column { width: 100% }
    .about-layout .section-container .column.right { width: 100%; padding-left: 0px; }
    .about-layout .section-container .column.right .feature-text-paired { width: 100%; padding: 0 10px }
    .about-layout .section-container .column.right .sub-container .counter-inner { display: grid; grid-template-columns: repeat(2, 1fr); text-align: center; }
    .about-layout .section-container .section-btn { margin-top: 50px }
    .about-layout .section-container .column.right .title { font-size: 26px; }
    .about-layout .section-container .column.right .desc p { font-size: 16px; line-height: 1.4; }
    .about-layout .section-container .column.right ul li { font-size: 16px; line-height: 1.4; }
    .about-layout .section-container .column.right .sub-container .counter-inner .count-item .text .counter { font-size: 28px; }
    /*.brandComp*/
    .brand-section { padding: 20px 10px; }
    .brand-section .section-container { padding: 0 }
    .brand-section .section-header { padding: 20px 15px 20px; }
    .brand-section .section-header .title { font-size: 20px; line-height: 1; }
    .brand-section .section-header p { font-size: 14px; margin-top: 5px; }
    .brand-section .section-header h2::after { height: 1px; }
    .brand-section .grid-view { grid-gap: 15px; grid-template-columns: repeat(3, 1fr); padding-top: 0px; }
    .brand-section .grid-view li, .brand-section .grid-view li a { width: 120px; height: 50px; }
    /*processComp*/
    .process-layout { padding: 20px 10px; }
    .process-layout .section-header h2 { font-size: 20px; }
    .process-layout .section-header p { padding: unset; margin-top: 0; font-size: 16px }
    .process-layout .section-header { margin-bottom: 20px; }
    .process-layout .section-container .section-view { flex-direction: column; gap: 10px }
    .process-layout .section-container .section-view .process_arrow .icon { transform: rotate(90deg); width: 30px; height: 30px }
    .process-layout .section-container .section-view .process-box h4 { font-size: 20px; }
    .process-layout .section-container .section-view .process-box p { font-size: 14px; }
    .process-layout .section-container .section-view .process-box { padding: 15px 10px; }
    .process-layout .section-container .section-view .process_arrow .icon { width: 25px; height: 25px; }

    /*imgTextComp*/
    .imgTextComp-section { padding: 20px 10px; }
    .imgTextComp-section .graphics { flex-direction: column; gap: 0px; }
    .imgTextComp-section .graphics .images-box { order: 0; width: 100%; }
    .imgTextComp-section .graphics .text-content { order: 1 }
    .imgTextComp-section .graphics .text-content .title { font-size: 28px; }
    .imgTextComp-section .graphics .text-content .desc { margin-bottom: 20px; }
    .imgTextComp-section .graphics .text-content .list .item { margin-bottom: 10px; font-size: 16px; }
    .imgTextComp-section .graphics .text-content .list { margin: 0px 0px 30px 10px; }
    .imgTextComp-section .graphics .section-btn { place-content: center; }
    .imgTextComp-section .graphics .section-btn .btn { font-size: 14px; padding: 8px 12px; gap: 5px; }
    .imgTextComp-section .graphics .section-btn .btn svg { width: 26px; }
    .imgTextComp-section .graphics .section-btn .btn .inner-button .icon { width: 20px }
    /*imgtextlistComp*/
    .imgtextlistcomp-layout { padding: 20px 10px; }
    .imgtextlistcomp-layout .section-header h2 { width: 100%; font-size: 24px; text-align: center; }
    .imgtextlistcomp-layout .section-header { display: flex; flex-direction: column; place-items: flex-end; gap: 20px; place-content: center; }
    .imgtextlistcomp-layout .section-header .controller { position: relative }
    .imgtextlistcomp-layout .gallery-component-swiper { margin: 30px 0 }
    .imgtextlistcomp-layout .section-header .controller .warp_ctrl { display: flex; gap: 10px; margin-top: 10px; place-items: center; place-content: center; }
    .imgtextlistcomp-layout .section-header .controller .product-arrow { height: 39px; width: 39px; }
    /*blogComp*/
    .blog-layout { padding: 20px 10px 100px; position: relative; }
    .blog-layout .section-container { flex-direction: column; gap: 30px }
    .blog-layout .section-container .sidebar { width: 100% }
    .blog-layout .section-container .sidebar h2 { font-size: 18px; margin-bottom: 10px; }
    .blog-layout .section-container .sidebar h1 { margin-bottom: 0px; font-size: 24px; }
    .blog-layout .section-container .content .posts-col .post-inner-wrap { flex-direction: column }
    .blog-layout .section-container .content .posts-col .post-inner-wrap .img-view { width: 100% }
    .blog-layout .section-container .sidebar .section-btn { position: absolute; bottom: 20px; left: 0; right: 0; z-index: 100; margin-top: 0px; place-content: center; }
    .blog-layout .section-container .sidebar .section-btn .btn { font-size: 14px; padding: 8px 16px; gap: 5px; }
    .blog-layout .section-container .sidebar .section-btn .btn svg { width: 26px; }
    .blog-layout .section-container .sidebar .section-btn .btn .inner-button .icon { width: 20px }
    .blog-layout .section-container .content .posts-col .post-inner-wrap .post-content .title { margin-bottom: 10px; }
    .blog-layout .section-container .content .posts-col .post-inner-wrap .post-content .meta { margin-bottom: 10px; }
    /*workComp*/
    .work-layout { padding: 20px 10px; }
    .work-layout .section-header { padding: 20px 15px 20px; margin-bottom: 0 }
    .work-layout .section-header h2 { font-size: 20px; line-height: 1; }
    .work-layout .section-header p { font-size: 14px; margin-top: 5px; padding: 0 }
    .work-layout .section-header h2::after { height: 1px; }
    .work-layout .section-container .section-view { column-count: 2; column-gap: 10px; }
    .work-layout .section-container .section-view .item { margin-bottom: 10px; }
    /*commentComp*/
    .comment-layout { padding: 20px 10px; }
    .comment-layout .section-header .sub-title { margin-bottom: 10px; }
    .comment-layout .section-header h2 { font-size: 24px; line-height: 1.4 }
    .comment-layout .section-container .section-view { width: 100%; margin: 30px 0; }
    .comment-layout .section-container .section-view .item { padding: 15px 15px 25px; }
    .comment-layout .section-container .section-view .item .top-rows .user .info h3 { font-size: 16px; }
    .comment-layout .section-container .section-view .item .context { margin-top: 10px; }
    .comment-layout .section-container .controller .warp_ctrl { display: flex; gap: 10px; margin-top: 10px; place-items: center; place-content: center; }
    .comment-layout .section-container .controller .product-arrow { height: 39px; width: 39px; }
    .comment-layout .section-container .item .content .left-layout .btn { text-align: center; margin-top: 30px; }
    /*contactComp*/
    .contact-section { padding: 20px 10px; }
    .contact-section .section-box { width: 100%; }
    .contact-section .section-box h2 { font-size: 60px; text-align: left; width: 100%; }
    .contact-section .section-box p { font-size: 18px; text-align: left; width: 100%; }
    .contact-section .section-box .section-btn .btn { padding: 8px 20px; }
    .contact-section .feature-logos { flex-flow: wrap; gap: 10px; }
    /*subscribeComp*/
    .subscribe-section { padding: 20px 10px; }
    .subscribe-section .wrap .container .widget-title { font-size: 24px }
    .subscribe-section .wrap .container .subscribe-widget { margin-top: 30px }


    .custompagecomp-section { padding: 20px 10px; }
    .custompagecomp-section .section-header h2 { font-size: 24px }

    .team-section { padding-bottom: 20px; }
    .team-section .team_box { padding: 0 10px }
    .team-section .team_box .title { padding: 0px 0 20px 0; }
    .team-section .team_box .title .svgbox { width: 220px; }
    .team-section .team_box .title .svgbox text { font-size: 40px; }
    .team-section .team_box .title .svgbox text.red { transform: translate(-30px,0); }
    .team-section .team_box .content { grid-template-columns: repeat(2, 1fr); grid-gap: 10px; }
    .team-section .team_box .content .item .imgview { height: 300px; padding: 10px 5px; }
    .team-section .team_box .content .item .desc { height: 80px; bottom: 5px; left: 5px; right: 5px; }
    .team-section .team_box .content .item .desc h3 { margin-bottom: 0px; font-size: 14px; }
    .team-section .team_box .content .item .desc span { font-size: 12px; }
    .team-section .team_box .content .item .desc .parag { opacity: 1; }
    .team-section .team_box .content .item .desc .parag p { font-size: 12px; line-height: 1.2 }

    .certificates { padding-bottom: 20px; }
    .certificates .honor_box .title { padding: 20px 0; font-size: 2.0rem; }
    .certificates .honor_box .honor_con { grid-gap: 10px; grid-template-columns: repeat(2, 1fr); padding: 15px; }
    .certificates .honor_box .honor_con .item .imgbox { padding: 0 10px; height: 140px; }
    .certificates .honor_box .honor_con .item p { font-size: 1.4rem; padding: 0 10px }

}