img {
	border: 0;
}

ul li {
	list-style: none;
}

body,
ul,
li,
div,
dl,
dd,
dt,
img,
p,
h1,
h2,
h3 {
	margin: 0;
	padding: 0;
}

ul,
li {
	display: block;
	list-style: none;
}

.pointer {
	cursor: pointer
}

.clear {
	clear: both;
	height: 0;
	line-height: 0;
	font-size: 0;
}

h1,
h2,
h3 {
	font-size: inherit;
	display: inline;
	font-weight: normal
}

em {
	font-style: normal
}

*:focus {
	outline: none;
}

body,
html {
	color: white;
	padding: 0;
	margin: 0;
	font-family: gilroyLight;
	font-size: 14px;
	line-height: 22px;
	background: black;

}

a {
	text-decoration: none;
}

@font-face {
	font-family: gilroyExtrabold;
	src: url('../fonts/extrabold.otf');
}

@font-face {
	font-family: gilroyLight;
	src: url('../fonts/light.otf');
}

/*linear 执行一次
infinite 循环播放*/
/*body{
    -webkit-animation: load 3s steps(50) infinite;
    -moz-animation: load 3s steps(50) infinite;
}
@-webkit-keyframes load {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 0 -312.5rem;
    }
}*/
.orange {
	color: #e57722;
}

.font18 {
	font-size: 18px;
}

.zIndex {
	z-index: 9999 !important;
}

.bold {
	font-family: gilroyExtrabold;
	font-weight: bold;
}

.vh {
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}

.rem {
	width: 100%;
	height: 9rem;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -8rem;
	margin-top: -4.5rem;
}

.btnActive {
	pointer-events: none;
}

.option {
	opacity: 0;
}

.hide {
	display: none;
}

.t-center {
	text-align: center !important;
}

.scroll-y-no {
	overflow-y: hidden;
}

#app {
	width: 100%;
	margin-bottom: 72px;
}

.arrow-down {
	width: 100%;
	height: calc(100vh - 70px);
	margin-top: 70px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	cursor: url(../images/down.svg) 28 109, auto;
}

/*———————————————————————— loading ——————————————————————————*/
#loading {}

/* ———————————————————————— head —————————————————————————— */
#head {
	width: 100%;
	height: 70px;
	color: white;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
	background: black;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: solid 1px #ffffff1a;
	-webkit-backdrop-filter: saturate(200%) blur(30px);
	backdrop-filter: saturate(200%) blur(30px);
	background: rgb(0 0 0 / 80%);
}

#head .logo {
	width: 234px;
	height: 87px;
	background: url(../images/logo.svg) no-repeat;
	background-size: 100%;
	cursor: pointer;
	position: absolute;
	top: 17px;
	left: 67px;
}

#head .logo a {
	width: 100%;
	height: 100%;
	display: block;
	text-indent: -100000rem;
}

#head .nav {
	width: 10rem;
	height: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#head .nav>div {
	position: relative;
	width: 140px;
	height: 69px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#head .nav>div a {
	font-size: 14px;
	color: white;
	text-align: center;
}

#head .nav>div.active a {
	color: #ED782F;
}

#head .nav>div a:hover {
	color: white;
}

#head .nav>div:hover a {
	color: #ED782F;
}

#head .nav>div.active:hover .main-menu {
	color: #ED782F;
}

#head .nav>div:hover .dropdown-menu {
	display: block;
}

#head .nav>div .dropdown-menu {
	width: 100%;
	min-width: 140px;
	position: absolute;
	top: 70px;
	left: 50%;
	margin-left: -70px;
	background: rgba(0, 0, 0, 0.5);
	display: none;
}

#head .nav>div .dropdown-menu ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 22px;
	padding: 22px 0;
}

#head .nav>div .dropdown-menu ul li {
	width: 80%;
	text-align: center;
	padding: 0 12px;
}

#head .nav>div .dropdown-menu ul li.active a {
	color: #ED782F;
}

#head .nav>div .dropdown-menu ul li a {
	width: 100%;
	color: white;
	display: block;
}

#head .nav>div .dropdown-menu ul li a:hover {
	color: #ED782F;
}

#head .nav>div .dropdown-menu ul li.active a:hover {
	color: #ED782F;
}

#head .language {
	position: absolute;
	right: 165px;
	display: flex;
	align-items: center;
}

