@charset "UTF-8";
.login .loginFormSection, .login .loginFormSection form, .login .loginFormSection .link, .newAccount .condition, .newAccount .signUp, .newAccount .connectType, .newAccount .appDownload, .newAccount .connectType .network li, .newAccount .appDownload .network li, .activeCable .cableContent, .activeCable .visaSuccess .con { zoom: 1; }
.login .loginFormSection:before, .login .loginFormSection form:before, .login .loginFormSection .link:before, .newAccount .condition:before, .newAccount .signUp:before, .newAccount .connectType:before, .newAccount .appDownload:before, .newAccount .connectType .network li:before, .newAccount .appDownload .network li:before, .activeCable .cableContent:before, .activeCable .visaSuccess .con:before { content: ""; display: table; }
.login .loginFormSection:after, .login .loginFormSection form:after, .login .loginFormSection .link:after, .newAccount .condition:after, .newAccount .signUp:after, .newAccount .connectType:after, .newAccount .appDownload:after, .newAccount .connectType .network li:after, .newAccount .appDownload .network li:after, .activeCable .cableContent:after, .activeCable .visaSuccess .con:after { content: ""; display: table; clear: both; }

.wrongInfo { color: #ff1f3b; font-size: 14px; line-height: 1.6em; text-align: right; padding: 0 15px 3px 0; position: absolute; right: 0; top: -26px; }

.headline { color: #000000; font-size: 30px; line-height: 1.2em; margin-bottom: 20px; }

/* 首頁登入 忘記密碼 重設密碼 內容 */
.login .loginFormSection { width: 330px; margin: 0 auto; position: absolute; top: 50%; left: 0; right: 0; text-align: center; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.login .loginFormSection h2 { color: #000000; font-size: 36px; line-height: 1.1em; font-weight: normal; margin: 0; }
.login .loginFormSection h2 span { font-size: 24px; }
.login .loginFormSection .des { color: #000000; font-size: 18px; line-height: 1.8em; }
.login .loginFormSection .des img { margin-bottom: 20px; }
.login .loginFormSection .title { color: #000000; font-size: 30px; line-height: 1.4em; }
.login .loginFormSection .title img { margin-bottom: 5px; }
.login .loginFormSection form > div { margin-top: 35px; position: relative; }
.login .loginFormSection .birth > span { display: inline-block; margin-left: 8px; }
.login .loginFormSection .birth .name { color: #9b9b9b; font-size: 16px; line-height: 35px; margin-left: 0; }
.login .loginFormSection .birth .year .select .defaultShow { min-width: 90px; }
.login .loginFormSection .btn { width: 240px; margin: 35px auto 0; }
.login .loginFormSection .btn .button { width: 220px; }
.login .loginFormSection .link { width: 240px; padding: 0 10px; margin: 25px auto 0; clear: both; }
.login .loginFormSection .link a { color: #898989; font-size: 14px; line-height: 1em; float: left; }
.login .loginFormSection .link a.righttLink { float: right; }
.login .popoutGroup .loginError { padding-top: 28px; text-align: center; }
.login .popoutGroup .loginError .con { margin-top: 8px; min-height: 50px; }
.login .popoutGroup .send-mail .con { text-align: center; }
.login .popoutGroup .changeSuccess { width: 340px; text-align: center; padding: 35px 17px 28px; }
.login .popoutGroup .changeSuccess .con { margin-top: 20px; line-height: 2em; min-height: 85px; }
.login .popoutGroup .changeSuccess .btnGreen { width: 220px; }
.login .popoutGroup .changeSuccess .btnGreen a { color: #FFF; }

/* 註冊帳號 啟動機器 無線網路 內容 */
.newAccount .condition, .newAccount .signUp { width: 520px; margin: 0 auto; position: absolute; top: 50%; left: 0; right: 0; text-align: center; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.newAccount .condition .content, .newAccount .signUp .content { color: #262626; font-size: 18px; line-height: 1.9em; }
.newAccount .condition .content > p, .newAccount .signUp .content > p { letter-spacing: 0.4px; }
.newAccount .condition .content .con, .newAccount .signUp .content .con { width: 500px; height: 300px; border: 1px solid #9b9b9b; -webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); position: relative; overflow: hidden; text-align: justify; padding: 10px 20px 10px 15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #262626; font-size: 13px; line-height: 1.5em; }
.newAccount .condition .content .agree, .newAccount .signUp .content .agree { margin: 13px 0 0; }
.newAccount .condition .content .agree .checkbox span.des, .newAccount .signUp .content .agree .checkbox span.des { color: #262626; font-size: 14px; line-height: 20px; margin-left: 9px; }
.newAccount .condition .btn, .newAccount .signUp .btn { margin-top: 15px; }
.newAccount .condition .btn .button, .newAccount .signUp .btn .button { width: 220px; }
.newAccount .condition .btn .btnGray, .newAccount .signUp .btn .btnGray { width: 90px; }
.newAccount .signUp { display: none; width: 400px; }
.newAccount .signUp .content form > div { margin-top: 20px; position: relative; }
.newAccount .signUp .content form .userName span { display: inline-block; color: #9b9b9b; font-size: 16px; line-height: 20px; }
.newAccount .signUp .content form .userName span.first { width: 30px; }
.newAccount .signUp .content form .userName span.ml25 { margin-left: 25px; }
.newAccount .signUp .content form .userName input[type=text] { width: 100px; }
.newAccount .signUp .content form .firstPw { margin-top: 45px; }
.newAccount .signUp .content form .firstPw .wrongInfo { padding-right: 50px; }
.newAccount .signUp .content form .tips { height: 1px; }
.newAccount .signUp .content form .tips .wrongInfo { right: -22px; top: -13px; }
.newAccount .signUp .btn { margin-top: 30px; }
.newAccount .connectType, .newAccount .appDownload { width: 670px; margin: 0 auto; position: absolute; top: 50%; left: 0; right: 0; text-align: center; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.newAccount .connectType .machine, .newAccount .appDownload .machine { color: #262626; font-size: 18px; line-height: 1.4em; }
.newAccount .connectType .machine img, .newAccount .appDownload .machine img { margin-top: 25px; }
.newAccount .connectType .network, .newAccount .appDownload .network { margin-top: 75px; }
.newAccount .connectType .network li, .newAccount .appDownload .network li { position: relative; width: 300px; height: 100px; padding: 20px 20px 20px 95px; float: left; color: #262626; font-size: 18px; line-height: 1em; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; border: 2px solid #f2f5f6; cursor: pointer; -moz-transition: all 0.2s; -o-transition: all 0.2s; -webkit-transition: all 0.2s; transition: all 0.2s; }
.newAccount .connectType .network li:first-child, .newAccount .appDownload .network li:first-child { margin-right: 67px; }
.newAccount .connectType .network li .des, .newAccount .appDownload .network li .des { text-align: left; }
.newAccount .connectType .network li .des span, .newAccount .appDownload .network li .des span { font-size: 12px; margin-top: 7px; display: inline-block; }
.newAccount .connectType .network li .img, .newAccount .appDownload .network li .img { position: absolute; bottom: calc(100% + 28px); left: 0; right: 0; margin: 0 auto; }
.newAccount .connectType .network li.on, .newAccount .appDownload .network li.on { border: 2px solid #15c9a1; }
.newAccount .connectType .network li.on.wireless .img, .newAccount .appDownload .network li.on.wireless .img { background: url(../Images/img_wifi_s.png) 0 0 no-repeat; }
.newAccount .connectType .network li.on.cable .img, .newAccount .appDownload .network li.on.cable .img { background: url(../Images/img_cable_s.png) 0 0 no-repeat; }
.newAccount .connectType .network li.wireless, .newAccount .appDownload .network li.wireless { background: #f2f5f6 url(../Images/icon_wifi.png) 20px center no-repeat; }
.newAccount .connectType .network li.wireless .img, .newAccount .appDownload .network li.wireless .img { width: 107px; height: 107px; background: url(../Images/img_wifi_d.png) 0 0 no-repeat; }
.newAccount .connectType .network li.cable, .newAccount .appDownload .network li.cable { background: #f2f5f6 url(../Images/icon_cable.png) 20px center no-repeat; }
.newAccount .connectType .network li.cable .img, .newAccount .appDownload .network li.cable .img { width: 128px; height: 76px; background: url(../Images/img_cable_d.png) 0 0 no-repeat; }
.newAccount .connectType .btn, .newAccount .appDownload .btn { margin-top: 25px; }
.newAccount .connectType .btn .button, .newAccount .appDownload .btn .button { width: 220px; }
.newAccount .appDownload { display: none; }
.newAccount .appDownload > div { display: inline-block; }
.newAccount .appDownload .des { margin-left: 35px; vertical-align: text-bottom; }
.newAccount .appDownload .des .machine { margin-bottom: 30px; color: #262626; font-size: 18px; line-height: 1.7em; }
.newAccount .appDownload .des .appLogo { color: #000; font-size: 30px; line-height: 1.4em; }
.newAccount .appDownload .des .appLogo img { margin-bottom: 10px; }
.newAccount .appDownload .des .btn { margin: 40px 0 15px; }
.newAccount .appDownload .des .btn a { display: inline-block; }
.newAccount .appDownload .des .btn a:first-child { margin-right: 12px; }
.newAccount .firstLogin.firstLoginStep1 .btn .button { width: 150px; }
.newAccount .firstLogin .headline { line-height: 1.6em; }
.newAccount .firstLogin .network { margin-top: 40px; }
.newAccount .firstLogin .network li { height: 80px; padding: 30px 20px 20px 111px; }
.newAccount .firstLogin .network li.wireless { background: #f2f5f6 url(../Images/icon_apacercloud.png) 26px center no-repeat; }
.newAccount .firstLogin .network li.cable { background: #f2f5f6 url(../Images/icon_apacercloud.png) 26px center no-repeat; }
.newAccount .firstLogin .btn { margin-top: 85px; }
.newAccount .firstLoginStep2 { display: none; }
.newAccount .afterChoose .con > p { margin-bottom: 25px; }

.popoutGroup .finish { text-align: center; padding-top: 30px; }
.popoutGroup .finish > img { margin-bottom: 10px; }
.popoutGroup .finish .con { text-align: justify; }
.popoutGroup .finish .btn { margin-top: 10px; }

/* 有線網路 內容 */
.activeCable .content { position: absolute; top: 50%; left: 0; right: 0; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.activeCable .cableContent { width: 640px; margin: 0 auto; text-align: center; display: none; }
.activeCable .cableContent:first-child { display: block; }
.activeCable .cableContent.con1 { margin-bottom: 30px; }
.activeCable .cableContent.con1 > div { vertical-align: text-bottom; }
.activeCable .cableContent.con2 .des { margin-top: 32px; }
.activeCable .cableContent.con3 { width: 800px; }
.activeCable .cableContent.con3 .des { margin-top: 27px; margin-right: 95px; width: 300px; }
.activeCable .cableContent.con3 .des input { margin-top: 15px; }
.activeCable .cableContent > div { display: inline-block; vertical-align: text-top; }
.activeCable .cableContent .des { width: 260px; color: #262626; font-size: 18px; line-height: 1.7em; text-align: left; margin-right: 35px; }
.activeCable .control { width: 230px; margin: 50px auto 0; }
.activeCable .control .page { width: 70px; margin: 0 auto; }
.activeCable .control .page li { float: left; width: 8px; height: 8px; background: #929292; margin-left: 20px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -moz-transition: all 0.2s; -o-transition: all 0.2s; -webkit-transition: all 0.2s; transition: all 0.2s; }
.activeCable .control .page li:first-child { margin-left: 0; }
.activeCable .control .page li.on { background: #15c9a1; }
.activeCable .control .btn { margin-top: 15px; }
.activeCable .control .btn .button { width: 220px; }
.activeCable .visa { position: relative; display: none; }
.activeCable .visa .loading-circle { margin-top: 0; }
.activeCable .visa .con { color: #262626; font-size: 18px; line-height: 1.4em; text-align: center; }
.activeCable .visaFailed, .activeCable .visaSuccess { width: 290px; margin: 0 auto; text-align: center; display: none; }
.activeCable .visaFailed img, .activeCable .visaSuccess img { margin-bottom: 25px; }
.activeCable .visaFailed .con, .activeCable .visaSuccess .con { color: #262626; font-size: 18px; line-height: 1.7em; }
.activeCable .visaFailed .con input[type=text], .activeCable .visaSuccess .con input[type=text] { width: 220px; margin-left: 10px; }
.activeCable .visaFailed .btn, .activeCable .visaSuccess .btn { margin-top: 90px; }
.activeCable .visaFailed .btn .button, .activeCable .visaSuccess .btn .button { width: 220px; }
.activeCable .visaSuccess { width: 360px; }
.activeCable .visaSuccess .con p { margin-bottom: 30px; }
.activeCable .visaSuccess .con input[type=text] { width: 220px; margin-left: 10px; }
.activeCable .visaSuccess .btn { margin-top: 15px; }