@charset "UTF-8";
/*==================================================*/
/* アニメーション用css */
/*==================================================*/
/*==================================================*/
/*==============================================================*/
/* アニメーション */
/*==============================================================*/
@import url("//fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700;900&display=swap");
@import url("//fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;500;600;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=East+Sea+Dokdo&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=WDXL+Lubrifont+JP+N&family=WDXL+Lubrifont+SC&family=WDXL+Lubrifont+TC&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&family=Noto+Serif+KR:wght@200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&family=Noto+Serif+TC:wght@200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100..900&family=Noto+Serif+SC:wght@200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+2:wght@100..900&display=swap");
@-webkit-keyframes bright { 0% { filter: blur(10px); opacity: 0; }
  90% { filter: blur(0); }
  100% { opacity: 1; filter: blur(0); } }
@-moz-keyframes bright { 0% { filter: blur(10px); opacity: 0; }
  90% { filter: blur(0); }
  100% { opacity: 1; filter: blur(0); } }
@keyframes bright { 0% { filter: blur(10px); opacity: 0; }
  90% { filter: blur(0); }
  100% { opacity: 1; filter: blur(0); } }
@-webkit-keyframes click { 0% { transform: translateY(0%); }
  35% { transform: translateY(0%); }
  50% { transform: translateY(-10%); }
  65% { transform: translateY(0%); }
  80% { transform: translateY(-10%); }
  95% { transform: translateY(0%); }
  100% { transform: translateY(0%); } }
@-moz-keyframes click { 0% { transform: translateY(0%); }
  35% { transform: translateY(0%); }
  50% { transform: translateY(-10%); }
  65% { transform: translateY(0%); }
  80% { transform: translateY(-10%); }
  95% { transform: translateY(0%); }
  100% { transform: translateY(0%); } }
@keyframes click { 0% { transform: translateY(0%); }
  35% { transform: translateY(0%); }
  50% { transform: translateY(-10%); }
  65% { transform: translateY(0%); }
  80% { transform: translateY(-10%); }
  95% { transform: translateY(0%); }
  100% { transform: translateY(0%); } }
@-webkit-keyframes text_on { 0% { opacity: 0; }
  99% { opacity: 1; }
  100% { opacity: 1; } }
@-moz-keyframes text_on { 0% { opacity: 0; }
  99% { opacity: 1; }
  100% { opacity: 1; } }
@keyframes text_on { 0% { opacity: 0; }
  99% { opacity: 1; }
  100% { opacity: 1; } }
@-webkit-keyframes text-eff_on { 0% { left: -100%; }
  50% { left: 0%; }
  100% { left: 100%; } }
@-moz-keyframes text-eff_on { 0% { left: -100%; }
  50% { left: 0%; }
  100% { left: 100%; } }
@keyframes text-eff_on { 0% { left: -100%; }
  50% { left: 0%; }
  100% { left: 100%; } }
.bright { -webkit-animation: bright 1s ease; -moz-animation: bright 1s ease; animation: bright 1s ease; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }

/*==================================================*/
/* 前提css */
/*==================================================*/
a, article, blockquote, body, caption, dd, div, dl, dt, footer, h1, h2, h3, h4, h5, h6, header, html, iframe, img, li, nav, ol, p, pre, section, small, span, strong, table, td, th, tr, ul, figure { background: 0; border: 0; font-size: 100%; line-height: 1; margin: 0; outline: 0; padding: 0; vertical-align: bottom; }

a, small, span, strong { vertical-align: baseline; }

article, footer, header, nav, section { display: block; }

li { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

address, th { font-style: normal; }

:focus, a:focus { outline: 0; }

br { letter-spacing: normal; }

textarea { resize: none; }

a { text-decoration: none; }

main img { height: auto; width: 100%; }

img { width: 100%; }

/*==================================================*/
/* レスポンシブ用css */
/*==================================================*/
.pc { display: block; }
.pc.inline { display: inline; }
.pc.flex { display: flex; }

.sp { display: none; }
.sp.inline { display: none; }
.sp.flex { display: none; }

@media (min-width: 981px) { .pc { display: none; }
  .pc.inline { display: none; }
  .pc.flex { display: none; }
  .sp { display: block; }
  .sp.inline { display: inline; }
  .sp.flex { display: flex; } }
body { background-color: #000; }

* { font-family: "Noto Sans JP", sans-serif; box-sizing: border-box; }

.kr a, .kr p, .kr dd, .kr dt, .kr span { font-family: "Noto Sans KR", sans-serif; }

.kr_Serif a, .kr_Serif p, .kr_Serif dd, .kr_Serif dt, .kr_Serif span { font-family: "Noto Serif KR", serif !important; }

.zh-hans a, .zh-hans p, .zh-hans dd, .zh-hans dt, .zh-hans span { font-family: "Noto Sans SC", sans-serif; }

.zh-hans_Serif { font-family: "Noto Serif SC", serif; }

.zh-hant a, .zh-hant p, .zh-hant dd, .zh-hant dt, .zh-hant span { font-family: "Noto Sans TC", sans-serif; }

.zh-hant_Serif { font-family: "Noto Serif TC", serif; }

.pc { display: block; }

.sp { display: none; }

@media (max-width: 768px) { .pc { display: none; }
  .sp { display: block; } }
.red { color: #cd0000; }

.yellow { color: #ffff00; }

.orange { color: #eb6100; }

.noLink { pointer-events: none; }

/* ----------------------------------------------------- animation
----------------------------------------------------- */
.scale { opacity: 0; }
.scale.effect { animation: scale 1s cubic-bezier(0.25, 1, 0.5, 1) forwards; }

@keyframes scale { 0% { transform: scale(0.8); opacity: 0; filter: blur(6px); }
  100% { transform: scale(1); opacity: 1; filter: blur(0); } }
.slide_In { opacity: 0; transition: all 0.2s; animation-duration: 1s; animation-fill-mode: both; }
.slide_In.effect { animation-name: slideIn; transition: 0.3s; }

@keyframes slideIn { 0% { transform: translateY(40px); opacity: 0; }
  100% { transform: translateY(0); }
  40%,
  100% { opacity: 1; } }
.fade-in { opacity: 0; animation: fadein-top 1.5s 0.3s ease-out forwards; }

@keyframes fadein-top { 0% { opacity: 0; transform: translateY(-20px); }
  100% { opacity: 1; transform: translateY(0); } }
.fade_in { opacity: 0; }
.fade_in.effect { animation: fadein 1s 0.3s ease-out forwards; }

@keyframes fadein { 0% { opacity: 0; }
  100% { opacity: 1; } }
/* 黒の動き */
@keyframes wipeInOut { 0% { width: 0%; left: 0; }
  50% { width: 100%; left: 0; }
  100% { width: 100%; left: 100%; } }
/* 黒がMAXになった瞬間から画像表示 */
@keyframes imgIn { from { visibility: visible; transform: translateX(-30px); opacity: 0; }
  to { visibility: visible; transform: translateX(0); opacity: 1; } }
/* ----------------------------------------------------- header
----------------------------------------------------- */
header { height: 60px; display: flex; align-items: center; width: 100%; justify-content: center; position: fixed; top: 0; z-index: 99999999; }
@media (min-width: 601px) { header { height: 8.1549439348vw; } }
@media (min-width: 981px) { header { height: 4.1666666667vw; } }
@media (min-width: 981px) { header { background: linear-gradient(to bottom, #060505 0%, rgba(6, 5, 5, 0) 100%); } }

.globalNavi { display: none; }
@media (min-width: 981px) { .globalNavi { display: block; } }

.globalNavi_list { align-items: center; }
@media (min-width: 981px) { .globalNavi_list { display: flex; } }
.globalNavi_list li { padding-right: 0vw; padding-bottom: 3.0581039755vw; }
@media (min-width: 981px) { .globalNavi_list li { padding-right: 1.5104166667vw; } }
@media (min-width: 981px) { .globalNavi_list li { padding-bottom: 0vw; } }
@media (max-width: 768px) { .globalNavi_list li { padding-bottom: 20px; } }
.globalNavi_list a { color: #fff; font-weight: bold; font-family: "Cinzel Decorative", serif; font-size: 1.8348623853vw; font-size: max(12px, 1.8348623853vw); letter-spacing: 0.5px; }
@media (min-width: 981px) { .globalNavi_list a { font-size: 0.9375vw; } }
@media (max-width: 768px) { .globalNavi_list a { font-size: 20px; } }
.globalNavi_list a.red { color: #cd0000; }

.language { background: yellow; border-radius: 60px; color: #000; display: flex; justify-content: center; align-items: center; position: absolute; right: 65px; top: 13px; font-size: 14px; font-size: max(12px, 14px); max-height: 30px; max-width: 110px; font-weight: bold; height: 100%; width: 100%; text-align: left; z-index: 2; transition: 0.3s; }
@media (min-width: 601px) { .language { right: 9.1743119266vw; } }
@media (min-width: 981px) { .language { right: 10px; } }
@media (min-width: 601px) { .language { top: 1.630988787vw; } }
@media (min-width: 981px) { .language { top: 0.8333333333vw; } }
@media (min-width: 601px) { .language { font-size: 1.630988787vw; } }
@media (min-width: 981px) { .language { font-size: 0.8333333333vw; } }
@media (min-width: 601px) { .language { max-height: 4.0774719674vw; } }
@media (min-width: 981px) { .language { max-height: 2.0833333333vw; } }
@media (min-width: 601px) { .language { max-width: 14.2711518858vw; } }
@media (min-width: 981px) { .language { max-width: 7.2916666667vw; } }
.language:hover { color: #000; background-color: #ffff00; }
.language:hover .acd-label { color: #000; }
.language:hover .acd-label::before { opacity: 0; }

.acd-check { display: none; }

.acd-label { box-sizing: border-box; cursor: pointer; display: flex; align-items: center; padding-left: 20px; position: relative; height: 100%; width: 100%; }
@media (min-width: 601px) { .acd-label { padding-left: 2.5484199796vw; } }
@media (min-width: 981px) { .acd-label { padding-left: 1.3020833333vw; } }

.acd-label { position: relative; }

.acd-label::after { content: ""; position: absolute; right: 2.0387359837vw; top: 50%; width: 20px; height: 15px; background: #000; clip-path: polygon(0 0, 100% 50%, 0 100%); -webkit-mask: radial-gradient(circle at left center, transparent 35%, #000 38%); mask: radial-gradient(circle at left center, transparent 35%, #000 38%); transform: translateY(-50%) rotate(0deg); transform-origin: center; transition: transform .3s ease; }
@media (min-width: 601px) { .acd-label::after { right: 2.0387359837vw; } }
@media (min-width: 981px) { .acd-label::after { right: 1.0416666667vw; } }
@media (min-width: 601px) { .acd-label::after { width: 2.5484199796vw; } }
@media (min-width: 981px) { .acd-label::after { width: 1.3020833333vw; } }
@media (min-width: 601px) { .acd-label::after { height: 2.0387359837vw; } }
@media (min-width: 981px) { .acd-label::after { height: 1.0416666667vw; } }

.is-open .acd-label::after { transform: translateY(-50%) rotate(90deg); }

.acd-content { box-sizing: border-box; position: fixed; background: rgba(0, 0, 0, 0.8); top: 12.2324159021vw; height: 0; opacity: 0; padding: 20px 15px; transition: all 0.1s; visibility: hidden; width: 100%; max-width: 142px; }
@media (min-width: 981px) { .acd-content { top: 3.3854166667vw; } }

@media (min-width: 481px) { .acd-content { max-width: 120px; } }
.acd-content li { font-size: 16px; text-align: center; }

.acd-content li:nth-child(n + 2) { margin-top: 15px; }

.acd-content li a { color: #fff; transition: all 0.3s; width: 100%; }

.acd-content li a:hover { color: #e60020; font-weight: 600; }

.acd-content li a.on { color: #cd0000; cursor: default; }

.acd-content.box { box-sizing: border-box; position: fixed; background: #000; top: 0; height: 0; opacity: 0; padding: 0 10px; transition: all 0.1s; visibility: hidden; width: 100%; max-width: 200px; }

.acd-content.box p { color: #555; text-align: center; }

.acd-content.box p a { color: #fff; transition: all 0.3s; }

.acd-content.box p a:hover { color: orange; opacity: 1; }

.acd-check:checked + .acd-label + .acd-content { box-sizing: border-box; height: auto; opacity: 1; padding: 10px 0; visibility: visible; z-index: 1; }

/* ----------------------------------------------------- SP_menu
----------------------------------------------------- */
.globalNavi_sp { z-index: 999999999; position: relative; }
@media (min-width: 981px) { .globalNavi_sp { display: none; } }
.globalNavi_sp .globalNavi_list { box-sizing: border-box; display: flex; align-items: center; }

.buy_menu_btn { background: #fff144; border: 1px solid #3d120a; box-sizing: border-box; color: #3d120a; display: none; font-size: 2.9947916667vw; font-family: "Noto Sans JP", sans-serif; font-weight: bold; position: fixed; right: 14.3229166667vw; text-align: center; top: 1.3020833333vw; height: 11.9791666667vw; width: 23.4375vw; z-index: 80; }

@media (max-width: 768px) { .buy_menu_btn { display: block; } }
.buy_menu_btn:active { transition: all 0.5s; background: rgba(255, 241, 68, 0.6); }

.buy_menu_btn a { display: flex; justify-content: center; align-items: center; box-sizing: border-box; padding: 5px; color: #3d120a; position: absolute; top: 0; left: 0; height: 100%; width: 100%; transition: all 0.5s; }

.buy_menu_btn a:active { transition: all 0.5s; color: #3d120a; }

.buy_menu_btn figure { margin-right: 2px; height: auto; width: 4.5572916667vw; }

.buy_menu_btn figure img { height: auto; width: 100%; }

.globalNavi_list a { transition: 0.3s; }
.globalNavi_list a:hover { color: #cd0000; }

.globalNavi_sp .globalNavi_list { flex-direction: column; height: auto; }

.globalNavi_sp .globalNavi_list { margin-top: 80px; margin-top: 8.1549439348vw; padding: 3.0581039755vw 0vw; padding: 30px 0; }
@media (min-width: 981px) { .globalNavi_sp .globalNavi_list { margin-top: 0vw; } }
@media (min-width: 981px) { .globalNavi_sp .globalNavi_list { padding: 1.5625vw 0vw; } }

.globalNavi_sp .globalNavi_list > li.reserve-btn { margin: 0 auto; height: auto; width: 100%; max-width: 80% !important; position: relative; text-align: center; }

@media (max-width: 768px) { .globalNavi_sp .globalNavi_list > li.reserve-btn { margin-top: 40px; } }
.globalNavi_sp .globalNavi_list > li.reserve-btn > a { background: #ff1200; box-sizing: border-box; color: #fff; font-family: "Noto Sans JP", sans-serif !important; font-weight: 900; margin: 0 auto; position: relative; }

@media (max-width: 768px) { .globalNavi_sp .globalNavi_list > li.reserve-btn > a { font-size: 2.9947916667vw; padding: 1.953125vw 2.6041666667vw 1.953125vw 7.1614583333vw; } }
@media (max-width: 414px) { .globalNavi_sp .globalNavi_list > li.reserve-btn > a { font-size: 4.8309178744vw; padding: 3.6231884058vw 4.8309178744vw 3.6231884058vw 13.2850241546vw; } }
.globalNavi_sp .globalNavi_list > li.reserve-btn > a:active { transition: all 0.3s; color: #ffff00; }

.globalNavi_sp .globalNavi_list > li.reserve-btn > a::after { content: ""; background: url("../img/reserve-btn_arrow.png") no-repeat; background-size: 100%; position: absolute; top: 50%; }

@media (max-width: 768px) { .globalNavi_sp .globalNavi_list > li.reserve-btn > a::after { height: 3.125vw; width: 3.515625vw; left: 2.6041666667vw; margin-top: -1.4322916667vw; } }
@media (max-width: 414px) { .globalNavi_sp .globalNavi_list > li.reserve-btn > a::after { height: 5.7971014493vw; width: 6.5217391304vw; left: 4.8309178744vw; margin-top: -2.6570048309vw; } }
.globalNavi_sp .globalNavi_list > li.reserve-btn::after { display: none; }

.globalNavi_sp .globalNavi_item { margin-right: 0; }

.globalNavi_sp .globalNavi_item a { margin: 0 auto; }

.menu-content { width: 100%; height: 100%; position: fixed; top: 0; left: 100%; z-index: 80; background-color: #000; transition: all 0.5s; }

@media (max-width: 768px) { .menu-content { background: rgba(0, 0, 0, 0.9); } }
.menu-btn { position: fixed; top: 10px; right: 0; display: flex; height: auto; width: 60px; justify-content: center; align-items: center; z-index: 120; }
@media (min-width: 601px) { .menu-btn { top: 10px; } }
@media (min-width: 981px) { .menu-btn { top: 0.8854166667vw; } }
@media (min-width: 601px) { .menu-btn { width: 8.1549439348vw; } }
@media (min-width: 981px) { .menu-btn { width: 6.25vw; } }

.menu-btn span, .menu-btn span:before, .menu-btn span:after { content: ""; display: block; height: 2px; width: 15px; border-radius: 3px; background-color: #ffffff; position: absolute; transition: all 0.5s; left: 18px; }
@media (min-width: 601px) { .menu-btn span, .menu-btn span:before, .menu-btn span:after { height: 0.4077471967vw; } }
@media (min-width: 981px) { .menu-btn span, .menu-btn span:before, .menu-btn span:after { height: 0.390625vw; } }
@media (min-width: 601px) { .menu-btn span, .menu-btn span:before, .menu-btn span:after { width: 2.5484199796vw; } }
@media (min-width: 981px) { .menu-btn span, .menu-btn span:before, .menu-btn span:after { width: 4.6875vw; } }
@media (min-width: 601px) { .menu-btn span, .menu-btn span:before, .menu-btn span:after { left: 3.0581039755vw; } }
@media (min-width: 981px) { .menu-btn span, .menu-btn span:before, .menu-btn span:after { left: 1.5625vw; } }

.menu-btn span::before { bottom: 5px; left: 0; }
@media (min-width: 601px) { .menu-btn span::before { bottom: 0.8154943935vw; } }
@media (min-width: 981px) { .menu-btn span::before { bottom: 0.4166666667vw; } }

.menu-btn span::after { top: 5px; left: 0; }
@media (min-width: 601px) { .menu-btn span::after { top: 0.8154943935vw; } }
@media (min-width: 981px) { .menu-btn span::after { top: 0.4166666667vw; } }

#menu-btn-check { display: none; }

#menu-btn-check:checked ~ .menu-btn span { background-color: rgba(255, 255, 255, 0); /*メニューオープン時は真ん中の線を透明にする*/ }

#menu-btn-check:checked ~ .menu-btn span::before { bottom: 0; transform: rotate(45deg); }

#menu-btn-check:checked ~ .menu-btn span::after { top: 0; transform: rotate(-45deg); }

#menu-btn-check:checked ~ .menu-content { left: 0; /*メニューを画面内へ*/ }

/* ----------------------------------------------------- main_visual
----------------------------------------------------- */
#main_visual { position: relative; overflow: hidden; width: 100%; height: 100%; background: url("../img/main_visual_bg.webp") center top/cover no-repeat; }
@media (max-width: 980px) { #main_visual { background: url("../img/main_visual_SP_bg.webp") center top/cover no-repeat; } }

.mv_chara { position: absolute; left: 50%; top: 0; width: 100%; max-width: 100%; height: 100%; background: url("../img/main_visual_chara.webp") center top/contain no-repeat; transform: translateX(-50%); z-index: 2; pointer-events: none; }
@media (min-width: 601px) { .mv_chara { max-width: 80.0203873598vw; } }
@media (min-width: 981px) { .mv_chara { max-width: 1920px; } }
@media (min-width: 601px) { .mv_chara { height: 67.1763506626vw; } }
@media (min-width: 981px) { .mv_chara { height: 1612px; } }
@media (max-width: 980px) { .mv_chara { display: none; } }

.mv_front { position: absolute; left: 50%; top: 0; width: 39.245667686vw; height: 39.245667686vw; background: url("../img/main_visual_front.webp") center top/contain no-repeat; transform: translateX(-50%); z-index: 3; pointer-events: none; }
@media (min-width: 981px) { .mv_front { width: 1920px; } }
@media (min-width: 981px) { .mv_front { height: 1612px; } }
@media (max-width: 980px) { .mv_front { display: none; } }

/* -------------------------- */
.main_visual_logo { margin: 0 auto; margin-top: 52.49745158vw; position: relative; width: 65.9531090724vw; z-index: 4; }
@media (min-width: 981px) { .main_visual_logo { margin-top: 32.03125vw; } }
@media (min-width: 981px) { .main_visual_logo { width: 56.9791666667vw; } }
.main_visual_logo.wide { margin-top: 50.4587155963vw; margin-bottom: 2.0387359837vw; }
@media (min-width: 981px) { .main_visual_logo.wide { margin-top: 30.9895833333vw; } }
@media (min-width: 981px) { .main_visual_logo.wide { margin-bottom: 1.0416666667vw; } }

.main_visual_txt { margin: 0 auto; margin-top: -1.0193679918vw; position: relative; width: 100%; max-width: 37.003058104vw; z-index: 4; }
@media (min-width: 981px) { .main_visual_txt { margin-top: -1.0416666667vw; } }
@media (min-width: 981px) { .main_visual_txt { max-width: 24.1145833333vw; } }
.main_visual_txt.en { margin-top: -3.0581039755vw; margin-bottom: 2.0387359837vw; max-width: 47.1967380224vw; }
@media (min-width: 981px) { .main_visual_txt.en { margin-top: -2.6041666667vw; } }
@media (min-width: 981px) { .main_visual_txt.en { margin-bottom: 1.0416666667vw; } }
@media (min-width: 981px) { .main_visual_txt.en { max-width: 26.7708333333vw; } }

.main_visual_platform { box-sizing: border-box; background: rgba(0, 0, 0, 0.8); display: flex; align-items: center; justify-content: center; margin: 0 auto; margin-bottom: 6.625891947vw; padding: 2.0387359837vw 0vw; position: relative; width: 100%; max-width: 90%; z-index: 4; }
@media (min-width: 981px) { .main_visual_platform { margin-bottom: 3.3854166667vw; } }
@media (min-width: 981px) { .main_visual_platform { padding: 1.0416666667vw 0vw; } }
@media (min-width: 981px) { .main_visual_platform { max-width: 36.9791666667vw; } }
.main_visual_platform li { height: 4.6890927625vw; }
@media (min-width: 981px) { .main_visual_platform li { height: 1.875vw; } }
.main_visual_platform li:first-child { opacity: .5; }
.main_visual_platform li:nth-child(n + 2) { margin-left: 2.0387359837vw; }
@media (min-width: 981px) { .main_visual_platform li:nth-child(n + 2) { margin-left: 1.0416666667vw; } }
.main_visual_platform li img { height: 100%; width: auto; object-fit: cover; }
.main_visual_platform li.btn_store_buy { position: absolute; top: -45.871559633vw; right: 0vw; height: 19.2660550459vw; width: 19.877675841vw; }
@media (min-width: 601px) { .main_visual_platform li.btn_store_buy { top: -45.871559633vw; } }
@media (min-width: 981px) { .main_visual_platform li.btn_store_buy { top: -5.7291666667vw; } }
@media (min-width: 601px) { .main_visual_platform li.btn_store_buy { right: 0vw; } }
@media (min-width: 981px) { .main_visual_platform li.btn_store_buy { right: -13.0208333333vw; } }
@media (min-width: 601px) { .main_visual_platform li.btn_store_buy { height: 19.2660550459vw; } }
@media (min-width: 981px) { .main_visual_platform li.btn_store_buy { height: 9.84375vw; } }
@media (min-width: 601px) { .main_visual_platform li.btn_store_buy { width: 19.877675841vw; } }
@media (min-width: 981px) { .main_visual_platform li.btn_store_buy { width: 10.15625vw; } }
.main_visual_platform li.btn_store_buy > a:hover { transition: all 0.3s; opacity: .5; }
.main_visual_platform a:hover { transition: 0.3s; opacity: 0.7; }
@media (max-width: 980px) { .main_visual_platform a:hover { opacity: 1; } }
@media (max-width: 980px) { .main_visual_platform a:active { transition: 0.3s; opacity: 0.7; } }

.btn_movie > a { position: absolute; top: 12.2324159021vw; right: 0; z-index: 9999; width: 100%; max-width: 31.498470948vw; }
@media (min-width: 601px) { .btn_movie > a { top: 8.1549439348vw; } }
@media (min-width: 981px) { .btn_movie > a { top: 5.2083333333vw; } }
@media (min-width: 601px) { .btn_movie > a { max-width: 36.5953109072vw; } }
@media (min-width: 981px) { .btn_movie > a { max-width: 23.4375vw; } }
.btn_movie > a:hover { transition: all 0.3s; opacity: .5; }

/* ----------------------------------------------------- news
----------------------------------------------------- */
#news { background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), black); position: relative; width: 100%; z-index: 4; }

#news .news_wrap { margin: 0 auto; width: 100%; max-width: 90%; }
@media (min-width: 981px) { #news .news_wrap { max-width: 62.5vw; } }

#news h2 { margin-left: -2.0387359837vw; width: 100%; max-width: 22.5280326198vw; }
@media (min-width: 981px) { #news h2 { margin-left: -1.0416666667vw; } }
@media (min-width: 981px) { #news h2 { max-width: 11.5104166667vw; } }

/* -------------------------- */
#news .news_area div { display: flex; align-items: flex-start; margin-top: 3.5677879715vw; }
@media (min-width: 981px) { #news .news_area div { margin-top: 1.8229166667vw; } }
#news .news_area dt { color: #cd0000; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); font-weight: bold; margin-right: 5.0968399592vw; padding-right: 3.5677879715vw; position: relative; }
@media (min-width: 601px) { #news .news_area dt { font-size: 1.8348623853vw; } }
@media (min-width: 981px) { #news .news_area dt { font-size: 0.9375vw; } }
@media (min-width: 981px) { #news .news_area dt { margin-right: 7.8125vw; } }
@media (min-width: 981px) { #news .news_area dt { padding-right: 1.8229166667vw; } }
#news .news_area dt::before { content: ""; background-color: #17323b; margin-top: -0.1019367992vw; position: absolute; top: 50%; right: -5.0968399592vw; height: 1px; width: 5.0968399592vw; }
@media (min-width: 981px) { #news .news_area dt::before { margin-top: -0.0520833333vw; } }
@media (min-width: 981px) { #news .news_area dt::before { right: -7.8125vw; } }
@media (min-width: 981px) { #news .news_area dt::before { width: 7.8125vw; } }
#news .news_area dd { color: #fff; font-family: "Noto Serif JP", serif; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); padding-left: 3.5677879715vw; line-height: 1.4; }
@media (min-width: 601px) { #news .news_area dd { font-size: 1.8348623853vw; } }
@media (min-width: 981px) { #news .news_area dd { font-size: 0.9375vw; } }
@media (min-width: 981px) { #news .news_area dd { padding-left: 1.8229166667vw; } }
#news .news_area dd::before, #news .news_area dd::after { content: ""; display: block; width: 0; height: 0; }
#news .news_area dd::before { margin-top: calc((1 - 1.4) * 0.5em); }
#news .news_area dd::after { margin-bottom: calc((1 - 1.4) * 0.5em); }

/* -------------------------- */
#news .btn_news_more { background-color: #000; border: 1px solid #fff; box-sizing: border-box; margin: 3.0581039755vw 0vw 0vw auto; width: 100%; max-width: 33.6391437309vw; }
@media (min-width: 981px) { #news .btn_news_more { margin: 1.5625vw 0vw 0vw auto; } }
@media (min-width: 601px) { #news .btn_news_more { max-width: 23.4454638124vw; } }
@media (min-width: 981px) { #news .btn_news_more { max-width: 11.9791666667vw; } }
#news .btn_news_more > a { color: #fff; display: block; font-weight: bold; width: 100%; box-sizing: border-box; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); padding: 2.0387359837vw 3.0581039755vw; position: relative; }
@media (min-width: 601px) { #news .btn_news_more > a { font-size: 1.8348623853vw; } }
@media (min-width: 981px) { #news .btn_news_more > a { font-size: 0.9375vw; } }
@media (min-width: 981px) { #news .btn_news_more > a { padding: 1.0416666667vw 1.5625vw; } }
#news .btn_news_more > a::after { content: ""; position: absolute; right: 4.0774719674vw; top: 50%; transform: translateY(-50%); width: 15px; height: 10px; background: #cd0000; clip-path: polygon(0 0, 100% 50%, 0 100%); -webkit-mask: radial-gradient(circle at left center, transparent 35%, #cd0000 38%); mask: radial-gradient(circle at left center, transparent 35%, #cd0000 38%); }
@media (min-width: 601px) { #news .btn_news_more > a::after { right: 4.0774719674vw; } }
@media (min-width: 981px) { #news .btn_news_more > a::after { right: 2.0833333333vw; } }
@media (min-width: 601px) { #news .btn_news_more > a::after { width: 2.5484199796vw; } }
@media (min-width: 981px) { #news .btn_news_more > a::after { width: 1.3020833333vw; } }
@media (min-width: 601px) { #news .btn_news_more > a::after { height: 2.0387359837vw; } }
@media (min-width: 981px) { #news .btn_news_more > a::after { height: 1.0416666667vw; } }
#news .btn_news_more > a:hover::after { transition: 0.3s; right: 10px; }
@media (min-width: 601px) { #news .btn_news_more > a:hover::after { right: 3.0581039755vw; } }
@media (min-width: 981px) { #news .btn_news_more > a:hover::after { right: 1.5625vw; } }

/* ----------------------------------------------------- story
----------------------------------------------------- */
#story { background-image: url(../img/story/bg.webp); background-size: 100%; background-position: top center; background-repeat: no-repeat; box-sizing: border-box; margin-top: 6.1162079511vw; padding: 17.8389398573vw 0vw 15.2905198777vw; width: 100%; }
@media (min-width: 981px) { #story { margin-top: 4.6875vw; } }
@media (min-width: 601px) { #story { padding: 16.8195718654vw 0vw 16.3098878695vw; } }
@media (min-width: 981px) { #story { padding: 18.2291666667vw 0vw 15.625vw; } }
@media (max-width: 980px) { #story { background-position: 75%; background-size: cover; } }
@media (max-width: 786px) { #story { background-position: 65%; background-size: cover; } }

#story .story_text_area { color: #fff; font-family: "WDXL Lubrifont JP N", sans-serif; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); margin: 0 auto; line-height: 2.1; text-align: center; text-shadow: 0px 0px 15px black, 0px 0px 15px black, 0px 0px 15px black; width: 100%; max-width: 60%; }
@media (min-width: 601px) { #story .story_text_area { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { #story .story_text_area { font-size: 1.0416666667vw; } }
#story .story_text_area::before, #story .story_text_area::after { content: ""; display: block; width: 0; height: 0; }
#story .story_text_area::before { margin-top: calc((1 - 2.1) * 0.5em); }
#story .story_text_area::after { margin-bottom: calc((1 - 2.1) * 0.5em); }
@media (min-width: 601px) { #story .story_text_area { max-width: 80%; } }
@media (min-width: 981px) { #story .story_text_area { max-width: 100%; } }
@media (max-width: 980px) { #story .story_text_area { margin: 0 auto 0 10%; line-height: 1.6; text-align: left; }
  #story .story_text_area::before, #story .story_text_area::after { content: ""; display: block; width: 0; height: 0; }
  #story .story_text_area::before { margin-top: calc((1 - 1.6) * 0.5em); }
  #story .story_text_area::after { margin-bottom: calc((1 - 1.6) * 0.5em); } }
@media (max-width: 786px) { #story .story_text_area { margin: 0 0 0 10%; max-width: 75%; } }
#story .story_text_area > span { font-family: "WDXL Lubrifont JP N", sans-serif; }
#story .story_text_area > span.orange { color: #ff6900; font-size: 1.8348623853vw; font-size: max(12px, 2.9950083195vw); }
@media (min-width: 601px) { #story .story_text_area > span.orange { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { #story .story_text_area > span.orange { font-size: 1.3020833333vw; } }
#story .story_text_area > span.yellow { color: #ffff00; }
#story .story_text_area.en { font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); width: 100%; max-width: 60%; }
@media (min-width: 601px) { #story .story_text_area.en { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { #story .story_text_area.en { font-size: 1.0416666667vw; } }
@media (min-width: 601px) { #story .story_text_area.en { max-width: 60%; } }
@media (min-width: 981px) { #story .story_text_area.en { max-width: 43.75vw; } }
#story .story_text_area.kr { font-family: "East Sea Dokdo", sans-serif; font-weight: bold; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); width: 100%; max-width: 60%; }
@media (min-width: 601px) { #story .story_text_area.kr { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { #story .story_text_area.kr { font-size: 1.0416666667vw; } }
@media (min-width: 601px) { #story .story_text_area.kr { max-width: 60%; } }
@media (min-width: 981px) { #story .story_text_area.kr { max-width: 43.75vw; } }
#story .story_text_area.kr > span { font-family: "East Sea Dokdo", sans-serif; }
#story .story_text_area.kr > span.orange { color: #ff6900; font-size: 1.8348623853vw; font-size: max(12px, 2.9950083195vw); }
@media (min-width: 601px) { #story .story_text_area.kr > span.orange { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { #story .story_text_area.kr > span.orange { font-size: 1.3020833333vw; } }
#story .story_text_area.kr > span.yellow { color: #ffff00; }
#story .story_text_area.zh-hans { font-family: "WDXL Lubrifont SC", sans-serif; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); margin-top: -1.5290519878vw; letter-spacing: 1px; line-height: 2.1; width: 100%; max-width: 60%; }
@media (min-width: 601px) { #story .story_text_area.zh-hans { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { #story .story_text_area.zh-hans { font-size: 1.0416666667vw; } }
@media (min-width: 601px) { #story .story_text_area.zh-hans { margin-top: -3.0581039755vw; } }
@media (min-width: 981px) { #story .story_text_area.zh-hans { margin-top: -1.5625vw; } }
#story .story_text_area.zh-hans::before, #story .story_text_area.zh-hans::after { content: ""; display: block; width: 0; height: 0; }
#story .story_text_area.zh-hans::before { margin-top: calc((1 - 2.1) * 0.5em); }
#story .story_text_area.zh-hans::after { margin-bottom: calc((1 - 2.1) * 0.5em); }
@media (min-width: 601px) { #story .story_text_area.zh-hans { max-width: 60%; } }
@media (min-width: 981px) { #story .story_text_area.zh-hans { max-width: 43.75vw; } }
@media (max-width: 980px) { #story .story_text_area.zh-hans { margin: 0 auto; line-height: 1.6; text-align: left; }
  #story .story_text_area.zh-hans::before, #story .story_text_area.zh-hans::after { content: ""; display: block; width: 0; height: 0; }
  #story .story_text_area.zh-hans::before { margin-top: calc((1 - 1.6) * 0.5em); }
  #story .story_text_area.zh-hans::after { margin-bottom: calc((1 - 1.6) * 0.5em); } }
@media (max-width: 786px) { #story .story_text_area.zh-hans { margin: 0 0 0 10%; } }
#story .story_text_area.zh-hans > span { font-family: "WDXL Lubrifont SC", sans-serif; }
#story .story_text_area.zh-hans > span.orange { color: #ff6900; font-size: 1.8348623853vw; font-size: max(12px, 2.9950083195vw); }
@media (min-width: 601px) { #story .story_text_area.zh-hans > span.orange { font-size: 2.5484199796vw; } }
@media (min-width: 981px) { #story .story_text_area.zh-hans > span.orange { font-size: 1.5625vw; } }
#story .story_text_area.zh-hant { font-family: "WDXL Lubrifont TC", sans-serif; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); margin-top: -1.5290519878vw; letter-spacing: 1px; line-height: 2.1; width: 100%; max-width: 60%; }
@media (min-width: 601px) { #story .story_text_area.zh-hant { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { #story .story_text_area.zh-hant { font-size: 1.0416666667vw; } }
@media (min-width: 601px) { #story .story_text_area.zh-hant { margin-top: -3.0581039755vw; } }
@media (min-width: 981px) { #story .story_text_area.zh-hant { margin-top: -1.5625vw; } }
#story .story_text_area.zh-hant::before, #story .story_text_area.zh-hant::after { content: ""; display: block; width: 0; height: 0; }
#story .story_text_area.zh-hant::before { margin-top: calc((1 - 2.1) * 0.5em); }
#story .story_text_area.zh-hant::after { margin-bottom: calc((1 - 2.1) * 0.5em); }
@media (min-width: 601px) { #story .story_text_area.zh-hant { max-width: 60%; } }
@media (min-width: 981px) { #story .story_text_area.zh-hant { max-width: 43.75vw; } }
@media (max-width: 980px) { #story .story_text_area.zh-hant { margin: 0 auto; line-height: 1.6; text-align: left; }
  #story .story_text_area.zh-hant::before, #story .story_text_area.zh-hant::after { content: ""; display: block; width: 0; height: 0; }
  #story .story_text_area.zh-hant::before { margin-top: calc((1 - 1.6) * 0.5em); }
  #story .story_text_area.zh-hant::after { margin-bottom: calc((1 - 1.6) * 0.5em); } }
@media (max-width: 786px) { #story .story_text_area.zh-hant { margin: 0 0 0 10%; } }
#story .story_text_area.zh-hant > span { font-family: "WDXL Lubrifont TC", sans-serif; }
#story .story_text_area.zh-hant > span.orange { color: #ff6900; font-size: 1.8348623853vw; font-size: max(12px, 2.9950083195vw); }
@media (min-width: 601px) { #story .story_text_area.zh-hant > span.orange { font-size: 2.5484199796vw; } }
@media (min-width: 981px) { #story .story_text_area.zh-hant > span.orange { font-size: 1.5625vw; } }

/* -------------------------- */
.kr .about_text { font-family: "Noto Serif KR", serif; }

.zh-hant .about_text { font-family: "Noto Serif TC", serif; }

.zh-hans .about_text { font-family: "Noto Serif SC", serif; }

/* ----------------------------------------------------- system
----------------------------------------------------- */
#system { background: url("../img/system/bg.webp") no-repeat; background-size: 100%; background-position: center bottom; box-sizing: border-box; padding: 6.1162079511vw 0vw 8.1549439348vw; width: 100%; }
@media (min-width: 601px) { #system { padding: 8.1549439348vw 0vw 10.1936799185vw; } }
@media (min-width: 981px) { #system { padding: 4.1666666667vw 0vw 5.2083333333vw; } }

#system h2 { margin: 0vw auto 7.1355759429vw; width: 100%; max-width: 51.4780835882vw; }
@media (min-width: 981px) { #system h2 { margin: 0vw auto 3.6458333333vw; } }
@media (min-width: 981px) { #system h2 { max-width: 26.3020833333vw; } }

/* -------------------------- */
.left_system_area { width: 100%; max-width: 100%; }
@media (min-width: 981px) { .left_system_area { max-width: 81.25vw; } }
.left_system_area > h3 { box-sizing: border-box; color: #fff; font-family: "Noto Serif JP", serif; font-weight: bold; font-size: 4.8929663609vw; font-size: max(12px, 4.8929663609vw); margin-bottom: 3.0581039755vw; padding-left: 40px; position: relative; width: 100%; }
@media (min-width: 981px) { .left_system_area > h3 { font-size: 2.5vw; } }
@media (min-width: 981px) { .left_system_area > h3 { margin-bottom: 1.5625vw; } }
@media (min-width: 601px) { .left_system_area > h3 { padding-left: 10.1936799185vw; } }
@media (min-width: 981px) { .left_system_area > h3 { padding-left: 18.75vw; } }
.left_system_area > h3::before { content: ""; background-color: #cd0000; height: 1px; position: absolute; margin-top: -1px; top: 50%; left: 0; width: 100%; max-width: 30px; }
@media (min-width: 601px) { .left_system_area > h3::before { max-width: 8.1549439348vw; } }
@media (min-width: 981px) { .left_system_area > h3::before { max-width: 17.1875vw; } }
.left_system_area > h3.kr { font-family: "Noto Serif KR", serif; }
.left_system_area > h3.zh-hant { font-family: "Noto Serif TC", serif; }
.left_system_area > h3.zh-hans { font-family: "Noto Serif SC", serif; }
.left_system_area .system_wrap { display: flex; align-items: flex-start; justify-content: space-between; margin: 0 0 0 auto; width: 100%; max-width: 80%; }
@media (min-width: 981px) { .left_system_area .system_wrap { max-width: 62.5vw; } }
@media (max-width: 980px) { .left_system_area .system_wrap { flex-direction: column; margin: 0 auto !important; } }

/* -------------------------- */
.right_system_area { margin: 6.1162079511vw 0vw 6.1162079511vw auto; width: 100%; max-width: 100%; }
@media (min-width: 981px) { .right_system_area { margin: 3.125vw 0vw 3.125vw auto; } }
@media (min-width: 981px) { .right_system_area { max-width: 81.25vw; } }
.right_system_area > h3 { box-sizing: border-box; color: #fff; font-family: "Noto Serif JP", serif; font-weight: bold; margin: 0 auto 0 0; font-size: 4.8929663609vw; font-size: max(12px, 4.8929663609vw); margin-bottom: 3.0581039755vw; padding-right: 40px; position: relative; text-align: right; width: 100%; }
@media (min-width: 981px) { .right_system_area > h3 { font-size: 2.5vw; } }
@media (min-width: 981px) { .right_system_area > h3 { margin-bottom: 1.5625vw; } }
@media (min-width: 601px) { .right_system_area > h3 { padding-right: 10.1936799185vw; } }
@media (min-width: 981px) { .right_system_area > h3 { padding-right: 18.75vw; } }
.right_system_area > h3::before { content: ""; background-color: #cd0000; height: 1px; position: absolute; margin-top: -1px; top: 50%; right: 0; width: 100%; max-width: 30px; }
@media (min-width: 601px) { .right_system_area > h3::before { max-width: 8.1549439348vw; } }
@media (min-width: 981px) { .right_system_area > h3::before { max-width: 17.1875vw; } }
.right_system_area > h3.kr { font-family: "Noto Serif KR", serif; }
.right_system_area > h3.zh-hant { font-family: "Noto Serif TC", serif; }
.right_system_area > h3.zh-hans { font-family: "Noto Serif SC", serif; }
.right_system_area .system_wrap { display: flex; align-items: flex-start; justify-content: space-between; margin: 0 auto 0 0; width: 100%; max-width: 80%; }
@media (min-width: 981px) { .right_system_area .system_wrap { max-width: 62.5vw; } }
@media (max-width: 980px) { .right_system_area .system_wrap { flex-direction: column-reverse; margin: 0 auto !important; }
  .right_system_area .system_wrap .system_img_area { margin: 0 auto 0 0; }
  .right_system_area .system_wrap .system_text_area { margin: 0 0 10px auto; } }

/* -------------------------- */
.system_text_area .text_area { display: flex; margin-top: 3.0581039755vw; }
@media (min-width: 981px) { .system_text_area .text_area { margin-top: 1.5625vw; } }

.system_txt { color: #fff; font-size: 1.630988787vw; font-size: max(12px, 1.630988787vw); line-height: 1.6; width: 100%; max-width: 100%; }
@media (min-width: 981px) { .system_txt { font-size: 0.8333333333vw; } }
.system_txt::before, .system_txt::after { content: ""; display: block; width: 0; height: 0; }
.system_txt::before { margin-top: calc((1 - 1.6) * 0.5em); }
.system_txt::after { margin-bottom: calc((1 - 1.6) * 0.5em); }
@media (min-width: 981px) { .system_txt { max-width: 29.1666666667vw; } }
.system_txt + h4 { color: #cd0000; font-family: "Noto Sans JP", sans-serif; font-weight: bold; font-size: 3.0581039755vw; font-size: max(12px, 3.0581039755vw); margin: 4.0774719674vw 0vw 3.0581039755vw; }
@media (min-width: 981px) { .system_txt + h4 { font-size: 1.5625vw; } }
@media (min-width: 981px) { .system_txt + h4 { margin: 2.0833333333vw 0vw 1.5625vw; } }
.system_txt > .pc { display: block; }
.system_txt > .sp { display: none; }
@media (max-width: 768px) { .system_txt { margin-bottom: 10px; }
  .system_txt > .pc { display: none; }
  .system_txt > .sp { display: block; } }
.system_txt.en { max-width: 100%; }
@media (min-width: 981px) { .system_txt.en { max-width: 29.1666666667vw; } }

/* -------------------------- */
.system_img_area { box-sizing: border-box; background: url("../img/system/ss_bg.webp") no-repeat; background-size: 100%; margin-top: 0vw; padding: 3.7716615698vw 2.5484199796vw 3.5677879715vw 3.0581039755vw; width: 100%; max-width: 59.123343527vw; }
@media (min-width: 601px) { .system_img_area { margin-top: -8.1549439348vw; } }
@media (min-width: 981px) { .system_img_area { margin-top: -4.1666666667vw; } }
@media (min-width: 981px) { .system_img_area { padding: 1.9270833333vw 1.3020833333vw 1.8229166667vw 1.5625vw; } }
@media (min-width: 981px) { .system_img_area { max-width: 30.2083333333vw; } }
@media (max-width: 980px) { .system_img_area { margin: 0 0 0 auto; } }
.system_img_area li { list-style: none; }
.system_img_area img { display: block; border: 1px solid #cd0000; text-align: center; width: 100%; max-width: 53.4148827727vw; }
@media (min-width: 981px) { .system_img_area img { max-width: 27.2916666667vw; } }
.system_img_area .slick-dots { right: 5px; bottom: 5px; width: 50% !important; }
@media (max-width: 980px) { .system_img_area .slick-dots { bottom: -5px; } }
.system_img_area .slick-dots li { margin: 0 4px; }
.system_img_area .slick-dots li button:before { color: #fff; opacity: .4; font-size: 30px; }
.system_img_area .slick-dots li.slick-active button:before { color: #cd0000; opacity: 1; }

.slick-dotted.slick-slider { margin-bottom: 0 !important; }

/* ----------------------------------------------------- character
----------------------------------------------------- */
#character { background: url("../img/character/bg.webp"); background-size: cover; background-position: center top; box-sizing: border-box; padding: 10.1936799185vw 0vw 7.1355759429vw; position: relative; width: 100%; }
@media (min-width: 601px) { #character { padding: 10.1936799185vw 0vw 7.1355759429vw; } }
@media (min-width: 981px) { #character { padding: 5.2083333333vw 0vw 3.6458333333vw; } }

#character h2 { margin: 0vw auto 4.0774719674vw; width: 100%; max-width: 45.0560652396vw; }
@media (min-width: 981px) { #character h2 { margin: 0vw auto; } }
@media (min-width: 981px) { #character h2 { max-width: 23.0208333333vw; } }

/* -------------------------- */
#character .chara { margin: auto; display: flex; align-items: center; width: 100%; max-width: 95%; }
@media (min-width: 601px) { #character .chara { max-width: 90%; } }
@media (min-width: 981px) { #character .chara { max-width: 62.5vw; } }

#character .chara_item { position: relative; cursor: pointer; }
#character .chara_item.chara01 { margin-left: -3.0581039755vw; width: 100%; max-width: 60%; }
@media (min-width: 601px) { #character .chara_item.chara01 { margin-left: -3.0581039755vw; } }
@media (min-width: 981px) { #character .chara_item.chara01 { margin-left: -1.5625vw; } }
@media (min-width: 601px) { #character .chara_item.chara01 { max-width: 39.245667686vw; } }
@media (min-width: 981px) { #character .chara_item.chara01 { max-width: 22.5520833333vw; } }
#character .chara_item.chara02 { width: 100%; max-width: 40%; }
@media (min-width: 601px) { #character .chara_item.chara02 { max-width: 26.2996941896vw; } }
@media (min-width: 981px) { #character .chara_item.chara02 { max-width: 15.2083333333vw; } }
@media (min-width: 601px) { #character .chara_item.chara02 { margin: 0 0 0 auto; } }
#character .chara_item img { display: block; width: 100%; }

.img_normal { transition: opacity .35s; }

.img_dark { position: absolute; top: 0; left: 0; opacity: 0; transition: opacity .35s; }

/* 未選択 */
.chara_item:not(.active) .img_normal { opacity: 0; }

.chara_item:not(.active) .img_dark { opacity: 1; }

/* 選択 */
.chara_item.active .img_normal { opacity: 1; }

.chara_item.active .img_dark { opacity: 0; }

/* -------------------------- */
#character .chara_text_area { position: relative; margin-left: -8.1549439348vw; width: 100%; max-width: 75%; }
@media (min-width: 601px) { #character .chara_text_area { margin-left: -8.1549439348vw; } }
@media (min-width: 981px) { #character .chara_text_area { margin-left: -4.1666666667vw; } }
@media (min-width: 601px) { #character .chara_text_area { max-width: 65%; } }
@media (min-width: 981px) { #character .chara_text_area { max-width: 29.1666666667vw; } }
@media (max-width: 980px) { #character .chara_text_area { position: absolute; margin: 0 auto; left: 0; right: 0; bottom: 40px; text-align: center; z-index: 111; } }

.text_box { display: none; animation: fade .3s; }
.text_box .catch_chara { margin-bottom: 2.0387359837vw; width: 100%; }
@media (min-width: 981px) { .text_box .catch_chara { margin-bottom: 1.5625vw; } }
@media (max-width: 980px) { .text_box .catch_chara { margin-left: auto; } }

#character .profile_area { display: flex; align-items: center; margin-bottom: 3.0581039755vw; }
@media (min-width: 981px) { #character .profile_area { margin-bottom: 1.5625vw; } }
@media (max-width: 980px) { #character .profile_area { flex-direction: column; } }
#character .profile_area.en { align-items: baseline; margin-bottom: 3.0581039755vw; }
@media (min-width: 981px) { #character .profile_area.en { margin-bottom: 1.5625vw; } }
@media (max-width: 980px) { #character .profile_area.en { align-items: flex-start; } }

#character .profile_wrap { box-sizing: border-box; margin-right: 0vw; margin-bottom: 3.0581039755vw; padding-right: 0vw; padding-bottom: 3.0581039755vw; position: relative; width: 60%; }
@media (min-width: 601px) { #character .profile_wrap { margin-right: 0vw; } }
@media (min-width: 981px) { #character .profile_wrap { margin-right: 1.0416666667vw; } }
@media (min-width: 601px) { #character .profile_wrap { margin-bottom: 2.0387359837vw; } }
@media (min-width: 981px) { #character .profile_wrap { margin-bottom: 0vw; } }
@media (min-width: 601px) { #character .profile_wrap { padding-right: 0vw; } }
@media (min-width: 981px) { #character .profile_wrap { padding-right: 1.5625vw; } }
@media (min-width: 601px) { #character .profile_wrap { padding-bottom: 2.0387359837vw; } }
@media (min-width: 981px) { #character .profile_wrap { padding-bottom: 0vw; } }
@media (max-width: 980px) { #character .profile_wrap { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ffff00; width: 100%; } }
@media (max-width: 768px) { #character .profile_wrap { justify-content: flex-end; width: 100%; } }
#character .profile_wrap::after { content: ""; position: absolute; right: 0; top: 0; height: 100%; width: 1px; background-color: #d6c200; }
@media (max-width: 980px) { #character .profile_wrap::after { display: none; } }
#character .profile_wrap .name { color: #fff; font-family: "Noto Serif JP", serif; font-weight: bold; font-size: 3.2619775739vw; font-size: max(12px, 5.3244592346vw); margin-bottom: 0vw; text-align: left; }
@media (min-width: 601px) { #character .profile_wrap .name { font-size: 4.2813455657vw; } }
@media (min-width: 981px) { #character .profile_wrap .name { font-size: 2.0833333333vw; } }
@media (min-width: 601px) { #character .profile_wrap .name { margin-bottom: 0vw; } }
@media (min-width: 981px) { #character .profile_wrap .name { margin-bottom: 1.0416666667vw; } }
@media (max-width: 980px) { #character .profile_wrap .name { margin-right: 20px; } }
#character .profile_wrap .name.en { font-size: 3.2619775739vw; font-size: max(12px, 5.3244592346vw); }
@media (min-width: 601px) { #character .profile_wrap .name.en { font-size: 4.2813455657vw; } }
@media (min-width: 981px) { #character .profile_wrap .name.en { font-size: 2.1875vw; } }
#character .profile_wrap .name.kr { font-size: 3.2619775739vw; font-size: max(12px, 5.3244592346vw); font-family: "Noto Serif KR", serif; }
@media (min-width: 601px) { #character .profile_wrap .name.kr { font-size: 3.2619775739vw; } }
@media (min-width: 981px) { #character .profile_wrap .name.kr { font-size: 1.6666666667vw; } }
#character .profile_wrap .name.zh-hant { font-family: "Noto Serif TC", serif; }
#character .profile_wrap .name.zh-hans { font-family: "Noto Serif SC", serif; }
#character .profile_wrap .cv { color: #fff; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); font-weight: bold; text-align: left; }
@media (min-width: 601px) { #character .profile_wrap .cv { font-size: 1.630988787vw; } }
@media (min-width: 981px) { #character .profile_wrap .cv { font-size: 0.8333333333vw; } }
@media (min-width: 601px) { #character .profile_wrap .cv { display: block; } }
#character .profile_wrap .cv span { box-sizing: border-box; background-color: #e5df00; color: #000; display: inline-block; margin-right: 1.0193679918vw; padding: 0.2038735984vw 1.0193679918vw; }
@media (min-width: 981px) { #character .profile_wrap .cv span { margin-right: 0.5208333333vw; } }
@media (min-width: 601px) { #character .profile_wrap .cv span { padding: 0.2038735984vw 1.0193679918vw; } }
@media (min-width: 981px) { #character .profile_wrap .cv span { padding: 0.1041666667vw 0.5208333333vw; } }

/* -------------------------- */
#character .profile { display: flex; flex-wrap: wrap; width: 100%; max-width: 100%; margin: -2.0387359837vw 0vw 0vw -2.0387359837vw; }
@media (min-width: 601px) { #character .profile { max-width: 100%; } }
@media (min-width: 981px) { #character .profile { max-width: 16.6666666667vw; } }
@media (min-width: 981px) { #character .profile { margin: -0.4166666667vw 0vw 0vw -0.78125vw; } }
#character .profile > div { display: flex; align-items: center; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); margin: 2.0387359837vw 0vw 0vw 2.0387359837vw; width: 100%; max-width: 30%; }
@media (min-width: 601px) { #character .profile > div { font-size: 1.630988787vw; } }
@media (min-width: 981px) { #character .profile > div { font-size: 0.8333333333vw; } }
@media (min-width: 981px) { #character .profile > div { margin: 0.4166666667vw 0vw 0vw 0.78125vw; } }
@media (min-width: 601px) { #character .profile > div { max-width: 11.2130479103vw; } }
@media (min-width: 981px) { #character .profile > div { max-width: 6.25vw; } }
#character .profile > div > dt { color: #ffff00; font-weight: bold; text-align: left; width: 100%; max-width: 50%; }
@media (min-width: 601px) { #character .profile > div > dt { max-width: 50px; } }
@media (min-width: 981px) { #character .profile > div > dt { max-width: 3.3854166667vw; } }
#character .profile > div > dd { color: #fff; text-align: left; }
@media (min-width: 601px) { #character .profile > div > dd { max-width: 50%; } }
#character .profile_en { display: flex; flex-wrap: wrap; margin: -2.0387359837vw 0vw 0vw -3.0581039755vw; width: 100%; max-width: 90%; }
@media (min-width: 981px) { #character .profile_en { margin: -0.78125vw 0vw 0vw -0.78125vw; } }
@media (min-width: 601px) { #character .profile_en { max-width: 100%; } }
@media (min-width: 981px) { #character .profile_en { max-width: 16.6666666667vw; } }
#character .profile_en > div { display: flex; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); margin: 2.0387359837vw 0vw 0vw 3.0581039755vw; }
@media (min-width: 601px) { #character .profile_en > div { font-size: 1.630988787vw; } }
@media (min-width: 981px) { #character .profile_en > div { font-size: 0.8333333333vw; } }
@media (min-width: 981px) { #character .profile_en > div { margin: 0.78125vw 0vw 0vw 0.78125vw; } }
#character .profile_en > div > dt { color: #ffff00; font-weight: bold; text-align: left; }
#character .profile_en > div > dd { display: block; color: #fff; text-align: left; margin-left: 15px; }

/* -------------------------- */
#character .text_box .charatxt_area { background: rgba(0, 0, 0, 0.6); box-sizing: border-box; color: #fff; font-size: 1.630988787vw; font-size: max(12px, 1.630988787vw); padding: 3.0581039755vw; position: relative; line-height: 1.4; width: 100%; max-width: 100%; text-align: left; z-index: 999; /* Firefox */ scrollbar-width: thin; scrollbar-color: #000 transparent; /* Chrome・Edge・Safari */ }
@media (min-width: 981px) { #character .text_box .charatxt_area { font-size: 0.8333333333vw; } }
@media (min-width: 601px) { #character .text_box .charatxt_area { padding: 4.0774719674vw 3.0581039755vw; } }
@media (min-width: 981px) { #character .text_box .charatxt_area { padding: 2.0833333333vw 1.5625vw; } }
#character .text_box .charatxt_area::before, #character .text_box .charatxt_area::after { content: ""; display: block; width: 0; height: 0; }
#character .text_box .charatxt_area::before { margin-top: calc((1 - 1.4) * 0.5em); }
#character .text_box .charatxt_area::after { margin-bottom: calc((1 - 1.4) * 0.5em); }
@media (min-width: 981px) { #character .text_box .charatxt_area { max-width: 29.1666666667vw; } }
@media (max-width: 980px) { #character .text_box .charatxt_area { overflow-y: auto; height: 180px; } }
@media (max-width: 786px) { #character .text_box .charatxt_area { overflow-y: auto; height: 140px; } }
@media (max-width: 980px) { #character .text_box .charatxt_area.en { height: 140px; } }
@media (max-width: 786px) { #character .text_box .charatxt_area.en { height: 120px; } }
#character .text_box .charatxt_area::-webkit-scrollbar { width: 12px; }
#character .text_box .charatxt_area::-webkit-scrollbar-track { background: transparent; }
#character .text_box .charatxt_area::-webkit-scrollbar-thumb { background: #000; border-radius: 999px; }
#character .text_box .charatxt_area::-webkit-scrollbar-thumb:hover { background: #222; }
#character .text_box .charatxt_area::-webkit-scrollbar-corner { background: transparent; }

.text_box.active { display: block; }

@keyframes fade { from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; } }
/* ----------------------------------------------------- creators
----------------------------------------------------- */
#creators { background: url("../img/bg_creators.webp") no-repeat; background-size: 100%; background-position: center top; box-sizing: border-box; padding: 12.2324159021vw 0vw 16.3098878695vw; position: relative; }
@media (min-width: 981px) { #creators { padding: 6.25vw 0vw 8.3333333333vw; } }
#creators::before { content: ""; background: url("../img/img_creator.webp") no-repeat; background-size: 100%; position: absolute; left: 0; bottom: -6.625891947vw; height: 17.8389398573vw; width: 100%; max-width: 100%; }
@media (min-width: 981px) { #creators::before { bottom: -10.4166666667vw; } }
@media (min-width: 981px) { #creators::before { height: 18.0208333333vw; } }
@media (min-width: 981px) { #creators::before { max-width: 100vw; } }

#creators h2 { margin: 0vw auto 5.0968399592vw; width: 100%; max-width: 38.3282364934vw; }
@media (min-width: 981px) { #creators h2 { margin: 0vw auto 2.6041666667vw; } }
@media (min-width: 981px) { #creators h2 { max-width: 19.5833333333vw; } }

/* -------------------------- */
.creators_list { margin: 0 auto; width: 100%; max-width: 70%; }
@media (min-width: 981px) { .creators_list { max-width: 36.4583333333vw; } }

.creators_list div { display: flex; align-items: center; width: 100%; }
.creators_list div:nth-child(n + 2) { margin-top: 5.0968399592vw; }
@media (min-width: 981px) { .creators_list div:nth-child(n + 2) { margin-top: 2.6041666667vw; } }

.creators_list dt { display: flex; align-items: center; flex: 1; color: #cd0000; font-family: "WDXL Lubrifont JP N", sans-serif; font-size: 2.6503567788vw; font-size: max(12px, 2.6503567788vw); }
@media (min-width: 981px) { .creators_list dt { font-size: 1.3541666667vw; } }
.creators_list dt::after { content: ""; flex: 1; height: 1px; background: #aaa; margin: 0vw 15px; }
@media (min-width: 981px) { .creators_list dt::after { margin: 0vw 20px; } }
.creators_list dt.kr { font-size: 3.6697247706vw; font-size: max(12px, 3.6697247706vw); font-family: "East Sea Dokdo", sans-serif; }
@media (min-width: 981px) { .creators_list dt.kr { font-size: 1.875vw; } }
.creators_list dt.zh-hans { font-family: "WDXL Lubrifont SC", sans-serif; }
.creators_list dt.zh-hant { font-family: "WDXL Lubrifont TC", sans-serif; }

.creators_list dd { flex-shrink: 0; margin: 0; color: #fff; font-family: "Noto Serif JP", serif; font-size: 3.6697247706vw; font-size: max(12px, 3.6697247706vw); }
@media (min-width: 981px) { .creators_list dd { font-size: 2.6041666667vw; } }

/* ----------------------------------------------------- mystic
----------------------------------------------------- */
#mystic { background: url("../img/mystic_pass/bg.webp") no-repeat; background-size: 180%; background-position: bottom; box-sizing: border-box; padding-top: 1.0193679918vw; }
@media (min-width: 981px) { #mystic { background-size: 100%; } }
@media (min-width: 981px) { #mystic { padding-top: 5.2083333333vw; } }

#mystic h2 { margin: 0vw auto 5.0968399592vw; width: 100%; max-width: 47.2986748216vw; }
@media (min-width: 981px) { #mystic h2 { margin: 0vw auto 2.6041666667vw; } }
@media (min-width: 981px) { #mystic h2 { max-width: 24.1666666667vw; } }

/* -------------------------- */
.mystic_wrap { box-sizing: border-box; display: flex; margin: 0 auto; padding-top: 0vw; position: relative; width: 100%; max-width: 100%; }
@media (min-width: 981px) { .mystic_wrap { padding-top: 4.1666666667vw; } }
@media (min-width: 981px) { .mystic_wrap { max-width: 62.5vw; } }

.mystic_wrap .chara { width: 100%; max-width: 47.9102956167vw; }
@media (min-width: 981px) { .mystic_wrap .chara { max-width: 25.5208333333vw; } }

/* -------------------------- */
.mystic_txtarea { position: absolute; top: -0.5096839959vw; right: 3.0581039755vw; width: 100%; max-width: 65%; }
@media (min-width: 981px) { .mystic_txtarea { top: 0vw; } }
@media (min-width: 981px) { .mystic_txtarea { right: 0vw; } }
@media (min-width: 981px) { .mystic_txtarea { max-width: 40.1041666667vw; } }

.mystic_txtarea .comment { background: url("../img/mystic_pass/speech_bubble.svg") no-repeat; background-size: 100%; background-position: center bottom; box-sizing: border-box; font-family: "M PLUS 2", sans-serif; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); line-height: 1.4; margin: 0 auto; padding: 4.0774719674vw 6.1162079511vw 12.2324159021vw 8.1549439348vw; height: 32.1100917431vw; width: 100%; max-width: 100%; }
@media (min-width: 601px) { .mystic_txtarea .comment { font-size: 1.630988787vw; } }
@media (min-width: 981px) { .mystic_txtarea .comment { font-size: 0.8333333333vw; } }
.mystic_txtarea .comment::before, .mystic_txtarea .comment::after { content: ""; display: block; width: 0; height: 0; }
.mystic_txtarea .comment::before { margin-top: calc((1 - 1.4) * 0.5em); }
.mystic_txtarea .comment::after { margin-bottom: calc((1 - 1.4) * 0.5em); }
@media (min-width: 981px) { .mystic_txtarea .comment { padding: 3.8020833333vw 5.2083333333vw 6.25vw 5.7291666667vw; } }
@media (min-width: 981px) { .mystic_txtarea .comment { height: 20.3125vw; } }
@media (min-width: 981px) { .mystic_txtarea .comment { max-width: 40.1041666667vw; } }
.mystic_txtarea .comment.en { padding: 4.0774719674vw 6.1162079511vw 12.2324159021vw 8.1549439348vw; }
@media (min-width: 981px) { .mystic_txtarea .comment.en { padding: 2.7604166667vw 5.2083333333vw 6.25vw 5.7291666667vw; } }
.mystic_txtarea .comment_txt { overflow-y: auto; height: 20.3873598369vw; line-height: 1.4; width: 100%; max-width: 100%; }
@media (min-width: 981px) { .mystic_txtarea .comment_txt { height: 11.4583333333vw; } }
.mystic_txtarea .comment_txt::before, .mystic_txtarea .comment_txt::after { content: ""; display: block; width: 0; height: 0; }
.mystic_txtarea .comment_txt::before { margin-top: calc((1 - 1.4) * 0.5em); }
.mystic_txtarea .comment_txt::after { margin-bottom: calc((1 - 1.4) * 0.5em); }
@media (min-width: 981px) { .mystic_txtarea .comment_txt { max-width: 27.0833333333vw; } }
.mystic_txtarea .comment_txt.en { height: 20.3873598369vw; }
@media (min-width: 981px) { .mystic_txtarea .comment_txt.en { height: 13.0208333333vw; } }
.mystic_txtarea .comment strong { color: #cd0000; }

.mystic_txtarea .list_ss { display: flex; margin-top: 2.0387359837vw; }
@media (min-width: 981px) { .mystic_txtarea .list_ss { margin-top: 1.0416666667vw; } }
.mystic_txtarea .list_ss li { background: #000; border: 1px solid #444; }
.mystic_txtarea .list_ss li:nth-child(n + 2) { margin-left: 2.0387359837vw; }
@media (min-width: 981px) { .mystic_txtarea .list_ss li:nth-child(n + 2) { margin-left: 1.0416666667vw; } }
.mystic_txtarea .list_ss li img:hover { transition: all .3s; opacity: 0.5; }

/* -------------------------- */
.btn_mystic_more { background-color: #000; border: 1px solid #fff; box-sizing: border-box; margin: 3.0581039755vw 0vw 0vw auto; width: 100%; max-width: 36.6972477064vw; }
@media (min-width: 981px) { .btn_mystic_more { margin: 2.6041666667vw 0vw 0vw auto; } }
@media (min-width: 981px) { .btn_mystic_more { max-width: 15.625vw; } }
.btn_mystic_more.en { max-width: 45.871559633vw; }
@media (min-width: 981px) { .btn_mystic_more.en { max-width: 17.1875vw; } }
.btn_mystic_more > a { color: #fff; display: block; font-weight: bold; width: 100%; box-sizing: border-box; font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); padding: 2.0387359837vw 0vw 2.0387359837vw 9.1743119266vw; position: relative; }
@media (min-width: 601px) { .btn_mystic_more > a { font-size: 1.8348623853vw; } }
@media (min-width: 981px) { .btn_mystic_more > a { font-size: 0.9375vw; } }
@media (min-width: 981px) { .btn_mystic_more > a { padding: 1.0416666667vw 0vw 1.0416666667vw 4.1666666667vw; } }
.btn_mystic_more > a::before { content: ""; background: url("../img/mystic_pass/icon_X.png"); background-size: cover; position: absolute; top: 50%; left: 4.0774719674vw; transform: translateY(-50%); width: 2.9561671764vw; height: 3.0581039755vw; }
@media (min-width: 601px) { .btn_mystic_more > a::before { left: 4.0774719674vw; } }
@media (min-width: 981px) { .btn_mystic_more > a::before { left: 2.0833333333vw; } }
@media (min-width: 601px) { .btn_mystic_more > a::before { width: 2.9561671764vw; } }
@media (min-width: 981px) { .btn_mystic_more > a::before { width: 1.5104166667vw; } }
@media (min-width: 601px) { .btn_mystic_more > a::before { height: 3.0581039755vw; } }
@media (min-width: 981px) { .btn_mystic_more > a::before { height: 1.5625vw; } }
.btn_mystic_more > a::after { content: ""; background: url("../img/mystic_pass/icon_arrow.svg"); background-size: cover; position: absolute; top: 50%; right: 3.0581039755vw; transform: translateY(-50%); width: 2.5484199796vw; height: 1.9367991845vw; }
@media (min-width: 601px) { .btn_mystic_more > a::after { right: 3.0581039755vw; } }
@media (min-width: 981px) { .btn_mystic_more > a::after { right: 1.5625vw; } }
@media (min-width: 601px) { .btn_mystic_more > a::after { width: 2.5484199796vw; } }
@media (min-width: 981px) { .btn_mystic_more > a::after { width: 1.3020833333vw; } }
@media (min-width: 601px) { .btn_mystic_more > a::after { height: 1.9367991845vw; } }
@media (min-width: 981px) { .btn_mystic_more > a::after { height: 0.9895833333vw; } }
.btn_mystic_more > a:hover { color: #ffff00; transition: all .3s; }
.btn_mystic_more > a:hover::after { transition: all .3s; right: 2.0387359837vw; }
@media (min-width: 601px) { .btn_mystic_more > a:hover::after { right: 2.0387359837vw; } }
@media (min-width: 981px) { .btn_mystic_more > a:hover::after { right: 1.0416666667vw; } }

/* ----------------------------------------------------- product
----------------------------------------------------- */
#product { background-color: #da0000; /*@include r(padding, 100 0, 100 0);*/ }

.tab_wrap { display: flex; }
.tab_menu { width: 80px; display: flex; flex-direction: column; }
.tab_btn { height: 320px; background: #fff; border: 2px solid #fff; color: #da0000; cursor: pointer; transition: .3s; display: flex; justify-content: center; align-items: center; }
.tab_btn .tab_text { display: inline-block; font-family: "Noto Serif JP", serif; font-weight: bold; font-size: 18px; font-size: max(12px, 18px); position: relative; transform: rotate(-90deg); transform-origin: center; white-space: nowrap; }
@media (min-width: 601px) { .tab_btn .tab_text { font-size: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_btn .tab_text { font-size: 1.5625vw; } }
.tab_btn .tab_text.en { font-size: 18px; font-size: max(12px, 18px); }
@media (min-width: 601px) { .tab_btn .tab_text.en { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { .tab_btn .tab_text.en { font-size: 1.0416666667vw; } }
.tab_btn .tab_text.kr { font-family: "Noto Serif KR", serif; }
.tab_btn .tab_text.zh-hant { font-family: "Noto Serif TC", serif; }
.tab_btn .tab_text.zh-hans { font-family: "Noto Serif SC", serif; }
.tab_btn .tab_text::after { content: ""; position: absolute; top: 15%; transform: rotate(0deg); transition: .3s; width: 15px; height: 10px; background: #cd0000; clip-path: polygon(0 0, 100% 50%, 0 100%); -webkit-mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); }
@media (min-width: 601px) { .tab_btn .tab_text::after { width: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_btn .tab_text::after { width: 1.5625vw; } }
@media (min-width: 601px) { .tab_btn .tab_text::after { height: 2.3445463812vw; } }
@media (min-width: 981px) { .tab_btn .tab_text::after { height: 1.1979166667vw; } }
.tab_btn + .tab_btn { border-top: none; }
.tab_btn.is-active { background: #da0000; border-color: #da0000; color: #fff; font-family: "Noto Serif JP", serif; font-weight: bold; font-size: 18px; font-size: max(12px, 18px); }
@media (min-width: 601px) { .tab_btn.is-active { font-size: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_btn.is-active { font-size: 1.5625vw; } }
.tab_btn.is-active .tab_text { display: inline-block; position: relative; transform: rotate(-90deg); transform-origin: center; white-space: nowrap; }
.tab_btn.is-active .tab_text::after { content: ""; position: absolute; top: 0%; transform: rotate(90deg); transition: .3s; width: 15px; height: 10px; background: #fff; clip-path: polygon(0 0, 100% 50%, 0 100%); -webkit-mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); }
@media (min-width: 601px) { .tab_btn.is-active .tab_text::after { width: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_btn.is-active .tab_text::after { width: 1.5625vw; } }
@media (min-width: 601px) { .tab_btn.is-active .tab_text::after { height: 2.3445463812vw; } }
@media (min-width: 981px) { .tab_btn.is-active .tab_text::after { height: 1.1979166667vw; } }
@media (max-width: 980px) { .tab_wrap { flex-direction: column; }
  .tab_menu { width: 100%; flex-direction: row; }
  .tab_btn { flex: 1; height: 11.6472545757vw; }
  .tab_btn .tab_text { transform: rotate(0deg); }
  .tab_btn .tab_text::after { content: ""; position: absolute; top: 25%; transform: rotate(0deg); transition: .3s; width: 15px; height: 10px; background: #cd0000; clip-path: polygon(0 0, 100% 50%, 0 100%); -webkit-mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); } }
@media (max-width: 980px) and (min-width: 601px) { .tab_btn .tab_text::after { width: 3.0581039755vw; } }
@media (max-width: 980px) and (min-width: 981px) { .tab_btn .tab_text::after { width: 1.5625vw; } }
@media (max-width: 980px) and (min-width: 601px) { .tab_btn .tab_text::after { height: 2.3445463812vw; } }
@media (max-width: 980px) and (min-width: 981px) { .tab_btn .tab_text::after { height: 1.1979166667vw; } }
@media (max-width: 980px) { .tab_btn + .tab_btn { border-top: none; border-left: 2px solid #fff; }
  .tab_btn.is-active .tab_text { transform: rotate(0deg); }
  .tab_btn.is-active .tab_text::after { content: ""; position: absolute; top: 25%; transform: rotate(90deg); transition: .3s; width: 15px; height: 10px; background: #fff; clip-path: polygon(0 0, 100% 50%, 0 100%); -webkit-mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); mask: radial-gradient(circle at left center, transparent 35%, #fff 40%); } }
@media (max-width: 980px) and (min-width: 601px) { .tab_btn.is-active .tab_text::after { width: 3.0581039755vw; } }
@media (max-width: 980px) and (min-width: 981px) { .tab_btn.is-active .tab_text::after { width: 1.5625vw; } }
@media (max-width: 980px) and (min-width: 601px) { .tab_btn.is-active .tab_text::after { height: 2.3445463812vw; } }
@media (max-width: 980px) and (min-width: 981px) { .tab_btn.is-active .tab_text::after { height: 1.1979166667vw; } }

.tab_contents { flex: 1; }
.tab_content { display: none; }
.tab_content .product_area { box-sizing: border-box; display: flex; justify-content: space-between; margin: 0vw auto; padding: 40px 0vw; width: 100%; max-width: 90%; }
@media (min-width: 981px) { .tab_content .product_area { margin: 0vw 0vw 0vw 9.375vw; } }
@media (min-width: 601px) { .tab_content .product_area { padding: 9.1743119266vw 0vw; } }
@media (min-width: 981px) { .tab_content .product_area { padding: 4.6875vw 0vw; } }
@media (min-width: 601px) { .tab_content .product_area { max-width: 71.3557594292vw; } }
@media (min-width: 981px) { .tab_content .product_area { max-width: 72.9166666667vw; } }
@media (max-width: 980px) { .tab_content .product_area { flex-direction: column; } }
.tab_content .package { width: 100%; max-width: 60%; }
@media (min-width: 981px) { .tab_content .package { max-width: 17.7083333333vw; } }
.tab_content .package img { border: 1px solid #fff; }
.tab_content .package.pc { display: block; }
.tab_content .package.sp { display: none; }
@media (max-width: 980px) { .tab_content .package { margin: 0 auto 20px; }
  .tab_content .package.pc { display: none; }
  .tab_content .package.sp { display: block; } }
.tab_content .product_wrap { width: 100%; }
.tab_content .product_wrap h2 { margin-bottom: 20px; width: 100%; max-width: 65.5453618756vw; }
@media (min-width: 981px) { .tab_content .product_wrap h2 { margin-bottom: 2.0833333333vw; } }
@media (min-width: 601px) { .tab_content .product_wrap h2 { max-width: 55.3516819572vw; } }
@media (min-width: 981px) { .tab_content .product_wrap h2 { max-width: 28.28125vw; } }
.tab_content .product_txtarea { position: relative; }
.tab_content .product_txtarea::before { content: ""; position: absolute; background-color: #ff0000; height: 100%; width: 2px; top: 0; left: 0vw; }
@media (min-width: 981px) { .tab_content .product_txtarea::before { left: 10.3125vw; } }
@media (max-width: 980px) { .tab_content .product_txtarea::before { display: none; } }
.tab_content .product_txtarea div { display: flex; font-size: 16px; font-size: max(12px, 16px); padding-bottom: 15px; }
@media (min-width: 601px) { .tab_content .product_txtarea div { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { .tab_content .product_txtarea div { font-size: 1.0416666667vw; } }
@media (min-width: 601px) { .tab_content .product_txtarea div { padding-bottom: 15px; } }
@media (min-width: 981px) { .tab_content .product_txtarea div { padding-bottom: 0vw; } }
.tab_content .product_txtarea div:nth-child(n + 2) { margin-top: 20px; }
@media (min-width: 601px) { .tab_content .product_txtarea div:nth-child(n + 2) { margin-top: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_content .product_txtarea div:nth-child(n + 2) { margin-top: 1.8229166667vw; } }
@media (max-width: 980px) { .tab_content .product_txtarea div { flex-direction: column; border-bottom: 2px solid #ff0000; }
  .tab_content .product_txtarea div:last-child { border-bottom: 0; } }
.tab_content .product_txtarea dt { color: #fff; font-weight: bold; width: 100%; max-width: 100%; }
@media (min-width: 981px) { .tab_content .product_txtarea dt { max-width: 10.3125vw; } }
.tab_content .product_txtarea dd { color: #fff; margin: 10px 0vw 0vw 0vw; line-height: 1.4; }
@media (min-width: 601px) { .tab_content .product_txtarea dd { margin: 10px 0vw 0vw 0vw; } }
@media (min-width: 981px) { .tab_content .product_txtarea dd { margin: 0vw 0vw 0vw 2.0833333333vw; } }
.tab_content .product_txtarea dd::before, .tab_content .product_txtarea dd::after { content: ""; display: block; width: 0; height: 0; }
.tab_content .product_txtarea dd::before { margin-top: calc((1 - 1.4) * 0.5em); }
.tab_content .product_txtarea dd::after { margin-bottom: calc((1 - 1.4) * 0.5em); }
.tab_content .product_txtarea dd .yellow { color: #ffff00; }
.tab_content .product_txtarea dd.pc { display: block; }
.tab_content .product_txtarea dd.sp { display: none; }
@media (max-width: 980px) { .tab_content .product_txtarea dd.pc { display: none; }
  .tab_content .product_txtarea dd.sp { display: block; } }
.tab_content.is-active { display: block; background: #da0000; }
.tab_content .purchase-bonus_area { box-sizing: border-box; margin: 0 auto; padding: 40px 0vw 60px; width: 100%; max-width: 90%; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area { padding: 9.1743119266vw 0vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area { padding: 4.6875vw 0vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area { max-width: 71.3557594292vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area { max-width: 72.9166666667vw; } }
.tab_content .purchase-bonus_area h2 { margin-bottom: 20px; width: 100%; max-width: 65.749235474vw; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area h2 { margin-bottom: 4.0774719674vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area h2 { margin-bottom: 2.0833333333vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area h2 { max-width: 65.749235474vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area h2 { max-width: 33.59375vw; } }
.tab_content .purchase-bonus_area .bonus01, .tab_content .purchase-bonus_area .bonus02 { position: relative; }
.tab_content .purchase-bonus_area .bonus01 > h3, .tab_content .purchase-bonus_area .bonus02 > h3 { border-bottom: 2px solid #ff0000; position: absolute; top: 0; right: 0; width: 100%; text-align: right; }
@media (max-width: 980px) { .tab_content .purchase-bonus_area .bonus01 > h3, .tab_content .purchase-bonus_area .bonus02 > h3 { position: static; margin-bottom: 20px; } }
.tab_content .purchase-bonus_area .bonus01 > h3 img, .tab_content .purchase-bonus_area .bonus02 > h3 img { width: 100%; max-width: 50%; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus01 > h3 img, .tab_content .purchase-bonus_area .bonus02 > h3 img { max-width: 50%; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus01 > h3 img, .tab_content .purchase-bonus_area .bonus02 > h3 img { max-width: 23.75vw; } }
.tab_content .purchase-bonus_area .bonus02 { margin-top: 50px; }
.tab_content .purchase-bonus_area .bonus_wrap { box-sizing: border-box; display: flex; align-items: flex-start; padding-top: 10px; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_wrap { padding-top: 0vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_wrap { padding-top: 7.2916666667vw; } }
@media (max-width: 980px) { .tab_content .purchase-bonus_area .bonus_wrap { flex-direction: column; margin-top: 30px; } }
.tab_content .purchase-bonus_area .bonus_img_area { box-sizing: border-box; background: url("../img/product/store/bonus_img_bg.svg") no-repeat; background-size: 100%; margin-top: -4.0774719674vw; padding: 3.0581039755vw; width: 100%; max-width: 740px; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_img_area { margin-top: 0vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_img_area { margin-top: -7.2916666667vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_img_area { padding: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_img_area { padding: 1.5625vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_img_area { max-width: 75.4332313965vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_img_area { max-width: 38.5416666667vw; } }
.tab_content .purchase-bonus_area .bonus_img_area li { list-style: none; }
.tab_content .purchase-bonus_area .bonus_img_area img { display: block; text-align: center; width: 100%; max-width: 680px; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_img_area img { max-width: 69.3170234455vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_img_area img { max-width: 35.4166666667vw; } }
.tab_content .purchase-bonus_area .bonus_img_area .slick-dots { right: 5px; bottom: 5px; width: 50% !important; }
@media (max-width: 980px) { .tab_content .purchase-bonus_area .bonus_img_area .slick-dots { bottom: -5px; } }
.tab_content .purchase-bonus_area .bonus_img_area .slick-dots li { margin: 0 4px; }
.tab_content .purchase-bonus_area .bonus_img_area .slick-dots li button:before { color: #fff; opacity: .4; font-size: 30px; }
.tab_content .purchase-bonus_area .bonus_img_area .slick-dots li.slick-active button:before { color: #cd0000; opacity: 1; }
.tab_content .purchase-bonus_area .bonus_txt div { margin-left: 0vw; margin-top: 2.0387359837vw; }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_txt div { margin-left: 2.0833333333vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_txt div { margin-top: 2.0387359837vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_txt div { margin-top: 0vw; } }
.tab_content .purchase-bonus_area .bonus_txt dt, .tab_content .purchase-bonus_area .bonus_txt dd { color: #fff; }
.tab_content .purchase-bonus_area .bonus_txt dt { font-size: 2.5484199796vw; font-size: max(12px, 4.159733777vw); font-family: "Noto Serif JP", serif; font-weight: bold; margin-bottom: 20px; width: 100%; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_txt dt { font-size: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_txt dt { font-size: 1.5625vw; } }
.tab_content .purchase-bonus_area .bonus_txt dt.kr { font-family: "Noto Serif KR", serif; }
.tab_content .purchase-bonus_area .bonus_txt dt.zh-hant { font-family: "Noto Serif TC", serif; }
.tab_content .purchase-bonus_area .bonus_txt dt.zh-hans { font-family: "Noto Serif SC", serif; }
.tab_content .purchase-bonus_area .bonus_txt dd { font-size: 1.630988787vw; font-size: max(12px, 2.6622296173vw); line-height: 1.8; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_txt dd { font-size: 1.630988787vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_txt dd { font-size: 0.8333333333vw; } }
.tab_content .purchase-bonus_area .bonus_txt dd::before, .tab_content .purchase-bonus_area .bonus_txt dd::after { content: ""; display: block; width: 0; height: 0; }
.tab_content .purchase-bonus_area .bonus_txt dd::before { margin-top: calc((1 - 1.8) * 0.5em); }
.tab_content .purchase-bonus_area .bonus_txt dd::after { margin-bottom: calc((1 - 1.8) * 0.5em); }
.tab_content .purchase-bonus_area .bonus_txt dd:nth-child(n + 2) { margin-top: 5px; }
.tab_content .purchase-bonus_area .slick-dotted.slick-slider { margin-bottom: 0 !important; }
.tab_content .purchase-bonus_area .bonus_buy { margin-top: 40px; width: 100%; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy { margin-top: 10.1936799185vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy { margin-top: 5.2083333333vw; } }
.tab_content .purchase-bonus_area .bonus_buy_list > div { display: flex; justify-content: space-between; margin: 0 auto; width: 100%; max-width: 90%; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy_list > div { max-width: 69.3170234455vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy_list > div { max-width: 35.4166666667vw; } }
@media (max-width: 980px) { .tab_content .purchase-bonus_area .bonus_buy_list > div { flex-direction: column; justify-content: center; text-align: center; } }
.tab_content .purchase-bonus_area .bonus_buy_list > div:nth-child(n + 2) { margin-top: 15px; }
.tab_content .purchase-bonus_area .bonus_buy_list.en > div { max-width: 90%; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy_list.en > div { max-width: 90%; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy_list.en > div { max-width: 52.0833333333vw; } }
.tab_content .purchase-bonus_area .bonus_buy_list dt { color: #ffff00; font-weight: bold; font-size: 20px; font-size: max(12px, 20px); }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy_list dt { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy_list dt { font-size: 1.0416666667vw; } }
.tab_content .purchase-bonus_area .bonus_buy_list dd { color: #fff; font-weight: bold; font-size: 20px; font-size: max(12px, 20px); }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy_list dd { font-size: 2.0387359837vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy_list dd { font-size: 1.0416666667vw; } }
@media (max-width: 980px) { .tab_content .purchase-bonus_area .bonus_buy_list dd { margin-top: 10px; } }
.tab_content .purchase-bonus_area .bonus_buy_list + .notes { color: #fff; margin-top: 25px; font-size: 1.4271151886vw; font-size: max(12px, 2.3294509151vw); text-align: center; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy_list + .notes { margin-top: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy_list + .notes { margin-top: 1.5625vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy_list + .notes { font-size: 1.4271151886vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy_list + .notes { font-size: 0.7291666667vw; } }
@media (max-width: 980px) { .tab_content .purchase-bonus_area .bonus_buy_list + .notes { text-align: left; } }
.tab_content .purchase-bonus_area .bonus_buy h3 { box-sizing: border-box; color: #fff; font-family: "Noto Serif JP", serif; font-weight: bold; font-size: 24px; font-size: max(12px, 24px); margin-bottom: 20px; padding-bottom: 20px; text-align: center; border-bottom: 2px solid #ff0000; width: 100%; }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy h3 { font-size: 3.0581039755vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy h3 { font-size: 1.5625vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy h3 { margin-bottom: 3.5677879715vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy h3 { margin-bottom: 1.8229166667vw; } }
@media (min-width: 601px) { .tab_content .purchase-bonus_area .bonus_buy h3 { padding-bottom: 2.0387359837vw; } }
@media (min-width: 981px) { .tab_content .purchase-bonus_area .bonus_buy h3 { padding-bottom: 1.0416666667vw; } }
.tab_content .purchase-bonus_area .bonus_buy h3.kr { font-family: "Noto Serif KR", serif; }
.tab_content .purchase-bonus_area .bonus_buy h3.zh-hant { font-family: "Noto Serif TC", serif; }
.tab_content .purchase-bonus_area .bonus_buy h3.zh-hans { font-family: "Noto Serif SC", serif; }

/* -------------------------- */
.store_area { box-sizing: border-box; background-color: #222; padding: 60px 0vw; width: 100%; }
@media (min-width: 601px) { .store_area { padding: 8.1549439348vw 0vw; } }
@media (min-width: 981px) { .store_area { padding: 4.1666666667vw 0vw; } }
.store_area > h2 { margin: 0vw 0vw 0vw 12%; position: relative; width: 100%; max-width: 88%; }
@media (min-width: 601px) { .store_area > h2 { margin: 0vw 0vw 5.0968399592vw auto; } }
@media (min-width: 981px) { .store_area > h2 { margin: 0vw 0vw 2.6041666667vw auto; } }
@media (min-width: 601px) { .store_area > h2 { max-width: 88%; } }
@media (min-width: 981px) { .store_area > h2 { max-width: 85.9375vw; } }
.store_area > h2::before { content: ""; background-color: #999; height: 1px; position: absolute; margin-top: -1px; top: 35%; right: 0; width: 100%; max-width: 70%; }
@media (min-width: 601px) { .store_area > h2::before { max-width: 70%; } }
@media (min-width: 981px) { .store_area > h2::before { max-width: 72.9166666667vw; } }
.store_area > h2 img { width: 100%; max-width: 23.3435270133vw; }
@media (min-width: 601px) { .store_area > h2 img { max-width: 23.3435270133vw; } }
@media (min-width: 981px) { .store_area > h2 img { max-width: 11.9270833333vw; } }
.store_area > h3 { color: #fff; font-family: "M PLUS 2", sans-serif; font-size: 16px; font-size: max(12px, 16px); margin: 0; margin-bottom: 20px; padding-left: 60px; position: relative; }
@media (min-width: 601px) { .store_area > h3 { font-size: 1.630988787vw; } }
@media (min-width: 981px) { .store_area > h3 { font-size: 0.8333333333vw; } }
@media (min-width: 601px) { .store_area > h3 { padding-left: 12.2324159021vw; } }
@media (min-width: 981px) { .store_area > h3 { padding-left: 13.28125vw; } }
.store_area > h3:nth-child(n + 2) { margin-top: 40px; }
@media (min-width: 601px) { .store_area > h3:nth-child(n + 2) { margin-top: 4.0774719674vw; } }
@media (min-width: 981px) { .store_area > h3:nth-child(n + 2) { margin-top: 2.0833333333vw; } }
.store_area > h3::before { content: ""; background-color: #666; height: 1px; position: absolute; margin-top: -1px; top: 50%; left: 0; width: 100%; max-width: 50px; }
@media (min-width: 601px) { .store_area > h3::before { max-width: 11.2130479103vw; } }
@media (min-width: 981px) { .store_area > h3::before { max-width: 12.5vw; } }

.store_lnk_wrap { margin: 0 auto; width: 100%; max-width: 90%; }
@media (min-width: 601px) { .store_lnk_wrap { max-width: 142.7115188583vw; } }
@media (min-width: 981px) { .store_lnk_wrap { max-width: 72.9166666667vw; } }

.store_lnk_area { display: flex; align-items: center; margin: -2.0387359837vw 0vw 0vw -2.0387359837vw; }
@media (min-width: 601px) { .store_lnk_area { margin: -2.0387359837vw 0vw 0vw -2.0387359837vw; } }
@media (min-width: 981px) { .store_lnk_area { margin: -1.0416666667vw 0vw 0vw -1.0416666667vw; } }
@media (max-width: 980px) { .store_lnk_area { flex-wrap: wrap; justify-content: center; } }
.store_lnk_area > li { border: 1px solid #fff; width: 100%; margin: 2.0387359837vw 0vw 0vw 2.0387359837vw; max-width: 348px; }
@media (min-width: 601px) { .store_lnk_area > li { margin: 2.0387359837vw 0vw 0vw 2.0387359837vw; } }
@media (min-width: 981px) { .store_lnk_area > li { margin: 1.0416666667vw 0vw 0vw 1.0416666667vw; } }
@media (min-width: 601px) { .store_lnk_area > li { max-width: 35.4740061162vw; } }
@media (min-width: 981px) { .store_lnk_area > li { max-width: 18.125vw; } }
.store_lnk_area > li a { box-sizing: border-box; display: block; padding: 15px 0vw 15px 30px; position: relative; width: 100%; }
@media (min-width: 601px) { .store_lnk_area > li a { padding: 2.0387359837vw 0vw 2.0387359837vw 4.0774719674vw; } }
@media (min-width: 981px) { .store_lnk_area > li a { padding: 1.0416666667vw 0vw 1.0416666667vw 2.0833333333vw; } }
.store_lnk_area > li a::before { content: ""; background: url("../img/product/icon_store_arrow.svg"); background-size: cover; margin-top: -0.9174311927vw; position: absolute; top: 50%; right: 20px; height: 1.8348623853vw; width: 100%; max-width: 7.6452599388vw; }
@media (min-width: 601px) { .store_lnk_area > li a::before { margin-top: -0.9174311927vw; } }
@media (min-width: 981px) { .store_lnk_area > li a::before { margin-top: -0.46875vw; } }
@media (min-width: 601px) { .store_lnk_area > li a::before { right: 4.0774719674vw; } }
@media (min-width: 981px) { .store_lnk_area > li a::before { right: 2.0833333333vw; } }
@media (min-width: 601px) { .store_lnk_area > li a::before { height: 1.8348623853vw; } }
@media (min-width: 981px) { .store_lnk_area > li a::before { height: 0.9375vw; } }
@media (min-width: 601px) { .store_lnk_area > li a::before { max-width: 7.6452599388vw; } }
@media (min-width: 981px) { .store_lnk_area > li a::before { max-width: 3.90625vw; } }
.store_lnk_area > li a:hover { transition: all 0.3s; opacity: .5; }
.store_lnk_area > li a:hover::before { transition: all 0.3s; right: 10px; }
@media (min-width: 601px) { .store_lnk_area > li a:hover::before { right: 3.0581039755vw; } }
@media (min-width: 981px) { .store_lnk_area > li a:hover::before { right: 1.5625vw; } }
.store_lnk_area > li img { height: 100%; max-height: 26px; width: auto; }
@media (min-width: 601px) { .store_lnk_area > li img { max-height: 3.5677879715vw; } }
@media (min-width: 981px) { .store_lnk_area > li img { max-height: 1.8229166667vw; } }
.store_lnk_area > li:nth-child(3) { width: 100%; max-width: 348px; }
@media (min-width: 601px) { .store_lnk_area > li:nth-child(3) { max-width: 35.4740061162vw; } }
@media (min-width: 981px) { .store_lnk_area > li:nth-child(3) { max-width: 17.1875vw; } }
.store_lnk_area > li:nth-child(3) a { padding: 15px 0vw 15px 30px; }
@media (min-width: 601px) { .store_lnk_area > li:nth-child(3) a { padding: 1.5290519878vw 0vw 1.5290519878vw 4.0774719674vw; } }
@media (min-width: 981px) { .store_lnk_area > li:nth-child(3) a { padding: 0.78125vw 0vw 0.78125vw 2.0833333333vw; } }
.store_lnk_area > li:nth-child(3) img { height: 100%; max-height: 26px; width: auto; }
@media (min-width: 601px) { .store_lnk_area > li:nth-child(3) img { max-height: 4.5871559633vw; } }
@media (min-width: 981px) { .store_lnk_area > li:nth-child(3) img { max-height: 2.34375vw; } }
.store_lnk_area > li:last-child { width: 100%; max-width: 348px; }
@media (min-width: 601px) { .store_lnk_area > li:last-child { max-width: 35.4740061162vw; } }
@media (min-width: 981px) { .store_lnk_area > li:last-child { max-width: 15.8854166667vw; } }
.store_lnk_area > li:last-child a { padding: 15px 0vw 15px 30px; }
@media (min-width: 601px) { .store_lnk_area > li:last-child a { padding: 1.5290519878vw 0vw 1.5290519878vw 4.0774719674vw; } }
@media (min-width: 981px) { .store_lnk_area > li:last-child a { padding: 0.78125vw 0vw 0.78125vw 2.0833333333vw; } }
.store_lnk_area > li:last-child img { height: 100%; max-height: 26px; width: auto; }
@media (min-width: 601px) { .store_lnk_area > li:last-child img { max-height: 4.5871559633vw; } }
@media (min-width: 981px) { .store_lnk_area > li:last-child img { max-height: 2.34375vw; } }
.store_lnk_area > li.off { box-sizing: border-box; padding: 15px 0vw 15px 30px; opacity: 0.3; }
@media (min-width: 601px) { .store_lnk_area > li.off { padding: 2.0387359837vw 0vw 2.0387359837vw 4.0774719674vw; } }
@media (min-width: 981px) { .store_lnk_area > li.off { padding: 1.0416666667vw 0vw 1.0416666667vw 2.0833333333vw; } }
.store_lnk_area > li.off:nth-child(3) { width: 100%; max-width: 348px; padding: 15px 0vw 15px 30px; }
@media (min-width: 601px) { .store_lnk_area > li.off:nth-child(3) { max-width: 35.4740061162vw; } }
@media (min-width: 981px) { .store_lnk_area > li.off:nth-child(3) { max-width: 15.8854166667vw; } }
@media (min-width: 601px) { .store_lnk_area > li.off:nth-child(3) { padding: 1.5290519878vw 0vw 1.5290519878vw 4.0774719674vw; } }
@media (min-width: 981px) { .store_lnk_area > li.off:nth-child(3) { padding: 0.78125vw 0vw 0.78125vw 2.0833333333vw; } }
.store_lnk_area > li.off:nth-child(3) img { height: 100%; max-height: 26px; width: auto; }
@media (min-width: 601px) { .store_lnk_area > li.off:nth-child(3) img { max-height: 4.5871559633vw; } }
@media (min-width: 981px) { .store_lnk_area > li.off:nth-child(3) img { max-height: 2.34375vw; } }
.store_lnk_area > li.ps5 { background-color: #003087; }
.store_lnk_area > li.steam { background-color: #333e50; }
.store_lnk_area > li.epic { background-color: #101014; }

/* ----------------------------------------------------- footer
----------------------------------------------------- */
footer { background: #000; padding-bottom: 5.0968399592vw; box-sizing: border-box; height: auto; width: 100%; }
@media (min-width: 981px) { footer { padding-bottom: 2.6041666667vw; } }

footer .footer_logo { display: flex; align-items: center; justify-content: center; margin: 7.8491335372vw auto 4.1794087666vw; }
@media (min-width: 981px) { footer .footer_logo { margin: 4.3229166667vw auto 2.1354166667vw; } }

footer .footer_logo li:nth-child(1) { width: 21.9164118247vw; }
@media (min-width: 981px) { footer .footer_logo li:nth-child(1) { width: 11.1979166667vw; } }

footer .footer_logo li:nth-child(2) { width: 22.120285423vw; margin-left: 3.4658511723vw; }
@media (min-width: 981px) { footer .footer_logo li:nth-child(2) { width: 11.3020833333vw; } }
@media (min-width: 981px) { footer .footer_logo li:nth-child(2) { margin-left: 1.7708333333vw; } }

footer .footer_logo li:nth-child(3) { width: 15.494393476vw; margin-left: 2.8542303772vw; }
@media (min-width: 981px) { footer .footer_logo li:nth-child(3) { width: 7.9166666667vw; } }
@media (min-width: 981px) { footer .footer_logo li:nth-child(3) { margin-left: 1.4583333333vw; } }

footer .footer_logo li:nth-child(4) { width: 4.99490316vw; margin-left: 2.8542303772vw; }
@media (min-width: 981px) { footer .footer_logo li:nth-child(4) { width: 2.5520833333vw; } }
@media (min-width: 981px) { footer .footer_logo li:nth-child(4) { margin-left: 1.4583333333vw; } }

.copy { width: 100%; max-width: 83.6901121305vw; margin: 2.6503567788vw auto 0vw; }
@media (min-width: 981px) { .copy { max-width: 65.8333333333vw; } }
@media (min-width: 981px) { .copy { margin: 1.3541666667vw auto 0vw; } }

.copy_en { width: 100%; max-width: 106.2181447503vw; margin: 2.6503567788vw auto 0vw; }
@media (min-width: 981px) { .copy_en { max-width: 54.2708333333vw; } }
@media (min-width: 981px) { .copy_en { margin: 1.3541666667vw auto 0vw; } }

.footer_link_company { display: flex; align-items: center; justify-content: center; width: 100%; margin-top: 8.0530071356vw; }
@media (min-width: 981px) { .footer_link_company { margin-top: 2.1875vw; } }
.footer_link_company .arc { height: 6.5239551478vw; display: block; }
@media (min-width: 981px) { .footer_link_company .arc { height: 3.3333333333vw; } }
.footer_link_company .arc img { height: 100%; }
.footer_link_company .uniteplus { height: 6.5239551478vw; display: block; }
@media (min-width: 981px) { .footer_link_company .uniteplus { height: 3.3333333333vw; } }
.footer_link_company .uniteplus img { height: 100%; }
.footer_link_company a:hover { opacity: 0.5; transition: all 0.3s; }

footer .footer_link_company > li:nth-child(n + 2) { margin-left: 2.0387359837vw; }
@media (min-width: 981px) { footer .footer_link_company > li:nth-child(n + 2) { margin-left: 1.0416666667vw; } }

.copy_arc { color: #fff; text-align: center; margin-top: 2.752293578vw; font-size: 1.4271151886vw; font-size: max(12px, 1.4271151886vw); }
@media (min-width: 981px) { .copy_arc { margin-top: 1.40625vw; } }
@media (min-width: 981px) { .copy_arc { font-size: 0.7291666667vw; } }

/* ----------------------------------------------------- modal
----------------------------------------------------- */
.modal-container { position: fixed; inset: 0; display: none; justify-content: center; align-items: center; background: rgba(0, 0, 0, 0.8); z-index: 999999999999; }
.modal-container.active { display: flex; }

.modal { position: relative; width: 100%; max-width: 95%; max-height: 100%; opacity: 0; transition: opacity .3s; }
@media (min-width: 981px) { .modal { max-width: 80%; } }

.modal-body { margin: auto; margin-top: 0vw; width: 100%; max-width: 100%; }
@media (min-width: 981px) { .modal-body { margin-top: 3.125vw; } }
@media (min-width: 981px) { .modal-body { max-width: 90%; } }
.modal-body img, .modal-body video { display: block; width: 100%; max-width: 100%; aspect-ratio: 16 / 9; object-fit: contain; }

.modal_close { position: absolute; top: -20%; right: 0vw; height: 6.1162079511vw; width: 6.1162079511vw; color: #fff; border: none; background: none; font-size: 6.1162079511vw; font-size: max(12px, 6.1162079511vw); line-height: 1; cursor: pointer; }
@media (min-width: 981px) { .modal_close { top: 0vw; } }
@media (min-width: 981px) { .modal_close { right: 1.0416666667vw; } }
@media (min-width: 981px) { .modal_close { height: 3.125vw; } }
@media (min-width: 981px) { .modal_close { width: 3.125vw; } }
@media (min-width: 981px) { .modal_close { font-size: 3.125vw; } }

/*# sourceMappingURL=style.css.map */