@charset "utf-8";
/* CSS Document */
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
	word-wrap: break-word
}
table {
	border-collapse: collapse;
	border-spacing: 0
}
button, input, select, textarea {
	outline: 0;
	-webkit-box-sizing: border-box
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block
}
li, ol, ul {
	list-style: none
}
a {
	color: #333;
	text-decoration: none
}
a.active {
	color: #06c
}
p{ margin:1rem 0;}
img {
	max-width: 100%;
	vertical-align: middle;
	border: 0;
	-ms-interpolation-mode: bicubic;
	-webkit-touch-callout: none
}
.clearfix:after, .clearfix:before {
	display: table;
	content: " "
}
.clearfix:after {
	clear: both
}
.fl{ float: left !important;}
.fr{ float: right !important;}
.tr{ text-align:right;}
.tc{ text-align:center;}
.affix {
  position: fixed;
}

html {
	font-size: 62.5%
}

@media only screen and (min-width:481px) {
html {
	font-size: 94%!important
}
}

@media only screen and (min-width:561px) {
html {
	font-size: 109%!important
}
}

@media only screen and (min-width:641px) {
html {
	font-size: 125%!important
}

}



body {
  font-size: 1.2rem;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  font-family: "Helvetica Neue", Helvetica, sans-serif;
  line-height: 1.5;
  color: #3d4145;
  background: #eeeeee;
  overflow: hidden;
  min-width: 320px;
  max-width: 640px;
  margin:0 auto;
}

/*栅格*/
.row {
  overflow: hidden;
  margin-left: -4%;
}
.row > [class*="col-"] {
  box-sizing: border-box;
  float: left;
}
.col-12 {width: 96%; margin-left:4%;}
.col-11 {width: 87.66666667%; margin-left:4%;}
.col-10 {width: 79.33333333%;   margin-left:4%;}
.col-9 {width: 71%;   margin-left:4%;}
.col-8 {width: 62.66666667%;   margin-left:4%;}
.col-7 {width: 54.33333333%;   margin-left:4%;}
.col-6 {width: 46%;   margin-left:4%;}
.col-5 {width: 37.66666667%;   margin-left:4%;}
.col-4 {width: 29.33333333%;   margin-left:4%;}
.col-3 {width: 21%;   margin-left:4%;}
.col-2 {width: 12.66666667%;    margin-left:4%;}
.col-1 {width: 4.33333333%;   margin-left:4%;}

.row.no-gutter {
  margin-left: 0;
}
.row.no-gutter .col-12{ width:100%; margin-left:0;}
.row.no-gutter .col-11 {width: 91.66666667%; margin-left:0;}
.row.no-gutter .col-10 {width: 83.33333333%; margin-left:0;}
.row.no-gutter .col-9 {width: 75%; margin-left:0;}
.row.no-gutter .col-8 {width: 66.66666667%; margin-left:0;}
.row.no-gutter .col-7 {width: 58.33333333%; margin-left:0;}
.row.no-gutter .col-6 {width: 50%; margin-left:0;}
.row.no-gutter .col-5 {width: 41.66666667%; margin-left:0;}
.row.no-gutter .col-4 {width: 33.33333333%; margin-left:0;}
.row.no-gutter .col-3 {width: 25%; margin-left:0;}
.row.no-gutter .col-2 {width: 16.66666667%; margin-left:0;}
.row.no-gutter .col-1 {width: 8.33333333%; margin-left:0;}