#head .language span {
	width: 1px;
	height: 12px;
	background: white;
	margin: 0 8px;
}

#head .language a {
	color: white;
}

#head .language a.active {
	color: #ED782F;
}

.navbar {
	cursor: pointer;
	height: 35px;
	margin: 0;
	position: absolute;
	width: 35px;
	z-index: 999;
	top: 20px;
	right: 67px;
}

.navbar .hamburger {
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
}

.navbar .hamburger span:nth-child(1) {
	transition-delay: 0.5s;
}

.navbar .hamburger span:nth-child(2) {
	transition-delay: 0.625s;
}

.navbar .hamburger span:nth-child(3) {
	transition-delay: 0.75s;
}

.navbar .hamburger span {
	width: 100%;
	height: 3px;
	position: relative;
	top: 3px;
	margin: 0 0 7px 0;
	transition: 0.2s ease-in-out;
	box-sizing: border-box;
}

.navbar.open .hamburger span {
	transition: 0.2s ease-in-out;
	box-sizing: border-box;
	width: 0;
}

.navbar.open .hamburger span:nth-child(1) {
	transition-delay: 0s;
}

.navbar.open .hamburger span:nth-child(2) {
	transition-delay: 0.1s;
}

.navbar.open .hamburger span:nth-child(3) {
	transition-delay: 0.125s;
}

.navbar .cross {
	height: 100%;
	position: absolute;
	transform: rotate(45deg);
	width: 100%;
	left: 0;
}

.navbar span {
	display: block;
	background: #fff;
}

.navbar .cross span:nth-child(1) {
	height: 0;
	width: 4px;
	position: absolute;
	top: 0;
	left: 46%;
	transition-delay: 0s;
}

.navbar .cross span:nth-child(2) {
	width: 0;
	height: 4px;
	position: absolute;
	left: 0;
	top: 46%;
	transition-delay: 0.25s;
}

.navbar .cross span {
	transition: 0.2s ease-in-out;
	box-sizing: border-box;
}

.navbar.open .cross span:nth-child(1) {
	height: 100%;
	transition-delay: 0.35s;
}

.navbar.open .cross span:nth-child(2) {
	width: 100%;
	transition-delay: 0.45s;
}

/* ---------------------------------------------------- 子菜单 ---------------------------------------------------- */
.menu-wrapper {
	width: 100%;
	height: calc(100vh - 70px);
	-webkit-backdrop-filter: saturate(200%) blur(30px);
	backdrop-filter: saturate(200%) blur(30px);
	background: rgb(0 0 0 / 80%);
	position: fixed;
	top: 71px;
	left: 0;
	z-index: 10;
}

.menu-wrapper .menu-center {
	height: 100%;
	display: flex;
	align-items: center;
}

.menu-wrapper ul {
	width: 100%;
	height: 80%;
	display: flex;
	flex-wrap: wrap;
}

.menu-wrapper ul li {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.menu-wrapper ul li a {
	font-size: 0.8rem;
	color: #fff0;
	letter-spacing: 0.05rem;
	-webkit-text-stroke: 1px rgb(255 255 255);
	font-weight: bold;
	font-family: gilroyExtrabold;
	text-transform: uppercase;
}

.cn .menu-wrapper ul li a {
	letter-spacing: 0.2rem;
}

.menu-wrapper ul li a:hover {
	color: white;
	-webkit-text-stroke: 1px rgb(255 255 255 / 0%);
}

/* ---------------------------------------------------- 底部 ---------------------------------------------------- */
.footer {
	width: 100%;
	height: 72px;
	color: white;
	-webkit-backdrop-filter: saturate(200%) blur(30px);
	backdrop-filter: saturate(200%) blur(30px);
	background: rgb(0 0 0 / 80%);
	position: fixed;
	bottom: 0;
	border-top: solid 1px #ffffff1a;
	z-index: 8;
}

.footer .footer-center {
	height: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 67px;
}

.footer p {
	opacity: 0.4;
}

.footer a {
	color: white;
}

.footer-l {
	display: flex;
	gap: 50px;
}

.footer-r {
	display: flex;
	gap: 50px;
}

.mobile {
	display: none !important;
}

/* ---------------------------------------------------- header-bar ---------------------------------------------------- */
.header-bar {
	width: 100%;
	padding: 35px 0;
	-webkit-backdrop-filter: saturate(200%) blur(30px);
	backdrop-filter: saturate(200%) blur(30px);
	background: rgb(0 0 0 / 80%);
	position: fixed;
	top: 71px;
	z-index: 1;
}

.header-bar .header-bar-box {
	max-width: 1200px;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	padding: 0 0.5rem;
	margin: 0 auto;
}

.projects-nav {
	display: flex;
	gap: 85px;
}

.projects-nav div.active {
	font-weight: bold;
	font-family: gilroyExtrabold;
}

.projects-nav div {
	cursor: pointer;
	color: white;
}

/* ---------------------------------------------------- 项目列表 ---------------------------------------------------- */
.project .projects-list {
	width: 1200px;
	margin: 182px 0 82px;
	padding: 0 0.5rem;
}

.project .projects-list .list-box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 0;
	justify-content: space-between;
}

