@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;700&display=swap");
/*-------------------------------------------
px→vw
 * ex)
   width: sp(200)
   width: tab(200)
-------------------------------------------*/
.recomend section {
  position: relative;
}
.recomend .morebtnCol {
  margin-bottom: 5%;
}
@media screen and (min-width: 768px) {
  .recomend .morebtnCol {
    position: absolute;
    right: 0;
    top: -13px;
  }
  .recomend .morebtnCol .btnL {
    padding: 9px 30px;
    min-width: 230px;
  }
}

#container {
  overflow: hidden;
  position: relative;
  z-index: 0;
}

#oriartCol {
  position: relative;
  z-index: 0;
}
#oriartCol .oriartColInner {
  position: relative;
}
#oriartCol .movie01 {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 19.5%;
  width: 64%;
}
#oriartCol .movie02 {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 80.7%;
  width: 64%;
}
#oriartCol .movie {
  position: relative;
  padding-top: 177.77%;
}
#oriartCol .movie iframe {
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
#oriartCol .btn01 {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 66.1%;
}
#oriartCol .btn01 a {
  display: block;
  width: 39vw;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  #oriartCol .btn01 a {
    width: 430px;
  }
}
#oriartCol .btn02 {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 98%;
}
#oriartCol .btn02 a {
  display: block;
  width: 42.6vw;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  #oriartCol .btn02 a {
    width: 469px;
  }
}