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

.iconfont {
	font-family: "iconfont" !important;
	font-size: 16px;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-webkit-text-stroke-width: 0.2px;
	-moz-osx-font-smoothing: grayscale;
}

@font-face {
	font-family: 'HarmonyOSSansSC';
	src: url('../fonts/HarmonyOS_Sans_SC_Thin.woff2');
	font-weight: 200;
}

@font-face {
	font-family: 'HarmonyOSSansSC';
	src: url('../fonts/HarmonyOS_Sans_SC_Light.woff2');
	font-weight: 300;
}

@font-face {
	font-family: 'HarmonyOSSansSC';
	src: url('../fonts/HarmonyOS_Sans_SC.woff2');
	font-weight: 400;
}

@font-face {
	font-family: 'HarmonyOSSansSC';
	src: url('../fonts/HarmonyOS_Sans_SC_Medium.woff2');
	font-weight: 500;
}

@font-face {
	font-family: 'HarmonyOSSansSC';
	src: url('../fonts/HarmonyOS_Sans_SC_Bold.woff2');
	font-weight: 600;
}

@font-face {
	font-family: 'HarmonyOSSansSC';
	src: url('../fonts/HarmonyOS_Sans_SC_Black.woff2');
	font-weight: 700;
}

@font-face {
	font-family: BaiJamjuree-Bold;
	src: url('../fonts/BaiJamjuree-Bold.woff2');
}

* {
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	list-style: none;
	color: var(--color4);
	font-family: 'HarmonyOSSansSC';
	font-weight: 400;
}

p {
	font-size: 1.6rem;
	line-height: 1.6;
	margin: 1rem 0;
	font-weight: 300;
	color: #666;
}

img {
	display: block;
}

.clear {
	clear: both;
}

a {
	text-decoration: none;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--color);
}

::selection {
	background: var(--color);
	color: #fff;
}

.flexBoxs {
	display: flex;
	flex-wrap: wrap;
}

html,
body {
	font-size: 62.5%;
	width: 100%;
	position: relative;
	--color: #1a1a1a;
	--color2: #252525;
	--height: 64px;
	--height2: 54px;
}


.w_all {
	width: 92%;
	margin: 0 auto;
}

.w_all2 {
	width: 33vw;
	margin: auto;
}