.project .projects-list .grid-item {
	flex-basis: 49.2%;
	height: auto;
	cursor: pointer;
}

.project .projects-list .grid-item .card-image {
	height: 0;
	padding-bottom: 66.3%;
	background: #0e0e0e;
	overflow: hidden;
	position: relative;
}

.project .projects-list .grid-item .card-image .card-element {
	width: 100%;
	height: 100%;
	position: absolute;
}

.project .projects-list .grid-item .card-image {
	background-image: url(../images/load.gif);
	background-position: 50% 50%;
	background-size: 32px 32px;
	background-repeat: no-repeat;
}

.project .projects-list .grid-item .card-image img,
.project .projects-list .grid-item .card-image video {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

.project .projects-list .grid-item .card-image video {
	display: none;
}

.project .projects-list .grid-item p {
	height: 38px;
	display: flex;
	align-items: center;
	font-size: 14px;
}

/* .project .projects-list .grid-item .card-image:hover video{
    display: block;
}
.project .projects-list .grid-item .card-image:hover img{
    display: none;
}
.project .projects-list .grid-item .card-image.no-media:hover img{
    display: block!important;
}
.project .projects-list .grid-item .card-image.no-media:hover video{
    display: none!important;
} */

/* ---------------------------------------------------- 搜索 ---------------------------------------------------- */
.search {
	width: 230px;
	height: 36px;
	border-radius: 30px;
	border: solid 1px white;
}

.search .search-input {
	display: flex;
	align-items: center;
	height: 100%;
	position: relative;
	padding: 0 12px;
}

.search .search-input button {
	width: 24px;
	height: 24px;
	background: url(../images/search.svg) center no-repeat;
	background-size: 100%;
	position: absolute;
	right: 12px;
	top: 50%;
	margin-top: -14px;
	border: none;
	cursor: pointer;
}

.search .search-input .keyword {
	width: 70%;
	height: 100%;
	background: none;
	border: none;
	font-size: 14px;
	/* text-align: right; */
	color: white;
}

.search-bar-clear {
	width: 14px;
	height: 14px;
	background-image: url(../images/search-bar-clear.svg);
	background-size: 100%;
	cursor: pointer;
	margin-left: 5px;
}

/* ---------------------------------------------------- 项目详情 ---------------------------------------------------- */
.project-mask {
	width: 100%;
	height: calc(100vh - 70px);
	/* background: black; */
	-webkit-backdrop-filter: saturate(200%) blur(30px);
	backdrop-filter: saturate(200%) blur(30px);
	background: rgb(0 0 0 / 80%);
	position: fixed;
	z-index: 9;
	top: 71px;
	display: none;
}

.project-mask .project-detail-content {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.project-mask .project-detail-content .project-detail {
	width: 52%;
	max-width: 1150px;
	/* height: 18vh; */
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.2rem;
	margin-top: -8%;
	position: relative;
}

.project-mask .project-detail-content .project-detail .project-video {
	width: 100%;
	overflow: hidden;
}

.project-mask .project-detail-content .project-detail .project-video .swiper5 {
	width: 100%;
}

.project-mask .project-detail-content .project-detail .project-video .swiper5 .swiper-wrapper {
	display: flex;
}

.project-mask .project-detail-content .project-detail .project-video .swiper5 .swiper-wrapper .swiper-slide {
	min-width: 100%;
	background-color: black;
}

.project-mask .project-detail-content .project-detail .project-video video,
.project-mask .project-detail-content .project-detail .project-video img {
	width: 100%;
	max-height: 48vh;
}

.project-mask .project-detail-content .project-detail .project-video img {
	-o-object-fit: contain;
	object-fit: contain;
}

.project-mask .project-detail-content .project-detail .project-video video {
	cursor: pointer;
}

.project-info {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 0.1rem;
	justify-content: center;
}

.project-info .title {
	width: 100%;
	font-size: 18px;
	font-family: gilroyExtrabold;
	font-weight: bold;
}

.project-info p {
	width: 100%;
}

.swiper-thumbsslider {
	width: 11.6rem;
	height: auto;
	min-height: 0.8rem;
	overflow: hidden;
	margin: 0 auto;
	position: absolute;
	bottom: 1rem;
	padding: 0 90px;
	display: flex;
	align-items: center;
}

.swiper4 {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
}

.swiper4 .swiper-wrapper {
	width: 100%;
	height: 100%;
	display: flex;
}

.swiper4 .swiper-wrapper .swiper-slide {
	width: 140px;
	max-height: 100px;
	flex-shrink: 0;
	cursor: pointer;
	position: relative;
}

.swiper4 .swiper-wrapper .swiper-slide.swiper-slide-thumb-active::after {
	content: "\663e\793a";
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.6);
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.en .swiper4 .swiper-wrapper .swiper-slide.swiper-slide-thumb-active::after {
	content: "Selected";
	text-transform: uppercase;
}

.swiper4 .swiper-wrapper .swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.swiper4 .swiper4-button-prev {
	width: 98px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/thumbs-button-next.svg) center no-repeat;
	/* background-size: 50%; */
	cursor: pointer;
}

.swiper4 .swiper4-button-next {
	width: 98px;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	background: url(../images/thumbs-button-next.svg) center no-repeat;
	/* background-size: 50%; */
	cursor: pointer;
	-webkit-transform: rotate(180deg);
}

.swiper4 .swiper4-button-prev.swiper-button-disabled,
.swiper4 .swiper4-button-next.swiper-button-disabled {
	opacity: 0.4;
}

.project-more {
	width: 28%;
	display: flex;
	justify-content: space-between;
	position: absolute;
	left: 50%;
	bottom: 0.4rem;
	margin-left: -14%;
}

.project-more>div {
	width: 12px;
	height: 12px;
	cursor: pointer;
}

.project-more .prev {
	background: url(../images/nav-button-next.svg) no-repeat;
	background-size: 100%;
}

.project-more .see-all {
	background: url(../images/nav-button-all.svg) no-repeat;
	background-size: 100%;
}

.project-more .next {
	background: url(../images/nav-button-next.svg) no-repeat;
	background-size: 100%;
	-webkit-transform: rotate(180deg);
}

/* ---------------------------------------------------- loading 加载更多 ---------------------------------------------------- */
.product-loading {
	width: 100%;
	color: #fff;
	text-align: center;
	margin-top: 50px;
	display: none;
}

.product-loading img {
	width: 0.2rem;
}


@media(max-width: 1025px) {
	.mobile {
		display: flex !important;
	}

	.pc {
		display: none !important;
	}

	.menu-wrapper ul li a {
		color: white;
		-webkit-text-stroke: 0px rgb(255 255 255);
	}

	#head .logo {
		left: 20px;
	}

	#head .language {
		right: 75px;
	}

	.navbar {
		right: 20px;
	}

	.footer .footer-center {
		margin: 0 0.5rem;
	}

	.project-mask .project-detail-content {
		height: auto;
		align-items: normal;
		flex-wrap: wrap;
	}

	.project-mask .project-detail-content .project-detail {
		width: 100%;
		height: auto;
		margin-top: 0;
	}

	.project-info {
		padding: 0 20px
	}

	.swiper-thumbsslider {
		position: relative;
		bottom: auto;
		margin-top: 1rem;
	}

	.project-more {
		bottom: 1.5rem;
	}
}

