@charset "utf-8";
/* CSS Document */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
.clearfix:before, .clearfix:after { display: table; content: " "; }
.clearfix:after { clear: both; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/**********************************************************************************************************/
body, input { font-family: "微軟正黑體", Helvetica, Arial, sans-serif; }
.wrap { position: relative; }
.wrap > div { position: relative; background-position: center top; background-repeat: no-repeat; }
.nav { height: 100px; position: absolute; z-index: 10; width: 100%; }
.nav .logo { float: left; margin-top: 20px; margin-left: 10px; }
.nav .qlink { float: right; margin-top: 20px; margin-right: 10px; }
.nav .qlink a { transform: scale(.9); transition: all .3s; background-image: url(../images/btn_top.png); width: 80px; height: 62px; display: inline-block; margin: 0 5px; text-indent: -9999px; }
.nav .qlink a:hover { transform: scale(1); }
.nav .qlink a.join { background-position: left top; }
.nav .qlink a.login { background-position: right top; }
.header { height: 1150px; padding-top: 1px; background-image: url(../images/header.jpg); }
.content { height: 1560px; padding-top: 1px; background-image: url(../images/content.jpg); }
.footer { height: 100px; background-image: url(../images/footer.jpg); }
.header h1 { text-indent: -9999px; position: absolute; }
.header .situation { width: 300px; height: 42px; color: #fff; text-align: center; font-size: 24px; line-height: 42px; background-color: #a22d1b; border-radius: 5px; margin: 524px auto 0; }
.header .situation span.number { margin-right: 5px; }
.content .event { background-image: url(../images/event.png);border-radius: 10px; width: 960px; height: 420px; background-color: rgba(255,255,255,.15); margin: 750px auto 0; position: relative; }
.content .event.event_complete { background-image: url(../images/event_complete.png);}
.content .event h3 { height: 36px; margin-bottom: 20px; text-indent: -9999px; }
.content .event.event_complete h3 { padding:100px 420px 100px 120px; height:auto; margin-bottom:0; text-align:center; line-height:2em; text-indent: 0; color:#fff; font-size:25px; font-weight:bold;} 
.btngroup,.formblock { width: 740px; margin: 0 auto 60px; }
.formblock { padding: 0 10px;}
label.btn span { font-size: 1.5em; margin-left: .35em; }
label input[type="radio"] ~ i.fa.fa-circle-o { display: inline; }
label input[type="radio"] ~ i.fa.fa-dot-circle-o { display: none; }
label input[type="radio"]:checked ~ i.fa.fa-circle-o { display: none; }
label input[type="radio"]:checked ~ i.fa.fa-dot-circle-o { color: #ffff00; display: inline; }
label:hover input[type="radio"] ~ i.fa { color: #fff; }
label input[type="checkbox"] ~ i.fa.fa-square-o { color: #c8c8c8; display: inline; }
label input[type="checkbox"] ~ i.fa.fa-check-square-o { display: none; }
label input[type="checkbox"]:checked ~ i.fa.fa-square-o { display: none; }
label input[type="checkbox"]:checked ~ i.fa.fa-check-square-o { color: #fff; display: inline; }
label:hover input[type="checkbox"] ~ i.fa { color: #fff; }
div[data-toggle="buttons"] label:hover, div[data-toggle="buttons"] label.active { background-color: rgba(255,255,0,.3); }
div[data-toggle="buttons"] label { display: inline-block; padding: 0 0 0 1.5em; text-align: left; font-weight: normal; white-space: nowrap; vertical-align: top; cursor: pointer; background-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; width: 220px; height: 80px; line-height: 74px; border-radius: 10px; border: 2px solid #ffffff; margin: 10px; font-size: 14px; color: #fff; }
div[data-toggle="buttons"] label:hover { color: #fff; }
div[data-toggle="buttons"] label:active, div[data-toggle="buttons"] label.active { -webkit-box-shadow: none; box-shadow: none; border-color: #ffff00; }
div[data-toggle="buttons"] label.active span { color: #ffff00; }









/**********************************************************************************************************/