@charset "UTF-8";


/***************************************************

	top

***************************************************/


.body_filter {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease, visibility 0.8s ease;
}

body.is-loaded .body_filter {
  opacity: 1;
  visibility: visible;
}

footer{
	margin-top: 0;
}

footer .footer_navi{
	transform: translateY(100%);
	opacity: 0;
	transition: transform 0.5s ease, opacity 0.3s ease;
	pointer-events: none;
}

#sound-permission {
	position: fixed;
	inset: 0;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	background-image: url('../images/common/loading_bg.webp');
	z-index: 10000; /* プリローダーより前 */
	display: flex;
	align-items: center;
	justify-content: center;
}

#sound-permission .sound-box {
	color: #fff;
	text-align: center;
}

#sound-permission .sound-box p{
	font-size: 16px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.90);
	margin-bottom: 40px;
}

#sound-permission .sound-box ul{
	width: 170px;
	margin: 0 auto;
	text-align: center;
}

#sound-permission .sound-box ul li{
	margin-bottom: 16px;
}

#sound-permission .sound-box ul li:last-child{
	margin-bottom: 0;
}

#sound-permission .sound-box ul li .flex{
	display: flex;
	justify-content: center;
    align-items: center;
	position: relative;
	cursor: pointer;
}

#sound-permission .sound-box ul li .flex::after,
#sound-permission .sound-box ul li .flex::before{
	content: '';
	display: block;
	width: 10px;
	height: 18px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url(../images/common/arrow_sns_title.png);
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0, -50%) scale(-1, 1);
	transition: all 0.2s linear;
	opacity: 0;
}

#sound-permission .sound-box ul li .flex::after{
	left: unset;
	right: 0;
	transform: translate(0, -50%) scale(1, 1);
}

#sound-permission .sound-box ul li:hover .flex::after,
#sound-permission .sound-box ul li:hover .flex::before{
	opacity: 1;
}


#sound-permission .sound-box ul li .flex .icon{
	width: 44px;
	height: 44px;
	position: relative;
}

#sound-permission .sound-box ul li .flex .icon::before{
	content: '';
	display: block;
	width: 44px;
	height: 44px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url(../images/common/icon_sound_on.png);
	position: absolute;
	top: 0;
	left: 0;
}

#sound-permission .sound-box ul li .flex.sound-off .icon::before{
	background-image: url(../images/common/icon_sound_off.png);
}

#sound-permission .sound-box ul li .flex .text{
	width: 54px;
	font-size: 24px;
	color: #B39D50;
	font-weight: 700;
	line-height: 1.4;
	margin-left: 8px;
}



#kv_area{
	position: relative;
	width: 100%;
	height: 810px;
	margin-bottom: 40px;
}

#kv_area::after{
	content: none;
	display: block;
	width: 100vw;
	height: 46.527778vw;
	/*background: linear-gradient(180deg, rgba(5, 4, 4, 0) 0%, rgba(5, 4, 4, 0.70) 5%);*/
	/*background: linear-gradient(180deg, rgba(5, 4, 4, 0) 0%, rgba(5, 4, 4, 0.70) 0);*/
	background-color: rgba(0, 0, 0, 0.6);
	position: absolute;
	top: 798px;
	left: 0;
	z-index: 1;
}

#kv_area video{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	object-fit: cover;
}

#kv_area .kv_wrapp{
	/*width: 1440px;*/
	height: 100%;
	margin: 0 auto;
	position: relative;
	/*overflow: hidden;*/
}

#kv_area .kv_wrapp::after{
	content: '';
	display: block;
	width: 100%;
	height: 200vw;
	background-color: rgba(0,0,0,0.6);
	position: absolute;
    top: 0;
    left: 0;
}



#kv_area .kv_cont .logo_catch{
	width: 398px;
	position: absolute;
	top: 153px;
	left: 90px;
	z-index: 2;
}

#kv_area .kv_cont{
	width: 710px;
	height: 1540px;
	padding: 88px 172px 0 40px;
	box-sizing: border-box;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	/*background: linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.90) 55%);*/

	background: linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.90) 35%);

}

#kv_area .logo_jp{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	color: #F6F4EE;
	letter-spacing: 0.35em;
	text-shadow: 0 0 4.4px #000;
	position: absolute;
	top: 293px;
	left: 130px;
}

#kv_area .kv_cont .title_logo{
	position: relative;
}

#kv_area .kv_cont .other_wrapp{
	width: 498px;
	position: absolute;
	top: 387px;
    left: 37px;
    text-align: center;
}

#kv_area .kv_cont .other_wrapp .date_area{
	margin-bottom: -10px;
	text-align: center;
}

#kv_area .kv_cont .other_wrapp .date_area p{
	font-size: 48px;
	font-weight: 700;
	color: var(--text_w);
	line-height: 1.2;
	white-space: nowrap;
	text-shadow: 0 0 20px #000;
}

#kv_area .kv_cont .other_wrapp .date_area p .num{
	font-weight: 700;
	letter-spacing: 0.04em;
}

#kv_area .kv_cont .other_wrapp .date_area p small{
	font-size: 30px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp01{
	display: inline-block;
	font-size: 30px;
	font-weight: 700;
	margin-left: -0.5em;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp02{
	display: block;
	font-size: 30px;
	font-weight: 700;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp03{
	font-size: 33px;
	font-weight: 700;
}


#kv_area .kv_cont .other_wrapp .reservation_btn{
	width: 316px;
	margin: -5px auto 0;
}

#kv_area .kv_cont .other_wrapp .movie_none_btn,
#kv_area .kv_cont .other_wrapp .movie_modal_btn{
	width: 316px;
	margin: 68px auto 0;
	cursor: pointer;
}

#kv_area .kv_cont .other_wrapp .movie_none_btn{
	cursor: unset;
}

#kv_area .menu_area{
	width: 318px;
    position: absolute;
    bottom: 40px;
    right: 5px;
	z-index: 2;
}

#kv_area .menu_area .x_banner{
	width: 278px;
	margin: 0 auto 21px;
}

#kv_area .menu_area .menu_ul{
	width: 183px;
	margin: 0 auto;
}

#kv_area .menu_area .menu_ul li{
	margin-bottom: 8px;
}

#kv_area .menu_area .menu_ul li:last-child{
	margin-bottom: 0;
}

#kv_area .menu_area .menu_ul li a{
	display: block;
	padding-left: 18px;
	color: #fff;
	position: relative;
}

#kv_area .menu_area .menu_ul li a::before{
	content: '';
	display: block;
	width: 10px;
	height: 18px;
	background-repeat: repeat-x;
	background-position: 0 0;
	background-size: contain;
	background-image: url(../images/common/icon_arrow_main_sp.png);
	position: absolute;
	top: 6px;
	left: 0;
}

#kv_area .menu_area .menu_ul li a .en_text{
	display: block;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
	margin-bottom: -6px;
	white-space: nowrap;
}

#kv_area .menu_area .menu_ul li a .jp_text{
	display: block;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
}

.modal_cont{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0, 0, 0, 0.50);
	backdrop-filter: blur(10px);
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	line-height: 1;
	transition: all 0.2s linear;
}

.modal_cont.active{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
  	overflow: auto;
}

.modal_cont .modal_inner{
	width: 1089px;
	margin: 0 auto;
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translate(-50%, 0);
}

.modal_cont .modal_inner .modal_close{
    width: 48px;
    position: absolute;
    top: -48px;
    right: 0;
	cursor: pointer;
}

.modal_cont .modal_inner .movie_data{
	width: 100%;
	aspect-ratio: 16 / 9;
	margin-bottom: 32px;
}

.modal_cont .modal_inner #youtube-player{
	width: 100%;
	height: 100%;
}

.modal_cont .modal_inner .movie_thumbnail{
  display: flex;
  justify-content: space-between;
}

.modal_cont .modal_inner .movie_thumbnail li{
	width: 31.8%;
	aspect-ratio: 16 / 9;
	background-size: cover;
	background-position: center;
	cursor: pointer;
	opacity: 1;
	border: 1px solid #B39D50;
	transition: opacity .2s;
	position: relative;
}

.modal_cont .modal_inner .movie_thumbnail li.active{
	opacity: 1;
}

.modal_cont .modal_inner .movie_thumbnail li.active::before{
	content: 'PLAY NOW';
	display: flex;
	justify-content: center;
    align-items: center;
	width: 100%;
	height: 100%;
	background: rgba(158,135,57,0.85);
	font-size: 40px;
	color: #fff;
	font-weight: 700;
	font-family: "Cinzel", serif;
    position: absolute;
    top: 0;
    left: 0;
}


/* 共通アニメーション対象 */
.p1,
.p2,
.p3,
.p4,
.p5,
.p6,
.p7 {
	opacity: 0;
	transform: translateY(20px);
	transition:
		opacity 1.2s ease,
		transform 1.2s ease;
}

/* 表示状態 */
.p1.is-show,
.p2.is-show,
.p3.is-show,
.p4.is-show,
.p5.is-show,
.p6.is-show,
.p7.is-show {
	opacity: 1;
	transform: translateY(0);
}



#news{
	position: relative;
	z-index: 10;
}

#news .list_wrapp{
	width: 1090px;
	margin: 0 auto;
	padding: 16px;
	background: rgba(0, 0, 0, 0.80);
	box-sizing: border-box;
	position: relative;
}

#news .list_wrapp .media_list{
	height: 155px;
	padding: 0 24px 0 48px;
	overflow: auto;
}

#news .list_wrapp .media_list li{
	padding: 8px 0;
	color: #fff;
	display: flex;
	align-items: flex-start
}

#news .list_wrapp .media_list li .list_head{
	width: 217px;
	display: flex;
	align-items: center;
}

#news .list_wrapp .media_list li .list_head .date{
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
	margin-right: 8px;
}

#news .list_wrapp .media_list li .list_head .icon{
	height: 23px;
	position: relative;
}

#news .list_wrapp .media_list li .list_head .icon::after{
	content: '';
	display: inline-block;
	width: 82px;
	height: 23px;
	line-height: 26px;
	background: #ccc;
	font-size: 12px;
	font-weight:400;
	font-family: "Cinzel", serif;
	color: #fff;
	text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    white-space: nowrap;
}

#news .list_wrapp .media_list li .list_head .icon.important::after{
	content: '重要';
	background: #6B152A;
}

#news .list_wrapp .media_list li .list_head .icon.notice::after{
	content: 'お知らせ';
	background: #6B5615;
}

#news .list_wrapp .media_list li .list_head .icon.event::after{
	content: 'イベント';
	background: #2B6B15;
}

#news .list_wrapp .media_list li .list_head .icon.campaign::after{
	content: 'キャンペーン';
	background: #152B6B;
}

#news .list_wrapp .media_list li .list_head .icon.game::after{
	content: 'ゲーム';
	background: #56156B;
}

#news .list_wrapp .media_list li .list_head .icon.media::after{
	content: 'メディア掲載';
	background: #4D4D4D;
}

#news .list_wrapp .media_list li .list_cont{
	width: calc(100% - 217px);
}

#news .list_wrapp .media_list li .list_cont a,
#news .list_wrapp .media_list li .list_cont p{
	font-size: 14px;
	font-weight: 500;
	color: #fff;
}



#banner_area{
	height: 158px;
	margin-bottom: 40px;
	overflow: hidden;
	position: relative;
	z-index: 20;
}

#banner_area ul{
	width: 1599px;
	margin: 0 auto;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
}

#banner_area ul li{
	padding: 0 12px;

}

#banner_area .slick-prev,
#banner_area .slick-next {
    width: 44px;
    height: 44px;
	z-index: 10;
}

#banner_area .slick-prev {
    left: 500px;
}

#banner_area .slick-next {
    right: 500px;
}

#banner_area .slick-prev:before,
#banner_area .slick-next:before {
	content: '';
	display: inline-block;
    opacity: 1;
	width: 44px;
	height: 44px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/common/icon_slider_arrow.png');
}

#banner_area .slick-next:before {
	transform: scale(-1,1);
}



#intro{
	position: relative;
	margin-top: -2.777778vw;
	z-index: 22;
	overflow: hidden;
}

#intro::after,
#intro::before{
	content: '';
	display: block;
	width: 100%;
	height: 16.319444vw;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: cover;
	background-image: url('../images/top/intro_line_top.png');
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
}

#intro::after{
	transform: scale(1, -1);
	top: unset;
	bottom: 0;
}

#intro .bg_image{
	position: relative;
	height: 1585px;
}

#intro .bg_image img{
    max-width: unset;
	width: 100%;
    height: 100%;
}

#intro .bg_image::after{
	content: '';
	display: block;
	width: 577px;
	height: 1055px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/intro_symbol.webp');
	position: absolute;
	top: 300px;
	left: 0;
}

#intro .intro_cont{
	width: 1440px;
	position: absolute;
    top: 280px;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 10;
}

#intro .intro_cont .h2_wrapp{
	width: 1085px;
	padding: 40px 0;
	margin: 0 auto 40px;
	position: relative;
	text-align: center;
}

