@charset "utf-8";
/* CSS Document */


body{
	background:#FFFFFF;
	margin:0px 0px;
	padding:0px 0px;
}
a{
	text-decoration:none;
	outline:0;
}
.head{
	background:#FFF;
    margin: 0px auto;
	padding: 0px auto;
	height:auto;
	border-bottom:#f0f0f0 2px solid;
}
.content{
	background:url(images/bg.jpg) no-repeat center top;
	margin: 0px auto;
	padding: 0px auto;
	overflow:hidden;
}
.content01{
	background-image:url(images/black.png),url(images/ham.png),url(images/beer.png), url(images/bg2.jpg), url(images/bg3.jpg);
	background-repeat:no-repeat, no-repeat, no-repeat, no-repeat, repeat-y;
	background-position: center bottom, 250px 300px, 1300px 500px, center top, center top;
	margin: 0px auto;
	padding: 0px auto;
}
.content01 >table{
	border-left:5px #FFFFFF solid;
	border-right:5px #FFFFFF solid;
}
.footer{
	display:block;
	margin: 0px auto;
	padding: 0px auto;
}
.nav{
	display:block;
	position:fixed;
	background:url(images/nav_bg.png) center top;
	width:100%;
	height:68px;
	bottom:0px;
	z-index:999;
}
.move_wrap{
	display:block;
	position:relative;
	width:950px;
	height:1006px;
	margin:0 auto;
	padding:0 auto;
}
.act1,.act2,.act3,.act4,.act5,.act6{
	display: block;
	position: absolute;
}
.act1{
	background-image: url(images/act_01.png);
	width: 519px;
	height: 178px;
	left: 126px;
	top: 460px;
	z-index: 10;
	animation-name: move;
	animation-iteration-count: 1;
	animation-duration: 1s;
	-webkit-animation-name: move;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 1s;
	-moz-animation-name: move;
	-moz-animation-iteration-count: 1;
	-moz-animation-duration: 1s;
}
@keyframes move{
	0%{
		opacity:0;
		left: 300px;
	}
	100%{
		opacity:1;
		left: 126px;
	}
}

.act2{
	background-image: url(images/act_02.png);
	width: 432px;
	height: 52px;
	z-index: 9;
	left: 255px;
	top: 640px;
	animation-name: dd;
	animation-iteration-count: 1;
	animation-duration: 1s;
	-webkit-animation-name: dd;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 1s;
	-moz-animation-name: dd;
	-moz-animation-iteration-count: 1;
	-moz-animation-duration: 1s;
}
@keyframes dd{
	0%{
		opacity:0;
		left: 300px;
	}
	30%{
		opacity:0;
		left: 300px;
	}
	100%{
		opacity:1;
		left: 255px;
	}
}
.act3{
	background-image: url(images/act_03.png);
	width: 432px;
	height: 47px;
	z-index: 8;
	left: 254px;
	top: 693px;
	animation-name: dd2;
	animation-iteration-count: 1;
	animation-duration: 1s;
	-webkit-animation-name: dd2;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 1s;
	-moz-animation-name: dd2;
	-moz-animation-iteration-count: 1;
	-moz-animation-duration: 1s;
}
@keyframes dd2{
	0%{
		opacity:0;
		left: 300px;
	}
	50%{
		opacity:0;
		left: 300px;
	}
	100%{
		opacity:1;
		left: 254px;
}
}
.act4{
	background-image: url(images/act_04.png);
	width: 301px;
	height: 161px;
	z-index: 9;
	left: 28px;
	top: 812px;
}
.act5{
	background-image: url(images/act_05.png);
	width: 321px;
	height: 101px;
	z-index: 8;
	left: 328px;
	top: 814px;
}
.act6{
	background-image: url(images/act_06.png);
	width: 293px;
	height: 161px;
	z-index: 11;
	left: 648px;
	top: 814px;
}

.act1 a,.act2 a,.act3 a,.act4 a,.act5 a,.act6 a{
	display: block;
	width:100%;
	height:100%;
	cursor:pointer;
}
.act1:hover{background-image:url(images/act_01-1.png);}
.act2:hover{background-image:url(images/act_02-1.png);}
.act3:hover{background-image:url(images/act_03-1.png);}
.act4:hover{background-image:url(images/act_04-1.png);}
.act5:hover{background-image:url(images/act_05-1.png);}
.act6:hover{background-image:url(images/act_06-1.png);}

.light,.light2,.light3,.light4,.light5{
	display: block;
	position: absolute;
	background-image: url(images/light.png);
	width: 120px;
	height: 122px;
	z-index: 2;
}
.light{
	left: 552px;
	top: -25px;
	animation-name: bb;
	animation-iteration-count: infinite;
	animation-duration: 2s;
	-webkit-animation-name: bb;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 2s;
	-moz-animation-name: bb;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 2s;
}
@keyframes bb{
	0%{transform:scale(1);}
	80%{transform:scale(1);}
	85%{transform:scale(1.2);}
	90%{transform:scale(1);}
	95%{transform:scale(1.2);}
	100%{transform:scale(1);}
}
.light2{
	right: 538px;
	top: 2px;
	animation-name: bb2;
	animation-iteration-count: infinite;
	animation-duration: 2s;
	-webkit-animation-name: bb2;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 2s;
	-moz-animation-name: bb2;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 2s;
}
@keyframes bb2{
	0%{transform:scale(1);}
	85%{transform:scale(1);}
	89%{transform:scale(1.2);}
	95%{transform:scale(1);}
	98%{transform:scale(1.2);}
	100%{transform:scale(1);}
}
.light3{
	right: -145px;
	top: 2px;
	animation-name: bb3;
	animation-iteration-count: infinite;
	animation-duration: 2s;
	-webkit-animation-name: bb3;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 2s;
	-moz-animation-name: bb3;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 2s;
}
@keyframes bb3{
	0%{transform:scale(1);}
	60%{transform:scale(1);}
	65%{transform:scale(1.2);}
	70%{transform:scale(1);}
	75%{transform:scale(1.2);}
	80%{transform:scale(1.2);}
	100%{transform:scale(1);}
}
.light4{
	right: -328px;
	top: 77px;
	animation-name: bb4;
	animation-iteration-count: infinite;
	animation-duration: 2s;
	-webkit-animation-name: bb4;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 2s;
	-moz-animation-name: bb4;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 2s;
}
@keyframes bb4{
	0%{transform:scale(1);}
	80%{transform:scale(1);}
	85%{transform:scale(1.2);}
	90%{transform:scale(1);}
	100%{transform:scale(1);}
}
.light5{
	left: -186px;
	top: -13px;
	animation-name: bb5;
	animation-iteration-count: infinite;
	animation-duration: 2.5s;
	-webkit-animation-name: bb5;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 2.5s;
	-moz-animation-name: bb5;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 2.5s;
}
@keyframes bb5{
	0%{transform:scale(1);}
	80%{transform:scale(1);}
	85%{transform:scale(1.2);}
	90%{transform:scale(1);}
	95%{transform:scale(1.2);}
	100%{transform:scale(1);}
}