/*
 *	Created by Edward on 22/07/06
 *	Copyright (漏) 2022 shuwon.com All rights reserved
*/

@font-face {
    font-family: 'iconfont';
    src: url('iconfont.woff2?t=1657262438207') format('woff2'), url('iconfont.woff?t=1657262438207') format('woff'), url('iconfont.ttf?t=1657262438207') format('truetype');
}

.iconfont {
    font-family: "iconfont" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

@font-face {
    font-family: GeoBrandBold;
    src: url(../fonts/geographweb-bold.woff2)
}

@font-face {
    font-family: 'din';
    src: url('../fonts/DIN-Condensed-Bold.ttf');
}

@font-face {
    font-family: 'GraphikLCG';
    src: url('../fonts/GraphikLCG-Regular.woff2');
}

@font-face {
    font-family: montserrat;
    src: url(../fonts/montserrat-regular-webfont.woff2)
}

.td_tips {
    width: 100%;
    height: auto;
    position: relative;
    line-height: 35px;
    font-size: 12px;
    padding-left: 25px;
    margin-top: 10px;
    opacity: .5;
}

.td_tips:after {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0px;
    top: 50%;
    margin-top: -10px;
    content: '';
    background: url(../images/mouse.png) no-repeat;
    background-size: cover;
}

.aboutVideo {
    width: 50%;
    height: auto;
    position: absolute;
    border: 5px solid #1955a5;
    border-radius: 10px;
    background: #1955a5;
    box-sizing: border-box;
    right: 0%;
    bottom: 0%;
}

.aboutVideo video {
    width: 100%;
    display: block;
}

.ptn {
    text-align: center;
    position: absolute;
    top: 50%;
    right: 50%;
    width: 75px;
    height: 75px;
    line-height: 75px;
    transition: ease .5s;
    background: #ffff;
    border-radius: 50%;
    cursor: pointer;
    margin-right: -37.5px;
    margin-top: -37.5px;
    -webkit-transition: all .5s;
}

.ptn span {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    background: url(../images/ptn_icon.png) no-repeat;
    background-size: 60px auto;
}

.ptn:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, .5);
    transform: translate(-50%, -50%) scale(.9);
    transition: all .5s cubic-bezier(.215, .61, .355, 1) 0s;
}

.ptn:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .25);
    transform: translate(-50%, -50%) scale(.9);
    transition: all .4s cubic-bezier(.215, .61, .355, 1) 50ms;
}

.ptn:hover:before {
    transform: translate(-50%, -50%) scale(1.3);
}

.ptn:hover:after {
    transform: translate(-50%, -50%) scale(1.6);
}

.ptn.active {
    -webkit-transform: scale(0.5);
    right: 0%;
}

.ptn.active span {
    background-position: -30px 0;
}

header.active {
    background-color: #f9f9f9;
}

header.show {
    top: -90px;
}

header {
    position: fixed;
    width: 1400px;
    height: 80px;
    left: 50%;
    margin-left: -700px;
    top: 10px;
    z-index: 100;
    display: flex;
    flex-wrap: wrap;
    padding: 0px 20px;
    align-items: center;
    justify-content: space-between;
    -webkit-transition: all .5s;
}

header .logo {
    width: 70px;
    position: relative;
}

header .logo img:nth-child(1) {
    opacity: 0;
}

header .logo img:nth-child(2) {
    position: absolute;
    width: 100%;
    height: auto;
    left: 0%;
    top: 0%;
    opacity: 1;
}

header.active .logo img:nth-child(1) {
    opacity: 1;
}

header.active nav ul li>a {
    color: #3e3e3e;
}

header.active .langung a.active {
    color: rgba(0, 0, 0, .7);
}

header.active .langung a,
header.active .langung {
    color: rgba(0, 0, 0, .3);
}

header.active .logo img:nth-child(2) {
    opacity: 0;
}

header.active .serachIcon {
    background-color: #1955a5;
    color: #fff;
}

header nav {
    display: flex;
    position: relative;
    width: auto;
    height: 100%;
}

header nav ul {
    display: flex;
    height: 100%;
}

header nav ul li {
    text-align: center;
    position: relative;
}

header nav ul li::after {
    width: 0%;
    height: 3px;
    left: 50%;
    background-color: #fff;
    content: '';
    position: absolute;
    bottom: 0%;
    -webkit-transition-duration: 0.5s;
}

header nav ul li:hover::after {
    width: 100%;
    left: 0%;
}

header nav ul li a {
    font-size: 18px;
    line-height: 80px;
    font-weight: bold;
    display: block;
    padding: 0 55px;
}

header nav ul li>a {
    color: #fff;
}

header nav ul li .list {
    width: 120%;
    box-shadow: 0 3px 29px -8px rgba(192, 196, 204, 0.7);
    background-color: #fff;
    position: absolute;
    left: -10%;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    display: block;
    padding: 10px 0px;
}

header nav ul li .list a {
    width: 100%;
    font-size: 14px;
    padding: 10px;
    line-height: 20px;
    font-weight: normal;
    color: rgba(0, 0, 0, .5);
}

header nav ul li .list a:hover {
    color: #2f2f2f;
}

header nav ul li:hover .list {
    backface-visibility: hidden;
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0);
}

.headerRight {
    position: relative;
    display: flex;
}

.langung {
    display: flex;
    font-size: 14px;
    cursor: pointer;
    line-height: 50px;
    font-family: 'GraphikLCG';
    margin-right: 15px;
    padding: 0px 10px;
    color: rgba(255, 255, 255, .3);
}

.langung a {
    padding: 0px 10px;
    color: rgba(255, 255, 255, .3);
}

.langung a:hover {
    color: rgba(255, 255, 255, .7);
    text-decoration: underline;
}

.langung a.active {
    color: rgba(255, 255, 255, .7);
}

.serachIcon {
    width: 50px;
    height: 50px;
    background-color: #fff;
    color: #1955a5;
    line-height: 50px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    font-size: 20px;
}

.serachIcon:hover {
    opacity: .9;
}

footer {
    width: 100%;
    border-bottom: 1px solid #e2e2e2;
    margin: 0 auto 1vw auto;
    position: relative;
    background: white;
}

footer .f5 {
    width: 100%;
    padding: 3vw 5vw;
    display: flex;
    background: #1955a5;
    position: relative;
}

footer .f5 .item {
    width: 22vw;
    color: white;
    margin-right: 2.5vw;
}

footer .f5 .item .cn {
    font-size: 2vw;
    font-weight: bold;
}

footer .f5 .item .en {
    font-size: 2vw;
    font-weight: bold;
    opacity: 0.1;
}

footer .f5 .item .text .name {
    font-size: 1.5vw;
    margin-bottom: 2vw;
}

footer .f5 .item .text .name::before {
    content: "";
    position: absolute;
    margin-top: 3vw;
    width: 3vw;
    height: 2px;
    background-color: white;
}

footer .f5 .item .text .des {
    height: 5vw;
    font-size: 0.9vw;
    line-height: 1.7;
    letter-spacing: 1px;
}

footer .f5 .item .text .btn {
    width: 6vw;
    height: 2vw;
    background-color: #ffffff;
    line-height: 2vw;
    text-align: center;
    color: #1955a5;
    font-size: 0.7vw;
    cursor: pointer;
}

footer .f5 .item:last-child {
    margin-right: 0;
}

footer .footer {
    width: 90vw;
    margin: 0 auto;
    display: flex;
    border-left: 1px solid #e2e2e2;
    border-right: 1px solid #e2e2e2;
}

footer .footer .imgBox {
    width: 30vw;
    border-right: 1px solid #e2e2e2;
}

footer .footer .imgBox .logo {
    width: 100%;
    padding: 2vw;
}

footer .footer .imgBox .logo img {
    width: 100%;
}

footer .footer .footerRight {
    width: 100%;
}

footer .footer .footerRight .footerNav {
    width: 100%;
    padding: 3vw;
}

footer .footer .footerRight .footerNav .footerNavUl {
    display: flex;
    justify-content: space-between;
}

footer .footer .footerRight .footerNav .level1 a {
    font-size: 16px;
    color: #2a2a2a;
    font-weight: bold;
}

footer .footer .footerRight .footerNav .level1 ul {
    margin-top: 1vw;
}

footer .footer .footerRight .footerNav .level1 ul li {
    margin-bottom: 15px;
    text-align: left;
}

footer .footer .footerRight .footerNav .level1 ul li a {
    font-size: 14px;
    color: #2a2a2a;
    opacity: 0.78;
    font-weight: normal;
}

footer .footer .footerRight .footerNav .level1 ul li:hover a {
    border-bottom: 1px solid #2a2a2a;
}

footer .footer .footerRight .footerInfo {
    border-top: 1px solid #e2e2e2;
    padding: 1vw 3vw;
    display: flex;
    justify-content: space-between;
    color: #6c6c6c;
    opacity: 0.4;
}

.index .title {
    display: flex;
    font-weight: bold;
    font-size: 2vw;
    position: absolute;
    padding: 4vw 0.5vw;
}

.index .title .cn {
    color: #181818;
    margin-right: 0.5vw;
}

.index .title .en {
    color: #181818;
    opacity: 0.1;
}

.index .banner {
    width: 100%;
    position: fixed;
    top: 0;
}

