@charset "utf-8";

/* ========================================
	modal sp
	======================================== */
.l-modal__bg {
	background-image: none;
	background-color: rgba(0,0,0,0.9);
}
.l-modal__body{
	padding-top: 11%;
}
.l-modal_close{
	width: 8%;/* 60 / 750 * 100 */
	top: 0.5%;
	right: 5%;
}
@media screen and (min-width: 760px) {
	.l-modal__body{
		padding-top: 6%;
	}
	.l-modal_close{
		width: 4%;
		top: 2%;
		right: 6%;
	}
	.l-modal_close:hover{
		opacity: 0.8;
	}
}
.l-modal__wrap{
	width: 100%;
}
/*contents*/
.c-slider-carousel__item_in{
	position: relative;
	width: 88%; /* 660 / 750 * 100 */
	margin-left: auto;
	margin-right: auto;
}
.slider_bg{
	display: block;
	position: relative;
}
.modal-lead{
	position: absolute;
	width: 69.6969696%; /* 460 / 660 * 100 */
	top:16.1917%; /* 125 / 772 *100 */
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}
.modal-lead .f-noto{
	font-size: 1.3rem;
	font-weight: 900;
	font-family: 'Noto Sans JP', sans-serif;
	color: #003755;
	line-height: 1.8;
}

@media screen and (max-width: 320px){
	.modal-lead .f-noto{
		font-size: 1.2rem;
	}
}
.modal-lead dt{
	margin-bottom: 4%;	
}
.modal-chara_p{
	position: absolute;
}
@media screen and (min-width: 760px) and (max-width: 1000px) {
	.modal-lead .f-noto{
		font-size: 1.8rem;
		font-weight: 900;
	}
	.is-tablet .modal-koopa .modal-lead .f-noto{
		font-size: 1.6rem;
	}
}
@media screen and (min-width: 1001px) {
	.modal-lead .f-noto{
		font-size: 2.0rem;
		font-weight: 900;
	}
}
.is-tablet .modal-lead .f-noto{
	font-size: 1.5rem;
}
.is-tablet .tab-br{
	display: block;
}
@media screen and (min-width: 760px) {
	.bx-viewport{
		max-height: 674px;
	}
	.c-slider-carousel__item{
		text-align: center;
	}
	.c-slider-carousel__item_in{
		position: relative;
		width: 87.4545454%; /* 962 / 1100 * 100 */
	}
	.c-slider{
		overflow: visible !important;
	}	
	.modal-lead{
		width: 51.975%; /* 510 / 1104 * 100 */
		top:16.369%; /* 110 / 672 *100 */
		left: 12.2661122%;/* 118 / 962 * 100 */
		text-align: left;
		margin: 0;
	}
	.modal-lead dt{
		margin-bottom: 4%;	
	}
}
/*mario*/
.modal-mario .modal-lead dt{
	width: 27.3913%; /* 126 / 460* 100 */
}
.modal-mario .modal-chara_p{
	width: 52.5757575%; /* 347 / 660 * 100 */
	right: -6.5%;
	bottom: -5%;
}

