@charset "UTF-8";
/************************************
  module
************************************/
/****** ローディング ******/
.page-loading {
  background: #000 url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg.jpg) center top no-repeat;
  background-size: cover;
  height: 100%;
  opacity: 1;
  position: fixed;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  transition: opacity 1s ease-out, z-index 1s ease-out;
  width: 100%;
  z-index: 9;
}

@media only screen and (min-width: 769px) {
  .page-loading {
    height: 100%;
  }
}

.page-loading-item {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 65px;
}

.page-loading-ic {
  opacity: 0;
  left: 0;
  position: absolute;
  top: 0;
}

.page-loading-ic-01 {
  position: relative;
}
/****** 背景 ******/
.page-bg {
  left: 0;
  position: absolute;
  width: 100%;
}

.page-bg::after {
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

/* ベース */
.page-bg-top {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg-t-c.jpg);
  background-position: center top;
  background-repeat: repeat-y;
  background-size: 100%;
  z-index: -1;
}

@media only screen and (min-width: 769px) {
  .page-bg-top {
    height: calc(100% + 5vw);
    top: 0;
  }
}
/* UK */
/*
.lang-uk .page-bg-top {
  height: calc(100% + 130vw);
  top: -130vw;
}
@media only screen and (min-width: 769px) {
  .lang-uk .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}
.lang-uk.fvBnr-on .page-bg-top {
  height: calc(100% + 185vw);
  top: -175vw;
}
@media only screen and (min-width: 769px) {
  .lang-uk.fvBnr-on .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}
*/
/* HK */
/*
.lang-hk .page-bg-top {
  height: calc(100% + 130vw);
  top: -130vw;
}
@media only screen and (min-width: 769px) {
  .lang-hk .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}
.lang-hk.fvBnr-on .page-bg-top {
  height: calc(100% + 180vw);
  top: -170vw;
}
@media only screen and (min-width: 769px) {
  .lang-hk.fvBnr-on .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}
*/
/* CN */
/*
.lang-cn .page-bg-top {
  height: calc(100% + 130vw);
  top: -130vw;
}

@media only screen and (min-width: 769px) {
  .lang-cn .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}

.lang-cn.fvBnr-on .page-bg-top {
  height: calc(100% + 154vw);
  top: -154vw;
}

@media only screen and (min-width: 769px) {
  .lang-cn.fvBnr-on .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}
*/
/* KR */
/*
.lang-kr .page-bg-top {
  height: calc(100% + 130vw);
  top: -130vw;
}

@media only screen and (min-width: 769px) {
  .lang-kr .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}

.lang-kr.fvBnr-on .page-bg-top {
  height: calc(100% + 154vw);
  top: -199vw;
}

@media only screen and (min-width: 769px) {
  .lang-kr.fvBnr-on .page-bg-top {
    height: calc(100% + 5vw);
    top: .35vw;
  }
}
*/

.page-bg-top::before {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg-t-t.png);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  bottom: calc(100% - 2px);
  content: "";
  display: block;
  height: 12vw;
  left: 0;
  position: absolute;
  width: 100%;
}

@media only screen and (min-width: 769px) {
  .page-bg-top::before {
    height: 6vw;
  }
}

.page-bg-top::after {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg-t-b.png);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100%;
  height: 7vw;
  top: calc(100% - 2px - 4.5vw);
}

.page-bg-btm {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg-t-c.jpg);
  background-position: center top;
  background-repeat: repeat-y;
  background-size: 100%;
  height: calc(100vh + 12vw + 50px);
  top: -8vw;
  z-index: -1;
}

@media only screen and (min-width: 769px) {
  .page-bg-btm {
    height: calc(100vh + 8vw + 100px);
    top: -2vw;
  }
}

.page-bg-btm::before {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg-t-t.png);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  bottom: calc(100% - 2px);
  content: "";
  display: block;
  height: 12vw;
  left: 0;
  position: absolute;
  width: 100%;
}

@media only screen and (min-width: 769px) {
  .page-bg-btm::before {
    height: 6vw;
  }
}

.page-bg-base {
  height: 100%;
  position: fixed;
  top: 0;
}

.page-bg-base::after {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

@media only screen and (min-width: 769px) {
  .page-bg-base::after {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg.jpg);
    background-attachment: fixed;
  }
}