#intro .intro_cont .h2_wrapp .icon{
	width: 57px;
	position: absolute;
}

#intro .intro_cont .h2_wrapp .icon.p01{
	top: 0;
	left: 0;
}

#intro .intro_cont .h2_wrapp .icon.p02{
	top: 0;
	right: 0;
	transform: scale(-1, 1);
}

#intro .intro_cont .h2_wrapp .icon.p03{
	bottom: 0;
	left: 0;
	transform: scale(1, -1);
}

#intro .intro_cont .h2_wrapp .icon.p04{
	bottom: 0;
	right: 0;
	transform: scale(-1, -1);
}

#intro .intro_cont .h2_wrapp h2{

}

#intro .intro_cont .h2_wrapp h2 small{
	font-size: 72px;
	font-weight: 700;
	line-height: 1.1;
	background: linear-gradient(180deg, #B39500 0%, #955C00 50%, #4E261E 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	position: relative;
}

#intro .intro_cont .h2_wrapp h2 small::after{
	content: attr(data-text);
	position: absolute;
    top: 14px;
    left: 0;
	color: transparent;
	text-shadow: 0 -4px 4px rgba(255, 255, 255, 0.25), 0 2px 2px rgba(0, 0, 0, 0.35);
	z-index: -1;
}

#intro .intro_cont .h2_wrapp h2 strong{
	/*font-size: 120px;*/
	font-size: 70px;
	font-weight: 700;
	line-height: 1.1;
	background: linear-gradient(180deg, #955C00 0%, #4E261E 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	position: relative;
}

#intro .intro_cont .h2_wrapp h2 strong::after{
	content: attr(data-text);
	position: absolute;
    /*top: 20px;*/
    top: 13px;
    left: 0;
	color: transparent;
	text-shadow: 0 -4px 4px rgba(255, 255, 255, 0.25), 0 2px 2px rgba(0, 0, 0, 0.35);
	z-index: -1;
}

#intro .intro_cont .h2_wrapp h2 strong:first-of-type{
	margin-right: -40px;
}

#intro .intro_cont .cont_data{
	width: 100%;
	display: flex;
	justify-content: flex-end;
	position: relative;
}

#intro .intro_cont .cont_data .caption_block{
	width: 646px;
    position: absolute;
    top: 40px;
	left: 175px;
	z-index: 4;
}

#intro .intro_cont .cont_data .caption_block p{
	font-size: 18px;
	font-weight: 700;
	line-height: 2.0;
	color: var(--text2);
	margin-bottom: 1em;
}

#intro .intro_cont .cont_data .caption_block p:last-of-type{
	margin-bottom: 0;
}

#intro .intro_cont .cont_data .movie_block{
	width: 960px;
	padding-bottom: 134px;
}

#intro .intro_cont .cont_data .movie_block .video_wrapp{
	width: 960px;
	height: 532px;
	position: relative;
	overflow: hidden;

  mask-image: url('../images/top/movie_mask_pc.png');
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

#intro .intro_cont .cont_data .movie_block .video_wrapp video{
	width: 100%;
	height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#intro .intro_cont .cont_data .movie_block .note{
	font-size: 12px;
	font-weight: 700;
	color: var(--text2);
	text-align: right;
	margin-top: 8px;
	padding-right: 64px;
}


#intro .intro_cont .cont_data .intro_whats{
    position: absolute;
    top: 392px;
	left: 175px;
	z-index: 4;
	width: 646px;
	background: linear-gradient(90deg, #000 0%, #3D2C03 100%);
	padding: 32px 48px;
	box-sizing: border-box;
}

#intro .intro_cont .cont_data .intro_whats::after,
#intro .intro_cont .cont_data .intro_whats::before{
	content: '';
	display: block;
	width: 120px;
	height: 120px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/intro_whats_point.png');
	position: absolute;
	top: 8px;
	left: 8px;
}

#intro .intro_cont .cont_data .intro_whats::after{
	top: unset;
	left: unset;
	bottom: 8px;
	right: 8px;
	transform: scale(-1, -1);
}

#intro .intro_cont .cont_data .intro_whats .card_image{
	width: 122px;
    position: absolute;
    top: -50px;
    right: 14px;
}

#intro .intro_cont .cont_data .intro_whats .catch{
	font-size: 24px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--text_w);
	margin-bottom: 16px;
	border-bottom: 1px solid #B39D50;
}

#intro .intro_cont .cont_data .intro_whats .caption{
	font-size: 14px;
	font-weight: 500;
	color: var(--text_w);
}



.bg_wrapp01{
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 100%;
	background-attachment: fixed;
	background-image: url('../images/common/body_bg02.webp');
	position: relative;
	padding: 16.666667vw 0 0;
	margin-top: -18.055556vw;
	overflow: hidden;
}

.webp .bg_wrapp01{
	background-image: url('../images/common/body_bg02.webp');
}

.bg_wrapp01 .bg_block01{
	position: relative;
}

.bg_wrapp01 .bg_block01::after{
	content: '';
	display: inline-block;
	width: 100%;
	height: 12.430556vw;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/products_line.png');
	position: absolute;
	bottom: -16.319444vw;
	left: 0;
	z-index: 10;
}


.header_title_top {
  position: relative;
}

.header_title_top img {
  display: inline-block;
  transition: opacity 2.6s ease;
}

/* 初期状態 */
.header_title_top .title_before {
  opacity: 1;
  width: auto;
  height: 112px;
}
.header_title_top .title_after {
  width: auto;
  height: 112px;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}

/* 切り替え後 */
.header_title_top.is-change .title_before {
	opacity: 0;
}
.header_title_top.is-change .title_after {
	opacity: 1;
}

.header_title_top strong{
	display: inline-block;
	font-size: 32px;
	font-weight: 700;
	color: var(--color1);
	line-height: 1.5;
	margin: -4px 0 0 65px;
	opacity: 0;
	transition: opacity 0.6s ease;
}

.header_title_top.is-change strong {
	opacity: 1;
	transition-delay: 0.4s;
}


#story{

}

#story .cont_wrapp{
	width: 1230px;
	margin: 0 auto 198px;
}

#story .header_title_top strong {
    margin: 0;
 	position: absolute;
	top: 92px;
	left: 64px;
	z-index: 4;
}

#story .story_cont_data{
	width: 1020px;
	margin: 80px auto 0;
	position: relative;
	z-index: 3;
}

#story .story_cont_data .catch{
	font-size: 40px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--text_w);
	letter-spacing: -0.02em;
	margin-bottom: 40px;
	position: relative;
}

#story .story_cont_data .catch strong{
	font-weight: 700;
	color: var(--color1);
	text-shadow: 0 0 20px #000;
}

#story .story_cont_data .caption{
	margin-bottom: 40px;
    position: relative;
    z-index: 2;
}

#story .story_cont_data .caption p{
	font-size: 18px;
	font-weight: 700;
	line-height: 2.0;
	color: var(--text3);
	margin-bottom: 1em;
}

#story .story_cont_data .caption p:last-of-type{
	margin-bottom: 0;
}

#story .story_cont_data .link_btn{
	width: 260px;
}

#story .story_cont_data .story_image01{
	width: 640px;
	position: absolute;
	top: -103px;
	left: 528px;
}

#story .story_cont_data .story_image02{
	width: 394px;
	position: absolute;
	top: 253px;
	left: 541px;
}



#world{

}

#world .cont_wrapp{
	width: 1312px;
	margin: -14px auto 207px;
	position: relative;
}


#world .header_title_top{
	width: 527px;
	position: absolute;
	top: 28px;
	left: 0;
}

#world .header_title_top strong {
    margin: 0;
 	position: absolute;
	top: 92px;
	left: 64px;
}


#world .world_cont_data{

}

#world .world_cont_data .main_map{
	width: 896px;
}

#world .world_cont_data .sub_image01{
	width: 522px;
	position: absolute;
	top: 92px;
	right: 0;
}

#world .world_cont_data .sub_image02{
	width: 515px;
	position: absolute;
	top: 404px;
	right: 173px;
}

#world .world_cont_data .caption_box{
	width: 535px;
	padding: 40px 56px;
	background: linear-gradient(270deg, rgba(38, 23, 0, 0.00) 0%, #261700 50%, #261700 100%);
	box-sizing: border-box;
	position: absolute;
	top: 451px;
	left: 0;
}

#world .world_cont_data .caption_box p{
	font-size: 16px;
	font-weight: 700;
	color: var(--text3);
	margin-bottom: 32px;
}

#world .world_cont_data .caption_box .link_btn{
	width: 260px;
}



#characters{
	margin-bottom: 160px;
}

#characters .characters_cont_data{
	width: 1240px;
	height: 807px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}

#characters .characters_cont_data::before{
    content: '';
    display: inline-block;
    width: 541px;
    height: 541px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/top/chara_bg01.png);
    position: absolute;
    top: 81px;
    left: -43px;
    z-index: -2;
    opacity: 0.5;
}

#characters .characters_cont_data::after {
    content: '';
    display: inline-block;
    width: 480px;
    height: 480px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/top/chara_bg02.png);
    position: absolute;
    top: 141px;
    left: -13px;
    z-index: -1;
    opacity: 0.5;
}

#characters .characters_cont_data h2{
	width: 845px;
	position: absolute;
	top: 40px;
	left: 422px;
}

#characters .header_title_top strong {
    margin: 0 0 0 581px;
}

#characters .characters_cont_data .main_image{
	width: 494px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
}

#characters .characters_cont_data .main_image .image_data{
	position: relative;
}

#characters .characters_cont_data .main_image .image_data::before{
	content: '';
	display: inline-block;
	width: 48px;
	height: 152px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/chara_bg_you.png');
	position: absolute;
    top: 168px;
    left: 127px;
	z-index: -1;
}

#characters .characters_cont_data .chara_image02{
	width: 396px;
	position: absolute;
	top: 198px;
	left: 470px;
	z-index: 2;
}

#characters .characters_cont_data .chara_image03{
	width: 252px;
	position: absolute;
    top: 220px;
    left: 773px;
	z-index: 3;
}

#characters .characters_cont_data .chara_image04{
	width: 284px;
	position: absolute;
    top: 219px;
    left: 917px;
	z-index: 1;
}

#characters .characters_cont_data .caption_box{
	width: 825px;
	padding: 40px 56px;
	background: linear-gradient(270deg, rgba(38, 23, 0, 0.00) 0%, #261700 35%, #261700 65%, rgba(38, 23, 0, 0.00) 100%);
	box-sizing: border-box;
	position: absolute;
	top: 556px;
	left: 459px;
	z-index: 5;
}

#characters .characters_cont_data .caption_box p{
	font-size: 16px;
	font-weight: 700;
	color: var(--text3);
	text-align: center;
	margin-bottom: 32px;
}

#characters .characters_cont_data .caption_box .link_btn{
	width: 260px;
	margin: 0 auto;
}



#system{
	margin-bottom: 240px;
}

#system .cont_wrapp{
	width: 1440px;
	margin: 0 auto;
	padding-left: 65px;
	box-sizing: border-box;
}

#system .cont_wrapp h2{
	width: 540px;
	margin-bottom: 24px;
}

#system .header_title_top .title_before {
    height: 200px;
}

#system .header_title_top .title_after {
    height: 200px;
}

#system .header_title_top strong {
    margin-top: -14px;
}

#system  .system_cont_data{
	position: relative;
}

#system  .system_cont_data .image_wrapper{
	width: 816px;
	position: absolute;
	top: -140px;
	right: 0;
}

#system  .system_cont_data .image_wrapper .video{
	width: 816px;
	height: 456px;
	position: relative;
	border: 1px solid var(--color2);
	box-shadow: 0 4.594px 18.374px 0 rgba(0, 0, 0, 0.50);
}

#system  .system_cont_data .image_wrapper .video::after,
#system  .system_cont_data .image_wrapper .video::before{
	content: '';
	display: inline-block;
	width: 417px;
	height: 45px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/gamesystem_frame.png');
	position: absolute;
    bottom: -25px;
    left: -111px;
}

#system  .system_cont_data .image_wrapper .video::after{
    bottom: unset;
    left: unset;
    top: -25px;
    right: -111px;
    transform: scale(-1, -1);
}

#system  .system_cont_data .image_wrapper .video video {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

#system  .system_cont_data .image_wrapper .note{
	font-size: 12px;
	font-weight: 700;
	color: var(--text_w);
	text-align: right;
	padding-right: 16px;
}

#system  .system_cont_data .caption_box{
	width: 540px;
	padding: 40px 56px;
	background: linear-gradient(270deg, rgba(38, 23, 0, 0.00) 0%, #261700 35%, #261700 65%, rgba(38, 23, 0, 0.00) 100%);
	box-sizing: border-box;
}

#system  .system_cont_data .caption_box p{
	font-size: 16px;
	font-weight: 700;
	color: var(--text3);
	text-align: center;
	margin-bottom: 32px;
}

#system  .system_cont_data .caption_box .link_btn{
	width: 260px;
	margin: 0 auto;
}



#card{
	position: relative;
	z-index: 2;
}

