/*화살표 색*/
.component nav a {
	color: #fff;
}
.component nav a:hover::before {
	color: #00f9fd;
}

/*공통*/
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: #00f9fd;
	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: 376px;
	top: 340px;
	-webkit-animation: MotionX2 1s linear infinite alternate;
	animation: MotionX2 1s linear infinite alternate;
}
.current .p1_2 {
	left: 171px;
	top: 548px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}

/*2*/
.current .p2_1 {
	left: 162px;
	top: 643px;
	-webkit-animation: MotionY7 .5s  alternate infinite;
	animation: MotionY7 .5s  alternate infinite;
}

/*3*/
.current .p3_1 {
	left: 177px;
	top: 643px;
	-webkit-animation: MotionY7 .5s  alternate infinite;
	animation: MotionY7 .5s  alternate infinite;
}

/*4*/
.current .p4_1 {
	left: 298px;
	top: 40px;
	-webkit-animation: MotionY7 .5s  alternate infinite;
	animation: MotionY7 .5s  alternate infinite;
}

/*5*/
.current .p5_1 {
	left: 403px;
	top: 40px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p5_2 {
	left: 443px;
	top: 210px;
	-webkit-animation: MotionScale3 1s alternate infinite;
	animation: MotionScale3 1s alternate infinite;
}

/*6*/
.current .p6_1 {
	left: 254px;
	top: 613px;
	-webkit-animation: MotionScale3 1s alternate infinite;
	animation: MotionScale3 1s alternate infinite;
}

/*7*/
.current .p7_1 {
	left: 88px;
	top: 622px;
	-webkit-animation: MotionX1 1s linear infinite alternate;
	animation: MotionX1 1s linear infinite alternate;
}

/*8*/
.current .p8_1 {
	left: 240px;
	top: 83px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;

}
.current .p8_2 {
	left: 150px;
	top: 341px;
	-webkit-animation: MotionX1 1s linear infinite alternate;
	animation: MotionX1 1s linear infinite alternate;
}

/*9*/
.current .p9_1 {
	left: 111px;
	top: 499px;
	-webkit-animation: MotionY7 .5s  alternate infinite;
	animation: MotionY7 .5s  alternate infinite;
}

/*10*/
.current .p10_1 {
	left: 229px;
	top: 74px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p10_2 {
	left: 150px;
	top: 341px;
	-webkit-animation: MotionX1 1s linear infinite alternate;
	animation: MotionX1 1s linear infinite alternate;
}

/*11*/
.current .p11_1 {
	left: 414px;
	top: 123px;
	-webkit-animation: MotionY1 .2s linear;
	animation: MotionY1 .2s linear;
}
.current .p11_2 {
	left: 43px;
	top: 253px;
	-webkit-animation: MotionX6 2s linear infinite alternate;
	animation: MotionX6 2s linear infinite alternate;
}
.current .p11_3 {
	left: 417px;
	top: 253px;
	-webkit-animation: MotionX6 2s linear infinite alternate;
	animation: MotionX6 2s linear infinite alternate;
}
.current .p11_4 {
	left: 791px;
	top: 253px;
	-webkit-animation: MotionX6 2s linear infinite alternate;
	animation: MotionX6 2s linear infinite alternate;
}

/*12*/
.current .p12_1 {
	left: 241px;
	top: 206px;
	-webkit-animation: MotionY2 .2s linear;
	animation: MotionY2 .2s linear;
}