.bannerSwiper {
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.home .swiper-wrapper .bannerSwiper .swiper-slide {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.bannerSwiper .swiper-slide {
    width: 100%;
    background-size: cover !important;
}

.bannerSwiper .swiper-pagination {
    position: relative;
    color: #fff;
    bottom: 5%;
}

.bannerSwiper .swiper-pagination .swiper-pagination-bullet {
    width: 3vw;
    height: 5px;
    border-radius: 0;
}

.bannerSwiper .swiper-pagination .swiper-pagination-bullet {
    background: white;
}

.bannerSwiper .swiper-pagination .swiper-pagination-bullet-active {
    background: white;
}

.bannerSwiper .txt {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    color: #fff;
    text-align: center;
}

.bannerSwiper .txt .cn,
.bannerSwiper .txt .en {
    width: 100%;
    position: relative;
    overflow: hidden;
    line-height: 1.6;
}

.bannerSwiper .txt .cn p {
    font-size: 68px;
    font-weight: bold;
    -webkit-transform: translateY(100%);
    -webkit-transition: all 1s ease 0.3s;
}

.bannerSwiper .swiper-slide-active .txt .cn p,
.bannerSwiper .swiper-slide-active .txt .en p {
    -webkit-transform: translateY(0%);
}

.bannerSwiper .txt .en p {
    font-size: 24px;
    text-transform: uppercase;
    font-family: GraphikLCG;
    -webkit-transform: translateY(100%);
    -webkit-transition: all 1s ease .5s;
}

.index .f1 {
    width: 100%;
    padding: 0 5vw;
    background-color: #f9f9f9;
    margin-top: 100vh;
    position: relative;
}

.index .f1 .itemBox {
    width: 100%;
    display: flex;
    overflow: hidden;
}

.index .f1 .itemBox .item {
    width: 22.5vw;
    padding: 16vw 2vw 8vw 2vw;
    border-left: 1px solid #e2e2e2;
    cursor: pointer;
    overflow: hidden;
}

.index .f1 .itemBox .item .num {
    position: absolute;
    color: #ffffff;
    font-weight: bold;
    margin-left: 1vw;
    font-size: 9vw;
    transition: 0.3s all ease-in-out;
}

.index .f1 .itemBox .item .img {
    width: 80%;
    margin: 0 auto;
    position: relative;
    transition: 0.3s all ease-in-out;
}

.index .f1 .itemBox .item .text {
    position: relative;
}

.index .f1 .itemBox .item .text .name {
    font-size: 2vw;
    color: #181818;
    font-weight: bold;
    letter-spacing: 0px;
}

.index .f1 .itemBox .item .text .del {
    margin-top: 2vw;
    color: #1955a5;
    font-size: 14px;
    transition: 0.5s all ease-in-out;
}

.index .f1 .itemBox .item .text .del i {
    font-size: 1.2vw;
    position: absolute;
    margin-left: -1.4vw;
    margin-top: -2.15px;
    transform: translateX(-50px);
    transition: 0.5s all ease-in-out;
}

.index .f1 .itemBox .item .text .del a {
    color: #1955a5;
}

.index .f1 .itemBox .item .text .del::before {
    content: '';
    position: absolute;
    width: 2vw;
    height: 2px;
    background: #e2e2e2;
    margin-top: 0.5vw;
    margin-left: -2.5vw;
    transition: 0.5s all ease-in-out;
}

.index .f1 .itemBox .item:last-child {
    border-right: 1px solid #e2e2e2;
}

.index .f1 .itemBox .item::before {
    content: '';
    width: 0;
    height: 33.6vw;
    margin-top: -3vw;
    background: white;
    position: absolute;
    margin-left: -2vw;
    transition: 0.5s all ease-in-out;
}

.index .f1 .itemBox .item:hover .num {
    color: #f9f9f9;
}

.index .f1 .itemBox .item:hover .img {
    transform: translateY(-20px);
}

.index .f1 .itemBox .item:hover .del {
    transform: translateX(50px);
}

.index .f1 .itemBox .item:hover .del i {
    transform: translateX(0px);
}

.index .f1 .itemBox .item:hover .del::before {
    content: '';
    position: absolute;
    width: 2vw;
    height: 2px;
    background: #1955a5;
    margin-top: 0.5vw;
    margin-left: -2.5vw;
}

.index .f1 .itemBox .item:hover::before {
    content: '';
    width: 22.3vw;
    height: 33.6vw;
    background: white;
    position: absolute;
    margin-left: -2vw;
}

.index .f2 {
    width: 100%;
    height: 50vw;
    display: flex;
    background: white;
    position: relative;
}

.index .f2 .title {
    padding-left: 4vw;
}

.index .f2 .imgBg {
    width: 18vw;
    position: absolute;
    margin-top: 9vw;
}

.index .f2 .teamSwiperTop {
    width: 60vw;
    height: 50vw;
    position: relative;
    right: 0;
    overflow: hidden;
}

.index .f2 .teamSwiperTop .swiper-slide {
    width: 100%;
    height: 50vw;
    background-size: cover !important;
    transition: 0.5s all ease-in-out;
}

.index .f2 .teamSwiperTop .swiper-slide .img {
    width: 49.8vw;
    height: 50vw;
    right: 0;
    position: absolute;
    background-size: cover !important;
}

.index .f2 .teamSwiperTop .swiper-slide .img img {
    width: 18vw;
    position: absolute;
    margin-top: 17vw;
    margin-left: -9.5vw;
    transition: 0.5s all ease-in-out;
    cursor: pointer;
}

.index .f2 .teamSwiperTop .swiper-slide .img img:hover {
    transform: translateY(-20px);
}

.index .f2 .teamSwiperBottom {
    width: 40vw;
    height: 50vw;
    background-size: cover !important;
    margin: 0 auto;
    overflow: hidden;
    padding-top: 12vw;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
}

.index .f2 .teamSwiperBottom .swiper-wrapper {
    transform: translate3d(255px, 0px, 0px) !important;
}

.index .f2 .teamSwiperBottom .swiper-slide {
    font-size: 1vw;
    color: #393939;
    display: inline-block;
    transition: 0.3s all ease-in-out;
    margin-left: -3vw;
    cursor: pointer;
}

.index .f2 .teamSwiperBottom .swiper-slide .icon {
    width: 4vw;
    height: 4vw;
    background-color: #f9f9f9;
    border-radius: 50%;
    font-size: 2vw;
    text-align: center;
    padding-top: 0.6vw;
    margin-right: 1vw;
    display: inline-block;
    float: left;
}

.index .f2 .teamSwiperBottom .swiper-slide .text {
    width: 60%;
    display: inline-block;
}

.index .f2 .teamSwiperBottom .swiper-slide .name {
    width: 10vw;
    font-size: 1vw;
    margin-top: 1.1vw;
    transition: 0.3s all ease-in-out;
}

.index .f2 .teamSwiperBottom .swiper-slide .des {
    width: 16vw;
    opacity: 0;
}

.index .f2 .teamSwiperBottom .swiper-slide:nth-child(2) {
    transform: rotate(0deg) translateX(-5vw) translateY(13vw) !important;
}

.index .f2 .teamSwiperBottom .swiper-slide:nth-child(3) {
    transform: rotate(0) translateX(-20vw) translateY(26vw) !important;
}

.index .f2 .teamSwiperBottom .swiper-slide-active {
    font-size: 1vw;
    opacity: 1;
    color: #0c3969;
    transform: initial !important;
}

.index .f2 .teamSwiperBottom .swiper-slide-active .icon {
    background-color: #1955a5;
    color: white;
}

.index .f2 .teamSwiperBottom .swiper-slide-active .name {
    font-size: 1.2vw;
    font-weight: bold;
    margin-bottom: 1vw;
    margin-top: -1vw;
}

.index .f2 .teamSwiperBottom .swiper-slide-active .des {
    opacity: 1;
    color: #919191;
    font-size: 14px;
}

.index .f2 .teamSwiperBottom .prev_nth2Mode {
    transform: rotate(0deg) translateX(14vw) translateY(26vw);
    opacity: 1;
}

.index .f2 .teamSwiperBottom .next_nth2Mode {
    transform: rotate(0deg) translateX(-5vw) translateY(13vw);
    opacity: 1;
}

.index .f2 .teamSwiperBottom .prev_nth3Mode {
    transform: rotate(-25deg) translateX(3vw) translateY(6vw);
    opacity: 1;
}

.index .f2 .teamSwiperBottom .next_nth3Mode {
    transform: rotate(0) translateX(-20vw) translateY(26vw);
    opacity: 1;
}

.index .f2 .teamSwiperBottom .prev_nth4Mode {
    transform: rotate(-20deg) translateX(-1vw) translateY(15vw);
}

.index .f2 .teamSwiperBottom .next_nth4Mode {
    transform: rotate(20deg) translateX(-1vw) translateY(10vw);
}

.index .f3 {
    width: 100%;
    height: 50vw;
    background: white;
    position: relative;
}

.index .f3 .title {
    z-index: 9;
    padding-left: 5vw;
}

.index .f3 .title .cn {
    color: white;
}

.index .f3 .title .en {
    color: #ffffff;
    opacity: 0.1;
}

.index .f3 .f3teamSwiperBottom {
    width: 100%;
    height: 50vw;
    overflow: hidden;
}

.index .f3 .f3teamSwiperBottom .swiper-slide {
    width: 100%;
    height: 50vw;
    background-size: cover !important;
}

.index .f3 .f3teamSwiperTop {
    position: relative;
    margin-top: -18vw;
    width: 100%;
    height: 18vw;
    overflow: hidden;
    z-index: 1;
}

.index .f3 .f3teamSwiperTop .swiper-slide {
    cursor: pointer;
    color: white;
    text-align: center;
}

.index .f3 .f3teamSwiperTop .swiper-slide .text {
    width: 80%;
    margin: 0 auto;
    padding: 2vw;
    margin-top: 5vw;
    height: 13vw;
    transition: 0.3s all ease-in-out;
}

.index .f3 .f3teamSwiperTop .swiper-slide .text .name {
    font-size: 1.2vw;
    font-weight: bold;
    margin-bottom: 1vw;
}

.index .f3 .f3teamSwiperTop .swiper-slide .text .des {
    line-height: 1.7;
    letter-spacing: 1px;
    font-size: 0.9vw;
}

.index .f3 .f3teamSwiperTop .swiper-slide .text .more {
    width: 3vw;
    height: 3vw;
    background-color: transparent;
    border-radius: 50%;
    margin: 1vw auto;
    color: white;
    font-size: 2.1vw;
}

.index .f3 .f3teamSwiperTop .swiper-slide-thumb-active .text {
    height: 14vw;
    margin-top: 4vw;
    position: relative;
    background-color: #1955a5;
}

.index .f3 .f3teamSwiperTop .swiper-slide-thumb-active .text .more {
    width: 3vw;
    height: 3vw;
    background-color: #ffffff;
    border-radius: 50%;
    margin: 1vw auto;
    color: #0c3969;
    font-size: 2.1vw;
}

.index .f3 .f3teamSwiperTop::after {
    content: '';
    width: 100%;
    height: 13vw;
    position: absolute;
    left: 0;
    margin-top: 5vw;
    bottom: 0;
    right: 0;
    background: url(/assets/images/img8.jpg) bottom no-repeat;
    background-size: cover !important;
    z-index: -1;
    filter: blur(10px);
}

.index .f4 {
    padding: 0 5vw 5vw 5vw;
    background: #f9f9f9;
    position: relative;
}

.index .f4 .ht {
    display: flex;
    justify-content: space-between;
}

.index .f4 .ht .title {
    position: relative;
    padding: 4vw 0 3vw 0;
}

.index .f4 .ht .mores {
    padding-top: 5vw;
    color: #0c3969;
    font-size: 1vw;
    cursor: pointer;
    transition: 0.5s all ease-in-out;
}

.index .f4 .ht .mores::before {
    content: '';
    position: absolute;
    width: 2vw;
    height: 2px;
    background: #e2e2e2;
    margin-top: 0.7vw;
    margin-left: -2.5vw;
    transition: 0.5s all ease-in-out;
}

.index .f4 .ht .mores:hover {
    transform: translateX(-20px);
}

.index .f4 .ht .mores:hover::before {
    content: '';
    position: absolute;
    width: 2vw;
    height: 2px;
    background: #0c3969;
    margin-top: 0.7vw;
    margin-left: -2.5vw;
    transition: 0.5s all ease-in-out;
}

.index .f4 .itemBox {
    width: 100%;
    display: flex;
}

.index .f4 .itemBox .item {
    width: 22vw;
    background-color: #ffffff;
    cursor: pointer;
    margin-right: 2vw;
}

.index .f4 .itemBox .item .text {
    padding: 1vw;
}

.index .f4 .itemBox .item .text .name {
    color: #2a2a2a;
    font-size: 1vw;
    line-height: 1.7;
    letter-spacing: 1px;
    font-weight: bold;
    margin-bottom: 2vw;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.index .f4 .itemBox .item .text .name::before {
    content: '';
    position: absolute;
    margin-top: 4.2vw;
    width: 27px;
    height: 2px;
    background-color: #1955a5;
}

.index .f4 .itemBox .item .text .des {
    color: #949494;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 1.7;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.index .f4 .itemBox .item .text .more {
    margin-top: 2vw;
    color: #1955a5;
}

.index .f4 .itemBox .item .text .more p {
    margin: 1.5vw 0;
}

.index .f4 .itemBox .item .text .more .icon {
    width: 3vw;
    height: 3vw;
    background-color: #ffffff;
    border: solid 1px #1955a5;
    border-radius: 50%;
    font-size: 2vw;
    text-align: center;
    color: #1a69b1;
    position: absolute;
    margin-top: -0.5vw;
    transition: 0.3s all ease-in-out;
    z-index: 1;
}

.index .f4 .itemBox .item .img {
    overflow: hidden;
}

.index .f4 .itemBox .item .img img {
    width: 100%;
    height: 12vw;
    transition: 0.5s all ease-in-out;
}

.index .f4 .itemBox .item:last-child {
    margin-right: 0;
}

.index .f4 .itemBox .item:hover .text .more .icon {
    background-color: #1955a5;
    color: white;
}

.index .f4 .itemBox .item:hover .img img {
    transform: scale(1.1);
}

.pc {
    display: block;
}

.mobile {
    display: none;
}

.home {
    overflow: hidden;
    height: 100vh;
}

.home .swiper-wrapper .swiper-slide {
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    -webkit-transform: scale(.85);
    transform: scale(.85);
}

.home .swiper-wrapper .swiper-slide-active {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.home .swiper-slide:last-child {
    height: auto;
    -webkit-transform: scale(1);
    transform: scale(1);
}

#menu {
    position: fixed;
    right: 5%;
    z-index: 90;
    top: 50%;
    transform: translateY(-50%);
    width: 25px;
}

#menu a {
    width: 25px;
    height: 25px;
    opacity: 1;
    background: none;
    margin: 5px 0px;
    position: relative;
    cursor: pointer;
    display: block;
    text-indent: 100px;
    overflow: hidden;
}

#menu a::before {
    content: "";
    width: 6px;
    height: 6px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -3px;
    margin-left: -3px;
    border-radius: 50%;
    transition: all .5s;
}

#menu a::after {
    content: "";
    background: url(../images/dot.png);
    background-size: cover;
    position: absolute;
    transition: all .3s;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
}

