@charset "utf-8";
/* CSS Document */
#container{position:fixed; width:100%; height:100%;
  -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
         transform: translate3d(0,0,0);
 -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
         transition: all 500ms ease-in-out;
}

.loading{position:relative; width:100%; margin:0 auto; height:100%}
.loading span{display:block; width:40%; height:100%; background:url(../photos/logo.svg) no-repeat center center; margin:0 auto}
.CRT{clear:both}

#main_button{position:relative; margin:0 auto; clear:both; text-align:center}
#main_button.two a{width:45%;border:solid .06em #FFC107}
#main_button.two a:first-child{background:#FFFFFF; color:#FFC107}
#main_button a{display:inline-block; color:#FFFFFF; background:#FFC107; line-height:2.8; font-size:100%; text-align:center; border-radius:5px; margin:0 2%; border:solid .06em #FFC107;width:90%; border:none}
#main_button a:active,#main_button.two a:active{background:rgba(232,174,2,1.00); color:#FFFFFF}


.grey_search{position:relative; width:95%; margin:5px auto 15px}
.grey_search input{background:rgba(228,228,228,1.00) url(../photos/Search_input.svg) no-repeat 7px center; background-size:25px; border-radius:10px; border:none; position:relative; width:100%; font-size:100%; padding:5px 15px; text-indent:25px}
.grey_search input[type="text"]::-webkit-input-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}
.grey_search input[type="text"]::-moz-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}
.grey_search input[type="text"]:-ms-input-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}
.grey_search input[type="text"]:-moz-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}

.white_search{position:relative;width: 100%;margin:5px auto 25px;}
.white_search input{background: rgba(255,255,255,1.00) url(../photos/search_grey.svg) no-repeat left center;background-size: 34px; border:none;position:relative;width:100%;font-size: 91%;padding: 5px;text-indent: 30px; border-bottom:solid .04em rgba(230,230,230,1.00); border-radius:0}
.white_search input.active{border-bottom:solid .04em rgba(255,193,7,1.00)}
.white_search input[type="text"]::-webkit-input-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}
.white_search input[type="text"]::-moz-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}
.white_search input[type="text"]:-ms-input-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}
.white_search input[type="text"]:-moz-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}

