body{
		width: 100%;
	}
	p{
		font-size: 1.5rem;
		letter-spacing: 1px;
	}

	#index_intro{
		display: flex;
		justify-content: center;
		align-items: flex-start;
		flex-wrap: wrap;
		gap: 2rem;
		margin-top: 8vh;
		height: auto;
		position: relative;
	}
	#index_intro_left{
		position: relative;
		width: 45rem; /* 固定宽度 */
		max-width: 45vw;
		height: 51rem;
		margin-top:3rem;
		float: none;
	}
	#index_intro_left_words{
		width:100%;
		height:10.8rem;
		display: block;
		position:relative;
		padding-top: 8rem;
		overflow: hidden;
		transition:.8s;
	}
	#index_intro_left_words:hover{
		padding-top:0rem;
		height: 45rem;
	}
	#index_intro_left_words p{
		margin-top: 0px;
		margin-bottom: 12px;
	}
	.index_intro_left_words_sub{
		padding-left: 18px;
	}
	.index_intro_left_words_sub p{
		font-size: 1.2rem;
		opacity: .6;
	}
	.index_intro_left_words_sub a{
		font-size: 1.2rem;
		opacity: .6;
		transition:font-weight 0.8s ease, opacity 0.8s ease;
	}
	.index_intro_left_words_sub a:hover{
		font-weight: 500;
		opacity: .8;
	}
	.index_intro_left_words_sub p, a{
		display: inline;  /* 让 p 和 a 元素保持在同一行 */
	}
	#index_intro_left_words_down{
		/*opacity:0;*/
		margin-left: 18px;
		font-size: 0.8rem;
		padding-top: .8rem;
		/*padding-left: 1.2rem;*/
		transition:.8s;
		}
	#index_intro_left_words_down:hover{
		opacity:.75;
	}
	.index_intro_left_words_down_sub{
		/*padding-left: 18px;*/
		font-size: 1.2rem;
		opacity: .6;
	}
	.index_intro_left_words_down_sub p{
		/*padding-left: 36px;*/
		font-size: 1rem;
	}
	#index_intro_left_words_about_me {
		transition:.8s ease-in-out;
		opacity: .5;
		font-weight: 400;
	}
	#index_intro_left_words_about_me:hover {
		opacity: .8;
		font-weight: 500;
	}
	#index_intro_left_jump{
		margin-top: 2rem;
		bottom: 2rem;
		height: 2.5rem;
		overflow: hidden;
		position: absolute;
		transition:.8s;
	}
	#index_intro_left_jump:hover{
		height: 2.6rem;
	}
	.jump_to{
		width:5rem;
		margin-right: 18px;
		padding:.7rem 0;
		display: block;
		position: relative;
		text-align: center;
		float: left;
		font-weight: bold;
		font-family: 'New Cycle', sans-serif;
		font-size: 1rem;
		opacity: .4;
	}
	.jump_to_words{
		width:75%;
		display: block;
		float: left;
		position:relative;
	}
	.jump_words_row{
		width:49.6%;
		display: block;
		float: left;
		position: relative;

	}
	.jump_words_row2{
		padding-left: 1.2rem;
	}
	.jump_word{
		width:100%;
		display: block;
		float: left;
		position: relative;
		font-family: 'New Cycle', sans-serif;
		font-size: 1rem;
		height: 1.2rem;
		opacity: .2;
		cursor: pointer;
		transition: .8s;
	}
	.jump_word:hover{
		opacity: 1;
		font-size: 1.02rem;
		font-weight: 500;
	}

	/*__index intro slides__________________________________________*/
	#index_intro_right{
		position: relative;
		width: 45rem; /* 固定宽度 */
		height: 32rem;
		overflow: hidden;
		margin-top:3rem;
		opacity: .6;
		filter:  grayscale(100%);
		transition: filter 0.3s ease, opacity 0.5s ease, height 0.8s ease;

	}
	#index_intro_right:hover{
		opacity: 1;
		filter: grayscale(0%);
		height: 51rem;
	}
	.one_indexslide{
		width: 100%;
	}

	.index_slide_img{
		width:100%;
		height: 100%;
	}
	.button_left, .button_right {
		cursor: pointer;
		position:absolute;
		top:15rem;
		width:auto;
		padding:16px;
		margin-top: -30px;
		color:white;
		font-weight: bold;
		text-align: center;
		font-size:1.6rem;
		transition:.6s ease;
		border: 0;
		border-radius: 0 6px 6px 0;
		background-color: rgba(0,0,0,.36);
	}
	.button_right{
		right:0;
		border-radius: 6px 0 0 6px;
	}
	.button_left:hover, .button_right:hover{
		background-color: rgba(0,0,0,.8);
	}
	.index_slide_num{
		color:#f2f2f2;
		font-size: 1rem;
		padding:8px 12px;
		position: absolute;
		top:0;
		font-family: 'New Cycle', sans-serif;
		opacity: .8;
	}
	.index_slide_text{
		color:#f2f2f2;
		background-color: rgba(0,0,0,.5);
		font-size: 1.2rem;
		padding:8px 0px;
		position: absolute;
		top:29.1rem;
		width:100%;
		text-align: center;
		font-family: 'New Cycle', sans-serif;
		opacity:.8;
		letter-spacing:.5px;
		font-weight: lighter;
	}
	.one_indexslide_description{
		margin-top:1rem;
		font-size: 1.2rem;
		opacity: .8;
	}

	/*__index content__________________________________________*/
	.clearfix{
		height: auto;
	}

	.clearfix::after {
	    content: "";
	    display: table;
	    clear: both;
	}
	#verticle_line_perception{
		height: 50rem;
	}
	#index_content_perception{
		height: 56rem;
	}
	#verticle_line_interaction{
		height: 40rem;
	}
	#index_content_interaction{
		height: 46rem;
	}
	#verticle_line_construction{
		height: 50rem;
	}
	#index_content_construction{
		height: 56rem;
	}
	#verticle_line_planning{
		height: 50rem;
	}
	#index_content_planning{
		height: 56rem;
	}
	#verticle_line_fun{
		height: 46rem;
	}
	#index_content_fun{
		height: 52rem;
	}
	#verticle_line_future{
		height: 21rem;
	}
	#index_content_future{
		height: 36rem;
	}
	.index_title{
		position: relative;
		padding-top: .4rem;
		margin-bottom: 6px;
		height: 3rem;
		width: 100%;
		font-size: 2rem;
		text-align: center;
		font-family: 'New Cycle', sans-serif;
		color: rgba(0,0,0,.7);
		letter-spacing: 1px;
		overflow: hidden;
		transition:.8s;
	}
	.index_title:hover{
		height: 3.2rem;
		padding-top: 0;
	}
	.index_title_chinese{
		font-size: .8rem;
		opacity: .0;
		transition:.8s;
	}
	/*.index_title:hover > .index_title_chinese{*/
	/*	opacity: .8;*/
	/*}*/
	.index_quote {
		text-align: center;
		font-size: 1.5rem;
		font-family: 'New Cycle', sans-serif;
		margin-top: .5rem;
		margin-bottom: 1rem;
		color: rgba(0,0,0,.7);
	}
	.arrow_line{
		position: absolute;
		margin-left: 50%;
		transform: translateX(-5px); /* 向右移动6px，即使它距离中间线6px */
	}
	.circle_line{
		margin:0 auto;
		width: 10px;
		height: 10px;
		background-color: rgba(0,0,0,.7);
		border-radius: 5px;
	}
	.verticle_line{
		margin:0 auto 40px;
		padding-top: 10px;
		width: 1px;
		height: 3rem;
		background-color: rgba(0,0,0,.7);
	}
	.index_content_left_right{
		padding-top: 2rem;
	}
	.index_content_left {
		position: absolute;
		width: 39rem;
		right: 50%;
		transform: translateX(-0.6rem); /* 向右移动6px，即使它距离中间线6px */
		margin-left: 4%;
		margin-top: 2.5rem;
		margin-bottom: 7.5rem;
	}
	.index_content_left h3{
		opacity: .8;
	}
	.index_content_left ul{
		list-style-type: none;
		font-family: 'New Cycle', sans-serif;
		font-size: 1.2rem;
		margin-top:.5rem;
		margin-bottom: 0;
		padding-left: 1.4rem;
		opacity: .8
	}
	.index_content_left_title {
		margin-top: 1.2rem;
		margin-bottom: 0;
	}
	.index_content_left_title strong{
		opacity: .7;
	}
	.index_content_left_title ul{
		overflow: hidden;
		height: 0;
		margin-top: .2rem;
		transition:1.8s;
		/*transition-delay: 1.6s;*/
		transition-timing-function: ease-out; 
	}
	.index_content_left_title:hover > ul{
		height: 13.5rem;
	}
	.index_content_left ol{
		list-style-type: none;
		font-family: 'New Cycle', sans-serif;
		font-size: 1.2rem;
		margin-top:.5rem;
		margin-bottom: 0;
		padding-left: 1.4rem;
		opacity: .8
	}
	.index_content_left_title ol{
		overflow: hidden;
		height: 0;
		margin-top: .2rem;
		transition:1.2s;
		/*transition-delay: 1.6s;*/
		transition-timing-function: ease-out; 
	}
	.index_content_left_title:hover > ol{
		height: 10.5rem;
	}

	.index_content_left_L h3{
		opacity: .8;
	}
	.index_content_left_L ul{
		list-style-type: none;
		font-family: 'New Cycle', sans-serif;
		font-size: 1.2rem;
		margin-top:.5rem;
		padding-left: 1.4rem;
		opacity: 0;
		transition: .8s;
	}
	.index_content_left_L{
		width: 60%;
		float: left;
		margin-top: 2rem;
		transition: .8s;
	}
	.index_content_left_L:hover{
		margin-top: 0;
	}
	.index_content_left_L:hover >ul{
		opacity: .8;
	}

	.index_content_left_R{
		width: 36%;
		float: right;
	}
	.index_content_img {
		width: 100%;
		filter:  grayscale(100%);
		transition: filter 0.3s ease;
	}
	.index_content_right {
		position: absolute;
		width: 39rem;
		left: 50%;
		transform: translateX(0.6rem); /* 向右移动6px，即使它距离中间线6px */
		margin-left: 4%;
		margin-top: 2.5rem;
		margin-bottom: 7.5rem;
	}
	.index_content_right_imgs{
		position: absolute;
		width: 39rem;
		left: 50%;
		transform: translateX(0.9rem); /* 向右移动6px，即使它距离中间线6px */float:right;
		margin-right: 6%;
		margin-top: 4.5rem;
		padding-top: 1.2rem;
		margin-bottom: 7.5rem;
	}
	.index_content_right_imgs img{
		width: 100%;
	}
	.index_content_right_img{
		position: absolute;
		width: inherit;
		filter:  grayscale(100%);
		transition: filter 0.3s ease;
	}
	.fun_project_flexbox {
		 display: flex;
		 justify-content: center; /* 水平居中 */
		 align-items: center; /* 垂直居中 */
		 width: 80rem; /* 设置容器宽度 */
		 margin: 0 auto; /* 居中容器 */
		 transform: translateX(-0.2%); /* 整体向左偏移 0.1rem */
		 flex-wrap: wrap; /* 允许元素换行 */
		 gap: 1.5rem; /* 元素间的间距 */
	 }

	.fun_project_flexbox_item {
		width: 22.5%; /* 每个元素占据 23% 宽度 */
		margin-top: 2.5rem;
		position: relative; /* 为子元素的绝对定位提供参考 */
	}

	.fun_project_flexbox_item_text {
		position: absolute; /* 使文字定位在图片上层 */
		top: 50%; /* 垂直居中 */
		left: 50%; /* 水平居中 */
		transform: translate(-50%, -50%); /* 精确居中 */
		font-size: 1rem;
		text-align: center;
		opacity: 0; /* 初始时隐藏文字 */
		z-index: 10;
		width: 90%; /* 限制文字宽度，避免超出 */
		word-wrap: break-word; /* 强制长单词换行 */
		overflow-wrap: break-word; /* 兼容不同浏览器 */
		transition: opacity 0.6s ease; /* 文字的过渡效果 */
	}
	.fun_project_flexbox_item_text ul{
		padding-left: 0;
	}
	.fun_project_flexbox_item_text li{
		list-style-type: none;
		padding-bottom: .5rem;
	}
	.fun_project_flexbox_item_img img {
		width: 100%; /* 图片宽度自适应 */
		height: auto;
		display: block; /* 避免图片下方有空白 */
		transition: filter 0.3s ease, opacity 0.6s ease; /* 图片透明度的过渡 */
	}

	.fun_project_flexbox_item:hover img {
		opacity: 0.2; /* 鼠标悬停时图片透明度降低 */
	}

	.fun_project_flexbox_item:hover .fun_project_flexbox_item_text {
		opacity: 1; /* 鼠标悬停时显示文字 */
	}

	#content_img_101, #content_img_201, #content_img_301, #content_img_401, #content_img_501, #content_img_601, #content_img_701 {
		margin-top: 0;
		margin-left: 0;
		opacity: 1;
		z-index: -1;
		transition: filter 0.8s ease, opacity 1.6s, margin-left 1.6s;
	}
	#content_img_102, #content_img_202, #content_img_302, #content_img_402, #content_img_502, #content_img_602, #content_img_702 {
		margin-top: 3rem;
		margin-left: -40%;
		opacity: 0;
		z-index: -1;
		transition: filter 0.8s ease, opacity 1.6s, margin-left 1.6s;
	}
	#content_img_103, #content_img_203, #content_img_303, #content_img_403, #content_img_503, #content_img_603, #content_img_703{
		margin-top: 6rem;
		margin-left: -40%;
		opacity: 0;
		z-index: -1;
		transition: filter 0.8s ease, opacity 1.6s, margin-left 1.6s;
	}
	#content_img_104, #content_img_204, #content_img_304, #content_img_404, #content_img_504, #content_img_604, #content_img_704{
		margin-top: 9rem;
		margin-left: -40%;
		opacity: 0;
		z-index: -1;
		transition: filter 0.8s ease, opacity 1.6s, margin-left 1.6s;
	}
	#content_img_105, #content_img_205, #content_img_305, #content_img_405, #content_img_505, #content_img_605, #content_img_705{
		margin-top: 12rem;
		margin-left: -40%;
		opacity: 0;
		z-index: -1;
		transition: filter 0.8s ease, opacity 1.6s, margin-left 1.6s;
	}
	#content_img_106, #content_img_206, #content_img_306, #content_img_406, #content_img_506, #content_img_606, #content_img_706{
		margin-top: 15rem;
		margin-left: -40%;
		opacity: 0;
		z-index: -1;
		transition: filter 0.8s ease, opacity 1.6s, margin-left 1.6s;
	}
	
	footer{
		text-align: center;
	}