#card::before{
	content: '';
	display: inline-block;
	width: 419px;
	height: 637px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/card_bgitem01.png');
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}

#card::after{
	content: '';
	display: inline-block;
	width: 400px;
	height: 605px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/card_bgitem02.png');
	position: absolute;
	top: 0;
	right: 0;
	z-index: -1;
}

#card .cont_wrapp{
	text-align: center;
}

#card .cont_wrapp h2{
	margin-bottom: 16px;
	text-align: center;
}

#card .header_title_top .title_before {
    height: 114px;
}

#card .header_title_top .title_after {
    height: 90px;
    left: 50%;
	transform: translate(-50%, 0);
}

#card .header_title_top strong {
    display: block;
    margin: -40px 0 0;
}

#card .caption_box{
	width: 592px;
	padding: 40px 0;
	margin: 0 auto;
	background: linear-gradient(270deg, rgba(38, 23, 0, 0.00) 0%, #261700 35%, #261700 65%, rgba(38, 23, 0, 0.00) 100%);
	box-sizing: border-box;
}

#card .caption_box p{
    font-size: 16px;
    font-weight: 700;
    color: var(--text3);
    text-align: center;
    margin-bottom: 32px;
}

#card .caption_box .link_btn {
    width: 260px;
    margin: 0 auto;
	position: relative;
    z-index: 20;
}

#card .card_slider_wrapp {
  width: 1340px;
  height: 726px;
  margin: -80px auto 0;
  overflow: hidden;
  position: relative;
}

#card .card_slider_wrapp::before{
	content: '';
	display: inline-block;
	width: 1282px;
	height: 568px;
	border-radius: 1218px;
	background: radial-gradient(50% 50% at 50% 50%, rgba(196, 162, 62, 0.50) 38.72%, rgba(196, 162, 62, 0.00) 100%);
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.card_swiper {
  overflow: visible;
}

.card_swiper .swiper-wrapper {
  align-items: center;
}

.card_swiper .swiper-slide {
  transition: transform 0.4s ease, opacity 0.4s ease;
  transform: scale(1) translate(0,0);
  opacity: 1;
  z-index: 1;
  position: relative;
}

/* 中央 */
.card_swiper .swiper-slide-active {
  transform: scale(1.78) translateY(150px);
  z-index: 5;
}

/* 左右 */
.card_swiper .swiper-slide-prev {
  transform: scale(1.5) translate(-23px, 120px);
  z-index: 4;
}

.card_swiper .swiper-slide-next {
  transform: scale(1.55) translate(23px, 120px);
  z-index: 4;
}

/* 左右2 */
.card_swiper .swiper-slide-prev-prev {
  transform: scale(1.25) translate(-32px, 80px);
  z-index: 3;
}

.card_swiper .swiper-slide-next-next {
  transform: scale(1.25) translate(32px, 80px);
  z-index: 3;
}


#card .staff_link{
	width: 547px;
	margin: 30px auto 0;
}

#card .staff_link a{
	display: block;
	width: 100%;
	height: 132px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/staff_link_bg.webp');
	position: relative;
	color: var(--color1);
}

#card .staff_link a strong{
	font-size: 28px;
	font-weight: 700;
	line-height: 1.5;
	text-shadow: 0 0 3.91px #000;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
    white-space: nowrap;
}


#products{
clip-path: polygon(0 17.777778vw, 100% 0, 100% 100%, 0% 100%);
	position: relative;
	margin-top: 14px;
	padding-top: 300px;
	z-index: 3;
}

#products::before{
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    background: linear-gradient(180deg,rgba(5, 4, 4, 0.5) 57%, rgba(5, 4, 4, 0.3) 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#products::after{
	content: '';
	display: inline-block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top 0 left 0;
	background-size: 100% 100%;
	background-image: url('../images/top/products_bg.webp');
	background-attachment: fixed;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
}


#products > .cont_wrapp{
	padding: 0 0 160px;
	position: relative;
	z-index: 2;
}



#products .cont_wrapp h2{
    margin-bottom: 37px;
    text-align: center;
	position: relative;
	z-index: 2;
}

#products .cont_wrapp h2::before{
	content: '';
	display: inline-block;
	width: 872px;
	height: 192px;
	background: rgba(0, 0, 0, 0.40);
	filter: blur(50px);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: -2;
}

#products .header_title_top .title_before {
    height: 114px;
}

#products .header_title_top .title_after {
    height: 112px;
    left: 50%;
    transform: translate(-50%, 0);
}

#products .header_title_top strong {
    display: block;
    margin: -22px 0 0;
}


#products .data_wrapp{
	width: 1314px;
	margin: 0 auto 51px;
	padding: 40px 0 50px;
	box-sizing: border-box;
	background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat-x, repeat-x, repeat-y, repeat-y, no-repeat;
	background-position: left 16px top 16px, right 16px top 16px, left 16px bottom 16px, right 16px bottom 16px, left 0 top 0, left 0 bottom 0, left 0 top 0, bottom 0 left 0, 0 0;
	background-size: 56px auto, 56px auto, 56px auto, 56px auto, 2px auto, 2px auto, auto 2px, auto 2px, cover;
	background-image: url('../images/top/products_cont_point_tl.png'), url('../images/top/products_cont_point_tr.png'), url('../images/top/products_cont_point_bl.png'), url('../images/top/products_cont_point_br.png'), url('../images/top/products_cont_frame_wt.png'), url('../images/top/products_cont_frame_wb.png'), url('../images/top/products_cont_frame_hl.png'), url('../images/top/products_cont_frame_hr.png'), url('../images/top/products_cont_bg.webp');
	position: relative;
    z-index: 2;
}

#products .data_wrapp:last-of-type{
	margin-bottom: 0;
}


#products #download.data_wrapp{
	scroll-margin-top: calc(var(--header-h, 100px) - 60px);
}

#products .data_wrapp h3{
	font-size: 40px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--text2);
	text-align: center;
	margin-bottom: 40px;
}

#products .data_wrapp h3.type1{
	margin-bottom: 0;
}

#products .data_wrapp .sub_caption{
	text-align: center;
	margin-bottom: 40px;
}

#products .data_wrapp .sub_caption strong{
	display: inline-block;
	font-size: 28px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: -0.02em;
	background: var(--text-title-gradation_02, linear-gradient(180deg, #955C00 0%, #4E261E 100%));
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	position: relative;
}

#products .data_wrapp .sub_caption strong::after,
#products .data_wrapp .sub_caption strong::before{
	content: '';
	display: inline-block;
	width: 63px;
	height: 2px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/products_sub_line.png');
    position: absolute;
    top: 50%;
    left: -79px;
}

#products .data_wrapp .sub_caption strong::after{
    left: unset;
    right: -79px;
    transform: scale(-1, 1);
}




#products .tabs {

}

#products .tabs__nav {
	width: 1090px;
	margin: 0 auto 56px;
	display: flex;
	justify-content: space-between;
}

#products .tabs__tab {
	width: 533px;
	height: 78px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/tab_bg_off.png');
    cursor: pointer;
	position: relative;
	transition: all 0.2s ease;
}

#products .tabs__tab.is-active {
	background-image: url('../images/top/tab_bg_on.png');
}

#products .tabs__tab strong{
	font-size: 24px;
	font-weight: 700;
	color: var(--color2);
	line-height: 1.5;
	padding-left: 28px;
	position: absolute;
	top: 41%;
	left: 50%;
	transform: translate(-50%, -50%);
    white-space: nowrap;
}

#products .tabs__tab.is-active strong{
	color: var(--text2);
}

#products .tabs__tab strong::before{
	content: '';
	display: inline-block;
	width: 22px;
	height: 22px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/icon_tab_off.png');
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
}

#products .tabs__tab.is-active strong::before{
	background-image: url('../images/top/icon_tab_on.png');
}

#products .tabs__nav.is-fading .tabs__tab {

	transform: translateY(0);
}

#products .tabs__panel {
	width: 1062px;
	margin: 0 auto;
}

#products .tabs__panel.is-fade-out {
  opacity: 0;
  transform: translateY(0);
  transition: all 0.6s ease;
}

#products .tabs__panel.is-fade-in {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.6s ease;
}

#products .tabs__panel .cont_flex{
	display: flex;
	justify-content: space-between;
	margin-bottom: 40px;
}

#products .tabs__panel .cont_flex .image_box{
	width: 501px;
}

#products .tabs__panel .cont_flex .image_box .image_wrapp{
	width: 100%;
	padding: 16px;
	box-sizing: border-box;
	position: relative;
	cursor: pointer;
}

#products .tabs__panel .cont_flex .image_box .image_wrapp::after,
#products .tabs__panel .cont_flex .image_box .image_wrapp::before{
	content: '';
	display: inline-block;
	width: 282px;
	height: 221px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/products_frame01.png');
	position: absolute;
	top: 0;
	left: 0;
}


#products .tabs__panel .cont_flex .image_box .image_wrapp::after{
	top: unset;
	left: unset;
	bottom: 0;
	right: 0;
	transform: scale(-1, -1);
}

#products .tabs__panel .cont_flex .image_box .image_wrapp .frame{
	width: 469px;
	height: 314px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/package_image01_frame.png');
	position: absolute;
	top: 16px;
	left: 16px;
}

#products .tabs__panel .cont_flex .image_box .note{
	font-size: 12px;
	color: #2B2A1E;
	font-weight: 700;
	margin-top: 16px;
}

#products .tabs__panel .cont_flex .text_box{
	width: 501px;
}

#products .tabs__panel .cont_flex .text_box .title{
	font-size: 24px;
	font-weight: 700;
	color: var(--text2);
	line-height: 1.5;
	padding-bottom: 8px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--color2);
}

#products .tabs__panel .cont_flex .text_box .text_list{
	counter-reset: num_pl01 0;
	margin-bottom: 16px;
}

#products .tabs__panel .cont_flex .text_box .text_list li{
	font-size: 16px;
	font-weight: 700;
	color: var(--text2);
	padding-left: 1.3em;
	position: relative;
}

#products .tabs__panel .cont_flex .text_box .text_list li::before{
	counter-increment: num_pl01 1;
	content: counter(num_pl01) '.';
	position: absolute;
	top: 0;
	left: 0;
}

#products .tabs__panel .cont_flex .text_box .non_list{
	font-size: 16px;
	font-weight: 700;
	color: var(--text2);
	margin-bottom: 16px;
}

#products .tabs__panel .cont_flex .text_box .note{
	font-size: 12px;
	font-weight: 700;
	color: var(--text2);
	padding-left: 1em;
	position: relative;
}

#products .tabs__panel .cont_flex .text_box .note::before{
	content: '※';
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}

#products .tabs__panel .link_btn{
	width: 809px;
	margin: 0 auto;
}


#products .dl_cont_wrapp{
	width: 1005px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    position: relative;
}

#products .dl_cont_wrapp.center{
	justify-content: center;
}

#products .dl_cont_wrapp .dl_content{
	width: 422px;
	margin-bottom: 40px;
    position: relative;
}

#products .dl_cont_wrapp .dl_content:nth-of-type(even)::after{
	content: '';
	display: inline-block;
	width: 1px;
	height: 100%;
	background: #8E897D;
	position: absolute;
	top: 0;
	left: -80px;
}

#products .dl_cont_wrapp .dl_content .logo{
	margin-bottom: 40px;
}

#products .dl_cont_wrapp .dl_content .link_ul li{
	margin: 0 auto 8px;
}

#products .dl_cont_wrapp .dl_content .link_ul li:last-child{
	margin-bottom: 0;
}

#products .dl_cont_wrapp .dl_content.nintendo .link_ul li:nth-child(1){
	width: 258px;
}

#products .dl_cont_wrapp .dl_content.nintendo .link_ul li:nth-child(2){
	width: 359px;
}

#products .dl_cont_wrapp .dl_content.steam .link_ul li:nth-child(1){
	width: 258px;
}


#products .text_box .dl_data{
	width: 465px;
	margin: 0 auto;
}

#products .text_box .dl_data .logo{
	margin-bottom: 40px;
}

#products .text_box .dl_data .link_ul{

}

#products .text_box .dl_data .link_ul li{
	width: 258px;
	margin: 0 auto 8px;
}

#products .text_box .dl_data .link_ul li:last-child{
	width: 359px;
	margin-bottom: 0;
}

.none_click{
	pointer-events: none;
	filter: grayscale(100%) brightness(130%) contrast(70%);
	opacity: 0.7;
}




#products #spec.data_wrapp {
    width: 1306px;
    margin: 0 auto;
    padding: 64px;
    box-sizing: border-box;
    background-color: rgba(0, 0, 0, 0.80);
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat-x, repeat-x, repeat-y, repeat-y;
    background-position: left 16px top 16px, right 16px top 16px, left 16px bottom 16px, right 16px bottom 16px, left 0 top 0, left 0 bottom 0, left 0 top 0, bottom 0 left 0;
    background-size: 56px auto, 56px auto, 56px auto, 56px auto, 2px auto, 2px auto, auto 2px, auto 2px;
    background-image: url(../images/top/products_cont_point_tl.png), url(../images/top/products_cont_point_tr.png), url(../images/top/products_cont_point_bl.png), url(../images/top/products_cont_point_br.png), url(../images/top/products_cont_frame_wt.png), url(../images/top/products_cont_frame_wb.png), url(../images/top/products_cont_frame_hl.png), url(../images/top/products_cont_frame_hr.png);
}

