/*reset && 常用css*/
html.gray-theme{
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray;
}
html, body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
 pre, form, fieldset, input, textarea, p, th, td, img, area, param {
  margin: 0;
  padding: 0;
}

ul, ol {
  list-style: none;
}

/* 用于icon或者小图 */
i, b {
  font-style: normal;
}

img {
  border: none;
}

input, button, select, option, textarea {
  border: none;
  outline: none;
}

input, button {
  font-size: 14px;
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #9e9e9e;
}

a {
  text-decoration: none;
  color: #333333;
}

a:active {
	color: #d85b1e;
}

/* 去掉iphone、ipad的默认按钮样式 */
input[type="button"], input[type="submit"], input[type="reset"] {
  -webkit-appearance: none;
}

textarea {
  -webkit-appearance: none;
}

.button {
  border-radius: 0;
}

html, body {
  height: 100%;
}

body {
  font-family: "tahoma", "source han sans cn", arial, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #333333;
  background: #f2f3f4;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; /*关闭ios链接半透明背景色*/
}

.dp-b {display: block;}
.dp-i {display: inline;}

.pos-r {position: relative;}
.pos-a {position: absolute;}
.pos-f {position: fixed;}

.f-l {float: left;}
.f-r {float: right;}

.of-h{overflow: hidden;}
.of-a{overflow: auto;}

/*文字单行溢出省略号*/
.text-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mt-4 {margin-top: 4px;}
.mt-8 {margin-top: 8px;}
.mt-12 {margin-top: 12px;}
.mt-16 {margin-top: 16px;}
.mt-24 {margin-top: 24px;}
.mt-32 {margin-top: 32px;}

.mb-4 {margin-bottom: 4px;}
.mb-8 {margin-bottom: 8px;}
.mb-12 {margin-bottom: 12px;}
.mb-16 {margin-bottom: 16px;}
.mb-24 {margin-bottom: 24px;}
.mb-32 {margin-bottom: 32px;}
.mb-48 {margin-bottom: 48px;}

.ml-4 {margin-left: 4px;}
.ml-8 {margin-left: 8px;}
.ml-12 {margin-left: 12px;}
.ml-16 {margin-left: 16px;}
.ml-24 {margin-left: 24px;}

.mr-4 {margin-right: 4px;}
.mr-8 {margin-right: 8px;}
.mr-12 {margin-right: 12px;}
.mr-16 {margin-right: 16px;}
.mr-24 {margin-right: 24px;}

.pt-4 {padding-top: 4px;}
.pt-8 {padding-top: 8px;}
.pt-12 {padding-top: 12px;}
.pt-16 {padding-top: 16px;}
.pt-24 {padding-top: 24px;}
.pt-32 {padding-top: 32px;}

.pb-4 {padding-bottom: 4px;}
.pb-8 {padding-bottom: 8px;}
.pb-12 {padding-bottom: 12px;}
.pb-16 {padding-bottom: 16px;}
.pb-24 {padding-bottom: 24px;}
.pb-32 {padding-bottom: 32px;}

.pl-4 {padding-left: 4px;}
.pl-8 {padding-left: 8px;}
.pl-12 {padding-left: 12px;}
.pl-16 {padding-left: 16px;}
.pl-24 {padding-left: 24px;}
.pl-48 {padding-left: 48px;}

.pr-4 {padding-right: 4px;}
.pr-8 {padding-right: 8px;}
.pr-12 {padding-right: 12px;}
.pr-16 {padding-right: 16px;}
.pr-24 {padding-right: 24px;}
.pr-48 {padding-right: 48px;}

/* 圆角 */
.brs-2{border-radius: 2px;}
.brs-3{border-radius: 3px;}
.brs-4{border-radius: 4px;}
.brs-5{border-radius: 5px;}

/* 文字尺寸 */
.f-12 {font-size: 12px !important;}
.f-13 {font-size: 13px !important;}
.f-14 {font-size: 14px !important;}
.f-15 {font-size: 15px !important;}
.f-16 {font-size: 16px !important;}
.f-18 {font-size: 18px !important;}
.f-20 {font-size: 20px !important;}
.f-24 {font-size: 24px !important;}
.f-26 {font-size: 26px !important;}
.f-28 {font-size: 28px !important;}
.f-30 {font-size: 30px !important;}
.f-32 {font-size: 32px !important;}

