﻿@charset "utf-8";
/* V-Limo iVideo Wifi租借申請頁面
   2018.11.15
   Karen
----------------------------------*/



/*全域屬性
------------------------*/
*, *:before, *:after { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box;}
html, body { padding:0; margin:0; position:relative; min-width:500px; background:#EFEFEF;}
html { -moz-text-size-adjust:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}
body { font-family:'Microsoft JhengHei',sans-serif;}
.Wrapper { width:100%; height:auto; overflow:hidden;}


/*FixedWifiLink
------------------------*/
.FixedWifiLink { width:80px; height:80px; position:fixed; right:10px; bottom:10px; overflow:hidden; z-index:10; -webkit-box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3); box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3); -webkit-border-radius:100%; -moz-border-radius:100%;border-radius:100%;}
.FixedWifiLink a { width:80px; height:80px; display:block; overflow:hidden; position:relative; text-align:center; color:#fff; font-size:14px; text-decoration:none; background:rgb(196,179,130); background:-moz-linear-gradient(top, rgb(196,179,130) 0%, rgb(151,130,86) 100%); background: -webkit-linear-gradient(top, rgb(196,179,130) 0%,rgb(151,130,86) 100%); background:linear-gradient(to bottom, rgb(196,179,130) 0%,rgb(151,130,86) 100%);}
.FixedWifiLink a:before { content:''; margin:12px auto 3px auto; width:24px; height:18px; display:block; overflow:hidden; background:url(../images/Wifi/Animation_Wifi.png) left center no-repeat; -moz-background-size:120px; -webkit-background-size:120px; -o-background-size:120px; background-size:120px; animation:FixedWifiLinkEffect 1.2s steps(5) infinite; position:relative; z-index:1;}
@-webkit-keyframes FixedWifiLinkEffect {100% { background-position:-120px;}}
@keyframes FixedWifiLinkEffect {100% { background-position:-120px;}}
.FixedWifiLink a:after { content:''; display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:0; -webkit-transition:all .2s; transition:all .2s; opacity:0;
background: rgb(151,130,86); background: -moz-linear-gradient(top, rgb(151,130,86) 0%, rgb(196,179,130) 100%); background: -webkit-linear-gradient(top, rgb(151,130,86) 0%,rgb(196,179,130) 100%); background: linear-gradient(to bottom, rgb(151,130,86) 0%,rgb(196,179,130) 100%);}
.FixedWifiLink a:hover:after {opacity: 1;}
.FixedWifiLink a span { position:relative; z-index:1; font-family:Arial,'Microsoft JhengHei',sans-serif; display:block; line-height:16px;}


/*Header
------------------------*/
.Header { width:100%; height:100px; overflow:hidden; position:relative; z-index:1; background:rgb(255, 255, 255); background:-moz-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:-webkit-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:-o-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:-ms-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); -webkit-box-shadow:0px 5px 5px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow:0px 5px 5px 0px rgba(0, 0, 0, 0.1); box-shadow:0px 5px 5px 0px rgba(0, 0, 0, 0.1);}
.Header .Logo { width:480px; height:auto; overflow:hidden; padding:23px 10px; margin:0 auto;}
.Header .Logo img { max-width:100%; display:block; border:none;}