#spec.data_wrapp .spec_cont_wrapp{
	width: auto;
	display: flex;
	justify-content: space-between;
}

#spec.data_wrapp .spec_cont_wrapp .image_box{
	width: 419px;
	padding: 16px;
	position: relative;
}

#spec.data_wrapp .spec_cont_wrapp .image_box::after,
#spec.data_wrapp .spec_cont_wrapp .image_box::before {
    content: '';
    display: inline-block;
    width: 202px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/top/spac_frame.png);
    position: absolute;
    top: 0;
    left: 0;
}

#spec.data_wrapp .spec_cont_wrapp .image_box::after {
    top: unset;
    left: unset;
    bottom: 0;
    right: 0;
    transform: scale(-1, -1);
}

#spec.data_wrapp .spec_cont_wrapp .text_box{
	width: 679px;
	position: relative;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title{
	font-size: 32px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--color1);
	margin-bottom: 20px;
	padding-left: 33px;
	position: relative;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title::before{
    content: '';
    display: inline-block;
    width: 31px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/common/icon_arrow_main.png);
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list{
	margin-bottom: 40px;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li{
	padding: 8px 0;
	font-size: 16px;
	display: flex;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .item{
	width: 167px;
	font-weight: 700;
	color: var(--color1);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .data{
	width: calc(100% - 167px);
	font-weight: 700;
	color: var(--text_w);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license{
	display: flex;
	align-items: center;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .logo{
	width: 149px;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text{
	width: calc(100% - 149px);
	padding-left: 32px;
	box-sizing: border-box;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text p{
	font-size: 12px;
	font-weight: 700;
	color: #fff;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text p a{
	font-weight: 700;
	color: #fff;
	text-decoration: underline;
}


#products #spec.data_wrapp {
    width: 1306px;
    margin: 0 auto;
    padding: 64px;
    box-sizing: border-box;
    background-color: rgba(0, 0, 0, 0.80);
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    background-position: left 16px top 16px, right 16px top 16px, left 16px bottom 16px, right 16px bottom 16px;
    background-size: 56px auto, 56px auto, 56px auto, 56px auto;
    background-image: url(../images/top/products_cont_point_tl.png), url(../images/top/products_cont_point_tr.png), url(../images/top/products_cont_point_bl.png), url(../images/top/products_cont_point_br.png);
}

#spec.data_wrapp .spec_cont_wrapp{
	width: auto;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

#spec.data_wrapp .spec_cont_wrapp .image_box{
	width: 419px;
	padding: 16px;
	position: relative;
}

#spec.data_wrapp .spec_cont_wrapp .image_box::after,
#spec.data_wrapp .spec_cont_wrapp .image_box::before {
    content: '';
    display: inline-block;
    width: 202px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/top/spac_frame.png);
    position: absolute;
    top: 0;
    left: 0;
}

#spec.data_wrapp .spec_cont_wrapp .image_box::after {
    top: unset;
    left: unset;
    bottom: 0;
    right: 0;
    transform: scale(-1, -1);
}

#spec.data_wrapp .spec_cont_wrapp .text_box{
	width: 679px;
	position: relative;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title{
	font-size: 32px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--color1);
	margin-bottom: 20px;
	padding-left: 33px;
	position: relative;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title::before{
    content: '';
    display: inline-block;
    width: 31px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/common/icon_arrow_main.png);
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list{
	margin-bottom: 40px;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li{
	padding: 8px 0;
	font-size: 16px;
	display: flex;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .item{
	width: 167px;
	font-weight: 700;
	color: var(--color1);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .data{
	width: calc(100% - 167px);
	font-weight: 700;
	color: var(--text_w);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license{
	display: flex;
	align-items: center;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .logo{
	width: 149px;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text{
	width: calc(100% - 149px);
	padding-left: 32px;
	box-sizing: border-box;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text p{
	font-size: 12px;
	font-weight: 700;
	color: #fff;
}



#bottom_banner_area{
	background: #000;
	padding: 40px 0 193px;
	position: relative;
    z-index: 10;
}

#bottom_banner_area .cont_link_ul{
	display: flex;
	justify-content: center;
    align-items: center;
    margin-bottom: 40px;
}

#bottom_banner_area .cont_link_ul li{
	width: 260px;
	margin: 0 20px;
}

#bottom_banner_area .banner_area{
	width: 860px;
	margin: 0 auto;
}

#bottom_banner_area .banner_area a{
	display: block;
	line-height: 1;
	height: 100%;
	position: relative;
}

#bottom_banner_area .banner_area a::after{
	content: '';
	display: block;
	width: 100%;
	height: 100%;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 100% 100%;
    background-image: url(../images/top/bottom_banner_frame.png);
    position: absolute;
    top: 0;
    left: 0;
}



.download_btn_area{

}

.download_btn_area .download_btn_block{
	margin-bottom: 24px;
}

.download_btn_area .download_btn_block:last-of-type{
	margin-bottom: 0;
}

.download_btn_area .download_btn_block .name{
	text-align : center;
	margin-bottom: 10px;
}

.download_btn_area .download_btn_block .name strong{
	font-size: 20px;
	color: #2B2A1E;
	font-weight: 700;
	line-height: 1.2;
	position: relative;
}

.download_btn_area .download_btn_block .name strong::after,
.download_btn_area .download_btn_block .name strong::before{
	content: '';
	display: inline-block;
	width: 75px;
	height: 2px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/top/line_decoration.png');
    position: absolute;
    top: 50%;
    left: -85px;
}

.download_btn_area .download_btn_block .name strong::after{
	left: unset;
	right: -85px;
	transform: scale(-1, 1);
}

.download_btn_area .download_btn_block .btn_ul{
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.download_btn_area .download_btn_block .btn_ul li{
	width: 240px;
}



.image_modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease;
}

.image_modal.active {
  opacity: 1;
  visibility: visible;
}

.image_modal_bg {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.7);
}

.image_modal_inner {
	max-width: 80vw;
	width: 60%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.image_modal_cont img {
	max-width: unset;
	width: 100%;
	height: auto;
}

.image_modal_close {
  position: absolute;
  top: 24px;
  right: 24px;
}

.image_modal_close .icon{
	width: 45px;
	height: 45px;
	background: url('../images/character/close icon.png') no-repeat 0 0 / contain;
}

.image_modal_close p{
    font-size: 14px;
    font-weight: 700;
    color: var(--text_w);
    line-height: 1.4;
    white-space: nowrap;
}






/********************************************************************************
	リッキド用 CSS
********************************************************************************/

@media(max-width:1440px){




#sound-permission {

}

#sound-permission .sound-box p{
	font-size: 1.111111vw;
	margin-bottom: 2.777778vw;
}

#sound-permission .sound-box ul{
	width: 11.805556vw;
}

#sound-permission .sound-box ul li{
	margin-bottom: 1.111111vw;
}

#sound-permission .sound-box ul li .flex::after,
#sound-permission .sound-box ul li .flex::before{
	width: 0.694444vw;
	height: 1.25vw;
}

#sound-permission .sound-box ul li .flex .icon{
	width: 3.055556vw;
	height: 3.055556vw;
}

#sound-permission .sound-box ul li .flex .icon::before{
	width: 3.055556vw;
	height: 3.055556vw;
}

#sound-permission .sound-box ul li .flex .text{
	width: 3.75vw;
	font-size: 1.666667vw;
	margin-left: 0.555556vw;
}

#kv_area{
    height: 56.25vw;
    margin-bottom: 2.777778vw;
}

#kv_area::after {
    top: 55.416667vw;
}

#kv_area video{
}

#kv_area .kv_wrapp{
	/*width: 100%;*/
}

#kv_area .kv_cont .logo_catch{
	width: 27.638889vw;
	top: 10.625000vw;
	left: 6.25vw;
}

#kv_area .kv_cont{
	width: 49.305556vw;
    height: 106.944444vw;
    padding: 6.111111vw 11.944444vw 0 2.777778vw;
}

#kv_area .logo_jp{
	font-size: 1.111111vw;
	text-shadow: 0 0 0.305556vw #000;
	top: 20.347222vw;
	left: 9.027778vw;
}

#kv_area .kv_cont .other_wrapp{
	width: 34.583333vw;
	top: 26.875vw;
	left: 2.569444vw;
}

#kv_area .kv_cont .other_wrapp .date_area{
	margin-bottom: -0.694444vw;
}

#kv_area .kv_cont .other_wrapp .date_area p{
	font-size: 3.333333vw;
	text-shadow: 0 0 1.388889vw #000;
}

#kv_area .kv_cont .other_wrapp .date_area p small{
	font-size: 2.083333vw;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp01{
	font-size: 2.083333vw;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp02{
	font-size: 2.083333vw;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp03{
	font-size: 2.291667vw;
}

#kv_area .kv_cont .other_wrapp .reservation_btn {
    width: 21.944444vw;
    margin: -0.347222vw auto 0;
}

#kv_area .kv_cont .other_wrapp .movie_none_btn,
#kv_area .kv_cont .other_wrapp .movie_modal_btn{
	width: 21.944444vw;
	margin: 4.722222vw auto 0;
}

#kv_area .menu_area{
	width: 22.083333vw;
    bottom: 2.777778vw;
    right: 0.347222vw;
}

#kv_area .menu_area .x_banner{
	width: 19.305556vw;
	margin: 0 auto 1.458333vw;
}

#kv_area .menu_area .menu_ul{
	width: 12.708333vw;
}

#kv_area .menu_area .menu_ul li{
	margin-bottom: 0.555556vw;
}

#kv_area .menu_area .menu_ul li a{
	padding-left: 1.25vw;
}

#kv_area .menu_area .menu_ul li a::before{
	width: 0.694444vw;
	height: 1.25vw;
	top: 0.416667vw;
}

#kv_area .menu_area .menu_ul li a .en_text{
	font-size: 1.666667vw;
	margin-bottom: -0.416667vw;
}

#kv_area .menu_area .menu_ul li a .jp_text{
	font-size: 0.833333vw;
}

.modal_cont .modal_inner{
	width: 75.625vw;
}

.modal_cont .modal_inner{
	width: 75.625vw;
    top: 4.166667vw;
}

.modal_cont .modal_inner .modal_close{
    width: 3.333333vw;
    top: -3.333333vw;
}

.modal_cont .modal_inner .movie_data{
	margin-bottom: 2.222222vw;
}

.modal_cont .modal_inner .movie_thumbnail{

}

.modal_cont .modal_inner .movie_thumbnail li.active::before{
	font-size: 2.777778vw;
}



#news{

}

#news::before {
	height: 34.722222vw;
	top: -2.083333vw;
}

#news .list_wrapp{
	width: 75.694444vw;
	margin: 0 auto;
	padding: 1.111111vw;
}

#news .list_wrapp .media_list{
	height: 10.763889vw;
	padding: 0 1.666667vw 0 3.333333vw;
}

#news .list_wrapp .media_list li{
	padding: 0.555556vw 0;
}

#news .list_wrapp .media_list li .list_head{
	width: 15.069444vw;
}

#news .list_wrapp .media_list li .list_head .date{
	font-size: 1.111111vw;
	margin-right: 0.555556vw;
}

#news .list_wrapp .media_list li .list_head .icon{
	height: 1.597222vw;
}

#news .list_wrapp .media_list li .list_head .icon::after{
	width: 5.694444vw;
	height: 1.597222vw;
	line-height: 1.805556vw;
	font-size: 0.833333vw;
}

#news .list_wrapp .media_list li .list_cont{
	width: calc(100% - 15.069444vw);
}

#news .list_wrapp .media_list li .list_cont a,
#news .list_wrapp .media_list li .list_cont p{
	font-size: 0.972222vw;
}



#banner_area{
	height: 10.972222vw;
	margin-bottom: 2.777778vw;
}

#banner_area ul{
	width: 111.041667vw;
}

#banner_area ul li{
	padding: 0 0.833333vw;

}

#banner_area .slick-prev,
#banner_area .slick-next {
    width: 3.055556vw;
    height: 3.055556vw;
}

#banner_area .slick-prev {
    left: 34.722222vw;
}

#banner_area .slick-next {
    right: 34.722222vw;
}

#banner_area .slick-prev:before,
#banner_area .slick-next:before {
	width: 3.055556vw;
	height: 3.055556vw;
}



#intro{
	/*margin-top: -18.75vw;*/
}

#intro::after,
#intro::before{

}

#intro .bg_image{
	height: 110.069444vw;
}

#intro .bg_image::after{
	width: 40.069444vw;
	height: 73.263889vw;
	top: 20.833333vw;
}

#intro .intro_cont{
	width: 100%;
	top: 19.444444vw;
}