/* 对齐 */
.ta-l {text-align: left !important;}
.ta-r {text-align: right !important;}
.ta-c {text-align: center !important;}
.va-t {vertical-align: top !important;}
.va-m {vertical-align: middle !important;}
.va-b {vertical-align: bottom !important;}

/* 文字颜色 */
.c-2 {color: #212121 !important;}
.c-3 {color: #333333 !important;}
.c-4 {color: #424456 !important;}
.c-7 {color: #757575 !important;}
.c-9 {color: #9e9e9e !important;}
.c-a {color: #a0a0a0 !important;}
.c-b {color: #b4b4b4 !important;}
.c-f {color: #fff !important;}
.c-orange {color: #f16622 !important;}

/* 行高 */
.lh-1 {line-height: 1 !important;}
.lh-16 {line-height: 16px;}
.lh-20 {line-height: 20px;}
.lh-24 {line-height: 24px;}
.lh-32 {line-height: 32px;}

/* 背景色 */
.bgc-f {background-color: #fff;}
.bgc-t {background-color: transparent;}
.bgc-base {background-color: #f2f3f4;}
.bgc-orange {background-color: #f16622;}
.bgc-grey {background: #f9f9f9;}

/* flex布局 */
.fx {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
}

.fx-v {
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  flex-direction: column;
}

.fx-1 {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto;
}

.fx-1-0 {
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto;
}

.fx-n {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
}

.fx-align-start {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}

.fx-align-center {
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.fx-align-end {
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}

.fx-justify-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.fx-justify-end {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}

.fx-justify-between {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.fx-justify-around {
  -webkit-justify-content: space-around;
  justify-content: space-around;
}

/* 细线边框 */
.bd-t {
  position: relative;
}
.bd-t:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-image: -webkit-linear-gradient(top, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-image: linear-gradient(180deg, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-size: 100% 1px;
  background-repeat: no-repeat;
  background-position: top left;
}

.bd-b {
  position: relative;
}
.bd-b:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-image: -webkit-linear-gradient(bottom, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-image: linear-gradient(0deg, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-size: 100% 1px;
  background-repeat: no-repeat;
  background-position: bottom left;
}

.bd-l {
  position: relative;
}
.bd-l:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  background-image: -webkit-linear-gradient(left, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-image: linear-gradient(90deg, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-size: 1px 100%;
  background-repeat: no-repeat;
  background-position: top left;
}

.bd-r {
  position: relative;
}
.bd-r:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  background-image: -webkit-linear-gradient(left, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-image: linear-gradient(270deg, #e0e0e0, #e0e0e0 50%, transparent 50%);
  background-size: 1px 100%;
  background-repeat: no-repeat;
  background-position: top right;
}

/* 交互反馈 */
.click--active-grey:active {
  background: #f9f9f9 !important;
}

.click--active-orange:active {
  background: #f16622 !important;
  color: #fff !important;
}

.click--active-orange-d:active {
  background: #d85b1e !important;
  color: #fff !important;
}

/*业务共用css*/
[v-cloak] { display: none } /* vue防闪烁 */
/* 头部 */
.header {
  height: 48px;
  padding: 0 16px;
}
.tab-box{
  width: 120px;
  color: #f16622;
  border-radius: 4px;
  height: 24px;
  background:#fff;
  overflow: hidden;
  border: 1px solid #f16622;
}
.tab-box > span{
  width: 60px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  display: inline-block;
  box-sizing: border-box;
}
.tab-active{
  background: #f16622;
  color: #fff!important;
}
.logo {
  width: auto;
  height: 24px;
}

/* 底部 */
.footer {
  background-color: #333;
  padding: 32px;
  line-height: 16px;
}
.base-btn {
  display: block;
  line-height:48px;
  text-align: center;
  font-size: 16px;
  user-select: none;
  border-radius: 2px;
  border: 1px solid #f16622;
}
.seperator {
  height: 1px;
  margin: 19px 0;
  background-color: #b4b4b4;
}
.footer-base-icon {
  display: inline-block;
  width: 11px;
  height: 11px;
}
.contact-icon {
  background:  no-repeat center center/contain;
}
.addr-icon {
  background:  no-repeat center center/contain;
}

.dl-section-hll {
  display: block !important;
	height: 66px;
	background: #fff;
	border-top: 1px solid #e2e2e2;
  box-sizing: border-box;
  padding: 8px 16px;
}

/* banner */
.banner {
  position: relative;
  /*height: 200px;*/
}

.h1 {
  font-size: 28px;
  color: #333;
  line-height: 48px;
}

.full {
  width: 100%;
  height: 100%;
}