/*css reset*/
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box;padding: 0; margin: 0;}
html,body{ padding: 0; margin: 0; font-family:"微软雅黑","Microsoft YaHei","MiSans","思源黑体","Source Han Sans CN"; line-height: 1;}
ol, ul {list-style: none; padding: 0; margin: 0;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none; }
table {border-collapse: collapse; border-spacing: 0;}
th,td { vertical-align: middle;padding: 0;}
a{text-decoration:none;	outline: none;hlbr:expression(this.onFocus=this.blur());}
input, select,textarea {vertical-align: middle;padding: 0;border: 0 none;margin: 0;font-family: inherit;}
img, iframe {border: none; text-decoration:none;}
img{vertical-align: top;}
strong {font-weight: bold;}
h1,h2,h3,h4,h5,h6{padding: 0; margin: 0;font-size: inherit}
:focus {outline: 0;}
::-webkit-input-placeholder { /* WebKit browsers */
	opacity: 0.3;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	opacity: 0.3;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	opacity: 0.3;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
	opacity: 0.3;
}
sup{
	font-size: 0.5em;
}
/*css common*/
.clearfix:after{content: "";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;font-size:0;}
.clearfix{*zoom:1;}
a{
color: inherit;
font-size: inherit;
border:none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color:transparent;
outline:none；
}
html.ie select::-ms-expand { display: none; }
html.ie input::-ms-clear { display: none; }
/*
	*:not(input,textarea){
	-webkit-touch-callout:none;
	-webkit-user-select:none;
}*/
:root{
	--theme-red: #d01818;
}
@font-face {
    font-family: "Font Awesome 5 Pro";
    font-style: normal;
    font-weight: 300;
    font-display: block;
    src: url(../fonts/fa-light-300.eot);
    src: url(../fonts/fa-light-300.eot?#iefix) format("embedded-opentype"), url(../fonts/fa-light-300.woff2) format("woff2"), url(../fonts/fa-light-300.woff) format("woff")
}
.fal {
    font-weight: 300
}
@font-face {
    font-family: "Font Awesome 5 Pro";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(../fonts/fa-regular-400.eot);
    src: url(../fonts/fa-regular-400.eot?#iefix) format("embedded-opentype"), url(../fonts/fa-regular-400.woff2) format("woff2"), url(../fonts/fa-regular-400.woff) format("woff")
}
.fal, .far {
    font-family: "Font Awesome 5 Pro"
}
.far {
    font-weight: 400
}
@font-face {
    font-family: "Font Awesome 5 Pro";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url(../fonts/fa-solid-900.eot);
    src: url(../fonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), url(../fonts/fa-solid-900.woff2) format("woff2"), url(../fonts/fa-solid-900.woff) format("woff")
}
.fa, .fas {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900
}
.fa,.fas,.fal,.far{
  font-style: normal;
}
@font-face {
  font-family: 'caseicon';
  src:  url('../fonts/caseicon.eot?6yr9po');
  src:  url('../fonts/caseicon.eot?6yr9po#iefix') format('embedded-opentype'),
    url('../fonts/caseicon.ttf?6yr9po') format('truetype'),
    url('../fonts/caseicon.woff?6yr9po') format('woff'),
    url('../fonts/caseicon.svg?6yr9po#caseicon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
.icon.case_icon_cata0:before {
  content: "\e900";
}
.icon.case_icon_cata1:before {
  content: "\e901";
}
.icon.case_icon_cata2:before {
  content: "\e902";
  -webkit-text-stroke-width: 0.01em;
}
.icon.case_icon_cata3:before {
  content: "\e903";
}
.icon.case_icon_cata4:before {
  content: "\e904";
}
.icon.case_icon_cata5:before {
  content: "\e905";
}
.icon.case_icon_cata6:before {
  content: "\e906";
}
.icon.case_icon_cata7:before {
  content: "\e907";
}
.icon.case_icon_cata8:before {
  content: "\e908";
}
.icon.case_icon_cata9:before {
  content: "\e909";
}

.mobile{
	display: none;
}
.web{
	display: inline-block;
}
.bg{
	width: 100%;
}
html {
	height: 100%;
	scroll-behavior: smooth;
	font-size: calc(100vw * 16 / 1920);
	color: #333;
}
body{
	position: relative;
	height: 100%;
	margin: 0 auto;
    -webkit-text-size-adjust: 100% !important;
	scroll-behavior: smooth;
	overflow-x: hidden;
}
.inner{
	max-width: 92%;
	margin: 0 auto;
}
.inner.w1000{
  width: 62.5em;
}
.inner.w1180{
  width: 73.75em;
}
.inner.w1240{
  width: 77.5em;
}
.inner.w1280{
  width: 80em;
}
.inner.w1560{
  width: 97.5em;
}
.anchorBL{
	display: none !important;
}


#wrap{
	padding-bottom: 43em;
	min-height: 100%;
	margin: 0 auto;
	position: relative;
}
.section{
	overflow: hidden;
}
.swiper{
	width: 100%;
}
.odometer{
	font-family: inherit;
}
.odometer.nopoint .odometer-formatting-mark{
	display: none;
}
.odometer .odometer-digit-spacer,.odometer .odometer-digit{
	vertical-align: top !important;
}
/*通用带icon title*/
.section-title span{
	font-size: 0.875em;
	vertical-align: middle;
}
.section-title img{
	vertical-align: middle;
	width: 1em;
}
.section-title img:first-child{
	margin-right: 0.3125em;
}
.section-title img:last-child{
	margin-left: 0.3125em;
}

.banner{
  position: relative;
  text-align: center;
  color: #fff;
}
.banner .bg{
  pointer-events: none;
}
.banner .inner{
  position: absolute;
  left: 0;
  right: 0;
  top: 45%;
}
.banner h1{
  font-size: 2.625em;
  font-weight: 500;
  margin-bottom: 1.15em;
  letter-spacing: 0.1em;
}
.banner p{
  font-size: 0.875em;
}
.banner p span{
  margin: 0 0.5em;
}
.banner p .cur{
  color: var(--theme-red);
}

/*视频弹框按钮*/
.video-btn{
    width: 4.6875em;
    height: 4.6875em;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: rgba(255,255,255,0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
}
.video-btn::before, .video-btn::after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
  animation: videobtncir 3s infinite;
}
.video-btn::before {
  animation-delay: 0.9s;
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
}
.video-btn::after {
  animation-delay: 0.6s;
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
}
@keyframes videobtncir {
  70% {
    box-shadow: 0 0 0 2.5em rgba(244, 68, 56, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
  }
}
.video-btn .fa-play::before{
	content: "\f04b";
}
/*视频弹框*/
.pop-video-box{
	position: fixed;
	left: 0;
	top: 0;
	z-index: 101;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(0,0,0,0.9);
}
.pop-video-box .inner{
	width: 56.25em;
	position: relative;
}
.pop-video-box .pop-close{
	position: absolute;
	right: 0;
	bottom: 100%;
	cursor: pointer;
	font-size: 1.75em;
	color: #fff;
	opacity: 0.65;
	margin-bottom: 1.25em;
	transition: opacity 0.5s;
}
.pop-video-box video{
	width: 100%;
}

/*按钮 hover深红*/
.theme-btn1{
  background-color: var(--theme-red);
  color: #fff;
  transition: background-color 0.5s;
  font-size: 0.9375em;
  padding: 1.3em 3.1em;
  display: inline-block;
}
.theme-btn1 .fa-chevron-right::before{
	content: "\f054";
}
/*按钮 hover翻滚*/
.theme-btn2{
  background-color: #fff;
  font-size: 0.9375em;
  padding: 1.3em 3.1em;
  display: inline-block;
  transition: color 0.4s;
  overflow: hidden;
  position: relative;
}
.theme-btn2:hover{
  color: #fff;
}
.theme-btn2::before {
  position: absolute;
  content: "";
  width: 0%;
  height: 100%;
  top: 0px;
  right: 0px;
  bottom: 0px;
  background-color: var(--theme-red);
  transition: width 0.4s,left 0.4s,right 0.4s;
}
.theme-btn2:hover::before{
  width: 100%;
  left: 0px;
} 
.theme-btn2 .theme-effect{
  overflow: hidden;
  display: block;
  height: 1em;
}
.theme-btn2 .theme-effect .effect-1{
  display: block;
  height: 100%;
  position: relative;
  top: 0%;
  transition: top 0.3s;
}
.theme-btn2:hover .theme-effect .effect-1{
  top: -100%;
}
.theme-btn2 .theme-effect i {
  margin-right: 0.36em;
}
.theme-btn2 .fa-chevron-right::before{
	content: "\f054";
}
/*preload*/
.preloader {
  background-color: #000;
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 1000;
  overflow: hidden;
  top: 0;
  left: 0;
}
.preloader .vertical-centered-box {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
}
.preloader .vertical-centered-box:after {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}
.preloader .vertical-centered-box .content {
  box-sizing: border-box;
  display: inline-block;
  vertical-align: middle;
  text-align: left;
  font-size: 0;
}
.preloader * {
  transition: all 0.3s;
}
.preloader .loader-circle {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  margin-left: -60px;
  margin-top: -60px;
}
.preloader .loader-line-mask {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 60px;
  height: 120px;
  margin-left: -60px;
  margin-top: -60px;
  overflow: hidden;
  transform-origin: 60px 60px;
  -webkit-mask-image: -webkit-linear-gradient(top, #000000, rgba(0, 0, 0, 0));
  animation: preloadrotate 1.2s infinite linear;
}
.preloader .loader-line-mask .loader-line {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}
.preloader #particles-background,
.preloader #particles-foreground {
  left: -51%;
  top: -51%;
  width: 202%;
  height: 202%;
  transform: scale3d(0.5, 0.5, 1);
}
.preloader #particles-background {
  background: #2c2d44;
  background-image: linear-gradient(45deg, #3f3251 2%, #002025 100%);
}
.preloader lesshat-selector {
  -lh-property: 0;
}
@keyframes preloadrotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.preloader [not-existing] {
  zoom: 1;
}
.preloader lesshat-selector {
  -lh-property: 0;
}
.preloader [not-existing] {
  zoom: 1;
}
.preloader lesshat-selector {
  -lh-property: 0;
}
.preloader [not-existing] {
  zoom: 1;
}
/*右下角百分比圆*/
.scroll-up {
  cursor: pointer;
  display: block;
  border-radius: 100%;
  box-shadow: inset 0 0 0 0.125em #c5c5c5;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  transform: translateY(1em);
  position: fixed;
  right: 0.25em;
  bottom: 2.1875em;
  height: 3.125em;
  width: 3.125em;
  transition: all 0.4s ease-in-out;
}
.scroll-up::after {
  position: absolute;
  font-family: "Font Awesome 5 Pro";
  content: "\f176";
  text-align: center;
  line-height: 2.78em;
  font-weight: 700;
  font-size: 1.125em;
  color: var(--theme-red);
  left: 0;
  top: 0;
  height: 2.78em;
  width: 2.78em;
  cursor: pointer;
  display: block;
  z-index: 1;
  transition: all 0.4s ease-in-out;
}
.scroll-up svg path {
  fill: none;
}
.scroll-up svg.scroll-circle path {
  stroke: var(--theme-red);
  stroke-width: 0.25em;
  box-sizing: border-box;
  transition: all 0.4s ease-in-out;
}
.scroll-up.active-scroll {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
/*侧边提示*/
#sidetip{
  position: fixed;
  right: 0.25em;
  bottom: 2.1875em;
  z-index: 1;
  margin-bottom: 4.25em;
}
#sidetip li{
  cursor: pointer;
  display: block;
  margin: 0.25em 0;
  background-color: #2e2e30;
  width: 3.125em;
  height: 3.125em;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.1875em;
  transition: background-color 0.5s;
}
#sidetip li:hover{
  background-color: var(--theme-red);
}
#sidetip img{
  width: 1.4375em;
}
#sidetip p{
  position: absolute;
  right: 100%;
  top: 50%; 
  border-radius: 0.1875em;
  height: 2.5em;
  margin-top: -1.25em;
  margin-right: 0.625em;
  line-height: 2.5;
  background-color: var(--theme-red);
  white-space: nowrap;
  overflow: hidden;
  max-width: 0;
  padding: 0;
  transition: max-width 0.5s,padding 0.5s;
}
#sidetip li:hover p{
  max-width: 14em;
  padding: 0 1.25em;
}
#sidetip p span{
  color: #fff;
  font-size: 0.875em;
}