@media screen and (min-width: 760px) {
	/*mario PC*/
	.modal-mario .modal-lead dt{
		width: 27.3913%; /* 126 / 460* 100 */
	}
	.modal-mario .modal-chara_p{
		width: 43.8541666%; /* 421 / 960 * 100 */
		right: 4%;
		bottom: -5%;
	}
}
/*luigi SP*/
.modal-luigi .modal-lead dt{
	width: 36.3%; /* 167 / 460* 100 */
}
.modal-luigi .modal-chara_p{
	width: 45%; /* 297 / 660 * 100 */
	right: -6.5%;
	bottom: -5%;
}
@media screen and (min-width: 760px) {
	.modal-luigi .modal-chara_p{
		width: 38.3575883%; /* 369 / 962 * 100 */
		right: 4%;
		bottom: -5.5%;
	}
}
/*ystar*/
.modal-ystar .modal-lead dt{
	width: 93.47826%; /* 430 / 460* 100 */
}
.modal-ystar .modal-chara_p{
	width: 43.6363636%; /* 288 / 660 * 100 */
	right: -1.2%;
	bottom: -6.5%;
}
@media screen and (min-width: 760px) {
.modal-ystar .modal-chara_p{
	width:32.744827%; /* 315 / 962 * 100 */
	right: 10%;
	bottom: -8%;
}
}
/*peach*/
.modal-peach .modal-lead dt{
	width: 32%;
}
.modal-peach .modal-chara_p{
	width: 43.1818181%; /* 285 / 660 * 100 */
	right: 1.2%;
	bottom: -6%;
}
@media screen and (min-width: 760px) {
	.modal-peach .modal-chara_p{
		width: 33.4719334%; /* 322 / 962 * 100 */
		right: 10.5%;
		bottom: -6%;
	}
}
/*friends01*/
.modal-friends01 .modal-lead dt{
	width: 38%; /* 175 / 460* 100 */
}
.modal-friends01 .modal-chara_p{
	width: 56.6666666%; /* 374 / 660 * 100 */
	right: -1.6%;
	bottom: -6%;
}
@media screen and (min-width: 760px) {
	.modal-friends01 .modal-chara_p{
		width: 42.7234927%; /* 411 / 962 * 100 */
		right: 8%;
		bottom: -7%;
	}
}
/*friends02*/
.modal-friends02 .modal-lead dt{
	width: 33%; /* 152 / 460 * 100 */
}
.modal-friends02 .modal-chara_p{
	width: 38.3333333%; /* 253 / 660 * 100 */
	right: -1.6%;
	bottom: -6%;
}
@media screen and (min-width: 760px) {
	.modal-friends02 .modal-chara_p{
		width: 28.8981288%; /* 278 / 962 * 100 */
		right: 15%;
		bottom: -8%;
	}
}
/*friends03*/
.modal-friends03 .modal-lead dt{
	width: 41.3%; /* 190 / 460 * 100 */
}
.modal-friends03 .modal-chara_p{
	width: 43.4848484%; /* 287 / 660 * 100 */
	right: -2%;
	bottom: -6.2%;
}
@media screen and (min-width: 760px) {
	.modal-friends03 .modal-chara_p{
		width: 32.5363825%; /* 313 / 962 * 100 */
		right: 11%;
		bottom: -8%;
	}
}
/*friends04*/
.modal-friends04 .modal-lead dt{
	width: 32.3913%; /* 149 / 460 * 100 */
}
.modal-friends04 .modal-chara_p{
	width: 43.1818181%; /* 285 / 660 * 100 */
	right: -4%;
	bottom: -6.5%;
}
@media screen and (min-width: 760px) {
	.modal-friends04 .modal-chara_p{
		width: 34.1995841%; /* 329 / 962 * 100 */
		right: 10%;
		bottom: -8%;
	}	
}

/*koopa01*/
.modal-koopa01 .modal-lead dt{
	width: 51.3%; /* 236 / 460 * 100 */
}
.modal-koopa01 .modal-chara_p{
	width: 82.8787878%; /* 547 / 660 * 100 */
	right: -9%;
	bottom: -6.2%;
}
@media screen and (min-width: 760px) {
	.modal-koopa01 .modal-chara_p{
		width: 62.8898128%; /* 605 / 962 * 100 */
		right: 2%;
		bottom: -8%;
	}
}
/*koopa*/
.modal-koopa .modal-lead dt{
	width: 25.2173913%; /* 116 / 460 * 100 */
}
.modal-koopa .modal-chara_p{
	width: 83.6363636%; /* 552 / 660 * 100 */
	right: -7%;
	bottom: -6.2%;
}
@media screen and (min-width: 760px) {
	.modal-koopa .modal-chara_p{
		width: 60.7%; /* 584 / 962 * 100 */
		right: 8%;
		bottom: -7.8%;
	}
	.is-tablet .modal-koopa .modal-chara_p{
		right: 1%;
	}
}
/*koopa02*/
.modal-koopa02 .modal-lead dt{
	width: 34.347826%; /* 158 / 460 * 100 */
}
.modal-koopa02 .modal-chara_p{
	width: 74%; /* 489 / 660 * 100 */
	right: -8%;
	bottom: -8%;
}
@media screen and (min-width: 760px) {
	.modal-koopa02 .modal-chara_p{
		width: 51.6632%; /* 497 / 962 * 100 */
		right: 7%;
		bottom: -8%;
	}
}
/*koopa03*/
.modal-koopa03 .modal-lead dt{
	width: 88.6956521%; /* 408 / 460 * 100 */
}
.modal-koopa03 .modal-chara_p{
	width: 75.7575757%; /* 500 / 660 * 100 */
	right: -7%;
	bottom: -7%;
}
@media screen and (min-width: 760px) {
	.modal-koopa03 .modal-chara_p{
		width: 65.3846153%; /* 629 / 962 * 100 */
		right: 2.8%;
		bottom: -8%;
	}
}
/*koopa04*/
.modal-koopa04 .modal-lead dt{
	width: 91.9565217%; /* 423 / 460 * 100 */
}
.modal-koopa04 .modal-chara_p{
	width: 79.6969696%; /* 526 / 660 * 100 */
	right: -6%;
	bottom: -6.5%;
}
@media screen and (min-width: 760px) {
	.modal-koopa04 .modal-chara_p{
		width: 64.2411642%; /* 618 / 962 * 100 */
		right: 0%;
		bottom: -8%;
	}
}
/*Jr*/
.modal-jr .modal-lead dt{
	width: 36.73913%; /* 169 / 460 * 100 */
}
.modal-jr .modal-chara_p{
	width: 51%; /* 337 / 660 * 100 */
	right: -4%;
	bottom: -7%;
}
@media screen and (min-width: 760px) {
	.modal-jr .modal-chara_p{
		width: 39.9168399%; /* 384 / 962 * 100 */
		right: 8%;
		bottom: -8%;
	}
}
/* ========================================
	pager sp
	======================================== */
