@charset "UTF-8";
/* MV
----------------------------*/
.mv {
  position: relative;
  width: 100%;
  margin-top: 0;
  overflow: hidden;
}
.swiper-mv {
  width: 100%;
}
.swiper-mv .swiper-slide {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.swiper-mv .swiper-slide img {
  width: 100%;
  display: block; /* imgの下に隙間ができるためblockに */
  height: 50vh;
  min-height: 300px;
  object-fit: cover;
}
.mv-text {
  font-family: "Lato", serif;
  color: #fff;
  font-weight: 700;
  position: absolute;
  z-index: 1;
  font-size: 9vw;
  line-height: 1.1;
  padding: 2rem 1.5rem;
  bottom: -2vh;
  left: 0;
}
.mv-text .fc-black {
  color: #fff !important;
}
/* Main
----------------------------*/
section {
  padding: 7rem 0;
}
.sct-product {
  background: url("../images/top/bg-product.jpg") no-repeat;
  background-size: cover;
}
.bg-recruit {
  background: url("../images/top/bg-recruit.png") no-repeat;
  min-height: 400px;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}
/* Media Query
----------------------------*/
/* Small devices (landscape phones, 576px and over, .col-sm-*)*/
@media (min-width: 576px) {
  .swiper-mv .swiper-slide img {
    height: 70vh;
    min-height: 500px;
  }
}
/* Medium devices (tablets, 768px and over, .col-md-*)*/
@media (min-width: 768px) {
  section {
    padding: 12rem 0;
  }
}
/* Large devices (desktops, 992px and over, .col-lg-*)*/
@media (min-width: 992px) {
  .swiper-mv .swiper-slide img {
    height: 80vh;
    min-height: 700px;
  }
  .mv-text {
    bottom: -18vh;
  }
  .mv-text .fc-black {
    color: #212324 !important;
  }
  section {
    padding: 14rem 0;
  }
  main section:first-of-type {
    padding: 32rem 0 15rem;
  }
  main section:nth-child(2) {
    padding: 10rem 0 14rem;
  }
  .bg-recruit [class^="col"]:first-of-type {
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
/* Extra large devices (large desktops, 1200px and over, .col-xl-*)*/
@media (min-width: 1200px) {
  .swiper-mv .swiper-slide img {
    height: 90vh;
  }
}
/* Extra extra large devices (extra large desktops, 1400px and over, .col-xxl-*)*/
@media (min-width: 1400px) {
  .mv-text {
    font-size: 15rem;
    bottom: -22rem;
  }
}