#intro .intro_cont .h2_wrapp{
	width: 75.347222vw;
	padding: 2.777778vw 0;
	margin: 0 auto 2.777778vw;
}

#intro .intro_cont .h2_wrapp .icon{
	width: 3.958333vw;
}

#intro .intro_cont .h2_wrapp h2 small{
	font-size: 5vw;
}

#intro .intro_cont .h2_wrapp h2 strong{
	/*ont-size: 8.333333vw;*/
	font-size: 4.861111vw;
}

#intro .intro_cont .h2_wrapp h2 strong:first-of-type{
	margin-right: -2.777778vw;
}

#intro .intro_cont .h2_wrapp h2 small::after{
    top: 0.972222vw;
	text-shadow: 0 -0.277778vw 0.277778vw rgba(255, 255, 255, 0.25), 0 0.138889vw 0.138889vw rgba(0, 0, 0, 0.35);
}

#intro .intro_cont .h2_wrapp h2 strong::after{
    /*top: 1.388889vw;*/
    top: 0.902778vw;
	text-shadow: 0 -0.277778vw 0.277778vw rgba(255, 255, 255, 0.25), 0 0.138889vw 0.138889vw rgba(0, 0, 0, 0.35);
}

#intro .intro_cont .cont_data .caption_block{
	width: 44.861111vw;
    top: 2.777778vw;
	left: 12.152778vw;
}

#intro .intro_cont .cont_data .caption_block p{
	font-size: 1.25vw;
}

#intro .intro_cont .cont_data .movie_block{
	width: 66.666667vw;
	padding-bottom: 9.305556vw;
}

#intro .intro_cont .cont_data .movie_block .video_wrapp{
	width: 66.666667vw;
	height: 36.944444vw;
}

#intro .intro_cont .cont_data .movie_block .note{
	font-size: 0.833333vw;
	margin-top: 0.555556vw;
	padding-right: 4.444444vw;
}


#intro .intro_cont .cont_data .intro_whats{
    top: 27.222222vw;
	left: 12.152778vw;
	width: 44.861111vw;
	padding: 2.222222vw 3.333333vw;
}

#intro .intro_cont .cont_data .intro_whats::after,
#intro .intro_cont .cont_data .intro_whats::before{
	width: 8.333333vw;
	height: 8.333333vw;
	top: 0.555556vw;
	left: 0.555556vw;
}

#intro .intro_cont .cont_data .intro_whats::after{
	top: unset;
	left: unset;
	bottom: 0.555556vw;
	right: 0.555556vw;
}

#intro .intro_cont .cont_data .intro_whats .card_image{
	width: 8.472222vw;
    top: -3.472222vw;
    right: 0.972222vw;
}

#intro .intro_cont .cont_data .intro_whats .catch{
	font-size: 1.666667vw;
	margin-bottom: 1.111111vw;
}

#intro .intro_cont .cont_data .intro_whats .caption{
	font-size: 0.972222vw;
}



.bg_wrapp01{

}

/* 初期状態 */
.header_title_top .title_before {
  height: 7.777778vw;
}
.header_title_top .title_after {
  height: 7.777778vw;
}

.header_title_top strong{
	font-size: 2.222222vw;
	margin: -0.277778vw 0 0 4.513889vw;
}


#story{

}

#story .cont_wrapp{
	width: 85.416667vw;
	margin: 0 auto 13.75vw;
}

#story .header_title_top strong {
    margin: 0;
	top: 6.388889vw;
	left: 4.444444vw;
}

#story .story_cont_data{
	width: 70.833333vw;
	margin: 5.555556vw auto 0;
}

#story .story_cont_data .catch{
	font-size: 2.777778vw;
	margin-bottom: 2.777778vw;
}

#story .story_cont_data .catch strong{
	text-shadow: 0 0 1.388889vw #000;
}

#story .story_cont_data .caption{
	margin-bottom: 2.777778vw;
}

#story .story_cont_data .caption p{
	font-size: 1.25vw;
}

#story .story_cont_data .link_btn{
	width: 18.055556vw;
}

#story .story_cont_data .story_image01{
	width: 44.444444vw;
	top: -7.152778vw;
	left: 36.666667vw;
}

#story .story_cont_data .story_image02{
	width: 27.361111vw;
	top: 17.569444vw;
	left: 37.569444vw;
}



#world{

}

#world .cont_wrapp{
	width: 91.111111vw;
	margin: -0.972222vw auto 14.375vw;
}

#world .header_title_top{
	width: 36.597222vw;
	top: 1.944444vw;
}

#world .header_title_top strong {
    margin: 0;
	top: 6.388889vw;
	left: 4.444444vw;
}

#world .world_cont_data .main_map{
	width: 62.222222vw;
}

#world .world_cont_data .sub_image01{
	width: 36.25vw;
	top: 6.388889vw;
	right: 0;
}

#world .world_cont_data .sub_image02{
	width: 35.763889vw;
	top: 28.055556vw;
	right: 12.013889vw;
}

#world .world_cont_data .caption_box{
	width: 37.152778vw;
	padding: 2.777778vw 3.888889vw;
	top: 31.319444vw;
}

#world .world_cont_data .caption_box p{
	font-size: 1.111111vw;
	margin-bottom: 2.222222vw;
}

#world .world_cont_data .caption_box .link_btn{
	width: 18.055556vw;
}





#characters{
	margin-bottom: 11.111111vw;
}

#characters .characters_cont_data{
	width: 86.111111vw;
	height: 56.041667vw;
}

#characters .characters_cont_data::before{
	width: 37.569444vw;
	height: 37.569444vw;
	top: 5.625vw;
	left: -2.986111vw;
}

#characters .characters_cont_data::after {
	width: 33.333333vw;
	height: 33.333333vw;
	top: 9.791667vw;
	left: -0.902778vw;
}

#characters .characters_cont_data h2{
	width: 58.680556vw;
	top: 2.777778vw;
	left: 29.305556vw;
}

#characters .header_title_top strong {
    margin: 0 0 0 40.347222vw;
}

#characters .characters_cont_data .main_image{
	width: 34.305556vw;
}

#characters .characters_cont_data .main_image .image_data::before{
	width: 3.333333vw;
	height: 10.555556vw;
    top: 11.666667vw;
    left: 8.819444vw;
}

#characters .characters_cont_data .chara_image02{
	width: 27.5vw;
	top: 13.75vw;
	left: 32.638889vw;
}

#characters .characters_cont_data .chara_image03{
	width: 17.5vw;
    top: 15.277778vw;
    left: 53.680556vw;
}

#characters .characters_cont_data .chara_image04{
	width: 19.722222vw;
    top: 15.208333vw;
    left: 63.680556vw;
}

#characters .characters_cont_data .caption_box{
	width: 57.291667vw;
	padding: 2.777778vw 3.888889vw;
	top: 38.611111vw;
	left: 31.875vw;
}

#characters .characters_cont_data .caption_box p{
	font-size: 1.111111vw;
	margin-bottom: 2.222222vw;
}

#characters .characters_cont_data .caption_box .link_btn{
	width: 18.055556vw;
}



#system{
	margin-bottom: 16.666667vw;
}

#system .cont_wrapp{
	width: 100%;
	padding-left: 4.513889vw;
}

#system .cont_wrapp h2{
	width: 37.5vw;
	margin-bottom: 1.666667vw;
}

#system .header_title_top .title_before {
    height: 13.888889vw;
}

#system .header_title_top .title_after {
    height: 13.888889vw;
}

#system .header_title_top strong {
    margin-top: -0.972222vw;
}

#system  .system_cont_data .image_wrapper{
	width: 56.666667vw;
	top: -9.722222vw;
	right: 0;
	box-shadow: 0 0.319028vw 1.275972vw 0 rgba(0, 0, 0, 0.50);
}

#system  .system_cont_data .image_wrapper .video{
	width: 56.666667vw;
	height: 31.666667vw;
}

#system  .system_cont_data .image_wrapper .video::after,
#system  .system_cont_data .image_wrapper .video::before{
	width: 28.958333vw;
	height: 3.125vw;
    bottom: -1.736111vw;
    left: -7.708333vw;
}

#system  .system_cont_data .image_wrapper .video::after{
    bottom: unset;
    left: unset;
    top: -1.736111vw;
    right: -7.708333vw;
}

#system  .system_cont_data .image_wrapper .note{
	font-size: 0.833333vw;
	padding-right: 1.111111vw;
}

#system  .system_cont_data .caption_box{
	width: 37.5vw;
	padding: 2.777778vw 3.888889vw;
}

#system  .system_cont_data .caption_box p{
	font-size: 1.111111vw;
	margin-bottom: 2.222222vw;
}

#system  .system_cont_data .caption_box .link_btn{
	width: 18.055556vw;
}



#card{

}

#card::before{
	width: 29.097222vw;
	height: 44.236111vw;
}

#card::after{
	width: 27.777778vw;
	height: 42.013889vw;
}

#card .cont_wrapp h2{
	margin-bottom: 1.111111vw;
}

#card .header_title_top .title_before {
    height: 7.916667vw;
}

#card .header_title_top .title_after {
    height: 6.25vw;
}

#card .header_title_top strong {
    margin: -2.777778vw 0 0;
}

#card .caption_box{
	width: 41.111111vw;
	padding: 2.777778vw 0;
}

#card .caption_box p{
    font-size: 1.111111vw;
    margin-bottom: 2.222222vw;
}

#card .caption_box .link_btn {
    width: 18.055556vw;
}


#card .card_slider_wrapp {
  width: 93.055556vw;
  height: 50.416667vw;
  margin: -5.555556vw auto 0;
}

#card .card_slider_wrapp::before{
	width: 89.027778vw;
	height: 39.444444vw;
	border-radius: 89.027778vw;
}

/* 中央 */
.card_swiper .swiper-slide-active {
  transform: scale(1.78) translateY(10.416667vw);
}

/* 左右 */
.card_swiper .swiper-slide-prev {
  transform: scale(1.5) translate(-1.597222vw, 8.333333vw);
}

.card_swiper .swiper-slide-next {
  transform: scale(1.55) translate(1.597222vw, 8.333333vw);
  z-index: 4;
}

/* 左右2 */
.card_swiper .swiper-slide-prev-prev {
  transform: scale(1.25) translate(-2.222222vw, 5.555556vw);
  z-index: 3;
}

.card_swiper .swiper-slide-next-next {
  transform: scale(1.25) translate(2.222222vw, 5.555556vw);
  z-index: 3;
}


#card .staff_link{
	width: 37.986111vw;
	margin: 2.083333vw auto 0;
}

#card .staff_link a{
	height: 9.166667vw;
}

#card .staff_link a strong{
	font-size: 1.944444vw;
	text-shadow: 0 0 0.701333vw #000;
}


#products{
	margin-top: 0.972222vw;
	padding-top: 20.833333vw;
}

#products > .cont_wrapp{
	padding: 0 0 11.111111vw;
}

#products .cont_wrapp h2{
    margin-bottom: 2.569444vw;
}

#products .cont_wrapp h2::before{
	width: 60.555556vw;
	height: 13.333333vw;
}

#products .header_title_top .title_before {
    height: 7.916667vw;
}

#products .header_title_top .title_after {
    height: 7.777778vw;
}

#products .header_title_top strong {
    margin: -1.527778vw 0 0;
}


#products .data_wrapp{
	width: 91.25vw;
	margin: 0 auto 3.541667vw;
	padding: 2.777778vw 0 3.472222vw;
	background-position: left 1.111111vw top 1.111111vw, right 1.111111vw top 1.111111vw, left 1.111111vw bottom 1.111111vw, right 1.111111vw bottom 1.111111vw, left 0 top 0, left 0 bottom 0, left 0 top 0, bottom 0 left 0, 0 0;
	background-size: 3.888889vw auto, 3.888889vw auto, 3.888889vw auto, 3.888889vw auto, 0.138889vw auto, 0.138889vw auto, auto 0.138889vw, auto 0.138889vw, cover;
}

#products #download.data_wrapp{
	scroll-margin-top: calc(var(--header-h, 6.944444vw) - 4.166667vw);
}


#products .data_wrapp h3{
	font-size: 2.777778vw;
	margin-bottom: 2.777778vw;
}

#products .data_wrapp .sub_caption{
	margin-bottom: 2.777778vw;
}

#products .data_wrapp .sub_caption strong{
	font-size: 1.944444vw;
}

#products .data_wrapp .sub_caption strong::after,
#products .data_wrapp .sub_caption strong::before{
	width: 4.375vw;
	height: 0.138889vw;
    left: -5.486111vw;
}

#products .data_wrapp .sub_caption strong::after{
    left: unset;
    right: -5.486111vw;
}


#products .tabs__nav {
	width: 75.694444vw;
	margin: 0 auto 3.888889vw;
}

#products .tabs__tab {
	width: 37.013889vw;
	height: 5.416667vw;
}

#products .tabs__tab strong{
	font-size: 1.666667vw;
	padding-left: 1.944444vw;
}

#products .tabs__tab strong::before{
	width: 1.527778vw;
	height: 1.527778vw;
}

#products .tabs__panel {
	width: 73.75vw;
}

