img.drag.ui-draggable-dragging{
	z-index: 21;
}
.show {
	display: block !important;
}


.none-before:before{
	content: none !important;
}


.touch_drag.hold{
	display: block;
}
.touch_drag.hold .touch_point_drag{
	display: none;
}
.touch_drag.hold .drag{
	pointer-events: none;
}

.navi{
	position: absolute;
	top: 795px;
	left: 0;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.navi >span{
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50rem;
	background-color: #7e6238;
	border: 5px solid #fcc470;
	margin: 0 13px;
	cursor: pointer;
}
.navi >span.active{
	background-color: #ff4800;
	border-color: #fff;
	width: 30px;
	height: 30px;
	pointer-events: none;
}


.opacity0{
	opacity: 0 !important;
	transition: opacity ease .7s;
}
.opacity1{
	opacity: 1 !important;
	transition: opacity ease .7s;
}


.swiper-slide[data-page="5"] .touch.show{
	opacity: 1 !important;
}

.swiper-slide[data-page="7"] .touch3,
.swiper-slide[data-page="7"] .touch4{
	display: none;
}
.swiper-slide[data-page="7"] .touch3.active,
.swiper-slide[data-page="7"] .touch4.active{
	display: block;
	opacity: 0;
}


.swiper-slide[data-page="7"] .spin1{
	width: 477px;
	height: 467px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url('7_5.webp');
}
.swiper-slide[data-page="7"] .spin1 > img{
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
}




@keyframes spin1 {
  0% { background-image: url('spin1_1.webp');}
  25% { background-image: url('spin1_2.webp');}
  50% { background-image: url('spin1_3.webp');}
  75% { background-image: url('spin1_4.webp');}
  100% { background-image: url('spin1_1.webp');}
}
.swiper-slide[data-page="7"] .spin1.active{
	animation-name: spin1;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}





.swiper-slide[data-page="7"] .spin2{
	width: 598px;
	height: 467px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url('7_6.webp');
}
.swiper-slide[data-page="7"] .spin2 > img{
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
}


@keyframes spin2 {
  0% { background-image: url('spin2_1.webp');}
  25% { background-image: url('spin2_2.webp');}
  50% { background-image: url('spin2_3.webp');}
  75% { background-image: url('spin2_4.webp');}
  100% { background-image: url('spin2_1.webp');}
}
.swiper-slide[data-page="7"] .spin2.active{
	animation-name: spin2;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}



.swiper-slide[data-page="8"] .spin1{
	width: 325px;
	height: 333px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url('7_5.webp');
	background-size: 325px 333px;
}
.swiper-slide[data-page="8"] .spin1{
	animation-name: spin1;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}


.swiper-slide[data-page="8"] .spin2{
	width: 408px;
	height: 333px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url('7_6.webp');
	background-size: 408px 333px;
}
.swiper-slide[data-page="8"] .spin2{
	animation-name: spin2;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}




.swiper-slide[data-page="ending"] .spin1{
	width: 476px;
	height: 471px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url('7_5.webp');
	background-size: 476px 471px;
}
.swiper-slide[data-page="ending"] .spin1{
	animation-name: spin1;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
.swiper-slide[data-page="ending"] .spin2{
	width: 598px;
	height: 471px;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url('7_6.webp');
	background-size: 598px 471px;
}
.swiper-slide[data-page="ending"] .spin2{
	animation-name: spin2;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}



.sbtn{
	cursor: pointer;
}
.sbtn.active{
	pointer-events: none;
}