.header {
  position: absolute;
  left: 0;
  top: 0;
}
.header__platform {
  display: flex;
  align-items: center;
  width: 560px;
}
.header__logo--switch {
  width: 80px;
}
.header__logo--ps {
  width: 280px;
  margin-left: 20px;
}
.header__logo--steam {
  width: 130px;
  margin-left: 20px;
}
.header__logo--epic {
  width: 38px;
  margin-left: 20px;
}

main {
  margin-top: 0;
}
main .mv {
  background: url(../images/mv_bg.jpg) no-repeat center bottom/cover;
  position: relative;
  padding-bottom: 60px;
  padding-top: 10px;
}
main .mv__top {
  background: url(../images/mv.png) no-repeat center top/contain;
  width: 100%;
  max-width: 1920px;
  margin: -20px auto 0;
}
main .mv__lead {
  text-align: center;
  padding-top: 90px;
  margin: 0 auto 11.5%;
  width: 80%;
}
main .mv__catch {
  width: 52%;
  margin-left: 20%;
}
main .mv__titleWrap {
  width: 77%;
  text-align: center;
  margin-left: -60px;
}
main .mv__title {
  margin: -45px 0 20px;
}
main .mv__topic {
  padding-left: 30px;
  width: 76%;
}
main .mv__buy {
  text-align: center;
  margin: 120px auto 0;
  width: fit-content;
  max-width: 100%;
}
main .mv__heading {
  padding-bottom: 30px;
}
main .mv__btnWrap {
  display: flex;
  align-items: center;
  margin-bottom: 40px;
}
main .mv__btn {
  position: relative;
  width: 300px;
}
main .mv__btn + .mv__btn {
  margin-left: 20px;
}
main .mv__btnLink {
  color: #fff;
  font-weight: 700;
  background: #ffc561;
  background: linear-gradient(270deg, rgb(255, 197, 97) 0%, rgb(242, 66, 104) 100%);
  text-align: center;
  display: block;
  min-height: 62px;
}
main .mv__btnLink::after {
  content: url(../images/arrow_w.png);
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  right: 15px;
}
main .mv__btnLink.disabled {
  opacity: 1;
  pointer-events: none;
  background: linear-gradient(270deg, rgba(255, 197, 97, 0.3) 0%, rgba(242, 66, 104, 0.3) 100%);
}
main .mv__btnLink.disabled .mv__btnText {
  opacity: 0.3;
  /*padding-bottom: 20px;*/
}
main .mv__btnLink.disabled::after {
  opacity: 0.3;
}
main .mv__btnLink.disabled::before {
  opacity: 0.3;
}
main .mv__btnLink.ps .mv__btnText {
  padding-left: 10px;
}
main .mv__btnLink.ps::before {
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  left: 15px;
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background-image: url(../images/logoS_ps.png);
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}
main .mv__btnLink.nintendo .mv__btnText {
  padding-left: 10px;
}
main .mv__btnLink.nintendo::before {
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  left: 15px;
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background-image: url(../images/logoS_nintendo.png);
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}
main .mv__btnLink.steam .mv__btnText {
  padding-left: 10px;
}
main .mv__btnLink.steam::before {
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  left: 15px;
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background-image: url(../images/logoS_steam.png);
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}
main .mv__btnLink.epic .mv__btnText {
  padding-left: 10px;
}
main .mv__btnLink.epic::before {
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  left: 15px;
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background-image: url(../images/logoS_epic.png);
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}
main .mv__btnState {
  display: none;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 100%;
  background: rgba(242, 66, 104, 0.99);
  padding: 15px 5px;
}
main .mv__btnState li + li {
  margin-top: 5px;
}
main .mv__btnState li a {
  color: #fff;
}
main .mv__btnText {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
main .mv__comingsoon {
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.2rem;
}
main .mv__bonus > .mv__bonusItemSubttl {
  margin-top: -20px;
}
main .mv__bonusTtl {
  text-align: center;
  margin-bottom: 30px;
}
main .mv__bonusList {
  position: relative;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: flex-start;
  margin: 0 10px 20px;
  z-index: 2;
}
main .mv__bonusList.flexStart {
  justify-content: flex-start;
}
main .mv__bonusItem {
  width: calc((100% - 120px) / 4);
  position: relative;
}
main .mv__bonusItem + li {
  margin-left: 40px;
}
main .mv__bonusItem:nth-child(4n+1) {
  margin-left: 0;
}
main .mv__bonusItem iframe {
  display: none;
}
main .mv__bonusItemSubttl {
  text-align: center;
  margin-bottom: 10px;
}
main .mv__bonusItemWrap {
  box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.5);
}
main .mv__disabled:hover {
  opacity: 1;
}
main .mv__bonusImg {
  position: relative;
}
main .mv__bonusImg::after {
  content: "";
  background: url(../images/playback.png) no-repeat center/contain;
  top: 25%;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
  width: 63px;
  height: 71px;
  max-width: 22%;
  max-height: 26%;
}
main .mv__bonusBtn {
  background: #000;
  border: 2px solid #ffc561;
  border-image: linear-gradient(270deg, rgb(255, 197, 97) 0%, rgb(242, 66, 104) 100%);
  border-image-slice: 1;
  text-align: center;
  display: block;
  margin-left: auto;
  position: relative;
  padding: 10px;
}
main .mv__bonusBtn::after {
  content: url(../images/arrow.png);
  position: absolute;
  top: 55%;
  transform: translateY(-50%);
  right: 10px;
}
main .mv__bonusBtnText {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  background: #ffc561;
  background: linear-gradient(270deg, rgb(255, 197, 97) 0%, rgb(242, 66, 104) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline;
}
main .mv__bonusNote {
  text-align: center;
  line-height: 1.5;
  font-size: 1.4rem;
}
main .mv__random {
  position: relative;
  z-index: 1;
}
main .mv__random::before, main .mv__random::after {
  bottom: -215px;
  position: absolute;
  z-index: -1;
}
main .mv__random::before {
  content: url(../images/pickup_random_l.png);
  left: 0;
}
main .mv__random::after {
  content: url(../images/pickup_random_r.png);
  right: 0;
}
main .intro {
  background: url(../images/movie_line.png) repeat-x bottom center/auto, url(../images/bg_dot.png) repeat-x top center/auto, #3057c4;
}
main .movie {
  padding: 60px 0;
}
main .movie__img {
  border: 2px solid #ffc561;
  border-image: linear-gradient(270deg, rgb(255, 197, 97) 0%, rgb(242, 66, 104) 100%);
  border-image-slice: 1;
  filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.5));
}
main .movie__main {
  text-align: center;
}
main .gallery {
  padding: 60px 0 20px;
}
main .gallery__inner {
  z-index: 2;
  position: relative;
}
main .gallery__list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
main .gallery__item {
  width: calc((100% - 120px) / 4);
  margin-bottom: 40px;
}
main .gallery__img {
  box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.5);
}
main .gallery__data {
  display: none;
}
main .gallery__random {
  position: relative;
  z-index: 1;
}
main .gallery__random::before, main .gallery__random::after {
  bottom: -220px;
  position: absolute;
  z-index: -1;
}
main .gallery__random::before {
  content: url(../images/movie_random_l.png);
  left: 0;
}
main .gallery__random::after {
  content: url(../images/movie_random_r.png);
  right: 0;
}
main .product {
  padding: 60px 0 330px;
  background: url(../images/product_dot.png) repeat-x top center/auto, url(../images/product_cloud.png) no-repeat top 360px center/contain, url(../images/product_ground.png) repeat-x bottom center/auto, #78bbff;
  position: relative;
}
main .product::after {
  content: url(../images/product_object_03.png);
  position: absolute;
  right: 0;
  bottom: -90px;
}
main .product__inner {
  position: relative;
}
main .product__inner::before {
  content: url(../images/product_object_01.png);
  bottom: -250px;
  left: -55px;
  position: absolute;
}
main .product__inner::after {
  content: url(../images/product_object_02.png);
  bottom: -280px;
  left: 360px;
  position: absolute;
}
main .product__box {
  padding: 30px 60px 60px;
  background: rgba(255, 255, 255, 0.6);
  background: linear-gradient(270deg, rgba(255, 255, 255, 0.6) 0%, rgb(255, 255, 255) 100%);
  outline: 4px rgba(255, 255, 255, 0.6) solid;
  outline-offset: 5px;
  color: #000;
  width: 1200px;
  margin: 0 auto;
  max-width: 100%;
}
main .product__table {
  width: 100%;
}
main .product__head {
  font-weight: 700;
  width: 190px;
  vertical-align: top;
  border-bottom: #ff1440 1px solid;
  text-align: left;
  padding: 15px 0;
}
main .product__data {
  position: relative;
  padding: 15px 0;
  border-bottom: rgba(0, 0, 0, 0.2) 1px solid;
  z-index: 100;
}
main .product__data p + p {
  padding-top: 1em;
}
main .product__img {
  width: 65px;
}