#menu a.active::before {
    transform: scale(.4);
    opacity: 0;
}

#menu a.active::after {
    width: 25px;
    height: 25px;
    left: 0;
    top: 0;
    animation: rotate0 2s ease infinite;
}

@keyframes rotate0 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(359deg);
    }
}

.box2 {
    height: 100vh;
    position: relative;
    padding: 0px 5%;
    padding-top: 150px;
    background-color: #f9f9f9;
}

.sub_title {
    width: 100%;
    height: auto;
    position: relative;
    display: flex;
    align-items: center;
    line-height: 50px;
    margin-bottom: 50px;
}

.pro_title {
    width: 100%;
    height: auto;
    position: relative;
    display: flex;
    align-items: center;
    line-height: 50px;
    margin-bottom: 30px;
    font-size: 40px;
    font-family: GeoBrandBold;
}

.sub_title b {
    display: block;
    position: relative;
    font-size: 40px;
}

.sub_title p {
    font-size: 40px;
    font-family: GeoBrandBold;
    text-transform: uppercase;
    margin-left: 10px;
    opacity: .2;
}

.sub_title.c {
    text-align: center;
}

.sub_title.c b {
    width: 100%;
}

.home-product {
    width: 100%;
    height: calc(100% - 100px);
    position: relative;
}

.home-product ul {
    display: flex;
    flex-wrap: wrap;
    height: 100%;
}

.home-product ul li {
    width: 20%;
    height: 100%;
    position: relative;
    -webkit-transition: all 1s;
    border-right: 1px solid rgba(0, 0, 0, .05);
}

.home-product ul li a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.home-product ul li a:before {
    width: 0%;
    height: 100%;
    position: absolute;
    right: 0%;
    bottom: 0%;
    content: '';
    background-color: #fff;
    -webkit-transition: all 0.6s cubic-bezier(.23, 1, .32, 1);
}

.home-product ul li a:hover:before {
    width: 100%;
    top: 0%;
    right: auto;
    left: 0%;
}

.home-product ul li:hover {
    box-shadow: 0 20px 40px 0 rgb(0 0 0 / 10%);
}

.home-product ul li a .thum {
    width: 80%;
    height: auto;
    margin-top: 5%;
    margin-bottom: 20px;
    margin-left: 10%;
}

.home-product ul li a .thum .num {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    text-align: center;
    color: #fff;
    font-size: 12vw;
    font-family: GeoBrandBold;
    left: 0%;
    -webkit-transition: all .5s;
}

.home-product ul li::after {
    width: 1px;
    height: 250px;
    position: absolute;
    right: -1px;
    top: -250px;
    content: '';
    background: rgba(0, 0, 0, .05);
}

.home-product ul li a .thum .pic {
    position: relative;
    z-index: 5;
    -webkit-transform: scale(0.9);
}

.home-product ul li a:hover .pic {
    -webkit-transform: scale(1.05);
}

.home-product ul li a:hover .num {
    color: rgba(0, 0, 0, .1);
}

.home-product ul li a .name {
    width: 100%;
    height: auto;
    position: relative;
    font-size: 22px;
    font-weight: bold;
    font-family: montserrat;
    padding: 0px 25px;
    margin-bottom: 10px;
    line-height: 30px;
    min-height: 60px;
    -webkit-transition: all 0.5s ease;
}

.home-product ul li:hover a .name {
    padding: 0px 40px;
}

.home-product ul li a .more {
    width: 100%;
    height: auto;
    padding: 0px 25px;
    position: relative;
    color: #1955a5;
    line-height: 40px;
    -webkit-transition: all 0.65s ease;
    margin-bottom: 50px;
}

.home-product ul li:hover a .more {
    padding-left: 60px;
}

.home-product ul li:hover a .more::after {
    width: 40px;
    opacity: 0;
}

.home-product ul li a .more::after {
    width: 25px;
    height: 1px;
    position: absolute;
    left: -10px;
    top: 50%;
    content: '';
    background: rgba(0, 0, 0, .3);
    -webkit-transition: all 0.65s ease;
}

.home-product ul li a .more:before {
    -webkit-transition: all .65s;
    transition: all .65s;
    opacity: 0;
    background: url(../images/ico_arrowRight.svg) no-repeat 0 transparent;
    height: 10px;
    top: 50%;
    margin-top: -4px;
    left: -40px;
    content: '';
    width: 40px;
    display: block;
    position: absolute;
}

.home-product ul li:hover a .more:before {
    opacity: 1;
    left: 10px;
}

.box3 {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
}

.box3 .left {
    padding-top: 150px;
}

.box3 .left,
.box3 .right {
    width: 50%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.sub_title.w {
    color: #fff;
}

.box3 .left .sub_title {
    padding-left: 10%;
}

.clock {
    width: 100%;
    position: relative;
}

.clock_img {
    position: relative;
    margin-left: -350px;
    width: 600px;
    -webkit-transition: all 1s ease .3s;
    -webkit-transform: rotate(30deg);
}

.box3 .right ul {
    width: 100%;
    height: 100%;
    position: relative;
}

.box3 .right ul li {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0%;
    top: 0%;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 1s;
    background: center center no-repeat;
    background-size: cover;
    -webkit-transform: scale(1.1);
}

.box3 .right ul li.active {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
}

.pro_box {
    width: 30vw;
    height: auto;
    position: absolute;
    left: 50%;
    top: 55%;
    margin-left: -15vw;
    margin-top: -15vw;
    z-index: 10;
    -webkit-transform: scale(0.5);
    opacity: 0;
}

.pro_box ul {
    display: block;
    width: 100%;
    height: 100%;
}

.pro_box ul li {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0%;
    top: 50px;
    opacity: 0;
    background: center center no-repeat;
    background-size: cover;
    -webkit-transition: all .5s;
}

.pro_box ul li.active {
    top: 0px;
    opacity: 1;
}

.clock_list {
    width: 600px;
    height: 600px;
    position: absolute;
    left: 0%;
    top: 0%;
    border-radius: 50%;
    margin-left: -300px;
    -webkit-transition: all 1s ease .8s;
    -webkit-transform: rotate(0deg);
    opacity: 0;
}

.clock_list ul {
    width: 50%;
    height: auto;
    position: absolute;
    left: 570px;
    top: 50%;
    -webkit-transform: translateY(-50%);
}

.clock_list ul li {
    width: 100%;
    height: auto;
    position: absolute;
    left: 0%;
    top: 0%;
    -webkit-transition: all 1s;
}

.clock_list ul li .name {
    width: 100%;
    display: flex;
    align-items: center;
}

.clock_list ul li .name .icon {
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background-color: #f9f9f9;
    border-radius: 50%;
    font-size: 32px;
    cursor: pointer;
    -webkit-transition: all .45s;
    position: relative;
}

.clock_list ul li .name .icon:before,
.clock_list ul li .name .icon::after {
    content: '';
    background: #1955a5;
    height: 100%;
    width: 100%;
    border-radius: 50%;
    z-index: -1;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.clock_list ul li.active .name .icon::before,
.clock_list ul li.active .name .icon::after {
    -webkit-animation: fadein 1.5s linear infinite .75s;
}

@-webkit-keyframes fadein {
    0% {
        -webkit-transform: scale(1);
        opacity: .3
    }
    100% {
        -webkit-transform: scale(2.5);
        opacity: 0
    }
}

.clock_list ul li .name .title {
    font-size: 24px;
    font-weight: bold;
    margin-left: 15px;
    margin-top: 0px;
    opacity: 0;
}

.clock_list ul li.active .name .title {
    margin-top: -130px;
    opacity: 1;
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) .5s;
}

.clock_list ul li .info {
    opacity: 0;
    height: auto;
    padding-left: 75px;
    line-height: 1.6;
    font-size: 14px;
    width: 150%;
    position: absolute;
    margin-top: 0px;
}

.clock_list ul li .more {
    color: #1955a5;
    cursor: pointer;
}

.clock_list ul li .info .des {
    margin-bottom: 10px;
}

.clock_list ul li.active .info {
    opacity: 1;
    margin-top: -70px;
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) .6s;
}

.clock_list ul li.active .icon {
    background: #1955a5;
    color: #fff;
}

.slide-inner {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-size: cover;
    background-position: center center;
}