.mv {
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: -1;
}

.mv-bg {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.mv-mask {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/page_bg.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 100%;
  z-index: 3;
}

.mv-mask-bg {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  -webkit-mask: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/mask.png);
  -webkit-mask-size: 2300% 100%;
  z-index: 3;
}

.mv-mask-bg::before {
  content: '';
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.mv-mask-bg::after {
  background: #FFF;
  content: '';
  display: block;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.sec-bg {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.sec-bg::after {
  content: "";
  display: block;
  height: 100vh;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

@media only screen and (min-width: 769px) {
  .sec-bg::after {
    height: 100%;
    position: absolute;
  }
}

.sec-bg-box {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.sec-bg-box::before {
  background: rgba(0, 0, 0, 0.45);
  content: "";
  display: block;
  height: 100vh;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

@media only screen and (min-width: 769px) {
  .sec-bg-box::before {
    background: rgba(0, 0, 0, 0.25);
    height: 100%;
    position: absolute;
  }
}

.sec-bg-gameinfo {
  z-index: -1;
}

.sec-bg-gameinfo::after {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg01-sp.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -1;
}

@media only screen and (min-width: 769px) {
  .sec-bg-gameinfo::after {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg01.jpg);
    background-attachment: fixed;
  }
}

/****** 見出し ******/
.sec-ttl {
  background: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/sec-ttl_bg-sp.png) center no-repeat;
  background-size: contain;
  color: #FFF;
  font-family: "source-han-serif-japanese", serif;
  font-weight: 700;
  font-size: 4.26667vw;
  margin-right: auto;
  margin-bottom: 8vw;
  margin-left: auto;
  padding: .7em 0 .8em;
  position: relative;
  text-align: center;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
  width: 89.33333%;
}

@media only screen and (min-width: 769px) {
  .sec-ttl {
    background: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/sec-ttl_bg-m.png) center no-repeat;
    background-size: 100%;
    font-size: 1.875vw;
    margin-bottom: 4vw;
    width: 40.90909%;
  }
}

.sec-ttl-text {
  color: #FFF;
  font-size: 6.46667vw;
  font-weight: 700;
  margin-bottom: 8vw;
  position: relative;
  text-align: center;
}

@media only screen and (min-width: 769px) {
  .sec-ttl-text {
    font-size: 3.02083vw;
    margin-bottom: 4vw;
  }
}

/****** list ******/
.sns-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.sns-list-item .ic {
  display: block;
  height: 10vw;
  position: relative;
  width: 10vw;
}

@media only screen and (min-width: 769px) {
  .sns-list-item .ic {
    height: 3vw;
    width: 3vw;
  }
}

.sns-list-item:not(:last-child) {
  margin-bottom: 8px;
}

/****** 動画 ******/
.player-box-inner {
  overflow: hidden;
  padding-top: 56.25%;
  position: relative;
  width: 100%;
}

.player-box-inner .player {
  height: 125%;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 125%;
}

.player-box-inner video {
  height: 125%;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 125%;
  z-index: 1;
}

.player-box-inner .thumb {
  left: 50%;
  line-height: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% - 4px);
}
.player-box-inner .thumb .ic {
  display: block;
}
.player-box-inner::before, .player-box-inner::after {
  content: "";
  display: block;
  left: 50%;
  height: 100%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}

.player-box-inner::before {
  z-index: 2;
}

.player-box-inner a {
  display: block;
  left: 50%;
  height: 100%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 3;
}

.player-box-inner a::before {
  content: "";
  display: block;
  left: 50%;
  height: 100%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 2;
}

.player-box-inner a::after {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/img/play-icon.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: block;
  height: 15vw;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: background-image .2s ease-in;
  width: 15vw;
}

@media only screen and (min-width: 769px) {
  .player-box-inner a::after {
    height: 5vw;
    width: 5vw;
  }
}

@media only screen and (min-width: 769px) {
  .player-box-inner a:hover::after {
    /* background-image: url(../images/common/play_ic-y.svg); */
  }
}

/****** マルチカラム ******/
.col-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/****** toTOP ******/
.to-top {
  bottom: 4vw;
  cursor: pointer;
  position: fixed;
  right: 4vw;
  width: 10%;
  z-index: -1;
}

@media only screen and (min-width: 769px) {
  .to-top {
    bottom: 4vw;
    right: 2vw;
    width: 4%;
  }
}

.to-top img {
  height: auto;
  width: 100%;
}

/****** スクロールダウン ******/
.scroll-down {
  content: "";
  display: block;
  left: 50%;
  position: absolute;
  top: 102%;
  transform: translateX(-50%);
  z-index: 3;
}

@media only screen and (max-width: 768px) {
  .scroll-down {
    display: none;
  }
}

@media only screen and (min-width: 769px) {
  .scroll-down {
    height: 1.2vw;
    width: 1.8vw;
  }
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .scroll-down {
    height: 12vw;
  }
}

.scroll-down a {
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;
}

.scroll-down a::before {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/scrdown_ic.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  bottom: 0;
  content: '';
  display: block;
  height: inherit;
  left: 50%;
  position: absolute;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  transition: background-image .2s ease;
  width: 16px;
}

@media only screen and (min-width: 769px) {
  .scroll-down a::before {
    width: 32px;
  }
}

@media only screen and (min-width: 769px) {
  .scroll-down a:hover::before {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/common/scrdown_ic-y.png);
  }
}

/****** hover ******/
.elem-hover {
  transition: opacity .5s ease-in-out;
}

@media only screen and (min-width: 769px) {
  .elem-hover:hover {
    opacity: .8;
  }
}

/************************************
  State
************************************/
/****** Module ******/
/*---- ローディング- -----*/
.page-loading.is-hide {
  opacity: 0;
  z-index: -1;
}

.page-loading.is-active .page-loading-ic-01 {
  animation: loading 1s infinite linear forwards;
}

.page-loading.is-active .page-loading-ic-02 {
  animation: loading 1s infinite .2s linear forwards;
}

.page-loading.is-active .page-loading-ic-03 {
  animation: loading 1s infinite .4s linear forwards;
}

.page-loading.is-active .page-loading-ic-04 {
  animation: loading 1s infinite .6s linear forwards;
}

.page-loading.is-active .page-loading-ic-05 {
  animation: loading 1s infinite .8s linear forwards;
}

/*---- ページ背景- -----*/
.page-bg-btm.is-scr {
  opacity: 0;
  position: fixed;
  top: 0;
  transform: translateY(0) !important;
}

/*---- ゲーム概要背景- -----*/
.sec-bg-box::before {
  opacity: 1;
  transition: opacity .5s ease-out;
}

@media only screen and (max-width: 768px) {
  .sec-bg-box.is-scr {
    position: fixed;
    top: 0;
  }
}

.sec-bg-box.is-hide-overlay::before {
  opacity: 0;
}

.sec-bg-box.is-bgchange {
  display: none;
}

.sec-bg-gameinfo {
  opacity: 0;
  transition: opacity .5s ease-in-out;
}

.sec-bg-gameinfo::before {
  transition: opacity .5s ease-out;
}

.sec-bg-gameinfo.theme-01::after {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg01-sp.jpg);
}