/*header*/
#header{
	height: 6.25em;
	background-color: #fff;
}
#header .fix-box{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: inherit;
	z-index: 101;
	transition: transform 0.5s,box-shadow 0.5s;
	box-shadow: 0 -0.3125em 1em rgba(8, 106, 216, 0.29);
	background-color: #fff;
}
#header.hide .fix-box{
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);
	box-shadow: none;
}
#header .inner{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
	width: 101.25em;
	height: 100%;
}
#header .logo{
	display: block;
	width: 10.625em;
}
#header .logo img{
	width: 100%;
}
#header .tel{
	font-size: 1.25em;
	color: var(--theme-red);
  font-weight: bold;
}
#header .tel img{
	width: 0.9em;
	margin-right: 0.7em;
}
#header .tel img,#header .tel span{
	vertical-align: middle;
}
#header .nav{
	height: 100%;
}
#header .nav > li{
  position: relative;
  display: inline-block;
  vertical-align: top;
  height: 100%;
}
#header .nav > li.static{
  position: static;
}
#header .nav > li > a{
	font-size: 1.125em;
	font-weight: bold;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 1.11em;
	height: 100%;
	transition: color 0.5s;
}
#header .nav > li.active > a,#header .nav > li > a:hover{
	color: var(--theme-red);
}
#header .nav > li > a::before{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 0.22em;
	transition: background-color 0.5s;
}
#header .nav > li.active > a::before,#header .nav > li > a:hover::before{
	background-color: var(--theme-red);
}
#header .nav .sub-menu{
  position: absolute;
}
#header .nav .sub1{
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  background-color: var(--theme-red);
  color: #fff;
  text-align: center;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s;
}
#header .nav > li:hover .sub1{
  max-height: 36em;
}
#header .nav .sub1 li{
  transition: background-color 0.5s,color 0.5s;
}
#header .nav .sub1 li + li{
  border-top: 1px solid rgba(255,255,255,0.2);
}
#header .nav .sub1 a{
  display: block;
  padding: 1.25em 0;
}
#header .nav .sub1 li:hover,#header .nav .sub1 li.active{
  background-color: #222;
  color: var(--theme-red);
}
#header .nav .sub2{
  position: absolute;
  left: 0;
  right: 0;
  background-color: #fff;
  box-shadow: 0px 0.25em 1.25em rgba(20, 20, 20, 0.07);
  border-top: 1px solid #eaeaea;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s;
}
#header .nav > li:hover .sub2{
  max-height: 40em;
}
#header .nav .sub2 ul{
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  padding-bottom: 3.75em;
}
#header .nav .sub2 .width1{
  width: 71.875em;
}
#header .nav .sub2 .width2{
  width: 100%;
}
#header .nav .sub2 li{
  width: 33.333%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  flex-direction: row;
  padding: 3.75em 0;
  border-bottom: 1px solid #eaeaea;
  position: relative;
}
#header .nav .sub2 .col5 li{
  width: 20%;
}
#header .nav .sub2 .col4 li{
  width: 25%;
}
#header .nav .sub2 li:last-child::before{
  width: 500vw;
  height: 1px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  bottom: -1px;
  content: "";
  display: block;
  transform: translateX(-50%);
}
#header .nav .sub2 li .img{
  width: 8.75em;
  margin-right: 1em;
  margin-top: -2em;
  flex-shrink: 0;
  display: block;
}
#header .nav .sub2 li .img.notop{
  margin-top: 0;
}
#header .nav .sub2 li h5{
  font-size: 1.25em;
  color: #222;
  margin-bottom: 1.5em;
  transition: color 0.5s;
}
#header .nav .sub2 li h5:hover{
  color: var(--theme-red);
}
#header .nav .sub2 li p{
  font-size: 1em;
  color: var(--theme-red);
  margin-bottom: 1.25em;
  white-space: nowrap;
}
#header .nav .sub2 li h5:last-child,#header .nav .sub2 li p:last-child{
  margin-bottom: 0;
}
#header .nav .sub2 li p a{
  display: inline-block;
  vertical-align: middle;
  line-height: 1.1;
}
#header .nav .sub2 .col4 li p a,#header .nav .sub2 .col5 li p a{
  max-width: 10em;
  overflow: hidden;
  text-overflow: ellipsis;
}
#header .nav .sub2 li p:hover a{
  font-weight: bold;
}
#header .nav .sub2 li p::after{
  font-family: "Font Awesome 5 Pro";
  content: "\f176";
  display: inline-block;
  vertical-align: middle;
  transform: rotate(90deg);
  opacity: 0;
  transition: opacity 0.5s,margin-left 0.5s;
}
#header .nav .sub2 li p:hover::after{
  opacity: 1;
  margin-left: 1em;
}