.swiper-container.jinguan .swiper-slide {
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.box4 {
    width: 100%;
    height: 100%;
    position: relative;
}

.box4 .sub_title {
    position: absolute;
    left: 5%;
    top: 150px;
    z-index: 10;
}

.jinguan {
    height: 100%;
    width: 100%;
    position: relative;
}

.TabUl {
    width: 100%;
    height: 200px;
    position: absolute;
    left: 0%;
    bottom: 0%;
    z-index: 10;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    display: flex;
}

.TabUl ul {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.TabUl ul li {
    width: calc(100% / 3);
    color: #fff;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.TabUl ul li .info {
    width: 100%;
    height: auto;
    padding: 0px 5%;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
}

.TabUl ul li .info .name {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    position: relative;
    padding-bottom: 0px;
    -webkit-transition: all 600ms
}

.TabUl ul li .info .des {
    font-size: 14px;
    line-height: 1.7;
    opacity: .7;
}

.TabUl ul li:before {
    width: 100%;
    height: calc(100% + 50px);
    position: absolute;
    left: 0%;
    top: 0%;
    content: '';
    background: #1955a5;
    opacity: 0;
    -webkit-transition: all 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.TabUl ul li.active:before {
    top: -30px;
    opacity: 1;
}

.TabUl ul li .info .name::after {
    width: 0px;
    height: 4px;
    position: absolute;
    left: 50%;
    margin-left: -0px;
    content: '';
    background-color: #fff;
    bottom: 0px;
    -webkit-transition: all 600ms;
}

.TabUl ul li.active .info .name::after {
    width: 20px;
    margin-left: -10px;
}

.TabUl ul li.active .info .name {
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.box5 {
    width: 100%;
    height: 100%;
    position: relative;
    background-color: #f9f9f9;
    padding: 0px 0%;
    padding-top: 150px;
}

.news {
    width: 100%;
    height: calc(100% - 200px);
    display: flex;
    flex-wrap: wrap;
}

.news ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
}

.news ul li {
    width: 23.5%;
    height: 100%;
    position: relative;
    background: #fff;
    margin-bottom: 0px;
}

.news.n ul li:hover {
    box-shadow: 0px 0px 60px rgba(0, 0, 0, .2);
}

.news ul li:nth-child(3n) {
    margin-right: 2%;
}

.news ul li:nth-child(4n) {
    margin-right: 0%;
}

.news ul li a {
    width: 100%;
    position: relative;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: self-end;
}

.news ul li a .text {
    width: 100%;
    height: auto;
    padding: 50px 25px 25px 25px;
}

.news ul li a .text .name {
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
    margin-bottom: 35px;
    position: relative;
}

.news ul li a .text .name::after {
    width: 30px;
    height: 3px;
    position: absolute;
    left: 0%;
    content: '';
    background: #1955a5;
    bottom: -15px;
}

.news ul li a .text .des {
    opacity: .6;
    margin-bottom: 35px;
}

.news ul li a .text .more {
    width: auto;
    color: #1955a5;
    line-height: 30px;
    position: relative;
    padding-left: 20px;
    -webkit-transition: all .5s;
}

.news ul li:hover a .text .more {
    padding-left: 45px;
}

.news ul li a .text .more:before {
    width: 25px;
    height: 1px;
    position: absolute;
    left: -10px;
    top: 50%;
    content: '';
    background: rgba(0, 0, 0, .3);
    -webkit-transition: all 0.65s ease;
}

.news ul li a .text .more::after {
    -webkit-transition: all .65s;
    transition: all .65s;
    opacity: 0;
    background: url(../images/ico_arrowRight.svg) no-repeat 0 transparent;
    height: 10px;
    top: 50%;
    margin-top: -4px;
    left: -40px;
    content: '';
    width: 40px;
    display: block;
    position: absolute;
}

.news ul li:hover a .more::after {
    opacity: 1;
    left: -10px;
}

.news ul li:hover a .more::before {
    width: 40px;
    opacity: 0;
}

.box6 {
    position: relative;
    background: #1955a5;
    padding: 35px 0%;
    color: #fff;
    display: flex;
}

.box6 ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.box6 ul li {
    width: 25%;
    height: auto;
    position: relative;
    padding-right: 50px;
}

.box6 ul li .box_name {
    width: 100%;
    line-height: 50px;
    margin-bottom: 50px;
}

.box6 ul li .box_name b {
    display: block;
    position: relative;
    font-size: 40px;
    margin-bottom: 10px;
}

.box6 ul li .box_name p {
    font-size: 40px;
    font-family: GeoBrandBold;
    text-transform: uppercase;
    opacity: .2;
}

.box6 ul li .name {
    width: 100%;
    font-size: 22px;
    font-weight: bold;
    padding-bottom: 35px;
    margin-bottom: 35px;
    position: relative;
    line-height: 1.5;
}

.box6 ul li .name::after {
    width: 30px;
    height: 2px;
    position: absolute;
    left: 0%;
    bottom: 0px;
    background-color: #fff;
    content: '';
}

.box6 ul li .des {
    width: 100%;
    height: auto;
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 35px;
    min-height: 56px;
}

.box6 ul li a {
    display: block;
    width: 150px;
    height: auto;
    line-height: 45px;
    color: #fff;
    text-align: center;
    border: 1px solid #fff;
}

.box6 ul li a:hover {
    color: #1955a5;
    background-color: #fff;
}

.box7 {
    padding: 0px 0%;
}

.box7 .w1400 {
    display: flex;
}

.box7 .flogo {
    width: 25%;
    position: relative;
    padding: 50px 25px 50px 0px;
    display: flex;
    align-items: center;
    border-right: 1px solid rgba(0, 0, 0, .1);
}

.f_logo {
    width: 150px;
}

.box7 .fright {
    width: 75%;
    position: relative;
    padding: 50px 0px 0px 0px;
}

.box7 .f_nav {
    width: 100%;
    height: auto;
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    padding-bottom: 20px;
}

.copyright {
    width: 100%;
    display: flex;
    justify-content: space-between;
    color: rgba(0, 0, 0, .3);
    line-height: 25px;
    padding: 10px 0px;
    font-size: 12px;
    padding-left: 25px;
    padding-right: 25px;
}

.copyright a {
    color: rgba(0, 0, 0, .3);
}

.copyright a:hover {
    color: rgba(0, 0, 0, .7);
}

.copyright p {
    width: auto;
}

.box7 .f_nav ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding-left: 25px;
}

.box7 .f_nav ul li {
    width: 20%;
    height: auto;
    position: relative;
}

.box7 .f_nav ul li:nth-child(2) {
    padding-left: 15px;
}

.box7 .f_nav ul li a {
    display: block;
    width: 100%;
    height: auto;
    line-height: 20px;
    padding: 5px 0px;
    color: rgba(0, 0, 0, .5);
}

.box7 .f_nav ul li a:hover {
    text-decoration: underline;
    color: rgba(0, 0, 0, .8);
}

.box7 .f_nav ul li a:first-child {
    font-size: 16px;
    font-weight: bold;
    color: rgba(0, 0, 0, .8);
}

.sub_banner {
    width: 100%;
    height: 590px;
    position: relative;
    overflow: hidden
}

.sub_banner .pic {
    width: 110vw;
    height: 100%;
    position: absolute;
    background: no-repeat;
    background-size: cover;
    background-position: center center;
    -webkit-animation: subs 6s linear 1;
    -webkit-animation-fill-mode: forwards;
    -webkit-transform: translateX(-5%);
    opacity: .7;
}

@-webkit-keyframes subs {
    0% {
        -webkit-transform: translateX(-5%)
    }
    100% {
        -webkit-transform: translateX(0)
    }
}

.sub_banner .txt {
    width: 100%;
    height: auto;
    position: absolute;
    top: 45%;
    text-align: center;
    color: #fff;
}

.sub_banner .txt b {
    font-size: 38px;
    font-weight: bold;
    display: block;
    margin-bottom: 10px;
}

.sub_banner .txt p {
    font-family: GeoBrandBold;
    font-size: 16px;
    opacity: .7;
    text-transform: uppercase;
}

.app_list {
    width: 100%;
    height: auto;
    display: flex;
    position: relative;
}

.app_list ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.app_list ul li {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5vw;
}

.app_list ul li:last-child {
    margin-bottom: 0vw;
}

.app_list ul li .thum {
    width: 60%;
    box-shadow: 0 40px 60px 0 rgb(0 0 0 / 10%);
}

.app_list ul li:nth-child(odd) {
    direction: rtl;
}

.app_list ul li:nth-child(odd) .info {
    direction: initial;
}

.app_list ul li .info {
    width: 35%;
    position: relative;
}

.app_list ul li .info .name {
    width: 100%;
    height: auto;
    font-size: 28px;
    font-weight: bold;
    line-height: 1.4;
    margin-bottom: 20px;
}

.app_list ul li .info .des {
    width: 100%;
    height: auto;
    line-height: 2;
    color: rgba(0, 0, 0, .5);
    margin-bottom: 60px;
    font-size: 16px;
}

.app_list ul li .info .more {
    display: flex;
    width: 168px;
    height: auto;
    color: #1955a5;
    border: 1px solid #1955a5;
    line-height: 50px;
    text-align: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
}

.app_list ul li .info .more:before {
    width: 0%;
    height: 100%;
    position: absolute;
    right: 0%;
    top: 0%;
    background: #1955a5;
    content: '';
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

.app_list ul li .info .more:hover {
    color: #fff;
}

.app_list ul li .info .more:hover:before {
    width: 100%;
    right: auto;
    left: 0%;
}

.app_list ul li .info .more p {
    margin-right: 10px;
    position: relative;
}

.app_list ul li .info .more i {
    position: relative;
    font-size: 24px;
}

.qua_box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.qua_box .thum {
    width: 40%;
}

.qua_list {
    width: 55%;
    position: relative;
}

.qua_list ul li {
    position: relative;
    padding-bottom: 40px;
    margin-bottom: 40px;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.qua_list ul li:last-child {
    padding-bottom: 0px;
    margin-bottom: 0px;
    border-bottom: none;
}

.qua_list ul li .icon {
    width: 60px;
    height: 60px;
    line-height: 58px;
    border: 1px solid #3e3e3e;
    text-align: center;
    border-radius: 50%;
    margin-bottom: 25px;
    font-size: 36px;
}

.qua_list ul li .name {
    font-size: 28px;
    font-weight: bold;
    line-height: 1.4;
    margin-bottom: 20px;
}

.qua_list ul li .des {
    width: 100%;
    height: auto;
    line-height: 2;
    color: rgba(0, 0, 0, .5);
    font-size: 16px;
}

.b2 {
    background: center center no-repeat;
    background-size: cover;
}

.sys_box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.sys_info {
    width: 45%;
    color: #fff;
}

.sys_imgs {
    width: 50%;
}

.sys_imgs ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.sys_imgs ul li {
    width: 49%;
    position: relative;
}

.sys_info .name {
    line-height: 1.6;
    position: relative;
    margin-bottom: 45px;
}

.sys_info .name b {
    display: block;
    font-size: 24px;
}

.sys_info .name p {
    text-transform: uppercase;
    font-size: 14px;
    opacity: .7;
}

.sys_info .title {
    font-size: 16px;
    line-height: 2;
    margin-bottom: 25px;
}

.sys_links {
    width: 100%;
    position: relative;
    display: none;
}

.sys_links a {
    display: flex;
    position: relative;
    width: 100%;
    background-color: #fff;
    margin-bottom: 15px;
    padding: 15px;
    justify-content: space-between;
    line-height: 30px;
}

.sys_links a:hover {
    background-color: #1955a5;
    color: #fff;
}

.sys_links a:last-child {
    margin-bottom: 0px;
}

.sys_links a .icon,
.sys_links a .rw {
    width: 30px;
    height: 30px;
    text-align: center;
    font-size: 28px;
}

.sys_links a .t {
    width: calc(100% - 80px);
    text-align: left;
}

.news.n {
    height: auto;
}

.news.n ul {
    justify-content: flex-start;
}

.news.n ul li {
    height: auto;
    margin-bottom: 45px;
}

.news.n ul li a .text {
    padding: 25px;
}

.news.n ul li a .text .name,
.news.n ul li a .text .des {
    margin-bottom: 15px;
}

.news.n ul li a .text .des {
    margin-bottom: 25px;
}

#page li.xl-prevPage,
#page li.xl-nextPage {
    display: none;
}

#page li {
    border: 1px solid #dce0e0;
    border-radius: 3px;
    min-width: 40px;
    height: 40px;
    line-height: 38px;
    font-size: 12px;
}

#page li.xl-active {
    background-color: #0068b7;
    border-color: #0068b7;
    color: #FFF;
}

.backPage {
    width: 80px;
    height: 80px;
    position: absolute;
    display: block;
    left: 0;
    bottom: 0px;
    background: #fff;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, .1);
    cursor: pointer;
}

.backPage:hover {
    opacity: .9;
}

.backPage:after {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -10px;
    margin-top: -10px;
    background: url(../images/arrow_left.png);
    background-size: cover;
    content: ''
}

.dpl .singePage img {
    width: 70%;
    margin-left: 15%;
}

.b3 {
    background: url(../images/about_bg.jpg) center center no-repeat;
    background-size: cover;
}

.company_box {
    width: 45%;
    height: auto;
    position: relative;
}

.company_year {
    width: 100%;
    font-size: 120px;
    font-family: GeoBrandBold;
    text-transform: uppercase;
    line-height: 1;
    color: #1955a5;
    margin-bottom: 35px;
}

.company_year p {
    margin-left: 100px;
}

.company_name {
    width: 100%;
    height: auto;
    line-height: 2;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 25px;
}

.b4 {
    height: 100vh;
    padding: 0px;
    overflow: hidden;
}

.laberBox ul li {
    width: 100%;
    text-align: center;
    line-height: 55px;
    overflow: hidden;
    position: relative
}

.laberBox ul li>div:nth-child(1) {
    width: 22%
}

.laberBox ul li>div {
    width: 26%;
    float: left;
    position: relative
}

.laberBox ul li {
    background: #1955a5;
    font-size: 18px;
    color: #fff
}

.laberBox {
    width: 70%;
}

.laberBox ol {
    width: 100%;
    background: #f9f9f9;
}

.laberBox ol li {
    height: 56px;
    line-height: 55px;
    text-align: center;
    position: relative;
    cursor: pointer;
    transition: all .5s;
    border-bottom: 1px solid rgba(0, 0, 0, .05);
}

.laberBox ol li>div:nth-child(1) {
    width: 22%
}

.laberBox ol li>div {
    width: 26%;
    float: left;
    position: relative
}

.lightBox .tet-box {
    position: absolute;
    background: #fff;
    left: 50%;
    width: 1000px;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 8
}

.lightBox .tittle {
    line-height: 35px;
    padding: 15px;
    background: #1955a5;
    color: #fff;
    font-weight: 900;
    font-size: 20px;
}

.lightBox .summary-join {
    padding: 15px;
    height: 500px;
    overflow-y: auto;
    font-size: 16px;
    line-height: 2;
}

.lightBox .close {
    width: 80px;
    height: 40px;
    position: absolute;
    right: 15px;
    top: 12.5px;
    background: #fff;
    color: #1955a5;
    cursor: pointer;
    border-radius: 50px;
    text-align: center;
    line-height: 40px;
    font-size: 16px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, .1);
}

