Light12306/Mobile12306New/css/css.css
2014-08-22 18:00:59 +08:00

319 lines
19 KiB
CSS

@charset "utf-8";
div, p, dl, dd, h1, h2, h3, h4, h5, h6, a, b, u, em, input, textarea, button, select, form, section, label, span, td, li, nav, footer, body, ul, i { -webkit-tap-highlight-color: rgba(0,0,0,0); padding: 0; margin: 0 }
ul, li, ol { list-style: none }
a { text-decoration: none; color: #333 }
a, img, button { -webkit-touch-callout: none }
a:focus, a:active, a:hover, input, button, textarea { outline: 0 }
table { border-collapse: collapse }
body, td, input, textarea, option, select, button { font-family: "微软雅黑", helvetica, arial; -webkit-text-size-adjust: none; font-size:.875rem; }
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
display: none;
}
body, td, h3 { -webkit-user-select: none }
.clearfix:after { content: ''; display: block; overflow: hidden; visibility: hidden; clear: both }
.block { display: block }
html,body{height:100%;}
body { background:#efefef; color:#787878; position:relative;}
body.nologin{padding-bottom:60px;}
a{color:#fa8c13;}
input[type=checkbox],
.icon_change,
.icon_edit,
.icon_left,
.icon_right,
.icon_back,
.his_list a:after,
.icon_user,
icon_user2,
.search_ipt{background-image: url(../images/icons.png); background-repeat:no-repeat; background-size:24px auto;}
input[type=checkbox]{-webkit-appearance:none; border:#b2b2b2 solid 2px; width:24px; height:24px; overflow:hidden; vertical-align:middle; border-radius:3px; margin:-3px 6px 0 0; background-color: transparent; background-position:1000px 1000px; position:relative;}
input[type=checkbox]:checked{background-position:2px -47px; border-color:#7fbc3a;}
input[type=radio]{-webkit-appearance:none;border-radius:50%; width:20px; height:20px; border:1px solid #b2b2b2; vertical-align:middle; margin:-2px 6px 0 0; background-color: transparent;}
input[type=radio]:checked{border-color:#7fbc3a;}
input[type=radio]:checked:after{content:''; display:block; width:12px; height:12px; margin:3px; background:#7fbc3a; border-radius:50%;}
.mb{margin-bottom:15px;}
.wrap { width: 100%; overflow: hidden }
.pull_left{float:left;}
.pull_right{float:right;}
.text_warning{color:#fa8c13;}
.text_error{color:#da0000;}
.text_gray{color:#b7b7b7;}
.text_lg{ font-size:1.25em;}
.text_underline{ text-decoration:underline;}
.text_label{display:inline-block; width:16px; height:16px; text-align:center; line-height:16px; font-style:normal; vertical-align:middle; border-radius:2px; background:#ccc; color:#FFF; font-size:11px; margin:-5px 5px 0 0; overflow:hidden;}
.text_center{text-align:center;}
.text_left{text-align:left;}
.text_right{text-align:right;}
.span6{width:50%;}
/*icon*/
.icon_change{display: inline-block; width:22px; height:22px; border-radius:50%; overflow:hidden; border:#DDD solid 1px; background-position:4px -245px; background-color:#FFF;}
.icon_back{display:inline-block; width:45px; height:45px; overflow:hidden; background-position:18px -85px;}
.icon_left,
.icon_right{ display:inline-block; width:7px; height:14px; overflow:hidden;}
.icon_left{ background-position:0 -150px;}
.icon_right{ background-position:0 -200px;}
.icon_label{position:absolute; width:50px; height:10px; text-align:center; color:#FFF; background:#fa8c13; left:-18px; top:-4px; -webkit-transform: rotate(-45deg) translate3d(0,0,0); font-size:7px; line-height:1.2em; padding-top:10px; font-style:normal;}
.icon_user,
.icon_user2{ display:inline-block; vertical-align:middle; width:24px; height:24px; background-position:0 -400px;}
.icon_user2{background-position:0 -350px;}
.icon_edit{ display:inline-block;width:19px; height:19px; background-position:0 -550px; vertical-align:middle; margin-top:-3px;}
.icon_sure{ width:24px; height:24px; display:inline-block; position:relative; vertical-align:middle;}
.icon_sure:before{content:''; position: absolute; width:20px; height:10px; border:#FFF solid; border-width:0 0 2px 2px; -webkit-transform:rotate(-45deg) translate3d(0,0,0); margin:2px 0 0 -11px;}
.icon_loading{display:inline-block; width:16px; height:16px; background: url(../images/loading.gif) no-repeat; vertical-align:middle;}
.header{width:100%; height:45px; line-height:45px; position:relative; overflow:hidden; background:#fa8c13; color:#FFF; font-size:0.75rem; text-align:center;}
.h_l,.h_r{position:absolute; top:0;}
.h_l{left:15px;}
.h_r{right:15px;}
.h_t{font-size:1.0625rem;}
.logo{ display:block;width:121px; height:25px; overflow:hidden; background:url(../images/logo.png) no-repeat; background-size:cover; margin:10px 0 0;}
.h_r_text{ padding:5px 0; text-align:right; line-height:16px;}
.header .icon_back{margin-left:-15px;}
.header a{color:#FFF; font-size:0.875rem;}
.box_insert{background:#FFF; border-bottom:#ddd solid 1px;padding:0 15px;}
.form_btns{ margin:15px 0;}
.form_line{padding:5px 0;min-height:40px; line-height:40px;border-bottom:#ddd solid 1px;}
.form_border{border-bottom:#ddd solid 1px; padding:5px 0;}
.form_btns label,
.form_line label{display:inline-block;}
.form_line.text_center label{margin:0 18px;}
.form_label{display:inline-block; width:86px; float:left;}
.ipt_wrap{overflow:hidden;}
.ipt_wrap .ipt{width:100%; padding:10px 0; height:20px; border:0; margin:0;}
.form_cardimg{float:right; width:90px; overflow:hidden; margin:7px 0 0 10px; text-align:center; vertical-align:middle;}
.form_cardimg img{max-width:100%;}
.btn{ height:40px; padding:0 1em; line-height:40px; background:#ffbb51; border:0; margin:0; display:inline-block; border-radius:3px; font-size:1.1875rem; color:#FFF; text-align:center; position:relative; overflow:hidden;}
.btn_block{display:block; width:100%;}
.btn_lg{height:45px; line-height:45px;}
.btn_m{height:30px; line-height:30px; font-size:0.75rem;}
.btn_success{background:#fa8c13;}
.btn_gray{background:#ccc;}
.box{padding:10px 15px;}
.towbtn{white-space:nowrap;}
.towbtn .btn{width:48%; margin-right:4%; -webkit-box-sizing: border-box;}
/* 登陆页 */
.footer_tip{margin-top:30px; font-size:.75rem;}
/* 查询页 */
.station{ position:relative; overflow:hidden; padding:15px 0; border-bottom:1px solid #DDD;}
.station:after { content: ''; display: block; overflow: hidden; visibility: hidden; clear: both }
.start_station,
.end_station{ float:left; width:50%; overflow:hidden; text-align:center; -webkit-box-sizing:border-box; box-sizing:border-box;}
.start_station{border-right:1px solid #DDD; padding-right:10px;}
.end_station{padding-left:10px;}
.station_city{padding:30px 0; font-size:1.875rem; color:#fa8c13;}
.station .icon_change{position:absolute; left:50%; top:50%; margin-top:10px; -webkit-transform:translate3d(-50%,-50%,0);}
.check_date{ height:65px; overflow:hidden;}
.start_date{display:block; overflow:hidden; text-align:center; line-height:26px; padding:5px 0; font-size:1.0625rem;}
.check_left,
.check_right{width:40px; height:40px; text-align:center;}
.check_left{ text-align:left;}
.check_right{text-align:right;}
.his_title{text-align:center;}
.his_list a{ display:block; height:40px; line-height:40px; overflow:hidden; position: relative; color:#787878;}
.his_list a span{ display:inline-block; width:50%; -webkit-box-sizing:border-box;}
.his_list a span:first-child{text-align:right; padding-right:17px;}
.his_list a span:last-child{ padding-left:17px;}
.his_list a:after{width:16px; height:8px; position:absolute; content:''; left:50%; top:50%; -webkit-transform:translate3d(-50%,-50%,0); background-position:0 -300px;}
/* 弹层 */
.public_layer{position:fixed; height:100%; z-index:9999; background:rgba(0,0,0,.2); top:0; width:100%; height:100%; overflow:hidden;}
.public_pop{ position: fixed; width:270px; left:50%; margin-left:-135px; top:40%; margin-top:-50px; background:rgba(255,255,255,.95); border-radius:7px;-webkit-transform:scale(1.3);transform:scale(1.3); opacity:0;-webkit-transition-duration: .1s, .1s;-webkit-transition-timing-function: linear, linear;-webkit-transition-property: -webkit-transform, opacity;}
.public_pop_show{opacity:1; -webkit-transform:scale(1);transform:scale(1);}
.public_pop p{padding:15px 20px; text-align:center; line-height:2em; font-size:1em;}
.public_btns {height: 45px;-webkit-box-flex: 0.0;display: -webkit-box;border-top: #dfdfdf solid 1px;}
.public_btns a {display: block;-webkit-box-flex: 1.0;text-align: center;line-height: 44px;color: #007aff;border-right: #dfdfdf solid 1px;width: 50%;}
.public_btns a.active{background:rgba(0,0,0,.05);}
.public_btns a:last-child {border-right:0 none;}
.public_toast{padding:5px 10px; border-radius:3px; background:rgba(0,0,0,.7); position:fixed; left:50%; bottom:20px; max-width:150px; z-index:9999; color:#FFF; font-size:12px; -webkit-transform:translate3d(-50%,100%,0); opacity:0; transition:all linear .1s;}
.public_toast_show{opacity:1; -webkit-transform:translate3d(-50%,0,0);}
/**/
.fixed_box{/* position: absolute; top:0; bottom:0;*/ position:relative; background:#f4f4f4; width:100%; -webkit-transform:scale(0) translate3d(0,0,0); opacity:0; overflow:auto;-webkit-overflow-scrolling:touch; display:none;}
.fixed_box_show{-webkit-transform:scale(1) translate3d(0,0,0); opacity:1;transition:-webkit-transform ease .3s, opacity ease .3s; display:block;}
#calendar{background:#FFF; border-bottom:#ddd solid 1px;}
.date_title {height:40px; line-height:40px; text-align:center; font-size:0.9375rem;}
.date_prev,
.date_next{width:40px;}
.date_prev{ float:left;}
.date_next{ float:right;}
.date_component{width:100%;}
.date_component th{font-size:0.5625rem; border-bottom:1px solid #ddd;}
.date_component td,
.date_component td a{color:#8d99a6; text-align:center;}
.date_component td{ padding:4px 3px;}
.date_component td a{display:block; width:37px; height:34px; overflow:hidden; border-radius:50%; font-size:0.875rem; margin:0 auto; padding:3px 0 0; color:#009cff; background:#e5f5ff;}
.date_component td span{ display:block;color:#8d99a6; font-size:0.4375rem;}
.date_component td a.remind{background:#fff3d9; color:#ffa200;}
.date_component td a.cur{ background:#fa8c13; color:#FFF;}
.date_component td a.cur span{color:#FFF;}
.date_component td a.disable{color:#8d99a6; background:none;}
.date_component td a.disable span{color:#8d99a6;}
.label_sale,
.label_remind{ margin-right:23px;}
.label_sale{color:#009cff;}
.label_remind{color:#ffae00;}
.label_sale:before,
.label_remind:before{content:''; display:inline-block; width:20px; height:20px; border-radius:50%; margin:-2px 7px 0 0; vertical-align:middle;}
.label_sale:before{background:#aad9f7;}
.label_remind:before{background:#f7dfaa;}
/**/
.form_title{font-size:0.75rem; line-height:2.5em; padding:0 1.375em; background:#f4f4f4; border-bottom:#ddd solid 1px; }
.box_insert .form_title{ background:#FFF;}
.query_box{padding:8px 15px;}
.query_checkbox{ display:inline-block; width:33.333333%; margin:7px 0; white-space:nowrap;}
.query_checkbox2{width:66.666666%;}
.query_bigcheck{width:18.27586206896552%; -webkit-box-sizing:border-box; display:inline-block; height:50px; overflow:hidden; position:relative; margin:8px 1.724137931034483% 8px 0; vertical-align:top;}
.query_bigcheck input{ display:block; left:0; right:0; width:100%; height:100%; margin:0;-webkit-box-sizing:border-box; position:absolute; border:0; border-radius:3px;}
.query_bigcheck input:checked{background:none;}
.query_bigcheck input:checked:before,
.query_bigcheck input:checked:after{display:none;}
.query_bigcheck span{display:block; text-align:center; -webkit-box-sizing: border-box; width:100%; height:100%; overflow:hidden; border-radius:3px; border:#fa8c13 solid 1px; font-size:.75rem; line-height:1em; padding:5px 0;}
.query_bigcheck span.bfont{font-size:0.9375rem; line-height:40px;}
.query_bigcheck_checked span{background:#fa8c13; color:#FFF;}
/**/
.bottom_tip{position:fixed; width:100%; left:0; bottom:0; display:none;}
.bottom_tip a{display:block; background:rgba(0,0,0,.8); padding:1.3em 1em; font-size:0.9375rem; color:#FFF; position:relative;}
#login_tip a:after{content:"登录"; position: absolute; right:1em; background:#fa8c13; padding:0 1.5em; height:2em; line-height:2em; top:50%; -webkit-transform:translate3d(0,-50%,0); border-radius:3px;}
/**/
.top_menu{top:45px; bottom:0; width:100%; position: absolute; background:rgba(0,0,0,.5); display:none;}
.link_list{padding:0 15px; background:#f4f4f4;border-bottom:#cacaca solid 1px; position:relative;}
.link_list:before{content:''; border:solid; border-color:transparent transparent #f4f4f4 transparent; border-width:0 8px 8px 8px; position:absolute; top:-8px; right:19px;}
.link_list li{border-bottom:#cacaca solid 1px;}
.link_list li:last-child{border-bottom:0;}
.link_list a{display:block; text-align:center; font-size:1.0625rem; color:#787878; line-height:2.647058823529412em;}
.link_list a.text_error{color:#da0000;}
/**/
.tip_small{ position:absolute; display:none; -webkit-transform:translate3d(-50%,-100%,0); background:rgba(0,0,0,.8); color:#FFF; font-size:.75rem; padding:10px; text-align:center; border-radius:3px; margin:-7px 0 0 18px;}
/*.tip_left{ -webkit-transform:translate3d(-100%,-50%,0); margin:18px 0 0 -7px;}
.tip_right{ -webkit-transform:translate3d(0,-50%,0); margin:18px 0 0 44px;}*/
.tip_left{ -webkit-transform:translate3d(0,-100%,0); margin:-7px 0 0 0;}
.tip_right{ -webkit-transform:translate3d(-100%,-100%,0); margin:-7px 0 0 37px;}
.tip_small:after{content:''; width:0; height:0; overflow:hidden; border:solid; border-color:rgba(0,0,0,.8) transparent transparent transparent; border-width:7px 7px 0 7px; position:absolute; bottom:-7px; left:50%; -webkit-transform: translate3d(-50%,0,0)}
/*.tip_left:after{ -webkit-transform:translate3d(0,-50%,0); margin:0 -7px 0 0;bottom:auto; left:auto; right:0; top:50%; border-color:transparent transparent transparent rgba(0,0,0,.8); border-width:7px 0 7px 7px;}
.tip_right:after{ -webkit-transform:translate3d(0,-50%,0); margin:0 0 0 -7px;bottom:auto; left:0; top:50%; border-color:transparent rgba(0,0,0,.8) transparent transparent; border-width:7px 7px 7px 0;}
*/
.tip_left:after{ left:18px;}
.tip_right:after{left:auto; right:18px; -webkit-transform: translate3d(50%,0,0)}
.tip_small p{margin-bottom:10px; white-space:nowrap;}
/**/
.search_box{padding:1px 10px;}
.search_box:before{ content:'';display:block; width:100%; height:0; overflow:hidden; clear:both;}
.search_cancel{float:right; width:4em; text-align:center;}
.search_ipt{overflow:hidden; height:29px; border-radius:5px; background-color:#fcaf5a; padding-left:30px; background-position:8px -443px; margin-top:8px;}
.search_input{width:100%; border:0; font-size:0.9375rem; height:29px; padding:5px 0; line-height:20px;-webkit-appearance: none;-webkit-appearance:none; vertical-align:top; background:none; color:#FFF;}
.search_input::-webkit-input-placeholder {color:#fa8c13;}
.station_list{}
.station_list:after{ content: ''; display: block; overflow: hidden; visibility: hidden; clear: both}
.station_list li{float:left; display:inline; width:33.333333%; font-size:1.0625rem; position:relative; border-bottom:#cacaca solid 1px;}
.station_list li:nth-last-child(1),
.station_list li:nth-last-child(2),
.station_list li:nth-last-child(3){border-bottom:0;}
.station_list li:after{content:''; display:block; right:0; top:50%; -webkit-transform:translate3d(0,-50%,0); border-right: #cacaca solid 1px; height:.9em; position:absolute;}
.station_list li:nth-child(3n):after{ display:none;}
.station_list li a{display: block; line-height:2.617647058823529em; text-align:center; color:#787878;}
#search_station .form_title{ text-align:center;}
.suggest{position:absolute; left:0; top:45px; right:0; padding:0 15px 10px; background:#FFF; display:none;}
.suggest ul li{border-bottom:#ddd solid 1px;}
.suggest ul li a{display:block; font-size:1.0625rem; color:#787878; line-height:2.617647058823529em;}
.station_title{text-align: center; padding:5px 0}
.station_title strong{display:block; font-size:1.0625rem; line-height:1em; margin-bottom:3px;}
.station_title span{display:block; line-height:1em; font-size:.75rem; color:#ffd7aa;}
.date_title{height:34px; line-height:34px; background:#f4f4f4;}
.date_title strong{font-weight: lighter;}
.next_btn,
.prev_btn{color:#cacaca; font-size:.75rem;}
.prev_btn{float:left; padding:0 0 0 10px;}
.next_btn{float:right; padding:0 10px 0 0;}
.next_btn i,
.prev_btn i{vertical-align:middle; margin:-2px 5px 0;}
.train_list{}
.train_list li{margin-bottom:7px; border:#ddd solid; border-width:1px 0; background:#FFF; padding:0 15px ; font-size:.75rem;}
.line{line-height:24px; padding:5px 0; border-bottom:#cacaca solid 1px;}
.line:after { content: ''; display: block; overflow: hidden; visibility: hidden; clear: both }
.line.no_border,
.train_list li .line:last-child{border:0 none;}
.line .btn{font-size:0.9375rem; height:24px; line-height:24px; padding:0 11px; vertical-align:middle; margin-left:15px;}
.line span{display:inline-block; vertical-align: middle;}
.link_label{display:inline-block; width:55px; overflow:hidden; vertical-align:middle;}
.loadingBox{ position: fixed; top:0; bottom:0; width:100%; overflow:hidden; left:0; right:0; background:rgba(255,255,255,.2);}
.loading{max-width:80%; position:absolute; left:50%; top:50%; -webkit-transform:translate3d(-50%,-50%,0); padding:10px; background:rgba(255,255,255,.8); border-radius:5px; box-shadow:0 0 3px rgba(0,0,0,.3)}
/**/
.info{ margin:5px 0; background:#FFF;}
.info_title{padding:0 10px; font-size:0.9375rem; color:#FFF; background:#fa8c13; line-height:2.2em;}
.stations_info{padding:15px;}
.stations_info:after{ content:'';display:block; width:100%; height:0; overflow:hidden; clear:both;}
.station_info{float:left; width:50%; -webkit-box-sizing:border-box; box-sizing:border-box; text-align:center; font-size:0.9375rem; position:relative;}
.station_info:first-child{border-right:1px solid #ddd;}
.station_info:first-child:after{ position:absolute; content:''; width:10px; height:10px; top:50%; right:0; margin:-5px -6px 0 0; border:#ddd solid; border-width:0 1px 1px 0; background:#FFF; -webkit-transform:rotate(-45deg);}
.station_info strong{display:block; font-size:1.5625rem; color:#fa8c13; margin-bottom:8px;}
.passenger{border:#ddd solid; border-width:1px 0; margin-bottom:15px;}
.passenger_list{ padding:0 15px; background:#FFF;}
.passenger_list li{ border-bottom:#ddd solid 1px; padding:5px 0; font-size:0.75rem;}
.passenger_list li#passenger_editinfo{border-bottom:none;}
.passenger_list li .pull_left{line-height:1.5em; color:#b7b7b7;}
.passenger_list li .pull_left strong{font-size:0.9375rem; margin-right:5px; color:#787878;}
.passenger_list li .pull_right{line-height:3em;}
.add_block{display:block; text-align:center; height:50px; line-height:50px;font-size:0.9375rem; color:#787878; background:#FFF;}
.layer{position: fixed; top:0; left:0; width:100%; bottom:0; background:rgba(0,0,0,.5); display:none;}
#edit_menu{position:absolute; width:100%; margin-top:-1px; display:none;}
.seat{color:#787878;}
#edit_seat,#edit_ticket{position:fixed; bottom:0; width:100%; left:0; display:none;}
#edit_seat .link_list:before,#edit_ticket .link_list:before{display:none;}
#edit_seat .link_list li a{text-align:left;}