@font-face {
	font-family:montserrat;font-display:swap;src:local('Montserrat Regular'),local('Montserrat-Regular'),url(/cs19/fonts/montserrat-regular-webfont.woff2) format('woff2'),url(/cs19/fonts/montserrat-regular-webfont.woff) format('woff');font-weight:400;font-style:normal
}


@font-face {
	font-family:montserrat;font-display:swap;src:local('Montserrat ExtraLight'),local('Montserrat-ExtraLight'),url(/cs19/fonts/montserrat-extralight-webfont.woff2) format('woff2'),url(/cs19/fonts/montserrat-extralight-webfont.woff) format('woff');font-weight:100;font-style:normal
}

@font-face {
	font-family:'iconfont1';src:url('/cs19/fontarrow/iconfont.eot');src:url('/cs19/fontarrow/iconfont.eot?#iefix') format('embedded-opentype'),url('/cs19/fontarrow/iconfont.woff2') format('woff2'),url('/cs19/fontarrow/iconfont.woff') format('woff'),url('/cs19/fontarrow/iconfont.ttf') format('truetype'),url('/cs19/fontarrow/iconfont.svg#iconfont') format('svg');
}

@font-face {
	font-family:'Montserrare';src:url('/cs20/font/Montserrat-Regular.eot?#iefix') format("embedded-opentype"),url('/cs20/font/Montserrat-Regular.woff') format("woff"),url('/cs20/font/Montserrat-Regular.ttf') format("truetype"),url('/cs20/font/Montserrat-Regular.svg') format("svg");
}
@font-face {
	font-family:montserrat-b;font-display:swap;src:local('Montserrat Bold'),local('Montserrat-Bold'),url(/cs19/fonts/montserrat-bold-webfont.woff2) format('woff2'),url(/cs19/fonts/montserrat-bold-webfont.woff) format('woff');font-weight:700;font-style:normal
}
/*@font-face {
  font-family: "阿里妈妈数黑体 Bold";font-weight: 700;
  src: url("/cs19/fonts/dF-p4LWvm2Akpbrb2yIN0.woff2") format("woff2"),
  url("/cs19/fonts/dF-p4LWvm2Akpbrb2yIN0.woff") format("woff");
  font-display: swap;
}*/
@font-face {
	font-family:'Montserrat-Light';src:url('/cs20/font/Montserrat-Light.eot?#iefix') format("embedded-opentype"),url('/cs20/font/Montserrat-Light.woff') format("woff"),url('/cs20/font/Montserrat-Light.ttf') format("truetype"),url('/cs20/font/Montserrat-Light.svg') format("svg");
}

@charset "utf-8";

* {
	margin: 0;
	padding: 0;
	line-height: inherit;
	vertical-align: baseline;
}

body {
	font-family: "PingFang SC","Helvetica Neue",Helvetica,"Hiragino Sans GB","Microsoft YaHei",'Noto Sans CJK SC',Arial,sans-serif;
	font-family: source-han-sans-simplified-c,sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 14px;
	line-height: 1.7;
	overflow-x: hidden;
	color: #333;
}

h1,h2,h3,h4,h5,h6,p,ul,li,dl,dt,dd,ol,form,span,input,a,div {
	margin: 0px;
	padding: 0px;
	font-style: normal;
	border: 0;
}

input,button,select {
	font-size: 100%;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	vertical-align: middle;
	border: 1px solid #ccc;
	outline: none;
	line-height: normal;
	color: #666;
}

img {
	border: 0px;
	border: none;
}

ul,li {
	list-style: none;
}

a {
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	text-decoration: none;
	outline: none;
	color: inherit;
}

.w1140 {
	width: 1140px;
}

.w1200 {
	width: 1200px;
}

.w100 {
	width: 100%;
}

.md {
	margin: 0 auto;
}

.fl {
	float: left;
}

.rt {
	float: right;
}

.clear {
	clear: both;
}

ul::after,.container:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	overflow: hidden;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clear:after {
	content: "";
	clear: both;
	display: block;
	height: 0;
	overflow: hidden;
}

.bg-none {
	background: none;
}

.pr {
	position: relative;
}

.pa {
	position: absolute;
}

::-webkit-scrollbar {
	width: 9px;
	background-color: #eee;
}

::-webkit-scrollbar-thumb {
	border: solid 2px #fff;
	width: 5px;
	border-radius: 4px;
	background-color: #000;
}

::-webkit-scrollbar-corner {
	background-color: #ccc;
}

::-webkit-scrollbar:horizontal {
	height: 9px;
}

::-webkit-selection {
	background: #0074cb;
	color: #fff;
}

::-moz-selection {
	background: #0074cb;
	color: #fff;
}

::selection {
	background: #0074cb;
	color: #fff;
}

article,aside,dialog,footer,header,section,footer,nav,figure,menu {
	display: block
}

.ie {
	display: none;
	!important
}

.container {
	margin: 0 auto;
	padding: 0 90px 0 150px;
}}

.container::after {
	content: "";
	clear: both;
	display: block;
	height: 0;
	overflow: hidden;
}

#top {
	position: absolute;
	padding-top: 30px;
	top: 0;
	width: 100%;
	z-index: 9998;
}

#top .container {
	max-width: 100%;
}

#top .h_1 {
	position: relative;
	z-index: 9998;
	width: 100%;
}

.logo {
	background: url('/cs19/logo3.png') no-repeat 50px 1px;
	background-size: 120px;
	display: block;
	width: 140px;
	height: 48px;
	line-height: 54px;
	color: #fff;
}

.logo .iconfont_lo {
	display: block;
	height: 40px;
	width: 40px;
	font-size: 40px;
	margin-top: 0px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	transform-origin: center;
}

.logo:hover .iconfont_lo {
	transform: rotate(85deg);
	-ms-transform: rotate(85deg);
	-moz-transform: rotate(85deg);
	-webkit-transform: rotate(85deg);
	-o-transform: rotate(85deg);
}

#h_nav {
	color: #fff;
	margin-right: 66px;
}

#h_nav nav li {
	float: left;
	line-height: 40px;
	padding: 0px 22px;
	font-size: 16px;
}

#h_nav nav li a {
	letter-spacing: 1px;
}

#h_nav nav {
	float: left;
}

.hbcd {
	background: url('/cs19/mu.svg') no-repeat left top;
	background-size: 20px;
	width: 30px;
	height: 20px;
	margin-top: 11px;
	float: right;
	margin-left: 20px;
}

.case_n_1 {
	height: 92vw;
	max-height: 880px;
	overflow: hidden;
	position: relative;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.case_n_1a {
	padding-top: calc(100vw * 0.18);
	padding-bottom: calc(100vw * 0.13);
	text-align: center;
	z-index: 20;
	position: relative;
}

.case_n_1b {
	color: #fff;
	line-height: 25px;
	font-size: 34px;
	letter-spacing: 60px;
	text-indent: 40px;
	padding-bottom: 20px;
	font-weight: lighter;
	text-align: center;
}

.case_n_1d {
	height: 50px;
	margin: 40px auto 0;
}

.case_n_1d span {
	display: inline-block;
	padding: 10px 15px;
	margin: 0px 10px;
	border-radius: 4px;
	color: #fff;
	font-size: 13px;
	letter-spacing: 1px;
	background: rgba(68,75,93,0.8);
}

h3.case_n_1c {
	color: #fff;
	text-transform: none;
	font-size: 52px;
	line-height: 65px;
	font-weight: 400;
}

h3.case_n_1c span {
	padding-right: 20px;
	height: 48px;
	letter-spacing: -3px;
	text-transform: uppercase;
}

.case_n_1bg {
	background: linear-gradient(135deg,#6c63ff 0%,#f8a4d8 100%);
	opacity: 0.8;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: ' ';
	z-index: 2;
	backface-visibility: hidden;
}

.case_n-content {
	bottom: -20px;
	position: relative;
	left: 0;
	width: 100%;
	height: 300px;
}

.wave {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 1;
}

#wave-thre {
	opacity: 1;
}

#wave-fur {
	opacity: .4;
}

#wave-one {
	opacity: .4;
}

#wave-two {
	opacity: .6;
}

.wave + .wave {
	z-index: 2;
}

.case_n_2 {
	width: 100%;
	z-index: 99;
	position: relative;
	padding-top: 50px;
	margin-bottom: 100px;
	margin-top: 0px;
}

.case_n_2a {
	color: #333;
	padding-bottom: 50px;
	margin-bottom: 20px;
	font-size: 16px;
}

.case_n_2a .fl {
	width: 20%;
	color: #222;
}

.case_n_2a .rt {
	width: 80%;
	color: #222;
}

div#coidea.effect-1 .grid .grid-item .content h2 {
	text-transform: uppercase;
}

.anli_link a,.case_3_c span,chakan {
	text-indent: 0px;
	position: relative;
	transition: all 260ms ease-out;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-webkit-transform-style: flat;
	-moz-transform-style: flat;
	-ms-transform-style: flat;
	-o-transform-style: flat;
	will-change: transform;
}

.anli_link a::before,.case_3_c .chakan:before {
	content: "";
	position: absolute;
	left: 110%;
	top: 50%;
	width: 30px;
	height: 1px;
	background: #333;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.anli_link a:hover:before,.case_3_c .chakan:hover:before {
	width: 70px;
}

.case_n_3 {
	position: relative;
}

.case_n_3a {
	width: 100%;
	max-width: 1150px;
	margin: 70px auto 0;
	-webkit-box-shadow: 0 15px 28px 0 rgba(0,0,0,0.3);
	box-shadow: 0 15px 28px 0 rgba(0,0,0,0.3);
	padding-top: 21px;
	position: relative;
	z-index: 20;
}

.case_n_3head {
	width: 100%;
	max-width: 1150px;
	height: 21px;
	background-color: #eee;
	border-radius: 5px 5px 0px 0px;
	position: absolute;
	top: 0px;
	left: 0px;
}

.case_n_3head .ptn {
	position: absolute;
	height: 5px;
	width: 5px;
	border-radius: 3px;
	top: 50%;
	background-color: #232426;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	opacity: 0.3;
}

.case_n_3head .ptn:nth-child(1) {
	left: 6px;
}

.case_n_3head .ptn:nth-child(2) {
	left: 16px;
}

.case_n_3head .ptn:nth-child(3) {
	left: 26px;
}

.case_n_3body {
	height: 750px;
	overflow: hidden;
	margin-bottom: 200px;
}

.case_n_3body img {
	width: calc(100% + 1px);
	-webkit-animation-duration: 10s;
	animation-duration: 10s;
	-webkit-animation-name: scrollCoverBrowser;
	animation-name: scrollCoverBrowser;
	-webkit-animation-timing-function: cubic-bezier(1.000,0.005,0.305,1.000);
	animation-timing-function: cubic-bezier(1.000,0.005,0.305,1.000);
	-webkit-animation-direction: alternate;
	animation-direction: alternate;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-fill-mode: none;
	animation-fill-mode: none;
}

@keyframes scrollCoverBrowser {
	10% {
		-webkit-transform: translateY(0%);
		-ms-transform: translateY(0%);
		transform: translateY(0%);
	}

	50% {
		-webkit-transform: translateY(calc(-50% + 300px));
		-ms-transform: translateY(calc(-50% + 300px));
		transform: translateY(calc(-50% + 300px));
	}

	100% {
		-webkit-transform: translateY(calc(-100% + 750px));
		-ms-transform: translateY(calc(-100% + 750px));
		transform: translateY(calc(-100% + 750px));
	}
}

@-webkit-keyframes scrollCoverBrowser {
	10% {
		-webkit-transform: translateY(0%);
		-ms-transform: translateY(0%);
		transform: translateY(0%);
	}

	50% {
		-webkit-transform: translateY(calc(-50% + 300px));
		-ms-transform: translateY(calc(-50% + 300px));
		transform: translateY(calc(-50% + 300px));
	}

	100% {
		-webkit-transform: translateY(calc(-100% + 750px));
		-ms-transform: translateY(calc(-100% + 750px));
		transform: translateY(calc(-100% + 750px));
	}
}

