@charset "UTF-8";
#mv {
  width: 100%;
  position: relative;
  top: 0;
  left: 0;
  overflow: hidden;
  margin-left: 0;
}
.mv-bg {
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}

#nav-mv {
  padding: 3vw 0 0 !important;
}
#slider-text {
  position: relative;
  z-index: 12345;
  font-size: 5.5vh;
}
#gr-wrap {
  overflow: hidden;
  z-index: 1;
}
#gr-wrap, #gr-text {
  min-height: 40vw;
}
#bg-rellax {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: absolute;
  top: -10vw;
  left: 0;
  height: 70vw;
}
#gr-text {
  height: 100%;
  background-color: rgba(0,0,0,.5);
}
#gr-text-wrap {
  padding: 1.5vw 0;
}
.con-img img {
  width: 100%;
  height: 28vw;
  object-fit: cover;
}
.list-box figure {
  aspect-ratio: 1 / 1;
}
.contents .gr-rellax {
  position: absolute;
  top: -5vw;
  left: 0;
  height: 70vw;
}
.text-area {
  padding: 1.5vw 2vw 1vw;
}
.text-area-dimg {
  padding: 5vw;
}
#recommend figure, #recommend .des {
  position: relative;
}
#recommend figure {
  z-index: 2;
}
#recommend .des {
  z-index: 1;
}
#recommend .type1 figure {
  padding: 0 0 0 2vw;
}
#recommend .type1 .des {
  padding: 2vw;
  margin: -13vw 0 0;
  min-height: 14.5vw;
}
#recommend .type2 {
  padding: 0 1vw;
}
#recommend .type2 figure {
  padding: 0 2vw 0;
}
#recommend .type2 .des {
  padding: 14vw 2vw 2vw;
  margin: -13vw 0 0;
  min-height: 14.5vw;
}
#recommend img {
  box-shadow: 2px 2px 8px rgba(0,0,0,.4);
}



@media (min-width: 768px){
  
}

@media (max-width: 991px){
  #slider-text {
    font-size: 200%;
  }
}

@media (max-width: 767px){
  .logo-area {
    top: 15vw !important;
  }
  #gr-text-wrap {
    padding: 15vw 0;
  }
  #bg-rellax {
    height: 150vw;
  }
  .con-img img {
    height: 50vw;
  }
  #slider-text {
    font-size: 180%;
  }
  .contents .gr-rellax {
    height: 100vh;
  }
  .text-area {
    padding: 3vw 4vw 2vw;
  }
  .bg-img-wrap {
    padding: 40vw 0 10vw;
  }
  #recommend {
    padding-left: 2vw;
    padding-right: 0;
  }
  #recommend .type1 figure {
    padding: 0;
  }
  #recommend .type1 .des, #recommend .type2 .des {
    padding: 40vw 5vw 4vw;
    margin: -37vw 0 0;
  }
  #recommend .type1, #recommend .type2 {
    padding: 0 2vw;
  }
  #recommend .type2 figure {
    padding: 0 6vw 0;
  }
}

@media (max-width: 575px){
  
}