.lightBox .close:hover {
    background: #1955a5;
    color: #fff;
}

.laberBox ol li:hover {
    background: rgba(0, 0, 0, .05);
}

.recru_box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.recru_box .re_left {
    width: 25%;
    background: #1955a5;
    padding: 50px 35px;
    color: #fff;
}

.re_left .wrods {
    font-size: 68px;
    font-family: GeoBrandBold;
}

.re_left .des {
    width: 100%;
    height: auto;
    position: relative;
    margin-top: 35px;
    line-height: 1.6;
    font-size: 16px;
}

.re_left .des p:last-child {
    font-size: 20px;
    font-family: 'GraphikLCG';
}

.map_list {
    width: 100%;
    height: auto;
    position: relative;
}

.map_list ul {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.map_list ul li {
    width: 100%;
    height: auto;
    position: relative;
    padding: 35px 5%;
    display: flex;
    align-items: flex-start;
    cursor: pointer;
    -webkit-transition: all .5s;
}

.map_list ul li.active {
    background-color: #fff;
    box-shadow: 0px 0px 50px rgba(0, 0, 0, .05);
}

.map_list ul li .city {
    width: 175px;
    height: auto;
    line-height: 50px;
    position: relative;
    font-size: 20px;
    font-weight: bold;
}

.map_list ul li .info {
    width: calc(100% - 175px);
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-between;
}

.map_list ul li:nth-child(2) {
    display: none;
}

.map_list ul li .city::after {
    width: 30px;
    height: 3px;
    position: absolute;
    left: 0%;
    bottom: -20px;
    content: '';
    background-color: #0068b7;
}

.map_list ul li .rows {
    width: 23%;
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-self: auto;
    align-items: flex-start;
}

.map_list ul li .rows .icon {
    width: 70px;
    height: auto;
    line-height: 50px;
    color: #1955a5;
    display: flex;
    align-items: center;
}

.map_list ul li .rows .icon i {
    font-size: 20px;
    margin-right: 5px;
}

.map_list ul li .rows .txt {
    width: calc(100% - 70px);
    padding: 15px 0px;
    line-height: 20px;
}

.map_box {
    width: 100%;
    height: 50vh;
    background-color: #fff;
}

.map_box img {
    max-width: none;
    width: auto;
}

.app_box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.app_b_l {
    width: 45%;
    font-size: 16px;
    line-height: 2;
}

.app_b_r {
    width: 50%;
}

.appSwiper {
    position: relative;
    overflow: hidden;
}

.c-table .cell {
    font-size: 14px;
    width: 100%;
    display: block;
    text-align: center;
    line-height: 1.4;
    padding: 5px 0px;
}

.c-table th .cell {
    font-size: 14px;
}

.c-table.c-table__cell--block .cell {
    text-align: center;
    white-space: pre-line;
}

.c-table.c-table__cell--block .cell span {
    font-size: 10px;
    font-weight: normal;
    margin-left: 5px;
}

.c-table--border th {
    padding: 10px 0px;
    text-align: center;
}

.c-table {
    overflow-x: auto;
}

.c-table .cell.first-cell {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px;
}

.c-table .cell.first-cell .thum {
    width: 40px;
}

.c-table .cell.first-cell p {
    display: block;
    width: calc(100% - 90px);
    font-size: 14px;
    line-height: 1.4;
}

.c-table {
    margin-top: 5vw;
    font-family: 'GraphikLCG';
}

.c-table tbody td a.pdf_link {
    width: 100%;
    display: flex;
    justify-content: center;
    width: 30px;
    margin: 0px auto;
}

.c-table tbody td a.pdf_link:hover {
    opacity: .9;
}

.c-table.c-table__cell--block .cell.first-cell {
    display: flex;
    justify-content: space-between;
    align-content: center;
    padding: 10px;
}

.c-table.c-table__cell--block .cell.first-cell .thum {
    width: 40px;
}

.cart {
    width: 40px;
    height: 40px;
    background-color: #0068b7;
    color: #fff;
    line-height: 40px;
    text-align: center;
    font-size: 20px;
    border-radius: 50%;
    cursor: pointer;
    opacity: .5;
}

.cart:hover {
    opacity: .9;
}

.c-table.c-table__cell--block .cell.first-cell p {
    width: calc(100% - 100px);
    line-height: 40px;
    font-size: 14px;
}

.relates {
    position: relative;
}

.relates ul {
    display: flex;
    flex-wrap: wrap;
}

.relates ul li {
    width: 32%;
    height: auto;
    position: relative;
    margin-bottom: 25px;
    background: #fff;
    -webkit-transition: all .5s;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, .05);
    margin-right: 2%;
}

.relates ul li:nth-child(3n) {
    margin-right: 0%;
}

.relates ul li a {
    display: block;
    width: 100%;
}

.relates ul li .name {
    width: calc(100% - 50px);
    height: auto;
    margin: 25px;
    line-height: 1.7;
    font-size: 16px;
}

.relates ul li .more {
    display: flex;
    width: 168px;
    height: auto;
    color: #1955a5;
    border: 1px solid #1955a5;
    line-height: 50px;
    text-align: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    margin-left: 25px;
    margin-bottom: 30px;
}

.relates ul li .more:before {
    width: 0%;
    height: 100%;
    position: absolute;
    left: 0%;
    top: 0%;
    background: #1955a5;
    content: '';
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

.relates ul li:hover .more {
    color: #fff;
}

.relates ul li:hover .more:before {
    width: 100%;
}

.relates ul li:hover {
    box-shadow: 0px 0px 30px rgba(0, 0, 0, .05);
}

.relates ul li:hover .pic {
    -webkit-transform: scale(1.05);
}

.relates ul li:hover a {
    color: #0068b7;
}

.relates ul li .more p {
    margin-right: 10px;
    position: relative;
}

.relates ul li .more i {
    position: relative;
    font-size: 24px;
}

.c-table--border th {
    background: #1955a5;
}

.c-table--border th:first-child {
    width: 0px;
    overflow: hidden;
    display: block;
    padding: 0px;
    height: 0px;
}

.c-table td:first-child {
    width: 0px;
    overflow: hidden;
    display: block;
    padding: 0px;
    height: 0px;
}

.c-table--border th .cell {
    color: #fff;
}

.c-table--border th {
    border-right: 1px solid #1d5eb4;
}

.boxes.b5 {
    background: url(../images/bg3.jpg) center center no-repeat;
    background-size: cover;
}

.form {
    width: 600px;
    height: auto;
    margin: 0px auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.form .label {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 35px;
}

.form .label input {
    display: block;
    border: none;
    height: 50px;
    width: 100%;
    outline: none;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, .05);
    text-indent: 25px;
}

.form .label.even input {
    width: 48%;
}

.form .label textarea {
    width: 100%;
    height: 200px;
    padding: 25px;
    outline: none;
    border: none;
    font-family: "寰蒋闆呴粦";
}

.submit {
    display: flex;
    width: 168px;
    height: auto;
    color: #1955a5;
    border: 1px solid #1955a5;
    line-height: 50px;
    text-align: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
}

.submit p {
    z-index: 1;
    position: relative;
    font-weight: bold;
}

.submit:before {
    width: 0%;
    height: 100%;
    position: absolute;
    right: 0%;
    top: 0%;
    background: #1955a5;
    content: '';
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

.submit:hover:before {
    width: 100%;
    right: auto;
    left: 0%;
}

.submit:hover {
    color: #fff;
}

.submit.active {
    cursor: no-drop;
    color: #666;
    border: 1px solid #666;
}

.submit.active:before {
    display: none;
}

.sub_title.ht {
    overflow: hidden;
}

.sub_title.ht p {
    -webkit-transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1) .7s;
    -webkit-transform: translateY(100%);
}

.sub_title.ht b {
    -webkit-transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1) .6s;
    -webkit-transform: translateY(100%);
}

.swiper-slide-active .sub_title.ht p,
.swiper-slide-active .sub_title.ht b {
    -webkit-transform: translateY(0%);
}