@media(max-width: 720px) {
	.header-bar .header-bar-box {
		justify-content: center;
	}

	.header-bar .header-bar-box .projects-nav {
		display: flex;
		justify-content: space-around;
		width: 90%;
		gap: inherit;
	}

	.project .projects-list {
		margin: 222px 0 82px
	}

	.project .projects-list .grid-item {
		flex-basis: 100%;
	}

	.search {
		width: 100%;
		margin: 25px 0 0;
	}
}

/* ---------------------------------------------  order 布局  --------------------------------------------- */
.order-item:nth-child(odd)>div:nth-child(1) {
	order: 1;
}

.order-item:nth-child(odd)>div:nth-child(2) {
	order: 2;
}

.order-item:nth-child(even)>div:nth-child(1) {
	order: 2;
}

.order-item:nth-child(even)>div:nth-child(2) {
	order: 1;
}

@media(max-width: 1025px) {
	#app .order-item>div {
		flex-basis: 100%;
	}

	.order-item:nth-child(even)>div:nth-child(1) {
		order: 1;
	}

	.order-item:nth-child(even)>div:nth-child(2) {
		order: 2;
	}
}

/* -----------------------------------------  swiper-card ---------------------------------------------------- */

.column-grid.active {
	width: 100%;
	position: fixed;
	top: -9999999rem;
	opacity: 0;
	pointer-events: none;
}

