*
{
	margin:0;
	padding:0;
  list-style-type :none
}
html,body {
  width: 100%;
  height: 100%;
  font-size:16px;
  /* background-color: #ecf0f3; */
  background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0, 0.1)),url(https://picsum.photos/1920/1080);
}
/* ============================= */
.about{
  display:none;
  width: 1000px;
  height:700px;
  box-shadow: inset 6.553px 4.589px 8px 0px rgba(209, 217, 230, 1),inset -5.657px -5.657px 8px 0px rgba(255, 255, 255, 1);
  position: absolute;
  top: 100px;
  left: 50%;
  margin-left: -500px;
  z-index: 99;
  border-radius: 20px;
  background-color: #ecf0f3;
  /*opacity: 0;*/
  /*transition: all 1s;*/
  -webkit-animation-name: fadeIn; /*动画名称*/
  -webkit-animation-duration: 0.2s; /*动画持续时间*/
  -webkit-animation-iteration-count: 1; /*动画次数*/
  -webkit-animation-delay: 0s; /*延迟时间*/

}
/*动画效果*/
@-webkit-keyframes fadeIn {
	0% {
	opacity: 0; /*初始状态 透明度为0*/
	}
	20%{
		opacity: .2;
	}
	50% {
		opacity: .5; /*中间状态 透明度为0.5*/
	}
	70%{
		opacity: .7;
	}
	100% {
		opacity: 1; /*结尾状态 透明度为1*/
	}
}



h2{
  text-align: center;
  font-size: 3.375em;
  /*font-family: "Source Han Sans CN";*/
  color: rgb(139, 145, 153);
  text-transform: uppercase;
  line-height: 1;
  width: 800px;
  height: 52px;
  margin: 0 auto;
  padding-top: 40px;
  padding-bottom: 40px;
  font-weight: normal;
  border-bottom: solid 1px rgba(96, 99, 104, 0.2);
}
.about>p{
  width: 740px;
  /*font-family: "Source Han Sans CN";*/
  font-size: 1.375em;
  line-height: 1.75;
  text-indent: 36px;
  color: rgb(139, 145, 153);
  margin: 0 auto;
  font-weight: initial;
  float: none;
  padding-top: 30px;
  letter-spacing: 1.5px;
}

.button{
  transition: all 1s;
  width: 200px;
  height: 60px;
  box-shadow: -6px -6px 5px 1px rgba(255, 255, 255,0.7),5px 5px 5px 2px rgba(209, 217, 230 ,0.6);
  border-radius: 6px;
  position: absolute;
  bottom: 50px;
  margin-left: -100px;
  left: 50%;
  /*font-family: "Source Han Sans CN";*/
  font-size: 2em;
  font-weight: revert;
  color: rgb(139, 145, 153);
  text-align: center;
  line-height: 60px;
}
.button:hover{
  cursor:pointer;
  box-shadow: inset 6.553px 4.589px 8px 0px rgba(209, 217, 230, 1),inset -5.657px -5.657px 8px 0px rgba(255, 255, 255, 1);
}


.hyperlinks{
  width: 1000px;
  /* height:330px; */
  margin:0 auto;
}
.hyperlinks>ul{
  width: 1000px;
  margin: 0 auto;
}
.hyperlinks>ul>li{
  border-radius: 20px;
  background-color: rgba(255, 255, 255, 0.3);
  border: 1px dashed rgba(255, 255, 255, 0.6);
  /* width: 388px; */
  height: 126px;
  /* float: left; */
  margin: 15px auto;

}
.hyperlinks>ul>li:hover{
  cursor:pointer;
  background-color: rgba(0, 0, 0, 0.2);
  /* box-shadow: inset 6.553px 4.589px 8px 0px rgb(29, 73, 143),inset -5.657px -5.657px 8px 0px rgba(255, 255, 255, 1); */
}

.blog_icon{
  width: 120px;
  height: 120px;
  border-radius: 16px;
  background-color: #f9fafb;
  margin: 3px 0 0 3px;
  background-size: 100% 100%;
  float: left;
  background-image: url("https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.duoziwang.com%2F2019%2F07%2F10291453909816.jpg&refer=http%3A%2F%2Fimg.duoziwang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1674129370&t=939d32244b0b62e9cc583b1686f0004d");
}
.file_icon{
  width: 120px;
  height: 120px;
  border-radius: 16px;
  background-color: #f9fafb;
  margin: 3px 0 0 3px;
  background-size: 100% 100%;
  float: left;
  background-image:url("https://img2.baidu.com/it/u=2512072660,17599263&fm=253&fmt=auto&app=138&f=JPEG");
}
.design_icon{
  width: 120px;
  height: 120px;
  border-radius: 16px;
  background-color: #f9fafb;
  margin: 3px 0 0 3px;
  background-size: 100% 100%;
  float: left;
  background-image:url("https://api.lincloud.pro/image/girl0");
}
h1{
  margin: 14px 0 0 150px;
  /* width: 246px; */
  height: 28px;
  /* float:left; */
  font-size: 1.75em;
  font-family: "Source Han Sans CN";
  color: rgb(255, 255, 255);
  font-weight: normal;
  
}

p {
  font-size: 1.2em;
  color: rgba(255, 255, 255, 0.9);
  font-family: "Source Han Sans CN";
  margin: 5px 0 0 150px;
  width: 830px;
  /* float: left; */
  /* line-height: 1.75em; */
  font-weight: initial;
  /* letter-spacing: 1px; */
  padding-top: 10px;
  /* background-color: aquamarine; */
}

.toptitle>h4 {
  text-align: center;
  font-size: 3.375em;
  font-family: "Source Han Sans CN";
  color: rgb(253, 254, 255);
  text-transform: uppercase;
  line-height: 1;
  /* width: 300px; */
  height: 52px;
  margin: 0 auto;
  padding-top: 5%;
  letter-spacing: 4px;
}

.toptitle>h6 {
  text-align: center;
  font-size: 2em;
  font-family: "Source Han Sans CN";
  color: rgb(255, 255, 255);
  text-transform: uppercase;
  line-height: 1;
  width: 66%;
  height: 52px;
  margin: 0 auto;
  padding-top: 4%;
  padding-bottom: 50px;
  letter-spacing: 4px;
}

#box{
  width:1200px;
  height: 900px;
  /*background-color: antiquewhite;*/
  margin: 0 auto;
}