.c-slider__thumb-list{
	padding-top: 6%;
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.c-slider__thumb-list > li{
	width: 13% !important;
	padding: 0 !important;
	margin-bottom: 3%;
}
.c-slider__thumb-list > li a{
	background-size: 100% auto !important;
	background-position: 0 0;
	background-repeat: no-repeat;
}
.c-slider__thumb-list li:nth-child(1) a{background-image: url(../images/story/modal/pager01.png)}
.c-slider__thumb-list li:nth-child(1) a.active{background-image: url(../images/story/modal/pager01__cr.png)}
.c-slider__thumb-list li:nth-child(2) a{background-image: url(../images/story/modal/pager02.png)}
.c-slider__thumb-list li:nth-child(2) a.active{background-image: url(../images/story/modal/pager02__cr.png)}
.c-slider__thumb-list li:nth-child(3) a{background-image: url(../images/story/modal/pager03.png)}
.c-slider__thumb-list li:nth-child(3) a.active{background-image: url(../images/story/modal/pager03__cr.png);}
.c-slider__thumb-list li:nth-child(4) a{background-image: url(../images/story/modal/pager04.png);}
.c-slider__thumb-list li:nth-child(4) a.active{background-image: url(../images/story/modal/pager04__cr.png);}
.c-slider__thumb-list li:nth-child(5) a{background-image: url(../images/story/modal/pager05.png);}
.c-slider__thumb-list li:nth-child(5) a.active{background-image: url(../images/story/modal/pager05__cr.png);}
.c-slider__thumb-list li:nth-child(6) a{background-image: url(../images/story/modal/pager06.png);}
.c-slider__thumb-list li:nth-child(6) a.active{background-image: url(../images/story/modal/pager06__cr.png);}
.c-slider__thumb-list li:nth-child(7) a{background-image: url(../images/story/modal/pager07.png);}
.c-slider__thumb-list li:nth-child(7) a.active{background-image: url(../images/story/modal/pager07__cr.png);}
.c-slider__thumb-list li:nth-child(8) a{background-image: url(../images/story/modal/pager08.png);}
.c-slider__thumb-list li:nth-child(8) a.active{background-image: url(../images/story/modal/pager08__cr.png);}
.c-slider__thumb-list li:nth-child(9) a{background-image: url(../images/story/modal/pager09.png);}
.c-slider__thumb-list li:nth-child(9) a.active{background-image: url(../images/story/modal/pager09__cr.png);}
.c-slider__thumb-list li:nth-child(10) a{background-image: url(../images/story/modal/pager10.png);}
.c-slider__thumb-list li:nth-child(10) a.active{background-image: url(../images/story/modal/pager10__cr.png);}
.c-slider__thumb-list li:nth-child(11) a{background-image: url(../images/story/modal/pager11.png) ;}
.c-slider__thumb-list li:nth-child(11) a.active{background-image: url(../images/story/modal/pager11__cr.png);}
.c-slider__thumb-list li:nth-child(12) a{background-image: url(../images/story/modal/pager12.png) ;}
.c-slider__thumb-list li:nth-child(12) a.active{background-image: url(../images/story/modal/pager12__cr.png);}
.c-slider__thumb-list li:nth-child(13) a{background-image: url(../images/story/modal/pager13.png) ;}
.c-slider__thumb-list li:nth-child(13) a.active{background-image: url(../images/story/modal/pager13__cr.png);}
.c-slider__thumb-list li:nth-child(14) a{background-image: url(../images/story/modal/pager14.png) ;}
.c-slider__thumb-list li:nth-child(14) a.active{background-image: url(../images/story/modal/pager14__cr.png);}
.bx-viewport{
	overflow: visible !important;
	height: auto;
}

.bx-prev{
	background: url(../images/common/prev_w.png) no-repeat;
	background-size: 200% auto !important;
	background-position: 0 0 !important;
	left: 5px !important;
}
.bx-next{
	background: url(../images/common/next_w.png) no-repeat;
	background-size: 200% auto !important;
	background-position: 0 0 !important;
	right: 5px !important;
}
.bx-prev,
.bx-next{
	width: 10.6666666%;
	height: 50px;
}
@media screen and (min-width: 760px) {
	.c-slider__thumb-list{	
		width: 87.4545454%; /* 962 / 1100 * 100 */
		margin-left: auto;
		margin-right: auto;
		padding-top: 3%;
	}
	.bx-prev{
		left: -15px !important;
	}
	.bx-next{
		right: -15px !important;
	}
	.bx-controls-direction > a{
		width: 8.316%;/* 80 /  962 * 100 */
		height: 80px;
		max-width: 80px;
	}
	.bx-prev:hover, .bx-next:hover{
		background-position: 100% 0 !important;
	}
}