.column-grid .grid-item {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.column-grid .grid-item>div {
	flex-basis: 50%;
	position: relative;
	overflow: hidden;
}

.swiper-card-element .swiper-wrapper {
	width: 100%;
	height: 100%;
	display: flex;
}

.swiper-card.swiper-card-element .swiper-wrapper {
	width: 10000rem;
	height: 100%;
	display: flex;
}

/* .virtual-production .virtual-content .grid-item .video-element .pagination{
    color: white;
    position: absolute;
    bottom: 15px;
    right: 15px;
    z-index: 2;
}
.virtual-production .virtual-content .grid-item .video-element .swiper-wrapper.active{
    width: 100%;
} */
.swiper-card-element .swiper-wrapper .swiper-slide {
	width: 100%;
	height: 100%;
	position: relative;
}

.column-grid .grid-item .video-element {
	background: url(../images/load.gif) #0e0e0e;
	background-position: 50% 50%;
	background-size: 32px 32px;
	background-repeat: no-repeat;
}

.column-grid .grid-item .video-element img,
.column-grid .grid-item .video-element video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.column-grid .grid-item>div .swiper-wrapper .swiper-slide.video-element-info:hover video {
	display: block;
}

.column-grid .grid-item>div .swiper-wrapper .swiper-slide.video-element-info:hover img {
	opacity: 0;
}

.column-grid .grid-item .video-element video {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}

.column-grid .grid-item .video-element video::-webkit-media-controls-fullscreen-button {
	display: none;
}

.column-grid .grid-item .text-element .text-center {
	padding: 2rem 2.8rem;
}

.column-grid .grid-item .text-element .text-center h3 {
	font-size: 18px;
	display: flex;
	align-items: center;
	margin-bottom: 12px;
	font-family: gilroyExtrabold;
	font-weight: bold;
}

.column-grid .grid-item .text-element .text-center>div {
	line-height: 22px;
}

/* ---------------------------------------------------- 首屏幕视频 ---------------------------------------------------- */
.opening-video {
	width: 100%;
	height: calc(100vh - 70px);
	margin-top: 70px;
	position: relative;
}

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

/* ---------------------------------------------------- icon-house ---------------------------------------------------- */

.icon-house-a::after {
	content: "";
	width: 1.8rem;
	max-width: 1.8rem;
	min-width: 75px;
	min-height: 58px;
	height: 1.5rem;
	position: absolute;
	top: 0.2rem;
	left: 0.5rem;
	background: url(../images/house-a.svg) center no-repeat;
	background-size: 100%;
	z-index: 2;
	pointer-events: none;
}

.icon-house-b::after {
	content: "";
	width: 1.8rem;
	max-width: 1.8rem;
	min-width: 75px;
	min-height: 58px;
	height: 1.5rem;
	position: absolute;
	top: 0.2rem;
	left: 0.5rem;
	background: url(../images/house-b.svg) center no-repeat;
	background-size: 100%;
	z-index: 2;
	pointer-events: none;
}

/* ---------------------------------------------------- 立即预约 ---------------------------------------------------- */
.immediately-reservation {
	width: 154px;
	height: 40px;
	background: url(../images/immediately-reservation.png) center no-repeat;
	background-size: 100%;
	font-size: 14px;
	color: white;
	letter-spacing: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	font-family: gilroyExtrabold;
	margin-top: 20px;
}

.project {
	width: 100%;
}

/* ---------------------------------------------------- 内容 ---------------------------------------------------- */
.project {
	width: 100%;
	background: black;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}s