@charset "utf-8";
body {
    background-color: #f3f3f3;
}

textarea:disabled,
input:disabled {
    background-color: #efefef;
    color: #ACA899;
    cursor: not-allowed !important;
}

* {
    box-sizing: border-box;
}

/********************************** layui.css ************************************/
.layui-form-select dl {
    top: 35px;
}

.layui-form-selectup dl {
    top: auto;
    bottom: 35px;
}

.layui-laypage input {
    display: inline-block;
}

.layui-flow-more a * {
    display: inline-block;
}

.layui-input {
    height: 34px;
}

.layui-laypage-sensor {
    margin: 10px 0;
}

.layui-layer-resize {
    z-index: 9999;
}

/********************************** 公共样式 ************************************/
.L {
    float: left;
}

.R {
    float: right;
}

.mR10 {
    margin-right: 10px;
}

.mR20 {
    margin-right: 20px;
}

.mR30 {
    margin-right: 30px;
}

.mL10 {
    margin-left: 10px;
}

.mL20 {
    margin-left: 20px;
}

.mL-1 {
    margin-left: -1px;
}

.mT10 {
    margin-top: 10px;
}

.mT20 {
    margin-top: 20px;
}

.mT30 {
    margin-top: 30px;
}

.mB20 {
    margin-bottom: 20px;
}

.hide {
    display: none;
}

.show {
    display: block !important;
}

.app-loading {
    position: relative;
    width: 100%;
    height: 45px;
    line-height: 45px;
    text-align: center;
    background-color: #f6f7fb;
    z-index: 999;
    overflow: hidden;
}

.app-loading i {
    font-size: 24px;
    color: #000;
    ont-weight: 700;
}

/** 复选框**/
.app-check {
    display: inline-block;
    width: auto;
}

.app-check .layui-form-checkbox[lay-skin=primary] {
    padding-left: 0;
}

.app-foot-check {
    float: left;
    width: auto;
    height: 50px;
    line-height: 50px;
    margin: 0 0 0 5px;
}

.app-foot-check .layui-form-checkbox[lay-skin=primary] {
    padding-left: 0;
}

/** body区公共头底  **/
.app-body-head {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    line-height: 50px;
    background-color: #fff;
    border-bottom: 1px solid #E8ECF0;
    z-index: 1001;
}

.app-body-con {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 50px;
    z-index: 999;
    overflow: auto;
}

.app-body-footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    padding-right: 10px;
    background-color: #fff;
    z-index: 999;
    border-top: 1px solid #E8ECF0;
}

.app-body-block {
    position: relative;
    width: auto;
    height: 34px;
    margin-top: 8px;
}

.app-body-select {
    position: relative;
    float: left;
    width: 160px;
    height: 34px;
    font-size: 12px;
}

.app-body-selectshort {
    position: relative;
    float: left;
    width: 120px;
    height: 34px;
    font-size: 12px;
}

.app-body-input {
    position: relative;
    float: left;
    width: 180px;
    height: 34px;
    font-size: 12px;
}

.app-body-time {
    position: relative;
    float: left;
    width: 270px;
    height: 34px;
    font-size: 12px;
}

.dataIco {
    position: absolute;
    top: 0;
    right: 0;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 16px;
    color: #666;
    z-index: 99;
}

/** 公共按钮**/
.app-head-button {
    position: relative;
    float: left;
    height: 32px;
    line-height: 32px;
    padding: 0 15px;
    margin-top: 8px;
    border-radius: 2px;
    font-size: 12px;
    color: #fff;
    background-color: #1694f3
}

.app-head-button:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-head-button.disabled {
    background-color: #999;
}

.app-head-buttonBor {
    position: relative;
    float: left;
    height: 32px;
    line-height: 32px;
    padding: 0 15px;
    border-radius: 2px;
    font-size: 12px;
    color: #1694f3;
    border: 1px solid #1694f3;
}

.app-head-link {
    font-size: 14px;
    float: left;
    color: #1694f3;
}

.app-head-link:hover {
    color: #1070b9;
}

.app-search-button {
    position: relative;
    float: left;
    height: 32px;
    line-height: 32px;
    padding: 0 15px;
    border-radius: 2px;
    font-size: 20px;
    color: #fff;
    background-color: #1694f3;
}

.app-search-button:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-foot-button {
    position: relative;
    float: left;
    height: 32px;
    line-height: 32px;
    padding: 0 10px;
    margin-top: 9px;
    border-radius: 2px;
    font-size: 12px;
    color: #333;
    border: 1px solid #d7d7d7;
}

.app-foot-button:hover {
    color: #333;
    border: 1px solid #1694f3;
}

.appMsg {
    position: relative;
    display: inline-block;
    color: #1694f3;
    font-size: 16px;
    padding: 0 5px;
}

.app-Back {
    position: relative;
    display: inline-block;
    height: 24px;
    line-height: 24px;
    padding: 0 5px;
    border-radius: 2px;
    font-size: 12px;
    color: #666;
    border: 1px solid #bbb;
}

.app-Back:hover {
    border: 1px solid #333;
}

.app-Back i {
    font-size: 12px;
}

/* 开关 */
.app-switch {
    display: inline-block;
    width: auto;
}

.app-switch .layui-form-switch {
    margin: 0;
    height: 24px;
}

/* 分页 */
.layui-laypage-sensor {
    margin: 11px 0;
    float: right;
}

.layui-laypage-sensor a, .layui-laypage-sensor span {
    margin: 0 -1px 0 0;
    padding: 0 10px;
}

.layui-laypage-sensor .layui-laypage-curr .layui-laypage-em {
    background-color: #1694f3;
}

/** 公共table **/
.app-table {
    position: relative;
    width: 100%;
}