#products .tabs__panel .cont_flex{
	margin-bottom: 2.777778vw;
}

#products .tabs__panel .cont_flex .image_box{
	width: 34.791667vw;
}

#products .tabs__panel .cont_flex .image_box .image_wrapp{
	padding: 1.111111vw;
}

#products .tabs__panel .cont_flex .image_box .image_wrapp::after,
#products .tabs__panel .cont_flex .image_box .image_wrapp::before{
	width: 19.583333vw;
	height: 15.347222vw;
}

#products .tabs__panel .cont_flex .image_box .image_wrapp .frame{
	width: 32.569444vw;
	height: 21.805556vw;
	top: 1.111111vw;
	left: 1.111111vw;
}

#products .tabs__panel .cont_flex .image_box .note{
	font-size: 0.833333vw;
	margin-top: 1.111111vw;
}

#products .tabs__panel .cont_flex .text_box{
	width: 34.791667vw;
}

#products .tabs__panel .cont_flex .text_box .title{
	font-size: 1.666667vw;
	padding-bottom: 0.555556vw;
	margin-bottom: 1.111111vw;
}

#products .tabs__panel .cont_flex .text_box .text_list{
	margin-bottom: 1.111111vw;
}

#products .tabs__panel .cont_flex .text_box .text_list li{
	font-size: 1.111111vw;
}

#products .tabs__panel .cont_flex .text_box .non_list{
	font-size: 1.111111vw;
	margin-bottom: 1.111111vw;
}

#products .tabs__panel .cont_flex .text_box .note{
	font-size: 0.833333vw;
}

#products .tabs__panel .link_btn{
	width: 56.180556vw;
}


#products .dl_cont_wrapp{
	width: 69.791667vw;
}

#products .dl_cont_wrapp .dl_content{
	width: 29.305556vw;
	margin-bottom: 2.777778vw;
}

#products .dl_cont_wrapp .dl_content:nth-of-type(even)::after{
	left: -5.555556vw;
}

#products .dl_cont_wrapp .dl_content .logo{
	margin-bottom: 2.777778vw;
}

#products .dl_cont_wrapp .dl_content .link_ul li{
	margin: 0 auto 0.555556vw;
}

#products .dl_cont_wrapp .dl_content.nintendo .link_ul li:nth-child(1){
	width: 17.916667vw;
}

#products .dl_cont_wrapp .dl_content.nintendo .link_ul li:nth-child(2){
	width: 24.930556vw;
}

#products .dl_cont_wrapp .dl_content.steam .link_ul li:nth-child(1){
	width: 17.916667vw;
}


#products .text_box .dl_data{
	width: 32.291667vw;
}

#products .text_box .dl_data .logo{
	margin-bottom: 2.777778vw;
}

#products .text_box .dl_data .link_ul li{
	width: 17.916667vw;
	margin: 0 auto 0.555556vw;
}

#products .text_box .dl_data .link_ul li:last-child{
	width: 24.930556vw;
}



#products #spec.data_wrapp {
    width: 90.694444vw;
    padding: 4.444444vw;
    background-position: left 1.111111vw top 1.111111vw, right 1.111111vw top 1.111111vw, left 1.111111vw bottom 1.111111vw, right 1.111111vw bottom 1.111111vw;
    background-size: 3.888889vw auto, 3.888889vw auto, 3.888889vw auto, 3.888889vw auto;
}

#spec.data_wrapp .spec_cont_wrapp .image_box{
	width: 29.097222vw;
	padding: 1.111111vw;
}

#spec.data_wrapp .spec_cont_wrapp .image_box::after,
#spec.data_wrapp .spec_cont_wrapp .image_box::before {
    width: 14.027778vw;
    height: 3.472222vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box{
	width: 47.152778vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title{
	font-size: 2.222222vw;
	margin-bottom: 1.388889vw;
	padding-left: 2.291667vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title::before{
    width: 2.152778vw;
    height: 1.944444vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list{
	margin-bottom: 2.777778vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li{
	padding: 0.555556vw 0;
	font-size: 1.111111vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .item{
	width: 11.597222vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .data{
	width: calc(100% - 11.597222vw);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .logo{
	width: 10.347222vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text{
	width: calc(100% - 10.347222vw);
	padding-left: 2.222222vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text p{
	font-size: 0.833333vw;
}



#bottom_banner_area{
	padding: 2.777778vw 0 13.402778vw;
}

#bottom_banner_area .cont_link_ul{
    margin-bottom: 2.777778vw;
}

#bottom_banner_area .cont_link_ul li{
	width: 18.055556vw;
	margin: 0 1.388889vw;
}

#bottom_banner_area .banner_area{
	width: 59.722222vw;
}



.download_btn_area{

}

.download_btn_area .download_btn_block{
	margin-bottom: 1.666667vw;
}

.download_btn_area .download_btn_block .name{
	margin-bottom: 0.694444vw;
}

.download_btn_area .download_btn_block .name strong{
	font-size: 1.388889vw;
}

.download_btn_area .download_btn_block .name strong::after,
.download_btn_area .download_btn_block .name strong::before{
	width: 5.208333vw;
	height: 0.138889vw;
    left: -5.902778vw;
}

.download_btn_area .download_btn_block .name strong::after{
	left: unset;
	right: -5.902778vw;
}

.download_btn_area .download_btn_block .btn_ul li{
	width: 16.666667vw;
}


.image_modal_close {
  top: 1.666667vw;
  right: 1.666667vw;
}

.image_modal_close .icon{
	width: 3.125vw;
	height: 3.125vw;
}

.image_modal_close p{
    font-size: 0.972222vw;
}





}

/********************************************************************************
	スマートフォン用 CSS
********************************************************************************/

@media(max-width:460px){

.webp body,
body{
	background-image: none;
}

footer .footer_navi{
	transform: translateY(0);
	opacity: 1;
	pointer-events: unset;
}

main{
	z-index: 2;
}

main::before{
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top 0 right 0;
	background-size: cover;
	background-image: url('../images/top/products_bg.webp');
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
}

#sound-permission {
	background-image: url('../images/common/loading_bg_sp.webp');
}

#sound-permission .sound-box p{
	font-size: 3.733333vw;
	margin-bottom: 10.666667vw;
}

#sound-permission .sound-box ul{
	width: 45.333333vw;
}

#sound-permission .sound-box ul li{
	margin-bottom: 4.266667vw;
}

#sound-permission .sound-box ul li .flex::after,
#sound-permission .sound-box ul li .flex::before{
	width: 2.666667vw;
	height: 4.8vw;
}

#sound-permission .sound-box ul li .flex .icon{
	width: 11.733333vw;
	height: 11.733333vw;
}

#sound-permission .sound-box ul li .flex .icon::before{
	width: 11.733333vw;
	height: 11.733333vw;
}

#sound-permission .sound-box ul li .flex .text{
	width: 14.4vw;
	font-size: 6.4vw;
	margin-left: 2.133333vw;
}



#kv_area{
	height: auto;
	overflow: unset;
	margin-bottom: 0;
}

#kv_area::after {
    content: none;
}

#kv_area video{
	top: 0;
	left: 50%;
    transform: translate(-50%, 0);
	width: 100vw;
	height: 100vh;
	object-fit: cover;
}

#kv_area .kv_wrapp{
	width: auto;
	overflow: unset;
}

#kv_area .kv_wrapp::before{
	content: '';
	display: block;
	width: 100%;
	height: 320vw;
	/*background: linear-gradient(180deg, rgba(5, 4, 4, 0.7) 40%, rgba(5, 4, 4, 0) 40%);*/
	background: linear-gradient(180deg, rgb(5, 4, 4 / 70%) 0%, rgba(5, 4, 4, 0) 40%);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

#kv_area .kv_wrapp::after {
    height: 270vh;
}

#kv_area .kv_cont{
	position: relative;
	width: 88.533333vw;
	height: auto;
	bottom: unset;
	top: 26.666667vw;
	left: 0;
	right: 0;
	margin: auto;
	padding: 0;
	background: none;
}

#kv_area .kv_cont .logo_catch {
    width: 70.933333vw;
    top: 13.333333vw;
    left: 0;
    right: 0;
    margin: auto;
}

#kv_area .kv_cont .title_logo{
	position: relative;
}

#kv_area .logo_jp {
    font-size: 2.844533vw;
    text-shadow: 0 0 0.782133vw #000;
    top: 52.266667vw;
    left: 0;
    right: 0;
    text-align: center;
}

#kv_area .kv_cont .other_wrapp{
	width: auto;
	position: relative;
	top: -29.333333vw;
	left: 0;
	right: 0;
	transform: translate(0, 0);
	margin: 0 auto;
}

#kv_area .kv_cont .other_wrapp .date_area{
	margin-bottom: 0;
}

#kv_area .kv_cont .other_wrapp .date_area p{
	font-size: 8.533333vw;
	text-shadow: 0 0 5.333333vw #000;
}

#kv_area .kv_cont .other_wrapp .date_area p small{
	font-size: 6.4vw;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp01{
	font-size: 6.4vw;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp02{
	font-size: 6.4vw;
}

#kv_area .kv_cont .other_wrapp .date_area p span.sp03{
	font-size: 5.866667vw;
}

#kv_area .kv_cont .other_wrapp .reservation_btn {
    width: 88.533333vw;
    margin: 2.666667vw auto 0;
}

#kv_area .kv_cont .other_wrapp .movie_none_btn,
#kv_area .kv_cont .other_wrapp .movie_modal_btn{
	width: 100%;
	margin: 2.666667vw auto 0;
}

#kv_area .kv_cont .other_wrapp .kv_sns_ul{
	margin-bottom: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

#kv_area .kv_cont .other_wrapp .kv_sns_ul li{
	width: 8.533333vw;
	margin: 0 2.133333vw;
}

#kv_area .menu_area{
	width: auto;
	margin: 0 5.333333vw;
	position: relative;
	z-index: 2;
}

#kv_area .menu_area::before{
	content: '';
	display: block;
	width: 100vw;
	height: 320vw;
	background: linear-gradient(180deg, rgba(5, 4, 4, 0) 0%, rgba(5, 4, 4, 0.70) 5%);
	position: absolute;
	top: 0;
	left: -5.333333vw;
	z-index: -1;
}

#kv_area .menu_area::after{
	content: none;
}

#kv_area .menu_area .x_banner{
	width: 74.133333vw;
	margin: 5.333333vw auto 10.666667vw;
}

#kv_area .menu_area .menu_ul{
	width: 100%;
}

#kv_area .menu_area .menu_ul li{
	margin-bottom: 0;
	padding: 2.133333vw 0;
	position: relative;
}

#kv_area .menu_area .menu_ul li::after {
	content: '';
	display: block;
	width: 100%;
	height: 0.533333vw;
	background-repeat: repeat-x;
	background-position: 0 0;
	background-size: contain;
	background-image: url(../images/common/menu_line.png);
	position: absolute;
	bottom: 0;
	left: 0;
}

#kv_area .menu_area .menu_ul li a{
	padding-left: 4.8vw;
}

#kv_area .menu_area .menu_ul li a::before{
	width: 2.666667vw;
	height: 4.8vw;
	top: 1.6vw;
}

#kv_area .menu_area .menu_ul li a .en_text{
	font-size: 6.4vw;
	margin-bottom: -1.6vw;
}

#kv_area .menu_area .menu_ul li a .jp_text{
	font-size: 3.2vw;
}

.modal_cont{

}

.modal_cont.active{
	-webkit-overflow-scrolling: touch;
}

.modal_cont .modal_inner{
	width: 100%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.modal_cont .modal_inner .modal_close{
    width: 12.8vw;
    top: -13.866667vw;
}

.modal_cont .modal_inner .movie_data {
	margin-bottom: 8.533333vw;
}

.modal_cont .modal_inner .movie_thumbnail{
    flex-wrap: wrap;
    margin: 0 5.333333vw;
}

.modal_cont .modal_inner .movie_thumbnail li {
    width: 42.4vw;
	margin-bottom: 4.266667vw;
}

.modal_cont .modal_inner .movie_thumbnail li:nth-child(even){
	margin-right: 0;
}

.modal_cont .modal_inner .movie_thumbnail li.active::before{
	font-size: 3.2vw;
}


#news{
	padding: 10.666667vw 0 42.666667vw;
    background-image: none;
    z-index: 20;
}

#news::before {
	content: none;
}

.webp #news {
    background-image: none;
}

#news .list_wrapp{
	width: auto;
	margin: 0 5.333333vw 6.4vw;
	padding: 4.266667vw 2.133333vw 4.266667vw 4.266667vw;
}

#news .list_wrapp .media_list{
	height: 74.666667vw;
	padding: 0 4.266667vw 0 0;
}

#news .list_wrapp .media_list li{
	padding: 3.2vw 0;
	display: block;
}

#news .list_wrapp .media_list li .list_head{
	width: auto;
	margin-bottom: 1.066667vw;
}

#news .list_wrapp .media_list li .list_head .date{
	font-size: 3.2vw;
	margin-right: 2.133333vw;
}

