@font-face { font-family: 'SourceHanSansSC-Bold'; src: url('../font/SourceHanSansCN-Bold.woff2'); }
@font-face { font-family: 'SourceHanSansSC-Heavy'; src: url('../font/SourceHanSansCN-Heavy.woff2'); }
@font-face { font-family: 'SourceHanSansSC-Regular'; src: url('../font/SourceHanSansCN-Regular.woff2'); }
body { font-family: 'SourceHanSansCN-Regular', "Open Sans", sans-serif; color: #333; }


html, body {  transition: all 0s; }
::-webkit-scrollbar{width:0;height:0;}
body, html { font-size: 62.5%; }
body{ overflow:hidden; overflow-y:auto;}
input,
select,
textarea { font-family: 微软雅黑, "Open Sans", sans-serif; font-size: 1em; }

input[type="button"],
input[type="submit"],
input[type="reset"] { -webkit-appearance: none; }
.flex_center { display: flex; align-items: center; justify-content: center; }
textarea { -webkit-appearance: none; }
.wrap2 { z-index: 10 }
.wrap { z-index: 10; max-width: 75vw; width: 96%; margin: 0 auto; position: relative; }
a,
a:link { text-decoration: none; color: #000; }
a:hover, .on > a { color: #0072BB; }

.bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1 }
.bg div { position: fixed; top: 50%; left: 50%; width: 20vw; height: 20vw; border-radius: 100%; filter: blur(100px); transition: transform 5s linear; }
.bg div.div1 { background: #009eff; }
.bg div.div2 { width: 25vw; height: 25vw; top: 50%; left: 50%; background: #ffcb4d; }
.wrap { margin: 0 auto; width: 89.5833333333%; max-width: 1720px; }
.wrap3 { max-width: 1204px; margin: 0 auto }


.header { position: fixed; top: 0; left: 0; width: 100%; z-index: 102 }

.header .wrap { height: 70px; display: flex; align-items: center; }
.menu li { display: inline-block; font-size: 1vw; margin: 0 1.5vw }
.manu_wap { width: 70px; height: 70px; border-radius: 100%; background: #facc12; position: relative; margin-left: 1.5vw; cursor: pointer; margin-top: 20px; }
.manu_wap label { position: absolute; }
.manu_wap:after, .manu_wap:before { content: ''; display: block; position: absolute; width: 50%; height: 2px; background: #000; top: 50%; margin: 0 auto; left: 0; right: 0; }
.manu_wap:after { margin-top: 5px }
.manu_wap:before { margin-top: -5px }


.page { padding-top: 5vw }
.page .wrap { z-index: 1 }

.page_tit { margin-bottom: 4vw; }
.page_tit .tit { font-size: 3.7vw; font-family: Arial; text-transform: uppercase; font-weight: bold; display: inline-block;  }
.page_tit .tit.txt_rotate .t span { color: #fff; -webkit-text-stroke: 1px #000; color: transparent; }
.page_tit .tit.txt_rotate .t span:first-child { color: #333 }
.txt_rotate { position: relative; }
.text--clone, .text--origin { display: inline-block; overflow: hidden; perspective: 1000px; perspective-origin: -150% 50%; vertical-align: middle; width: 105%; }
.text--clone .letter, .text--origin .letter { display: inline-block; transform-origin: 0 0; will-change: transform; }

.letter_a { animation-name: letter }
.letter_a2 { animation-name: letter2 }

@keyframes letter {
    0% { transform: translateY(110%) rotateX(-90deg) }
    100% { transform: translate(0px, 0%) }
}

@keyframes letter2 {
    0% { transform: translate(0px, 0%) }
    100% { transform: translate(0px, -100%) rotateX(90deg) }
}

.text--origin { white-space: nowrap; }
.text--clone { white-space: nowrap; bottom: 0; color: #333; left: 0; position: absolute; right: 0; top: 0; }
.text--clone .letter { transform: translateY(110%) rotateX(-90deg); vertical-align: middle; }
.page_tit .p_text { font-size: 2.5vw; line-height: 1.2 }

/*.txt_rotate { overflow: hidden; }
.txt_rotate.on > * { transform: rotate(0) translateY(0) ;opacity:1;}
.txt_rotate > * { }*/

.service_items { border-radius: 2vw; overflow: hidden; position: relative; display: flex; height: 42.5vw; background: #2b47e1 }
.service_items .box { width: 90vw; position: relative; height: 100%; color: #fff; }
.service_items .box.on { flex: 1; }
.service_items .box { width: 6vw }
.service_items .box:nth-child(2).on .item { }
.service_items .box .item { width: 70vw; padding-right: 4vw; height: 100%; border-radius: 2vw; cursor: pointer; }
.service_items .box:nth-child(1) .item { background: #2b47e1 }
.service_items .box:nth-child(2) .item { background: #facc12; color: #000 }
.service_items .box:nth-child(3) .item { background: #2b47e1; }
.service_items .box:nth-child(4) .item { background: #009eff; }
.service_items .item { transition: all 0.5s; position: relative; }
.service_items .box:hover { width: 8vw }
.service_items .on.box:hover .num { width: 5vw }
.service_items .on.box:hover .icon { left: 7.6vw }
.service_items .box:hover .num { width: 8vw }
.service_items .box:hover .icon { width: 8vw }

.service_items .wrap { width: auto; max-width: initial; padding: 7.6vw }
.service_items h2 { font-size: 3vw; font-family: 'SourceHanSansCN-Bold'; margin-bottom: 1vw }
.service_items p { font-size: .87vw; max-width: 33.33vw; line-height: 2vw; margin-bottom: 2vw }
.service_items .a_btn { display: inline-block; width: 11vw; line-height: 2.75vw; border-radius: 2.75vw; font-size: 1vw; border: 2px solid #fff; text-align: center; }
.service_items .a_btn span { padding-left: 1.2vw; }
.a_btn span { display: inline-block; color: #fff; position: relative; }
.a_btn span:before { position: absolute; left: 0; width: 10px; height: 10px; border: 2px solid #fff; border-left: 0; border-bottom: 0; content: ''; top: 50%; margin-top: -5px }
.a_btn span:after { content: ''; display: block; position: absolute; width: 15px; height: 2px; background: #fff; transform: rotate(-45deg); top: 50%; left: 0; transform-origin: left center; margin-top: 6px; }
.service_items .box:nth-child(2) .a_btn { border-color: #000 }
.service_items .box:nth-child(2) .a_btn span { color: #000 }
.service_items .box:nth-child(2) .a_btn span:after { background: #000 }
.service_items .box:nth-child(2) .a_btn span:before { border-color: #000 }
.service_items .wrap { height: 27.5vw }
.service_items .icon { width: 5vw; height: 5vw; position: absolute; bottom: 4.37vw; background-repeat: no-repeat; background-position: center center }
.service_items .icon { left: 0 }
.service_items .on .icon { left: 7.6vw; }
.service_items .icon1 { background-image: url(../img/icon1-1.png); background-position: center center }
.service_items .icon2 { background-image: url(../img/icon2-1.png); background-position: center center }
.service_items .icon3 { background-image: url(../img/icon3-1.png); background-position: center center }
.service_items .icon4 { background-image: url(../img/icon4-1.png); background-position: center center }
@media only screen and (min-width: 750px) {

    .service_items .on .icon1 { background-image: url(../img/icon1.png); background-position: left center }
    .service_items .on .icon2 { background-image: url(../img/icon2.png); background-position: left center }
    .service_items .on .icon3 { background-image: url(../img/icon3.png); background-position: left center }
    .service_items .on .icon4 { background-image: url(../img/icon4.png); background-position: left center }
}
.service_items .card { width: 25vw; position: absolute; top: 50%; transform: translateY(-50%) scale(1.1); right: 2vw }
.service_items .card2 { width: 15.62vw; right: 10vw }
.service_items .card3 { width: 15.1vw; right: 5vw }
.service_items .card4 { width: 20.78vw; right: 5vw }
.service_items .num { position: absolute; width: 6vw; text-align: center; top: 2vw; font-size: 2.25vw; right: 0; margin: 0 }
.service_items .box.on .num:after { content: '.' }

.service_items .translateY { transform: translateY(50px); opacity: 0; visibility: hidden; transition: all 1s }
.service_items .box.on .translateY { transform: translateY(0px); opacity: 1; visibility: visible }
.service_items .box.on .translateY.card { transform: translateY(-50%) scale(1) }
.service_items h2.translateY { transform: translateY(80px); animation-delay: 1s }
.service_items a.a_btn { transform: translateY(-30px); animation-delay: 2s }


.tit_tag ul { display: flex; }
.tit_tag li { margin-right: 20px; }
.tit_tag li:last-child { margin-right: 0 }
.tit_tag a { display: block; padding: 0 1.5vw; line-height: 2.6vw; border-radius: 1.5vw; border: 1px solid #ccc; color: #222;font-weight:bold; font-size: 1.2vw }
.tit_tag li:hover a, .tit_tag li.on a { background: #000; color: #fff; border-color: #000 }
.case_list .img { cursor: none }
.cursor-pointer { height: 0; left: 20px; pointer-events: none; position: fixed; top: 20px; width: 0; will-change: transform; z-index: 99; transition: all 0s }
.cursor-pointer .po.on { width: 6.7vw; height: 6.7vw; }
.cursor-pointer .po { content: ''; width: 0; height: 0; background: url(../img/hover.png) no-repeat center center; background-size: 100% 100%; align-items: center; display: flex; justify-content: center; transform: translate3d(-50%,-50%); display: block; }

.case_list li { width: 50%; float: left; }

.case_list li:nth-child(2n+1) { clear: both; }
.case_list .img { border-radius: 20px; overflow: hidden; }
.case_list .img img { width: 100%; }
.case_list .h3 { font-size: 1.6vw; color: #111 }
.case_list { overflow: hidden; }
.case_list .text { padding: 1.3vw; line-height: 2; font-size: 16px; color: #444 }
.case_list .text h3, .case_list .text .h3 { font-family: 'SourceHanSansCN-Bold'; }
.case_list .box { margin: 3.17vw; margin-bottom: 0; display: block; }
.case_list ul { margin: -3.17vw }
.div_more { text-align: center; margin: 20px 0 }
.div_more a { width: 6.14vw; height: 6.14vw; display: flex; align-items: center; justify-content: center; border-radius: 100%; border: 1px solid #202020; margin: 0 auto; position: relative; }
.div_more a span { width: 10px; position: relative; }
.div_more a span:before { border-color: #000 }
.div_more a span:after { background: #000 }
.div_more a:hover { border-color: #2b47e1; background: #2b47e1; }
.div_more a:hover span:after { background: #fff }
.div_more a:hover span:before { border-color: #fff; }
.page { overflow: hidden; position: relative; }
/*.page1:after { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; background: #f9f9f9; }*/

.contact_box { border: 2px solid #fff; background: rgba(255,255,255,0.2); border-radius: 40px; }
.contact_box .tit { padding: 3vw; }
.contact_box .tit h3 { font-size: 1.8vw; line-height: 2; margin-bottom: 5px; }
.span_txt { display: inline-block; width: 3.6vw; height: 3.6vw; border-radius: 100%; background: #2b47e1; line-height: 3.6vw; text-align: center; color: #fff; font-family: 'SourceHanSansCN-Bold'; margin-right: 10px; }
.span_border { display: inline-block; padding: 0 20px; line-height: 3.5vw; margin-left: 10px; border-radius: 50%; border: 2px solid #000 }
.hover_line { padding-bottom: 2px; background-repeat: no-repeat; background-size: 100% 1px; background-image: linear-gradient(to right,#000 0,#000 100%); transition: background-size .55s cubic-bezier(.2,.75,.5,1); background-position: left 94%; cursor: pointer; }
.hover_line:not(:hover) { color: inherit; animation: nectar_ltr_line_animation_start .55s ease forwards; }
.hover_line:hover { background-position: right 94%; animation: nectar_ltr_line_animation .55s ease forwards }

@keyframes nectar_ltr_line_animation {
    0% { background-size: 100% 2px }
    100% { background-size: 0 2px }
}

@keyframes nectar_ltr_line_animation_start {
    0% { background-size: 0 2px }
    100% { background-size: 100% 2px }
}

.tit_rt_txt { display: flex; position: absolute; top: 3vw; right: 3vw }
.tit_rt_txt p { padding: 0 20px; font-size: 1.4vw; line-height: 4vw; background: #fff; border-radius: 4vw }
.tit_rt_txt a { display: flex; align-items: center; justify-content: center; width: 4vw; height: 4vw; border-radius: 100%; background: #facc12; margin-left: 20px; position: relative; }
.tit_rt_txt .a_btn span { transform: translateX(-10px) }
.tit_rt_txt .a_btn:hover { background: #ffd266 }
.tit_rt_txt .a_btn span:after { background-color: #000; width: 18px; margin-top: 7px; margin-left: 3px }
.tit_rt_txt .a_btn span:before { border-color: #000; width: 15px; height: 15px }

.logo_swiper { overflow: hidden; display: flex; white-space: nowrap }
.logo_swiper ul { flex-shrink: 0; white-space: nowrap; align-items: center; display: flex; }
.logo_swiper ul li { padding: 1.5vw 0; padding-right: 20px; flex-shrink: 0; display: block; float: left; vertical-align: middle; text-align: center; }
.logo_swiper ul li a { height: 7vw; display: flex; border: 1px solid #fff; background: rgba(255,255,255,0.2); border-radius: 20px; align-items: center; justify-content: center; padding: 0 3.5vw }
.logo_swiper ul li a img { max-height: 93px }

.text-wrapper { font-size: 12.5vw; text-align: center; color: #ccc; font-family: Arial; font-weight: bold; }
.text-wrapper .letter { opacity: 0; display: inline-block; min-width: 40px; text-align: center; }
.text-wrapper.on .letter { opacity: 1; animation: text-wrapper 1s ease-in; }

@keyframes text-wrapper {
    0% { transform: translate(0%, -1000px) }
    60% { transform: translate(0%, 0%) rotate(0deg) }
    70% { transform: translate(0%, -50%) rotate(5deg) }
    80% { transform: translate(0%, 0%) rotate(0deg) }
    90% { transform: translate(0%, -10%) rotate(10deg) }
    100% { transform: translate(0%, 0%) rotate(0deg) }
}

.contactus .box { border-radius: 10px; background: url(../img/bg1.png) no-repeat center center; margin-top: -3vw; z-index: 1; position: relative; padding: 4vw; display: flex; min-height: 23vw; box-sizing: border-box; position: relative; transform-origin: 50% 0; transform: rotateX(90deg);   transform-style: preserve-3d; background-size: 100% 100%; transition:all 0s}
.contactus .box.on{transition-delay:.1s; transform:rotateX(0)}
.contactus .box .logo { width: 30%; position: initial; top: auto; left: auto; right: auto; }
.contactus .box .text { color: #fff; font-size: 16px; flex: 1; }
.contactus .box .text .flex{ flex-direction:column;}
.contactus .box .text h3 { font-size: 1.5vw; margin-top: .5vw; margin-bottom: 2vw; font-family: 'SourceHanSansCN-Bold'; }
.contactus .box .text h3 a{color:#fff}
.contactus .box .ewm { width: 100px; margin-left: 24px; text-align: center; font-size: 14px; color: #fff; }
.contactus .box .ewm .img { width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background: #fff; margin-bottom: 15px; }
.circle { width: 7.6vw; height: 7.6vw; border-radius: 100%; position: absolute; margin: 0 auto; bottom: 0; margin-bottom: -3.9vw; left: 0; right: 0; cursor: pointer; }
.circle .t { margin: 0 auto; width: 7.6vw; height: 7.6vw; border-radius: 100%; background: #facc12 url(../img/txt.png) no-repeat center center; background-size: 85% auto; animation: scroll-rotate 7s cubic-bezier(.645,.045,.355,1) .75s infinite }

@keyframes scroll-rotate {
    0% { transform: rotate(0) }
    50% { transform: rotate(180deg) }
    100% { transform: rotate(360deg) }
}

.footer { padding: 2.5vw 0; text-align: center; font-size: 16px; color: #575757; background: #fff; }
.footer p { position: relative; z-index: 2 }
.page0 { padding: 0; height: 100vh; background: #f0f0f0; z-index: 101 }
.swiper1 .swiper-slide{ height:100vh;display:flex;align-items:center; justify-content:center;}
.slide_bg1 { background: rgb(37,76,230 ) }
.slide_bg2 { background: #ffca93 }
.slide_bg3 { background: #8db3f9 }
.swiper1 .video {width:100vw; height: 100vh; margin: 0 auto; font-size:0;display:flex;align-items:center;justify-content:center;position:relative;background:none}
.swiper1 .video:after{ content:'';position:absolute;width:100%;height:100%; top:0;left:0}
.video video{width: 100%;height:100%; mix-blend-mode: unset;object-fit: contain;}
video:focus {  outline:none !important;}
.swiper1 { text-align: center; }
.swiper1_t { position: absolute; top: 0%; height: 100vh; left: 0; width: 50%; text-align: center; font-size: 8vw; color: #fff; right: 0; margin: 0 auto; overflow: initial; }
.swiper1_t span { display: block; text-align: center; }
.swiper1_t .swiper-slide { display: flex; align-items: center; justify-content: center; }


.menu_box { position: fixed;  top: 50%;transform:translateY(-50%); left: 0; width: 100%;   z-index: 301; display:none;}
.menu_box .wrap { max-width: 1440px; height: 75vh; display: flex; align-items: center }
.menu_box .list { }
.menu_box .list li { font-size: 4vh; line-height: 12vh }
.menu_box .text ul { min-height: 65vh; display: flex; flex-direction: column; text-align: left; }
.cont_text ul li, .menu_box .text li { color: #575757; }
.menu_box .text li:not(:last-child) { flex: 1; }
.cont_text2 li p { }
.cont_text2 li p, .menu_box .text li p { font-size: 1vw }
.menu_box .text li p{ font-size:16px;margin-top:0}
.cont_text2 li h3, .menu_box .text li h3 { font-size: 2vw; color: #222; font-family: 'SourceHanSansCN-Bold'; }
.cont_text2 li h4, .menu_box .text li h4 { font-size: 1.5vw; color: #222; font-family: 'SourceHanSansCN-Bold'; }
.cont_text2 .ewms, .menu_box .ewms { display: inline-block; margin-right: 10px; color: #222; }
.cont_text2 .ewms img, .menu_box .ewms img { width: 115px; }
.menu_box .ewms img{width:115px;}
.cont_text2 .ewms p, .menu_box .ewms p { text-align: center; margin-top: 10px; }
.open .header { background: none; z-index: 104 }
.open .header .menu { display: none; }
.open .bg { z-index: 103; background: #fff; }
.menu_box.show { left: 0 }
.open .manu_wap:after { transform: rotate(45deg); margin-top: 0 }
.open .manu_wap:before { transform: rotate(-45deg); margin-top: 0 }


.menu_box_list a { display: flex; align-items: center; color: #000 }
.menu_box_list i { display: block; width: 4.6vw; height: 4.6vw; border-radius: 100%; background: #2b47e1 url(../img/icon5.png) no-repeat center center; transform: scale(0) }
.menu_box_list i.i_prev { width: 0; height: 0 }
.menu_box_list i.i_next { margin-left: 1vw }
.menu_box_list span { margin: 0 10px; position: relative; }
.menu_box_list span:after { content: ''; display: block; position: absolute; right: 0; width: 0%; height: 4px; background: #000; bottom: 2.8vh }
.menu_box_list .active span { font-family: 'SourceHanSansCN-Bold'; }
.menu_box_list li:hover span:after, .menu_box_list .active span:after { }
.menu_box_list li:hover .i_next, .menu_box_list .active .i_next { transform: scale(1) }
.menu_box_list .active span:after,
.menu_box_list li:hover span:after { width: 100%; }
.menu_box_list li:hover.active span:after { width: 0%; }
.menu_box_list li:hover .i_next { transform: scale(0) }
.menu_box_list li:hover .i_prev { transform: scale(1); width: 4.6vw; height: 4.6vw; }



.page_tit2 { padding: 5vh 0; min-height: 35vh; display: flex; align-items: center; }
.page_tit2 h2 .letter { font-size: 15vw; text-transform: uppercase; font-weight: bold; font-family: Arial; display: inline-block; overflow: hidden; color: #2b47e1; position: relative; }
.page_tit2 h2 .letter:after { content: ''; display: block; position: absolute; width: 100%; height: 100%; transform: rotate(45deg); background: #fff; transform-origin: center center }

.page_tit2 h2 .on { -webkit-text-stroke: 1px #000; color: transparent; }

.pagesize ul{ margin-top: 3vw; text-align: center; display: flex; justify-content: center; align-items: center; }
.pagesize li:first-child,.pagesize li:last-child,
.pagesize .prev, .pagesize .next {color:transparent; display: block; width: 6.25vw; height: 6.25vw; border-radius: 100%; background: url(../img/icon5.png) no-repeat center center #2b47e1 }
.pagesize li:first-child,.pagesize .prev { transform: rotate(180deg) }
.num { margin: 0 2vw; width: 20.8vw }
.pagesize  li,
.num label { width: 40px; display: block; text-align: center; font-size: 1.25vw; border-bottom: 1px solid #333; line-height: 1.5; margin: 0 auto; }
.num .count { border-bottom: 0; font-size: 2.5vw }
.num .cur { line-height: 3vw; }
.pagesize  li{border-bottom: 0;margin:0 20px;}
.pagesize  li a{display: block;width: 100%;height:100%;}
.pagesize  li.active { font-size: 2vw;color:#2b47e1;}
.pagesize li:first-child a,.pagesize li:last-child a{color:transparent;}
.inside-page-title { position: relative; z-index: 5; margin-top: 6.25rem; font-size: 11.7vw; }
.outline { --border-color: rgba(0,0,0,0.3); color: #fff; text-shadow: -1px -1px 0 var(--border-color),1px -1px 0 var(--border-color),-1px 1px 0 var(--border-color),1px 1px 0 var(--border-color); }
.outline { color: transparent; -webkit-text-stroke: 1px var(--border-color); text-shadow: none; }

@font-face { font-family: Poppins; src: url(pxiEyp8kv8JHgFVrJJbecmNE.woff2) format("woff2"); }

.main-title * { box-sizing: border-box; }
.main-title { --stroke-color: #fb7956; font-size: 15vw; font-weight: 700; line-height: 1em; text-transform: uppercase; white-space: nowrap; }
.show-for-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; -webkit-clip-path: inset(50%); clip-path: inset(50%); border: 0; }
.page-about-title { display: inline-block; }
.page-about-title .icon { width: 19.8vw; position: absolute; bottom: -10%; left: 63%; z-index: 10; animation: m 1.5s infinite; transform-origin: center center }
@keyframes m {
    0% { transform:translateY(5px) ;}
    50% { transform:translateY(15px)}
    100% { transform: translateY(5px)}

}

.letter { fill: none; stroke: currentColor; stroke-width: 60px; stroke-dasharray: var(--len1); stroke-dashoffset: var(--path1) }
.letter__wrapper { position: relative; font-family: Poppins; }
.letter__svg { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; --len1: 630; --len2: 630; --len3: 630; position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; color: #fb7956; color: var(--stroke-color,#fb7956); }
svg * { transition: all 0.5s }
.path1 { stroke-dasharray: var(--len1); stroke-dashoffset: var(--path1) }
.path2 { stroke-dasharray: var(--len2); stroke-dashoffset: var(--path2) }
.path3 { stroke-dasharray: var(--len3); stroke-dashoffset: var(--path3) }
.letter--0 { --len1: 395 }
.letter--1 { --len1: 201 }
.letter--2 { --len1: 373 }
.letter--3 { --len1: 412 }
.letter--4 { --len1: 264; --len2: 178 }
.letter--5 { --len1: 340; --len2: 77 }
.letter--6 { --len1: 462 }
.letter--7 { --len1: 285 }
.letter--8 { --len1: 505 }
.letter--9 { --len1: 599 }
.letter--a { --len1: 380; --len2: 70 }
.letter--b { --len1: 170; --len2: 359 }
.letter--c { --len1: 373 }
.letter--d { --len1: 170; --len2: 263 }
.letter--e { --len1: 237; --len2: 64; --len3: 56 }
.letter--f { --len1: 169; --len2: 70; --len3: 53 }
.letter--g { --len1: 470 }
.letter--h { --len1: 169; --len2: 67; --len3: 169 }
.letter--i { --len1: 170 }
.letter--j { --len1: 238 }
.letter--k { --len1: 169; --len2: 255 }
.letter--l { --len1: 227 }
.letter--m { --len1: 172; --len2: 506 }
.letter--n { --len1: 168; --len2: 370 }
.letter--o { --len1: 430 }
.letter--p { --len1: 172; --len2: 180 }
.letter--q { --len1: 430; --len2: 72 }
.letter--r { --len1: 172; --len2: 181; --len3: 103 }
.letter--s { --len1: 367 }
.letter--t { --len1: 130; --len2: 141 }
.letter--u { --len1: 366 }
.letter--v { --len1: 359 }
.letter--w { --len1: 638 }
.letter--x { --len1: 254; --len2: 254 }
.letter--y { --len1: 171; --len2: 207 }
.letter--z { --len1: 350 }
.letter--sign-dash { --len1: 106 }
.letter--sign-exclamation { --len1: 115; --len2: 48 }
.letter--sign-question { --len1: 223; --len2: 48 }
.letter--sign-and { --len1: 251; --len2: 320 }
.svg-char { }
.letter__wrapper.on .svg-char { animation: path .5s linear }

@keyframes path {
    0% { --path1: var(--len1); --path2: var(--len2); --path3: var(--len3) }
    100% { --path1: 0; --path2: 0; --path3: 0 }
}

.outline { --border-color: rgba(0,0,0,0.3); color: #fff; text-shadow: -1px -1px 0 var(--border-color),1px -1px 0 var(--border-color),-1px 1px 0 var(--border-color),1px 1px 0 var(--border-color) }
.outline { color: transparent; -webkit-text-stroke: 1px var(--border-color); text-shadow: none }

.outline.white { --border-color: #fefefe }
.outline.white .letter__svg { color: #fefefe }
.main-title.transparent, .main-title.transparent span { --border-color: transparent !important }
.inside-page-title { position: relative; z-index: 5; font-size: 15vw; line-height: 1.2em; overflow: hidden; margin-top: 0 }

.page_title h3 { font-size: 15vw; line-height: 1.2em; text-transform:uppercase;font-weight:bold;}


.cont_text { }
.main_page2 .page { padding: 4vw 0 }
.cont_text { width: 52vw; font-size: 1vw; line-height: 2; margin-left: 25vw; font-family: 'SourceHanSansCN-Bold'; }
/*.page.on { background: #f9f9f9 }*/
.page3 { border-radius: 2vw 2vw 0 0 }
.page_tit3 h4 { font-size: 1.8vw; margin-bottom: .8em }
.page_tit3 h2 { font-size: 2.5vw; font-family: 'SourceHanSansCN-Bold'; }
.page_tit3 { color: #000 }
.page3_list ul { display: flex; flex-wrap: wrap; margin: 0 -1.8vw; margin-top: 2vw }
.page3_list li { flex: 0 0 33%; }
.page3_list .box { margin: 1.8vw; border: 1px solid #fff; background: rgba(255,255,255,0.2); border-radius: 10px; text-align: center; padding: 2vw; font-size: 14px; line-height: 24px; color: #575757 }
.page3_list .box h3 { font-size: 1.3vw; font-family: 'SourceHanSansCN-Bold'; margin-bottom: .5em; color: #000 }
.page3_list .box .icon { height: 3.6vw; background-position: center center; background-repeat: no-repeat; background-size: auto 100%; margin-bottom: 20px }
.page3_list .box .icon1 { background-image: url(../img/icon6.png); }
.page3_list .box .icon2 { background-image: url(../img/icon7.png); }
.page3_list .box .icon3 { background-image: url(../img/icon8.png); }
.page3_list .box .icon4 { background-image: url(../img/icon9.png); }
.page3_list .box .icon5 { background-image: url(../img/icon10.png); }
.page3_list .box .icon6 { background-image: url(../img/icon11.png); }
.page_title { display: inline-block }
.page_title .rt { bottom: auto; left: 100%; right: auto; top: 50%; transform: translateY(-50%); position: absolute; }
.page_title .rt .circle { position: initial; margin: 0; }
.page_title .rt .circle:after { transform: translateX(-50%) translateY(-50%) rotate(0deg); }
.circle:after { content: ''; display: block; width: 25px; height: 23px; background: url(../img/icon12.png) no-repeat bottom center; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%) rotate(180deg); }
.page_title .circle:after { }
.page_title { position: relative; }
.cont_text2 li { margin-bottom: 3vh }
.cont_text2 li h3 { font-size: 20px; font-family: 'SourceHanSansCN-Bold'; }
.cont_text2 li p { margin-bottom: 1vh; color: #999999; }
.cont_text2 li .ewms p { color: #222 }
.cont_form { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); width: 25.2vw; background: #fff; margin-top: 4vw; border-radius: 20px; box-shadow: 0 0 20px rgba(0,0,0,0.25); padding: 3vw; box-sizing: border-box; }
.cont_form .div_input { margin-bottom: 2.5vh; }
.div_input { line-height: 3vw; position: relative; border-bottom: 2px solid #e8e8e8; }
.div_input:after { content: ''; display: block; position: absolute; bottom: -2px; width: 0%; height: 2px; background: #000 }
.div_input.on:after { width: 100% }
.div_input input { font-size: 16px; width: 100%; background: none; border: 0 }
.cont_form .div_btn a { display: block; line-height: 3.12vw; text-align: center; background: #2b47e1; color: #fff; border-radius: 10px; font-size: 18px; }
.main_page3 .page { padding: 5vh 0 }
.page_title2 .inside-page-title { padding-top: 10vh }
.page_title2 { margin:0 auto; }
.page_title2 .text h3 { font-size: 2.5vw; font-family: 'SourceHanSansCN-Bold'; }
.page_title2 .text .flex { margin-bottom: 1.5vw ;align-items:center;}
.page_title2 .text .text_swiper { font-size: 2.5vw; padding-left: 1vw; margin-left: 1vw; border-left: 1px solid #000 }
.page_title2 .txt p { font-size: 18px; line-height: 2; }
.page_title2 .icon2 { left: 55%; top: 0 ;bottom:auto;}
.swiper_txt { height: 1.5em; line-height: 1.5 }
.text_swiper { display: flex; align-items: center; height: 1em }
.flex_bet { display: flex; justify-content: space-between; align-items: center; }
.page_title3 h5 { font-size: 28px; margin-bottom: 1.5em ;font-weight:bold;}
.page_title3 .line { display: block; width: 1px; height: 30px; background: #000; margin-top: 3vh; margin-bottom: 1vh }
.page_title3 h3 { font-size: 2.5vw; font-family: 'SourceHanSansCN-Bold'; color: #222 }
.page_title3 p { margin-top: 2vh; margin-bottom: 1vh; font-size: 18px; color: #575757 }
.page_title3 .num { width: inherit }
.page4_list { margin-top: 5vh; }
.page4_list ul { display: flex; }
.page4_list li { flex: 1 }
.page4_list .box { font-size: 18px; font-family: 'SourceHanSansCN-Bold'; padding: 2vw; border: 1px solid #fff; background: rgba(255,255,255,0.2); cursor: pointer; }
.page4_list .box .tit { margin-bottom: 7vh; display: flex; justify-content: space-between; align-items: center; }
.page4_list .box span { font-size: 32px; color: #222 }
.page4_list .box .icon { display: block; width: 52px; height: 52px; border-radius: 100%; background-position: center center; background-repeat: no-repeat; background-color: #2c48e1 }
.page4_list .box p { color: #222 }
.page4_list .box .icon1 { background-image: url(../img/icon14.png); }
.page4_list .box .icon2 { background-image: url(../img/icon15.png); }
.page4_list .box .icon3 { background-image: url(../img/icon16.png); }
.page4_list .box .icon4 { background-image: url(../img/icon17.png); }
.page4_list li.on .box  { background: #2b47e1; border-color: #2b47e1 }
.page4_list li.on .box p, .page4_list li.on .box span { color: #fff }
.page4_list li.on .box .icon { background-color: #fff }
.page4_list li.on .box .icon1 { background-image: url(../img/icon14-1.png); }
.page4_list li.on .box .icon2 { background-image: url(../img/icon15-1.png); }
.page4_list li.on .box .icon3 { background-image: url(../img/icon16-1.png); }
.page4_list li.on .box .icon4 { background-image: url(../img/icon17-1.png); }
/*.page.on1 { background: #f5f5f5 }*/

.page_ring_list ul { height: 40vh; position: relative; }
 
.page_ring_list ul li { z-index: 2; position: absolute; display: flex; align-items: center; justify-content: center; width: 10vw; height: 10vw }
.page_ring_list .box { position: relative; z-index: 10; font-size: 18px; color: #000 }
.page_ring_list .box span { display: inline-block; padding-top: 50px; }
.page_ring_list ul li:nth-child(1) { left: 0%; top: 0 }
.page_ring_list ul li:nth-child(2) { left: 14%; top: 50% }
.page_ring_list ul li:nth-child(3) { left: 28%; top: 0% }
.page_ring_list ul li:nth-child(4) { left: 39%; top: 50% }
.page_ring_list ul li:nth-child(5) { left: 54%; top: 0 }
.page_ring_list ul li:nth-child(6) { left: 68%; top: 50% }
.page_ring_list ul li:nth-child(7) { left: 85%; top: 0 }
.page_ring_list .circle-1 { border: 1px solid #000; border-radius: 50%; height: 100%; left: 10px; position: absolute; top: 0; width: 100%; }
.page_ring_list .circle-1 .dot-wrapper { display: flex; justify-content: flex-end; align-items: center; }
.page_ring_list .circle-1 .dot-wrapper, .page_ring_list .circle-2 { bottom: 0; left: 0; position: absolute; right: 0; top: 0; }
.page_ring_list .circle-2 { align-items: center; background-color: #facc12; border-radius: 50%; display: flex; justify-content: center; }
.circle-1 .dot { background-color: #000; border-radius: 50%; height: 8px; width: 8px; }
.page_ring_list ul li .dot { margin-right: -5px; }
.page_ring_list ul li:first-child .dot-wrapper { transform: rotate(10deg); }
.page_ring_list ul li:nth-child(2) .dot-wrapper { transform: rotate(345deg); }
.page_ring_list ul li:nth-child(3) .dot-wrapper { transform: rotate(-20deg); }
.page_ring_list ul li:nth-child(4) .dot-wrapper { transform: rotate(22deg); }
.page_ring_list ul li:nth-child(5) .dot-wrapper { transform: rotate(42deg); }
.page_ring_list ul li:nth-child(6) .dot-wrapper { transform: rotate(3deg); }
.page_ring_list ul li:nth-child(7) .dot-wrapper { transform: rotate(-17deg); }

.page_ring_list ul li:hover:first-child .dot-wrapper { transform: rotate(30deg); }
.page_ring_list ul li:hover:nth-child(2) .dot-wrapper { transform: rotate(325deg); }
.page_ring_list ul li:hover:nth-child(3) .dot-wrapper { transform: rotate(-40deg); }
.page_ring_list ul li:hover:nth-child(4) .dot-wrapper { transform: rotate(52deg); }
.page_ring_list ul li:hover:nth-child(5) .dot-wrapper { transform: rotate(62deg); }
.page_ring_list ul li:hover:nth-child(6) .dot-wrapper { transform: rotate(30deg); }
.page_ring_list ul li:hover:nth-child(7) .dot-wrapper { transform: rotate(-27deg); }
 
.page_ring_list li:hover .circle-2{ transform:scale(.95)}
.page_ring_list .icon { display: block; padding-top: 50px; background-position: top center; background-repeat: no-repeat; }
.page_ring_list .icon1 { background-image: url(../img/icon18.png); }
.page_ring_list .icon2 { background-image: url(../img/icon19.png); }
.page_ring_list .icon3 { background-image: url(../img/icon20.png); }
.page_ring_list .icon4 { background-image: url(../img/icon21.png); }
.page_ring_list .icon5 { background-image: url(../img/icon22.png); }
.page_ring_list .icon6 { background-image: url(../img/icon23.png); }
.page_ring_list .icon7 { background-image: url(../img/icon24.png); }
.page_ring_list ul li:hover .circle-2 { background: #2b47e1 }
.page_ring_list ul li:hover .dot { background: #facc12 }
.page_ring_list ul li:hover span { color: #fff }
.page_ring_list li:hover .icon1 { background-image: url(../img/icon18-1.png); }
.page_ring_list li:hover .icon2 { background-image: url(../img/icon19-1.png); }
.page_ring_list li:hover .icon3 { background-image: url(../img/icon20-1.png); }
.page_ring_list li:hover .icon4 { background-image: url(../img/icon21-1.png); }
.page_ring_list li:hover .icon5 { background-image: url(../img/icon22-1.png); }
.page_ring_list li:hover .icon6 { background-image: url(../img/icon23-1.png); }
.page_ring_list li:hover .icon7 { background-image: url(../img/icon24-1.png); }
.main_page4 { margin-top: 76px; }
.main_page4 .page { padding: 5vh 0 }
.a_back { display: inline-block; padding-left: 30px; font-size: 14px; background: url(../img/icon25.png) no-repeat left center }

.wrap2 { max-width: 1366px;   margin: 0 auto; position: relative; }
.page5_tit { padding: 3vw 0; display: flex; align-items: center; justify-content: space-between }
.page5_tit h2 { font-size: 52px; text-transform:uppercase;}
.page5_tit .tag li { display: inline-block; line-height: 2.5vw; padding: 0 1.5vw; border-radius: 2.5vw; border: 1px solid #e8e8e8; color: #575757; margin-left: 1vw }
.page5_tit .tag li a { color: #575757; font-size: 14px; }

.page5_det { display: flex; font-size: 14px; }
.page5_det .link { width: 70px; height: 70px; border-radius: 100%; background: #ccc url(../img/icon26.png) no-repeat center center; margin-right: 20px; }
.page5_det .text { flex: 1; }
.page5_det .text h3 { line-height: 70px; font-size: 14px; color: #222; display: flex; align-items: center; }
.page5_det .text h3:after { content: ''; display: inline-block; width: 20px; background: #000; height: 1px; margin-left: 10px; }
.page5_det .text p { max-width: 600px; line-height: 28px; font-size: 14px; }
.page5_det .date { font-size: 16px; line-height: 22px; display:none}

.page_det .item { padding: 100px 0; z-index: 10; position: relative; background-position:center center;background-size:cover}
.page_det .item .txt { position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0;display:flex; align-items:center; justify-content:center; text-align: center; font-size: 16vw; text-align: center; font-family: 'SourceHanSansCN-Bold'; -webkit-text-stroke: 1px rgba(255,255,255,0.2) ;white-space:nowrap}

.page_det .item_bg1 { background: #000 }
.page_det .item_bg1 .img{ border-radius:18px;max-width:1200px;margin:0 auto;}
.center { text-align: center; }
.page_det { background: #fff; z-index: 10; position: relative; }
.item_det .h3_tit { font-size: 1vw; margin-bottom: 1.2vw; }
.font_list li { flex: 1; margin-left: 2vw; background: #f5f5f5; padding: 2vw; }
.font_list li:first-child { margin-left: 0; }
.font_list .tit { font-size: 1.667vw; line-height: 1.5 }
.font_list .font { font-size: 7.3vw; }
.font_list .outline { -webkit-text-stroke: 1px #000; font-family: 'SourceHanSansCN-Bold'; }
.font_list .flex_bet { align-items: flex-end }
.font_list p { color: #999 }
.font_list { margin-bottom: 4vw }
.color_list { padding: 2vw 0; margin-bottom: 4vw; display: flex; border-top: 1px solid #e8e8e8 }
.color_list li:not(:last-child) { flex: 1; }
.color_list li { font-size: 16px; line-height: 1.5; display: flex; align-items: center; }
.color_list .color { width: 5.6vw; height: 5.6vw; border-radius: 100%; margin-right: 1vw }

.page_det .item_pad0 { padding: 0 ;background-position:center center;background-repeat:no-repeat; background-attachment:fixed;background-size:100% auto}
.page_det .item_pad0 img{ opacity:0}
.item_imgs .img { margin-top: 80px; border: 2px solid #000; border-radius: 20px; overflow: hidden; }
.item_imgs .img1{ border:0;max-width:1200px;margin:0 auto;border-radius:15px;margin-top:80px;}
.item_imgs .img:first-child { margin-top: 0 }
.item_img_bg { background-position: center center; background-size: cover; background-attachment: fixed; }
.item_img_bg .img { border-color: #fff; }
.page_det .item_imgs { padding: 100px 0 }
.page_det .item_img_bg { padding: 7.8vw 0 }
.det_cur .flex1 { border: 1px solid #000 }
.det_cur .flex1:first-child { border-left: 0; }
.det_cur .flex1:last-child { border-right: 0 }
.det_cur .wrap { border: 1px solid #000; border-left: 0; border-right: 0 }
.det_cur a { display: block; padding: 3.6vw 0; }
.det_cur p { font-size: 16px; margin-bottom: 1vw }
.det_cur h3 { font-size: 1.87vw; }
.det_cur .next a { text-align: right; }
.contactus { margin-bottom: 4.5vw; }

.overlay-menu-toggle { position: absolute; right: 40px; top: 40px; height: 45px; width: 45px; line-height: 45px; text-align: center; font-size: 29px; z-index: 9911; }
.overlay-menu-toggle { position: fixed; display: flex; width: max-content !important; height: max-content; align-items: center; justify-content: center; flex-direction: column; top: 20px; right: 30px !important; z-index: 300; text-align: center; text-transform: uppercase; }
.sfm-navicon-button { cursor: pointer; position: relative; border-radius: 40px; background-color: #f3f3f3; width: 130px; height: 60px; transition: all .3s ease; z-index: 3 }
.sfm-navicon-button:before { content: 'menu'; position: absolute; display: flex; width: 100%; height: 100%; left: -8%; align-items: center; justify-content: center; font-size: 14px !important; color: #000; font-weight: 600; opacity: 0; font-family: neue-haas-grotesk-text,sans-serif; transition: .3s;display:none; }
.sfm-navicon { position: absolute; top: 50%; left: 0; width: 15%; max-width: 30px; -webkit-transition: .3s cubic-bezier(.17, .67, .3, 1.33); transition: all .3s cubic-bezier(.17, .67, .3, 1.33); -webkit-backface-visibility: hidden; backface-visibility: hidden; margin: -1px 20%; height: 2px !important; }
.sfm-navicon:after, .sfm-navicon:before { display: block; content: ""; width: 100%; height: 2px; position: absolute; left: 0; background-color: #000; transition: .25s; }
.sfm-navicon:before { top: 4px; }
.sfm-navicon:after { top: -4px; }
.menu-hand { position: absolute; top: 50%; right: 5px; width: 50px; height: 50px; background: #2b47e1; border-radius: 100%; overflow: hidden; transform: translateY(-50%) translateZ(0); z-index: 3 }
.logo { position: fixed; top:38px; left: 30px; z-index: 13000 }
.logo.on{z-index:303}
.logo svg { width: 148px; }
.logo svg *{ transition:all 0.1s}
.logo.fff .cls-1 g { fill: #fff }
.menu-hand img { width: 100%; height: 100%; transform-origin: right bottom; animation: 2s ease-in-out infinite handmove; }

@keyframes handmove {
    0% { transform: rotate(0) }
    12% { transform: rotate(17deg) }
    25% { transform: rotate(0) }
    37% { transform: rotate(17deg) }
    50% { transform: rotate(0) }
    100% { transform: rotate(0) }
}

.sfm-navicon-button:hover {/* width: 200px !important; */}
.sfm-navicon-button:hover:before { opacity: 1; transition-delay: .3s; }
.sfm-navicon-button:hover .sfm-navicon {/* width: 11%; left: -8%;*/ }
.overlay-menu-toggle.focus { z-index: 301 }
.overlay-menu-toggle.focus .sfm-navicon-button { width: 70px !important; z-index: 302; }
.overlay-menu-toggle.focus .sfm-navicon-button:before { display: none }
.overlay-menu-toggle.focus .sfm-navicon { width: 40% !important; left: -2px !important; right: 0; margin: 0 auto }
.overlay-menu-toggle.focus .sfm-navicon:before { top: 0; -webkit-transform: rotate(-45deg) !important; transform: rotate(-45deg) !important }
.overlay-menu-toggle.focus .sfm-navicon:after { top: 0; -webkit-transform: rotate(45deg) !important; transform: rotate(45deg) !important }
.overlay-menu-toggle.focus .menu-hand { transform: scale(0); transition: .3s }


.overlay-menu-toggle .lbl_bg { position: absolute; width: 0; height: 0; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background: #f3f3f3; z-index: 1; border-radius: 100%; }
.overlay-menu-toggle.focus .lbl_bg { width: 300vw; height: 300vw; transition: all 1s ;}


.swiper1 .span_text { font-size: 8vw;font-weight:bold; color: #fff; position: absolute; top: 50%; left: 0; right: 0; text-align: center; line-height: 20vw; margin-top: -10vw; text-transform: uppercase; }
.h3_tit span, .span_text span { transform: rotateY(-90deg); opacity: 0; transition: all 0.5s; color: #000; font-family: Arial; }
.swiper1 .span_text span { color: #fff; }
.cont_text2{ max-width:345px;margin-right:4vw;}
.cont_text2 .li_icon1 { padding-left: 55px; background: url(../img/icon27.png) no-repeat left center }
.cont_text2 .li_icon2 { padding-left: 55px; background: url(../img/icon28.png) no-repeat left center }
.cont_text2 .li_icon3 { padding-left: 55px; background: url(../img/icon29.png) no-repeat left center }
.cont_text2 li{border-bottom:1px solid rgba(0,0,0,0.1);padding:30px 0;margin:0}
.cont_text2 li h3, .cont_text2 li p{ font-size: 16px; }
.cont_text2 li:last-child { border-bottom: 0;min-width:300px }
.cont_text2 .ewms{ margin-top:10px;}
.cont_text2 .ewms p { font-size: 14px; color: #222 }
.cont_text2 .ewms .img{width:114px;padding:2px 5px;background:#fff;}
.cont_text2 .ewms .img img{width:100%;}

.message{width:684px;}
.message ul{display:flex; flex-wrap:wrap;justify-content:space-between}
.message li{ flex:0 0 48%; margin-bottom:20px;}
.message li:first-child{ margin-left:0}
.message li:last-child { flex: 1; margin-left:0}
.message p{font-size:16px;color:#222;line-height:2.5}
.message .div_input {padding:0 15px; min-height: 50px; line-height: 50px; border: 1px solid #b3b4b9 }
.message .div_input.on{ border-color:#000}
.message .div_input:after { display: none }
.div_input textarea{width:100%; border:0; background:0;padding:5px 0;resize:none; height:100px;line-height:30px;font-size:16px;}
.input_btn a { display: block; width: 200px; line-height: 48px; border-radius: 48px; background: #2b47e1 ;color:#fff; font-size:16px;text-align:center;}
.input_btn a:hover{ width:230px;}
.input_btn{margin-top:20px;}


.loading.on{   }
.loading .box{width:50vw; height:50vw; border-radius:100%; background:#fff;}
.loading.on .box{ transform:scale(0)}
@keyframes a {

}
.loading svg { position: absolute; }
.loading {transition:all 0s;  position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #2b47e1; display: flex; align-items: center; justify-content: center; z-index: 13001 }
.preloader .box { display: flex; position: relative; filter: url('#gooey'); display: flex; justify-content: center; align-items: center; }
.preloader .drop { position: absolute; background: #2b47e1; width: 22px; height: 22px; border-radius: 60% 70% 50% 60% / 65% 66% 60% 65%; animation: 6s move ease infinite; }
.preloader .drop:after { width: 17px; height: 17px; content: ''; position: absolute; background: #2b47e1; border-radius: 50% 60% 60% 70% / 60% 65% 65% 65%; left: 25px; top: 3px; animation: 6s drop_effect ease infinite; }
body { height: 100vh;   }
body.on { overflow-y: auto; }

@keyframes move {
    0%, 100% { transform: translate(280px); }

    50% { transform: translate(-280px); }
}

@keyframes drop_effect {
    0% { left: 0px; }
    5% { left: 35px; }
    45% { left: 0px; }
    50% { left: 0px; }
    55% { left: -30px; }
    95% { left: 0px; }
    100% { left: 0; }
}
.preloader svg{position:absolute;}
.preloader { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 1001; display: flex; overflow: hidden; width: 100%; height: 100%; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background-color: #2a27ef; }
.load-circle.on1{ transform:scale(0)}
.load-circle.on1.blue{transform:scale(1)}
.load-circle { position: absolute; display: block; width: 0; height: 0; border-radius: 100%; background-color: #fff; }
.load-circle.blue { z-index: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; width: 160vw; height: 160vw; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; border: 4px solid #66c7d8; background-color: #2a27ef; transform:scale(0) }
.logo-revealer { position: relative; z-index: 3; width: 200px; height: auto; max-width: 200px; }
.load-circle.txt, .load-circle.white { z-index: 4; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; width: 50vw; height: 50vw; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.load-circle.white.on{width:150vw; height:150vw;}
.load-circle.white { width: 50vw; height: 50vw; }
.load-circle.txt { z-index: 5 }
.load-circle.on { transform: scale(1) }
.static-logo { width: 200px; height: auto; max-width: 200px; min-width: 200px; }

.Sheep{ transition:all 0s}


#container { /* Center the text in the viewport. */ position: absolute; margin: auto;  top: 0; bottom: 0; filter: url(#threshold) blur(0.6px); }

/* Your average text styling */
#text1, #text2 { position: absolute;  display: inline-block;   font-size: 25px;font-weight:bold; text-align: center; user-select: none; }

.logo img{width:143px;}
.fixed .logo .cls-1 g { fill: #000 }

.body{ transition:all 0s}

.bold { font-weight: bold; }

.tit_flex { display: flex; justify-content: space-between;justify-content:center; align-items: center; }
.tit_flex span { color: #fff; display:none}

.res_list { padding-top: 20px; display: flex; justify-content: space-between; line-height: 1.8; color: #999 }
.res_list li img { margin-bottom: 15px; }
.res_list h3 { font-size: 24px; font-weight: bold; color: #222; margin-bottom: 5px; }
.res_list .text { max-width: 205px; width: 90%; margin: 0 auto; }


.item_wap_list ul { max-width: 1000px; margin: 0 auto; }
.item_wap_list li { width: 50%; float: left; text-align: center; margin-bottom: 80px; }
.page_det .item { position: relative; overflow: hidden; }
.wap_list { display: flex; max-width: 1370px; margin: 0 auto; }
.wap_list li { flex: 1; position: relative; }
.wap_list .img { width: 300px; margin: 0 auto; border-radius: 18px; }
.wap_list { position: relative; }
.wap_list:after, .wap_list li:after { position: absolute; left: 0; width: 1px; height: 1000vh; background: #fff; top: 50%; margin-top: -500vh; content: ''; opacity: .2 }
.wap_list:after { right: 0; left: auto; }
.item_imgs2 { margin-top: 80px; }
.item_imgs2 .wrap { max-width: 1370px; }
.item_imgs2 .img { width: 33.33%; float: left; margin-bottom: 80px; }
.item_imgs2 .img:nth-child(3n+2) { margin-top: -80px }
.item_imgs2 .img:nth-child(3n+1){clear:both;}
.item_imgs2 .img img { display: block; margin: 0 auto; }

.item .logos { position: absolute; top: 80px; left: 0; right: 0; text-align: center; }
.item .logos img { opacity: 1; }
.swiper-pagination-bullet-active { background: #000; width: 30px; border-radius: 8px; }
@media only screen and (max-width: 750px){
    .load-circle.blue{width:200vh; height:200vh}
    .load-circle.txt, .load-circle.white { width: 90vw; height: 90vw; }
    .overlay-menu-toggle { top: 10px; right: 10px !important; height: 50px; }
    .logo{width:50%; top:15px;right:10px;line-height:50px;z-index:103;}
    .menu-hand{width:40px; height:40px;}
    .sfm-navicon-button{width:100px;}
    .overlay-menu-toggle.focus .lbl_bg{width:300vh;height:300vh}
    .menu_box .text{ display:none;}
    .menu_box_list{width:100%;}
    .menu_box_list i{width:50px; height:50px;}
    .menu_box_list li:hover .i_prev{width:50px; height:50px;}
    .swiper1 .swiper-slide, .page0 { height: 100vh }
    .swiper1 .video{ height:50vh;width:50vh;}
    .swiper1 .span_text{ font-size:16vw;top:auto; bottom:10%;}
    
    .logo svg{width:120px;}
    .header .logo{ margin-left:-10px;}
    .page_tit .tit { font-size: 10vw }
    .page_tit .p_text{ font-size:7vw}
    .service_items{ height:auto; flex-direction:column;}
    .service_items .card{ position:initial;width:40%; top:auto; left:auto; right:auto; bottom:auto; transform:none; display:flex; float:right; }
    .service_items .card img{max-width:100%; max-height:80%;} 
    .service_items h2 { font-size: 6vw; margin-bottom: 10px; }
    .service_items p{ font-size:16px;max-width:initial;line-height:1.8;margin-top:20px;margin-bottom:50px}
    .service_items .box.on .item{ padding:50px 0;box-sizing:border-box;}
    .service_items .box.on h2.translateY { margin-left: 0 }
    .service_items .box { height: 70px; width: 100%; }
    .service_items .box .item{width:100%;height:120%;padding:0}
    .service_items .wrap{ height:auto;padding:20px;}
    .service_items .box.on .translateY.card{ transform:scale(1); }
    .service_items .a_btn{width:auto;line-height:35px;border-radius:35px; padding:0 20px;}
    .service_items .a_btn span{padding-left:20px;font-size:16px;}
    .service_items .on.box:hover .num, .service_items .num { font-size: 18px; width: 50px; text-align: center; line-height: 60px; top: 0 }
    .service_items h2.translateY{ transform:translateY(0);opacity:1;visibility:visible;margin-left:40px;}
    .service_items .box { animation-name: fadeInUp !important}
    .service_items .box:hover .icon, .service_items .icon { width: 60px; height: 70px; bottom: 0 }
    .service_items .on .icon{ left:0;top:0}
    .service_items .box:hover{width:100%;}
    .service_items .box.on{ flex:auto;;height:400px;;}
    .service_items .on.box:hover .icon{left:0}
    .flex_center{ flex-direction:column;justify-content:flex-start}
    .flex_center .flex1{width:100%;}
    .tit_tag a{ padding:0 10px; font-size:16px;line-height:1.5;border:0}
    .tit_tag li{margin:0 1px;}
    .logo_swiper ul li a { height: 50px; }
    .logo_swiper ul li a img { max-height: 50px; }
    .tit_tag ul { white-space: nowrap; margin-top: 20px; overflow: hidden; overflow-x: auto; }
    .case_list li{width:100%;}
    .case_list .h3{ font-size:6vw}
    .case_list .text{ line-height:1.5;padding:15px 0 25px}
    .div_more a{width:60px; height:60px;}
    .contact_box .tit h3{ font-size:5vw}
    .tit_rt_txt{ position:initial;top:auto; right:auto;margin-top:15px;}
    .tit_rt_txt p{ padding-left:0;font-size:16px;line-height:50px;}
    .span_txt{width:30px; height:30px;line-height:30px;}
    .tit_rt_txt a { width: 50px; height: 50px; }
    .span_border{ line-height:35px;} 
    .text-wrapper .letter{ min-width:8vw;}
    .logo_swiper ul li a{ height:80px;}
    .contactus .box{display:block; background:#2b47e1; border-radius:15px;padding-bottom:60px;padding-top:30px; margin-bottom:50px;}
    .contactus .box:after{ content:'';display:block; clear:both;}
    .contactus .box .ewm { float: left; width: 48%; margin-left: 0 ;text-align:center;}
    .contactus .box .ewm .img{ margin:0 auto;margin-bottom:10px;}
    .circle .t, .circle { width: 100px; height: 100px; }
    .circle { border-radius:100%; border:5px solid #fff;margin-bottom:-52px;}
    .footer{ font-size:12px;}
    .contactus .box .text{ margin-bottom:20px;}
    
    .contactus .box .text h3, .contactus .box .text p { display: inline-block }
    .contactus .box .text .flex{ flex-direction:row;margin-bottom:15px;align-items:center;justify-content:center;}
    .contactus .box .text h3 { font-size: 20px; margin: 0; margin-left:10px; text-align: center; }
    .contactus .box .logo{display:none;}
    .case_list .img { border-radius: 10px; }
    .contactus{margin-top:20px;}
    .pagesize .prev, .pagesize .next{width:50px; height:50px;}
    .num label{ font-size:14px;}
    .num .count{ font-size:18px;}
    .num .cur{ line-height:2}
    .cont_text{width:100%;margin-left:0;font-size:16px;text-align:justify;}
    .cont_text p{display:inline}
    .main_page2 .page:first-child { padding-top: 70px; }
    .page_tit3 h4{ font-size:5vw}
    .page_tit3 h2{ font-size:8vw}
    .page3_list li{flex:0 0 100%;}
    .page3_list .box .icon{width:50px; height:50px;margin:0 auto;margin-bottom:10px;}
    .page3_list .box h3{ font-size:20px;}
    .main_page3 .flex{ flex-direction:column;}
    .message{width:100%;}
    .mainer .page:first-child{padding-top:80px;}
    .mainer .page.page0{padding-top:0}
    .page_title2 .inside-page-title { padding-top: 30px; }
    .page-about-title .icon{ right:0;left:auto;}
    .page-about-title{ display:block;}
    .page_title2 .text h3{ font-size:6vw;margin-bottom:2vw}
    .page_title .flex{ flex-direction:row; align-items:center;}
    .page_title2 .text .flex{ flex-direction:column; align-items:flex-start}
    .page_title2 .text .text_swiper { font-size: 4.5vw; line-height: 25px; }
    .page_title2 .txt p{ font-size:14px;}
    .main_page3 .page{ padding:30px 0}
    .page_title3 .icon img{width:10vw}
    .page_title3 h5{ margin-bottom:10px;}
    .page_title3 .line{ margin:10px 0}
    .page_title3 h3{ font-size:20px;}
    .page_title3 p{ margin-top:20px; line-height:1.5; font-size:14px;}
    .page4_list ul{ flex-direction:column;}
    .page4_list .box .tit{ margin-bottom:15px;}
    .page4_list .box{ padding:20px;}
    .page_ring_list ul li{ position:relative;top:auto !important; left:auto !important;  width:25vw; height:25vw; margin:2vw;float:left;}
    .page_ring_list ul li:nth-child(6), .page_ring_list ul li:first-child { margin-left: 18vw }
    .page_ring_list ul {display:block; height: auto;}
    .page_ring_list ul:after{ content:'';display:block; clear:both;}
    .page_ring_list .box { font-size: 14px; }
    .page_ring_list .box span { background-size: auto 30px; padding-top: 40px; }
    .message li{ margin-bottom:10px;}
    .input_btn{ margin-top:10px}
    .header.fixed{ background:#fff;}
.page_det .item_pad0{background-attachment:local;background-size:cover}
    .main_page4.mainer .page:first-child { padding-top: 0 }
    .page5_tit h2{ font-size:10vw;margin:15px 0 10px 0;}
    .page5_tit .tag li{ line-height:30px;}
    .page5_tit { display: block; }
    .page5_det{ display:block;position:relative;}
    .page5_det .text h3{ font-size:18px;margin-left:80px;margin-bottom:20px;}
    .page5_det .link{ position:absolute;top:0;left:0}
    .page5_det .date{ display:none;margin-top:20px;}
    .page_det .item{ padding:20px 0}
    .item_det .h3_tit{ font-size:16px;}
    .font_list{ flex-direction:column}
    .font_list li{ margin-left:0;margin-bottom:10px;padding:15px;}
    .font_list .font{ font-size:40px;}
    .color_list li{ min-width:50%; max-width:50%;margin-bottom:10px;}
    .color_list{ flex-wrap:wrap;}
    .color_list .color{width:50px; height:50px;}
    .page{padding-top:40px}
    .page_tit{ margin-bottom:40px;}
    .wrap3,.wrap2{margin:0 15px;}
    .res_list .text{display:none; }
    .res_list li{display:flex;align-items:center;}
    .res_list img{max-width:100%;height:100px; margin-right:0px;}
    .res_list h3{ margin-bottom:0}
    .item_imgs .img{ margin-top:30px;}
    .item_imgs .img1{ border-radius:5px;}
    .item_wap_list li{ padding:10px; box-sizing:border-box;margin-bottom:0}
    .item_wap_list ul{ margin:0 5px;}
    .wap_list li{min-width:33.33%; max-width:33.33%}
    .wap_list .img{width:90%;}
    .item_imgs2{ margin-top:10px;padding-top:80px;}
    .item_imgs2 .img{ margin-bottom:20px;padding:10px; box-sizing:border-box;}
    .item_imgs2 .img:nth-child(3n+2){ margin-top:-20px;}
    .page_det .item_bg1 .img{ border-radius:5px;}
}
.tit_tag{display:none;}


/*0630*/
.nav{text-align: center;display: flex;align-items: center;justify-content: center;width: 100%;margin-top: 25px;}

.nav ul{display: flex;align-items: center;justify-content: center;}
.nav a{font-size: 18px;}
.nav span{ color:#000;transition: color 0s;}
.nav.fff span{ color:#fff}
.nav li{margin: 0 30px;}
.fixed .header{     -webkit-backdrop-filter: blur(0px);
    backdrop-filter: blur(0px);
    -webkit-transition: all 0.4s, -webkit-backdrop-filter 0s;
    transition: all 0.4s, -webkit-backdrop-filter 0s;
    -o-transition: all 0.4s, backdrop-filter 0s;
    transition: all 0.4s, backdrop-filter 0s;
    transition: all 0.4s, backdrop-filter 0s, -webkit-backdrop-filter 0s;  background: rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);}
.fixed .overlay-menu-toggle{ top:5px}
.fixed .nav{margin-top: 0;}
.fixed .logo{top:20px} 

.fixed .nav span{color:#000}
.page_det .item_det{display: none;}




.full_wap {
	display: none;
}

.full {
	position: fixed;
	top: 50%;
	right: 20px;
	z-index: 101;
}

.full li {
	cursor: pointer;
	position: relative;
	margin-bottom: 10px;
}

.full li:hover .icon {
	background: #1f6aff;
}

.full .icon {
	width: 48px;
	height: 48px;
	border-radius: 100%;
	background: #2f2f2f;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 20px rgba(51, 111, 255, .3);
}

.full li:hover .drop {
	display: block;
}

.full li:hover .drop_wx {
	display: flex;
}

.full .drop {
	position: absolute;
	right: 100%;
	top: 0;
	margin-right: 10px;
	background: rgba(255, 255, 255, 0.8);
	white-space: nowrap;
	padding: 0 15px;
	border-radius: 15px;
	border: 2px solid #fff;
	display: none;
}

.full .drop h3 {
	font-size: 18px;
	margin-top: 5px;
	font-weight: bold
}

.full .drop .box {
	padding: 10px 0;
	border-bottom: 1px solid #c8dce5;
}

.full .drop .box:last-child {
	border-bottom: 0;
}

.full .drop_wx {
	padding: 14px;
	gap: 14px;
}

.full .drop_wx .box {
	border-bottom: 0;
	padding: 0;
	text-align: center;
}

.full .drop_wx .ewm {
	width: 110px;
	height: 110px;
	border: 2px solid #1f6aff;
	border-radius: 5px;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 5px;
}

.full_wap {
	display: none;
}

@media only screen and (max-width: 1200px){
    .nav li{margin: 0 20px;}
}



.pc_show{display: block;}
.wap_show{ display: none;}
@media only screen and (max-width: 900px){
    .nav{display: none;}
    .full {
		display: none;
	}

	.full_wap {
		display: block;
		height: 70px;
	}

	.full_wap ul::after {
		display: none;
	}

	.full_wap ul {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 60px;
		padding: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 101;
		background-color: #fff;
		box-sizing: border-box;
	}

	.full_wap .f_btn {
		width: 80%;
		margin: 0 auto;
		line-height: 45px;
		border-radius: 50px;
		background: #1f6aff;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 5px
	}

	.full_wap li {
		flex: 1;font-size: 14px;
	}

	.full_wap .drop {
		position: fixed;
		bottom: 60px;transition: all 0s;
		left: 0;
		width: 100%;
		border-bottom: 1px solid #ccc;
		padding: 10px;
		text-align: center;
		line-height: 1.5;
		background-color: #fff;
		
		display: none;
	}

	.full_wap .c1 {
		font-weight: bold;
	}
 
.header .logo{ top:10px;}
.header .wrap{height: 60px;}

.pc_show{display: none;}
.wap_show{ display: block;}

.item_imgs2 .img{width:50%;margin-bottom:0px;padding:5px}
.item_imgs2 .img:nth-child(3n+1){clear:none;}
.item_imgs2 .img:nth-child(2n+1){ clear:both;}
.item_imgs2 .img:nth-child(3n+2){margin-top:0;}
.page_det .item_bg1{padding-top: 30px !important;padding-bottom:30px; margin-bottom:30px}
.ht50{height: 30px;}
    .tit_flex img{height: 30px;}
}


.swiper1 img{max-width: 100%;transform:translateY(-10vh)}




video:focus {
outline:none;
}