 
        *{
            margin: 0;
            padding: 0;}
        .wp{
            width: 100%;
            height: 800px;
            margin: 0px auto 0;
            position: relative;
            top:-45px;
            overflow: hidden;}
        #list{
            display: flex;
            width: 400%;
            height:800px;
            overflow: hidden;
            transform: translateX(0);
            /* 添加过渡动画 */
            transition: all 1s;}
        .wp div span{
            display: inline-block;
            width: 100%;
            background-size: cover;
            background-position:center;}
        #box {
            height: 40px;
            width: 100%;
            position: absolute;
            background: rgba(0, 0, 0, 0.5);
            left: 0;
            bottom: 0;
            display: flex;
            justify-content: center;
            align-items: center;}
        #box span {
            width: 10px;
            height: 10px;
            background: #fff;
            
            border-radius: 50%;
            margin: 0 5px;
            cursor: pointer;}
        #box span:hover{
            background: pink;
            box-shadow: 0 0 0 2px #ccc;}
        #r,#l{
            width: 60px;
            height: 60px;
            border:3px solid #fff;
            color: #fff;
            position: absolute;
            font-size:30px;
            text-align: center;
            line-height: 60px;
            top: 300px;
            border-radius: 50%;
            right: 0;
            background: rgba(0,0,0,.2);}
         #l{
           
            left: 0;}  
 
#newsBlock1{
width:80%;
margin:auto;
padding-bottom:30px;}
#newsBlock1>a{
display:inline-block;
width:25%;}
#newsBlock1>a .twoLisImg img{
display:block;
width:100%;}
#newsBlock1>a:nth-of-type(1),#newsBlock1>a:nth-last-of-type(1){
display:block;
width:40%;}
 
.twoLis a {
margin:0.7%;
padding:0.7%;}
.twoLisImg{
position:relative;
height:100%;}
.twoLisImg>h2{
position:absolute;
bottom:20px;
font-size:1.05rem;
color:#666;}
#newsBlock1>a:nth-of-type(1) .twoLisImg>h2,#newsBlock1>a:nth-last-of-type(1) .twoLisImg>h2{
font-size:1rem;
bottom:10px;
color:#fff;}
.threeMain{
width:100%;}
.threeMain{
width:80%;
margin:auto;}
.threeMain li{
padding:1%;
width:30%;
float:left;
margin:0 auto;}
.nineMiddle{
   transfrom:translateX(0px) !important;}
.nineMiddle ul{
    width: 80%;
    margin: auto;}
.nineMiddle ul li.marr {
    padding: 1%;}
.nineMiddle ul li {
    width: 22%;
    height: auto;
    display: block;
    float: left;
    border:1px solid #f2f1e9;
    
    margin:0 5px;}
.nineMiddle ul li a,.nineMiddle ul li a:link,.nineMiddle ul li a:visited{
 color:#666;}
.threeMain{
width:80%;
margin:auto;}
.threeMain li{
padding:1%;
width:30%;
float:left;
margin:0 auto;}
.nineMiddle{
   transfrom:translateX(0px) !important;}
.nineMiddle ul{
    width: 80%;
    margin: auto;}
.nineMiddle ul li.marr {
    padding: 1%;}
.nineMiddle ul li {
    width: 22%;
    height: auto;
    display: block;
    float: left;
    border:1px solid #f2f1e9;
    
    margin:0 5px;}
.nineMiddle ul li a,.nineMiddle ul li a:link,.nineMiddle ul li a:visited{
 color:#666;}
