@charset "UTF-8";
/************************************
	Local
************************************/
/*----- JA -----*/
.lang-ja .sec-ttl {
  font-family: "Oswald", "Noto Sans JP", sans-serif;
}
.lang-ja:not(.page-top) .page-ttl {
  font-family: "Oswald", "Noto Sans JP", sans-serif;
}
.lang-ja.page-product .sec-productlist .title-ctr .title-name {
  margin-bottom: 0.5em;
}

/*----- 1Byte(SBCS) -----*/
.lang-sbcs {
  font-size: 0.23rem;
}
@media screen and (min-width: 1024px) {
  .lang-sbcs {
    font-size: 0.145rem;
  }
}
@media screen and (min-width: 1440px) {
  .lang-sbcs {
    font-size: 14.5px;
  }
}
.lang-sbcs.page-top .sec-fv .fv-title-logo-re7 img {
  width: 68%;
}
@media screen and (min-width: 769px) {
  .lang-sbcs.page-top .sec-fv .fv-title-logo-re7 img {
    width: 69.37%;
  }
}
.lang-sbcs.page-top .sec-fv .fv-title-logo-re2 img {
  width: 91.2%;
}
@media screen and (min-width: 769px) {
  .lang-sbcs.page-top .sec-fv .fv-title-logo-re2 img {
    width: 77.81%;
  }
}
.lang-sbcs.page-top .sec-fv .fv-title-logo-re3 img {
  width: 86.4%;
}
@media screen and (min-width: 769px) {
  .lang-sbcs.page-top .sec-fv .fv-title-logo-re3 img {
    width: 75.31%;
  }
}
.lang-sbcs.page-top .sec-fv .fv-text .release {
  font-weight: 400;
}
.lang-sbcs.page-top .sec-product .conts-upgrade .conts-ttl {
  font-family: "Oswald", sans-serif;
}
.lang-sbcs.page-top .sec-feature .conts-feature-ttl-text {
  font-family: "Oswald", sans-serif;
  font-weight: 500;
  color: #EB0000;
  margin-bottom: 0;
}
.lang-sbcs.page-top .sec-about .conts .title-link-list-item .title-link-logo-re7 {
  top: 70%;
  width: 60%;
}
@media screen and (min-width: 769px) {
  .lang-sbcs.page-top .sec-about .conts .title-link-list-item .title-link-logo-re7 {
    top: 75%;
    width: 78.09%;
  }
}
.lang-sbcs.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
  width: 82.85%;
}
@media screen and (min-width: 769px) {
  .lang-sbcs.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
    width: 83.33%;
  }
}
.lang-sbcs.page-product .sec-intro .sec-ttl {
  font-family: "Oswald", sans-serif;
}
.lang-sbcs.page-product .sec-productlist .sec-ttl {
  font-family: "Oswald", sans-serif;
}

/*----- US -----*/
.lang-us.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 0.75em;
  text-indent: -0.75em;
}
.lang-us.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 0.75em;
  text-indent: -0.75em;
}

/*----- UK -----*/
.lang-uk.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 0.75em;
  text-indent: -0.75em;
}
.lang-uk.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 0.75em;
  text-indent: -0.75em;
}

/*----- FR -----*/
.lang-fr .btn-buy-page .btn-item a {
  padding: 2.66vw 5.33vw 2.66vw 5.33vw;
}
@media screen and (min-width: 769px) {
  .lang-fr .btn-buy-page .btn-item a {
    padding: 1.6vw 4vw 1.6vw 4vw;
  }
}
@media screen and (min-width: 1024px) {
  .lang-fr .btn-buy-page .btn-item a {
    padding: 0.62vw 1.56vw 0.62vw 1.56vw;
  }
}
@media screen and (min-width: 1440px) {
  .lang-fr .btn-buy-page .btn-item a {
    padding: 12px 30px;
  }
}
.lang-fr.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 0.5em;
  text-indent: -0.5em;
}
@media screen and (min-width: 769px) {
  .lang-fr.page-top .sec-feature .sec-lead {
    max-width: 62%;
  }
}
.lang-fr.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 0.5em;
  text-indent: -0.5em;
}

