* {
				margin: 0;
				padding: 0;
				box-sizing: border-box;
			}

			body {
				font-family: Arial, sans-serif;
				color: #333;
			}

			/* Part 1 */
			.part1 {
				height: 664px;
				background: linear-gradient(to right, white 87%, #a5dfa047);
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				background: url('../img/bg.jpg') no-repeat center center;
				background-size: cover;
			}

			.navbar {
				width: 100%;
				max-width: 1376px;
				height: 66px;
				margin: 0 auto;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 0 20px;
				border-radius: 40px;
				position: absolute;
				top: 4%;
				transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
				transition-duration: 300ms;
			}

			.logo {
				width: 140px;
				height: 40px;
				background: url('../img/logo.png') no-repeat center center;
				background-size: cover;
			}

			.nav-links {
				display: flex;
				gap: 20px;
			}

			.nav-links a {
				text-decoration: none;
				color: #333;
				font-size: 14px;
			}

			.content {
				width: 100%;
				max-width: 1280px;
				text-align: left;
				margin-top: 50px;
			}

			.content h1 {
				font-size: 40px;
				font-weight: bold;
				margin-bottom: 20px;

				-webkit-animation: heroEnter 0.433s 0.083s cubic-bezier(0.33, 0, 0.1, 0.99) both, fadeIn 0.2s 0.083s both;
				animation: heroEnter 0.433s 0.083s cubic-bezier(0.33, 0, 0.1, 0.99) both, fadeIn 0.2s 0.083s both;
			}

			.content p {
				font-size: 18px;
				line-height: 1.5;
				-webkit-animation: heroEnter 0.433s 0.083s cubic-bezier(0.33, 0, 0.1, 0.99) both, fadeIn 0.2s 0.083s both;
				animation: heroEnter 0.433s 0.083s cubic-bezier(0.33, 0, 0.1, 0.99) both, fadeIn 0.2s 0.083s both;
			}

			/* Part 2 */
			.part2 {
				background-color: white;
				padding: 20px;
				height: 464px;
				padding-top: 80px;
			}

			.section {
				max-width: 1280px;
				margin: 0 auto;
				/* display: flex; */
				text-align: center;
				flex-wrap: wrap;
				gap: 20px;

			}

			.section-left {
				flex: 2;
				font-size: 40px;
				font-weight: bold;
				-webkit-animation: fadeIn 0.133s 0.4s both;
				animation: fadeIn 0.133s 0.4s both;
			}

			.section-right {
				flex: 3;
				display: flex;
				gap: 20px;
				margin-top: 70px;
				-webkit-animation: fadeIn 0.133s 0.4s both;
				animation: fadeIn 0.133s 0.4s both;
			}

			.feature {
				flex: 1 1 calc(50% - 10px);
				padding: 10px;
				text-align: left;
				transition: transform 0.2s ease;
			}

			.feature:hover {
				animation: floatUp 0.3s ease;
			}

			.feature h3 {
				font-size: 18px;
				font-weight: bold;
				margin-bottom: 5px;
				margin-top: 10px;
			}

			.feature p {
				font-size: 14px;

			}

			@media (max-width: 768px) {
				.section {
					flex-direction: column;
				}

				.section-left,
				.section-right {
					flex: 1 1 100%;
				}

				.content h1 {
					font-size: 36px;
				}

				.content p {
					font-size: 16px;
				}

				.section-left {
					font-size: 36px;
				}

				.section-right {
					flex-wrap: wrap;
					gap: 10px;
					margin-top: 30px;
				}
			}

			@media (max-width: 400px) {


				.content h1 {
					font-size: 26px;
				}

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

				.section-left {
					font-size: 24px;
				}
			}

			/* Part 3 */
			.part3 {
				background-color: #086017;
				color: white;
				padding: 20px;
				text-align: left;
				height: 378px;
				padding-top: 80px;
			}

			.part3 h1 {
				font-size: 40px;
				-webkit-animation: scaleDownIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both, fadeIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both;
				animation: scaleDownIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both, fadeIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both;
			}

			.part3 p {
				margin-top: 15px;
				font-size: 14px;
				color: #eee;
				-webkit-animation: scaleDownIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both, fadeIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both;
				animation: scaleDownIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both, fadeIn 0.3s 0.083s cubic-bezier(0.33, 0, 0.42, 1) both;
			}

			.contact-section {
				max-width: 1280px;
				margin: 0 auto;
				gap: 20px;


			}

			.contact {
				display: flex;
				justify-content: center;
				margin-top: 40px;
			}

			.contact-info {
				flex: 1 1 calc(50% - 10px);
				padding: 10px;
				border-radius: 8px;
				display: flex;
				gap: 20px;
			}

			.contact_concent {
				color: #eee;
				font-size: 15px;
			}

			@media (max-width: 768px) {
				.contact-section {
					flex-direction: column;
				}

				.contact-info {
					flex: 1 1 100%;
				}
			}

			.nav_button {
				display: flex;
				margin-top: 5%;
				gap: 20px;
				text-align: center;
				justify-content: left;
				-webkit-animation: heroEnter 0.433s 0.083s cubic-bezier(0.33, 0, 0.1, 0.99) both, fadeIn 0.2s 0.083s both;
				animation: heroEnter 0.433s 0.083s cubic-bezier(0.33, 0, 0.1, 0.99) both, fadeIn 0.2s 0.083s both;

			}

			.nav_button div {
				width: 120px;
				height: 38px;
				background-color: #086017;
				border-radius: 20px;
				font-size: 15px;
				color: #fff;
				line-height: 38px;
				cursor: pointer;
				border: 1px solid #ddd;
				transition: transform 0.2s ease;
			}


			.nav_button div:hover {
				animation: floatUp 0.3s ease;
			}

			@keyframes floatUp {
				0% {
					transform: translateY(0);
					/* 初始位置 */
				}

				50% {
					transform: translateY(-10px);
					/* 向上移动 10px */
				}

				100% {
					transform: translateY(0);
					/* 回到初始位置 */
				}
			}

			.bottom_tips {
				text-align: center;
			}

			.part4 {
				background-color: #ebffe8;
				height: 200px;
				line-height: 200px;
			}

			@-webkit-keyframes fadeIn {
				0% {
					opacity: 0;
				}

				100% {
					opacity: 1;
				}
			}

			@-moz-keyframes fadeIn {
				0% {
					opacity: 0;
				}

				100% {
					opacity: 1;
				}
			}

			@-ms-keyframes fadeIn {
				0% {
					opacity: 0;
				}

				100% {
					opacity: 1;
				}
			}

			@-o-keyframes fadeIn {
				0% {
					opacity: 0;
				}

				100% {
					opacity: 1;
				}
			}

			@keyframes fadeIn {
				0% {
					opacity: 0;
				}

				100% {
					opacity: 1;
				}
			}

			@-webkit-keyframes fadeOut {
				0% {
					opacity: 1;
				}

				100% {
					opacity: 0;
				}
			}

			@-moz-keyframes fadeOut {
				0% {
					opacity: 1;
				}

				100% {
					opacity: 0;
				}
			}

			@-ms-keyframes fadeOut {
				0% {
					opacity: 1;
				}

				100% {
					opacity: 0;
				}
			}

			@-o-keyframes fadeOut {
				0% {
					opacity: 1;
				}

				100% {
					opacity: 0;
				}
			}

			@keyframes fadeOut {
				0% {
					opacity: 1;
				}

				100% {
					opacity: 0;
				}
			}

			@-webkit-keyframes scaleUpIn {
				0% {
					-webkit-transform: scale(0.75);
					transform: scale(0.75);
				}

				100% {
					-webkit-transform: scale(1);
					transform: scale(1);
				}
			}

			@-moz-keyframes scaleUpIn {
				0% {
					transform: scale(0.75);
				}

				100% {
					transform: scale(1);
				}
			}

			@-ms-keyframes scaleUpIn {
				0% {
					transform: scale(0.75);
				}

				100% {
					transform: scale(1);
				}
			}

			@-o-keyframes scaleUpIn {
				0% {
					transform: scale(0.75);
				}

				100% {
					transform: scale(1);
				}
			}

			@keyframes scaleUpIn {
				0% {
					-webkit-transform: scale(0.75);
					transform: scale(0.75);
				}

				100% {
					-webkit-transform: scale(1);
					transform: scale(1);
				}
			}

			@-webkit-keyframes scaleDownIn {
				0% {
					-webkit-transform: scale(1.5);
					transform: scale(1.5);
				}

				100% {
					-webkit-transform: scale(1);
					transform: scale(1);
				}
			}

			@-moz-keyframes scaleDownIn {
				0% {
					transform: scale(1.5);
				}

				100% {
					transform: scale(1);
				}
			}

			@-ms-keyframes scaleDownIn {
				0% {
					transform: scale(1.5);
				}

				100% {
					transform: scale(1);
				}
			}

			@-o-keyframes scaleDownIn {
				0% {
					transform: scale(1.5);
				}

				100% {
					transform: scale(1);
				}
			}

			@keyframes scaleDownIn {
				0% {
					-webkit-transform: scale(1.5);
					transform: scale(1.5);
				}

				100% {
					-webkit-transform: scale(1);
					transform: scale(1);
				}
			}

			@-webkit-keyframes heroEnter {
				0% {
					-webkit-transform: translate(1.46rem, 0);
					transform: translate(1.46rem, 0);
				}

				100% {
					-webkit-transform: translate(0, 0);
					transform: translate(0, 0);
				}
			}

			@-moz-keyframes heroEnter {
				0% {
					transform: translate(1.46rem, 0);
				}

				100% {
					transform: translate(0, 0);
				}
			}

			@-ms-keyframes heroEnter {
				0% {
					transform: translate(1.46rem, 0);
				}

				100% {
					transform: translate(0, 0);
				}
			}

			@-o-keyframes heroEnter {
				0% {
					transform: translate(1.46rem, 0);
				}

				100% {
					transform: translate(0, 0);
				}
			}

			@keyframes heroEnter {
				0% {
					-webkit-transform: translate(1.46rem, 0);
					transform: translate(1.46rem, 0);
				}

				100% {
					-webkit-transform: translate(0, 0);
					transform: translate(0, 0);
				}
			}

			@-webkit-keyframes heroLeave {
				0% {
					-webkit-transform: translate(0, 0);
					transform: translate(0, 0);
				}

				100% {
					-webkit-transform: translate(-1.46rem, 0);
					transform: translate(-1.46rem, 0);
				}
			}

			@-moz-keyframes heroLeave {
				0% {
					transform: translate(0, 0);
				}

				100% {
					transform: translate(-1.46rem, 0);
				}
			}

			@-ms-keyframes heroLeave {
				0% {
					transform: translate(0, 0);
				}

				100% {
					transform: translate(-1.46rem, 0);
				}
			}

			@-o-keyframes heroLeave {
				0% {
					transform: translate(0, 0);
				}

				100% {
					transform: translate(-1.46rem, 0);
				}
			}

			@keyframes heroLeave {
				0% {
					-webkit-transform: translate(0, 0);
					transform: translate(0, 0);
				}

				100% {
					-webkit-transform: translate(-1.46rem, 0);
					transform: translate(-1.46rem, 0);
				}
			}

			@-webkit-keyframes btn-audio-anim {
				0% {
					background-position: 0 0;
				}

				25% {
					background-position: -0.16rem 0;
				}

				50% {
					background-position: 0 -0.2rem;
				}

				75% {
					background-position: -0.16rem -0.2rem;
				}

				100% {
					background-position: 0 0;
				}
			}

			@-moz-keyframes btn-audio-anim {
				0% {
					background-position: 0 0;
				}

				25% {
					background-position: -0.16rem 0;
				}

				50% {
					background-position: 0 -0.2rem;
				}

				75% {
					background-position: -0.16rem -0.2rem;
				}

				100% {
					background-position: 0 0;
				}
			}

			@-ms-keyframes btn-audio-anim {
				0% {
					background-position: 0 0;
				}

				25% {
					background-position: -0.16rem 0;
				}

				50% {
					background-position: 0 -0.2rem;
				}

				75% {
					background-position: -0.16rem -0.2rem;
				}

				100% {
					background-position: 0 0;
				}
			}

			@-o-keyframes btn-audio-anim {
				0% {
					background-position: 0 0;
				}

				25% {
					background-position: -0.16rem 0;
				}

				50% {
					background-position: 0 -0.2rem;
				}

				75% {
					background-position: -0.16rem -0.2rem;
				}

				100% {
					background-position: 0 0;
				}
			}

			@keyframes btn-audio-anim {
				0% {
					background-position: 0 0;
				}

				25% {
					background-position: -0.16rem 0;
				}

				50% {
					background-position: 0 -0.2rem;
				}

				75% {
					background-position: -0.16rem -0.2rem;
				}

				100% {
					background-position: 0 0;
				}
			}