.home-product ul li,
.news ul li {
    opacity: 0;
    left: 100px;
    visibility: hidden;
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) .8s;
}

.home-product ul li:nth-child(2),
.news ul li:nth-child(2) {
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) .9s;
}

.home-product ul li:nth-child(3),
.news ul li:nth-child(3) {
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 1s;
}

.home-product ul li:nth-child(4),
.news ul li:nth-child(4) {
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 1.1s;
}

.swiper-slide-active .home-product ul li,
.swiper-slide-active .news ul li {
    left: 0px;
    opacity: 1;
    visibility: visible;
}

.home-product.animated ul li,
.news.animated ul li {
    left: 0px;
    opacity: 1;
    visibility: visible;
}

.news ul li a:hover .name {
    color: #0068b7;
}

.swiper-slide-active .clock_img {
    -webkit-transform: rotate(60deg);
}

.swiper-slide-active .clock_list {
    -webkit-transform: rotate(0deg);
    opacity: 1;
}

.pro_box {
    -webkit-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) 1s;
}

.box3 .right {
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 0.5s;
    top: 100px;
}

.TabUl {
    bottom: -200px;
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 0.5s;
}

.TabUl.n {
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 0s;
}

.box3 .right::after {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0%;
    top: 0%;
    content: '';
    background: #fff;
    -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 0.5s;
}

.swiper-slide-active .TabUl {
    bottom: 0px;
}

.TabUl.animated {
    bottom: 0px;
}

.swiper-slide-active .box3 .right {
    top: 0px;
}

.swiper-slide-active .box3 .right::after {
    height: 0%;
}

.swiper-slide-active .pro_box {
    -webkit-transform: scale(1);
    opacity: 1;
}

.boxes.npage {
    padding-top: 150px;
}

.searchClose {
    width: 50px;
    height: 50px;
    position: absolute;
    right: 0px;
    top: 0px;
    cursor: pointer;
    line-height: 50px;
    text-align: center;
    -webkit-transition: all .5s;
    font-size: 24px;
}

.searchClose:hover {
    -webkit-transform: rotate(90deg);
}

header.active nav ul li::after {
    background-color: #0068b7;
}

.detailTop {
    padding-top: 180px;
}

.c-table th>.cell {
    word-break: break-word;
}

.c-table__body tr.hover-row>td,
.c-table--striped .c-table__body tr.hover-row td {
    background: #fcfcfc;
}

.carBar {
    width: 60px;
    height: 60px;
    position: fixed;
    right: 2%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    background-color: #ffeb3b;
    border-radius: 60px;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, .1);
    color: #3e3e3e;
    cursor: pointer;
    -webkit-transition: all 0.5s;
    z-index: 100;
}

.carBar:hover {
    width: 120px;
}

.carBar:hover p {
    opacity: 1;
    left: 25px;
}

.carBar p {
    width: 60px;
    height: auto;
    line-height: 60px;
    position: absolute;
    left: 0%;
    top: 0%;
    text-align: left;
    opacity: 0;
    -webkit-transition: all .5s;
    font-weight: bold;
    font-size: 18px;
}

.carBar .sls {
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    font-size: 10px;
    background: red;
    color: #fff;
    position: absolute;
    right: 0px;
    top: 0px;
    border-radius: 50%;
    display: none;
}

.carBar.active .sls {
    display: block;
}

.carBar i {
    line-height: 60px;
    text-align: center;
    font-size: 28px;
    display: block;
    width: 60px;
    position: absolute;
    right: 0%;
    top: 0%;
}

.carBox {
    width: 600px;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
}

.carBox .name {
    width: 100%;
    height: auto;
    line-height: 70px;
    background-color: #0068b7;
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: 24px;
}

.selects,
.car_td {
    width: 100%;
    display: flex;
    justify-content: space-between;
    line-height: 50px;
}

.car_table {
    width: 100%;
    height: auto;
    position: relative;
}

.selects .car_row {
    font-size: 16px;
}

.selects .car_row,
.car_td .nums {
    width: calc(100% / 3);
    height: auto;
    text-align: center;
    font-weight: bold;
}

.car_td .nums {
    font-weight: normal;
}