/*----- IT -----*/
.lang-it .btn-buy-page .btn-item a {
  padding: 2.66vw 5.33vw 2.66vw 5.33vw;
}
@media screen and (min-width: 769px) {
  .lang-it .btn-buy-page .btn-item a {
    padding: 1.6vw 4vw 1.6vw 4vw;
  }
}
@media screen and (min-width: 1024px) {
  .lang-it .btn-buy-page .btn-item a {
    padding: 0.62vw 1.56vw 0.62vw 1.56vw;
  }
}
@media screen and (min-width: 1440px) {
  .lang-it .btn-buy-page .btn-item a {
    padding: 12px 30px;
  }
}
@media screen and (min-width: 769px) {
  .lang-it.page-top .sec-fv .fv-text .lead {
    font-size: 0.38rem;
  }
}
@media screen and (min-width: 1440px) {
  .lang-it.page-top .sec-fv .fv-text .lead {
    font-size: 38px;
  }
}
.lang-it.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 2.5em;
  text-indent: -2.5em;
}
@media screen and (min-width: 769px) {
  .lang-it.page-top .sec-feature .sec-lead {
    max-width: 48%;
  }
}
.lang-it.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 2.5em;
  text-indent: -2.5em;
}

/*----- DE -----*/
.lang-de .btn-buy-page .btn-item a {
  padding: 2.66vw 5.33vw 2.66vw 5.33vw;
}
@media screen and (min-width: 769px) {
  .lang-de .btn-buy-page .btn-item a {
    padding: 1.6vw 4vw 1.6vw 4vw;
  }
}
@media screen and (min-width: 1024px) {
  .lang-de .btn-buy-page .btn-item a {
    padding: 0.62vw 1.56vw 0.62vw 1.56vw;
  }
}
@media screen and (min-width: 1440px) {
  .lang-de .btn-buy-page .btn-item a {
    padding: 12px 30px;
  }
}
@media screen and (min-width: 769px) {
  .lang-de.page-top .sec-fv .fv-text .lead {
    font-size: 0.38rem;
  }
}
@media screen and (min-width: 1440px) {
  .lang-de.page-top .sec-fv .fv-text .lead {
    font-size: 38px;
  }
}
.lang-de.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 3.5em;
  text-indent: -3.5em;
}
.lang-de.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 3.5em;
  text-indent: -3.5em;
}

/*----- ES -----*/
.lang-es .btn-buy-page .btn-item a {
  padding: 2.66vw 5.33vw 2.66vw 5.33vw;
}
@media screen and (min-width: 769px) {
  .lang-es .btn-buy-page .btn-item a {
    padding: 1.6vw 4vw 1.6vw 4vw;
  }
}
@media screen and (min-width: 1024px) {
  .lang-es .btn-buy-page .btn-item a {
    padding: 0.62vw 1.56vw 0.62vw 1.56vw;
  }
}
@media screen and (min-width: 1440px) {
  .lang-es .btn-buy-page .btn-item a {
    padding: 12px 30px;
  }
}
.lang-es.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 2.5em;
  text-indent: -2.5em;
}
.lang-es.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 2.5em;
  text-indent: -2.5em;
}

/*----- pt-BR -----*/
.lang-ptbr .btn-buy-page .btn-item a {
  padding: 2.66vw 5.33vw 2.66vw 5.33vw;
}
@media screen and (min-width: 769px) {
  .lang-ptbr .btn-buy-page .btn-item a {
    padding: 1.6vw 2.66vw 1.6vw 2.66vw;
  }
}
@media screen and (min-width: 1024px) {
  .lang-ptbr .btn-buy-page .btn-item a {
    padding: 0.62vw 1.04vw 0.62vw 1.04vw;
  }
}
@media screen and (min-width: 1440px) {
  .lang-ptbr .btn-buy-page .btn-item a {
    padding: 12px 20px;
  }
}
.lang-ptbr.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 0.5em;
  text-indent: -0.5em;
}
.lang-ptbr.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 0.5em;
  text-indent: -0.5em;
}