#news .list_wrapp .media_list li .list_head .icon{
	height: 6.133333vw;
}

#news .list_wrapp .media_list li .list_head .icon::after{
	width: 21.866667vw;
	height: 6.133333vw;
	line-height: 6.933333vw;
	font-size: 3.2vw;
}

#news .list_wrapp .media_list li .list_cont a,
#news .list_wrapp .media_list li .list_cont p{
	font-size: 3.2vw;
	font-weight: 700;
	line-height: 1.7;
}



#banner_area{
	height: 23.466667vw;
	margin-bottom: 6.4vw;
}

#banner_area ul{
	width: 100%;
	position: static;
    transform: translate(0, 0);
}

#banner_area ul li{
	padding: 0 1.066667vw;

}

#banner_area .slick-prev,
#banner_area .slick-next {
    width: 11.733333vw;
    height: 11.733333vw;
}

#banner_area .slick-prev {
    left: 2.133333vw;
}

#banner_area .slick-next {
    right: 2.133333vw;
}

#banner_area .slick-prev:before,
#banner_area .slick-next:before {
	width: 11.733333vw;
	height: 11.733333vw;
}



#intro{
	margin-top: -31.466667vw;
}

#intro::after,
#intro::before{
	height: 12.8vw;
	background-image: url('../images/top/intro_line_top_sp.png');
	top: 2.666667vw;
}

#intro::after{
	top: unset;
	bottom: 2.666667vw;
}

#intro .bg_image{
	height: auto;
}

#intro .bg_image::after{
	width: 67.2vw;
	height: 142.666667vw;
	top: 69.866667vw;
	left: -8.533333vw;
}

#intro .intro_cont{
	width: auto;
	top: 50%;
    left: 5.333333vw;
    right: 5.333333vw;
    transform: translate(0, -50%);
}

#intro .intro_cont .h2_wrapp{
	width: 100%;
	padding: 4.266667vw 0 6.4vw;
	margin: 0 auto 6.4vw;
}

#intro .intro_cont .h2_wrapp .icon{
	width: 7.466667vw;
}

#intro .intro_cont .h2_wrapp h2 small{
	font-size: 7.466667vw;
	line-height: 1.5;
}

#intro .intro_cont .h2_wrapp h2 strong{
	/*font-size: 10.666667vw;*/
	font-size: 9.333333vw;
	line-height: 1.2;
}

#intro .intro_cont .h2_wrapp h2 strong:first-of-type{
	margin-right: 0;
}

#intro .intro_cont .h2_wrapp h2 small::after{
    top: 0;
	text-shadow: 0 -0.606667vw 0.606667vw rgba(255, 255, 255, 0.25), 0 0.303467vw 0.303467vw rgba(0, 0, 0, 0.35);
}

#intro .intro_cont .h2_wrapp h2 strong::after{
    /*top: 1.333333vw;*/
    top: 1.066667vw;
	text-shadow: 0 -0.606667vw 0.606667vw rgba(255, 255, 255, 0.25), 0 0.303467vw 0.303467vw rgba(0, 0, 0, 0.35);
}

#intro .intro_cont .cont_data{
	width: 100%;
	display: block;
}

#intro .intro_cont .cont_data .caption_block{
	width: auto;
	position: static;
	margin-bottom: 10.666667vw;
}

#intro .intro_cont .cont_data .caption_block p{
	font-size: 4.266667vw;
	text-align: center;
}

#intro .intro_cont .cont_data .movie_block{
	width: auto;
	padding-bottom: 0;
	margin: 0 -5.333333vw 10.666667vw;
}

#intro .intro_cont .cont_data .movie_block .video_wrapp{
	width: 100%;
	height: 56vw;

  mask-image: url('../images/top/movie_mask_sp.png');
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

#intro .intro_cont .cont_data .movie_block .note{
	font-size: 3.2vw;
	text-align: left;
	margin-top: 2.133333vw;
	padding: 0 0 0 7.466667vw;
}


#intro .intro_cont .cont_data .intro_whats{
	position: relative;
	top: 0;
	left: 0;
	width: auto;
	padding: 8.533333vw;
}

#intro .intro_cont .cont_data .intro_whats::after,
#intro .intro_cont .cont_data .intro_whats::before{
	width: 32vw;
	height: 32vw;
	top: 2.133333vw;
	left: 2.133333vw;
}

#intro .intro_cont .cont_data .intro_whats::after{
	top: unset;
	left: unset;
	bottom: 2.133333vw;
	right: 2.133333vw;
}

#intro .intro_cont .cont_data .intro_whats .card_image{
	width: 24.266667vw;
    position: absolute;
    top: -7.466667vw;
    right: 0.533333vw;
}

#intro .intro_cont .cont_data .intro_whats .catch{
	font-size: 5.333333vw;
	margin-bottom: 4.266667vw;
}

#intro .intro_cont .cont_data .intro_whats .caption{
	font-size: 3.2vw;
	font-weight: 700;
}



.bg_wrapp01{
	padding: 32vw 0 0;
	margin-top: -20.8vw;
	background-position: 50% 50%;
    background-size: 100% 100%;
    background-attachment: fixed;
    background-image: none;
	z-index: 2;
	overflow: unset;
	position: relative;
}

.webp .bg_wrapp01{
    background-image: none;
}

.bg_wrapp01 .bg_block01{
	position: relative;
	padding-bottom: 43.733333vw;
}


.bg_wrapp01 .bg_block01::before{
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
    background-position: left 0  bottom 0;
    background-size: 100% auto;
    background-image: url('../images/top/body_bg02_sp.webp');
    position: absolute;
    top: -34.666667vw;
    left: 0;
}

.bg_wrapp01 .bg_block01::after{
    content: '';
    display: inline-block;
    width: 100%;
    height: 12.8vw;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url(../images/top/products_line_sp.png);
    position: absolute;
    bottom: 37.333333vw;
    left: 0;
    z-index: 10;
}

.header_title_top{
	margin-left: 2.133333vw;
}

/* 初期状態 */
.header_title_top .title_before {
	height: auto;
}
.header_title_top .title_after {
	height: auto;
}

.header_title_top strong{
	font-size: 6.4vw;
	margin: -5.333333vw 0 0 11.2vw;
}


#story{

}

#story .cont_wrapp{
	width: auto;
	margin: 0 auto 27.466667vw;
}

#story .cont_wrapp .header_title_top{
	width: 59.733333vw;
}

#story .cont_wrapp .header_title_top img{
	width: 100%;
	height: auto;
}

#story .header_title_top strong {
    margin: 0;
    top: 12.266667vw;
    left: 8vw;
}

#story .story_cont_data{
	width: auto;
	margin: 52.266667vw 5.333333vw 0;
	z-index: 2;
}

#story .story_cont_data .catch{
	font-size: 7.466667vw;
	letter-spacing: 0;
	margin-bottom: 6.4vw;
}

#story .story_cont_data .catch strong{
	text-shadow: 0 0 5.333333vw #000;
}

#story .story_cont_data .caption{
	margin-bottom: 10.666667vw;
}

#story .story_cont_data .caption p{
	font-size: 3.733333vw;
	line-height: 1.75;
}

#story .story_cont_data .link_btn{
	width: 69.333333vw;
	margin: 0 auto;
}

#story .story_cont_data .story_image01{
	width: 83.733333vw;
	top: -54.4vw;
	left: -5.866667vw;
	z-index: -1;
}

#story .story_cont_data .story_image02{
	width: 54.666667vw;
	top: -29.066667vw;
	left: 41.600000vw;
	z-index: -1;
}



#world{

}

#world .cont_wrapp{
	width: auto;
	margin: 0 auto 20vw;
}


#world .header_title_top{
	width: 66.133333vw;
	position: relative;
	top: 0;
	left: 0;
	margin: 0 0 0 5.333333vw;
}

#world .header_title_top .title_before {
	height: 16vw;
}

#world .header_title_top .title_after {
	height: 16vw;
}

#world .header_title_top strong {
    margin: 0;
 	position: absolute;
	top: 13.6vw;
	left: 8vw;
}


#world .world_cont_data{

}

#world .world_cont_data .main_map{
	width: auto;
	margin-bottom: 51.733333vw;
}

#world .world_cont_data .sub_image01{
	width: 74.666667vw;
	top: 73.333333vw;
	right: unset;
	left: 4.266667vw;
}

#world .world_cont_data .sub_image02{
	width: 74.666667vw;
	top: 116.266667vw;
	right: 4.266667vw;
	z-index: 5;
}

#world .world_cont_data .caption_box{
	width: 94.666667vw;
	padding: 6.4vw 5.333333vw;
	position: relative;
	bottom: unset;
	top: -1.6vw;
	left: 4.266667vw;
}

#world .world_cont_data .caption_box p{
	font-size: 3.733333vw;
	margin-bottom: 4.266667vw;
}

#world .world_cont_data .caption_box .link_btn{
	width: 69.333333vw;
	margin: 0 auto;
	padding-right: 2.133333vw;
}





#characters{
	margin-bottom: 21.333333vw;
}

#characters .characters_cont_data{
	width: auto;
	height: 249.066667vw;
}

#characters .characters_cont_data::before{
	width: 81.333333vw;
	height: 81.333333vw;
	top: 100.266667vw;
	left: 0;
}

#characters .characters_cont_data::after {
	width: 72.266667vw;
	height: 72.266667vw;
	top: 109.6vw;
	left: 4.533333vw;
}

#characters .characters_cont_data h2{
	width: 100%;
	top: 0;
	left: 0;
}

#characters .header_title_top strong {
	font-size: 7.466667vw;
    margin: -5.333333vw 0 0 47.2vw;
}

#characters .characters_cont_data .main_image{
	width: 76vw;
	position: absolute;
	top: 72vw;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 5;
}


#characters .characters_cont_data .main_image .image_data::before{
	width: 15.466667vw;
	height: 40.266667vw;
    top: 70.133333vw;
    left: 67.2vw;
}

#characters .characters_cont_data .chara_image02{
	width: 63.2vw;
	top: 43.733333vw;
	left: -4.533333vw;
	z-index: 2;
}

#characters .characters_cont_data .chara_image03{
	width: 47.2vw;
    top: 28vw;
    left: 37.866667vw;
	z-index: 1;
}

#characters .characters_cont_data .chara_image04{
	width: 49.066667vw;
    top: 43.733333vw;
    left: 57.866667vw;
	z-index: 2;
}

#characters .characters_cont_data .caption_box{
	width: 82.4vw;
	padding: 6.4vw 5.333333vw;
	background: linear-gradient(270deg, rgba(38, 23, 0, 0.00) 0%, #261700 50%, rgba(38, 23, 0, 0.00) 100%);
	top: 191.733333vw;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 5;
}

#characters .characters_cont_data .caption_box p{
	font-size: 3.733333vw;
	margin: 0 -2.666667vw 8.533333vw;
	white-space: nowrap;
}

#characters .characters_cont_data .caption_box .link_btn{
	width: 69.333333vw;
}



#system{
	margin-bottom: 21.333333vw;
}

#system .cont_wrapp{
	width: auto;
	padding-left: 0;
	box-sizing: border-box;
}

#system .cont_wrapp h2{
	width: 74.933333vw;
	margin: 0 0 6.4vw 5.333333vw;
}

#system .header_title_top .title_before {
    height: 32.8vw;
	position: relative;
	left: -4.8vw;
}

#system .header_title_top .title_after {
    /*height: 32.8vw;*/
    height: 25.066667vw;
}

#system .header_title_top strong {
    margin-top: -3.733333vw;
}

#system  .system_cont_data{
	position: relative;
}

#system  .system_cont_data .image_wrapper{
	width: 94.133333vw;
	position: relative;
	top: 0;
	right: 0;
	left: 5.866667vw;
	box-shadow: none;
}

#system  .system_cont_data .image_wrapper .video{
	width: 94.133333vw;
	height: 52.8vw;
}

#system  .system_cont_data .image_wrapper .video::after,
#system  .system_cont_data .image_wrapper .video::before{
	width: 46.933333vw;
	height: 5.066667vw;
    bottom: -3.466667vw;
    left: -13.866667vw;
}

#system  .system_cont_data .image_wrapper .video::after{
    bottom: unset;
    left: unset;
    top: -3.466667vw;
    right: -13.866667vw;
}

#system  .system_cont_data .image_wrapper .note{
	font-size: 3.2vw;
	padding-right: 5.333333vw;
}

#system  .system_cont_data .caption_box{
	width: auto;
	margin: 0 5.333333vw;
	padding: 6.4vw 5.333333vw;
	background: linear-gradient(270deg, rgba(38, 23, 0, 0.00) 0%, #261700 50%, rgba(38, 23, 0, 0.00) 100%);
}

#system  .system_cont_data .caption_box p{
	font-size: 3.733333vw;
	margin-bottom: 8.533333vw;
}

#system  .system_cont_data .caption_box .link_btn{
	width: 69.333333vw;
}



#card{

}

#card::before{
	width: 42.133333vw;
	height: 75.466667vw;
	top: -9.066667vw;
}

