@charset "UTF-8";

/* ========================================
	content
======================================== */
.l-contents{
	background: url(../images/adventure/cont_bg.png) repeat-y top center;
	background-size: 100% auto;
}
/* ========================================
	MV
======================================== */
.p-adventure-mv,
.p-adventure-mv_bg{
	position: relative;
	width: 100%;
}
.p-adventure-mv h1{
	position: absolute;
	width: 72%; /* 540 / 750 * 100 */
	top: 25.5319148%; /* 240 / 940 * 100 */
	right: 0;
}
.p-adventure-mv_lead{
	position: absolute;
	width: 62.6666666%; /* 470 / 750 * 100 */
	top: 73.2978723%; /* 689 / 940 * 100 */
	right: 0;
	-webkit-transition-delay: 200ms !important;
	transition-delay: 200ms !important;
}

.item-y{
	visibility: hidden;
	opacity: 0;
	-webkit-transform: translateY(90px);
	transform: translateY(90px);
	transition:
		opacity 1000ms,
		-webkit-transform 1000ms,
		transform 1000ms;
}
.is-animation .item-y,
.no-js .item-y {
	visibility: visible;
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}
.item-x01{
	-webkit-animation: item-x01 5s infinite;
	animation: item-x01 5s ease-in-out infinite;
}
.item-x02{
	-webkit-animation: item-x02 5s infinite;
	animation: item-x02 5s ease-in-out infinite;
	-webkit-animation-delay:3s;
	animation-delay:3s;
}

/* ========================================
	ghost
======================================== */
.item-ghost{
	webkit-animation: ghost 5s infinite;
	animation: ghost 5s infinite;
}
@-webkit-keyframes ghost {
    0% {
			-webkit-transform: translateY(30px);
			transform: translateY(30px);
    }
    50% {
			-webkit-transform: translateY(-10px);
			transform: translateY(-10px);
    }
		100% {
				-webkit-transform: translateY(30px);
				transform: translateY(30px);
			}
}
@keyframes ghost {
    0% {
			-webkit-transform: translateY(30px);
			transform: translateY(30px);
    }
    50% {
			-webkit-transform: translateY(-10px);
			transform: translateY(-10px);
    }
		100% {
				-webkit-transform: translateY(30px);
				transform: translateY(30px);
			}
}

/* ========================================
	point01
======================================== */
.p-adventure-point01,
.p-adventure-point01_bg,
.p-adventure-point01_thumbs{
	position: relative;
}
/*1630*/