/*Form
------------------------*/
.FormWrapper { width:100%; height:auto; overflow:hidden; padding:30px 5px; background:#fff;}
.FormWrapper * { margin:0; padding:0; list-style:none; text-decoration:none;}
.Form { width:480px; height:auto; overflow:hidden; margin:0 auto 30px auto; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; -webkit-box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3); box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.3);}
.FormTitle { width:100%; height:60px; line-height:60px; color:#fff; overflow:hidden; padding:0 15px; font-size:24px; background:rgb(110, 110, 110); background:-moz-linear-gradient(90deg, rgb(110, 110, 110) 0%, rgb(85, 85, 85) 100%); background:-webkit-linear-gradient(90deg, rgb(110, 110, 110) 0%, rgb(85, 85, 85) 100%); background:-o-linear-gradient(90deg, rgb(110, 110, 110) 0%, rgb(85, 85, 85) 100%); background:-ms-linear-gradient(90deg, rgb(110, 110, 110) 0%, rgb(85, 85, 85) 100%); background:linear-gradient(180deg, rgb(110, 110, 110) 0%, rgb(85, 85, 85) 100%);}
.Form03 .FormTitle { font-size:23px;}
.FormContent { width:100%; height:auto; overflow:hidden; padding:25px 15px;}
.FormContent > ul { width:100%; height:auto; overflow:hidden;}
.FormContent > ul > li { display:block; width:100%; height:auto; overflow:hidden; position:relative; padding-left:5em; margin:0 0 25px 0; font-size:1.1em; line-height:2em;}
.FormContent > ul > li:last-child { margin-bottom:0;}
.Form01 .FormContent > ul > li { padding-left:9em;}
.Form03 .FormContent > ul > li,.Form04 .FormContent > ul > li { padding-left:0;}
.FormContent > ul > li hr { width:100%; height:1px; border:none; background:#CCC; margin:20px 0;}
.FormContent > ul > li .Title { position:absolute; left:0; top:0; line-height:2em;}
.FormContent > ul > li .Title .Small { display:block; line-height:.9em; font-size:.9em; text-align:center;}
.FormContent > ul > li.TwoLine { min-height:40px;}
.FormContent > ul > li.TwoLine .Title { line-height:1.5em;}
.FormContent > ul > li.TwoLine .Title .Small { font-size:0.75em;}
.FormContent > ul > li .Content { width:100%; height:auto; overflow:hidden; padding:0 0 0 4px;}
.FormContent > ul > li .Content input[type="text"] { width:100%; height:35px; border:1px solid #ccc; padding:0 5px; line-height:34px; display:block; outline:none; font-family:'Microsoft JhengHei',sans-serif; color:#000; -webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-border-radius:0; font-size:1.1em; -moz-border-radius:0; border-radius:0;}
.FormContent > ul > li .Content input[type="date"] { width:100%; height:35px; border:1px solid #ccc; display:block; outline:none; font-family:'Microsoft JhengHei',sans-serif; color:#000; -webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-border-radius:0; font-size:1em; -moz-border-radius:0; border-radius:0;}
.FormContent > ul > li .Content input[type="radio"] { width:20px; height:20px; outline:none; margin:0; cursor:pointer;}
.FormContent > ul > li .Content input[type="checkbox"] { width:20px; height:20px; outline:none; margin:0; cursor:pointer;}
.FormContent > ul > li .Notice { font-weight:bold; color:#f00; margin-top:10px; line-height:1.2em; overflow:hidden; width:100%; height:auto;}
.FormContent > ul > li .ContentDate li { width:48%; float:left; position:relative; padding:3.5px 0; padding-right:30px;}
.FormContent > ul > li .ContentDate li:nth-child(2) { width:4%; text-align:center; padding-right:0; line-height:30px;}
.FormContent > ul > li .ContentDate li img { display:block; border:none; position:absolute; right:0; top:6px; cursor:pointer;}
.FormContent > ul > li .ContentRadio span { display:inline-block; margin-left:20px; position:relative; padding-left:30px;}
.FormContent > ul > li .ContentRadio span:nth-of-type(1) { margin-left:0;}
.FormContent > ul > li .ContentRadio span input[type="radio"] { position:absolute; left:1px; top:8px;}
.FormContent > ul > li .ContentRadio span label { cursor:pointer;}
.FormContent > ul > li .ContentCheck { position:relative; padding-left:30px;}
.FormContent > ul > li .ContentCheck > input[type="checkbox"] { position:absolute; left:1px; top:8px;}
.FormContent > ul > li .ContentCheck > label { cursor:pointer; font-weight:bold; font-size:1.25em;}
.FormContent > ul > li .ContentCheck > label .Notice { display:block; font-size:16px; margin-top:0; position:relative; padding-left:16px; margin-top:5px;}
.FormContent > ul > li .ContentCheck > label .Notice:before { content:'*'; display:block; position:absolute; left:0; top:0;}
.FormContent > ul > li .ContentCheck2 { font-weight:bold; font-size:1.25em;;}
.FormContent > ul > li .ContentCheck2 .TermsOfServiceBtn { border-bottom:1px solid #39F; color:#39f; cursor:pointer; margin:0 5px;}
.FormContent > ul > li .ContentCheck2  #TermsOfServiceBtnClose { display:none;}
.FormContent > ul > li.TermsOfService { display:none;}
.FormContent > ul > li .ContentInfo > ol { padding-left:1.8em;}
.FormContent > ul > li .ContentInfo > ol li { text-align:justify; text-justify:inter-ideograph; margin-bottom:5px;}
.FormContent > ul > li .ContentInfo > ol > li { list-style:decimal; margin-bottom:15px;}
.FormContent > ul > li .ContentInfo > ol > li > ol {  padding-left:0;}
.FormContent > ul > li .ContentInfo > ol > li > ol > li { list-style:none; padding-left:1.5em; position:relative}
.FormContent > ul > li .ContentInfo > ol > li > ol > li .Decimal { position:absolute; left:0; top:0;}
.FormContent > ul > li .ContentInfo > ol > li > ul {  padding-left:1.5em;}
.FormContent > ul > li .ContentInfo > ol > li > ul > li { list-style:disc;}
.FormContent > ul > li .ContentInfo > ol > li > ol > li > ul {  padding-left:1.5em;}
.FormContent > ul > li .ContentInfo > ol > li > ol > li >ul > li { list-style:disc;}
.FormContent > ul > li .ContentPrice ul li { margin-top:15px; position:relative; padding-left:30px;}
.FormContent > ul > li .ContentPrice ul li:nth-child(1) { margin-top:0;}
.FormContent > ul > li .ContentPrice ul li input[type="radio"] { position:absolute; left:1px; top:8px;}
.FormContent > ul > li .ContentPrice ul li label { cursor:pointer; font-size:1.2em;}
.FormContent > ul > li .ContentPrice ul li .aspNetDisabled input[type="radio"],.FormContent > ul > li .ContentPrice ul li .aspNetDisabled ~ label { cursor:default;}
.FormContent > ul > li .ContentPrice ul li .Notice { margin-top:0; color:#b7b7b7;}
.FormContent > ul > li .ContentCount ul li { margin-top:10px;}
.FormContent > ul > li .ContentCount ul li:nth-child(1) { margin-top:0;}
.FormContent > ul > li .ContentTotal .ContentTotalTitle { letter-spacing:.5em;}
.FormContent > ul > li .ContentTotal .Price { font-size:1.3em; font-weight:bold; color:#f00;}
.FormContent > ul > li .ContentTable table { border-top:1px solid #666; border-left:1px solid #666;}
.FormContent > ul > li .ContentTable table tr td { border-right:1px solid #666; border-bottom:1px solid #666; padding:.5rem;}
.FormContent > ul > li .ContentTable table tr td:nth-child(1) { text-align:center; width:3.5rem; background:#e2e2e2;}
.FormContent > ul > li .ContentTable table tr td span { display:inline-block;}
.FormContent > ul > li .ContentADD select { width:100% !important; height:35px; border:1px solid #ccc; padding:0 0 0 5px; line-height:34px; display:block; outline:none; font-family:'Microsoft JhengHei',sans-serif; color:#000;  -webkit-border-radius:0; font-size:1.1em; -moz-border-radius:0; border-radius:0; margin-bottom:10px; float:left;}
.FormContent > ul > li .ContentADD .Address_div { width:100%; height:auto; overflow:hidden; font-size:0; position:relative;}
.FormContent > ul > li .ContentADD .Address_div .Adress_text { width:115px; float:left; margin-bottom:10px; font-size:18px;}
.FormContent > ul > li .ContentADD .Address_div .Adress_text#Address_txb_Address5,.FormContent > ul > li .ContentADD .Address_div .Adress_text#Address_txb_Address6 { width:70px;}
.FormContent > ul > li .ContentADD .Address_div span {  float:left; margin:0 5px 10px 5px; font-size:16px;}
.FormContent > ul > li .ContentADD .Foor { position:absolute; bottom:10px; right:0;}
.FormContent > ul > li .ContentADD .Foor input { width:70px; margin-right:5px;}
.FormContentFinal { font-size:1.4em; padding:80px 15px;}
.FormContentFinal h3 { font-size:1.8em; line-height:3em;}
.FormContent > ul > li .MyCalendar { line-height:1em; overflow: hidden;}
.FormContent > ul > li .MyCalendar .ajax__calendar_day { text-align:center;}
.FormContent > ul > li .ajax__calendar_container { width:170px; padding:2px;}
.Form01 .FormContent > ul > li .ContentInfo > ol { padding:0;}
.Form01 .FormContent > ul > li .ContentInfo > ol > li { list-style:none; padding-left:1.2em; position:relative}
.Form01 .FormContent > ul > li .ContentInfo > ol > li .Decimal { position:absolute; left:0; top:0;}
.Form03 .FormContent > ul > li .ContentTable table tr td { padding:.5rem 0; text-align:center;}
.Form03 .FormContent > ul > li .ContentTable table tr td:nth-child(1) { width:auto; background:none;}
.Form03 .FormContent > ul > li .ContentTable table tr:nth-child(1) td { background:#e2e2e2; line-height:1.2em;}
.Form03 .FormContent > ul > li .ContentTable table tr:nth-child(2) td { font-weight:bold;}


/*NextBtn
------------------------*/
.NextBtn { width:100%; height:auto; overflow:hidden;}
.NextBtn a { display:block; color:#fff; text-align:center; font-size:18px; background:#474747; width:150px; height:50px; line-height:50px; margin:0 auto;}


/*FinalBtn
------------------------*/
.FinalBtn { width:320px; height:auto; overflow:hidden; margin:0 auto;}
.FinalBtn li { display:block; overflow:hidden; float:left;}
.FinalBtn li:nth-child(2) { float:right;}
.FinalBtn li a { display:block; color:#fff; text-align:center; font-size:18px; background:#474747; width:150px; height:50px; line-height:50px;}


/*Footer
------------------------*/
.Footer { width:100%; height:auto; overflow:hidden; padding:50px 0 20px 0; text-align:center; background:rgb(255, 255, 255); background:-moz-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:-webkit-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:-o-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:-ms-linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); background:linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%); -webkit-box-shadow:inset 0px 5px 10px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow:inset 0px 5px 10px 0px rgba(0, 0, 0, 0.15); box-shadow:inset 0px 5px 10px 0px rgba(0, 0, 0, 0.15);}
.Footer .Logo { width:310px; height:auto; display:block; margin:0 auto;}
.Footer .Logo img { display:block; border:none;}
.Footer .Copyright { margin:10px auto 60px auto; font-size:14px; color:#919191;}
.Footer .uGear { width:130px; height:60px; position:absolute; bottom:10px; right:0; text-align:left; background:url(../Images/Layout/uGear/truste_Ugear.png) left top no-repeat;}
.Footer .uGear:hover { background:url(../Images/Layout/uGear/truste_Ugear_o.png); background-repeat:no-repeat;}
.Footer .uGear a { display:inline-block; width:auto; height:60px; line-height:90px; font-size:12px; color:#666; text-decoration:none; text-indent:2px;}
.Footer .uGear a:hover { color:#000;}


/*Popup 
------------------------*/
.modalPopup { background:#fff; border:1px #ccc solid; padding:10px; line-height:1.8em; font-size:1.2em; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px;}
.modalPopup input { margin-top:10px;}
.modalBackground { background:rgba(0,0,0,.7);}
input[type="submit"] { width:120px; height:50px; line-height:50px; font-size:1em; border:none; outline:none; cursor:pointer; background:#474747; font-family:'Microsoft JhengHei',sans-serif; color:#fff; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; -webkit-appearance:none; -moz-appearance:none; appearance:none;} 


@media only screen and (min-width:0px) and (max-width:500px) {
	
#ModalPopupExtender_Message_foregroundElement { left:20px !important;}

}