* {
	margin: 0;
	padding: 0;
	border-width: 0;
}

ul li {
	list-style: none;
	margin: 0;
	padding: 0;
}

body {
	position: static;
	width: 100%;
	height: 100%;
	text-align: left;
}

.w {
	width: 180rem;
	margin: auto;
}

.header {
	width: 192rem;
	position: absolute;
	margin: 2.5rem auto;
	z-index: 999;
}

.top_logo {
	float: left;
	margin-left: 10rem;
	height: auto;
}

.top_logo_img {
	width: 17.5rem;
	height: auto;
}

.nav {
	float: right;
	margin-right: 10rem;
	margin-top: 4rem;
	padding: 1rem 0;
	border-radius: 1.5rem;
	background-color: rgba(0, 0, 0, 0.1);
}

.nav ul li {
	float: left;
}

.nav ul li a {
	display: block;
	height: 4.2rem;
	padding: 0 3rem;
	line-height: 4.2rem;
	font-size: clamp(10px,1.8rem,50px);
	color: #fff;
	text-decoration: none;
}

.nav ul li .change {
	color: red;
}

.box1 {
	position: relative;
	width: 100%;
	height: 80rem;
}

.slider {
	position: relative;
	width: 100%;
	height: 40vw;
}

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

.screen {
	position: absolute;
	width: 100%;
	top: 32vw;
	display: flex;
}

.screenleft_img {
	width: 50%;
	height: auto;
}

.screenright_img {
	width: 50%;
	height: auto;
}

.img_1 {
	position: absolute;
	left: 130rem;
	top: 30rem;
	width: 10rem;
	height: 5rem;
}

.sidebar {
	border-radius: 2.5rem;
	right: 0;
	top: clamp(200px,10rem,1200px);
	width: 7.5rem;
	height: 70rem;
	position: absolute;
	float: right;
	background-color: rgba(13, 113, 154, 0.1);
	z-index: 999;
}

.sidebar1 {
	width: 7.5rem;
	height: 7.5rem;
	position: relative;
	cursor: pointer;
}

.service_img {
	position: absolute;
	width: 7.5rem;
	height: 7.5rem;
}

.details1 {
	position: relative;
	width: 20rem;
	margin-left: -20rem;
	background-color: #bdbaba;
	font-size: clamp(6px,1.8rem,50px);
	font-family: 'Arial Normal', 'Arial';
	font-style: normal;
}

.hide {
	display: none;
}

.show {
	display: block;
}

.sidebar2 {
	top: 7.5rem;
	width: 7.5rem;
	height: 7.5rem;
	position: relative;
	cursor: pointer;
}

.miniprogram_img {
	position: absolute;
	width: 7.5rem;
	height: 7.5rem;
}

.details2 {
	position: relative;
	width: 20rem;
	margin-left: -20rem;
}

.appletviewer_img {
	width: 100%;
	height: 100%;
}

.sidebar3 {
	top: 15rem;
	width: 7.5rem;
	height: 7.5rem;
	position: relative;
	cursor: pointer;
}

.wechat_img {
	position: absolute;
	width: 7.5rem;
	height: 7.5rem;
}

.details3 {
	position: relative;
	width: 20rem;
	margin-left: -20rem;
}

.official_img {
	width: 100%;
	height: 100%;
}

.sidebar4 {
	top: 22.5rem;
	width: 7.5rem;
	height: 7.5rem;
	position: relative;
	cursor: pointer;
}

.android_img {
	position: absolute;
	width: 7.5rem;
	height: 7.5rem;
}

.details4 {
	position: relative;
	width: 20rem;
	margin-left: -20rem;
	background-color: #bdbaba;
	font-size: clamp(8px,1.8rem,50px);
	font-family: 'Arial Normal', 'Arial';
	font-style: normal;
}

.sidebar5 {
	top: 30rem;
	width: 7.5rem;
	height: 7.5rem;
	position: relative;
	cursor: pointer;
}

.apple_img {
	position: absolute;
	width: 7.5rem;
	height: 7.5rem;
}

.details5 {
	position: relative;
	width: 20rem;
	margin-left: -20rem;
	background-color: #bdbaba;
	font-size: clamp(8px,1.8rem,50px);
	font-family: 'Arial Normal', 'Arial';
	font-style: normal;
}

.tagline1 {
	width: 50%;
	height: 55rem;
}

.text1 {
	position: absolute;
	font-size: clamp(12px,5rem,50px);
	color: rgb(51, 204, 0);
	font-weight: 700;
	top: 90rem;
	left: 75rem;
}

.img_2 {
	position: absolute;
	left: 100rem;
	top: 85rem;
	width: 78rem;
	height: auto;
}

.text2 {
	position: absolute;
	font-size: clamp(7px,2.8rem,50px);
	color: rgb(102, 102, 102);
	font-weight: 700;
	top: 100rem;
	width: 85rem;
	left: 10rem;
}

.tagline2 {
	width: 100%;
	height: 20rem;
	background-color: rgb(255, 130, 0);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.text3 {
	font-size: clamp(12px,5rem,50px);
	color: #fff;
}

.text4 {
	font-size: clamp(8px,2.8rem,50px);
	color: rgb(102, 102, 102);
	text-align: center;
}

.kind1 ul {
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-top: 5rem;
}

.img_3 {
	width: 20rem;
	height: auto;
}

.text5 {
	font-size: clamp(10px,3.2rem,50px);
	color: rgb(242, 150, 0);
}

.kind2 {
	position: relative;
	margin-top: 10rem;
	width: 100%;
}

.img_4 {
	width: 100%;
	height: 59rem;
}

.text6 {
	position: absolute;
	font-size: clamp(14px,5rem,50px);
	color: #fff;
	left: 80rem;
	top: 20rem;
	z-index: 1;
}

.text7 {
	position: absolute;
	font-size: clamp(14px,5rem,50px);
	color: rgb(255, 153, 0);
	left: 65rem;
	top: 35rem;
	z-index: 1;
}

.bottom {
	width: 192rem;
	height: 15rem;
	background-color: #71B604;
	margin-top: 5rem;
	bottom: 0;
}

.bottom_left {
	float: left;
	height: 15rem;
	width: 15rem;
	margin-left: 10rem;
}

.bottom_logo {
	text-align: center;
	font-size: clamp(6px,1.8rem,50px);
}

.bottom_logo_img {
	width: 15rem;
	height: auto;
}

.bottom_right {
	float: left;
	margin-left: 10rem;
}

.bottom_text2 {
	width: clamp(200px,60rem,1200px);
	font-size: clamp(6px,1.8rem,50px);
}

.bottom_text3 {
	width: clamp(100px,12.5rem,600px);
	font-size: clamp(8px,2.8rem,50px);
	cursor: pointer;
}

.details6 {
	background-color: #fff;
	margin-left: 15rem;
	margin-top: -3.5rem;
	width: clamp(38px,15rem,200px);
	font-size: clamp(8px,2.8rem,50px);
	font-family: 'Arial Normal', 'Arial';
	font-style: normal;
}