/*footer*/
#footer{
  background-color: #000;
  margin-top: -43em;
  position: relative;
}
#footer .footer-top{
  height: 39.75em;
  padding-top: 7.5em;
  background-color: #222;
}
#footer .footer-top .inner{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row-reverse;
}
#footer .nav{
  color: #fff;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: 4.375em;
}
#footer .nav li{
  margin-right: 4em;
}
#footer .nav li:last-child{
  margin-right: 0;
}
#footer .nav h4{
  font-size: 1.375em;
  font-weight: 600;
  line-height: 1.37;
  margin-bottom: 1.36em;
}
#footer .nav p{
  line-height: 1.75;
  margin-bottom: 1em;
}
#footer .nav p:last-child{
  margin-bottom: 0;
}
#footer .nav p a{
  transition: color 0.2s;
}
#footer .nav .fa-chevron-right{
  color: var(--theme-red);
  margin-right: 0.625em;
}
#footer .nav .fa-chevron-right::before{
  content: "\f054";
}
#footer .link-box{
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-direction: row;
}
#footer .link-box li{
  background-color: rgba(73,73,73,0.2);
  border-radius: 0.25em;
  margin-right: 1em;
  position: relative;
  height: 1.875em;
  width: 1.875em;
  cursor: pointer;
  transition: background-color 0.5s;
  display: flex;
  align-items: center;
  justify-content: center;
}
#footer .link-box li:last-child{
  margin-right: 0;
}
#footer .link-box li:hover{
  background-color: var(--theme-red);
}
#footer .link-box .icon{
  width: 1em;
  opacity: 0.7;
}
#footer .link-box .qr-box{
  position: absolute;
  left: 50%;
  top: 100%;
  margin-top: 1.25em;
  background-color: #fff;
  border-radius: 0.3125em;
  width: 5.25em;
  margin-left: -2.625em;
  padding: 0.5em;
  opacity: 0;
  transition: opacity 0.5s;
  pointer-events: none;
}
#footer .link-box li:hover .qr-box{
  opacity: 1;
  pointer-events: auto;
}
#footer .link-box .qr-box::before{
  display: block;
  content: "";
  border-style: solid;
  border-color: transparent transparent #fff transparent;
  border-width: 0 0.4375em 0.4375em 0.4375em;
  position: absolute;
  left: 50%;
  bottom: 100%;
  margin-left: -0.4375em;
}
#footer .right-part{
  width: 46.3%;
  border-radius: 0.3125em;
  background-color: rgba(255,255,255,0.85);
  padding: 3.125em;
}
#footer .right-part h4{
  font-size: 1.5em;
  line-height: 1.37;
  font-weight: 600;
  margin-bottom: 0.625em;
}
#footer .right-part h4 img{
  margin-right: 0.5em;
  width: 1.083em;
  vertical-align: middle;
}
#footer .right-part p{
  font-size: 0.875em;
  color: #545454;
  line-height: 1.8;
  margin-bottom: 1.43em;
}
#footer .right-part ul{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
}
#footer .right-part li{
  width: 48.5%;
  margin-bottom: 1em;
  position: relative;
}
#footer .right-part li .icon{
  position: absolute;
  left: 0.9375em;
  top: 50%;
  z-index: 1;
  color: #000;
  transform: translate(0,-50%);
}
#footer .right-part li .icon i{
  font-size: 0.875em;
}
#footer .right-part li .fa-user::before{
  content: "\f007";
}
#footer .right-part li .fa-phone-alt::before{
  content: "\f879";
}
#footer .right-part li .fa-archway::before{
  content: "\f557";
}
#footer .right-part li .fa-file-alt::before{
  content: "\f15c";
}
#footer .right-part li input{
  padding: 0.714em 1.428em 0.714em 2.856em;
  width: 100%;
  font-size: 0.875em;
  background-color: #f2f3f5;
  line-height: 2;
}
#footer .right-part .btn-box{
  text-align: center;
}
#footer .right-part .theme-btn2{
  color: #fff;
  background-color: #000;
}
#footer .right-part .theme-btn2 .form_btn{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer; 
}
#footer .footer-bottom{
	height: 3.25em;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: row;
  text-align: center;
}
#footer .footer-bottom p{
	font-size: 0.75em;
	line-height: 1.8;
	color: #fff;
	opacity: 0.5;
}