/* #### Desktops 1200-1500px #### */
@media screen and (min-width: 1200px) and (max-width: 1500px) {
	#index_intro{
		margin-top: 3vh;
		height: 42rem;
	}
	#index_intro_left{
		width: 35rem; /* 固定宽度 */
		height: 36rem;
		margin-top:0rem;
	}
	#index_intro_right{
		width: 36rem; /* 固定宽度 */
		height: 25.5rem;
		margin-top:1.2rem;
	}
	.button_left, .button_right {
		top:13rem;
	}
	.index_slide_text{
		font-size: 1.2rem;
		top:22.8rem;
	}
	#index_intro_left_words{
		padding-top: 5rem;
		height: 9.6rem;
	}
	#index_intro_left_words:hover{
		height: 32rem;
	}
	#index_intro_left_words p{
		font-size: 1.2rem;
	}
	#index_intro_left_words a{
		font-size: 1.2rem;
	}
	#index_intro_left_words_about_me a{
		font-size: .8rem;
	}
	.index_intro_left_words_sub{
		padding-left: 0px;
	}
	#index_intro_left_words_down {
		padding-top: 0;
	}
	#index_intro_left_words_down p{
		font-size: .8rem;
		letter-spacing: 0px;
		margin-bottom: 0.3rem;
	}
	.one_indexslide_description{
		margin-top:.3rem;
		font-size: 1rem;
	}
	#index_intro_left_jump {
		bottom: 1.5rem;
	}
	.jump_to{
		margin-left: -.9rem;
		font-size: .8rem;
	}
	.jump_word{
		font-size: .8rem;
	}
	.jump_word:hover{
		font-size: .82rem;
	}
	.index_content_left {
		width: 34rem;
		right: 50%;
		transform: translateX(-0.6rem); /* 向右移动6px，即使它距离中间线6px */
		margin-left: 4%;
		margin-top:.5rem;
		margin-bottom: 7.5rem;
	}
	.index_title{
		font-size: 1.5rem;
		height: 1.8rem;
	}
	.index_title:hover{
		height: 1.8rem;
	}
	.index_quote {
		font-size: 1.2rem;
	}
	.index_content_left h3{
		font-size: 1.2rem;
	}
	.index_content_left ul{
		font-size: 1rem;
	}
	.index_content_right_imgs{
		transform: translateX(0.6rem); /* 向右移动6px，即使它距离中间线6px */
		width: 34.8rem;
		margin-top: .5rem;
	}
	.fun_project_flexbox{
		width: 100%;
		transform: translateX(-0.06rem); /* 向右移动6px，即使它距离中间线6px */
	}
	.fun_project_flexbox_item_text ul{
		padding-left: 0;
	}
	.fun_project_flexbox_item_text li{
		list-style-type: none;
		padding-bottom: .5rem;
	}

	#verticle_line_perception{
		height: 35rem;
	}
	#index_content_perception{
		height: 41rem;
	}
	#verticle_line_interaction{
		height: 38rem;
	}
	#index_content_interaction{
		height: 44rem;
	}
	#verticle_line_construction{
		height: 38rem;
	}
	#index_content_construction{
		height: 44rem;
	}
	#verticle_line_planning{
		height: 38rem;
	}
	#index_content_planning{
		height: 44rem;
	}
	#verticle_line_fun{
		height: 52rem;
	}
	#index_content_fun{
		height: 58rem;
	}
	#verticle_line_future{
		height: 21rem;
	}
	#index_content_future{
		height: 36rem;
	}
}

