@media (min-width: 976px)  {
    .swiper {
        width: 90%;
        /* height: 45vh; */
      }
      .mySwiper{
          /* height: 45vh; */
      }
  
      .swiper-slide {
        text-align: center;
        background: #fff;
        border-radius: 10px;

        margin-right: 20px;
        background: white;
        /* padding: 20px; */
        width: 30% !important;
        cursor: pointer;
        display: flex !important;
        flex-direction: column;
        padding-bottom: 3rem;
        flex-wrap: wrap;
        /* justify-content: space-between; */
       
      }
      .swiper-img-box{
        border-radius: 10px;
        width: 100%;
        overflow: hidden;
        height: 11rem;
      }
      .swiper-slide>div:nth-of-type(2){
        padding: 0 20px;
        box-sizing: border-box;
      }
      .swiper-slide:hover h3{
        color: var(--main-bg-color);
      }
      .gonews {
        width: 100%;
      }
      .gonews span{
        border: solid 1px #888888;
        color: #888888;
        padding: 5px 15px;
        margin: 0 auto;
        border-radius: 15px;
        cursor: pointer;
        font-size: 12px;
      }
      .swiper-slide:hover .gonews span{
        /* background: var(--main-bg-color); */
        color: var(--main-bg-color);;
        border: solid 1px var(--main-bg-color);

      }
  
      .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
  
      }
      .swiper-slide h3{
          color: black;
          font-size: 18px;

          /* font-weight: bold; */
          /* overflow: hidden; */
          text-overflow: ellipsis;
          text-align: left;
          word-break: break-all;
          overflow: hidden;
          display: -webkit-box;
          margin-top: 20px;
          -webkit-line-clamp: 2;
          color: #454545;
          -webkit-box-orient: vertical;
          
      }

      .swiper-slide p{
          text-align: left;
            /* margin-top: 10px; */
          /* margin-top: 12px; */
          font-size: 14px;
          word-break: break-all;
          overflow: hidden;
          display: -webkit-box;
          line-height: 30px;
          -webkit-line-clamp: 2;
          color: #454545;
          -webkit-box-orient: vertical;
      }
      .swiper-slide p small{
        color: #888888;
      }
}
@media (max-width: 975px) {
    .swiper {
        width: 90%;
        /* height: 45vh; */
        margin: 0 auto;
      }
      .mySwiper{
          /* height: 60vh; */
      }
  
      .swiper-slide {
        text-align: center;
     
        background: white;
        box-sizing: border-box;
        /* padding: 1rem; */
        border-radius: 10px;
        width: 40% !important;
        cursor: pointer;
        padding-bottom: 3rem;
        display: flex !important;
        flex-direction: column;
        flex-wrap: wrap;
        /* justify-content: space-between; */
      }
  
      .swiper-img-box{
        border-radius: 10px;
        width: 100%;
        overflow: hidden;
        height: 11rem;
      }
      .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
  
      }
      .swiper-slide h3{
          color: black;
          font-size: 1rem;
          font-weight: bold;
         
          text-align: left;
          word-break: break-all;
          overflow: hidden;
          display: -webkit-box;
          margin-top: 0.5rem;
          -webkit-line-clamp: 2;
          color: #454545;
          -webkit-box-orient: vertical;
          
      }
      .swiper-slide>div:nth-of-type(2){
        padding: 0 20px;
        box-sizing: border-box;
      }
      .swiper-slide p{
          text-align: left;
            margin: 0;padding: 0;
          font-size: 0.9rem;
          word-break: break-all;
          overflow: hidden;
          display: -webkit-box;
          -webkit-line-clamp: 1;
          color: #454545;
          -webkit-box-orient: vertical;
      }
}
@media (max-width: 750px){

      .swiper-slide {
        text-align: center;
     
        background: white;
        box-sizing: border-box;
        /* padding: 1rem; */
        border-radius: 10px;
        width: 55% !important;
        cursor: pointer;
        padding-bottom: 3rem;
        display: flex !important;
        flex-direction: column;
        flex-wrap: wrap;
        /* justify-content: space-between; */
      }
}
@media (max-width: 550px){

      .swiper-slide {
        text-align: center;
     
        background: white;
        box-sizing: border-box;
        /* padding: 1rem; */
        border-radius: 10px;
        width: 70% !important;
        cursor: pointer;
        padding-bottom: 3rem;
        display: flex !important;
        flex-direction: column;
        flex-wrap: wrap;
        /* justify-content: space-between; */
      }
}
@media (max-width: 400px){

      .swiper-slide {
        text-align: center;
     
        background: white;
        box-sizing: border-box;
        /* padding: 1rem; */
        border-radius: 10px;
        width: 100% !important;
        cursor: pointer;
        padding-bottom: 3rem;
        display: flex !important;
        flex-direction: column;
        flex-wrap: wrap;
        /* justify-content: space-between; */
      }
}