


.preloader{ 
	position:fixed; 
	left:0px; 
	top:0px; 
	width:100%; 
	height:100%; 
	z-index:99999999999;
	background-color:#ffffff;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:100px;
	background-image:url(../images/preloader.svg);
}

.play-now .ripple,
.play-now .ripple:before,
.play-now .ripple:after {
    position: absolute;
    top: 50%;
    left: 30px;
    height: 60px;
    width: 60px;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6);
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6);
    -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6);
    -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, .6);
    -webkit-animation: ripple 3s infinite;
    -moz-animation: ripple 3s infinite;
    -ms-animation: ripple 3s infinite;
    -o-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
}

.play-now .ripple:before {
    -webkit-animation-delay: .9s;
    -moz-animation-delay: .9s;
    -ms-animation-delay: .9s;
    -o-animation-delay: .9s;
    animation-delay: .9s;
    content: "";
    position: absolute;
}

.play-now .ripple:after {
    -webkit-animation-delay: .6s;
    -moz-animation-delay: .6s;
    -ms-animation-delay: .6s;
    -o-animation-delay: .6s;
    animation-delay: .6s;
    content: "";
    position: absolute;
}

@-webkit-keyframes ripple {
    70% {box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);}
    100% {box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);}
}

@keyframes ripple {
    70% {box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);}
    100% {box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);}
} 


/*** 

====================================================================
	Scroll To Top style
====================================================================

***/

.scroll-to-top{
	position:fixed;
	bottom:20px;
	right:20px;
	width:60px;
	height:60px;
	color:#ffffff;
	font-size:24px;
	line-height:60px;
	text-align:center;
	z-index:10;
	cursor:pointer;
	background:#1b1a1c;
	border-radius: 0;
	-webkit-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	transition:all 300ms ease;		
}

.scroll-to-top:hover{
	background:#1cb99e;
}

/*** 

====================================================================
	Main Header style
====================================================================

***/

.main-header{
	position: relative;
	display: block;
}

