/* MV */
.mv{ background-color: #161519; width: 100%; height: auto; min-height: auto; position: relative;}

/* news */
.news{ padding: 40px 10px 0;}
.news .news-wrapper{ display: block;}
.news .news-wrapper .left{ max-width: 100%;}
.news .news-wrapper .left .htitle h2::before{ position: absolute; top: 0; left: -90px; bottom: 0; margin: auto;}
.news .news-wrapper .left .htitle h2::after{ position: absolute; top: 0; right: -90px; bottom: 0; margin: auto;}
.news .news-wrapper .right{ padding: 10px 20px 0; height: 220px; margin-top: 10px}
.news .news-wrapper .right ul li{ padding: 10px;}
.news .news-wrapper .right ul li .date{ font-size: 12px;}
.news .news-wrapper .right ul li p{ font-size: 14px;}
.news .slide-wrapper{ margin-top: 40px;}
.news .slide-wrapper .slider .slick-dots li{ width: 14px; height: 16px; background-size: 14px;}

/* trailet */
.trailet{ width: 100%; height: 390px; margin: 70px auto 0; position: relative;}
.trailet .movie a .left{ left: -350px;}
.trailet .movie a .right{ right: -350px;}
.trailet .movie a .main{ max-width: 295px; height: 165px;}
.trailet .movie a .main .start-btn{ width: 80px; height: 80px; background-size: 31px;}

/* character */
.character .character-wrapper ul{ margin-top: 20px; display: block;}
.character .character-wrapper ul li.chara{ max-width: 690px; margin: auto auto auto; position: relative; display: flex; justify-content: flex-end;}
.character .character-wrapper ul li.chara .text-box{ position: absolute; bottom: 60px; left: 50px; margin: auto; text-shadow: 0px 0px 6px black;}
.character .character-wrapper ul li.chara .text-box .name{ padding: 0 10px 10px;}
.character .character-wrapper ul li.chara .text-box .name .huri{ font-size: 12px;}
.character .character-wrapper ul li.chara .text-box .name .en{ font-size: 26px;}
.character .character-wrapper ul li.chara .text-box .voice{ padding: 10px 10px;}
.character .character-wrapper ul li.chara .text-box .voice .cv-box{font-size: 12px; width: 27px; height: 27px; line-height: 24px; text-shadow: none;}
.character .character-wrapper ul li.chara .text-box .voice .actor-box{ padding-left: 9px;}
.character .character-wrapper ul li.chara .text-box .voice .actor-box .box .country{ font-size: 12px; padding: 0 5px; text-shadow: none;}
.character .character-wrapper ul li.chara .text-box .voice .actor-box .box .actor{ font-size: 12px;}
.character .character-wrapper ul li.chara .text-box .text{ padding: 10px 10px 0;}
.character .character-wrapper ul li.chara .text-box .text p{ font-size: 14px;}
.character .character-wrapper ul li.chara .images-box{ width: 100%; max-width: 306px;}
.character .character-wrapper .btn-more{ margin-top: 20px;}
@media screen and (max-width:660px){
	.character .character-wrapper ul li.chara .images-box{ max-width: 266px;}
}
@media screen and (max-width:525px){
	.character .character-wrapper ul li.chara .images-box{ max-width: 196px;}
	.character .character-wrapper ul li.chara .text-box{ bottom: 60px; left: 20px;}
}
@media screen and (max-width:405px){
	.character .character-wrapper ul li.chara .images-box{ max-width: 176px;}
	.character .character-wrapper ul li.chara .text-box{ max-width: 215px; bottom: 40px; left: 20px;}
	.character .character-wrapper ul li.chara .text-box .name .en{ font-size: 20px;}
	.character .character-wrapper ul li.chara .text-box .text p{ font-size: 12px;}
}
@media screen and (max-width:380px){
	.character .character-wrapper ul li.chara{ padding: 30px 30px;}
	.character .character-wrapper ul li.chara .text-box{ max-width: 185px; bottom: 50px;}
	.character .character-wrapper ul li.chara .images-box{ max-width: 146px; margin-right: -14px;}
}