/* スマホでも横長スライダーを表示するための修正CSS */

.pc-slider-list {
  display: block !important;
}

.sp-slider-list {
  display: none !important;
}

/* Slick CarouselのデフォルトCSSを上書き */
.slick-slider {
  display: block !important;
}

.slick-initialized {
  display: block !important;
}
/* スマホでも横長スライダーを表示するため、sp-slider-listを非表示のままにする */
@media (max-width: 768px) {
  .pc-slider-list {
    display: block !important;
  }

  .sp-slider-list {
    display: none !important;
  }
  
  /* slick-sliderクラスも強制的に表示 */
  .pc-slider-list.slick-slider {
    display: block !important;
  }
  
  .pc-slider-list.slick-initialized {
    display: block !important;
    margin-top: 1.5rem ;
    height: auto;
  }
  
  /* スマホでのスライダー表示を調整 */
  .pc-slider-list .slick-slide {
    padding: 0 5px;
    width: 230px !important;
    max-width: 230px !important;
  }
  
  .pc-slider-list .job-card {
    margin: 0 5px;
    min-width: 180px;
    max-width: 280px;
    width: 180px;
    position: relative;
    overflow: visible;
  }
  
  /* 急募ラベルがはみ出せるようにする */
  .pc-slider-list .job-card .urgent_label {
    position: absolute;
    top: -16px;
    left: 14px;
    z-index: 10;
  }
  
  /* スライダーコンテナで急募ラベルが切れないようにする */
  .pc-slider-list .slick-list {
    overflow: visible !important;
    padding-top: 20px !important;
  }
  
  /* requestタイプのjob-cardの高さを統一 */
  .pc-slider-list .job-details-container.request {
    height: auto !important;
    min-height: 96px;
  }
  
  /* スライダーの幅を強制的に制限 */
  .pc-slider-list.slick-slider {
    width: 100% !important;
  }
  
  .pc-slider-list .slick-track {
    display: flex !important;
    align-items: flex-start !important;
    width: 0px !important;
  }
  
  /* 各スライドの幅を統一 */
  .pc-slider-list .slick-slide > div {
    width: 180px !important;
    max-width: 180px !important;
  }

  .section-item .slick-slide {
    margin-right: 2px !important;
  }
}