/*form*/
.form_group >div >input,.form_group >div >p >input{ width:99%; border:1px solid #c9c9c9; height:3rem; line-height:3rem; border-radius:0.5rem; text-indent:1rem; font-size:1.2rem;}
.form_group select{ width:100%; border:1px solid #c9c9c9; background:#fff; height:3rem; line-height:3rem; border-radius:0.5rem;  font-size:1.2rem;}
.form_group{margin-bottom:1.3rem;}
.form-horizontal .form_group { display:flex; width:100%; }
.form-horizontal .form_group label{ text-align:right;}
.form_group >label{ width:8rem; margin-right:1rem; padding-top:0.5rem; color:#666; }
.form_group >div{ flex:1;}
.form_group >div >p{ margin-bottom:0.8rem;}
.btn_box{ padding:2rem 1rem;}
.radio{ padding-top:0.5rem;}


/*头 尾 中 */
.bar {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 10;
  height: 3.5rem;
  padding-right: 1rem;
  padding-left: 1rem;
  background-color: #f7f7f8;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.bar:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  right: auto;
  top: auto;
  height: 1px;
  width: 100%;
  background-color: #e7e7e7;
  display: block;
  z-index: 15;
  -webkit-transform-origin: 50% 100%;
          transform-origin: 50% 100%;
}

.title {
  position: absolute;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0 -1rem;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 3.5rem;
  color: #3d4145;
  text-align: center;
  white-space: nowrap;
}

.bar-tab {
  bottom: 0;
  width: 100%;
  height: 2.5rem;
  padding: 0;
  table-layout: fixed;
}
.bar-tab:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: auto;
  right: auto;
  height: 1px;
  width: 100%;
  background-color: #e7e7e7;
  display: block;
  z-index: 15;
  -webkit-transform-origin: 50% 0%;
          transform-origin: 50% 0%;
}


.page,
.page-group {
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #efeff4;
  overflow: hidden;

}

.page-group {
  display: block;
}

.bar-nav{
  background-color: #131313;
}
.bar-nav .title{ color:#fff;}


.content {
  position: absolute;
  top: 3.5rem;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.bar-nav ~ .content {
  top: 3.5rem;
}

.bar-tab ~ .content {
  bottom: 5rem;
}


.content-block {
  margin: 2rem 0;
  padding: 0 1rem;
  color: #6d6d72;
}
.content-padded {
  margin: 1rem;
}

.bar-tab {
  bottom: 0;
  width: 100%;
  height: 5rem;
  padding: 0;
  table-layout: fixed;
}
.bar-tab:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: auto;
  right: auto;
  height: 1px;
  width: 100%;
  background-color: #e7e7e7;
  display: block;
  z-index: 15;
  -webkit-transform-origin: 50% 0%;
          transform-origin: 50% 0%;
}
.bar-tab .tab-item {
  position: relative;
  display: table-cell;
  width: 1%;
  height: 5rem;
  color: #929292;
  text-align: center;
  vertical-align: middle;
}
.bar-tab .tab-item.active,
.bar-tab .tab-item:active {
  color: #0894ec;
}

.bar-tab .tab-item .icon {
  top: 0.2rem;
  height: 2rem;
  font-size: 1.8rem;
  line-height: 2rem;
  padding-top: 0;
  padding-bottom: 0;
  display:block;
}


/* button */


.button {
  border: 1px solid #0894ec;
  color: #0894ec;
  text-decoration: none;
  text-align: center;
  display: block;
  border-radius: 0.5rem;
  line-height: 2.5rem;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  background: none;
  padding: 0 1rem;
  margin: 0;
  height: 2.5rem;
  white-space: nowrap;
  position: relative;
  text-overflow: ellipsis;
  font-size: 1.2rem;
  font-family: inherit;
  cursor: pointer;
}
.button.button-round {
  border-radius: 2.5rem;
}
.button.button-fill {
  color: #fff;
  background: #0894ec;
  border: none;
}
.button.button-big {
  font-size: 1.6rem;
  height: 4.8rem;
  line-height: 4.6rem;
}

.button-success {
  border-color: #4cd964;
  color: #4cd964;
}
.button-success:active {
  border-color: #2ac845;
  color: #2ac845;
}
.button-success.button-fill {
  color: white;
  background-color: #4cd964;
}
.button-success.button-fill:active {
  background-color: #2ac845;
}

.button-danger {
  border-color: #f6383a;
  color: #f6383a;
}
.button-danger:active {
  border-color: #f00b0d;
  color: #f00b0d;
}
.button-danger.button-fill {
  color: white;
  background-color: #f6383a;
}
.button-danger.button-fill:active {
  background-color: #f00b0d;
}
.button-warning {
  border-color: #ff6600;
  color: #ff6600;
}
.button-warning:active {
  border-color: #cc5200;
  color: #cc5200;
}
.button-warning.button-fill {
  color: white;
  background-color: #ff6600;
}
.button-warning.button-fill:active {
  background-color: #cc5200;
}

/*列表*/
.list-block {
  margin: 1.75rem 0;
  font-size: 1.4rem;
}
.list-block ul{ 
border-top:1px solid #e7e7e7;
border-bottom:1px solid #e7e7e7; background:#fff;}
.item-content{ min-height:2.4rem; padding-left:1rem; display:block;}
	
.list-block .list-group-title {
  background: #f7f7f7;
  padding: 0.2rem 1rem;
  white-space: nowrap;
  position: relative;
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #acacac;
}

.list-block .item-inner{
  padding-right: 1rem;
  position: relative;
  width: 100%;
  padding-top: 1rem;
  padding-bottom: 0.9rem;
  min-height: 4rem;
  overflow: hidden;
  display: flex;
  box-sizing: border-box;
  border-bottom:1px solid #e7e7e7;
	}
.list-block li:last-child .item-inner,.list-block .libor > li:last-child{ border-bottom:none;}

.list-block .libor .item-inner{ border-bottom:none;}
.list-block .bor-none .item-inner{ border-bottom:none;}
.list-block .libor > li{ border-bottom:1px solid #e7e7e7; }



.list-block .item-link .item-inner{
  padding-right: 3rem;
  background-image: url(../images/i-list-chevron-right.png);
  background-size: 1.5rem;
  background-repeat: no-repeat;
  background-position: 97% center;
  background-position: -webkit-calc(100% - 1rem) center;
  background-position: calc(100% - 1rem) center;
}
.list-block .item-media {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-shrink: 0;
  -ms-flex: 0 0 auto;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
  -webkit-box-lines: single;
  -moz-box-lines: single;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  box-sizing: border-box;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
}
.list-block .item-content {
  box-sizing: border-box;
  padding-left: 1rem;
  min-height: 4rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.list-block .item-title {
  -webkit-flex-shrink: 1;
  -ms-flex: 0 1 auto;
  -webkit-flex-shrink: 1;
          flex-shrink: 1;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.list-block .item-text {
  font-size: 1.2rem;
  color: #5f646e;
  line-height: 2.1rem;
  position: relative;
  overflow: hidden;
  height: 4rem;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
.list-block .item-title-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.list-block .item-after {
  white-space: nowrap;
  color: #5f646e;
  -webkit-flex-shrink: 0;
  -ms-flex: 0 0 auto;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
  margin-left: 0.25rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  max-height: 1.4rem;
}

.list-block .item-media i + i {
  margin-left: 0.5rem;
}
.list-block .item-media i + img {
  margin-left: 0.5rem;
}
.list-block .item-media + .item-inner {
  margin-left: 1.5rem;
}

.list-block .item-title.label {
  width: 25%;
  -webkit-flex-shrink: 0;
  -ms-flex: 0 0 auto;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
  margin: 4px 0;
}
.list-block .item-title.label.tr{
	padding-right:1rem;}
.list-block .item-input {
  width: 100%;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  -webkit-flex-shrink: 1;
  -ms-flex: 0 1 auto;
  -webkit-flex-shrink: 1;
          flex-shrink: 1;
}

.list-block.media-list .item-inner {
  display: block;
  padding-top: 1rem;
  padding-bottom: 0.9rem;
  -webkit-align-self: stretch;
  align-self: stretch;
}


/*图标*/
@font-face {font-family: "iconfont";
  src: url('../iconfont/iconfont.eot?t=1459996410'); /* IE9*/
  src: url('../iconfont/iconfont.eot?t=1459996410#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../iconfont/iconfont.woff?t=1459996410') format('woff'), /* chrome, firefox */
  url('../iconfont/iconfont.ttf?t=1459996410') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('../iconfont/iconfont.svg?t=1459996410#iconfont') format('svg'); /* iOS 4.1- */
}

.icon{
  font-family:"iconfont" !important;
  font-size:1.6rem;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
.icon-home:before { content: "\e600"; }
.icon-gerenzhongxin:before { content: "\e61b"; }
.icon-refresh:before { content: "\e601"; }
.icon-edit:before { content: "\e602"; }
.icon-icomoon:before { content: "\e603"; }
.icon-browser:before { content: "\e604"; }
.icon-code:before { content: "\e605"; }
.icon-computer:before { content: "\e606"; }
.icon-emoji:before { content: "\e607"; }
.icon-search:before { content: "\e608"; }
.icon-share:before { content: "\e609"; }
.icon-right:before { content: "\e60a"; }
.icon-down:before { content: "\e60b"; }
.icon-settings:before { content: "\e60c"; }
.icon-clock:before { content: "\e60d"; }
.icon-phone:before { content: "\e60e"; }
.icon-caret:before { content: "\e60f"; }
.icon-check:before { content: "\e610"; }
.icon-download:before { content: "\e611"; }
.icon-menu:before { content: "\e612"; }
.icon-friends:before { content: "\e613"; }
.icon-message:before { content: "\e614"; }
.icon-star:before { content: "\e615"; }
.icon-card:before { content: "\e616"; }
.icon-img:before { content: "\e617"; }
.icon-yingyong:before { content: "\e618"; }
.icon-remove:before { content: "\e619"; }
.icon-me:before { content: "\e61a"; }

/* === Forms === */
.list-block input[type="text"],
.list-block input[type="password"],
.list-block input[type="search"],
.list-block input[type="email"],
.list-block input[type="tel"],
.list-block input[type="url"],
.list-block input[type="date"],
.list-block input[type="datetime-local"],
.list-block input[type="time"],
.list-block input[type="number"],
.list-block select,
.list-block textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  box-sizing: border-box;
  border:1px solid #e7e7e7;
  background: none;
  border-radius: 0 0 0 0;
  box-shadow: none;
  display: block;
  padding: 0 0 0 0.25rem;
  margin: 0;
  width: 100%;
  height: 3.5rem;
  color: #3d4145;
  font-size: 1.4rem;
  font-family: inherit;
  border-radius:0.3rem;
}
.list-block textarea {
  height: 10rem;
  resize: none;
  line-height: 1.8rem;
  padding-top: 0.4rem;
  padding-bottom: 0.35rem;
}

.label-switch {
  display: inline-block;
  vertical-align: middle;
  width: 5.2rem;
  border-radius: 1.6rem;
  box-sizing: border-box;
  height: 3.2rem;
  position: relative;
  cursor: pointer;
  -webkit-align-self: center;
  align-self: center;
}
.label-switch .checkbox {
  width: 5.2rem;
  border-radius: 1.6rem;
  box-sizing: border-box;
  height: 3.2rem;
  background: #e5e5e5;
  z-index: 0;
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  border: none;
  cursor: pointer;
  position: relative;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.label-switch .checkbox:before {
  content: ' ';
  position: absolute;
  left: 0.2rem;
  top: 0.2rem;
  width: 4.8rem;
  border-radius: 3.2rem;
  box-sizing: border-box;
  height: 2.8rem;
  background: #fff;
  z-index: 1;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
  -webkit-transform: scale(1);
          transform: scale(1);
}
.label-switch .checkbox:after {
  content: ' ';
  height: 2.8rem;
  width: 2.8rem;
  border-radius: 1.4rem;
  background: #fff;
  position: absolute;
  z-index: 2;
  top: 0.2rem;
  left: 0.2rem;
  box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.4);
  -webkit-transform: translateX(0px);
          transform: translateX(0px);
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}

.label-switch input[type="checkbox"] {
  display: none;
}

.label-switch input[type="checkbox"]:checked + .checkbox {
  background: #4cd964;
}
.label-switch input[type="checkbox"]:checked + .checkbox:before {
  -webkit-transform: scale(0);
          transform: scale(0);
}
.label-switch input[type="checkbox"]:checked + .checkbox:after {
  -webkit-transform: translateX(2.2rem);
          transform: translateX(2.2rem);
}