/* mv_area */
.mv_area .mv_content{ max-width: 100%; left: 0; right: 0;}
.mv_area .mv_content ul{ max-width: 366px; top: 23px; right: initial; flex-wrap: wrap; justify-content: stretch;}
.mv_area .mv_content ul li{ margin-top: 25px;}
.mv_area .mv_content ul li:nth-child(1){ margin-right: 17px; margin-top: 0;}
.mv_area .mv_content ul li:nth-child(2){ margin-top: 0;}
.mv_area .mv_content .text_box .logo{ width: 100%; max-width: 440px; margin: auto;}
.mv_area .mv_content .text_box .logo img:nth-child(2){ margin-top: 0;}
.mv_area .mv_content .text_box{ max-width: 500px; top: auto; left: 0; right: 0; bottom: 60px; position: absolute; z-index: 11;}
.mv_area .mv_content .text_box .store_links{ width: 80%;}
.mv_area .mv_content .text_box .store_links{ display: flex; flex-wrap: wrap;}
.mv_area .mv_content .text_box .shadow.steam{ order: 1; width: 48%;}
.mv_area .mv_content .text_box .shadow.ps{ order: 3;}
.mv_area .mv_content .text_box .shadow.xbox{ order: 2; width: 48%;}
.mv_area .mv_content .text_box .shadow a{ margin: 20px auto auto; height: 54px;}
.mv_area .mv_content .text_box .shadow a.steam_link{ width: 100%;}
.mv_area .mv_content .text_box .shadow a.ps_link{ width: 100%; max-width: 100%;}
.mv_area .mv_content .text_box .shadow a.xbox_link{ width: 100%;}
.mv_area .mv_content .text_box .mv_swiper .swiper-pagination .swiper-pagination-bullet,
.mv_area .mv_content .text_box .mv_swiper .swiper-pagination .swiper-pagination-bullet-active{ width: 10px !important; height: 10px !important;}
.mv_area .mv_content .chara_box{ min-width: 900px; width: 90%; max-width: 900px; height: 100%; left: 50%; right: 0; margin: auto 0px auto -450px; text-align: center;}
@media screen and (max-width:975px){
	.mv_area{ overflow-x: hidden; position: relative;}
	.mv_area .mv_content .chara_box{ width: 880px; position: absolute;}
}
@media screen and (max-height: 1000px) {
  .mv_area .mv_content .chara_box{ min-width: 800px; max-width: 800px; margin: auto 0px auto -400px;}
}


/* news_area */
@media screen and (max-width:880px){
	.news_list_area .container .title{ max-width: 300px; margin-left: auto; margin-right: auto;}
	.news_list_area .container .news_swiper{}
}


/* movie_area */
@media screen and (max-width:1060px){
	.movie_area{ overflow: hidden;}
	.movie_area .title{ max-width: 10%; z-index: 4; overflow: initial;}
	.movie_area .title .lottie-obj{ width: 230px; bottom: 0px; left: -170px;}
	.movie_area .title > div{ position: absolute; top: 0; left: 20px; bottom: 0; margin: auto; overflow: initial; height: 530px;}
	.movie_area .title > div p{ font-size: 108px;}
	.movie_area .title > div p > span{ font-size: 128px;}
	.movie_area .movie{ width: 90%; min-height: 500px;}
	.movie_area .movie #youtube-wrapper{ width: 160%;}
}


/* about_area */
@media screen and (max-width:880px){
	.about_area #container .chara{ left: 0; margin: auto;}
	.about_area #container .text{ left: 0; right: 0; margin: auto; max-width: 690px; padding: 0 10px; box-sizing: border-box;}
}


/* story_area */
@media screen and (max-width:880px){
	.story_area #container .chara{ left: 0; right: 0; margin: auto;}
	.story_area #container .text{ left: 0; right: 0; margin: auto; max-width: 690px; padding: 0 10px; box-sizing: border-box;}
}


/* product_area */
@media screen and (max-width:880px){
	.product_area .luxy-el.bg{ width: 100%; height: 2200px; background-image: url(https://www.arcsystemworks.jp/ddrev/images/top_product_bg_sp.jpg);}
	.product_area #container{ max-width: 690px;}
	.product_area #container .platform_link{ max-width: 100%; display: block;}
	.product_area #container .platform_link .shadow{ width: 60%; margin: auto;}
	.product_area #container .platform_link .shadow:nth-child(2){ margin: 10px auto;}
	.product_area #container .platform_link .shadow a{ width: 100% !important; height: 50px; clip-path: polygon(15px 0%, 100% 0%, 100% 100%, 0px 100%, 0px 15px);}
	.product_area #container .platform_link .shadow a.steam_link img{ max-width: 83px;}
	.product_area #container .platform_link .shadow a.ps_link img{ max-width: 151px;}
	.product_area #container .platform_link .shadow a.xbox_link img{ max-width: 75px;}
}


/* character */
.character_area .title{ max-width: 290px;}
@media screen and (max-width:1000px){
	.character_area .title .box{ top: auto; bottom: 40px;}
}