@media (min-width:650px){
  .about{
      max-width: 1920px;
      margin: 0 auto;
      margin-top: 70px;
      position: relative;
  }
  .banner{
     
  }
  .bg{
      position: absolute;
      top: 100px;
      left: 35%;
      max-width: 1920px;
      margin: 0 auto;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      z-index: 98;
  }
  .bg2{
      max-width: 1920px;
      margin: 0 auto;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
  }
  .bg2 button{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 190px;
      
  }
  .bg2 .btn :hover{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 190px;
      opacity: 0.9;
      
  } 
  /* 多彩的校园生活列表 */
  .bg1{
      max-width: 1920px;
      height: 600px;
      margin: 0 auto;
      background-color: #e8f3f9;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      position: relative;
  }
  .bg1 .titles{
      position: absolute;
      top: 40px;
      color: #5b6064;
      font-size: 30px;
  }
  .bg1 .list{
      display: flex;
      margin-top: 50px;
  }
  .bg1 .list .list1,.list2,.list3{
      width: 300px;
      height: 350px;
      margin-right: 50px;
      border-radius: 10px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding-left: 13px;
      padding-right: 12px;
  }
  .bg1 img{
      width: 100px;
  }
  .bg1 h1{
      font-size: 26px;
      color: white;
  }
  .bg1 p{
      color: white;
      text-align: center;
      font-size: 14px;
      margin-top: 10px;
  }
  .bg1 .list .detail{
      background-color: #fff;
      border-radius: 5px;
      padding-left: 20px;
      padding-right: 20px;
      margin-top: 30px;
  }
  .bg1 .list .list3 .detail{
      margin-top: 10px !important;
  }
  .bg1 .list .list1 .detail span{
      color: #28b9a8;
  }
  .bg1 .list .list2 .detail span{
      color: #fea116;
  }
  .bg1 .list .list3 .detail span{
      color: #ff6766;
  }
  .bg1 .list .list1{
      background-color: #28b9a8;
      box-shadow: 9px 9px 0px 0px #149e8e;
  }
  .bg1 .list .list2{
      background-color: #fea116;
      box-shadow: 9px 9px 0px 0px #e28c0c;
  }
  .bg1 .list .list3{
      background-color: #ff6766;
      box-shadow: 9px 9px 0px 0px #d65656;
  }
  .bg1 .img1{
      position: absolute;
      top: -10px;
      width: 25px;
      z-index: 98;
  }
  .bg1 .img2{
      position: absolute;
      bottom:-27px;
      width: 50px;
  }
  .bg button{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 190px;
  }
  .bg .btn :hover{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 190px;
      opacity: 0.9;
      
  } 
      /* 多彩的校园生活列表 */
  
  .guanyu{
      color: #fff;
      border-bottom: 3px solid #fff;
      width: 230px;
      font-size: 28px;
  }
  .guanyu1{
      padding-top: 10px;
      color: #fff;
      font-style:oblique;
      font-size: 16px;
  }
  .guanyu2{
     
      color: #fff;
      font-style:oblique;
      font-size: 70px;
  }
  .guanyu2 h1{
      color: #fff;
      font-style:oblique;
      font-size: 70px;
  }
  .guanyu3 h1{
      color: #fff;
      font-style:oblique;
      font-size: 70px;
  }
  
  .top{
      max-width: 1200px;
      margin: 0 auto;
      margin-top: 120px;
  }
  .top1{
      margin-left: 25px;
  }
  .top2{
      margin-left: 25px;
  }
  /* 公司简介 */
  .cen{
      max-width: 1200px;
      margin: 0 auto;
      margin-top: 60px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding-bottom: 70px;
  }
  .cen button{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 140px;
  }
  .cen .btn :hover{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 140px;
      opacity: 0.9;
      
  } 

  .cen-t2{
      font-size: 40px;
      color: #5b6064;
      font-weight: 600;
      margin-top: 10px;
  }
  .par1{
      font-size: 16px;
      color: #444444;
      text-align: center;
      margin-bottom: 20px;
  }
  .par{
      width: 800px;
      font-size: 16px;
      color: #444444;
      text-align: center;
  }
  /* 公司简介 */
  
}