/* #### Desktops 920-1199px #### */
@media screen and (min-width: 0px) and (max-width: 1199px) {
	#index_intro{
		margin-top: 3vh;
		height: auto;
	}
	#index_intro_left{
		width: 80vw; /* 固定宽度 */
		max-width: 80vw;
		height: 36rem;
		margin-top:0rem;
	}
	#index_intro_right{
		width: 80vw; /* 固定宽度 */
		height: auto;
		margin-top:1.2rem;
	}
	.button_left, .button_right {
		top:7rem;
		font-size: 1rem;
	}
	.index_slide_text{
		font-size: 1rem;
		top:50vw;
	}
	#index_intro_left_words{
		padding-top: 5rem;
		height: 9.6rem;
	}
	#index_intro_left_words:hover{
		height: 32rem;
	}
	#index_intro_left_words p{
		font-size: 1.2rem;
	}
	#index_intro_left_words a{
		font-size: 1.2rem;
	}
	.index_intro_left_words_sub{
		padding-left: 0px;
	}
	#index_intro_left_words_down {
		padding-top: 0;
	}
	#index_intro_left_words_down p{
		font-size: .8rem;
		letter-spacing: 0px;
		margin-bottom: 0.3rem;
	}
	#index_intro_left_words_about_me a{
		font-size: .8rem;
	}
	.one_indexslide_description{
		margin-top:.3rem;
		font-size: 1rem;
	}
	#index_intro_left_jump {
		bottom: 1.5rem;
	}
	.jump_to{
		margin-left: -.9rem;
		font-size: .8rem;
	}
	.jump_word{
		font-size: .8rem;
	}
	.jump_word:hover{
		font-size: .82rem;
	}
	.index_content_left {
		width: 27.5rem;
		right: 50%;
		transform: translateX(-0.6rem); /* 向右移动6px，即使它距离中间线6px */
		margin-left: 4%;
		margin-top: .5rem;
		margin-bottom: 7.5rem;
	}
	.index_title{
		font-size: 1.5rem;
		height: 1.8rem;
	}
	.index_title:hover{
		height: 1.8rem;
	}
	.index_quote {
		font-size: 1.2rem;
	}
	.index_content_left h3{
		font-size: 1.2rem;
	}
	.index_content_left ul{
		font-size: 1rem;
	}
	.index_content_right_imgs{
		transform: translateX(0.6rem); /* 向右移动6px，即使它距离中间线6px */
		width: 26.4rem;
		margin-top: 2.5rem;
	}
	.fun_project_flexbox{
		width: 100%;
		transform: translateX(-0.06rem); /* 向右移动6px，即使它距离中间线6px */
	}
	.fun_project_flexbox_item_text ul{
		padding-left: 0;
	}
	.fun_project_flexbox_item_text li{
		list-style-type: none;
		padding-bottom: .5rem;
	}
}

/* #### Desktops -1024px #### */
@media screen and (max-width: 1024px) {
}

/*适配retina显示*/
@media screen and (-webkit-min-device-pixel-ratio: 2),
screen and (min-resolution: 192dpi) {
	html {
		font-size: 90%;  /* Retina 屏幕上整体缩小字体 */
	}
}