html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display: block
}

body {
	line-height: 1
}

ol,ul {
	list-style: none
}

blockquote,q {
	quotes: none
}

blockquote:before,blockquote:after,q:before,q:after {
	content: '';
	content: none
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

.clearfix {
	*zoom: 1
}

.clearfix:before,.clearfix:after {
	display: table;
	clear: both;
	content: "";
	line-height: 0
}

.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default
}

html,body {
	height: 100%;
	font-family: PingFang SC,Microsoft YaHei,"sans-serif",Lantinghei SC,Helvetica Neue,Helvetica,Arial,\\5FAE\8F6F\96C5\9ED1,STHeitiSC-Light,simsun,\\5B8B\4F53,WenQuanYi Zen Hei,WenQuanYi Micro Hei;
}

div.spacer {
	height: 1px
}

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box
}

body {
	background-color: #fff;

	font-size: 100%
}

a {
	outline: none
}

a img {
	outline: none
}

img {
	border: none
}

.logo {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	margin: 20px;
	padding: 2.8em 2.8em
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.logo {
		position: absolute;
		margin: 10px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.logo {
		margin: 0px;
		padding: 2.0em 2.0em;
		position: absolute
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.logo {
		margin: 0px;
		padding: 2.0em 2.0em;
		position: absolute
	}
}

.logo a {
	width: 95px;
	height: 36px;
	display: block;
	background-image: url("../../assets/shared/logo-light.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/logo-light.svg")
}

.logo.dark a {
	background-image: url("../../assets/shared/logo-dark.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/logo-dark.svg")
}

.logo.light a {
	background-image: url("../../assets/shared/logo-light.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/logo-light.svg")
}

.home .logo a {
	cursor: default
}

.toggle {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	margin: 20px;
	padding: 2.8em 2.8em;
	cursor: pointer
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.toggle {
		background-color: rgba(0,0,0,0.8);
		padding: 1.7em 1.5em;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
		overflow: hidden;
		margin: 30px;
		transform: scale(0.8)
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.toggle {
		background-color: rgba(0,0,0,0.8);
		padding: 1.7em 1.5em;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
		overflow: hidden;
		margin: 5px 15px;
		transform: scale(0.65)
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.toggle {
		background-color: rgba(0,0,0,0.8);
		padding: 1.7em 1.5em;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
		overflow: hidden;
		margin: 5px 15px;
		transform: scale(0.65)
	}
}

.toggle>div {
	height: 1.65em;
	width: 1.65em
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.toggle>div {
		height: auto
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.toggle>div {
		height: auto
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.toggle>div {
		height: auto
	}
}

.toggle>div>div {
	width: 100%;
	height: 2px;
	margin: 0 0 .43em 0;
	background-color: #fff;
	transition-duration: .3s;
	transition-delay: 0s, 0s, 0s, 0s
}

.toggle>div>div:nth-child(3) {
	width: 50%;
	float: right
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.toggle>div>div:nth-child(3) {
		margin: 0;
		width: 100%
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.toggle>div>div:nth-child(3) {
		margin: 0;
		width: 100%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.toggle>div>div:nth-child(3) {
		margin: 0;
		width: 100%
	}
}

.toggle:hover>div>div:nth-child(3) {
	width: 100%
}

.toggle.open>div>div:nth-child(1) {
	-webkit-transform: translateY(9px) rotate(45deg);
	-ms-transform: translateY(9px) rotate(45deg);
	transform: translateY(9px) rotate(45deg)
}

.toggle.open>div>div:nth-child(2) {
	opacity: 0
}

.toggle.open>div>div:nth-child(3) {
	width: 100%;
	-webkit-transform: translateY(-9px) rotate(-45deg);
	-ms-transform: translateY(-9px) rotate(-45deg);
	transform: translateY(-9px) rotate(-45deg)
}

.toggle.dark>div>div {
	background-color: #15181C
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.toggle.dark>div>div {
		background-color: #fff
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.toggle.dark>div>div {
		background-color: #fff
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.toggle.dark>div>div {
		background-color: #fff
	}
}

.toggle.ligth>div>div {
	background-color: #fff
}

.overlay {
	z-index: 11
}

.toggle {
	z-index: 9
}

.loading {
	z-index: 10
}

.menu {
	z-index: 8
}

.logo {
	z-index: 7
}

.cover {
	z-index: 9
}

.top {
	z-index: 25
}

.bottom {
	z-index: 25
}

.left {
	z-index: 25
}

.right {
	z-index: 25
}

.footer {
	z-index: 0
}

.content {
	z-index: 3
}

.loader {
	display: none
}

.loading {
	background-color: #fff;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	text-align: center
}

.top {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 0px;
	background-color: #fff
}

.bottom {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0px;
	background-color: #fff
}

.left {
	position: fixed;
	top: 0;
	left: 0;
	width: 0px;
	height: 100%;
	background-color: #fff
}

.right {
	position: fixed;
	top: 0;
	right: 0;
	width: 0px;
	height: 100%;
	background-color: #fff
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	body {
		padding: 0
	}

	.top,.bottom,.left,.right {
		display: none
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	body {
		padding: 0
	}

	.top,.bottom,.left,.right {
		display: none
	}
}

.cover {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #fff
}

.transition {
	display: none;
	z-index: -1;
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #fff;
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	left: 0
}

.transition>div {
	position: absolute;
	left: 100%;
	width: 100%;
	height: 100%;
	background-color: #fff
}

.transition.active {
	z-index: 5;
	display: block
}

.overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #15181C;
	opacity: .75
}


@media screen and (min-width: 320px) and (max-width: 479px) {
	body {
		padding: 0
	}

	.top {
		height: 0
	}

	.bottom {
		height: 0
	}

	.left {
		height: 0
	}

	.right {
		height: 0
	}

	.menu .container>div:nth-child(1) {
		top: 0 !important;
		left: 0 !important;
		bottom: 0 !important;
		right: 0 !important
	}

	.footer {
		border: 0 !important
	}
}

.twitter,.linkedin,.behance,.medium {
	position: relative;
	display: inline-block;
	width: 160px;
	height: 86px
}
.light .twitter {
	background: url("../../assets/shared/twitter-light.png.html") transparent 0 0 no-repeat;
	background: none,url("../../assets/shared/twitter-light.svg") center top;
	padding-top: 60px;
	font-size: 12px;
	line-height: 20px;
	
	color: #fff;
}

.light .twitter span {
	background-image: url("../../assets/shared/twitter-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/twitter-dark.svg");
	background-color: #15181C;
	opacity: 0
}

.light .twitter:hover span {
	opacity: 1
}

.dark .twitter {
	background-image: url("../../assets/shared/twitter-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/twitter-dark.svg")
}

.dark .twitter span {
	background-image: url("../../assets/shared/twitter-light.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/twitter-light.svg");
	background-color: #15181C;
	opacity: 0
}

.dark .twitter:hover span {
	opacity: 1
}

.light .linkedin {
	background-image: url("../../assets/shared/linkedin-light.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/linkedin-light.svg")
}

.light .linkedin span {
	background-image: url("../../assets/shared/linkedin-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/linkedin-dark.svg");
	background-color: #15181C;
	opacity: 0
}

.light .linkedin:hover span {
	opacity: 1
}

.dark .linkedin {
	background-image: url("../../assets/shared/linkedin-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/linkedin-dark.svg")
}

.dark .linkedin span {
	background-image: url("../../assets/shared/linkedin-light.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/linkedin-light.svg");
	background-color: #15181C;
	opacity: 0
}

.dark .linkedin:hover span {
	opacity: 1
}

.light .behance {
	background: url("../../assets/shared/behance-light.png.html") transparent 0 0 no-repeat;
	background: none,url("../../assets/shared/behance-light.svg") no-repeat center top;
	padding-top: 60px;
	font-size: 12px;
	line-height: 20px;
	color: #fff;
}
.social{
	display: flex;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	justify-content: center;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
}

.light .behance span {
	background-image: url("../../assets/shared/behance-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/behance-dark.svg");
	background-color: #15181C;
	opacity: 0
}

.light .behance:hover span {
	opacity: 1
}

.dark .behance {
	background-image: url("../../assets/shared/behance-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/behance-dark.svg")
}

.dark .behance span {
	background-image: url("../../assets/shared/behance-light.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/behance-light.svg");
	background-color: #15181C;
	opacity: 0
}

.dark .behance:hover span {
	opacity: 1
}

.light .medium {
	background: url("../../assets/shared/medium-light.png.html") transparent 0 0 no-repeat;
	background: none,url("../../assets/shared/medium-light.svg") no-repeat center top;
	padding-top: 60px;
	font-size: 12px;
	line-height: 20px;
	color: #fff;
}

.light .medium span {
	background-image: url("../../assets/shared/medium-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/medium-dark.svg");
	background-color: #15181C;
	opacity: 0
}

.light .medium:hover span {
	opacity: 1
}

.dark .medium {
	background-image: url("../../assets/shared/medium-dark.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/medium-dark.svg")
}

.dark .medium span {
	background-image: url("../../assets/shared/medium-light.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/medium-light.svg");
	background-color: #15181C;
	opacity: 0
}

.dark .medium:hover span {
	opacity: 1
}

.modules.scrollview {
	width: 100%;
	height: 100%
}

.modules.scrollview .module {
	width: 100%;
	height: 100%;
	/*position: absolute*/
	transform: translateY(0%);
}

.modules.scrollview .module .page {
	width: 100%;
	height: 100%;
	/*position: absolute;
	overflow: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden*/
}

.modules.scrollview .module .page .container-1 {
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden;
	background-image: url("../../assets/shared/fff.png");
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden
}

.modules.scrollview .module .page .container-1 .container-2 {
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden;
	background-image: url("../../assets/shared/fff.png");
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden
}

.modules.scrollview .module .page .container-1 .container-2 .image {
	width: 100%;
	height: 100%
}

.modules.scrollview .module .page .container-1 .container-2 .image .custom {
	width: 100%;
	height: 100%
}

.modules.scrollview .module .page .container-1 .container-2 .image .custom .img {
	width: 100%;
	height: 100%
}

.modules.scrollview .module .page .container-1 .container-2 .image .custom .content {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0
}

.Spinner {
	height: 58px;
	left: 50%;
	margin-left: -29px;
	position: absolute;
	top: 50%;
	width: 58px;
	margin-top: -29px;
	animation: container-rotate 1600ms linear infinite
}

.Spinner-line {
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: 0
}

.Spinner-line--1 {
	border-color: #19cdff;
	animation: fill-unfill-rotate 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,line-1-fade-in-out 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both
}

.Spinner-line--2 {
	border-color: #da2b62;
	animation: fill-unfill-rotate 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,line-2-fade-in-out 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both
}

.Spinner-line--3 {
	border-color: #f01950;
	animation: fill-unfill-rotate 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,line-3-fade-in-out 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both
}

.Spinner-line--4 {
	border-color: #585858;
	animation: fill-unfill-rotate 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both,line-4-fade-in-out 4800ms cubic-bezier(0.4, 0, 0.2, 1) infinite both
}

.Spinner-line-cog {
	display: inline-block;
	position: relative;
	width: 50%;
	height: 100%;
	overflow: hidden;
	border-color: inherit
}

.Spinner-line-cog-inner {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: 200%;
	box-sizing: border-box;
	height: 100%;
	border-width: 3px;
	border-style: solid;
	border-color: inherit;
	border-bottom-color: transparent;
	border-radius: 50%;
	animation: none
}

.Spinner-line-cog-inner--left {
	border-right-color: transparent;
	transform: rotate(129deg);
	animation: left-spin 1200ms cubic-bezier(0.4, 0, 0.2, 1) infinite both
}

.Spinner-line-cog-inner--right {
	left: -100%;
	border-left-color: transparent;
	transform: rotate(-129deg);
	animation: right-spin 1200ms cubic-bezier(0.4, 0, 0.2, 1) infinite both
}

.Spinner-line-cog-inner--center {
	width: 1000%;
	left: -450%
}

.Spinner-line-ticker {
	position: absolute;
	box-sizing: border-box;
	top: 0;
	left: 45%;
	width: 10%;
	height: 100%;
	overflow: hidden;
	border-color: inherit
}

@keyframes container-rotate {
	to {
		transform: rotate(360deg)
	}
}

@keyframes fill-unfill-rotate {
	12.5% {
		transform: rotate(135deg)
	}

	25% {
		transform: rotate(270deg)
	}

	37.5% {
		transform: rotate(405deg)
	}

	50% {
		transform: rotate(540deg)
	}

	62.5% {
		transform: rotate(675deg)
	}

	75% {
		transform: rotate(810deg)
	}

	87.5% {
		transform: rotate(945deg)
	}

	to {
		transform: rotate(1080deg)
	}
}

@keyframes left-spin {
	0% {
		transform: rotate(130deg)
	}

	50% {
		transform: rotate(-5deg)
	}

	to {
		transform: rotate(130deg)
	}
}

@keyframes right-spin {
	0% {
		transform: rotate(-130deg)
	}

	50% {
		transform: rotate(5deg)
	}

	to {
		transform: rotate(-130deg)
	}
}

@keyframes line-1-fade-in-out {
	0% {
		opacity: 1
	}

	25% {
		opacity: 1
	}

	26% {
		opacity: 0
	}

	89% {
		opacity: 0
	}

	90% {
		opacity: 1
	}

	to {
		opacity: 1
	}
}

@keyframes line-2-fade-in-out {
	0% {
		opacity: 0
	}

	15% {
		opacity: 0
	}

	25% {
		opacity: 1
	}

	50% {
		opacity: 1
	}

	51% {
		opacity: 0
	}
}

@keyframes line-3-fade-in-out {
	0% {
		opacity: 0
	}

	40% {
		opacity: 0
	}

	50% {
		opacity: 1
	}

	75% {
		opacity: 1
	}

	76% {
		opacity: 0
	}
}

@keyframes line-4-fade-in-out {
	0% {
		opacity: 0
	}

	65% {
		opacity: 0
	}

	75% {
		opacity: 1
	}

	90% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

.menu {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	color: white;
	overflow: hidden
}

.menu a {
	color: white
}

.menu .container {
	position: relative;
	width: 100%;
	height: 100%
}

.menu .container>div:nth-child(1) {
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	background-color: #15181C;
	opacity: .95
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.menu .container>div:nth-child(1) {
		left: 0;
		top: 0;
		bottom: 0;
		right: 0
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.menu .container>div:nth-child(1) {
		top: 0;
		left: 0;
		bottom: 0;
		right: 0
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.menu .container>div:nth-child(1) {
		top: 0;
		left: 0;
		bottom: 0;
		right: 0
	}
}

.menu .container>div:nth-child(2) {
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}

.menu .container>div:nth-child(2) ul.sections li {
	font-family: 'Montserrat', PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: 2em;
	letter-spacing: .2em;
	text-transform: uppercase;
	margin: 0 0 1.25em 0
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.menu .container>div:nth-child(2) ul.sections li {
		font-size: 1em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.menu .container>div:nth-child(2) ul.sections li {
		font-size: 1.5em
	}
}

.menu .container>div:nth-child(2) ul.sections li:last-child {
	margin: 0 0 2em 0
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.menu .container>div:nth-child(2) ul.sections li:last-child {
		margin-bottom: 1em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.menu .container>div:nth-child(2) ul.sections li:last-child {
		margin: 0 0 1.5em 0
	}
}

.menu .container>div:nth-child(2) ul.sections li a {
	opacity: 1;
	-webkit-transition: opacity 0.15s linear;
	-moz-transition: opacity 0.15s linear;
	-ms-transition: opacity 0.15s linear;
	-o-transition: opacity 0.15s linear;
	transition: opacity 0.15s linear
}

.menu .container>div:nth-child(2) ul.sections li a.out {
	opacity: 0.3
}

.menu .container>div:nth-child(2) ul.languages li {
	display: inline-block;
	font-family: 'Montserrat', PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: .75em;
	letter-spacing: .2em;
	text-transform: uppercase
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.menu .container>div:nth-child(2) ul.languages li {
		font-size: 0.6em
	}
}

.menu .container>div:nth-child(2) ul.languages li::after {
	content: ' | '
}

.menu .container>div:nth-child(2) ul.languages li:last-child::after {
	content: ''
}

.menu .container>div:nth-child(2) a {
	margin: 0 .5em;
	text-decoration: none;
	opacity: 1;
	-webkit-transition: all 0.15s ease;
	-moz-transition: all 0.15s ease;
	-o-transition: all 0.15s ease;
	transition: all 0.15s ease
}

.menu .container>div:nth-child(2) a.out {
	opacity: 0.3
}

.menu .container>div:nth-child(3) {
	text-align: center;
	position: absolute;
	bottom: 7.5%;
	left: 50%;
	width: 100%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}
.menu-tip{
	position: absolute;
	top: 20%;
	left: 0px;
	width: 100%;
	text-align: center;
	font-size: 16px;
	color: #fff;
	z-index: 100;
	display: none;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
	.menu .container>div:nth-child(3) {
		bottom: 10%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.menu .container>div:nth-child(3) {
		bottom: 10%
	}
	.menu-tip{
		display: block;
	}
}

.menu .container>div:nth-child(3) a {
	margin: 0 .5em;
	text-decoration: none;
	opacity: 1;
	-webkit-transition: all 0.15s ease;
	-moz-transition: all 0.15s ease;
	-o-transition: all 0.15s ease;
	transition: all 0.15s ease
}

.menu .container>div:nth-child(3) a.out {
	opacity: 0.3
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.menu .container>div:nth-child(3) a {
		width: 26px;
		height: 26px;
		background-size: cover;
		margin: 0 .2em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.menu .container>div:nth-child(3) a {
		width: 25%;
		height: 38px;
		background-size: cover;
		font-size: 9px !important;
	}
}

*,div,li,p,h1,h2,h3,h4,h5,a,span,html {
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: geometricPrecision
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	body>.content {
		/*margin-bottom: 219px*/
	}
}

.content {
	position: relative;
	overflow: hidden
}

.content.work {
	margin-bottom: 319px
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.content.work {
		margin-bottom: 309px
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.content.work {
		margin-bottom: 219px
	}
}

.content.works {
	margin-bottom: 319px
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.content.works {
		margin-bottom: 309px
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.content.works {
		margin-bottom: 219px
	}
}

.content .numbers {
	position: fixed;
	top: 50%;
	right: 60px;
	z-index: 10
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.content .numbers {
		display: none
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.content .numbers {
		right: 15px;
		display: none
	}
}

.content .numbers li {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-size: 0.6875em;
	padding: 17px 0;
	color: #fff;
	opacity: 0.5;
	-webkit-font-smoothing: antialiased !important
}

.content .numbers li.active {
	opacity: 1;
	position: relative;
}
.content .numbers li.active:after{
	content: " ";
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #fff;
	position: absolute;
	right: -10px;
	top: 50%;
	margin-top: -2px;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
	.content .numbers li {
		padding: 12px
	}
}

.content .numbers li a {
	text-decoration: none;
	color: #fff
}

.home .content {
	width: 100%;
	height: 100%;
	overflow: hidden
}

.home .content .modules .module.header .content>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	top: 47.5%;
	opacity: 0;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out
}

.home .content .modules .module.header .content>div h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	-webkit-font-smoothing: subpixel-antialiased !important;
	font-weight: 700;
	font-size: 3.5em;
	line-height: 1.1em;
	letter-spacing: 0em;
	max-width: 75%;
	margin: auto;
	color: #fff;
	text-rendering: geometricPrecision;
	padding-top: 32px;
}

.home .content .modules .module.header .content>div h1 span {
	display: block;
	margin: 0px auto 20px auto;
	font-size: 0.275em;
	line-height: 1em;
	font-weight: 700;
	text-rendering: geometricPrecision;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif"
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .content .modules .module.header .content>div h1 span {
		font-size: 0.40em;
		line-height: 1.3em;
		margin-top: 10px;
		max-width: 300px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.home .content .modules .module.header .content>div h1 span {
		font-size: 0.40em;
		line-height: 1.3em;
		margin-top: 10px
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.home .content .modules .module.header .content>div h1 {
		font-size: 3.5em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .content .modules .module.header .content>div h1 {
		font-size: 2.2em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.home .content .modules .module.header .content>div h1 {
		font-size: 1.8em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.home .content .modules .module.header .content>div h1 br {
		display: none
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.home .content .modules .module.header .content>div h1 br {
		display: none
	}
}

.home .content .modules .module.header .content>div h1 {
	-webkit-transform: translate3d(0px, 60px, 0px);
	-moz-transform: translate3d(0px, 60px, 0px);
	-ms-transform: translate3d(0px, 60px, 0px);
	-o-transform: translate3d(0px, 60px, 0px);
	transform: translate3d(0px, 60px, 0px);
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out
}

.home .content .modules .module.header .content>div.visible {
	opacity: 1
}

.home .content .modules .module.header .content>div.visible h1 {
	-webkit-transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-ms-transform: translate3d(0px, 0px, 0px);
	-o-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px)
}

.home .content .modules .module .landscape {
	display: block
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.home .content .modules .module .landscape {
		display: block
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	/*.home .content .modules .module .landscape {
		display: none
	}*/
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .content .modules .module .landscape {
		display: block
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	/*.home .content .modules .module .landscape {
		display: none
	}*/
}

.home .content .modules .module .portrait {
	display: none
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.home .content .modules .module .portrait {
		display: none
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	/*.home .content .modules .module .portrait {
		display: block
	}*/
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .content .modules .module .portrait {
		display: none
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	/*.home .content .modules .module .portrait {
		display: block
	}*/
}

.home .content .modules .module .custom>a {
	position: absolute;
	bottom: 32px;
	left: 50%;
	margin-left: -26px;
	width: 51px;
	height: 51px;
	text-align: center;
	z-index: 9;
	background-image: url("../../assets/shared/down.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/down.svg");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	text-indent: -9999px;
	opacity: 1
}

.home .content .modules .module .custom>a:hover {
	opacity: 0.3
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .content .modules .module.header .custom>a {
		bottom: 7px
	}

	.home .content .modules .module.project .custom>a {
		bottom: 0px;
		right: 30px;
		margin: 0;
		left: auto
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.home .content .modules .module.header .custom>a {
		bottom: 7px
	}

	.home .content .modules .module.project .custom>a {
		/*bottom: 0px;
		right: 30px;
		margin: 0;
		left: auto*/
		bottom: 7px;
	}
}

.home .content .modules .module.project .background {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-color: #15181C;
	opacity: 0;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease
}

.home .content .modules .module.project .container-2 {
	overflow: hidden !important
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.home .content .modules .module.project a:hover .background {
		opacity: 0.75
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.home .content .modules .module.project .img {
		overflow: hidden;
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		-o-transition: all 0.4s ease;
		transition: all 0.4s ease
	}
}

.home .content .modules .module.project .content>div {
	color: #fff;
	position: absolute;
	bottom: 5%;
	width: 100%;
	opacity: 0;
	-webkit-transition: 562.9ms cubic-bezier(0.5, 0.15, 0.17, 1);
	-moz-transition: 562.9ms cubic-bezier(0.5, 0.15, 0.17, 1);
	-o-transition: 562.9ms cubic-bezier(0.5, 0.15, 0.17, 1);
	transition: 562.9ms cubic-bezier(0.5, 0.15, 0.17, 1);
	-webkit-transform: translate3d(0px, 40px, 0px);
	-moz-transform: translate3d(0px, 40px, 0px);
	-ms-transform: translate3d(0px, 40px, 0px);
	-o-transform: translate3d(0px, 40px, 0px);
	transform: translate3d(0px, 40px, 0px)
}

.home .content .modules .module.project .content>div.visible {
	opacity: 1;
	-webkit-transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-ms-transform: translate3d(0px, 0px, 0px);
	-o-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px)
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.home .content .modules .module.project .content>div {
		bottom: auto;
		height: 100%
	}
}

.home .content .modules .module.project .content>div .info {
	float: left;
	margin: 0 0 0 3em;
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-style: italic;
	font-size: 0.875em
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.home .content .modules .module.project .content>div .info {
		width: 40%;
		line-height: 1.3em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.home .content .modules .module.project .content>div .info {
		width: 80%;
		line-height: 1.3em;
		float: none;
		margin: 0 0 0 0em;
		text-align: center;
		position: relative;
		text-align: center;
		top: 50%;
		left: 50%;
		-webkit-transform: translateY(-50%) translateX(-50%);
		-ms-transform: translateY(-50%) translateX(-50%);
		transform: translateY(-50%) translateX(-50%)
	}
}

.home .content .modules .module.project .content>div .info h1 {
	display: inline;
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	-webkit-font-smoothing: antialiased !important;
	font-weight: 700;
	font-style: normal;
	font-size: 1.125em
}

/*.home .content .modules .module.project .content>div .info h1::after {
	content: ' /';
	margin: 0 .25 0 .25em
}*/
.home .content .modules .module.project .content>div .info h1 span{
	font-weight: normal;
	font-style: italic;
	font-size: 14px;
}
@media screen and (min-width: 768px) and (max-width: 991px) {
	.home .content .modules .module.project .content>div .info h1::after {
		content: ''
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .content .modules .module.project .content>div .info h1::after {
		content: ''
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.home .content .modules .module.project .content>div .info h1::after {
		content: ''
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.home .content .modules .module.project .content>div .info h1 {
		display: block
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.home .content .modules .module.project .content>div .info h1 {
		font-weight: 700;
		font-size: 2.2em;
		max-width: 100%;
		line-height: 1.125em;
		margin: auto auto 0.5em auto;
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		-o-transition: all 0.4s ease;
		transition: all 0.4s ease;
		display: block;
		opacity: 0;
		transform: translate(0, 0px);
		-webkit-transform: translate(0, 0px);
		-moz-transform: translate(0, 0px);
		-ms-transform: translate(0, 0px);
		-o-transform: translate(0, 0px)
	}
}

.home .content .modules .module.project .content>div .info h1.over {
	opacity: 1;
	transform: translate(0, -15px);
	-webkit-transform: translate(0, -15px);
	-moz-transform: translate(0, -15px);
	-ms-transform: translate(0, -15px);
	-o-transform: translate(0, -15px)
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	#swiper0 .swiper-slide:last-child{
		display: none;
	}
	.isy-nav{
		display: none;
	}
	.home .content .modules .module.project .content>div .info span {
		font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
		letter-spacing: 0.2em;
		font-size: .75em;
		text-transform: uppercase;
		margin: 0 0 2em 0;
		font-style: normal;
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		-ms-transition: all 0.4s ease;
		-o-transition: all 0.4s ease;
		transition: all 0.4s ease;
		display: none;
		opacity: 0;
		transform: translate(0, 0px);
		-webkit-transform: translate(0, 0px);
		-moz-transform: translate(0, 0px);
		-ms-transform: translate(0, 0px);
		-o-transform: translate(0, 0px)
	}
}

.home .content .modules .module.project .content>div .info span.over {
	opacity: 1;
	transform: translate(0, -15px);
	-webkit-transform: translate(0, -15px);
	-moz-transform: translate(0, -15px);
	-ms-transform: translate(0, -15px);
	-o-transform: translate(0, -15px)
}

.home .content .modules .module.project .content>div .viewcase {
	float: right;
	margin: 0.2em 3.0em 0 0;
	display: inline-block;
	width: auto;
	height: 10px;
	cursor: pointer
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.home .content .modules .module.project .content>div .viewcase {
		float: none;
		position: absolute;
		right: 0;
		bottom: 6px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .content .modules .module.project .content>div .viewcase {
		float: none;
		display: block;
		margin: 1em 0 0 1.70em;
		display: none
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.home .content .modules .module.project .content>div .viewcase {
		float: none;
		display: block;
		margin: 1em 0 0 1.70em;
		display: none
	}
}

.home .content .modules .module.project .content>div .viewcase a {
	text-decoration: none;
	color: #fff
}

.home .content .modules .module.project .content>div .viewcase span {
	margin-right: 0.7em;
	text-decoration: none;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 0.6875em;
	text-transform: uppercase;
	letter-spacing: 0.7px
}

.home .content .modules .module.project .content>div .viewcase .arrow {
	display: inline-block;
	vertical-align: middle;
	top: -.1em;
	width: 14px;
	height: 10px;
	background-image: url("../../assets/shared/view-case.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/view-case.svg");
	-webkit-transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-ms-transform: translate3d(0px, 0px, 0px);
	-o-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease
}

.home .content .modules .module.project .content>div .viewcase:hover .arrow {
	-webkit-transform: translate3d(5px, 0px, 0px);
	-moz-transform: translate3d(5px, 0px, 0px);
	-ms-transform: translate3d(5px, 0px, 0px);
	-o-transform: translate3d(5px, 0px, 0px);
	transform: translate3d(5px, 0px, 0px)
}

.projects .content {
	width: 100%;
	height: auto
}

.projects .content>ul,.projects .content .bg {
	position: absolute;
	display: block !important;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%) !important;
	-moz-transform: translateX(-50%) !important;
	-o-transform: translateX(-50%) !important;
	-ms-transform: translateX(-50%) !important;
	transform: translateX(-50%) !important;
	width: 100%;
	height: 1440px
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content>ul,.projects .content .bg {
		height: 400px
	}
}

.projects .content>ul {
	top: 0px;
	background-color: transparent
}

.projects .content .modules.depth1 {
	z-index: 2;
	background-color: #15181C;
	padding: 225px 10% 0 10%
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth1 {
		padding: 125px 0 0 0
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth1 {
		padding: 40px 0 0 0
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth1 {
		padding: 40px 0 0 0
	}
}

.projects .content .modules.depth1>div {
	max-width: 1334px;
	margin: auto;
	height: auto;
	*zoom: 1
}

.projects .content .modules.depth1>div:before,.projects .content .modules.depth1>div:after {
	display: table;
	clear: both;
	content: "";
	line-height: 0
}

.projects .content .modules.depth1>div .module {
	width: 50%;
	height: auto;
	-webkit-transition: all .6s ease;
	-moz-transition: all .6s ease;
	-ms-transition: all .6s ease;
	-o-transition: all .6s ease;
	transition: all .6s ease
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth1>div .module {
		width: 100%;
		float: none
	}
}

.projects .content .modules.depth1>div .module.hidden {
	opacity: 0;
	-webkit-transform: translate(0, 90px);
	-moz-transform: translate(0, 90px);
	-ms-transform: translate(0, 90px);
	-o-transform: translate(0, 90px);
	transform: translate(0, 90px)
}

.projects .content .modules.depth1>div .module.header {
	background-color: #15181C;
	color: #fff
}

.projects .content .modules.depth1>div .module.header>div {
	position: relative;
	width: 100%;
	height: 100%;
	/*background-image: url("../../assets/projects/bg-header.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/projects/bg-header.svg");
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 83%*/
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth1>div .module.header>div {
		background-position: 40%;
		background-size: 70%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth1>div .module.header>div {
		background-position: 50% 50%;
		background-size: 71%
	}
}

.projects .content .modules.depth1>div .module.header>div>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	text-align: left
}

.projects .content .modules.depth1>div .module.header>div>div h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 2em;
	line-height: 1.25em;
	/*max-width: 80%;*/
	/*margin: auto*/
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth1>div .module.header>div>div h1 {
		font-size: 1.5em;
		line-height: 1.375em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth1>div .module.header>div>div h1 {
		font-size: 1.5em;
		line-height: 1.375em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth1>div .module.header>div>div h1 {
		font-size: 1.2em;
		line-height: 1.25em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth1>div .module.header>div>div h1 {
		font-size: 1.25em;
		max-width: 40%
	}
}

.projects .content .modules.depth1>div .module.header>div>div span {
	display: block;
	margin-top: 2em;
	color: #fff
}

.projects .content .modules.depth1>div .module.header>div>div span::before {
	content: '';
	display: inline-block;
	width: 2em;
	margin-right: .75em;
	margin-bottom: .25em;
	border-bottom: solid 1px #939EA4;
	opacity: .5
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth1>div .module.header>div>div span {
		font-size: 0.85em;
		margin: 2em 0 0 0
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth1>div .module.header>div>div span {
		font-size: 0.85em;
		margin: 2em 0 0 5em
	}
}

.projects .content .modules.depth1>div .module.project>a {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	color: cyan;
	display: block;
	text-decoration: none;
	background-color: #15181C
}

.projects .content .modules.depth1>div .module.project>a .img {
	position: absolute;
	width: 100%;
	top: 0;
	height: 100%;
	overflow: hidden;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: 50% 50%;
	width: 100%;
	opacity: 1
}

.projects .content .modules.depth1>div .module.project>a .img.over {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-ms-transform: scale(1.05);
	-o-transform: scale(1.05);
	transform: scale(1.05);
	opacity: 0.25
}

.projects .content .modules.depth1>div .module.project>a .background {
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #15181C;
	opacity: .75;
	-webkit-transform: scale(1.15);
	-moz-transform: scale(1.05);
	-ms-transform: scale(1.05);
	-o-transform: scale(1.05);
	transform: scale(1.05)
}

.projects .content .modules.depth1>div .module.project>a .info {
	display: none;
	position: relative;
	width: 100%;
	height: 100%
}

.projects .content .modules.depth1>div .module.project>a .info .text {
	position: absolute;
	color: #fff;
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default;
	cursor: pointer
}

.projects .content .modules.depth1>div .module.project>a .info .text h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 3em;
	max-width: 75%;
	margin: auto;
	opacity: 0;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth1>div .module.project>a .info .text h1 {
		font-size: 2.2em
	}
}

.projects .content .modules.depth1>div .module.project>a .info .text h1.over {
	opacity: 1;
	-webkit-transform: translate(0, -15px);
	-moz-transform: translate(0, -15px);
	-ms-transition: all .6s ease;
	-o-transform: translate(0, -15px);
	transform: translate(0, -15px)
}

.projects .content .modules.depth1>div .module.project>a .info .text p {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	letter-spacing: 0.2em;
	font-size: .75em;
	text-transform: uppercase;
	margin: 0 0 2em 0;
	opacity: 0;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	-moz-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0)
}

.projects .content .modules.depth1>div .module.project>a .info .text p.over {
	opacity: 1;
	transform: translate(0, -15px);
	-webkit-transform: translate(0, -15px);
	-moz-transform: translate(0, -15px);
	-ms-transform: translate(0, -15px);
	-o-transform: translate(0, -15px)
}

.projects .content .modules.depth1>div .module:nth-child(odd) {
	float: left
}

.projects .content .modules.depth1>div .module:nth-child(even) {
	float: right
}

.projects .content .modules.depth2 {
	background: #fff
}

.projects .content .modules.depth2 .module {
	text-align: center
}

.projects .content .modules.depth2 .module>div.hidden {
	opacity: 0;
	-webkit-transform: translate(0, 90px);
	-ms-transform: translate(0, 90px);
	transform: translate(0, 90px);
	-webkit-transition: opacity .6s .1s, -webkit-transform .6s ease;
	transition: opacity 0.6s 0.1s,transform 0.6s ease
}

.projects .content .modules.depth2 .module>div.animated {
	-webkit-transition: all 0.6s ease;
	-moz-transition: all 0.6s ease;
	-ms-transition: all 0.6s ease;
	-o-transition: all 0.6s ease;
	transition: all 0.6s ease
}

.projects .content .modules.depth2 .module.header {
	position: relative;
	color: #fff;
	background-color: #15181C
}

.projects .content .modules.depth2 .module.header>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}

.projects .content .modules.depth2 .module.header>div h1 {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	letter-spacing: 0.2em;
	font-size: .75em;
	text-transform: uppercase;
	margin: 0 0 .5em 0
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.header>div h1 {
		font-size: 0.685em;
		line-height: 1.125em
	}
}

.projects .content .modules.depth2 .module.header>div h2 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-size: 4em;
	font-weight: 700;
	text-transform: uppercase
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.header>div h2 {
		font-size: 2em;
		line-height: 1.125em
	}
}

.projects .content .modules.depth2 .module.intro {
	background-color: #fff;
	padding: 10.25em 0
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro {
		padding: 5.25em 0
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro {
		padding: 3.5em 0
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro {
		padding: 3.5em 0
	}
}

.projects .content .modules.depth2 .module.intro>div {
	max-width: 1100px;
	margin: auto;
	*zoom: 1
}

.projects .content .modules.depth2 .module.intro>div:before,.projects .content .modules.depth2 .module.intro>div:after {
	display: table;
	clear: both;
	content: "";
	line-height: 0
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.intro>div {
		max-width: 900px;
		margin: 0 10%
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div {
		max-width: 900px;
		margin: 0 8%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div {
		max-width: 900px;
		margin: 0 8%
	}
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) {
	float: right;
	width: 75%;
	text-align: left
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) {
		float: none;
		margin: 0 auto
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) {
		float: none;
		margin: 0 auto
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) {
		float: none;
		margin: 0 auto
	}
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) span {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: .875em;
	line-height: 1em;
	letter-spacing: 0em;
	color: #939EA4
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) span::after {
	content: '';
	display: inline-block;
	width: 2.75em;
	margin-left: .765em;
	margin-bottom: .365em;
	border-bottom: solid 1px #939EA4;
	opacity: .5
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) span {
		font-size: 0.685em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) span {
		font-size: 0.685em
	}
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 3em;
	line-height: 1.1em;
	letter-spacing: 0em;
	color: #24262B;
	margin: .45em 0 .55em 0;
	max-width: 75%
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) h1 {
		font-size: 2em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) h1 {
		font-size: 2em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em;
		max-width: 100%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em;
		max-width: 100%
	}
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) p {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: 1.125em;
	letter-spacing: 0em;
	line-height: 1.45em;
	color: #24262B
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.3em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.3em
	}
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) a {
	color: #24262B;
	text-decoration: underline
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) {
	float: left;
	width: 25%;
	padding: 3.85em 0 0 0;
	text-align: left
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) {
		padding: 2.75em 0 0 0
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) {
		float: none;
		width: 75%;
		padding: 0;
		margin: 0 auto
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) {
		float: none;
		width: 75%;
		padding: 0;
		margin: 0 auto
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) {
		float: none;
		width: 75%;
		padding: 0;
		margin: 0 auto
	}
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) h1 {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: .6875em;
	text-transform: uppercase;
	color: #939EA4
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) h1 {
		display: inline;
		font-size: 0.75em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) h1 {
		display: inline;
		font-size: 0.685em
	}
}

.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) p {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: .875em;
	letter-spacing: 0em;
	line-height: 1.25em;
	color: #24262B;
	text-transform: uppercase;
	max-width: 75%;
	margin: .825em 0 2.475em 0
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) p {
		display: inline;
		font-size: 0.75em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) p {
		display: inline;
		font-size: 0.685em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1)>div:nth-child(1) {
		margin-bottom: 0.5em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1)>div:nth-child(1) {
		margin-bottom: 0.5em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1)>div:nth-child(2) {
		margin-bottom: 4em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1)>div:nth-child(2) {
		margin-bottom: 3em
	}
}

.projects .content .modules.depth2 .module.image-full-width img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	display: block
}

.projects .content .modules.depth2 .module.image-max-width {
	background-color: #15181C
}

.projects .content .modules.depth2 .module.image-max-width>div {
	max-width: 1334px;
	margin: auto
}

@media screen and (min-width: 1400px) and (max-width: 1439px) {
	.projects .content .modules.depth2 .module.image-max-width>div {
		margin: 0 10%
	}
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.image-max-width>div {
		margin: 0 10%
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.image-max-width>div {
		margin: 0 8.57%
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.image-max-width>div {
		margin: 0 6%
	}
}

.projects .content .modules.depth2 .module.image-max-width>div img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	display: block
}

.projects .content .modules.depth2 .module.optional-full-width {
	background-color: #fff;
	padding: 5.25em 0
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.optional-full-width {
		padding: 3.60em 0
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.optional-full-width {
		padding: 3.125em 0
	}
}

.projects .content .modules.depth2 .module.optional-full-width>div {
	max-width: 1334px;
	margin: auto
}

.projects .content .modules.depth2 .module.optional-full-width>div>div {
	max-width: 75%;
	margin: auto;
	padding: 0 2.25em 0 2.25em
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div {
		padding: 0 0;
		max-width: 80%
	}
}

.projects .content .modules.depth2 .module.optional-full-width>div>div span {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: .85em;
	letter-spacing: 0em;
	color: #939EA4
}

.projects .content .modules.depth2 .module.optional-full-width>div>div span::after {
	content: '';
	display: block;
	width: 3em;
	margin: auto;
	margin-top: .7em;
	border-bottom: solid 1px #939EA4;
	opacity: .5
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div span {
		font-size: 0.685em
	}
}

.projects .content .modules.depth2 .module.optional-full-width>div>div h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 2.5em;
	line-height: 1.3em;
	letter-spacing: 0em;
	color: #939EA4;
	margin: .8em 0 .6em 0
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div h1 {
		font-size: 2em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

.projects .content .modules.depth2 .module.optional-full-width>div>div p {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: 1em;
	letter-spacing: 0em;
	line-height: 1.625em;
	color: #24262B
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.optional-full-width>div>div p {
		font-size: 0.875em;
		line-height: 1.3em
	}
}

.projects .content .modules.depth2 .module.optional-full-width.dark h1,.projects .content .modules.depth2 .module.optional-full-width.dark p {
	color: #24262B
}

.projects .content .modules.depth2 .module.optional-full-width.light h1,.projects .content .modules.depth2 .module.optional-full-width.light p {
	color: #fff
}

.projects .content .modules.depth2 .module.images>div {
	max-width: 1334px;
	margin: auto
}

@media screen and (min-width: 1400px) and (max-width: 1439px) {
	.projects .content .modules.depth2 .module.images>div {
		margin: 0 10%
	}
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.images>div {
		margin: 0 10%
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.images>div {
		margin: 0 8.57%
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.images>div {
		margin: 0 6%
	}
}

.projects .content .modules.depth2 .module.images>div img {
	height: auto;
	width: 100%;
	display: block
}

.projects .content .modules.depth2 .module.content-image-left {
	background-color: #15181C;
	color: #15181C;
	padding: 3em 0 3em 0
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.content-image-left {
		padding: 0
	}
}

.projects .content .modules.depth2 .module.content-image-left>div {
	max-width: 1334px;
	margin: auto;
	display: table
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(1) {
	width: 58%;
	display: table-cell;
	vertical-align: middle
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(1)>div {
	margin-left: -50%
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(1)>div img {
	width: 100%;
	height: auto
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2) {
	width: 42%;
	display: table-cell;
	vertical-align: middle
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div {
	text-align: left;
	max-width: 80%;
	margin-left: 4.175em
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div span {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: .85em;
	letter-spacing: 0em;
	color: #939EA4
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div span::after {
	content: '';
	display: inline-block;
	width: 3em;
	margin-left: .75em;
	margin-bottom: .25em;
	border-bottom: solid 1px #939EA4;
	opacity: .5
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 2.5em;
	line-height: 1.3em;
	letter-spacing: 0em;
	margin: .8em 0 .6em 0
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div p {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: 1em;
	line-height: 1.625em;
	letter-spacing: 0em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div p {
		font-size: 1em;
		line-height: 1.5em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div p {
		font-size: 1em;
		line-height: 1.5em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.content-image-left>div>div:nth-child(2)>div p {
		font-size: 0.875em;
		line-height: 1.3em
	}
}

.projects .content .modules.depth2 .module.content-image-left.dark h1,.projects .content .modules.depth2 .module.content-image-left.dark p {
	color: #24262B
}

.projects .content .modules.depth2 .module.content-image-left.light h1,.projects .content .modules.depth2 .module.content-image-left.light p {
	color: #fff
}

.projects .content .modules.depth2 .module.content-image-right {
	background-color: #15181C;
	color: #15181C;
	padding: 3em 0 3em 0
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.content-image-right {
		padding: 0
	}
}

.projects .content .modules.depth2 .module.content-image-right>div {
	max-width: 1334px;
	margin: auto;
	display: table
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1) {
	width: 42%;
	display: table-cell;
	vertical-align: middle
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div {
	text-align: left;
	max-width: 80%
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div span {
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: .85em;
	letter-spacing: 0em;
	color: #939EA4
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div span::after {
	content: '';
	display: inline-block;
	width: 3em;
	margin-left: .75em;
	margin-bottom: .25em;
	border-bottom: solid 1px #939EA4;
	opacity: .5
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 2.5em;
	line-height: 1.3em;
	letter-spacing: 0em;
	margin: .8em 0 .6em 0
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div p {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: 1em;
	line-height: 1.625em;
	letter-spacing: 0em
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div p {
		font-size: 1em;
		line-height: 1.5em
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(1)>div p {
		font-size: 0.875em;
		line-height: 1.3em
	}
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(2) {
	width: 58%;
	display: table-cell;
	vertical-align: middle
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(2)>div {
	margin-right: -50%
}

.projects .content .modules.depth2 .module.content-image-right>div>div:nth-child(2)>div img {
	width: 100%;
	height: auto;
	display: block
}

.projects .content .modules.depth2 .module.content-image-right.dark h1,.projects .content .modules.depth2 .module.content-image-right.dark p {
	color: #24262B
}

.projects .content .modules.depth2 .module.content-image-right.light h1,.projects .content .modules.depth2 .module.content-image-right.light p {
	color: #fff
}

.projects .content .modules.depth2 .module.video-animation {
	background-color: #15181C;
	margin: 0 auto
}

.projects .content .modules.depth2 .module.video-animation>div {
	max-width: 1112px;
	margin: auto;
	padding: 0em 0 0em 0
}

@media screen and (min-width: 1400px) and (max-width: 1439px) {
	.projects .content .modules.depth2 .module.video-animation>div {
		margin: 0 10%
	}
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.video-animation>div {
		margin: 0 10%
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.video-animation>div {
		margin: 0 8.57%
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.video-animation>div {
		margin: 0 8.57%
	}
}

.projects .content .modules.depth2 .module.video-animation>div video {
	height: auto;
	width: 100%;
	vertical-align: middle;
	display: block
}

.projects .content .modules.depth2 .module.video-player {
	background-color: #15181C
}

.projects .content .modules.depth2 .module.video-player>div {
	max-width: 1112px;
	width: auto;
	height: 800px;
	margin: auto;
	padding: 3em 0 3em 0
}

@media screen and (min-width: 1400px) and (max-width: 1439px) {
	.projects .content .modules.depth2 .module.video-player>div {
		margin: 0 10%
	}
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.projects .content .modules.depth2 .module.video-player>div {
		margin: 0 10%;
		height: 600px
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.projects .content .modules.depth2 .module.video-player>div {
		margin: 0 8.57%
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.video-player>div {
		margin: 0 8%;
		height: 300px
	}
}

.projects .content .modules.depth2 .module.video-player>div iframe {
	width: 100%;
	height: 100%
}

.projects .content .modules.depth2 .module.dark span {
	color: rgba(0,0,0,0.6) !important
}

.projects .content .modules.depth2 .module.dark span:after {
	border-color: rgba(0,0,0,0.6) !important
}

.projects .content .modules.depth2 .module.light span {
	color: rgba(255,255,255,0.6) !important
}

.projects .content .modules.depth2 .module.light span:after {
	border-color: rgba(255,255,255,0.6) !important
}

.about .content {
	width: 100%;
	height: 100%;
	overflow: hidden
}

.about .content .modules .module .content {
	background-color: #15181C
}

.about .content .modules .module .content>div {
	color: #fff;
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}

.about .content .modules .module .custom>a {
	position: absolute;
	bottom: 37px;
	left: auto;
	right: 37px;
	margin-left: 0;
	width: 51px;
	height: 51px;
	text-align: center;
	z-index: 9;
	background-image: url("../../assets/shared/down.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/down.svg");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	text-indent: -9999px;
	opacity: 1
}

.about .content .modules .module .custom>a:hover {
	opacity: 0.3
}

.about .content .modules .module.header .custom>a {
	bottom: 37px;
	left: 50%;
	margin-left: -26px
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module .custom>a {
		bottom: 7px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module .custom>a {
		bottom: 7px;
		right: 30px;
		margin: 0;
		left: auto
	}

	.about .content .modules .module.header .custom>a {
		bottom: 7px
	}
}

.about .content .modules .module.header .content {
	background-color: transparent
}

.about .content .modules .module.header .content>div {
	top: 47.5%;
	opacity: 0;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	z-index: 1
}

.about .content .modules .module.header .content>div h1 {
	-webkit-transform: translate3d(0px, 60px, 0px);
	-moz-transform: translate3d(0px, 60px, 0px);
	-ms-transform: translate3d(0px, 60px, 0px);
	-o-transform: translate3d(0px, 60px, 0px);
	transform: translate3d(0px, 60px, 0px);
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out
}

.about .content .modules .module.header .content>div.visible {
	opacity: 1
}

.about .content .modules .module.header .content>div.visible h1 {
	-webkit-transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-ms-transform: translate3d(0px, 0px, 0px);
	-o-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px)
}

.about .content .modules .module.header .content>div h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 55px;
	line-height: 76px;
	letter-spacing: 0em;
	width: 1000px;
	margin: auto;
	text-align: left
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.header .content>div h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.header .content>div h1 {
		font-size: 2.5em;
		line-height: 1.2em;
		width: 370px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.header .content>div h1 {
		font-size: 1.85em;
		line-height: 1.125em;
		width: 80%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.header .content>div h1 {
		font-size: 2em;
		line-height: 1.125em;
		width: 80%
	}
}

.about .content .modules .module.header .content>div h1 span {
	color: #ef1850;
	font-size: 26px;
	font-weight: normal;
	/*margin-left: 4em*/
}

.about .content .modules .module.header .content>div h1 span::before {
	content: '';
	display: inline-block;
	width: 1.5em;
	margin-right: 1em;
	margin-bottom: .25em;
	border-bottom: solid 1px #ef1850
}
.about .content .modules .module.header .content>div h1 span.about-nx{
	margin-right: 1em;
}
.about .content .modules .module.header .content>div h1 span.about-nx::before {
	display: none;

}

.about .content .modules .module.image-content .content>div {
	height: 100%
}

.about .content .modules .module.image-content .content>div>div:nth-child(1) {
	width: 50%;
	height: 100%;
	float: left;
	background: #f01950;
	background-image: -webkit-radial-gradient(2% 96%, #ef1850 0%, #f01950 100%);
	background-image: -o-radial-gradient(2% 96%, #ef1850 0%, #f01950 100%);
	background-image: -moz-radial-gradient(2% 96%, #ef1850 0%, #f01950 100%);
	background-image: -ms-radial-gradient(2% 96%, #ef1850 0%, #f01950 100%)
}
.about .content .modules .module.image-content.about-licheng .content>div>div:nth-child(1) {
	width: 50%;
	height: 100%;
	float: right;
	background: #19cdff;
}
.about .content .modules .module.image-content .content>div>div:nth-child(1)>div {
	position: relative;
	text-align: center;
	top: 50%;
	width: 640px;
	height: 422px;
	background-position: 0 0;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6);
	-moz-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6);
	-ms-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6);
	-o-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6);
	transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6)
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(1)>div {
		left: 50%;
		-webkit-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		-moz-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		-ms-transform: translateY(-50%) translateX(-50% translateZ(0)) scale(0.35);
		-o-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35)
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(1)>div {
		left: 50%;
		-webkit-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		-moz-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		-ms-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		-o-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35)
	}
}

@-webkit-keyframes play {
	from {
		background-position: 0px
	}

	to {
		background-position: -30080px
	}
}

@keyframes play {
	from {
		background-position: 0px
	}

	to {
		background-position: -30080px
	}
}

.about .content .modules .module.image-content .content>div>div:nth-child(1)>div.startAnimation {
	-webkit-animation: play 2s steps(47) forwards;
	-moz-animation: play 2s steps(47) forwards;
	-ms-animation: play 2s steps(47) forwards;
	-o-animation: play 2s steps(47) forwards;
	animation: play 2s steps(47) forwards
}

.about .content .modules .module.image-content .content>div>div:nth-child(2) {
	width: 50%;
	height: 100%;
	float: right
}

.about .content .modules .module.image-content .content>div>div:nth-child(2)>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	text-align: left;
	max-width: 60%;
	opacity: 0;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	-webkit-transform: translateY(-35%) translateX(-50%);
	-moz-transform: translateY(-35%) translateX(-50%);
	-ms-transform: translateY(-35%) translateX(-50%);
	-o-transform: translateY(-35%) translateX(-50%);
	transform: translateY(-35%) translateX(-50%)
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div {
		max-width: 50%
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div {
		max-width: 80%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div {
		max-width: 80%
	}
}

.about .content .modules .module.image-content .content>div>div:nth-child(2)>div.visible {
	opacity: 1;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-moz-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	-o-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div {
		-webkit-transform: translateY(0%) translateX(-50%);
		-moz-transform: translateY(0%) translateX(-50%);
		-ms-transform: translateY(0%) translateX(-50%);
		-o-transform: translateY(0%) translateX(-50%);
		transform: translateY(0%) translateX(-50%)
	}
}

.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(1) {
	color: #f01850;
	margin: 0 0 1em 0;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-size: .875em
}

.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(1)::after {
	content: '';
	display: inline-block;
	width: 2em;
	margin-left: .5em;
	margin-bottom: .25em;
	border-bottom: solid 1px #f01850
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(1) {
		font-size: 0.675em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(1) {
		font-size: 0.685em
	}
}

.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
	
	color: white;
	font-weight: bold;
	font-size: 3em;
	margin: 0 0 0.79em 0;
	line-height: 1.15em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 2em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) p {
	
	color: white;
	font-size: 1.125em;
	line-height: 1.5em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 1em;
		line-height: 1.5em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

.about .content .modules .module.content-image .content>div {
	height: 100%
}

.about .content .modules .module.content-image .content>div>div:nth-child(2) {
	width: 50%;
	height: 100%;
	float: right
}

.about .content .modules .module.content-image .content>div>div:nth-child(2)>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	text-align: left;
	max-width: 60%;
	opacity: 0;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	-webkit-transform: translateY(-35%) translateX(-50%);
	-moz-transform: translateY(-35%) translateX(-50%);
	-ms-transform: translateY(-35%) translateX(-50%);
	-o-transform: translateY(-35%) translateX(-50%);
	transform: translateY(-35%) translateX(-50%)
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div {
		max-width: 50%
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div {
		max-width: 80%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div {
		max-width: 80%
	}
}

.about .content .modules .module.content-image .content>div>div:nth-child(2)>div.visible {
	opacity: 1;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-moz-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	-o-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}

.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(1) {
	color: #ff2e47;
	margin: 0 0 1em 0;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-size: .875em
}

.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(1)::after {
	content: '';
	display: inline-block;
	width: 2em;
	margin-left: .5em;
	margin-bottom: .25em;
	border-bottom: solid 1px #ff2e47
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(1) {
		font-size: 0.675em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(1) {
		font-size: 0.685em
	}
}

.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"serif"
	color: white;
	font-weight: bold;
	font-size: 3em;
	margin: 0 0 0.79em 0;
	line-height: 1.15em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 2em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) p {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"serif"
	color: white;
	font-size: 1.125em;
	line-height: 1.5em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 1em;
		line-height: 1.5em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

.about .content .modules .module.content-image .content>div>div:nth-child(1) {
	width: 50%;
	height: 100%;
	float: right;
	background: #19cdff;
	background: -webkit-radial-gradient(29% 106%, #19cdff 8%, #00aeff 100%);
	background: -o-radial-gradient(29% 106%, #19cdff 8%, #00aeff 100%);
	background: -moz-radial-gradient(29% 106%, #19cdff 8%, #00aeff 100%);
	background: -ms-radial-gradient(29% 106%, #19cdff 8%, #00aeff 100%)
}

.about .content .modules .module.content-image .content>div>div:nth-child(1)>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	width: 640px;
	max-width: 640px;
	height: 640px;
	max-height: 640px;
	background-position: 0 0;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6);
	-moz-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6);
	-ms-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6);
	transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.6)
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(1)>div {
		left: 50%;
		-webkit-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		-moz-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		-ms-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35);
		transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.35)
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.content-image .content>div>div:nth-child(1)>div {
		left: 50%;
		-webkit-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.3);
		-moz-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.3);
		-ms-transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.3);
		transform: translateY(-50%) translateX(-50%) translateZ(0) scale(0.3)
	}
}

@-webkit-keyframes play2 {
	from {
		background-position: 0px
	}

	to {
		background-position: -28800px
	}
}

@keyframes play2 {
	from {
		background-position: 0px
	}

	to {
		background-position: -28800px
	}
}

.about .content .modules .module.content-image .content>div>div:nth-child(1)>div.startAnimation {
	-webkit-animation: play2 2s steps(45) forwards;
	-moz-animation: play2 2s steps(45) forwards;
	-ms-animation: play2 2s steps(45) forwards;
	-o-animation: play2 2s steps(45) forwards;
	animation: play2 2s steps(45) forwards
}

.about .content .modules .module.mixed2 .content>div {
	height: 100%
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(1) {
	width: 35%;
	height: 100%;
	float: left;
	background-image: url("../../assets/about/about-3_landscape.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(1) {
		background-image: url("../../assets/about/about-3_portrait.jpg")
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(1) {
		background-image: url("../../assets/about/about-3_portrait.jpg")
	}
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(2) {
	width: 40%;
	height: 100%;
	float: left;
	background-color: #15181C
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	text-align: left;
	max-width: 60%;
	opacity: 0;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	-webkit-transform: translateY(-35%) translateX(-50%);
	-moz-transform: translateY(-35%) translateX(-50%);
	-ms-transform: translateY(-35%) translateX(-50%);
	-o-transform: translateY(-35%) translateX(-50%);
	transform: translateY(-35%) translateX(-50%)
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div {
		max-width: 50%
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div {
		max-width: 80%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div {
		max-width: 80%
	}
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div.visible {
	opacity: 1;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-moz-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	-o-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(1) {
	color: #18cdff;
	margin: 0 0 1em 0;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-size: .875em
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(1)::after {
	content: '';
	display: inline-block;
	width: 2em;
	margin-left: .5em;
	margin-bottom: .25em;
	border-bottom: solid 1px #18cdff
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(1) {
		font-size: 0.685em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(1) {
		font-size: 0.685em
	}
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
	color: white;
	font-weight: bold;
	font-size: 3em;
	margin: 0 0 0.79em 0;
	line-height: 1.15em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 2em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) p {
	color: white;
	font-size: 1.125em;
	line-height: 1.5em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 1em;
		line-height: 1.5em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(2)>div>div:nth-child(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(3) {
	width: 25%;
	height: 100%;
	float: right;
	background-image: url("../../assets/about/about-4_landscape.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(3) {
		background-image: url("../../assets/about/about-4_portrait.jpg")
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.mixed2 .content>div>div:nth-child(3) {
		background-image: url("../../assets/about/about-4_portrait.jpg")
	}
}

.about .content .modules .module.mixed2 .content>div>div:nth-child(4) {
	width: 5%;
	height: 100%;
	float: left;
	background-color: #15181C
}

.about .content .modules .module.plastic .content>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	color: #fff
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	
}

.about .content .modules .module.plastic .content>div>div {
	opacity: 0;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out
}

.about .content .modules .module.plastic .content>div>div.visible {
	opacity: 1
}

.about .content .modules .module.plastic .content>div>div>div:nth-of-type(1) {
	color: #8478A9;
	margin: 0 0 1em 0;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-size: .875em
}

.about .content .modules .module.plastic .content>div>div>div:nth-of-type(1)::after {
	content: '';
	display: block;
	width: 2em;
	margin: auto;
	margin-top: .5em;
	border-bottom: solid 1px #8478A9
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(1) {
		font-size: 0.685em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(1) {
		font-size: 0.685em
	}
}

.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) {
	width: 100%;
	max-width: 820px;
	position: relative;
	text-align: center;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%)
}

.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) h1 {
	
	color: white;
	font-weight: bold;
	font-size: 3em;
	margin: 0 0 0.59em 0;
	line-height: 1.15em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) h1 {
		font-size: 2.5em;
		line-height: 1.2em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) h1 {
		font-size: 2em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) h1 {
		font-size: 1.5em;
		line-height: 1.125em
	}
}

.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) p {
	
	color: white;
	font-size: 1.125em;
	line-height: 1.5em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) p {
		font-size: 1em;
		line-height: 1.5em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) p {
		font-size: 0.875em;
		line-height: 1.4em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) p {
		font-size: 0.875em;
		line-height: 1.3em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) p {
		font-size: 0.875em;
		line-height: 1.3em
	}
}

.about .content .modules .module.plastic .content>div>div>div:nth-of-type(2) h2 {
	font-weight: bold;
	font-size: .875em;
	text-transform: uppercase;
	color: #5a5d64;
	margin: 3em 0 1em 0;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif"
}

.about .content .modules .module.plastic .content>div>div>div:nth-of-type(3) object,.about .content .modules .module.plastic .content>div>div>div:nth-of-type(4) img {
	margin: 0 1% !important;
	max-width: 22%
}

.contact .content {
	width: 100%;
	height: 100%
}

.contact .content .modules {
	width: 100%;
	height: 100%;
	background-color: #15181C
}

.contact .content .modules .scene,.contact .content .modules .bg {
	position: absolute;
	display: block !important;
	top: 0;
	left: 0;
	margin: 0 !important;
	width: 100%;
	height: 100%
}

.contact .content .modules .scene {
	top: 0px;
	background-color: #0f0f13 !important
}

.contact .content .modules .module {
	position: relative
}

.contact .content .modules .module.info {
	float: right;
	width: 50%;
	height: 100%;
	background-color: rgba(21,24,28,0.79)
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.contact .content .modules .module.info {
		float: none;
		width: 100%
	}
}

.contact .content .modules .module.info>div {
	position: absolute;
	left: 15%;
	top: 50%;
	max-width: 65%
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.contact .content .modules .module.info>div {
		max-width: 35%
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div {
		padding-top: 80px;
		position: static;
		left: auto;
		top: auto;
		max-width: 100%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div {
		max-width: 80%;
		left: 2em;
		padding-top: 20px
	}
}

.contact .content .modules .module.info>div>div:nth-child(1) {
	margin-bottom: 15%
}

@media screen and (max-height: 790px) {
	.contact .content .modules .module.info>div>div:nth-child(1) {
		margin-bottom: 45px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div>div:nth-child(1) {
		float: left;
		width: 45%;
		margin-left: 30px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div>div:nth-child(1) {
		margin-bottom: 35px
	}
}

.contact .content .modules .module.info>div>div:nth-child(1) p {
	margin-bottom: 1em;
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 1.75em;
	line-height: 1.3em;
	letter-spacing: 0em;
	color: #5D6572
}

@media screen and (max-height: 790px) {
	.contact .content .modules .module.info>div>div:nth-child(1) p {
		font-size: 1.125em
	}
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.contact .content .modules .module.info>div>div:nth-child(1) p {
		font-size: 1.125em
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.contact .content .modules .module.info>div>div:nth-child(1) p {
		font-size: 1.125em
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div>div:nth-child(1) p {
		font-size: 1.125em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div>div:nth-child(1) p {
		font-size: 1.125em
	}
}

.contact .content .modules .module.info>div>div:nth-child(1) p a {
	color: #fff;
	display: block;
	text-decoration: none
}

.contact .content .modules .module.info>div>div:nth-child(1) p:first-child {
	color: #fff
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div>div:nth-child(2) {
		float: right;
		width: 40%
	}
}

.contact .content .modules .module.info>div>div:nth-child(2) h1 {
	color: #fff;
	text-transform: uppercase;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: .75em;
	letter-spacing: .15em;
	margin-bottom: 1.25em
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div>div:nth-child(2) h1 {
		font-size: 0.6em;
		margin-bottom: 1em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div>div:nth-child(2) h1 {
		font-size: 0.7em;
		margin-bottom: 1em
	}
}

.contact .content .modules .module.info>div>div:nth-child(2) p {
	margin-bottom: 3em;
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 700;
	font-size: 1.125em;
	line-height: 1.3em;
	letter-spacing: 0em;
	color: #5D6572
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div>div:nth-child(2) p {
		font-size: 1.125em;
		margin-bottom: 35px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div>div:nth-child(2) p {
		font-size: 1.125em;
		margin-bottom: 35px
	}
}

.contact .content .modules .module.info>div>div:nth-child(2) a[href^=tel] {
	color: inherit;
	text-decoration: none
}

.contact .content .modules .module.info>div .social {
	margin-top: 1.5em
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div .social {
		margin-top: 1em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div .social {
		margin-top: 1em
	}
}

.contact .content .modules .module.info>div .social a {
	color: #fff;
	display: inline-block;
	text-decoration: none;
	opacity: 1;
	-webkit-transition: all 0.15s ease;
	-moz-transition: all 0.15s ease;
	-o-transition: all 0.15s ease;
	transition: all 0.15s ease
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.contact .content .modules .module.info>div .social a.twitter {
		margin-left: 0
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div .social a.twitter {
		margin-left: 0
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div .social a.twitter {
		margin-left: 0
	}
}

.contact .content .modules .module.info>div .social a.out {
	opacity: 0.5
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.contact .content .modules .module.info>div .social a {
		width: 32px;
		height: 32px;
		background-size: cover;
		margin: 0 .2em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.contact .content .modules .module.info>div .social a {
		width: 36px;
		height: 36px;
		background-size: cover;
		margin: 0 .4em
	}
}

.url-not-found .content {
	width: 100%;
	height: 100%;
	padding: 0 0 220px 0
}

.url-not-found .content>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%)
}

.error404 .content {
	width: 100%;
	height: 100%;
	overflow: hidden
}

.error404 .content .modules .module.header .content>div {
	position: relative;
	text-align: center;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-ms-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	top: 47.5%;
	opacity: 0;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out
}

.error404 .content .modules .module.header .content>div h1 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	-webkit-font-smoothing: subpixel-antialiased !important;
	font-weight: 700;
	font-size: 12.5em;
	line-height: 1.1em;
	margin: 0 auto 50px auto;
	letter-spacing: 0em;
	max-width: 75%;
	color: #fff;
	text-rendering: geometricPrecision
}

.error404 .content .modules .module.header .content>div h2 {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	-webkit-font-smoothing: subpixel-antialiased !important;
	font-weight: 700;
	font-size: 2.63em;
	line-height: 1.1em;
	letter-spacing: 0em;
	margin: 0 auto 50px auto;
	max-width: 75%;
	color: #fff;
	text-rendering: geometricPrecision
}

.error404 .content .modules .module.header .content>div p {
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif";
	-webkit-font-smoothing: subpixel-antialiased !important;
	font-weight: 700;
	font-size: 1.6em;
	line-height: 1.3em;
	letter-spacing: 0em;
	margin: 0 auto 0 auto;
	max-width: 75%;
	color: #fff;
	text-rendering: geometricPrecision
}

.error404 .content .modules .module.header .content>div a {
	color: #fff;
	text-decoration: underline
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.error404 .content .modules .module.header .content>div br {
		display: none
	}
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.error404 .content .modules .module.header .content>div br {
		display: none
	}
}

.error404 .content .modules .module.header .content>div h1,.error404 .content .modules .module.header .content>div h2,.error404 .content .modules .module.header .content>div p {
	-webkit-transform: translate3d(0px, 60px, 0px);
	-moz-transform: translate3d(0px, 60px, 0px);
	-ms-transform: translate3d(0px, 60px, 0px);
	-o-transform: translate3d(0px, 60px, 0px);
	transform: translate3d(0px, 60px, 0px);
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out
}

.error404 .content .modules .module.header .content>div.visible {
	opacity: 1
}

.error404 .content .modules .module.header .content>div.visible h1,.error404 .content .modules .module.header .content>div.visible h2,.error404 .content .modules .module.header .content>div.visible p {
	-webkit-transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-ms-transform: translate3d(0px, 0px, 0px);
	-o-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px)
}

.navigation {
	overflow: hidden;
	height: 15em;
	text-align: center;
	margin-bottom: 0;
	*zoom: 1
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.navigation {
		height: 13em;
		margin-bottom: 0
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.navigation {
		height: 182px;
		margin-bottom: 0
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.navigation {
		margin-bottom: 0;
		height: 102px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation {
		margin-bottom: 0;
		height: 102px
	}
}

.navigation:before,.navigation:after {
	display: table;
	clear: both;
	content: "";
	line-height: 0
}

.navigation a {
	text-decoration: none;
	color: #fff;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default
}

.navigation a:hover {
	background-color: #101215
}

.navigation .prev {
	cursor: pointer;
	height: 100%;
	background-color: #1e1e22;
	text-transform: uppercase;
	display: block;
	float: left;
	width: 37.5%;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: .75em;
	letter-spacing: .15em
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.navigation .prev {
		font-size: 0.6em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation .prev {
		font-size: 0.6em
	}
}

.navigation .prev>div {
	line-height: 240px;
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	-ms-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;
	-webkit-backface-visibility: hidden
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.navigation .prev>div {
		line-height: 210px
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.navigation .prev>div {
		line-height: 182px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.navigation .prev>div {
		line-height: 110px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation .prev>div {
		line-height: 110px
	}
}

.navigation .prev .ico {
	width: 13px;
	height: 9px;
	display: inline-block;
	margin-right: 0.5em;
	background-image: url("../../assets/shared/prev.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/prev.svg");
	-webkit-transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-ms-transform: translate3d(0px, 0px, 0px);
	-o-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease
}

.navigation .prev:hover .ico {
	-webkit-transform: translate3d(-5px, 0px, 0px);
	-moz-transform: translate3d(-5px, 0px, 0px);
	-ms-transform: translate3d(-5px, 0px, 0px);
	-o-transform: translate3d(-5px, 0px, 0px);
	transform: translate3d(-5px, 0px, 0px)
}

.navigation .all {
	cursor: pointer;
	height: 100%;
	height: 240px;
	background-color: #232327;
	text-transform: uppercase;
	display: table;
	float: left;
	width: 25%;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: .75em;
	letter-spacing: .15em
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.navigation .all {
		height: 208px
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.navigation .all {
		height: 182px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.navigation .all {
		height: 102px;
		font-size: 0.6em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation .all {
		height: 102px;
		font-size: 0.6em
	}
}

.navigation .all>div {
	display: table-cell;
	vertical-align: middle;
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	-ms-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;
	-webkit-backface-visibility: hidden
}

.navigation .all .ico {
	width: 22px;
	height: 22px;
	display: block;
	margin: auto;
	margin-bottom: 1.5em;
	background-image: url("../../assets/shared/all.png") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/all.svg");
	background-repeat: none;
	background-position: 0 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out
}

.navigation .all:hover .ico {
	background-position: 0 -12px
}

.navigation .next {
	cursor: pointer;
	height: 100%;
	background-color: #1e1e22;
	text-transform: uppercase;
	display: block;
	float: left;
	width: 37.5%;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: .75em;
	letter-spacing: .15em
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.navigation .next {
		font-size: 0.6em
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation .next {
		font-size: 0.6em
	}
}

.navigation .next>div {
	line-height: 240px
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.navigation .next>div {
		line-height: 210px
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.navigation .next>div {
		line-height: 182px
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.navigation .next>div {
		line-height: 110px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation .next>div {
		line-height: 110px
	}
}

.navigation .next .ico {
	width: 13px;
	height: 9px;
	display: inline-block;
	margin-left: 0.5em;
	background-image: url("../../assets/shared/next.png.html") transparent 0 0 no-repeat;
	background-image: none,url("../../assets/shared/next.svg");
	-webkit-transform: translate3d(0px, 0px, 0px);
	-moz-transform: translate3d(0px, 0px, 0px);
	-ms-transform: translate3d(0px, 0px, 0px);
	-o-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease
}

.navigation .next:hover .ico {
	-webkit-transform: translate3d(5px, 0px, 0px);
	-moz-transform: translate3d(5px, 0px, 0px);
	-ms-transform: translate3d(5px, 0px, 0px);
	-o-transform: translate3d(5px, 0px, 0px);
	transform: translate3d(5px, 0px, 0px)
}

.navigation div.prev,.navigation div.next {
	cursor: default
}

.navigation div.prev>div,.navigation div.next>div {
	opacity: 0.12;
	color: #fff
}

.navigation div.prev:hover .ico,.navigation div.next:hover .ico {
	-webkit-transform: translate3d(0, 0px, 0px);
	-moz-transform: translate3d(0, 0px, 0px);
	-ms-transform: translate3d(0, 0px, 0px);
	-o-transform: translate3d(0, 0px, 0px);
	transform: translate3d(0, 0px, 0px)
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation div.prev span,.navigation div.next span {
		display: none
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.navigation a.prev span,.navigation a.next span {
		display: none
	}
}

@media screen and (min-width: 992px) and (max-width: 1399px) {
	.about .content .modules .module.plastic .content>div>div>div:nth-child(4) img {
		margin: 0 2.5%;
		width: 25%
	}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.about .content .modules .module.image-content .content>div>div:nth-child(1),.about .content .modules .module.content-image .content>div>div:nth-child(1) {
		width: 100%;
		height: 50%;
		float: none
	}

	.about .content .modules .module.image-content .content>div>div:nth-child(2),.about .content .modules .module.content-image .content>div>div:nth-child(2) {
		width: 100%;
		height: 50%;
		float: none
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(1) {
		width: 100%;
		height: 35%
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(2) {
		width: 100%;
		height: 40%
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(3) {
		width: 100%;
		height: 25%
	}

	.about .content .modules .module.plastic .content>div {
		max-width: none
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(1) {
		width: 100%;
		height: 35%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(3) {
		width: 100%;
		height: 25%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(4) {
		width: 100%;
		height: 25%;
		max-width: 90%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(4) object,.about .content .modules .module.plastic .content>div>div>div:nth-child(4) img {
		margin: 0 2.5%;
		width: 25%
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) {
		width: auto;
		float: none
	}

	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) {
		width: auto;
		float: none
	}

	.contact .content .modules .module.image {
		display: none
	}

	.contact .content .modules .module.info {
		width: 100%;
		float: none
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(1) {
		width: 100%;
		height: 25%
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(2) {
		width: 100%;
		height: 60%
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(3) {
		width: 100%;
		height: 15%
	}

	.about .content .modules .module.plastic .content>div {
		max-width: none
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(1) {
		width: 100%;
		height: 35%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(2) {
		width: 100%;
		height: 40%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(3) {
		width: 100%;
		height: 25%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(4) {
		width: 100%;
		height: 25%;
		max-width: 90%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(4) object,.about .content .modules .module.plastic .content>div>div>div:nth-child(4) img {
		margin: 0 1.5%;
		width: 25%
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.projects .content .modules.depth2 .module.intro>div>div:nth-child(1) {
		width: auto;
		float: none
	}

	.projects .content .modules.depth2 .module.intro>div>div:nth-child(2) {
		width: auto;
		float: none
	}

	.contact .content .modules .module.image {
		display: none
	}

	.contact .content .modules .module.info {
		width: 100%;
		float: none
	}

	.about .content .modules .module.image-content .content>div>div:nth-child(1),.about .content .modules .module.content-image .content>div>div:nth-child(1) {
		width: 100%;
		height: 50%;
		float: none
	}

	.about .content .modules .module.image-content .content>div>div:nth-child(2),.about .content .modules .module.content-image .content>div>div:nth-child(2) {
		width: 100%;
		height: 50%;
		float: none
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(1) {
		width: 100%;
		height: 25%
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(2) {
		width: 100%;
		height: 60%
	}

	.about .content .modules .module.mixed2 .content>div>div:nth-child(3) {
		width: 100%;
		height: 15%
	}

	.about .content .modules .module.plastic .content>div {
		max-width: none
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(1) {
		width: 100%;
		height: 35%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(2) {
		width: 100%;
		height: 40%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(3) {
		width: 100%;
		height: 25%;
		max-width: 60%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(4) {
		width: 100%;
		height: 25%;
		max-width: 90%;
		position: relative;
		text-align: center;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	.about .content .modules .module.plastic .content>div>div>div:nth-child(4) object,.about .content .modules .module.plastic .content>div>div>div:nth-child(4) img {
		margin: 0 2.5%;
		width: 25%
	}
}

.footer {
	height: 100%;
	position: fixed;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: #1B1B1E;
	border-left: solid 0px #fff;
	border-right: solid 0px #fff;
	border-bottom: solid 0px #fff
}

@media screen and (min-width: 768px) and (max-width: 991px) {
	.footer {
		border: none
	}
}

.footer .container {
	height: 100%;
	text-align: center;
	position: relative
}

.footer .container>div:nth-child(1) {
	position: absolute;
	width: 100%;
	bottom: 0;
	top: auto;
	height: 160px;
	background: url("../../assets/shared/bg-footer.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%
}
.footer .container div.ifoot-d1{
	bottom: 33px;
}

.footer .container div.ifoot-d2{
	bottom: 0px;
	height: 33px;
	line-height: 33px;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
	.footer .container>div:nth-child(1) {
		height: 220px;
		padding-top: 40px
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.footer .container>div:nth-child(1) {
		/*height: 140px;*/
		padding-top: 40px
	}
}

.footer .container>div:nth-child(1)>a {
	color: #fff;
	text-decoration: none;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 400;
	font-size: 0.9375em;
	letter-spacing: .15em;
	text-transform: uppercase
}

.footer .container>div:nth-child(1)>a:hover {
	color: #69696B
}

.footer .container>div:nth-child(1) .social {
	width: 100%;
	text-align: center;
	height: 100%;
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.footer .container>div:nth-child(1) .social {
		/*margin: 2em 0 0*/
	}
}

.footer .container>div:nth-child(1) .social a {
	margin: 0 .35em;
	text-decoration: none;
	opacity: 1;
	-webkit-transition: all 0.15s ease;
	-moz-transition: all 0.15s ease;
	-o-transition: all 0.15s ease;
	transition: all 0.15s ease;
	/*width: 16px;
	height: 86px;*/
	background-size: cover;
}

.footer .container>div:nth-child(1) .social a.out {
	opacity: 0.3
}

.footer .container>div:nth-child(2) {
	position: absolute;
	width: 100%;
	color: #69696B;
	bottom: 0px;
	letter-spacing: .05em;
	font-family: 'Montserrat',PingFang SC,Microsoft YaHei,"sans-serif";
	font-weight: 100;
	font-size: .625em;
	text-transform: uppercase
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.footer .container>div:nth-child(2) {
		font-size: 0.5em;
		bottom: 0px;
		line-height: 1.3
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.footer .container>div:nth-child(2) {
		    font-size: 0.5em;
		    /* bottom: 25px; */
		    line-height: 20px;
		    padding: 0 5%;
	}
}

.projects .footer {
	z-index: 0
}

.about .footer {
	z-index: 0
}

.contact .footer {
	display: none;
	z-index: 0
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.footer {
		border-left: none;
		border-right: none;
		border-bottom: none;
		z-index: -1 !important
	}
}

@media screen and (min-width: 320px) and (max-width: 479px) {
	.footer {
		border-left: none;
		border-right: none;
		border-bottom: none;
		z-index: 0
	}
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.home .module.project {
		float: left;
		width: 50%
	}

	body>.content {
		overflow: hidden !important
	}
}
.mobile-sty{
	display: none;
}
@media screen and (min-width: 320px) and (max-width: 767px) {
	html {
		overflow: visible !important
	}

	body>.content {
		/*height: auto !important*/
	}

	body.contact {
		background-color: #15181c
	}

	body.contact>.content {
		margin-bottom: 0
	}
	.mobile-sty{
		display: block;
	}
	.mobile-sty .n-2-img {
	    width: 78%;
	    position: absolute;
	    bottom: 15%;
	    left: 20%;
	    height: auto;
	    transform: none;
	    -webkit-transform: none;
    }
    .mobile-sty .gongguan-img {
	    width: 78%;
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    transform: translate(-50%,-50%);
	    -webkit-transform: translate(-50%,-50%);
	    height: auto;
    }
   .mobile-sty .chuangyi-img{
   		width: 78%;
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    transform: translate(-50%,-50%);
	    -webkit-transform: translate(-50%,-50%);
	    height: auto;
   }
   .mobile-sty .i-5-1{
   		width: 78%;
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    transform: translate(-50%,-50%);
	    -webkit-transform: translate(-50%,-50%);
	    height: auto;
   }
   .mobile-sty .i-5-2{
   		width: 80%;
	    position: absolute;
	    top: 51%;
	    left: 50%;
	    transform: translate(-50%,-50%);
	    -webkit-transform: translate(-50%,-50%);
	    height: auto;
	        opacity: 1;
   }
   .mobile-sty .yule-img{
   		    width: 60%;
    position: absolute;
    top: 51%;
    left: 2%;
    transform: translate(0%,-50%);
    -webkit-transform: translate(0%,-50%);
    height: auto;
    opacity: 1;

   }
   .mobile-sty  .i-6-1{
   		    width: 50%;
    position: absolute;
    top: 48%;
    left: 70%;
    /* transform: translate(-50%,-50%); */
    -webkit-transform: translate(-50%,-50%);
    height: auto;
    opacity: 1;

   }
   .i-guanggao .page{
   		background: #e0234d !important;
   }
   .i-gongguan .page{
   	background: #24ca41 !important;
   }
   .i-chuangyi .page{
   	background: #fc4e21 !important;
   }
   .ikeji .page{
   		background: #142444 !important;
   }
   .i-yule .page{
   	background: #2dcefb !important;
   }
   .container-1,.container-2{
   	background: none !important;
   }
   .footer{
   	z-index: 0;
   }
   .ifootbg{
   	background: rgba(0,0,0,0.6) !important;
   }
   .content .modules.scrollview .module{
   	z-index: 10 !important;
   	opacity: 1 !important;
    position: static !important;
   	overflow: hidden;
   }
   .iftext span{
   	 display: block;
   }
   .footer .container div.ifoot-d1{
   	bottom: 43px;
   }
	.iftext{
		display: flex;
		display: -webkit-flex;
		align-items: center;
		-webkit-align-items: center;
		justify-content: center;
		line-height: 20px;
		-webkit-justify-content: center;
		padding: 0px 0px !important;
	}
	.content {
		/*overflow: auto !important*/
	}

	.content .modules.scrollview .module {
		position: static
	}

	.content .modules.scrollview .module .page {
		position: static;
		overflow: auto
	}

	.content .modules.scrollview .module .page .container-1 {
		position: static;
		overflow: auto
	}

	.content .modules.scrollview .module .page .container-1 .container-2 {
		position: static;
		overflow: auto
	}

	.content .modules.scrollview .module .page .container-1 .container-2 .image .custom {
		position: relative
	}

	.content .modules.scrollview .moduleheader .content {
		height: 100%
	}

	.content .modules.scrollview .module.project .page .container-1 .container-2 .image .custom>a {
		/*display: none*/
	}

	.content .modules.scrollview .module.image-content .page .container-1 .container-2 .image .custom>a {
		/*display: none*/
	}

	.content .modules.scrollview .module.image-content .page .container-1 .container-2 .image .custom .content {
		position: static;
		left: auto;
		top: auto
	}

	.content .modules.scrollview .module.image-content .page .container-1 .container-2 .image .custom .content>div {
		left: 0;
		top: 50%;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none
	}

	.content .modules.scrollview .module.image-content .page .container-1 .container-2 .image .custom .content>div>div:nth-child(1) {
		overflow: hidden;
		height: auto
	}

	.content .modules.scrollview .module.image-content .page .container-1 .container-2 .image .custom .content>div>div:nth-child(1)>div {
		left: 50%;
		-webkit-transform: translateY(-50%) translateX(-50%) scale(0.35);
		-moz-transform: translateY(-50%) translateX(-50%) scale(0.35);
		-ms-transform: translateY(-50%) translateX(-50%) scale(0.35);
		transform: translateY(-50%) translateX(-50%) scale(0.35);
		animation: play 2s steps(48) forwards
	}
	@keyframes play {
		from{
			background-position: 0px
		}

		to {
			background-position: -30768px
		}
	}
}

.content .modules.scrollview .module.image-content .page .container-1 .container-2 .image .custom .content>div>div:nth-child(2)>div {
	left: auto;
	top: auto;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	opacity: 1;
	margin: 0 auto;
	padding: 52px 0
}

.content .modules.scrollview .module.content-image .page .container-1 .container-2 .image .custom>a {
	display: none
}

.content .modules.scrollview .module.content-image .page .container-1 .container-2 .image .custom .content {
	position: static;
	left: auto;
	top: auto
}

.content .modules.scrollview .module.content-image .page .container-1 .container-2 .image .custom .content>div {
	left: 0;
	top: 50%;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none
}

.content .modules.scrollview .module.content-image .page .container-1 .container-2 .image .custom .content>div>div:nth-child(1) {
	overflow: hidden;
	height: auto
}

.content .modules.scrollview .module.content-image .page .container-1 .container-2 .image .custom .content>div>div:nth-child(1)>div {
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%) scale(0.35);
	-moz-transform: translateY(-50%) translateX(-50%) scale(0.35);
	-ms-transform: translateY(-50%) translateX(-50%) scale(0.35);
	transform: translateY(-50%) translateX(-50%) scale(0.35);
	animation: play2 2s steps(46) forwards
}

/*@keyframes play2 {
	from {
		background-position: 0px
	}

	to {
		background-position: -28800px
	}
}
@-webkit-keyframes play2 {
	from {
		background-position: 0px
	}

	to {
		background-position: -28800px
	}
}*/
.content .modules.scrollview .module.content-image .page .container-1 .container-2 .image .custom .content>div>div:nth-child(2)>div {
	left: auto;
	top: auto;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	opacity: 1;
	margin: 0 auto;
	padding: 52px 0
}

.content .modules.scrollview .module.mixed .page .container-1 .container-2 .image .custom>a {
	display: none
}

.content .modules.scrollview .module.mixed .page .container-1 .container-2 .image .custom .content {
	position: static;
	left: auto;
	top: auto
}

.content .modules.scrollview .module.mixed .page .container-1 .container-2 .image .custom .content>div {
	left: 0;
	top: 0;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none
}

.content .modules.scrollview .module.mixed .page .container-1 .container-2 .image .custom .content>div>div:nth-child(1) {
	height: 160px
}

.content .modules.scrollview .module.mixed .page .container-1 .container-2 .image .custom .content>div>div:nth-child(2)>div {
	left: auto;
	top: auto;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	opacity: 1;
	margin: 0 auto;
	padding: 52px 0
}

.content .modules.scrollview .module.mixed .page .container-1 .container-2 .image .custom .content>div>div:nth-child(3) {
	height: 160px
}

.content .modules.scrollview .module.plastic .page .container-1 .container-2 .image .custom>a {
	display: none
}

.content .modules.scrollview .module.plastic .page .container-1 .container-2 .image .custom .content {
	position: static;
	left: auto;
	top: auto
}

.content .modules.scrollview .module.plastic .page .container-1 .container-2 .image .custom .content>div {
	left: 0;
	top: 0;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none
}

.content .modules.scrollview .module.plastic .page .container-1 .container-2 .image .custom .content>div>div {
	opacity: 1;
	padding: 52px 0
}

.contact .content .modules .module.info>div {
	position: static;
	top: auto;
	left: auto;
	margin: 0 auto;
	padding-top: 100px;
	padding-bottom: 40px
}

.footer {
	clear: both
}
/*# sourceMappingURL=styles.min.css.map */
.video{
	position:absolute;
	top:0;
	left:0;
	opacity:0.2;
}


/*****样式%*****/
/* .mark_con{ position: absolute; left:50%; top:46%; transform:translateY(-50%) translateX(-50%)!important;-webkit-transform:translateY(-50%) translateX(-50%)!important;-moz-transform:translateY(-50%) translateX(-50%)!important;} */

/* .icon_con_wrap{ margin:0 10%;}
.mark_con .icon_con{  text-align: center; }
.mark_con .icon_con li{ display: inline-block; text-align: center; margin:0px 20px;}
.icon_con .icon{ display: inline-block; width:880px; height:500px;}

.icon_con .icon_1{ width: 540px; background: url(../images/icon_1.png) no-repeat center center; background-size: auto 100%; }
.icon_con .icon_2{ background: url(../images/2.png) no-repeat center center; background-size: auto 90%; }
.icon_con .icon_3{ background: url(../images/3.png) no-repeat center center; background-size: auto 90%; }
.icon_con .icon_4{ width: 700px; background: url(../images/4.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_5{ width: 600px; background: url(../images/6.png) no-repeat center center; background-size: 100% auto; }
 */
 /*.mark_con .icon_con li:hover .icon_1{background: url(../images/icon_1_1.png) no-repeat; background-size: 100% auto; }
.mark_con .icon_con li:hover .icon_2{background: url(../images/icon_2_1.png) no-repeat; background-size: 100% auto; }
.mark_con .icon_con li:hover .icon_3{background: url(../images/icon_3_1.png) no-repeat; background-size: 100% auto; }
.mark_con .icon_con li:hover .icon_4{background: url(../images/icon_4_1.png) no-repeat; background-size: 100% auto; }
.mark_con .icon_con li:hover .icon_5{background: url(../images/icon_5_1.png) no-repeat; background-size: 100% auto; }
*/
.mark_con{ position: absolute; left:0px; top:0px; }
.icon_con_wrap{height: 100%}
.swiper-container{
	height: 100%;
}
.iguanggao-gif{
	text-align: center;
	height: 100%;
	width: 100%;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	justify-content: center;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	align-items: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
}
.iguanggao-gif img{
	max-height: 40%;
	max-width: 70%;
}
.swiper-slide{
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	justify-content: center;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	align-items: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
}
.mark_con .icon_con{  text-align: center; }
.mark_con .icon_con li{ display: inline-block; text-align: center; margin:0px 20px;}
.icon_con .icon{ display: inline-block; width:880px; height:500px;}

.icon_con .icon_1{ width: 540px; background: url(../images/icon_1.png) no-repeat center center; background-size: auto 100%; }
.icon_con .icon_2{ background: url(../images/2.png) no-repeat center center; background-size: auto 90%; }
.icon_con .icon_3{ background: url(../images/3.png) no-repeat center center; background-size: auto 90%; }
.icon_con .icon_4{ width: 700px; background: url(../images/4.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_5{ width: 600px; background: url(../images/6.png) no-repeat center center; background-size: 100% auto; }




.icon_con .icon_1_1{ width:880px; background: url(../images/1-1.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_1_2{ width:880px; background: url(../images/1-2.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_1_3{ width:880px; background: url(../images/1-3.png) no-repeat center center; background-size: 100% auto; }

.icon_con .icon_2_1{ width:880px; background: url(../images/2-1.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_2_2{ width:880px; background: url(../images/2-2.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_2_3{ width:880px; background: url(../images/2-3.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_2_4{ width:880px; background: url(../images/2-4.png) no-repeat center center; background-size: 100% auto; }


.icon_con .icon_3_1{ width:880px; background: url(../images/3-1.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_3_2{ width:880px; background: url(../images/3-2.png) no-repeat center center; background-size: 100% auto; }

.icon_con .icon_4_1{ width:880px; background: url(../images/4-1.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_4_2{ width:880px; background: url(../images/4-2.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_4_3{ width:880px; background: url(../images/4-3.png) no-repeat center center; background-size: 100% auto; }
.icon_con .icon_4_4{ width:880px; background: url(../images/4-4.png) no-repeat center center; background-size: 100% auto; }


.icon_con .icon_5_1{ width:880px; background: url(../images/5-1.png) no-repeat center center; background-size: 100% auto; }

.icon_con .icon_0_1{ width:880px; background: url(../images/0-1.png) no-repeat center center; background-size: 100% auto; }


.mark_con .icon_con li span{ display: inline-block; width:100%; margin-top:0px;}


.iaoxin-ul{
	text-align: center;
	position: absolute;
	bottom: 15%;
	left: 50%;
	transform: translate(-50%,0);
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	-ms-transform: translate(-50%,0);
	z-index: 10;

    white-space: nowrap;
}
.iaoxin-ul li{
	display: inline-block;
	margin: 0px 28px;
	cursor: pointer;
}
.iaoxin-ul li span{
	display: block;
	padding:0px 7px 10px;
	margin-top: 10px;
	font-size: 14px;
	position: relative;
}
.iaoxin-ul li span:after{
	content: " ";
	display: block;
	height: 2px;
	background: #f8f8f8;
	width: 0;
	 transition: all 0.5s;
	 -webkit-transition: all 0.5s;
	 -moz-transition: all 0.5s;
	 -ms-transition: all 0.5s;
	 -o-transition: all 0.5s;
	position: absolute;
	bottom: 0px;
	left: 0px;
}
.iaoxin-ul li.curs span:after{
	content: " ";
	width: 100%;
}
@media screen and (max-width:1400px){
	.icon_con .icon{ display: inline-block; width:880px; height:400px;}
	/* .iaoxin-ul{
		text-align: center;
		transform: translateY(10px);
		-webkit-transform: translateY(10px);
		-o-transform: translateY(10px);
		-ms-transform: translateY(10px);
		-moz-transform: translateY(10px);
	} */
}
@media screen and (max-width:1200px){
	.icon_con .icon{ display: inline-block; width:620px; height:400px;}
}
@media screen and (max-width:980px){
	.icon_con .icon{ display: inline-block; width:500px; height:340px;}
}
@media screen and (max-width:768px){
	.mark_con{ display: none;}
	video{ display: none!important;}
}
#swiper1 .iaoxin-d1{
	left: 55%;
	top: 35%;
}
.iaoxin-d1{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-m-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	font-size: 50px;
	white-space: nowrap;

}

.iaoxin-d1 p{
	padding-top: 10px;
}
.igg-text{
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 50px;
	white-space: nowrap;
	margin-left:-150px;
	margin-top: -100px;
}
.igg-text p{
	padding-top: 10px;
}
.iaoxin-d2{
	position: absolute;
	top: 10%;
	left: 0%;
	width: 100%;
	text-align: center;
	font-size: 50px;
	white-space: nowrap;

}
.iaoxin-d3{
	position: absolute;
	top: 5%;
	left: 0%;
	width: 100%;
	text-align: center;
	font-size: 50px;
	white-space: nowrap;

}
.iposition{
	position: relative;
}
@keyframes iskey1 {
	0%{
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}/* 
.swiper-slide-active .iaoxin-d1{
	opacity: 0;
	animation: iskey1 1s linear  1s forwards;
	-webkit-animation: iskey1 1s linear  1s forwards;
	-moz-animation: iskey1 1s linear  1s forwards;
	-ms-animation: iskey1 1s linear  1s forwards;
	-o-animation: iskey1 1s linear  1s forwards;

} */
/* .swiper-slide-active .icon{
	opacity: 0;
	animation: iskey1 1s linear forwards;
	-webkit-animation: iskey1 1s linear forwards;
	-moz-animation: iskey1 1s linear forwards;
	-ms-animation: iskey1 1s linear forwards;
	-o-animation: iskey1 1s linear forwards;

} */
.ifootul{
	display: flex;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	height: 100%;
	width: 100%;
}
.ifootul li{
	flex: 1;
	-webkit-flex: 1;
	-moz-flex: 1;
	-ms-flex: 1;
	-o-flex: 1;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.ifootul li:hover .ifootbg{
	background: rgba(0,0,0,0.2);
}
.ifootul li:hover .iftext{
	opacity: 0;
}
.ifootul li:hover .ifoot-bg{
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
}
.ifoot-bg1{
	background: url(../../includes/images/f-01.jpg) no-repeat center center;
	background-size: cover;
}
.ifoot-bg2{
	background: url(../../includes/images/f-02.jpg) no-repeat center center;
	background-size: cover;
}
.ifoot-bg3{
	background: url(../../includes/images/f-03.jpg) no-repeat center center;
	background-size: cover;
}
.ifoot-bg4{
	background: url(../../includes/images/f-04.jpg) no-repeat center center;
	background-size: cover;
}
.ifoot-bg5{
	background: url(../../includes/images/f-05.jpg) no-repeat center center;
	background-size: cover;
}
.ifoot-bg6{
	background: url(../../includes/images/f-06.jpg) no-repeat center center;
	background-size: cover;
}
.ifootbg{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.8);
	transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
}
.ifoot-bg{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;

	transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
}
.iftext{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 100;
	color: #fff;
	padding: 70px 0px 0px;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
}
.iftext p{
	padding-top: 10px;
	font-size: 12px;
}
/*.iftext span{
	color: #fff;
	display: inline-block;
	width: 80px;
	text-align: center;
	line-height: 26px;
	border: 1px solid #fff;
	margin-top: 20px;
	font-size: 14px;
}*/
.swiper-wrapper .swiper-slide{
	font-family: "微软雅黑";
}
.lodingbox{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 125px;
	height: 125px;
	margin-left: -62.5px;
	margin-top: -62.5px;
	background: url(../../includes/images/sprite_loader.png);
	background-position:  0px 0px;	
}
.lodingbox:after{
	content: " ";
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	background: url(../../includes/images/loading-icon.png) center center  no-repeat;
	background-size: 50px 50px;
}
.about .content .modules .module.about-licheng .content>div>div:nth-child(1){
	float: right;
}
.about .content .modules .module.about-licheng .content>div>div:nth-child(2){
	float: left;
}
.about .content .modules .module.about-licheng .content>div>div:nth-child(1)>div{
	height: 640px;
}
.about .content .modules .module.about-licheng .content>div>div:nth-child(1)>div.startAnimation{
	    -webkit-animation: play2 2s steps(45) forwards;
    -moz-animation: play2 2s steps(45) forwards;
    -ms-animation: play2 2s steps(45) forwards;
    -o-animation: play2 2s steps(45) forwards;
    animation: play2 2s steps(45) forwards;
}

.about .content .modules.scrollview .module.image-content .page .container-1 .container-2 .image .custom .content>div>div:nth-child(2)>div {
	left: auto;
	top: auto;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	opacity: 1;
	margin: 0 auto;
	padding: 20% 0 0；
}
.contact-dul:after{
	content: " ";
	display: block;
	clear: both;
}
.contact-dul li{
	width: 50%;
	text-align: center;
	float: left;
	padding-right: 10px;
}
.contact-dul li img{
	width: 70px;
	height: 70px;margin-bottom: 10px;

}
.contact-dul li p.p1{
	font-size: 1.125em;
	color: #fff !important;
	font-weight: normal;
	margin: 0px !important;
	font-family: 'Playfair Display',PingFang SC,Microsoft YaHei,"sans-serif"
}
.contact-dul li p.p2{
	font-size: 1em !important;
	margin-top: 10px;
}
.i-guanggao.active .swiper-slide-active .igg-text{
	 -webkit-animation-name: tada;
    animation-name: tada;
	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-delay:1.5s;
	-webkit-animation-delay:1.5s
}
.i-guanggao.active .swiper-slide-active .igg-icon{
	opacity: 1;
	 -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-delay:0.5s;
	-webkit-animation-delay:0.5s;
}
.ikeji.active .swiper-slide-active .ikeji-icon{
	opacity: 1;
	 -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight;
	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-delay:0.5s;
	-webkit-animation-delay:0.5s;
} 
.modules.scrollview .module .page .container-1 .container-2 .image .custom #swiper0{
	position: absolute;
	width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 3;
}

.isy-nav{
	position: absolute;
	bottom: 20%;
	left: 50%;
	transform: translateX(-50%);
	-webkittransform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	z-index: 10;
}
.isy-nav li{
	display: inline-block;
	height: 5px;
	width: 40px;
	background: #333;
	margin: 0px 5px;
	cursor: pointer;
}
.isy-nav li.curs{
	background: #fff;
}
.iin-ul{
	text-align: center;
	margin-top: 50px;
}
.iin-ul li{
	display: inline-block;
	margin: 20px 30px;
}
.iin-ul li img{
	width: 100px;
	height: 100px;
}
.iin-ul li p{
	font-size: 16px;
	line-height: 35px;
	line-height: 18px;
}
.about-pep{
	text-align: center;
	padding-top: 100px;
	display: flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: -moz-flex;
	/* flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-moz-flex-wrap: wrap; */
}
.about-pep li{
	-webkit-flex:1;
	-ms-flex:1;
	-moz-flex:1;
	width: 33.33%;
	float: left;
	text-align: center;
	padding-bottom: 40px;
}
.about-pep img{
	width: 100px;
	height: 100px;
}
.about-pep-p1{
	font-size: 14px;
	color: #fff;
	line-height: 20px;
}
.about-pep-p2{
	color: #626367;
	font-size: 14px;
	margin-top: 10px;
	line-height: 20px;
	display: inline-block;
	text-align: left;
}
.about-pep-box{
	padding: 0px 10%;
}
.inewbox{
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;

}
.courtsideProject__x-logo__svg {
    position: absolute;
    height: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.x-ul{
	padding: 60px 0px;
}
.x-ul li{
	text-align: center;
	display: inline-block;
	margin: 0px 20px;
}
.x-ul li img{
	height: 150px;
}
.leftimg{
	position: absolute;
	left: 20px;
	top: 50%;
	width:90px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}
.n-2-img{
	height: 520px;
	transform: translateX(50px);
	-webkit-transform: translateX(50px);
	-ms-transform: translateX(50px);
	-moz-transform: translateX(50px);
	
}
.i-6-1{
	    position: absolute;
    left: 324px;
    top: 38px;
    height: 177px;
}
.i-5-1{
	height: 60px;
	position: relative;
	top: -50px;
}
.i-5-2{
	position: absolute;
    height: 84px;
    top: -54px;
    left: 64px;
}
.active .swiper-slide-active .i-5-2{
	opacity: 1;
	 -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp;
	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-delay:0.5s;
	-webkit-animation-delay:0.5s;
} 
.i-3-box{
	display: inline-block;
	width: 460px;
	text-align: left;
	position: relative;
}
.i-3-box span{
	display: inline-block;
	overflow: hidden;
	width: 0px !important;
	transition: all 0.5s 0.5s;
}
.i-3-box .i-3-2{
	width: 460px;
}
.active .swiper-slide-active .i-3-box span{
	width: 460px !important;
}
.i-3-3{
	width: 300px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -250px;
	margin-left: -150px;
	opacity: 1;
}
.active .swiper-slide-active .i-3-box .i-3-3{
	opacity: 1;
	 -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
	-webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-delay:1s;
	-webkit-animation-delay:1s;
}
.i-3-4{
	width: 300px;
	position: absolute;
	left: 72px;
	bottom: -57px;
}

.active .swiper-slide-active .i-3-4{
	opacity: 1;
	 -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp;
	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-delay:1.5s;
	-webkit-animation-delay:1.5s;
} 
.aboutbox{
	display: flex;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	height: 100%;
	align-items: center;
}

.view {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-perspective: 400;
          perspective: 400;
}

.plane {
  width: 100px;
  height: 100px;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}
.plane.main {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-transform: rotateX(60deg) rotateZ(-30deg);
          transform: rotateX(60deg) rotateZ(-30deg);
  -webkit-animation: rotate 20s infinite linear;
          animation: rotate 20s infinite linear;
}
.plane.main .circle {
  width: 100px;
  height: 100px;
  position: absolute;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  border-radius: 100%;
  box-sizing: border-box;
  box-shadow: 0 0 2px #e04b65, inset 0 0 2px #e04b65;
}
.lodimg{
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 64px;
  height: 64px;
  background: url(../images/loading-icon.png) no-repeat;
  background-size: cover;
}
/*.plane.main .circle::before, .plane.main .circle::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 10%;
  height: 10%;
  border-radius: 100%;
  background: crimson;
  box-sizing: border-box;
  box-shadow: 0 0 60px 2px crimson;
}
.plane.main .circle::before {
  -webkit-transform: translateZ(-90px);
          transform: translateZ(-90px);
}
.plane.main .circle::after {
  -webkit-transform: translateZ(90px);
          transform: translateZ(90px);
}
*/
.plane.main .circle:nth-child(1) {
  -webkit-transform: rotateZ(72deg) rotateX(63.435deg);
          transform: rotateZ(72deg) rotateX(63.435deg);
}
.plane.main .circle:nth-child(2) {
  -webkit-transform: rotateZ(144deg) rotateX(63.435deg);
          transform: rotateZ(144deg) rotateX(63.435deg);
}
.plane.main .circle:nth-child(3) {
  -webkit-transform: rotateZ(216deg) rotateX(63.435deg);
          transform: rotateZ(216deg) rotateX(63.435deg);
}
.plane.main .circle:nth-child(4) {
  -webkit-transform: rotateZ(288deg) rotateX(63.435deg);
          transform: rotateZ(288deg) rotateX(63.435deg);
}
.plane.main .circle:nth-child(5) {
  -webkit-transform: rotateZ(360deg) rotateX(63.435deg);
          transform: rotateZ(360deg) rotateX(63.435deg);
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotateX(0) rotateY(0) rotateZ(0);
            transform: rotateX(0) rotateY(0) rotateZ(0);
  }
  100% {
    -webkit-transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
            transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
  }
}

@keyframes rotate {
  0% {
    -webkit-transform: rotateX(0) rotateY(0) rotateZ(0);
            transform: rotateX(0) rotateY(0) rotateZ(0);
  }
  100% {
    -webkit-transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
            transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
  }
}
.yule-icon{
	position: relative;
	transform: translate(-80px,10px);
	-webkit-transform: translate(-80px,10px);
	-moz-transform: translate(-80px,10px);
	-ms-transform: translate(-80px,10px);
}