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

body { background:black; color:#ffffff; }
body, textarea, select { font-family:Montserrat, 微軟正黑體, Microsoft Jhenghei, Verdana, Helvetica, Arial, sans-serif; }
body, textarea { font-size:14px; }
select { font-size:.8em; }
body, html, *, div { margin:0; padding:0; box-sizing:border-box; }
body, html { width:100%; height:100%; position:relative; }
table { border:none; border-collapse:collapse; border-spacing:0; }
img { border:none; }
a { text-decoration:none; color:white; }
a:hover { text-decoration:none; color:#ef5c21; }
p { font-size:1em; margin-bottom:1.3em; line-height:1.3em; 2text-align:justify; text-justify:inter-ideograph; }

@font-face {
  font-family: 'Montserrat';
  src: url('font-face/Montserrat-Bold.eot'); /* IE9 Compat Modes */
  src: url('font-face/Montserrat-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font-face/Montserrat-Bold.woff') format('woff'), /* Modern Browsers */
       url('font-face/Montserrat-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('font-face/Montserrat-Bold.svg#2eb9a020d90588d099da01ff1a93c338') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  700;
}

@font-face {
  font-family: 'Montserrat';
  src: url('font-face/Montserrat-Light.eot'); /* IE9 Compat Modes */
  src: url('font-face/Montserrat-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font-face/Montserrat-Light.woff') format('woff'), /* Modern Browsers */
       url('font-face/Montserrat-Light.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('font-face/Montserrat-Light.svg#c152625b71562a7bb7b752375273b2d5') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  200;
}

@font-face {
  font-family: 'Montserrat';
  src: url('font-face/Montserrat-Regular.eot'); /* IE9 Compat Modes */
  src: url('font-face/Montserrat-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('font-face/Montserrat-Regular.woff') format('woff'), /* Modern Browsers */
       url('font-face/Montserrat-Regular.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('font-face/Montserrat-Regular.svg#95d90f2cd2aa64bdfee0e9f34c516e71') format('svg'); /* Legacy iOS */
       
  font-style:   normal;
  font-weight:  400;
}

@font-face {
	font-family:"BebasNeue";
	src:url('font-face/bebasneue-webfont.eot');
	src:url('font-face/bebasneue-webfont.eot?#iefix') format('embedded-opentype'),
		url('font-face/bebasneue-webfont.woff') format('woff'),
		url('font-face/bebasneue-webfont.ttf') format('truetype'),
		url('font-face/bebasneue-webfont.svg#BebasNeue') format('svg');
		
  font-style:   normal;
  font-weight:  normal;
}





/* UTIL */

.clr { clear:both; height:0; }
.floatL { float:left; }
.floatR { float:right; }
.last { margin:0; }
.hide { display:none; }




/* ESSENTIAL */

.giveaway { position:relative; text-align:center; }

.giveaway .contents { z-index:2; position:relative; width:100%; height:100%; max-width:1630px; display:inline-block; vertical-align:top; padding:0 28px 48px; }
.giveaway .contents .hdr { padding:70px 0 28px; position:relative; width:100%; float:left; }
.giveaway .contents .hdr .logo { width:283px; position:relative; float:left; }
.giveaway .contents .hdr .logo img { width:100%; float:left; }
.giveaway .contents .hdr .backtoindex { float:right; font-size:16px; cursor:pointer; }
.giveaway .contents .hdr .fa { margin-right:5px; }

.giveaway .contents .left { width:31.533%; padding-right:10px; float:left; position:relative; }
.giveaway .contents .left .cover { width:100%; float:left; margin-bottom:28px; }
.giveaway .contents .left .cover img { width:100%; float:left; }

.badges { width:100%; float:left; text-align:left; margin-bottom:28px; }
.badges .badge { width:33.333%; width:50%; float:left; padding-right:18px; }
.badges .badge label { border-bottom:1px solid white; padding:3px 0 5px; width:100%; float:left; margin-bottom:8px; margin-bottom:12px; }
.badges .badge p { font-size:24px; font-weight:200; margin:0; float:left; line-height:1.1em; }
.badges .badge.code p { font-family:BebasNeue; letter-spacing:3px; line-height:1.6em; line-height:1.1em; word-break:break-all; }
.badges .badge.code p.finish { letter-spacing:normal; display:none; }

.badges .badge .sm { font-size:32px; display:inline-block; }
.badges .badge .sm a { margin-right:10px; cursor:pointer; }
.badges .badge .sm a .fa { vertical-align:top; }

.support { width:100%; float:left; text-align:left; margin-bottom:28px; }
.support p { margin-bottom:10px; }
.support a { width:100%; max-width:192px; display:inline-block; vertical-align:top; }
.support a img { width:100%; float:left; }

.giveaway .contents .right { width:68.467%; position:relative; float:left; }

.content_box { width:100%; background-color:rgba(0,0,0,0.7); position:relative; float:left; padding:48px 36px 28px; }
.content_box + .content_box { margin-top:10px; }
.content_box .bar { height:10px; background-color:#e63722; position:absolute; top:0; right:0; left:36px; }
.content_box .title { width:165px; position:absolute; right:35px; top:48px; }

.content_box .text { position:relative; float:left; text-align:left; width:100%; margin-bottom:18px; }
.content_box .text h1 { font-weight:normal; color:#ef5c21; font-size:36px; padding-right:200px; line-height:1.1em; letter-spacing:-1px; }
.content_box .text .divider { width:100%; height:7px; background:url('../img/bg-divider@2x.png') left center no-repeat; background-size:34px; margin:12px 0 48px; }
.content_box .text p { font-size:16px; line-height:1.6em; }
.content_box .text .trailer { width:100%; max-width:500px; }
.content_box .text hr { width:100%; border:0; height:1px; background-color:#e5e5e5; display:inline-block; vertical-align:top; margin:18px 0; }
.content_box .text .code { float:left; }
.content_box .text .code * { display:inline-block; vertical-align:middle; margin:0; }
.content_box .text .code label { margin-right:12px; }
.content_box .text .code p { font-family:BebasNeue; letter-spacing:3px; line-height:1.6em; font-size:24px; }
.content_box .text .terms { margin-top:18px; }
.content_box .text .terms h1 { font-size:14px; margin-bottom:18px; float:left; width:100%; }
.content_box .text .terms ol { font-size:14px; margin-left:18px; float:left; }
.content_box .text .terms ol li { line-height:1.6em; margin-bottom:4px; }

.content_box .specialthanks { position:relative; float:left; text-align:right; width:100%; }
.content_box .specialthanks * { display:inline-block; vertical-align:bottom; margin:0; }
.content_box .specialthanks p { margin-right:8px; font-size:12px; }
.content_box .specialthanks img { width:117px; }

.content_box .finish { width:100%; display:none; float:left; }

.content_box.details { background-color:white; color:#666666; }
.content_box.details .text > h1 { font-size:24px; padding:0; line-height:1.6em; margin-bottom:10px; }
.content_box.details .text strong { color:#e63722; font-weight:normal; }


.disable .badge.code p { display:none; }
.disable .badge.code p.finish { display:block; }
.disable .content_box.details { color:lightgray; }
.disable .content_box.details h1 { color:lightgray; }
.disable .content_box.details strong { color:lightgray; }
.disable .content_box.details .code { display:none; }
.disable .content_box.details .bar { background-color:lightgray; }
.disable .content_box.details .finish { display:block; color:red; }


.tab_group { width:100%; float:left; position:relative; }
.tab_group .tabs { width:100%; float:left; position:relative; font-size:28px; margin-bottom:18px; }
.tab_group .tabs a { text-decoration:none; cursor:pointer; padding:4px 12px; border-radius:8px; display:inline-block; vertical-align:top; }
.tab_group .tabs a.active { background-color:#ef5c21; }
.tab_group .tabs a.active:hover { color:white; }
.tab_group .pages { width:100%; float:left; position:relative; }
.tab_group .pages .page { display:none; }
.tab_group .pages .page.active { display:block; }
.tab_group .pages .page ol { font-size:16px; margin-left:28px; }
.tab_group .pages .page ol li { line-height:1.6em; margin-bottom:8px; }

.copyright { float:right; position:relative; font-size:14px; margin-top:32px; line-height:1.6em; }

.giveaway .bg {
	z-index:1; position:fixed; top:0; left:0; right:0; bottom:0; background:url('../img/poster@2x.jpg') center center no-repeat; background-size:cover;
	filter:blur(10px) brightness(40%); -webkit-filter:blur(10px) brightness(40%); -ms-filter:blur(10px) brightness(40%);
	transform:scale(1.2); -webkit-transform:scale(1.2); -ms-transform:scale(1.2);
}


@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 

}
@media screen and (max-width: 1319px) {
	.badges .badge p { font-size:18px; }
	.badges .badge .sm { font-size:24px; }
}
@media screen and (max-width: 1215px) {
	.giveaway .contents .left { width:40%; }
	.giveaway .contents .right { width:60%; }
}
@media screen and (min-width: 960px) {
	
}
@media screen and (max-width: 959px) {
	.badges { width:66.666%; margin-bottom:18px; }
	.support { width:33.333%; text-align:center; }
	
	.giveaway .contents .hdr { padding-top:36px; }
	
	.giveaway .contents .left { width:100%; padding:0; }
	.giveaway .contents .left .cover { width:100%; text-align:center; }
	.giveaway .contents .left .cover img { width:100%; max-width:384px; float:none; }
	
	.giveaway .contents .right { width:100%; }
}
@media screen and (max-width: 819px) {

}
@media screen and (max-width: 767px) {
	.giveaway .contents .hdr .logo { width:60%; max-width:283px; }
	.giveaway .contents .hdr .backtoindex { font-size:14px; }
	
	.badges .badge { width:100%; margin-bottom:18px; }
	.badges .badge.code p { line-height:1; }
	
	.content_box { padding-top:28px; }
	.content_box + .content_box { margin-top:28px; }
	.content_box .title { width:165px; position:relative; top:auto; right:auto; margin:10px 0 28px; }
	.content_box .text h1 { padding-right:0; font-size:28px; }
	.content_box .text .divider { margin-bottom:18px; }
	.content_box .text p { font-size:14px; }
	
	.content_box .specialthanks { text-align:center; }
	.content_box .specialthanks p { width:100%; margin-bottom:10px; }
	
	.content_box.details { padding-top:36px; }
	.content_box.details .text > h1 { line-height:1.3em; font-size:24px; }
	
	.tab_group .tabs { font-size:24px; text-align:center; }
	
	.copyright { text-align:left; width:100%; }
}
@media screen and (max-width: 669px) {
	.badges { width:100%; }
	.support { width:100%; }
	
	.content_box { padding-left:18px; padding-right:18px; }
	.content_box .bar { left:18px; }
}
@media screen and (max-width: 479px) {
	.giveaway .contents { padding-left:10px; padding-right:10px; }
}
@media screen and (max-width: 349px) {
	
}