.fancybox-content {
  padding: 0 !important;
}

@media (max-width: 1920px) {
  main .mv__random::before {
    content: "";
    background: url(../images/pickup_random_l.png) no-repeat left bottom/contain;
    width: 25.5vw;
    height: 350px;
  }
  main .mv__random::after {
    content: "";
    background: url(../images/pickup_random_r.png) no-repeat right bottom/contain;
    width: 36vw;
    height: 360px;
  }
  main .gallery__random::before {
    content: "";
    background: url(../images/movie_random_l.png) no-repeat left bottom/contain;
    width: 27vw;
    height: 560px;
  }
  main .gallery__random::after {
    content: "";
    background: url(../images/movie_random_r.png) no-repeat right bottom/contain;
    width: 27vw;
    height: 540px;
  }
}
@media (max-width: 1670px) {
  main .mv__titleWrap {
    margin-left: 0;
  }
  main .product__inner::before {
    left: 0;
  }
}
@media (max-width: 1190px) {
  .header__platform {
    max-width: 26.5vw;
  }
  main .mv__top {
    padding-bottom: 90px;
  }
  main .mv__title {
    margin-top: -20px;
  }
  main .mv__bonusBtnText {
    font-size: 1.2rem;
  }
  main .product__inner::before, main .product__inner::after {
    z-index: 2;
  }
  main .product__box {
    z-index: 1;
    position: relative;
  }
}
/* STYLE MOBILE */
@media (max-width: 768px) {
  .header__platform {
    max-width: 100%;
    margin-top: 40px;
  }
  .header__logo--switch {
    width: 48px;
  }
  .header__logo--ps {
    width: 170px;
    margin-left: 5px;
  }
  .header__logo--steam {
    width: 80px;
    margin-left: 5px;
  }
  .header__logo--epic {
    width: 26px;
    margin-left: 5px;
  }
  main {
    margin-top: 40px;
  }
  main .mv {
    background: url(../images/mv_bg-sp.jpg) no-repeat top right/cover;
    padding: 20px 0 30px;
  }
  main .mv__inner {
    margin-top: -180px;
  }
  main .mv__top {
    background: none;
    padding: 0;
  }
  main .mv__titleWrap {
    width: 100%;
  }
  main .mv__title {
    margin-bottom: 10px;
  }
  main .mv__release {
    width: 70.4%;
    margin: 10px auto 25px;
  }
  main .mv__buy {
    width: auto;
    margin: 60px auto 0;
  }
  main .mv__heading {
    width: 246px;
    margin: 0 auto 20px;
    padding: 0;
  }
  main .mv__btnWrap {
    display: block;
    margin-bottom: 30px;
  }
  main .mv__btn {
    width: 100%;
  }
  main .mv__btn + .mv__btn {
    margin-left: 0;
    margin-top: 10px;
  }
  main .mv__btnLink {
    min-height: 50px;
  }
  main .mv__btnLink::after {
    right: 15px;
  }
  main .mv__btnLink.ps .mv__btnText {
    padding-left: 0;
  }
  main .mv__btnLink.nintendo .mv__btnText {
    padding-left: 0;
  }
  main .mv__btnLink.steam .mv__btnText {
    padding-left: 0;
  }
  main .mv__btnLink.epic::before {
    left: 22px;
  }
  main .mv__btnLink.epic .mv__btnText {
    padding-left: 0;
  }
  main .mv__btnState {
    padding: 10px;
  }
  main .mv__btnState li + li {
    margin-top: 10px;
  }
  main .mv__btnState li a {
    font-size: 1.4rem;
  }
  main .mv__btnText {
    position: static;
    transform: none;
    text-align: center;
    width: 100%;
    font-size: 1.4rem;
    padding: 12.5px 0;
  }
  main .mv__bonusTtl {
    margin: 0 10.43% 10px;
  }
  main .mv__bonusList {
    display: block;
    margin: 0 0 10px;
  }
  main .mv__bonusItem {
    width: 100%;
  }
  main .mv__bonusItem + li {
    margin-left: 0;
    margin-top: 10px;
  }
  main .mv__bonusItemWrap {
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.5));
  }
  main .mv__bonusImg::after {
    width: 37px;
    height: 37px;
    max-width: 37px;
    max-height: 37px;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  main .mv__bonusBtn {
    padding: 4px 0 7px;
    line-height: 1;
  }
  main .mv__bonusBtn::after {
    content: "";
    background: url(../images/arrow.png) no-repeat center/contain;
    width: 8px;
    height: 13px;
    top: 50%;
  }
  main .mv__bonusBtnText {
    font-size: 1rem;
  }
  main .mv__bonusNote {
    text-align: left;
    font-size: 1.2rem;
    text-indent: -1.5em;
    padding-left: 1.5em;
  }
  main .mv__random::before {
    content: "";
    background: url(../images/pickup_random_sp.png) no-repeat center/cover;
    display: inline-block;
    width: 250px;
    height: 170px;
    bottom: -110px;
  }
  main .mv__random::after {
    content: none;
  }
  main .intro {
    background: url(../images/movie_line-sp.png) repeat-x center bottom/contain, #3057c4;
  }
  main .movie {
    padding: 30px 0 0;
    background: url(../images/bg_dot-sp.png) repeat-x top center/contain, #3057c4;
  }
  main .movie__title {
    width: 180px;
  }
  main .gallery__title {
    width: 195px;
  }
  main .gallery__item {
    width: calc((100% - 20px) / 2);
    margin-bottom: 20px;
  }
  main .gallery__img {
    box-shadow: 6px 6px 0px 0px rgba(0, 0, 0, 0.5);
  }
  main .gallery__random::before {
    content: "";
    background: url(../images/movie_random_sp.png) no-repeat center/cover;
    display: inline-block;
    width: 256px;
    height: 275px;
    bottom: -110px;
  }
  main .gallery__random::after {
    content: none;
  }
  main .product {
    padding: 30px 0 160px;
    background: url(../images/product_cloud-sp.png) no-repeat top 110px center/contain, url(../images/product_dot-sp.png) repeat-x top center/contain, url(../images/product_ground-sp.png) repeat-x bottom center/contain, #78bbff;
  }
  main .product::after {
    content: "";
    background: url(../images/product_object_sp.png) no-repeat bottom right/cover;
    display: inline-block;
    width: 215px;
    height: 435px;
    bottom: -15px;
  }
  main .product__inner::before, main .product__inner::after {
    content: none;
  }
  main .product__title {
    width: 230px;
  }
  main .product__box {
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.6) 0%, rgb(255, 255, 255) 100%);
    padding: 15px 15px 25px;
    z-index: 1;
    margin: 10px;
    width: auto;
  }
  main .product__head {
    display: block;
    border-bottom: none;
    padding: 15px 0 0;
  }
  main .product__head::after {
    content: ":";
    padding-left: 5px;
  }
  main .product__data {
    display: block;
    padding: 10px 0 15px;
    z-index: initial;
  }
  main .product__data::after {
    content: "";
    border-bottom: #ff1440 1px solid;
    width: 50%;
    position: absolute;
    left: 0;
    bottom: -0.5px;
  }
  main .product__img {
    width: 60px;
  }
}