.app-table tr th,
.app-table tr td {
    padding: 12px 5px;
    text-align: center;
    border-bottom: 1px solid #E8ECF0;
    font-size: 14px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.app-table tr th {
    background-color: #f5f5f5;
    font-weight: 400;
}

.app-table tr td:first-child {
    width: 50px;
}

.app-table-butA {
    position: relative;
    display: inline-block;
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 3px;
    background-color: #1694f3;
    color: #fff;
    margin-left: 5px;
}

.app-table-butA:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-table-butA.disabled {
    background-color: #999;
}

.app-table-butB {
    position: relative;
    display: inline-block;
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 3px;
    border: 1px solid #1694f3;
    color: #1694f3;
    margin-left: 5px;
}

/** 公共table2 **/
.app-demoTable {
    position: relative;
    width: 100%;
}

.app-demoTable tr th,
.app-demoTable tr td {
    padding: 12px 5px;
    text-align: center;
    border-bottom: 1px solid #E8ECF0;
    font-size: 14px;
    color: #333;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.app-demoTable tr th {
    background-color: #f5f5f6;
    font-weight: 400;
    color: #73777a;
}

.app-demoTable tbody tr:nth-of-type(2n) td {
    background-color: #f8f8f8;
}

.app-demoTable tbody tr:hover {
    background-color: #eaf6fe;
}

/******************************************** 头部导航 **************************************************/
.app-head {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    z-index: 100;
}

.app-head ul {
    background-color: #373d41;
    padding: 0;
    border-radius: 0;
}

.app-head .layui-nav .layui-nav-item {
    line-height: 50px;
}

.app-head .layui-nav-child {
    top: 50px;
}

.app-head .layui-anim {
    -webkit-animation-duration: .1s;
    animation-duration: .1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.app-logo {
    position: relative;
    width: auto;
    height: 50px;
    line-height: 50px;
    text-align: center;
    float: left;
}

.app-logo img {
    height: 50px;
}

.app-head-right {
    float: right;
    padding-right: 5px;
}

/*控制台*/
.tlink-Console a {
    padding: 0 10px !important;
}

.tlink-Console span {
    display: inline-block;
    height: 26px;
    line-height: 23px;
    padding: 0 10px;
    border-radius: 4px;
    font-size: 12px;
    border: 1px solid #d7d7d7;
}

/*消息*/
.app-news > a {
    position: relative;
    font-size: 18px;
    padding: 0 10px !important;
}

.app-newsYES::after {
    content: '';
    position: absolute;
    top: 14px;
    right: 8px;
    width: 6px;
    height: 6px;
    background-color: #FF5722;
    border-radius: 50%;
}

.app-news a > .layui-nav-more {
    display: none;
}

.app-news > .layui-nav-child {
    left: auto;
    right: 0;
}

.app-news > .layui-nav-child ul {
    padding: 10px 0;
    background-color: #fff;
}

.app-news > .layui-nav-child ul > a {
    padding: 5px 10px;
    line-height: 20px;
    color: #000;
    max-width: 300px;
    min-width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.app-newsYESa {
    color: #999 !important;
}

.app-news > .layui-nav-child ul > a span {
    font-size: 13px !important;
}

.app-news > .layui-nav-child ul > a P {
    font-size: 12px !important;
}

.app-news > .layui-nav-child > p {
    height: 30px;
    line-height: 30px;
    border-top: 1px solid #E8ECF0;
}

.app-news > .layui-nav-child > p a {
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    font-size: 12px !important;
}

/*语言*/
.app-language > a {
    padding: 0 10px !important;
}

.app-language > a > .layui-nav-more {
    display: none;
}

/*头像*/
.app-user-ico > .layui-nav-child {
    left: auto;
    right: 0;
    min-width: 200px;
}

.app-user-ico > a {
    padding: 0 10px !important;
}

.app-user-ico h2 {
    height: 60px;
    line-height: 50px;
    padding: 0 20px;
    border-bottom: 1px solid #E8ECF0;
}

.app-user-ico h2 img {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.app-user-ico h2 span {
    font-size: 15px;
    padding-left: 10px;
    color: #333;
}

.app-user-ico ul {
    background-color: #fff;
    padding: 10px 0;
}

.app-user-ico ul a {
    height: 34px;
    line-height: 34px;
    font-size: 13px;
}

.app-user-ico ul a span {
    font-size: 20px;
    display: inline-block;
    vertical-align: bottom;
    padding-right: 5px;
}

.app-user-ico p {
    height: 36px;
    line-height: 36px;
    border-top: 1px solid #E8ECF0;
}

.app-user-ico p a {
    height: 36px;
    line-height: 36px;
    font-size: 13px;
}

/** 左侧菜单栏 **/
.app-menu {
    position: fixed;
    top: 50px;
    left: 0;
    width: 50px;
    bottom: 0;
    background-color: #222d32;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
    -moz-transition: width .3s;
    -webkit-transition: width .3s;
    transition: width .3s;
    z-index: 99;
}

.app-menu:after {
    content: 'v2.0';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 12px;
    font-style: italic;
    color: #999;
}

.app-menuPlus {
    width: 180px;
}

.app-menu ul {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    overflow: hidden;
}

.app-menu ul a {
    display: block;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    white-space: nowrap;
    color: rgba(255, 255, 255, .8);
}

.app-menu ul a:hover {
    background-color: #1a2427;
}

.app-menu ul a span {
    display: inline-block;
    width: 50px;
    font-size: 26px;
    text-align: center;
    overflow: hidden;
}

.app-menu ul a p {
    display: inline-block;
    width: 130px;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

.app-menu ul .app-menuThis {
    background-color: #1a2427;
}

/************************************************ 右侧 **************************************************/
.app-body {
    position: fixed;
    top: 50px;
    left: 50px;
    right: 0;
    bottom: 0;
    background-color: #efefef;
    z-index: 98;
    overflow: hidden;
}

/******************************************** 加农中心 *******************************************/
/* 设备组窗口 */
.app-group {
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    bottom: 0;
    z-index: 999;
    background-color: #fff;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .1);
    overflow: hidden;
}

/* 设备组搜索栏 */
.app-search-click {
    position: relative;
    width: 300px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    padding: 0 50px;
    text-align: center;
    background-color: #1694f3;
    cursor: text;
    font-size: 14px;
    overflow: hidden;
}

.app-search-click span {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 24px;
    color: #fff;
    text-align: center;
    z-index: 9;
}

.app-search-box {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 300px;
    overflow: hidden;
    display: none;
}

.app-search-back {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    color: #333;
    text-align: center;
    z-index: 9;
}

.app-search-input {
    position: absolute;
    top: 0;
    left: 0px;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding: 0 50px;
    background-color: #fff;
    border: 0;
    font-size: 14px;
    color: #333;
    z-index: 8;
}

.app-search-sub {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 24px;
    color: #333;
    text-align: center;
    z-index: 9;
}

.app-search-Result {
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    border-top: 1px solid #d7d7d7;
    z-index: 99;
    overflow-x: hidden;
    overflow-y: auto;
}

.app-search-Result:after {
    content: 'You can enter the device name / serial number / ID to search';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 12px;
    color: #999;
}

/* 设备组列表 */
.app-group-list {
    position: absolute;
    top: 40px;
    left: 0;
    bottom: 50px;
    right: 0;
    z-index: 9;
}

.app-group-tab {
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 9;
}

.app-group-tab > .layui-tab-title {
    height: 50px;
    background-color: #f6f7fb;
}

.app-group-tab > .layui-tab-title li {
    width: 99px;
    line-height: 50px;
}

.app-group-tab > .layui-tab-title .layui-this {
    color: #333;
}

.app-group-tab > .layui-tab-more li.layui-this:after, .app-group-tab > .layui-tab-title .layui-this:after {
    border: none;
    border-radius: 0;
    border-bottom: 2px solid #1694f3;
    height: 50px;
}

.app-group-con {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    padding: 0;
}

.app-group-con > .layui-tab-item {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

/** 设备分组 **/
.app-group-ul {
    position: relative;
    width: 100%;
}

.app-group-li {
    position: relative;
    display: block;
    width: 100%;
    line-height: 45px;
    *zoom: 1;
    vertical-align: middle;
}

.app-group-itme {
    position: relative;
    width: 100%;
    height: 45px;
    line-height: 45px;
}

.app-group-itme i {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 45px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    font-size: 18px;
    color: #1694f3;
    transition: all .2s;
    -webkit-transition: all .2s;
    z-index: 999;
    cursor: pointer;
}

.app-group-itme a {
    position: relative;
    width: 100%;
    height: 45px;
    line-height: 45px;
    display: block;
    padding: 0 75px 0 50px;
    border-bottom: 1px solid #f6f7fb;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-group-itme span {
    position: absolute;
    top: 0;
    right: 10px;
    color: #a0a0a0;
}

/* 默认组 Default */
.Default > .icon-default {
    position: absolute;
    top: 0;
    right: 0;
    width: 28px;
    height: 28px;
    line-height: 28px;
    font-size: 28px;
    text-align: right;
    z-index: 1;
    color: #1694f3;
}

/** 分组下设备  **/
.app-group-child {
    position: relative;
    width: 100%;
    min-height: 40px;
    overflow: hidden;
    display: none;
}

.app-group-child:after {
    position: absolute;
    left: 0;
    top: 0;
    content: '当前组下暂无设备';
    width: 100%;
    height: 40px;
    line-height: 40px;
    color: #c3c3c3;
    text-align: center;
    z-index: 99999;
    z-index: 0;
}

.app-group-eqp {
    position: relative;
    width: 100%;
    height: 40px;
    z-index: 9;
    background-color: #f6f7fb;
    overflow: hidden;
}

.app-group-img {
    position: absolute;
    top: 0px;
    left: 10px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    padding: 5px;
    z-index: 999;
    overflow: hidden;
}

.app-group-img img {
    width: 100%;
    vertical-align: sub;
    border-radius: 50%;
}

.app-group-eqp a {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    display: block;
    padding: 0 20px 0 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #000;
    font-weight: 700;
    font-size: 12px;
}

.app-group-eqp a:hover {
    background-color: #eaf6fe;
}

.Open > .app-group-itme i {
    transform: rotate(90deg);
}

.Open > .app-group-child {
    display: block;
}

.app-group-hlt {
    position: relative;
    width: 100%;
    height: 45px;
    border: 1px solid #1694f3;
}

.app-group-hig {
    position: relative;
    width: 100%;
    height: 40px;
    border: 1px solid #1694f3
}

.app-group-div {
    position: relative;
    width: 100%;
    overflow: hidden;
}

/** 离线状态 **/
.app-group-OffLine img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}

.app-group-OffLine a {
    color: #999;
    font-weight: 400;
}

/** 报警状态 **/
.app-group-Police .app-group-img:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    border-radius: 50%;
    border: 2px dotted #ff0000;
    animation: turn 5s linear infinite;
}

@keyframes turn {
    0% {
        -webkit-transform: rotate(0deg);
    }
    25% {
        -webkit-transform: rotate(90deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
    }
    75% {
        -webkit-transform: rotate(270deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

.app-group-Police a {
    color: #ff1100;
}

/**  禁用状态   **/
.app-group-no > .app-group-img:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: url('../../content/images/no.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    cursor: no-drop;
    z-index: 999;
}

/*** 组和设备右键弹出样式 ***/
.mouseGroup {
    position: fixed;
    width: 90px;
    height: 180px;
    background-color: #fff;
    z-index: 9999;
    border-radius: 5px;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, .25);
}

.mouseGroupName {
    position: relative;
    width: 100%;
    height: 34px;
    line-height: 34px;
    text-align: center;
    color: #fff;
    background-color: #1694f3;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 14px;
}

.mouseGroup a {
    display: block;
    width: 100%;
    height: 34px;
    line-height: 34px;
    text-align: center;
    color: #333;
    font-size: 14px;
}

.mouseGroup a:hover {
    background-color: #1694f3;
    color: #fff;
}

.mouseGroupR {
    position: absolute;
    top: 0;
    left: 90px;
    width: 130px;
    padding: 5px 10px;
    bottom: 0;
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #d7d7d7;
    overflow: auto;
    display: none;
}

.mouseGroupRLoading {
    position: relative;
    width: 40px;
    height: 16px;
    margin: 0 auto;
    background-image: url("../images/loading-0.gif");
    background-position: center;
    background-repeat: ne-resize;
    background-size: 100% 100%;
}

.mouseGroupR p {
    display: block;
    width: 100px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    color: #333;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mouseGroupR p:hover {
    color: #1694f3;
}

.mouseGroupDrop {
    color: #bfc5d1 !important;
    cursor: no-drop;
}

.mouseGroupDrop:hover {
    background-color: #fff !important;
}

/*** 设备管理底部按钮 ***/
.app-group-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    z-index: 8;
    border-top: 1px solid #d7d7d7;
    overflow: hidden;
}

.app-group-bottom:after {
    position: absolute;
    left: 50%;
    top: 13px;
    content: '';
    width: 1px;
    height: 24px;
    background-color: #c2c2c2;
    z-index: 99999;
}

.app-group-button {
    position: relative;
    float: left;
    width: 50%;
    height: 50px;
    line-height: 50px;
    background-color: #fff;
    color: #1694f3;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    border: none;
    cursor: pointer;
}

.app-group-button:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 1px;
    background-color: #1694f3;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
    -moz-transition: width .3s;
    -webkit-transition: width .3s;
    transition: width .3s;
}

.app-group-button:hover.app-group-button:after {
    width: 100%;
}

/****** 设备组管理弹窗  ******/
.groupAdmin {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

.groupAdminL {
    position: absolute;
    top: 0;
    left: 0;
    width: 280px;
    padding: 10px 10px 0 10px;
    bottom: 10px;
    border-right: 1px solid #d7d7d7;
    z-index: 999;
    overflow: auto;
}

.groupAdminL li {
    position: relative;
    display: block;
    width: 100%;
    height: 50px;
    padding: 5px 0;
    margin: 0;
}

.groupAdminL li a {
    position: relative;
    display: block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    color: #333;
    border-radius: 2px;
    background-color: #e8ecf0;
    overflow: hidden;
}

.groupAdminLA {
    background-color: #373d41 !important;
    color: #fff !important;
}

.groupAdminR {
    position: absolute;
    top: 0;
    left: 280px;
    right: 0;
    padding: 10px 10px 0 10px;
    bottom: 0;
    z-index: 999;
    overflow: hidden;
}

.groupAdminRT {
    position: relative;
    width: 100%;
    height: 40px;
    z-index: 9999;
}

.groupAdminRL {
    float: left;
    padding: 11px 0;
}

.groupAdminRT .layui-form-checkbox[lay-skin=primary] i {
    top: 1px;
}

.groupAdminRS {
    float: right;
    width: 180px;
    margin-right: 20px;
}

.groupAdminDel {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: #0172cc;
    font-size: 20px;
    z-index: 9999;
    cursor: pointer;
    display: none;
}

.groupAdminLA ~ i {
    color: #FFF;
}

.groupAdminL li:hover .groupAdminDel {
    display: block;
}

.groupAdmin-btn {
    height: 36px;
    line-height: 36px;
    padding: 0 12px;
    background-color: #FF5722;
}

.groupAdminB {
    position: absolute;
    top: 50px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 999;
    overflow: auto;
}

.groupAdminB::after {
    content: '分组下无设备';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 45px;
    line-height: 45px;
    color: #999;
    text-align: center;
    z-index: 0;
}

.groupAdminBL {
    position: relative;
    width: 100%;
    height: 45px;
    line-height: 45px;
    border-bottom: 1px solid #e2e2e2;
    background-color: #fff;
    z-index: 1;
}

#groupDefault > .icon-default {
    position: absolute;
    top: 0;
    right: 0;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: right;
    font-size: 28px;
    z-index: 1;

}

/********* 设备传感器列表 ***********/
.tlink-sensor {
    position: absolute;
    top: 0;
    left: 310px;
    right: 0;
    bottom: 0;
    z-index: 998;
    background-color: #fff;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .15);
    overflow: hidden;
}

.tlink-sensorData {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 50px;
    right: 0;
    z-index: 998;
    overflow: auto;
}

.tlink-sensorData:after {
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    width: 100%;
    height: 50px;
    line-height: 50px;
    color: #c2c2c2;
    text-align: center;
    z-index: 0;
}

.tlink-table {
    position: relative;
    width: 100%;
    border: 0;
    background-color: #fff;
    z-index: 99;
    overflow: hidden;
}

.tlink-table thead {
    background-color: #f2f2f2;
}

.tlink-table thead tr,
.tlink-table tbody tr {
    border-bottom: 1px solid #E1E6EB;
}

.tlink-table thead tr:hover,
.tlink-table tbody tr:hover {
    background-color: #eaf6fe;
}

.tlink-table tbody td:first-child {
    width: 80px;
}

.tlink-sensorHead {
    position: relative;
    width: 100%;
    height: 50px;
    padding: 0 20px;
    overflow: hidden;
}

.tlink-sensorHead span {
    float: left;
    line-height: 50px;
}

.tlink-sensorBack {
    position: relative;
    float: left;
    margin: 13px 10px 13px 0;
    height: 24px;
    line-height: 24px;
    padding: 0 5px;
    border-radius: 2px;
    font-size: 12px;
    color: #fff;
    background-color: #1694f3;
}

.tlink-sensorBack i {
    font-size: 12px;
}

.tlink-sensorBack:hover {
    background-color: #117cce;
    color: #fff;
}

.tlink-sensorName {
    font-weight: 700;
    font-size: 15px;
    color: #333;
}

.tlink-sensorHeadS2 {
    margin-left: 20px;
    color: #666;
}

.tlink-sensorHeadI {
    position: relative;
    height: 26px;
    line-height: 26px !important;
    text-align: center;
    color: #666;
    font-size: 14px;
    margin: 12px 0;
    padding: 0 10px;
    border: 1px solid #d7d7d7;
}

.tlink-sensorHeadICO {
    position: relative;
    float: right;
    height: 50px;
    line-height: 50px;
    padding-right: 10px;
    font-size: 18px;
    color: #1694f3;
}

.tlink-sensorImg {
    position: relative;
    width: 80px;
    height: 60px;
    padding: 5px 15px;
    float: left;
    overflow: hidden;
}

.tlink-sensorImg img {
    width: 100%;
}

.tlink-sensorDiv {
    position: relative;
    width: auto;
    height: 60px;
    padding: 8px 0;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.tlink-sensorDiv p, .tlink-sensorBox p {
    padding: 0 10px 0 0;
    height: 22px;
    line-height: 22px;
    overflow: hidden;
}

.tlink-sensorP {
    font-size: 14px;
    color: #999;
}

.tlink-sensorC1 {
    color: #5FB878;
}

.tlink-sensorCI {
    float: left;
    font-size: 24px;
}

.tlink-sensorCS {
    float: left;
}

.tlink-sensorD {
    display: inline-block;
    font-size: 24px;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.tlink-sensorSwitch {
    position: relative;
    display: inline-block;
}

.tlink-sensorSwitch > .switchLonding {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    line-height: 32px;
    z-index: 999;
    text-align: center;
    background-color: rgba(0, 0, 0, .3);
    border-radius: 16px;
    display: none;
    overflow: hidden;
}

.tlink-sensorSwitch > .switchLonding i {
    display: inline-block;
    font-size: 24px;
    color: #fff;
}

.tlink-sensorSwitch > .layui-form-switch {
    margin: 0;
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
}

.tlink-sensorSwitch > .layui-form-switch em {
    width: 40px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    display: block;
}

.tlink-sensorSwitch > .layui-form-onswitch em {
    margin-left: 0;
}

.tlink-sensorSwitch > .layui-form-switch i {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.tlink-sensorSwitch > .layui-form-onswitch i {
    margin-left: -28px;
}

.tlink-sensorDS2 {
    font-size: 14px;
    font-weight: 400;
}

.tlink-sensorDS3 {
    padding-left: 5px;
    font-size: 20px;
    color: #1694f3;
}

.tlink-Chart {
    position: relative;
    width: auto;
    height: 60px;
    white-space: nowrap;
    text-overflow: ellipsis;
    float: right;
}

.tlinkChart {
    position: relative;
    width: 90px;
    height: 60px;
    line-height: 60px;
    display: inline-block;
    color: #1694f3;
    text-align: center;
    font-size: 14px;
}

.tlink-sensorNo {
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
    color: #c2c2c2;
    text-align: center;
    z-index: 0;
}

/** 离线状态 **/
.tlink-Off-line .tlink-sensorImg img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}

.tlink-Off-line .tlink-sensorDiv p, .tlink-Off-line .tlink-sensorD, .tlink-Off-line .tlink-sensorD a, .tlink-Off-line .tlinkChart {
    color: #999;
}

.tlink-Off-line .layui-form-onswitch {
    background-color: #999;
    border-color: #999;
}

/** 报警 **/
.tlink-warning .tlink-sensorD {
    color: #f44336;
}

.tlink-warning .tlink-sensorImg {
    padding: 10px 20px;
    border-radius: 50%;
}

.tlink-warning .tlink-sensorImg img {
    border-radius: 50%;
    overflow: hidden;
}

.tlink-warning .tlink-sensorImg:after {
    content: '';
    position: absolute;
    top: 6px;
    left: 14px;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 2px dotted #ff0000;
    animation: turn 5s linear infinite;
}

/* 流浪卡弹窗 */
.cardWindow {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 30px;
    overflow: hidden;
}

.cardWindowHead {
    position: relative;
    width: 100%;
    height: 68px;
    padding: 10px 0;
}

.cardWindow-list {
    position: relative;
    width: 100%;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
}

.cardWindow-list > .cardWindowICCID {
    position: relative;
    float: left;
    font-size: 14px;
    color: #666;
}

.cardWindow-list > .cardWindowSY {
    position: relative;
    float: right;
    font-size: 14px;
    color: #666;
}

.cardWindowLin {
    position: relative;
    width: 100%;
    height: 18px;
    overflow: hidden;
}

.cardWindowCon {
    position: absolute;
    top: 80px;
    left: 30px;
    right: 30px;
    bottom: 10px;
    border: 1px solid #e8ecf0;
}

.cardWindowL {
    position: relative;
    width: 100%;
    height: 50px;
    background-color: #e8ecf0;
    border-bottom: 1px solid #e8ecf0;
    padding: 0 10px;
    overflow: hidden;
}

.cardWindowL span {
    float: left;
    height: 50px;
    line-height: 50px;
    color: #666;
    font-size: 14px;
}

.cardWindowSe {
    position: relative;
    width: 320px;
    height: 34px;
    margin-top: 8px;
    float: right;
    overflow: hidden;
}

.cardWindowSe a {
    position: absolute;
    top: 0;
    right: 0;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 20px;
    color: #333;
    z-index: 999;
}

.cardWindowR {
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    bottom: 10px;
    overflow: hidden;
}

/**  实时数据弹窗 **/
.echartsAdmin {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 20px;
}

/** 轨迹类型 **/
.locusAdmin {
    position: relative;
    width: 100%;
    height: 100%;
}

.locus-select {
    position: relative;
    float: left;
    width: 60px;
    height: 34px;
}

/** 图片类型 **/
.imgAdmin {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);
    background-repeat: repeat;
    padding: 10px;
    overflow: hidden;
}

.imgAdmin img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.imgAdmin-con {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.imgAdmin-con thead {
    background-color: #f2f2f2;
}

.imgAdmin-con td {
    text-align: center;
    padding: 10px;
    border: 1px solid #e8ecf0;
    font-size: 14px;
}

.imgAdmin-con .imgAdmin-ICO {
    position: relative;
    display: inline-block;
    max-width: 50px;
    max-height: 50px;
    overflow: hidden;
}

.imgAdmin-con .imgAdmin-ICO img {
    width: 100%;
}

.imgAdmin-conPlus > .imgAdmin-row {
    width: 100%;
}

.imgAdmin-conPlus > .imgAdmin-row > .imgAdmin-ICO {
    height: auto;
}

.imgAdminL-ICO {
    position: relative;
    width: 200px;
    height: 200px;
    line-height: 200px;
    border: 1px solid #e6e6e6;
    text-align: center;
    margin: 10px 0;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);
    background-repeat: repeat;
    overflow: hidden;
}

.imgAdminL-ICO img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.ImgSwitch {
    position: relative;
    float: left;
    height: 50px;
    line-height: 50px;
    padding: 0 15px;
    font-size: 24px;
    color: #333;
}

.pull_img {
    max-width: 800px;
}

/** 历史数据弹窗  **/
.HistoryAdmincon {
    background-color: #e8ecf0;
}

.HistoryAdmin {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
}

.HistoryAdminHead {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    color: #333;
    border-bottom: 1px solid #e8ecf0;
}

.HistoryAdminL {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 400px;
    height: 400px;
    padding: 0 10px;
    background-color: #fff;
    overflow: hidden;
}

.HistoryAdminLH {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 400px;
    bottom: 10px;
    padding: 0 10px;
    background-color: #fff;
    overflow: hidden;
}

.HistoryAdminL-con {
    position: relative;
    width: 100%;
    padding: 20px 20px 0 20px;
    overflow: hidden;
}

.HistoryAdminL-list {
    position: relative;
    width: 100%;
    line-height: 50px;
    border-bottom: 1px solid #e8ecf0;
    overflow: hidden;
}

.HistoryAdminL-user {
    position: relative;
    width: 100%;
    border-bottom: 1px solid #e8ecf0;
    padding-bottom: 20px;
    overflow: hidden;
}

.HistoryAdminL-img {
    position: relative;
    float: left;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 1px solid #e8ecf0;
    overflow: hidden;
}

.HistoryAdminL-img img {
    width: 100%;
}

.HistoryAdminL-PD {
    position: relative;
    float: left;
    width: 260px;
    padding: 10px 0 10px 10px;
}

.HistoryAdminL-PD p {
    width: 100%;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.HistoryAdminL-P1 {
    color: #1694f3;
    font-size: 14px;
}

.HistoryAdminL-P2 {
    color: #666;
    font-size: 12px;
}

.HistoryAdminL-HD {
    position: relative;
    float: left;
    width: 120px;
    font-size: 14px;
    padding-left: 10px;
    font-weight: 700;
    color: #333;
}

.HistoryAdminL-RD {
    position: relative;
    float: left;
    width: 220px;
    font-size: 14px;
    color: #666;
    line-height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.HistoryAdminR {
    position: absolute;
    top: 10px;
    right: 10px;
    left: 420px;
    height: 400px;
    padding: 0 10px;
    background-color: #fff;
    overflow: hidden;
}

.HistoryAdminRH {
    position: absolute;
    top: 10px;
    right: 10px;
    left: 420px;
    bottom: 10px;
    padding: 0 10px;
    background-color: #fff;
    overflow: hidden;
}

.HistoryAdminR-butA {
    display: inline-block;
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
}

.HistoryAdminR-butB {
    border-bottom: 2px solid #1694f3;
    color: #1694f3;
}

.HistoryAdminR-dc {
    float: right;
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
    color: #1694f3;
}

.HistoryAdminR-con {
    position: absolute;
    top: 49px;
    bottom: 0;
    left: 10px;
    right: 10px;
    overflow: hidden;;
}

.HistoryAdminR-html {
    position: absolute;
    top: 0px;
    bottom: 50px;
    left: 0px;
    right: 0px;
    overflow: auto;
}

.RecordAdminR-con {
    position: absolute;
    top: 50px;
    left: 10px;
    right: 10px;
    bottom: 50px;
    overflow: auto;
}

.HistoryAdminRH-con {
    position: absolute;
    left: 0;
    top: 49px;
    right: 0;
    bottom: 50px;
    overflow-x: hidden;
    overflow-y: auto;
}

.HistoryAdminR-table {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.HistoryAdminR-table thead {
    background-color: #f2f2f2;
}

.HistoryAdminR-table td {
    text-align: center;
    padding: 10px;
    border: 1px solid #e8ecf0;
    font-size: 14px;
}

.HistoryAdminR-tabletd > .name {
    font-size: 14px;
    color: #666;
}

.HistoryAdminR-table td > .num {
    font-size: 18px;
    color: #333;
}

.HistoryAdminR-page {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background-color: #f2f2f2;
    padding: 0 10px;
    overflow: hidden;
}

.HistoryAdminB {
    position: absolute;
    top: 420px;
    right: 10px;
    left: 10px;
    bottom: 10px;
    min-height: 310px;
    padding: 0 10px;
    background-color: #fff;
    overflow: hidden;
}

.HistoryAdminB-Chart {
    position: absolute;
    top: 50px;
    right: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
}

.HistoryAdminPolice {
    position: absolute;
    top: 10px;
    right: 10px;
    left: 10px;
    bottom: 10px;
    padding: 0 10px;
    background-color: #fff;
    overflow: hidden;
}

/*** 视频类型弹窗 ***/
.Playback {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.Playback > video {
    width: 100%;
    height: 100%;
}

.PlaybackHead {
    position: relative;
    width: 100%;
    height: 50px;
    padding: 0 10px;
    line-height: 50px;
}

.Playback-con {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f2f2f2;
    overflow: hidden;
}

/** 数据下发 **/
.app-Lower .layui-layer-content {
    overflow: hidden !important;
}

.app-Lower-con {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    background-color: #333;
    color: #fff;
    padding: 10px;
    resize: none;
}

/**************************************************** 设备管理页面  ********************************************/
.app-manage-con {
    position: absolute;
    top: 50px;
    left: -20px;
    right: 0;
    bottom: 50px;
    padding: 0 0 0 20px;
    z-index: 999;
    overflow: auto;
}

.app-manage-tab {
    position: relative;
    min-width: 100%;
    float: left;
}

.app-manage-group {
    position: relative;
    width: 100%;
    float: left;
}

.app-manage-name {
    position: relative;
    height: 40px;
    line-height: 40px;
    padding: 0 16px;
    overflow: hidden;
}

.app-manage-Ncheck {
    float: left;
}

.app-manage-Ncheck .layui-form-checkbox i {
    top: 1px;
}

.app-manage-rename, .app-manage-delete, .app-manage-Default {
    float: left;
    padding: 0 10px;
    color: #1694f3;
}

.app-manage-ul {
    position: relative;
    width: 100%;
    min-height: 70px;
}

.app-manage-ul::after {
    position: absolute;
    content: '当前组下没有设备';
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    color: #999;
    font-size: 14px;
    background-color: #fff;
    border-bottom: 10px solid #efefef;
    z-index: 1;
}

.app-manage-list {
    position: relative;
    width: 100%;
    float: left;
    height: 70px;
    line-height: 60px;
    font-size: 14px;
    background-color: #fff;
    border-bottom: 10px solid #efefef;
    z-index: 2;
}

.app-manage-md50 {
    position: relative;
    width: 50px;
    text-align: center;
    float: left;
    z-index: 9;
}

.app-manage-md300 {
    position: relative;
    float: left;
    width: 200px;
    text-align: left;
    z-index: 9;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-manage-md230 {
    position: relative;
    width: 230px;
    text-align: left;
    float: left;
    z-index: 9;
    padding-left: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-manage-md250 {
    position: relative;
    width: 230px;
    text-align: left;
    float: left;
    z-index: 9;
    padding: 10px 0 10px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-manage-md250 .app-manage-p {
    line-height: 20px;
    font-size: 12px;
}

.app-manage-md250 .app-manage-copy {
    font-size: 14px;
}

.app-manage-mdauto {
    position: relative;
    width: 100%;
    padding-left: 790px;
    text-align: right;
    white-space: nowrap;
    text-overflow: ellipsis;
    z-index: 1;
}

.app-manage-img {
    position: relative;
    width: 46px;
    height: 46px;
    line-height: 40px;
    border-radius: 50%;
    padding: 3px;
    margin: 7px auto auto auto;
    overflow: hidden;
}

.app-manage-images {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
}

.app-manage-images img,
.app-manage-img img {
    width: 100%;
    vertical-align: bottom;
}

.app-manage-p {
    color: #666;
}

.app-manage-copy span {
    cursor: pointer;
}

.app-manage-tdBut {
    display: inline-block;
    font-size: 14px;
    color: #1694f3;
    padding: 0 5px;
}

.app-manage-move {
    display: inline-block;
    width: 60px;
    text-align: center;
    font-size: 16px;
    color: #1694f3;
    padding-right: 20px;
    cursor: move;
}

.app-manage-page {
    position: relative;
    width: auto;
    height: 50px;
}

.MicroChapter {
    position: absolute;
    left: -4px;
    top: 1px;
    background-color: #ff9574;
    height: 16px;
    line-height: 15px;
    font-size: 10px;
    color: #fff;
    padding: 0 8px;
    text-align: center;
    border-radius: 10px 10px 10px 0;
    background-image: -moz-linear-gradient(left, #c2c2c2 20%, #868686);
    background-image: -ms-linear-gradient(left, #c2c2c2 20%, #868686);
    background-image: -webkit-linear-gradient(left, #c2c2c2 20%, #868686);
    background-image: linear-gradient(left, #c2c2c2 20%, #868686);
    box-shadow: 2px 2px 5px hsla(0, 0%, 60%, .4);
    z-index: 999;
}

.MicroChapter i {
    font-size: 12px;
    transform: scale(0.8);
    display: inline-block;
}

.MicroChapter::before {
    content: "";
    width: 4px;
    height: 10px;
    background-color: #c2c2c2;
    position: absolute;
    left: 0;
    top: 7px;
}

.MicroChapter::after {
    content: "";
    width: 4px;
    height: 8px;
    border-radius: 8px 0 0 8px;
    background-color: #868686;
    position: absolute;
    top: 14px;
    left: 0;
}

/* 设备删除 */
.Deleted .sensorState, .Deleted .sensorState p {
    text-decoration: line-through;
    color: #b1b1b1 !important;
}

.Deleted .sensorState img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}

.Deleted .MicroChapter {
    background-image: -moz-linear-gradient(left, #476286 20%, #2F4056);
    background-image: -ms-linear-gradient(left, #476286 20%, #2F4056);
    background-image: -webkit-linear-gradient(left, #476286 20%, #2F4056);
    background-image: linear-gradient(left, #476286 20%, #2F4056);
    box-shadow: 2px 2px 5px rgba(233, 59, 61, .2);
}

.Deleted .MicroChapter::before {
    background-color: #476286;
}

.Deleted .MicroChapter::after {
    background-color: #2F4056;
}

/* 设备禁用 */
.Prohibit .MicroChapter {
    background-image: -moz-linear-gradient(left, #ff9574 20%, #e93b3d);
    background-image: -ms-linear-gradient(left, #ff9574 20%, #e93b3d);
    background-image: -webkit-linear-gradient(left, #ff9574 20%, #e93b3d);
    background-image: linear-gradient(left, #ff9574 20%, #e93b3d);
    box-shadow: 2px 2px 5px rgba(233, 59, 61, .2);
}

.Prohibit .MicroChapter::before {
    background-color: #ff9574;
}

.Prohibit .MicroChapter::after {
    background-color: #d02b2d;
}

.LifAban {
    position: absolute;
    top: 0;
    right: -20px;
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-size: 14px;
    color: #e93b3d;
}

/* 设备离线 */
.OffLine .sensorState, .OffLine .sensorState p {
    color: #b1b1b1 !important;
}

.OffLine .sensorState img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    filter: filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff, endColorstr=#19ffffff);
}

/* 设备报警 */
.police .sensorState, .police .sensorState p {
    color: #ff1100;
}

.police .app-manage-img:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    border-radius: 50%;
    border: 2px dotted #ff0000;
    animation: police 5s linear infinite;
}

@keyframes police {
    0% {
        -webkit-transform: rotate(0deg);
    }
    25% {
        -webkit-transform: rotate(90deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
    }
    75% {
        -webkit-transform: rotate(270deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

/************************************************************** 客服  ****************************************************/
.mall_url {
    position: fixed;
    top: 100px;
    right: 20px;
    width: 117px;
    z-index: 999999;
    overflow: hidden;
}

.mall_url img {
    width: 100%;
}

.app-Contact {
    position: fixed;
    top: 50px;
    right: -157px;
    bottom: 0;
    width: 160px;
    background-color: #eceaea;
    border-left: 3px solid #373d41;
    border-top: 1px solid #373d41;
    z-index: 99999;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    transition: all .3s;
}

.app-ContactL {
    right: 0;
}

.app-Contact-left {
    position: absolute;
    top: 50%;
    left: -40px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background-color: #373d41;
    border-radius: 5px;
    color: #ffffff;
    font-size: 20px;
}

.app-Contact-left:hover {
    color: #fff;
}

.app-ContactL > .app-Contact-left {
    background-color: #1694f3;
}

.app-Contact-con {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-Contact-title {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    font-size: 14px;
    text-align: center;
    color: rgb(94, 80, 80);
    border-bottom: 1px dashed #373d41;
}

.app-Contact-list {
    position: relative;
    width: 100%;
    padding: 0 10px;
    margin-top: 10px;
    overflow: hidden;
}

.app-Contact-list p {
    position: relative;
    width: 100%;
    color: #1694f3;
    font-size: 12px;
}

.app-Contact-new {
    position: relative;
    width: 100%;
    padding-left: 15px;
    margin-top: 5px;
    overflow: hidden;
}

.app-Contact-new span {
    background: none;
    display: inline-block;
    width: 0;
    height: 0;
    position: absolute;
    border-top: solid 12px #fff;
    border-left: solid 12px #eceaea;
    top: 0;
    left: 6px;
}

.app-Contact-new img {
    width: 100%;
}

.app-Contact-li {
    position: relative;
    width: 100%;
    padding: 5px 0;
    background-color: #fff;
    border-radius: 5px;
}

.app-Contact-li p {
    padding: 5px 0;
    text-align: center;
    font-size: 14px;
    color: #333;
}

.app-Contact-qq {
    position: relative;
    display: block;
    width: 100%;
    height: 40px;
    padding-left: 35px;
    line-height: 40px;
}

.app-Contact-qq-img {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 20px;
    height: 20px;
    line-height: 20px;
}

.app-Contact-qq-img img {
    width: 100%;
    vertical-align: bottom;
}

.app-Contact-top {
    margin-top: 20px;
}

/******************************************** 新建或编辑设备 ******************************/
.app-edit {
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 0 0 20px;
    z-index: 999;
    overflow: auto;
}

.app-edit-list {
    position: relative;
    float: left;
    width: 100%;
    min-width: 1000px;
    font-size: 14px;
    background-color: #fff;
    border-bottom: 10px solid #efefef;
}

.app-edit-name {
    position: relative;
    float: left;
    width: 100px;
    height: 60px;
    line-height: 60px;
    text-align: right;
    font-size: 14px;
    color: #333;
    padding: 0 10px;
    overflow: hidden;
}

.app-edit-itme {
    position: relative;
    width: 100%;
    padding-left: 120px;
}

.app-edit-se {
    position: relative;
    float: left;
    width: 360px;
    height: 34px;
    margin: 13px 0;
}

.app-edit-but {
    position: relative;
    float: left;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 20px;
    color: #1694f3;
    margin: 10px 0 10px 10px;
}

.app-mapping {
    position: relative;
    display: inline-block;
    margin: 10px 26px 5px 0;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 20px;
    color: #1694f3;
    vertical-align: bottom;
}

.app-edit-logo {
    position: relative;
    float: left;
    width: 40px;
    height: 40px;
    margin: 10px 0 10px 10px;
    border: 1px dashed #d7d7d7;
    border-radius: 5px;
}

.app-edit-logo img {
    width: 100%;
}

.app-edit-logo::after {
    content: '';
    position: absolute;
    bottom: -1px;
    right: -1px;
    width: 10px;
    height: 10px;
    background-image: url(../images/rDown.svg);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index: 999;
}

.app-edit-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    overflow: auto;
}

.app-edit-imgA {
    position: relative;
    float: left;
    width: 80px;
    height: 80px;
    margin: 10px 0 0 10px;
    border: 1px solid #fff;
}

.app-edit-imgA:hover {
    border: 1px solid #1694f3;
}

.app-edit-imgA img {
    width: 100%;
}

.app-edit-half {
    width: 175px;
}

.app-edit-link {
    position: relative;
    width: 100%;
    height: 50px;
    float: left;
}

.app-edit-link::after {
    content: '';
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 12px;
    color: #999;
    z-index: 1;
}

.app-edit-single, .app-edit-batch {
    position: relative;
    float: left;
    width: 175px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 14px;
    border-radius: 5px;
    margin: 13px 0;
}

.app-edit-single {
    background-color: #1694f3;
    color: #fff;
}

.app-edit-single:hover {
    color: #fff;
}

.app-edit-batch {
    border: 1px solid #1694f3;
    color: #1694f3;
    margin-left: 10px;
}

.app-edit-sensor {
    position: relative;
    float: left;
    width: 100%;
    padding: 5px 0;
    border-top: 1px solid #f2f2f2;
    z-index: 9;
}

.app-edit-row {
    position: relative;
    float: left;
    width: 100%;
    min-height: 34px;
    margin: 5px 0;
    background-color: #fff;
}

.app-edit-mdL {
    margin-left: 10px;
}

.app-edit-md1 {
    float: left;
    width: 175px;
}

.app-edit-md2 {
    float: left;
    width: 80px;
}

.app-edit-md3 {
    float: left;
    width: 34px;
}

.app-edit-mdAuto {
    position: absolute;
    left: 779px;
    right: 0;
    height: 34px;
}

.app-edit-cimg {
    float: left;
    width: 34px;
    height: 34px;
}

.app-edit-cimg img {
    width: 100%;
}

.app-edit-cdel {
    position: relative;
    float: left;
    width: 50px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 12px;
    color: #1694f3;
    border: 1px solid #1694f3;
    border-radius: 5px;
}

.app-edit-mapping {
    position: relative;
    float: left;
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 24px;
    margin-left: 10px;
    color: #333;
    transition: all .2s;
    -webkit-transition: all .2s;
}

.mapping {
    transform: rotate(-90deg);
}

.disabled {
    color: #C9C9C9 !important;
    cursor: not-allowed !important;
}

.disabled:hover {
    color: #C9C9C9 !important;
}

.app-edit-mappingHide {
    position: relative;
    float: left;
    width: 100%;
    margin: 10px 0 0 0;
    overflow: hidden;
}

.app-edit-mappingHide ul {
    position: relative;
    float: left;
    width: 865px;
    border: 1px solid #e6e6e6;
    background-color: #fafafa;
    border-radius: 5px;
    text-align: right;
    overflow: hidden;
}

.app-add-mapping,
.app-down-mapping {
    position: relative;
    display: inline-block;
    height: 24px;
    line-height: 24px;
    padding: 0 5px;
    font-size: 12px;
    border-radius: 5px;
    background-color: #1694f3;
    color: #fff;
    margin: 10px 10px 5px 0;
}

.app-add-mapping:hover,
.app-down-mapping:hover {
    color: #fff;
}

.app-add-mapping.disabled,
.app-down-mapping.disabled {
    background-color: #999;
}

.app-Receive-con {
    position: relative;
    width: 100%;
    min-height: 40px;
    margin-top: 5px;
    overflow: hidden;
}

.app-Receive-con::after {
    content: 'No mapping yet? Click Add mapping';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 12px;
    color: #999;
    z-index: 1;
}

.app-Receive-mapping {
    position: relative;
    width: 100%;
    border-top: 1px solid #e6e6e6;
    overflow: hidden;
}

.app-Receive-name {
    position: relative;
    float: left;
    width: 90px;
    line-height: 20px;
    padding: 10px 0 10px 20px;
    font-size: 14px;
    color: #666;
    text-align: left;
    background-color: #fafafa;
    z-index: 99;
}

.app-Receive-tdL {
    position: relative;
    float: left;
    width: 570px;
    line-height: 20px;
    padding: 10px 20px;
    font-size: 14px;
    color: #666;
    text-align: left;
    background-color: #fafafa;
    z-index: 99;
}

.app-Receive-tdR {
    position: relative;
    width: 200px;
    height: 40px;
    line-height: 40px;
    padding-right: 26px;
    float: right;
    text-align: right;
    background-color: #fafafa;
    z-index: 99;
}

.app-Receive-but {
    display: inline-block;
    color: #1694f3;
    padding-left: 10px;
    font-size: 12px;
}

/** 批量追加传感器 **/
.app-batch {
    position: relative;
    width: 100%;
    padding: 10px 30px;
    float: left;
}

.app-batch-list {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 20px;
}

.app-batch-name {
    position: relative;
    float: left;
    width: 80px;
    height: 34px;
    line-height: 34px;
    text-align: right;
}

.app-batch-name span {
    color: #ff0000;
    padding: 0 3px;
    font-size: 14px;
}

.app-batch-itme {
    position: relative;
    float: right;
    width: 300px;
}

.app-batch-In {
    position: relative;
    float: left;
    width: 170px;
}

.app-betch-Code {
    position: relative;
    float: right;
    width: 120px;
    height: 34px;
    line-height: 34px;
    font-size: 12px;
    text-align: center;
    color: #fff;
    background-color: #1694f3;
    border-radius: 3px;
}

.app-betch-Code:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-batch-itme select {
    width: 100%;
    height: 34px;
    line-height: 34px;
    border: 1px solid #e6e6e6;
    padding: 0 10px;
}

select:disabled {
    background-color: #e2e2e2;
    color: #ACA899;
    cursor: not-allowed !important;
}

.app-QRcode-top {
    margin-top: 43px;
}

.app-QRcode-txt {
    position: relative;
    width: 100%;
    height: 34px;
    line-height: 34px;
    font-size: 12px;
    color: #666;
    padding: 0 5px;
}

.app-QRcode-yes {
    color: #1694f3;
}

.app-QRcode {
    position: relative;
    float: right;
    width: 120px;
    height: 120px;
    overflow: hidden;
}

.app-QRcode img {
    width: 100%;
    height: 100%;
}

/* 添加映射弹窗 */
.app-Popup-mapping {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 30px 30px 10px 30px;
    overflow: hidden;
}

.app-Popup-select {
    position: relative;
    width: 100%;
}

.app-Popup-select select {
    width: 100%;
    height: 34px;
    line-height: 34px;
    border: 1px solid #e6e6e6;
}

.app-Popup-con {
    position: relative;
    width: 100%;
    float: left;
    margin-top: 20px;
}

.app-Popup-in {
    position: relative;
    width: 85px;
    float: left;
}

.app-Popup-Symbol {
    position: relative;
    width: 40px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    float: left;
}

.app-Popup-con6 {
    position: absolute;
    top: 80px;
    left: 30px;
    right: 0;
    bottom: 0px;
    overflow: auto;
}

.app-Popup-select6 {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-Popup-select6 select {
    float: left;
    width: 380px;
    height: 34px;
    line-height: 34px;
    border: 1px solid #e6e6e6;
}

.app-Popup-list {
    position: relative;
    width: 100%;
    margin-bottom: 10px;
    overflow: hidden;
}

.app-Popup-list > .app-Popup-in {
    width: 170px;
}

.app-Popup-del {
    float: left;
    width: 50px;
    height: 34px;
    line-height: 34px;
    margin-left: 10px;
    font-size: 16px;
    text-align: center;
}

.app-Popup-add {
    float: left;
    width: 50px;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    text-align: center;
    background-color: #1694f3;
    color: #fff;
    margin: 2px 0 2px 10px;
    border-radius: 5px;;
}

/** 地图搜索 **/
.app-map-search {
    position: absolute;
    top: 0;
    right: 0;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    z-index: 99;
    font-size: 16px;
}

.app-map-span {
    float: right;
    color: #666;
    line-height: 60px;
    font-size: 12px;
    margin-right: 20px;
}

.app-map-con {
    position: relative;
    width: 100%;
    height: 500px;
    margin-top: 10px;
    text-align: center;
    overflow: hidden;
}

/** 二级导航 **/
.app-twoMenu {
    position: absolute;
    top: 0;
    left: 0;
    width: 240px;
    bottom: 0;
    background-color: #fff;
    z-index: 999;
    border-right: 1px solid #ebebeb;
    overflow-x: hidden;
    overflow-y: auto;
}

.app-twoMenu-name {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    font-weight: 700;
    color: #666;
    border-bottom: 1px solid #E8ECF0;
    padding-left: 30px;
}

.app-twoMenu ul {
    margin: 0;
    padding: 0 0 20px 0;
}

.app-twoMenu-itme {
    position: relative;
    display: block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding-left: 30px;
    font-size: 14px;
    color: #333;
    overflow: hidden;
}

.app-twoMenu-itme:hover {
    background-color: #EAF6FE;
    color: #108CEE !important;
}

.app-twoMenu-area {
    padding-left: 27px;
    background-color: #EAF6FE;
    border-left: 3px solid #108CEE;
    color: #108CEE !important;
}

/** 二级内容区 **/
.app-towBody {
    position: absolute;
    top: 0;
    left: 250px;
    right: 0;
    bottom: 0;
    z-index: 99;
}

.app-towHead {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    line-height: 50px;
    background-color: #fff;
    z-index: 1001;
    border-bottom: 1px solid #E8ECF0;
}

.app-towHead > span {
    line-height: 50px;
    border-left: 2px solid #108CEE;
    padding: 0 10px;
}

.app-towConY {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    bottom: 50px;
    z-index: 999;
    background-color: #fff;
    overflow: auto;
}

.app-towConN {
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    bottom: 60px;
    z-index: 999;
    overflow: auto;
}

.app-towBot {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background-color: #fff;
    z-index: 999;
    padding: 0 20px 0 10px;
    border-top: 1px solid #E8ECF0;
}

/** 数据下载 **/
.app-down-row {
    position: absolute;
    top: 0;
    left: 0;
    right: 330px;
    bottom: 0;
    background-color: #fff;
    box-shadow: 0px 0px 2px rgba(0, 0, 0, .05);
    overflow: auto;
}

.app-down-table {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-down-table td, .app-down-table th {
    padding: 10px 10px;
    border-bottom: 1px solid #f6f7fb;
    font-size: 14px;
}

.app-down-table th {
    background-color: #f5f5f5;
    border-bottom: 0;
}

.app-down-table td:first-child {
    width: 50px;
}

.app-down-form {
    position: absolute;
    top: 0;
    right: 20px;
    width: 300px;
    min-height: 200px;
    max-height: 100%;
    background-color: #fff;
    border-radius: 5px;
}

.app-down-title {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    font-weight: 700;
    padding-left: 10px;
    border-left: 3px solid #108CEE;
    border-bottom: 1px solid #E8ECF0;
}

.app-down-con {
    position: relative;
    width: 100%;
    padding: 20px 10px;
    float: left;
}

.app-down-li {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    color: #333;
}

.app-down-LH {
    position: relative;
    width: 80px;
    text-align: right;
    padding: 0 10px 0 0;
    float: left;
}

.app-down-RH {
    position: relative;
    width: 190px;
    height: 34px;
    line-height: 34px;
    margin: 8px 0;
    float: left;
}

.app-down-lijz {
    position: relative;
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    padding-left: 80px;
    color: #333;
}

.app-down-but {
    position: absolute;
    left: 0;
    bottom: -40px;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    background-color: #1694f3;
}

.app-down-but:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-down-check {
    position: relative;
    width: auto;
    height: 50px;
    line-height: 50px;
}

.app-down-check .layui-form-checkbox i {
    top: 1px;
}

.app-download-xia {
    position: relative;
    display: inline-block;
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 5px;
    background-color: #1694f3;
    color: #fff;
    margin: 0 5px;
}

.app-download-xia:hover {
    color: #fff;
}

.app-download-xia.disabled {
    background-color: #999;
}

.app-download-del {
    position: relative;
    display: inline-block;
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 5px;
    border: 1px solid #1694f3;
    color: #1694f3;
    margin: 0 5px;
}

/*********************************  用户中心 ******************************************/
.app-userHead {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background-color: #fff;
    padding: 0 10px 0 0;
    border-bottom: 1px solid #E8ECF0;
    z-index: 1001;
}

.app-userHead > span {
    line-height: 50px;
    border-left: 2px solid #108CEE;
    padding: 0 10px;
}

.app-userHeadLink {
    position: relative;
    float: left;
    height: 50px;
    line-height: 50px;
    padding: 0 15px;
}

.app-userHeadLink > .layui-badge {
    transform: scale(0.86);
}

.app-userHeadLinkThis {
    border-bottom: 1px solid #108CEE;
    color: #108CEE !important;
}

.app-user {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    overflow: auto;
}

.app-user-list {
    position: relative;
    width: 100%;
    padding: 0 20px;
    overflow: hidden;
}

.app-user-name {
    position: relative;
    width: 100%;
    padding: 20px 0;
    border-bottom: 1px solid #DDD;
    overflow: hidden;
}

.app-user-name .userImg {
    position: relative;
    float: left;
    width: 120px;
    height: 120px;
}

.app-user-name .userImg img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
}

.app-user-name .userInfo {
    padding: 0 0 0 150px;
}

.app-user-name .userInfo li {
    margin-bottom: 8px;
    font-size: 14px;
    color: #333;
}

.app-user-name .userInfo p {
    float: left;
    width: 70px;
}

.app-user-name .userInfo li a i {
    margin-left: 5px;
    color: #108CEE;
}

.app-user-ul {
    position: relative;
    width: 100%;
    display: table;
    padding: 0 40px;
    overflow: hidden;
}

.app-user-ul li {
    display: table-row;
}

.app-user-ul li > div {
    padding: 30px 0;
    font-size: 14px;
    line-height: 20px;
    display: table-cell;
    border-bottom: 1px solid #DDD;
}

.app-user-LD {
    width: 120px;
}

.app-user-CD {
    font-size: 13px !important;
    color: #666;
}

.app-user-CD span {
    color: #090;
    padding: 0 5px;
}

.app-user-RD {
    width: 150px;
    text-align: right;
}

.app-user-RD i {
    font-size: 22px !important;
    vertical-align: sub;
}

.app-user-RD span {
    padding-right: 5px;
    border-right: 2px solid #ddd;
}

.app-user-RD a {
    padding-left: 5px;
    color: #108CEE !important;
    font-size: 13px;
}

.app-user-RDY span, .app-user-RDY i {
    color: #090;
    font-size: 13px;
}

.app-user-RDN span, .app-user-RDN i {
    color: #F90 !important;
    font-size: 13px
}

/** 略缩图上传 **/
.uploadmodalbody {
    position: relative;
    width: 100%;
    height: 600px;
    display: none;
}

.uploadmodalleft {
    position: relative;
    width: 900px;
    height: 600px;
    float: left;
    overflow: hidden;
}

.uploadmodalimg {
    position: relative;
    width: 900px;
    height: 500px;
    float: left;
    margin: 20px auto auto 20px;
    overflow: hidden;
}

#Cutting {

    max-width: 100%;
    display: none !important;
}

.upload-button {
    position: relative;
    float: left;
    margin-top: 20px;
    width: 900px;
    height: 40px;
    text-align: center;
}

.upload-itme {
    display: inline-block;
    height: 40px;
    margin: 0 10px;
    background-color: #007bff;
    border-radius: 5px;
    overflow: hidden;
}

.upload-but {
    position: relative;
    float: left;
    width: 40px;
    line-height: 40px;
    height: 40px;
    text-align: center;
    color: #fff;
    font-size: 18px;
}

.upload-but:hover {
    background-color: rgba(0, 0, 0, .1);
    color: #fff;
}

.uploadImg {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    padding: 0;
    opacity: 0;
    white-space: nowrap;
    border: 0;
    z-index: 999;
    cursor: pointer;
}

.uploadImgNo {
    background-color: rgba(0, 0, 0, .2);
    color: #ACA899;
    cursor: not-allowed !important;
}

.uploadImgNo:hover {
    background-color: rgba(0, 0, 0, .2);
}

.uploadmodalright {
    position: relative;
    float: right;
    width: 240px;
    height: 600px;
    margin-right: 20px;
    overflow: hidden;
}

.uploadpreview {
    position: relative;
    float: left;
    width: 240px;
    height: 240px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC');
    overflow: hidden;
    margin-top: 20px;
}

#uploadpreview, #neWuploadpreview {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.upload-list {
    position: relative;
    width: 100%;
    float: left;
    overflow: hidden;
    margin-top: 20px;
}

.uploadLi {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.uploadLitxt {
    position: relative;
    width: 90px;
    height: 30px;
    line-height: 30px;
    float: left;
}

.uploadLiIn {
    position: relative;
    width: 140px;
    height: 30px;
    float: right;
}

.uploadLiInput {
    width: 100%;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border: 1px solid #d7d7d7;
}

.uploadDown {
    position: relative;
    display: block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    background-color: #007bff;
    border-radius: 5px;
    overflow: hidden;
}

.uploadDownB {
    background-color: #28a745;
}

/** 验证流程 **/
.app-proving {
    position: relative;
    max-width: 960px;
    min-width: 900px;
    width: 100%;
    padding: 0 30px;
    margin: 0 auto;
    overflow: hidden;
}

.app-proving-layout {
    position: relative;
    width: 100%;
    height: 50px;
    margin-top: 50px;
    overflow: hidden;
}

.app-proving-line {
    position: absolute;
    top: 11px;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #b9b9b9;
    z-index: 1;
}

.app-proving-row {
    position: relative;
    float: left;
    width: 33.333333%;
    height: 50px;
    z-index: 9;
}

.app-proving-step {
    position: relative;
    width: 80px;
    height: 50px;
    text-align: center;
    background-color: #fff;
}

.app-proving-step span {
    display: inline-block;
    width: 26px;
    height: 26px;
    line-height: 26px;
    text-align: center;
    font-size: 16px;
    color: #fff;
    background-color: #b9b9b9;
    border-radius: 50%;
}

.app-proving-step p {
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    color: #b9b9b9;
}

.app-proving-y span {
    background-color: #108CEE;
}

.app-proving-y p {
    color: #108CEE;;
}

.app-proving-left {
    float: left;
}

.app-proving-con {
    margin: 0 auto;
}

.app-proving-right {
    float: right;
}

.app-proving-title {
    position: relative;
    width: 100%;
    font-size: 14px;
    font-weight: 700;
    color: #6c6c6c;
    padding: 40px 0 0 0;
}

.app-proving-title p {
    width: 100px;
    float: left;
}

.app-proving-title span {
    color: #090;
}

.app-proving-li {
    position: relative;
    width: 100%;
    background-color: #fff;
    padding: 20px;
    border: 1px solid #e8e8e8;
    box-shadow: 1px 1px 1px #f4f4f4;
    margin-top: 20px;
    overflow: hidden;
}

.app-proving-li > .text {
    float: left;
    width: auto;
    max-width: 600px;
}

.app-proving-li > .text h3 {
    font-size: 16px;
    font-weight: 700;
    color: #6c6c6c;
    padding-bottom: 5px;
}

.app-proving-li > .text h3 span {
    padding-right: 10px;
}

.app-proving-li > .text p {
    font-size: 12px;
    color: #888;
}

.app-proving-li > .button {
    float: right;
    background-color: #108CEE;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    border-radius: 2px;
    padding: 5px 20px;
}

.app-proving-info {
    position: relative;
    width: 100%;
    border-top: 1px solid #e8e8e8;
    margin-top: 10px;
    padding: 20px 0 0 0;
    overflow: hidden;
}

.app-proving-info li {
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
}

.app-proving-info li > .name {
    float: left;
    width: 100px;
    text-align: right;
    color: #6c6c6c;
    font-size: 14px;
    overflow: hidden;
}

.app-proving-info li > .itme {
    float: left;
    width: 700px;
    padding-left: 20px;
    color: #6c6c6c;
    font-size: 14px;
}

.app-proving-info li > .itme > .se {
    position: relative;
    float: left;
    width: 200px;
    height: 34px;
    margin: 13px 0;
}

.app-proving-info li > .itme > .button {
    float: left;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
    color: #FF6A00;
    background: #FFF1E8;
    border: 1px solid #FF751A;
    padding: 0 15px;
    margin: 14px 0 0 10px;
    border-radius: 2px;
}

.app-proving-info li > .itme > .sub {
    position: relative;
    float: left;
    width: 200px;
    height: 34px;
    line-height: 34px;
    font-size: 14px;
    text-align: center;
    background-color: #108CEE;
    color: #fff;
    margin: 14px 0;
    border-radius: 2px;
}

.app-proving-info li > .itme > .back {
    float: left;
    margin-left: 10px;
    color: #9B9EA0;
    font-size: 12px;
}

.app-proving-finish {
    position: relative;
    width: 100%;
    border: 1px solid #E1E1CA;
    margin-top: 20px;
    padding: 20px;
    color: #666;
    font-size: 16px;
    overflow: hidden;
}

.app-proving-finish b {
    color: #108CEE;
    padding-right: 10px;
}

/** 基本信息 **/
.app-info {
    position: relative;
    width: 100%;
    float: left;
    min-width: 600px;
    padding: 0 20px;
}

.app-info > .title {
    position: relative;
    width: 100%;
    font-size: 14px;
    color: #333;
    padding: 20px 0 0 0;
    overflow: hidden;
}

.app-info > .list {
    position: relative;
    float: left;
    width: 100%;
    min-height: 50px;
    line-height: 50px;
    font-size: 12px;
    color: #666;
}

.app-info > .text {
    position: relative;
    float: left;
    width: 100%;
    padding: 5px 0 5px 130px;
    line-height: 20px;
    font-size: 12px;
    color: #666;
}

.app-info > .list > .name {
    float: left;
    width: 120px;
    text-align: right;
}

.app-info > .list > .name > span {
    color: #F00;
    padding-right: 2px;
    font-size: 14px;
    vertical-align: middle;
}

.app-info > .list > .itme {
    padding-left: 130px;
}

.app-info > .list > .itme > .se {
    position: relative;
    float: left;
    width: 300px;
    min-height: 34px;
    margin: 8px 0;
}

.app-info > .list > .itme > .text {
    position: relative;
    float: left;
    width: 100%;
    line-height: 20px;
    padding: 0 0 10px 0;
}

.app-info > .list > .itme > .se > textarea {
    position: relative;
    width: 100%;
    height: 74px;
    line-height: 18px;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
    padding: 10px;
    resize: none;
}

.app-info > .list > .itme > .sed {
    position: relative;
    float: left;
    width: 145px;
    height: 34px;
    margin: 8px 0;
}

.app-info > .list > .itme > .sel {
    margin-left: 10px;
}

.app-info > .list > .itme > .button {
    float: left;
    height: 30px;
    line-height: 30px;
    background-color: #108CEE;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    border-radius: 2px;
    padding: 0 30px;
    margin: 10px 0;
}

.app-info > .list > .itme > .button.disabled {
    background-color: #999;
}

/** 联系人列表 **/
.app-contacts {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    bottom: 50px;
    z-index: 999;
    background-color: #fff;
    overflow: auto;
}

.app-contactsTab {
    position: relative;
    width: 100%;
}

.app-contactsTab td {
    padding: 12px 5px;
    text-align: center;
    border-bottom: 1px solid #E8ECF0;
    font-size: 14px;
}

.app-contactsTab td:first-child {
    width: 50px;
}

.app-contactsTab tr:first-child {
    background-color: #f5f5f5;
}

.app-contactsTab-link {
    display: inline-block;
    color: #108CEE !important;
    padding: 0 15px;
}

.app-contactsTab-link:nth-last-child(even) {
    border-right: 1px solid #108CEE;
}

.app-contactsBom {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background-color: #fff;
    z-index: 999;
    padding: 0 10px;
    border-top: 1px solid #DDD;
}

.app-contacts-del {
    position: relative;
    float: left;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    margin: 10px 10px 0 0;
    border-radius: 5px;
    font-size: 12px;
    color: #fff;
    background-color: #1694f3;
}

.batchForm .layui-layer-content {
    overflow: visible !important;
}

.batchForm .app-batch {
    padding-bottom: 30px;
}

/** 站内消息 **/
.app-newsTable tr td {
    text-align: left;
}

.app-newsTable tr td:first-child {
    text-align: center;
}

.app-read td, .app-read td a {
    color: #999;
}

.app-newsTable tr td a:hover {
    color: #108CEE;
    text-decoration: underline;
}

.app-news-con {
    position: relative;
    width: 100%;
    padding: 20px;
    color: #666;
    overflow: hidden;
}

.app-news-title {
    position: relative;
    width: 100%;
    border-bottom: 1px solid #d7d7d7;
    overflow: hidden;
}

.app-news-title h2 {
    position: relative;
    width: 100%;
    font-size: 18px;
    font-weight: 700;
    color: #333;
    padding: 10px 0;
    text-align: center;
}

.app-news-title p {
    text-align: center;
    padding-bottom: 20px;
}

.app-news-body {
    position: relative;
    width: 100%;
    padding: 20px;
    line-height: 24px;
    color: #666;
    font-size: 14px;
    overflow: hidden;
}

.app-news-black {
    display: inline-block;
    border: 1px solid #BBB;
    color: #666;
    text-shadow: none;
    vertical-align: middle;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 3px;
}

/** 图表素材库 **/
.app-img {
    position: relative;
    width: 100%;
    padding: 10px;
    overflow: hidden;
}

.app-img-row {
    position: relative;
    float: left;
    width: 120px;
    margin: 10px;
    overflow: hidden;
}

.app-img-ico {
    position: relative;
    width: 120px;
    height: 120px;
    line-height: 120px;
    text-align: center;
    border: 1px solid #E8ECF0;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);
    background-repeat: repeat;
    overflow: hidden;
}

.app-img-ico:hover {
    border: 1px solid #108CEE;
}

.app-img-ico img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.app-img-txt {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding: 0 0 0 5px;
    border: 1px solid #E8ECF0;
    border-top: 0;
}

.app-img-hide {
    float: right;
    font-size: 16px;
    padding: 0 5px;
}

.app-img-del {
    float: right;
    font-size: 16px;
    padding: 0 5px;
}

.app-imguploadO {
    position: relative;
    float: left;
    height: 32px;
    line-height: 32px;
    padding: 0 15px;
    margin-top: 8px;
    border-radius: 2px;
    font-size: 12px;
    color: #fff;
    background-color: #1694f3;
    overflow: hidden;
}

.app-imguploadO input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
}

.app-imguploadO:hover {
    color: #fff;
    background-color: #1070b9;
}

/** 触发器 **/
.TriggeTab {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.TriggeTab > tbody tr th {
    font-size: 14px;
    padding: 15px 5px 5px 15px;
}

.TriggeTab > tbody tr td {
    background-color: #fff;
    font-size: 14px;
    color: #444;
    padding: 15px 5px 15px 15px;
    border-bottom: 1px solid #E8ECF0;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.TriggeTab > tbody tr td:first-of-type {
    text-align: left;
    width: 50px;
}

.TriggeTab > tbody tr .arc {
    text-align: left;
}

.TriggeTab > tbody .col {
    border-top: 10px solid #efefef;
}

.TriggeTab > tbody .col td {
    padding: 10px 5px 10px 15px !important;
    font-weight: 700;
    color: #333;
}

.app-Trigge-switch {
    display: inline-block;
    width: auto;
}

.app-Trigge-switch .layui-form-switch {
    margin: 0;
    height: 24px;
}

.app-Trigge-Contacts {
    position: relative;
    width: 100%;
    min-width: 300px;
    display: table;
}

.app-Trigge-Contacts > .row {
    display: table-row;
}

.app-Trigge-Contacts > .row > .title,
.app-Trigge-Contacts > .row > .list {
    display: table-cell;
    vertical-align: middle;
}

.app-Trigge-Contacts > .row > .title {
    position: relative;
    width: 60px;
    padding-right: 10px;
    text-align: right;
    font-size: 14px;
    border-right: 1px solid #373d41;
}

.app-Trigge-Contacts > .row > .title::after {
    content: "";
    position: absolute;
    top: 0;
    right: -6px;
    width: 6px;
    height: 1px;
    background-color: #373d41;
}

.app-Trigge-Contacts > .row > .title::before {
    content: "";
    position: absolute;
    bottom: 0;
    right: -6px;
    width: 6px;
    height: 1px;
    background-color: #373d41;
}

.app-Trigge-Contacts > .row > .title > .jiao {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -4px;
    height: 0px;
    width: 0px;
    border-top: 4px solid transparent;
    border-right: 5px solid black;
    border-bottom: 4px solid transparent;
}

.app-Trigge-Contacts > .row > .title > .jiao::after {
    content: '';
    position: absolute;
    top: -7px;
    left: 2px;
    border-top: 7px solid transparent;
    border-right: 12px solid #FFFFFF;
    border-bottom: 7px solid transparent;
}

.app-Trigge-Contacts > .row > .list {
    text-align: left;
    padding-left: 10px;
}

.app-Trigge-Contacts > .row > .list .li {
    height: 30px;
    line-height: 30px;
}

.app-Trigge-Contacts > .row > .list .li > .name {
    padding-right: 5px;
}

.app-Trigge-Contacts > .row > .list .li > .layui-badge {
    cursor: pointer;
}

.app-Trigge-up {
    position: relative;
    width: 100%;
    max-height: 150px;
    overflow: hidden;
}

.app-Trigge-down {
    max-height: none;
}

.app-Trigge-uSH {
    position: absolute;
    top: 0;
    left: 200px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 16px;
    transition: all .2s;
    -webkit-transition: all .2s;
    text-align: center;
    z-index: 9999;
}

.app-Trigge-dSH {
    transform: rotate(180deg);
}

.app-Trigge-yes {
    font-size: 24px;
    color: #FF5722;
}

.app-Trigge-no {
    font-size: 24px;
    color: #999;
}

/** 添加或新增触发器  **/
.app-Trigge-add {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    overflow: auto;
}

.add-Trigge-block {
    position: relative;
    width: 100%;
    float: left;
    padding: 20px 30px 30px 30px;
    border-bottom: 1px solid #E3E5EB;
}

.add-Trigge-block > .name {
    position: relative;
    width: 100%;
    padding-left: 15px;
    color: #333;
    font-size: 14px;
    line-height: 16px;
    border-left: 2px solid #108CEE;
    margin-bottom: 20px;
}

.add-Trigge-block > .list,
.add-Trigge-block > .hide .list {
    position: relative;
    width: 100%;
    margin: 10px 0;
    float: left;
}

.add-Trigge-block > .list > .name,
.add-Trigge-block > .hide .list > .name {
    position: relative;
    width: 100px;
    height: 34px;
    line-height: 34px;
    font-size: 13px;
    color: #333;
    float: left;
}

.add-Trigge-block > .list > .info,
.add-Trigge-block > .hide .list > .info {
    position: relative;
    width: 100%;
    padding-left: 100px;
}

.add-Trigge-block > .list > .info > .se,
.add-Trigge-block > .hide .list > .info > .se {
    position: relative;
    float: left;
    min-width: 340px;
    min-height: 34px;
}

.add-Trigge-block > .list > .info > .button {
    position: relative;
    float: left;
    height: 32px;
    line-height: 32px;
    padding: 0 50px;
    margin-top: 9px;
    border-radius: 2px;
    font-size: 12px;
    color: #fff;
    background-color: #1694f3;
}

.add-Trigge-Pattern {
    position: relative;
    float: left;
    width: 100%;
    height: 34px;
    line-height: 34px;
    color: #666;
    padding-left: 102px;
}

.add-Trigge-Pattern p {
    float: left;
}

.add-Trigge-Pattern span {
    padding: 0 5px;
    color: #000;
    font-weight: 700;
}

.add-Trigge-Pattern a {
    float: left;
    font-size: 20px;
    margin-left: 5px;
    color: #1694f3;
}

.app-conditionCon {
    position: relative;
    width: 100%;
    min-height: 100px;
    float: left;
}

.app-conditionTab {
    position: relative;
    min-width: 800px;
}

.app-conditionTab tr th,
.app-conditionTab tr td {
    background-color: #fff;
    height: 50px;
    text-align: left;
    border-bottom: 1px solid #E8ECF0;
}

.app-conditionTab tr td {
    height: 60px;
}

.app-conditionTab tr > .L10 {
    padding-left: 10px;
}

.app-conditionTab tr > .list {
    width: 210px;
    padding-right: 10px;
}

.app-conditionTab tr > .rule {
    width: 220px;
    padding-right: 10px;
}

.app-conditionTab tr > .rule > .ruleA {
    margin-left: 10px;
    width: 200px;
    float: left;
}

.app-conditionTab tr > .rule > .ruleB {
    margin-left: 10px;
    width: 95px;
    float: left;
}

.app-conditionTab tr > .rule > .ruleC {
    margin-left: 10px;
    width: 60px;
    float: left;
}

.app-conditionTab tr > .switch {
    width: 90px;
    padding: 0 10px;
}

.app-conditionTab tr > .template {
    width: 220px;
    padding: 0 10px;
}

.app-conditionTab tr > .operate {
    padding: 0 20px;
}

.app-conditionTab tr > .operate > .operateDel {
    position: relative;
    display: inline-block;
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 5px;
    border: 1px solid #1694f3;
    color: #1694f3;
}

#policeTemplate {
    font-size: 14px;
    margin-left: 5px;
    color: #1694f3;
}

.LiaisonMan {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.LiaisonManDiv {
    position: relative;
    float: left;
    margin: 10px 10px 0 0;
    width: auto;
    height: 50px;
    line-height: 50px;
    border: 1px solid #E8ECF0;
}

.LiaisonManDiv > .name {
    position: relative;
    float: left;
    width: 100px;
    text-align: center;
    border-right: 1px solid #E8ECF0;
    overflow: hidden;
}

.LiaisonManDiv > .list {
    position: relative;
    width: 360px;
    float: left;
    text-align: center;
    border-left: 0;
}

.LiaisonManDiv > .list > .LiaisonCheck {
    position: relative;
    float: left;
    text-align: center;
    width: 90px;
}

/********************************************************************** 链接协议 ********************************************************************/
/** 当前链接协议图标**/
.app-current {
    position: absolute;
    top: 0;
    right: 0;
    width: 26px;
    height: 26px;
    line-height: 26px;
    font-size: 26px;
    color: #1694f3;
    text-align: right;
    z-index: 999;
}

/** 协议内容区 **/
.app-Agreement {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 50px;
    background-color: #fff;
    overflow: auto;
}

.app-Agreement > .equipment {
    position: relative;
    width: 100%;
    padding: 30px 0;
    min-width: 1000px;
    overflow: hidden;
}

.app-Agreement > .equipment > .img {
    position: relative;
    float: left;
    width: 120px;
    height: 120px;
    line-height: 120px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);
    background-repeat: repeat;
    border: 1px solid #E8ECF0;
    overflow: hidden;
}

.app-Agreement > .equipment > .img img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.app-Agreement > .equipment > .info {
    padding-left: 140px;
}

.app-Agreement > .equipment > .info li {
    position: relative;
    display: block;
    width: 100%;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
}

.app-Agreement > .equipment > .info li > .Obtain,
.app-Agreement > .equipment > .info li > .copy,
.app-Agreement > .equipment > .info li > .edit {
    display: inline-block;
    font-size: 16px;
    margin-left: 5px;
    color: #108CEE;
}

.app-Agreement > .equipment > .info li > .Obtain {
    margin-left: 20px;
}

.app-Agreement > .equipment > .info li > .copy {
    font-size: 18px;
}

.app-Agreement > .equipment > .info > .Light {
    color: #666;
}

/** 协议标签内容区 **/
.app-Agreement > .treatyTap {
    width: 100%;
    min-width: 1000px;
    float: left;
    margin: 0;
}

.app-Agreement > .treatyTap > .layui-tab-title > .layui-this {
    color: #108CEE;
}

.app-Agreement > .treatyTap > .layui-tab-title > .layui-this:after {
    border-bottom: 2px solid #108CEE;
}

.app-Agreement-con {
    float: left;
    width: 100%;
    padding: 0 0 50px 0;
}

.app-Agreement-block {
    position: relative;
    float: left;
    width: 100%;
    padding-top: 30px;
}

.app-Agreement-block > .title {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    color: #333;
    font-weight: 700;
    border-bottom: 1px solid #E8ECF0;
}

.app-Agreement-block > .title > span {
    padding: 0 10px;
    border-left: 3px solid #108CEE;
}

.app-Agreement-block > .title > .titleIco {
    display: inline-block;
    padding: 0 10px;
    color: #1694f3;
    font-size: 16px;
}

.app-Agreement-list {
    position: relative;
    float: left;
    width: 100%;
}

.app-Agreement-name {
    position: relative;
    float: left;
    width: 100px;
    height: 50px;
    line-height: 50px;
    font-size: 12px;
    text-align: right;
    color: #666;
    z-index: 9;
}

.app-Agreement-name > .newsEject {
    position: relative;
    display: inline-block;
    color: #1694f3;
    font-size: 16px;
}

.app-Agreement-item {
    position: relative;
    width: 100%;
    padding-left: 120px;
}

.app-Agreement-update {
    position: relative;
    width: 100%;
    line-height: 20px;
    padding: 15px 0;
    font-size: 14px;
    color: #333;
}

.app-Agreement-edit {
    position: relative;
    width: 100%;
    min-height: 60px;
    border-radius: 5px;
    border-bottom: 1px solid #E8ECF0;
    padding: 0 0 30px 0;
    overflow: hidden;
}

/** 编辑协议标签样式  **/
.EditLabel {
    position: relative;
    display: inline-block;
    width: auto;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    border-radius: 5px;
    margin: 10px 10px 0 0;
    background-color: #f5f5f5;
    overflow: hidden;
}

.EditLabelW1 {
    width: 100px;
}

.EditLabelW2 {
    width: 155px;
}

.EditLabelW3 {
    width: 265px;
}

.EditLabel-head {
    border: 1px solid #009688;
    background-color: #009688;
    color: #fff;
}

.EditLabel-con {
    border: 1px solid #d7d7d7;
}

.EditLabel-foot {
    border: 1px solid #ff5c00;
    background-color: #ff5c00;
    color: #fff;
}

.EditLabel-head > .del,
.EditLabel-foot > .del {
    color: #fff;
}

.EditLabel-con > .del {
    color: #108CEE;
}

.EditLabel > .cutL {
    float: left;
    text-align: right;
    padding-right: 5px;
    width: 14px;
}

.EditLabel > .cutR {
    float: left;
    text-align: left;
    padding-left: 5px;
    width: 13px;
}

.EditLabel > .textL {
    float: left;
    width: 48px;
    font-size: 12px;
    cursor: move;
}

.EditLabel > .inputC {
    float: left;
    width: 55px;
    height: 26px;
    line-height: 26px;
    margin-top: 7px;
}

.EditLabel .inputC input {
    height: 26px;
    border: 1px solid #d7d7d7;
}

.EditLabel > .textR {
    float: left;
    width: 30px;
    text-align: left;
    padding-left: 5px;
}

.EditLabel > .del {
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    text-align: center;
    font-size: 14px;
}

.app-Agreement-select {
    position: relative;
    float: left;
    width: 200px;
    height: 34px;
    font-size: 12px;
    margin-top: 30px;
}

.app-Agreement-select > .layui-form-select {
    border: 1px solid #1694f3;
}

.app-Agreement-select .layui-input {
    height: 30px;
}

.app-Agreement-button {
    position: relative;
    float: left;
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    margin: 30px 0 0 15px;
    border-radius: 5px;
    background-color: #1694f3;
    color: #fff;
}

.app-Agreement-button:hover {
    color: #fff;
    background-color: #1070b9;
}

/** 单个添加设备协议 **/
.app-ProtocolLabel {
    float: left;
    height: 28px;
    line-height: 26px;
    text-align: center;
    background-color: #f2f2f2;
    font-size: 12px;
    color: #333;
    margin: 11px 10px 10px 0;
    border-radius: 3px;
    overflow: hidden;
}

.Label-head {
    background-color: #009688;
    color: #fff;
}

.Label-head:hover {
    background-color: #017167;
    color: #fff;
}

.Label-con {
    border: 1px solid #d7d7d7;
}

.Label-foot {
    background-color: #ff5c00;
    color: #fff;
}

.Label-foot:hover {
    background-color: #bd4705;
    color: #fff;
}

.LabelA {
    width: 80px;
}

.LabelB {
    width: 125px;
}

.app-ProtocolAdd {
    float: left;
    width: 80px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    background-color: #1694f3;
    font-size: 12px;
    color: #fff;
    margin: 11px 10px 10px 0;
    border-radius: 3px;
    overflow: hidden;
}

.app-ProtocolAdd:hover {
    color: #fff;
    background-color: #1070b9;
}

/** 批量添加设备协议  **/
.pl-ProtocolLabel {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 10px;
}

#NumberAgreement {
    width: 80px;
    height: 30px;
    margin-top: 10px;
}

.Receive-plAgreement {
    position: absolute;
    top: 220px;
    left: 30px;
    right: 30px;
    bottom: 10px;
    border-top: 1px solid #E8ECF0;
    overflow: auto;
}

/** 协议标签规则弹窗 **/
.ExplainAgreement {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 10px 30px 30px 50px;
    overflow: auto;
}

.ExplainAgreement h2 {
    position: relative;
    float: left;
    width: 100%;
    padding: 10px 0;
    font-size: 18px;
    overflow: hidden;
}

.ExplainAgreement h3 {
    position: relative;
    float: left;
    width: 100%;
    padding: 10px 0;
    font-size: 16px;
    overflow: hidden;
}

.ExplainAgreement p {
    position: relative;
    float: left;
    width: 100%;
    font-size: 14px;
    color: #4c4c4c;
    line-height: 24px;
    padding: 5px 0;
}

.ExplainAgreement .tabNEW {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ExplainAgreement .tabNEW tr th,
.ExplainAgreement .tabNEW tr td {
    font-size: 14px;
    padding: 10px 0 10px 20px;
    text-align: left;
    line-height: 22px;
    border: 1px solid #E8ECF0;
}

.ExplainAgreement .tabNEW tr th {
    background-color: #EAF6FE;
}

/** 收发指令窗口 **/
.instructPopupRB {
    bottom: 5px !important;
    right: 3px !important;
    left: auto !important;
    top: auto !important;
}

.instructWindow {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #f2f2f2;
    padding: 0 20px;
    overflow: hidden;
}

.instructWindow .head {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
}

.instructWindow .head > .headNew {
    display: inline-block;
    padding: 0 10px;
    color: #1694f3;
    font-size: 16px;
}

.instructWindow .head > .block {
    width: auto;
    float: right;
}

.instructWindow .head > .block > .radio {
    display: inline-block;
    width: auto;
    float: left;
}

.instructWindow .head > .block > .radio > .layui-form-radio {
    margin: 0 !important;
}

.instructWindow .head > .block > .radio > .layui-form-radio > i {
    font-size: 16px !important;
    margin-right: 5px;
}

.instructWindow .head > .block > .radio > .layui-form-radio > div {
    font-size: 12px !important;
}

.receiveWindow {
    position: absolute;
    top: 40px;
    right: 20px;
    left: 20px;
    bottom: 230px;
    background-color: #3F3F3F;
    border: 1px solid #000;
    overflow-x: hidden;
    overflow-y: auto;
}

.receiveWindow > .Dialog {
    position: relative;
    width: 100%;
    margin-top: 10px;
    overflow: hidden;
}

.receiveWindow > .Dialog > .DialogTxtL {
    position: relative;
    width: auto;
    max-width: 100%;
    min-width: 200px;
    background-color: #f2f2f2;
    padding: 8px 10px;
    float: left;
    font-size: 12px;
    border-radius: 6px;
    margin-left: 10px;
}

.receiveWindow > .Dialog > .DialogTxtL::after {
    content: '';
    position: absolute;
    top: 50%;
    left: -8px;
    margin-top: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid #f2f2f2;
}

.receiveWindow > .Dialog > .DialogTxtR {
    position: relative;
    width: auto;
    max-width: 100%;
    min-width: 200px;
    background-color: #f2f2f2;
    padding: 8px 10px;
    float: right;
    font-size: 12px;
    border-radius: 6px;
    margin-right: 10px;
}

.receiveWindow > .Dialog > .DialogTxtR::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -8px;
    margin-top: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 8px solid #f2f2f2;
}

.receiveWindow > .Dialog > .DialogReturn {
    border: 1px solid #1694f3;
}

.receiveWindow > .Dialog > .DialogReturn::after {
    border-right: 8px solid #1694f3;
}

.sendWindow {
    position: absolute;
    left: 20px;
    bottom: 0;
    right: 20px;
    height: 230px;
    overflow: hidden;
}

.sendWindow-con {
    position: relative;
    width: 100%;
    height: 140px;
    overflow: hidden;
}

.sendWindow-textarea {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    background-color: #3F3F3F;
    color: #fff;
    padding: 10px;
    resize: none;
}

.sendFoot {
    position: relative;
    width: 100%;
    height: 50px;
    overflow: hidden;
}

.sendFoot > .radio {
    float: left;
    width: auto;
    height: 34px;
    line-height: 34px;
}

.sendFoot > .radio .layui-form-checkbox {
    padding-left: 20px;
}

.sendFoot > .radio .layui-form-checkbox span {
    font-size: 12px;
    padding-right: 10px;
}

.sendFoot > .radio .layui-form-checkbox[lay-skin=primary] i {
    top: 2px;
    width: 14px;
    height: 14px;
    line-height: 14px;
}

.sendFoot > .cycle {
    float: left;
    width: 40px;
    height: 34px;
}

.sendFoot > .cycle > input {
    padding: 0;
    margin-top: 7px;
    height: 24px;
    line-height: 24px;
    border: 1px solid #d7d7d7;
    text-align: center;
}

.sendFoot > .cycleExplain {
    float: left;
    font-size: 12px;
    height: 34px;
    line-height: 39px;
    padding-left: 5px;
}

.sendFoot > .sendButton {
    position: relative;
    float: right;
    padding: 0 30px;
    height: 30px;
    line-height: 30px;
    background-color: #3f3f3f;
    color: #fff;
    font-size: 12px;
    border-radius: 3px;
    margin-top: 5px;
}

/****************************************************** 链接协议传感器区域 ************************************************************/
/** TCP **/
.sensorAgreement {
    position: relative;
    width: 100%;
    padding: 10px 0 30px 0;
    background-color: #efefef;
    border-top: 1px solid #d0d0d0;
    overflow: hidden;
}

.sensorAgreement > .block {
    position: relative;
    float: left;
    width: 240px;
    background-color: #fff;
    margin: 20px 0 0 20px;
    padding: 0 0 10px 0;
    overflow: hidden;
}

.sensorAgreement > .block > .Img {
    position: relative;
    width: 120px;
    height: 120px;
    line-height: 120px;
    text-align: center;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);
    background-repeat: repeat;
    border: 1px solid #E8ECF0;
    margin: 10px auto auto auto;
    overflow: hidden;
}

.sensorAgreement > .block > .Img img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.sensorAgreement > .block > .name {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    text-align: center;
    padding: 0 10px;
    border-bottom: 1px solid #E8ECF0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.sensorAgreement > .block > .list {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    padding: 0 10px;
    overflow: hidden;
}

.sensorAgreement > .block > .list > .radio {
    display: inline-block;
    width: auto;
}

.sensorAgreement > .block > .list > .radio > .layui-form-radio {
    margin: 0 !important;
}

.sensorAgreement > .block > .list > .radio > .layui-form-radio i {
    font-size: 16px !important;
    margin-right: 5px;
}

.sensorAgreement > .block > .list > .radio > .layui-form-radio div {
    font-size: 12px !important;
}

.sensorAgreement > .block > .list > .input {
    float: left;
    width: 160px;
    margin-top: 5px;
}

.sensorAgreement > .block > .list > .input input {
    border: 1px solid #108CEE;
    height: 30px;
    border-radius: 0;
}

.sensorAgreement > .block > .list > .button {
    position: relative;
    float: left;
    width: 60px;
    height: 30px;
    line-height: 30px;
    background-color: #108CEE;
    color: #fff;
    font-size: 12px;
    text-align: center;
    margin-top: 5px;
}

/** 开关类型 **/
.sensorAgreement > .switchBlock > .Img {
    width: 80px;
    height: 80px;
    line-height: 80px
}

.sensorAgreement > .switchBlock > .list > .name {
    position: relative;
    float: left;
    width: 60px;
    height: 30px;
    line-height: 30px;
    color: #333;
    font-size: 12px;
    text-align: left;
    font-weight: 700;
    margin-top: 5px;
}

.sensorAgreement > .switchBlock > .list > .input {
    width: 100px;
}

/** HTTP **/
.sensorAgreement > .block > .Only {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    text-align: center;
    padding: 0 10px;
    color: #333;
    border-bottom: 1px solid #E8ECF0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.sensorAgreement > .block > .Only span {
    padding-left: 5px;
    cursor: pointer;
}

.settingLinks,
.settingImg {
    position: relative;
    display: block;
    width: 100%;
    height: 30px;
    line-height: 30px;
    background-color: #108CEE;
    color: #fff;
    font-size: 12px;
    text-align: center;
    margin-top: 5px;
    border-radius: 1px;
    overflow: hidden;
}

.settingLinks:hover,
.settingImg:hover {
    color: #fff;
    background-color: #1070b9;
}

.httpWidow {
    padding: 20px 30px;
}

.httpWidow > .title {
    float: left;
    margin-bottom: 20px;
}

.httpWidow > .app-Agreement-list > .app-Agreement-item {
    padding: 7px 0 7px 120px;
}

/** MBRTU **/
.mbrtuWindow {
    bottom: 0;
}

.mbrtuImg {
    position: relative;
    width: 160px;
    height: 160px;
    padding: 30px;
    background-repeat: repeat;
    margin: 10px auto auto auto;
    overflow: hidden;
}

.mbrtuImg img {
    width: 100%;
    height: 100%;
}

.mbrtuInstructions {
    position: relative;
    width: 100%;
    padding: 20px;
    float: left;
}

.mbrtuTab {
    position: relative;
    width: 100%;
}

.mbrtuTab tr > th,
.mbrtuTab tr > td {
    font-size: 12px;
    padding: 10px 5px;
    text-align: left;
    line-height: 22px;
    border: 1px solid #E8ECF0;
}

.mbrtuTab tr > th {
    text-align: center;
    background-color: #EAF6FE;
}

.mbrtuTab tr > .txt {
    text-align: center;
}

.mbrtuTab tr > .one {
    width: 90px;
}

.mbrtuTab tr > .two {
    width: 160px;
}

/**  MQTT **/
.mqttRead {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 12px;
    padding: 0 10px;
    border-bottom: 1px solid #E8ECF0;
    overflow: hidden;
}

.mqttRead span {
    float: left;
    width: 60px;
}

.mqttRead .input {
    float: left;
    width: 160px;
    margin-top: 10px;
}

.mqttRead .input input {
    height: 30px;
}

.mqttImg {
    position: relative;
    width: 160px;
    height: 260px;
    line-height: 200px;
    padding: 30px;
    background-repeat: repeat;
    margin: 10px auto auto auto;
    overflow: hidden;
}

.mqttImg img {
    display: inline-block;
    width: 100%;
}

.mqttTab {
    position: relative;
    width: 100%;
}

.mqttTab tr > th,
.mqttTab tr > td {
    font-size: 12px;
    padding: 10px 5px;
    text-align: center;
    line-height: 22px;
    border: 1px solid #E8ECF0;
}

.mqttTab tr > th {
    background-color: #EAF6FE;
}

.mqttTab tr > .one {
    width: 240px;
}

.mqttTab tr > .del {
    width: 50px;
}

.mqttDel {
    color: #108CEE;
    font-size: 16px;
}

.mqtCheckbox {
    display: inline-block;
    font-weight: 400;
}

.generateExample {
    display: inline-block;
    padding: 0 15px;
    height: 26px;
    line-height: 26px;
    font-size: 12px;
    margin-left: 10px;
    border-radius: 3px;
    background-color: #1694f3;
    color: #fff;
    font-weight: 400;
}

.generateExample:hover {
    color: #fff;
    background-color: #1070b9;
}

#codeSL {
    height: 100%;
    margin: 0;
    overflow: auto;
}

#codeCon {
    overflow: hidden;
}

/** coap  **/
.coapImg {
    position: relative;
    width: 160px;
    height: 210px;
    line-height: 170px;
    padding: 30px;
    background-repeat: repeat;
    margin: 10px auto auto auto;
    overflow: hidden;
}

.coapImg img {
    display: inline-block;
    width: 100%;
}

/** nbiot  **/
.nbiotIn {
    position: relative;
    width: 260px;
    height: 30px;
    margin-top: 10px;
}

.nbiotIn input {
    height: 30px;
    font-size: 12px;
}

.app-nbiot-table {
    position: relative;
    width: 100%;
    margin: 3px 0;
    overflow: hidden;
}

.app-nbiot-table tr td {
    padding: 10px 0;
    line-height: 20px;
    color: #333;
    border-bottom: 1px solid #E8ECF0;
    font-size: 14px;
}

.nbiotTr td {
    color: #1694f3 !important;
}

.app-nbiot-button {
    position: relative;
    float: left;
    padding: 0 5px;
    height: 26px;
    line-height: 26px;
    font-size: 12px;
    border-radius: 5px;
    margin: 0 5px;
    background-color: #1694f3;
    color: #fff;
}

.app-nbiot-button:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-Agreement-button.disabled {
    background-color: #777777;
}

/** 定时任务 **/
.taskRound {
    display: inline-block;
    width: 22px;
    height: 22px;
    line-height: 20px;
    text-align: center;
    border: 1px solid #2196f3;
    color: #2196f3;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
}

.taskPopup {
    position: relative;
    width: 100%;
    padding: 10px 30px;
}

.taskPopup-list {
    position: relative;
    width: 100%;
    float: left;
}

.taskPopup-name {
    position: relative;
    float: left;
    width: 80px;
    height: 50px;
    line-height: 50px;
    text-align: right;
}

.taskPopup-block {
    position: relative;
    padding-left: 100px;
    line-height: 50px;
}

.taskPopup-In {
    padding: 8px 0;
}

.taskPopup-date {
    position: relative;
    width: 100%;
    line-height: 30px;
    padding: 10px 0 0 0;
}

.taskPopup-time {
    position: relative;
    float: left;
    width: 33.333333%;
    height: 50px;
}

.taskPopup-time > .name {
    position: absolute;
    top: 0;
    right: 0;
    width: 25px;
    height: 50px;
    line-height: 50px;
    text-align: center;
}

.taskPopup-time > .In {
    position: relative;
    width: 100%;
    padding: 8px 25px 8px 0;
}

.taskAdd-list {
    position: relative;
    float: left;
    width: 100%;
    min-height: 34px;
    line-height: 34px;
}

.taskAdd-se {
    position: relative;
    float: left;
    width: 340px;
    min-height: 34px;
}

.taskAdd-time {
    position: relative;
    float: left;
    width: 33.333333%;
    height: 34px;
}

.taskAdd-time > .name {
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 34px;
    line-height: 34px;
    text-align: center;
}

.taskAdd-time > .In {
    position: relative;
    width: 100%;
    padding: 0 30px 0 0;
}

/** 萤石云 **/
.app-ysTable {
    position: relative;
    width: 100%;
    min-width: 1100px;
}

.app-ysTable tr th,
.app-ysTable tr td {
    padding: 12px 10px;
    text-align: center;
    border: 1px solid #E8ECF0;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-ysTable tr th {
    background-color: #f5f5f5;
    font-weight: 400;
}

.app-ysTable tr td:first-child {
    width: 50px;
}

/*** 地图 ***/
.app-map {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: hidden;
}

.app-search-map {
    position: absolute;
    top: 40px;
    left: 40px;
    width: 370px;
    height: 40px;
    background-color: #fff;
    border-radius: 1px;
    box-shadow: 1px 2px 1px rgba(0, 0, 0, .15);
    z-index: 99;
}

.app-search-mapIn {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding: 0 90px 0 50px;
    border: 0;
    font-size: 14px;
}

.app-group-map {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    color: #1694f3;
    background-color: #fff;
    text-align: center;
    z-index: 99;
}

.app-group-map:hover {
    color: #127ac7;
}

.app-group-Close {
    position: absolute;
    top: 0;
    right: 50px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 24px;
    color: #666666;
    background-color: #fff;
    text-align: center;
    border-left: 1px solid #eee;
}

.app-group-search {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    color: #fff;
    background-color: #1694f3;
    text-align: center;
    box-shadow: 1px 2px 1px rgba(0, 0, 0, .15);
    overflow: hidden;
}

.app-group-search:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-group-search.disabled {
    background-color: #777777;
}

.app-search-Popup {
    position: absolute;
    top: 45px;
    left: 0;
    width: 320px;
    min-height: 300px;
    max-height: 540px;
    background-color: #fff;
    box-shadow: 1px 2px 1px rgba(0, 0, 0, .15);
    overflow: auto;
}

.app-search-div {
    position: relative;
    width: 100%;
    min-height: 260px;
    max-height: 500px;
    overflow: auto;
}

.app-search-li {
    position: relative;
    display: block;
    width: 100%;
    line-height: 45px;
    *zoom: 1;
    border-bottom: 1px solid #E8ECF0;
    vertical-align: middle;
}

.app-search-itme {
    position: relative;
    width: 100%;
    height: 45px;
    line-height: 45px;
}

.app-search-itme i {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 45px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    font-size: 18px;
    color: #1694f3;
    transition: all .2s;
    -webkit-transition: all .2s;
    z-index: 999;
    cursor: pointer;
}

.app-search-itme a {
    position: relative;
    width: 100%;
    height: 45px;
    line-height: 45px;
    display: block;
    padding: 0 75px 0 50px;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-search-itme span {
    position: absolute;
    top: 0;
    right: 10px;
    color: #a0a0a0;
}

/** 分组下设备  **/
.app-search-child {
    position: relative;
    width: 100%;
    min-height: 40px;
    overflow: hidden;
    display: none;
}

.app-search-child:after {
    position: absolute;
    left: 0;
    top: 0;
    content: '当前组下暂无设备';
    width: 100%;
    height: 40px;
    line-height: 40px;
    color: #c3c3c3;
    text-align: center;
    z-index: 99999;
    z-index: 0;
}

/** 分组下设备  **/
.app-search-child {
    position: relative;
    width: 100%;
    min-height: 40px;
    overflow: hidden;
    display: none;
}

.app-search-child:after {
    position: absolute;
    left: 0;
    top: 0;
    content: '当前组下暂无设备';
    width: 100%;
    height: 40px;
    line-height: 40px;
    color: #c3c3c3;
    text-align: center;
    z-index: 9;
}

.app-search-child a {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    background-color: #f6f7fb;
    display: block;
    padding: 0 20px 0 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: 999;
    white-space: nowrap;
}

.app-search-child a:hover {
    background-color: #1694f3;
    color: #fff;
}
.app-search-eqp {
    position: relative;
    width: 100%;
    height: 40px;
    z-index: 9;
    background-color: #f6f7fb;
    overflow: hidden;
}

.app-search-eqp a {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    display: block;
    padding: 0 20px 0 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
}

.app-search-eqp a:hover {
    background-color: #eaf6fe;
}

.Open > .app-search-itme i {
    transform: rotate(90deg);
}

.Open > .app-search-child {
    display: block;
}

.app-search-manage {
    position: relative;
    float: left;
    width: 50%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #1694f3;
    text-align: center;
    border-top: 1px solid #d7d7d7;
    margin-top: -1px;
    z-index: 99;
    overflow: hidden;
}

.app-search-manage:first-of-type::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 0;
    bottom: 10px;
    width: 1px;
    background-color: #d7d7d7;
    z-index: 99;
}

.app-Result-search {
    position: relative;
    width: 100%;
    padding: 0 20px;
    overflow: hidden;
}

.app-Result-search-eqp {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    border-bottom: 1px solid #E8ECF0;
}

.app-map-Full {
    right: -60px
}

.app-map-NoFull {
    right: -120px;
}

.app-body-Full {
    top: 0;
    left: 0;
    z-index: 999;
}

/** 地图弹窗 **/
.infoBox {
    width: 260px;
    height: 158px;
    border-radius: 3px;
    background-color: #fff;
    box-shadow: 1px 2px 1px rgba(0, 0, 0, .15);
    margin-bottom: 24px;
}

.infoBox img {
    position: absolute !important;
    top: 4px !important;
    right: 4px !important;
    width: 20px;
    height: 20px;
    z-index: 999;
}

.infoBoxContent {
    position: relative;
    width: 300px;
    padding: 10px 0 0 0;
    overflow: hidden;
}

.infoBoxContent > .name {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    font-weight: 700;
    color: #333;
    border-bottom: 1px solid #eee;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.infoBoxContent > .list {
    position: relative;
    width: 100%;
    height: 24px;
    line-height: 24px;
    font-size: 14px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.infoBoxContent > .bottom {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    border-top: 1px solid #eee;
    margin-top: 10px;
    overflow: hidden;
}

.infoBoxContent > .bottom a {
    float: left;
    width: 33.333333%;
    color: #1694f3;
    text-align: center;
}

/** 地图实时数据弹窗 **/
.Realwindow {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 50px;
}

.Realwindow-title {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding: 0 20px;
    font-size: 14px;
    color: #333;
    font-weight: 700;
    background-color: #f2f2f2;
    overflow: hidden;
}

.Realwindow-con {
    position: absolute;
    top: 50px;
    left: 20px;
    right: 20px;
    bottom: 0;
    overflow: auto;
}

.Realwindow-table {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.Realwindow-table tr th,
.Realwindow-table tr td {
    padding: 8px 5px;
    text-align: center;
    border-bottom: 1px solid #E8ECF0;
    font-size: 14px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.Realwindow-table tr th {
    background-color: #f2f2f2;
}

.Realwindow-table tr td .Img {
    position: relative;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    overflow: hidden;
}

.Realwindow-table tr td .Img img {
    display: inline-block;
    max-height: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    vertical-align: sub;
}

.Realwindow-table tr td .state {
    color: #5FB878;
}

.Realwindow-table tr td .value {
    font-size: 18px;
    font-weight: 700;
}

.Realwindow-table tr td:first-child {
    width: 50px;
}

.RealPolice .text {
    color: #f44336;
}

.RealOffline .Img img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    filter: filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff, endColorstr=#19ffffff);
}

.RealOffline .text,
.RealOffline .state,
.RealOffline .date,
.RealOffline .value {
    color: #b1b1b1 !important
}

.Realwindow-foot {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50px;
    padding: 0 10px;
    background-color: #f2f2f2;
    overflow: hidden;
}

/** 地图历史数据 **/
.mapHistory-select {
    position: absolute;
    top: 10px;
    left: 20px;
    width: 300px;
    height: 34px;
    background-color: #fff;
    z-index: 9999;
}

.mapHistory-body {
    position: absolute;
    top: 54px;
    left: 20px;
    right: 20px;
    bottom: 10px;
    overflow: hidden;
}

.mapHistoryHead {
    background-color: #f2f2f2;
}

.mapHistory-top {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 400px;
    background-color: #fff;
    overflow: hidden;
}

.mapHistory-con {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 50px;
    overflow: auto;
}

.mapHistory-table {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.mapHistory-table tr th,
.mapHistory-table tr td {
    padding: 8px 5px;
    text-align: center;
    border-bottom: 1px solid #E8ECF0;
    font-size: 14px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mapHistory-bom {
    position: absolute;
    top: 410px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    overflow: hidden;
}

.mapHistory-Chart {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    overflow: hidden;
}
.mapHistory-view {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

.mapHistory-string .mapHistory-top {
    height: 100%;
}

.mapHistory-view .videoHisTrail {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    overflow: hidden;
}
/***  云组态 ***/
.app-compose {

}

.app-compose-itme {
    position: relative;
    width: 240px;
    float: left;
    border-radius: 1px;
    border: 1px solid #d7d7d7;
    margin: 10px 0 0 10px;
    overflow: hidden;
}

.app-compose-img {
    position: relative;
    display: block;
    width: 100%;
    height: 160px;
    line-height: 160px;
    text-align: center;
    cursor: default;
    overflow: hidden;
}

.app-compose-img img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.app-compose-img > .uploadIco {
    position: absolute;
    right: 30px;
    top: 0;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 20px;
    color: #000;
    cursor: pointer;
    overflow: hidden;
}

.app-compose-img > .weChatIco {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 20px;
    color: #000;
    cursor: pointer;
    overflow: hidden;
}

.app-compose-div {
    position: relative;
    width: 100%;
    height: 60px;
    padding-right: 8px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    overflow: hidden;
}

.app-compose-check {
    position: relative;
    float: left;
    width: 40px;
    text-align: center;
    height: 60px;
    line-height: 60px;
    overflow: hidden;
}

.app-compose-name {
    position: relative;
    float: right;
    width: 185px;
    height: 30px;
    padding-left: 5px;
    line-height: 30px;
    color: #333;
    font-size: 12px;
    font-weight: 700;
    border-bottom: 1px solid #eee;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-compose-id {
    position: relative;
    float: right;
    width: 185px;
    height: 30px;
    padding-left: 5px;
    line-height: 30px;
    color: #333;
    font-size: 12px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-compose-foot {
    position: relative;
    width: 100%;
    padding: 10px 0;
    overflow: hidden;
}

.app-compose-but {
    position: relative;
    float: left;
    width: 25%;
    line-height: 18px;
    text-align: center;
    font-size: 12px;
    color: #1694f3;
    margin: 5px 0;
}

.app-compose-line {
    border-left: 1px solid #d7d7d7;
}

/** 组态弹窗 **/
.zutaiPopupL {
    position: relative;
    float: left;
    width: 50%;
    padding: 10px 10px 10px 20px;
    overflow: hidden;
}

.zutaiPopupR {
    position: relative;
    float: left;
    width: 50%;
    padding: 10px 20px 10px 10px;
    overflow: hidden;
}

.zutaiPopup-con {
    position: relative;
    width: 100%;
    background-color: #fff;
    padding-bottom: 20px;
    overflow: hidden
}

.zutaiPopup-Img {
    position: relative;
    width: 240px;
    height: 240px;
    margin: 70px auto auto auto;
    overflow: hidden;
}

.zutaiPopup-Img img {
    width: 100%;
    height: 100%;
}

.zutaiPopup-In {
    position: relative;
    width: 90%;
    max-width: 300px;
    height: 34px;
    font-size: 12px;
    margin: 20px auto auto auto;
    overflow: hidden;
}

.app-zutai-name {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    color: #1694f3;
    border-bottom: 1px solid #E8ECF0;
}

.app-zutai-ul {
    position: relative;
    width: 100%;
    height: 216px;
    padding: 30px 20px !important;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);
    background-repeat: repeat;
}

.app-zutai-count {
    position: relative;
    width: 100%;
    height: 46px;
    line-height: 46px;
    padding: 0 10px;
    border-bottom: 1px solid #eee;
    overflow: hidden;
}

.app-zutai-count > .R {
    font-size: 16px;
    color: #333;
    font-weight: 700;
}

.app-zutai-buy {
    position: relative;
    display: block;
    width: 100%;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    border-radius: 2px;
    background-color: #1694f3;
    overflow: hidden;
}

.app-zutai-buy:hover {
    color: #fff;
    background-color: #1070b9;
}

/*** 流量卡 ***/
.app-FlowCardTab {
    position: relative;
    width: 100%;
    min-width: 1200px;
}

.app-FlowCardTab tr th,
.app-FlowCardTab tr td {
    position: relative;
    padding: 15px 0;
    text-align: left;
    border-bottom: 1px solid #E8ECF0;
    font-size: 14px;
}

.app-FlowCardTab tr th {
    background-color: #f5f5f5;
    font-weight: 400;
}

.app-FlowCardTab tr:hover {
    background-color: #EAF6FE;
}

.app-FlowCardTab tr .check {
    width: 50px;
    text-align: center;
}

.app-FlowCardTab tr .name {
    width: 100%;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-FlowCardTab tr .CardNumber {
    width: 270px;
    padding-right: 20px;
}

.app-FlowCardTab tr .CardNumber span {
    position: relative;
    color: #1694f3;
    cursor: pointer;
    padding: 0;
}

.app-FlowCardTab tr .CardNumber .CardNumberIco {
    color: #1694f3;
    font-size: 18px;
    width: 28px;
    float: right;
    text-align: center;
}

.app-FlowCardTab tr .validTerm {
    width: 120px;
    text-align: center;
}

.app-FlowCardTab tr .Progress {
    width: 320px;
}

.app-FlowCardTab tr .Progress .ProgressBar {
    position: relative;
    float: left;
    width: 250px;
    height: 8px;
    margin-top: 6px;
    background-color: #e2e2e2;
    border-radius: 2px;
}

.app-FlowCardTab tr .Progress .ProgressBar .ProgressBarMarks {
    float: left;
    height: 8px;
    background-color: #1694f3;
    border-radius: 2px;
}

.app-FlowCardTab tr .Progress .ProgressCount {
    float: right;
    width: 60px;
    height: 20px;
    line-height: 20px;
    color: #1694f3;
}

.app-FlowCardTab tr .Stack {
    width: 100px;
    text-align: center;
}

.app-FlowCardTab tr .state {
    width: 100px;
    text-align: center;
}

.app-FlowCardTab tr .state span {
    display: inline-block;
    width: 60px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    color: #fff;
    border-radius: 5px;
    font-size: 12px;
}

.app-FlowCardTab tr .state1 { /* 正常 */
    background-color: #03a800;
}

.app-FlowCardTab tr .state2 { /* 停机 */
    background-color: #535353;
}

.app-FlowCardTab tr .state3 { /* 测试期 */
    background-color: #1694f3;
}

.app-FlowCardTab tr .state4 { /* 沉默期 */
    background-color: #cfa972;
}

.app-FlowCardTab tr .state5 { /* 冻结 */
    background-color: #1b1b1b;
}

.app-FlowCardTab tr .state6 { /* 到期 */
    background-color: #c8232c;
}

.app-FlowCardTab tr .menu {
    width: 120px;
    text-align: center;
}

.app-FlowCardTab tr .menu .menuNav {
    background-color: #fff;
    padding: 0;
    color: #333;
}

.app-FlowCardTab tr .menu .menuNav .layui-nav-item {
    line-height: 30px;
}

.app-FlowCardTab tr .menu .menuNav .layui-nav-item a {
    color: #1694f3;
}

.app-FlowCardTab tr .menu .menuNav .layui-nav-more {
    border-color: #1694f3 transparent transparent;
}

.app-FlowCardTab tr .menu .menuNav .layui-nav-mored {
    margin-top: -9px;
    border-style: dashed dashed solid;
    border-color: transparent transparent #1694f3;
}

.app-FlowCardTab tr .menu .menuNav .layui-nav-child {
    top: 35px;
    left: auto;
    right: 0;
}

.app-FlowCardTab tr .menu .menuNav .layui-nav-child .menuBut {
    position: relative;
    width: auto;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    cursor: pointer;
}

.app-FlowCardTab tr .menu .menuNav .layui-nav-child .menuBut .layui-form-checkbox span {
    vertical-align: baseline;
}

/** 流量卡 弹窗 **/
.flowCardPupo {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    background-color: #fff;
    overflow: hidden;
}

.stateIco {
    position: absolute;
    top: 2px;
    left: 0;
}

.stackIco {
    float: left;
    margin-right: 5px;
    font-size: 14px;
    color: #4cb6bc;
}

.ExpireIco {
    float: right;
    font-size: 14px;
    color: #4cb6bc;
    cursor: pointer;
}

.FlowCard-popup {
    position: relative;
    width: 100%;
    height: 100%;
}

.FlowCard-popup-con {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 50px;
    overflow: auto;
}

.FlowCard-popup-list {
    position: relative;
    width: 100%;
    height: 50px;
    padding: 0 10px;
    border-bottom: 1px solid #e2e2e2;
}

.FlowCard-popup-list > .FlowCard {
    position: relative;
    float: left;
    width: 200px;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
}

.FlowCard-popup-list > .Surplus {
    position: relative;
    float: left;
    width: 80px;
    height: 34px;
    line-height: 34px;
    margin: 8px 0 8px 20px;
    text-align: center;
    overflow: hidden;
}

.FlowCard-popup-list > .switch {
    position: relative;
    float: left;
    width: 80px;
    height: 22px;
    margin: 14px 0 14px 20px;
    text-align: center;
    overflow: hidden;
}

.FlowCard-popup-list > .switch > .layui-form-switch {
    margin: 0;
    line-height: 18px;
}

.FlowCard-popup-list > .switch > .layui-form-switch i {
    top: 2px;
}

.FlowCard-popup-list > .liaison {
    position: relative;
    float: left;
    width: 210px;
    height: 34px;
    line-height: 34px;
    margin: 8px 0 8px 20px;
    text-align: center;
}

.FlowCard-popup-list > .liaison .layui-anim {
    text-align: left;
}

.FlowCard-popup-foort {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 50px;
    padding-left: 20px;
    background-color: #f2f2f2;
    border-bottom: 1px solid #e2e2e2;
    z-index: 99;
}

.FlowCard-popup-foort > .FlowCard {
    position: relative;
    float: right;
    width: auto;
    height: 50px;
    margin-right: 10px;
}

.FlowCard-popup-foort > .FlowCard > .In {
    position: relative;
    float: left;
    width: 110px;
    height: 34px;
    line-height: 34px;
    margin: 8px 0 8px 0;
    text-align: center;
}

.FlowCard-popup-foort > .FlowCard .liaison {
    position: relative;
    float: left;
    width: 230px;
    height: 34px;
    line-height: 34px;
    margin: 8px 0 8px 0;
    text-align: center;
}

.FlowCard-popup-foort > .FlowCard .layui-anim {
    text-align: left;
}

.FlowCard-popup-foort > .FlowCard .subA,
.FlowCard-popup-foort > .FlowCard .subB {
    float: left;
    width: 80px;
    height: 34px;
    line-height: 34px;
    margin: 9px 10px 9px 0;
    font-size: 12px;
    text-align: center;
    border-radius: 3px;
}

.FlowCard-popup-foort > .FlowCard .subA {
    border: 1px solid #d7d7d7;
}

.FlowCard-popup-foort > .FlowCard .subA:hover {
    border: 1px solid #1694f3;
}

.FlowCard-popup-foort > .FlowCard .subB {
    background-color: #1694f3;
    color: #fff;
}

.FlowCard-popup-foort > .FlowCard .subB:hover {
    background-color: #1070b9;
}

/** 充值弹窗 **/
.popup-Recharge {
    position: relative;
    width: 100%;
    float: left;
}

.popup-Recharge-list {
    position: relative;
    float: left;
    width: 100%;
    line-height: 50px;
    margin-top: 15px;
}

.popup-Recharge-list .name {
    position: relative;
    float: left;
    width: 80px;
    height: 50px;
    line-height: 50px;
    text-align: left;
    color: #666;
    overflow: hidden;
}

.popup-Recharge-list .block {
    position: relative;
    width: 100%;
    padding-left: 80px;
}

.popup-Recharge-radio {
    position: relative;
    float: left;
    width: 100px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    margin: 10px 10px 0 0;
    border: 1px solid #ddd;
}

.popup-Recharge-radio > .RaidoIco {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 16px;
    height: 23px;
    font-size: 17px;
    color: #108CEE;
    display: none;
    overflow: hidden;
}

.popup-Recharge-radio.Raido {
    border: 1px solid #1694f3;
}

.popup-Recharge-radio.Raido .RaidoIco {
    display: block !important;
}

.popup-Recharge-radio > .layui-form-radio {
    width: 100%;
    margin: 0;
    height: 30px;
    line-height: 30px;
    padding: 0;
    vertical-align: bottom;
    overflow: hidden;
}

.popup-Recharge-radio > .layui-form-radio * {
    font-size: 12px;
}

.popup-Recharge-radio > .layui-form-radio > i {
    display: none;
}

.popup-Recharge-se {
    position: relative;
    float: left;
    width: 430px;
    height: 36px;
    line-height: 36px;
    margin-top: 7px;
}

.popup-Recharge-Price {
    position: relative;
    float: left;
    width: 430px;
    height: 36px;
    line-height: 36px;
    margin-top: 7px;
    border: 1px solid #1694f3;
    padding: 0 10px;
    overflow: hidden;
}

.popup-Recharge-Price > .Price {
    float: left;
    color: #666;
    font-size: 12px;
}

.popup-Recharge-Price > .total {
    float: right;
    color: #666;
    font-size: 12px;
}

.popup-Recharge-Price > .total > #popupTotal {
    font-size: 16px;
    color: #1694f3;
    font-weight: 700;
    padding-left: 5px;
}

.popup-Recharge-balance {
    font-size: 14px;
    color: #333;
    font-weight: 700;
}

.popup-Recharge-payment {
    position: relative;
    width: 100%;
}

.popup-Recharge-payment > .paymentBu {
    position: relative;
    display: block;
    width: 137px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 12px;
    border: 1px solid #d7d7d7;
    border-radius: 3px;
}

.popup-Recharge-payment > .paymentBu > .c1,
.popup-Recharge-payment > .paymentBu > .c2,
.popup-Recharge-payment > .paymentBu > .c3 {
    font-size: 20px;
    margin-right: 10px;
    vertical-align: sub;
}

.popup-Recharge-payment > .paymentBu > .c1 {
    color: #1694f3;
}

.popup-Recharge-payment > .paymentBu > .c2 {
    color: #24af41;
}

.popup-Recharge-payment > .paymentBu > .c3 {
    color: #4cb6bc;
}

.paymentBu.disabled i {
    color: #C9C9C9 !important;
}

.popup-Recharge-textarea {
    position: relative;
    width: 430px;
    height: 100px;
    overflow: hidden;
}

.popup-Recharge-textarea > .textarea {
    position: relative;
    width: 100%;
    height: 100%;
    border: 1px solid #ddd;
    padding: 10px;
    resize: none;
}

/** 微信扫码支付弹窗 **/
.WechatPayment {
    position: relative;
    width: 100%;
    padding: 0 20px;
    overflow: hidden;
}

.WechatPayment-title {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
}

.WechatPayment-ma {
    position: relative;
    width: 240px;
    height: 240px;
    margin: 20px auto;
    overflow: hidden;
}

.WechatPayment-ma img {
    width: 100%;
    height: 100% ；
}

/*********************************************************************************************************************************
*
*
	增值服务
*
*
**********************************************************************************************************************************/
/** 账户总览 **/
@font-face {
    font-family: lcdbq;
    src: url('../../content/font/LCDBQ-Italic.otf') format('otf'),
    url('../../content/font/LCDBQ-Italic.woff') format('woff'),
    url('../../content/font/LCDBQ-Italic.ttf') format('truetype'),
    url('../../content/font/LCDBQ-Italic.svg') format('svg');
}

.app-Overview {
    position: absolute;
    top: 0;
    left: 0px;
    right: 0;
    bottom: 0;
    overflow: auto;
}

.app-Overview-user {
    position: relative;
    float: left;
    width: 100%;
    min-width: 1140px;
    height: 220px;
    background-color: #fff;
}

.app-Overview-userLogo {
    position: relative;
    float: left;
    width: 220px;
    height: 220px;
    overflow: hidden;
}

.app-Overview-userLogo:after {
    content: '';
    position: absolute;
    top: 40px;
    right: 0;
    width: 1px;
    height: 140px;
    background-color: #d5d9e2;
}

.app-Overview-userLogo > .OverviewLogo {
    position: relative;
    width: 100px;
    height: 100px;
    margin: 20px auto auto auto;
    border-radius: 100%;
    border: 4px solid #efefef;
    -webkit-box-shadow: 1px 1px 6px 0 rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 6px 0 rgba(0, 0, 0, 0.3);
    overflow: hidden;
}

.app-Overview-userLogo > .OverviewLogo img {
    width: 100%;
    height: 100%;
}

.app-Overview-userLogo > .OverviewLogo > .lightLine {
    display: block;
    position: absolute;
    height: 102px;
    width: 73px;
    top: -1px;
    left: -64px;
    -moz-animation: lightLine 2.5s infinite ease-in-out;
    -webkit-animation: lightLine 2.5s infinite ease-in-out;
    animation: lightLine 2.5s infinite ease-in-out;
    background-position: center;
    background-image: url(../../content/images/lightLine.png);
    background-repeat: no-repeat;
    z-index: 3;
}

@-moz-keyframes lightLine {
    0%, 70% {
        -moz-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        -moz-transform: translateX(190px);
        transform: translateX(190px)
    }
}

@-webkit-keyframes lightLine {
    0%, 70% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        -webkit-transform: translateX(190px);
        transform: translateX(190px)
    }
}

@keyframes lightLine {
    0%, 70% {
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        -moz-transform: translateX(190px);
        -ms-transform: translateX(190px);
        -webkit-transform: translateX(190px);
        transform: translateX(190px)
    }
}

.app-Overview-userLogo > .OverviewName {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
    text-align: center;
    font-size: 16px;
    color: #232331;
    font-weight: 700;
    overflow: hidden;
}

.app-Overview-userLogo > .OverviewLink {
    position: relative;
    float: left;
    width: 80px;
    height: 26px;
    line-height: 26px;
    text-align: center;
    font-size: 12px;
    color: #232331;
    border: 1px solid #232331;
    border-radius: 6px;
    overflow: hidden;
}

.app-Overview-userLogo > .OverviewLink:hover {
    color: #108CEE;
    border: 1px solid #108CEE;
}

.app-Overview-userLogo > .OverviewLinkA {
    margin-left: 25px;
}

.app-Overview-userLogo > .OverviewLinkB {
    margin-left: 10px;
}

.app-Overview-block {
    position: absolute;
    top: 0;
    left: 260px;
    right: 20px;
    height: 220px;
    overflow: hidden;
}

.app-Overview-Surplus {
    position: relative;
    float: left;
    width: 20%;
    height: 220px;
    padding: 10px 20px;
    overflow: hidden;
}

.app-Overview-Surplus > .name {
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #000;
    border-bottom: 1px solid #e0e0e0;
}

.app-Overview-Surplus > .stat {
    position: relative;
    width: auto;
    height: 80px;
    margin-top: 20px;
    overflow: hidden;
}

.app-Overview-Surplus > .stat > .num {
    display: block;
    height: 40px;
    line-height: 40px;
    font-size: 32px;
    color: #000;
    overflow: hidden;
}

.app-Overview-Surplus > .stat > .num .family {
    font-family: lcdbq;;
}

.app-Overview-Surplus > .stat > .num .unit {
    font-size: 12px;
    padding-left: 5px;
}

.app-Overview-Surplus > .stat > .plus {
    display: block;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    color: #737373;
    overflow: hidden;
}

.app-Overview-Surplus > .stat > .plus .digit {
    color: #333;
    font-weight: 700;
    font-size: 16px;
}

.app-Overview-Surplus > .but {
    position: relative;
    width: auto;
    height: 30px;
    margin-top: 20px;
    overflow: hidden;
}

.app-Overview-Surplus > .but > .butA {
    position: relative;
    float: left;
    height: 30px;
    line-height: 30px;
    color: #108CEE;
    font-size: 12px;
    font-weight: 700;
    padding: 0 10px 0 0;
}

.app-Overview-Surplus > .but > .butA:hover {
    color: #df3028;
}

.app-Overview-Surplus > .but > .butB {
    padding-left: 10px;
}

.app-Overview-Surplus > .but > .butB:after {
    content: '';
    position: absolute;
    top: 9px;
    left: 0;
    width: 1px;
    height: 12px;
    background-color: #666;
}

/** 响应式兼容小屏幕 **/
@media screen and (min-width: 1440px) and (max-width: 1599px) {
    .app-Overview-block {
        left: 230px;
        right: 10px;
    }

    .app-Overview-Surplus {
        padding: 10px 10px;
    }

    .app-Overview-Surplus > .stat > .num {
        font-size: 26px;
    }
}

@media screen and (min-width: 0px) and (max-width: 1439px) {
    .app-Overview-user {
        min-width: 1066px;
    }

    .app-Overview-block {
        left: 230px;
        right: 10px;
    }

    .app-Overview-Surplus {
        padding: 10px 10px;
    }

    .app-Overview-Surplus > .stat > .num {
        font-size: 22px;
    }

    .app-Overview-Surplus > .stat > .plus .digit {
        font-size: 12px;
    }

    .app-Overview-Surplus > .but > .butA {
        padding: 0 5px 0 0;
    }

    .app-Overview-Surplus > .but > .butB {
        padding-left: 5px;
    }

    .app-Overview-trend {
        min-width: 1066px;
    }
}

/**  图表 **/
.app-Overview-trend {
    position: absolute;
    top: 230px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    overflow: hidden;
}

.app-Overview-Chart {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

/** 支付页面 **/
.app-Overview-payment {
    position: relative;
    float: left;
    width: 100%;
    min-height: 50px;
    line-height: 50px;
    font-size: 12px;
    color: #666;
}

.app-Overview-payment > .name {
    float: left;
    width: 100px;
    text-align: right;
}

.app-Overview-payment > .info {
    padding-left: 120px;
}

.app-Overview-payment > .info .In {
    position: relative;
    float: left;
    width: 380px;
    min-height: 34px;
    margin: 8px 0;
}

.app-Overview-payment > .info .balanceIn {
    position: relative;
    float: left;
    width: 250px;
    min-height: 34px;
    margin: 8px 0;
}

.app-Overview-payment > .info > .paymentBu {
    position: relative;
    display: block;
    width: 120px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 12px;
    border: 1px solid #108CEE;
    border-radius: 3px;
}

.app-Overview-payment > .info > .paymentBu > .c1,
.app-Overview-payment > .info > .paymentBu > .c2,
.app-Overview-payment > .info > .paymentBu > .c3 {
    font-size: 20px;
    margin-right: 5px;
    vertical-align: sub;
}

.app-Overview-payment > .info > .paymentBu > .c1 {
    color: #1694f3;
}

.app-Overview-payment > .info > .paymentBu > .c2 {
    color: #24af41;
}

.app-Overview-payment > .info > .paymentBu > .c3 {
    color: #4cb6bc;
}

.app-Overview-remind {
    position: relative;
    width: 100%;
    line-height: 26px;
    padding: 20px 50px;
    color: #666;
    font-size: 14px;
    overflow: hidden;
}

/** 收货地址 **/
.app-address {
    position: relative;
    width: 100%;
    padding: 0 15px;
    overflow: hidden;
}

.app-address-have {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    text-align: center;
    color: #666;
    background-color: #EAF6FE;
    border-radius: 5px;
    margin: 15px auto;
    overflow: hidden;
}

.app-addressTab {
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.app-addressTab tr th,
.app-addressTab tr td {
    position: relative;
    padding: 12px 5px;
    text-align: center;
    border: 1px solid #e6e6e6;
    font-size: 14px;
    color: #555;
    overflow: hidden;
}

.app-addressTab tr th {
    background-color: #f5f5f5;
    font-weight: 400;
}

.app-addressTab tr .tdHave {
    position: absolute;
    top: 0;
    left: 0;
    width: 30px;
    height: 30px;
    color: #1694f3;
    font-size: 30px;
    overflow: hidden;
}

/** 流量卡结算页 **/
.app-Settlement {
    position: relative;
    width: 100%;
    padding: 0 40px;
    overflow: hidden;
}

.app-Settlement > .content {
    position: relative;
    width: 100%;
    padding: 20px 0;
    border-bottom: 1px solid #e6e6e6;
    overflow: hidden;
}

.app-Settlement > .content > .title {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    overflow: hidden;
}

.app-Settlement > .content > .title a {
    color: #108CEE;
}

.contactInfo {
    position: relative;
    width: 100%;
    height: 46px;
    padding-left: 20px;
    overflow: hidden;
}

.contactInfo:after {
    content: '还没有收货地址,请点击右侧新增收货地址按钮进行添加';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 46px;
    line-height: 46px;
    text-align: center;
    color: #999;
    z-index: 1;
    overflow: hidden;
}

.contactInfoOpen {
    height: auto !important;
    min-height: 46px;
    max-height: 184px !important;
    overflow: auto !important;
}

.contactInfo ul {
    position: relative;
    width: 100%;
    background-color: #fff;
    z-index: 9;
    overflow: hidden;
}

.contactInfo ul li {
    position: relative;
    float: left;
    width: 100%;
    height: 30px;
    line-height: 30px;
    color: #666;
    font-size: 12px;
    margin: 8px 0;
    list-style: none;
    overflow: hidden;
}

.contactInfo ul li:hover {
    background-color: #EAF6FE;
}

.contactInfoDiv {
    position: relative;
    float: left;
    width: 150px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    margin-right: 10px;
    border: 1px solid #ddd;
    background-color: #fff;
    overflow: hidden;
}

.contactInfoDiv:hover {
    border: 1px solid #108CEE;
}

.contactInfoDiv > .layui-form-radio {
    width: 100%;
    margin: 0;
    height: 30px;
    line-height: 30px;
    padding: 0;
    vertical-align: bottom;
    overflow: hidden;
}

.contactInfoDiv > .layui-form-radio * {
    font-size: 12px;
}

.contactInfoDiv > .layui-form-radio > i {
    display: none;
}

.contactInfoIco {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 16px;
    height: 22px;
    font-size: 16px;
    color: #108CEE;
    display: none;
    overflow: hidden;
}

.contactInfoDivOn {
    border: 1px solid #108CEE;
}

.contactInfoDivOn > .contactInfoIco {
    display: block !important;
}

.contactText {
    float: left;
    margin-right: 10px;
}

.contactDefault {
    display: inline-block;
    background-color: #108CEE;
    color: #fff;
    height: 20px;
    line-height: 20px;
    padding: 0 5px;
    border-radius: 2px;
}

.contactEdit {
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    padding-right: 10px;
    display: none;
}

.contactEdit a {
    display: inline-block;
    margin-left: 10px;
    color: #108CEE;
}

.contactEdit a:hover {
    color: #e4393c;
}

.contactOpen {
    position: relative;
    float: left;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    color: #666;
    margin-left: 20px;
    overflow: hidden;
}

.contactOpen i {
    width: 40px;
    height: 40px;
    font-size: 12px;
    color: #666;
    transition: all .2s;
    -webkit-transition: all .2s;
}

.contactOpen:hover,
.contactOpen:hover i {
    color: #e4393c;
}

.contactForm {
    min-width: auto;
    padding: 20px 0 0 0;
}

.contactForm > .list > .name {
    width: 100px;
}

.contactForm > .list > .itme {
    padding-left: 110px;
}

.app-commodity {
    position: relative;
    width: 100%;
    padding-left: 20px;
    overflow: hidden;
}

.app-commodity-list {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-commodity-list > .app-commodity-text {
    position: relative;
    width: 100%;
    padding: 10px 0;
    line-height: 30px;
    font-size: 12px;
    padding-left: 110px;
    color: #666;
}

.app-commodity-list > .app-commodity-text p {
    color: #333;
    font-weight: 700;
}

.app-commodity-list > .app-commodity-text span {
    font-weight: 700;
    color: #e4393c;
}

.app-commodity-list > .app-commodity-name {
    position: relative;
    float: left;
    width: 100px;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    color: #666;
}

.app-commodity-list > .app-commodity-block {
    position: relative;
    width: 100%;
    padding-left: 100px;
}

.app-commodity-list > .app-commodity-block > .app-commodity-li {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-commodityRadio {
    position: relative;
    float: left;
    width: 160px;
    height: 140px;
    text-align: center;
    margin: 20px 20px 0 0;
    border: 1px solid #ddd;
    border-radius: 3px;
    overflow: hidden;
}

.app-commodityRadio:hover {
    border: 1px solid #108CEE;
}

.app-commodityRadio > .app-commodityImg {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 140px;
    height: 90px;
    z-index: 1;
    overflow: hidden;
}

.app-commodityRadio > .app-commodityImg img {
    width: 100%;
}

.app-commodityRadio > .layui-form-radio {
    position: relative;
    width: 100%;
    margin: 0;
    height: 140px;
    line-height: 40px;
    padding: 100px 0 0 0;
    vertical-align: bottom;
    z-index: 9;
    overflow: hidden;
}

.app-commodityRadio > .layui-form-radio * {
    font-size: 12px;
    color: #666;
}

.app-commodityRadio > .layui-form-radio > i {
    display: none;
}

.app-commodityIco {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 16px;
    height: 17px;
    font-size: 16px;
    color: #108CEE;
    display: none;
    overflow: hidden;
}

.app-commodityRadioOn {
    border: 1px solid #108CEE;
}

.app-commodityRadioOn > .app-commodityIco {
    display: block !important;
}

.app-commodity-list > .app-commodity-block .In {
    position: relative;
    float: left;
    width: 300px;
    min-height: 34px;
    margin: 8px 0;
}

.app-paymentRadioOn,
.app-expressRadioOn {
    border: 1px solid #108CEE !important;
}

.app-paymentRadioOn > .contactInfoIco,
.app-expressRadioOn > .contactInfoIco {
    display: block !important;
}

/** 确认支付 **/
.app-payment {
    position: relative;
    width: 100%;
    padding-bottom: 100px;
    overflow: hidden;
}

.app-payment-list {
    position: relative;
    width: 100%;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
}

.app-payment-list > .app-payment-num {
    float: right;
    width: 120px;
    text-align: right;
    font-size: 14px;
    padding-right: 10px;
}

.app-payment-list > .app-payment-txt {
    float: right;
    font-size: 14px;
}

.app-payment-list > .app-payment-text {
    float: right;
    font-size: 12px;
    color: #666;
    padding-right: 10px;
}

.app-payment-list > .app-payment-ber {
    float: right;
    font-size: 14px;
    padding-right: 5px;
    color: #e4393c;
}

.app-payment-con {
    position: relative;
    width: 100%;
    margin-top: 20px;
    padding: 10px 0;
    background-color: #f4f4f4;
    border-top: 1px solid #e6e6e6;
    overflow: hidden;
}

.app-payment-Order {
    position: relative;
    float: right;
    height: 30px;
    line-height: 30px;
    padding: 0 30px;
    background-color: #108CEE;
    color: #fff;
    font-size: 14px;
    border-radius: 3px;
    margin-top: 10px;
    overflow: hidden;
}

.app-payment-Order:hover {
    color: #fff;
    background-color: #1070b9;
}

.app-payment-Order.disabled {
    background-color: #999 !important;
}

.app-payment-balance {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    color: #666;
    text-align: right;
    overflow: hidden;
}

.app-payment-balance span {
    font-weight: 700;
    color: #e4393c;
}

/************************

		订单管理

************************/
.app-Order {
    position: relative;
    width: 100%;
    padding: 0 20px 20px 20px;
    float: left;
}

.app-Order-tab {
    position: relative;
    width: 100%;
}

.app-Order-tab tr td {
    padding: 10px;
    border: 1px solid #E8ECF0;
}

.app-Order-tab .Orderseat td {
    border: 0;
}

.app-Order-tab .Orderhead {
    background-color: #f5f5f5;
}

.app-Order-tab .Orderhead .dealtime,
.app-Order-tab .Orderhead .number {
    margin-right: 20px;
    color: #666;
}

.app-Order-tab .Orderhead .number a {
    color: #333;
}

.app-Order-tab .Orderhead .OrderDel {
    float: right;
    font-size: 14px;
    color: #333;
}

.app-Order-tab .Orderhead .OrderStack {
    float: right;
    font-size: 14px;
    color: #4cb6bc;
    margin-right: 10px;
}

.app-Order-tab .Orderhead .number a:hover,
.app-Order-tab .Orderhead .OrderDel:hover,
.app-Order-tab .Orderhead .OrderStack:hover {
    color: #e4393c;
}

.app-Order-tab .Orderhead .OrderUnpaid {
    position: relative;
    float: right;
    width: auto;
    font-size: 12px;
    color: #333;
    margin-right: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .Orderhead .OrderUnpaid .OrderUnpaidTime {
    font-size: 16px;
    vertical-align: text-top;
}

.app-Order-tab .OrderCon td {
    position: relative;
    padding: 20px 10px;
    vertical-align: top;
    text-align: center;
}

.app-Order-tab .OrderCon .OrderThumbNail {
    width: 100px;
    border-right: 0;
}

.app-Order-tab .OrderCon .OrderThumbNail .OrderImg {
    width: 80px;
}

.app-Order-tab .OrderCon .OrderThumbNail .OrderImg img {
    width: 100%;
}

.app-Order-tab .OrderCon .OrderName {
    color: #333;
    text-align: left;
    border-left: 0;
}

.app-Order-tab .OrderCon .OrderName .OrderNameP {
    margin-top: 10px;
    font-size: 12px;
    color: #666;
}

.app-Order-tab .OrderCon .Consignee {
    position: relative;
    width: auto;
    font-size: 12px;
    color: #333;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .OrderCon .Consignee span {
    font-size: 22px;
    vertical-align: sub;
}

.app-Order-tab .OrderCon .OrderTotal {
    position: relative;
    width: auto;
    font-size: 12px;
    color: #666;
    border-bottom: 1px solid #E8ECF0;
    padding-bottom: 5px;
    margin-bottom: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .OrderCon .OrderMode {
    position: relative;
    width: auto;
    font-size: 12px;
    color: #666;
    margin-top: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .OrderCon .OrderPayment {
    position: relative;
    width: auto;
    font-size: 12px;
    background-color: #108CEE;
    color: #fff;
    padding: 2px 10px;
    margin-top: 5px;
    border-radius: 3px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .OrderCon .Orderstate {
    position: relative;
    width: auto;
    font-size: 12px;
    color: #666;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .OrderCon .OrderstateC1 {
    color: #e4393c;
}

.app-Order-tab .OrderCon .OrderstateC2 {
    color: #1694f3;
}

.app-Order-tab .OrderCon .OrderstateC3 {
    color: #aaa;
}

.app-Order-tab .OrderCon .OrderLogistics {
    position: relative;
    width: auto;
    font-size: 12px;
    color: #333;
    margin-top: 5px;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .OrderCon .OrderLogistics span {
    font-size: 24px;
    vertical-align: sub;
}

.app-Order-tab .OrderCon .OrderDetails {
    position: relative;
    display: inline-block;
    width: auto;
    font-size: 12px;
    color: #333;
    margin-top: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-Order-tab .OrderCon .OrderDetails:hover {
    color: #e4393c;
}

/************************

		订单详情

************************/
.app-Order-detail {
    position: relative;
    min-width: 1000px;
    padding: 20px 30px;
    overflow: hidden;
}

.app-Order-detail .app-Order-detailTitle {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    background-color: #f5f5f5;
    padding: 0 10px;
    border-radius: 3px;
    overflow: hidden;
}

.app-Order-detail .app-Order-step {
    position: relative;
    width: 100%;
    padding-bottom: 20px;
    overflow: hidden;
}

.app-Order-detail .app-Order-step .app-Order-stepLine {
    position: absolute;
    top: 32px;
    left: 0;
    width: 100%;
    height: 2px;
    border-bottom: 2px dashed #999;
    z-index: 1;
}

.app-Order-detail .app-Order-table {
    position: relative;
    width: 100%;
    z-index: 99;
    overflow: hidden;
}

.app-Order-detail .app-Order-table tr td {
    text-align: center;
    vertical-align: top;
}

.app-Order-detail .app-Order-table tr .Ltxt {
    text-align: left;
}

.app-Order-detail .app-Order-table tr .Rtxt {
    text-align: right;
}

.app-Order-detail .app-Order-table .Order-step {
    position: relative;
    display: inline-block;
    width: 100px;
    height: 100%;
    background-color: #fff;
    overflow: hidden;
}

.app-Order-detail .app-Order-table .Order-step .Ico {
    position: relative;
    width: 100%;
    height: 70px;
    line-height: 70px;
    text-align: center;
    font-size: 34px;
    color: #666;
    overflow: hidden;
}

.app-Order-detail .app-Order-table .Order-step .IcoYes {
    color: #108CEE;
    font-weight: 700;
}

.app-Order-detail .app-Order-table .Order-step .name {
    position: relative;
    width: 100%;
    line-height: 20px;
    text-align: center;
    font-size: 12px;
    color: #333;
    overflow: hidden;
}

.app-Order-detail .app-OrderLogistics {
    position: relative;
    width: 100%;
    margin-top: 10px;
    padding: 20px 10px;
    max-height: 200px;
    border: 1px solid #E8ECF0;
    overflow: auto;
}

.app-Order-detail .app-OrderLogistics .layui-timeline-item {
    padding-bottom: 10px;
}

.app-Order-detail .app-OrderLogistics .layui-timeline-axis {
    color: #108CEE !important
}

.app-Order-detail .app-Order-info {
    position: relative;
    width: 100%;
    margin-top: 20px;
    overflow: hidden;
}

.app-Order-detail .app-Order-info .app-Order-td {
    width: 33.333333%;
}

.app-Order-detail .app-Order-info .app-Order-itme {
    position: relative;
    width: 100%;
    padding-right: 20px;
    overflow: hidden;
}

.app-Order-detail .app-Order-info .app-Order-itme h4 {
    position: relative;
    width: 100%;
    text-align: left;
    color: #333;
    padding-bottom: 8px;
    overflow: hidden;
}

.app-Order-detail .app-Order-info .app-Order-itme p {
    position: relative;
    width: 100%;
    text-align: left;
    color: #333;
    font-size: 12px;
    padding-bottom: 8px;
    overflow: hidden;
}

.app-Order-detail .app-Order-product {
    position: relative;
    width: 100%;
    margin-top: 20px;
    overflow: hidden;
}

.app-Order-detail .app-Order-product tr td,
.app-Order-detail .app-Order-product tr th {
    padding: 12px 5px;
    font-size: 12px;
    color: #333;
    border: 1px solid #E8ECF0;
    vertical-align: middle;
}

.app-Order-detail .app-Order-product tr th {
    background-color: #f5f5f5;
}

.app-Order-detail .app-Order-product .OrderThumbNail {
    width: 100px;
    border-right: 0;
}

.app-Order-detail .app-Order-product .OrderThumbNail .OrderImg {
    width: 80px;
}

.app-Order-detail .app-Order-product .OrderThumbNail .OrderImg img {
    width: 100%;
}

.app-Order-detail .app-Order-product .OrderName {
    text-align: left;
    border-left: 0;
}

.app-Order-detail .app-Order-product .OrderTotal {
    text-align: right;
}

.app-Order-detail .app-Order-product .OrderTotal p {
    height: 24px;
    line-height: 24px;
}

.app-Order-detail .app-Order-product .OrderTotal span {
    display: inline-block;
    width: 120px;
    text-align: right;
}

/************************

		发票管理

************************/
.app-invoice-table {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-invoice-table .invoice-td {
    text-align: left;
}

.app-invoice-down {
    color: #1070b9;
    font-size: 12px;
    font-weight: 700;
    padding-left: 5px;
}

.app-invoiceMust {
    font-size: 14px;
    padding: 0 10px;
    color: #df3028;
}

.app-invoiceMsg {
    position: relative;
    float: left;
    height: 30px;
    line-height: 30px;
    margin-top: 13px;
    color: #108CEE;
    font-size: 14px;
    padding-right: 15px;
}

.app-invoice-radio {
    position: relative;
    width: auto;
    float: left;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
}

.app-invoice-radio .layui-form-radio {
    margin: 0;
}

.app-invoice-radio .layui-form-radio > i {
    font-size: 18px;
}

.app-invoice-radio .layui-form-radio div {
    font-size: 12px;
    color: #333;
}

.app-invoice-info {
    position: relative;
    width: 100%;
    min-width: 600px;
    padding: 15px;
    overflow: hidden;
}

.app-invoice-info > .list {
    position: relative;
    width: 100%;
    border-right: 1px solid #ebecec;
    overflow: hidden;
}

.app-invoice-info > .list:nth-of-type(1) {
    background-color: #f5f5f6;
    border-top: 1px solid #ebecec;
}

.app-invoice-info > .list > .row {
    position: relative;
    width: 50%;
    float: left;
    border-left: 1px solid #ebecec;
    border-bottom: 1px solid #ebecec;
    font-size: 13px;
    padding: 15px 10px;
    color: #19001d;
}

.app-invoice-info > .list > .rowMax {
    width: 100%;
}

.app-invoice-info > .list > .row > .name {
    color: #73777a;
    min-width: 65px;
    float: left;
}

.app-invoice-info .app-OrderLogistics {
    position: relative;
    width: 100%;
    padding: 20px 10px;
    max-height: 200px;
    border-left: 1px solid #ebecec;
    border-right: 1px solid #ebecec;
    border-bottom: 1px solid #ebecec;
    overflow: auto;
}

.app-invoice-info .app-OrderLogistics .layui-timeline-item {
    padding-bottom: 10px;
}

.app-invoice-info .app-OrderLogistics .layui-timeline-axis {
    color: #108CEE !important
}

.app-invoice-tab {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-invoice-tab tr td {
    border: 1px solid #ebecec;
    font-size: 13px;
    padding: 15px 10px;
    color: #19001d;
}

.app-invoice-tab thead tr:nth-of-type(1) {
    background-color: #f5f5f6;
}

.app-invoice-page {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-bottom: 100px;
}

.app-invoice-Order {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    bottom: 0;
    z-index: 999;
    background-color: #fff;
    overflow: auto;
}

.app-invoice-OrderAll {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
    color: #73777a;
    font-size: 13px;
}

.app-invoice-check {
    width: auto;
    float: left;
    margin-left: 6px;
}

.app-invoice-check .layui-form-checkbox[lay-skin=primary] {
    vertical-align: text-top;
}

.app-invoice-OrderAll > .colorA {
    font-size: 18px;
    color: #1694f3;
    padding: 0 5px;
}

.invoiceNews {
    float: left;
    margin: 10px 0 10px 10px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 20px;
    text-align: center;
    color: #1694f3;
}

.invoiceConfirm {
    position: relative;
    width: 100%;
    line-height: 30px;
    padding: 20px 30px 50px 30px;
}

.invoiceSe {
    position: relative;
    float: left;
    width: 300px;
    height: 100px;
    margin: 8px 0;
}

.invoiceSe textarea {
    position: relative;
    width: 100%;
    height: 100px;
    line-height: 18px;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
    padding: 10px;
    resize: none;
}

.invoiceExample {
    position: absolute;
    top: 0;
    right: -100px;
    width: 80px;
    height: 52px;
    border: 1px solid #d7d7d7;
    overflow: hidden;
}

.invoiceExample img {
    width: 100%;
}

/************************

		首页 登录

************************/
.app-home {
    position: fixed;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 98;
    background-color: #fff;
    overflow: auto;
}

.home-Popup {
    position: relative;
    width: 100%;
    padding: 0 30px;
    overflow: hidden;
}

.home-SignIn {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    color: #666;
    font-size: 14px;
    overflow: hidden;
}

.home-SignIn .Ico {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    text-align: center;
    font-size: 22px;
    color: #666;
}

.home-SignIn .Input {
    height: 40px;
    padding-left: 40px;
}

.home-check {
    float: left;
    width: auto;
}

.home-check .layui-form-checkbox {
    padding-left: 22px;
}

.home-check .layui-form-checkbox i {
    top: 1px;
}

.home-check .layui-form-checkbox span {
    padding-right: 0;
}

.home-SignIn .home-Forget {
    float: right;
    color: #666;
}

.home-SignIn .home-clause {
    float: left;
    color: #337ab7;
}

.home-SignIn .home-clause:hover {
    color: #0b3c67;
}

.SignIn-but {
    position: relative;
    display: block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    background-color: #282828;
}

.home-SignIn .home-Third {
    display: inline-block;
    width: 26px;
    height: 26px;
    line-height: 26px;
    margin-left: 5px;
}

.home-SignIn .home-Third img {
    width: 100%;
    vertical-align: top;
}

/************************

		首页 注册

************************/
.home-tab {
    margin: 0;
}

.home-tab > .layui-tab-title .layui-this {
    color: #1694f3;
}

.home-tab > .layui-tab-title .layui-this:after {
    border-bottom: 2px solid #1694f3;
}

.home-tab > .layui-tab-content {
    padding: 0;
}

.home-register {
    position: relative;
    width: 100%;

    line-height: 40px;
    color: #666;
    font-size: 14px;
    overflow: hidden;
}

.home-registeCode {
    position: relative;
    width: 100%;
    padding-right: 140px;
    height: 40px;
    line-height: 40px;
    color: #666;
    font-size: 14px;
    overflow: hidden;
}

.home-registeCode .goCode {
    position: absolute;
    top: 0;
    right: 0;
    width: 130px;
    height: 40px;
    line-height: 40px;
    background-color: #282828;
    color: #fff;
    font-size: 14px;
    text-align: center;
    z-index: 999;
    overflow: hidden;
}

.home-register .Input,
.home-registeCode .Input {
    height: 40px;
}

.pc_goServices {
    position: relative;
    width: 100%;
    padding: 50px 0;
    overflow: hidden;
}

.pc_goServices h3 {
    position: relative;
    width: 100%;
    text-align: center;
    font-size: 20px;
    height: 60px;
    line-height: 60px;
}

.pc_goServices p {
    line-height: 24px;
    margin-bottom: 10px;
}

/************************************  配色 ******************************/
.app-Color {
    position: relative;
    font-size: 18px;
}

.app-Color-Popup {
    position: relative;
    width: 100%;
    padding: 15px;
}

.ColorMatching {
    position: relative;
    float: left;
    width: 120px;
    height: 80px;
    margin: 0 15px 15px 0;
    border: 1px solid #E8ECF0;
    background-color: #f3f3f3;
    cursor: pointer;
}

.ColorMatching:after {
    content: '';
    position: absolute;
    z-index: 20;
    top: 50%;
    left: 50%;
    width: 1px;
    height: 0;
    border: 1px solid #f2f2f2;
    transition: all .3s;
    -webkit-transition: all .3s;
    opacity: 0;
}

.ColorMatching-this:after,
.ColorMatching:hover:after {
    width: 100%;
    height: 100%;
    padding: 4px;
    top: -5px;
    left: -5px;
    border-color: #108CEE;
    opacity: 1;
}

.ColorMatching > .head {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 20px;
    background-color: #fff;
    z-index: 999;
    overflow: hidden;
}

.ColorMatching > .left {
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    bottom: 0;
    background-color: #fff;
    z-index: 99;
    overflow: hidden;
}

/************************************************************  网站配色
******************************************************************************/
/** 默认配色 **/
.ColorMatchingC1 > .head {
    background-color: #373d41;
}

.ColorMatchingC1 > .left {
    background-color: #222d32;
}

/** 双白色 **/
.ColorMatchingC2 > .head {
    background-color: #fff;
}

.ColorMatchingC2 > .left {
    background-color: #fff;
}

/** 上白色 **/
.ColorMatchingC3 > .head {
    background-color: #fff;
}

.ColorMatchingC3 > .left {
    background-color: #222d32;
}

/** 左白色 **/
.ColorMatchingC4 > .head {
    background-color: #373d41;
}

.ColorMatchingC4 > .left {
    background-color: #fff;
}

/** 青色系 **/
.ColorMatchingC5 > .head {
    background-color: #009688;
}

.ColorMatchingC5 > .left {
    background-color: #03796e;
}

/** 蓝色系 **/
.ColorMatchingC6 > .head {
    background-color: #1E9FFF;
}

.ColorMatchingC6 > .left {
    background-color: #0085E8;
}

/** 紫色系 **/
.ColorMatchingC7 > .head {
    background-color: #50314F;
}

.ColorMatchingC7 > .left {
    background-color: #3e273d;
}

/** 红色系 **/
.ColorMatchingC8 > .head {
    background-color: #AA3130;
}

.ColorMatchingC8 > .left {
    background-color: #822828;
}

/** 黄色系 **/
.ColorMatchingC9 > .head {
    background-color: #FF5722;
}

.ColorMatchingC9 > .left {
    background-color: #d84b1f;
}

/** 绿色系 **/
.ColorMatchingC10 > .head {
    background-color: #5FB878;
}

.ColorMatchingC10 > .left {
    background-color: #549c68;
}

/** 双白色 **/
.app-ColormatchingC2 > .layui-nav {
    background-color: #fff;
    border-bottom: 1px solid #d7d7d7;
}

.app-ColormatchingC2 > .layui-nav .layui-nav-item > a {
    color: #333;
}

.app-ColormatchingC2.app-menu {
    background-color: #fff;
    border-right: 1px solid #d7d7d7;
}

.app-ColormatchingC2.app-menu ul a {
    color: #333;
}

.app-ColormatchingC2.app-menu ul a:hover {
    background-color: #d7d7d7;
}

.app-ColormatchingC2.app-menu ul .app-menuThis {
    background-color: #d7d7d7;
}

/** 上白色 **/
.app-ColormatchingC3 > .layui-nav {
    background-color: #fff;
    border-bottom: 1px solid #d7d7d7;
}

.app-ColormatchingC3 > .layui-nav .layui-nav-item > a {
    color: #333;
}

/** 左白色 **/
.app-ColormatchingC4.app-menu {
    background-color: #fff;
    border-right: 1px solid #d7d7d7;
}

.app-ColormatchingC4.app-menu ul a {
    color: #333;
}

.app-ColormatchingC4.app-menu ul a:hover {
    background-color: #d7d7d7;
}

.app-ColormatchingC4.app-menu ul .app-menuThis {
    background-color: #d7d7d7;
}

/** 青色系 **/
.app-ColormatchingC5 > .layui-nav {
    background-color: #009688;
}

.app-ColormatchingC5 > .layui-nav .layui-nav-item > a {
    color: #ffffff;
}

.app-ColormatchingC5.app-menu {
    background-color: #03796e;
}

.app-ColormatchingC5.app-menu ul a {
    color: #ffffff;
}

.app-ColormatchingC5.app-menu ul a:hover {
    background-color: #03675d;
}

.app-ColormatchingC5.app-menu ul .app-menuThis {
    background-color: #03675d;
}

/** 蓝色系 **/
.app-ColormatchingC6 > .layui-nav {
    background-color: #1E9FFF;
}

.app-ColormatchingC6 > .layui-nav .layui-nav-item > a {
    color: #ffffff;
}

.app-ColormatchingC6.app-menu {
    background-color: #0085E8;
}

.app-ColormatchingC6.app-menu ul a {
    color: #ffffff;
}

.app-ColormatchingC6.app-menu ul a:hover {
    background-color: #0773c3;
}

.app-ColormatchingC6.app-menu ul .app-menuThis {
    background-color: #0773c3;
}

/** 紫色系 **/
.app-ColormatchingC7 > .layui-nav {
    background-color: #50314F;
}

.app-ColormatchingC7 > .layui-nav .layui-nav-item > a {
    color: #ffffff;
}

.app-ColormatchingC7.app-menu {
    background-color: #3e273d;
}

.app-ColormatchingC7.app-menu ul a {
    color: #ffffff;
}

.app-ColormatchingC7.app-menu ul a:hover {
    background-color: #352135;
}

.app-ColormatchingC7.app-menu ul .app-menuThis {
    background-color: #352135;
}

/** 红色系 **/
.app-ColormatchingC8 > .layui-nav {
    background-color: #AA3130;
}

.app-ColormatchingC8 > .layui-nav .layui-nav-item > a {
    color: #ffffff;
}

.app-ColormatchingC8.app-menu {
    background-color: #822828;
}

.app-ColormatchingC8.app-menu ul a {
    color: #ffffff;
}

.app-ColormatchingC8.app-menu ul a:hover {
    background-color: #6d2020;
}

.app-ColormatchingC8.app-menu ul .app-menuThis {
    background-color: #6d2020;
}

/** 黄色系 **/
.app-ColormatchingC9 > .layui-nav {
    background-color: #FF5722;
}

.app-ColormatchingC9 > .layui-nav .layui-nav-item > a {
    color: #ffffff;
}

.app-ColormatchingC9.app-menu {
    background-color: #d84b1f;
}

.app-ColormatchingC9.app-menu ul a {
    color: #ffffff;
}

.app-ColormatchingC9.app-menu ul a:hover {
    background-color: #b9431e;
}

.app-ColormatchingC9.app-menu ul .app-menuThis {
    background-color: #b9431e;
}

/** 绿色系 **/
.app-ColormatchingC10 > .layui-nav {
    background-color: #5FB878;
}

.app-ColormatchingC10 > .layui-nav .layui-nav-item > a {
    color: #ffffff;
}

.app-ColormatchingC10.app-menu {
    background-color: #549c68;
}

.app-ColormatchingC10.app-menu ul a {
    color: #ffffff;
}

.app-ColormatchingC10.app-menu ul a:hover {
    background-color: #4f8c5f;
}

.app-ColormatchingC10.app-menu ul .app-menuThis {
    background-color: #4f8c5f;
}

/************************

		云组态介绍

************************/
.app-zutaiApp {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-zutaiAppBanA {
    background: #272940;
    background: url(../../content/images/zutaiApp/bannerBacC.png) no-repeat center 0, linear-gradient(180deg, #272940, #11152b);
    text-align: center;
    background-size: cover;
    padding: 30px 0;
}

.app-zutaiAppBanA img {
    display: inline-block;
    max-width: 1000px;
    width: 100%;
}

.app-zutaiAppBanB {
    background: #fff;
    padding: 30px 0;
}

.app-zutaiAppBanB h2 {
    position: relative;
    width: 1146px;
    height: 120px;
    line-height: 120px;
    text-align: center;
    font-size: 30px;
    color: #333;
    margin: 0 auto;
    overflow: hidden;
}

.app-zutaiAppBanB-list {
    position: relative;
    width: 1146px;
    margin: 0 auto;
    overflow: hidden;
}

.app-zutaiAppBanB-list > .Itme {
    position: relative;
    width: 380px;
    margin-left: 2px;
    float: left;
    overflow: hidden;
}

.app-zutaiAppBanB-list > .Itme > .Test {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    color: #333;
}

.app-zutaiAppBanB-list > .Itme > .Img {
    position: relative;
    width: 380px;
    height: 504px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
}

.app-zutaiAppBanB-list > .Itme > .ImgA {
    background-image: url(../../content/images/zutaiApp/new-zutaiappB1.png);
}

.app-zutaiAppBanB-list > .Itme > .ImgA:hover {
    background-image: url(../../content/images/zutaiApp/new-zutaiappB1-1.png);
}

.app-zutaiAppBanB-list > .Itme > .ImgB {
    background-image: url(../../content/images/zutaiApp/new-zutaiappB2.png);
}

.app-zutaiAppBanB-list > .Itme > .ImgB:hover {
    background-image: url(../../content/images/zutaiApp/new-zutaiappB2-1.png);
}

.app-zutaiAppBanB-list > .Itme > .ImgC {
    background-image: url(../../content/images/zutaiApp/new-zutaiappB3.png);
}

.app-zutaiAppBanB-list > .Itme > .ImgC:hover {
    background-image: url(../../content/images/zutaiApp/new-zutaiappB3-1.png);
}

.app-zutaiAppBanC {
    background: #272940;
    background: url(../../content/images/zutaiApp/bannerBac.png) no-repeat center 0, linear-gradient(180deg, #272940, #11152b);
    text-align: center;
    background-size: cover;
}

.app-zutaiAppBanC-con {
    position: relative;
    width: 1200px;
    margin: 0 auto;
    padding: 50px 0;
}

.app-zutaiAppBanC-con h2 {
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 30px;
    color: #fff;
    margin: 0 auto;
    overflow: hidden;
}

.app-zutaiAppBanC-con h4 {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    color: #c5c5c5;
    margin: 0 auto;
    overflow: hidden;
}

.app-zutaiAppBanC-list {
    position: relative;
    width: 100%;
    padding-top: 80px;
    overflow: hidden;
}

.app-zutaiAppBanC-list > .row {
    position: relative;
    float: left;
    width: 33.333333%;
    overflow: hidden;
}

.app-zutaiAppBanC-list > .row > .Img {
    position: relative;
    width: 100%;
    height: 200px;
    text-align: center;
    overflow: hidden;
}

.app-zutaiAppBanC-list > .row > .Img img {
    display: inline-block;
    width: 154px;
}

.app-zutaiAppBanC-list > .row > .Text {
    position: relative;
    width: 80%;
    margin: 0 auto;
    line-height: 26px;
    color: #fff;
    font-size: 14px;
    overflow: hidden;
}

.app-zutaiAppBanD {
    background: #ffffff;
}

.app-zutaiAppBanD-con {
    position: relative;
    width: 1228px;
    margin: 0 auto;
    padding: 50px 0;
}

.app-zutaiAppBanD-con h2 {
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 30px;
    color: #333;
    overflow: hidden;
}

.app-zutaiAppBanD-con h4 {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    color: #333;
    overflow: hidden;
}

.app-zutaiAppBanD-con > .Nav {
    margin-top: 50px;
}

.app-zutaiAppBanD-con > .Nav > .layui-tab-title {
    text-align: center;
}

.app-zutaiAppBanD-con > .Nav > .layui-tab-content {
    padding: 20px 0;
}

.app-zutaiAppBanD-con > .Nav > .layui-tab-content img {
    width: 100%;
}

.app-zutaiAppBanE {
    background: #272940;
    background: url(../../content/images/zutaiApp/bannerBacE.png) no-repeat center 0, linear-gradient(180deg, #272940, #11152b);
    text-align: center;
    background-size: cover;
}

.app-zutaiAppBanE-con {
    position: relative;
    width: 1200px;
    margin: 0 auto;
    padding: 50px 0;
}

.app-zutaiAppBanE-con h2 {
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 30px;
    color: #fff;
    margin: 0 auto;
    overflow: hidden;
}

.app-zutaiAppBanE-con h4 {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    color: #c5c5c5;
    margin: 0 auto;
    overflow: hidden;
}

.app-zutaiAppBanE-con > .Img {
    position: relative;
    width: 100%;
    padding: 50px 0 0 0;
    overflow: hidden;
}

.app-zutaiAppBanE-con > .Img img {
    width: 100%;
}

.app-zutaiAppBut {
    position: relative;
    display: block;
    width: 100%;
    height: 127px;
    line-height: 127px;
    background-image: url(../../content/images/zutaiApp/new-zutaiapplin.jpg);
    text-align: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    overflow: hidden;
}

.app-zutaiAppBut img {
    display: inline-block;
    width: 266px;
    height: 64px;
}

/************************

	开发者中心

************************/
.app-help {
    position: fixed;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 98;
    overflow: auto;
}

.app-helpMenu {
    position: absolute;
    top: 0;
    left: 0;
    width: 260px;
    bottom: 0;
    background-color: #fff;
    z-index: 999;
    border-right: 1px solid #E8ECF0;
    overflow-x: hidden;
    overflow-y: auto;
}

.app-helpMenu > .title {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    font-weight: 700;
    color: #666;
    border-bottom: 1px solid #E8ECF0;
    padding-left: 20px;
}

.app-helpBody {
    position: absolute;
    top: 0;
    left: 270px;
    right: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 99;
    overflow: hidden;
}

.app-helpCon {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 20px 20px 20px;
    overflow: auto;
}

.app-helpCon img {
    cursor: pointer;
}

.helpCon img {
    max-width: 100%;
}

/** 开发者中心 **/
.app-helpNav {
    width: 100%;
    background-color: #fff;
    color: #333;
}

.app-helpNav .layui-nav-item {
    border-bottom: 1px solid #f6f7fb;
}

.app-helpNav .layui-nav-item a {
    color: #333;
}

.app-helpNav .layui-nav-item a:hover {
    background-color: #EAF6FE;
    color: #333 !important;
}

.app-helpNav .layui-this > a {
    color: #fff !important;
}

.app-helpNav .layui-this > a:hover {
    color: #333 !important;
}

.app-helpNav .layui-nav-itemed > a {
    color: #333 !important;
}

.app-helpNav .layui-nav-itemed .layui-this > a {
    color: #fff !important;
}

.app-helpNav .layui-nav-itemed .layui-this > a:hover {
    color: #fff !important;
}

.app-helpNav .layui-nav-more {
    border-color: #333 transparent transparent;
}

.app-helpNav .layui-nav-mored,
.app-helpNav .layui-nav-itemed > a .layui-nav-more {
    margin-top: -9px;
    border-style: dashed dashed solid;
    border-color: transparent transparent #333;
}

.app-helpNav .layui-nav-itemed > .layui-nav-child {
    background-color: #f6f7fb !important;
}

.app-helpNav .layui-nav-child a {
    font-size: 12px;
    padding-left: 30px;
    padding-right: 5px;
}

/** api接口 **/
.app-Interface {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.app-InterfaceAddress {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    border: 1px solid #E8ECF0;
    margin-top: 20px;
    border-radius: 2px;
    overflow: hidden;
}

.app-InterfaceAddress > .type {
    float: left;
    width: 80px;
    text-align: center;
    background-color: #108CEE;
    color: #fff;
    font-size: 14px;
}

.app-InterfaceAddress > .typeGet {
    background-color: #ff9d34;
}

.app-InterfaceAddress > .url {
    position: relative;
    margin-left: 20px;
}

.app-InterfaceAddress > .url:hover {
    color: #108CEE;
    text-decoration: underline;
}

.app-InterfaceAddress > .text {
    float: right;
    margin-right: 10px;
}

.app-InterfaceCode {
    position: relative;
    width: 100%;
    margin-top: 10px;
    overflow: hidden;
}

.app-InterfaceCode > .title {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    color: #333;
    font-weight: 700;
}

.app-InterfaceCode > .title span {
    padding: 0 10px;
    border-left: 3px solid #108CEE;
}

.app-InterfaceCode > .Code {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.apiWindow {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #f2f2f2;
    padding: 0 20px;
    overflow: hidden;
}

.apiWindowCon {
    position: relative;
    width: 100%;
    height: 50%;
    overflow: hidden;
}

.apiWindowCon > .list {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
}

.apiWindowCon > .list .row {
    position: relative;
    width: 350px;
    padding-right: 10px;
    float: left;
}

.apiWindowCon > .list .name {
    position: relative;
    width: 80px;
    float: left;
    z-index: 999;
    overflow: hidden;
}

.apiWindowCon > .list .author {
    float: left;
    width: 60px;
    height: 31px;
    line-height: 31px;
    background-color: #1E9FFF;
    text-align: center;
    color: #fff;
    margin-top: 4px;
    border-radius: 2px;
}

.apiWindowCon > .list .Info {
    position: relative;
    width: 100%;
    padding-left: 80px;
}

.apiWindowCon > .list .Info > .In {
    position: relative;
    width: 100%;
    padding: 3px 0;
    overflow: hidden;
}

.apiWindowCon > .list .Info > .radio {
    display: inline-block;
    width: auto;
    float: left;
}

.apiWindowCon > .list .Info > .radio > .layui-form-radio {
    margin: 0 !important;
}

.apiWindowCon > .list .Info > .radio > .layui-form-radio > i {
    font-size: 16px !important;
    margin-right: 5px;
}

.apiWindowCon > .list .Info > .radio > .layui-form-radio > div {
    font-size: 12px !important;
}

.apiWindowTop {
    position: absolute;
    top: 40px;
    right: 0;
    left: 0;
    bottom: 0;
    padding: 10px;
    color: #fff;
    background-color: #3F3F3F;
    border: 1px solid #000;
    word-wrap: break-word;
    word-break: break-all;
    overflow-x: hidden;
    overflow-y: auto;
}

.apiWindowBot {
    position: absolute;
    top: 130px;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: #3F3F3F;
    overflow: hidden;
}

.api-layer {
    position: relative;
    width: 100%;
    padding: 10px 20px;
    overflow: hidden;
}

.api-layer .li {
    position: relative;
    float: left;
    width: 100%;
    margin-top: 20px;
}

.api-layer .li .name {
    position: relative;
    float: left;
    width: 140px;
    height: 34px;
    line-height: 34px;
    text-align: left;
}

.api-layer .li .in {
    position: relative;
    width: 100%;
    padding-left: 140px;
}

/*********** 网站首页 ************/
.home-index {
    position: relative;
    width: 1180px;
    margin: 0 auto;
}

.home-indexWe img {
    width: 100%;
}

.home-Carousel {
    position: relative;
    width: 100%;
    height: 600px;
    overflow: hidden;
}

.home-Carousel-Img {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.home-Carousel-Img img {
    width: auto;
    height: 100%;
}

.home-list {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.home-name {
    position: relative;
    width: 100%;
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 24px;
    color: #000;
    overflow: hidden;
}

.home-index-tab {
    position: relative;
    width: 100%;
    margin: 0;
    padding-bottom: 50px;
    overflow: hidden;
}

.home-index-tab > .layui-tab-title {
    border: 0;
    height: auto;
    text-align: center;
}

.home-index-tab > .layui-tab-title li {
    height: 34px;
    line-height: 34px;
    background-color: #dfdfe4;
    margin: 0 10px;
    padding: 0 25px;
    border-radius: 18px;
}

.home-index-tab > .layui-tab-title .layui-this {
    background-color: #0090ff;
    color: #fff;
}

.home-index-tab > .layui-tab-title .layui-this:after {
    border: 0;
}

.home-index-tab .layui-tab-content {
    position: relative;
    width: 100%;
    padding: 0;
    overflow: hidden;
}

/** 滚动示例 **/
.picScroll-left {
    position: relative;
    width: 100%;
    padding: 40px 0 0 0;
    overflow: hidden;
}

.picScroll-left .hd {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
}

.picScroll-left .hd .prev,
.picScroll-left .hd .next {
    position: absolute;
    top: 90px;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 50%;
    background-color: #fff;
    text-align: center;
    font-size: 50px;
    z-index: 99;
    box-shadow: 0px 0px 8px rgba(0, 144, 255, 0.7);
    overflow: hidden;
}

.picScroll-left .hd .prev {
    left: 5px;
}

.picScroll-left .hd .next {
    right: 5px;
}

.picScroll-left .hd ul {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 0px;
    overflow: hidden;
}

.picScroll-left .bd {
    position: relative;
    width: 1060px;
    margin: 0 auto;
    overflow: hidden;
}

.picScroll-left .bd ul {
    overflow: hidden;
    zoom: 1;
}

.picScroll-left .bd ul li {
    position: relative;
    margin-left: 30px;
    float: left;
    background-color: #fff;
    _display: inline;
    overflow: hidden;
    text-align: center;
}

.picScroll-left .bd ul li .pic {
    text-align: center;
}

.picScroll-left .bd ul li .pic img {
    width: 225px;
}

.picScroll-left .bd ul li .title {
    position: relative;
    width: 100%;
    line-height: 50px;
    text-align: center;
    border-top: 1px solid #dfdfe4;
}

.home-case {
    background-color: #f2f2fc;
}

/** 全连接案例 **/
.home-linkCase {
    position: relative;
    width: 100%;
    margin: 0;
    float: left;
    padding-bottom: 30px;
}

.home-linkCase > .layui-tab-title {
    float: left;
    width: 278px;
    height: auto;
    border: 0;
    white-space: normal;
}

.home-linkCase > .layui-tab-title .layui-this:after {
    border: 0;
}

.home-linkCase > .layui-tab-title .layui-tab-bar {
    display: none;
}

.home-linkCase > .layui-tab-title li {
    position: relative;
    width: 100%;
    height: 136px;
    line-height: 136px;
    text-align: center;
    color: #fff;
    padding: 0;
    border-bottom: 1px solid #fff;
    background-color: #313759;
}

.home-linkCase > .layui-tab-title li > .TXT {
    display: block;
}

.home-linkCase > .layui-tab-title li > .IMG {
    display: none;
}

.home-linkCase > .layui-tab-title .layui-this > .TXT {
    display: none;
}

.home-linkCase > .layui-tab-title .layui-this > .IMG {
    background-color: #fff;
    box-shadow: 0 0 8px rgba(0, 0, 0, .5);
    display: block;
}

.home-linkCase > .layui-tab-content {
    float: right;
    width: 880px;
    padding: 0;
}

.home-linkCase > .layui-tab-content .layui-tab-item {
    text-align: right;;
}

.home-linkCase > .layui-tab-content .layui-tab-item img {
    float: right;
}

/**  平台应用 **/
.home-program-zutai {
    position: relative;
    width: 100%;
    height: 570px;
    z-index: 1;
    margin-top: 50px;
    overflow: hidden;
}

.home-program-zutai1 {
    position: absolute;
    top: 150px;
    left: 150px;
    width: 260px;
    z-index: 99;
    overflow: hidden;
}

.home-program-zutai2 {
    position: absolute;
    top: 100px;
    left: 520px;
    width: 300px;
    z-index: 99;
    overflow: hidden;
}

.home-program-zutai3 {
    position: absolute;
    top: 365px;
    left: 570px;
    width: 300px;
    z-index: 99;
    overflow: hidden;
}

.home-program-itme2 {
    position: relative;
    width: 284px;
    float: left;
    overflow: hidden;
}

.home-program-itmeM {
    margin-left: 15px;
}

.home-program-itmeR {
    float: right;
}

.home-program-itme2 > .name2 {
    position: relative;
    width: 100%;
    line-height: 30px;
    text-align: center;
    font-size: 18px;
    margin-top: 20px;
    overflow: hidden;
}

.home-program-itme2 .describe2 {
    position: relative;
    width: 100%;
    line-height: 30px;
    text-align: center;
    font-size: 14px;
    color: #666;
    overflow: hidden
}

.home-program-itme2 .img2 {
    position: relative;
    width: 100%;
    overflow: hidden
}

.home-program-itme2 .img2 img {
    width: 100%;
}

/** 平台功能 **/
.home-function {
    position: relative;
    width: 100%;
    background-color: #313759;
    overflow: hidden;
}

.home-function .home-name {
    color: #fff;
}

.home-function-tab {
    position: relative;
    width: 100%;
    margin: 0;
    float: left;
    padding-bottom: 50px;
}

.home-function-tab > .layui-tab-title {
    float: left;
    width: 280px;
    margin-left: -10px;
    height: auto;
    border: 0;
    white-space: normal;
}

.home-function-tab > .layui-tab-title .layui-this:after {
    border: 0;
}

.home-function-tab > .layui-tab-title .layui-tab-bar {
    display: none;
}

.home-function-tab > .layui-tab-title li {
    position: relative;
    width: 130px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: #333;
    background-color: #fff;
    padding: 0;
    margin: 0 0 20px 10px;
    border-radius: 5px;
    overflow: hidden;
}

.home-function-tab > .layui-tab-title .layui-this {
    background-color: #0090ff;
    color: #fff;
}

.home-function-tab > .layui-tab-title .this:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 30px;
    height: 50px;
    background-image: url("../images/qy.svg");
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

.home-function-tab > .layui-tab-content {
    float: right;
    width: 875px;
    padding: 0;
}

.home-function-tab > .layui-tab-content img {
    width: 100%;
}

.home-function-txt {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, .3);
    margin-bottom: 5px;
    overflow: hidden;
}

.home-function-txt span {
    font-size: 22px;
    vertical-align: sub;
}

/** 应用领域 **/
.home-field {
    position: relative;
    width: 100%;
    padding-bottom: 50px;
    overflow: hidden;
}

.home-field > .describe {
    position: relative;
    width: 80%;
    height: 96px;
    line-height: 24px;
    color: #666;
    text-align: center;
    margin: 0 auto;
    overflow: hidden;
}

.home-field > .list {
    position: relative;
    width: 100%;
    margin-top: 20px;
    overflow: hidden;
}

.home-field-itme {
    position: relative;
    width: 295px;
    float: left;
    overflow: hidden;
}

.home-field-itme img {
    width: 100%;
}

.home-field-txt {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    transition: 0.5s;
    opacity: 0.2;
    background-color: rgba(0, 0, 0, .7);
    z-index: 999;
    overflow: hidden;
}

.home-field-itme:hover .home-field-txt {
    opacity: 1;
    height: 100%;
}

.home-field-con {
    position: absolute;
    top: 0;
    width: 100%;
    bottom: 50px;
    padding: 20px;
    line-height: 24px;
    color: #fff;
}

.home-field-link {
    position: absolute;
    left: 50%;
    bottom: 15px;
    margin-left: -60px;
    width: 120px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    color: #fff;
    background-color: #0090ff;
    border-radius: 17px;
}

/** 云组态案例 **/
.home-group {
    position: relative;
    width: 100%;
    background: url('../../content/images/anli/home-group.png') bottom center no-repeat, linear-gradient(#2f2935, #06000a);
    padding-bottom: 50px;
    overflow: hidden;
}

.home-group .home-name {
    color: #fff;
}

.home-group-list {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.home-group-itme {
    position: relative;
    width: 580px;
    margin-top: 20px;
    background-color: #fff;
    overflow: hidden;
}

.home-group-IMG {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.home-group-IMG img {
    width: 100%;
}

.home-foot {
    position: relative;
    width: 100%;
    padding: 50px 0 0 0;
    background-color: #252b3a;
    overflow: hidden;
}

.home-footTab {
    position: relative;
    width: 100%;
    display: table;
    overflow: hidden;
}

.home-footTr {
    display: table-row;
}

.home-footTd {
    display: table-cell;
    padding: 0 20px;
    border-left: 1px solid #000000;
    vertical-align: top;
}

.home-footW1 {
    width: 240px;
}

.home-footW2 {
    width: 500px;
}

.home-footName {
    position: relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: left;
    font-size: 16px;
    color: #fff;
    overflow: hidden;
}

.home-link {
    position: relative;
    display: block;
    width: 100%;
    line-height: 26px;
    text-align: left;
    font-size: 13px;
    color: #aba9b8;
    overflow: hidden;
}

.home-app {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.home-app-itme {
    position: relative;
    float: left;
    width: 160px;
    overflow: hidden;
}

.home-appLm {
    margin-left: 20px;
}

.home-appR {
    float: right;
}

.home-app-itme > .name {
    position: relative;
    width: 100%;
    text-align: center;
    font-size: 13px;
    color: #aba9b8;
    overflow: hidden;
}

.home-app-itme > .Img {
    position: relative;
    width: 100%;
    padding: 10px;
    overflow: hidden;
}

.home-app-itme > .Img img {
    width: 100%;
}

.home-app-itme > .list {
    position: relative;
    width: 100%;
    padding: 0 15px;
    line-height: 22px;
    text-align: center;
    font-size: 13px;
    color: #aba9b8;
    overflow: hidden;
}

.home-copyright {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: #aba9b8;
    margin-top: 20px;
}

.home-copyright a {
    color: #d6d6d6;
    text-decoration: underline;
}

/** 首次登录设置密码 **/
.home-password {
    position: relative;
    width: 800px;
    margin: 0 auto;
    overflow: hidden;
}

/************************

	设备管理-固件升级

************************/
.firmwareUpload {
    position: relative;
    float: left;
    height: 30px;
    line-height: 30px;
    padding: 0 15px;
    margin: 2px 0;
    border-radius: 2px;
    font-size: 12px;
    color: #666;
    border: 1px solid #1694f3;
    overflow: hidden;
}

.firmwareUpload input {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    opacity: 0;
    z-index: 999;
    cursor: pointer;
}

.firmwareTextarea {
    position: relative;
    width: 100%;
    height: 90px;
    line-height: 18px;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
    padding: 10px;
    resize: none;
}

.firmwareCon {
    position: relative;
    width: 100%;
    padding: 0 15px;
    overflow: hidden;
}

.firmwareTitle {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
}

.firmwareTitle span {
    float: left;
}

.firmwareEdit {
    position: relative;
    float: left;
    height: 24px;
    line-height: 24px;
    padding: 0 15px;
    border-radius: 2px;
    font-size: 12px;
    color: #fff;
    margin: 13px 0;
    margin-left: 10px;
    background-color: #1694f3;
}

.firmwareEdit:hover {
    color: #fff;
    background-color: #0f6fb7;
}

.firmwareTab {
    position: relative;
    width: 100%;
    min-width: 800px;
    overflow: hidden;
}

.firmwareTab tr th,
.firmwareTab tr td {
    position: relative;
    padding: 12px 20px;
    border: 1px solid #e6e6e6;
    font-size: 14px;
    color: #555;
    text-align: center;
    overflow: hidden;
}

.firmwareTab tr th {
    background-color: #f5f5f5;
    font-weight: 400;
}

.firmwareTab tr .rowMax {
    text-align: left;
}

.firmwareTab tr .row {
    width: 50%;
    text-align: left;
}

.firmwareTab tr th .name,
.firmwareTab tr td .name {
    position: relative;
    width: 85px;
    float: left;
    overflow: hidden;
}

.firmwareTab tr th .block,
.firmwareTab tr td .block {
    width: 100%;
}

.firmwareTab tr .download {
    padding: 0 10px;
    color: #108CEE;
}

/** 解决方案 **/
.app-Industry {
    position: relative;
    width: 100%;
    margin-top: 50px;
}

.Industry-ban {
    position: relative;
    width: 100%;
    height: 560px;
    overflow: hidden;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.Industry-ban1 {
    background-image: url(../../content/images/anli/b_gy.jpg);
}

.Industry-ban2 {
    background-image: url(../../content/images/anli/b_ny.jpg);
}

.Industry-ban3 {
    background-image: url(../../content/images/anli/b_hj.jpg);
}

.Industry-ban4 {
    background-image: url(../../content/images/anli/b_nl.jpg);
}

.Industry-ban .name {
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    color: #fff;
    font-size: 22px;
    margin-top: 100px;
}

.Industry-ban .txt {
    position: relative;
    width: 100%;
    min-height: 200px;
    line-height: 28px;
    color: #fff;
    font-size: 16px;
    margin-top: 50px;
}

.Industry-ban .link {
    display: block;
    width: 140px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #fff;
    color: #fff;
    border-radius: 10px;
    margin: 10px auto auto auto;
}

.Industry-con {
    position: relative;
    width: 1180px;
    margin: 0 auto;
}

.Industry-itme {
    position: relative;
    width: 100%;
}

.Industry-nav {
    position: absolute;
    top: -25px;
    left: 0;
    width: 100%;
    height: 50px;
    background: #fff;
    box-shadow: 0 0 16px rgba(0, 0, 0, .2);
    z-index: 999;
    overflow: hidden;
}

.Industry-nav ul {
    padding: 0;
    margin: 0;
}

.Industry-nav-a {
    position: relative;
    width: 20%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: #333;
    font-size: 14px;
    float: left;
}

.Industry-nav-w {
    width: 16.666666%;
}

.Industry-nav-a.active {
    background-color: #1694f3;
    color: rgba(255, 255, 255, .8);
}

.navFix {
    position: fixed;
    top: 200px;
    left: 10px;
    width: 140px;
    height: auto;
    text-align: center;
}

.navFix ul {
    display: inline-block;
}

.navFix ul a {
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    border-right: 0;
}

.Industry-list {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.Industry-list-title {
    position: relative;
    width: 100%;
    height: 30px;
    line-height: 30px;
    color: #000;
    font-size: 18px;
    padding-left: 30px;
    border-left: 3px solid #0090ff;
    margin-top: 60px;
    overflow: hidden;
}

.Industry-list-test {
    position: relative;
    width: 100%;
    line-height: 30px;
    color: #707070;
    font-size: 16px;
    padding-left: 30px;
    margin-top: 20px;
    overflow: hidden;
}

.Industry-list-img {
    position: relative;
    width: 100%;
    padding: 0 0 0 30px;
    margin-top: 30px;
    text-align: center;
    overflow: hidden;
}

.Industry-list-img img {
    max-width: 100%;
    width: auto;
    display: inline-block;
}

/* 左右结构 */
.IndustryTab {
    position: relative;
    width: 100%;
    display: table;
    border-bottom: 1px solid #d7d7d7;
}

.IndustryTrl {
    display: table-cell;
    width: 600px;
    padding: 40px 0 20px 0;
    vertical-align: top;
}

.IndustryTdr {
    display: table-cell;
    vertical-align: top;
    padding: 40px 0 20px 20px;
}

.Industry-listImg {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.Industry-listImg img {
    width: 100%;
}

.Industry-listTitle {
    position: relative;
    width: 100%;
    height: 30px;
    line-height: 30px;
    color: #000;
    font-size: 18px;
    padding-left: 10px;
    border-left: 3px solid #0090ff;
    overflow: hidden;
}

.Industry-listTest {
    position: relative;
    width: 100%;
    line-height: 30px;
    color: #707070;
    font-size: 16px;
    padding-left: 10px;
    margin-top: 20px;
    overflow: hidden;
}

.Bind_account {
    position: relative;
    width: 400px;
    padding: 50px 0 100px 0;
    margin: 0 auto;
    overflow: hidden;
}

.Bind_account > .title {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    border-bottom: 1px solid #d7d7d7;
    padding: 0 10px;
    margin-bottom: 30px;
    overflow: hidden;
}

.Bind_account > .list {
    position: relative;
    width: 100%;
    min-height: 50px;
    line-height: 50px;
    margin-top: 10px;
    color: #666;
    text-align: center;
}

.Bind_account > .list > .name {
    float: left;
    width: 80px;
    text-align: right;
}

.Bind_account > .list > .itme {
    padding-left: 90px;
}

.Bind_account > .list > .itme > .se {
    position: relative;
    float: left;
    width: 100%;
    min-height: 34px;
    margin: 8px 0;
}

.Bind_account > .list > .itme > .button {
    width: 49%;
    height: 30px;
    line-height: 30px;
    background-color: #108CEE;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    border-radius: 2px;
    padding: 0 30px;
    margin: 10px 0;
}

.Bind_account > .list > .itme > .buttonBor {
    background-color: #fff;
    border: 1px solid #108CEE;
    color: #333;
}

/** 新增微信绑定列表 **/
.weChat-tab {
    position: relative;
    width: 100%;
    display: table;
    overflow: hidden;
}

.weChat-tr {
    display: table-row;
}

.weChat-td {
    display: table-cell;
    text-align: center;
    padding: 10px 20px;
    border-bottom: 1px solid #eee;
}

/**监控中心图片类型**/
.center-images {
    position: relative;
    display: inline-block;
    width: 70px;
    line-height: 40px;
}

.center-images span {
    position: relative;
    float: left;
}

.center-images img {
    width: 100%;
    vertical-align: bottom;
}

/***********

	设备视图

**********/
.view-list {
    position: relative;
    width: 100%;
    height: 100%;
    border-top: 1px solid #333;
    border-left: 1px solid #333;
    background-color: #fff;
    overflow: hidden;
}

.flex-con {
    position: relative;
    width: 100%;
    height: 100%;
    display: -webkit-flex;
    display: flex;
}

.flex-conMin {
    height: 50%;
}

.flex-item {
    width: 0;
    flex: 1;
    margin-left: -1px;
    margin-top: -1px;
}

.flex-station {
    background-color: rgba(22, 148, 243, 0.1);
}

.view-con {
    position: relative;
    width: 100%;
    height: 100%;
    border: 1px solid #333;
    background-color: #fff;
    overflow: hidden;
}

.view-toolbar {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 40px;
    background-color: rgba(0, 0, 0, .6);
    display: none;
    overflow: hidden;
}

.view-toolbar .but {
    float: right;
    width: 30px;
    height: 30px;
    padding: 5px;
    margin: 5px 10px 0 0;
    cursor: pointer;
    overflow: hidden;
}

.view-toolbar .view-move {
    cursor: move
}

.view-toolbar .but img {
    width: 100%;
}

.view-con-full {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 999999;
}

.view-toolbar-max {
    display: none;
}

/***  组态素材库  ***/
.view-material {
    position: absolute;
    top: 0;
    left: 250px;
    right: 0;
    bottom: 0;
    z-index: 99;
    background-color: #fff;
    overflow: auto;
}

.view-material-nav {
    position: relative;
    width: 100%;
    min-height: 50px;
    border-bottom: 1px solid #d7d7d7;
    overflow: hidden;
}

.view-material-nav .name {
    float: left;
    width: 90px;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    font-weight: 700;
    color: #666;
    padding-left: 10px;
    overflow: hidden;
}

.view-material-nav .li {
    position: relative;
    width: 100%;
    padding-left: 90px;
    margin-top: 10px;
}

.view-material-nav .li .material_url {
    display: block;
    width: auto;
    height: 30px;
    line-height: 30px;
    text-align: center;
    float: left;
    border: 1px solid #d7d7d7;
    margin: 0 10px 10px 0;
    padding: 0 20px;
    color: #333;
    font-size: 12px;
    border-radius: 5px;
    background-color: #fff;
}

.view-material-nav .li .material_this {
    border: 1px solid #108CEE !important;
}

.view-material-con {
    position: relative;
    width: 100%;
    padding: 10px;
    overflow: hidden;
}

.view-material-con .view-material-item {
    position: relative;
    float: left;
    width: 140px;
    margin: 10px;
    border-radius: 8px;
    overflow: hidden;
}

.view-material-con .view-material-item .img {
    position: relative;
    width: 140px;
    height: 160px;
    line-height: 160px;
    text-align: center;
    border: 1px solid #d7d7d7;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);
    background-repeat: repeat;
    overflow: hidden;
}

.view-material-con .view-material-item .img img {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.view-material-con .view-material-item .popu {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99;
    padding: 20px 0;
    background-color: #108CEE !important;
    display: none;
    overflow: hidden;
}

.view-material-con .view-material-item .pupu_url {
    position: relative;
    display: block;
    width: 100%;
    color: #fff;
    text-align: center;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    padding: 10px 0;
}

.view-material-con .view-material-item .pupu_url p {
    line-height: 20px;
}

.view-material-con .view-material-item .pupu_url .iconfont {
    font-size: 18px;
}

/** 新增数据统计 **/
.app_Back_data {
    float: left;
    margin-left: 10px;
    margin-top: 13px;
    float: left;
    margin-left: 10px;
    color: #fff;
    background-color: #1694f3;
    margin-top: 13px;
    border: 0;
}

.app_Back_data:hover {
    border: 0;
    background-color: #117cce;
    color: #fff;
}

.dataTree {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99;
    overflow: auto;
}

.dataTree .layui-tree-icon,
.dataTree .layui-tree-entry {
    box-sizing: content-box !important;
}

.dataTree .layui-disabled, .layui-disabled:hover {
    color: #666 !important;
}

.dataTree .layui-tree-iconArrow:after {
    border-color: transparent transparent transparent #666;
}

.app-towConY-dataTab {
    padding: 10px;
}

.dataTab {
    position: relative;
    overflow: hidden;
}

.dataTab tr td,
.dataTab tr th {
    text-align: center;
    border: 1px solid #E8ECF0;
    padding: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.contentChart {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.nail_code {
    background-color: #009688;
}

.app-batch-radio {
    widh: auto;
    height: 34px;
    line-height: 34px;
}

.app-batch-radio .layui-form-radio {
    margin: 0 3px 0 0;
    padding: 0;
}

.app-batch-radio .layui-form-radio > i {
    margin: 0;
}

.big_picture {
    cursor: pointer;
}

/*** 新增视频配置 ***/
.set-video .settingLinks {
    float: left;
    width: 108px;
}

.set-photograph {
    position: relative;
    float: right;
    width: 108px;
    height: 30px;
    line-height: 30px;
    border: 1px solid #108CEE;
    color: #108CEE;
    font-size: 12px;
    text-align: center;
    margin-top: 5px;
    border-radius: 1px;
    overflow: hidden;
}

.set-photograph:hover {
    border: 1px solid #1070b9;
}

.photographRow-0 {
    position: relative;
    width: 133px;
}

.photographRow-1 {
    position: relative;
    margin-left: 11px;
    width: 133px;
}

.photographWeek {
    position: relative;
    float: left;
    width: 100%;
    padding-top: 9px;
}

.photographWeek .layui-form-checkbox[lay-skin=primary] {
    padding-left: 20px;
}

.photographWeek .layui-form-checkbox[lay-skin=primary] .layui-form-checkbox[lay-skin=primary] span {
    padding-right: 20px;
}

.photographWeek .layui-form-checkbox[lay-skin=primary] i {
    top: 1px;
}

.photographTime {
    position: relative;
    float: left;
    width: 100%;
    padding-top: 15px;
}

.photographTime ._list {
    float: left;
    width: 120px;
}

.photographTime ._list input {
    height: 28px;
}


/** 历史数据弹窗  **/
.HistoryIframe {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    overflow: hidden;
}

.mapHisTrail {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    overflow: hidden;
}