@charset "UTF-8";

/*******************
contents
*******************/
@media screen and (max-width: 768px) {
  #main-column{
    padding: 0;
  }
  .column-set{
    padding-left: 10px;
  }

  #main-column .w100 .news,
  #main-column .ranking,
  #main-column .pickup,
  #main-column .newItem {
    margin: 0
  }

  #main-column .w100 .news .news-contents {
    margin:0 10px;
    box-sizing: border-box;
    width: auto;
  }

  #main-column .w100 .freeArea2,
  #main-column .w100 .shopDiary,
  #main-column .w100 .freeArea2 h2 {
    margin-left: 0;
    margin-right: 0;
  }

  .column5, .column4{
    padding-right: 5px;
  }
  .column4 h3, .column5 h3 {
    font-size:12px;
    font-weight: 500;
}
}
.p-top-main-swiper{
  width: 100%;
  overflow: hidden;
}

.p-top-main-swiper .swiper-slide img{
  display: block;
  width: 100%;
  height: auto;
}

.p-top-main-swiper .swiper-pagination{
  position: static;
  margin-top: 16px;
  text-align: center;
}
.p-top-main-swiper .swiper-pagination{
  position: static;
  margin-top: 16px;
  text-align: center;
}

.p-top-main-swiper .swiper-pagination-bullet{
  width: 18px;
  height: 6px;
  border-radius: 0;
  background: var(--gray);
  opacity: 1;
  margin: 0 4px !important;
}
/**************** slick dots ****************/
.slick-dots li button:before {
  font-size: 12px;
  color: var(--gray);
  opacity: 1;
}

.slick-dots li.slick-active button:before {
  color: var(--red);
  opacity: 1;
} 
.p-top-main-swiper .swiper-pagination-bullet-active{
  background: var(--red);
}
@media screen and (max-width: 768px) {

  .column5:nth-child(20n+1),
  .column4:nth-child(2n+1),
  .column5:nth-child(2n+1) {
    clear: none;
  }

  .column5,
  .column4,
  .column5:nth-child(5n) {
    margin: 0;
    clear: none;
  }
  .column4:nth-child(2n), .column5:nth-child(2n){
    margin: 0;
  }
  .column4, .column5{
    padding-bottom: 0;
  }
@media screen and (max-width: 768px) {
  #contents {
    padding-bottom: 0;
  }
  .column4 .itemThumb a img,
  .column5 .itemThumb a img {
    aspect-ratio: 1 / 1;
    -o-object-fit: contain;
    object-fit: cover;
  }
  #page-top {
    right: 0;
  }
  #contents #main-column .footer_area{
    margin-left: 0;
    width: 100%;
  }

}

.slick-dots {
  position: static;
}
.slick-dots li button:before{
  font-size: 10px;
}