@charset "utf-8";

html{font-size:10px;}
.oh{overflow:hidden;}
.container {width:100%; margin:0 auto; max-width:1000px; position:relative;}
.cf:after{content:''; display: block; clear:both; visibility:hidden; height:0px;}
.eventName {max-width:2560px;margin:0 auto;text-align:center;letter-spacing:-0.5px;line-height:1.5;background:#f6f6f6;}
.eventName .container {max-width:1000px; height:100%; margin:0 auto; position:relative; height:100%}
.eventName .content {padding: 8% 0; text-align: center;}



.con01 {position:relative; height:1174px; background:url('images_hk/con01_bg.jpg') center top / cover}
.con02 {position:relative; height:1615px; background:url('images_hk/con02_bg.jpg') center top / cover}
.con03 {position:relative; height:2637px; background:url('images_hk/con03_bg.jpg') center top / cover}
.con04 {position:relative; height:2624px; background:url('images_hk/con04_bg.jpg') center top / cover}
.con05 {position:relative; height:5185px; background:url('images_hk/con05_bg.jpg') center top / cover}

.con01 h2 {position:absolute; top:-9999px; left:-9999px; font-size:0;}

/* float_banner */
.float_banner{position:fixed; right:0; top:150px; width:150px; z-index:1}
.float_btn{position:fixed; right:0; top:150px; display:inline-block; font-size:0; z-index:1}
.float_btn img{width:120px; display:block}
.float_btn a{position:absolute; left:60%; width:50%; height:15%; text-indent:-9999px;}
.float_btn a.link01{top:56%}
.float_btn a.link02{top:73%; left:34%}
/* video */
.con_video {position:relative; padding:6rem 20px; background: #f4f4f4}
.video_wrap {position:relative; max-width: 986px; margin:auto}
.video_wrap > div {padding-top:56.25%;}
.video_wrap > div iframe{width:100%; height:100%; position:absolute; left:0; top:0}
/* link */
.link01{position: absolute; width:32%; height:1.5%; left:50%; top:14.7%; transform: translateX(-50%); text-indent:-9999px;}
.link02{position: absolute; width:32%; height:1.5%; left:50%; top:32.4%; transform: translateX(-50%); text-indent:-9999px;}
/* gif */
.gif01{position:absolute; width:45%; right: 4%; top:13.8%;}



@media screen and (max-width: 1000px){
	html {font-size:8px;}
	
	.eventName .container{width:100%; height:100%; position:absolute; left:0; top:0}
	
	.con01{height:auto; padding:51% 0;}
	.con02{height:auto; padding:73% 0;}
	.con03{height:auto; padding:89% 0;}
	.con04{height:auto; padding:89% 0;}
	.con05{height:auto; padding:180% 0;}
	
	.float_btn {top:70px}
	
	.gif01{position:absolute; width:31%;right:19%;top: 13.2%;}
	
}
	

@media screen and (max-width: 768px){
	.float_btn{width:50px; top:80px;}
	.link01{width:20%;}
	.link02{width:20%;}
}