/*
 *	Created by Edward on 22/10/27
 *	Copyright (c) 2022 ishutime.com All rights reserved
*/
* {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
}

@font-face {
	font-family: misans;
	src: url(../font/MiSans-Bold.ttf)
}

@font-face {
	font-family: BrownBlod;
	src: url( https://website-ishutime.oss-cn-chengdu.aliyuncs.com/DIN-BoldAlternate.otf)
}

@font-face {
	font-family: SourceHanSans;
	src: url(../font/SourceHanSansCN-Regular.TTF)
}

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

.case_banner{
    width: 100%;
    height: 100vh;
    position: relative;
    background: #14151f;
    overflow: hidden;
}

.adv_box{
    width: 100%;
    height: auto;
    position: relative;
    background: #14151f;
    overflow: hidden;
    padding-bottom: 2vw;
    margin-bottom: 6vw;
}

.anli .w1400{
    width: 80%;
}

.flyweight{
	width: 280px;
	height: 60px;
	align-items: center;
	line-height: 60px;
	position: relative;
	background: #45cb7a;
	border-radius: 60px;
	text-align: center;
	color: #fff;
	margin: 1vw auto 5vw;
	display: flex;
	justify-content: center;
	font-size: 18px;
	box-shadow: 0px 0px 20px rgba(0, 0, 0, .1);
	cursor: pointer;
}

.flyweight:hover{
	color: #fff;
}

.flyweight.w{
	background: transparent;
	background: #fff;
	color: #078f57;
	margin-bottom: 0px;
	font-size: 18px;
	font-weight: bold;
}
.flyweight.w:hover{
	color: #078f57;
}

.our_advantage{
    width: 80%;
    height: auto;
    position: relative;
    left: 10%;
    padding-bottom: 3vw;
}

.our_advantage ul{
    width: 100%;
    height: auto;
    position: relative;
        display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.our_advantage ul li .l{
    width: 200px;
    height: auto;
    margin: 0px auto;
    margin-bottom: 1.5vw;
}

.our_advantage ul li{
    width: 32%;
        margin-bottom: 4vw;
    height: 30vh;
     background: rgba(0, 0, 0, .1);
    backdrop-filter: blur(10px);
    position: relative;
    border: 1px solid #282c32;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    overflow: hidden;
}

.our_advantage ul li .name{
    font-size: 1.8vw;
    margin-bottom: 1vw;
    text-align: center;
}

.our_advantage ul li .des{
    font-size: 18px;
}

.eye_box{
    width: 600px;
    height: 150px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.eye_box .eye{
    width: 250px;
    height: 250px;
    position: relative;
    background: #fff;
    border-radius: 50%;
}

.eye_box .eb{
     width: 160px;
    height: 160px;
    position: absolute;
    background: #14151f;
    border-radius: 50%;
    left: 20%;
    top: 20%;
}

.eye_box .eye span{
    width: 20px;
    height: 20px;
    position: absolute;
    background: #fff;
    border-radius: 50%;
    left: 50%;
    top: 50%;
}

.case_banner:before{
    width: 100%;
    height: 30vh;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 10;
    background: linear-gradient(180deg, rgba(20, 21, 31, 1), rgba(20, 21, 31, 0));
    content: '';
}

.case_banner:after{
    width: 100%;
    height: 30vh;
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 10;
    background: linear-gradient(0deg, rgba(20, 21, 31, 1), rgba(20, 21, 31, 0));
    content: '';
}

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

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

.process_list ul li{
    width: 32%;
    padding: 3vw 3vw 6vw;
    border: 1px solid #282c32;
    border-radius: 5px;
    margin-bottom: 1.5vw;
    overflow: hidden;
    position: relative;
    margin-right: 2%;
    color: #fff;
}

.process_list ul li .light{
    background: rgba(69, 203, 122, .5);
    content: " ";
    display: block;
    filter: blur(50px);
    height: 12vw;
    width: 12vw;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity .2s cubic-bezier(.16,1,.3,1);
    
    z-index: 0;
    transform-origin: center center;
}

.process_list ul li:nth-child(n+4){
    width: 23.5%;
    padding: 3vw 3vw 4vw;
}

.process_list ul li:nth-child(7){
    margin-right: 0%;
}

.process_list ul li:nth-child(n+4) .num{
    font-size: 12vw;
}

.process_list ul li .name{
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 1vw;
}

.process_list ul li .des{
        width: 100%;
    line-height: 1.7;
    font-size: 18px;
}

.process_list ul li .num{
    width: auto;
    height: auto;
    position: absolute;
    right: 0px;
    bottom: 0px;
    transform: translate(0%, 50%);
    font-size: 15vw;
    color: rgba(255, 255, 255, .05);
    font-family: misans;
}

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

.zc_process{
    width: 100%;
    height: auto;
    position: relative;
    background: #14151f;
    overflow: hidden;
    padding: 5vw 0px;
}

.case_slogan{
    width: 45%;
    height: auto;
    position: absolute;
    left: 7.5%;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    color: #fff;
}

.case_slogan .title{
    font-size: 60px;
    font-weight: bold;
    overflow: hidden;
    position: relative;
    margin-bottom: 2vw;
}

.case_slogan .info{
    width: 100%;
    position: relative;
    margin-bottom: 5vw;
}

.case_slogan .info .d{
    width: 100%;
    height: auto;
    position: relative;
    font-size: 20px;
    line-height: 1;
    margin-bottom: 1.5vw;
}

.case_slogan .info .d span{
    position: relative;
    color: #45cb7a;
    padding: 0px 5px;
    z-index: 2;
    
}

.case_banner .more .txt{
    font-size: 16px;
}

.case_slogan .info .d span i{
    mix-blend-mode: difference;
}

.case_slogan .info .d span:before{
    width: 90%;
    height: 40%;
    position: absolute;
    left: 5%;
    bottom: 0%;
    content: '';
    background: #45cb7a;
    transform: skewX(-10deg);
}

.visual{
    width: 60%;
    height: auto;
    position: absolute;
    left: 35%;
    top: 0%;
    z-index: 2;
    perspective: 3000px;
}

.visual ul{
    width: 100%;
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-between;
    transform-origin: center center;
    transform-style: preserve-3d;
    transform: rotateX(33deg) rotateY(-40deg) rotateZ(31deg);
   
}

.visual ul li{
    width: 46%;
    height: 100vh;
    position: relative;
    
}

.visual ul li .v_box .img{
    width: 100%;
    height: auto;
    position: relative;
    padding-bottom: 3vw;
    
}

.visual ul li .v_box .img img{
    border: 5px solid #fff;
    border-radius: 10px;
    position: relative;
}

.visual ul li .v_box{
    width: 100%;
    height: auto;
    position: relative;
    animation: marqueeUp forwards infinite linear 25s;
}

.visual ul li:nth-child(even) .v_box{
    animation: marqueeDown forwards infinite linear 20s;
}

@keyframes marqueeUp {
    0% {
        transform: translateY(0);
    }
    
    100% {
        transform: translateY(-50%);
    }
}

@keyframes marqueeDown {
    0% {
        transform: translateY(-50%);
    }
    
    100% {
        transform: translateY(0%);
    }
}

.hcase ul li a .en_box{
    font-family: misans;
}

.remmon_box{
    width: 100%;
    padding-bottom: 5vw;
}


.remmon_list ul li a:hover{
    background: #fff;
    color: #14151f;
}

.remmon_list ul li .light{
    background: rgba(69, 203, 122, .5);
    content: " ";
    display: block;
    filter: blur(50px);
    height: 160px;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity .2s cubic-bezier(.16,1,.3,1);
    width: 160px;
    z-index: 0;
    transform-origin: center center;
}

.ssl_wrap{
    background: #14151f;
    color: #fff;
    margin-bottom: 5vw;
    overflow: hidden;
}

.ssl_box{
    width: 100%;
    height: auto;
    padding: 15vw 0px 12vw;
    position: relative;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ssl_hzhb{
    padding-bottom: 5vw;
    position: relative;
}

.ssl_box .sub_name{
    margin-bottom: 1.5vw;
}
.zs_hbs{
    width: 65vw;
    margin: 0px auto;
    position: relative;
    margin-bottom: 3vw;
    overflow: hidden;
}

.zs_hbs:before{
    width: 15%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0%;
    content: '';
    background-image: linear-gradient(90deg, #14151f 0%, rgba(20, 21, 31, 0) 100%);
    z-index: 10;
}

.zs_hbs:after{
    width: 15%;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0%;
    content: '';
    background-image: linear-gradient(-90deg, #14151f 0%, rgba(20, 21, 31, 0) 100%);
    z-index: 10;
}

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

.zs_hbs ul:nth-child(odd){
    animation: marqueeLeft 40s linear infinite;
}

.zs_hbs ul:nth-child(even){
    animation: marqueeRight 40s linear infinite;
}

@keyframes marqueeLeft{
  0% {
    left: 0;
  }
  100% {
    left: -100%;
  }
}

@keyframes marqueeRight{
  0% { 
    left: -100%; 
  }
  100% {
   left: 0; 
  }
}

.zs_hbs ul li{
    width: 12vw;
    margin-right: 1vw;
    margin-bottom: 1vw;
}

.ssl_box .left{
    width: 60%;
    display: flex;
    justify-content: space-between;
}

.ssl_box .left .icon{
    width: 200px;
}

.ssl_box .left .info{
    width: calc(100% - 250px);
}

.ssl_box .left .t{
    font-size: 36px;
    margin-bottom: 15px;
}

.ssl_box .left .d{
    width: 100%;
    font-size: 18px;
    line-height: 2;
    margin-bottom: 3.5vw;
}

.ssl_box .left a{
    width: 200px;
    height: 55px;
    display: block;
    background: #45cb7a;
    color: #fff;
    line-height: 55px;
    display: flex;
    font-size: 16px;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    box-shadow: 10px 10px 30px rgba(0,0,0,.1);
}

.ssl_box .img{
    width: 70%;
    position: absolute;
    right: -35%;
    opacity: 0.05;
}

.remmon_list{
    width: 100%;
    height: auto;
    position: relative;
    margin-bottom: 5vw;
}

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

.remmon_list ul li{
    width: 23.5%;
    position: relative;
    margin-right: 2%;
    border-radius: 10px;
    padding:3vw 25px;
    border: 1px solid #282c32;
    overflow: hidden;
}

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

.remmon_list ul li .title{
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 2vw;
}

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

.remmon_list ul li .des p{
    padding-left: 15px;
    line-height: 25px;
    position: relative;
    margin-bottom: 5px;
}

.remmon_list ul li .des p:after{
    width: 5px;
    height: 5px;
    position: absolute;
    left: 0px;
    opacity: 0.5;
    top: 10px;
    content: '';
    background: #fff;
    border-radius: 50%;
}

.remmon_list ul li .jg{
    font-family: misans;
    font-size: 36px;
    margin-top: 1vw;
}

.remmon_list ul li .jg span{
    font-size: 16px;
    margin-left: 5px;
}


.remmon_list ul li a{
    display: block;
    width: 140px;
    height: 42px;
    margin-top: 2vw;
    line-height: 40px;
    text-align: center;
    border-radius: 40px;
    position: relative;
    border: 1px solid #282c32;
    color: #fff;
}

.ssl_ys{
    width: 100%;
    display: flex;
    align-items: center;
    position: relative;
    margin-bottom: 5vw;
}

.ssl_ys .sub_name{
    width: 30%;
    margin-bottom: 0px;
}

.ssl_ys .right{
    width: 65%;
    color: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.bannerST{
    width: 100%;
    height: 100vh;
    position: relative;
    background: url(../image/welcome-bg.jpg) 50%/cover;
}

.ipv6{
    border: 1px solid rgba(0,0,0,.3);
    padding: 1px 4px;
    border-radius: 3px;
    margin-left: 2px;
    font-size: 12px;
    text-transform: none;
}

.sr_box{
    width: 48%;
    height: auto;
    padding: 3vw;
    border: 1px solid #282c32;
    border-radius: 5px;
    margin-bottom: 1.5vw;
    overflow: hidden;
    position: relative;
}

.sr_box .n{
    width: auto;
    height: auto;
    position: absolute;
    right: 0px;
    bottom: 0px;
    transform: translate(0%, 50%);
    font-size: 15vw;
    color: rgba(255,255,255,.05);
    font-family: misans;
}

.sr_box .name{
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 1vw;
}

.sr_box .des{
    width: 100%;
    line-height: 1.7;
    font-size: 18px;
}

.about_banner{
  width: 100%;
  height: 100vh;
  position: relative;
  background: #14151f;
}

.add_atop{
  width: 90%;
  height: auto;
  position: absolute;
  left: 5%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  direction: rtl;
}
.num_list,.add_atop .left{
    direction: initial;
}
#canvas{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0%;
  top: 0%;
}

.add_atop .left{
  width: 60%;
}
.add_atop .left .sub_name{
  margin-bottom: 1vw;
  text-transform: uppercase;
}
.add_atop .left .singePage p{
  margin-bottom: 15px;
}

.bst_img{
     width: 80%;
    height: auto;
    position: absolute;
    left: -5%;
    bottom: 0%;
}

.main {
    position: relative;
    height: auto;
    padding-top: 0vw;
    background: #fffcf4;
    z-index: 10;
}
.iconfont {
	font-family: "iconfont" !important;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-webkit-text-stroke-width: 0.2px;
	-moz-osx-font-smoothing: grayscale;
}



html,body {
	font-family: "SourceHanSans","microsoft yahei";
}

legend {
	padding: 0
}

progress {
	vertical-align: baseline
}

.preloader {
	align-items: center;
	display: flex;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 10
}

.wave{
    width: 100%;
    height: auto;
    position: absolute;
    left: 0%;
    top: 0%;
    -webkit-transform: translateY(-95%)
}

.number{
    width: 85%;
    position: relative;
    background: #fff;
    box-shadow: 0px 0px 30px rgba(0,0,0,.1);
    border-radius: 10px;
    margin:0px auto;
    margin-bottom: 5vw;
    max-width: 1350px;
}

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

.number ul li .num span{
    font-size: 18px;
    margin-left: 0.5vw;
    margin-bottom: 0.4vw;
}

.number ul li{
    width: 25%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    padding: 3vw 0px;
}

.number ul li .num{
    width: 100%;
    position: relative;
    color: #45cb7a;
    display: flex;
    justify-content: center;
    line-height: 1;
    align-items: flex-end;
    margin-bottom: 0.5vw;
}

.number ul li .num b{
    font-size: 70px;
}

.number ul li .txt{
    width: 100%;
    text-align: center;
    position: relative;
    font-size: 20px;
}

.main{
    margin-top: 5vw;
}

.ball{
	width: 50vw;
	height: 50vw;
	position: absolute;
	border-radius: 50%;
	background: #edffc1 !important;
	-webkit-filter: blur(110px);
}

.adapter ul li:after{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    content: '';
    background: rgba(0,0,0,.2);
    border-radius: 50%;
    -webkit-filter: blur(110px);
    z-index: -1;
}

.adapter ul li{
    border-radius: 3vw 1vw !important;
}

.adapter ul li::before{
    border-radius: 3vw 1vw !important;
}

.ball.ball1{
	right: -20vw;
	top: 0px;
}

.ball.ball2{
	left: -20vw;
	bottom: 170vw !important;
}

.nav_bar{
    width: 130px;
    height: auto;
    position: fixed;
    z-index: 100;
    background: #fff;
    right: 3%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    border-radius: 10px;
    border: 1px solid #45cb7a;
    padding: 15px;
}

.nav_bar h2{
    display: block;
    font-size: 26px;
    font-weight: bold;
    font-family: Arial;
    color: #45cb7a;
    margin-top: 15px;
    margin-bottom: 15px;
    text-align: center;
}

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

.nav_bar .tips{
    width: 100%;
    text-align: center;
    font-size: 14px;
    line-height: 1.4;
    color: #45cb7a;
    margin-top: 8px;
}

.st_kf{
    width: 100%;
    height: auto;
    position: relative;
    text-align: center;
    padding: 12px 0px;
    color: #45cb7a;
    margin-top: 20px;
    margin-bottom: 20px;
}

.st_kf:before{
    width: 130px;
    height: 1px;
    position: absolute;
    left: -16px;
    top: 0px;
    content: '';
    background: #45cb7a;
}
.st_kf:after{
    width: 130px;
    height: 1px;
    position: absolute;
    left: -16px;
    bottom: 0px;
    content: '';
    background: #45cb7a;
}

.st_kf a{
    display: block;
    width: 100%;
    height: auto;
    line-height: 35px;
    background: #45cb7a;
    color: #fff;
    border-radius: 40px;
    text-align: center;
    position: relative;
}

.st_dh{
    text-align: center;
    position: relative;
    color: #45cb7a;
}

.st_dh b{
    font-size: 14px;
}

.preloader-bg {
	background: radial-gradient(circle at center, rgba(0, 0, 0, .9), rgba(0, 0, 0, .9) 100%);
	height: 105%;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 105%
}

.preloader-block {
	align-items: center;
	display: flex;
	height: 8.59375vw;
	justify-content: flex-end;
	left: 58.0729166667vw;
	position: absolute;
	visibility: hidden;
	width: auto;
}

.preloader .preloader-text {
	position: absolute;
	right: 0;
	white-space: nowrap;
	z-index: 2;
	font-family: alibaba;
	font-size: 16px;
}

.preloader .loading-text {
	transform: translate(-4.3229166667vw, -.9375vw)
}

.preloader .loading-text.loaded {
	display: none
}

.preloader .loading-text span {
	color: #fff;
	font-size: 36px;
}

.contact-info .block .preloader .loading-text a,
.preloader .loading-text .contact-info .block a,
.preloader .loading-text p,
.preloader .loading-text section.about .in-numbers_grid .grid-item__text,
section.about .in-numbers_grid .preloader .loading-text .grid-item__text {
	color: #fff;
	opacity: .6
}

.preloader .loaded-text {
	display: block;
	opacity: 0;
	pointer-events: none;
	transform: translateX(-6.25vw)
}

.contact-info .block .preloader .loaded-text a,
.preloader .loaded-text .contact-info .block a,
.preloader .loaded-text p,
.preloader .loaded-text section.about .in-numbers_grid .grid-item__text,
section.about .in-numbers_grid .preloader .loaded-text .grid-item__text {
	color: #fff;
	opacity: .6
}

.preloader-button {
	align-items: center;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	height: 8.59375vw;
	justify-content: center;
	opacity: 0;
	pointer-events: none;
	transition: border-color .6s ease;
	width: 8.59375vw
}

.preloader-button.loaded {
	pointer-events: auto
}

.preloader-button:hover circle {
	opacity: 0;
	transform: scale(0)
}

.preloader-button .circle {
	height: 100%;
	position: absolute;
	transform: rotate(-90deg);
	width: 100%
}

.preloader-button .circle svg {
	overflow: visible
}

.preloader-button .circle span{
    transform: rotate(90deg);
    display: block;
    width: 100%;
    color: #fff;
    text-align: center;
    left: -20%;
    position: absolute;
    top: 45%;
}

.preloader-button .circle svg circle {
	fill: none;
	stroke: hsla(0, 0%, 100%, .3);
	stroke-width: 1px;
	transform-origin: center center;
	transition: opacity .3s ease, transform .3s ease
}

.single-preloader {
	background: hsla(0, 0%, 100%, .8);
	display: none;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 2
}

.single-preloader.loading {
	display: block
}

.custom-pointer {
	align-items: center;
	background-color: #45cb7a;
	border-radius: 50%;
	display: flex;
	height: 1.1979166667vw;
	justify-content: center;
	mix-blend-mode: difference;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	transform-origin: center center;
	transition: width .6s cubic-bezier(.22, 1, .36, 1), height .6s cubic-bezier(.22, 1, .36, 1), opacity .6s cubic-bezier(.22, 1, .36, 1);
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	width: 1.1979166667vw;
	z-index: 9999;
	display: none;
}

.custom-pointer.visible {
	opacity: 1
}

.custom-pointer.link-button {
	background-color: transparent;
	font-size: .8333333333vw;
	line-height: 95%;
	text-decoration: none
}

.custom-pointer.onbutton {
	height: 5.2083333333vw;
	width: 5.2083333333vw
}

.custom-pointer.onbutton-large {
	height: 8.59375vw;
	width: 8.59375vw
}

.custom-pointer.drug,
.custom-pointer.onlink {
	height: 5.2083333333vw;
	width: 5.2083333333vw
}


section {
	background-color: #fff;
	min-height: 100vh;
	padding-left: 20.3125vw;
	position: relative;
	width: 100%;
	z-index: 1
}


.welcome {
	overflow: hidden
}

.welcome-bubble {
	background-color: #fff;
	border-radius: 50%;
	bottom: -70vh;
	height: 100vh;
	left: -5vw;
	position: absolute;
	transform: scaleY(0);
	width: 110vw
}

.welcome-bg {
	height: 110%;
	left: -5%;
	position: absolute;
	top: -5%;
	width: 110%
}

.welcome-bg {
	background: url(../image/welcome-bg.jpg) 50%/cover
}

.welcome-panda {
	bottom: 0;
	height: 55vw;
	left: -5vw;
	pointer-events: none;
	position: absolute;
	transform-origin: bottom;
	width: 57vw;
	z-index: 10
}

.welcome-panda canvas {
	height: 101%;
	left: 0;
	position: absolute;
	top: 0;
	visibility: hidden;
	width: 101%;
	z-index: 1
}

.welcome-gallo {
	position: absolute;
	visibility: hidden;
	z-index: 10
}

body.no-webp .welcome-gallo {
	background: url(../image/gallo.png) 50%/contain no-repeat
}

body.webp .welcome-gallo {
	background: url(../image/gallo.webp) 50%/contain no-repeat
}

.welcome-gallo.gallo-1 {
	bottom: -26.0416666667vw;
	height: 52.0833333333vw;
	left: -26.0416666667vw;
	width: 52.0833333333vw
}

.welcome-gallo.gallo-2 {
	height: 8.2291666667vw;
	right: 20.3125vw;
	top: 19.7916666667vw;
	width: 8.2291666667vw
}

.welcome-gallo.gallo-3 {
	bottom: 14.6354166667vw;
	height: 8.2291666667vw;
	right: -2.65625vw;
	width: 8.2291666667vw
}

.welcome .text-block {
	color: #fff;
	filter: blur(50px);
	height: 100%;
	position: absolute;
	left: 45%;
	top: 0%;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	visibility: hidden;
	width: 45vw;
	display: flex;
	justify-content: center;
	align-items: center;
}

.welcome .text-block h1 {
	font-size: 4.3vw;
	margin-bottom: 1vw;
}

.welcome .text-block .img{
	width: 70%;
	position: relative;
}

.welcome .text-block .subtitle {
	font-size: 2vw;
	line-height: 1;
	margin-bottom: 2vw;
	font-weight: bold;
	font-style: italic;
	position: relative;
}

.welcome .text-block .subtitle::before{
	width: 22%;
	height: 2px;
	position: absolute;
	left: 0%;
	bottom: -10px;
	content: '';
	background: #fff;
}

.welcome .text-block .subtitle,
.welcome .text-block .text {
	display: block;
	position: relative
}

.welcome .text-block .text {
	margin-bottom: 1vw;
	width: 100%;
	font-size: 1.3vw;
	line-height: 1.6;
}


.scroll-bar {
	display: flex;
	height: 100%;
	justify-content: center;
	opacity: 0;
	position: fixed;
	right: 0;
	top: 0;
	transform-origin: right;
	transition: .3s ease;
	width: .78125vw;
	z-index: 9999
}

.scroll-bar.visible,
.scroll-bar:hover {
	opacity: 1
}

.scroll-bar.is-dragging,
.scroll-bar:hover {
	transform: scaleX(1.25)
}

.scroll-bar.is-dragging .scroll-track {
	transition: none
}

.scroll-bar .scroll-track {
	background-color: rgba(0, 0, 0, .5);
	border-radius: 1.0416666667vw;
	height: 40px;
	opacity: 1;
	position: absolute;
	top: 0;
	transition: transform .1s linear;
	width: 65%
}
body,
html {
	-ms-overflow-style: none;
	scrollbar-width: none
}

body ::-webkit-scrollbar,
html ::-webkit-scrollbar {
	width: 0
}


.preloader-button {
	align-items: center;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	height: 8.59375vw;
	justify-content: center;
	opacity: 0;
	pointer-events: none;
	transition: border-color .6s ease;
	width: 8.59375vw
}

.preloader-button.loaded {
	pointer-events: auto
}

.preloader-button:hover circle {
	opacity: 0;
	transform: scale(0)
}

.preloader-button .circle {
	height: 100%;
	position: absolute;
	transform: rotate(-90deg);
	width: 100%
}

.preloader-button .circle svg {
	overflow: visible
}

.preloader-button .circle svg circle {
	fill: none;
	stroke: hsla(0, 0%, 100%, .3);
	stroke-width: 1px;
	transform-origin: center center;
	transition: opacity .3s ease, transform .3s ease
}
button.showreel {
	background-color: transparent;
	border-color: transparent;
	isolation: isolate
}

.button__circle {
	background-color: transparent;
	border: 1px solid;
	border-radius: 50%;
	height: 5.2083333333vw;
	margin-left: -2.6041666667vw;
	mix-blend-mode: difference;
	opacity: .15;
	transition: opacity .3s ease, background-color .3s ease, border-color .3s ease;
	width: 5.2083333333vw
}

.button__circle:hover {
	background-color: transparent;
	border-color: transparent!important;
	opacity: .5
}

.button.white .button__text {
	color: #fff
}

.button.white .button__circle {
	border-color: #fff
}

.button.black .button__text {
	color: rgba(0, 0, 0, .9)
}

.button.black .button__circle {
	border-color: rgba(0, 0, 0, .9)
}
.header{
	width: 100%;
	height: auto;
	display: flex;
	position: absolute;
	left: 0%;
	top: 0%;
	padding: 0px 3%;
	z-index: 50;
	justify-content: space-between;
	border-bottom: 1px solid rgba(255,255,255,.1);
	align-items: center;
	-webkit-transition: all .45s;
    background: rgba(0,0,0,0.2);
}

.header .logo{
	width: 260px;
	position: relative;
}
.nav-actives{
    color: #136ead;
}
.nav-actives a{
    color: #136ead !important;
    font-weight: bold;
    border-bottom: 1px solid #136ead;
}
.case-tittles{
    text-align: center;
}
.case-cont-title{
    margin-top: 70px;
    margin-bottom: 50px;
}
.case-cont-title p:nth-child(1){
    font-size: 30px;
    color: #232323;
}
.case-cont-title p:nth-child(2){
    font-size: 16px;
    color: #828282;
    margin-top: 10px;
}
.header.active .nav a{
    color: #fff;
}
.case-show-title{

}
.case-show-title span{
    display: inline-block;
    vertical-align: middle;
    font-size: 24px;
    color: #1a1a1a;
    margin-right: 10px;
}
.case-show-title a{
    display: inline-block;
    vertical-align: middle;
    color: #136ead;
    font-size: 16px;
}
.case-show-title1{
    vertical-align: middle;
    margin-top: 20px;
}
.case-show-desc{
    font-size: 16px;
    color: #2d2d2d;
    line-height: 2;
    margin-top: 40px;
    margin-bottom: 100px;
}
.case-show-title1 i{
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    width:80px;
    height: 2px;
    background: #adadad;
}
.case-show-title1 span{
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    color: #212121;
}
.case-show-cont{

}
.case-show-cont1{
    width: 52%;
    margin-right: 8%;
    display: inline-block;
    float: left;
    box-shadow: 0 0 10px #e3e3e3;
}
.case-show-cont2{
    width: 40%;
    display: inline-block;
    float: left;
    padding-top: 120px;
}
.case-show-cont1 img{
    width: 100%;
    display: block;
}
.case-show-cont2 img{
    width: 100%;
    display: block;
    box-shadow: 0 0 10px #e3e3e3;
}
.cast-cont-shows{
    margin:60px 0;
}
.show-case-cont2{
    border-top: 1px solid #a2a1a1;
    padding-top: 60px;
    margin-top: 60px;
    padding-bottom: 200px;
}
.show-case-cont2-desc{
    font-size: 16px;
    color: #2d2d2d;
    box-sizing: border-box;
    padding-right: 30px;
    line-height: 1.8;
    margin-bottom: 60px;
}
.show-case-cont2-list{
    background: url(../img/cases1_13.png)no-repeat;
    width: 100%;
    height: 550px;
    display: inline-block;
    float: left;
    background-size: 100% 100%;
    padding:60px 20px;
    box-sizing: border-box;
  position: relative;
}
.show-case-cont2-list::after {
  content: '';
  position: absolute;
    background: url(../img/casedy_03.png)no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 150px;
  top: 100%; /* 放置在图片下方 */
  left: 0;
  right: 0;
  bottom: 10px; /* 调整倒影的高度 */
    margin-top: 10px;
  opacity: 0.5; /* 倒影透明度 */
}
.show-case-container{
    padding-bottom: 70px;
}
.show-case-cont3{
    background: #f3f3f3;
    padding:100px 0 0 0;
}
.w1400s{
    width: 1400px;
    margin:0 auto;
}
.show-cont3-text{
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding-right: 160px;
    padding-top: 120px;
}
.show-cont3-text1{
    margin-bottom: 20px;
    vertical-align: middle;
}
.show-cont3-text1 i{
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    border: 1px solid #676767;
}
.show-cont3-text1 span{
    font-size: 18px;
    color: #2d2d2d;
    display: inline-block;
    vertical-align: middle;
}
.show-cont3-text2{
    font-size: 16px;
    color: #676767;
    line-height: 2;
    margin-bottom: 50px;
}
.show-cont3-text3{
    border:1px solid #d21323;
    vertical-align: middle;
    display: inline-block;
    padding:10px 30px;
}
.show-cont3-text3 span{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    color: #d21323;
}
.show-cont3-text3 img{
    display: inline-block;
    vertical-align: middle;
    margin:0 10px;
}
.show-cont3-img{
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding-left: 20px;
}
.show-case-from{
    box-sizing: border-box;
    padding:80px 0 60px 90px;
}
.show-case-from-title{
    vertical-align: middle;
}
.show-case-from-title i{
    vertical-align: middle;
    display: inline-block;
    width: 50px;
    height: 1px;
    background: #828282;
}
.show-case-from-title span{
    vertical-align: middle;
    display: inline-block;
    font-size: 30px;
    color: #121212;
    margin-left: 10px;
}
.show-case-from-desc{
    padding-left: 65px;
    color: #828282;
    font-size: 18px;
    margin-top: 20px;
    margin-bottom: 50px;
}
.show-case-from-form input{
    width: 20%;
    display: inline-block;
    float: left;
    margin-right: 6%;
    font-size: 14px;
    color: #828282;
    padding: 10px 0 10px 10px;
    border: none;
    border: 1px solid #bfbfbf;
    background: transparent;
    outline: none;
}
.show-case-from-form input::placeholder{
    color: #828282;
}
.w1300{
    width: 1300px;
    margin:0 auto;
    overflow: hidden;
}
.contarct1{
    margin:60px 0;
}
.contarct1-cont{
    margin-top: 60px;
}
.about-list-banner-cont .aboutt1{
    font-size: 46px;
    color: #ffffff;
    margin-bottom: 30px;
    text-align: left;
    margin-top: 150px;
}

.index-list-title p:nth-child(1){
  font-size: 36px;
  color: #0774b9;
  text-align: center;
}
.index-list-title p:nth-child(2){
    font-size: 16px;
    color: #968888;
    text-align: center;
    margin:5px 0;
}
.index-list-title p:nth-child(3){
  text-align: center;
}
.index-list-title p:nth-child(3) span{
  width: 200px;
  height: 1px;
  background: #b6adad;
  display: inline-block;
  position: relative;
}
.index-list-title p:nth-child(3) span i{
  position: absolute;
  width: 70px;
  height: 3px;
  background: #0774b9;
  left: 50%;
  margin-left: -35px;
  top: -1px;
}
.case3-cont{
    margin-top: 80px;
    margin-bottom: 80px;
    padding:0 80px;
}
.case3-more{
    text-align: center;
    margin-top: 70px;
    padding-bottom: 20px;
}
.case3-more a{
    display: inline-block;
    border-radius: 5px;
    padding:10px 60px;
    font-size: 18px;
    color: #ffffff;
    font-weight: bold;
    background: #f30909;
}
.case3-list{
    display: inline-block;
    float: left;
    width: calc(20% - 1px);
    padding:15px 0;
    border-right:1px solid #7c7c7c;
}
.case3-list:last-child(){
    border-right: 0;
}
.case3-list .thumbs{
    text-align: center;
}
.case3-list .tittles{
    text-align: center;
    font-size: 16px;
    color: #ffffff;
    margin-top: 25px;
}
.case4{
    margin:50px 0;
    margin-bottom: 130px;
}
.case4-cont{
    margin-top: 115px;
}
.case4-cont-list{
    width: 30%;
    display: inline-block;
    float: left;
    background: #f9f9f9;
    position: relative;
    padding:70px 20px 30px 20px;
    box-sizing: border-box;
}
.case4-cont-list .thumbs{
    position: absolute;
    display: inline-block;
    right: 30px;
    top: -45px;
}
.case4-cont-list .tittles{
    text-align: center;
    font-size: 20px;
    color: #136ead;
    font-weight: bold;
}
.case5{
    padding:50px 0 180px 0;
    background: url(../img/yx2_04.png)no-repeat;
    background-size: top/cover;
}
.case5-cont{
    margin-top: 100px;
}
.case5-container{
    position: relative;
    padding:0 180px;
    box-sizing: border-box;
}
.case5-container .swiper-slide{
    overflow: hidden;
    width: 900px;
    height: 525px;
    margin: 0 auto;
    background: url(../image/_bg3.png) no-repeat center top/100% 100%;
    padding: 20px 90px 50px 90px;
/*    box-shadow: -10px 10px 10px #e3e3e3;*/
    text-align: center;
}
.case5-container .swiper-slide img{
    display: block;
    width: 98%;
    border-radius: 5px;
    width: 770px;
    height: 412px;
    margin-left: -10px;
    border-radius: 5px;
}
.case6{
    padding-top: 100px;
    margin-bottom: 100px;
}
.case6-container{
    padding-bottom: 50px;
}
.case6-container .swiper-slide{
    padding:15px;
    box-sizing: border-box;
    border:1px solid #d2d2d2;
}
.case6-container .swiper-slide img{
 width: 100%;   
}
.case_yx2{
    margin-top: 100px;
}
.case_yx2-cont{
    margin-top: 100px;
}
.case_yx2_thumbs{
    width: 40%;
    float: left;
    box-sizing: border-box;
    padding-right: 80px;
}
.case_yx2_thumbs img{
    display: block;
    width: 100%;
}
.case_yx2_text{
    width: 60%;
    float: left;
    box-sizing: border-box;
}
.case_yx2_text .title{
    padding-left: 25px;
    font-size: 24px;
    color: #171717;
    font-weight: bold;
    margin-bottom: 35px;
}
.case_yx2_contsss{
    margin-top: 70px;
}
.case_yx2_list{
    float: left;
    vertical-align: middle;
    margin-bottom: 25px;
    position: relative;
    padding-left: 25px;
}
.case_yx2_conts-list{
    background: #f2f2f2;
    box-sizing: border-box;
    padding:20px;
    transition: all 0.5s;
}
.case_yx2_conts-list .tites{
    width: 25%;
    float: left;
    box-sizing: border-box;
}
.case_yx2_conts-list .tites div:nth-child(1){
    text-align: center;
    font-size: 14px;
    color: #6c6c6c;
    margin-top: 10px;
}

.case_yx2_conts-list:hover  .tites div:nth-child(1){
    color: #fff;
}
.case_yx2_conts-list:hover  .tites div:nth-child(2){
    color: #fff;
}
.case_yx2_conts-list:hover  .tites div:nth-child(1) img:nth-child(1){
    display: none;
    opacity: 0;
}
.case_yx2_conts-list:hover  .tites div:nth-child(1) img:nth-child(2){
    display: inline-block;
    opacity: 1;
}
.case_yx2_conts-list{
    margin-bottom: 40px;
}
.case_yx3{
    padding:60px 0;
    background: url(../image/cases_64.png)no-repeat top/cover;
}
.case_yx3-cont{
    margin-top: 80px;
}
.case_yx3-text{
    width: 60%;
    display: inline-block;
}
.case_yx3-list{
    position: relative;
    padding-left: 40px;
    padding-bottom: 60px;
}
.case_yx3-list_span{
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
}
.case_yx2_mores{
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
}
.case_yx2_mores a{
    font-size: 18px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    background: #f30909;
    padding:10px 30px;
    border-radius: 100px;
    margin-right: 50px;
}
.pc{
    display: inline-block;
}
.wap{
    display: none;
}
.case_yx3-list_span span:nth-child(1){
    width: 20px;
    height: 20px;
    border-radius: 20px;
    border:1px solid #fff;
    top: 0px;
    left: 0px;
    background: transparent;
    z-index: 1;
    display: inline-block;
}
.case_yx3-list_span span:nth-child(2){
    height: calc(100% - 20px);
    border-left:1px dashed #fff;
    top: 20px;
    left: 10px;
    position: absolute;
}
.case_yx3-list_desc p:nth-child(1){
font-size: 18px;
color: #ffffff;
font-weight: bold;
margin-bottom: 20px;
}
.case_yx3-list_desc p:nth-child(2){
    font-size: 16px;
    color: #ffffff;
}
.yxptdj-conts ul li{
    width: 23.5% !important;
}
.yxptdj-conts ul li .thum img{
    width: 100%;
    display: block;
}
.yxptdj-conts  ul li:nth-child(3n) {
    margin-right: 2% !important;
}
.yxptdj-conts  ul li:nth-child(4n) {
    margin-right: 0% !important;
}
.case_yx2_conts-list:hover  .desc{
    color: #fff;
}
.case_yx2_conts-list:hover{
    background: #136ead;
}
.case_yx2_conts-list .tites div:nth-child(1) img:nth-child(1){

}
.case_yx2_conts-list .tites div:nth-child(1) img:nth-child(2){
    display: none;
}
.case_yx2_conts-list .tites div:nth-child(2){
    text-align: center;
}
.case_yx2_conts-list .desc{
    width: 75%;
    float: left;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 1.8;
    color: #6c6c6c;
    padding-left: 10%;
    box-sizing: border-box;
    padding-top: 13px;
}
.case_yx2{
    margin-bottom: 50px;
}
.case_yx1{
    background: #f4f4f4;
    padding:70px 0;
}
.case_yx2_list i{
    display: inline-block;
    vertical-align: middle;
    width: 8px;
    height: 8px;
    border-radius: 10px;
    background: #136ead;
    position: absolute;
    top: 8px;
    left: 0px;
}
.case_yx2_list span{
    font-size: 14px;
    color: #5a5a5a;
    line-height: 1.5;
    display: inline-block;
    vertical-align: middle;
}
.case5-btn-prev{
    width: 45px;
    height: 45px;
    position: absolute;
    top: 50%;
    left: 0px;
    margin-top: -30px;
    z-index: 9;
    cursor: pointer;
}
.case5-btn-prev img{
    width: 100%;
}
.case5-btn-next{
    width: 45px;
    height: 45px;
    position: absolute;
    right: 0px;
    top: 50%;
    margin-top: -30px;
    z-index: 9;
    cursor: pointer;
}
.case5-btn-next img{
    width: 100%;
}
.case4-cont-list .desc{
    font-size: 14px;
    color: #424242;
    line-height: 2;
    margin-top: 10px;
    height: 110px;
}
.case4-cont-list:nth-child(2){
    margin:0 5%;
}
.contact-map-list{
    margin-top: 55px;
    box-sizing: border-box;
    padding:5px 10px;
}
.contact-map-list div{
    width: 30%;
    float: left;
    display: inline-block;
    background: #ffffff;
    box-sizing: border-box;
    box-shadow: 0 0 10px #e3e3e3;
    text-align: center;
    height: auto;
    padding-bottom: 60px;
}
.contact-map-list div img{
margin-top: 15px;
}
.contact-map-list div:nth-child(2){
    margin:0 5%;
  
}
.contarct2-map{
    height: 350px;
    width: 100%;
    margin-top: 60px;
    margin-bottom: 60px;
}
.contarct2-map iframe {
    width: 100%;
    height: 100%;
    border: none;
}
.msg-conts{
}
.food-qlgd{
  background:#fbf1e5;
  padding:70px 0;
}
.footd-hotpark-l1-text .imgs{
  width: 30%;
  float: left;
}
.footd-hotpark-l1-text .imgs img{
  width: 90%;
  margin-top: 40px
}
.food-qlgd-container{
  padding-bottom: 80px !important;
}
.food-qlgd-title{

}
.food-qlgd-title p:nth-child(1) {
    font-size: 24px;
    color: #525252;
    text-align: center;
}
.contact-form-div input {
    width: 30%;
    display: inline-block;
    float: left;
    font-size: 14px;
    color: #828282;
    padding: 10px 0 10px 10px;
    border: none;
    border: 1px solid #bfbfbf;
    background: transparent;
    outline: none;
}
.contact-form-div input:nth-child(2) {
    margin-left: 5%;
    margin-right: 5%;
}
.contact-form-text {
    margin-top: 20px;
    margin-bottom: 20px;
    background: #fff;
    width: 100%;
    color: #828282;
    font-size: 14px;
    padding: 10px 20px;
    height: 250px;
    font-size: 18px;
    border: 1px solid #bfbfbf;
    outline: none;
}
.contact-form-text::placeholder{
    color: #828282;
    font-size: 14px;
}
.msg-desc{
    text-align: center;
    color: #2b2b2b;
    font-size: 14px;
    margin-top: 20px;
}
.contact-form-btn{
    text-align: center;
    width: 100%;
    margin-top: 20px;
}
.contact-form-btn button {
    display: inline-block;
    outline: none;
    border: none;
    background: #f30909;
    color: #fff;
    font-size: 18px;
    padding: 10px 90px;
}.contact-form {
    margin-top: 60px;
    padding-bottom: 20px;
}
.food-qlgd-title p:nth-child(2) {
    font-size: 18px;
    color: #757575;
    text-align: center;
}
.news-cont1{
    margin:70px 0;
}
.news-cont1-c{
    margin-top: 40px;
}
.contact-map-list div span:nth-child(1){
border-radius: 120px;
display: inline-block;
margin:0 auto;text-align: center;
line-height: 100px;
margin-top: 20px;
width: 100%;
text-align: center;
}
.msg-title-text span{
  display: block;
  width: 100%;
  text-align: center;
}

.contact-map-list div:nth-child(1) a{
    font-size: 16px;
    color: #494949;
    text-align: center;
}
.msg-title-text span:nth-child(1){
font-size: 42px;
color: #010101;
font-weight: bold;
}

.msg-title-text span:nth-child(2){
  font-size: 14px;
  color: #2a344e;
  font-family: "SourceHanSerifBold"
}
.contact-map-list div span:nth-child(1) img{
  vertical-align: middle;
  display: inline-block;
}
.contact-map-list div p:nth-child(2){
    font-size: 16px;
    color: #494949;
    text-align: center;
}
.contact-map-list div p:nth-child(3){
margin-bottom: 40px;
font-size: 16px;
font-weight: bold;
color: #424242;
}
.about-list-banner-cont .aboutt2{
    font-size: 24px;
    color: #ffffff;
    text-align: left;
}
.show-case-from-form button{
    width: 20%;
    display: inline-block;
    float: left;
    font-size: 14px;
    color: #ffffff;
    text-align: center;
    padding: 10px 0 10px 10px;
    border: none;
    border: 1px solid #f30909;
    background: #f30909;
    outline: none;
}
.show-cont3-img img{
    display: block;
    width: 100%;
}
.show-case-cont2-list div{
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding:5px 0px;
}
.show-case-cont2-list img{
    display: block;
    width: 100%;
}
.show-case-cont2-list:nth-child(2){
    margin-left: 7%;
}
.show-case-cont2-list:nth-child(3){
    margin-left: 7%;
}
.show-case-cont2-list:nth-child(4){
    margin-left: 7%;
}
.header.active .phone{
    color: #000;
}
.about-list-banner{
    position: relative;
}
.about-list-banner .thumbs{

}
.case_yx1-cont{
    margin-top: 160px;
    text-align: center;
    position: relative;
    padding-bottom: 100px;
    width: 100%;
}
.case_yx1-cont .bgs{
    width: 50%;
    display: inline-block;
    text-align: center;
}
.case_yx1-cont .bgs img{
    width: 100%;
    display: block;
}
.case_yx1_l_1 {
    position: absolute;
    top: -40px;
    left: 60px;
}
.case_yx1_l_2 {
    position: absolute;
    top: 130px;
    left: 0px;
}
.case_yx1_l_3 {
    position: absolute;
    bottom: 70px;
    left: 10px;
}
.case_yx1_l_text{
    background: url(../image/cases_03.png)no-repeat;
    background-size: 100% 100%;
    width: 250px;
    height: 90px;
    display: inline-block;
    margin-right: 15px;
    padding:15px 35px 15px 15px;
    box-sizing: border-box;
    font-size: 14px;
    color: #1e1e1e;
    float: left;
    line-height: 1.8;
    text-align: left;
    transition: all 0.5s;
}
.case_yx1_l_text:hover{
    background: url(../image/yxbg_03.png)no-repeat;
    background-size: 100% 100%;
    color: #fff;
}
.about-list-banner-cont{
    position: absolute;
    top: 16vh;
    left: 0px;
    text-align: center;
    width: 100%;
}
.case_yx1_l_img{
    display: inline-block;
    float: left;
}
.case_yxr_l_img{
    display: inline-block;
    float: left;
}
.case_yxr_l_text{
    background: url(../image/cases_34.png)no-repeat;
    background-size: 100% 100%;
    width: 250px;
    height: 90px;
    display: inline-block;
    margin-right: 15px;
    padding:15px 15px 15px 35px;
    box-sizing: border-box;
    font-size: 14px;
    color: #1e1e1e;
    float: left;
    line-height: 1.8;
    text-align: left;
    transition: all 0.5s;
}
.case_yxr_l_text:hover{
    background: url(../image/cases_12.png)no-repeat;
    background-size: 100% 100%;
    color: #fff;
}
.case_yx1_r_1 .case_yxr_l_text{
    margin-left: 15px;
    margin-top: 10px;
}
.case_yx1_r_1 {
    position: absolute;
    top: -40px;
    right: 60px;
}
.case_yx1_r_2 {
    position: absolute;
    top: 150px;
    right: 0px;
}
.case_yx1_r_2 .case_yxr_l_text{
    margin-left: 15px;
    margin-top: 10px;
}
.case_yx1_r_3{
    position: absolute;
    bottom:50px;
    right: 40px;
}
.case_yx1_r_3 .case_yxr_l_text{
    margin-left: 15px;
    margin-top: 10px;
}
.about-list-banner-cont .tittles{
    text-align: center;
}
.about-list-banner-cont .tittles img{
    vertical-align: middle;
    display: inline-block;
    width: 200px;
}
.about-list-banner-cont .tittles span{
    font-size: 48px;
    color: #136ead;
    font-weight: bold;
    vertical-align: middle;
    display: inline-block;
    margin:0 10px;
}
.about-list-banner .thumbs img{
    display: block;
    width: 100%;
}
.about-list-banner .tittles1{
    font-size: 60px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    margin:30px 0;
}
.about-list-banner .tittles2{
    font-size: 24px;
    color: #ffffff;
    text-align: center;
}
.w1600{
    width: 1600px;
    margin:0 auto;
    box-sizing: border-box;
}
.aobut-wjwh{
    margin-top: 70px;
    margin-bottom: 70px;
}
.aobut-wjwh-title{
    width: 25%;
    float: left;
    display: inline-block;
}
.aobut-wjwh-title p:nth-child(1){
    font-size: 60px;
    font-weight: bold;
    color: #232323;
    margin-bottom: 20px;
}
.aobut-wjwh-list{
    width: 45%;
    display: inline-block;
    float: left;
    margin-bottom: 80px;
}
.aobut-wjwh-list:nth-child(1){
    margin-right: 10%;
}
.aobut-wjwh-list:nth-child(3){
    margin-right: 10%;
}
.aobut-wjwh-list p:nth-child(1){
    font-size: 20px;
    color: #232323;
}
.aobut-wjwh-list p:nth-child(2){
    margin:15x 0;
}
.aobut-wjwh-list p:nth-child(2) span{
    width: 50px;
    height: 2px;
    background: #136ead;
    display: inline-block;
}
.clear{
    clear: both;
}
.aobut-wjwh-list p:nth-child(3){
    font-size: 14px;
    color: #7f7f7f;
    line-height: 1.8;
}
.aobut-wjwh-title p:nth-child(2){
    font-size: 24px;
    color: #232323;
}
.aobut-wjwh-c{
    width: 75%;
    float: left;
    display: inline-block;
}
.header .phone {
	width: 220px;
	height: 50px;
	border-radius: 40px;
	display: flex;
	color: #fff;
	font-weight: bold;
	font-size: 20px;
	transition: 0.3s all ease-in-out;
	position: relative;
	align-items: center;
}



.header .phone .img {
	width: 40px;
	height: 40px;
	border-radius: 30px;
	transition: 0.3s all ease-in-out;
	position: absolute;
	display: flex;
	color: #b21b21;
	line-height: 40px;
	justify-content: center;
	font-size: 24px;
	left: 4px;
	top: 4px;
	background: url( ../image/tel_icon.png) no-repeat;
	background-size: 200%;
	border: 1px solid #fff;
}

.header.active .phone .img{
    background-position: -40px 0px;
    border-color: #000;
}

.header .phone .text {
	position: absolute;
	transition: 0.3s all ease-in-out;
	font-size: 12px;
	width: calc(100% - 50px);
	left: 50px;
	line-height: 1;
	display: flex;
	flex-wrap: wrap;
}
.header .phone .text b {
	font-size: 22px;
	margin-top: 3px;
}

.header .phone .text p{
	font-size: 16px;
}

.header.sub .phone{
	color: #252525;
}

.header.sub .nav a{
	color: #252525;
}


.nav{
	position: relative;
	width: 50%;
	display: flex;
	justify-content: space-between;
}

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

.nav ul li{
	position: relative;
	width: calc(100% / 6);
	text-align: center;
}

.nav ul li>a{
	line-height: 80px;
	position: relative;
	display: block;
}

.nav ul li>a::after{
	width: 0%;
	height: 3px;
	position: absolute;
	left: 50%;
	bottom: 0px;
	content: '';
	background: #ffffff;
	-webkit-transition: all .5s;
	border-radius: 5px;
}
.nav ul li:hover>a::after{
	width: 60%;
	left: 20%;
}
.nav ul li .second{
	width: 150px;
	height: auto;
	position: absolute;
	left: 50%;
    margin-left: -75px;
	top: 80px;
	background: rgba(0, 0, 0, .3);
	color: #fff;
	border-radius: 5px;
	-webkit-transition: all .5s;
	opacity: 0;
	visibility: hidden;
	backdrop-filter: blur(10px);
    padding: 15px 0px;
}

.nav ul li:hover .second{
	opacity: 1;
	visibility: visible;
}

.nav ul li .second a{
	font-size: 14px;
	display: block;
	width: 100%;
	text-align: center;
	font-weight: normal;
	line-height: 40px;
}

.nav ul li .second a:last-child{
	border-bottom:none;
}

.header.active .nav ul li .second a{
    color: #fff;
}

.nav a{
	color: #fff;
	font-size: 18px;

}

.singePage .anli_total p{
    margin-bottom: 0px;
}

.copytips{
    width: 100%;
    margin-top: 15px;
    line-height: 1.7;
}



.nav_bar{
    width: 130px;
    height: auto;
    position: fixed;
    z-index: 100;
    background: #fff;
    right: 1%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    border-radius: 10px;
    border: 1px solid #45cb7a;
    padding: 15px;
}

.nav_bar h2{
    display: block;
    font-size: 26px;
    font-weight: bold;
    font-family: Arial;
    color: #45cb7a;
    margin-top: 15px;
    margin-bottom: 15px;
    text-align: center;
}

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

.nav_bar .tips{
    width: 100%;
    text-align: center;
    font-size: 14px;
    line-height: 1.4;
    color: #45cb7a;
    margin-top: 8px;
}

.st_kf{
    width: 100%;
    height: auto;
    position: relative;
    text-align: center;
    padding: 12px 0px;
    color: #45cb7a;
    margin-top: 20px;
    margin-bottom: 20px;
}

.st_kf:before{
    width: 130px;
    height: 1px;
    position: absolute;
    left: -16px;
    top: 0px;
    content: '';
    background: #45cb7a;
}
.st_kf:after{
    width: 130px;
    height: 1px;
    position: absolute;
    left: -16px;
    bottom: 0px;
    content: '';
    background: #45cb7a;
}

.st_kf a{
    display: block;
    width: 100%;
    height: auto;
    line-height: 35px;
    background: #45cb7a;
    color: #fff;
    border-radius: 40px;
    text-align: center;
    position: relative;
}

.st_dh{
    text-align: center;
    position: relative;
    color: #45cb7a;
}

.st_dh b{
    font-size: 16px;
}

.copytips{
    width: 50%;
    margin-top: 15px;
    line-height: 1.7;
}
.pchide{
    display: none;
}

.case_img{
	width: 100%;
	height: 100vh;
	position: absolute;
	left: 0%;
	top: 0%;
	background: center center no-repeat;
	background-size: cover;
}

.case_img img{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0%;
    top: 0%;
    transform: scale(1.1);
    filter: blur(10px);
}

.case_img::after{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0%;
	bottom: 0%;
	background: linear-gradient(-180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	content: '';
	z-index: 2;
}

.cd_icon{
	width: 100%;
	display: flex;
	align-items: center;
	position: relative;
	margin-top: 30vh;
	margin-bottom: 1vw;
}

.cd_title{
	width: 100%;
	position: relative;
	color: #fff;
	font-size: 3vw;
	font-weight: bold;
	margin-top: 15vh;
}

.cd_title p{
	width: auto;
	display: inline;
	position: relative;
	z-index: 2;
	line-height: 1;
}

.cd_title p::before{
	width: 100%;
	height: 1.5vw;
	position: absolute;
	left: 0px;
	top: 76%;
	-webkit-transform: translateY(-50%);
	content: '';
	background-image: linear-gradient(to left, rgba(288,11,11,0) 0%, #45cb7a 100%);
	z-index: -1;
}

.cd_icon .icon{
	width: 25px;
}

.cd_icon .txt{
	color: #fff;
	margin-left: 5px;
	position: relative;
	z-index: 2;
}

.nav_open{
    display: none;
}

.cd_icon .txt::before{
	width: 75px;
	height: 7px;
	position: absolute;
	right: 0px;
	bottom: 0px;
	
	content: '';
	background-image: linear-gradient(to right, rgba(288,11,11,0) 0%, #45cb7a 100%);
	z-index: -1;
}

.cd_info{
	width: 100%;
	height: auto;
	position: relative;
	font-size: 16px;
	line-height: 2;
	color: #fff;
	margin-top: 2vw;
	margin-bottom:3vw;
}

.cd_right_top{
	width: 100%;
	display: flex;
	justify-content: space-between;

}

.cd_right_top .cd_btn{
	width: auto;
}

.cd_right_top .cd_btn .icon{
	width: 45px;
	height: 45px;
	position: relative;
	border: 2px solid #ffffff;
	border-radius: 5px;
	margin: 0px auto;
}

.cd_right_top .cd_btn .txt{
	color: #fff;
	margin-top: 7px;
}

.cd_right_top .cd_btn .icon::after{
	width: 25px;
	height: 25px;
	position: absolute;
	top: 8px;
	left: 8px;
	background: url(../image/st_arrow.png) no-repeat;
	background-size: cover;
	content: '';
}

.cd_right_top .cd_btn.next .icon::after{
	-webkit-transform: rotate(180deg);
}

.cd_right_top .cd_btn.back .icon::after{
	width: 30px;
	height: 30px;
	top: 5.5px;
	left: 5.5px;
	background-image: url(../image/st_list.png);
}

.cd_right_link{
	width: auto;
    height: 60px;
    font-size: 16px;
    position: relative;
    line-height: 16px;
    text-align: center;
    border-radius: 50px;
    border: 1px solid #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    margin-top: 3vw;
    padding: 0px 25px;
    cursor: pointer;
}


.cd_right_link:hover{
    border-color: #45cb7a;
}

.cd_right_link:after{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    border-radius: 50px;
    content: '';
    transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    background: #45cb7a;
    opacity: 0;
}

.cd_right_link:hover:after{
    opacity: 1;
}

.cd_right_link img{
    position: relative;
    z-index: 2;
    width: 25px;
    margin-right: 5px;
}
.cd_right_link p{
    width: auto;
    position: relative;
    z-index: 2;
}



.cd_right_tips{
	width: 100%;
	font-size: 16px;
	line-height: 2;
}

.cd_right_tips b{
	display: block;
	width: 100%;
	font-size: 2.2vw;
	line-height: 1.4;
}

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

.cd_right_arrow a{
	width: 100%;
	display: flex;
	align-items: center;
	position: relative;
	border: 1px solid #fff;
	border-radius: 50px;
	color: #fff;
	padding: 10px 25px;
	font-size: 16px;
	justify-content: center;
	margin-bottom: 20px;
}

.cd_right_arrow a .icon{
	font-size: 24px;
	margin-right: 15px;
}

.cd_right_link .icon{
	width: 50px;
	
	border-radius: 50%;
	padding: 10px;
}

.cd_right_link .txt{
	width: calc(100% - 50px);
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 18px;
	color: #45cb7a;
}

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

.cd_mark span{
	color: rgba(255, 255, 255, .75);
	border: 1px solid rgba(255, 255, 255, .4);
	border-radius: 5px;
	padding: 7px 15px;
	margin-right: 10px;
	margin-bottom: 10px;
	font-size: 12px;
}

.cd_detail{
	width: 100%;
	position: relative;
	margin-top: 5vw;
}

.cd_content{
	width: 100%;
	position: relative;
	background: #eff3f6;
	min-height: 50vh;
	padding: 0px;
}

.cd_content img{
	width: 100%;
	margin-bottom: 25px;
}

.cd_content img:last-child{
	margin-bottom: 0px;
}

.cd_right{
	width: 50px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	position: absolute;
	padding: 0px;
	border-radius: 50px;
	top: 0px;
    right: 0px;
    overflow: hidden;
}

.call_me{
	width: 100%;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	color: #fff;
}

.call_me b{
	font-size: 1.4vw;
}

.call_me p{
	font-size: 34px;
	font-family: BrownBlod;
}

.boxes {
	background: transparent;
	padding: 5vw 0px;
}

.b1 {
	height: 100vh;
}

.anli_title2{
    width: 100%;
    display: flex;
    justify-content: center;
    position: relative;
    margin-bottom: 25px;
}

.anli_title2 strong{
    position: relative;
    padding: 10px 45px;
    width: auto;
    text-align: center;
    border-top: 1px solid #bb0a0a;
    border-bottom: 1px solid #bb0a0a;
    color: #bb0a0a;
}

.anli_title2 strong:after{
    width: 30px;
    height: 30px;
    position: absolute;
    left: 2px;
    top: -10px;
    background: url( ../image/marks2.png) no-repeat;
    background-size: cover;
    content: '';
}

.anli_total{
    background: #f9f9f9;
    padding: 25px;
    padding-left: 35px;
    border-left: 5px solid #bb0a0a;
}

.anli_title{
    width: 100%;
    height: auto;
    text-align: center;
    position: relative;
    margin-bottom: 2vw;
}

.anli_title h1{
    position: relative;
    text-align: center;
}

.anli_title .b{
    font-size: 12vw;
    color: #bb0a0a;
    line-height: 1;
    font-family: BrownBlod;
    font-weight: bold;
    position: relative;
    
}
.anli_title .b p{
    font-size: 14px;
    position: absolute;
    top: 58%;
    -webkit-transform: translateY(-50%);
    margin-bottom: 0px;
    text-align: center;
    width: 100%;
    background: #fff;
    padding: 5px;
}

.singePage h1{
    font-size: 24px;
    color: #bb0a0a;
}
.singePage h2{
    font-size: 18px;
}

.singePage img{
    width: auto;
    display: inline-block;
}

.map{
    width: 100%;
    height: 50vh;
}

table,tr,td,.singePage video{
    width: 100%;
    display: block;
    height: auto;
}


.bg{
	width: 100%;
	height: 100vh;
	position: fixed;
	left: 0%;
	top: 0%;
	background: #000;
	display: none;
}
.boxes.b{
    background: #fffcf4;
}

.scene_img {
	width: 100vw;
	height: 100vw;
	position: absolute;
	left: 0%;
	top: 0%;
}

.simg {
	position: absolute;
	width: 100vw;
	height: 100vh;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%) scale(1);
	overflow: hidden;
	background: #000;
}

.simg img ,.simg video{
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%;
	height: 100%;
	position: relative;
	top: 0%;
}

.author{
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 1vw;
        opacity: .5;
}

.author .img{
    width: 40px;
    height: auto;
}
.author .txt{
    width: calc(100% - 60px);
    margin-left: 5px;
    font-family: alibaba;
    line-height: 1.2;
}
.author .txt b{
    display: block;
    width: 100%;
    margin-bottom: 3px;
    font-weight: normal;
}
.boxes.w{
    background: #fff;
}

.friend_links{
    width: 100%;
    height: auto;
    position: relative;
    display: block;
    font-size: 12px;
    line-height: 25px;
    border-bottom: 1px solid rgba(0,0,0,.05);
    padding-bottom: 10px;
}

.friend_links b{
    display: block;
}
.friend_links .links{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.friend_links .links a{
    margin-right: 10px;
    color: rgba(0,0,0,.5);
}

.slogan{
	width: 70vw;
	height: auto;
	position: absolute;
	top: 45%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	font-weight: bold;
	line-height: 1.6;
}
.slogan .p{
	color: #fff;
	font-size: 2.4vw;
	font-weight: bold;
	font-weight: normal;
	letter-spacing: 0.2vw;
	margin-bottom: 0.5vw;
	width: 100%;
	opacity: 0;
	position: relative;
	top: 50px;
	-webkit-transition: all 1s;
	font-weight: bold;
}
.slogan .b{
	display: block;
	font-size: 2vw;
	color: #fff;
	font-weight: normal;
	opacity: 0;
	position: relative;
	-webkit-transition: all 1s ease .1s;
	top: 100px;
	margin-bottom: 0.5vw;
}

.slogan .q{
    color: #fff;
    font-size: 4vw;
    opacity: 0;
    position: relative;
    top: 150px;
    -webkit-transition: all 1s ease .3s;
}

.slogan.active .p,.slogan.active .b{
	opacity: 1;
	top: 0px;
}
.slogan.active .q{
    opacity: 1;
	top: 0px;
}

@keyframes marqueeOne {
	0% {
		transform: translate3d(var(--move-initial), 0, 0);
	}

	100% {
		transform: translate3d(var(--move-final), 0, 0);
	}
}

@keyframes marqueeTwo {
	0% {
		transform: translate3d(var(--move-final), 0, 0);
	}

	100% {
		transform: translate3d(var(--move-initial), 0, 0);
	}
}

.marquee {
	position: absolute;
	overflow: hidden;
	--offset: 20vw;
	--move-initial: calc(0% + var(--offset));
	--move-final: calc(-50% + var(--offset));
	font-family: montserrat;
	font-weight: bold;
	width: 120vw;
	left: -10vw;
	top: 50%;
	-webkit-transform: translateY(-50%) rotate(-15deg);
}

.marquee__inner {
	width: fit-content;
	display: flex;
	position: relative;
	white-space: nowrap;
	margin-bottom: 4vw;
}

.marquee__inner span {
	font-size: 6vw;
	padding: 0 2vw;
	text-transform: uppercase;
	color: #fff;
}

.marquee .first {
	transform: translate3d(var(--move-initial), 0, 0);
	animation: marqueeOne 30s linear infinite;
}

.marquee .three {
	transform: translate3d(var(--move-initial), 0, 0);
	animation: marqueeOne 30s linear infinite;
}

.marquee span:nth-child(even) {
	-webkit-text-stroke: 2px #fff;
	-webkit-text-fill-color: transparent;
}

.marquee .second {
	transform: translate3d(var(--final-initial), 0, 0);
	animation: marqueeTwo 40s linear infinite;
}

.sub_title{
	position: relative;
	color: #000;
	line-height: 1.5;
	margin-bottom: 3vw;
}
.sub_title.c{
	text-align: center;
}
.sub_title b{
	font-size: 2vw;
	font-weight: bold;
	margin-bottom: 0.5vw;
	display: block;
	line-height: 1.2;
}

.sub_title.r{
	text-align: right;
}

.sub_title.w{
	color: #fff;
}

header{
	position: fixed;
	width: 100%;
	height: auto;
	left: 0%;
	top: 0%;
	z-index: 100;
	padding: 0px 8%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	-webkit-transition: all .45s;
}
.header.hide {
    -webkit-transform: translateY(-100%);
}
.header.active{
    background: rgba(0,0,0,0.9);
	box-shadow: 0px 0px 30px rgb(0 0 0 / 5%);
}
.about3{
    background: #1c1c1c;
}
.about3-img{
    width: 50%;
    float: left;
    display: inline-block;
}
.about3-img img{
    width: 100%;
    display: block;
}
.about3-text{
    width: 50%;
    float: left;
    display: inline-block;
    padding-top: 80px;
    padding-left: 50px;
    padding-right: 100px;
}
.about3-text p:nth-child(1){
    font-size: 48px;
    font-weight: bold;
    color: #136ead;
    text-align: center;
    margin-bottom: 20px;
}
.about3-text p:nth-child(1) span{
    color: #ffffff;
}
.about3-text p:nth-child(2){
    margin-bottom: 50px;
    color: #ffffff;
    font-size: 16px;
    text-align: center;
}
.about3-text p:nth-child(3){
    font-size: 14px;
    color: #fff;
    line-height: 2;
}
.about4-title{
width: 25%;
    float: left;
    display: inline-block;
}
.about4-title p:nth-child(1){
    font-size: 60px;
    font-weight: bold;
    color: #232323;
    margin-bottom: 20px;
}
.about4-title p:nth-child(2){
    font-size: 24px;
    color: #232323;
}
.about4-content{
    width: 75%;
    float: left;
    display: inline-block;
}
.about4-content .thumbs{
    width: 20%;
    display: inline-block;
    float: left;
}
.about4-content .thumbs img{
    display: block;
    width: 100%;
}
.about4-content .conts{
    width: 70%;
    display: inline-block;
    float: left;
    padding-left: 5%;
}
.about4{
    padding:120px 0;
}
.about4-content .conts p:nth-child(1){
    font-size: 24px;
    color: #232323;
}
.about4-content .conts p:nth-child(2){
    font-size: 16px;
    color: #232323;
    line-height: 2;
    margin-top: 20px;
}
.list-footers{
    padding-top: 80px;
    padding-bottom: 130px;
    background: #161616;
}
.list-footers-list{
    display: inline-block;
    float: left;
}
.list-footers-list2{
    width: 30%;
}
.list-footers-list2 div{
    margin-bottom: 20px;
    vertical-align: middle;
}
.list-footers-list2 div img{
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
}
.list-footers-list2 div span{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    color: #ffffff;
}
.list-footers-list3{
    text-align: right;
    width: 30%;
}
.list-footers-list1{
    text-align: left;
    width: 40%;
}
header.active nav a{
	color: #000;
}
header.active .phone{
	color: #000;
}
header .logo{
	width: 200px;
	height: auto;
	position: relative;
}
.header .logo img:nth-child(2){
	position: absolute;
	width: 100%;
	height: auto;
	opacity: 0;
	left: 0%;
	top: 0%;
	-webkit-transition: all .5s;
}

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

nav{
	width: 50%;
	display: flex;
}
nav ul{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
nav ul li{
    width: auto;
    height: auto;
    position: relative;
}
nav a{
	width: auto;
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	padding: 35px 0vw;
	position: relative;
	display: block;
}
nav .second-level:after{
    width: auto;
    height: auto;
    position: absolute;
    left: 50%;
    margin-left: -6px;
    top: -6px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    content: '';
}
nav a .first-level{
	width: 100%;
	height: 20px;
	line-height: 20px;
	position: relative;
	overflow: hidden;
}
nav .second-level{
    width: 150px;
    height: auto;
    position: absolute;
    left: 50%;
    margin-left: -75px;
    top: 70px;
    background: #fff;
    color: #3e3e3e;
    padding: 15px;
    border-radius: 5px;
    display: none;
    text-align: center;
    box-shadow: 0px 0px 30px rgb(0 0 0 / 10%);
}

nav ul li:hover .second-level{
    display: block;
}

nav .second-level a{
    padding: 0px;
    font-size: 16px;
    color: #3e3e3e;
    line-height: 30px;
}

nav .second-level a:hover{
    color: #bb0a0a;
}

nav a .first-level p:first-child{
	-webkit-transition: all .5s;
}
nav a:hover .first-level p:first-child{
	margin-top: -20px;
	opacity: 0;
}

.glitch {
  color: black;
  font-size: 150px;
  text-transform: upercase;
  position: relative;
  display: inline-block;
}
.glitch::before,
.glitch::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.glitch::before {
  left: 2px;
  text-shadow: -2px 0 #49FC00;
  clip: rect(24px, 550px, 90px, 0);
  -webkit-animation: glitch-anim-2 3.5s infinite linear alternate-reverse;
          animation: glitch-anim-2 3.5s infinite linear alternate-reverse;
}
.glitch::after {
  left: -2px;
  text-shadow: -2px 0 #b300fc;
  clip: rect(85px, 550px, 140px, 0);
  -webkit-animation: glitch-anim 3.5s infinite linear alternate-reverse;
          animation: glitch-anim 3.5s infinite linear alternate-reverse;
}
@-webkit-keyframes glitch-anim {
  0% {
    clip: rect(110px, 9999999px, 74px, 0);
  }
  4.16666667% {
    clip: rect(135px, 9999999px, 143px, 0);
  }
  8.33333333% {
    clip: rect(100px, 9999999px, 100px, 0);
  }
  12.5% {
    clip: rect(38px, 9999999px, 24px, 0);
  }
  16.66666667% {
    clip: rect(125px, 9999999px, 83px, 0);
  }
  20.83333333% {
    clip: rect(149px, 9999999px, 63px, 0);
  }
  25% {
    clip: rect(12px, 9999999px, 104px, 0);
  }
  29.16666667% {
    clip: rect(68px, 9999999px, 7px, 0);
  }
  33.33333333% {
    clip: rect(77px, 9999999px, 20px, 0);
  }
  37.5% {
    clip: rect(99px, 9999999px, 6px, 0);
  }
  41.66666667% {
    clip: rect(27px, 9999999px, 99px, 0);
  }
  45.83333333% {
    clip: rect(58px, 9999999px, 107px, 0);
  }
  50% {
    clip: rect(108px, 9999999px, 77px, 0);
  }
  54.16666667% {
    clip: rect(58px, 9999999px, 87px, 0);
  }
  58.33333333% {
    clip: rect(142px, 9999999px, 112px, 0);
  }
  62.5% {
    clip: rect(124px, 9999999px, 125px, 0);
  }
  66.66666667% {
    clip: rect(61px, 9999999px, 53px, 0);
  }
  70.83333333% {
    clip: rect(117px, 9999999px, 74px, 0);
  }
  75% {
    clip: rect(21px, 9999999px, 74px, 0);
  }
  79.16666667% {
    clip: rect(117px, 9999999px, 70px, 0);
  }
  83.33333333% {
    clip: rect(87px, 9999999px, 122px, 0);
  }
  87.5% {
    clip: rect(95px, 9999999px, 9px, 0);
  }
  91.66666667% {
    clip: rect(121px, 9999999px, 75px, 0);
  }
  95.83333333% {
    clip: rect(121px, 9999999px, 115px, 0);
  }
  100% {
    clip: rect(101px, 9999999px, 72px, 0);
  }
}
@-o-keyframes glitch-anim {
  0% {
    clip: rect(110px, 9999999px, 74px, 0);
  }
  4.16666667% {
    clip: rect(135px, 9999999px, 143px, 0);
  }
  8.33333333% {
    clip: rect(100px, 9999999px, 100px, 0);
  }
  12.5% {
    clip: rect(38px, 9999999px, 24px, 0);
  }
  16.66666667% {
    clip: rect(125px, 9999999px, 83px, 0);
  }
  20.83333333% {
    clip: rect(149px, 9999999px, 63px, 0);
  }
  25% {
    clip: rect(12px, 9999999px, 104px, 0);
  }
  29.16666667% {
    clip: rect(68px, 9999999px, 7px, 0);
  }
  33.33333333% {
    clip: rect(77px, 9999999px, 20px, 0);
  }
  37.5% {
    clip: rect(99px, 9999999px, 6px, 0);
  }
  41.66666667% {
    clip: rect(27px, 9999999px, 99px, 0);
  }
  45.83333333% {
    clip: rect(58px, 9999999px, 107px, 0);
  }
  50% {
    clip: rect(108px, 9999999px, 77px, 0);
  }
  54.16666667% {
    clip: rect(58px, 9999999px, 87px, 0);
  }
  58.33333333% {
    clip: rect(142px, 9999999px, 112px, 0);
  }
  62.5% {
    clip: rect(124px, 9999999px, 125px, 0);
  }
  66.66666667% {
    clip: rect(61px, 9999999px, 53px, 0);
  }
  70.83333333% {
    clip: rect(117px, 9999999px, 74px, 0);
  }
  75% {
    clip: rect(21px, 9999999px, 74px, 0);
  }
  79.16666667% {
    clip: rect(117px, 9999999px, 70px, 0);
  }
  83.33333333% {
    clip: rect(87px, 9999999px, 122px, 0);
  }
  87.5% {
    clip: rect(95px, 9999999px, 9px, 0);
  }
  91.66666667% {
    clip: rect(121px, 9999999px, 75px, 0);
  }
  95.83333333% {
    clip: rect(121px, 9999999px, 115px, 0);
  }
  100% {
    clip: rect(101px, 9999999px, 72px, 0);
  }
}
@-moz-keyframes glitch-anim {
  0% {
    clip: rect(110px, 9999999px, 74px, 0);
  }
  4.16666667% {
    clip: rect(135px, 9999999px, 143px, 0);
  }
  8.33333333% {
    clip: rect(100px, 9999999px, 100px, 0);
  }
  12.5% {
    clip: rect(38px, 9999999px, 24px, 0);
  }
  16.66666667% {
    clip: rect(125px, 9999999px, 83px, 0);
  }
  20.83333333% {
    clip: rect(149px, 9999999px, 63px, 0);
  }
  25% {
    clip: rect(12px, 9999999px, 104px, 0);
  }
  29.16666667% {
    clip: rect(68px, 9999999px, 7px, 0);
  }
  33.33333333% {
    clip: rect(77px, 9999999px, 20px, 0);
  }
  37.5% {
    clip: rect(99px, 9999999px, 6px, 0);
  }
  41.66666667% {
    clip: rect(27px, 9999999px, 99px, 0);
  }
  45.83333333% {
    clip: rect(58px, 9999999px, 107px, 0);
  }
  50% {
    clip: rect(108px, 9999999px, 77px, 0);
  }
  54.16666667% {
    clip: rect(58px, 9999999px, 87px, 0);
  }
  58.33333333% {
    clip: rect(142px, 9999999px, 112px, 0);
  }
  62.5% {
    clip: rect(124px, 9999999px, 125px, 0);
  }
  66.66666667% {
    clip: rect(61px, 9999999px, 53px, 0);
  }
  70.83333333% {
    clip: rect(117px, 9999999px, 74px, 0);
  }
  75% {
    clip: rect(21px, 9999999px, 74px, 0);
  }
  79.16666667% {
    clip: rect(117px, 9999999px, 70px, 0);
  }
  83.33333333% {
    clip: rect(87px, 9999999px, 122px, 0);
  }
  87.5% {
    clip: rect(95px, 9999999px, 9px, 0);
  }
  91.66666667% {
    clip: rect(121px, 9999999px, 75px, 0);
  }
  95.83333333% {
    clip: rect(121px, 9999999px, 115px, 0);
  }
  100% {
    clip: rect(101px, 9999999px, 72px, 0);
  }
}
@keyframes glitch-anim {
  0% {
    clip: rect(110px, 9999999px, 74px, 0);
  }
  4.16666667% {
    clip: rect(135px, 9999999px, 143px, 0);
  }
  8.33333333% {
    clip: rect(100px, 9999999px, 100px, 0);
  }
  12.5% {
    clip: rect(38px, 9999999px, 24px, 0);
  }
  16.66666667% {
    clip: rect(125px, 9999999px, 83px, 0);
  }
  20.83333333% {
    clip: rect(149px, 9999999px, 63px, 0);
  }
  25% {
    clip: rect(12px, 9999999px, 104px, 0);
  }
  29.16666667% {
    clip: rect(68px, 9999999px, 7px, 0);
  }
  33.33333333% {
    clip: rect(77px, 9999999px, 20px, 0);
  }
  37.5% {
    clip: rect(99px, 9999999px, 6px, 0);
  }
  41.66666667% {
    clip: rect(27px, 9999999px, 99px, 0);
  }
  45.83333333% {
    clip: rect(58px, 9999999px, 107px, 0);
  }
  50% {
    clip: rect(108px, 9999999px, 77px, 0);
  }
  54.16666667% {
    clip: rect(58px, 9999999px, 87px, 0);
  }
  58.33333333% {
    clip: rect(142px, 9999999px, 112px, 0);
  }
  62.5% {
    clip: rect(124px, 9999999px, 125px, 0);
  }
  66.66666667% {
    clip: rect(61px, 9999999px, 53px, 0);
  }
  70.83333333% {
    clip: rect(117px, 9999999px, 74px, 0);
  }
  75% {
    clip: rect(21px, 9999999px, 74px, 0);
  }
  79.16666667% {
    clip: rect(117px, 9999999px, 70px, 0);
  }
  83.33333333% {
    clip: rect(87px, 9999999px, 122px, 0);
  }
  87.5% {
    clip: rect(95px, 9999999px, 9px, 0);
  }
  91.66666667% {
    clip: rect(121px, 9999999px, 75px, 0);
  }
  95.83333333% {
    clip: rect(121px, 9999999px, 115px, 0);
  }
  100% {
    clip: rect(101px, 9999999px, 72px, 0);
  }
}
@-webkit-keyframes glitch-anim-2 {
  6.66666667% {
    clip: rect(76px, 9999999px, 132px, 0);
  }
  10% {
    clip: rect(13px, 9999999px, 82px, 0);
  }
  13.33333333% {
    clip: rect(97px, 9999999px, 2px, 0);
  }
  16.66666667% {
    clip: rect(1px, 9999999px, 147px, 0);
  }
  20% {
    clip: rect(113px, 9999999px, 124px, 0);
  }
  23.33333333% {
    clip: rect(132px, 9999999px, 130px, 0);
  }
  26.66666667% {
    clip: rect(120px, 9999999px, 32px, 0);
  }
  30% {
    clip: rect(2px, 9999999px, 10px, 0);
  }
  33.33333333% {
    clip: rect(76px, 9999999px, 46px, 0);
  }
  36.66666667% {
    clip: rect(140px, 9999999px, 79px, 0);
  }
  40% {
    clip: rect(37px, 9999999px, 67px, 0);
  }
  43.33333333% {
    clip: rect(133px, 9999999px, 95px, 0);
  }
  46.66666667% {
    clip: rect(6px, 9999999px, 16px, 0);
  }
  50% {
    clip: rect(98px, 9999999px, 123px, 0);
  }
  53.33333333% {
    clip: rect(42px, 9999999px, 88px, 0);
  }
  56.66666667% {
    clip: rect(77px, 9999999px, 110px, 0);
  }
  60% {
    clip: rect(22px, 9999999px, 145px, 0);
  }
  63.33333333% {
    clip: rect(47px, 9999999px, 75px, 0);
  }
  66.66666667% {
    clip: rect(109px, 9999999px, 135px, 0);
  }
  70% {
    clip: rect(118px, 9999999px, 40px, 0);
  }
  73.33333333% {
    clip: rect(74px, 9999999px, 141px, 0);
  }
  76.66666667% {
    clip: rect(59px, 9999999px, 100px, 0);
  }
  80% {
    clip: rect(14px, 9999999px, 32px, 0);
  }
  83.33333333% {
    clip: rect(22px, 9999999px, 28px, 0);
  }
  86.66666667% {
    clip: rect(106px, 9999999px, 74px, 0);
  }
  90% {
    clip: rect(33px, 9999999px, 97px, 0);
  }
  93.33333333% {
    clip: rect(94px, 9999999px, 29px, 0);
  }
  96.66666667% {
    clip: rect(108px, 9999999px, 87px, 0);
  }
  100% {
    clip: rect(5px, 9999999px, 14px, 0);
  }
}
@-o-keyframes glitch-anim-2 {
  6.66666667% {
    clip: rect(76px, 9999999px, 132px, 0);
  }
  10% {
    clip: rect(13px, 9999999px, 82px, 0);
  }
  13.33333333% {
    clip: rect(97px, 9999999px, 2px, 0);
  }
  16.66666667% {
    clip: rect(1px, 9999999px, 147px, 0);
  }
  20% {
    clip: rect(113px, 9999999px, 124px, 0);
  }
  23.33333333% {
    clip: rect(132px, 9999999px, 130px, 0);
  }
  26.66666667% {
    clip: rect(120px, 9999999px, 32px, 0);
  }
  30% {
    clip: rect(2px, 9999999px, 10px, 0);
  }
  33.33333333% {
    clip: rect(76px, 9999999px, 46px, 0);
  }
  36.66666667% {
    clip: rect(140px, 9999999px, 79px, 0);
  }
  40% {
    clip: rect(37px, 9999999px, 67px, 0);
  }
  43.33333333% {
    clip: rect(133px, 9999999px, 95px, 0);
  }
  46.66666667% {
    clip: rect(6px, 9999999px, 16px, 0);
  }
  50% {
    clip: rect(98px, 9999999px, 123px, 0);
  }
  53.33333333% {
    clip: rect(42px, 9999999px, 88px, 0);
  }
  56.66666667% {
    clip: rect(77px, 9999999px, 110px, 0);
  }
  60% {
    clip: rect(22px, 9999999px, 145px, 0);
  }
  63.33333333% {
    clip: rect(47px, 9999999px, 75px, 0);
  }
  66.66666667% {
    clip: rect(109px, 9999999px, 135px, 0);
  }
  70% {
    clip: rect(118px, 9999999px, 40px, 0);
  }
  73.33333333% {
    clip: rect(74px, 9999999px, 141px, 0);
  }
  76.66666667% {
    clip: rect(59px, 9999999px, 100px, 0);
  }
  80% {
    clip: rect(14px, 9999999px, 32px, 0);
  }
  83.33333333% {
    clip: rect(22px, 9999999px, 28px, 0);
  }
  86.66666667% {
    clip: rect(106px, 9999999px, 74px, 0);
  }
  90% {
    clip: rect(33px, 9999999px, 97px, 0);
  }
  93.33333333% {
    clip: rect(94px, 9999999px, 29px, 0);
  }
  96.66666667% {
    clip: rect(108px, 9999999px, 87px, 0);
  }
  100% {
    clip: rect(5px, 9999999px, 14px, 0);
  }
}
@-moz-keyframes glitch-anim-2 {
  6.66666667% {
    clip: rect(76px, 9999999px, 132px, 0);
  }
  10% {
    clip: rect(13px, 9999999px, 82px, 0);
  }
  13.33333333% {
    clip: rect(97px, 9999999px, 2px, 0);
  }
  16.66666667% {
    clip: rect(1px, 9999999px, 147px, 0);
  }
  20% {
    clip: rect(113px, 9999999px, 124px, 0);
  }
  23.33333333% {
    clip: rect(132px, 9999999px, 130px, 0);
  }
  26.66666667% {
    clip: rect(120px, 9999999px, 32px, 0);
  }
  30% {
    clip: rect(2px, 9999999px, 10px, 0);
  }
  33.33333333% {
    clip: rect(76px, 9999999px, 46px, 0);
  }
  36.66666667% {
    clip: rect(140px, 9999999px, 79px, 0);
  }
  40% {
    clip: rect(37px, 9999999px, 67px, 0);
  }
  43.33333333% {
    clip: rect(133px, 9999999px, 95px, 0);
  }
  46.66666667% {
    clip: rect(6px, 9999999px, 16px, 0);
  }
  50% {
    clip: rect(98px, 9999999px, 123px, 0);
  }
  53.33333333% {
    clip: rect(42px, 9999999px, 88px, 0);
  }
  56.66666667% {
    clip: rect(77px, 9999999px, 110px, 0);
  }
  60% {
    clip: rect(22px, 9999999px, 145px, 0);
  }
  63.33333333% {
    clip: rect(47px, 9999999px, 75px, 0);
  }
  66.66666667% {
    clip: rect(109px, 9999999px, 135px, 0);
  }
  70% {
    clip: rect(118px, 9999999px, 40px, 0);
  }
  73.33333333% {
    clip: rect(74px, 9999999px, 141px, 0);
  }
  76.66666667% {
    clip: rect(59px, 9999999px, 100px, 0);
  }
  80% {
    clip: rect(14px, 9999999px, 32px, 0);
  }
  83.33333333% {
    clip: rect(22px, 9999999px, 28px, 0);
  }
  86.66666667% {
    clip: rect(106px, 9999999px, 74px, 0);
  }
  90% {
    clip: rect(33px, 9999999px, 97px, 0);
  }
  93.33333333% {
    clip: rect(94px, 9999999px, 29px, 0);
  }
  96.66666667% {
    clip: rect(108px, 9999999px, 87px, 0);
  }
  100% {
    clip: rect(5px, 9999999px, 14px, 0);
  }
}
@keyframes glitch-anim-2 {
  6.66666667% {
    clip: rect(76px, 9999999px, 132px, 0);
  }
  10% {
    clip: rect(13px, 9999999px, 82px, 0);
  }
  13.33333333% {
    clip: rect(97px, 9999999px, 2px, 0);
  }
  16.66666667% {
    clip: rect(1px, 9999999px, 147px, 0);
  }
  20% {
    clip: rect(113px, 9999999px, 124px, 0);
  }
  23.33333333% {
    clip: rect(132px, 9999999px, 130px, 0);
  }
  26.66666667% {
    clip: rect(120px, 9999999px, 32px, 0);
  }
  30% {
    clip: rect(2px, 9999999px, 10px, 0);
  }
  33.33333333% {
    clip: rect(76px, 9999999px, 46px, 0);
  }
  36.66666667% {
    clip: rect(140px, 9999999px, 79px, 0);
  }
  40% {
    clip: rect(37px, 9999999px, 67px, 0);
  }
  43.33333333% {
    clip: rect(133px, 9999999px, 95px, 0);
  }
  46.66666667% {
    clip: rect(6px, 9999999px, 16px, 0);
  }
  50% {
    clip: rect(98px, 9999999px, 123px, 0);
  }
  53.33333333% {
    clip: rect(42px, 9999999px, 88px, 0);
  }
  56.66666667% {
    clip: rect(77px, 9999999px, 110px, 0);
  }
  60% {
    clip: rect(22px, 9999999px, 145px, 0);
  }
  63.33333333% {
    clip: rect(47px, 9999999px, 75px, 0);
  }
  66.66666667% {
    clip: rect(109px, 9999999px, 135px, 0);
  }
  70% {
    clip: rect(118px, 9999999px, 40px, 0);
  }
  73.33333333% {
    clip: rect(74px, 9999999px, 141px, 0);
  }
  76.66666667% {
    clip: rect(59px, 9999999px, 100px, 0);
  }
  80% {
    clip: rect(14px, 9999999px, 32px, 0);
  }
  83.33333333% {
    clip: rect(22px, 9999999px, 28px, 0);
  }
  86.66666667% {
    clip: rect(106px, 9999999px, 74px, 0);
  }
  90% {
    clip: rect(33px, 9999999px, 97px, 0);
  }
  93.33333333% {
    clip: rect(94px, 9999999px, 29px, 0);
  }
  96.66666667% {
    clip: rect(108px, 9999999px, 87px, 0);
  }
  100% {
    clip: rect(5px, 9999999px, 14px, 0);
  }
}
.b3{
	background: #fff;
}
.st_year{
	font-family: BrownBlod;
	font-size: 20vw;
	text-align: center;
	color: #45cb7a;
	line-height: 1;
	font-weight: bold;
	position: relative;
	-webkit-transform: scale(1);
	opacity: 1;

}

.hcase{
	width: 100%;
	position: relative;
	margin-bottom: 5vw;
}
.hcase ul{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
}
.hcase ul li{
	width: 49%;
	position: relative;
	margin-bottom: 3vw;
	perspective: 1000px;
}
.hcase ul li:nth-child(10){
	margin-bottom: 0px;
}
.hcase ul li:last-child{
	margin-bottom: 0px;
}
.hcase ul li a{
	display: block;
	position: relative;
	width: 100%;
}
.hcase ul li a img{
    transition: transform 0.5s ease;
}
.hcase ul li a .thum{
    transition: transform 0.5s ease;
    border-radius: 0.7vw;
    margin-bottom: 1.5vw;
}

.hcase ul li a .en_box,.hcase ul li a .cn_box{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
}

.hcase ul li a .cn_box{
    margin-top: 0.5vw;
}

.hcase ul li a .en_box .e_1,.hcase ul li a .en_box .e_2,.hcase ul li a .cn_box .t_1,.hcase ul li a .cn_box .t_2{
    display: inline-block;
    overflow: hidden;
    perspective: 1000px;
    perspective-origin: -150% 50%;
    vertical-align: middle;
    width: 100%;
}

.hcase ul li a .en_box .e_1 div,.hcase ul li a .cn_box .t_1 div{
    display: inline-block;
    transform-origin: 0 0;
    will-change: transform;
    -webkit-transition:all .35s;
}
.hcase ul li a .en_box .e_2 div,.hcase ul li a .cn_box .t_2 div{
    transform: translateY(110%) rotateX(-90deg);
    vertical-align: middle;
    transform-origin: 0 0;
    will-change: transform;
    -webkit-transition:all .35s;
}


.hcase ul li a .en_box .e_1 div:nth-child(2),.hcase ul li a .en_box .e_2 div:nth-child(2),.hcase ul li a .cn_box .t_1 div:nth-child(2),.hcase ul li a .cn_box .t_2 div:nth-child(2){
    -webkit-transition-delay:0.05s;
}

.hcase ul li a .en_box .e_1 div:nth-child(3),.hcase ul li a .en_box .e_2 div:nth-child(3),.hcase ul li a .cn_box .t_1 div:nth-child(3),.hcase ul li a .cn_box .t_2 div:nth-child(3){
    -webkit-transition-delay:0.075s;
}

.hcase ul li a .en_box .e_1 div:nth-child(4),.hcase ul li a .en_box .e_2 div:nth-child(4),.hcase ul li a .cn_box .t_1 div:nth-child(4),.hcase ul li a .cn_box .t_2 div:nth-child(4){
    -webkit-transition-delay:0.1s;
}

.hcase ul li a .en_box .e_1 div:nth-child(5),.hcase ul li a .en_box .e_2 div:nth-child(5),.hcase ul li a .cn_box .t_1 div:nth-child(5),.hcase ul li a .cn_box .t_2 div:nth-child(5){
    -webkit-transition-delay:0.125s;
}

.hcase ul li a .en_box .e_1 div:nth-child(6),.hcase ul li a .en_box .e_2 div:nth-child(6),.hcase ul li a .cn_box .t_1 div:nth-child(6),.hcase ul li a .cn_box .t_2 div:nth-child(6){
    -webkit-transition-delay:0.15s;
}

.hcase ul li a .en_box .e_1 div:nth-child(7),.hcase ul li a .en_box .e_2 div:nth-child(7),.hcase ul li a .cn_box .t_1 div:nth-child(7),.hcase ul li a .cn_box .t_2 div:nth-child(7){
    -webkit-transition-delay:0.175s;
}

.hcase ul li a .en_box .e_1 div:nth-child(8),.hcase ul li a .en_box .e_2 div:nth-child(8),.hcase ul li a .cn_box .t_1 div:nth-child(8),.hcase ul li a .cn_box .t_2 div:nth-child(8){
    -webkit-transition-delay:0.2s;
}

.hcase ul li a .en_box .e_1 div:nth-child(9),.hcase ul li a .en_box .e_2 div:nth-child(9),.hcase ul li a .cn_box .t_1 div:nth-child(9),.hcase ul li a .cn_box .t_2 div:nth-child(9){
    -webkit-transition-delay:0.225s;
}

.hcase ul li a .en_box .e_1 div:nth-child(10),.hcase ul li a .en_box .e_2 div:nth-child(10),.hcase ul li a .cn_box .t_1 div:nth-child(10),.hcase ul li a .cn_box .t_2 div:nth-child(10){
    -webkit-transition-delay:0.25s;
}

.hcase ul li a .en_box .e_1 div:nth-child(11),.hcase ul li a .en_box .e_2 div:nth-child(11),.hcase ul li a .cn_box .t_1 div:nth-child(11),.hcase ul li a .cn_box .t_2 div:nth-child(11){
    -webkit-transition-delay:0.275s;
}

.hcase ul li a .en_box .e_1 div:nth-child(12),.hcase ul li a .en_box .e_2 div:nth-child(12),.hcase ul li a .cn_box .t_1 div:nth-child(12),.hcase ul li a .cn_box .t_2 div:nth-child(12){
    -webkit-transition-delay:0.3s;
}

.hcase ul li a .en_box .e_1 div:nth-child(13),.hcase ul li a .en_box .e_2 div:nth-child(13),.hcase ul li a .cn_box .t_1 div:nth-child(13),.hcase ul li a .cn_box .t_2 div:nth-child(13){
    -webkit-transition-delay:0.325s;
}

.hcase ul li a .en_box .e_1 div:nth-child(14),.hcase ul li a .en_box .e_2 div:nth-child(14),.hcase ul li a .cn_box .t_1 div:nth-child(14),.hcase ul li a .cn_box .t_2 div:nth-child(14){
    -webkit-transition-delay:0.35s;
}

.hcase ul li a .en_box .e_1 div:nth-child(15),.hcase ul li a .en_box .e_2 div:nth-child(15),.hcase ul li a .cn_box .t_1 div:nth-child(15),.hcase ul li a .cn_box .t_2 div:nth-child(15){
    -webkit-transition-delay:0.375s;
}

.hcase ul li a .en_box .e_1 div:nth-child(16),.hcase ul li a .en_box .e_2 div:nth-child(16),.hcase ul li a .cn_box .t_1 div:nth-child(16),.hcase ul li a .cn_box .t_2 div:nth-child(16){
    -webkit-transition-delay:0.4s;
}

.hcase ul li a .en_box .e_1 div:nth-child(17),.hcase ul li a .en_box .e_2 div:nth-child(17),.hcase ul li a .cn_box .t_1 div:nth-child(17),.hcase ul li a .cn_box .t_2 div:nth-child(17){
    -webkit-transition-delay:0.425s;
}

.hcase ul li a .en_box .e_1 div:nth-child(18),.hcase ul li a .en_box .e_2 div:nth-child(18),.hcase ul li a .cn_box .t_1 div:nth-child(18),.hcase ul li a .cn_box .t_2 div:nth-child(18){
    -webkit-transition-delay:0.45s;
}

.hcase ul li a .en_box .e_1 div:nth-child(19),.hcase ul li a .en_box .e_2 div:nth-child(19),.hcase ul li a .cn_box .t_1 div:nth-child(19),.hcase ul li a .cn_box .t_2 div:nth-child(19){
    -webkit-transition-delay:0.475s;
}

.hcase ul li a .en_box .e_1 div:nth-child(20),.hcase ul li a .en_box .e_2 div:nth-child(20),.hcase ul li a .cn_box .t_1 div:nth-child(20),.hcase ul li a .cn_box .t_2 div:nth-child(20){
    -webkit-transition-delay:0.5s;
}


.hcase ul li a:hover .en_box .e_1 div,.hcase ul li a:hover .cn_box .t_1 div{
    -webkit-transform: translate(0px, -100%) rotateX(90deg);    
}

.hcase ul li a:hover .en_box .e_2 div,.hcase ul li a:hover .cn_box .t_2 div{
    -webkit-transform: translateY(0%) rotateX(0deg);    
}


.hcase ul li a .en_box .e_2,.hcase ul li a .cn_box .t_2{
    display: inline-block;
    overflow: hidden;
    perspective: 1000px;
    perspective-origin: -150% 50%;
    vertical-align: middle;
    width: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}


.hcase ul li a:hover .thum{
    /*-webkit-transform: scale(0.95);*/
}
.hcase ul li a:hover img{
	-webkit-transform: scale(1.05);
}

.hcase ul li a .img{
	position: absolute;
	width: 80%;
	height: auto;
	right: -20%;
	top: 55%;
	-webkit-transform: translateY(-50%) translateZ(0px);
	-webkit-transition: all .75s;
}
.hcase ul li a .info{
	width: 45%;
	height: auto;
	position: absolute;
	left: 5%;
	top: 50%;
	color: #fff;
	text-shadow: 0px 0px 10px rgba(0, 0, 0, .1);
	transform: translateZ(0px) translateY(-50%);
	-webkit-transition: all .55s;
}

.hcase ul li a:hover .info{
	transform: translateZ(80px) translateY(-50%) rotateY(20deg);
}

.hcase ul li a .info .name{
	font-size: 2vw;
	line-height: 1.2;
	font-weight: bold;
	margin: 3.5vw 0px;
	
}
.hcase ul li a .info .en{
	font-family: BrownBlod;
	text-transform: uppercase;
	font-size: 14px;
}

.hcase ul li a .case_tips{
    width: 100%;
    margin-top: 25px;
    font-size: 14px;
    line-height: 1.4;
   
    -webkit-transition: all .55s;
    position: relative;
}

.hcase ul li a .en_title{
	width: 100%;
	height: auto;
	position: relative;
	text-transform: uppercase;
	font-size: 16px;
	color: #151515;
	line-height: 1;
	-webkit-transition: all .6s;
}

.pages {
    width: 100%;
    line-height: 30px;
    text-align: center;
    overflow: hidden;
    padding: 30px 0;
    margin-top: 30px;
    margin-bottom: 20px;
}
.pages span{
        display: inline-block;
    min-width: 45px;
    height: 45px;
    cursor: pointer;
    color: #fff;
    font-size: 16px;
    line-height: 43px;
    background-color: #0774b9;
    text-align: center;
    margin: 0 4px;
    -webkit-appearance: none;
    border-radius: 6px;
}
.pages a {
        display: inline-block;
    min-width: 45px;
    height: 45px;
    cursor: pointer;
    color: #fff;
    font-size: 14px;
    line-height: 43px;
    background-color: #3e3e3e;
    text-align: center;
    margin: 0 4px;
    -webkit-appearance: none;
    border-radius: 6px;
}

.pages a.font,
.pages a:hover {
    color: #fff;
    background: #0774b9;
/*    border: #db1102 solid 1px*/
}

.nextprev {
    padding: 10px 0 30px 0;
    border-top: 1px solid #dedede;
    margin-top: 30px;
}
.nextprev a{
  font-size: 16px;
}.info_next{
  float: right;
}
.nextprev {
    padding: 10px 0 30px 0;
    border-top: 1px solid #dedede;
    margin-top: 30px;
}
.nextprev a{
  font-size: 16px;
}.info_next{
  float: right;
}
.art-title {
    text-align: center;
    border-bottom: 1px solid #dedede;
    padding: 20px 0;
    font-size: 18px;
}

#page a{
    background-color: transparent;
    font-family: BrownBlod;
}
#page a.xl-active{
    background: #136ead;
    color: #fff;
}
#page a:hover {
    background-color: #136ead !important;
    border-color: #136ead;
    color: #FFF;
}
.case-cont{
    margin-bottom: 80px;
}
.news-cont1-list{
    width: 32%;
    float: left;
    box-sizing: border-box;
    overflow: hidden;
    padding-bottom: 35px;
    margin-top: 35px;
    border-bottom: 1px solid #cbcbcb;
}
.news-cont1-list:hover .thumbs img{
    transform: scale(1.1);
}
.news-cont1-list:hover .mores span{
    color: #0774b9;
}
.news-cont1-list:hover .mores img{
    margin-left: 20px;
}
.case1{
    margin:70px 0;
}
.case1-cont{
    margin-top: 50px;
    padding:0 50px;
    box-sizing: border-box;
}
.case1-list{
    display: inline-block;
    float: left;
    box-sizing: border-box;
    width: 30%;
    margin-bottom: 40px;
}
.case1-list:nth-child(2){
    margin:0 5%;
}
.case1-list-msg{
    width: 80%;
    display: inline-block;
    float: left;
    background: url(../img/yx_12.png)no-repeat;
    background-size:100% 100%;
    padding:15px 35px 20px 15px;
    margin-top: 20px;
}
.case1-list-msg2{
    background: url(../img/yx_27.png)no-repeat;
    background-size:100% 100%;
    padding:15px  15px 20px 35px;
}
.case1-list-tx{
    display:inline-block;
    width: 20%;
    float: left;
}
.case1-list-tx img{
    max-width: 100%;
}
.case1-list-msg p:nth-child(1){
    font-size: 30px;
    color: #136ead;
    border-bottom: 1px dashed #ff8383;
    padding-bottom: 5px;
}
.case2{
    margin-top: 100px;
}
.case2-cont{
    margin-top: 90px;
}
.case1-list-msg p:nth-child(2){
    font-size: 14px;
    color: #201f1e;
    line-height: 2;
    padding-top: 5px;
}
.case2-list{
    width: 25%;
    float: left;
    box-sizing: border-box;
    padding:60px 20px 30px 20px;
    border:1px solid #dfdfdf;
}
.case2-list .icons{
    text-align: center;
}
.case2-list .icons img:nth-child(2){
    opacity: 0;
    display: none;
    transition: all 0.5s;
}
.case2-list .tittles{
    margin-top: 15px;
    text-align: center;
    font-size: 16px;
    color: #1d1c1c;
}
.case2-list{
    border-top: 0px;
    border-left: 0px;
    transition: all 0.5s;
}
.case2-list:nth-child(4){
    border-right: 0px;
}
.case2-list:nth-child(8){
    border-right: 0px;
}
.case2-list .tittles{
    font-size: 16px;
    color: #1d1c1c;
    text-align: center;
    transition: all 0.5s;
}
.case2-list:hover{
    background: #136ead;
    color: #fff !important;
}
.case2-list:hover .tittles{
    color: #fff !important;
}
.case2-list:hover .desc{
    color: #fff !important;
}
.case2-list:hover .icons img:nth-child(2){
    display: inline-block;
    opacity: 1;
}
.case2-list:hover .icons img:nth-child(1){
    opacity: 0;
    display: none;
}
.case2-list .desc{
    height: 50px;
    line-height: 1.8;
    text-align: center;
    font-size: 14px;
    color: #1d1c1c;
    margin-top: 30px;
    transition: all 0.5s;
}
.case1-list-msg2 p{

}
.case3{
    margin-top: 60px;
    padding:90px 0;
    background: url(../img/yx3_02.png)no-repeat;
    background-size: top/cover;
}
.news-cont1-list:hover .titles{
    color: #0774b9;
}
.case2-list:nth-child(5){
    border-bottom: none;
}
.case2-list:nth-child(6){
    border-bottom: none;
}
.case2-list:nth-child(7){
    border-bottom: none;
}
.case2-list:nth-child(8){
    border-bottom: none;
}
.news-cont1-list:nth-child(2){
    margin:0 2%;
    margin-top: 35px;
}
.news-cont1-list:nth-child(5){
    margin:0 2%;
    margin-top: 35px;
}
.index-list-title-ffff p{
    color: #fff !important;
}
.news-cont1-list .thumbs{
    width: 100%;
}
.news-cont1-list .thumbs img{
    display: block;
    width: 100%;
    transition: all 0.5s;
}
.news-cont1-list .times{
    font-size: 14px;
    font-weight: bold;
    color: #303030;
    margin-top: 30px;
    margin-bottom: 15px;
}
.news-cont1-list .titles{
    height: 40px;
    color: #1e1e1e;
    font-size: 16px;
}
.news-cont1-list .desc{
    font-size: 14px;
    color: #737373;
    line-height: 1.8;
    height: 80px;
}
.news-cont1-list .mores{

}
.news-cont1-list .mores span{
    display: inline-block;
    vertical-align: middle;
    margin-right: 40px;
}
.news-cont1-list .mores img{
    display: inline-block;
    vertical-align: middle;
    transition: all 0.5s;
}
.hcase ul li a .title{
	font-size: 14px;
    color: #868686;
	line-height: 1.4;
	position: relative;
	transform: translateZ(0px);
	-webkit-transition: all .65s;
	padding-left: 0px;
	margin-left:0%;
}

.hcase ul li a:hover .title::after{
	width: 40px;
}

.sub_name.half{
	width: 50%;
}

.sub_name.l{
    text-align: left;
}

.sub_name{
	line-height: 1.4;
    position: relative;
    width: 100%;
    text-align: center;
/*    margin-bottom: 3vw;*/
}
.sub_name b{
	display: block;
	width: 100%;
	font-size: 48px;
}
.sub_name.w{
	color: #fff;
}
.sub_title p{
	font-size: 48px;
	display: block;
	font-weight: normal;
}
.sub_name p{
    font-size: 48px;
    font-family: BrownBlod;
    font-weight: 100;
}

.hcase .sub_name{
	top: 0vw;
}
.contact_box{
	width: 100%;
	position: relative;
}
.contact_box .sub_title{
	text-align: left;
}
.contact_box .form{
	width: 50%;
	height: auto;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

}
.contact_box .form .row{
	width: 48%;
	font-size: 16px;
	display: flex;
	align-items: center;
	line-height: 60px;
	border-bottom: 1px solid rgba(0, 0, 0, .1);
	margin-bottom: 4vw;
	justify-content: space-between;
}
.contact_box .form .row:nth-child(n+3){
	margin-bottom: 1vw;
}
.contact_box .form .row label{
	width: 40px;
	height: auto;
	line-height: 45px;
	margin-right: 10px;
}
.contact_box .form .row:nth-child(3) label{
	width: 65px;
}
.contact_box .form .row:nth-child(3) input{
	width: 100%;
}
.contact_box .form .row input{
	border: none;
	height: 60px;
	outline: none;
	width: 100%;
	font-size: 16px;
	background: transparent;
}
.contact_box .form .row input::-webkit-input-placeholder {
	color: rgba(0,0,0,.3);
}
.form_tips{
	width: 100%;
	font-size: 14px;
	line-height: 2;
}
.submit{
	width: 180px;
	height: 60px;
	position: relative;
	background: #45cb7a;
	color: #fff;
	line-height: 60px;
	text-align: center;
	border-radius: 60px;
	margin-top: 3vw;
	cursor: pointer;
	font-size: 16px;
	margin-bottom: 6vw;
}
.submit.active{
	cursor: no-drop;
	opacity: .7;
}
.address_info{
	width: 50%;
	height: auto;
	margin-bottom: 5vw;
}
.address_info ul{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	justify-content: space-between;
}
.address_info ul li{
	width: 45%;
	font-size: 16px;
	line-height: 1.7;
}
.address_info ul li p{
	font-weight: bold;
	position: relative;
}
.address_info ul li p:before{
	width: 75px;
	height: 7px;
	position: absolute;
	left: 0px;
	bottom: 6px;
	margin-top: -2.5px;
	content: '';
	background-image: linear-gradient(to right, #fff 0%, #45cb7a 100%);
}
.sub_title b span{
	color: #45cb7a;
	font-family: BrownBlod;
}
.address_info ul li b{
	font-weight: bold;
	display: block;
}
.address_info ul li p span{
	position: relative;
	z-index: 1;
}
.copyright{
	width:100%;
	height: auto;
	font-size: 12px;
	line-height: 45px;
	display: flex;
	color: rgba(0,0,0,.3);
	text-transform: uppercase;
}
.copyright a{
	color: rgba(0,0,0,.3);
	margin-left: 10px;
}
.st_box{
	bottom: 0;
	height: 64.84375vw;
	pointer-events: none;
	right: 0;
	width: 49.21875vw;
	overflow: hidden;
	position: absolute;
}
.pandanw{
	height: 38.75vw;
	position: absolute;
	width: 36.09375vw;
	bottom: 0;
	left: 0;
	background: url( ../image/panda-black.png) 50%/cover;
}
.pandanb{
	bottom: 0;
	-webkit-clip-path: circle(90% at 136% 20%);
	clip-path: circle(90% at 136% 20%);
	left: 0;
	height: 38.75vw;
	position: absolute;
	width: 36.09375vw;
	background: url( ../image/panda-white.png) 50%/cover;
}
.ball_bg{
	background: rgba(0,0,0,.9);
	border-radius: 50%;
	bottom: -2.8645833333vw;
	height: 67.7083333333vw;
	left: auto;
	right: -33.8541666667vw;
	top: auto;
	-webkit-transform: scale(0);
	transform: scale(0);
	-webkit-transition: opacity .8s 0s,-webkit-transform 30s cubic-bezier(0,.99,0,.99) 0s;
	transition: opacity .8s 0s,-webkit-transform 30s cubic-bezier(0,.99,0,.99) 0s;
	transition: transform 30s cubic-bezier(0,.99,0,.99) 0s,opacity .8s 0s;
	transition: transform 30s cubic-bezier(0,.99,0,.99) 0s,opacity .8s 0s,-webkit-transform 30s cubic-bezier(0,.99,0,.99) 0s;
	width: 67.7083333333vw;
	overflow: hidden;
	position: absolute;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.space{
	-webkit-animation: a 240s linear infinite;
	animation: a 240s linear infinite;
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
	background-blend-mode: difference;
	background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNDAgMjQwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTA2IDkwaDJ2MmgtMnpNNzQgNjNoMXYxaC0xek0yMyA2NmgxdjFoLTF6TTUwIDExMGgxdjFoLTF6TTYzIDEyOGgxdjFoLTF6TTQ1IDE0OWgxdjFoLTF6TTkyIDE1MWgxdjFoLTF6TTU4IDhoMXYxaC0xek0xNDcgMzNoMnYyaC0yek05MSA0M2gxdjFoLTF6TTE2OSAyOWgxdjFoLTF6TTE4MiAxOWgxdjFoLTF6TTE2MSA1OWgxdjFoLTF6TTEzOCA5NWgxdjFoLTF6TTE5OSA3MWgzdjNoLTN6TTIxMyAxNTNoMnYyaC0yek0xMjggMTYzaDF2MWgtMXpNMjA1IDE3NGgxdjFoLTF6TTE1MiAyMDBoMXYxaC0xek01MiAyMTFoMnYyaC0yek0wIDE5MWgxdjFIMHpNMTEwIDE4NGgxdjFoLTF6Ii8+PC9zdmc+);
	background-size: 240px;
	-webkit-clip-path: circle(90% at 136% 20%);
	clip-path: circle(90% at 136% 20%);
	height: 100%;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	-webkit-transition: opacity .8s 0s,-webkit-transform 30s cubic-bezier(0,.99,0,.99) 0s;
	transition: opacity .8s 0s,-webkit-transform 30s cubic-bezier(0,.99,0,.99) 0s;
	transition: transform 30s cubic-bezier(0,.99,0,.99) 0s,opacity .8s 0s;
	transition: transform 30s cubic-bezier(0,.99,0,.99) 0s,opacity .8s 0s,-webkit-transform 30s cubic-bezier(0,.99,0,.99) 0s;
	width: 100%;
	-webkit-animation-play-state: running;
	animation-play-state: running;
}

body,html{
	overflow-x: hidden;
}
.footer{
	position: relative;
	padding-top: 0vw;
	background: #fff;
}
.boxes.b4{
	padding-top: 0px;
}


.service_box{
	width: 80%;
	height: auto;
	position: relative;
	margin-left: 10%;
	display: flex;
	justify-content: space-between;
}
.service_box .box{
	width: 31%;
    height: auto;
    position: relative;
}

.boxes.b2{
    padding-top: 0%;
}

.service_box .box .inner{
	width: 100%;
	height: auto;
	position: relative;
	left: 0%;
	top: 0%;
	padding:45px 35px;
	border-radius: 10px;
	box-shadow: 0 -16px 24px rgb(0 0 0 / 15%);
	background: #08d7c6;
	display: flex;
	align-items: center;
}
.service_box .box .inner.i2{
	background: #318ee4;
}
.service_box .box .inner.i3{
	background: #00cadc;
}

.service_box .words{
	width: auto;
	height: auto;
	position: absolute;
	right: -15vw;
	bottom: 0vw;
	text-transform: uppercase;
	color: #fff;
	display: none;
	font-size: 30vw;
	line-height: 1;
	font-weight: bold;
	opacity: .1;
	pointer-events: none;
	display: none;
}

.service_box .img{
	width: 35%;
	height: auto;
	position: absolute;
	right: 0%;
	top: 65%;
	-webkit-transform: translateY(-50%);
	display: none;
}


.service_box .box .info{
	width: 100%;
	height: auto;
	position: relative;
	color: #fff;
	margin-top: 0vw;
}

.service_box .box .info .name{
	width: 100%;
	height: auto;
	font-size: 2vw;
	line-height: 1.5;
	margin-bottom: 0vw;
	text-align: center;
}

.service_box .box .info .des{
	width: 100%;
	height: auto;
	position: relative;
	font-size: 16px;
	line-height: 25px;
	min-height: 50px;
	font-family: alibaba;
	text-align: center;
}

.service_box .box .info .marks{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: 15px;
    justify-content: space-between;
}

.service_box .box .info .marks span{
    border: 1px solid rgba(255,255,255,.5);
    line-height: 45px;
    font-size: 16px;
    padding: 0px 1vw;
    border-radius: 5px;
    margin-bottom: 0.5vw;
    width: 49%;
    text-align: center;
}

.service_box .box .info a{
	width: 180px;
	height: 60px;
	position: relative;
	border: 1px solid #fff;
	color: #fff;
	line-height: 60px;
	text-align: center;
	border-radius: 60px;
	margin: 2vw auto 0px;
	cursor: pointer;
	font-size: 16px;
	display: block;
	overflow: hidden;
}
.service_box .box .info a p{
	position: relative;
	-webkit-transition: all .4s;
}
.service_box .box .info a:hover p{
	color: #000;
}
.service_box .box .info a::before{
	width: 0%;
	height: 100%;
	position: absolute;
	top: 0%;
	right: 0%;
	content: '';
	background: #fff;
	-webkit-transition: all .5s cubic-bezier(0.215, 0.610, 0.355, 1);
	border-radius: 60px;
}
.service_box .box .info a:hover::before {
    left: 0%;
    width: 100%;
}
.parters{
	position: relative;
	width: 100%;
	z-index: 5;
}
.parters ul{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}
.parters ul li{
	width: 11%;
	height: auto;
	position: relative;
	margin-bottom: 1vw;
	margin-right: 1%;
	-webkit-transition:all 1s;
}

.parters ul li:hover{
    box-shadow: 5px 5px 30px rgba(0,0,0,.1);
}

.parters ul li img{
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	opacity: .7;
	-webkit-transition: all .5s;
}

.parters ul li:hover img{
	opacity: 1;
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
}

.news{
	width: 100%;
	height: auto;
	position: relative;
	margin-bottom: 3vw;
}
.news ul{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}
.news ul li{
	width: 32%;
	height: auto;
	position: relative;
	margin-right: 2%;
	margin-bottom: 25px;
}
.news ul li:nth-child(3n){
	margin-right: 0%;
}
.news ul li:nth-child(n+4){
    background: transparent;
    padding: 25px 15px;
    box-shadow: 0px 0px 30px rgba(0,0,0,.05);
}

.news.n ul li:nth-child(n+4){
    background:transparent;
    padding: 0px;
    box-shadow: none;
}

.news ul li:nth-child(n+4) .thum{
	display: none;
}

.news.n ul li:nth-child(n+4) .thum{
    display: block;
}

.news ul li .thum{
	margin-bottom: 1vw;
}

.news ul li .thum img{
	-webkit-transition: all .5s;
}

.news ul li:hover .thum img{
	-webkit-transform: scale(1.05);
}

.news ul li .info .name:hover a{
	color: #45cb7a;
}

.news ul li .name{
	font-size: 20px;
	line-height: 1.7;
	margin-bottom: 10px;
	font-weight: bold;
}
.news ul li .name a{
    -webkit-transition:all .5s;
}
.news ul li .name a:hover{
    color: #45cb7a;
}

.innerBox .news ul li .name{
	font-size: 1.8vw;
}

.news ul li .info .des{
	width: 100%;
	height: auto;
	position: relative;
	line-height: 1.7;
	margin-bottom: 15px;
	font-size: 16px;
}

.news ul li .info .marks{
	width: 100%;
	height: auto;
	display: flex;
	flex-wrap: wrap;
}
.news ul li .info .marks a{
	width: auto;
	color: rgba(0,0,0,.4);
	margin-right: 10px;
	font-size: 12px;
}
.news ul li .info .marks a:hover{
	color: rgba(0, 0, 0, 1);
}
.more{
	width: 180px;
	height: 60px;
	margin: 0px auto;
	position: relative;
	display: block;
	border-radius: 50px;
	overflow: hidden;
	color: #45cb7a;
}
.more .ring{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0%;
	top: 0%;
	border: 2px solid #45cb7a;
	border-radius: 50px;
}
.more.l{
    margin-left: 0px;
}
.more.w{
    color: #fff;
}

.more.w .ring{
    border-color: #fff;
}

.more.w .ring::after{
    background: #fff;
}

.more.w:hover .txt{
    color: #14151f;
}

.more.w:hover .ring{
    border-color: #14151f;
}

.more .ring::after{
	width: 100%;
	height: 0%;
	background: #45cb7a;
	position: absolute;
	left: 0%;
	bottom: 0%;
	border-radius: 50px;
	content: '';
	-webkit-transition: all .5s cubic-bezier(0.165, 0.84, 0.44, 1);
	
}

.more:hover .ring::after{
	height: 100%;
	top: 0%;
}

.more:hover .txt{
	color: #fff;
}

.more .txt{
	width: 70px;
	text-align: center;
	height: auto;
	position: absolute;
	left: 50%;
	font-size: 14px;
	top: 50%;
	-webkit-transition: all .4s;
	-webkit-transform: translateY(-50%) translateX(-50%);
}
@-webkit-keyframes a {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}

	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

@keyframes a {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}

	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

.news.home ul li:first-child{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-right: 0%;
	align-items: center;
    margin-bottom: 50px;
}

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

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

.news.home ul li:first-child .thum{
	width: 45%;
	margin-bottom: 0px;
}
.news.home ul li:first-child .info{
	width: calc(55% - 50px);
}
.news.home ul li:first-child .info .name{
	font-size: 24px;
	margin-bottom: 20px;
}
.news.home ul li:first-child .info .des{
	font-size: 16px;
	margin-bottom: 35px;
}
header .phone {
	width: 190px;
	height: 50px;
	border-radius: 40px;
	display: flex;
	color: #fff;
	font-weight: bold;
	font-size: 20px;
	transition: 0.3s all ease-in-out;
	position: relative;
	align-items: center;
}

header .phone .text b {
	font-family: BrownBlod;
	font-size: 18px;
	margin-top: 3px;
}

header .phone .img {
	width: 40px;
	height: 40px;
	border-radius: 30px;
	transition: 0.3s all ease-in-out;
	position: absolute;
	display: flex;
	color: #45cb7a;
	line-height: 40px;
	justify-content: center;
	font-size: 24px;
	left: 4px;
	top: 4px;
	background: url( ../image/tel_icon.png) no-repeat;
	background-size: 200%;
	border: 1px solid #fff;
}
header.active .phone .img {
	background-position: 100% 0%;
	border-color: #000;
}
@-webkit-keyframes rotateIns{
0%{-webkit-transform:scaleX(1);transform:scaleX(1)}
10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}
30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}
40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}
to{-webkit-transform:scaleX(1);transform:scaleX(1)}
}

header .phone .img img {
	width: 100%;
	-webkit-animation: rotateIns 2s ease infinite;
}

header .phone .text {
	position: absolute;
	transition: 0.3s all ease-in-out;
	font-size: 12px;
	width: calc(100% - 60px);
	left: 50px;
	line-height: 1;
	display: flex;
	flex-wrap: wrap;
}

.boxes.b5{
	padding-top: 0px;
}

.sub_banner{
	width: 100%;
	height: 90vh;
	position: relative;
	background: url( ../image/case_bg.jpg) no-repeat;
	background-size: cover;
}

.sub_banner::before{
	width: auto;
	height: auto;
	position: absolute;
	left: 0%;
	top: 50%;
	content: 'SHUTIME';
	font-size: 8vw;
	-webkit-text-stroke: 1px #fff;
	-webkit-text-fill-color: transparent;
	writing-mode: tb-rl;
	font-family: Poppins;
	opacity: 0.1;
	-webkit-transform: translateX(-45%) translateY(-50%);
}

.sub_box{
	position: absolute;
	width: 80%;
	height: auto;
	left: 10%;
	display: flex;
	justify-content: space-between;
	top: 55%;
	-webkit-transform: translateY(-50%);
	align-items: center;
}
.case_left{
	width: 100%;
	height: auto;
	position: relative;
	color: #fff;
}
.case_left .info{
	width: 100%;
	height: auto;
	position: relative;
	margin-bottom: 5vw;
	line-height: 1.5;
}
.case_left .info strong{
	font-size: 3.6vw;
	font-family: BrownBlod;
	display: block;
	line-height: 1.2;
	margin-bottom: 5vw;
	text-transform: capitalize;
}
.case_left .info strong.red{
    color: #45cb7a;
    margin-bottom: 1vw;
}
.case_left .info b{
	display: block;
	width: 100%;
	font-size: 2.4vw;
}
.case_left .info p{
	font-size: 2vw;
    font-family: alibaba;
}
.sult_btn{
	width: 300px;
	height: 55px;
	display: block;
	background: #45cb7a;
	color: #fff;
	line-height: 55px;
	display: flex;
	font-size: 16px;
	justify-content: center;
	align-items: center;
	border-radius: 50px;
}
.sult_btn .icon{
	width: 25px;
	margin-right: 5px;
}
.case_show{
	width: 60%;
	height: auto;
	position: relative;
}
.case_show ul{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.case_show ul li{
	width: 25%;
	height: auto;
	position: relative;
	margin-bottom: 1vw;
}

.case_nav{
	width: 100%;
	display: flex;
	position: relative;
	font-family: misans;
}
.case_nav a{
	width: auto;
    position: relative;
    font-size: 36px;
    line-height: 1.4;
    border-radius: 50px;
    text-align: center;
    margin-right: 1vw;
    -webkit-text-stroke: 1px rgba(62, 62, 62, 1);
    color: transparent;
    -webkit-transition:all .75s;
}


.case_nav a:hover,.case_nav a.active{
    border-color: transparent;
    color: #3e3e3e;
}


.case_nav a p{
	position: relative;
	display: block;
}
.case_nav a p span{
	display: block;
	position: relative;
}

.hcase.inner{
	margin-top: 3vw;
	margin-bottom: 0px;
}
.hcase.inner ul li{
	margin-bottom: 3vw;
	width: 32%;
	margin-right: 2%;
}

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

.hcase.inner ul li:nth-child(odd){
	margin-top: 0px;
}

.innerBox{
	padding-top: 10vw;
}

.innerBox::before{
	width: 100%;
	height: 90px;
	position: absolute;
	left: 0%;
	top: 0%;
	background: #000;
	content: '';
}

.w1400.flex{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.news_left{
	width: 60%;
}
.popular_news{
	width: 35%;
	position: relative;
	top: 2vw;
}

#p2{
    align-items: flex-start;
}

.news_left .news ul li{
	width: 100%;
	margin-right: 0%;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 5vw;
}
.news_left .news ul li .thum{
	width: 100%;
}
.popular_news .title{
	font-size: 1.8vw;
	font-weight: bold;
	margin-bottom: 3vw;
}
.popular_news .same{
	width: 100%;
}
.popular_news .same a{
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5vw;
	flex-wrap: wrap;
}

.popular_news .same a:hover{
    color: #45cb7a;
}

.popular_news .same a:first-child .thum{
	width: 100%;
	margin-bottom: 10px;
}

.popular_news .same a:first-child .name{
	width: 100%;
	font-size: 16px;
}

.popular_news .same a .thum{
	width: 45%;
}
.popular_news .same a .name{
	width: calc(55% - 10px);
	font-size: 16px;
	line-height: 1.7;
}

.sub_box .website{
	width: 35%;
	font-size: 16px;
	line-height: 2;
	color: #fff;
}
.sub_box.w{
	align-items: flex-end;
}

.found_box{
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	direction: rtl;
}
.found_box .list{
	width: calc(100% - 700px);
	direction: initial;
}
.found_box .img{
	width: 600px;
}
.common_title{
	width: 100%;
	height: auto;
	text-align: center;
	font-size: 2vw;
	font-weight: bold;
	color: #fff;
	margin-bottom: 3vw;
}
.found_box .list ul{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	justify-content: space-between;
}
.found_box .list ul li{
	width: 45%;
	position: relative;
	display: flex;
	align-items: center;
	margin-bottom: 3vw;
}
.found_box .list ul li .num{
	font-family: Poppins;
	font-size: 4vw;
	-webkit-text-stroke: 1px #000;
	-webkit-text-fill-color: transparent;
	line-height: 1;
}
.found_box .list ul li .name{
	margin-left: 10px;
	font-size: 20px;

	position: relative;
	padding-bottom: 20px;
}
.found_box .list ul li .name::after{
	width: 110px;
	height: 10px;
	position: absolute;
	left: 0%;
	bottom: 0%;
	content: '';
	background: url( ../image/line.png) no-repeat;
}
.boxes.b6{
	height: 80vh;
	position: relative;
	background: url( ../image/site_bg.jpg) center center no-repeat;
	display: flex;
	align-items: center;
	padding: 0px;
}
.fx_box{
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	position: relative;
	align-items: center;
}
.fx_box::before{
	width: 1px;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 0%;
	content: '';
	background: rgba(255, 255, 255, .2);
}
.fx_box .list{
	width: 45%;
	height: auto;
	position: relative;
}
.fx_box .list ul li{
	width: 100%;
	height: auto;
	position: relative;
	text-align: right;
	margin-bottom: 3vw;
	cursor: pointer;
}

.fx_box .list ul li:last-child{
	margin-bottom: 0px;
}

.fx_box .list ul li .xh{
	color: rgba(255,255,255,0.5);
	line-height: 2;
	margin-bottom: 10px;
}

.fx_box .list ul li .info{
	width: 100%;
	height: 0px;
	color: rgba(255,255,255,1);
	line-height: 2;
	overflow: hidden;
	-webkit-transition: all .4s;
}

.fx_box .list ul li .info .name{
	width: 100%;
	font-size: 1.8vw;
	font-weight: bold;
}

.fx_box .list ul li .info .des{
	font-size: 16px;
}

.fx_box .list ul li.active .info{
	height: auto;
}

.fx_box .fx_swiper{
	width: 45%;
	height: auto;
	position: relative;
	padding-bottom: 70px;
	overflow: hidden;
}

.fx_swiper .name{
	width: 100%;
	height: auto;
	position: relative;
	font-size: 2.6vw;
	font-weight: bold;
	color: #fff;
	line-height: 1.5;
	margin-bottom: 2vw;
}
.fx_swiper .des{
	width: 100%;
	height: auto;
	font-size: 1.2vw;
	color: #fff;
	line-height: 2;
}

.fx_swiper .swiper-pagination{
	text-align: left;
	color: rgba(255,255,255,0.5);
	
}
.fx_swiper .swiper-pagination span{
	font-family: BrownBlod;
	color: rgba(255,255,255,0.5);
	font-size: 16px;
	padding-left: 10px;
}
.fx_swiper .swiper-pagination span.swiper-pagination-current{
	font-size: 24px;
	color: #fff;
	padding-left: 0px;
	padding-right: 10px;
}

.st_show.c{
	text-align: center;
}
.st_show.w{
	color: #fff;
}
.num_list{
	width: 35%;
	height: auto;
	border: 1px solid rgba(255, 255, 255, .1);
	backdrop-filter: blur(10px);
	color: #fff;
}
.num_list ul{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.num_list ul li{
	width: 50%;
	height: 135px;
	position: relative;
	padding: 25px;
	text-align: center;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	border-right: 1px solid rgba(255, 255, 255, .1);
}

.num_list ul li .txt{
    font-family: alibaba;
}

.num_list ul li::after{
	width: 5px;
	height: 1px;
	position: absolute;
	right: 0%;
	bottom: -1px;
	content: '';
	background: #fff;
}
.num_list ul li:nth-child(2)::after{
	right: auto;
	left: -1px;
	width: 1px;
	height: 5px;
}
.num_list ul li:nth-child(3)::after{
	bottom: auto;
	top: -1px;
	width: 1px;
	height: 5px;
	right: -1px;
}
.num_list ul li:nth-child(4)::after{
	bottom: auto;
	top: -1px;
	right: auto;
	left: -1px;
}
.num_list ul li:nth-child(even){
	border-right: none;
}
.num_list ul li:nth-child(n+3){
	border-bottom: none;
}
.num_list ul li .num{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	margin-bottom: 5px;
	color: #45cb7a;
}
.num_list ul li .num span{
	font-family: BrownBlod;
	font-size: 60px;
	font-weight: bold;
	line-height: 1;
	margin-right: 5px;
}
.method{
	width: 70vw;
	height: calc(70vw * 0.25);
	position: relative;
	margin: 5vw auto 10vw;
}
.method ul{
	width: 100%;
	height: 100%;
	position: relative;
}
.method ul li{
	width: 25%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 0%;
	-webkit-transform: translateX(-50%);
	background: #ffffff;
	border-radius: 50%;
	box-shadow: 0px 0px 50px rgba(0, 0, 0, .1);
}

.method ul li:nth-child(1){
	left: 5%;
}

.method ul li:nth-child(2){
	left: 27%;
}

.method ul li:nth-child(4){
	left: 72%;
}

.method ul li:nth-child(5){
	left: 95%;
}

.method ul li .icon{
	width: 80px;
	height: 80px;
	position: absolute;
	left: 50%;
	margin-left: -40px;
	background: url( ../image/icon5.png) no-repeat;
	background-size:auto cover;
	top: 25%;
}

.method ul li:nth-child(2) .icon{
	background-position: -80px 0px;
}

.method ul li:nth-child(3) .icon{
	background-position: -160px 0px;
}

.method ul li:nth-child(4) .icon{
	background-position: -240px 0px;
}

.method ul li:nth-child(5) .icon{
	background-position: -320px 0px;
}


.method ul li .name{
	width: 100%;
	height: auto;
	position: absolute;
	left: 0%;
	top: 60%;
	text-align: center;
}
.method ul li .name b{
	font-size: 1.6vw;
	display: block;
	margin-bottom: 0.5vw;
	line-height: 1;
}
.method ul li .name p{
	font-size: 20px;
    font-family: alibaba;
}
.process_box{
	width: 100%;
	height: auto;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 5vw;
}
.process_box .process{
	width: 40%;
	position: relative;
	top: 5vw;
}

.process_box .process .name{
	width: 100%;

}
.process_box .process .name b{
	font-size: 2vw;
	font-weight: bold;
	display: block;
	line-height: 1.4;
}
.process_box .process .name b:nth-child(2){
	margin-bottom: 1.5vw;
}
.process_box .process .des{
	width: 100%;
	height: auto;
	position: relative;
	font-size: 18px;
	line-height: 2;

}
.process_box .list{
	width: 55%;
}
.process_box .list ul li{
	width: 100%;
	background: rgba(0, 0, 0, .1);
	margin-bottom: 2vw;
	position: relative;
	padding: 50px 25px;
	overflow: hidden;
}
.process_box .list ul li .name{
	width: 100%;
	height: auto;
	position: relative;
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 30px;
	padding-bottom: 30px;
	font-family: alibaba;
}
.process_box .list ul li .name::after{
	width: 110px;
	height: 10px;
	position: absolute;
	left: 0%;
	bottom: 0%;
	background: url( ../image/line.png) no-repeat;
	content: '';
}
.process_box .list ul li .des{
	width: 100%;
	font-size: 16px;
	line-height: 2;
	margin-bottom: 35px;
}
.ndc_npnews {
    display: none;
}
.process_box .list ul li .letter{
	width: auto;
	height: auto;
	position: absolute;
	left: 25px;
	bottom: 0px;
	font-size: 6vw;
	-webkit-text-stroke: 1px #fff;
	-webkit-text-fill-color: transparent;
	font-family: Poppins;
	line-height: 1;
	-webkit-transform: translateY(45%);
}
.method_box{
	width: 100%;
	height: 60vh;
	position: relative;
}
.method_box .box{
	width: 60vh;
	height: 60vh;
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
}

.method_box .box::before{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0%;
	top: 0%;
	background: url( ../image/rect.png) no-repeat;
	background-size: cover;
	content: '';
}

.method_box .box .center{
	width: 50vh;
	height: 50vh;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	border-radius: 50%;
	background: #212121;
}
.method_box .box ul{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0%;
	top: 0%;
	z-index: 2;
}
.method_box .box ul li{
	width: 18vh;
	height: 18vh;
	background: #45cb7a;
	border-radius: 50%;
	position: absolute;
	left: 2vh;
	top: 2vh;
}
.method_box .box ul li:nth-child(2){
	left: auto;
	right: 2vh;
}
.method_box .box ul li:nth-child(3){
	top: auto;
	bottom: 2vh;
}

.method_box .box ul li:nth-child(4){
	top: auto;
	bottom: 2vh;
	left: auto;
	right: 2vh;
}

.method_box .box .center p{
	color: #fff;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	line-height: 1.4;
	font-size: 2vw;
}
.method_box .box ul li .info{
	position: absolute;
	width: 20vw;
	height: auto;
}

.method_box .box ul li .info .name{
	width: 100%;
	height: auto;
	position: relative;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 20px;
	padding-bottom: 20px;
}
.method_box .box ul li .info .name::after{
	width: 110px;
	height: 10px;
	position: absolute;
	left: 0%;
	bottom: 0%;
	background: url( ../image/line.png) no-repeat;
	content: '';
}


.method_box .box ul li:nth-child(odd) .info{
	left: -25vw;
	text-align: right;
}

.method_box .box ul li:nth-child(even) .info{
	right: -25vw;
	text-align: left;
}

.method_box .box ul li:nth-child(odd) .info .name::after{
	left: auto;
	right: 0%;
}

.method_box .box ul li .info .des{
	width: 100%;
	font-size: 16px;
	line-height: 2;
}

.method_box .box ul li .icon{
	width: 70px;
	height: 70px;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	background: url( ../image/eye_icon.png);
}

.method_box .box ul li:nth-child(2) .icon{
	background-position: -70px 0px;
}

.method_box .box ul li:nth-child(3) .icon{
	background-position: -140px 0px;
}

.method_box .box ul li:nth-child(4) .icon{
	background-position: -210px 0px;
}
.design_box{
	background: url( ../image/design_bg.jpg) no-repeat;
	background-size: cover;
}
.design_box .list{
	width: 100%;
}
.design_box .list ul{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}
.design_box .list ul li{
	width: 25%;
	height: auto;
	background: rgba(255, 255, 255, .1);
	position: relative;
	padding: 5vw 1vw;
	color: #fff;
}

.design_box .list ul li .icon{
	width: 70px;
	height: 70px;
	margin: 0px auto;
	background: url( ../image/b_icon.png) no-repeat;
	margin-bottom: 15px;
	-webkit-transform: scale(0.8);
}

.design_box .list ul li:nth-child(2) .icon{
	background-position: -70px 0px;
}

.design_box .list ul li:nth-child(3) .icon{
	background-position: -140px 0px;
}

.design_box .list ul li:nth-child(4) .icon{
	background-position: -210px 0px;
}

.design_box .list ul li:nth-child(5) .icon{
	background-position: -280px 0px;
}

.design_box .list ul li:nth-child(even){
	background: #45cb7a;
}

.design_box .list ul li .txt{
	text-align: center;
	line-height: 1.7;
}
.design_box .list ul li .txt b{
	font-size: 1.2vw;
}
.boxes.design_box{
	padding: 10vw 0px;
}
.boxes.design_box .sub_title{
	margin-bottom: 5vw;
}
.f1Box{
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.f1Box .left{
	width: 30%;
	position: relative;
	top: 5vw;
}

.f1Box .list{
	width: 65%;
}
.f1Box .left .sub_title{
	margin-bottom: 1vw;
}
.f1Box .left .info{
	color: #fff;
	width: 100%;
	font-size: 1vw;
	line-height: 2;
}
.f1Box .left .info p{
	margin-bottom: 0.5vw;
}

.f1Box .list ul li{
	padding: 25px 50px;
	margin-bottom: 1vw;
	color: #fff;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.f1Box .list ul li .en{
	font-size: 18px;
	display: flex;
	align-items: flex-end;
	position: relative;
}

.f1Box .list ul li .en span{
	font-family: BrownBlod;
	font-size: 2vw;
	margin-left: 1vw;
	line-height: 1;
}
.f1Box .list ul li .text{
	width: 50%;
	position: relative;
}

.f1Box .list ul li .text .name{
	width: 100%;
	height: auto;
	position: relative;
	font-size: 1.2vw;
	font-weight: bold;
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.f1Box .list ul li .text .name::after{
	width: 110px;
	height: 10px;
	position: absolute;
	left: 0%;
	bottom: 0%;
	background: url( ../image/line.png) no-repeat;
	content: '';
}

.f1Box .list ul li .text .des{
	width: 100%;
	font-size: 16px;
	line-height: 2;
}
.f1Box .list ul li .img{
	width: 100%;
	height: 0%;
	position: absolute;
	overflow: hidden;
	-webkit-transition: all .45s;
	left: 0%;
	top: 50%;
}
.f1Box .list ul li .img img{
	object-fit: cover;
	height: 100%;
}
.f1Box .list ul li:hover .img{
	height: 100%;
	top: 0%;
}
.boxes.faq_box{
	background: url( ../image/mini_bg.jpg) center center no-repeat;
	background-size: cover;
}
.faq_box .list{
	width: 100%;
	height: auto;
	position: relative;
}
.faq_box .list ul li{
	width: 100%;
	height: auto;
	position: relative;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	padding-bottom: 15px;
	margin-bottom: 25px;
}
.faq_box .list ul li .question,.faq_box .list ul li .answer{
	width: 100%;
	height: auto;
	position: relative;
	display: flex;
}
.faq_box .list ul li .question .letter,.faq_box .list ul li .answer .letter{
	width: 35px;
	height: 40px;
	line-height: 40px;
	font-size: 30px;
	font-family: Poppins;
	color: #fff;
}
.faq_box .list ul li .question .txt,.faq_box .list ul li .answer .txt{
	width: calc(100% - 35px);
	height: auto;
	padding: 10px 0px;
	line-height: 20px;
	font-size: 18px;
	color: #fff;
}
.faq_box .list ul li .answer .txt{
	font-size: 16px;
	color: rgba(255, 255, 255, .7);
	padding: 5px 0px;
	line-height: 30px;
}

.mini_case{
	width: 100%;
	height: auto;
	position: relative;
}
.mini_case ul{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	align-items: flex-start;
}
.mini_case ul li{
	width: 28%;
	height: auto;
	margin-right: 8%;
	position: relative;
	margin-bottom: 4vw;
}
.mini_case ul li:nth-child(3n){
	margin-right: 0%;
}
.mini_case ul li:nth-child(2){
	margin-top: 30vh;
}
.mini_case ul li:nth-child(3){
	margin-top: 60vh;
}
.mini_case ul li:nth-child(4){
	margin-top: -60vh;
}
.mini_case ul li:nth-child(5){
	margin-top: -30vh;
}
.mini_case ul li .name{
	width: 100%;
	height: auto;
	position: relative;
	left: 0px;
	bottom: 0%;
	padding: 35px 0px 0px;
}

.mini_case ul li .name b{
	width: 100%;
	height: auto;
	position: relative;
	text-transform: uppercase;
	color: #fff;
	font-size: 2vw;
	margin-top: 25px;
	font-family: Poppins;
	line-height: 1;
}

.mini_case ul li .name p{
	font-size: 1.2vw;
	line-height: 2;
	color: #fff;
	position: relative;
	-webkit-transition: all .65s;
}

.mini_case ul li .drcode{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0%;
	top: 0%;
	background: rgba(0, 0, 0, .3);
	backdrop-filter: blur(10px);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	-webkit-transition: all .5s;
	visibility: hidden;
}
.mini_case ul li:hover .drcode{
	opacity: 1;
	visibility: visible;
}
.mini_case ul li .drcode .dr{
	width: 40%;
}

.mini_case ul li .drcode .dr p{
	display: block;
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 16px;
	margin-top: 25px;
}

.js-mouse-stalker {
	z-index: 9000;
	position: fixed;
	top: 0;
	left: 0;
	mix-blend-mode: difference;
	cursor: none;
	opacity: 0;
	pointer-events: none;
	/* cubic-bezier(.19, 1, .22, 1) */
	transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.js-mouse-stalker .js-mouse-stalker__cursor,
.js-mouse-stalker .js-mouse-stalker__follower {
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%;
	cursor: none;
	pointer-events: none
}

.js-mouse-stalker .js-mouse-stalker__cursor {
	z-index: 2;
	top: 6px;
	left: 6px;
	width: 8px;
	height: 8px;
	background-color: #cf2f28;
	transition: all .5s cubic-bezier(.215, .61, .355, 1);
	transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}

.js-mouse-stalker .js-mouse-stalker__follower {
	z-index: 1;
	top: -25px;
	left: -25px;
	width: 50px;
	height: 50px;
	border: 1px solid rgba(0, 0, 0, 0);
	
}

.js-mouse-stalker.is-hover .js-mouse-stalker__cursor {
	top: -35px;
	left: -35px;
	width: 80px;
	height: 80px;
	background-color: #cf2f28;
	opacity: .3
}

.js-mouse-stalker.is-hover .js-mouse-stalker__follower {
	z-index: 3;
	top: -35px;
	left: -35px;
	width: 80px;
	height: 80px;
	opacity: .6
}

.js-mouse-stalker.is-hover .js-mouse-stalker__follower:before {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 15px;
	height: 15px;
	margin-left: -7.5px;
	margin-top: -7.5px;
	
	background-size: cover;
	content: "";
}

.js-mouse-stalker.is-drag .js-mouse-stalker__cursor {
	top: -26px;
	left: -26px;
	width: 50px;
	height: 50px;
	background-color: #fff;
	opacity: .3
}

.js-mouse-stalker.is-drag .js-mouse-stalker__follower {
	z-index: 3;
	top: -26px;
	left: -26px;
	width: 50px;
	height: 50px;
	opacity: .6
}

.js-mouse-stalker.is-drag .js-mouse-stalker__follower:before {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	margin-top: -10px;
	color: #fff;
	font-size: .9rem;
	font-weight: 400;
	text-align: center;
	content: "Drag"
}

.detail_top{
    width: 100%;
    height: auto;
    position: relative;
    background: #000;
    margin-top: 0px;
    padding: 200px 0px 75px;
    color: #fff;
}

.detail_top .title{
    font-size: 48px;
    line-height: 1.5;
    font-weight: bold;
}

.detail_top .info{
    margin-top: 20px;
    line-height: 1;
    font-size: 12px;
    line-height: 1.5;
    opacity: .6;
}

.detail_box{
	width: 80%;
	padding: 70px 0 0px;
	margin-bottom: 5vw;

}

.singePage{
	font-size: 16px;
}

.detail_box .dpl{
	padding: 0px;
	width: 60%;
}
.dpl {
    width: calc(100% - 250px);
    padding: 0px;
    padding-right: 80px;
    border: none;
}

.ndc_npnews{
    justify-content: space-between;
    margin-top: 55px;
	border: none;
}
.ndc_npnews .post_next, .ndc_npnews .post_prev{
    padding: 0px;
    width: 49%;
    font-size: 14px;
}
.ndc_npnews .post_next .icon, .ndc_npnews .post_prev .icon{
    width: 64px;
}
.ndc_npnews .post_next .name, .ndc_npnews .post_prev .name{
    width: calc(100% - 64px);
}
.ndc_npnews .post_next .icon:before, .ndc_npnews .post_prev .icon:before{
    display: none;
}

.ndc_npnews .post_prev{
    border: none;
}

.detail_box .dpr {
    width: 30%;
    height: auto;
    background: #fff;
    align-self: flex-start;
    background: #fafafa;
    padding: 35px;
}

.anli_detail2{
    border: 1px solid #bb0a0a;
    padding: 15px;
    background: #fff3f3;
    position: relative;
    padding-top: 25px;
}

.anli_detail2:after{
    width: 0;
    height: 0;
    border-bottom: 10px solid #ffffff;
    border-left: 10px solid transparent;
    position: absolute;
    right: -1px;
    bottom: -1px;
    content: '';
}
.anli_detail2:before{
    width: 0;
    height: 0;
    border-top: 10px solid #bb0a0a;
    border-right: 10px solid transparent;
    position: absolute;
    right: -1px;
    bottom: -1px;
    content: '';
    z-index: 2;
}
.dpr .name {
    color: #3e3e3e;
    font-size: 28px;
    line-height: 1.5;
    font-weight: bold;
}

.dpr .sames {
    margin-top: 22px;
}

.dpr .sames a {
    width: 100%;
    display: block;
    border-top: 1px solid #E3DDDD;
    padding: 22px 0;
}

.dpr .sames a .title {
    font-size: 16px;
    line-height: 1.6;
    color: #3e3e3e;
    transition: all 0.36s;
}

.dpr .sames a .time {
    margin-top: 10px;
    font-size: 12px;
    line-height: 1.5;
    color: #848484;
}
.sub_title.pos{
	position: absolute;
	width: 100%;
}

#shutime{
    width: 100%;
    height: 100vh;
    position:absolute;
    left: 0%;
    top: 0%;
}

.boxes.st{
    height: 100vh;
    position: relative;
    padding: 0px;
}

.boxes.st .info{
    width: 40%;
    height: auto;
    position: relative;
    color: #fff;
}

.add_atop .sub_title{
    margin-bottom: 1.5vw;
}
.menu_bar {
	width: 70px;
	height: auto;
	position: fixed;
	top: 50%;
	-webkit-transform: translateY(-50%);
	background: #fff;
	padding: 15px 15px;
	right: 3%;
	border-radius: 100px;
	font-size: 28px;
	z-index: 5;
	box-shadow: 0px 0px 30px rgba(0, 0, 0, .1);
}

.menu_bar a {
	width: 100%;
	height: auto;
	line-height: 55px;
	display: block;
	text-align: center;
	cursor: pointer;
	border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.menu_bar a .icon {
	width: 40px;
	height: 40px;
	margin: 10px auto;
	position: relative;
}

.menu_bar a .icon:after{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0%;
    top: 0%;
    background: url( ../image/menu_icon.png) no-repeat;
	background-size: cover;
	content: '';
}

.menu_bar a:nth-child(1) .icon:after{
    background-position: -40px 0px;
}

.menu_bar a .tels{
    position: absolute;
    opacity: 0;
    font-family: BrownBlod;
    font-size: 18px;
    top: 10px;
    color: #fff;
    background: #45cb7a;
    left: -133px;
    line-height: 1.2;
    padding:15px 10px;
    border-radius: 5px;
    width: 124px;
}
.menu_bar a .tels:after,.menu_bar a .img:after{
    width: 0px;
    height: 0px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #45cb7a;
    content: '';
    position:absolute;
    right: -5px;
    top: 50%;
    margin-top: -5px;
}
.menu_bar a .tels span{
    font-size: 14px;
    display: block;
    margin-top: 5px;
}
.menu_bar a:hover .tels,.menu_bar a:hover .img{
    opacity: 1;
}

.menu_bar a .img{
    position: absolute;
    opacity: 0;
    width: 124px;
    height: auto;
    background: #45cb7a;
    color: #fff;
    padding: 10px;
    left: -133px;
    top: 70%;
    -webkit-transform: translateY(-50%);
    font-size: 14px;
    line-height: 1.2;
}
.menu_bar a .img p{
    display: block;
    margin-top: 5px;
    margin-top: 5px;
}


.menu_bar a:last-child{
    border-bottom: 1px solid #fff;
}

.boxes.st .w1400{
    height: 100%;
    align-items: center;
}

#nav-icon2{
  width: 30px;
  height: 30px;
  position: absolute;
  right: 3%;
  top: 20px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  z-index: 5;
}


/* Icon 2 */

#nav-icon2 {
	display: none;
}

#nav-icon2 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 50%;
  background: #fff;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon2 span:nth-child(even) {
  left: 50%;
  border-radius: 0 9px 9px 0;
}

#nav-icon2 span:nth-child(odd) {
  left:0px;
  border-radius: 9px 0 0 9px;
}

#nav-icon2 span:nth-child(1), #nav-icon2 span:nth-child(2) {
  top: 0px;
}

#nav-icon2 span:nth-child(3), #nav-icon2 span:nth-child(4) {
  top: 10px;
}

#nav-icon2 span:nth-child(5), #nav-icon2 span:nth-child(6) {
  top: 20px;
}

#nav-icon2.open span:nth-child(1),#nav-icon2.open span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon2.open span:nth-child(2),#nav-icon2.open span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon2.open span:nth-child(1) {
  left: 5px;
  top: 7px;
}

#nav-icon2.open span:nth-child(2) {
  left: calc(50% - 5px);
  top: 7px;
}

#nav-icon2.open span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(5) {
  left: 5px;
  top: 12px;
}

