.title-wrapper { padding: 20px 0; position: relative; }

.title-wrapper:after { content: ""; position: absolute; left: -61px; top: 50%; transform: translateY(-50%); width: 2px; height: 80px; background-color: var(--color1); }

.title-wrapper .title-h1-en { font-weight: bolder; font-size: 36px; color: #333;}

.title-wrapper .title-h1-cn { font-weight: bold; font-size: 30px; }

.common-card { background-color: #f7f7f7; position: relative; min-width: 1200px; height: 640px; }

.common-card-wrapper { width: 80%; min-width: 1200px; background-color: #fff; height: 90%; }

.common-card .card-text-wrapper { flex: 1; padding: 60px; }

.common-card .card-image { position: relative; bottom: -100px; z-index: 10; width: 700px; }

.common-card.section2 { height: 680px; }

.common-card.section2 .title-wrapper { white-space: nowrap; }

.common-card.section2 .title-wrapper::after { right: -61px; left: unset; }

.common-card.section2 .card-text { margin-top: 30px; }

.common-card.section2 .h1 { font-weight: bold; font-size: 22px; margin: 16px 0 0px; }

.common-card.section2 .p { line-height: 1.5; font-size: 16px; }

.process { width: 100%; height: 900px; min-width: 1200px; background-repeat: no-repeat; background-size: cover; background-position: bottom; }

.process .title-wrapper { color: #fff; margin: 100px 0 50px; }

.process .title-wrapper::after { content: none; }

.process-Swiper { width: 100%; height: 400px; }

.process-Swiper .swiper-button-prev { left: 0; opacity: 1; }

.process-Swiper .swiper-button-next { right: 0; opacity: 1; }

.process .process-swiper-wrapper { width: 100% !important; }

.process .process-swiper-slide { text-align: center; font-size: 18px; width: 100% !important; display: flex; justify-content: center; align-items: center; }

.process .process-swiper-slide:nth-child(2) .ul-wrapper li:first-child { margin-left: 0; }

.process .process-swiper-slide:nth-child(2) .ul-wrapper li:nth-child(6) { margin-left: -10%; }

.process .ul-wrapper { width: 100%; height: 100%; display: flex; flex-direction: row; flex-wrap: wrap; }

.process .ul-wrapper > :nth-child(6) { margin-left: 14%; }

.process .ul-wrapper > :first-child { margin-left: 60px; }

.process .ul-wrapper .border-top-line { border-top: 1px solid rgba(255, 255, 255, 0.7); }

.process .ul-wrapper .border-right-line { border-right: 1px solid rgba(255, 255, 255, 0.7); }

.process .ul-wrapper .border-bottom-line { border-bottom: 1px solid rgba(255, 255, 255, 0.7); }

.process .ul-wrapper .border-left-line { border-left: 1px solid rgba(255, 255, 255, 0.7); position: relative; }

.process .ul-wrapper .border-left-line-after::after { position: absolute; left: calc(-1 * (var(--dot-width) / 2)); bottom: calc(-1 * (var(--dot-width) / 2)); content: ""; --dot-width: 30px; width: var(--dot-width); height: var(--dot-width); background-image: url("../images/about_4.png"); background-size: cover; background-repeat: no-repeat; background-position: center; }

.process .ul-wrapper .border-left-line-before::before { position: absolute; left: calc(-1 * (var(--dot-width) / 2)); top: calc(-1 * (var(--dot-width) / 2)); content: ""; --dot-width: 30px; width: var(--dot-width); height: var(--dot-width); background-image: url("../images/about_4.png"); background-size: cover; background-repeat: no-repeat; background-position: center; }

.process .ul-wrapper li { width: 19%; height: 50%; text-align: left; padding: 15px 20px; box-sizing: border-box; position: relative; color: #fff; }

/*.process .ul-wrapper li:nth-child(6) { width: 34%; }*/

.process .ul-wrapper li h5 { color: #fff; font-weight: bold; font-size: 18px; }

.process .ul-wrapper li p { color: rgba(255, 255, 255, 0.7); font-size: 14px; }

.process .ul-wrapper li .line-style { margin: 10px 0; width: 50px; height: 2px; background-color: rgba(255, 255, 255, 0.7); }

.process .ul-wrapper2 > :nth-child(5) { margin-left: -11%; }

.patent { width: 100%; height: 680px; min-width: 1200px; background-repeat: no-repeat; background-size: cover; background-position: bottom; }

.patent .title-wrapper { color: #fff; margin: 100px 0 50px; }

.patent .title-wrapper::after { content: none; }

.patent .patent-Swiper { width: 100%; height: auto; margin-left: auto; margin-right: auto; }

.patent .swiper-slide-active { cursor: pointer; }

.patent .patent-swiper-slide { text-align: center; font-size: 18px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; transition-property: all; }

.patent .patent-swiper-slide img { width: 240px !important; display: block; }

.patent .patent-swiper-button-next-mask { position: absolute; top: 0; right: 0px; background-image: linear-gradient(to left, rgba(1, 83, 208, 0.9), transparent); }

.patent .patent-Swiper-bottom-text { text-align: center; color: #fff; padding: 10px 0; }

.patent .patent-swiper-button-prev-mask { position: absolute; top: 0; left: 0px; background-image: linear-gradient(to right, rgba(1, 83, 208, 0.9), transparent); }

.patent .patent-swiper-button-next-mask, .patent .patent-swiper-button-prev-mask { z-index: 100; height: 100%; width: 500px; }

.news .news_title { padding-top: 30px; }

.news .title-wrapper { padding: 0; color: var(--color1); }

.news .title-wrapper::after { content: none; }

.news .nav_menu li { padding: 4px 16px; cursor: pointer; }

.news .nav_menu li.active { background-color: var(--color1); color: #fff; }

.news_content { padding: 20px 0 0; width: 100%; display: flex; flex-wrap: wrap; }

.news_item { flex: 1; margin: 0 20px 20px 0; width: calc((100% - 40px) / 4); min-width: calc((100% - 60px) / 4); max-width: calc((100% - 60px) / 4); box-sizing: border-box; border: 1px solid transparent; border-radius: 6px; transition: border 0.1s ease-in-out; }

.news_item:nth-child(4n) { margin-right: 0; }

.news_item:hover { border: 1px solid var(--color1); transition: border 0.1s ease-in-out; }

.news_item--pic { border-radius: 6px 6px 0 0; width: 100%; }

.news_item--pic img { border-radius: inherit; width: inherit; height: inherit; display: block; object-fit: cover; }

.news_item--content { width: 100%; box-sizing: border-box; padding: 10px 0px; font-size: 16px; }

.news_item--content .data_time { color: #aaa; }

.news_item--content .news_item-title { margin: 6px 0; font-weight: bold; font-size: 18px; /*min-height: 54px;*/ }

.news_item--content .news_item-text { font-size: 14px; /*min-height: 63px;*/ }

.clients { width: 100%; height: 580px; min-width: 1200px; }

.clients .title-wrapper { margin: 20px 0 0px; }

.clients .title-wrapper::after { content: none; }

.mask-dialog .shadow { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.6); z-index: 10000; }

.mask-dialog .boxed-group { width: 800px; height: 77%; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 10000; border-top-left-radius: 5px; border-top-right-radius: 5px; }

.mask-dialog .boxed-group .video-title { display: flex; align-items: center; justify-content: flex-end; color: #fff; }

.mask-dialog .boxed-group .video-title #cancel { font-size: 40px; cursor: pointer; margin-right: 110px; }

.mask-dialog .boxed-group .video-title #cancel:hover { color: #aaa; }

.mask-dialog .boxed-group .boxed-group-inner { font-size: 14px; font-weight: 300; color: #aaa; border-color: #e6e9ed; display: flex; align-items: center; justify-content: center; }

.mask-dialog .boxed-group .boxed-group-inner #maskImg { width: 60%; display: block; }