.wave3_bg {
	position: absolute;
	left: 0;
	top: 101px;
	width: 100%;
	width: 100%;
	height: 380px;
	background: -webkit-gradient(linear,left top,right top,from(#ededed),to(#afafaf));
	background: -webkit-linear-gradient(left,#ededed 0%,#afafaf 100%);
	background: -o-linear-gradient(left,#ededed 0%,#afafaf 100%);
	background: linear-gradient(90deg,#3b3e47 0%,#282b32 100%);
}

.case_n_3wave .wave3 {
	position: absolute;
	top: calc(380px - 2px);
	left: 0;
	width: 100%;
}

.case_t {
	color: #333;
	position: absolute;
	z-index: 1;
	left: 5%;
	padding-right: 130px;
	-webkit-transform: rotate(-90deg) translateX(-100%);
	-ms-transform: rotate(90deg) translateX(110%);
	-webkit-transform-origin: 100% 0;
	-ms-transform-origin: 100% 0;
	transform-origin: 0% 0;
}

.case_n_4a {
	-webkit-transform: rotate(-90deg) translateX(-100%);
	-ms-transform: rotate(-90deg) translateX(-100%);
}

.case_n_6a {
	-webkit-transform: rotate(-90deg) translateX(-100%);
	-ms-transform: rotate(-90deg) translateX(-100%);
}

.case_t div {
	font-size: 38px;
	position: relative;
	font-family: National-Bold,Arial;
}

.case_t div:before {
	content: '';
	background: #333;
	width: 90px;
	height: 2px;
	position: absolute;
	top: 50%;
	right: calc(-100% + 40px);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.case_t p {
	font-size: 24px;
}

.case_n_4b,.case_n_6b {
	padding-left: 155px;
	position: relative;
	z-index: 1;
	width: 1150px;
	margin: auto;
	margin-top: 20px;
	padding-bottom: 150px;
}

.case_n_4b .clr {
	float: left;
	width: 25%;
	margin-left: 7%;
}

.case_n_4b .clr .height {
	height: 300px;
	border-radius: 10px;
	position: relative;
	background-image: url('/cs19/texture.png')
}

.case_n_4b .clr .cle1 {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.case_n_4b .clr p {
	color: #333;
	padding-top: 8px;
	font-size: 14px;
}

.case_n_4b .clr p span {
	display: block;
}

.case_n_5 {
	width: 100%;
	height: 680px;
	margin-bottom: 200px;
	overflow: hidden;
	position: relative;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

.case_n_5bg {
	background: rgba(42,45,53,0.1);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.case_n_5 video {
	width: 100%;
	object-fit: cover;
}

.case_n_6b ul li {
	width: 26%;
	margin: 2%;
	height: auto;
	margin-top: 50px;
	margin-bottom: 30px;
	display: inline-block;
}

.case_n_6b li img {
	width: 100%;
	height: auto;
	display: block;
	border: 1px solid #eee;
}

.case_n_7wave {
	width: 100%;
	position: absolute;
	bottom: calc(100% - 1px);
	left: 0;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}

.case_n_7 {
	background: #222;
	padding-top: 70px;
	margin-top: 200px;
	padding-bottom: 100px;
	z-index: 20;
	background: -webkit-gradient(linear,left top,right top,from(#0e1d2c),to(#1e476d ));
	background: -webkit-linear-gradient(left,#0e1d2c 0%,#1e476d 100%);
	background: -o-linear-gradient(left,#0e1d2c 0%,#1e476d 100%);
	background: linear-gradient(90deg,#0e1d2c 0%,#1e476d 100%);
}

.case_n_7a {
	position: absolute;
	top: 42%;
	left: 35%;
	width: 40%;
	transform: translate(-50%,-50%);
}

.case_n_7a a,.case_nex {
	display: inline-block;
	background-color: #eee;
	width: 205px;
	height: 50px;
	margin: 0 auto;
	line-height: 50px;
	text-align: center;
	font-size: 16px;
	color: #111;
	transition: all .35s ease-out;
	letter-spacing: 4px;
	position: relative;
}

.case_nex {
	width: 405px;
	height: 50px;
}

.case_n_7a .case_con {
	margin-left: 20px;
	background: #727887;
	color: #fff;
}

.case_nex {
	background: #222;
	color: #fff;
	margin: 0 auto;
	display: block;
}

.case_l_4bg .case_nex:hover {
	color: #222;
}

.case_l_4bg .case_nex rect {
	stroke: #000;
}

.case_n_7a a svg,.case_nex svg {
	height: 50px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.case_n_7a a:hover,.case_nex:hover {
	background: #0048d1;
	letter-spacing: 5px;
	color: #fff;
}

.case_n_7a a rect,.case_nex rect {
	fill: none;
	stroke: #fff;
	stroke-width: 2;
	stroke-dasharray: 422,0;
	opacity: 0;
}

.case_n_7a a:hover rect,.case_nex:hover rect {
	stroke-width: 5;
	opacity: 1;
	stroke-dasharray: 55,415;
	stroke-dashoffset: 605;
	-webkit-transition: all 1.55s cubic-bezier(0.19,1,0.22,1);
	transition: all 1.55s cubic-bezier(0.19,1,0.22,1);
}

.case_nex:hover rect {
	stroke-dasharray: 265,925;
	stroke-dashoffset: 670;
}

.case_n_7b {
	position: relative;
	z-index: 1;
	width: 60%;
	margin-left: 50%;
}

.case_n_7bg,.case_n_7b1 img {
	width: 100%;
}

.case_n_7b1 {
	position: absolute;
	top: 7.5%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 69%;
	margin: auto;
}

.case_n_more {
	position: absolute;
	bottom: -50px;
	left: 50%;
	z-index: 20;
}

.case_n_more span {
	display: block;
	line-height: 18px;
	color: #f1f1f1;
	font-size: 12px;
	text-align: center;
	position: absolute;
	top: -55px;
	left: 50%;
	width: 80px;
	margin-left: -40px;
}


.case_n_more .line {
	width: 2px;
	margin-left: -2px;
	height: 90px;
	background-image: -o-linear-gradient(top,#F82F4D 0,rgba(248,47,77,0) 100%);
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#F82F4D),to(rgba(248,47,77,0)));
	background-image: linear-gradient(to bottom,#F82F4D 0,rgba(248,47,77,0) 100%);
	background-repeat: repeat-x;
}

.case_n_more .dot {
	position: absolute;
	top: 0;
	width: 8px;
	height: 8px;
	margin-left: -5px;
	background: #F82F4D;
	border-radius: 50%;
}

.case_l_4 {
	margin-top: 150px;
	padding-bottom: 60px;
	background: -webkit-gradient(linear,left top,right top,from(#f1f1f1),to(#ddd ));
	background: -webkit-linear-gradient(left,#f1f1f1 0%,#ddd 100%);
	background: -o-linear-gradient(left,#f1f1f1 0%,#ddd 100%);
	background: linear-gradient(90deg,#f1f1f1 0%,#ddd 100%);
	background: #fafafa;
}

.case_n_more .dot:after {
	content: '';
	position: absolute;
	top: -6px;
	left: -6px;
	width: 16px;
	height: 16px;
	border: 2px solid #F82F4D;
	border-radius: 50%;
	-webkit-animation: scroll_tip_dot 2s ease infinite;
	animation: scroll_tip_dot 2s ease infinite;
}

@-webkit-keyframes scroll_tip_dot {
	0% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(2);
		transform: scale(2)
	}
}

@keyframes scroll_tip_dot {
	0% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(2);
		transform: scale(2)
	}
}

.case_n_8n.cny_body .slide-item a {
	position: relative;
	bottom: auto;
	left: auto;
	text-align: center;
	margin: 0;
}

.case_n_8n.cny_body .slide-wrapper {
	margin-left: -500px
}

.case_n_8n.cny_body .case_n_ti {
	font-weight: normal;
	font-style: normal;
}

.case_n_8n.cny_body .slide-item a i::before {
	height: 2px;
	left: 0px;
}

.case_n_8n.cny_body .slide-item h3 {
	font-size: 48px;
}

.case_n_8n {
	position: relative;
	z-index: 19;
	overflow: hidden;
	background: #000;
}

.case_n_a {
	position: relative;
}

.case_n_a .code {
	position: absolute;
	background-color: #fff;
	padding: 10px 10px 0;
	bottom: 77px;
	height: 140px;
	letter-spacing: 0;
	line-height: 25px;
	left: 50%;
	font-size: 13px;
	box-shadow: 0px 0px 16px rgba(0,0,0,.2);
	z-index: 2222;
	width: 110px;
	margin-left: -75px;
	color: #333;
	text-align: center;
	opacity: 0;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.case_n_a:hover .code {
	letter-spacing: 0;
}

.case_n_a:hover .code {
	opacity: 1;
	bottom: 70px;
}

.case_n_7a .case_n_a {
	background-image: url('/cs19/ss.png');
	background-position: 135px center;
	background-repeat: no-repeat;
	background-size: 20px;
	text-indent: -30px;
}

.case_n_7a .case_n_a:hover {
	background-image: url('/cs19/ss2.png');
	background-position: 135px center;
	background-repeat: no-repeat;
	background-size: 20px;
}

.case_n_a .code span,.code i {
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-top-color: #fff;
	position: absolute;
	bottom: -19px;
	left: 50%;
	margin-left: -10px;
}

.code img {
	width: 110px;
	padding-bottom: 0;
	margin-bottom: 0;
	display: block;
}


.site-wrapper {
	z-index: 3;
	width: 100%;
	height: 100%;
}

.ck-slide-wrapper,.slide-item,.content.ck-slide {
	width: 100%;
	height: 100%;
	display: block;
}

.case_l_2 {
	background: #fff;
	text-align: center;
	margin: 50px auto;
}

.case_l_2:before,.case_l_2:after {
	content: "";
	display: block;
	width: 1px;
	background: linear-gradient(0deg,#294968 0%,#cbe6ff 100%);
	background: none;
	height: 100px;
	margin: 0 auto 50px;
}

.case_l_2:after {
	margin-top: 50px;
	margin-bottom: 0;
	background: linear-gradient(180deg,#294968 0%,#cbe6ff 100%);
}

.case_l_2 h2 {
	font-size: 22px;
	color: #333;
}

.case_l_2 span {
	font-size: 42px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: -2px;
	line-height: 48px;
	margin: 20px auto;
	display: block;
}

.case_l_2 p {
	font-size: 14px;
	letter-spacing: 1px;
}

.case_l_2 p i {
	font-size: 12px;
	color: #999;
}

.case_l_3 li {
	position: relative;
	margin: 150px auto 200px;
}

.case_l_3a {
	position: absolute;
	width: 46%;
	height: 680px;
	left: 0;
	top: 0;
	background: #eee;
}

.case_l_3a1 {
	position: relative;
	height: 100%;
	border-radius: 4px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
}

.case_l_3b {
	width: 100%;
	position: relative;
	max-width: 1500px;
	margin: 0 auto;
	height: 700px;
	margin: 100px auto;
}

.case_l_3b .case_l_3b_tt {
	position: absolute;
	left: 50%;
	font-size: 28px;
	font-weight: bold;
	color: #000;
	margin-left: 0px;
	padding-left: 65px;
	z-index: 9;
}

.case_l_3b .case_l_3b_tt h2 {
	display: inline-block;
	width: 360px;
}

.case_l_3b .case_l_3b_tt h2::before {
	width: 50px;
	height: 3px;
	background: #333;
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 32px;
}

.case_l_3b_img {
	position: absolute;
	width: 650px;
	left: 40%;
	top: 180px;
	margin-left: -150px;
	filter: drop-shadow(0px 14px 28px rgba(0,0,0,0.4));
	-webkit-filter: drop-shadow(0px 14px 28px rgba(0,0,0,0.4));
	-moz-filter: drop-shadow(0px 14px 28px rgba(0,0,0,0.4));
}

.case_l_3b_img img {
	width: 100%;
}

.case_3_c {
	width: 50%;
	float: right;
	padding-top: 160px;
}

.case_3_c a {
	display: block;
	margin-left: 150px;
	margin-right: 100px;
}

.case_3_c h3 {
	font-size: 24px;
	font-weight: bold;
	color: #333;
}

.case_3_c div {
	color: #777;
	font-size: 12px;
}

.case_3_tag {
	color: #444;
	padding-bottom: 40px;
}

.case_3_tag span {
	padding-right: 5px;
}

.case_3_c p {
	padding-bottom: 100px;
	font-size: 14px;
	color: #555;
	text-align: justify;
}

.case_3_c span.chakan {
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 1px;
	color: #000;
}

.case_3_c span.chakan:hover {
	color: #005fef;
}

.c_l2 .case_l_3a {
	left: auto;
	right: 0;
}

.c_l2 .case_l_3b .case_l_3b_tt {
	left: auto;
	right: 50%;
	margin-left: 0px;
	margin-right: 5%;
	padding-left: 0;
	text-transform: uppercase;
}

.c_l2 .case_l_3b .case_l_3b_tt::before {
	left: auto;
	right: 0;
}

.c_l2 .case_l_3b_img {
	left: auto;
	right: 5%;
	margin-right: -25%;
	margin-left: 0;
}

.c_l2 .case_3_c {
	float: left;
}

.c_l2 .case_3_c a {
	margin-left: 100px;
	margin-right: 150px;
}

.case_l_5 {
	height: 300px;
	position: relative;
	z-index: 20;
	background: #f7f7f7;
}

.case_l_5 .case_n_7wave {
	bottom: auto;
	top: 0;
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
	height: 300px;
}

.case_l_6 {
	background: #f7f7f7;
	margin-top: 0px;
	padding-top: 50px;
}

.case_l_6 li.card img {
	box-shadow: 0.5em 0 1.25em #ccc;
}

.case_l_6_sx {
	text-align: center;
}

.button_su {
	overflow: hidden;
	position: relative;
	display: inline-block;
	border-radius: 3px;
	margin-bottom: 0px;
	margin: 0px 5px;
}

.su_button_circle {
	background-color: red;
	border-radius: 1000px;
	position: absolute;
	left: 0;
	top: 0;
	width: 0px;
	height: 0px;
	margin-left: 0px;
	margin-top: 0px;
	pointer-events: none;
}

.button_su_inner {
	display: inline-block;
	border: 1px solid #ccc;
	color: #333;
	font-size: 16px;
	font-weight: normal;
	text-align: center;
	border-radius: 4px;
	transition: 400ms;
	text-decoration: none;
	padding: 12px 75px;
	z-index: 100000;
}

.on .button_su_inner {
	background-color: rgba(0,71,139,1);
	color: #fff;
}

.button_su_inner:hover {
	color: #fff;
}

.button_text_container {
	position: relative;
	z-index: 100;
}

.explode-circle {
	animation: explode 0.5s forwards;
}

.desplode-circle {
	animation: desplode 0.5s forwards;
}

@keyframes explode {
	0% {
		width: 0px;
		height: 0px;
		margin-left: 0px;
		margin-top: 0px;
		background-color: rgba(0,71,139,0.3);
	}

	100% {
		width: 400px;
		height: 400px;
		margin-left: -200px;
		margin-top: -200px;
		background-color: rgba(0,71,139,0.8);
	}
}

@keyframes desplode {
	0% {
		width: 400px;
		height: 400px;
		margin-left: -200px;
		margin-top: -200px;
		background-color: rgba(46,66,85,0.8);
	}

	100% {
		width: 0px;
		height: 0px;
		margin-left: 0px;
		margin-top: 0px;
		background-color: rgba(0,0,0,0.6);
	}
}

.feny {
	text-align: center;
	margin-top: 0;
	margin: 0 auto;
	padding: 0 90px;
	max-width: 1550px;
}

.feny .thisclass {
	border: 0px solid #0A0A0A;
	font-size: 13px;
	background-color: #333;
	color: #fff;
	width: 50px;
	height: 34px;
	line-height: 36px
}

.feny .thisclass a,.feny li a:hover {
	color: #fff;
	background-color: #333
}

.feny .thisclass a {
	border: 0;
	line-height: 25px
}

.feny:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	overflow: hidden
}

.feny li select {
	width: 50px;
	height: 36px;
	line-height: 36px
}

.feny li {
	display: inline-block;
	margin: 3px;
	-webkit-transition: all .4s ease-in-out
}

.feny li a {
	-webkit-transition: all .4s ease-in-out;
	font-size: 13px;
	padding: 6px 20px;
	display: block;
	border: 1px solid #555
}

.slideshow_buttontitle {
	padding: 0px;
	margin: 0px;
	bottom: 0;
	right: 0;
	position: fixed;
	z-index: 99;
	border-radius: 20px 0 0 0;
}

.slideshow_buttontitle .slideshow_simple1_title {
	position: absolute;
	left: 0px;
	line-height: 112px;
	bottom: 0px;
	font-size: 24px;
	padding-top: 0px;
	padding-bottom: 0px;
	text-align: left;
	text-indent: 60px;
	opacity: 1;
	text-transform: capitalize;
}

.slideshow_buttontitle ul {
	margin: 0px;
}

.slideshow_buttontitle ul li {
	padding: 0px;
	margin: 0px;
	list-style: none;
	width: 100%;
	height: 100%;
	position: absolute;
}

.slideshow_buttontitle li {
	background-repeat: no-repeat;
	background-position: 28px center;
	text-align: left;
}

.slideshow_buttontitle li a {
	text-align: left;
	display: block;
	height: 215px;
	z-index: 998;
	position: relative;
}

.slideshow_buttontitle ul li.slideshowa {
	background-color: #1f1f1f;
	background-color: #0047d0;
	background-size: 28px;
	text-indent: 0px;
}

.slideshow_simple1_title::after {
	position: absolute;
	right: 20px;
	top: 56px;
	height: 1px;
	width: 50px;
	background: #fff;
	content: '';
	display: block;
}

.slideshowb a {
	background: url(/cs19/ss2.png) no-repeat 30px 78%;
	background-size: 28px;
}

.slideshow_buttontitle .slideshowb {
	background: linear-gradient(40deg,#015ab7 0%,#a539a1 70%,#ff2020 100%);
	background-position: left center;
}

.clear:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.con_sp {
	position: absolute;
	bottom: 118px;
	right: -270px;
	width: 250px;
	height: 190px;
	padding: 15px 10px 20px;
	background: #f4f4f4;
	background: #fff;
	border-radius: 5px 0 0 5px;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#slideshow2:hover .con_sp {
	right: 0px;
	z-index:9999;
	box-shadow: rgba(0,0,0,0.27) -2px 1px 50px 0px;
}

.con_sp div {
	padding-bottom: 30px;
	margin: 0 auto;
	width: 240px;
	text-align: left;
}

.con_sp div span {
	float: left;
	display: block;
	width: 60px;
	font-size: 13px;
	border-top: 1px solid #333;
	margin-top: 12px;
	text-transform: uppercase;
	color: #616161;
}

.con_sp div p {
	float: left;
	padding-left: 20px;
	font-size: 18px;
	line-height: 2;
	margin-top: 0px;
}

.con_sp div.rt_p {
	padding-bottom: 0px;
	margin: 0;
	width: 180px;
	float: left;
	padding-left: 0px;
	text-align: center;
}

.con_sp .rt_p a {
	display: inline-block;
	text-align: center;
	margin-left: 15px;
	font-size: 12px;
	margin-top: 10px;
	text-decoration: none;
	position: relative;
}

.con_sp .rt_p img {
	display: block;
	width: 45px;
	margin: 0 auto 10px;
}

.con_sp a.wechat .code {
	position: absolute;
	background-color: #fff;
	padding: 10px 10px 0;
	bottom: 77px;
	height: 100px;
	letter-spacing: 0;
	line-height: 25px;
	left: 50%;
	font-size: 12px;
	box-shadow: 0px 0px 16px rgba(0,0,0,.2);
	z-index: 2222;
	width: 95px;
	margin-left: -58px;
	color: #333;
	text-align: center;
	opacity: 0;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.con_sp .code img {
	width: 70px;
	padding-bottom: 0;
	margin-bottom: 0;
	display: block;
}

.con_sp a.wechat:hover .code {
	opacity: 1;
	bottom: 85px;
	margin-left: -58px;
}

.con_sp .code i {
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-top-color: #fff;
	position: absolute;
	bottom: -20px;
	left: 50%;
	margin-left: -10px;
}


.c_l2 div#coidea,.c_l4 div#coidea {
	float: right;
	margin-top: 100px;
}

.c_l2 .case_l_3a,.c_l4 .case_l_3a {
	right: 0;
	left: auto;
}

.h_intro {
	height: 100vh;
	position: relative;
	margin-left: 59px;
	overflow: hidden;
	min-height: 720px;
	z-index: 23;
}

.h_intro::before {
	position: absolute;
	content: "";
	display: block;
	left: 0;
	top: 0;
	height: 100%;
	width: 2px;
	z-index: 9;
	background: #444;
}

.h_0 {
	border-left: 0px solid #ccc;
	width: 100%;
	height: 100vh;
	min-height: 760px;
}

.h_viedo {
	height: 100%;
}

.h_viedo video {
	object-fit: cover;
}

.h_1 {
	position: absolute;
	background: #fff;
	width: 45%;
	height: 100%;
	font-weight: bolder;
	text-transform: uppercase;
	z-index: 15;
	mix-blend-mode: screen;
	color: #000;
}

.h_1pad {
	padding: 90px;
}

.h_1a {
	font-size: 5.11111111vw;
	line-height: 1;
	transition: all 1s;
	width: 100%;
	text-align: center;
	font-size: 10.111111vw
}

.h_1a span {
	font-size: 1.88vw;
	display: block;
	font-size: 2.88vw;
	padding-top: 10px;
	padding-left: %;
}

.hidden .h_1 {
	mix-blend-mode: normal;
	z-index: initial;
}

.hidden .h_1 {
	z-index: initial;
}

.hidden .h_1a {
	opacity: 0;
}

.h_1 .h_1b {
	margin-top: 32vh;
	text-transform: uppercase;
}

.h_1 .h_1b span {
	display: block;
	font-size: 5vw;
	line-height: 1;
	color: inherit;
	font-weight: 900;
	letter-spacing: -0.01em;
	font-family: Montserrat-b;
 
}
.h_1 .h_1b span b {
	font-size: 3vw;
	display: block;
	padding-top: 30px;
	
}

.h_1 .h_1c {
	color: inherit;
	margin-top: 0.9375em;
	font-size: 1.666666vw;
	margin-bottom: 1.78125em;
	letter-spacing: 1px;
}

.h_1 .h_1c b {
	display: inline-block;
	padding-right: 5px;
	margin-left: 6px;
}

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

div.circle.expand {
	transform: scale(5);
	-moz-transform: scale(5);
	-webkit-transform: scale(5);
}

.home div.burger {
	left: 11px;
	right: auto;
	top: calc(50% - 25px);
	height: 50px;
	width: 40px;
	position: relative;
}

.hidden.home div.burger.open {
	left: 11px;
	position: fixed;
}

div.open.burger .x,div.open.burger .z {
	width: 40px;
}

.home div.x,.home div.y,.home div.z {
	background: #0048d0;
	width: 33px;
	bottom: auto;
}

.home .home_mu {
	background: #f6f6f6;
	position: fixed;
	left: 0;
	top: 0;
	width: 59px;
	height: 100vh;
	z-index: 9900;
	float: left;
	border-right: 1px solid #cecece;
}

.home .burger span {
	float: none;
	color: #000;
	font-size: 12px;
	letter-spacing: -0.5px;
	position: absolute;
	top: 10px;
	left: 0;
}

.home div.y {
	top: 10px;
}

.home div.z {
	top: 20px;
}

.hidden .home_mu {
	z-index: inherit;
	height: auto;
	z-index: 999;
	height: 100%;
	background: none
}

.home.hidden div.x,.home.hidden div.y,.home.hidden div.z {
	background: #fff;
}

.home div.circle {
	top: 49%;
	left: 30px;
	right: auto;
	transition: all 300ms;
}

.home div.circle.expand {
	background: none;
	transform: scale(3);
	-moz-transform: scale(3);
	-webkit-transform: scale(3);
	transition: all 1200ms cubic-bezier(0.000,0.995,0.990,1.000);
}

.h_1_down {
	position: relative;
	width: 135px;
	margin-left: 5px;
	font-size: 12px;
	font-weight: lighter;
}

.h_1_down:after {
	content: '';
	background: #333;
	width: 70px;
	height: 1px;
	position: absolute;
	top: 50%;
	left: 105px;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.h_2 {
	background: #000;
	position: relative;
	color: #fff;
	min-height: 780px;
	height: 100vh;
}

.h_2 .h_2at {
	color: #fff;
}

.hh_2 {
	position: relative;
	z-index: 22;
	margin-top: 0px;
}

.h_2c {
	width: 3800px;
	text-align: right;
	z-index: 6;
	top: -270px;
	position: absolute;
}

.h_2c ul li {
	display: inline-block;
	width: 5000px;
	list-style: none;
	padding: 0px;
	text-transform: capitalize;
	text-align: center;
	font-weight: 700;
	padding-top: 15px;
	font-size: 10rem;
	color: #fff;
	margin: 15px 15px 0px;
	font-family: Montserrat;
	background: #000;
}

.h_2c ul li span {
	font-size: 4rem;
	padding: 0 5px;transform: translateY(-30px);
    display: inline-block;
}

.h_2a {
	padding: 280px 0 220px;
	text-align: left;
}

.h_2a .h_2a_p {
	font-size: 2.6rem;
	text-transform: uppercase;
	padding-bottom: 30px;
	letter-spacing: -0px;
	font-weight: 400;
	padding-top: 20px;
}

.h_2at {
	-webkit-transform: rotate(-90deg) translateX(-100%);
	-ms-transform: rotate(-90deg) translateX(-100%);
	color: #333;
	position: absolute;
	z-index: 1;
	left: 10%;
	top: 290px;
	padding-left: 135px;
	-webkit-transform: rotate(-90deg) translateX(-100%);
	-ms-transform: rotate(90deg) translateX(100%);
	-webkit-transform-origin: 100% 0;
	-ms-transform-origin: 100% 0;
	transform-origin: 0% 0;
}

.h_2at div {
	font-size: 1.4em;
	position: relative;
	font-family: National-Bold,Arial;
	text-transform: uppercase;
}

.h_2at div:before {
	content: '';
	background: #d8d8d8;
	width: 70px;
	height: 2px;
	position: absolute;
	top: 50%;
	left: calc(-100% + 30px);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.h_2a_rt {
	letter-spacing: 1px;
	padding-left: 150px;
	z-index: 2;
	position: relative;
	color: #fff;
}

.cd-headline {
	font-size: 1.3rem;
	line-height: 1.2;
}

.cd-headline p {
	padding: .2em 0;
	display: inline-block;
}

.cd-words-wrapper {
	display: inline-block;
	position: relative;
	text-align: left;
}

.cd-headline b {
	color: #0348d0;
	color:#FF0D0C;
	display: inline-block;
	position: absolute;
	white-space: nowrap;
	left: 0;
	top: 0;
	font-weight: 600;
}
.cd-headline .b b{
	position: relative;
	/* background-image: -webkit-linear-gradient(right bottom,#0062ff,#2c82e5,#ff4848);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; */

	color: #ffffff;
	
}
.cd-headline.loading-bar .b b.is-visible{
	color:#fff;
	background-image: none;
    -webkit-background-clip: text;
    -webkit-text-fill-color: white;
}
.cd-headline .b b{
	opacity: 1;
}
.cd-headline.loading-bar .b b{
	opacity: 1;
	top: -0.3em;
	margin: 10px 7px 0 0;
	font-size: 2rem;font-weight:300
}
.cd-headline.loading-bar .b b.is-visible {
	opacity: 1;
	top:-0.3em;font-weight:600
}

.cd-headline b.is-visible {
	position: relative;
	color:#fff
}
.cd-headline.loading-bar .cd-words-wrapper.is-loading.b b.is-visible::after{
width: 100%;
    -webkit-transition: width 3s;
    -moz-transition: width 3s;
    transition: width 3s;
	
}
.cd-headline.loading-bar .cd-words-wrapper.b b::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -9px;
	height: 3px;
	width: 0;
	background: #fff;
	-webkit-transition: width 0.3s -0.1s;
	-moz-transition: width 0.3s -0.1s;
	transition: width 0.3s -0.1s;
}
.cd-headline.loading-bar .cd-words-wrapper.b::after {
	 
	display:none;
}

.cd-headline b {
	opacity: 0;
}

.cd-headline b.is-visible {
	opacity: 1;
}

.cd-headline.loading-bar span {
	display: inline-block;
	padding: .3em 0 0;
}

.cd-headline.loading-bar .cd-words-wrapper {
	overflow: hidden;
	vertical-align: middle;
}

.cd-headline.loading-bar .cd-words-wrapper::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	height: 3px;
	width: 0;
	background: #fff;
	-webkit-transition: width 0.3s -0.1s;
	-moz-transition: width 0.3s -0.1s;
	transition: width 0.3s -0.1s;
}

.cd-headline.loading-bar .cd-words-wrapper.is-loading::after {
	width: 100%;
	-webkit-transition: width 3s;
	-moz-transition: width 3s;
	transition: width 3s;
}

.cd-headline.loading-bar b {
	top: .2em;
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	-moz-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.cd-headline.loading-bar b.is-visible {
	opacity: 1;
	top: 0;
}

.cd-headline.slide span {
	display: inline-block;
	padding: .2em .2em 0 0;
}

.cd-headline.slide .cd-words-wrapper {
	overflow: hidden;
	vertical-align: top;
}

.cd-headline.slide b {
	opacity: 0;
	color: #fff;
	/*text-decoration: underline;*/
}

.cd-headline.slide b.is-visible {
	top: 0;
	opacity: 1;
	-webkit-animation: slide-in 0.6s;
	-moz-animation: slide-in 0.6s;
	animation: slide-in 0.6s;
}

.cd-headline.slide b.is-hidden {
	-webkit-animation: slide-out 0.6s;
	-moz-animation: slide-out 0.6s;
	animation: slide-out 0.6s;
}

@-webkit-keyframes slide-in {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-100%);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateY(20%);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes slide-in {
	0% {
		opacity: 0;
		-moz-transform: translateY(-100%);
	}

	60% {
		opacity: 1;
		-moz-transform: translateY(20%);
	}

	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@keyframes slide-in {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-100%);
		-moz-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
		-o-transform: translateY(-100%);
		transform: translateY(-100%);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateY(20%);
		-moz-transform: translateY(20%);
		-ms-transform: translateY(20%);
		-o-transform: translateY(20%);
		transform: translateY(20%);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}
}

@-webkit-keyframes slide-out {
	0% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}

	60% {
		opacity: 0;
		-webkit-transform: translateY(120%);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(100%);
	}
}

@-moz-keyframes slide-out {
	0% {
		opacity: 1;
		-moz-transform: translateY(0);
	}

	60% {
		opacity: 0;
		-moz-transform: translateY(120%);
	}

	100% {
		opacity: 0;
		-moz-transform: translateY(100%);
	}
}

@keyframes slide-out {
	0% {
		opacity: 1;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}

	60% {
		opacity: 0;
		-webkit-transform: translateY(120%);
		-moz-transform: translateY(120%);
		-ms-transform: translateY(120%);
		-o-transform: translateY(120%);
		transform: translateY(120%);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(100%);
		-moz-transform: translateY(100%);
		-ms-transform: translateY(100%);
		-o-transform: translateY(100%);
		transform: translateY(100%);
	}
}

.sps{
	margin-top: 5%;
}
 
.sps div {
	font-size: 14px;
	padding-bottom: 20px;
	color: #ccc;
	text-transform: uppercase;
}
.sps div div {
	display: block;
	float: left;
}
.sps img.c{
	max-height: 16px;
	opacity: .8;
	    margin-top: -5px;
}
.sps img.l {
	opacity: .9;max-height: 16px;    height: 16px;
	margin-right: 0;
}
.sps img.e{
	opacity: .7;height: 16px;
	max-height: 16px;
}
.sps img.d{
	max-height: 16px;
}
.sps img{
	max-height: 14px;
	display: block;
	margin-right: 15px;
	float: left;
	margin-bottom:0px;
}
.h_2d {
	margin-top: -140px;
}

.h_2_yx {
	background: #404040;
	border-radius: 50%;
	width: 90px;
	margin: 0 auto;
	height: 90px;
	position: absolute;
	left: 50%;
	top: 50%;
	 
}

.h_2d1 {
	background: #000;
	padding: 150px 0 0;
	color: #fff;
	position: relative;
	z-index: 2;
	text-align: center;
}

.playground .h_2at {
	right: 0%;
	left: auto;
	color: #fff;
	top: 290px;
	padding-left: 0px;
}

.playground .h_2at div:before {
	background: #fff;
	padding-left: 35px;
	right: calc(-100% + 0px);
	left: auto;
}

section,section>.row1 {
	position: relative
}

.playground {
	background-color: #000;
	position: relative
}

.playground iframe {
	position: absolute;
	top: 0;
	left: 0;
}

.cs_page .section_header {
	position: relative
}

.section_header .row1 {
	z-index: 3;
	position: relative;
	max-width: 1500px;
	margin-right: auto;
	margin-left: auto;
	padding: 0 90px;
	margin-bottom: -100px;
}

.cs_page .section_header h3.wide {
	max-width: 860px
}

.section_header h2 {
	font-size: 1.2rem;
	font-weight: 400;
	text-transform: uppercase;
}

.section_header h3 {
	color: #fff;
	font-size: 66px;
	font-size: 3rem;
	line-height: 2;
	text-align: left;
	font-weight: 400;
	max-width: 650px;
	line-height: 1.2;
	padding-left: 0px;
	padding-top: 170px;
	padding-bottom: 150px;
	text-transform: none;
	font-family: "Avenir Next";
	font-weight: bold;
}

.cs_page .section_header.white .row1 {
	padding-bottom: 0
}

.cs_page .section_header.white h2,.cs_page .section_header.white h3 {
	color: #141424
}

.cs_page .copy1 {
	padding: 1rem 0 0rem;
}

.copy1 {
	max-width: 1500px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}

.copy1 ul {
	padding: 0px 90px;
}

.copy1 li {
	float: left;
	width: 20%;
	margin-left: 5%;
	text-align: left;
}

.copy1 li .c-icon {
	stroke: #50e3c2;
	width: 100px;
	height: 100px;
	stroke-width: 2px;
	fill: none;
}

.c-icon--product circle:nth-of-type(2) {
	stroke-opacity: .65;
}

.c-icon--product circle:nth-of-type(3) {
	stroke-opacity: .4;
}

.c-icon--app circle:first-of-type,.c-icon--app rect {
	stroke-opacity: .4;
}

.c-icon--company circle:nth-of-type(2) {
	stroke-opacity: .65;
}

.c-icon--company circle:nth-of-type(3) {
	stroke-opacity: .4;
}

.c-icon--scale rect:nth-of-type(2) {
	stroke-opacity: .65;
}

.c-icon--scale rect:last-of-type {
	stroke-opacity: .4;
}

.c-service .c-icon circle,.c-service .c-icon rect {
	vector-effect: non-scaling-stroke;
	-webkit-transition: .4s cubic-bezier(.4,.1,.6,.9);
	transition: .4s cubic-bezier(.4,.1,.6,.9);
}

.c-service--app circle:last-of-type {
	-webkit-transform-origin: 64.5px 18.5px;
	transform-origin: 64.5px 18.5px;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.c-service--product:hover circle:last-of-type {
	-webkit-transform: translateY(-15px);
	transform: translateY(-15px);
}

.c-service--product:hover circle:first-of-type {
	-webkit-transform: translateY(15px);
	transform: translateY(15px);
}

.c-service--scale:hover rect:first-of-type {
	-webkit-transform: translate(-15px,16px);
	transform: translate(-15px,16px);
}

.c-service--scale:hover rect:last-of-type {
	-webkit-transform: translate(16px,-15px);
	transform: translate(16px,-15px);
}

.c-service--app:hover circle:last-of-type {
	-webkit-transform: scale(1.714);
	transform: scale(1.714);
}

.c-service--company circle {
	-webkit-transform-origin: 45px 45px;
	transform-origin: 45px 45px;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.c-service--company>a circle {
	-webkit-transform-origin: 45px 45px;
	transform-origin: 45px 45px;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.c-service--company:hover circle:first-of-type {
	-webkit-transform: scale(2.1538);
	transform: scale(2.1538);
}

.c-service--company:hover circle:last-of-type {
	-webkit-transform: scale(.6512);
	transform: scale(.6512);
}

.copy1 li.copy1b .c-icon {
	stroke: #f8c91c;
}

.copy1 li.copy1c .c-icon {
	stroke: #bd10e0;
}

.copy1 li.copy1d .c-icon {
	stroke: #ff4081;
}

.copy1 li h2 {
	color: #fff;
	color: #fff;
	font-size: 1.2rem;
	margin-bottom: 1em;
	font-weight: normal;
	text-transform: capitalize;
	font-family: 'Montserrare';
}

.copy1 li p {
	display: block;
	text-align: left;
	color: #b1b4bf;
	font-size: 15px;
	line-height: 30px;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.copy1 li p:hover {
	color: #fff;
}

.copy1 li i {
	color: #aaa;
	text-align: left;
	font-size: 1.2rem;
	letter-spacing: 1px;
	font-style: normal;
	padding-top: 30px;
	display: block;
	padding-bottom: 4px;
}

.hh_2 .wave3 {
	position: absolute;
	top: calc(100% - 0px);
	left: 0;
	width: 100%;
	z-index: 2;
}

.h_3 {
	background: #fff;
	position: relative;
	z-index: 21;
	padding: 180px 60px 230px;
}

.h_3 video {
	width: 85%;
	height: 100%;
	top: 0px;
	left: 0px;
}

.h_3a {
	position: absolute;
	width: 350px;
	right: 0px;
	top: 180px;
	background: #173db2;
	padding: 50px 40px;
}

.h_3a span {
	color: #fff;
	font-size: 22px;
}

.h_3a h3 {
	color: #fff;
	font-size: 34px;
	letter-spacing: 0px;
	padding-bottom: 30px;
}

.h_3a p {
	font-size: 16px;
	color: #f2f4ff;
}

.h_3a p a {
	font-size: 20px;
	display: block;
	border-bottom: 1px solid #fff;
	padding-top: 20px;
}

.h_3 .case_n_more span {
	color: #666;
}

@font-face {
	font-family:"font";src:url('/cs19/iconfont.eot?t=1556005424921');src:url('/cs19/iconfont.eot?t=1556005424921#iefix') format('embedded-opentype'),url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAMoAAsAAAAABuwAAALaAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCcAqBeIFzATYCJAMICwYABCAFhG0HLhsXBsgekiRFQggUIIkKQTBGPHy/H+vc/y6qySXRRSyRSTRCoZJgpfVtFsrOThfLm/+grpUipoFNc0dHTDw98TSo2Qzvq7gWgO3FoWomUEDmn+fiMvegXADDAUmAxtpUqmgLUgCvguyOQC35PIFWI3wx2zFJWcBAcqYF4kEiKgcGJaeUUqRZaGxZm+JVg+bquboNeIl/P/5hw4BKQ+HknN9HV4GwnztuTGmrn9yFCKzl9JA2UbAESOK6NXhKW0g4ba1BHRPAsTKDnzt1HarFUf95opGT3g6GKPOZWD77USkrkHTnAPA46Tsoff2eskvfo7nHLk+eZD97lruSc+J9MyJvM/dQcCvTx+tG+LHXE4/Hj7OePpXNbM3N2wLMEj8Hu3/wsP3A7vHnrCdfsp99y3369HuV3Y+JFZRoxOyVl8QzcUy4NxNrhI7CWzPGHrjospepkxf2IPd777vUPNdWK7uaz2PyGbrfFnry4uXhVznbfJXhdfb+vTvL8yQKnT1KS/tZbLlH/n+Qdi26H10av/xB3k/7Fp2P0f/+HQgDUC9fS8V//hurX3BBqXnQ/+a2BN8+fxLG9noCzAw0340p+KsssClNjqOqUme1RisHtO+2olUratza6+1U6cArREOzgRcxNxnOoWg2hUzsEjRoswqNmq1Bq0Wxm9v0IbRFtmBBN4HQ7RQqnT5A0e0OMrFvoMGgP9CoO7Sh1W1Y79lmJiRGkQSXU1wFK+qhpFKl5DwNNUoyM7CoWl5OipwYn4MJL/FAfySsRmKxEpMlFvA1IpZSDnJEpYAx5DIsl6ugmqikuJIiMaXqAIGAa/siVKlSACNbCKwchVWBKtSDJCqpKHFhe8qo9vMZMJFqcuVIT0ODOgdG8CS9Q/4QIYCMFSqhhkf5hFdDhEVRHIhDqChAMWQUJienAqnbR0lhlShEPMGvFkDgtuJQIdperPi7HdDKkVXhFhb5KK6WAAAAAA==') format('woff2'),url('/cs19/iconfont.woff?t=1556005424921') format('woff'),url('/cs19/iconfont.ttf?t=1556005424921') format('truetype'),url('/cs19/iconfont.svg?t=1556005424921#iconfont') format('svg');
}

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

.icon-shui:before {
	content: "\e6a6";
	display: block;
}

body {
	min-height: 100vh;
	color: var(--color-text);
	background-color: var(--color-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

@media (pointer:coarse) {
	.cursor-wrapper,.arrow-cursor,.circle-cursor,.square-cursor,.demos {
		display: none !important
	}
}

@media (pointer:coarse) and (min-width:55em) {
	.message {
		position: absolute;
		left: 0;
		top: 0;
		padding: 0
	}
}

@media (pointer:coarse) {
	.content--demo1,.content--demo2,.content--demo3,.content--demo4,.content--demo5 {
		display: none !important
	}
}

@font-face {
	font-family:'Anton';font-style:normal;font-weight:400;src:local('Anton Regular'),local('Anton-Regular'),url(/cs19/fonts/Anton.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+1EA0-1EF9,U+20AB;
}

@font-face {
	font-family:'Anton';font-style:normal;font-weight:400;src:local('Anton Regular'),local('Anton-Regular'),url(/cs19/fonts/Anton.woff2) format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
	font-family:'Anton';font-style:normal;font-weight:400;src:local('Anton Regular'),local('Anton-Regular'),url(/cs19/fonts/Anton.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

.s.menu {
	position: fixed;
	top: 9.6875rem;
	left: 15%;
	width: 100%;
	height: calc(100% - 9.6875rem);
	display: flex;
	flex-direction: column;
	align-items: left;
	justify-content: left;
	z-index: 10000;
	pointer-events: none;
	display: none;
}

.hidden .s.menu {
	display: flex;
}

.hidden .logo {
	z-index: 99999999;
	position: relative;
}

.hidden .menu__item {
	opacity: 1;
	transition: all 3s;
}

.menu__item {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	opacity: 0;
	justify-content: center;
	pointer-events: auto;
	margin-top: -30px;
	margin-left: 30px;
	transition: all 3s;
}

.menu--closed .menu__item {
	pointer-events: none;
}

.menu__item-number {
	display: none;
	font-size: 0.85rem;
}

.menu__item-textwrap {
	position: relative;
	overflow: hidden;
	line-height: 1;
	margin: 1rem 0 0 0;
}

.menu__item-text {
	font-family: "Anton",Arial,sans-serif;
	text-transform: uppercase;
	-webkit-text-stroke: 2px #fff;
	text-stroke: 2px #fff;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
	color: transparent;
	font-size: 2rem;
	padding: 0 1rem;
	cursor: pointer;
	display: inline-block;
}

.menu__item--current .menu__item-text {
	-webkit-text-fill-color: #fff;
	text-fill-color: #fff;
	color: #fff;
	-webkit-text-stroke: 2px transparent;
	text-stroke: 2px transparent;
}

.menu__item-link {
	pointer-events: none;
	font-weight: bold;
	align-self: flex-end;
	opacity: 0;
	width: 100%;
	cursor: pointer;
	text-align: center;
	opacity: 0;
}

.menu__item--current .menu__item-link {
	pointer-events: auto;
}

.gridwrap {
	display: grid;
	max-width: 1500px;
	margin: 0 auto;
	grid-template-columns: 100%;
	grid-template-rows: 1.25rem calc(100% - 1.25rem);
	position: relative;
	padding: 2rem 2vw 2rem 5vw;
	pointer-events: none;
	margin-left: 20%;
}

.gridback {
	align-self: center;
	grid-area: 1 / 1 / 2 / 2;
	justify-self: center;
	background: none;
	border: 0;
	margin: 0;
	padding: 0;
	color: #fff;
	opacity: 0;
}

.gridback:hover {
	color: var(--color-link-hover);
}

.gridback:focus {
	outline: none;
}

.grid--open ~ .gridback {
	pointer-events: auto;
}

.grid.nuuu {
	grid-area: 2 / 1 / 3 / 2;
	--gridgap: 3vw;
	--gridwidth: 100%;
	--gridheight: calc(100vh - 9.6875rem);
	display: grid;
	width: 100%;
	height: var(--gridheight);
	grid-template-rows: repeat(20,calc(var(--gridheight) / 10 - var(--gridgap)));
	grid-template-columns: repeat(20,calc(var(--gridwidth) / 10 - var(--gridgap)));
	grid-gap: var(--gridgap);
	align-content: center;
	justify-content: center;
}

.grid__item.nuuu2 {
	opacity: 0;
	position: relative;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
}

.grid--open .grid__item.nuuu2 {
	pointer-events: auto;
}

.grid__item::after {
	content: '';
	background: rgba(0,0,0,0.6);
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transition: background 1s cubic-bezier(1,0,0,1);
}

.grid--open .grid__item::after {
	background: rgba(0,0,0,0);
}

.grid--layout-1 .grid__item:first-child {
	grid-area: 3 / 1 / 8 / 4;
}

.grid--layout-1 .grid__item:nth-child(2) {
	grid-area: 1 / 2 / 3 / 4;
}

.grid--layout-1 .grid__item:nth-child(3) {
	grid-area: 5 / 4 / 8 / 8;
}

.grid--layout-1 .grid__item:nth-child(4) {
	grid-area: 2 / 7 / 5 / 11;
}

.grid--layout-1 .grid__item:nth-child(5) {
	grid-area: 1 / 4 / 5 / 7;
}

.grid--layout-1 .grid__item:nth-child(6) {
	grid-area: 8 / 5 / 11 / 2;
}

.grid--layout-1 .grid__item:nth-child(7) {
	grid-area: 10 / 9 / 8 / 11;
}

.grid--layout-1 .grid__item:nth-child(8) {
	grid-area: 5 / 8 / 8 / 10;
}

.grid--layout-1 .grid__item:nth-child(9) {
	grid-area: 8 / 5 / 11 / 9;
}

.grid--layout-2 .grid__item:first-child {
	grid-area: 2 / 1 / 5 / 4;
}

.grid--layout-2 .grid__item:nth-child(2) {
	grid-area: 1 / 4 / 4 / 7;
}

.grid--layout-2 .grid__item:nth-child(3) {
	grid-area: 1 / 7 / 5 / 10;
}

.grid--layout-2 .grid__item:nth-child(4) {
	grid-area: 5 / 1 / 7 / 4;
}

.grid--layout-2 .grid__item:nth-child(5) {
	grid-area: 4 / 4 / 7 / 7;
}

.grid--layout-2 .grid__item:nth-child(6) {
	grid-area: 7 / 7 / 11 / 4;
}

.grid--layout-2 .grid__item:nth-child(7) {
	grid-area: 5 / 7 / 8 / 11;
}

.grid--layout-2 .grid__item:nth-child(8) {
	grid-area: 7 / 2 / 9 / 4;
}

.grid--layout-3 .grid__item:first-child {
	grid-area: 1 / 2 / 3 / 5;
}

.grid--layout-3 .grid__item:nth-child(2) {
	grid-area: 3 / 1 / 6 / 5;
}

.grid--layout-3 .grid__item:nth-child(3) {
	grid-area: 1 / 5 / 5 / 8;
}

.grid--layout-3 .grid__item:nth-child(4) {
	grid-area: 2 / 8 / 6 / 11;
}

.grid--layout-3 .grid__item:nth-child(5) {
	grid-area: 5 / 5 / 8 / 8;
}

.grid--layout-3 .grid__item:nth-child(6) {
	grid-area: 6 / 8 / 8 / 11;
}

.grid--layout-3 .grid__item:nth-child(7) {
	grid-area: 6 / 2 / 8 / 5;
}

.grid--layout-3 .grid__item:nth-child(8) {
	grid-area: 11 / 4 / 8 / 7;
}

.grid--layout-3 .grid__item:nth-child(9) {
	grid-area: 8 / 9 / 11 / 7;
}

.grid--layout-4 .grid__item:first-child {
	grid-area: 2 / 1 / 4 / 4;
}

.grid--layout-4 .grid__item:nth-child(2) {
	grid-area: 1 / 4 / 3 / 7;
}

.grid--layout-4 .grid__item:nth-child(3) {
	grid-area: 3 / 4 / 5 / 7;
}

.grid--layout-4 .grid__item:nth-child(4) {
	grid-area: 1 / 7 / 4 / 11;
}

.grid--layout-4 .grid__item:nth-child(5) {
	grid-area: 4 / 2 / 7 / 4;
}

.grid--layout-4 .grid__item:nth-child(6) {
	grid-area: 5 / 7 / 8 / 4;
}

.grid--layout-4 .grid__item:nth-child(7) {
	grid-area: 4 / 7 / 8 / 11;
}

.grid--layout-4 .grid__item:nth-child(8) {
	grid-area: 8 / 9 / 11 / 4;
}

.grid--layout-5 .grid__item:first-child {
	grid-area: 2 / 1 / 5 / 4;
}

.grid--layout-5 .grid__item:nth-child(2) {
	grid-area: 1 / 4 / 5 / 7;
}

.grid--layout-5 .grid__item:nth-child(3) {
	grid-area: 5 / 2 / 7 / 5;
}

.grid--layout-5 .grid__item:nth-child(4) {
	grid-area: 1 / 7 / 4 / 11;
}

.grid--layout-5 .grid__item:nth-child(5) {
	grid-area: 5 / 7 / 7 / 5;
}

.grid--layout-5 .grid__item:nth-child(6) {
	grid-area: 7 / 5 / 10 / 1;
}

.grid--layout-5 .grid__item:nth-child(7) {
	grid-area: 4 / 7 / 7 / 9;
}

.grid--layout-5 .grid__item:nth-child(8) {
	grid-area: 4 / 9 / 9 / 11;
}

.grid--layout-5 .grid__item:nth-child(9) {
	grid-area: 7 / 5 / 11 / 9;
}

.grid--layout-6 .grid__item:first-child {
	grid-area: 2 / 1 / 4 / 4;
}

.grid--layout-6 .grid__item:nth-child(2) {
	grid-area: 1 / 4 / 3 / 7;
}

.grid--layout-6 .grid__item:nth-child(3) {
	grid-area: 3 / 4 / 5 / 7;
}

.grid--layout-6 .grid__item:nth-child(4) {
	grid-area: 1 / 7 / 4 / 11;
}

.grid--layout-6 .grid__item:nth-child(5) {
	grid-area: 4 / 2 / 7 / 4;
}

.grid--layout-6 .grid__item:nth-child(6) {
	grid-area: 5 / 7 / 8 / 4;
}

.grid--layout-6 .grid__item:nth-child(7) {
	grid-area: 4 / 7 / 8 / 11;
}

.grid--layout-6 .grid__item:nth-child(8) {
	grid-area: 8 / 9 / 11 / 4;
}

.content__item {
	max-width: 600px;
	margin: 0 auto;
	font-size: 1.15rem;
	padding: 1.5rem;
}

.js .content__item {
	position: absolute;
	top: 0;
	opacity: 0;
	pointer-events: none;
}

.js .content__item--current {
	position: relative;
	opacity: 1;
	pointer-events: auto;
}

.page--preview {
	display: none;
	width: 0;
	height: 0;
}

.hidden .page--preview {
	background: #000;
	display: block;
	z-index: 106;
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	overflow: hidden;
	height: 100vh;
}

@media screen and (min-width:53em) {
	.codrops-header {
		grid-area: codropsheader;
		padding: 0;
		justify-self: end;
		text-align: right;
	}

	.codrops-links {
		margin: 0;
	}

	.frame a {
		pointer-events: auto;
	}

	.pageheader {
		grid-area: pageheader;
		margin: 0;
	}

	.menutop {
		grid-area: menutop;
		justify-self: end;
		width: 100%;
		display: grid;
		grid-template-rows: 100%;
		grid-auto-flow: column;
		justify-content: end;
		grid-gap: 1rem;
	}

	.menutop__item:nth-child(2) {
		margin: 0 2rem 0 0;
	}

	.s.menu {
		top: 10%;
		height: 100%;
	}

	.menu__item {
		margin: 1rem 0;
		flex-wrap: nowrap;
		justify-content: flex-start;
	}

	.menu__item-number {
		display: block;
		color: #fff;
	}

	.menu__item-text {
		font-size: 8vh;
	}

	.menu__item-link {
		text-align: left;
		width: auto;
		color: #fff;
	}

	.gridwrap {
		grid-gap: 3rem;
		padding: 2rem 5vw;
	}

	.grid {
		--gridheight: 1100px;
	}

	.content__item {
		font-size: 1.5rem;
		padding: 10vh 1rem;
	}
}

@font-face {
	font-weight:normal;font-style:normal;font-family:'codropsicons';src:url('../fonts/codropsicons/codropsicons.eot');src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),url('../fonts/codropsicons/codropsicons.woff') format('woff'),url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}

.codrops-header {
	margin: 0 auto;
	padding: 2em;
	text-align: center;
}

.codrops-header h1 {
	margin: 0;
	font-weight: 300;
	font-size: 2.5em;
	line-height: 1.3;
}

.codrops-header h1 span {
	display: block;
	padding: 0 0 0.6em 0.1em;
	font-size: 60%;
	opacity: 0.7;
}

.codrops-top {
	width: 100%;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 0.69em;
	line-height: 2.2;
}

.codrops-top a {
	display: inline-block;
	padding: 2em;
	text-decoration: none;
	letter-spacing: 1px;
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	display: block;
	float: left;
}

.codrops-icon:before {
	margin: 0 4px;
	text-transform: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	font-family: 'codropsicons';
	line-height: 1;
	speak: none;
	-webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
	content: "\e001";
}

.codrops-icon-prev:before {
	content: "\e004";
}

.codrops-demos {
	padding: 2em 0 1em;
	font-size: 0.8em;
	text-align: center;
}

.codrops-demos a {
	display: inline-block;
	margin: 0.5em 0.75em;
	line-height: 1.5;
	outline: none;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
}

.codrops-demos a.current-demo {
	color: inherit;
}

.related {
	padding: 4em 0 3em;
}

.related p {
	font-size: 1.25em;
	font-weight: 700;
}

.related > a {
	border: 2px solid #000;
	border-color: initial;
	display: inline-block;
	text-align: center;
	margin: 20px 10px;
	padding: 25px;
}

.related a img {
	max-width: 100%;
	opacity: 0.8;
}

.related a:hover img,.related a:active img {
	opacity: 1;
}

.related a h3 {
	margin: 0;
	padding: 0.5em 0 0.3em;
	max-width: 300px;
	text-align: left;
}

body #cdawrap {
	background: none;
	top: 50px;
	opacity: 0;
	-webkit-transition: opacity 0.3s 1.2s;
	transition: opacity 0.3s 1.2s;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

body #cdawrap a {
	color: #fff !important;
}

body .loaded ~ #cdawrap {
	opacity: 1;
}

body #cdawrap #cda-remove {
	top: 20px;
	right: 25px;
	width: 20px;
	height: 20px;
	opacity: 0;
}

body #cdawrap:hover #cda-remove {
	opacity: 1;
}

@media screen and (max-width:35em) {
	.codrops-icon span {
		display: none;
	}
}

@font-face {
	font-weight:normal;font-style:normal;font-family:'Blokk';src:url('../fonts/blokk/BLOKKRegular.eot');src:url('../fonts/blokk/BLOKKRegular.eot?#iefix') format('embedded-opentype'),url('../fonts/blokk/BLOKKRegular.woff') format('woff'),url('../fonts/blokk/BLOKKRegular.svg#BLOKKRegular') format('svg');
}

@font-face {
	font-weight:normal;font-style:normal;font-family:'feather';src:url('../fonts/feather/feather.eot?-9jv4cc');src:url('../fonts/feather/feather.eot?#iefix-9jv4cc') format('embedded-opentype'),url('../fonts/feather/feather.woff?-9jv4cc') format('woff'),url('../fonts/feather/feather.ttf?-9jv4cc') format('truetype'),url('../fonts/feather/feather.svg?-9jv4cc#feather') format('svg');
}[class^="icon-"]::before,[class*=" icon-"]::before {
	display: block;
	margin-bottom: 0.5em;
	padding: 0.5em;
	border-radius: 5px;
	background: #dfdfdf;
	color: #fff;
	text-align: center;
	text-transform: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	font-size: 5em;
	font-family: 'feather';
	line-height: 1;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-bell:before {
	content: "\e006";
}

.icon-cog:before {
	content: "\e023";
}

.icon-heart:before {
	content: "\e024";
}

.ip-header {
	position: fixed;
	top: 0;
	z-index: 99999;
	min-height: 480px;
	width: 100%;
	height: 100%;
	background: #f1f1f1;
}

.ip-logo,.ip-loader {
	position: absolute;
	left: 0%;
	width: 100%;
	opacity: 0;
	cursor: default;
	pointer-events: none;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
 

.ip-logo {
	top: 40px;
	height: 100%;
	-webkit-transform: translate3d(0,25%,0);
	transform: translate3d(0,25%,0);
}

.ip-loader {
	bottom: 20%;
	left: 0%;
	text-align: center;
	width: 100%;
}

.ip-header .ip-inner {
	display: block;
	margin: 0 auto;
}

.ip-header .ip-logo svg {
	min-width: 320px;
	max-width: 480px;
	width: 25%;
}

.ip-header .ip-logo svg path {
	fill: #ef6e7e;
}

.ip-header .ip-loader svg path {
	fill: none;
	stroke-width: 6;
}

.ip-header .ip-loader svg path.ip-loader-circlebg {
	stroke: #ddd;
}

.ip-header .ip-loader svg path.ip-loader-circle {
	-webkit-transition: stroke-dashoffset 0.2s;
	transition: stroke-dashoffset 0.2s;
	stroke: #3f51b5;
}

.ip-main {
	overflow: hidden;
}

.loading .ip-logo,.loading .ip-loader {
	opacity: 1;
	-webkit-animation: animInitialHeader 1s cubic-bezier(0.7,0,0.3,1) both;
	animation: animInitialHeader 1s cubic-bezier(0.7,0,0.3,1) both;
}

.loading .ip-loader {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

@-webkit-keyframes animInitialHeader {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0,50px,0);
	}
}

@keyframes animInitialHeader {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0,50px,0);
		transform: translate3d(0,50px,0);
	}
}

.loaded .ip-logo {
	-webkit-transform-origin: 0% 0;
	transform-origin: -70% 0;
	-webkit-animation: animLoadedLogo 1s cubic-bezier(0.7,0,0.3,1) forwards;
	animation: animLoadedLogo 1s cubic-bezier(0.7,0,0.3,1) forwards;
}

@-webkit-keyframes animLoadedLogo {
	to {
		-webkit-transform: translate3d(0,100%,0) translate3d(0,50px,0) scale3d(0.65,0.65,1);
	}
}

@keyframes animLoadedLogo {
	to {
		-webkit-transform: translate3d(0,100%,0) translate3d(0,50px,0) scale3d(0.65,0.65,1);
		transform: translate3d(0,100%,0) translate3d(0,50px,0) scale3d(0.65,0.65,1);
	}
}

.loaded .ip-logo,.loaded .ip-loader {
	opacity: 1;
}

.loaded .ip-loader {
	-webkit-animation: animLoadedLoader 0.5s cubic-bezier(0.7,0,0.3,1) forwards;
	animation: animLoadedLoader 0.5s cubic-bezier(0.7,0,0.3,1) forwards;
}

@-webkit-keyframes animLoadedLoader {
	to {
		opacity: 0;
		-webkit-transform: translate3d(0,-100%,0) scale3d(0.3,0.3,1);
	}
}

@keyframes animLoadedLoader {
	to {
		opacity: 0;
		-webkit-transform: translate3d(0,-50%,0) scale3d(0.3,0.3,1);
		transform: translate3d(0,-50%,0) scale3d(0.3,0.3,1);
	}
}

.loaded .ip-logo svg path {
	-webkit-transition: all 0.5s ease 0.3s;
	transition: all 0.5s ease 0.3s;
	fill: #fff;
}

.loading .iconfont_lo {
	color: #000;
	-webkit-transition: all 0.8s ease 0.3s;
	transition: all 0.8s ease 0.3s;
}

.loaded .ip-header {
	position: absolute;
	-webkit-animation: animLoadedHeader 1s cubic-bezier(0.7,0,0.3,1) forwards;
	animation: animLoadedHeader 1s cubic-bezier(0.7,0,0.3,1) forwards;
	text-indent: 260px;
}

@-webkit-keyframes animLoadedHeader {
	to {
		-webkit-transform: translate3d(0,-100%,0);
	}
}

@keyframes animLoadedHeader {
	to {
		-webkit-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0);
	}
}

.loaded .ip-main h2,.loaded .ip-main .browser,.loaded .ip-main .browser .box,.loaded .codrops-demos {
	-webkit-animation: animLoadedContent 1s cubic-bezier(0.7,0,0.3,1) both;
	animation: animLoadedContent 1s cubic-bezier(0.7,0,0.3,1) both;
}

.loaded .ip-main .browser,.loaded .ip-main .browser .box:first-child {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s;
}

.loaded .ip-main .browser .box:nth-child(2) {
	-webkit-animation-delay: 0.15s;
	animation-delay: 0.15s;
}

.loaded .ip-main .browser .box:nth-child(3) {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

@-webkit-keyframes animLoadedContent {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0,200px,0);
	}
}

@keyframes animLoadedContent {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0,200px,0);
		transform: translate3d(0,200px,0);
	}
}

.layout-switch .ip-header {
	position: absolute;
}

.no-js .ip-header {
	position: relative;
	min-height: 0px;
}

.no-js .ip-header .ip-logo {
	margin-top: 20px;
	height: 180px;
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}

.no-js .ip-header .ip-logo svg path {
	fill: #fff;
}

@media screen and (max-width:45em) {
	.ip-main h2 {
		font-size: 2.25em;
		font-size: 10vw;
	}

	.box {
		width: 100%%;
	}
}

.case_n .icon {
	display: block;
	width: 1.5em;
	height: 1.5em;
	margin: 0 auto;
	fill: currentColor;
	background: #fff;
}

.case_l_1 .huise {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: rgba(0,61,177,0.2);
}

.case_n main {
	position: relative;
	width: 100%;
	height: 800px;
	background: rgba(57,57,58,0.3);
	z-index: 20;
}

.case_n .content {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	margin: 0 auto;
}

.case_n .content--fixed {
	position: fixed;
	z-index: 10000;
	top: 0;
	left: 0;
	display: grid;
	align-content: space-between;
	width: 100%;
	max-width: none;
	height: 100vh;
	padding: 1.5em;
	pointer-events: none;
	grid-template-columns: 50% 50%;
	grid-template-rows: auto auto 4em;
	grid-template-areas: 'header ...' '... ...' 'github demos';
}

.case_n .content--fixed a {
	pointer-events: auto;
}

.case_n canvas {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
}

.scene-nav {
	height: 120px;
	width: 110px;
	position: absolute;
	top: calc(50% - 60px);
	z-index: 10;
	background: none;
	border: 0;
	right: 0;
}

.scene-nav:hover {
	background-color: rgba(51,51,51,0.8);
	opacity: 1;
}

.scene-nav:focus {
	outline: none;
}

.scene-nav--prev {
	left: 0;
	background: url('/cs19/left.svg') no-repeat 10px center;
	background-size: 110px 100px;
	opacity: 1;
}

.slide-wrapper img {
	display: none;
}

.scene-nav--next {
	transform: rotate(-180deg);
	background: url('/cs19/left.svg') no-repeat 0px center;
	background-size: 110px 100px;
	opacity: 1;
}

.slide-item a {
	position: absolute;
	bottom: 100px;
	left: 0%;
	width: 400px;
	margin-left: 200px;
	text-align: left;
	z-index: 99;
	color: #fff;
}

.case_n_ti {
	color: #fff;
	line-height: 25px;
	font-size: 18px;
	letter-spacing: 2px;
	padding-bottom: 20px;
	font-weight: lighter;
	text-align: center;
}

.slide-item .case_n_1d {
	margin-top: 20px;
	margin-bottom: 20px;
}

.slide-item h3 {
	font-size: 52px;
	font-weight: 400;
	text-transform: uppercase;
}

.slide-item {
	-webkit-transition: all 1s;
	transition: all 1s;
}

.case_n_8d {
	margin-bottom: 20px;
}

.slide-item a i {
	font-size: 14px;
	text-transform: uppercase;
	font-weight: normal;
	margin-left: 0px;
	font-weight: lighter;
}

.slide-item a i {
	position: relative;
	transition: all 260ms ease-out;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-webkit-transform-style: flat;
	-moz-transform-style: flat;
	-ms-transform-style: flat;
	-o-transform-style: flat;
	will-change: transform;
}

.slide-item a i::before {
	content: "";
	position: absolute;
	left: 110%;
	top: 50%;
	width: 50px;
	height: 1px;
	background: #fff;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.slide-item a:hover i:before {
	width: 70px;
}

.hidden1 {
	position: absolute;
	overflow: hidden;
	width: 0;
	height: 0;
	pointer-events: none;
}

.case_n_8d span span {
	padding-right: 5px;
}

@media all and (min-width:1680px) {
	.case_l_4a li {
		width: 28%;
		max-width: 500px;
		margin: 0 2.5% 8%;
		display: inline-block;
	}

	.h_2a {
		padding: 350px 0 300px;
	}
	.h_2 .h_2at{
		top: 360px;
	}
}

@media all and (min-width:1580px) and (max-width:1920px) {
	.case_n-content {
		bottom: 100px;
	}

	.ser_1 {
		margin-top: 50px;
	}
}

@media all and (max-height:780px) {
	.h_1 .h_1b {
		margin-top: 22vh;
	}
	
}

@media only screen and (max-width:768px) and (max-height:500px) {
	.h_1pad {
		padding: 8vw;
	}

	.h_intro {
		min-height: 620px;
	}

	.home .home_mu {
		min-height: 620px;
	}

	.ip-logo .h_1a {
		padding-top: 6vh;
	}

	.h_1a .iconfont_lo p {
		font-size: 76px;
		height: 82px;
		line-height: 82px;
		width: 82px;
	}

	.h_1a span {
		font-size: 56px;
		padding-top: 6px;
	}

	.h_1 .h_1b {
		margin-top: 16vh;
	}

	.h_1 .h_1b span {
		font-size: 38px;
		line-height: 1.05;
	}

	.h_1 .h_1b span b {
		font-size: 20px;
		padding-top: 10px;
	}

	.h_1_down {
		margin-top: 6px;
		bottom: 10px;
	}

	.case_l_1 {
		max-height: none;
		min-height: 980px;
	}

	.case_l_1 .site-wrapper,
		.case_l_1 .content.ck-slide,
		.case_l_1 .slide-wrapper,
		.case_l_1 .slide-item,
		.case_l_1 .s_s1,
		.case_l_1 .swiper-container {
		min-height: 420px;
	}
}

@media all and (max-width:1366px) {
	.h_intro {
		max-height: 100vh;
	}
}

@media all and (max-width:1280px) {
	.h_intro {
		min-height: 100%;
	}

	.case_l_6_sx {
		width: auto;
		padding: 0px 50px;
	}

	.button_su {
		width: 20%;
	}

	.button_su_inner {
		padding: 12px 0px;
		display: block;
		font-size: 14px;
	}

	.case_n_1a {
		padding-top: calc(100vw * 0.23);
		padding-bottom: 0;
	}

	.ser_0 .case_n-content,.case_n .case_n-content {
		bottom: -120px;
	}

	.ser_1a .fl span {
		font-size: 2rem;
	}

	.ser_1a .fl h2 {
		font-size: 1.8rem;
	}

	.ser_1a .fl {
		width: 55%;
	}

	.ser_1a .rt {
		width: 44%;
	}

	.ser_1::before {
		width: 47%;
		height: 350px;
	}

	.ser_1a .fl p {
		padding-right: 50px;
	}

	.ser_1a .rt img {
		max-height: 280px;
	}

	.news-lists li .newsimg {
		height: 220px;
	}
}

@media all and (max-width:1024px) {
	.h_2c,.srv_2 {
		display: none;
	}

	.srv_2.srv_3 {
		display: block;
		padding: 80px 0;
	}

	.case_n_1a {
		padding-top: calc(100vw * 0.3);
		padding-bottom: 0;
	}

	.hzkehu_1 {
		margin: 50px auto 0;
		padding: 0 50px;
	}

	.h_intro {
		min-height: 100%;
	}

	.ser_0 .case_n-content {
		bottom: -140px;
	}

	.container {
		padding: 0 50px 0 100px;
	}

	.ser_1::before {
		height: 320px;
	}

	.ser_1a .rt img {
		padding-top: 80px;
		max-height: 260px;
	}

	.ser_l_3c {
		padding: 20px 30px;
	}

	.news-lists li .newsimg {
		height: 180px;
	}
}

@media only screen and (min-width:1000px) {
	.container {
		max-width: 1550px;
	}
}

@media only screen and (max-width:768px) {
	.h_viedo video,.section_header .row1,.c-arrow--forward,.h_3 .case_n_more span,#h_nav,.ser_l_3,.content--main,.cont1.panel#main,.slideshow_buttontitle {
		display: none;
	}
.ad2024{
	display: none!important;
}
	body {
		font-family: -apple-system,BlinkMacSystemFont;
	}

	.container {
		padding: 0 25px;
	}

	.h_1 {
		width: 100%;
	}

	.h_intro {
		margin-left: 58px;
		height: auto;
		min-height: 760px;
		background: linear-gradient(50deg,#015ab7 0%,#a539a1 60%,#ff2020 100%);
	}

	.home .home_mu {
		width: 58px;
		height: 100%;
		min-height: 760px;
		position: absolute;
	}

	.home div.burger {
		left: 11px;
	}

	.home .burger span {
		display: none;
	}

	.home div.x,.home div.y,.home div.z {
		background: #000;
		width: 28px;
		bottom: auto;
	}

	.h_1pad {
		padding: 15vw;
	}

	.ip-logo .h_1a {
		text-align: center;
		padding-top: 16vh;
	}

	.h_1a .iconfont_lo p {
		display: block;
		text-align: center;
		font-size: 124px;
		height: 130px;
		line-height: 130px;
		width: 130px;
		margin: 0 auto;
		background-image: -webkit-linear-gradient(50deg,#6c28aa,#ff2e2e);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.loaded .ip-header {
		position: absolute;
		text-indent: 0;
	}

	.h_1a span {
		position: relative;
		font-size: 12vw;
		display: block;
		text-align: center;
		padding-top: 3vh;
		background-image: -webkit-linear-gradient(80deg,#14307e,#a748d9);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.loaded .ip-logo {
		transform-origin: 72% 0;
	}

	.ip-logo .iconfont_lo {
		text-align: center;
	}

	.h_1 .h_1b {
		margin-top: 42vh;
	}

	.h_1 .h_1b span {
		font-size: 10vw;
	}

	.h_2 {
		width: 100%;
		overflow: hidden;
		min-height: auto;
	 height: auto;
	}
.cd-headline.loading-bar span {
		padding: 20px 0 0px;
    margin-left: 0px;margin-bottom: 0px;
	}
	.cd-headline.loading-bar .cd-words-wrapper.b b::after{
		bottom: -4px;
    height: 2px;
	}
	.cd-headline.loading-bar .b b{
	font-size: 1.5rem;
    font-weight: 600;
	margin-bottom:10px;
	margin-left:0;
	}
	.sps img{
		margin-bottom:10px;
	}
	.h_1 .h_1b span b {
    font-size: 26px;
	}
	.h_1 .h_1c { 
    margin-top: 20%;
	
	}
	.home div.circle.expand{
		display:none
	}
	.h_2a {
		padding: 100px 0 50px;
	}

	.h_2a_rt {
		padding-left: 50px;
	}

	.cd-headline {
		font-size: 1rem;
	}

	.h_2a .h_2a_p {
		font-size: 1.6rem;
		letter-spacing: -1px;
	}

	.h_2at {
		top: 100px;
	}

	.playground iframe {
		height: 30%;
	}

	.h_2d {
		margin-top: 0;
	}

	.h_2d1 {
		padding: 0px 0;
	}

	.copy1 ul {
		padding: 0px 0px 0 20px;
	}

	.copy1 li .c-icon {
		width: 80px;
		height: 80px;
	}

	.copy1 li.copy1c .c-icon {
		width: 70px;
		height: 70px;
		padding-bottom: 10px;
	}

	.copy1 li {
		width: 42%;
		margin-left: 7%;
		margin-bottom: 80px;
	}

	.playground .h_2at {
		right: -60px;
		top: 190px;
	}

	.h_3 {
		padding: 150px 20px 200px;
	}

	.h_3 video {
		width: 100%;
	}

	.h_3a {
		position: relative;
		left: 0;
		bottom: 0;
		top: auto;
		padding: 20px 30px;
		width: auto;
		margin-top: -100px;
	}

	.h_3a {
		font-size: 18px;
	}

	.h_3a h3 {
		font-size: 22px;
	}

	.h_3a p {
		font-size: 14px;
	}

	.case_l_6_sx {
		width: auto;
		padding: 50px 50px 0;
	}

	.button_su {
		width: 90%;
	}

	.button_su_inner {
		padding: 4px 0px;
		display: block;
		font-size: 13px;
	}

	.new0 {
		overflow-x: hidden;
	}

	.ser_l_4 .fl,.ser_l_4 .rt {
		width: auto;
		margin: 0px 20px 20px;
		float: none;
		height: 300px;
		background-position: center right;
	}

	.ser_l_4 a {
		height: 300px;
	}

	.ser_l_4 a span {
		padding-left: 0px;
		padding-top: 130px;
		text-align: center;
	}

	.ser_l_4 .rt {
		background-position: center;
	}

	.ser_0 .case_n-content {
		bottom: -40px;
	}

	h3.case_n_1c {
		margin-top: 100px;
		font-size: 2rem;
		line-height: 2;
	}

	.case_n_1d span {
		padding: 8px 0px;
		width: 40%;
		margin: 0 12px 10px;
	}

	.ser_1 {
		margin-bottom: 20px;
	}

	.ser_1a .fl,.ser_1a .rt {
		width: 100%;
		float: none;
	}

	.ser_1a {
		padding: 50px 0 100px;
	}

	.ser_1::before {
		display: none;
	}

	.ser_1a .fl .pad {
		padding: 0;
	}

	.ser_1a .fl span {
		padding-bottom: 10px;
		letter-spacing: 0;
	}

	.ser_1a .fl span,.ser_1a .fl h2 {
		font-size: 1.4rem;
	}

	.ser_1a .fl p {
		padding-right: 0;
	}

	.ser_1a .rt img {
		max-height: 100%;
		width: 100%;
		padding-top: 30px;
	}

	.case_l_3a,.c_l2 .case_l_3a {
		position: relative;
		width: 100%;
		height: 300px;
	}

	.case_l_3 li {
		margin: 0px auto 100px;
	}

	.ser_l_2 .case_l_3a1,.ser_l_2 .c_l2 .case_l_3a1 {
		background-attachment: initial;
		background-size: cover;
	}

	.case_l_3b {
		height: auto;
		max-width: 100%;
		position: relative;
		margin: 0;
	}

	.ser_l_2 .case_l_3b .case_l_3b_tt,.ser_l_2 .c_l2 .case_l_3b .case_l_3b_tt {
		margin-left: 0;
		left: 0;
		top: -50px;
		font-size: 17px;
		width: 240px;
		padding-left: 20px;
		padding-right: 0;
		letter-spacing: -1px;
		text-align: left;
		height: 33px;
		line-height: 33px;
	}

	.ser_l_2 .case_l_3b .case_l_3b_tt {
		top: -130px;
	}

	.ser_l_2 .ser_t2 {
		margin-top: 35px;
	}

	.ser_body .ser_l_2 .case_3_c {
		width: auto;
		padding: 70px 20px 0;
		float: none;
		margin-top: 0px;
	}

	.ser_l_2 .case_3_c .pad {
		margin: 0;
	}

	.slg {
		margin-left: 0;
	}

	.slg .cd-headline {
		letter-spacing: 0;
		padding: 0;
		padding: 0 20px;
		text-align: left;
	}

	#content-photography {
		display: none;
	}

	#city2 {
		height: 600px;
	}

	.panel .cd-headline .slg1.slg2 {
		font-size: 38px;
		line-height: 56px;
	}

	.srv_1 {
		background: url('/cs19/1.jpg') no-repeat center;
		background-size: cover;
	}

	.panel .cd-headline.rotate-3 span.cd-words-wrapper {
		display: inline-block;
	}

	.con_head {
		width: 100%;
	}

	.cont0 {
		width: 100%;
		float: none;
		height: auto;
		min-height: 100%;
	}

	.cont0_1 {
		padding: 0 20px;
	}

	.cont0_p b {
		font-size: 38px;
	}

	.cont0_1 div,.cont0_p {
		width: 100%;
	}

	.cont0_1 div span {
		width: 80px;
	}

	.c_add {
		display: block;
	}

	.c_add p {
		width: 60%;
	}

	.cont0_1 div p,.cont0_1 .rt_p {
		padding-left: 40px;
	}

	.case_l_1 {
		max-height: 96vh;
	}

	.scene-nav--prev,.scene-nav--next {
		background-size: 60px 60px;
		height: 90px;
		width: 80px;
		top: calc(50% - 120px);
	}

	.slide-item a {
		left: 20px;
		width: auto;
		margin-left: auto;
		bottom: 110px;
	}

	.slide-item h3 {
		font-size: 38px;
	}

	.case_l_2 {
		margin: 0 auto 50px;
	}

	.case_l_2 span {
		font-size: 32px;
		line-height: 38px;
	}

	.case_l_3b_img {
		top: 0;
	}

	.case_3_c,.c_l2 .case_3_c {
		width: 100%;
		float: none;
		padding: 0;
		margin-top: 100px;
	}

	.c_l2 .case_l_3b .case_l_3b_tt {
		right: auto;
		margin-right: auto;
	}

	.case_3_c a,.c_l2 .case_3_c a {
		margin: 0 20px;
	}

	.case_3_c p {
		padding-bottom: 40px;
	}

	.case_l_6 .case_l_4a {
		padding-top: 20px;
	}

	.case_nex {
		width: 90%;
	}

	.case_l_6_sx {
		text-align: left;
	}

	.button_su {
		margin-bottom: 10px;
	}

	.feny {
		text-align: left;
		padding: 0px 20px;
	}

	.case_l_5 .case_n_7wave:before {
		height: 80px;
		background: #193d5d;
		position: absolute;
		top: 0;
		left: 0;
		content: "";
		display: block;
		width: 100%;
	}

	.case_l_5 .case_n_7wave {
		height: auto;
	}

	#top .container {
		margin-top: -10px;
	}

	.case_l_5 svg {
		width: 100%;
		height: 205px;
	}

	.case_l_5 {
		height: 150px;
	}

	body div.burger {
		right: 10px;
		width: 40px;
		position: absolute;
	}

	body div.burger.open {
		right: 20px;
	}

	.burger div.x,.burger div.y,.burger div.z {
		height: 2px;
		width: 32px;
		color: #fff;
		background: #fff;
	}

	body .burger span {
		display: none;
	}

	.mu_tel {
		display: none;
	}

	.hidden .s.menu {
		z-index: 999;
		margin-top: -30px;
		left: 50%;
		margin-left: -70px;
		width: auto;
	}

	html body.hidden,html .hidden {
		max-height: 100vh;
		overflow: hidden;
		overflow-x: hidden;
		overflow-y: hidden;
	}

	.home div.circle.expand {
		background: none;
	}

	body .burger:hover .x,body .burger:hover .y,body .burger:hover .z {
		background: #fff;
	}

	.home .burger div.x,.home .burger div.y,.home .burger div.z {
		background: #000;
	}

	.home .burger.open div.x,.home .burger.open div.y,.home .burger.open div.z {
		background: #fff;
	}

	.hidden.home div.burger.open {
		left: 5px;
	}

	body .menu__item {
		margin-top: 0;
		margin-left: 0;
		margin-bottom: 30px;
	}

	.menu__item-link {
		color: #fff;
		display: none;
	}

	body .menu__item-text {
		font-size: 46px;
	}

	html body.hidden {
		min-width: 100%;
	}

	body div.circle.expand {
		transform: none;
		-moz-transform: none;
		-webkit-transform: none;
		top: 0%;
		right: auto;
		left: 0;
		border-radius: 0;
		z-index: 99999;
		width: 100vw;
		height: 100vh;
	}


#h_nav nav li.nav-case-dropdown {
	position: relative;
	padding-right: 36px;
}

#h_nav nav li.nav-case-dropdown > a {
	display: block;
	position: relative;
}

#h_nav nav li.nav-case-dropdown > a:after {
	content: "";
	position: absolute;
	top: 50%;
	right: -16px;
	width: 0;
	height: 0;
	margin-top: -1px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 6px solid currentColor;
	transition: transform .25s ease;
}

#h_nav nav li.nav-case-dropdown:hover > a:after,
#h_nav nav li.nav-case-dropdown:focus-within > a:after {
	transform: rotate(180deg);
}

#h_nav nav .nav-case-submenu {
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	min-width: 176px;
	padding: 10px 0;
	background: rgba(7, 13, 25, .94);
	border: 1px solid rgba(255, 255, 255, .12);
	box-shadow: 0 18px 40px rgba(0, 0, 0, .24);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
	z-index: 1002;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

#h_nav nav li.nav-case-dropdown:hover .nav-case-submenu,
#h_nav nav li.nav-case-dropdown:focus-within .nav-case-submenu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

#h_nav nav .nav-case-submenu a {
	display: block;
	padding: 8px 18px;
	line-height: 1.6;
	font-size: 14px;
	white-space: nowrap;
	letter-spacing: .5px;
}

#h_nav nav .nav-case-submenu a:hover {
	background: rgba(255, 255, 255, .08);
	color: #fff;
}
	.s.menu {
		width: 100%;
	}

	.case_n .case_n_1 .case_n_1c {
		margin-top: 0;
		font-size: 2rem;
		letter-spacing: -1px;
	}

	.case_n .case_n_1 .case_n_1a {
		padding-top: calc(100vw * 0.3);
	}

	.case_n .case_n_1b {
		padding-top: 40px;
	}

	.case_n .case_n_1 {
		min-height: 600px;
	}


	@media only screen and (max-width:768px) {
		.home .slideshow_buttontitle {
			display: block !important;
			right: 12px;
			bottom: 12px;
			transform: scale(.9);
			transform-origin: right bottom;
			z-index: 20;
		}
	}
	.case_n .case_n-content {
		bottom: -100px;
	}

	.case_n .case_n_1d {
		margin: 0 auto;
	}

	.case_n .case_n_1d span {
		width: auto;
		padding: 0 3px;
	}

	.case_n_3body img {
		animation-timing-function: initial;
		animation-duration: 100s;
	}

	.case_n_3body {
		height: 270px;
		margin-bottom: 100px;
	}

	.case_n_3 .case_n_3wave .wave3_bg {
		height: 340px;
		display: none;
	}

	.case_n_3wave .wave3 {
		top: calc(440px - 2px);
		display: none;
	}

	.case_n .case_n_2 {
		padding-top: 30px;
	}

	.case_n_2a {
		padding-bottom: 0;
	}

	.case_t {
		padding-right: 20px;
		top: 0;
		-webkit-transform: rotate(0deg) translateX(0%);
	}

	.case_t div {
		font-size: 22px;
	}

	.case_t p {
		font-size: 18px;
	}

	.case_t div:before {
		width: 40px;
	}

	.case_n_4,.case_n_6 {
		position: relative;
		padding-top: 100px;
	}

	.case_n_4 {
		padding-bottom: 110px;
	}

	.case_n_4b,.case_n_6b {
		padding-left: 0px;
		width: 100%;
		padding-bottom: 100px;
	}

	.case_n_4b .clr {
		width: 28%;
		margin-right: 5%;
		margin-left: 0;
	}

	.case_n_4b .clr .height {
		height: 200px;
	}

	.case_n_5 {
		height: 400px;
		margin-bottom: 80px;
		background-attachment: inherit;
	}

	.case_n_5bg {
		display: none;
	}

	.if_none {
		display: none;
	}

	.case_n_6b {
		padding-bottom: 0px;
	}

	.case_n_7b {
		display: none;
	}

	.case_n_7a {
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		transform: none;
		margin-bottom: 150px;
	}

	.case_n_7 {
		padding-bottom: 40px;
	}

	.case_n .case_n_a:hover .code {
		margin-left: -71px;
	}

	.case_n_7a .case_n_a,.case_n_7a .case_con {
		display: block;
		margin: 0 auto 40px;
	}

	.case_n main.site-wrapper {
		height: 90vh;
	}

	.case_n .case_n_4b.clear {
		padding-bottom: 0px;
	}

	.case_n_8n {
		margin-bottom: 0px;
		height: 300px;
		overflow: hidden;
	}

	.case_n_8n canvas {
		min-width: 100%;
		min-height: 100%;
		margin-top: 0px;
	}

	.case_n_8n.cny_body .slide-item h3 {
		font-size: 32px;
	}

	.case_n_8n.cny_body .slide-item a i {
		display: none;
	}

	.case_n .content {
		display: block;
		text-align: center;
	}

	.case_n_8n.cny_body .slide-wrapper {
		margin-left: 0;
		padding-top: 100px;
	}

	.main-news {
		margin-top: 50px;
	}

	.main-news .itemize {
		width: 100%;
	}

	.main-news .itemize li a {
		font-size: 18px;
	}

	.news-lists li {
		width: 45%;
		margin-right: 5%;
		margin-left: 0;
		margin-bottom: 20px;
	}

	.news-lists li .newsimg {
		height: 100px;
	}

	.news-lists li .newsdate {
		padding: 5px 0;
	}

	.news-lists li h2 {
		font-size: 15px;
		line-height: 1.4;
	}

	.news-lists li p {
		display: none;
	}

	.paging li a {
		width: 35px;
		height: 35px;
		font-size: 14px;
		line-height: 35px;
	}

	.news_in .now-position,.backlb {
		top: -35px;
	}

	.backlb a {
		font-size: 13px;
	}

	.news_in .wz-section {
		margin: 0;
		padding: 20px 20px;
	}

	.news_in .wz-section .content_title {
		position: relative;
		top: 0;
		font-size: 24px;
		letter-spacing: 0;
	}

	.news_in .content_box {
		margin: 0;
	}

	.news_in .prev-next {
		margin: 0;
		border-top: 1px solid #ccc;
		padding-top: 20px;
		margin-top: 20px;
	}

	.news_in .prev-next .fl,.news_in .prev-next .rt {
		float: none;
		padding-bottom: 5px;
		font-size: 12px;
	}

	.news_in .tags {
		margin-top: 20px;
	}

	.news_in .tags a.tg {
		padding: 0 20px 0 0;
	}

	.news_in .tags a {
		padding: 3px 4px;
	}

	.history-news .xgxw {
		font-size: 36px;
		top: -60px;
	}

	.history-news ul {
		width: auto;
		margin-top: -30px;
		padding: 0 20px;
	}

	.history-news ul li {
		width: 48%;
		height: 80px;
		margin-bottom: 10px;
	}

	.history-news ul li p {
		display: none;
	}

	.history-news ul li a {
		padding: 10px 10px;
	}

	.history-news ul li span {
		font-size: 12px;
	}

	.history-news {
		margin-top: 90px;
		padding-top: 0;
	}

	.history-news ul li h2 {
		font-size: 14px;
		height: auto;
		padding-bottom: 0;
	}

	.ip-loader {
		bottom: 7%;
	}

	.playground .h_2at,.h_2 .h_2at {
		display: none;
	}

	.h_2a_rt {
		padding-left: 0;
	}

	div.h_3,.hh_2 .wave3 {
		display: none;
	}

}

.y2020 {
	background: #c3080e url(2020.jpg) no-repeat center;
	height: 65px;
	width: 100%;
	background-size: contain;
	position: fixed;
	z-index: 999999;
}

.y2020 a {
	display: block;
	height: 65px;
	width: 100%;
}

@media only screen and (max-width:768px) {
	.y2020 {
		background: #c3080e url(2020m.jpg) no-repeat center;
		height: 55px;
		background-size: contain;
	}
}

.mu_tel {
	position: absolute;
	font-size: 32px;
	color: #fff;
	right: 15%;
	top: 20%;
	z-index: 99;
}

.mu_tel .li {
	margin-bottom: 50px;
}

.mu_tel .li b {
	font-size: 22px;
	font-weight: normal;
	font-family: 'Montserrare';
	display: block;
	padding-bottom: 16px;
	text-transform: uppercase;
}

.mu_tel .li p {
	font-weight: normal;
	font-style: normal;
	font-size: 18px;
	line-height: 34px;
	color: #e2e2e2;
}

.li_wechat {
	text-align: left;
}

.li_wechat div {
	text-indent: 18px;
}

.li_wechat img {
	width: 70px;
	display: block;
	padding: 6px;
	border: 1px solid #747474;
}

.li_wechat div {
	font-size: 14px;
	text-indent: 5px;
}

@media only screen and (max-width:768px) and (max-height:500px) {
	.h_1pad {
		padding: 10vw;
	}

	.ip-logo .h_1a {
		padding-top: 10vh;
	}

	.h_1 .h_1b {
		margin-top: 28vh;
	}

	.h_1 .h_1b span {
		font-size: 8vw;
	}

	.h_1 .h_1b span b {
		font-size: 18px;
		padding-top: 16px;
	}

	.h_1_down {
		margin-top: 12px;
	}
}