@charset "utf-8";
/* ---------------------------------------------------
 * フロントページ / スライダー + fv
 * --------------------------------------------------- */

/* スライダー ------------------------------------------ */
.top-slider {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: stretch;
  flex-wrap: nowrap;
  margin: 5vh 0;
  overflow: hidden;
}

/* 左右ボタン ----------- */
@media (min-width: 769px) {
  .top-slider button {
    flex: 0 0 30px;
    display: grid;
    place-content: center;
    font-size: 50px;
    color: #fff;
  }
  .home .top-slider button:not(.stop) {
    background-color: #004EA2;
    cursor: pointer;
  }
  .top-slider button.stop {
    background-color: #ccc;
    pointer-events: none;
  }
}
@media (max-width: 768px) {
  .top-slider button {
    display: none;
  }
}
/* 本体 / js移動 ----------- */
.slider-wrap ul {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  transition: all .5s;
}
.slider-wrap li {
  padding: 0 10px;
  background-color: #fff;
  border: solid #fff;
  border-width: 0 1px;
}
.slider-wrap .ex-img {
  aspect-ratio: 300 / 200;
  width: 100%;
}
.slider-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slider-wrap p {
  width: calc(100% - 10px);
  padding: 5px 5px 0;
  line-height: 1.4;
  /* 以下2行表示用 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow-y: hidden;
}
.slider-wrap a {
  color: #000;
}
@media (hover: hover) {
  .slider-wrap { overflow: hidden; }
}
@media (hover: none) {
  .slider-wrap { overflow-x: auto; }
}
@media (min-width: 681px) {
  .slider-wrap li { flex: 0 0 calc(100% / 3.4); }
}
@media (min-width: 351px) and (max-width: 680px) {
  .slider-wrap li { flex: 0 0 calc(100% / 2.3); }
}
@media (max-width: 350px) {
  .slider-wrap li { flex: 0 0 calc(100% / 1.4); }
}

/* housing用 --------------------- */
.housing-slider .top-slider {
  margin: 10px 0 40px;
}
.housing-slider .post-cat a {
  display: block;
  padding: 1px 5px;
  font-weight: 500;
  font-size: 1.4rem;
  color: #fff;
    background-color: #0EAA67;
}
.housing-slider .post-cat a:hover {
  opacity: .7;
}
@media (min-width: 769px) {
  .housing-slider .top-slider button:not(.stop) {
  background-color: #333;
  }
}