.point01_thumbs01_bal{
	position: absolute;
	width: 53.3333333%; /* 400 / 750 * 100 */
	bottom:-10%;
	right: 0;
}
.p-adventure-point01_h{
	position: absolute;
	width: 60.9333333%; /* 457 / 750 * 100 */
	top: 6.6257668%; /* 108 / 1630 * 100 */
	left: 0;
}
.p-adventure-point01_lead{
	position: absolute;
	width: 58%; /* 435 / 750 * 100 */
	top: 25.6441717%; /* 418 / 1630 * 100 */
	left: 0;
	transition-delay: 200ms !important;
}
.p-adventure-key{
	position: absolute;
	width: 37%; /* 278 / 750 * 100 */
	top: 4.5%;
	right: 2%;
}
.p-adventure-point01_thumbs{
	position: absolute;
	width: 100%;
	top: 36.8%; /* 600 / 1630 * 100 */
	left: 0;
}
.point01_thumbs01{
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.point01_thumbs01 li{
	width: 50%;
}
.point01_thumbs01 li:nth-child(3),
.point01_thumbs01 li:nth-child(4){
	transition-delay: 200ms !important;
}
.point01_thumbs01 li:nth-child(5),
.point01_thumbs01 li:nth-child(6){
	margin-top: -3%;
	transition-delay: 400ms !important;
}
/* ========================================
	point02
======================================== */
.p-adventure-point02{
	position: relative;
	width: 100%;
}
.p-adventure-point02_luigi{
	position: absolute;
	width: 75.7333333%; /* 568 / 750 * 100 */
	top: -8%;
	right: -4.5%;
	webkit-animation: luigi 2s infinite;
	animation: luigi 2s infinite;
}
.p-adventure-point02_ghost{
	position: absolute;
	width: 47.3333333%; /* 355 / 750 * 100 */
	top: 22.5%;
	right: -11%;
	-webkit-animation: item-x01 5s infinite;
	animation: item-x01 5s ease-in-out infinite;
}

@-webkit-keyframes item-x01 {
    0% {
			visibility: hidden;
			opacity: 0;
			-webkit-transform: translateX(15%);
			transform: translateX(15%);
    }
    50% {
			visibility: visible;
			opacity: 1;
			-webkit-transform: translateX(-10%);
			transform: translateX(-10%);
    }
	100% {
			visibility: hidden;
			opacity: 0;
			-webkit-transform: translateX(15%);
			transform: translateX(15%);
    }
}
@keyframes item-x01 {
	0% {
			visibility: hidden;
			opacity: 0;
			-webkit-transform: translateX(15%);
			transform: translateX(15%);
    }
    50% {
			visibility: visible;
			opacity: 1;
			-webkit-transform: translateX(-10%);
			transform: translateX(-10%);
    }
	100% {
			visibility: hidden;
			opacity: 0;
			-webkit-transform: translateX(15%);
			transform: translateX(15%);
    }
}
.p-adventure-point02_bg{
	position: absolute;
	width: 81.3333333%;
	top: -3%;
	left: 0;
	z-index: 0;
}
.p-adventure-point02_h{
	position: relative;
	width: 55%; /* 413 / 750 * 100 */
	z-index: 100;
}
.p-adventure-point02_lead{
	position: relative;
	width: 73.8666666%; /* 554 / 750 * 100 */
	transition-delay: 200ms !important;
	z-index: 100;
}
.p-adventure-point02_btn{
	position: relative;
	width: 73.8666666%; /* 554 / 750 * 100 */
	z-index: 100;
}
.p-adventure-point02_bal{
	position: absolute;
	width: 40.8%; /* 306 / 750 * 100 */
	top: 30.8%;
	left: 5%;
}
/* ========================================
	luigi
======================================== */
@-webkit-keyframes luigi {
    0% {	
			-webkit-transform: translateX(-10%);
			transform: translateX(-10%);
    }
    50% {
			-webkit-transform: translateX(0);
			transform: translateX(0);
    }
	100% {
			-webkit-transform: translateX(-10%);
			transform: translateX(-10%);
    }
}
@keyframes luigi {
    0% {	
			-webkit-transform: translateX(-10%);
			transform: translateX(-10%);
    }
    50% {
			-webkit-transform: translateX(0);
			transform: translateX(0);
    }
	100% {
			-webkit-transform: translateX(-10%);
			transform: translateX(-10%);
    }
}
/* ========================================
	muddy
======================================== */
.p-adventure-muddy{
	position: relative;
	width: 100%;
}
.p-adventure-muddy_bg{
	position: relative;
}
.p-adventure-muddy_h{
	position: absolute;
	width: 81.8666666%; /* 614 / 750 * 100 */
	top: 8%;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.p-adventure-muddy_p{
	position: absolute;
	width: 79.3333333%; /* 595 / 750 * 100 */
	bottom: -5%;
	right: 7%;
	z-index: 100;
}
.p-adventure-muddy_thumbs{
	position: absolute;
	width: 83.33333333%; /* 625 / 750 * 100 */
	top: 17%;
	left: 0;
	right: 0;
	margin: 0 auto;
}

/* ========================================
	point03
======================================== */
.p-adventure-point03{
	margin-top: 5%;
}
.p-adventure-point03,
.p-adventure-point03_bg{
	position: relative;
}
.p-adventure-point03_h{
	position: absolute;
	width: 49.8666666%; /* 374 / 750 * 100 */
	top: 10%; /* 170 / 1696 * 100 */
	left: 0;
	z-index: 100;
}
.p-adventure-point03-gh01{
	position: absolute;
	width: 77.4666666%; /* 581 / 750 * 100 */
	top: -3%;
	left: 19.3333333%; /* 145 / 750 * 100 */
}
.p-adventure-point03-gh02{
	position: absolute;
	width: 24.1333333%; /* 181 / 750 * 100 */
	top: 24%;
	left: 68%;
	transition-delay: -400ms !important;
	animation-delay: -2000ms !important;
}
.p-adventure-retry{
	position: absolute;
	width: 100%;
	top: 39.5%; /* 670 / 1696 * 100 */
	left: 0;
}
.p-adventure-retry_bg{
	position: relative;
}
.p-adventure-retry_h{
	position: absolute;
	width: 61.3333333%; /* 460 / 750 * 100 */
	top: 7.5%;
	left: 0;
	right: 0;
	margin: 0 auto;	
}
.p-adventure-retry_p,
.p-adventure-retry_lead,
.p-adventure-retry_btn{
	position: absolute;
	width: 67.6%; /* 507 / 750 * 100 */	
	left: 0;
	right: 0;
	margin: 0 auto;	
}
.p-adventure-retry_p{
	top: 25%;
}
.p-adventure-retry_lead{
	top: 56%;
}
.p-adventure-retry_btn{
	top: 77%;
}

/* ========================================
	horror
======================================== */
.p-adventure-horror{
	margin:6% 0 0 0;
	padding-bottom: 7%;
}
.p-adventure-horror_in{
	position: relative;
	width: 100%;
}
.p-adventure-horror_lead{
	position: absolute;
	width: 65.4666666%; /* 491 / 750 * 100 */
	top: 6.5%;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.p-adventure-horror_game{
	width: 78.1333333%; /* 586 / 750 * 100 */
	position: absolute;
	top: 14.8975791%; /* 240 / 1611 * 100 */
	left: 12%;
}
.p-adventure-horror_thumbs{
	position: absolute;
	width: 85.3333333%; /* 640 / 750 * 100 */
	top: 55%;
	left: 0;
	right: 0;
	margin: 0 auto;
}

/* ========================================
	modal
======================================== */
.p-adventure-modal_wrap{
	position: relative;
	width: 100%;
}
.p-adventure-modal_bg{
	position: relative;
}
.p-adventure-modal_wrap h2{
	position: absolute;
	width: 81.7333333%; /* 613 / 750 * 100 */	
	top: 7.5%;
	left: 10.6666666%; /* 80 / 750 * 100 */
	z-index: 100;
}
.p-adventure-modal_p{
	position: absolute;
	width: 55.7333333%; /* 418 / 750 * 100 */
	top: 28%;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.p-adventure-modal_lead{
	position: absolute;
	width: 79.6%; /* 597 / 750 * 100 */	
	top: 69.5%;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.l-modal_btn__close{
	width: 40%; /* 300 / 750 * 100 */	
	margin: 3% auto 0 auto;
}