/*sidenav*/
#sidenav{
	display: none;
}


@media only screen and (min-width:1024px){
  .video-btn:hover{
      color: var(--theme-red);
  }
  .pop-video-box .pop-close:hover{
    opacity: 1;
  }
  .theme-btn1:hover{
    background-color: #a41010;
  }
  #footer .nav p a:hover{
    color: var(--theme-red);
  }
}
@media only screen and (max-width:1024px){
	html { 
	    -webkit-text-size-adjust: 100%;
	    -moz-text-size-adjust: 100%;
	    -ms-text-size-adjust: 100%;
	    -o-text-size-adjust: 100%;
	    text-size-adjust: 100%;
		font-size: calc(100vw * 16 / 375);
	}
	body.noscroll{
		overflow: hidden;
	}
	.mobile{
		display: inline-block;
	}
	.web{
		display: none;
	}
	*{
		scrollbar-width: none;
	}
	*::-webkit-scrollbar{
		display: none;
	}
  #wrap{
    padding-bottom: 71.75em;
  }


  /*通用带icon title*/
  .section-title span{
    font-size: 0.875em;
    vertical-align: middle;
  }
  .section-title img{
    vertical-align: middle;
    width: 1em;
  }
  .section-title img:first-child{
    margin-right: 0.3125em;
  }
  .section-title img:last-child{
    margin-left: 0.3125em;
  }

  .banner .inner{
    top: 33%;
  }
  .banner h1{
    font-size: 1.875em;
  }
  .banner p{
    font-size: 0.75em;
  }

  /*视频弹框按钮*/
  .video-btn{
    font-size: 0.75em;
  }
  /*视频弹框*/
  .pop-video-box .inner{
    width: 56.25em;
  }
  .pop-video-box .pop-close{
    font-size: 1.75em;
    margin-bottom: 1.25em;
  }

  /*按钮 hover深红*/
  .theme-btn1{
    font-size: 0.75em;
    padding: 1em 2em;
  }
  /*按钮 hover翻滚*/
  .theme-btn2{
    font-size: 0.75em;
    padding: 1em 2em;
  }
  /*右下角百分比圆*/
  .scroll-up {
    display: none;
  }

  .scroll-up.active-scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  /*侧边提示*/
  #sidetip{
    bottom: 5%;
    margin-bottom: 0;
  }
  #sidetip ul{
    display: none;
  }
  #sidetip li{
    font-size: 0.875em;
  }
  #sidetip .slidebtn{
    font-size: 0.875em;
    width: 100%;
    padding: 0.75em 0;
    background-color: #2e2e30;
    border-radius: 0.1875em;
    text-align: center;
    color: #fff;
    width: 3.125em;
  }
  #sidetip .slidebtn img{
    width: 1em;
    margin-right: 0.64em;
    vertical-align: middle;
  }
  #sidetip .slidebtn::after{
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f0d7";
    transition: transform 0.5s;
    font-size: 0.75em;
    display: inline-block;
  }
  #sidetip.active .slidebtn::after{
    transform: rotate(180deg);
  }

  /*header*/
  #header{
    height: 3.5625em;
  }
  #header .logo{
    width: 6.1875em;
  }
  #header .menu{
    display: block;
    width: 1em;
    position: relative;
  }
  #header .menu div{
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #333;
    left: 50%;
    margin-left: -50%;
    top: 50%;
    margin-top: -0.5px;
    -webkit-transition: transform 0.5s,opacity 0.5s;
    transition: transform 0.5s,opacity 0.5s;
  }
  #header .menu div:nth-child(1){
    transform: translate(0,-0.3125em);
  }
  #header .menu div:nth-child(3){
    transform: translate(0,0.3125em);
  }
  #header.active .menu div:nth-child(1){
    transform: translate(0,0) rotate(45deg);
  }
  #header.active .menu div:nth-child(2){
    opacity: 0;
  }
  #header.active .menu div:nth-child(3){
    transform: translate(0,0) rotate(-45deg);
  }



  /*footer*/
  #footer{
    margin-top: -71.75em;
    overflow: hidden;
  }
  #footer .footer-top{
    height: 68.5em;
    padding-top: 4em;
  }
  #footer .footer-top .inner{
    display: block;
  }
  #footer .nav{
    margin-bottom: 3em;
    font-size: 0.875em;
  }
  #footer .nav li{
    margin-right: 0;
    width: 50%;
  }
  #footer .nav li:nth-child(1){
    width: 100%;
    margin-bottom: 2em;
  }
  #footer .nav li:nth-child(1) p{
    display: inline-block;
    vertical-align: top;
    width: 49%;
  }
  #footer .link-box{
    justify-content: center;
  }
  #footer .link-box .qr-box{
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 1.25em;
  }
  #footer .link-box .qr-box::before{
    border-color: #fff transparent transparent transparent;
    border-width: 0.4375em 0.4375em 0 0.4375em;
    bottom: auto;
    top: 100%;
  }
  #footer .right-part{
    width: 100%;
    padding: 2em;
    margin-bottom: 3em;
    font-size: 0.875em;
  }
  #footer .right-part ul{
    display: block;
  }
  #footer .right-part li{
    width: 100%;
  }


  /*sidenav*/  
  #sidenav{
    position: fixed;
    left: 0;
    top: 3.5625em;
    bottom: 0;
    right: 0;
    z-index: 101;
    background-color: #fff;
    color: #333;
    display: none;
  }
  #sidenav.active{
    display: block;
  }
  #sidenav .middle-part{
    position: absolute;
    left: 0;
    width: 100%;
    top: 0;
    bottom: 3.125em;
    overflow-y: auto;
  }
  #sidenav .middle-part a{
    font-size: inherit;
    color: inherit;
  }
  #sidenav .middle-part .level1{
    padding: 1em 4%;
    display: block;
    font-size: 0.875em;
    border-bottom: 1px solid rgba(51,51,51,0.2);
    font-weight: 600;
  }
  #sidenav .middle-part .level1.tri{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
  }
  #sidenav .middle-part .level1.tri::after{
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    content: "\f078";
    font-size: 0.75em;
  }
  #sidenav .middle-part .box.active .level1.tri::after{
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #sidenav .middle-part ul{
    display: none;
    background-color: #fcfcfc;
    display: none;
  }
  #sidenav .middle-part .box.active ul{
    display: block;
  }
  #sidenav .middle-part ul li > a{
    display: block;
    font-size: 0.8125em;
    padding: 1em 4%;
    border-bottom: 1px solid rgba(172,26,47,0.1);
  }
  #sidenav .middle-part ul li.active > a{
   color: #fff;
   background-color: var(--theme-red);
  }
  #sidenav .middle-part ul li.tri > a{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
  }
  #sidenav .middle-part ul li.tri > a::after{
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    content: "\f078";
    font-size: 0.75em;
  }
  #sidenav .middle-part ul li.tri.active > a::after{
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #sidenav .middle-part .level3-box{
    display: none;
    background-color: #f9f9f9;
    border-bottom: 1px solid rgba(172,26,47,0.1);
  }
  #sidenav .middle-part ul li.tri.active .level3-box{
    display: block;
  }
  #sidenav .middle-part .level3-box a{
    display: block;
    color: #555;
    font-size: 0.75em;
    padding: 1.2em 4%;
    border-bottom: 1px solid #eee;
  }
  #sidenav .middle-part .level3-box a:last-child{
    border-bottom: 0 none;
  }
  #sidenav .bottom-part{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 4%;
    height: 3.125em;
    line-height: 3.125;
  }
  #sidenav .bottom-part a{
    font-size: 0.825em;
    color: var(--theme-red);
    font-weight: bold;
  }
  #sidenav .bottom-part a img{
    width: 1em;
    margin-right: 1em;
  }
  #sidenav .bottom-part a img,#sidenav .bottom-part a span{
    vertical-align: middle;
  }
}