/*----- HK -----*/
.lang-zhhant .sec-ttl {
  font-family: "Oswald", "Noto Sans TC", sans-serif;
}
.lang-zhhant:not(.page-top) .page-ttl {
  font-family: "Oswald", "Noto Sans TC", sans-serif;
}
.lang-zhhant.page-top .sec-fv .fv-title-logo-re7 img {
  width: 68%;
}
@media screen and (min-width: 769px) {
  .lang-zhhant.page-top .sec-fv .fv-title-logo-re7 img {
    width: 69.37%;
  }
}
.lang-zhhant.page-top .sec-fv .fv-title-logo-re2 img {
  width: 91.2%;
}
@media screen and (min-width: 769px) {
  .lang-zhhant.page-top .sec-fv .fv-title-logo-re2 img {
    width: 77.81%;
  }
}
.lang-zhhant.page-top .sec-fv .fv-title-logo-re3 img {
  width: 86.4%;
}
@media screen and (min-width: 769px) {
  .lang-zhhant.page-top .sec-fv .fv-title-logo-re3 img {
    width: 75.31%;
  }
}
.lang-zhhant.page-top .sec-about .conts .title-link-list-item .title-link-logo-re7 {
  top: 70%;
  width: 60%;
}
@media screen and (min-width: 769px) {
  .lang-zhhant.page-top .sec-about .conts .title-link-list-item .title-link-logo-re7 {
    top: 75%;
    width: 78.09%;
  }
}
.lang-zhhant.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
  width: 82.85%;
}
@media screen and (min-width: 769px) {
  .lang-zhhant.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
    width: 83.33%;
  }
}

/*----- CN -----*/
.lang-zhhans .sec-ttl {
  font-family: "Oswald", "Noto Sans SC", sans-serif;
}
.lang-zhhans:not(.page-top) .page-ttl {
  font-family: "Oswald", "Noto Sans SC", sans-serif;
}
.lang-zhhans.page-top .sec-fv .fv-title-logo-re7 img {
  width: 68%;
}
@media screen and (min-width: 769px) {
  .lang-zhhans.page-top .sec-fv .fv-title-logo-re7 img {
    width: 69.37%;
  }
}
.lang-zhhans.page-top .sec-fv .fv-title-logo-re2 img {
  width: 91.2%;
}
@media screen and (min-width: 769px) {
  .lang-zhhans.page-top .sec-fv .fv-title-logo-re2 img {
    width: 77.81%;
  }
}
.lang-zhhans.page-top .sec-fv .fv-title-logo-re3 img {
  width: 86.4%;
}
@media screen and (min-width: 769px) {
  .lang-zhhans.page-top .sec-fv .fv-title-logo-re3 img {
    width: 75.31%;
  }
}
.lang-zhhans.page-top .sec-about .conts .title-link-list-item .title-link-logo-re7 {
  top: 70%;
  width: 60%;
}
@media screen and (min-width: 769px) {
  .lang-zhhans.page-top .sec-about .conts .title-link-list-item .title-link-logo-re7 {
    top: 75%;
    width: 78.09%;
  }
}
.lang-zhhans.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
  width: 82.85%;
}
@media screen and (min-width: 769px) {
  .lang-zhhans.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
    width: 83.33%;
  }
}

/*----- KR -----*/
.lang-ko .sec-ttl {
  font-family: "Oswald", "Noto Sans KR", sans-serif;
}
.lang-ko:not(.page-top) .page-ttl {
  font-family: "Oswald", "Noto Sans KR", sans-serif;
}
.lang-ko.page-top .sec-fv .fv-title-logo-re3 img {
  width: 86.4%;
}
@media screen and (min-width: 769px) {
  .lang-ko.page-top .sec-fv .fv-title-logo-re3 img {
    width: 75.62%;
  }
}
.lang-ko.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
  width: 82.85%;
}
@media screen and (min-width: 769px) {
  .lang-ko.page-top .sec-about .conts .title-link-list-item .title-link-logo-re3 {
    width: 83.33%;
  }
}