.list_container{position:relative; width:100%; font-size:90%}
.list_container li{position:relative; width:100%; padding:5px 2.5% 20px; border-bottom:solid 1px #E6E6E6}
.list_container li:last-child{border:none}
.list_container li .date{font-size:90%; color:#B3B3B3; line-height:1.6}
.list_container li a{display:block; width:100%; height:100%}

.scroll{position: absolute; top: 0; bottom:0; overflow-y:auto; -webkit-overflow-scrolling: touch;}

#paper{padding-bottom:90px}
#paper article{position:relative; width:90%; margin:10px auto; line-height:1.7em}
#paper img.article{max-width:100%; padding-bottom:15px}
#paper article h1{font-size:115%; padding-bottom:3px; line-height:1.3em;word-break: break-all;}
#paper article .date{font-size:80%; color:#B3B3B3; padding-bottom:15px}

#concierge_container{width:100%; line-height:2em; background:rgba(237,237,237,1.00); float:left; padding-bottom:100px; height:100%}
#concierge_container p{text-align:center; padding:45% 0 0}
#concierge_container input[type=button]{border:none; background:rgba(255,193,7,1.00); padding:10px 15px; font-size:100%; margin:0 auto;position: relative;  display: block; border-radius:5px; box-shadow:inset 0px -2px 2px #d2a00b; margin-top:10px; appearance:none;  -moz-appearance:none;  -webkit-appearance:none;}
#concierge_container input[type=button]:active{background:rgba(232,174,2,1.00)}
#concierge_container ul{position:relative; width:95%;margin:10px auto}
#concierge_container li{position:relative; float:left; width:100%; padding:4px 10px;background:#FFFFFF; box-shadow:0 0 1px #cac8c8; margin-bottom:10px}
#concierge_container li .name{float:left; width:80%}
#concierge_container li .name span{display:block; width:100%; }
#concierge_container li .name span:nth-child(1){font-weight:600; color:#272727; font-size:105%}
#concierge_container li .name span:nth-child(2){font-size:95%; color:#bbb9b7; line-height:1.3em; margin-bottom:10px; overflow:hidden}
#concierge_container li .name span:nth-child(3){font-size:95%; color:#bbb9b7; line-height:2.6em}
#concierge_container li .navig{display:block; width:55px; height:122px; float:left; position:relative}
#concierge_container li .navig a{display:block; position:relative; width:100%; height:100%; background:url(../photos/compass_icon.png) no-repeat center 3px; background-size:25px}
#concierge_container li .navig a:active{background:url(../photos/compass_icon_over.png) no-repeat center 3px; background-size:25px}
#concierge_container li .phone{position:relative; float:left; width:106%; min-height:30px; border-top:solid 1px #e8e8e8; margin:0 0 0 -3%}
#concierge_container li .phone a{position:relative; display:block; width:100%; height:100%; color:#00b349; text-indent:64px; background:url(../photos/phone_icon_green.png) no-repeat 22px 7px; background-size:28px; padding:5px 0 0}
#concierge_container li .phone a:active{background:url(../photos/phone_icon.png) no-repeat 22px 7px; background-size:28px;color:#b0afaf}
#concierge_call{position:relative; width:100%; min-height:75px; background:#ffde36;}
#concierge_call a{display:block; width:183px; margin:0 auto; padding:20px 0 15px 45px; background:url(../photos/calling_icon.png) no-repeat left center; background-size:38px; color:#363636}
#concierge_call a h2{font-size:115%; letter-spacing:.1em}
#concierge_call a p{font-size:95%}
#concierge_call a:active{color:#d6b510; background:url(../photos/calling_icon_over.png) no-repeat left center; background-size:38px}

#guide_container{position:relative; width:100%}
#guide_container ul{position:relative; width:100%}
#guide_container li{position:relative; display:block; width:85%; float:right; border-bottom:solid .06em rgba(230,230,230,1.00)}
#guide_container li{position:relative;display:block;width: 83%;float:right;border-bottom:solid .07em rgba(230,230,230,1.00);}
#guide_container li i{display:block;float:left;margin: 13px 15px 0 -16%;width: 40px;height: 40px;border-radius:30px;}
#guide_container li a:active{opacity:.6}
#guide_container li a{display:block;width: 100%;height:80px;padding:10px 0;line-height: 4em;color: #212121}
#guide_container li a i.equipment{background:#1E8CFF url(../photos/guide_bike.svg) no-repeat center center;background-size: 26px;}
#guide_container li a i.rentMethod{background:#FF9500 url(../photos/guide_library.svg) no-repeat center center;background-size: 26px;}
#guide_container li a i.fee{background:#1E8CFF url(../photos/guide_price.svg) no-repeat center center;background-size: 26px;}
#guide_container li a i.alert{background:#FF3B30 url(../photos/guide_alert.svg) no-repeat center center;background-size: 26px;}

#equipment{padding-bottom:113px}
#equipment ul{position:relative; width:100%}
#equipment li{position:relative; width:100%; padding:5px 5%; display:block; float:left}
#equipment li h1,#method li h1{font-size:100%; line-height:1.8}
#equipment li p,#method li p{font-size:90%; color:#808080; line-height:1.3}
#equipment li img{max-width:50%}
#equipment li:first-child{padding:0 5% 5px}
#equipment li:last-child{padding:5px 5% 0}
#equipment li:last-child p{font-size:70%}
#equipment li:nth-child(odd) img,#equipment li:nth-child(even) .type{float:left}
#equipment li:nth-child(even) img,#equipment li:nth-child(odd) .type{float:right}
#equipment li .type{margin:25px auto 0;width:44%}

#method{padding-bottom:50px}
#method ul{position:relative; width:100%}
#method li{position:relative; width:95%; padding:10px 2.5% 35px; margin:0 auto; border-bottom:solid .05em #B6B6B6}
#method li:last-child{border:none}
#method li .pic{position:relative; width:60%; margin:10px auto; text-align: center}
#method li .pic img{max-width:100%}
#method li h1{padding-bottom:10px}
#method li h1 span{color:#ff1113; font-size:110%; padding:0 5px; margin:0 2px 0; border:solid .05em #ff1113}

#feelist{position:relative; width:100%; color:#212121; font-size:90%}
#feelist li{position:relative; display:block; width:100%; float:left; padding:10px 3%; border-bottom:solid .05em #DCDCDC; min-height:83px}
#feelist li span.item{display:block; float:left; width:14%; text-align:center; color:#676767; padding:5% 0}
#feelist li p{display:block; float:left; width:43%; padding:5% 4% 5% 6%; word-break:break-all; font-size:105%}
#feelist li p.txtleft{text-align:left}
#feelist li p.txtcenter{text-align:center}
#feelist.single li p{width:85%; float:right}
#feelist.member li:nth-child(2) span{padding:12% 0}
#feelist.member li:nth-child(2) p:nth-child(3){padding:11% 0}
#feelist.member li:nth-child(3) span{padding:17% 0}
#feelist.member li:nth-child(4) span,#feelist.single li:nth-child(4) span{padding:11% 0}
#feelist.member li p:nth-child(even){border-right:solid .06em #8a8a8a}
#feelist.member li .pricetable,#feelist.single li .pricetable{float:right; position:relative; width:80%}
#feelist.member li .pricetable p,#feelist.single li .pricetable p{width:100%; border:none; padding:0}
#feelist.member li .pricetable p span,#feelist.single  li .pricetable p span{color:#607D8B;padding:0 5px; display:  inline-block;width: 35%;float: right;}
#feenote{position:relative; width:100%; clear:both; font-size:80%; color:#676767; line-height:1.6; word-break:break-all}
#feenote ul{position:relative; width:90%; margin:0 auto; padding:15px 0}
#feenote li{position:relative;width:100%;list-style:circle;padding: 0 0 0 15px;}
#feenote li i{display:block;width:6px;height:6px;background:#676767;border-radius:10px;float:left;margin: 7px 5px 7px -15px;}


#lostlist_container{position:relative; width:100%; height:100%; padding-bottom:108px}
#lostlist_container ul{position:relative; width:100%}
#lostlist_container li{position:relative; display:block; width:85%; float:right; border-bottom:solid .06em rgba(230,230,230,1.00)}
#lostlist_container li{position:relative;display:block;width: 78%;float:right;border-bottom:solid .07em rgba(230,230,230,1.00);}
#lostlist_container li i{display:block;float:left;margin:11px 23px 37px -22%;width: 46px;height: 45px;border-radius:30px;background:#607D8B;color:  #ffffff;font-style:  normal;line-height: 1.3;font-size: 70%;text-align:  center;padding: 8px 0 0 0;}
#lostlist_container li a:active{opacity:.6}
#lostlist_container li a{display:block;width: 100%;height:80px;padding:10px 0;line-height: 4em;color: #212121}
#lostlist_container li p{display:block;width: 86px;position:absolute;right: 0;top: 9px;font-size: 80%;}
#lostlist_container li:last-child{border:none}
#lostlist_container li li{float:left;position:relative;width: 82%;display:  block;line-height: 1.6; border:none}
#lostlist_container li li:first-child{color:#607D8B; font-size:80%; width: 60%; word-break: break-word;}
#lostlist_container li li:nth-child(2){font-size:80%}
#lostlist_container li li:last-child{color:#9A9A9A; font-size:80%; text-indent:23px; background:url(../photos/location.svg) no-repeat 4px 8px; background-size:14px; padding:5px 0}

#search_main{position:relative; width:90%; margin:10px auto; background:#F3F3F3; border-radius:10px; padding:10px}
#search_main select{
	position:relative; 
	width:100%;
	font-size:100%;
	color:#607D8B; 
	border:none;
	  appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;
    background:url(../photos/bluenav.png) no-repeat right center transparent;
	background-size:28px;
}

#lostthing_list{position:relative; margin:10px auto; font-size:110%; line-height:1.8; height:55%}
#lostthing_list ul{position:relative; width:100%}
#lostthing_list li{font-size:90%; display:block;padding:6px 10px 6px 0;border-bottom:solid .08em rgba(210,210,210,1.00);position:relative;width: 87%;float:right;margin-bottom:10px;}
#lostthing_list li .label_check input { position: absolute; left: -9999px; }
#lostthing_list li .label_check{margin: -2px 6px 0 -32px;width:112%;height:30px;display:block;float:left; text-indent:40px}
#lostthing_list li .label_check{ background:url(../photos/check_off.svg) no-repeat; background-size:30px}
#lostthing_list li label.c_on{ background:url(../photos/check.svg) no-repeat; background-size:30px}

#lostbike_list{position:relative; margin:5px auto; font-size:100%; height:100%; padding-bottom:156px}
#lostbike_list ul{position:relative; width:90%; margin:0 auto}
#lostbike_list li{position:relative; display:block; width:100%; line-height:3; padding:0 0 0 10%}
#lostbike_list li .nb{float:right; display:block; width:100px; color:#B3B3B3; text-align:center}
.lost_title{position:relative; width:100%; margin:0 auto; padding:5px 5% 5px 14%; background:#e6e6e6; line-height:2} 
.lost_title .nb{display:block; float:right; width:100px; text-align:center}

#cards_container{position:relative; width:100%; height:91%; padding-bottom:45px}
#cards_container .cards_inner{position:relative; width:100%; margin:0 auto; }
#cards_container .cards_inner li{position:relative; float:left; width:100%; padding:10px 5% 15px;min-height:50px; border-bottom:solid .04em rgba(230,230,230,1.00)}
#cards_container .cards_inner li:last-child{border:none}
#cards_container .cards_inner li .date{font-size:80%; padding-bottom:8px}
#cards_container .cards_inner li .cardtitle{position:relative;float:left; display:block; padding:4px 0; width:65px; height:65px; border-radius:10px; text-align:center; font-weight:bold; margin:0 5px 0 0}
#cards_container .cards_inner li .barline{display:block; width:93%; margin:2px auto; height:5px;border-radius:5px}
#cards_container .cards_inner li .location{font-size:80%; letter-spacing:normal; color:#5d5c5c}
#cards_container .cards_inner li .cardNB{display:block; float:left; color:#311807; font-size:93%; font-weight:600; line-height:2em; width:67%; letter-spacing:-.06em}
#cards_container .cards_inner li .status{display:block; float:left; font-size:85%; color:rgba(96,125,139,1.00); font-weight:600; width:67%}
#cards_container .cards_inner li .button.delete{margin-right:10px; min-width:100px}
#cards_container .cards_inner li .button{display:block; float:right; border-radius:10px; background:rgba(143, 183, 202,1.00); color:#FFFFFF; font-size:93%; font-weight:600; padding:7px 20px; text-align:center; margin:15px 0 0 0}
#cards_container .cards_inner li.blue .date{color:#02bbf0}
#cards_container .cards_inner li.blue .cardtitle{border:solid 1px #02bbf0; color:#02bbf0; font-size:110%; letter-spacing:.1em}
#cards_container .cards_inner li.blue .barline{background:#02bbf0}
#cards_container .cards_inner li.orange .date{color:#ffb307}
#cards_container .cards_inner li.orange .cardtitle{border:solid 1px #ffb307; color:#ffb307; font-size:110%; letter-spacing:.1em; line-height:1.2}
#cards_container .cards_inner li.orange .barline{background:#ffb307}
#cards_container .cards_inner li.coffee .date{color:#786958}
#cards_container .cards_inner li.coffee .cardtitle{border:solid 1px #786958; color:#786958; font-size:110%; letter-spacing:.1em}
#cards_container .cards_inner li.coffee .barline{background:#786958}
#cards_container .cards_inner li a{display:block; position:relative; width:100%; float:left}
#cards_container .cards_inner li a:active .button{background:#4c899a; color:#95b8c1}

#card_list{position:relative; width:100%; height:91%; background:rgba(237,237,237,1.00)}
#card_list ul{position:relative; width:95%; margin:10px auto}
#card_list li{position:relative; width:100%; padding:10px 4%; background:rgba(255,255,255,1.00); display:block; margin-bottom:10px; overflow:hidden}
#card_list .list_item span i{display:inline-block; width:20px; height:20px; float:left}
#card_list .list_item span:first-child{width:25%; font-size:80%; font-weight:bold}
#card_list .list_item span:nth-child(2) i{background:rgba(204,204,204,1.00);border-radius:30px;margin:-2px 2px 0 0;color:#FFFFFF;font-style:normal;text-indent: 3px;line-height: 1.7em; font-weight:normal}
#card_list .list_item span:nth-child(3) i{background:url(../photos/transaction_card.svg) no-repeat center top; background-size:20px}
#card_list .list_item span:first-child i{background:rgba(204,204,204,1.00) url(../photos/transaction_price.svg) no-repeat center center; border-radius:20px; background-size:20px; margin:-2px 2px 0 0}
#card_list .list_item,.scan_record .detail .list_item,#expense ul ul .list_item{position:relative; width:105%; padding:5px 0}
.scan_record .detail .list_item.expense{letter-spacing:-0.04em}
.scan_record .detail .list_item span{display:inline-block; width:30%; padding-right:2%; font-size:80%; line-height:1.5}
#card_list .list_item span{display:inline-block; width:25%; font-size:80%; line-height:1.5}
#expense ul ul .list_item span,.scan_record .detail .list_item.expense span{display:inline-block; width:21%; padding-right:2%; font-size:80%; line-height:1.5}
.scan_record .detail .list_item span i{display:inline-block; width:25px; height:25px; float:left}
#expense ul ul .list_item span i{display:inline-block; width:22px; height:22px; float:left}
.scan_record .detail .list_item span:first-child i{background:rgba(204,204,204,1.00) url(../photos/transaction_price.svg) no-repeat center center; border-radius:30px; background-size:25px; margin:-2px 6px 0 0}
#expense ul ul .list_item span:first-child i{background:rgba(204,204,204,1.00) url(../photos/transaction_price.svg) no-repeat center center; border-radius:30px; background-size:25px; margin:-2px 5px 0 0}
#expense ul ul .list_item span:nth-child(2) i,.scan_record .detail .list_item.expense span:nth-child(2) i{background:rgba(204,204,204,1.00);border-radius:30px;margin:-2px 5px 0 0;color:#FFFFFF;font-style:normal;text-indent: 5px;line-height: 1.9em; font-weight:normal}
#expense ul ul .list_item span:nth-child(2){font-weight:bold; width:25%}
#card_list .list_item span:nth-child(2),.scan_record .detail .list_item.expense span:nth-child(2){font-weight:bold; width:25%; padding:0}
.scan_record .detail .list_item span:first-child{width:40%; font-size:105%; font-weight:bold}
#expense ul ul .list_item span:first-child{width:30%; font-size:105%; font-weight:bold}
.scan_record .detail .list_item span:nth-child(2){padding-left:10%}
.scan_record .detail .list_item.expense span:first-child{width:30%; font-size:80%; font-weight:bold}
.scan_record .detail .list_item span:nth-child(2) i,#expense ul ul .list_item span:nth-child(3) i,.scan_record .detail .list_item.expense span:nth-child(3) i{background:url(../photos/transaction_pillar.svg) no-repeat center -2px; background-size:24px}
#card_list .list_item span:last-child,.scan_record .detail .list_item span:last-child,#expense ul ul .list_item span:last-child{padding:0;}
#card_list .list_item span:last-child i,.scan_record .detail .list_item span:last-child i,#expense ul ul .list_item span:last-child i,.scan_record .detail .list_item.expense span:last-child i{background:url(../photos/transaction_bike.svg) no-repeat center top; background-size:20px}
#card_list .list_route,.scan_record .detail .list_route,#expense ul ul .list_route{position:relative; width:100%}
#card_list .list_route .point,.scan_record .detail .list_route .point,#expense ul ul .list_route .point{float:left; width:25px;}
#card_list .list_route .point i,.scan_record .detail .list_route .point i,#expense ul ul .list_route .point i{display:block; width:17px; height:17px; border-radius:20px; font-style:normal; line-height:1.2; font-size:70%; border:solid .14em #607D8B; text-align:center; margin:0 auto;background:#607D8B; color:#FFFFFF; overflow:hidden}
#card_list .list_route .point i:first-child,.scan_record .detail .list_route .point i:first-child,#expense ul ul .list_route .point i:first-child{background:#FFA000;  border:solid .14em #FFA000}
#card_list .list_route .point span,.scan_record .detail .list_route .point span,#expense ul ul .list_route .point span{display:block; width:.11em; background:#cccccc; height:30px; margin:5px auto; position:relative}
#card_list .list_route.undone .point span,.scan_record .detail .list_route.undone .point span{border-left:dashed #cccccc .15em; background:transparent}
#card_list .list_route.undone .point i:last-child,.scan_record .detail .list_route.undone .point i:last-child{text-indent:-99999px; background:transparent}
#card_list .list_route .station,.scan_record .detail .list_route .station{position:relative; width:90%; float:left}
#expense ul ul .list_route .station{position:relative; width:65%; float:left}
#card_list .list_route .station ul,.scan_record .detail .list_route .station ul,#expense ul ul .list_route .station .station_inner{width:100%; margin:0}
#card_list .list_route .station li,#expense ul ul .list_route .station .station_inner div{padding:0 0 0 2%; min-height:44px}
.scan_record .detail .list_route .station li{padding:0 0 0 2%; min-height:55px}
#card_list .list_route .station li:last-child,.scan_record .detail .list_route .station li:last-child{margin:0}
#card_list .list_route .station li p,.scan_record .detail .list_route .station li p{line-height:1.2; color:#b1b1b1; font-size:90%}
#card_list .list_route .station li p span,.scan_record .detail .list_route .station li p span{padding-left:10px}
.cardlist_nb{position:relative; width:100%; background:rgba(237,237,237,1.00); padding:10px 2.5% 5px; float:left; font-weight:bold}
.cardlist_nb .card_nb{float:left; font-size:80%; line-height:3}
.cardlist_nb .cardtitle{position:relative;float:left; display:inline-block; padding:3px; width:47px; border-radius:10px; text-align:center; font-weight:bold; margin:0 5px 0 0;border:solid .1em #ffb307; color:#ffb307; font-size:75%; line-height:1.2}
.cardlist_nb .cardtitle .barline{display:block; width:93%; margin:2px auto; height:.06em;background:#ffb307}
.cardlist_nb .cardtitle .location{color:#5d5c5c}

.repair_inner{position:relative; width:90%; margin:15px auto; padding-bottom:135px}
.repair_inner h1{font-size:110%; color:#212121; font-weight:normal; padding-top:35px}
.repair_inner h1:first-child{padding:0}
.repair_inner p{padding:10px 0 0; position:relative; width:100%}
.repair_inner select{
	position:relative; 
	width:100%;
	font-size:90%;
	color:rgba(178,178,178,1.00); 
	border:none;
	appearance:none;
	-moz-appearance:none;
	-webkit-appearance:none;
    background:rgba(242,242,242,1.00);
	padding:10px 15px;
	border-radius:5px;
}
.repair_inner select.active{color:#262626}
.repair_inner .station_select{color:rgba(178,178,178,1.00);background:rgba(242,242,242,1.00);padding:10px 20px;	border-radius:5px; font-size:100%; cursor:pointer}
.popup-inner .type.leftside .station_select_inner li{padding:5px 0}
.repair_inner input[type=text],input[type=button]{background:rgba(242,242,242,1.00);padding:10px 15px;	border-radius:5px; box-shadow:none; border:none; font-size:90%}
.repair_inner input[type=text]::-webkit-input-placeholder{font-size:90%; color:rgba(178,178,178,1.00)}
.repair_inner input[type=text]::-moz-placeholder{font-size:90%; color:rgba(178,178,178,1.00)}
.repair_inner input[type=text]:-ms-input-placeholder{font-size:90%; color:rgba(178,178,178,1.00)}
.repair_inner input[type=text]:-moz-placeholder{font-size:90%; color:rgba(178,178,178,1.00)}
.repair_inner .note{background:rgba(242,242,242,1.00);padding:10px 20px;height:85px; width:62%; position:relative;border-radius:5px; float:left}
.repair_inner .note textarea{background:rgba(242,242,242,1.00); box-shadow:none; border:none; font-size:100%; position:relative; width:100%; height:100%}
.repair_inner .note textarea::-webkit-input-placeholder{font-size:100%; color:rgba(178,178,178,1.00); line-height:60px}
.repair_inner .note textarea::-moz-placeholder{font-size:100%; color:rgba(178,178,178,1.00); line-height:60px}
.repair_inner .note textarea:-ms-input-placeholder{font-size:100%; color:rgba(178,178,178,1.00); line-height:60px}
.repair_inner .note textarea:-moz-placeholder{font-size:100%; color:rgba(178,178,178,1.00); line-height:60px}
.repair_inner .upload{background:rgba(242,242,242,1.00); position:relative; width:35%;height:85px; display:block; float:right;border-radius:5px}
.repair_inner .upload input[type=button]{position:relative; width:100%; height:100%; border:none; appearance:none;	-moz-appearance:none;-webkit-appearance:none; background:url(../photos/camera.svg) no-repeat center center transparent; background-size:24px}
.repair_inner .upload input[type=button]:active{opacity:.6}
.repair_inner .upload img{width:100%; max-height:100%;border-radius:5px}
.repair_inner input[type=text].bikenb{width:80%;height: 3em;}
input[type=button].bikecamera{position:relative; width:17%; height:3em; border:none; appearance:none;	-moz-appearance:none;-webkit-appearance:none; background:#f2f2f2 url(../photos/camera.svg) no-repeat center center; background-size:24px; border-radius: .5em; float: right}
input[type=button].bikecamera:active{background:#ecb50e url(../photos/camera_white.svg) no-repeat center center; background-size:24px}
.repair_inner input[type=text].portnb{width:55%}
.repair_inner .dash{display:inline-block; width:5%; height:2px; background:rgba(134,134,134,1.00); margin:5px 1.5%}
.repair_inner select.port{width:35%}
.repair_item{position:relative; width:80%; margin:0 auto 10px}
.cd-tabs__content li .repair_item li{position:relative; width:100%; padding:0}
.cd-tabs__content li .repair_item li:first-child{padding-top:5px}
.repair_item li .label_check input{ position: absolute; left: -9999px}
.repair_item li .label_check{margin: -2px 6px 0 -32px;width:125%;height:50px;display:block;float:left;text-indent:40px;line-height:2;background: url(../photos/check_off.svg) no-repeat left center;background-size:30px;color:rgba(178,178,178,1.00);padding: 10px 0;}
.repair_item li label.c_on{ background:url(../photos/check.svg) no-repeat left center; background-size:30px; color: #212121}
.repair_inner span.warning{display: none;color: red;font-size: 80%;}

.record_container{position:relative; width:100%; font-size:90%}
.record_container .moneybank{position:relative; width:auto; color:rgb(236, 177, 0); line-height:1.4; padding-left:10px}
.cd-tabs__content li .record_container li{position:relative; width:100%; float:left; padding:0 0 10px; border-bottom: solid 1px #ececec; word-break: break-all;}
.cd-tabs__content li .record_container #expense{padding:0; border-bottom:solid 1px #ececec}
.cd-tabs__content li .record_container #expense ul li{float:none; width:100%; border-bottom:none; box-shadow:none; padding:0 10px 5px; margin:0}
.record_container #expense ul li .date{margin-left:-10px}
.cd-tabs__content li .record_container .expense.list{padding:5px 0 0; clear:both;}
.cd-tabs__content li .record_container .expense.list span{float:left}
.cd-tabs__content li .record_container #expense ul li p:nth-child(2){clear:none; padding:0 10px 0 0; width:auto}
.cd-tabs__content li .record_container #expense_title p{width:auto; font-size:100%}
.cd-tabs__content li .record_container #expense ul ul p.short{font-size:90%}
.record_container li a{position:relative; width:100%; height:100%; float:left}
.cd-tabs__content li .record_container #expense_total{font-size:100%}
.cd-tabs__content li .record_container li p:nth-child(2){clear:both; width:90%; margin:0 auto; padding:10px 0}
.cd-tabs__content li .record_container li.rentcode p:nth-child(3){clear:both; width:90%; margin:0 auto; padding:0 0 10px}
.cd-tabs__content li .record_container li.rentcode h1{font-size:100%; width:90%; clear:both; margin:0 auto; line-height:2em; color:#000000}
.record_container li .date:before{content:"";display:block;width:10px;height: 18px;position:  absolute;right: -5px;top:-.15em;transform:skewX(-20deg);background: #ffc107;-webkit-border-bottom-right-radius: 8px;-moz-border-radius-bottomright: 8px;border-bottom-right-radius: 8px}
.record_container li .date{position:relative;float:left;background:rgb(255, 193, 7) ;color:rgb(255, 255, 255);font-size:75%;padding:0 10px 0 5px;border: solid 0.14em rgb(255, 193, 7);-webkit-border-bottom-right-radius: 8px;-moz-border-radius-bottomright: 8px;border-bottom-right-radius: 8px; margin-right:15px}
.record_container li .date:after{content:"推播时间:";display:block; font-size:70%; position: relative; float: left; margin-right:5px; line-height:1.7}
/****初版推播日期樣式
.record_container li:first-child .date{margin:0 10px}
.record_container li .date{position:relative;float:left;background:rgb(255, 193, 7) ;color:rgb(255, 255, 255);font-size:75%;padding:4px 5px;margin:10px 10px 0;border: solid 0.14em rgb(255, 193, 7);border-radius: 8px;}
.record_container li .date:before{content:"";display:block;width: 11px;height: 11px;border-color:transparent rgb(255, 193, 7) transparent transparent;position:  absolute;left: -12px;top: 7px;border-style:solid;border-width: 5px;}
.record_container li .date:after{content:"推播時間:";display:block; font-size:70%; position: relative; float: left; margin-right:5px; line-height:1.7}
.cd-tabs__content li .record_container .return .date{border: solid 0.14em #607D8B; background:#607D8B}
.cd-tabs__content li .record_container .return .date:before{border-color:transparent #607D8B transparent transparent}.cd-tabs__content li .record_container .return .moneybank{color:#607D8B}
初版推播日期樣式****/
.cd-tabs__content li .record_container .inner{position:relative; width:100%; clear:both; padding:10px 0 0}
.cd-tabs__content li .record_container .inner .detail{position:relative; float:left; width:84%; font-size:80%} 
.cd-tabs__content li .record_container .inner .detail p i{display:block; width: 17px;height: 17px;border-radius:15px;text-align:  center;padding: 0; margin-right:3px; float:left; font-style:normal; line-height:1.2}
.cd-tabs__content li .record_container .inner .detail p i.dash{height:.1em; background:#262626; margin:7px 2px 0; width:10px}
.cd-tabs__content li .record_container .inner .detail p:nth-child(2) i:first-child{border:solid .08em rgb(255, 193, 7);color:rgb(236, 177, 0)}
.cd-tabs__content li .record_container .inner .detail p:nth-child(2) i:nth-child(4){border:solid .085em #607D8B;color:#607D8B}
.cd-tabs__content li .record_container .inner .detail p:nth-child(2){padding:10px 0 0; width:100%; float:left}
.cd-tabs__content li .record_container .inner .detail p:nth-child(2) span{float:left; color:#262626; letter-spacing:-.04em; font-weight:normal}
.cd-tabs__content li .record_container .inner .moneybank{position:absolute; width:auto; color:rgb(236, 177, 0); right:3%; line-height:2.8}
.cd-tabs__content li .record_container .inner .title{position:relative; float:left; display:block; width:16%; text-align:center; line-height:71px;color:rgb(236, 177, 0); font-size:100%}
.cd-tabs__content li .record_container .inner .title:before{content:"补扣款"}
.cd-tabs__content li .record_container .inner .detail p:first-child span:nth-child(odd){color:#B3B3B3; padding-right:3px}
.cd-tabs__content li[data-content=borrowing],.cd-tabs__content li[data-content=charge]{padding-bottom:20px}
.cd-tabs__content li[data-content=borrowing] .record_container li:last-child,.cd-tabs__content li[data-content=charge] .record_container li:last-child{border:none}
.cd-tabs__content li[data-content=borrowing] .record_container li,.cd-tabs__content li[data-content=charge] .record_container li {float:left; padding:0}
.cd-tabs__content li[data-content=borrowing] .record_container li a,.cd-tabs__content li[data-content=charge] .record_container li a{float:left}
.cd-tabs__content li .record_container .return .inner .title:before{content:"借-还";color:#607D8B; letter-spacing:-.05em}

.cd-tabs__content li .record_container .rent .inner .title:before{content:"借车"; letter-spacing:.2em}
.cd-tabs__content li .record_container .rent .title{color:rgb(236, 177, 0)}
.cd-tabs__content li .record_container .rent .inner .detail p:first-child span:nth-child(3),.cd-tabs__content li .record_container .rent .inner .detail p:first-child span:nth-child(4),.cd-tabs__content li .record_container .rent .inner .detail p:first-child span:nth-child(5),.cd-tabs__content li .record_container .rent .inner .detail p:first-child span:nth-child(6),.cd-tabs__content li .record_container .rent .inner .detail p:first-child span:nth-child(7),.cd-tabs__content li .record_container .rent .inner .detail p:first-child span:nth-child(8),.cd-tabs__content li .record_container .rent .inner .detail p:nth-child(2) i:nth-child(4),.cd-tabs__content li .record_container .rent .inner .detail p i.dash,.cd-tabs__content li .record_container .rent .inner .detail p:nth-child(2) span:nth-child(2),.cd-tabs__content li .record_container .rent .inner .detail p:nth-child(3) span:nth-child(2){display:none}
.cd-tabs__content li .record_container .rent .inner .detail p:nth-child(3) span{width:auto}
.cd-tabs__content li .record_container .inner .detail p:nth-child(3) span{width:47%; display:block; float:left; padding:0 0 0 7%; margin:0 22px 0 0; word-break:break-all; color:#B3B3B3}
.cd-tabs__content li .record_container .inner .detail p:nth-child(3) span:nth-child(2){width:45%; padding:0; margin:0}
.cd-tabs__content li .record_container .inner .detail p:first-child span:nth-child(5){padding:0; letter-spacing:-.1em}
.cd-tabs__content li[data-content=charge] .inner .detail p:first-child span:nth-child(14){line-height:2.5em}
.cd-tabs__content li[data-content=charge] .inner .detail p:first-child span:nth-child(12){display:inline-block; width:78%; padding:10px 0 0}
.cd-tabs__content li[data-content=charge] .inner .detail p:first-child span:nth-child(9),.cd-tabs__content li[data-content=charge] .inner .detail p:first-child span:nth-child(11){display:inline-block; width:60px}

#code_container{position:relative; width:100%; margin:25px auto 40px}
#code_container .type{color:#B3B3B3; text-align:center; font-size:100%; line-height:1.6}
#code_container a.scan{position:relative; display:block; width:220px; padding:10px; background:rgba(255,193,7,1.00); margin:0 auto 25px;}
#code_container a.scan:before{content:"扫一扫";display:block;width:140px;height: 190px;margin:0 auto;background: url(../photos/scan.png) no-repeat center 24px;background-size: 85%;color:#FFFFFF;text-align:center;font-size:  120%;line-height: 342px;}
#code_container a:active.scan{opacity:.6}
#code_container input[type=file]{position:absolute; top:0; left:20%; z-index:2; display:block; width:220px; height:190px; opacity:0}
.display_code{position:relative; width:40%; margin:10px auto}
.display_code img{max-width:100%; max-height:100%}
#system_type{position:relative; width:80%; margin:0 auto; text-align:center}
#system_type h2{border-bottom: solid 2px #dddbdb;font-size: 25px; min-height: 50px; line-height: 1.5em;}
#system_type p{padding: 15px 0;  line-height: 1.6em;}
#system_type .pic{position:relative; width:30%; margin:0 auto}
#system_type .pic img{max-width:100%}
.scan_record{position:relative; width:100%; height:100%}
.scan_record .date{position:relative; width:100%; background:rgba(239,239,244,1.00); font-size:100%; text-align:center; padding:10px 5px; letter-spacing:.03em}
.scan_record .date span{padding-left:10px}
.scan_record .detail{position:relative; width:100%; padding:10px 4%;margin-bottom:10px}
.scan_record #main_button{margin-top:35px}
.scan_record .detail.return .list_route .station{width:62%}
.scan_record .detail.return .list_route .point{width:36px; padding:7px 0 0}
.scan_record .detail.return .list_route .time,#expense ul ul .list_route .time{position:relative; width:25%; float:left; font-size:75%; color:rgba(255,193,7,1.00); text-align:center}
.scan_record .detail.return .list_route .time p:first-child{padding:5px 0 20px}
#expense ul ul .list_route .time p:first-child{padding:0 0 5px}
.scan_record .detail.return .list_route .time p span,#expense ul ul .list_route .time p span{display:block; width:100%; color:rgba(154,154,154,1.00); font-size:120%}
#set_container{position:relative; width:90%; margin:10px auto}
#set_container h1{font-size:90%; color:rgba(154,154,154,1.00); font-weight:normal; padding:12px 0 6px; border-bottom:solid .04em rgba(154,154,154,1.00)}
#set_container p{position:relative; width:100%; padding:10px 0; color:#212121}
#set_container p a{position:relative; width:100%; height:100%; display:block; color:#212121}
#set_container p span{display:block; width:100%; font-size:80%; color:rgba(154,154,154,1.00); padding:10px 0 5px}
#set_container p:last-child span{width:auto; float:right; padding:0 10px 0; font-size:100%}
#set_container p select{float:right;border:none;appearance:none;-moz-appearance:none;-webkit-appearance:none;background:none;font-size:100%;color:rgba(255,160,0,1.00);position: absolute;display:  block;width:  100%;z-index:  1;top: 0;left: 0;height: 40px;direction: rtl;}
#about{position:relative; height:90%; margin:10px auto 0; width:100%; padding:0 5% 30px}
#about h1{font-size:105%}

/*欠費繳款*/
#member_id{position:relative; width:100%; background:rgba(239,239,244,1.00); padding:20px 5px 10px 60px}
#member_id .container input,.expense.list .container input{position: absolute; opacity: 0; cursor: pointer;}
#member_id .checkmark{top:15px; left:22px;}
.expense.list .checkmark{top:0; left:0; }
#member_id .checkmark,.expense.list .checkmark{position: absolute;height: 25px; width: 25px;  background-color:#FFFFFF; border:2px solid #ffc107}
#member_id .container:hover input ~ .checkmark,.expense.list .container:hover input ~ .checkmark{background-color: #FFFFFF; border:solid 2px #ffc107}
#member_id .container input:checked ~ .checkmark,.expense.list .container input:checked ~ .checkmark{background-color: #ffc107; border:solid 2px #ffc107}
#member_id .checkmark:after,.expense.list .checkmark:after{content: ""; position: absolute; display: none;}
#member_id .container input:checked ~ .checkmark:after,.expense.list .container input:checked ~ .checkmark:after{display: block;}
#member_id .container .checkmark:after,.expense.list .container .checkmark:after{left: 6px; top:-2px;  width: 10px; height: 18px; border: solid white;   border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
#expense{position:relative; padding:15px 0; width:100%}
#expense ul{position:relative}
#expense ul li{width:95%; margin:0 auto; padding:10px; border-left:solid 3px #ffc107; box-shadow:0px 0px 6px #dcdcdc; background:#FFFFFF; margin-bottom:20px}
.expense.list{padding:0 0 8px 35px; position:relative}
.expense.list p{width:auto; font-size:87%; font-weight:800}
#expense_title{padding:10px 0 0; font-size:90%; line-height:1.5em; letter-spacing:-.1em}
#expense_title p{display:inline-block; padding:0 10px 0 0}
#expense_title p:last-child{padding:0}
.expense_detail{ color:#648ea2; padding:5px 0; position:relative}
.expense_detail::after{content:'';display:block; position:absolute; right:10px; top:5px; width:18px; height:18px; background:url(../photos/down_blue_arrow.svg) no-repeat center center; background-size:100%}
#expense ul li.active .expense_detail,#expense ul li.open .expense_detail{border-bottom:1px solid #dbe5e8}
#expense ul li.active .expense_detail::after,#expense ul li.open .expense_detail::after{background:url(../photos/up_blue_arrow.svg) no-repeat center center; background-size:100%}
#expense ul ul{font-size:80%;position:relative; width:100%; padding:6px 0 10px; clear:both; border:none; box-shadow:none; display:none}
#expense ul ul p{line-height:1.6em}
#expense ul ul p.short{display:inline-block; min-width:35%; padding-right:30px}
#expense ul ul p span.fee{display:inline-block; position:absolute; right:0; font-weight:bold}
#expense ul ul h1{font-size:120%;line-height:1.5em;text-indent: 7px; position:relative; padding:10px 0}
#expense ul ul h1::before{content:'';display: inline-block;width: 20px;height: 20px;background:url(../photos/yeollw_arrow.svg) no-repeat left center;background-size:100%;position: absolute;left: -10px;top:10px}
#expense ul ul p i{float:left; display:block; width:20px; height:20px; border-radius:20px; border:solid 1px #1ba1ce; font-style:normal; text-align:center; line-height:1.4em; color:#02bbf0; margin:0 3px}
#expense ul ul p.station,#expense ul ul p.station:nth-child(even){float:left; min-width:50%; padding-bottom:10px}
#expense ul ul p.station:nth-child(even){padding-left:1%}
#expense ul ul p.station:nth-child(even) i{background:#02bbf0; color:#FFFFFF}
#expense ul ul p span{line-height:1.6em}
#expense ul ul p.item{padding:5px 0 0 28px; text-indent:-27px}
#expense ul ul p.item i{margin:0 31px 0 -24px; text-indent:-1px}
#expense_total{position:relative; width:95%; margin:0 auto; border-top:dashed 1px #676767; padding:15px 0 0; font-size:90%}
#expense_total div{display:inline-block; padding:0 10px 10px 0}
#expense_total.one div{width:100%; text-align:right}
#expense_total.one div h2{display:inline-block}
#expense_total div h2{font-size:97%}
.scan_record #main_button.expenseBT{margin-top:0}

/*搜尋欄*/
#thing-search{
	position:relative;
	margin:5px auto;
	width: 74%;
	min-width: 60px;
	height: 40px;
	overflow: hidden;
	-webkit-transform: translate3d(0,0,0);
     -moz-transform: translate3d(0,0,0);
          transform: translate3d(0,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
}
#thing-search form:after{content:""; display:block; width:20px; height:20px; position:absolute; right:12px; top:10px; background:url(../photos/Search_input_org.svg) no-repeat center center; background-size:20px; z-index:9999}
#thing-search .sb-search-input{position:relative;border:solid 1px #ff7907; padding:20px 54px 18px 10px; width:100%; left:inherit}
#thing-search .sb-search-submit{z-index:99999; opacity:1; background:transparent; height:44px}

.sb-search {
	position:absolute;
	margin-top: 10px;
	width: 0%;
	min-width: 60px;
	height: 40px;
	float: right;
	overflow: hidden;
	top:17px;
	right:0;
	-webkit-transition: width 0.3s;
	-moz-transition: width 0.3s;
	transition: width 0.3s;
	-webkit-backface-visibility: hidden;
}

.sb-search-input {
	position: absolute;
	top: 0;
	left: 60px;
	border: none;
	outline: none;
	background: #fff;
	width: 68%;
	height: 40px;
	margin: 0 auto;
	z-index: 10;
	padding-left: 4%;
	padding-right: 4%;
	font-family: inherit;
	font-size: 0.9em;
	color: #2c3e50;
  border-radius:5px;
}

.sb-search-input::-webkit-input-placeholder {
  color: #efb480;font-size: 90%;
  text-align: center;
}

.sb-search-input:-moz-placeholder {
  color: #efb480;font-size: 90%;
  text-align: center;
}

.sb-search-input::-moz-placeholder {
  color: #efb480;font-size: 90%;
  text-align: center;
}

.sb-search-input:-ms-input-placeholder {
  color: #efb480;font-size: 90%;
  text-align: center;
  
}

.sb-icon-search,
.sb-search-submit  {
	width: 60px;
	height: 52px;
	display: block;
	position: absolute;
	right: 0;
	top: -2px;
	padding: 0;
	margin: 0;
	line-height: 60px;
	text-align: center;
	cursor: pointer;
	bottom: -9px;
}

.sb-search-submit {
	background: #fff; /* IE needs this */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */
    filter: alpha(opacity=0); /* IE 5-7 */
    opacity: 0;
	color: transparent;
	border: none;
	outline: none;
	z-index: -1;
}

.sb-icon-search {
	background: #ffc107;
	z-index: 90;
}

.sb-icon-search:before {
	content:"";
	display:block; width:24px; height:24px; background-size:100%;position: absolute;
    top: 24%;
    left: 27%;
	background:url(../photos/Search_input_white.svg) no-repeat center center
}

/* Open state */
.sb-search.sb-search-open{
	width: 100%;
}
.sb-search.sb-search-open form:before{content:""; display:block; width:15px; height:15px; position:absolute; left:70px; top:13px; background:url(../photos/Search_input_org.svg) no-repeat center center; background-size:15px; z-index:9999}
.sb-search.sb-search-open .sb-icon-search{
	color: #fff;
	z-index: 11;
}
.sb-search.sb-search-open .sb-icon-search:before{
	content:"取消";
	background:none;
	width:auto; font-size:100%;
	top:-13%; left:16%
}
.sb-search.sb-search-open .sb-search-submit{
	z-index: 90;
}

/*判斷視窗動畫*/
.loading_background{position:absolute; top:0; left:0; width:100%; height:100%; display:block; background:rgba(0,0,0,0.56); z-index:9}
.loading_background .inner{background:rgba(255,255,255,1.00); border-radius:5px; box-shadow:0px 1px 2px #3c3c3c; width:100px; height:100px; top:47%; position:relative; margin:0 auto}
.loading_background .inner span{position:absolute; display:block; width:100%; text-align:center; bottom:10px; font-size:90%}
.loading_background .loading {
	border: 3px solid rgba(255,193,7,1.00);
	border-right: 3px solid rgba(255, 193, 7, 0.84);
	border-bottom: 3px solid rgba(255, 193, 7, 0.11);
	height: 48px;
	width: 48px;
	left:0; top:26px;
	border-radius: 50%;
	-webkit-animation: loading 1s infinite linear;
	-moz-animation: loading 1s infinite linear;
	-o-animation: loading 1s infinite linear;
	animation: loading 1s infinite linear;
}
@-webkit-keyframes loading {
	from {
		-webkit-transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
	}
}
@-moz-keyframes loading {
	from {
		-moz-transform: rotate(0deg);
	}
	to {
		-moz-transform: rotate(360deg);
	}
}
@-o-keyframes loading {
	from {
		-o-transform: rotate(0deg);
	}
	to {
		-o-transform: rotate(360deg);
	}
}
@keyframes loading {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}


.check-box {
  height: 100px;
  width: 100px;
  position: relative;
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-transition: border-color ease 0.2s;
  -o-transition: border-color ease 0.2s;
  -webkit-transition: border-color ease 0.2s;
  transition: border-color ease 0.2s;
  cursor: pointer;
}
.check-box::before, .check-box::after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  height: 0;
  width: 4px;
  background-color:rgba(255,193,7,1.00);
  display: inline-block;
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  -o-transform-origin: left top;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  border-radius: 4px;
  content: ' ';
  -webkit-transition: opacity ease .5;
  -moz-transition: opacity ease .5;
  transition: opacity ease .5;
}
.check-box::before {
  top: 58px;
  left: 45px;
  -moz-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
.check-box::after {
  top: 46px;
  left: 31px;
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}


.check-box::after {
  height: 18px;
  -moz-animation: dothabottomcheck 0.2s ease 0s forwards;
  -o-animation: dothabottomcheck 0.2s ease 0s forwards;
  -webkit-animation: dothabottomcheck 0.2s ease 0s forwards;
  animation: dothabottomcheck 0.2s ease 0s forwards;
}
.check-box::before{
  height: 38px;
  -moz-animation: dothatopcheck 0.4s ease 0s forwards;
  -o-animation: dothatopcheck 0.4s ease 0s forwards;
  -webkit-animation: dothatopcheck 0.4s ease 0s forwards;
  animation: dothatopcheck 0.4s ease 0s forwards;
}
/* Checkmark style starts */
@-moz-keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 18px;
  }
}
@-webkit-keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 18px;
  }
}
@keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 18px;
  }
}
@-o-keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 18px;
  }
}
	
@keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}
@-webkit-keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}
@-moz-keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}

@-o-keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}

@-moz-keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 50px;
  }
}
@-webkit-keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 18px;
  }
}
@keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 18px;
  }
}
@-o-keyframes dothabottomcheck {
  0% {
    height: 0;
  }

  100% {
    height: 18px;
  }
}
@keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}
@-webkit-keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}
@-moz-keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}
@-o-keyframes dothatopcheck {
  0% {
    height: 0;
  }

  50% {
    height: 0;
  }

  100% {
    height: 38px;
  }
}
/*判斷視窗動畫 END*/


