*{
    margin: 0;
    /* 外边距 */
    padding: 0;
    /* 内边距 */
 }
 .container{
     height: 100vh;
     /* 视口高度 */
     position: relative;
     /* 相对定位 */
     display: flex;
     /* 弹性布局 */
     justify-content: center;
     /* 水平居中 */
     align-items: center;
     /* 垂直居中 */
     overflow: hidden;
     /* 溢出隐藏 */
 }
 .video-container{
     position: absolute;
     z-index: -1;
     /* 层级 */
 }
 @font-face {
    /* 引用本地字体 */
     font-family: myfont;
     /* 起名 */
     src: url('../fonts/FZLTHJW.TTF');
     /* 制定路径 */
 }

 .text-container{
     color: white;
     text-align: center;
     line-height: 55px;
 }
 .text-container h1{
     font-family: myfont;
     font-size: 40px;
     font-weight: 100;
     /* 字体粗细 */
 }
 h2{
     font-family:Arial, Helvetica, sans-serif;
     /* 字体 */
     font-weight: 100;
     letter-spacing: 6px;
     /* 字间距 */
 }
 .btn{
     display: inline-block;
     color: white;
     text-decoration: none;
     /* 去除a标签的下划线 */
     width: 150px;
     height: 50px;
     line-height: 50px;
     border: 1px solid #fefefe;
     margin-top:30px;
     border-radius: 5px;
     /* 导圆角 */
  
 }
 .btn:hover{
    /* 鼠标悬停变色 */
     background-color: rgb(46, 45, 43);
 }
 .video-container::after{
    /* 在某个元素之后加个元素 */
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, .5);
 }
 .nav{
    /* 导航 */
     width: 1000px;
     height: 50px;
     /* background-color: raba（240，248，255，0.108）; */
     position: absolute;
     top: 30px;

 }
 img{
     float: left;
     /* 浮动 */
 }
 .list{
     float: right;
 }
 .list>li{
     float: left;
     list-style: none;
     color:white;
     margin-right: 30px;
     line-height: 50px;
 }
 .sub-list{
     list-style: none;
     display: none;
 }
 .list a{
     text-decoration: none;
     color: white;
 }
 .list a:hover{
     color: rgb(248, 220, 79);
 }
 #product:hover .sub-list{
     display: block;
 }
 .triangle{
     display: inline-block;  
     width: 0;
     height: 0;
     border: 4px solid transparent;
     border-top: 4px solid white;
     position: relative;
     top: -2px;
 }
 #product:hover .triangle{
     border: 4px solid transparent;
     border-bottom: 4px solid white;
     position: relative;
     top: 2px;
 }
 .news{
    width: 100%;
   /* height: 1000px;*/
    background-color: rgb(234, 233, 231);
 }
 .title{
    max-width: 1200px;
    margin: 0 auto;
    height: 130px;
   /*background-color: aqua;*/
    display: flex;
    justify-content: center;
    align-items: center;
}
 .news-title{
    display: inline-block;
    /*background-color: #fefefe;*/
    text-align: center;
 }
 .news-container{
    max-width: 1200px;
    /*height: 800px;*/
    margin: 0 auto;
   /* background-color: aquamarine;*/
    display: flex;
    /*开启弹性盒模型，要写在父元素上*/
    flex-wrap: wrap;
     /*自动换行*/
    justify-content: center;
   /*居中对齐*/
 }
 .news-item{
    width: 300px;
    height: 300px;
    background-color: white;
    padding: 20px;
    border-radius:5px ;
    margin: 20px;
 }
 .news-item img{
     width: 300px;
     height: 200px;
     margin-bottom: 10px;
 }
 .news-item h3{
    margin-bottom: 10px;
 }