*{ 
             margin: 0;
             padding: 0; 
             text-decoration: none;
         }
ul{
            list-style: none;
        }
        
.header{
            margin: auto;
            width: 1200px;
            height: 80px;
            position: relative;
        }
.nav{
            width: 120px;
            height: 40px;
            position: absolute;
            top: 50%;
            margin-top: -15px;
        }
.nav1{
            margin: auto;
            float: right;
        }

.nav1 ul{
            list-style:none; /* 去掉ul前面的符号 */
            margin: 0px; /* 与外界元素的距离为0 */
            padding: 0px; /* 与内部元素的距离为0 */
            width: auto; /* 宽度根据元素内容调整 */
        }
.nav1 ul li{
            float:left; /* 向左漂移，将竖排变为横排 */
        }

#container{
            margin: auto;
            position: relative;
            width: 1200px;
            height: 500px;
            overflow: hidden;/*隐藏溢出的图片*/
        }
.pic{
            width:4800px;/*4张图的宽度*/
            position: absolute;/*基于父容器进行定位*/
            left:0;
            animation-name: focusmap;
            animation-duration: 12s;
            animation-iteration-count: infinite;//动画调用可以简写

        }
 @keyframes focusmap {
            0%,30%{
                left: 0;
            }
            35%,65%{
                left: -1200px;
            }
            70%,99%{
                left: -2400px;
            }
            100%{
                left: -3600px;
            }
           
        }
.pic li{
            float: left;
            background: #5dd94e;
        }

.pic li img {
            width: 1200px;
            height: 500px;
        }


#cx{
            margin: 10px auto;
            position: relative;
            width: 1200px;
            height: 400px;
            overflow: hidden;/*隐藏溢出的图片*/
        }
.cx1{
            width: 295px;
            height: 400px;
            margin-right:5px;
            float: left;
            background-image: url(../images/cx1.jpg);
            text-align:center;
        }
.cx1 p{ 
      color:#fff;
      font-family: Microsoft Yahei; 
      font-size:20px;
      font-weight:bold;
      position:relative; 
      bottom:-350px; 
      left:-5px; 
      margin:auto;
      } 

.cx2{
            width: 295px;
            height: 400px;
            margin-right:5px;
            float: left;
            background-image: url(../images/cx2.jpg);
        }

.cx2 p{ 
      color:#fff;
      font-family: Microsoft Yahei; 
      font-size:20px;
      font-weight:bold;
      position:relative; 
      bottom:-350px; 
      left:40px; 
      margin:auto;
      } 

.cx3{
            width: 295px;
            height: 400px;
            margin-right:5px;
            float: left;
            background-image: url(../images/cx3.jpg);
        }

.cx3 p{ 
      color:#fff;
      font-family: Microsoft Yahei; 
      font-size:20px;
      font-weight:bold;
      position:relative; 
      bottom:-350px; 
      left:50px; 
      margin:auto;
      } 

.cx4{
            width: 300px;
            height: 400px;
            float: left;
            background-image: url(../images/cx4.jpg);
        }


.cx4 p{ 
      color:#fff;
      font-family: Microsoft Yahei; 
      font-size:20px;
      font-weight:bold;
      position:relative; 
      bottom:-350px; 
      left:50px; 
      margin:auto;
      } 
.center{
     text-align: center;
        }
.center img{
    max-width: 100%;
    max-height: 100%;
        }

.aboutus{
     width: 100%
     text-align: center;
        }
.aboutus h1{
     margin: 10px auto;
     text-align: center;
        }
.aboutus p{
     margin: 10px 0;
     text-indent: 2em;
        }