header.login{background:#FFFFFF}
header.login h1{color:#212121}
header.login [class*="menu-"] i.back{background:url(../photos/back_blue.svg) center center; background-size:100%; left:20px}
header.login [class*="menu-"] i.close,header.login [class*="menu-"] a.close i{background:url(../photos/close_blue.svg) center center; background-size:100%; left:20px}
#login_container{position:relative; width:90%; margin:5px auto; height:100%; padding-bottom:50px}
#login_container.scroll .loginkeyin_button{position:relative}
#login_container .mainpic{position:relative; width:67%; margin:0 auto; text-align:center}
#login_container .mainpic img{max-width:100%}
#login_container .mainpic.app img{max-width:40%}
#login_container .loginkeyin{position:relative; width:90%; margin:15px auto; /*min-height:43%*/}
#login_container .loginkeyin p{padding:5px 0; position:relative; width:100%; clear:both; margin:0 auto 10px; min-height:67px}
#login_container .loginkeyin p span{color:rgba(250,0,104,1.00); font-size:80%; display:block; width:100%; text-align:right; line-height:2em}
#login_container .loginkeyin p.line_message input[type=text],#login_container .loginkeyin p.line_message span{width:65%; float:left}
#login_container .loginkeyin.crowded p.line_message .countdown{display:block;background:rgba(154,154,154,1.00);color:#FFFFFF;float: left;width:  auto; position:  absolute;left:  68%;border-radius:  10px;padding:0 8px;text-align:  left;font-size: 100%;}
#login_container .loginkeyin.crowded p.line_message .countdown span{width:auto; float:initial; padding:0 3px; font-size:120%; color:#FFFFFF; display: initial}
#login_container .loginkeyin p.line_message button{background:none; border:solid .04em rgba(255,193,7,1.00); border-radius:5px; color:rgba(255,193,7,1.00); font-size:90%; font-weight:bold; padding:8px; margin:-7px 0 0 10px}
#login_container .loginkeyin p.line_message button:active{background:rgba(232,174,2,1.00); border:solid .04em rgba(232,174,2,1.00); color:#FFFFFF}
#login_container .loginkeyin p.line_message i.alert{left:55%; right:initial}
#login_container .loginkeyin p.note{font-size: 76%;color:rgb(177, 177, 177);line-height:1.2em}
#login_container .loginkeyin p .label_check input { position: absolute; left: -9999px }
#login_container .loginkeyin p .label_check{margin:-6px 3px 0 0;width:28px;height:28px;display:block;float:left;background:url(../photos/subscribe_check_off.svg) no-repeat; background-size:30px}
#login_container .loginkeyin p .label_check.item{width:50%;text-indent:44px;line-height: 2.8;font-size:130%;border-bottom: solid .04em rgba(230,230,230,1.00);margin:-6px 0 0;background-position: 2px 6px;height: 40px;}
#login_container .loginkeyin p .label_check.item.paper{border:none; font-size:92%; line-height:4}
#login_container .loginkeyin p label.c_on{ background:url(../photos/subscribe_check.svg) no-repeat; background-size:30px}
#login_container .loginkeyin p span.type{color:rgba(96,125,139,1.00);font-size:70%;position:  absolute;z-index:  9;left: 46px;top: -10px;width: auto;-webkit-animation: itemtype-in 0.5s;  animation: itemtype-in 0.5s}
@-moz-keyframes itemtype-in {
  0% {
    top: 0;
	opacity:0
  }
  
  50%{opacity:.2}

  100% {
    top:-10px;
	opacity:1
  }
}
@-webkit-keyframes itemtype-in {
  0% {
    top: 0;
	opacity:0
  }
  
  50%{opacity:.2}

  100% {
    top:-10px;
	opacity:1
  }
}
@keyframes itemtype-in {
  0% {
    top: 0;
	opacity:0
  }
  
  50%{opacity:.2}

  100% {
    top:-10px;
	opacity:1
  }
}
@-o-keyframes itemtype-in {
  0% {
    top: 0;
	opacity:0
  }
  
  50%{opacity:.2}

  100% {
    top:-10px;
	opacity:1
  }
}
#login_container .loginkeyin p i{display:block; width:30px; height:30px; position:absolute; top:6px; left:3px; z-index:999999}
#login_container .loginkeyin p i.correct{right:3px; left:initial; background:url(../photos/correct.svg) no-repeat center -3px; background-size:120%}
#login_container .loginkeyin p i.alert{right:20px; left:initial; background:url(../photos/tooltip_alert.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.edit_password{right:3px; left:initial; background:url(../photos/edit_password.svg) no-repeat center center; background-size:100%; cursor:pointer}
#login_container .loginkeyin p i.privacy{right:4px; left:initial; background:url(../photos/eyes.svg) no-repeat center center; background-size:100%; cursor:pointer}
#login_container .loginkeyin p i.privacy_off{background:url(../photos/close_eyes.svg) no-repeat center center; background-size:86%; cursor:pointer}
#login_container .loginkeyin p i.id_type{right:3px; left:initial; background:url(../photos/ID_type.svg) no-repeat center center; background-size:100%; cursor:pointer}
#login_container .loginkeyin p i.card_tytpe{right:3px; left:initial; background:url(../photos/categories.svg) no-repeat center center; background-size:100%; cursor:pointer}
#login_container .loginkeyin p i.privacy.active,#login_container .loginkeyin p i.id_type.active,#login_container .loginkeyin p i.card_tytpe.active{right:25px}
#login_container .loginkeyin p i.id{background:url(../photos/name.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.passcode{background:url(../photos/passcode.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.mobile{background:url(../photos/mobile.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.message{background:url(../photos/message.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.cardNB{background:url(../photos/card_number.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.area{background:url(../photos/area.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.card_type{background:url(../photos/categories.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.birthday{background:url(../photos/gift.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.address{background:url(../photos/address.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin p i.email{background:url(../photos/mail.svg) no-repeat center center; background-size:100%}
#login_container .loginkeyin input[type=text]::-webkit-input-placeholder,#login_container .loginkeyin input[type=password]::-webkit-input-placeholder, #login_container .loginkeyin input[type=tel]::-webkit-input-placeholder { /* Chrome/Opera/Safari */color:rgba(178,178,178,1.00)}
#login_container .loginkeyin input[type=text]::-moz-placeholder,#login_container .loginkeyin input[type=password]::-moz-placeholder ,#login_container .loginkeyin input[type=tel]::-moz-placeholder{ /* Firefox 19+ */color:rgba(178,178,178,1.00)}
#login_container .loginkeyin input[type=text]:-ms-input-placeholder,#login_container .loginkeyin input[type=password]:-ms-input-placeholder ,#login_container .loginkeyin input[type=tel]:-ms-input-placeholder{ /* IE 10+ */color:rgba(178,178,178,1.00)}
#login_container .loginkeyin input[type=text]:-moz-placeholder,#login_container .loginkeyin input[type=password]:-moz-placeholder, #login_container .loginkeyin input[type=tel]:-moz-placeholder{ /* Firefox 18- */color:rgba(178,178,178,1.00)}
#login_container .loginkeyin input[type=text],#login_container .loginkeyin input[type=password],#login_container .loginkeyin input[type=button], #login_container .loginkeyin input[type=tel] {border-top:none; border-left:none; border-right:none; border-bottom:solid .04em rgba(230,230,230,1.00); position:relative; width:96%; font-size:100%; line-height:2; color:#000000; padding:0 45px}
#login_container .loginkeyin input[type=password]:disabled{background:none; color:#000000}
#login_container .loginkeyin input[type=date]{border:none; background:rgba(255,255,255,1.00); padding-left:45px; border-bottom:solid .04em rgba(230,230,230,1.00); width:100%; font-size:100%; line-height:1.8; color:#000000; appearance:none;  -moz-appearance:none;  -webkit-appearance:none;min-height:32px}
#login_container .loginkeyin input[type="date"]:before{color:rgba(178,178,178,1.00); content:attr(placeholder);}
#login_container .loginkeyin input[type="date"]:focus:before,#login_container .loginkeyin input[type="date"]:valid::before{ content: '' !important;}
#login_container .loginkeyin input[type=button]{color:rgba(178,178,178,1.00);background:transparent; text-align:left}
#login_container .loginkeyin_button{position:relative; clear:both; width:100%; display:block; text-align:center}
#login_container .loginkeyin_button .note{text-align:center; color:rgba(178,178,178,1.00); font-size:80%; padding-bottom:10px; line-height:1.4}
#login_container .loginkeyin_button a{display:block; width:100%; height:100%; padding:10px}
#login_container .loginkeyin_button a.secblack{color:#000000; margin:10px 0 0}
#login_container .loginkeyin_button a.boxbutton{display:block; width:80%; border-radius:5px; background:rgba(255,193,7,1.00); color:#FFFFFF; margin:0 auto; line-height:2.5; padding:0}
#login_container .loginkeyin_button a.boxbutton:active{background:rgba(232,174,2,1.00)}
#login_container .loginkeyin_button a.regactive{background: white !important;border: 1px solid #676767 !important;color: #060606;opacity: 1; cursor: not-allowed}
#login_container .loginkeyin_button span{color:#B3B3B3;width: 265px;line-height:3;margin: 0 auto;display:  block;}
#login_container .loginkeyin_button span a{float:right;width:initial;padding: 0 17px 0 0;color:#000000;}
#login_container .loginkeyin_button span a:active{color:rgba(232,174,2,1.00)}
#login_article{position:relative; width:90%; margin:0 auto 15px; height:86%; line-height:1.6; padding:5px 0 0}
#login_service{position:relative; width:90%; margin:0 auto 15px; height:86%; line-height:1.6; padding:5px 0 0}
/*側選單*/
header{background:rgba(255,193,7,1.00); height:100px; padding:50px 0 0;
  -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
         transform: translate3d(0,0,0);
 -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
         transition: all 500ms ease-in-out;}
header div{width:100%}
header div{width:100%}
header [class*="menu-left"]{float:left}
header [class*="menu-right"]{float:right}
header [class*="menu-"] i{display:inline-block; width:25px; height:25px; position:absolute}
header [class*="menu-"] i.menu{background:url(../photos/nav_menu.svg) no-repeat center center; background-size:100%; left:20px}
header i.searchlist{background:url(../photos/searchlist.svg) no-repeat center center; background-size:100%; right:20px; top:35px; width:30px; height:30px}
header i.cardadd{background:url(../photos/cardadd.svg) no-repeat center center; background-size:110%; right:20px; top:35px; width:30px; height:30px}
header i.lightning{background:url(../photos/lightning.svg) no-repeat center center; background-size:90%; right:20px; top:35px; width:30px; height:30px}
header i.lightning.on{background:url(../photos/lightning_on.svg) no-repeat center center; background-size:90%;}
header a.save{right:20px; top:35px; color:#FFFFFF; position:absolute}
header a:active.save{opacity:.6}
header [class*="menu-"] a.back{display:block; width:25px; height:25px; position:absolute; left:20px}
header [class*="menu-"] a.back i{background:url(../photos/nav_back.svg) no-repeat center center; background-size:100%}
header [class*="menu-"]:active i{opacity:.3}
header [class*="menu-"],header.login [class*="menu-"]{
  cursor: pointer;
  height: initial;
  width: initial;
  padding:5px 0
}
header h1 {
  color: #FFFFFF;
  font-size:130%;
  font-weight: 100;
  padding: 0;
  text-align:left;
  text-indent:60px;
  line-height:1.8em
}
header h1.notitle{ min-height:38px }
.intro {
  margin: 0 auto;
  padding: 0;  
  width:100%; height:87%; overflow:hidden;
  -webkit-transform: translate3d(0,0,0);
     -moz-transform: translate3d(0,0,0);
          transform: translate3d(0,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
}
[id*="menu-"] {
  background: #FFFFFF;
  bottom: 0;
  color: #858585;
  height: 100%;
  position: fixed;
  top: 0;
  width: 70%;
  z-index: 99;
}
[id*="menu-"] .box {
  height: 100%;
  margin: 0;
  padding:0 0 25px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
[id*="menu-"] .box::-webkit-scrollbar {
  height: 4px;
  width: 4px;
  display:none
}
[id*="menu-"] ul {
  margin: 0;
  padding: 0;
  border-bottom:solid 1px rgba(230,230,230,1.00)
}
[id*="menu-"] ul:last-child{border-bottom:none}
[id*="menu-"] ul ul li{padding:5px 5px}
[id*="menu-"] ul ul li a{padding:5px 0 5px 70px;font-size:95%; color:rgba(103,103,103,1.00)}
[id*="menu-"] li {
  font-size:100%;
  line-height: 28px;
  margin: 0;
  overflow: hidden;
  padding:10px 5px;
  position: relative;
  clear:both
}
[id*="menu-"] li a{color:#000000; display:block; width:100%; height:100%; padding:5px 0}
[id*="menu-"] li a:active{color:#ffa000}
[id*="menu-"] li a i{display:inline-block; margin:0 20px; width:26px; height:28px; float:left}
[id*="menu-"] li a i.map{background:url(../photos/sidebar_map.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.map{background:url(../photos/sidebar_map_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.changarea{background:url(../photos/sidebar_changarea.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.changarea{background:url(../photos/sidebar_changarea_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.news{background:url(../photos/sidebar_news.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.news{background:url(../photos/sidebar_news_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.call{background:url(../photos/sidebar_call.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.call{background:url(../photos/sidebar_call_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.service{background:url(../photos/sidebar_service.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.service{background:url(../photos/sidebar_service_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.instruction{background:url(../photos/sidebar_instruction.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.instruction{background:url(../photos/sidebar_instruction_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.lost{background:url(../photos/sidebar_lost.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.lost{background:url(../photos/sidebar_lost_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.bike{background:url(../photos/sidebar_bike.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.bike{background:url(../photos/sidebar_bike_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.member{background:url(../photos/sidebar_member.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.member{background:url(../photos/sidebar_member_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.edit{background:url(../photos/edit.svg) no-repeat center center; background-size:100%; position:absolute; right:0}
[id*="menu-"] li a:active i.edit{background:url(../photos/edit_a.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a i.setting{background:url(../photos/sidebar_setting.svg) no-repeat center center; background-size:100%}
[id*="menu-"] li a:active i.setting{background:url(../photos/sidebar_setting_a.svg) no-repeat center center; background-size:100%}
#menu-left {
  left: -70%;
  box-shadow:inset -4px -8px 13px #dad9d9;
  -webkit-transform: translate3d(0,0,0);
     -moz-transform: translate3d(0,0,0);
          transform: translate3d(0,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
}
#menu-left .bottomBG{position:absolute; bottom:0; width:97%; min-height:40px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+49&0+0,1+50 */
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.98) 49%, rgba(255,255,255,1) 50%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.98) 49%,rgba(255,255,255,1) 50%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0.98) 49%,rgba(255,255,255,1) 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
#menu-left .profile {
  border-bottom:solid 2px rgba(181,194,201,1.00);
  padding: 50px 5px 13px;
  color:#ffa000;
  font-size:120%;
  position:relative
}
#menu-left .profile i{
  display: inline-block;
  height: 45px;  width: 45px;
  vertical-align: middle;
  background:url(../photos/member.svg) no-repeat center center; background-size:100%; margin:0 15px
}
#menu-left .profile span.laction{position:absolute; bottom:15px}
#menu-left .profile span.cardNB{position:absolute; top:50px; color:#000000; font-size:90%}
#menu-left.active{
  -webkit-transform: translate3d(100%,0,0);
     -moz-transform: translate3d(100%,0,0);
          transform: translate3d(100%,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
}

header.active,.intro.active,#container.active,#thing-search.active,#overlay-menu.active{
  -webkit-transform: translate3d(70%,0,0);
    -moz-transform: translate3d(70%,0,0);
         transform: translate3d(70%,0,0);
 -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
         transition: all 500ms ease-in-out;
}
.intro.active a,#container.active a{
    pointer-events: none;
}

#memberlogin{
	-webkit-transform: translate3d(0,0,0);
     -moz-transform: translate3d(0,0,0);
          transform: translate3d(0,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
}
#memberlogin:after{content:''; display:block; width:25px; height:25px; background:url(../photos/bluenav.png) no-repeat center center; background-size:100%; position:absolute; right:6%; top:18px}
#memberlogin.active:after{content:''; display:block; width:25px; height:25px; background:url(../photos/orgnav.png) no-repeat center center; background-size:100%; position:absolute; right:6%; top:18px}
.membermenu{
  height: 0;
  position:relative;
  width: 100%;
  overflow:hidden;
  opacity:0;
  -webkit-transition: opacity 1s ease-in-out;
     -moz-transition: opacity 1s ease-in-out;
	      transition: opacity 1s ease-in-out;
  -webkit-transition: height 500ms ease-in-out;
     -moz-transition: height 500ms ease-in-out;
          transition: height 500ms ease-in-out;
}
.membermenu.active{
	top:-8px;
	height:340px;  /*選單高度*/
	opacity:1;
  -webkit-transition: opacity 1s ease-in-out;
     -moz-transition: opacity 1s ease-in-out;
	      transition: opacity 1s ease-in-out;
  -webkit-transition: height 500ms ease-in-out;
     -moz-transition: height 500ms ease-in-out;
          transition: height 500ms ease-in-out;
}
#member_container{height:400px;  /*選單外框高度*/ border-bottom:none}
#menu_last{margin:-343px 0 0; /*選單底部位置*/ border-top: solid 1px rgba(230,230,230,1.00);
	-webkit-transform: translate3d(0,0,0);
     -moz-transform: translate3d(0,0,0);
          transform: translate3d(0,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
}
#menu_last.active{margin:0;}
/*側選單 END*/

/* pop視窗 */
.popup {
    width:100%;
    height:100%;
    display:none;
    position:absolute;
    top:0px;
    left:0px;
    background:rgba(0,0,0,0.60);z-index:999999
}
.popup#ad img{max-width:100%; /*height:100%*/}
.popup-inner {
    width:85%;
    padding:0;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%, -50%);
    transform:translate(-50%, -50%);
    box-shadow:0px 2px 6px rgb(84, 84, 84);
    border-radius:10px;
	font-size:110%; 
	line-height:1.5em;
	color:#393838;
	background:#FFFFFF
}
.popup-inner i{display:block ; width:100px; height:100px;  position:relative; margin:0 auto 5px}
.popup-inner i.alert{background:url(../photos/tooltip_alert.svg) no-repeat center center;background-size:100%;width:24px;height:24px;position:absolute;top: 13px;right:5px;}
.popup-inner .password span{display:block;width:95%;font-size:70%;text-align:right;color:rgba(250,0,104,1.00);line-height: 1.4;}
.popup-inner i img{max-width:100%}
.popup-inner h1{font-size:100%; text-align:center; padding:10px 0}
.popup-inner h2{margin-bottom:5px; font-size:100%; border-bottom:solid 1px #dcdcdc; padding:15px 20px} 
.popup-inner.wrong h2{margin-bottom:5px;font-size:95%;background:url(../photos/gray_wrong.svg) no-repeat 9px 13px;background-size:25px; padding: 15px 10px 15px 38px;border-bottom:solid 1px #dcdcdc; line-height:1.3}
.popup-inner.wrong .innerType{text-align:left}
.popup-inner.wrong p{border:none}
.popup-inner.scan h2{margin-bottom:5px;font-size:95%;background:url(../photos/check_green.svg) no-repeat center 10px;background-size:90px;border-bottom:none;line-height: 174px;height: 115px;text-align:center;overflow:  hidden; font-size:110%}
.popup-inner.scan.again h2{background:url(../photos/wrong.svg) no-repeat center 10px;background-size:90px}
.popup-inner.scan.attention h2{background: url(../photos/attention.svg) no-repeat center 18px;background-size:70px}
.popup-inner.scan.call h2{background: url(../photos/call.svg) no-repeat center 18px;background-size:70px}
.popup-inner .password p{border-top:none; min-height:62px; position:relative; padding-top:10px}
.popup-inner .password p input[type="password"]{border:none; font-size:100%; text-align:left; padding:0 0 13px 10px;  border-bottom:solid .05em #dcdcdc; width:93%}
.popup-inner .password p input[type="password"]::-webkit-input-placeholder{font-size:95%; color:rgba(178,178,178,1.00)}
.popup-inner .password p input[type="password"]::-moz-placeholder{font-size:95%; color:rgba(178,178,178,1.00)}
.popup-inner .password p input[type="password"]:-ms-input-placeholder{font-size:95%; color:rgba(178,178,178,1.00)}
.popup-inner .password p input[type="password"]:-moz-placeholder{font-size:95%; color:rgba(178,178,178,1.00)}
.popup-inner p{text-align:center; border-top:solid 1px #dcdcdc}
.popup-inner .innerType{width:89%; margin:0 auto; display:block; font-size:88%; line-height:1.2; text-align:center; padding-bottom:20px;word-break: break-all;}
.popup-inner a{color:#ffa000; position:relative; width:100%; display:block; line-height:3em; font-size:90%; padding-top:2px}
.popup-inner a:active{color:#e66c00}
.popup-inner p.twin a:first-child{border-right:solid 1px #dcdcdc}
.popup-inner p.twin a{width:50%; display:inline-block}
.popup-inner a.one{width:100%; display:inline-block; text-align:center}
.popup-close {
    width:135px;
    height:40px;
    display:inline-block;
    position:absolute;
    top:20px;
    right:20px;
	padding:0 5px 0 0;
    border-radius:10px;
    background:rgba(216, 216, 216, 1.00);
    font-size:30px;
    text-align:center;
    line-height:120%;
    color:rgba(255, 160, 0, 1.00);
}
.popup-close span{font-size:20px; color:#000000; font-weight:600; padding:0 8px}
.popup-close:active {
	color:rgba(255, 160, 0, 1.00); opacity:.6
}
.popup-inner .type{position:relative; width:100%; height:200px; overflow:hidden; overflow-y:auto; padding:0 5%; margin-bottom:15px}
.popup-inner .type h3{font-size:95%; color:#000000; border-bottom:solid .2em rgba(255,193,7,1.00); margin:0 0 5px 0; clear:both; padding:25px 0 0; line-height:2.5}
.popup-inner .type h3:first-child{padding:0}
.popup-inner .type ul{position:relative; width:100%}
.popup-inner .type li{font-size:90%; display:block;padding:10px 10px 10px 0;border-bottom:solid .08em rgba(210,210,210,1.00);position:relative;width: 87%;float:right;margin-bottom:10px; text-align:left}
.popup-inner .type li:last-child{border:none}
.popup-inner .type li .label_check input { position: absolute; left: -9999px; }
.popup-inner .type li .label_check{margin: -2px 6px 0 -32px;width:115%;height:30px;display:block;float:left; text-indent:40px}
.popup-inner .type li .label_check{ background:url(../photos/check_off.svg) no-repeat; background-size:30px}
.popup-inner .type li label.c_on{ background:url(../photos/check.svg) no-repeat; background-size:30px}
.popup-inner .type.leftside li{width:96%; border:none; position:relative; padding:10px 0}
.popup-inner .type.leftside li .label_check{float:right; background:none; width:100%; position:relative; text-indent:inherit}
.popup-inner .type.leftside li label.c_on{background:url(../photos/success.svg) no-repeat right -5px; background-size:28px}
.popup-inner .type.leftside li label.c_on span{font-weight:bold}
.popup-inner.photo_upload_option a{color: black; text-align: center}
.popup-inner.photo_upload_option hr{margin: 0 auto;}
/* pop視窗..END*/


/*地圖*/
#dituContent{width:100%; height:100%; position:relative}
.map_center{position:absolute; width:100%; height:100%; top:0; left:0; z-index:2}
a.yellowpeople{display:block; position:absolute; top:47%; left:45%; width:38px; height:38px; background:url(../photos/center_icon.png) no-repeat center center;  z-index:9999}
a.station_green{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;color:#FFFFFF; width:70px; height:70px; background:url(../photos/station_green.png) no-repeat center center; background-size:100%}
a.station_green span{display:block; width:100%; font-size:80%; line-height:0em; text-indent:13px; margin-top:-9px;color:#1a5a30}
a:active.station_green,a.station_green.active{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;background:url(../photos/station_green_over.png) no-repeat center center; background-size:100%; color:#91ce95}
a.station_yellow{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;color:#FFFFFF; width:70px; height:70px; background:url(../photos/station_yellow.png) no-repeat center center; background-size:100%}
a.station_yellow span{display:block; width:100%; font-size:80%; line-height:0em; text-indent:13px; margin-top:-9px;color:#da5112}
a:active.station_yellow,a.station_yellow.active{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;background:url(../photos/station_yellow_over.png) no-repeat center center; background-size:100%; color:#ffdd5e}
a.station_red{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;color:#FFFFFF; width:70px; height:70px; background:url(../photos/station_red.png) no-repeat center center; background-size:100%}
a.station_red span{display:block; width:100%; font-size:80%; line-height:0em; text-indent:13px; margin-top:-9px;color:#b53722}
a:active.station_red,a.station_red.active{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;background:url(../photos/station_red_over.png) no-repeat center center; background-size:100%; color:#fb916f}
a.station_nowork{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;width:70px; height:70px; background:url(../photos/station_nowork.png) no-repeat center center; background-size:100%; overflow:hidden; text-indent:-999999px}
a.station_nowork span,a.station_nowork.active span{display:none}
a:active.station_nowork,a.station_nowork.active{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;background:url(../photos/station_nowork_over.png) no-repeat center center; background-size:100%; overflow:hidden; text-indent:-999999px}
a.station_serve{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;width:70px; height:70px; background:url(../photos/station_serve.png) no-repeat center center; background-size:100%; overflow:hidden; text-indent:-999999px}
a:active.station_serve,a.station_serve.active{display:block; position:absolute; text-align:center; font-weight:600; line-height:3.5em;background:url(../photos/station_serve_over.png) no-repeat center center; background-size:100%; overflow:hidden; text-indent:-999999px}
a.face{display:block; position:absolute; width:30px; height:32px}
a:active.face.green,a:active.face.yellow,a:active.face.red,a:active.face.nowork,a:active.face.serve{background-position:center bottom}
a.face.green{background:url(../photos/greenface.png) no-repeat center top}
a.face.yellow{background:url(../photos/yellowface.png) no-repeat center top}
a.face.red{background:url(../photos/redface.png) no-repeat center top}
a.face.nowork{background:url(../photos/noworkface.png) no-repeat center top}
a.face.serve{background:url(../photos/serveface.png) no-repeat center top}
a.citymap_into{background:url(../photos/flag.svg) no-repeat center center; display:block; width:54px; height:77px; position:absolute; font-size:80%; text-align:center; padding:38px 0 0; color:#000000}
#citymap_logo{position:absolute; bottom: 20px; right:20px; z-index:2}
#citymap_logo a{display:block;width:90px;height:90px;box-shadow: 0px 3px 10px #9c9c9c;border-radius:68px;background:#FFFFFF;padding:10px 0 0 0;}
#citymap_logo a i{display:block; width:73px; height:73px; margin:0 auto; background:url(../photos/logo.svg) no-repeat center center}

#infobox{position:absolute; bottom:-900px;left: 0;height: 170px;width:100%;z-index:999999;background:#45525a;background-size:100%;padding:10px 5%; color:#FFFFFF}

#infobox .Positioning{position:absolute; top:-30px; right:4%;}
#infobox .Positioning a{ display:block; width:68px; height:68px;border-radius: 68px;background: #ffae00; padding: 20px 0 0 0; box-shadow:0px 4px 9px #3c3b3b}
#infobox .Positioning a i{ display: block; width: 30px; height: 30px; margin: 0 auto; background:url(../photos/navigation_icon.png) no-repeat center center; background-size:100%}
#infobox .Positioning a:active{background:#d39002}
.map_amount{position:relative; width:70%}
.map_amount .deactivate{color: #ffae00;}
.map_amount ul{position:relative; width:100%}
.map_amount li{position:relative; width:47%; display:inline-block; float:left; color:#aebbc3; line-height:1.4em}
.map_amount li i,.work_distance i,.work_distance .tool a{display:block; width:30px; height:23px; float:left; padding:0 3px 0 0}
.map_amount li span{color:#FFFFFF; font-weight:600; padding:0 0 0 5px}
.map_amount li:nth-child(1) i{background:url(../photos/Map_bycicon.png) no-repeat left center; background-size:95%}
.map_amount li:nth-child(2) i{background:url(../photos/Map_parkingicon.png) no-repeat center center; background-size:81%}
.map_amount li:nth-child(2){padding:0 0 0 3%}
.map_serve{position:relative; width:80%}
.map_serve ul{position:relative; width:100%}
.map_serve li{position:relative; width:49%; display:inline-block; float:left; color:#aebbc3; line-height:2em; font-size:85%}
.map_serve li i{display:block; width:20px; height:22px; float:left; padding:0 3px 0 0}
.work_distance i,.work_distance .tool a{display:block; width:30px; height:23px; float:left}
.map_serve li span{color:#FFFFFF; font-weight:600}
.map_serve li:nth-child(1) i{background:url(../photos/phone_icon.png) no-repeat left center; background-size:95%}
.map_serve li:nth-child(2) i{background:url(../photos/clock_icon.png) no-repeat center center; background-size:81%}
.map_serve li:nth-child(2){padding:0 0 0 3%}
.station_address{position:relative; width:100%; clear:both; padding:8px 0 16px; font-size:110%; line-height:1.3em}
.station_address span{position:relative; display:block; width:100%; font-size:90%; color:#d5d5d5; padding:4px 0}
.work_distance{position:relative; width:100%; clear:both}
.work_distance span.point{font-size:150%; padding:0 10px; line-height:1em}
.work_distance i{background:url(../photos/Map_workcon.png) no-repeat center center; background-size:55%}
.work_distance .tool{position:relative; float:right; width:3em}
.work_distance .tool a:nth-child(1){float:left}
.work_distance .tool a:nth-child(2){float:right}
.work_distance .tool a.compass{background:url(../photos/compass_icon.png) no-repeat center center; background-size:77%; height:25px}
.work_distance .tool a.favorite{background:url(../photos/favorite_icon.png) no-repeat top center; background-size:77%; overflow:hidden; height:27px}
.work_distance .tool a:active.favorite,.work_distance .tool a.favorite.active{background-position:center bottom}
.station_updete{font-size:60%; color:#82898b; position:absolute; bottom:6px; left:20px}

.map_search [class*="menu-"] {
  cursor: pointer;
  height: initial;
  width: initial;
  padding: 5px 0;
position:absolute; z-index:99999999; left:-10px
}
.map_search [class*="menu-"] i.menu {
  background:url(../photos/search_menu.svg) no-repeat center center;
  background-size: 100%;
  left: 26px;
}
.map_search [class*="menu-"] i.menu:active{background:url(../photos/search_menu_over.svg) no-repeat center center;background-size: 100%}
.map_search [class*="menu-"] i {
  display: inline-block;
  width: 26px;
  height: 23px;
  position: absolute;
}
.map_search{width: 92%;height:50px;margin:0 auto;display:block;position:absolute;top:40px;left:4%;background:#FFFFFF;box-shadow:0 0 9px #535353;z-index:100;border-radius:4px;padding: 10px 0% 10px 4%;}
.map_search img.logo {max-width:73px; position:absolute; left:53px; top:14px}
.map_search img.logo.active{display:none}
.map_search input[type="place"]{border:none; background:rgba(231, 231, 231, 0); position:absolute; width:60%; float:left; font-size:150%; color:#565656; line-height:1.6em; top:9px; left:52px; z-index:999999}
.map_search .search_btnline{position:absolute; display:block; width:100%; top:12px; right:0; z-index:1}
.map_search .search_btnline ul{position:relative; width:100%}

#navigation_btn{position:absolute; bottom: 20px; right:20px; z-index:2}
#navigation_btn a{display:block; width:55px; height:55px; box-shadow:1px 1px 7px #585858; border-radius:68px; background:#ffae00; padding:14px 0 0 0}
#navigation_btn a:active{background:#d39002}
#navigation_btn a i{display:block; width:25px; height:25px; margin:0 auto}
#navigation_btn a i.navigation{background:url(../photos/navigation_icon.png) no-repeat center center; background-size:100%} 
#navigation_btn a i.point{background:url(../photos/point_icon.png) no-repeat center center; background-size:100%}
#code_btn.off,#navigation_btn.off{bottom:initial; top:100%}
#code_btn{position:absolute; bottom:20px; left:36.5%; z-index:2}
#code_btn a{display:block; width:95px; height:95px; box-shadow:1px 1px 7px #585858; border-radius:68px;padding:10px 0 0 0; background:#ffae00}
#code_btn a i{display:block; width:50px; height:50px; margin:0 auto; background:url(../photos/scan_code.svg) no-repeat center center; background-size:90%}
#code_btn a:before{content:"扫码借车"; position:absolute; bottom:16px; width:100%; text-align:center; font-size:90%;color:#FFFFFF}
#code_btn a:active{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+44,f7f7f7+66,e5e5e5+83 */
background: #ffffff; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #ffffff 44%, #f7f7f7 66%, #e5e5e5 83%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #ffffff 44%,#f7f7f7 66%,#e5e5e5 83%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #ffffff 44%,#f7f7f7 66%,#e5e5e5 83%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}
#code_btn a:active i{background:url(../photos/scan_code_org.svg) no-repeat center center; background-size:90%}
#code_btn a:active:before{color:#ffae00}
#search_data{position:absolute; width:100%; z-index:3; text-align:center; top:100px}
#search_data .inner{width:270px;color:#FFFFFF;border-radius:20px; padding:10px 0; display:block; background:rgba(23, 23, 23, 0.68); margin:0 auto}
/*地圖列表*/
button.menuButton{position: absolute; z-index: 10; border: none; display:block; background:url("../photos/search_logo.png") no-repeat left center #FFFFFF;background-size: 70px; width: 228px; height: 47px;top:42px; left:65px}
#overlay-menu{
  -webkit-transform: translate3d(0,0,0);
     -moz-transform: translate3d(0,0,0);
          transform: translate3d(0,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;}
#overlay-menu.active{left:48%}
button.overlay-close{position: relative; z-index: 999; border: none; display: block; margin: 10px 0 0 10px; width: 25px; height: 25px; float:left;  background:url(../photos/nav_back.svg) no-repeat center center; background-size: 100%;}
.overlay header{padding: 45px 0 0}
.overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(255,255,255,0.80);
  z-index: 9999
}
.overlay-data {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0s;
  transition: opacity 0s;
  visibility: 0s 0s;
  transition: opacity 0s, visibility 0s 0s;
}
.overlay-open {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0s;
  transition: opacity 0s;
}
/*地圖列表END*/
.cbp-hrmenu > ul > li > a.favorite{background:url(../photos/favorite_icon.png) no-repeat top right; background-size:57%}
.cbp-hrmenu > ul > li > a.list{background:url(../photos/list_icon.png) no-repeat top right; background-size:57%}
.cbp-hrmenu > ul > li > a.favorite:active,.cbp-hrmenu > ul > li > a.list:active,.cbp-hrmenu > ul > li > a.favorite.active,.cbp-hrmenu > ul > li > a.list.active{background-position:bottom right}
.cbp-hrmenu {
	width: 100%;
}

/* general ul style */
.cbp-hrmenu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

/* first level ul style */
.cbp-hrmenu > ul,
.cbp-hrmenu .cbp-hrsub-inner {
	width: 100%;
	margin: 0 auto;
	padding:0 .8em;
}

.cbp-hrmenu > ul > li {
	display: inline-block;
	float:right
}

.cbp-hrmenu > ul > li > a {
	display:inline-block;
	width:42px;
	height:28px
}

.cbp-hrmenu > ul > li > a:hover {
	color: #47a3da;
}

.cbp-hrmenu > ul > li.cbp-hropen a,
.cbp-hrmenu > ul > li.cbp-hropen > a:hover {
	color: #fff;
}

/* sub-menu */
.cbp-hrmenu .cbp-hrsub {
	display: none;
	position: absolute;
	background: #FFFFFF;
	width: 100%;
	left: 0;
	box-shadow:0 11px 14px #535353;
	padding-bottom:2em
}

.cbp-hropen .cbp-hrsub {
	display: block;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}

.cbp-hrmenu .cbp-hrsub-inner > div {
	width: 100%;
	float: left;
	height:195px;
	padding:6px 0 0 0;
	overflow-y: auto;
    overflow-x: hidden;
	margin:0 0 0
}

.cbp-hrmenu .cbp-hrsub-inner > div::-webkit-scrollbar{
    width: .5em;
}

.cbp-hrmenu .cbp-hrsub-inner > div::-webkit-scrollbar-track{
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);*/
	background:#e9e9e9;
}

.cbp-hrmenu .cbp-hrsub-inner > div::-webkit-scrollbar-thumb{
  background-color: darkgrey;
  outline: 1px solid slategrey;
}

.cbp-hrmenu .cbp-hrsub-inner:before,
.cbp-hrmenu .cbp-hrsub-inner:after {
	content: " ";
	display: table;
}

.cbp-hrmenu .cbp-hrsub-inner:after {
	clear: both;
}

.cbp-hrmenu .cbp-hrsub-inner > div li{
	position:relative; width:100%; min-height:45px; padding:4px 0; float:left
}
.cbp-hrmenu .cbp-hrsub-inner > div li:before{content:''; display:block; float:left; width:20px; height:28px; position:relative; background:url(../photos/greenface.png) no-repeat center top; background-size:100%}
.cbp-hrmenu .cbp-hrsub-inner > div li.baidu:before{background:url(../photos/bai_point.svg) no-repeat -2px center; background-size:106%}
#container .cbp-hrmenu .cbp-hrsub-inner > div li.baidu a .map_sationinfo .orange,#container .cbp-hrmenu .cbp-hrsub-inner > div li.baidu a .map_sationinfo .map_sationicon.byc,#container .cbp-hrmenu .cbp-hrsub-inner > div li.baidu a .map_sationinfo .parking{display:none}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a{
	line-height: 1.3em;
	position:relative; width:100%; height:100%; display:block; color:#565656; padding:5px 0
}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a:active{background:#F1F1F1}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo{position:relative; float:right; padding:0; display:block; width:44%}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .baidu_address{font-size:70%; line-height:1.8em; display:block; width:100%}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo span{float:left; color:#ffae00; float:left}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .map_sationicon{position:relative; display:block; width:26px; height:26px; margin:0 0 0 3px}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .map_sationicon.byc{background:url(../photos/Map_bycicon.png) no-repeat center center; background-size:100%; float:left}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .parking{background:url(../photos/Map_parkingicon.png) no-repeat center center; background-size:100%; float:left}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .map_sationicon.work{ width:15px; height:24px;background:url(../photos/Map_workcon.png) no-repeat center center; background-size:88%; margin:0; float:left}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .mile{font-size:.7em; float:left}
#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .orange{font-weight:600}
.cbp-hrsub h4 {
	color: #afdefa;
	padding: 2em 0 0.6em;
	margin: 0;
	font-size: 160%;
	font-weight: 300;
}
#updeteTime{position:absolute; bottom:5px; left:3%; font-size:80%; color:#d9d9d9}
/*地圖END*/

/*站點列表*/
#sb-favorite{position: absolute;margin-top:5px;width: 24px;height: 28px;display: block;right: 52px;background:url("../photos/Favorite_white.svg") no-repeat center center;background-size: 100%;top: 0;}
#station_search{background:url(../photos/list_white.svg) no-repeat center center; background-size: 50%}
.cd-tabs__navigation a[data-content=list]{position: relative; display: block; width: 50px; height: 50px; z-index: 900}
#station_tab{margin: -36px auto 0; min-height: 900px}
#station_tab nav{background:rgba(255, 255, 255, 0); margin-bottom: 6px}
#station_tab nav ul{float: right; margin-top: -5px}
#station_tab nav li{float: right}
#station_tab nav .sb-search{top:-12px}
#station_tab .sb-search.sb-search-open{width: 86%; left: 0; right:initial }
#station_tab .cd-tabs__navigation a.cd-selected{background-color:rgba(255, 255, 255, 0); box-shadow:none;-webkit-box-shadow:none}
#station_list{position: relative; margin:0 auto; height: 100%; padding-bottom: 156px; font-size: 90%}
#station_list ul{position: relative; width: 100%}
#station_list li{position: relative; width: 100%; padding:0}
#station_list a{color:#565656; line-height: 3em; border-bottom: solid 1px #eaeaea; position:relative; width: 100%; display: block; padding: 0 3%}
#station_list  li a:before{content:''; display:block; float:left; width:20px; height:28px; position:relative; background:url(../photos/greenface.png) no-repeat center top; background-size:100%; top: 10px; margin-right: 5px}
#station_list  li.baidu a:before{background:url(../photos/bai_point.svg) no-repeat top center; background-size:106%}
#station_list  li.service a:before{content:''; display:block; float:left; width:20px; height:28px; position:relative; background:url(../photos/serveface.png) no-repeat center top; background-size:100%; top: 10px; margin-right: 5px}
#station_list  li  a .map_sationinfo{position:relative; float:right; padding:0; display:block; width:34%}
#station_list  li  a .stationName{position: relative;width: 57%;float: left;word-break: break-all;line-height: 1.2em;padding: 10px 0;}
#station_list  li.baidu a .map_sationinfo{width: 15%}
#station_list  li  a .baidu_address{font-size:70%; line-height:1em; display:block; width:94%; padding:0 0 10px 24px; clear: both}
#station_list  li  a .map_sationinfo span{float:left; color:#ffae00; float:right}
#station_list  li  a .map_sationinfo .map_sationicon{position:relative; display:block; width:18px; height:18px; margin:0 0 0 3px; top: 10px}
#station_list  li  a .map_sationinfo .map_sationicon.byc{background:url(../photos/Map_bycicon.png) no-repeat center center; background-size:100%; float:right}
#station_list  li  a .map_sationinfo .parking{background:url(../photos/Map_parkingicon.png) no-repeat center center; background-size:100%; float:right}
#station_list  li  a .map_sationinfo .map_sationicon.work{ width:13px; height:19px;background:url(../photos/Map_workcon.png) no-repeat center center; background-size:88%; margin:0; float:right}
#station_list  li  a .map_sationinfo .mile{font-size:.7em; float:right}
#station_list  li  a .map_sationinfo .orange{font-weight:600; letter-spacing: -.1em}
/*站點列表END*/
.cbp-hrsub h4 {
	color: #afdefa;
	padding: 2em 0 0.6em;
	margin: 0;
	font-size: 160%;
	font-weight: 300;
}
@media screen and (min-width: 75em) { 
  #search_data{top:115px}
}

@media screen and (max-width: 36em) { 
    .cbp-hrmenu .cbp-hrsub-inner > div::-webkit-scrollbar{ width: .3em;}
}

@media screen and (min-width: 30em){	
	#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .map_sationicon{margin:0 0 0 10px}
}

@media screen and (max-width: 28em) {
	.cbp-hrmenu .cbp-hrsub-inner > div {height:165px} 
   #updeteTime,#container .cbp-hrmenu .cbp-hrsub-inner > div li a {font-size:100%}
   #container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .map_sationicon{width:20px; height:20px}
   #container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .map_sationicon.work{width:12px; height:20px}
   #login_article{height:80%}
   #login_service{height:90%}
}

@media screen and (max-width: 23.5em) {
	#infobox .map_serve li{font-size:80%; line-height:2em; letter-spacing:-.071em}
   .station_address span{letter-spacing:-.05em}
    #station_tab .sb-search-input{ left:52px; width: 66%}
    #station_tab .sb-search.sb-search-open form:before{left: 62px;}
    #station_list{font-size: 78%}
    #station_list li a .map_sationinfo{width:42% }
    #station_list li a .stationName{width: 49%}
}
@media screen and (max-width: 22em) {
	#updeteTime,#container .cbp-hrmenu .cbp-hrsub-inner > div li a {font-size:60%}
	#container .cbp-hrmenu .cbp-hrsub-inner > div li a{letter-spacing:-.02em}
	#container .cbp-hrmenu .cbp-hrsub-inner > div li a .map_sationinfo .map_sationicon{width:15px; height:15px}
	.cbp-hrmenu > ul, .cbp-hrmenu .cbp-hrsub-inner{padding:0 .5em}
	#infobox{height:160px}
	#infobox .map_amount li{font-size:80%; line-height:2em}
	.station_address{font-size:100%}
	.work_distance{font-size:90%}
  #login_article{height:68%}
  #login_service{height:90%}
	#login_container .loginkeyin p.line_message input[type=text],#login_container .loginkeyin p.line_message span{width:63%}
	#login_container .loginkeyin p.line_message i.alert{left:50%}
	#login_container .loginkeyin.crowded p{min-height:54px}
	#login_container .loginkeyin p span{font-size:70%}
	#login_container .loginkeyin p span.type{top:-8px}
	#login_container .loginkeyin p i{width:25px; height:25px}
	#login_container .loginkeyin p{min-height:57px}
	#login_container .loginkeyin_button{bottom:15px}
	#login_container.scroll,#login_container{width:100%}
	#cards_container{height:86%}
	#cards_container .cards_inner li .cardNB{font-size:80%}
	#login_container .loginkeyin.crowded p.line_message .countdown{left:65%}
	.cd-tabs__content li .record_container .inner .detail{font-size:70%; width:86%}
	.cd-tabs__content li .record_container .inner .title{font-size:80%; width:14%}
	.cd-tabs__content li .record_container .inner .detail p:nth-child(2) span{letter-spacing:-.06em}
	.record_container .moneybank{font-size:90%}
	#code_container{margin:10px auto}
	#code_container a.scan{margin: 0 auto 10px;}
	#code_container a.scan,#code_container input[type=file]{width: 175px; height:165px}
	#code_container a.scan:before{width: 118px;height: 157px;line-height: 273px;background-position:center 15px;}
	.display_code{width:33%}
	.sb-search-input{ left:52px; width: 65%}
	.sb-search.sb-search-open form:before{left: 62px;}
  #lostthing_list{height:50%; margin:5px auto}
	#station_list li.baidu a .map_sationinfo{width: 18%}
}

@media screen and (orientation: landscape){
	#code_btn{left:43%}
}

/*頁籤*/
.cd-nugget-info {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 40px;
  line-height: 40px;
  top: 0;
  left: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.cd-nugget-info a {
  width: 160px;
  position: relative;
  font-size: 14px;
  color: #6375ad;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}
.cd-nugget-info a:hover {
  opacity: .8;
}
.cd-nugget-info span {
  vertical-align: middle;
  display: inline-block;
}
.cd-nugget-info span svg {
  display: block;
}
.cd-nugget-info .cd-nugget-info-arrow {
  fill: #6375ad;
}

.cd-tabs {
  position: relative;
  width:100%;
  height:106%;
  max-width: 960px;
  margin: 0 auto;
  padding-bottom:100px;
  -webkit-overflow-scrolling: touch;
}

.cd-tabs nav {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  background:rgb(243, 243, 243);
  -webkit-box-shadow: inset 0 -2px 3px rgba(199, 198, 184, 0.21);
          box-shadow: inset 0 -2px 3px rgba(199, 198, 184, 0.21);
}
::-webkit-scrollbar {
  display: none}



.cd-tabs__navigation {
  width: auto;
  display:table
}

.cd-tabs__navigation:after {
  /* clearfix */
  content: "";
  display: table;
  clear: both;
}

.cd-tabs__navigation.twin,.cd-tabs__navigation.four{
	width:100%
}
.cd-tabs__navigation.twin li{
	width:48%
}
.cd-tabs__navigation.four li{
	width:24.5%
}
.cd-tabs__navigation.twin a,.cd-tabs__navigation.four a{
	width:100%
}

.cd-tabs__navigation li {
  display:table-cell
}

.cd-tabs__navigation a {
  position: relative;
  display: block;
  height: 50px;
  width: 100px;
  text-align: center;
  font-size: 110%;
  font-weight: 700;
  color: #8c8c8c;
  padding-top: 15px;
  margin: 0 5px;
  font-weight:  normal;
}

.cd-tabs__navigation a:hover {
  color: #607D8B;
  background-color: rgba(233, 230, 202, 0.3);
}

.cd-tabs__navigation a.cd-selected {
  /* background-color: #f3f3f3; */
  -webkit-box-shadow: inset 0 -3px 0 #607D8B;
          box-shadow: inset 0 -3px 0 #607D8B;
  color: #607D8B;
}
.cd-tabs__repair {
  width:100%;
}

.cd-tabs__repair:after {
  /* clearfix */
  content: "";
  display: table;
  clear: both;
}

.cd-tabs__repair li {
  float: left;
  position:relative;
  width: 31%;
  margin: 0 2% 0 0;
}

.cd-tabs__repair a i{
	display:block;
	width:35px;
	height:50px;
	margin:0 auto;
	position:relative
}

.cd-tabs__repair a {
  position: relative;
  display: block;
  height: 53px;
  width: 100%;
  text-align: center;
  font-size: 110%;
  font-weight: 700;
  margin: 0 5px 13px;
  background:rgba(255,255,255,0.80);
  font-weight:  normal;
  opacity:.6;
}

.cd-tabs__repair a:before{
	content:"";
	position:absolute;
	top: 8px;
	left: 42%;
	margin-left:-8px;
	display:inline-block;
	height: 35px;
	width: 35px;
}
.cd-tabs__repair a[data-content=bike]::before{background:url(../photos/bike_s_60.png) no-repeat center center; background-size:99%}
.cd-tabs__repair a[data-content=kiosk]::before{background:url(../photos/kiosk_s_60.png) no-repeat center center; background-size:96%}
.cd-tabs__repair a[data-content=port]::before{background:url(../photos/docks_s_60.png) no-repeat center center; background-size:100%}

.cd-tabs__repair a:hover {
  color: #FFFFFF;
  background-color: rgba(233, 230, 202, 0.3);
}

.cd-tabs__repair a.cd-selected {
  background-color: #ffffff !important;
  color: #607D8B;
  opacity:1;
  box-shadow:0 3px 2px #e4b21c
}
.cd-tabs__repair a.cd-selected::after{
	content:"";
	display:block;
	width:100%;
	height: 3px;
	bottom: -13px;
	left:0;
	position:absolute;
	background:#607D8B;
}
.cd-tabs__content {
  background: #ffffff;
  position:relative;
  height:100%
}

.cd-tabs__content li {
  display: none;
  padding: 0 0 150px;
}
.cd-tabs__content li li{display:inherit; padding:10px 2.5% 20px}

.cd-tabs__content li.cd-selected {
  display: block; width:100%;
  -webkit-animation: cd-fade-in 0.5s;
          animation: cd-fade-in 0.5s;
}
.cd-tabs__content li p {
  font-size: 120%;
  line-height: 1.4;
  color: #262626;
  word-break: break-all;
}
@media only screen and (min-width: 768px) {
  header {
    height: 100px;
  }
  header h1 {
    font-size: 1.6rem;
  }
  header [class*="menu-"] i.menu{top:60px}
  .cd-tabs{max-width:inherit}
  .cd-tabs::after {
    display: none;
  }
  .cd-tabs nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    -webkit-box-shadow: inset -2px 0 3px rgba(203, 196, 130, 0.06);
            box-shadow: inset -2px 0 3px rgba(203, 196, 130, 0.06);
    z-index: 1;
  }
  .cd-tabs__navigation,.cd-tabs__navigation.twin, .cd-tabs__navigation.four,.cd-tabs__repair{
    /* move the nav to the left on medium sized devices */
    width: 110px;
    float: left;
  }
  .cd-tabs__repair li{width:100%}
  .cd-tabs__repair a{width:85%; float:right; margin:0 0 10px}
  .cd-tabs__content {
    min-height: 480px;
  }
  .cd-tabs__content li {
    padding: 2em 2em 2em 7em;
  }
  .cd-tabs__navigation a {
    height: 80px;
    width: 80px;
    padding-top: 32px;
  }
  .cd-tabs__navigation a.cd-selected {
    -webkit-box-shadow: inset 2px 0 0 #607D8B;
            box-shadow: inset 2px 0 0 #607D8B;
  }
  .cd-tabs__navigation a::before {
    top: 24px;
  }
  .cd-tabs__navigation.twin li,.cd-tabs__navigation.four li{width:100%}
  #login_container .loginkeyin p.line_message input[type=text],#login_container .loginkeyin p.line_message span{width:83%}
  #login_container .loginkeyin p.line_message i.alert{left:78%}
  #login_container .loginkeyin.crowded p.line_message .countdown{left:84%}
  #code_btn{left:45%}
  [id*="menu-"] {width:40%}
  #menu-left { left: -40%}
  header.active,.intro.active,#container.active{
	 -webkit-transform: translate3d(40%,0,0);
     -moz-transform: translate3d(40%,0,0);
          transform: translate3d(40%,0,0);
  -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
   }
   .popup-inner .type li{width:100%}
   .popup-inner .type li .label_check{margin:0}
   #station_tab{margin:0; height: 762px}
   #station_tab nav{left:initial; right: 10px; top: -45px; width:370px; height: 40px}
   #station_tab .cd-tabs__content li{padding:5px 0}
   #station_list{font-size:100%}
   #station_list li a .map_sationinfo{width: 172px}
   #station_list li a .map_sationinfo .mile{font-size: 80%; line-height: 3.1em}
   #station_list li a .map_sationinfo .orange{font-size: 100%; letter-spacing: normal; line-height: 2.5em}
    .sb-search.sb-search-open form:before{left: 70px}
   .sb-search{height: 45px}
   .sb-search-input{margin:2px 0 0}
   button.menuButton{top: 11px;left:11%;}
   #overlay-menu.active{left: 34%}
 }

@-webkit-keyframes cd-fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes cd-fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*頁籤END*/

@media only screen and (min-width: 376px) and (max-width: 414px){
	#code_btn a{width:110px; height:110px}
	#code_btn a:before{font-size:100%; bottom:20px}
	#code_btn a i{width:60px; height:60px}
}

/*mega編輯*/
.appInput input[type="text"]::-webkit-input-placeholder{font-size:100%; color:rgba(178,178,178,1.00)}
.placeHolder::-webkit-input-placeholder {
	color: #000000 !important;
}

.placeHolder:-moz-placeholder {
	color: #000000 !important;
}

.placeHolder::-moz-placeholder {
	color: #000000 !important;
}

.placeHolder:-ms-input-placeholder {
	color: #000000 !important;
}

/* 隱私權頁面相關 0.0_announce */
.d-privacy-wrap { display:flex; align-items:flex-start;  margin-top:1rem;}
.d-privacy-wrap:first-child { margin-top: 2rem; padding-bottom: 1rem; border-bottom:solid .04em rgba(230, 230, 230, 1.00);}
.d-privacy-wrap>img { display:block; width:44px;}
.d-privacy-edit { display:flex; flex-direction:column; margin-left:1rem; }
.logo-privacy{ display:block; width:160px; margin:-70px auto;}