@media only screen and (min-width: 769px) {
  .sec-bg-gameinfo.theme-01::after {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg01.jpg);
  }
}

.sec-bg-gameinfo.theme-02::after {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg02-sp.jpg);
}

@media only screen and (min-width: 769px) {
  .sec-bg-gameinfo.theme-02::after {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg02.jpg);
  }
}

.sec-bg-gameinfo.theme-03::after {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg03-sp.jpg);
}

@media only screen and (min-width: 769px) {
  .sec-bg-gameinfo.theme-03::after {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/gameinfo_bg03.jpg);
  }
}

.sec-bg-gameinfo.is-active {
  opacity: 1;
}

/*---- MVテーマ変更- -----*/
.mv.is-bgchange {
  display: none;
}

.theme-am .mv-bg {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-am-sp.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100%;
}

@media only screen and (min-width: 769px) {
  .theme-am .mv-bg {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-am.jpg);
  }
}

.theme-am .mv-mask-bg::before {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-am-sp.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100%;
}

@media only screen and (min-width: 769px) {
  .theme-am .mv-mask-bg::before {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-am.jpg);
  }
}

.theme-pm .mv-bg {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-pm-sp.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100%;
}

@media only screen and (min-width: 769px) {
  .theme-pm .mv-bg {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-pm.jpg);
  }
}