.main-header .header-top{
	position: relative;
	z-index:1;
	background-image: -ms-linear-gradient(left, #1DB9A0 0%, #4d94c4 100%);
	background-image: -moz-linear-gradient(left, #1DB9A0 0%, #4d94c4 100%);
	background-image: -o-linear-gradient(left, #1DB9A0 0%, #4d94c4 100%);
	background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #1DB9A0), color-stop(100, #4d94c4));
	background-image: -webkit-linear-gradient(left, #1DB9A0 0%, #4d94c4 100%);
	background-image: linear-gradient(to right, #1DB9A0 0%, #4d94c4 100%);
}

.main-header .header-top .top-outer{
	position:relative;
	margin-left:210px;
	padding-left:50px;
}

.main-header .header-top .top-left{
	position: relative;
	float: left;
	padding:10px 0px;
	margin-left: 13px;
}

.main-header .header-top .top-left li{
	position:relative;
	color:#ffffff;
	font-size:14px;
	font-weight:500;
	margin-right:45px;
	display:inline-block;
}

.main-header .header-top .top-left li a{
	position:relative;
	color:#ffffff;
	display:inline-block;
}

.main-header .header-top .top-left li .icon{
	position:relative;
	margin-right:10px;
}

.main-header .header-top .top-left li:last-child{
	margin-right:0px;
}
.main-header .xs-bold-menu{
	display: none;
}
.xs-mobile-search a{
	display: none;
}

/* Top Right*/

.header-top .top-right{
	position: relative;
	float: right;
	z-index:1;
	padding:9px 0px;
}

.header-top .top-right .cart-btn{
	position:relative;
	float:left;
}

.header-top .top-right .cart-btn .cart-icon{
	position:relative;
	color:#ffffff;
	font-size:21px;
	z-index:1;
	-webkit-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	transition:all 300ms ease;
}

.header-top .top-right .cart-btn .total-cart{
	position:absolute;
	content:'';
	top:-2px;
	right:-6px;
	color:#ffffff;
	width:14px;
	height:14px;
	font-size:9px;
	padding-left:1px;
	text-align:center;
	line-height:14px;
	border-radius:50%;
	background-color:#223a66;
	-webkit-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	transition:all 300ms ease;
	font-family: 'Poppins', sans-serif;
}

.header-top .top-right .cart-btn:hover .total-cart{
	
}

.header-top .top-right .nav-box{
	position:relative;
	float:left;
	color:#ffffff;
	font-size:30px;
	cursor:pointer;
	margin-left:25px;
}

.btn-more {
	color: white;
	display: inline-block;
	position: relative;
	width: 160px;
	height: 45px;
}
.btn-more svg {

    left: 0;
    position: absolute;
    top: 0;
	bottom: 0;
    width: 100%;
	height: 100%;
}
.btn-more rect {
	stroke: #00ffff;
	stroke-width: 5;
	stroke-dasharray: 422, 0;
	transition: all 450ms linear;
}
.btn-more:hover {
    color:#00ffff;
    background: rgba(225, 51, 45, 0);
    font-weight: 900;
    letter-spacing: 1px;
}
.btn-more:hover rect {
    stroke-width: 5;
    stroke-dasharray: 15, 310;
    stroke-dashoffset: 48;
    -webkit-transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);
}
.section {
	/*background-size: 100% 100%;*/
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.section-bg {
	background: url(/static/images/33.png) no-repeat center top;
	background-size: 100% 400px;
}

.banner-container {
	text-align: center;
	height: 100%;
}
.banner-container .banner-swiper-container {
	height: 100%;
}
.banner-container .banner-item {
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: flex;
	align-items: center;
	justify-content: center;
}
.banner-item .banner-title {
	font-size: 2.8rem;
	letter-spacing: .5rem;
}
.banner-item .banner-inner-text {
	font-size: 1.5rem;
	letter-spacing: .1rem;
}

.section .about-container {
	display: flex;
	align-items: center;
	height: 100%;
}

.about-logo {
	height: 250px;
}
.about-text {
	text-align: justify;
}

.product-container {
	text-align: center;
	height: 100%;
}
.product-bg {
	width: 100%;
	height: calc(100% - 300px);
	position: absolute;
	left: 0;
	top: 300px;
	background: url(/static/images/平铺底纹.jpg) center;
	z-index: -1;
}
.product-container .overlay-bg {
	position: absolute;
	width: 100%;
	height: 150px;
	left: 0;
	top: 71px;
	background: url(/static/images/图案.png) no-repeat;
	background-size: contain;
}
.product-container .product-swiper-container {
	padding: 3rem 1.2rem;
	height: 85%;
}
.product-container .product-item {
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: .3rem;
}

.product-item .product-title {
	position: absolute;
	width: 100%;
	bottom: 0;
	padding-bottom: 5rem;

}

.honor-container {
	text-align: center;
	height: 500px;
	background: url(/static/images/33.png) center top / 100% 400px no-repeat;
}
/*
.honor-container:after {
	position: absolute;
	content: '';
	left: 0;
	right: 0;
	top: 300px;
	/*bottom: -500px;*//*
	height: 669px;
	background: url(/static/images/22.jpg) center / cover no-repeat;
	z-index: -1;
}
*/
.section-title {
	padding-top: 4.5rem;
	padding-bottom: .5rem;
}
/*
.section-honor:after {
	content: '';
	width: 100%;
	height: 100%;
	background: url(/static/images/22.jpg) no-repeat center;
	background-size: cover;
	position: absolute;
	top: 276px;
	left: 0;
	z-index: -1;
}*/
.contact-info {
	width: 100%;
	/*height: calc(100% - 300px);*/

	height: 469px;
	padding-top: 36.9px;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	/*justify-content: center;*/
	letter-spacing:1px;
}

.contact-info:before {
	position: absolute;
	content: '';
	top: -200px;
	width: 100%;
	bottom: 0;
	background: url(/static/images/22.jpg) center / cover no-repeat;
	z-index: -1;
}

.beian {
	padding-top: 1rem;
	font-size: 14px;
}
.beian a {
	color: white;
}




/** services effect from https://www.jq22.com/jquery-info4503 */
.strips {
	min-height: 100vh;
	text-align: center;
	overflow: hidden;
	color: white;
  }
  .strips__strip {
	will-change: width, left, z-index, height;
	position: absolute;
	width: 16.666667%;
	min-height: 100vh;
	overflow: hidden;
	cursor: pointer;
	-webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
			transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
	z-index: 0;
  }
  .strips__strip:nth-child(1) {
	left: 0;
  }
  .strips__strip:nth-child(2) {
	left: 16.666667vw;
  }
  .strips__strip:nth-child(3) {
	left: 33.333333vw;
  }
  .strips__strip:nth-child(4) {
	left: 50vw;
  }
  .strips__strip:nth-child(5) {
	left: 66.666667vw;
  }
  .strips__strip:nth-child(6) {
	left: 83.333333vw;
  }
  .strips__strip:nth-child(1) .strip__content {
	/*background: #244F75;*/
	background: url(/static/images/banner/VR+观光旅游.jpg) no-repeat center;
	background-size: cover;
	-webkit-transform: translate3d(-100%, 0, 0);
			transform: translate3d(-100%, 0, 0);
	-webkit-animation-name: strip1;
			animation-name: strip1;
	-webkit-animation-delay: 0.1s;
			animation-delay: 0.1s;
  }
  .strips__strip:nth-child(2) .strip__content {
	/*background: #60BFBF;*/
	background: url(/static/images/service/虚仿实验.jpg) no-repeat center;
	background-size: cover;
	-webkit-transform: translate3d(0, 100%, 0);
			transform: translate3d(0, 100%, 0);
	-webkit-animation-name: strip2;
			animation-name: strip2;
	-webkit-animation-delay: 0.2s;
			animation-delay: 0.2s;
  }
  .strips__strip:nth-child(3) .strip__content {
	/*background: #8C4B7E;*/
	background: url(/static/images/service/VR云会展.jpg) no-repeat center;
	background-size: cover;
	-webkit-transform: translate3d(0, -100%, 0);
			transform: translate3d(0, -100%, 0);
	-webkit-animation-name: strip3;
			animation-name: strip3;
	-webkit-animation-delay: 0.3s;
			animation-delay: 0.3s;
  }
  .strips__strip:nth-child(4) .strip__content {
	/*background: #F8BB44;*/
	background: url(/static/images/banner/VR+实训演练.jpg) no-repeat center;
	background-size: cover;
	-webkit-transform: translate3d(0, 100%, 0);
			transform: translate3d(0, 100%, 0);
	-webkit-animation-name: strip4;
			animation-name: strip4;
	-webkit-animation-delay: 0.4s;
			animation-delay: 0.4s;
  }
  .strips__strip:nth-child(5) .strip__content {
	/*background: #F24B4B;*/
	background: url(/static/images/service/数字孪生.jpg) no-repeat center;
	background-size: cover;
	-webkit-transform: translate3d(0, -100%, 0);
			transform: translate3d(0, -100%, 0);
	-webkit-animation-name: strip5;
			animation-name: strip5;
	-webkit-animation-delay: 0.5s;
			animation-delay: 0.5s;
  }
  .strips__strip:nth-child(6) .strip__content {
	/*background: #F24B4B;*/
	background: url(/static/images/service/产业赋能.jpg) no-repeat center;
	background-size: cover;
	-webkit-transform: translate3d(100%, 0, 0);
			transform: translate3d(100%, 0, 0);
	-webkit-animation-name: strip6;
			animation-name: strip6;
	-webkit-animation-delay: 0.6s;
			animation-delay: 0.6s;
  }
  @media screen and (max-width: 760px) {
	.strips__strip {
	  min-height: 16.666667vh;
	}
	.strips__strip:nth-child(1) {
	  top: 0;
	  left: 0;
	  width: 100%;
	}
	.strips__strip:nth-child(2) {
	  top: 16.666667vh;
	  left: 0;
	  width: 100%;
	}
	.strips__strip:nth-child(3) {
	  top: 33.333333vh;
	  left: 0;
	  width: 100%;
	}
	.strips__strip:nth-child(4) {
	  top: 50vh;
	  left: 0;
	  width: 100%;
	}
	.strips__strip:nth-child(5) {
	  top: 66.666667vh;
	  left: 0;
	  width: 100%;
	}
	.strips__strip:nth-child(6) {
		top: 83.333333vh;
		left: 0;
		width: 100%;
	  }
  }
  .strips .strip__content {
	-webkit-animation-duration: 1s;
			animation-duration: 1s;
	-webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
			animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
	-webkit-animation-fill-mode: both;
			animation-fill-mode: both;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
		-ms-flex-align: center;
			align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
		-ms-flex-pack: center;
			justify-content: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-decoration: none;
  }
  .strips .strip__content:hover:before {
	-webkit-transform: skew(-30deg) scale(3) translate(0, 0);
		-ms-transform: skew(-30deg) scale(3) translate(0, 0);
			transform: skew(-30deg) scale(3) translate(0, 0);
	opacity: 0.1;
  }
  .strips .strip__content:before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: white;
	opacity: 0.05;
	-webkit-transform-origin: center center;
		-ms-transform-origin: center center;
			transform-origin: center center;
	-webkit-transform: skew(-30deg) scaleY(1) translate(0, 0);
		-ms-transform: skew(-30deg) scaleY(1) translate(0, 0);
			transform: skew(-30deg) scaleY(1) translate(0, 0);
	-webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
			transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .strips .strip__inner-text {
	will-change: transform, opacity;
	position: absolute;
	z-index: 5;
	top: 50%;
	left: 50%;
	width: 70%;
	-webkit-transform: translate(-50%, -50%) scale(0.5);
		-ms-transform: translate(-50%, -50%) scale(0.5);
			transform: translate(-50%, -50%) scale(0.5);
	opacity: 0;
	-webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
			transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .strips__strip--expanded {
	width: 100%;
	top: 0 !important;
	left: 0 !important;
	z-index: 3;
	cursor: default;
  }
  @media screen and (max-width: 760px) {
	.strips__strip--expanded {
	  min-height: 100vh;
	}
  }
  .strips__strip--expanded .strip__content:hover:before {
	-webkit-transform: skew(-30deg) scale(1) translate(0, 0);
		-ms-transform: skew(-30deg) scale(1) translate(0, 0);
			transform: skew(-30deg) scale(1) translate(0, 0);
	opacity: 0.05;
  }
  .strips__strip--expanded .strip__title {
	opacity: 0;
  }
  .strips__strip--expanded .strip__inner-text {
	opacity: 1;
	-webkit-transform: translate(-50%, -50%) scale(1);
		-ms-transform: translate(-50%, -50%) scale(1);
			transform: translate(-50%, -50%) scale(1);
  }
  
  .strip__title {
	display: block;
	margin: 0;
	position: relative;
	z-index: 2;
	width: 100%;
	font-size: 1.5rem;
	color: white;
	-webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
			transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
  }
  @media screen and (max-width: 760px) {
	.strip__title {
	  font-size: 1.5rem;
	}
  }
  
  .strip__close {
	position: absolute;
	right: 5vw;
	top: 5vw;
	opacity: 0;
	z-index: 10;
	-webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
			transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
	cursor: pointer;
	-webkit-transition-delay: 0.5s;
			transition-delay: 0.5s;
  }
  .strip__close--show {
	opacity: 1;
  }
  
  @-webkit-keyframes strip1 {
	0% {
	  -webkit-transform: translate3d(-100%, 0, 0);
			  transform: translate3d(-100%, 0, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  
  @keyframes strip1 {
	0% {
	  -webkit-transform: translate3d(-100%, 0, 0);
			  transform: translate3d(-100%, 0, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @-webkit-keyframes strip2 {
	0% {
	  -webkit-transform: translate3d(0, 100%, 0);
			  transform: translate3d(0, 100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @keyframes strip2 {
	0% {
	  -webkit-transform: translate3d(0, 100%, 0);
			  transform: translate3d(0, 100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @-webkit-keyframes strip3 {
	0% {
	  -webkit-transform: translate3d(0, -100%, 0);
			  transform: translate3d(0, -100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @keyframes strip3 {
	0% {
	  -webkit-transform: translate3d(0, -100%, 0);
			  transform: translate3d(0, -100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @-webkit-keyframes strip4 {
	0% {
	  -webkit-transform: translate3d(0, 100%, 0);
			  transform: translate3d(0, 100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @keyframes strip4 {
	0% {
	  -webkit-transform: translate3d(0, 100%, 0);
			  transform: translate3d(0, 100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @-webkit-keyframes strip5 {
	0% {
	  -webkit-transform: translate3d(0, -100%, 0);
			  transform: translate3d(0, -100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @keyframes strip5 {
	0% {
	  -webkit-transform: translate3d(0, -100%, 0);
			  transform: translate3d(0, -100%, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @-webkit-keyframes strip6 {
	0% {
	  -webkit-transform: translate3d(100%, 0, 0);
			  transform: translate3d(100%, 0, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }
  @keyframes strip6 {
	0% {
	  -webkit-transform: translate3d(100%, 0, 0);
			  transform: translate3d(100%, 0, 0);
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
			  transform: translate3d(0, 0, 0);
	}
  }