.l-container {
  width: auto;
}

.js-fade {
  opacity: 0;
  transition: 2s;
  visibility: hidden;
}
.js-fade.js-fade-top {
  transform: translate(0px, -40px);
}
.js-fade.js-fade-bottom {
  transform: translate(0px, 50px);
}
.js-fade.is-active {
  transform: translate(0, 0);
  opacity: 1;
  visibility: visible;
}

img {
  max-width: 100%;
}

a img {
  transition: 0.3s;
}
a img:hover {
  opacity: 0.7;
}

.swiper {
  overflow: hidden;
}
.swiper a {
  position: relative;
  display: block;
}
.swiper a:after {
  content: "";
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.4);
  transition: all 0.3s;
  z-index: 20;
}
.swiper a:hover {
  opacity: 1;
}
.swiper a:hover:after {
  opacity: 1;
}
.swiper a:hover img {
  opacity: 1;
}
.swiper .swiper-slide {
  background: #fff;
}

.credit {
  position: absolute;
  bottom: 2.5714285714vw;
  left: 2.619047619vw;
  opacity: 0;
  transition: 0.6s;
  transition-delay: 0s;
  z-index: 10;
}
.credit .item {
  margin-top: 0.9047619048vw;
}
.credit .item .link {
  font-size: 1.0952380952vw;
  color: #000 !important;
  font-weight: 400;
  letter-spacing: -0.03em;
  pointer-events: none;
  font-family: "Times New Roman", sans-serif;
}
.credit .item .link .price {
  padding-left: 0.3333333333vw;
}
.credit .item .link:hover {
  text-decoration: none;
  opacity: 0.6;
}

.feature {
  color: #000;
  font-feature-settings: "palt" 1;
  overflow: hidden;
}

.mv {
  margin: 0 auto 0.619047619vw;
  position: relative;
  width: 100vw;
  height: 66.7619047619vw;
}
.mv__Thum {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  transition: 0.6s;
}
.mv__Logo {
  position: absolute;
  width: 25.0952380952vw;
  top: 30.2857142857vw;
  left: 37.380952381vw;
  opacity: 0;
  transition: 0.6s;
  transition-delay: 2s;
}
.mv__Headtxt01 {
  position: absolute;
  width: 11.4761904762vw;
  top: 2.3333333333vw;
  left: 2.0476190476vw;
  opacity: 0;
  transition: 0.6s;
  transition-delay: 1s;
}
.mv__Headtxt02 {
  position: absolute;
  width: 5.4285714286vw;
  top: 2.3333333333vw;
  right: 2.1904761905vw;
  opacity: 0;
  transition: 0.6s;
  transition-delay: 1s;
}
.mv.-on .mv__Thum,
.mv.-on .mv__Logo,
.mv.-on .mv__Headtxt01,
.mv.-on .mv__Headtxt02 {
  opacity: 1;
}

.-flexwrap {
  display: flex;
  margin: 0 auto 0.7142857143vw;
}
.-flexwrap .-sec {
  margin: auto;
  position: relative;
  height: 74.9523809524vw;
  cursor: pointer;
  overflow: hidden;
}
.-flexwrap .-sec:nth-child(1) {
  width: 50vw;
}
.-flexwrap .-sec:nth-child(2) {
  width: 50vw;
}
.-flexwrap .-sec .-thum {
  position: absolute;
  width: 50vw;
  height: 74.9523809524vw;
  top: 0;
  left: 0;
}
.-flexwrap .-sec .-thum a {
  display: block;
  position: relative;
  pointer-events: none;
}
.-flexwrap .-sec .-thum a:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background: rgba(78, 174, 251, 0.7);
  z-index: 10;
  opacity: 0;
  transition: 0.6s;
}
.-flexwrap .-sec.-on .-thum a {
  pointer-events: auto;
}
.-flexwrap .-sec.-on .-thum a:before {
  opacity: 1;
}
.-flexwrap .-sec.-on .credit {
  opacity: 1;
  transition: 1s;
  transition-delay: 0.6s;
}
.-flexwrap .-sec.-on .credit .item .link {
  pointer-events: initial;
}
.-flexwrap .-sec.-none {
  pointer-events: none;
  cursor: initial;
}

.sec07 {
  margin: 0 auto 0.6666666667vw;
  position: relative;
  width: 100vw;
  height: 71.5238095238vw;
  overflow: hidden;
}
.sec07__Thum {
  position: absolute;
  width: 100vw;
  top: 0;
  left: 0;
  overflow: hidden;
}
.sec07__Thum a {
  position: relative;
  display: block;
  pointer-events: none;
}
.sec07__Thum a:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  content: "";
  background: rgba(78, 174, 251, 0.7);
  z-index: 10;
  opacity: 0;
  transition: 0.6s;
}
.sec07.-on .sec07__Thum a {
  pointer-events: auto;
}
.sec07.-on .sec07__Thum a:before {
  opacity: 1;
}
.sec07.-on .credit {
  opacity: 1;
  transition: 1s;
  transition-delay: 0.6s;
}
.sec07.-on .credit .item .link {
  pointer-events: initial;
}

.sec10 {
  margin: auto;
  position: relative;
  width: 100vw;
  height: 66.6666666667vw;
}
.sec10__Thum {
  position: absolute;
  width: 100vw;
  height: 66.6666666667vw;
  top: 0;
  left: 0;
}
.sec10__Staff {
  position: absolute;
  bottom: 10.9047619048vw;
  left: 2.619047619vw;
  color: #fff;
  font-size: 1vw;
  letter-spacing: 0.055em;
  line-height: 1.5714285714vw;
  z-index: 10;
  opacity: 0;
  transition: 0.6s;
  transition-delay: 1s;
  font-family: "Times New Roman", sans-serif;
}
.sec10__Allitembtn {
  position: absolute;
  bottom: 7.8571428571vw;
  left: 2.380952381vw;
  color: #fff !important;
  font-size: 0.9523809524vw;
  padding-left: 1.0952380952vw;
  letter-spacing: 0.055em;
  line-height: 1;
  z-index: 10;
  opacity: 0;
  transition: 0.6s;
  transition-delay: 2s;
  font-family: "Times New Roman", sans-serif;
}
.sec10__Allitembtn:before {
  position: absolute;
  left: 0.3333333333vw;
  top: 0.2380952381vw;
  content: "";
  width: 0.3333333333vw;
  height: 0.4761904762vw;
  background: url("./../img/icon_arrow.svg");
  background-size: cover;
}
.sec10__Allitembtn:hover {
  transition-delay: 0s;
  text-decoration: none;
  opacity: 0.6 !important;
}
.sec10__Copy {
  position: absolute;
  bottom: 2.3333333333vw;
  left: 2.380952381vw;
  letter-spacing: 0.02em;
  color: #fff !important;
  font-size: 0.5714285714vw;
  line-height: 1;
  z-index: 10;
  opacity: 0;
  transition: 0.6s;
  transition-delay: 1s;
}
.sec10.is-active .sec10__Staff,
.sec10.is-active .sec10__Allitembtn,
.sec10.is-active .sec10__Copy {
  opacity: 1;
}

.l-footer {
  padding: 0;
}

.pc-footer {
  margin: 0;
}