@media (max-width:450px){
  .about{
      max-width: 450px;
      margin: 0 auto;
      margin-top: 70px;
  }

  .swiper-wrapper img{
      width: 1200px;
      margin: 0 auto;
  }
  .bg{
     position: absolute;
      top: 150px;
      left: 25%;
      max-width: 1920px;
      margin: 0 auto;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      z-index: 98;
     
  }
  .bg2{
      max-width: 1920px;
      height: 500px;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
  }
/* 多彩的校园生活列表 */
  .bg1{
      max-width: 1920px;
      height: 1400px;
      margin: 0 auto;
      background-color: #e8f3f9;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      position: relative;
  }
  .bg1 .img1{
      position: absolute;
      top: -10px;
      width: 25px;
  }
  .bg1 .img2{
      position: absolute;
      bottom:-27px;
      width: 50px;
  }
  .bg1 .titles{
      position: absolute;
      top: 40px;
      color: #5b6064;
      font-size: 30px;
  }
  .bg1 .list{
      display: flex;
      flex-direction: column;
      margin-top: 50px;
  }
  .bg1 .list .list1,.list2,.list3{
      width: 300px;
      height: 350px;
      margin-right: 50px;
      border-radius: 10px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding-left: 13px;
      padding-right: 12px;
      margin-bottom: 50px;
      margin-left: 45px;
  }
  .bg1 img{
      width: 100px;
  }
  .bg1 h1{
      font-size: 26px;
      color: white;
  }
  .bg1 p{
      color: white;
      text-align: center;
      font-size: 14px;
      margin-top: 10px;
  }
  .bg1 .list .detail{
      background-color: #fff;
      border-radius: 5px;
      padding-left: 20px;
      padding-right: 20px;
      margin-top: 30px;
      font-size: 20px;
  }
  .bg1 .list .list3 .detail{
      margin-top: 10px !important;
  }
  .bg1 .list .list1 .detail span{
      color: #28b9a8;
  }
  .bg1 .list .list2 .detail span{
      color: #fea116;
  }
  .bg1 .list .list3 .detail span{
      color: #ff6766;
  }
  .bg1 .list .list1{
      background-color: #28b9a8;
      box-shadow: 9px 9px 0px 0px #149e8e;
  }
  .bg1 .list .list2{
      background-color: #fea116;
      box-shadow: 9px 9px 0px 0px #e28c0c;
  }
  .bg1 .list .list3{
      background-color: #ff6766;
      box-shadow: 9px 9px 0px 0px #d65656;
  }
  .bg1 .img1{
      position: absolute;
      top: -10px;
      width: 25px;
      display: none;
  }
  .bg1 .img2{
      position: absolute;
      bottom:-27px;
      width: 50px;
  }
  .bg2 button{
      margin-top: 20px;
      background-color: #28B9A8;
      border: 0;
      width: 120px;
  }
  .bg2 .btn :hover{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 120px;
      opacity: 0.9;
      
  } 
   /* 多彩的校园生活列表 */

  .guanyu{
      color: #fff;
      border-bottom: 3px solid #fff;
      width: 200px;
      font-size: 28px;
  }
  .guanyu1{
      padding-top: 10px;
      color: #fff;
      font-style:oblique;
      font-size: 16px;
  }
  .guanyu2{
      color: #fff;
      font-style:oblique;
      font-size: 70px;
  }
  .guanyu2 h1{
      color: #fff;
      font-style:oblique;
      font-size: 30px;
  }
  .guanyu3 h1{
      color: #fff;
      font-style:oblique;
      font-size: 30px;
  }
  
  .top{
      max-width: 450px;
      text-align: center;
      margin-top: 20px;
      background-color:red;
  }
  /* .top3{
      width: 140px;
  } */
  .top1{
      width: 72px;
  }
  .top2{
      width: 104px;
  }
  
  .cen{
      max-width: 450px;
      text-align: center;
      margin-top: 60px;
  }

  .cen-t2{
      font-size: 48px;
      color: #222;
      font-weight: 600;
      margin-top: 10px;
  }
  .cen button{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 140px;
  }
  .cen .btn :hover{
      margin-top: 40px;
      background-color: #28B9A8;
      border: 0;
      width: 140px;
      opacity: 0.9;
      
  } 
  .par1{
      font-size: 16px;
      color: #444444;
      text-align: center;
      margin-bottom: 20px;
  }
  .par{
      font-size: 16px;
      color: #444444;
      text-align: center;
  }
}