/*----- ASIA -----*/
.lang-enasia.page-top .sec-product .upgrade-notice .notes-item {
  padding-left: 0.75em;
  text-indent: -0.75em;
}
.lang-enasia.page-product .sec-intro .upgrade-notice .notes-item {
  padding-left: 0.75em;
  text-indent: -0.75em;
}

/************************************
	Anime
************************************/
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes fadeInBottom {
  0% {
    transform: translateY(20px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeInTop {
  0% {
    opacity: 0;
    transform: translateY(100%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/************************************
	State
************************************/
/*----- 認証 -----*/
[data-js-elem=auth].is-hide {
  display: none;
}

/*----- ファーストビュー -----*/
[data-js-anime-fv] {
  backface-visibility: hidden;
  opacity: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

[data-js-anime-fv="0"].is-anime {
  animation: fadeInBottom 1s ease-in-out forwards;
}

[data-js-anime-fv="1"].is-anime {
  animation: fadeInBottom 1s ease-in-out forwards;
  animation-delay: 0.5s;
}

[data-js-anime-fv="2"].is-anime {
  animation: fadeIn 1s ease-in-out forwards;
  animation-delay: 1s;
}

[data-js-anime-fv=pf].is-anime {
  animation: fadeInBottom 1s ease-in-out forwards;
  animation-delay: 0.5s;
}
@media screen and (min-width: 769px) {
  [data-js-anime-fv=pf].is-anime {
    animation: fadeIn 1s ease-in-out forwards;
    animation-delay: 1s;
  }
}

@media screen and (max-width: 768px) {
  [data-js-anime-fv=btnBuy].is-anime {
    animation: fadeIn 1s ease-in-out forwards;
    animation-delay: 1s;
  }
}

/*----- フェードイン -----*/
[data-js-anime-element=fadeUp] {
  backface-visibility: hidden;
  opacity: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform;
}
[data-js-anime-element=fadeUp].is-anime {
  animation: fadeInBottom 0.8s ease-in-out forwards;
}
[data-js-anime-element=fadeUp][data-js-anime-fadeUp="1"].is-anime {
  animation-delay: 0.4s;
}
[data-js-anime-element=fadeUp][data-js-anime-fadeUp="2"].is-anime {
  animation-delay: 0.8s;
}
[data-js-anime-element=fadeUp][data-js-anime-fadeUp="3"].is-anime {
  animation-delay: 1.2s;
}

/*----- 購入ボタン -----*/
.btn-buy {
  transition: opacity 0.4s ease;
}
.btn-buy.is-disable {
  opacity: 0.4;
  pointer-events: none;
}

@media screen and (max-width: 768px) {
  [data-js-elem=btnBuyPage] {
    bottom: calc(-0.43rem - 10.66vw);
    font-size: 0.43rem;
    margin: 0;
    position: fixed;
    transition: bottom 0.4s ease-in-out;
    z-index: 2;
  }
}
@media screen and (min-width: 769px) {
  [data-js-elem=btnBuyPage] {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  [data-js-elem=btnBuyPage] .btn-item a {
    padding: 2.66vw 8vw 2.66vw 8vw;
  }
}
@media screen and (max-width: 768px) {
  [data-js-elem=btnBuyPage].is-show {
    bottom: 0;
  }
}

/*----- 比較イメージ切り替え -----*/
[data-js-elem=comparisonImgItem] {
  opacity: 0;
}
[data-js-elem=comparisonImgItem].is-active {
  opacity: 1;
  z-index: 1;
}

[data-js-trigger=comparisonImgSwitcher] .btn-item {
  background: rgba(235, 0, 0, 0);
  transition: all 0.2s ease;
}
[data-js-trigger=comparisonImgSwitcher].is-active .btn-item {
  background: #eb0000;
}
[data-js-trigger=comparisonImgSwitcher].is-active .btn-item span {
  background-image: url(../images/common/btn-buy_pattern.png);
}
