/*화살표 색*/
.component nav a {
	color: #000000;
}
.component nav a:hover::before {
	color: #533dff;
}

/*공통*/
body {
  background: url(../img/bg.jpg) center top no-repeat;
  overflow: hidden;
	margin: 0;
}
.character {
  position: fixed;
  bottom: 0;
  background: url(../img/character.png) center top no-repeat;
  width: 100%;
  height: 319px;
  z-index: 1000000000000;
	margin: 0;
	padding: 0;
}
.img_shadow {
  -webkit-filter: drop-shadow(5px 5px 5px rgba(0,0,0,0.1));
  filter: drop-shadow(30px 30px 30px rgba(0,0,0,0.1));
  z-index: 1;
}
.poab {
	position: absolute;
  	z-index: 2;
	opacity: 0;
	transition: all .3s;
}

.current .poab {
	opacity: 1;
}

.pagenum {
	position: absolute;
	font-family: arial;
	top: 720px;
	left: 100px;
	width: 50px;
	height: 50px;
	z-index: 1000000000000;
	border-radius: 50%;
	background-color: #e5ee34;
	color: #000;
	font-size: 15px;
	font-weight: bold;
	text-align: center;
	padding-top: 15px;
	box-sizing: border-box;
}


/* -webkit-animation: MotionY2 .2s linear, MotionRotate3_1 2s linear .2s infinite;
animation: MotionY2 .2s linear, MotionRotate3_1 2s linear .2s infinite; */

/*1*/
.current .p1_1 {
	left: 965px;
	top: 653px;
	-webkit-animation: MotionX2 1s linear infinite alternate;
	animation: MotionX2 1s linear infinite alternate;
}
.current .p1_2 {
	left: 403px;
	top: 267px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p1_3 {
	left: 248px;
	top: 367px;
	-webkit-animation: MotionY2 .2s linear;
	animation: MotionY2 .2s linear;
}
.current .p1_4 {
	left: 301px;
	top: 409px;
	-webkit-animation: MotionRotate6 .2s linear;
	animation: MotionRotate6 .2s linear;
}
.current .p1_5 {
	left: 972px;
	top: 557px;
	-webkit-animation: MotionX1 1s linear infinite alternate;
	animation: MotionX1 1s linear infinite alternate;
}

/*2*/
.current .p2_1 {
	left: 747px;
	top: 597px;
	-webkit-animation: MotionY1 1s  alternate infinite;
	animation: MotionY1 1s  alternate infinite;
}
.current .p2_2 {
	left: 114px;
	top: 476px;
	-webkit-animation: MotionX5 2s linear infinite;
	animation: MotionX5 2s linear infinite;
}
.current .p2_3 {
	left: 295px;
	top: 651px;
	-webkit-animation: MotionX1 .4s linear;
	animation: MotionX1 .4s linear;
}
/*3*/
.current .p3_1 {
	left: 664px;
	top: 329px;
	-webkit-animation: MotionY1 1s  alternate infinite;
	animation: MotionY1 1s  alternate infinite;
}
.current .p3_2 {
	left: 107px;
	top: 190px;
	-webkit-animation: MotionX5 2s linear infinite;
	animation: MotionX5 2s linear infinite;
}

/*4*/
.current .p4_1 {
	left: 672px;
	top: 167px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p4_2 {
	left: 797px;
	top: 419px;
	-webkit-animation: MotionX1 .2s linear;
	animation: MotionX1 .2s linear;
}
.current .p4_3 {
	left: 774px;
	top: 534px;
	-webkit-animation: MotionX2 .2s linear;
	animation: MotionX2 .2s linear;
}
.current .p4_4 {
	left: 729px;
	top: 657px;
	-webkit-animation: MotionX1 .2s linear;
	animation: MotionX1 .2s linear;
}

/*5*/
.current .p5_1 {
	left: 710px;
	top: 553px;
	-webkit-animation: MotionX1 1s linear infinite alternate;
	animation: MotionX1 1s linear infinite alternate;
}
.current .p5_2 {
	left: 103px;
	top: 123px;
	-webkit-animation: MotionX2 .2s linear;
	animation: MotionX2 .2s linear;
}

/*6*/
.current .p6_1 {
	left: 672px;
	top: 167px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p6_2 {
	left: 796px;
	top: 419px;
	-webkit-animation: MotionX1 .2s linear;
	animation: MotionX1 .2s linear;
}
.current .p6_3 {
	left: 774px;
	top: 534px;
	-webkit-animation: MotionX2 .2s linear;
	animation: MotionX2 .2s linear;
}
.current .p6_4 {
	left: 725px;
	top: 657px;
	-webkit-animation: MotionX1 .2s linear;
	animation: MotionX1 .2s linear;
}

/*7*/
.current .p7_1 {
	left: 800px;
	top: 553px;
	-webkit-animation: MotionX1 1s linear infinite alternate;
	animation: MotionX1 1s linear infinite alternate;
}
.current .p7_2 {
	left: 90px;
	top: 120px;
	-webkit-animation: MotionX2 .2s linear;
	animation: MotionX2 .2s linear;
}

/*8*/
.current .p8_1 {
	left: 257px;
	top: 165px;
	-webkit-animation: MotionX5 1s linear infinite;
	animation: MotionX5 1s linear infinite;

}
.current .p8_2 {
	left: 656px;
	top: 419px;
	-webkit-animation: MotionX1 .4s linear;
	animation: MotionX1 .4s linear;
}

/*9*/
.current .p9_1 {
	left: 298px;
	top: 260px;
	-webkit-animation: MotionY1 1s  alternate infinite;
	animation: MotionY1 1s  alternate infinite;
}
.current .p9_2 {
	left: 303px;
	top: 177px;
	-webkit-animation: MotionX5 2s linear infinite;
	animation: MotionX5 2s linear infinite;
}
.current .p9_3 {
	left: 163px;
	top: 303px;
	-webkit-animation: MotionX1 .4s linear;
	animation: MotionX1 .4s linear;
}
.current .p9_4 {
	left: 52px;
	top: 495px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p9_5 {
	left: 681px;
	top: 495px;
	-webkit-animation: MotionY2 .2s linear;
	animation: MotionY2 .2s linear;
}

/*10*/
.current .p10_1 {
	left: 418px;
	top: 177px;
	-webkit-animation: MotionX5 2s linear infinite;
	animation: MotionX5 2s linear infinite;
}
.current .p10_2 {
	left: 158px;
	top: 243px;
	-webkit-animation: MotionX1 .4s linear;
	animation: MotionX1 .4s linear;
}
.current .p10_3 {
	left: 103px;
	top: 433px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p10_4 {
	left: 441px;
	top: 433px;
	-webkit-animation: MotionY2 .2s linear;
	animation: MotionY2 .2s linear;
}
.current .p10_5 {
	left: 922px;
	top: 433px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}

/*11*/
.current .p11_1 {
	left: 151px;
	top: 157px;
	-webkit-animation: MotionY2 .2s linear;
	animation: MotionY2 .2s linear;
}
.current .p11_2 {
	left: 421px;
	top: 416px;
	-webkit-animation: MotionX6 2s linear infinite;
	animation: MotionX6 2s linear infinite;
}