.mains {
	width: 100%;
	height: 100vh;
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.mains ul {
	width: 100%;
}

.mains ul li {
	width: 33.3%;
}

.mains ul li img {
	height: 10rem;
	margin: auto; 
}

.mains ul li p {
	text-align: center;
	color: #fff;
	margin-top: 2rem;
}

header {
	position: fixed;
	width: 100%;
	left: 0;
	top: 0;
	z-index: 99;
	transition: all 0.6s ease;
	background: #fff;
}

header nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

header .logo img {
	height: 4.5rem;
	position: relative;
	z-index: 9999;
}

header ul {
	display: flex;
}

header ul li {
	position: relative;
	margin-right: 2.5vw;
}

header ul li h2 {
	font-size: 1.5rem;
	line-height: var(--height);
	transition: all 0.6s;
	display: block;
}

header ul li h2::before {
	content: '';
	position: absolute;
	left: 0;
	height: 1px;
	width: 0;
	background: var(--color2);
	bottom: 30%;
	transition: all 0.5s ease;
}

header ul li:hover h2:before {
	width: 100%;
}

header.active ul li h2 {
	line-height: var(--height2);
}

header.active ul li:hover h2 {
	color: var(--color);
}

header .language {
	display: flex;
	align-items: center;
	font-size: 1.4rem;
	position: relative;
	z-index: 9999;
}

header .language img {
	width: 1.8rem;
	margin: -1px 4px 0 0;
}

header.active .language,
header.on .language {
	color: var(--color2);
}

.ph_menu {
	display: none;
}

.navBtn {
	z-index: 99999;
	cursor: pointer;
	display: none;
	margin-left: 2rem;
}

.navBtn span {
	display: block;
	width: 20px;
	height: 2px;
	background: var(--color2);
	margin: 4px auto;
}

header.on .navBtn span,
header.active .navBtn span {
	background: var(--color2);
}

.nav_btn_active {
	-webkit-transition: all 0.4s;
	transition: all 0.4s;
}

.nav_btn_active span:nth-of-type(1) {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.nav_btn_active span:nth-of-type(2) {
	opacity: 0;
}

.nav_btn_active span:nth-of-type(3) {
	margin-top: -59%;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.s_menu {
	position: absolute;
	display: none;
	top: 100%;
	left: -2rem;
	width: max-content;
	min-width: 100%;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	background: #fff;
}

.s_menu dl {
	padding: 10px 0;
}

.s_menu dd a {
	font-size: 1.3rem;
	padding: 8px 2rem;
	display: block;
	cursor: pointer;
	transition: all 0.3s linear;
}

.s_menu dd a:hover {
	opacity: 0.8;
}

.banner {
	width: 100%;
	margin-top: var(--height);
	height: auto !important;
	position: relative;
	overflow: hidden;
}

.banner img {
	width: 100%;
	transition: all 0.8s ease;
}

.banner:hover img {
	transform: scale(1.06);
}

.more {
	border-radius: 5px;
	border: 1px solid var(--color);
	display: flex;
	justify-content: space-between;
	padding: 1.2rem 3rem;
	align-items: center;
	width: max-content;
	margin-top: 4rem;
	cursor: pointer;
	transition: all 0.5s ease;
}

.more span {
	font-size: 1.5rem;
	transition: all 0.5s ease;
}

.more i {
	color: #fff;
	margin-left: 1.5rem;
	font-size: 1.6rem;
	font-weight: 500;
}

.more:hover {
	background: var(--color);
}

.more:hover span {
	color: #fff;
}

.more:hover img {
	transform: rotate(180deg);
}

.title {
	margin-bottom: 4rem;
}

.title h3 {
	font-weight: 500;
	font-size: 3rem;
}

.title p {
	margin-top: 2rem;
}

.titleCenter {
	text-align: center;
}

/* 首页 各屏 */
.index_bars {
	padding: 8rem 0;
}

.index_case .contain {
	position: relative;
	display: flex;
	justify-content: space-between;
}

.index_case .contain::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 60%;
	z-index: 2;
	height: 100%;
	background: #fff;
}

.index_case .contain .left {
	width: 50%;
	position: relative;
	z-index: 5;
	clip-path: inset(0 100% 0 0);
	will-change: clip-path;
}

.index_case .contain .left b {
	width: 100%;
	height: 84vh;
	display: block;
	overflow: hidden;
	position: relative;
}

.index_case .contain .left b img {
	position: absolute;
	inset: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
	will-change: transform, opacity;
}

.index_case .contain .left .txt {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 8;
}

.index_case .contain .left .txt .tt {
	padding: 4%;
}

.index_case .contain .left .txt .tt h6 {
	color: #fff;
}

.index_case .contain .left .txt .tt p {
	color: #fff;
	overflow: initial;
	white-space: initial;
}

.index_case .contain .right {
	width: 60%;
	position: absolute;
	right: 10%;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
}

.index_case .swiper-container {
	overflow: hidden;
}

.index_case .swiper-slide {
	position: relative;
	overflow: hidden;
	transition: all 0.4s ease;
	transform-origin: left top;
}

.index_case .swiper-slide .aa {
	overflow: hidden;
	height: 58vh;
}

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

.index_case .tt {
	padding: 1.5rem 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	will-change: transform, opacity;
}

.index_case h6 {
	font-size: 1.8rem;
	font-weight: 500;
}

.index_case p {
	font-size: 1.5rem;
	margin: 0;
	text-align: right;
	width: 70%;
	font-weight: 400;
	line-height: 1.3;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.index_case .rr2 {
	width: 50%;
	position: relative;
}

.index_case .swiper-pagination {
	bottom: 6% !important;
}

.swiper-pagination span {
	background: var(--color2);
	width: 6px;
	height: 6px;
}

.index_case .bl::after {
	display: none;
}

.index_case .bl {
	position: absolute;
	left: 7.5%;
	top: 50%;
	transform: translateY(-50%);
	width: 15%;
	height: 70%;
	cursor: none;
	overflow: hidden;
}

.index_case .swiper-button-next {
	left: inherit;
	right: 5%;

}

.cursor-btn {
	position: fixed;
	pointer-events: none;
	left: 0;
	top: 0;
	border-bottom: 1px solid var(--color2);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
	pointer-events: none;
	z-index: 9999;
	transform: translate(-50%, -50%) scale(0.6);
	opacity: 0;
	transition:
		opacity 0.3s,
		transform 0.2s ease-out
}

.cursor-btn.active {
	transform: translate(-50%, -50%) scale(1);
}

.btns {
	display: flex;
	justify-content: center;
	margin-top: 5rem;
}

.btns .bl {
	background: none !important;
	border: 1px solid rgba(0, 0, 0, 0.3);
	margin-right: 1rem;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0rem;
	position: static;
}

.btns .bl img {
	width: 60%;
	filter: none;
}

.btns .bl.lll img {
	transform: rotate(180deg);
}

.index_pro ul {
	justify-content: space-between;
}

.index_pro ul li {
	width: 25%;
	overflow: hidden;
}

.index_pro ul li img {
	width: 100%;
	transition: all 0.5s ease;
}

.index_pro ul li:hover img {
	transform: scale(1.06);
}

.books .title p {
	line-height: 1.4;
	font-size: 1.46rem;

}

.books .txt p {
	margin: 0;
	position: relative;
}

.books .txt p img {
	position: absolute;
	right: 1rem;
	top: 1.5rem;
	width: 2rem;
	opacity: 0.5;
}

.books .pps {
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 1.5rem 0;
	border-radius: 5px;
	line-height: 1;
	font-size: 1.4rem;
	box-shadow: 0 0 0 1px #20202033;
	padding: 1.6rem;
	cursor: pointer;
	position: relative;
	z-index: 9;
}

.books input {
	padding: 1.6rem;
	background: none;
	margin: 0;
	color: var(--color);
}

.books input::placeholder {
	color: #999;
}

.books select {
	padding: 1.6rem 1.6rem 1.6rem 1.2rem !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

select:invalid {
	color: #999;
}

select:valid {
	color: var(--color);
}

.books .p2 {
	display: none;
}

.submit {
	border-radius: 5px;
	background: var(--color2);
	color: #fff;
	width: 100%;
	padding: 1.5rem 0;
	cursor: pointer;
	transition: all 0.5s ease;
}

.submit:hover {
	opacity: 0.8;
}

footer {
	position: relative;
	background: var(--color2);
}

footer .top {
	padding: 10rem 0 15rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

footer .top .ll {
	width: 25%;
}

footer .logo img {
	height: 5.6rem;
	margin-bottom: 2rem;
	filter: invert(1) brightness(1000);
}

footer .top .ll .tt p {
	display: flex;
	color: #fff;
	font-size: 1.4rem;
}

footer .top .ll .tt p img {
	width: 1.8rem;
	height: 1.8rem;
	margin-right: 1rem;
	margin-top: 1px;
	filter: invert(1) brightness(1000);
}

footer .top .ll .tt p a {
	display: block;
	line-height: 1.8;
	font-size: 1.3rem;
	opacity: 0.8;
	transition: all 0.5s ease;
}

footer .top .ll .tt p:hover a {
	opacity: 1;
}

.follow {
	display: flex;
	margin-top: 3rem;
}

.follow p {
	position: relative;
	margin: 0;
	margin-right: 1.5rem;
	overflow: hidden;
	cursor: pointer;
	opacity: 0.8;
	transition: all 0.5s ease;
}

.follow p:hover {
	opacity: 1;
}

.follow p .img1 {
	width: 3.2rem;
	filter: invert(1) brightness(1000);
}

.follow p .img2 {
	position: absolute;
	left: 50%;
	top: 5rem;
	width: 10rem;
	transform: translateX(-50%);
	opacity: 0;
	border: 1px solid rgba(0, 0, 0, 0.06);
}

.follow p:hover {
	overflow: inherit;
}

.follow p:hover .img2 {
	opacity: 1;
	top: 4rem;
	transition: all 0.5s ease;
}

footer dl dd {
	color: #fff;
	font-size: 1.4rem;
	margin: 0 0 2.4rem 0;
	transition: all 0.5s ease;
	position: relative;
	line-height: 1.6;
	width: max-content;
}

footer dl dd:hover {
	opacity: 0.8;
}

footer dl dd::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0%;
	height: 1px;
	background: #fff;
	transition: all 0.5s ease;
	opacity: 0.8;
}

footer dl dd:hover::after {
	width: 100%;
}

footer .rr {
	width: 50%;
	display: flex;
	justify-content: space-between;
}

footer .rr .ss {
	width: 40%;
}

footer .rr h2 {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 500;
	margin-bottom: 3rem;
}

footer .rr .bb {
	border-bottom: 1px solid rgba(255, 255, 255, .8);
	padding: 1rem 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

footer .rr input {
	background: none;
	color: #fff;
	width: 90%;
	font-size: 1.4rem;
}

footer .rr input::placeholder {
	color: #fff;
	opacity: 0.5;
}

footer .rr button {
	background: none;
	color: #fff;
	font-size: 1.4rem;
}

footer .copy {
	padding: 0 0 1.5rem 0;
}

footer .copy .tl {
	display: flex;
	justify-content: space-between;
	align-items: center;
}


footer .copy p {
	margin: 0;
	font-size: 1.2rem;
	color: #fff
}

footer .copy .tl a {
	color: #fff;
	font-size: 1.2rem;
	margin-left: 20px;
	transition: all 0.5s ease;
}

footer .copy .tl a:hover {
	color: #fff;
}


.all_back {
	position: fixed;
	right: 1.5%;
	bottom: 4rem;
	z-index: 99999999;
	display: none;
}

.all_back .aa {
	background: #fff;
	border-radius: 50%;
	margin: 1rem 0;
	width: 4rem;
	height: 4rem;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	border: 1px solid rgba(0, 0, 0, .02);
	transition: all 0.4s ease;
	box-shadow: 0 3rem 5rem 0 rgba(23, 33, 30, 0.05);
}

.all_back img {
	width: 50%;
}

.all_back .aa:hover {
	background: var(--color);
	transform: scale(1.06);
}

.all_back .aa:hover img {
	filter: invert(1) brightness(1000);
}

.ban {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.ban img {
	width: 100%;
	transition: all 0.8s ease;
}

.ban:hover img {
	transform: scale(1.04);
}

.about .bar1 .tt p {
	position: absolute;
	text-align: center;
	width: 100%;
}

.about .bar1 .tt p.top {
	opacity: 1;
}

.about .bar1 .tt p.top span {
	color: var(--color2);
	font-weight: 300;
}

.about .bar1 .tt p.bottom {
	opacity: 0.3;
}

.about .contain {
	justify-content: space-between;
	background: #f3f3f3;
	border-radius: 5px;
	position: relative;
}

.swiper-container {
	width: 100%;
	overflow: hidden;
}

.about .contain .swiper-slide {
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 5% 5%;
	box-sizing: border-box;
}

.about .contain .aa {
	width: 30vw;
	height: 30vw;
	border-radius: 50%;
	overflow: hidden;
}

.about .contain .aa img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.about .contain .bb {
	width: 38%;
	margin-left: 5%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
}

.about .contain .bb .numm {
	position: absolute;
	left: 0;
	top: 5%;
	font-size: 1.6rem;
	letter-spacing: 2px;
}

.about .contain h6 {
	font-size: 2.2rem;
	margin: -0 0 3rem;
	font-weight: 500;
}

.bls::after {
	display: none;
}

.bls {
	background: #fff;
	border-radius: 50%;
	padding: 1.4rem;
	box-sizing: border-box;
	width: 5rem !important;
	height: 5rem !important;
	transition: all 0.5s ease;
}

.bls img {
	width: 100%;
}

.bls:hover {
	background: var(--color2);
}

.bls:hover img {
	filter: invert(1) brightness(1000);
}

.swiper-button-next img {
	transform: rotate(180deg);
}

.about .contain .bottom {
	position: absolute;
	width: 40%;
	left: 51.5%;
	bottom: 18%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.about .contain .bottom .btnss {
	width: 14rem;
	position: relative;
}

.about .swiper-pagination {
	position: static;
	z-index: 5;
	text-align: left;
	width: max-content;
}

.about .swiper-pagination span {
	background: none;
}

.history .contain {
	position: relative;
	justify-content: space-between;
}

.history .ll {
	width: 32%;
}

.history .lbox {
	position: sticky;
	top: 20%;
}

.history .ls {
	position: relative;
	display: flex;
	height: 28vw;
	align-items: center;
}

.history .ll .nums {
	margin-top: -4%;
}

.history .ll h5 {
	font-size: 11rem;
}

.history .ll .bg {
	position: absolute;
	right: 0;
	top: 65%;
	height: 150%;
	transform: translateY(-50%);
}

.history .ll .bg img {
	height: 100%;
}

.history .gallery-thumbs {
	height: 100%;
}

.history .gallery-thumbs .swiper-slide h5 {
	opacity: 0.08;
}

.history .gallery-thumbs .swiper-slide-active h5 {
	opacity: 1;
}

.history .rr {
	width: 50%;
}

.history .rr .swiper-slide {
	height: auto;
	padding: 0 0 5vh 0;
}

.history .tt h6 {
	font-size: 2rem;
	opacity: 0.5;
	margin-bottom: 1.5rem;
	transition: all 0.3s linear;
}

.history .tt img {
	border-radius: 5px;
	width: 100%;
}

.history .tt p {
	font-weight: 400;
	line-height: 1.8;
	opacity: 1;
	font-size: 1.4rem;
}

.history .tt p strong {
	display: block;
	color: var(--color2);
	font-weight: 500;
	font-size: 1.6rem;
}

.star {
	background: #f3f3f3;
	position: relative;
	z-index: 9;
}

.star .swiper-slide {
	position: relative;
	overflow: hidden;
	border-radius: 5px;
}

.star .swiper-slide>img {
	width: 100%;
	transition: all 0.8s ease;
}

.star .swiper-slide:hover>img {
	transform: scale(1.06);
}

.star .swiper-slide .tt {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: absolute;
	left: 5%;
	bottom: 3%;
	width: 90%;
	background: #ffffffe8;
	border-radius: 5px;
	padding: 1rem;
	box-sizing: border-box;
}

.star .swiper-slide .tt img {
	width: 6rem;
	height: 6rem;
	object-fit: cover;
	border-radius: 50%;
}

.star .swiper-slide .tt p {
	width: calc(100% - 8rem);
	font-size: 1.4rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.star .swiper-slide .tt p strong {
	display: block;
	color: var(--color2);
	font-size: 1.6rem;
}

.star .tt2 {
	display: none;
}

.star .bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 5rem;
}

.btns2 {
	display: flex;
}

.btns2 .bl {
	width: 3rem;
	height: 3rem;
	padding: 0.8rem;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	background: #fff;
	position: relative;
	z-index: 2;
	margin-left: 1.5rem;
	transition: all 0.5s linear;
}

.btns2 .bl.swiper-button-disabled {
	opacity: 0.4 !important;
}


.btns2 .bl:hover img {
	filter: invert(1) brightness(1000);
}

.btns2 .bl:hover {
	background: var(--color);
}

.btns2 .bl img {
	width: 70%;
}

.btns2 .llr img {
	transform: rotate(180deg);
}

.swiper-scrollbar {
	position: static !important;
	width: 30% !important;
	height: 2px !important;
	opacity: 1 !important;
	background: rgba(0, 0, 0, .1);
}

.swiper-scrollbar-drag {
	height: 100%;
	background: var(--color) !important;
}

.pro .top {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.pro .top dl {
	display: flex;
	align-items: center;
}

.pro .top dl dd {
	display: flex;
	align-items: center;
	margin-right: 4rem;
	font-size: 1.5rem;
	transition: all 0.5s linear;
	opacity: 0.6;
}

.pro .top dl dd img {
	width: 1.5rem;
	margin-left: 0.8rem;
}

.pro .top dl dd.active,
.pro .top dl dd:hover {
	opacity: 1;
}

.pro .top dl dd.active img {
	transform: rotate(45deg);
}

.pro .top .rr {
	display: flex;
	align-items: center;
}

.pro .top .rr h5 {
	font-size: 1.6rem;
	font-weight: 300;
	margin-right: 4rem;
}

.pro .top .rr img {
	width: 1.8rem;
	margin-left: 1.5rem;
	opacity: 0.4;
	cursor: pointer;
	transition: all 0.5s ease;
}

.pro .top .rr img.active,
.pro .top .rr img:hover {
	opacity: 1;
}

.pro .bar1 ul {
	margin-top: 5rem;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 5rem 2rem;
}

.pro .bar1 ul li b {
	display: block;
	overflow: hidden;
	border-radius: 5px;
}

.pro .bar1 ul li img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.8s ease;
}

.pro .bar1 ul li:hover img {
	transform: scale(1.08);
}

.pro .bar1 ul li h6 {
	padding: 2rem 0 0;
	font-size: 1.6rem;
	font-weight: 300;
	display: none;
}

.pro .bar1 ul.on {
	gap: 5rem 1.5rem;
	grid-template-columns: repeat(6, 1fr);
}

.pro .bar1 ul.on li h6 {
	font-size: 1.4rem;
	padding: 1.5rem 0 0;
}

.process ul li {
	justify-content: space-between;
	align-items: center;
}

.process ul li .ll {
	width: 50%;
	border-radius: 5px;
	overflow: hidden;
}

.process ul li .ll img {
	width: 100%;
	border-radius: 5px;
}

.process ul li .rr {
	width: 50%;
	padding: 0% 10%;
	box-sizing: border-box;
	position: relative;
}

.process ul li .title {
	margin-bottom: 3rem;
}

.process ul li p {
	margin: 1rem 0 0;
}

.process ul li:nth-of-type(2n) {
	flex-direction: row-reverse;
}

.process ul li:nth-of-type(2n) .rr {
	padding-left: 0;
}

.process ul li .tts {
	padding: 2rem 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	height: 8vh;
}

.process ul li .tts p {
	font-size: 1.4rem;
	opacity: 0.8;
}

.process ul li .tts .t2 {
	display: none;
}

.process ul li .imgs {
	height: 40vh;
	overflow-y: hidden;
	cursor: grab;
	margin: 2rem 0 0;
	box-sizing: border-box;
	padding-bottom: 20%;
}

.process ul li.lis .rr::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0%;
	width: 100%;
	height: 30%;
	background: linear-gradient(to top, rgba(255, 255, 255, 1) 15%, rgba(255, 255, 255, 0));
	z-index: 3;
}

.process ul li .imgs img {
	margin: 2vh auto;
}

.process2 .swiper-slide {
	position: relative;
	overflow: hidden;
}

.process2 .swiper-slide img {
	width: 100%;
}

.process2 .swiper-slide .tt {
	position: absolute;
	left: 0%;
	top: 0%;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	padding: 5% 10%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	opacity: 0;
	transition: all 0.5s linear;
}

.process2 .swiper-slide:hover .tt {
	opacity: 1;
}

.process2 .swiper-slide .tt p {
	font-size: 1.4rem;
	color: #fff;
	text-align: center;
}

.process2 .swiper-slide .tt p strong {
	display: block;
	color: #fff;
	font-size: 1.8rem;
	margin-bottom: 2rem;
}

.process2 .bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 5rem;
}

.process3 .swiper-slide {
	position: relative;

}

.process3 .swiper-slide .left {
	width: 100%;
	border-radius: 5px;
	overflow: hidden;
	background: var(--color);
}

.process3 .swiper-slide .left img {
	width: 100%;
	display: block;
	opacity: 0.9;
}

.process3 .swiper-slide .right {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 4;
	padding: 1rem 2rem;
	box-sizing: border-box;
}

.process3 .swiper-slide .right h3 {
	display: none;
}

.process3 .swiper-slide .right p {
	color: #fff;
	line-height: 1.4;
}

.process3 .swiper-pagination {
	position: static;
	display: flex;
	width: 50% !important;
	justify-content: center;
	margin: 5% auto 0;

}

.process3 .swiper-pagination span {
	display: block;
	background: none;
	width: inherit;
	height: inherit;
	text-align: center;
	font-size: 1.5rem;
	padding-top: 2rem;
	position: relative;
	opacity: 0.4 !important;
	transition: all 0.3s linear;
}

.process3 .swiper-pagination .swiper-pagination-bullet-active {
	opacity: 1 !important;
}

.process3 .swiper-pagination span::before {
	content: '';
	position: absolute;
	right: -49%;
	top: 2px;
	width: 94%;
	height: 1px;
	background: var(--color2);
}

.process3 .swiper-pagination span:last-of-type::before {
	display: none;
}

.process3 .swiper-pagination span::after {
	content: "";
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	top: -0;
	width: 5px;
	height: 5px;
	background: var(--color2);
	border-radius: 50%;
}

.process3 .swiper-pagination .swiper-pagination-bullet-active::after {
	opacity: 1;
}

.service ul li .rr {
	padding: 0 5% 0 8%;
}

.service ul li .rr a {
	display: block;
}

.service ul .li2 {
	flex-direction: initial !important;
	align-items: flex-start;
}

.service ul .li2 .bbs {
	width: 49%;
}

.service ul .li2 .ll {
	width: 100%;
}

.service ul .li2 .rr {
	width: 100%;
}

.service ul .li2 .title {
	margin: 2rem 0 1rem;
}

.service ul .li2 .rr p {
	margin: 0.5rem 0 0;
}

.service ul .li2 .rr p a {
	color: var(--color2);
	font-weight: 300;
}

.service ul li:nth-last-child(-n+2) .rr {
	text-align: center;
}

.contact .bar1 {
	display: flex;
	justify-content: space-between;
	background: #f6f6f6;
	border-radius: 5px;
	align-items: center;
	padding: 3rem;
	box-sizing: border-box;
}

.contact .bar1 .ll {
	padding: 3%;
	width: 46%;
	box-sizing: border-box;
}

.contact .title h3 {
	font-size: 4rem;
}

.contact .ll p {
	text-align: left;
}

.contact .bar1 .ll ul li {
	margin: 1.5rem 0;
}


.contact .bar1 .ll ul li p {
	margin: 0rem 0;
	display: flex;
}

.contact .bar1 .ll ul li p a {
	font-size: 1.6rem;
	margin-left: 4px;
	transition: all 0.5s ease;
}

.contact .bar1 .ll ul li p a:last-of-type {
	display: block;
}

.contact .bar1 .ll ul li p a:hover {
	color: var(--color);
}


.contact .bar1 .message {
	width: 60%;
	padding: 3% 4%;
	background: #fff;
	border-radius: 1rem;
	box-sizing: border-box;
}

.contact .bar1 .rr {
	width: 66%;
	overflow: hidden;
}

.contact .bar1 .rr img {
	width: 100%;
	border-radius: 5px;
	transition: all 0.8s ease;
}

.contact .bar1 .rr:hover img {
	transform: scale(1.06);
}


.contact2 {
	padding-top: 0 !important;
}

body.lock {
	overflow: hidden;
	height: 100vh;
}

.big_box {
	position: fixed;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	left: 0;
	top: 0;
	background: rgba(0, 0, 0, 0.8);
	z-index: 9999999999;
	display: none;
}

.big_box .big_bbs {
	position: fixed;
	max-height: 90vh;
	border-radius: 5px;
	left: 50%;
	top: 50%;
	background: #fff;
	transform: translate(-50%, -50%);
	-webkit-overflow-scrolling: touch;
	overflow-y: auto;
	user-select: none;
}

.big_imgss {
	height: 100%;
}

.big_box .big_imgss .tt2 {
	height: 100%;
	display: flex;
	justify-content: flex-end;
}

.big_box .big_imgss .tl {
	width: 50%;
	height: 90vh;
	position: sticky;
	left: 0;
	top: 0;
}

.big_box .big_imgss .tl img {
	display: block;
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.big_box .big_imgss .tr {
	width: 50%;
	padding: 5% 5%;
	box-sizing: border-box;

}

.big_box .big_imgss video {
	display: block;
	width: 100%;
	object-fit: cover;
	border-radius: 5px;
}

.big_box .big_imgss h6 {
	font-size: 2rem;
	font-weight: 500;
	margin-bottom: 2rem;
}

.big_box .big_imgss p {
	margin: 2rem 0;
}

.big_box .righttop {
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 9;
	padding: 2rem;
}

.big_box .righttop div {
	float: right;
	cursor: pointer;
}

.big_box .righttop img {
	margin: 0;
	height: 2rem;
	cursor: pointer;
	-webkit-transition: all 0.3s linear;
	transition: all 0.3s linear;
}

.big_box .righttop img:hover {
	transform: rotate(90deg);
}