.car_td .nums.c {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.car_td .del,
.car_td .add {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #3e3e3e;
    line-height: 26px;
    text-align: center;
    font-size: 22px;
    cursor: pointer;
    display: none;
}

.car_td .car_input {
    width: 90%;
    margin-left: 5%;
}

.car_td .car_input input {
    width: 100%;
    display: block;
    border: 1px solid rgba(0, 0, 0, .1);
    height: 40px;
    text-align: center;
    outline: none;
    font-size: 16px;
}

.delete {
    cursor: pointer;
}

.delete:hover {
    color: #0068b7;
}

.car_info {
    position: relative;
    width: 100%;
    height: auto;
    background: #f9f8fb;
    padding: 25px 100px;
}

.car_info .tr {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.car_info .tr label {
    width: 100px;
    height: auto;
    line-height: 40px;
    font-size: 16px;
}

.car_info .tr input {
    width: calc(100% - 100px);
    outline: none;
    border: 1px solid rgba(0, 0, 0, .1);
    text-indent: 20px;
    font-size: 16px;
}

.car_info .tr.tip {
    justify-content: center;
    opacity: .7;
    padding-top: 15px;
    margin-bottom: 25px;
}

.car_submit {
    width: 165px;
    height: auto;
    line-height: 45px;
    margin: 0px auto;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    background-color: #1a69b1;
    color: #fff;
    cursor: pointer;
    border-radius: 5px;
}

.car_submit:hover,
.car_close:hover {
    opacity: .9;
}

.car_submit.active {
    cursor: no-drop;
    background: #666;
}

.car_close {
    width: 30px;
    height: 30px;
    position: absolute;
    right: 10px;
    top: 10px;
    background-color: #fff;
    color: #0068b7;
    border-radius: 50px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
}

.table_tips {
    width: 220px;
    height: auto;
    border: 1px solid #0068b7;
    line-height: 46px;
    text-align: center;
    margin: 50px auto;
    font-size: 16px;
    color: #0068b7;
    cursor: pointer;
    border-radius: 50px;
    opacity: .7;
}

.table_tips:hover {
    opacity: 1;
}

.searchContent {
    width: 100%;
    height: auto;
    margin-top: 100px;
}

.searchContent .scResult {
    width: 100%;
    height: auto;
    background: #0b3088;
    color: #fff;
    font-weight: 700;
    text-indent: 45px;
    font-size: 20px;
    line-height: 40px;
    position: relative
}

.searchContent .scResult.b {
    background: #0c8bc0;
}

.searchContent .scResult:after {
    width: 25px;
    height: 25px;
    position: absolute;
    left: 10px;
    top: 7.5px;
    background: url(../images/result_icon.png?v=1) no-repeat;
    background-size: cover;
    content: ''
}

.resultTips {
    width: 100%;
    height: auto;
    line-height: 40px;
    font-size: 14px
}

.resultTips span {
    color: #e10101;
    padding: 0 3px;
    font-weight: 700
}

.noData {
    width: 200px;
    height: 200px;
    margin: 0px auto;
    font-size: 14px;
    text-align: center;
    display: none;
    position: relative;
}

.noData::after {
    width: 80px;
    height: 80px;
    position: absolute;
    left: 50%;
    margin-left: -40px;
    top: 30px;
    background: url(../images/noData_img.png) no-repeat;
    background-size: cover;
    opacity: .2;
    content: '';
}

.noData p {
    position: absolute;
    width: 100%;
    height: auto;
    left: 0px;
    top: 60%;
    color: rgba(0, 0, 0, .2);
}

.noData.active {
    display: block
}

.pro_row {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    z-index: 10;
}

.pro_row .pro_td {
    width: 19%;
    margin-right: 1.25%;
    position: relative;
}

.pro_td .name {
    width: 100%;
    height: auto;
    line-height: 40px;
    font-weight: bold;
    color: #000;
    text-indent: 10px;
}

.pro_row .pro_td:nth-child(5n) {
    margin-right: 0%;
}

.pro_td .pro_main {
    width: 100%;
    height: auto;
    position: relative;
    left: 0%;
    top: 0px;
}

.pro_main ul li {
    width: 100%;
    height: auto;
    position: relative;
}

.pro_main .de_tips {
    width: 100%;
    height: auto;
    border: 1px solid rgba(0, 0, 0, .05);
    padding: 10px 15px;
    line-height: 25px;
    position: relative;
}

.pro_main .de_tips::after {
    width: 0px;
    height: 0px;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid rgba(0, 0, 0, .2);
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -5px;
    content: '';
}

.pro_main .de_list {
    width: 100%;
    height: auto;
    position: absolute;
    left: 0%;
    top: 46px;
    background: #fafafa;
    border: 1px solid rgba(0, 0, 0, .05);
    padding: 15px;
    display: none;
}

.pro_main ul li:hover .de_list {
    display: block;
}

.pro_main .de_list .li {
    width: 100%;
    height: auto;
    line-height: 30px;
    cursor: pointer;
    -webkit-transition: all .35s;
}

.pro_main .de_list .li:hover {
    color: #0068b7;
    padding-left: 15px;
}

.boxes.appBox {
    width: 100%;
    height: auto;
    position: relative;
    background: url(../images/app_list_bg.jpg?v=1) center center no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.clocks {
    width: 300px;
    height: 450px;
    position: absolute;
    left: 340px;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(5%);
    opacity: 0;
    -webkit-transition: all .5s ease .8s;
}

.swiper-slide-active .clocks {
    -webkit-transform: translateY(-50%) translateX(0%);
    opacity: 1;
}

.clocks ul {
    width: 100%;
    height: 100%;
    position: relative;
}

.clocks ul li {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    opacity: 0;
    visibility: hidden;
    background: #1955a5;
    color: #fff;
    border-radius: 10px;
    padding: 25px;
    left: 30px;
}

.clocks ul li .clock_center {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    left: 0%;
    padding: 0px 25px;
}

.clocks ul li::after {
    width: 0px;
    height: 0px;
    left: -10px;
    top: 50%;
    margin-top: -10px;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid #1955a5;
    content: '';
    position: absolute;
}

.clocks ul li:nth-child(1)::after {
    top: 15%;
}

.clocks ul li:nth-child(3)::after {
    top: 85%;
}

.clocks ul li.active {
    opacity: 1;
    visibility: visible;
    left: 0px;
    -webkit-transition: all .45s;
}

.clocks ul li .name {
    width: 100%;
    height: auto;
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    position: relative;
    padding-bottom: 15px;
    margin-bottom: 25px;
}

.clocks ul li .name::after {
    width: 30px;
    height: 5px;
    position: absolute;
    left: 50%;
    margin-left: -15px;
    bottom: 0px;
    content: '';
    background: #fff;
    border-radius: 5px;
}

.clocks ul li .info {
    font-size: 16px;
    line-height: 2;
}

.clocks ul li .more {
    width: 150px;
    height: auto;
    line-height: 40px;
    font-size: 14px;
    border: 1px solid #fff;
    color: #fff;
    text-align: center;
    border-radius: 50px;
    margin: 0px auto;
    margin-top: 35px;
    display: block;
}

.clocks ul li .more:hover {
    background-color: #fff;
    color: #0068b7;
}

.menu_btn {
    position: absolute;
    right: 0;
    display: none;
    width: 60px;
    height: 60px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: #1955a5;
    color: transparent;
    border: none;
    outline: none;
}

.menu_btn span {
    top: 29px;
    left: 20px;
    width: 20px
}

.menu_btn span,
.menu_btn span:after,
.menu_btn span:before {
    position: absolute;
    height: 2px;
    background-color: #fff;
    border-radius: 1px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease
}

.menu_btn span:after,
.menu_btn span:before {
    content: "";
    left: 0;
    -webkit-transform: translateY(0) rotate(0)
}

.menu_btn span:before {
    top: -6px;
    width: 14px
}

.menu_btn span:after {
    top: 6px;
    width: 12px
}

.menu_btn.active span {
    background-color: transparent
}

.menu_btn.active span:before {
    -webkit-transform: translateY(6px) rotate(-45deg)
}

.menu_btn.active span:after {
    -webkit-transform: translateY(-6px) rotate(45deg)
}

.menu_btn.active span:after,
.menu_btn.active span:before {
    width: 20px
}

.productSwiper {
    display: none;
}

.homeapp,
.box5 .more {
    display: none;
}

@media screen and (max-width: 1500px) {
    header nav ul li a {
        padding: 0 40px;
    }
    .clock_list ul li .info {
        width: 100%;
    }
    .box6 ul li .name {
        font-size: 18px;
    }
    .box6 ul li .des {
        font-size: 14px;
    }
    .box6 ul li .box_name b,
    .box6 ul li .box_name p {
        font-size: 30px;
    }
    .clock_list {
        margin-left: -400px;
    }
    .clock_img {
        margin-left: -450px;
    }
    .clocks {
        left: 220px;
    }
    header {
        width: 90%;
        left: 5%;
        margin-left: 0px;
    }
}

@media screen and (max-width: 1440px) {
    .bannerSwiper .txt .cn p {
        font-size: 48px;
    }
    .box3 .left {
        padding-top: 100px;
    }
}

@media screen and (max-width: 1366px) {
    .box3 .left {
        padding-top: 50px;
    }
    .box3 .left .sub_title {
        margin-bottom: 0px;
    }
}

@media screen and (max-width: 1024px) {
    .boxes {
        padding: 50px 0px;
    }
    .menu_btn {
        display: block;
    }
    header {
        height: 60px;
        left: 0%;
        top: 0px;
        padding: 0px;
        background: #1955a5;
        width: 100%;
        margin-left: 0%;
    }
    header nav {
        opacity: 0;
        visibility: hidden;
        width: 100%;
        height: calc(100vh - 60px);
        right: 0;
        top: 60px;
        position: fixed;
        background: #1955a5;
        -webkit-transition: all .6s cubic-bezier(.23, 1, .32, 1);
        display: block;
    }
    .headerRight {
        display: none;
    }
    header .logo {
        width: 50px;
        margin-left: 3%;
    }
    .home {
        height: 100vh;
        margin-top: 0px;
    }
    header.active {
        background: #1955a5;
    }
    .bannerSwiper .txt {
        width: 90%;
        left: 5%;
        top: 40%;
    }
    .bannerSwiper .txt .cn p {
        font-size: 28px;
    }
    .bannerSwiper .txt .en p {
        font-size: 12px;
    }
    .box2 {
        padding-top: 90px;
        height: 100%;
    }
    .sub_title b,
    .sub_title p {
        font-size: 28px;
    }
    header.active .logo img:nth-child(2) {
        opacity: 1;
    }
    header.active .logo img:nth-child(1) {
        opacity: 0;
    }
    .productSwiper {
        display: none;
    }
    .home-product {
        display: block;
    }
    .productSwiper .thum .num {
        width: 100%;
        height: auto;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        text-align: center;
        color: #fff;
        font-size: 14vw;
        font-family: GeoBrandBold;
        left: 0%;
        -webkit-transition: all .5s;
    }
    .productSwiper .name {
        width: 100%;
        height: auto;
        position: relative;
        font-size: 20px;
        font-weight: bold;
        font-family: montserrat;
        padding: 0px 0px;
        margin-top: 15px;
        line-height: 30px;
        min-height: auto;
        -webkit-transition: all 0.5s ease;
        text-align: center;
    }
    .productSwiper a .more {
        width: 100%;
        height: auto;
        padding: 0px 25px;
        position: relative;
        color: #1955a5;
        line-height: 40px;
        -webkit-transition: all 0.65s ease;
        margin-bottom: 50px;
        display: none;
    }
    .productSwiper a:hover .more {
        padding-left: 60px;
    }
    .productSwiper a:hover .more::after {
        width: 40px;
        opacity: 0;
    }
    .productSwiper a .more::after {
        width: 25px;
        height: 1px;
        position: absolute;
        left: -10px;
        top: 50%;
        content: '';
        background: rgba(0, 0, 0, .3);
        -webkit-transition: all 0.65s ease;
    }
    .productSwiper a {
        display: block;
        width: 100%;
        height: 100%;
        position: relative;
        overflow: hidden;
    }
    .productSwiper a .more:before {
        -webkit-transition: all .65s;
        transition: all .65s;
        opacity: 0;
        background: url(../images/ico_arrowRight.svg) no-repeat 0 transparent;
        height: 10px;
        top: 50%;
        margin-top: -4px;
        left: -40px;
        content: '';
        width: 40px;
        display: block;
        position: absolute;
    }
    .productSwiper a:hover .more:before {
        opacity: 1;
        left: 10px;
    }
    .productSwiper a .thum .pic {
        position: relative;
        z-index: 5;
        -webkit-transform: scale(1);
    }
    .home-product ul li {
        width: 50%;
        height: 50%;
    }
    .home-product ul li,
    .news ul li {
        opacity: 1;
        left: 0px;
        visibility: hidden;
        -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 0s;
    }
    .home-product ul li::after {
        width: 1px;
        height: 100%;
        right: 0px;
        top: 0px;
        display: none;
    }
    .home-product ul li:nth-child(even)::after {
        display: none;
    }
    .home-product ul li {
        border-right: none;
    }
    .sub_title {
        margin-bottom: 25px;
    }
    .box5 .sub_title {
        margin-bottom: 10px;
    }
    .box5 .more {
        width: 150px;
        height: auto;
        line-height: 40px;
        font-size: 14px;
        border: 1px solid #3e3e3e;
        color: #3e3e3e;
        text-align: center;
        border-radius: 50px;
        margin: 0px auto;
        margin-top: 5px;
        display: block;
    }
    .home-product ul li a .more {
        display: none;
    }
    .home-product ul li a .name {
        width: 100%;
        height: auto;
        position: relative;
        font-size: 14px;
        font-weight: bold;
        font-family: montserrat;
        padding: 0px 0px;
        margin-bottom: 0px;
        line-height: 30px;
        min-height: auto;
        -webkit-transition: all 0.5s ease;
        text-align: center;
        padding: 0px 10px;
        line-height: 20px;
    }
    .home-product ul li:nth-child(2),
    .news ul li:nth-child(2) {
        -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 0s;
    }
    .home-product ul li:hover a .name {
        padding: 0px 0px;
    }
    .box3 .left,
    .box3 .right {
        width: 100%;
    }
    .box3 .right {
        width: 100%;
        height: 40%;
    }
    .home-product ul li:nth-child(3),
    .news ul li:nth-child(3),
    .home-product ul li:nth-child(4),
    .news ul li:nth-child(4) {
        -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1) 0s;
    }
    .box3 {
        flex-wrap: wrap;
        display: none;
    }
    .box3 .left {
        padding-top: 30px;
        width: 100%;
        height: calc((100vh - 60px)*.6);
        position: relative;
        left: 0%;
        bottom: 0%;
    }
    .swiper-slide-active .box3 .right {
        top: auto;
        bottom: 0%;
    }
    .clock_img {
        width: 300px;
        margin-left: 0px;
        position: absolute;
        left: 50%;
        margin-left: -150px;
        bottom: -200px;
    }
    .swiper-slide-active .clock_img {
        -webkit-transform: rotate(0deg);
    }
    .clock_list {
        margin-left: 0%;
    }
    .clock_list {
        width: 300px;
        height: 300px;
    }
    .clock {
        width: 100%;
        height: auto;
        position: absolute;
        left: 0%;
        bottom: 0%;
    }
    .clocks {
        left: 0%;
        margin-left: 5%;
        width: 90%;
        height: auto;
        opacity: 0;
        position: relative;
    }
    .swiper-slide-active .clocks {
        -webkit-transform: translateY(0%) translateX(0%);
        opacity: 1;
    }
    .homeapp {
        display: block;
    }
    .homeapp {
        height: 100vh;
        padding-top: 0px;
        position: relative;
    }
    .homeappSwiper {
        height: calc(100vh - 60px);
    }
    .homeapp .sub_title {
        position: absolute;
        left: 5%;
        top: 90px;
        z-index: 5;
    }
    .homeappSwiper .happBg {
        height: 100%;
        position: absolute;
        left: 0%;
        top: 0%;
        background: center center no-repeat;
        background-size: cover;
        width: 100%;
    }
    .pro_icon {
        width: 200px;
        height: 200px;
        position: absolute;
        top: -200px;
        left: 50%;
        margin-left: -100px;
        border-radius: 50%;
        padding: 0px;
        z-index: 5;
    }
    .homeappSwiper .clock_center {
        position: absolute;
        width: 90%;
        left: 5%;
        color: #fff;
        border-radius: 10px;
        background: rgba(25, 85, 165, 0.1);
        backdrop-filter: blur(10px);
        padding: 25px;
        bottom: 5vw;
    }
    .homeappSwiper .clock_center .name {
        width: 100%;
        height: auto;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        position: relative;
        padding-bottom: 15px;
        margin-bottom: 15px;
    }
    .homeappSwiper .name::after {
        width: 30px;
        height: 5px;
        position: absolute;
        left: 50%;
        margin-left: -15px;
        bottom: 0px;
        content: '';
        background: #fff;
        border-radius: 5px;
    }
    .homeappSwiper .info {
        font-size: 14px;
        line-height: 2;
    }
    .homeappSwiper .more {
        width: 150px;
        height: auto;
        line-height: 40px;
        font-size: 14px;
        border: 1px solid #fff;
        color: #fff;
        text-align: center;
        border-radius: 50px;
        margin: 0px auto;
        margin-top: 35px;
        display: block;
    }
    .TabUl {
        display: none;
    }
    .swiper-container.jinguan .text {
        display: block;
        position: absolute;
        left: 0%;
        color: #fff;
        border-radius: 0px;
        background: rgba(25, 85, 165, 0.1);
        backdrop-filter: blur(10px);
        width: 100%;
        height: auto;
        padding: 25px 15px;
        text-align: center;
        bottom: 0px;
    }
    .box4 .sub_title {
        top: 90px;
    }
    .swiper-container.jinguan .text .name {
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
        position: relative;
        padding-bottom: 15px;
        -webkit-transition: all 600ms;
    }
    .swiper-container.jinguan .text .des {
        font-size: 14px;
        line-height: 1.7;
        opacity: .7;
    }
    .swiper-container.jinguan .text .name::after {
        width: 0px;
        height: 4px;
        position: absolute;
        left: 50%;
        margin-left: 0px;
        content: '';
        background-color: #fff;
        bottom: 0px;
        -webkit-transition: all 600ms;
        width: 20px;
        margin-left: -10px;
    }
    .bannerSwiper .txt .cn {
        margin-bottom: 15px;
    }
    .box5 {
        padding-top: 90px;
    }
    .news {
        height: auto;
    }
    .news ul li {
        width: 49%;
        height: auto;
        margin-bottom: 15px;
    }
    .news ul li:nth-child(3n) {
        margin-right: 2%;
    }
    .news ul li:nth-child(2n) {
        margin-right: 0%;
    }
    .news ul li a .text .des {
        display: none;
    }
    .news ul li a .text {
        padding: 15px;
    }
    .news ul li a .text .more {
        display: none;
    }
    .news ul li a .text .name {
        font-size: 14px;
        font-weight: bold;
        line-height: 20px;
        margin-bottom: 0px;
        -webkit-line-clamp: 3;
    }
    .box6 ul li {
        width: 100%;
        padding-right: 0px;
        margin-bottom: 15px;
    }
    .box6 ul li .box_name {
        line-height: 30px;
        margin-bottom: 0px;
    }
    .box6 ul li .box_name b,
    .box6 ul li .box_name p {
        font-size: 20px;
    }
    .box6 ul li .box_name b {
        margin-bottom: 0px;
    }
    .box6 ul li .name {
        font-size: 14px;
        padding-bottom: 10px;
        margin-bottom: 10px;
        width: calc(100% - 120px);
    }
    .box6 ul li .des {
        font-size: 12px;
        min-height: auto;
        margin-bottom: 0px;
        width: calc(100% - 120px);
    }
    .box6 ul li a {
        width: 90px;
        height: auto;
        line-height: 35px;
        position: absolute;
        right: 20px;
        top: 28px;
        font-size: 12px;
        border-radius: 40px;
    }
    .box7 .f_nav,
    .box7 .flogo {
        display: none;
    }
    .box7 .fright {
        width: 100%;
        padding: 0px;
    }
    .box7 {
        background: #0c366d;
    }
    .copyright {
        padding: 15px 0px;
        color: rgba(255, 255, 255, .5);
        line-height: 20px;
        flex-wrap: wrap;
    }
    .copyright p {
        width: 100%;
    }
    .copyright a {
        color: rgba(255, 255, 255, .5);
    }
    .box6 ul li .name::after {
        width: 25px;
    }
    .box6 {
        padding: 25px 0% 15px;
    }
    header nav.active {
        opacity: 1;
        visibility: visible;
    }
    header nav ul {
        height: auto;
        padding: 0px 5%;
        padding-top: 25px;
        flex-wrap: wrap;
    }
    header nav ul li {
        width: 100%;
    }
    header nav ul li a {
        text-align: left;
        width: 70px;
        line-height: 30px;
        padding: 0px;
    }
    header nav ul li {
        height: auto;
        display: flex;
        align-items: flex-start;
        border-bottom: 1px solid rgba(255, 255, 255, .1);
        margin-bottom: 15px;
        padding-bottom: 15px;
    }
    header nav ul li::before {
        display: none;
    }
    header nav ul li .list {
        position: relative;
        -webkit-transform: translateY(0px);
        opacity: 1;
        background: transparent;
        width: 100%;
        left: 0%;
        padding: 0px;
        display: flex;
        flex-wrap: wrap;
        box-shadow: none;
        pointer-events: auto;
        width: calc(100% - 70px);
    }
    header nav ul li .list:before {
        display: none;
    }
    header nav ul li .list a {
        width: auto;
        background: transparent;
        color: #fff;
        padding: 0px 0px;
        margin-right: 15px;
        line-height: 20px;
        padding: 5px 0px;
    }
    header.active nav ul li>a {
        color: #fff;
    }
    .boxes.npage {
        padding-top: 90px;
    }
    .npage .home-product ul li a .thum {
        width: 100%;
        margin-left: 0%;
    }
    .pro_title {
        margin-bottom: 10px;
        font-size: 24px;
    }
    .app_b_l {
        width: 100%;
        font-size: 14px;
        line-height: 1.7;
    }
    .app_b_r {
        width: 100%;
    }
    .carBox {
        width: 90%;
    }
    .carBox .name {
        line-height: 50px;
        font-size: 18px;
    }
    .selects,
    .car_td {
        line-height: 40px;
    }
    .selects .car_row {
        font-size: 14px;
    }
    .car_td {
        font-size: 12px;
    }
    .car_info {
        padding: 20px;
    }
    .car_info .tr label {
        width: 70px;
        height: auto;
        line-height: 40px;
        font-size: 14px;
    }
    .car_info .tr input {
        width: calc(100% - 70px);
        font-size: 14px;
    }
    .car_info .tr.tip {
        margin-bottom: 15px;
        font-size: 12px;
    }
    .car_submit {
        line-height: 45px;
        font-size: 14px;
    }
    .app_list ul li {
        margin-bottom: 35px;
    }
    .app_list ul li .thum {
        margin-bottom: 15px;
    }
    .app_list ul li .thum,
    .app_list ul li .info {
        width: 100%;
    }
    .app_list ul li .info .name {
        font-size: 18px;
        margin-bottom: 5px;
    }
    .app_list ul li .info .des {
        font-size: 14px;
        line-height: 1.7;
        margin-bottom: 20px;
    }
    .app_list ul li .info .more {
        width: 128px;
        line-height: 45px;
    }
    .singePage {
        font-size: 14px;
        line-height: 1.7;
    }
    .npage .sub_title {
        margin-bottom: 15px;
    }
    .npage .sub_title b,
    .npage .sub_title p {
        font-size: 20px;
    }
    .relates ul li {
        width: 100%;
        margin-right: 0%;
        margin-bottom: 15px;
    }
    .qua_box {
        flex-wrap: wrap;
    }
    .qua_box .thum {
        margin-bottom: 15px;
        width: 100%;
    }
    .qua_list {
        width: 100%;
    }
    .qua_list ul li {
        padding-bottom: 20px;
        margin-bottom: 20px;
    }
    .qua_list ul li .icon {
        width: 40px;
        height: 40px;
        line-height: 38px;
        border: 1px solid #3e3e3e;
        text-align: center;
        border-radius: 50%;
        margin-bottom: 10px;
        font-size: 24px;
    }
    .qua_list ul li .name {
        font-size: 18px;
        margin-bottom: 5px;
    }
    .qua_list ul li .des {
        font-size: 14px;
        line-height: 1.7;
    }
    .yq .sub_title b,
    .yq .sub_title p,
    .sys_info .name b {
        font-size: 20px;
    }
    .yq .sub_title p {
        display: none;
    }
    .sys_box {
        flex-wrap: wrap;
    }
    .sys_info,
    .sys_imgs {
        width: 100%;
    }
    .sys_info .title {
        font-size: 14px;
        line-height: 1.7;
    }
    .sys_imgs ul li {
        width: 48%;
    }
    .news.n ul li a .text {
        padding: 15px;
    }
    .news.n ul li {
        margin-bottom: 15px;
    }
    #page {
        padding-top: 20px;
    }
    .backPage {
        display: none;
    }
    .detailTop {
        padding-top: 100px;
        padding-bottom: 25px;
    }
    .detailTop .title {
        margin-bottom: 20px;
        line-height: 1.5;
        font-size: 24px;
    }
    .detailTop .info {
        font-size: 12px;
    }
    .dpl {
        padding: 10vw 0px;
    }
    .dpl .singePage img {
        width: 100%;
        margin-left: 0%;
    }
    .ndc_npnews .post_next,
    .ndc_npnews .post_prev {
        padding: 20px 0px;
        font-size: 16px;
        line-height: 1.5;
    }
    .ndc_npnews .txt {
        font-size: 12px;
    }
    .company_box {
        width: 100%;
    }
    .company_year p {
        margin-left: 50px;
    }
    .company_year {
        font-size: 60px;
        margin-bottom: 15px;
    }
    .company_name {
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 5px;
    }
    .boxes.b4 {
        padding: 0px;
    }
    .recru_box .re_left {
        width: 100%;
        background: #1955a5;
        padding: 25px 15px;
    }
    .re_left .wrods {
        font-size: 34px;
    }
    .re_left .des {
        margin-top: 10px;
        font-size: 14px;
    }
    .laberBox {
        width: 100%;
        margin-top: 15px;
    }
    .map_list ul li {
        width: 100%;
    }
    .backTop,
    .map_box {
        display: none;
    }
    .map_list ul li {
        padding: 25px 5%;
        flex-wrap: wrap;
    }
    .map_list ul li .city,
    .map_list ul li .info {
        width: 100%;
    }
    .laberBox ul li {
        font-size: 14px;
    }
    .laberBox ol li {
        height: 50px;
        line-height: 49px;
        font-size: 12px;
    }
    .laberBox ol li>div {
        overflow: hidden;
    }
    .map_list ul li .city::after {
        display: none;
    }
    .map_list ul li .rows .icon {
        line-height: 30px;
    }
    .map_list ul li .rows .txt {
        padding: 5px 0px;
    }
    .map_list ul li .city {
        line-height: 40px;
    }
    .home-product ul li a .thum {
        margin-top: 0%;
        width: 100%;
        margin-left: 0%;
    }
    .headerRight {
        position: fixed;
        left: 0%;
        bottom: 2vh;
        width: 100%;
        z-index: 10;
        height: 50px;
        display: flex;
        justify-content: center;
        opacity: 0;
        visibility: hidden;
    }
    .headerRight.active {
        -webkit-transition: all .5s ease .5s;
        bottom: 7vh;
        opacity: 1;
        visibility: visible;
    }
    header.active .langung a,
    header.active .langung {
        color: rgba(255, 255, 255, .3);
    }
    header.active .langung a.active {
        color: rgba(255, 255, 255, .7);
    }
    .searchGroup {
        width: 94%;
        padding: 35px;
    }
    .searchContent {
        margin-top: 30px;
    }
    .boxes.search_boxes {
        background: #f9f9f9;
    }
    .news.n ul li a .text .name,
    .news.n ul li a .text .des {
        margin-bottom: 0px;
    }
    #page li {
        min-width: 33px;
        height: 33px;
        line-height: 31px;
    }
    .menu_btn {
        background-color: transparent;
    }
    header {
        background: transparent;
    }
    header .logo img:nth-child(1) {
        opacity: 1;
    }
    header .logo img:nth-child(2) {
        opacity: 0;
    }
    header.active {
        background: #1955a5;
    }
    header.active .menu_btn {
        background: #1955a5;
    }
    header nav ul li .list a:hover {
        color: #ffffff;
    }
    header.show {
        top: 0px;
    }
    .map_list ul li .info {
        width: 100%;
        flex-wrap: wrap;
    }
    .map_list ul li .rows {
        width: 100%;
    }
    .ptn {
        width: 50px;
        height: 50px;
        margin-left: -25px;
        margin-top: -25px;
        display: none;
    }
    .ptn span {
        width: 20px;
        height: 20px;
        background-size: 40px auto;
    }
    .ptn.active span {
        background-position: -20px 0;
    }
    .aboutVideo {
        position: relative;
        width: 100%;
    }
}