@charset "UTF-8";
* { font-family: Meiryo, "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", sans-serif; }
html,
body {
	background-color: #000;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}
header {
	background-color: #000;
	width: 100%;
	min-width: 1200px;
	position: relative;
	z-index: 400;
}
header a {
	color: #FFF;
	font-size: 16px;
	font-weight: 900;
	text-decoration: none;
}
header a:hover {
	color: #a0d9f7;
	text-decoration: none;
}
.headercontent {
	width: 1200px;
	height: 40px;
	margin: 0 auto;
}
.headertext {
	float: left;
	margin-top: 12px;
	margin-left: 16px;
}
.headerfb { float: right; }
/*wrapper*/
.wrapper {
	background: url("../images/bg.jpg") center 0px no-repeat;
	width: 100%;
	max-width: 1920px;
	min-width: 1200px;
	/*min-height: 860px;*/
	position: relative;
	margin: 0 auto;/*overflow: hidden;*/
}
.title {
	position: relative;
	margin: 0 auto;
	overflow: hidden;
	height: 740px;
}
.logo {
	background: url("//landing.mangot5.com/template/au/event/common/logo.png") 0 0 no-repeat;
	width: 175px;
	height: 97px;
	font-size: 0px;
	position: absolute;
	left: 50%;
	margin-left: -545px;
	top: 5px;
	cursor: pointer;
}
.apply {
	background: url("../images/apply.png") 0 0 no-repeat;
	width: 480px;
	height: 270px;
	font-size: 0px;
	position: absolute;
	left: 50%;
	margin-left: 44px;
	top: 457px;
	cursor: pointer;
	animation: applymov 1.2s 0s infinite ease;
}
@keyframes applymov {  0% {
 top:467px;
}
 50% {
 top:457px;
}
 100% {
 top:468px;
}
}
/*content*/
.content {
	position: relative;
	margin:-40px auto 80px;
	overflow: hidden;
	text-align: center;
	width:1202px;
}
/*btn*/
.top {
	position: fixed;
	bottom: 103px;
	left: 50%;
	margin-left: 620px;
	cursor: pointer;
	z-index: 20;
	display: none;
}
.btn {
	background-image: url("../images/btn.png");
	width: 215px;
	height: 140px;
	background-repeat: no-repeat;
	z-index: 10;
	display: inline-block;
}
.btn1 { background-position: 0 0; }
.btn1:hover,
#tab-1:target ~ #tab > ul li:nth-child(1) a { background-position: 0 -140px; }
.btn2 { background-position: 0 -280px; }
.btn2:hover,
#tab-2:target ~ #tab > ul li:nth-child(2) a { background-position: 0 -420px; }
.btn3 { background-position: 0 -560px; }
.btn3:hover,
#tab-3:target ~ #tab > ul li:nth-child(3) a { background-position: 0 -700px; }
.btn4 { background-position: 0 -840px; }
.btn4:hover,
#tab-4:target ~ #tab > ul li:nth-child(4) a { background-position: 0 -980px; }
.btn5 { background-position: 0 -1120px; }
.btn5:hover,
#tab-5:target ~ #tab > ul li:nth-child(5) a { background-position: 0 -1260px; }
#tab-1,
#tab-2,
#tab-3,
#tab-4,
#tab-5 { font-size: 0; }
#tab { width: 100%; }
/* 頁籤ul */
#tab>ul {
	overflow: hidden;
	margin: 0 auto -30px;
	padding: 0;
	width:1075px;
	position:relative;
	z-index:1;
}
#tab>ul>li {
	list-style-type: none;
	float:left;
}
#tab>ul>li>a { display:block; text-indent:-9999px;}
/*頁籤div內容*/
#tab>div {
	clear: both;
	height: 0;
	overflow: hidden;
	visibility: hidden;/*  -webkit-transition:all .4s ease-in-out;
    -moz-transition:all .4s ease-in-out;
    -ms-transition:all .4s ease-in-out;
    -o-transition:all .4s ease-in-out;
    transition:all .4s ease-in-out;*/
}
/* span:target */
#tab-1:target,
#tab-2:target,
#tab-3:target,
#tab-4:target,
#tab-5:target { }
/*第一筆的底色*/
span:target ~ #tab > ul li:first-child a { }
span:target ~ #tab > div:first-of-type {
	visibility: hidden;
	height: 0;
}
/*頁籤變換&第一筆(第1個，而且是li)*/
span ~ #tab > ul li:first-child a,
#tab-1:target ~ #tab > ul li a[href$="#tab-1"],
#tab-2:target ~ #tab > ul li a[href$="#tab-2"],
#tab-3:target ~ #tab > ul li a[href$="#tab-3"],
#tab-4:target ~ #tab > ul li a[href$="#tab-4"],
#tab-5:target ~ #tab > ul li a[href$="#tab-5"] { }
/*頁籤內容顯示&第一筆(第1個div)*/
span ~ #tab > div:first-of-type,
#tab-1:target ~ #tab > div.tab-content-1,
#tab-2:target ~ #tab > div.tab-content-2,
#tab-3:target ~ #tab > div.tab-content-3,
#tab-4:target ~ #tab > div.tab-content-4,
#tab-5:target ~ #tab > div.tab-content-5 {
	visibility: visible;
	height: auto;
}
.tab-content-1,
.tab-content-2,
.tab-content-3,
.tab-content-4,
.tab-content-5 { /*	position: relative;
    left: 50%;
    margin-left: -612px;*/
}
.page2_apply {
	position: absolute;
	top: 600px;
	left: 50%;
	margin-left: -138px;
}
.page2_apply:hover {
	top: 603px;
	margin-left: -135px;
}
.page5_gift1 {
	position: absolute;
	/*    width: 243px;
    height: 481px;*/
	width: 198px;
	height: 392px;
	top: 315px;
	left: 50%;
	margin-left: 155px;
	border-radius: 20px;
}
.page5_gift2 {
	position: absolute;
	/*    width: 243px;
    height: 481px;*/
	width: 198px;
	height: 392px;
	top: 315px;
	left: 50%;
	margin-left: 358px;
	border-radius: 20px;
}
.page5_gift3 {
	position: absolute;
	width: 85px;
	height: 84px;
	top: 300px;
	left: 50%;
	margin-left: 313px;
}
/*footer*/
.footer {
	background: url("../images/footer.png")top center no-repeat;
	height: 100px;
	position: relative;
	margin: 0px auto 0px;
	background-color:#fff;
}