/*样本下载*/
.pop-video-box.download{
  display: none;
}
.pop-video-box.download.active{
  display: flex;
}
.pop-video-box.download .inner{
  width: 37.5em;
  border-radius: 0.3125em;
  background-color: rgba(255,255,255,0.85);
  padding: 3.125em;
}
.pop-video-box.download h4{
  font-size: 1.5em;
  line-height: 1.37;
  font-weight: 600;
  margin-bottom: 0.625em;
}
.pop-video-box.download h4 img{
  margin-right: 0.5em;
  width: 1.083em;
  vertical-align: middle;
}
.pop-video-box.download p{
  font-size: 0.875em;
  color: #545454;
  line-height: 1.8;
  margin-bottom: 1.43em;
}
.pop-video-box.download li{
  margin-bottom: 1em;
  position: relative;
}
.pop-video-box.download li.flex{
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-direction: row;
}
.pop-video-box.download li .icon{
  position: absolute;
  left: 0.9375em;
  top: 50%;
  z-index: 1;
  color: #000;
  transform: translate(0,-50%);
}
.pop-video-box.download li .icon i{
  font-size: 0.875em;
}
.pop-video-box.download li .fa-user::before{
  content: "\f007";
}
.pop-video-box.download li .fa-phone-alt::before{
  content: "\f879";
}
.pop-video-box.download li .fa-university::before{
  content: "\f19c";
}
.pop-video-box.download li .fa-code::before{
  background-image: url(../images/code.png);
  background-size: contain;
  background-repeat: no-repeat;
  content: "";
  display: block;
  width: 1em;
  height: 1em;
}
.pop-video-box.download li input{
  padding: 0.714em 1.428em 0.714em 2.856em;
  width: 100%;
  font-size: 0.875em;
  background-color: #f2f3f5;
  line-height: 2;
}
.pop-video-box.download li input.click{
  background-color: var(--theme-red);
  color: #fff;
  text-align: center;
  width: 20em;
  padding: 0;
}
.pop-video-box.download .btn-box{
  text-align: center;
}
.pop-video-box.download .theme-btn2{
  color: #fff;
  background-color: #000;
}
.pop-video-box.download .theme-btn2 .form_btn{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 1;
  cursor: pointer; 
}
@media only screen and (max-width:1024px){
    .pop-video-box.download{
      width: 100%;
      padding: 2em;
      margin-bottom: 3em;
      font-size: 0.875em;
    }
    .pop-video-box.download .inner{
      max-width: 100%;
      padding: 2.5em 1.5em;
    }
}