/* PC */
@media only screen and (min-width: 1024px) {
  .swiper {
    width: 100%;
    height: 430px;
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .swiper-slide {
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
  }

  .swiper-slide>a {
    height: 100%;
    width: 100%;
    margin-right: 26px;
    margin-left: 26px;
	  transition: all 0.3s ease 0s;
  }
	
  .swiper-slide>a:hover {
    opacity: 0.8;
  }

  .swiper-slide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
  }

  .swiper-slide .title {
    height: 24%;
    overflow: hidden;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    align-items: center;
    transform: translate(0%, -107%);
    background: rgba(0, 0, 0, 0.80);
    justify-items: start;
  }

  .swiper-slide p {
    color: #FFFFFF;
    margin-left: 16px;
    margin-right: 16px;
  }
}

/* mobile */
@media only screen and (max-width: 1023px) {
  .swiper {
    width: 100%;
    height: 100%;
    padding-top: 16px;
  }

  .swiper-wrapper {
    place-items: center;
  }
  
  .swiper-slide {
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
  }
  
  .swiper-slide>a {
    height: 260px;
    width: 100%;
    margin-right: 16px;
    margin-left: 16px;
  }
  
  .swiper-slide img {
    height: 214px;
    width: 100%;
    object-fit: cover;
  }
  
  .swiper-slide .title {
    height: auto;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    align-items: center;
    transform: translate(0%, -113%);
    background: rgba(0, 0, 0, 0.80);
    justify-items: start;
  }
  
  .swiper-slide p {
    color: #FFFFFF;
    margin-left: 16px;
	  margin-right: 16px;
	  font-size: 14px;
	  padding: 6px;
  }
}