.theme-pm .mv-mask-bg::before {
  background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-pm-sp.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100%;
}

@media only screen and (min-width: 769px) {
  .theme-pm .mv-mask-bg::before {
    background-image: url(https://www.monsterhunter.com/rise-sunbreak/assets/css/images/mv-pm.jpg);
  }
}

/*----- ファーストビュー -----*/
.is-fv-anim {
  overflow-x: hidden;
}

.is-fv-anim .mv {
  opacity: 1;
}

.is-fv-anim .mv-mask-bg {
  -webkit-animation: mvMask 0.5s steps(22) forwards 1s;
}

.is-fv-anim .mv-mask-bg::before {
  animation: mvBefore .5s ease forwards 1s;
}

.is-fv-anim .mv-mask-bg::after {
  animation: mvAfter .5s ease forwards 1s;
}

/*----- スクロール -----*/
.is-scr .lang-select-top {
  opacity: 0;
}

.is-scr .sec#firstview .scroll-down {
  visibility: hidden;
  transition: opacity .5s ease-in;
}

.is-scr .sec#firstview .scroll-down a {
  opacity: 0;
}

/*---- ToTOP- -----*/
.to-top {
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease-in, visibility .2s ease-in, z-index .2s ease-in;
}

.to-top.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 5;
}

/************************************
  Hack
************************************/
/****** IE11 ******/
.ua-ie {
  overflow-x: hidden;
}

.ua-ie .lang-select .SumoSelect.open .optWrapper .options {
  max-height: 100% !important;
}

.ua-ie .mv-bg {
  -webkit-mask: initial !important;
  -webkit-mask-size: initia !important;
  z-index: 3;
}

.ua-ie .mv-bg::after {
  display: none;
}

.ua-ie .mv-mask {
  display: none;
}

.ua-ie .buy.buy-pos-fixed {
  top: -8%;
}

.ua-ie .buy.buy-pos-fixed.is-show {
  right: 0;
  top: 0;
}

.ua-ie .sec#timeline {
  display: none;
}

.ua-ie .sec#gameinfo .conts.Field .conts-lead[data-elem="animElem"] .image {
  transform: translate(16px, -16px);
}

.ua-ie .sec#gameinfo .conts.Field .conts-lead[data-elem="animElem"].is-anim .image {
  transform: translate(0, 0);
}

@media only screen and (min-width: 769px) {
  .ua-ie .sec#spec {
    margin-right: 0;
    margin-left: 0;
  }
}

.ua-ie.is-fvAnim .mv-bg {
  -webkit-animation: none !important;
}

/****** Edge ******/
.ua-edge {
  overflow-x: hidden;
}

@media only screen and (min-width: 769px) {
  .ua-edge {
    width: calc(100% - 12px);
  }
}

.ua-edge .nicescroll-rails-vr {
  background: #DDD !important;
  opacity: 1 !important;
  width: 12px !important;
  z-index: 99 !important;
}

.ua-edge .nicescroll-rails-vr .nicescroll-cursors {
  background: #AAA !important;
  border-radius: none !important;
  height: 250px !important;
  width: 12px !important;
}

.ua-edge .nicescroll-rails-hr {
  display: none !important;
  height: 0 !important;
  width: 0 !important;
}

.ua-edge .mv-bg {
  -webkit-mask: initial;
  -webkit-mask-size: initial;
  z-index: 3;
}

.ua-edge .mv-bg::after {
  display: none;
}

.ua-edge .mv-mask {
  display: none;
}

@media only screen and (min-width: 769px) {
  .ua-edge .buy.buy-pos-fixed {
    right: 12px;
  }
}

@media only screen and (min-width: 769px) {
  .ua-edge .lang-select-top {
    right: 12px;
  }
}

@media only screen and (min-width: 769px) {
  .ua-edge .lang-select-top .SumoSelect::after {
    right: 12px;
  }
}

@media only screen and (min-width: 769px) {
  .ua-edge .sec#gameinfo .conts-list .inner:hover .monster-name {
    animation: none !important;
  }
}

.ua-edge.is-fvAnim .mv-bg {
  -webkit-animation: none !important;
}