#nav-icon2.open span:nth-child(6) {
  left: calc(50% - 5px);
  top: 12px;
}
.h5List{
    margin-top: 3vw;
    position: relative;
}
.h5List ul {
	display: flex;
	flex-wrap: wrap;
}

.h5List ul li {
	width: 48%;
	position: relative;
	margin-right: 4%;
	margin-bottom: 35px;
}

.h5List ul li:nth-child(even) {
	margin-right: 0%;
}

.h5List ul li .thum {
	position: relative;
	overflow: hidden;
	border-radius: 15px 15px 0px 0px;
}

.h5List ul li .pic {
	position: relative;
	width: 100%;
	-webkit-transition: all 0.5s;
}

.h5List ul li .title {
	width: 100%;
	height: auto;
	padding: 10px 0px;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.h5List ul li .title .n {
	width: calc(100% - 60px);
	height: auto;
	font-size: 18px;
	line-height: 50px;
}

.h5List ul li .qrcode {
	position: absolute;
	width: 120px;
	top: 55%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-webkit-transition: all .5s;
	text-align: center;
	color: #fff;
	opacity: 0;
	visibility: hidden;
}

.h5List ul li .title .i {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	overflow: hidden;
}

.h5List ul li .qrcode img {
	display: block;
	box-shadow: 0px 0px 15px rgba(0, 0, 0, .1);
	margin-bottom: 5px;
}

.h5List ul li:hover .pic::after {
	opacity: 0.9;
}

.h5List ul li:hover .qrcode {
	top: 50%;
	opacity: 1;
	visibility: visible;
}

@media screen and (max-width: 1500px) {
    .sub_name p,.sub_name b{
        font-size: 36px;
    }
    .service_box .box .inner{
        padding: 35px 25px;
    }
    .service_box .box{
        width: 32%;
    }
    .service_box .box .info .name{
        font-size: 22px;
    }
    .service_box .box .info .des{
        font-size: 14px;
        line-height: 20px;
        min-height: 40px;
    }
    .service_box .box .info .marks span{
        font-size: 14px;
        padding: 0px;
    }
    .service_box .box .info a{
        width: 150px;
        height: 50px;
        line-height: 50px;
        font-size: 14px;
    }

    .news ul li .name{
        font-size: 16px;
    }

}

@media screen and (max-width: 1400px) {
    .found_box .img{
        width: 45%;
    }
    .found_box .list{
        width: 50%;
    }
    .w1400,.detail_box{
        width: 90%;
    }
    .service_box{
        width: 90%;
        margin-left: 5%;
    }
    .detail_box .dpl{
        width: 65%;
    }
    .sub_box{
        width: 90%;
        left: 5%;
    }
}

@media screen and (max-width: 1200px) {
	header .logo{
	    width: 150px;
	}
	header .phone{
	    width: 180px;
	}
	.service_box .box .info .des{
	    font-size: 1.4vw;
	}
	.service_box .box .info a{
	    font-size: 14px;
	    width: 150px;
        height: 50px;
        line-height: 50px;
	}
	.hcase ul li{
	    width: 48%;
	}
	.news ul li .name{
	    font-size: 16px;
	}
	header{
	    padding: 0px 5%;
	}
	.sub_box{
	    width: 90%;
        height: auto;
        left: 5%;
	}
	.w1400{
	    width: 90%;
	}

	.sub_box .website {
        width: 50%;
        font-size: 14px;
	}
	.found_box .list{
	    width: 60%;
	}
	.found_box .img{
	    width: 40%;
	}
	.common_title{
	    font-size:3vw;
	}
	.found_box .list ul li .name,.process_box .process .des{
	    font-size: 16px;
	}
	.method ul li .icon{
	    -webkit-transform: scale(0.6);
	    top: 15%;
	}
	.process_box .list ul li .name{
	    font-size: 24px;
	}
	.detail_box{
	    width: 90%;
	}
	.detail_box .dpl{
	    width: 65%;
	}
	.welcome-panda{
	   width: 100vw;
	   height: 96vw;
	}
	.welcome .text-block{
	    width: 90%;
	    left: 5%;
	    height: auto;
        top: 20%;
        filter: blur(0px);
        visibility: visible;
	}
	.welcome .text-block .subtitle{
	    font-size: 6vw;
	    margin-bottom: 5vw;
	    font-style: normal;
	    font-family: alibaba;
	}
	.welcome .text-block .text{
	    font-size: 16px;    
	    font-family: alibaba;
	    margin-bottom: 2vw;
	}
	.welcome .text-block .text br{
	    display: none;
	}
	.header .logo{
	    width: 120px;
	}
	.nav{
	    width: calc(100% - 260px);
        position: relative;
        left: 0%;
        -webkit-transform: translateX(0%);
	}
	.header .phone .text{
	    display: none;
	}
	.nav ul li:nth-child(1),.nav ul li:nth-child(4),.nav ul li:nth-child(5){
	    display: none;
	}
	.header .phone{
	    width: 42px;
        height: 42px;
	}
	.nav a{
	    font-size: 14px;
	}
	.nav ul li{
	    width: auto;
	}
	.nav ul li .second{
	    width: 170%;
	    left: -35%;
	}
	.nav ul li .second a{
	    font-size: 12px;
	}
	.welcome .text-block h1{
	    font-size: 6vw;
	    margin-bottom: 3vw;
	    font-family: alibaba;
	}
	.welcome .text-block .subtitle::before{
	    width: 12%;
	}
	.welcome .text-block .img{
	    width: 100%;
	}
	.header .phone {
        width: 37px;
        height: 37px;
        display: none;
    }
	.header .phone .img{
	    width: 35px;
	    height: 35px;
	    left: 0%;
	    top: 0%;
	}
	.nav_open{
	    display: block;
        position: absolute;
        width: 30px;
        height: auto;
        background: #45cb7a;
        left: -30px;
        color: #fff;
        padding: 10px 5px;
        text-align: center;
        line-height: 1.2;
        border-radius: 5px 0px 0px 5px;
        top: 50%;
        font-family: alibaba;
        -webkit-transform: translateY(-50%);
	}
	
	.nav_bar{
	    right: 0%;
	    -webkit-transform: translateY(-50%) translateX(100%);
	    border: none;
	    -webkit-transition:all 0.5s;
	    border-radius: 10px 0px 0px 10px;
	    box-shadow: 0px 0px 30px rgba(0,0,0,.1);
	}
	
	.nav_bar.active{
	    -webkit-transform: translateY(-50%) translateX(0%);
	}
	
}

@media screen and (max-width: 768px) {
    .cd_title{
        font-size: 7vw;
    }
    .cd_content{
        width: 100%;
    }
    .cd_right{
        position: relative;
        width: 100%;
    }
    .case_nav a,.hcase ul li a .en_title{
        font-size: 6vw;
    }
    
    #canvas{
      display: none;
    }
    .about_banner{
        height: auto;
        padding: 10vw 0px;
        padding-top: 25vw;
    }
    .add_atop{
        position: relative;
        left: 5%;
        top: 0%;
        -webkit-transform: translateY(0%);
        flex-wrap: wrap;
    }
    .cd_info,.cd_mark{
        z-index: 5;
        position: relative;
    }
    .cd_mark span{
        font-size: 10px;
        padding: 3px 10px;
        margin-right: 5px;
        margin-bottom: 5px;
        font-size: 10px;
    }
    .cd_info{
        font-size: 14px;
    }
    .case_img::after{
        pointer-events: none;
    }
    .cd_right_link img{
        width: 15px;
    }
    .cd_right_link p{
        font-size: 12px;
    }
    .cd_right_link{
        height: 40px;
        line-height: 40px;
        padding: 0px 15px;
    }
    .case_img img{
        transform: scale(1);
    }
    .add_atop .left{
        width: 100%;
    }
    .nav{
        width: calc(100% - 140px);
    }
    .header .logo{
        width: 100px;
    }
    .st_box{
        display: none;
    }
    #nav-icon2{
		display: none;
	}
	header .logo{
	    width: 120px;
	    margin-left: 5%;
	    z-index: 2;
	}
	nav a{
	    width: 100%;
	    display: block;
        padding: 25px 5%;
        color: #000;
        font-size: 20px;
	}

	header nav {
        visibility: hidden;
        width: 100%;
        height: 0vh;
        right: 0;
        padding-top: 60px;
        position: fixed;
        top: 0px;
        -webkit-transition: all .6s cubic-bezier(0.19, 1, 0.22, 1);
        display: block;
        background: #fff;
        overflow: hidden;
    }
    header {
        height: 60px;
        left: 0%;
        top: 0px;
        padding: 0px;
        width: 100%;
        margin-left: 0%;
        background: #fff;
        box-shadow: 0px 0px 30px rgb(0 0 0 / 10%);
        display: none;
    }
    .news_left .news ul li{
        margin-bottom: 5vw;
    }
    header .phone{
        width: auto;
        margin-right: 60px;
    }
    header .phone .img{
        display: none;
    }
    header .phone .text{
        position: relative;
        width: 100%;
        display: block;
        left: 0%;
    }
    .service_box .words{
        left: 0%;
        width: 100%;
        text-align: center;
    }
    .service_box .box{
        height: auto;
        margin-bottom: 5vw;
        width: 100%;
    }
    .service_box{
        width: 90%;
        margin-left: 5%;
        flex-wrap: wrap;
    }
    .service_box .box .inner{
        position: relative;
        padding: 10% 5%;
    }
    .slogan{
        width: 100%;
    }
    .slogan .p{
        font-size: 6vw;
        margin-bottom: 2vw;
        font-weight: bold;
    }
    .slogan .b{
        font-size: 6vw;
    }
    .service_box .box .info{
        width: 100%;
    }
    .service_box .box .info .name{
        font-size: 20px;
    }
    .news.n ul li:nth-child(n+4){
        display: block;
    }
    .service_box .box .info a{
        width: 120px;
        height: 45px;
        line-height: 45px;
        font-size: 12px;
        margin-top: 3vw;
    }
    .boxes.b2 {
        padding-top: 10vw;
    }
    .sub_name{
        margin-bottom: 5vw;
    }
    .service_box .box .inner.i2 .img, .service_box .box .inner.i3 .img{
        top: auto;
    }
    .service_box .box .info .marks span{
        margin-bottom: 2vw;
        line-height: 35px;
    }
    .news ul li:nth-child(n+4){
        display: none;
    }
    .contact_box .form,.address_info{
        width: 100%;
    }
    .welcome .text-block .text br{
        display: block;
    }
    .service_box .box .info .des{
        font-size: 12px;
        min-height: auto;
        opacity: .7;
    }
    .service_box .img{
        top: auto;
        -webkit-transform: translateY(0%);
        bottom: 0%;
        width: 60%;
    }
    .sub_name b{
        font-size: 24px;
    }
    .sub_name p, .sub_title p{
        font-size: 18px;
    }
    .hcase ul li{
        width: 100%;
        margin-bottom: 10vw;
    }
    .hcase ul li:nth-child(odd) {
        margin-top: 0px
    }

    .hcase ul li a .title{
        font-size: 4vw;
    }
    .hcase ul li a .thum{
        margin-bottom: 3vw;
    }
    .hcase .sub_name {
        top: -8vw;
    }
    .more{
        width: 120px;
        height: 40px;
        line-height: 40px;
        border-radius: 50px;
    }
    
    .more .ring{
        border: 1px solid #45cb7a;
        border-radius: 50px;
        font-size: 12px;
    }
    
    .more .txt{
        font-size: 12px;
    }
    
    .boxes.b4,.boxes.b5{
        margin-bottom: 10vw;
    }
    .sub_title b{
        font-size: 20px;
        margin-bottom: 1vw;
    }
    
    .news ul li{
        width: 100%;
        margin-right: 0%;
        margin-bottom: 25px;
    }
    .news ul li .info .des{
        display: none;
    }
    
    .news ul li .thum{
        margin-bottom: 10px;
    }
    
    .news ul li .name {
        font-size: 14px;
        margin-bottom: 5px;
        font-weight: normal;
    }
    .news ul li .info .marks a{
        font-size: 10px;
    }
    .parters ul li{
        width: 24%;
    }
    
    .contact_box{
        width: 100%;
    }
    
    .contact_box .form .row input{
        font-size: 14px;
        height: 50px;
        padding-left: 15px;
    }
    .contact_box .form .row{
        margin-bottom: 2vw;
        width: 100%;
        line-height: 40px;
        border: 1px solid rgba(0, 0, 0, .1);
        position: relative;
    }
    .address_info ul li {
        width: 100%;
        font-size: 14px;
        line-height: 1.4;
        margin-bottom: 5vw;
    }
    
    .submit{
        width: 150px;
        height: 50px;
        line-height: 50px;
        font-size: 16px;
        margin-bottom: 15vw;
        margin-top: 5vw;
    }
    
    .form_tips{
        font-size: 10px;
        opacity: 0.4;
    }
    
    .js-mouse-stalker{
        display: none;
    }
    .marquee__inner span{
        font-size: 12vw;
        padding: 0 4vw;
    }    
    .address_info ul li p:before{
        width: 55px;
        height: 4px;
    }
    .marquee__inner{
        margin-bottom: 10vw;
    }
    
    .contact_box .form .row:after{
        width: 5px;
        height: 100%;
        position: absolute;
        left: 0%;
        top: 0%;
        content: '';
        background: #45cb7a;
        content: '';
    }
    
    .contact_box .form .row input::-webkit-input-placeholder {
    	color: rgba(0,0,0,.2);
    }
    .copyright{
        width: 100%;
        line-height: 20px;
        display: block;
        font-size: 10px;
    }
    .marquee span:nth-child(even) {
        -webkit-text-stroke: 1px #fff;
    }
    .footer{
        padding-bottom: 65px;
    }
    header.active #nav-icon2 span {
        background: #000;
    }
    header nav.active {
        visibility: visible;
        height: 100vh;
    }
    header.hide {
        -webkit-transform: translateY(-0%);
    }
    header.active {
        background: rgba(255,255,255,1);
    }
    header .logo img:nth-child(2) {
        opacity: 1;
    }
    header .logo img:nth-child(1) {
        opacity: 0;
    }
    header .phone{
        color: #000;
    }
    #nav-icon2 span{
        background: #000;
    }
    .contact_box .form .row input::-webkit-input-placeholder {
    	color: rgba(0,0,0,.5);
    }
    .service_box .box .inner{
        border-radius: 5px;
    }
    .sub_banner{
        height: 50vh;
    }
    .case_show{
        display: none;
    }
    .case_left{
        width: 100%;
    }
    .sub_banner::before{
        font-size: 16vw;
        top: 55%;
        opacity: 0.1;
    }
    .case_left .info strong{
        font-size: 6vw;
    }
    .case_left .info b{
        font-size: 24px;
    }
    .case_left .info p{
        font-size: 18px;
    }
    .sult_btn{
        width: 200px;
        font-size: 12px;
        height: 40px;
        line-height: 40px;
    }
    .sult_btn .icon{
        width: 15px;
        margin-right: 2px;
    }
    .case_nav{
        flex-wrap: wrap;
    }

    .header.active .phone .img {
        background-position: -35px 0px;
        border-color: #000;
    }

    .hcase.inner ul li {
        margin-bottom: 10vw;
        width: 100%;
    }
    .sub_box .website{
        display: none;
    }
    .found_box{
        direction: initial;
        flex-wrap: wrap;
    }
    .found_box .img{
        width: 70%;
        margin-left: 15%;
        margin-bottom: 5vw;
    }
    .found_box .list{
        width: 100%;
    }
    .common_title{
        font-size: 6vw;
    }
    .found_box .list ul{
        justify-content: space-between;
    }
    .found_box .list ul li{
        width: 48%;
        flex-wrap: wrap;
        text-align: center;
        margin-bottom: 5vw;
    }
    .found_box .list ul li .num{
        font-size: 8vw;
        width: 100%;
    }
    .found_box .list ul li .name{
        width: 100%;
        margin-left: 0%;
        padding-bottom: 10px;
    }
    .found_box .list ul li .name::after{
        width: 55px;
        height: 5px;
        background-size: cover;
        left: 50%;
        margin-left: -27.5px;
    }
    .boxes{
        padding: 10vw 0px;
    }
    .f1Box{
        flex-wrap: wrap;
    }
    .f1Box .left,.f1Box .list{
        width: 100%;
    }
    .f1Box .list ul li .img,.f1Box .list ul li .en{
        display: none;
    }
    .f1Box .list ul li .text{
        width: 100%;
    }
    .f1Box .list ul li{
        padding: 25px 0% 0px;
        margin-bottom: 0px;
    }
    .f1Box .list ul li .text .name{
        font-size: 14px;
        font-weight: normal;
        margin-bottom: 5px;
        padding-bottom: 10px;
    }
    .f1Box .list ul li .text .des{
        font-size: 12px;
    }
    .f1Box .list ul li .text .name::after{
        width: 55px;
        height: 5px;
        background-size: cover;
    }
    .f1Box .list{
        margin-top: 5vw;
    }
    .faq_box .list ul li .question .letter, .faq_box .list ul li .answer .letter{
        width: 20px;
        height: 20px;
        line-height: 20px;
        font-size: 16px;
    }
    .faq_box .list ul li .question .txt, .faq_box .list ul li .answer .txt{
        width: calc(100% - 20px);
        padding: 0px 0px;
        line-height: 20px;
        font-size: 14px;
    }
    .faq_box .list ul li .answer .txt{
        font-size: 12px;
        padding: 0px 0px;
        line-height: 20px;
    }
    .faq_box .list ul li .question{
        margin-bottom: 5px;
    }
    .sub_title.pos{
        position: relative;
    }
    .sub_title.r{
        text-align: center;
    }
    .mini_case ul{
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .mini_case ul li{
        width: 48%;
        margin-right: 4%;
    }
    .mini_case ul li:nth-child(even){
        margin-right: 0%;
        margin-top: 0px;
    }
    .mini_case ul li:nth-child(3),.mini_case ul li:nth-child(5){
        margin-top: 0px;
    }
    .method_box .box{
        width: 100%;
        height: auto;
        position: relative;
        left: 0%;
        -webkit-transform: translateX(0%);
    }
    .method_box .box::before,.method_box .box .center{
        display: none;
    }
    .method_box .box ul{
        position: relative;
    }
    .method_box .box ul li{
        width: 100%;
        height: auto;
        position: relative;
        left: 0px;
        top: 0px;
        border-radius: 0px;
        background: transparent;
        display: flex;
        justify-content: space-between;
        margin-bottom: 5vw;
    }
    .method_box .box ul li:nth-child(even) .info {
        right: 0vw;
        text-align: left;
    }
    .method_box .box ul li .icon{
        width: 40px;
        height: 40px;
        position: relative;
        left: 0%;
        top: 0%;
        -webkit-transform: translate(0%, 0%);
        background-size: auto 40px;
    }
    .method_box .box ul li:nth-child(2) .icon {
        background-position: -40px 0px;
    }
    .method_box .box ul li:nth-child(3) .icon {
        background-position: -80px 0px;
    }
    .method_box .box ul li:nth-child(4) .icon {
        background-position: -120px 0px;
    }
    .method_box .box ul li .info{
        position: relative;
        width: calc(100% - 50px);
        text-align: left;
    }
    .method_box .box ul li:nth-child(2) {
        left: auto;
        right: 0px;
    }
    .method_box .box ul li:nth-child(3) {
        top: auto;
        bottom: 0px;
    }
    .method_box .box ul li:nth-child(4) {
        top: auto;
        bottom: 0px;
        left: auto;
        right: 0px;
    }
    .method_box .box ul li:nth-child(odd) .info{
        left: 0%;
        text-align: left;
    }
    .method_box .box ul li .info .name{
        font-size: 16px;
        padding-bottom: 10px;
        margin-bottom: 0px;
    }
    .method_box .box ul li .info .name::after{
        width: 55px;
        height: 5px;
        background-size: cover;
    }
    nav ul li{
        width: 100%;
        display: flex;
         border-bottom: 1px solid rgba(0,0,0,.1);
         align-items: center;
    }
    nav .second-level{
        position: relative;
        left: 0%;
        margin-left: 0%;
        top: 0px;
        display: block;
        width: calc(100% - 100px);
        display: flex;
        padding: 15px 0px;
    }
    nav .second-level a{
        font-size: 16px;
    }
    nav ul{
        flex-wrap: wrap;
    }
    nav ul li>a{
        width: 100px;
    }
    nav a .first-level{
        height: 25px;
        line-height: 25px;
    }
    nav ul li:hover .second-level{
        display: flex;
    }
    .method_box .box ul li .info .des{
        font-size: 14px;
    }
    .method_box .box ul li:nth-child(odd) .info .name::after {
        left: 0%;
        right: auto;
    }
    .design_box .list ul li{
        width: 50%;
    }

    .design_box .list ul li:nth-child(3) {
        background: #45cb7a;
    }
    .design_box .list ul li:nth-child(4) {
        background: rgba(255, 255, 255, .1);
    }
    .case_left .info{
        margin-bottom: 10vw;
       
    }
    .pchide{
        display: block;
    }
    .pcshow{
        display: none;
    }
    .num_list{
        width: 100%;
        margin-bottom: 5vw;
    }
    .add_atop .sub_name p{
        font-size: 10vw;
    }
    .boxes.st .info{
        width: 100%;
        padding-top: 10vw;
         color: #000;
    }
    #shutime{
        display: none;
    }
    .boxes.st{
        height: auto;
        padding-bottom: 10vw;
    }
    .singePage {
        font-size: 14px;
    }
    .news_left,.popular_news{
        width: 100%;
    }
    .popular_news{
        display: none;
    }
    .innerBox::before{
        height: 60px;
    }
    .boxes.innerBox{
        padding-top: 90px;
    }
    .innerBox .news ul li .name{
        width: 100%;
        font-size: 16px;
    }
    .author{
        margin-bottom: 3vw;
    }
    .author .img{
        width: 25px;
    }
    .author .txt{
        width: calc(100% - 40px);
        margin-left: 5px;
        font-size: 12px;
    }
    .h5List ul li {
		width: 100%;
		margin-right: 0%;
		margin-bottom: 10px;
	}

	.h5List ul li .title .n {
		font-size: 16px;
		line-height: 40px;
	}
	.detail_top{
	    padding: 100px 0px 35px;
	}
	.detail_top .title{
	    font-size: 24px;
	}
	.detail_box{
	    padding-top: 40px;
	}
	.detail_box .dpr{
	    display: none;
	}
	.detail_box .dpl{
	    width: 100%;
	}
	.singePage h1{
	    font-size: 18px;
	    line-height: 1.4;
        margin-bottom: 2vw;
	}
	.singePage h3{
	    font-size: 14px;
	}
	.num_list ul li .num span{
	    font-size: 40px;
	}
	.num_list ul li{
	    height: auto;
	}
	.num_list ul li .txt{
	    font-size: 12px;
	}

	.sub_title b.b2{
	    margin-bottom: 3vw;
	}
	.method{
	    width: 100%;
        height: auto;
        margin: 5vw 0px 15vw;
	}
	.method ul{
	    display: flex;
	    flex-wrap: wrap;
	}
	.method ul li{
	    position: relative;
        width: 50%;
        left: 0%;
        height: auto;
        -webkit-transform: translateX(0%);
        border-radius: 0px;
        padding-bottom: 5vw;
	}
	.method ul li .name{
	    position: relative;
        top: 0%;
	}
	.method ul li .icon{
	    position: relative;
        left: 0%;
        margin: 0px auto;
        top: 0%;
	}
	.method ul li:nth-child(1),.method ul li:nth-child(2),.method ul li:nth-child(5),.method ul li:nth-child(4) {
        left: 0%;
    }
    .method ul li:nth-child(4){
        left: 0%;
    }
    .method ul li .name p{
        font-size: 14px;
    }
    .method ul li .name b{
        font-size: 14px;
    }
    .method ul li:nth-child(5){
        width: 100%;
    }
    .process_box{
        flex-wrap: wrap;
    }
    .process_box .process{
        width: 100%;
        position: relative;
        top: 0vw;
    }
    .process_box .list{
        width: 100%;
    }
    .process_box .process .name b{
        text-align: center;
        font-size: 20px;
    }
    .process_box .process .des{
        display: none;
    }
    .process_box .list ul li{
        padding: 20px 15px;
        background: #fff;
    }
    .process_box .list ul li .name{
        font-size: 18px;
        margin-bottom: 10px;
        padding-bottom: 15px;
    }
    .process_box .list ul li .name::after{
        width: 55px;
        height: 5px;
        background-size: cover;
    }
    .process_box .list{
        margin-top: 5vw;
    }
    .process_box .list ul li .des{
        font-size: 14px;
    }
    .process_box .list ul li .letter{
        left: 15px;
        font-size: 12vw;
    }
    .process_box .list ul li .des{
        margin-bottom: 15px;
    }
    .sub_title{
        margin-bottom: 5vw;
    }
    .hcase ul li a .case_tips{
        margin-top: 15px;
        font-size: 12px;
    }
    .map{
        height: 40vh;
    }
    .friend_links{
        display: none;
    }
    nav .second-level{
        box-shadow: none;
    }
    .fx_box .fx_swiper{
        display: none;
    }
    .fx_box .list{
        width: 100%;
    }
    .boxes.b6{
        height: auto;
        padding: 10vw 0px;
    }
    .fx_box::before{
        display: none;
    }
    .fx_box .list ul{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .fx_box .list ul li{
        width: 48%;
        background: rgba(255,255,255,.1);
        border-radius: 5px;
        padding: 10px;
    }
    .fx_box .list ul li .info{
        height: auto;
    }
    .fx_box .list ul li .xh{
        line-height: 1.2;
        margin-bottom: 5px;
        font-size: 12px;
    }
    .fx_box .list ul li .info .name{
        font-size: 14px;
    }
    .fx_box .list ul li .info .des{
        font-size: 12px;
    }
    .fx_box .list ul li:last-child{
        width: 100%;
    }
    .menu_bar{
        width: 100%;
        top: auto;
        -webkit-transform: translateY(100%);
        right: 0%;
        bottom: 0%;
        border-radius: 0px;
        display: flex;
        -webkit-transition:all 0.5s;
        opacity: 0;
        visibility: hidden;
        z-index: 200;
        box-shadow: none;
    }
    .menu_bar.active{
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateY(0%);
    }
    .menu_bar a{
        width: 35%;
        line-height: 40px;
        border-bottom: none;
        position: relative;
        margin-left: 32.5%;
    }
    .menu_bar a .icon{
        margin: 0px auto;
        display: none;
    }
    .menu_bar a .tels{
        position: relative;
        left: 0px;
        width: 100%;
        opacity: 1;
        padding: 0px;
        top: 0px;
    }
    .menu_bar a .img{
        width: 100%;
        opacity: 1;
        left: 0px;
        top: 0%;
        padding: 0px;
        position: relative;
        -webkit-transform: translateY(0%);
    }
    .menu_bar a:first-child{
        display: none;
    }
    .menu_bar a .img:after{
        display: none;
    }
    .menu_bar a .img{
        background: #fff;
        color: #000;
    }
    .copytips{
        width: 100%;
        font-size: 10px;
        margin-top: 0px;
        margin-bottom: 10px;
    }
    .singePage h2{
        font-size: 14px;
    }
    .anli_title .b{
        font-size: 28vw;
    }
    .anli_title .b p{
        font-size: 12px;
        font-weight: normal;
    }
    .anli_total{
        padding: 15px;
        font-size: 12px;
    }
    .author .txt b{
        margin-bottom: 0px;
    }
    .author .txt p{
        font-size: 10px;
    }
    .singePage video{
        background: #000;
    }
    .ssl_box .left{
        width: 100%;
        flex-wrap: wrap;
    }
    .ssl_box .left .icon{
        width: 25%;
        margin-bottom: 3vw;
    }
    .ssl_box .left .d{
        font-size: 14px;
    }
    .ssl_box .sub_name{
        margin-bottom: 3.5vw;
    }
    .ssl_box .left a {
        width: 120px;
        height: 45px;
        line-height: 45px;
        font-size: 14px;
    }
    .ssl_box{
        padding-top: 35vw;
    }
    .ssl_box .left .info{
        width: 90%;
    }
    .remmon_list ul li {
        width: 100%;
        margin-right: 0%;
        padding: 5vw;
        margin-bottom: 5vw;
    }
    .remmon_list ul li .title{
        font-size: 5vw;
    }
    .remmon_list ul li .des p{
        margin-bottom: 0px;
    }
    .remmon_list ul li a {
        display: block;
        width: 120px;
        height: 45px;
        line-height: 43px;
    }
    .ssl_ys .sub_name {
        width: 100%;
        margin-bottom: 5vw;
        text-align: center;
    }
    .ssl_ys{
        flex-wrap: wrap;
        margin-bottom: 10vw;
    }
    .ssl_ys .right{
        width: 100%;
    }
    .sr_box .name{
        font-size: 4vw;
    }
    .sr_box .des{
        font-size: 14px;
    }
    .sr_box {
        width: 48%;
        padding: 6vw 4vw;
        margin-bottom: 3.5vw;
    }
    .zs_hbs ul:nth-child(odd),.zs_hbs ul:nth-child(even){
        animation: none;
        width: 100% !important;
    }
    .zs_hbs{
        width: 100%;
        margin-bottom: 5vw;
    }
    .zs_hbs ul li:nth-child(5){
        margin-right: 0%;
    }
    .zs_hbs ul li:nth-child(n+6){
        display: none;
    }
    .zs_hbs ul li{
        width: 19%;
        margin-right: 1.25%;
    }
    .ssl_hzhb {
        padding-bottom: 15vw;
    }
    
    .visual{
        width: 100%;
        left: 0%;
        display: none;
    }
    .case_slogan{
        width: 90%;
        left: 5%;
        position: relative;
        top: 0%;
        transform: translateY(0%);
        margin-top: 30vw;
        margin-bottom: 15vw;
    }
    .case_slogan .title{
        font-size: 8vw;
        margin-bottom: 3vw;
    }
    .case_slogan .info .d{
        font-size: 16px;
        margin-bottom: 4vw;
    }
    .case_banner:before,.case_banner:after{
        display: none;
    }
    .case_banner{
        height: auto;
    }
    .case_slogan .info{
        margin-bottom: 10vw;
    }
    .case_banner .more .txt {
        font-size: 14px;
    }
    .process_list ul li,.our_advantage ul li{
        width: 49%;
        padding: 5%;
    }
    .process_list ul li:nth-child(3n),.our_advantage ul li:nth-child(3n){
        margin-right: 2%;
    }
    .process_list ul li:nth-child(2n),.our_advantage ul li:nth-child(2n){
        margin-right: 0%;
    }
    .process_list ul li .name{
        font-size: 4.5vw;
        margin-bottom: 2vw;
    }
    .process_list ul li .des{
        font-size: 14px;
    }
    .process_list ul li:nth-child(n+4) {
        width: 49%;
        padding: 5%;
    }
    .process_list ul li:nth-child(7){
        width: 100%;
    }
    .our_advantage ul li{
        height: auto;
        padding: 5%;
    }
    .our_advantage{
        width: 90%;
        left: 5%;
        border-radius: 5px;
        padding-bottom: 12vw;
    }
    .our_advantage ul li .name {
        font-size: 4.5vw;
        margin-bottom: 2vw;
        text-align: center;
    }
    .our_advantage ul li .l{
        width: 60%;
    }
    .our_advantage ul li .des{
        font-size: 14px;
        opacity: 0.7;
    }
    .zc_process{
        padding-bottom: 15vw;
    }
    
    .flyweight {
        width: 200px;
        height: 50px;
        align-items: center;
        line-height: 50px;
        font-size: 14px;
    }
    .adv_box{
        padding-bottom: 10vw;
        margin-bottom: 15vw;
    }
}