#card::after{
	width: 35.2vw;
	height: 65.066667vw;
	top: -9.066667vw;
}

#card .cont_wrapp{

}

#card .cont_wrapp h2{
	width: 54.133333vw;
	margin: 0 auto 4.266667vw;
}

#card .cont_wrapp h2 img{
	width: 100%;
	height: auto !important;
}

#card .header_title_top .title_before {
    height: 20vw;
}

#card .header_title_top .title_after {
    height: 20vw;
}

#card .header_title_top strong {
    margin: -2.4vw 0 0;
}

#card .caption_box{
	width: 80.8vw;
	padding: 6.4vw 0;
	background: linear-gradient(270deg, rgba(38, 23, 0, 0.00) 0%, #261700 50%, rgba(38, 23, 0, 0.00) 100%);
}

#card .caption_box p{
    font-size: 3.733333vw;
    margin-bottom: 8.533333vw;
}

#card .caption_box .link_btn {
    width: 69.333333vw;
}


#card .card_slider_wrapp {
  width: auto;
  height: 69.333333vw;
  margin: -6.666667vw -5.333333vw 0;
}

#card .card_slider_wrapp::before{
	content: none;
}

.card_swiper .swiper-slide {
	transform: scale(1) translate(0,0);
}

/* 中央 */
.card_swiper .swiper-slide-active {
	transform: scale(1.5) translateY(16vw);
}

/* 左右 */
.card_swiper .swiper-slide-prev {
	transform: scale(1.4) translate(0.533333vw, 12.533333vw);
}

.card_swiper .swiper-slide-next {
	transform: scale(1.4) translate(-0.533333vw, 12.533333vw);
}

/* 左右2 */
.card_swiper .swiper-slide-prev-prev {
	transform: scale(1.1) translate(2.133333vw, 7.2vw);
}

.card_swiper .swiper-slide-next-next {
	transform: scale(1.1) translate(-2.133333vw, 7.2vw);
}


#card .staff_link{
	width: 93.866667vw;
	margin: 9.6vw auto 21.333333vw;
}

#card .staff_link a{
	height: 22.933333vw;
	background-image: url('../images/top/staff_link_bg_sp.webp');
}

#card .staff_link a strong{
	font-size: 5.333333vw;
	line-height: 1.2;
	text-shadow: 0 0 0.701333vw #000;
}


#products{
	clip-path: polygon(0 2%, 100% 0, 100% 100%, 0% 100%);
	margin-top: -53.333333vw;
	z-index: -1;
}


#products::after{
	content: none;
	height: 960.000000vw;
	background-repeat: repeat;
	background-size: 100%;
	background-image: url('../images/top/products_bg.webp');
	background-attachment: unset;
}

#products > .cont_wrapp {
	padding: 16vw 0 28.8vw;
}

#products .cont_wrapp h2{
    margin-bottom: 4.8vw;
}

#products .cont_wrapp h2::before{
	width: 89.866667vw;
	height: 30.4vw;
	filter: blur(3.466667vw);
}

#products .header_title_top .title_before {
    height: 13.6vw;
}

#products .header_title_top .title_after {
    height: 13.6vw;
}

#products .header_title_top strong {
    margin: -1.866667vw 0 0;
}


#products .data_wrapp{
	width: 89.333333vw;
	margin: 0 auto 6.4vw;
	padding: 6.4vw 4.8vw 12.8vw;
	background-position: left 2.133333vw top 2.133333vw, right 2.133333vw top 2.133333vw, left 2.133333vw bottom 2.133333vw, right 2.133333vw bottom 2.133333vw, left 0 top 0, left 0 bottom 0, left 0 top 0, bottom 0 left 0, 0 0;
	background-size: 7.466667vw auto, 7.466667vw auto, 7.466667vw auto, 7.466667vw auto, 0.533333vw auto, 0.533333vw auto, auto 0.533333vw, auto 0.533333vw, cover;
	background-image: url('../images/top/products_cont_point_tl.png'), url('../images/top/products_cont_point_tr.png'), url('../images/top/products_cont_point_bl.png'), url('../images/top/products_cont_point_br.png'), url('../images/top/products_cont_frame_wt.png'), url('../images/top/products_cont_frame_wb.png'), url('../images/top/products_cont_frame_hl.png'), url('../images/top/products_cont_frame_hr.png'), url('../images/top/products_cont_bg_sp.webp');
}

#products #download.data_wrapp{
	scroll-margin-top: calc(var(--header-h, 21.333333vw) - 0.533333vw);
}

#products .data_wrapp h3{
	font-size: 8.533333vw;
	line-height: 1.5;
	margin-bottom: 8.533333vw;
}

#products .data_wrapp .sub_caption{
	margin-bottom: 8.533333vw;
}

#products .data_wrapp .sub_caption strong{
	font-size: 5.333333vw;
}

#products .data_wrapp .sub_caption strong::after,
#products .data_wrapp .sub_caption strong::before{
	width: 16.8vw;
	height: 0.533333vw;
    left: -18.933333vw;
}

#products .data_wrapp .sub_caption strong::after{
    left: unset;
    right: -18.933333vw;
}



#products .tabs {

}

#products .tabs__nav {
	width: auto;
	margin: 0 auto 6.4vw;
}

#products .tabs__tab {
	width: 38.933333vw;
	height: 18.666667vw;
	background-image: url('../images/top/tab_bg_off_sp.png');
}

#products .tabs__tab.is-active {
	background-image: url('../images/top/tab_bg_on_sp.png');
}

#products .tabs__tab strong{
	font-size: 5.333333vw;
	padding-left: 7.466667vw;
	top: 41%;
}

#products .tabs__tab strong::before{
	width: 5.866667vw;
	height: 5.866667vw;
}

#products .tabs__panel {
	width: auto;
	margin: 0 auto;
}

#products .tabs__panel .cont_flex{
	display: block;
	margin-bottom: 8.533333vw;
}

#products .tabs__panel .cont_flex .image_box{
	width: 80vw;
	margin-bottom: 6.4vw;
}

#products .tabs__panel .cont_flex .image_box .image_wrapp{
	padding: 0;
	border: 1px solid var(--color2);
	margin-bottom: 6.4vw
}

#products .tabs__panel .cont_flex .image_box .image_wrapp::after,
#products .tabs__panel .cont_flex .image_box .image_wrapp::before{
	content: none;
}

#products .tabs__panel .cont_flex .image_box .image_wrapp .frame{
	display: none;
}

#products .tabs__panel .cont_flex .image_box .note{
	font-size: 3.2vw;
	margin-top: 6.4vw;
}

#products .tabs__panel .cont_flex .text_box{
	width: auto;
}

#products .tabs__panel .cont_flex .text_box .title{
	font-size: 5.333333vw;
	padding-bottom: 2.133333vw;
	margin-bottom: 4.266667vw;
}

#products .tabs__panel .cont_flex .text_box .text_list{
	margin-bottom: 4.266667vw;
}

#products .tabs__panel .cont_flex .text_box .text_list li{
	font-size: 3.733333vw;
}

#products .tabs__panel .cont_flex .text_box .non_list{
	font-size: 3.733333vw;
	margin-bottom: 4.266667vw;
}

#products .tabs__panel .cont_flex .text_box .note{
	font-size: 3.2vw;
}

#products .tabs__panel .link_btn{
	width: 70.933333vw;
}


#products .dl_cont_wrapp{
	width: auto;
	display: block;
}

#products .dl_cont_wrapp .dl_content{
	width: 80vw;
	margin-bottom: 21.333333vw;
}

#products .dl_cont_wrapp .dl_content:last-of-type{
	margin-bottom: 0;
}

#products .dl_cont_wrapp .dl_content:nth-of-type(even)::after{
	width: 100%;
	height: 1px;
	background: #8E897D;
	position: absolute;
	top: -10.666667vw;
	left: 0;
}

#products .dl_cont_wrapp .dl_content .logo{
	margin-bottom: 6.4vw;
}

#products .dl_cont_wrapp .dl_content .link_ul li{
	margin: 0 auto 2.133333vw;
}

#products .dl_cont_wrapp .dl_content.nintendo .link_ul li:nth-child(1){
	width: 70.933333vw;
}

#products .dl_cont_wrapp .dl_content.nintendo .link_ul li:nth-child(2){
	width: 74.666667vw;
}

#products .dl_cont_wrapp .dl_content.steam .link_ul li:nth-child(1){
	width: 70.933333vw;
}


#products .text_box .dl_data{
	width: 100%;
}

#products .text_box .dl_data .logo{
	margin-bottom: 6.4vw;
}

#products .text_box .dl_data .link_ul li{
	width: 70.933333vw;
	margin: 0 auto 2.133333vw;
}

#products .text_box .dl_data .link_ul li:last-child{
	width: 74.666667vw;
}



#products #spec.data_wrapp {
    width: 89.333333vw;
    padding: 10.666667vw 6.4vw;
    background-position: left 2.133333vw top 2.133333vw, right 2.133333vw top 2.133333vw, left 2.133333vw bottom 2.133333vw, right 2.133333vw bottom 2.133333vw;
    background-size: 7.466667vw auto, 7.466667vw auto, 7.466667vw auto, 7.466667vw auto;
}

#spec.data_wrapp .spec_cont_wrapp{
	width: auto;
	display: block;
}

#spec.data_wrapp .spec_cont_wrapp .image_box{
	width: 56.8vw;
	padding: 4.266667vw;
	margin: 0 auto 10.666667vw;
	box-sizing: border-box;
}

#spec.data_wrapp .spec_cont_wrapp .image_box::after,
#spec.data_wrapp .spec_cont_wrapp .image_box::before {
    width: 53.333333vw;
    height: 12.8vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box{
	width: auto;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title{
	font-size: 7.466667vw;
	margin-bottom: 5.333333vw;
	padding-left: 9.6vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .title::before{
    width: 8.533333vw;
    height: 7.466667vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list{
	margin-bottom: 10.666667vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li{
	padding: 0;
	margin-bottom: 4.266667vw;
	font-size: 3.2vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li:last-child{
	margin-bottom: 0;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .item{
	width: 29.6vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .spec_list li .data{
	width: calc(100% - 29.6vw);
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license{
	display: block;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .logo{
	width: 39.733333vw;
	margin: 0 auto 4.266667vw;
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text{
	width: auto;
	padding-left: 0
}

#spec.data_wrapp .spec_cont_wrapp .text_box .license .text p{
	font-size: 3.2vw;
	text-align: center;
}



#bottom_banner_area{
	padding: 10.666667vw 0 51.466667vw;
}

#bottom_banner_area .cont_link_ul{
	display: block;
	width: 87.733333vw;
    margin: 0 auto 10.666667vw;
}

#bottom_banner_area .cont_link_ul li{
	width: 100%;
	margin: 0 0 4.266667vw;
}
#bottom_banner_area .cont_link_ul li:last-child{
	margin-bottom: 0;
}

#bottom_banner_area .banner_area{
	width: 87.733333vw;
}



.dl_cont_wrapp .download_btn_area{
	position: relative;

}

.dl_cont_wrapp .download_btn_area::after{
    content: '';
    display: inline-block;
    width: 100%;
    height: 2px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: contain;
    background-image: url('../images/top/download_btn_ablock_line.png');
    position: absolute;
    bottom: -40px;
    left: 0;
    right: 0;
    margin: auto;
}

.dl_cont_wrapp .dl_content:last-of-type .download_btn_area::after{
    content: none;
}




.download_btn_area .download_btn_block{
	margin-bottom: 6.4vw;
	position: relative;
}

.download_btn_area .download_btn_block .name{
	margin-bottom: 2.666667vw;
}

.download_btn_area .download_btn_block .name strong{
	font-size: 4.266667vw;
	line-height: 1.5;
}

.download_btn_area .download_btn_block .name strong::after,
.download_btn_area .download_btn_block .name strong::before{
	width: 20vw;
	height: 0.533333vw;
    left: -22.666667vw;
}

.download_btn_area .download_btn_block .name strong::after{
	left: unset;
	right: -22.666667vw;
}

.download_btn_area .download_btn_block:nth-of-type(2) .name strong::after,
.download_btn_area .download_btn_block:nth-of-type(2) .name strong::before{
	width: 9.866667vw;
	background-image: url(../images/top/line_decoration2.png);
    left: -12.533333vw;
}

.download_btn_area .download_btn_block:nth-of-type(2) .name strong::after{
	left: unset;
	right: -12.533333vw;
}


.download_btn_area .download_btn_block .btn_ul{
	display: block;
}

.download_btn_area .download_btn_block .btn_ul li{
	width: 70.4vw;
	margin: 0 auto 2.133333vw;
}

.download_btn_area .download_btn_block .btn_ul li:last-child{
	margin-bottom: 0;
}

.image_modal_inner {
    max-width: 90vw;
    width: 90%;
}

.image_modal_close {
  top: 4.266667vw;
  right: 4.266667vw;
}

.image_modal_close .icon{
	width: 12vw;
	height: 12vw;
}

.image_modal_close p{
    font-size: 3.733333vw;
}



}
