/* 格式化 */
body{color: #333333;}
h1,h2,h3,h4,h5,h6{font-size: 14px; font-weight: normal;}
i,b,em{font-style:normal;}

/* 加粗 */
.font_weight{font-weight: bold;}

/* 文字大小 */
.font_size_12{font-size: 12px!important;}
.font_size_15{font-size: 15px;}
.font_size_16{font-size: 16px;}

/* 外边距 */
.margin_top_0{margin-top: 0!important;}
.margin_top_2{margin-top: 2px;}
.margin_top_5{margin-top: 5px;}
.margin_top_10{margin-top: 10px;}
.margin_top_15{margin-top: 15px;}
.margin_top_20{margin-top: 20px;}
.margin_top_25{margin-top: 25px;}
.margin_top_30{margin-top: 30px;}

.margin_right_5{margin-right: 5px;}
.margin_right_10{margin-right: 10px;}
.margin_right_15{margin-right: 15px;}
.margin_right_20{margin-right: 20px;}

.margin_bottom_0{margin-bottom: 0!important;}
.margin_bottom_5{margin-bottom: 5px!important;}
.margin_bottom_10{margin-bottom: 10px!important;}
.margin_bottom_15{margin-bottom: 15px!important;}

.margin_left_2{margin-left: 2px;}
.margin_left_5{margin-left: 5px;}
.margin_left_10{margin-left: 10px;}
.margin_left_15{margin-left: 15px;}
.margin_left_20{margin-left: 20px;}
.margin_left_25{margin-left: 25px;}
.margin_left_30{margin-left: 30px;}
.margin_left_50{margin-left: 50px;}

/* 背景颜色 */
.bg_blue{background: #0088DD;}
.bg_red{background: #FF0000;}
.bg_ash{background: #F5F7FA;}
.bg_white{background: #FFFFFF;}
.bg_main{background: #009688;}
.bg_orange{background: #FF5722;}
.bg_new{background: #7EC2D1;}
.bg_worth{background: #6CA7F0;}
.bg_hot{background: #EF8A8A;}
.bg_seckill{background: #D59262;}
.bg_dark{background: #EEEEEE;}
.bg_black{background: #000000;}
.bg_xcx{background: #009688;}

/* 文字颜色 */
.font_color_ash{color: #C5C8CE;}
.font_color_blue{color: #1E9FFF;}
.font_color_red{color: #FF0000;}
.font_color_green{color: #009688;}
.font_color_black{color: #333333;}
.font_color_white{color: #FFFFFF;}
.font_dark{color: #999999;}
.font_color_dark{color: #999999;}
.font_color_main{color: #009688;}
.font_color_xcx{color: #009688;}
.font_color_orange{color:#FF5722}

/* 鼠标 */
.pointer{cursor: pointer;}
.not-allowed{cursor: not-allowed;}

/* position */
.relative{position: relative;}
.relative .calendar{width: 20px; height: 20px; position: absolute; top: 9px; right: 8px; display: flex; justify-content: center;align-items: center; font-size: 20px;}
.relative .colorpicker{position: absolute; right: -4px; top: 6px;}

/* 超出省略号 */
.ell{overflow: hidden;white-space:nowrap;text-overflow: ellipsis;}
.ells{overflow: hidden;display: -webkit-box !important; text-overflow: ellipsis;word-break: break-all;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}

/* 删除线 */
.through{text-decoration: line-through;}

/* 验证 */
.verify{border:1px dashed #009688!important;box-shadow:0 0 0 2px rgba(0,150,136,.2);}
.verify_off{border:1px dashed #e5e5e5;box-shadow:0 0 0 2px rgba(0,150,136,0);}
.verify_on{border:1px solid #009688!important;box-shadow:0 0 0 2px rgba(0,150,136,.2);}

/* 宽度 */
.w60{width: 60px!important;}
.w70{width: 70px!important;}
.w80{width: 80px!important;}
.w_60{width: 60px;}
.w_80{width: 80px;}
.w_100{width: 100px;}
.w_120{width: 120px;}
.w_150{width: 150px;}
.w_180{width: 180px;}
.w_200{width: 200px;}
.w_250{width: 250px;}
.w_274{width: 274px;}
.w_300{width: 300px;}

/* flex */
.flex_row{display: flex; align-items: center;}
.grow {flex-grow: 1;}
.shrink {flex-shrink: 0;}
.start{justify-content:flex-start!important;}

/* 圆角 */
.radius_2{border-radius: 2px;}
.radius_4{border-radius: 4px;}
.radius_10{border-radius: 10px;}
.radius_50{border-radius: 50px;}

/* 高度 */
.min_h_120{min-height: 120px;}
.min_h_600{min-height: 600px;}
.min_h_900{min-height: 900px;}
.h_150{height: 150px;}
.h_186{height: 186px;}

/* 阴影 */
.shadow{box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);}

/* 背景色 */
.layadmin-tabspage-none .layui-layout-admin .layui-body {background: #f5f7f9!important;}

/* 链接 */
.green_link{color: #333333; cursor: pointer;}
.green_link:hover{color: #009688; text-decoration: underline;}

/* 动画 */
.transition{transition: all .3s; -webkit-transition: all .3s;}

/* 分栏 */
.layui-col-xs3 {width: 20%!important;}

/* 对齐 */
.text-center{text-align: center!important;}

/* 图标 */
.iconfont{display: flex; justify-content: center; align-items: center;}

/* 图片 */
.cover{max-width: 100%; max-height: 100%; object-fit: cover;}

/* 快捷 */
.nm-quick{width: 100%; height:276px; background: #FFFFFF; border-radius: 2px; display: flex; flex-direction: column; align-items: center;color: #333333; font-size: 14px;box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);}
.nm-quick dt{width: 100%; height: 50px; border-bottom: #f6f6f6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.nm-quick dt p{line-height:16px; font-size: 16px;}
.nm-quick dd{width: 100%;}
.nm-quick dd ul{width: 100%;display: flex; flex-wrap: wrap;}
.nm-quick dd ul li{width: calc((100% - 75px) / 4); height: 90px; background: #f5f7f9; margin: 15px 0 0 15px;}
.nm-quick dd ul li a{width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;color: #666666; border-radius: 4px;text-align: center;}
.nm-quick dd ul li a i{width: 100%; height: 30px; line-height: 30px; font-size: 30px;color: #009688!important;font-style:normal;}
.nm-quick dd ul li a span{width: 100%; height: 24px; line-height: 24px; font-size: 24px;font-style:normal;}
.nm-quick dd ul li a p{width: 100%; height: 14px; line-height: 14px;}
.nm-quick dd ul li a:hover i{color: #027b70!important;}
.nm-quick dd ul li a:hover p{color: #333333!important;}

/* 图表 */
.nm-chart{width: 100%; background: #FFFFFF; border-radius: 2px; display: flex; flex-direction: column; align-items: center;color: #333333; font-size: 14px;box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);}
.nm-chart dt{width: 100%; height: 50px; border-bottom: #f6f6f6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.nm-chart dt p{line-height:16px; font-size: 16px;}
.nm-chart dd{width: calc(100% - 30px); height: 332px; margin: 15px;}
.nm-chart dd .carousel{width: 100%; height: 100%;}

/* 排行 */
.nm-ranking{width: 100%; background: #FFFFFF; border-radius: 2px; display: flex; flex-direction: column; align-items: center;color: #333333; font-size: 14px;box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);}
.nm-ranking dt{width: 100%; height: 50px; border-bottom: #f6f6f6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.nm-ranking dt p{line-height:16px; font-size: 16px;}
.nm-ranking dt ul{height: 100%; display: flex; align-items: center;}
.nm-ranking dt ul li{height: 24px; font-size: 12px; line-height: 24px; border-radius: 2px; border: #F9F9F9 1px solid; padding: 0 10px; cursor: pointer;}
.nm-ranking dt ul li.on{border:#009688 1px solid; color: #009688;}
.nm-ranking dt ul li.off{border:#EEEEEE 1px solid; color: #999999;}
.nm-ranking dd{width: calc(100% - 40px); height: 370px; margin:0 20px;}
.nm-ranking dd ul{width: 100%; display: flex; flex-direction: column;}
.nm-ranking dd ul li{width: 100%; height: 20px; display: flex; align-items: center;margin-top: 15px;}
.nm-ranking dd ul li i{width: 18px; height: 18px; border-radius: 50%; text-align: center; line-height: 18px; font-size: 12px; background: #cbcbcb; color: #FFFFFF; font-style: normal; flex-shrink: 0;}
.nm-ranking dd ul li:nth-child(-n+3) i{background: #009688;}
.nm-ranking dd ul li p{flex-grow: 1; height: 100%; line-height: 20px; overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.nm-ranking dd ul li span{width: 200px; height: 6px;}
.nm-ranking dd ul li em{width: 50px; height: 100%; line-height: 20px; text-align: right; flex-shrink: 0; font-style: normal;}

/* 表单 */
.layui-textarea{padding: 0 10px;}
.layui-input:hover,.layui-textarea:hover{border-color: #009688!important}
.layui-input:focus,.layui-textarea:focus{border-color: #009688!important;box-shadow: 0 0 0 2px rgba(0,150,136,.2)}
.layui-form-danger + .layui-form-select .layui-input, .layui-form-danger:focus {border-color: #009688!important;box-shadow: 0 0 0 2px rgba(0,150,136,.2)!important;}
.layui-form-switch{min-width: 50px!important;}
.layui-form-switch em{top: -1px;}
.layui-btn-routine {background-color: #2F4056;}
.layui-laydate-header i:hover, .layui-laydate-header span:hover{color: #009688!important;}
.layui-colorpicker{padding: 0!important;border:0!important;}
.layui-form-radio{margin-top: 5px;}
.layui-form-radio:hover *, .layui-form-radioed, .layui-form-radioed>i {color: #009688!important;}
.layui-dropdown{text-align: center;margin-left: -32px; box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);border-radius: 4px;}
.layui-dropdown .layui-menu li{font-size: 13px;}
.layui-dropdown .layui-menu li:hover {background-color: #e5f4f3;}

/* 提示 */
.layui-layer-dialog{max-width: 500px;}
.layui-layer-msg{min-width: 100px!important;border: 1px solid #EFEFEF!important;border-radius: 4px!important;box-shadow: 1px 1px 6px rgba(0,0,0,0.1)!important;}
.layui-layer-dialog .layui-layer-padding {padding: 20px 20px 20px 50px!important;}
.layui-layer-dialog .layui-layer-content {line-height: 26px!important; color: #5b6476!important;}
.layui-layer-dialog .layui-layer-content .layui-layer-ico{ top: 23px!important; left: 20px!important; width: 20px!important; height: 20px!important; }
.layui-layer-ico1 { background:url(../image/1.jpg)!important;}
.layui-layer-ico2 { background:url(../image/2.jpg)!important;}
.layui-layer-ico3 { background:url(../image/3.jpg)!important;}
.layui-layer-ico4 { background:url(../image/4.jpg)!important;}
.layui-layer-ico5 { background:url(../image/2.jpg)!important;}
.layui-layer-ico6 { background:url(../image/4.jpg)!important;}
.layui-layer-ico7 { background:url(../image/7.jpg)!important;}
.layui-badge-rim, .layui-colla-content, .layui-colla-item, .layui-collapse, .layui-elem-field, .layui-form-pane .layui-form-item[pane],.layui-form-pane .layui-form-label, .layui-input, .layui-layedit, .layui-layedit-tool, .layui-quote-nm, .layui-select, .layui-tab-bar, .layui-tab-card, .layui-tab-title, .layui-tab-title .layui-this:after, .layui-textarea {border-color: #E8EAEC!important;}
.layui-layer-ico16, .layui-layer-loading .layui-layer-loading2 {width: 20px;height: 20px;background: url("../image/loading.gif") no-repeat; background-size: 20px 20px;}
.layui-layer-content h9{color: #009688; margin: 0 12px; padding: 0 5px; position: relative; font-weight: 500;}
.layui-layer-content h9::before{position: absolute; left: -5px; top: -6px; content: '[';}
.layui-layer-content h9::after{position: absolute; right: -5px; top: -6px; content: ']';}

/* 弹窗按钮 */
.layui-layer-admin .layui-layer-title{background-color:#009688!important;}
.layui-layer-btn .layui-layer-btn0 {border-color: #009688!important;background-color: #009688!important;}

/* 卡片 */
.layui-card-header {position: relative!important;display: flex!important;height: 60px!important; line-height: 60px!important; align-items: center;}
.layui-card-header i {font-style: normal;font-size: 18px;}
.layui-card-body {padding: 15px!important;}

/* 表格 */
.layui-table thead tr, .layui-table-header, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table-total, .layui-table-total tr, .layui-table[lay-even] tr:nth-child(even) {background-color: #f8f8f9;}
.layui-table tbody tr:hover{background-color: #ebf7f6!important;}
.layui-table td, .layui-table th, .layui-table-col-set, .layui-table-fixed-r, .layui-table-grid-down, .layui-table-header, .layui-table-page, .layui-table-tips-main, .layui-table-tool, .layui-table-total, .layui-table-view, .layui-table[lay-skin=line], .layui-table[lay-skin=row] {border-color: #e8eaec!important;}
.layui-table th:last-child{border-right: 0;}
.layui-table-tool {min-height: 60px!important;line-height: 30px!important;padding: 15px!important;}
.layui-table-tool .layui-btn-container {display: flex!important;}
.layui-table-tool .layui-btn-container .layui-btn {display: flex;!important;}
.layui-table-tool .layui-btn-container .layui-btn i {font-size: 18px!important;margin-right: 3px!important;margin-top: -1px!important;}
.layui-table-tool-self {display: flex!important;top: 15px!important;right: 15px!important;}
.layui-table-tool .layui-inline[lay-event] {position: relative!important;padding: 0!important;border: 1px solid #DEDEDE!important;display: flex!important; justify-content: center!important; align-items: center!important; background: #FFFFFF!important;}
.layui-table-tool .layui-inline[lay-event]:hover {border: 1px solid #CCCCCC!important;}
.layui-table-cell {min-height: 50px;line-height: 50px; height: auto;}
.table_img{width:40px; height:40px;position: relative; margin-top: 5px;}
.table_img.big{width: 115px!important;}
.table_img.team{width: 30px!important;}
.table_img.branch{width: 68px!important;}
.table_img.partner{width: 93px!important;}
.table_img img{width:100%; height:100%; position: absolute;  left: 0; top: 0; right: 0; bottom: 0; margin: auto; cursor: pointer;object-fit: cover;}
.table_img i{width:20px; height:20px; text-align: center; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; color: #FFFFFF;border-radius: 50%;display: inline-block;line-height:20px;background:rgba(0,0,0,0.5);transition: 0.3s;cursor: pointer; opacity: 0;}
.table_img:hover i{opacity: 1;transition: 0.3s;}
.table_img .radius{border-radius: 50%;}
.table_sm_img{width:30px; height:30px;position: relative;}
.table_sm_img img{width:30px; height:30px; position: absolute;  left: 0; top: 0; right: 0; bottom: 0; margin: auto; cursor: pointer;object-fit: cover;}
.table_sm_img i{width:20px; height:20px; text-align: center; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; color: #FFFFFF;border-radius: 50%;display: inline-block;line-height:20px;background:rgba(0,0,0,0.5);transition: 0.3s;cursor: pointer; opacity: 0;}
.table_sm_img:hover i{opacity: 1;transition: 0.3s;}
.table_icon{width:30px; height:30px; font-size: 24px!important; line-height: 30px; margin-top: 10px;}
.table_product_title{height:40px; margin-top: 5px; display: flex;}
.table_product_title .table_img{flex-shrink: 0}
.table_product_title .info{flex-grow: 1; height: 100%; display: flex; flex-direction: column; justify-content: space-between;box-sizing: border-box; width: 0;}
.table_product_title .info p{line-height: 13px; height: 13px; font-size: 13px; overflow: hidden; text-align: left;text-overflow: ellipsis; margin-top: 1px;}
.table_product_title .info span{display: flex;}
.table_product_title .info span i{font-size: 12px; line-height: 12px; padding:3px 4px;}
.table_product_title .info span em{width: 15px; height: 15px; display: flex; justify-content: center; align-items: center;}
.table_up_img{width:40px; height:40px; border-radius: 3px; cursor: pointer;border: 1px dashed #e5e5e5; overflow: hidden; background: #FFFFFF; margin-top: 5px; display: flex; justify-content: center; align-items: center;}
.table_up_img:hover{border: 1px dashed #009688;}
.table_up_img img{width: 40px; height: 40px; object-fit: cover; margin-top: 0;}
.table_product_stock{height:40px; margin-top: 5px; display: flex; align-items: center; justify-content: center;}
.table_ranking{width: auto; height:36px; margin-top: 7px; display: flex; flex-direction: column; justify-content: space-between; }
.table_ranking li{min-width: 50px; line-height: 14px; display: flex; justify-content: center;}
/* 操作 */
.operation{width: 100%; display: flex; justify-content: center; align-items: center;}

/* 无边框表格 */
.no_border .layui-table th,layui-table td,.no_border .layui-table-header,.no_border .layui-table-page,.no_border .layui-table-view{border: 0!important;}
.no_border .layui-table thead span{color:#000000;font-weight: 600!important;}
.no_border .layui-table-page {padding: 0!important; height: 26px!important; margin-top: 11px;}
.no_border .layui-none{color: #C5C8CE!important; font-size: 12px; margin-top: 20px;}

/* 分类 */
.classify_title{display: flex; align-items: center;}
.classify_title i{font-size: 14px!important;}

/* 昵称 */
.nickname{height: 100%; display: flex; align-items: center; justify-content: center;}
.nickname > .icon{font-size: 12px!important; margin-top: 1px;}

/* 表格搜索 */
.table_search{display: flex;height: 38px; align-items: center;}
.table_search .layui-input, .layui-select{height: 38px;!important;}

/* 弹出 */
.popup_box .button_box{text-align: center!important;}
.popup_box .userInfo{width: 100%; display: flex; flex-direction: column; border:#EEEEEE 1px solid; box-sizing: border-box; font-size: 13px;}
.popup_box .userInfo li{width: 100%; height: 45px; line-height: 45px; display: flex; border-bottom: #EEEEEE 1px solid;}
.popup_box .userInfo li:last-child{border-bottom: none;}
.popup_box .userInfo li span{width: 100px; text-align: center; border-right: #EEEEEE 1px solid; background: #f8f8f9;}
.popup_box .userInfo li p{flex-grow: 1; margin-left: 15px;}
.popup_box .layui-table, .layui-table-view {margin: 0!important;}

/* 图片弹出 */
.layui-layer-phimg{background: #FFFFFF; border-radius: 10px;}
.layui-layer-setwin .layui-layer-close2 {background:url(../image/close_off.png)!important; border-radius: 50px;}
.layui-layer-setwin .layui-layer-close2:hover{background:url(../image/close_on.png)!important;}
.layui-layer-photos .layui-layer-content {background: #FFFFFF;border-radius: 6px;}

/* 表单 */
.layui-input,.layui-select{border-radius: 4px!important;border: 1px solid #E8EAEC!important;padding: 0 10px!important;font-size: 13px!important; line-height: 38px!important;}
.layui-textarea{border-radius: 4px!important;border: 1px solid #E8EAEC!important;padding: 5px 10px!important;font-size: 13px!important; line-height: 24px!important;}
.layui-input::-webkit-input-placeholder, .layui-select::-webkit-input-placeholder, .layui-textarea::-webkit-input-placeholder{color: #C5C8CE!important;}
.layui-form-item{margin-bottom: 15px;clear: both;*zoom: 1;display: flex; justify-content: center; align-items: flex-start;}
.layui-form-item .layui-form-label {min-height: 38px!important;width: auto; display: flex!important;flex-direction: column!important;justify-content: center!important;align-items: flex-end!important;padding: 0!important;flex-shrink: 0!important;font-size: 13px!important;color: #515a6e!important;margin-right:15px!important;}
.layui-form-item .layui-form-label p {width: 100%;display: flex;align-items: center;justify-content: flex-end;}
.layui-form-label p.required:before{content: "*";display: inline-block;margin-right: 4px;line-height: 1;font-family: 'SimSun';font-size: 12px;color: #ed4014;}
.layui-form-item .layui-input-block{margin-left:0!important;min-height: 36px; flex-grow: 1;}
.layui-form-item .layui-input-block .exp{width: 100%; line-height: 1.6; font-size: 12px; margin-top: 15px; color: #B2B2B2;}
.layui-form-item .layui-input-block .exp b{color: #009688;margin: 0 12px; padding: 0 5px; position: relative; font-weight: 500;}
.layui-form-item .layui-input-block .exp b::before{position: absolute; left: -5px; top: -3px; content: '[';}
.layui-form-item .layui-input-block .exp b::after{position: absolute; right: -5px; top: -3px; content: ']';}
.layui-form-item .layui-input-block .txt{border-radius: 4px;border: 1px solid #E8EAEC;padding: 0 10px;font-size: 13px; line-height: 38px;}
.layui-form-item .layui-input-block .txts{border-radius: 4px;border: 1px solid #E8EAEC;padding: 5px 10px;font-size: 13px; line-height: 30px;}
.layui-form-item .layui-input-block .imgs{width: 100%; height: 80px; display: flex;}
.layui-form-item .layui-input-block .imgs img{width: 80px; height: 80px; border-radius: 4px;border: 1px solid #E8EAEC; box-sizing: border-box; object-fit: cover;}
.layui-layer-btn .layui-layer-btn0 {border-color: #009688;background-color: #009688;color: #fff;}
.layui-form-onswitch {border-color: #009688;background-color: #009688;}
.layui-form-checked[lay-skin=primary] i {border-color: #009688 !important;background-color: #009688;}
/*.layui-form-checked span, .layui-form-checked:hover span {background-color: #009688;}*/
.layui-form-checked i, .layui-form-checked:hover i {color: #009688;}
.layui-form-select dl dd.layui-this {background-color: #009688;color: #fff;}
.layui-layout-admin .layui-footer {background-color: #fff;z-index: 9999;}
.layui-form-radio > i {font-size: 18px!important;color: #C5C8CE!important;}
.layui-form-radio > i:hover, .layui-form-radioed > i {color: #009688!important;}
/*.layui-form-checkbox[lay-skin=primary] i {border: 1px solid #C5C8CE!important;}*/
.layui-checkbox-disbaled em {color: #FFFFFF!important;}

/* 面包屑 */
.layui-breadcrumb a:hover {color: #009688 !important;}

/* 图片上传按钮 */
.nm-image-box{width:100%; display: flex;}
.nm-image-box .img-list{display: flex;}
.nm-image-box .img-list .img{width:80px; height: 80px; border: 1px dashed #e5e5e5; border-radius: 5px; position: relative; cursor: pointer; overflow: hidden;}
.nm-image-box .img-list .img .img-wrap{width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;}
.nm-image-box .img-list .img .img-wrap img{width: 100%; height: 100%; object-fit: cover;}
.nm-image-box .img .operation{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); color: #fff; display: flex; flex-direction: column;border-radius: 5px; opacity: 0;}
.nm-image-box .img-list .img .operation p{width: 100%; height: 50px; display: flex; justify-content: center; align-items: center;}
.nm-image-box .img-list .img .operation p i{width: 24px; height: 24px; display: flex; justify-content: center; align-items: center; font-size: 24px;}
.nm-image-box .img-list .img .operation p i:nth-child(2){margin-left: 5px;}
.nm-image-box .img-list .img .operation span{width: 100%; height: 30px;background: rgba(0, 0, 0, 0.5); display: flex; justify-content: center; align-items: center; font-size: 12px;}
.nm-image-box .img-list .img:hover{border: 1px dashed #009688;}
.nm-image-box .img-list .img:hover .operation{opacity: 1;}
.nm-image-box .adds{width:80px; height: 80px; border: 1px dashed #e5e5e5; border-radius: 5px; position: relative; cursor: pointer; overflow: hidden; display: flex; justify-content: center; align-items: center; color: #000000; font-size: 20px;}

/* 图片管理器 */
.imageBox{width:930px; height: 385px; display: flex; justify-content: space-between; padding: 10px;}
/* 图片目录 */
.imageBox .imageFolder{width:200px; height: 100%; position: relative;}
.imageBox .imageFolder:after{width: 1px; height: 100%; background: #EEEEEE; position: absolute; right: -30px; top: 0; content: ''; }
.imageBox .imageFolder li{width: 100%; height: 22px; display: flex; justify-content: space-between;}
.imageBox .imageFolder li:not(:last-child){margin-bottom: 18px;}
.imageBox .imageFolder li .title{display: flex; align-items: center;color: #666666;}
.imageBox .imageFolder li .title i{height: 14px; display: flex; justify-content: center; align-items: center; font-size: 16px;}
.imageBox .imageFolder li .title p{line-height: 22px; font-size: 12px; cursor: pointer;}
.imageBox .imageFolder li.on .title{color: #009688;}
.imageBox .imageFolder li:hover .title{color: #009688;}
.imageBox .imageFolder li .icons{display: flex; align-items: center;}
.imageBox .imageFolder li .icons i{width: 22px; height: 22px; display: flex; justify-content: center; align-items: center; border:#EEEEEE 1px solid;border-radius: 4px; font-size: 15px; cursor: pointer; color: #666666; padding: 0;}
.imageBox .imageFolder li .icons i:hover{color: #FFFFFF; background:#009688;  border:#009688 1px solid;}
/* 图片图集 */
.imageBox .imageAlbum{width: 670px; height: 100%; display: flex; flex-direction: column; align-items: center;}
.imageBox .imageAlbum .imageTool{width:100%; height: 38px; display: flex; align-items: center;}
.imageBox .imageAlbum .imageTool li{font-size: 12px;}
.imageBox .imageAlbum .imageTool li button{font-size: 12px;}
.imageBox .imageAlbum .atlas{width: 670px; display: flex; flex-direction: column; align-items: center;}
.imageBox .imageAlbum .atlas .list{width: 100%; height: 276px; display: flex; flex-wrap: wrap;}
.imageBox .imageAlbum .atlas .list li{width: 118px; height: 118px; margin: 20px 20px 0 0; position: relative;background: #F8F8F8;}
.imageBox .imageAlbum .atlas .list li:nth-child(5n){margin-right: 0;}
.imageBox .imageAlbum .atlas .list li img{width: 100%; height: 100%; object-fit: cover; box-sizing: border-box;cursor: pointer;}
.imageBox .imageAlbum .atlas .list li p{height: 20px; position: absolute; left: 7px; top: 7px; display: flex;}
.imageBox .imageAlbum .atlas .list li p span{width: 20px; height: 20px; font-size: 15px; margin-right: 5px; border-radius: 2px; display: flex; justify-content: center; align-items: center; background: rgba(0,0,0,0.5);}
.imageBox .imageAlbum .atlas .list li p span:last-child{margin-right: 0;}
.imageBox .imageAlbum .atlas .list li i{position: absolute; right: 5px; top: 1px; z-index: 2; font-style: normal; color: #FFFFFF;}
.imageBox .imageAlbum .atlas .list li.off img{border: #EEEEEE 2px solid;}
.imageBox .imageAlbum .atlas .list li.off i{opacity: 0;}
.imageBox .imageAlbum .atlas .list li.on:after{position: absolute; right: 2px; top: 2px; border: 15px solid; border-color: transparent;border-top-color: #009688;border-right-color: #009688;content: ''}
.imageBox .imageAlbum .atlas .list li.on img{border: #009688 2px solid;}
.imageBox .imageAlbum .atlas .list li.on i{opacity: 1;}
.imageBox .imageAlbum .atlas .pages{height: 30px; margin-top: 30px;}
.imageBox .imageAlbum .atlas .pages .layui-laypage{margin: 0!important;}
/* 图集空状态 */
.imageBox .imageAlbum .empty{width: 300px; height: 200px; margin-top: 70px; display: flex; flex-direction: column; justify-content: space-between; align-items: center;}
.imageBox .imageAlbum .empty img{width: 150px; height: 150px;}
.imageBox .imageAlbum .empty p{line-height: 14px; height: 14px;}
/* 图片上传 */
.imageUp{width: 690px; height: 427px; display: flex; flex-direction: column; font-size: 13px;}
.imageUp .upTop{width: 100%; height: 38px;}
.imageUp .upSuccess{width: 100%; height: 38px; background: #e5f4f3;border: 1px dashed #99d5cf;border-radius: 2px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; padding: 0 10px;}
.imageUp .upSuccess p{color:#009688; }
.imageUp .upSuccess p h9{color: #009688; margin: 0 12px; padding: 0 5px; position: relative; font-weight: 500;}
.imageUp .upSuccess p h9::before{position: absolute; left: -5px; top: -4px; content: '[';}
.imageUp .upSuccess p h9::after{position: absolute; right: -5px; top: -4px; content: ']';}
.imageUp .upSuccess i{height: 22px;width: 22px;background: #3dafa4;border-radius: 50%;cursor: pointer; display: flex; justify-content: center; align-items: center; color: #FFFFFF; font-size: 14px;}
.imageUp .upSuccess i:hover{background: #009688;transform:rotate(180deg);}
.imageUp .upWait{width: 100%; height: 369px; border: #EEEEEE 1px dashed; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 4px;}
.imageUp .upWait img{width: 100px; height: 100px;}
.imageUp .upWait p{line-height: 14px; height: 14px; margin-top: 30px;}
.imageUp .upCenter{width: 100%; display: flex; flex-direction: column;}
.imageUp .upCenter .header{background: #F8F8F8;display: flex; flex-direction: column;}
.imageUp .upCenter .header ul{width: 100%; height: 45px; display: flex;}
.imageUp .upCenter .list{height: 324px;overflow-y : auto;}
.imageUp .upCenter .list ul{width: 100%; height: 54px; display: flex; background: #FFFFFF; border-bottom: #EEEEEE 1px solid; box-sizing: border-box; flex-shrink: 0;}
.imageUp .upCenter ul li{height: 100%; display: flex; align-items: center; justify-content: center;}
.imageUp .upCenter ul li.fileTitle{width:392px; box-sizing: border-box; display: flex;}
.imageUp .upCenter ul li.fileTitle img{width: 30px; height: 30px; object-fit: cover; border-radius: 2px; flex-shrink: 0;}
.imageUp .upCenter ul li.fileTitle span{flex-grow: 1; display: block; margin-left: 10px; overflow:hidden;white-space: nowrap;text-overflow: ellipsis;}
.imageUp .upCenter ul li.fileSize{width: 100px; flex-shrink: 0;}
.imageUp .upCenter ul li.fileStatus{width: 100px; flex-shrink: 0;}
.imageUp .upCenter ul li.fileButton{width: 102px;flex-shrink: 0; overflow: hidden;}
/* 图片详情 */
.imageDetailed{width: 350px; display: flex; flex-direction: column; align-items: center;}
.imageDetailed .top{width: 100%; height: 50px; display: flex; justify-content: space-between; border-bottom: #EEEEEE 1px solid; padding-bottom: 20px;}
.imageDetailed .top .image{width: 50px; height: 100%; border: #EEEEEE 1px solid; box-sizing: border-box; border-radius: 4px; overflow: hidden; position: relative; display: flex; justify-content: center; align-items: center;}
.imageDetailed .top .image img{width: 100%; height: 100%; object-fit: cover; }
.imageDetailed .top .image i{width: 20px; height: 20px; font-size: 14px; position: absolute; background: rgba(0,0,0,0.5); display: flex; justify-content:center; align-items: center;}
.imageDetailed .top .info{width: 290px; height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.imageDetailed .top .info li{display: flex;}
.imageDetailed .cent{width: 100%; display: flex; flex-direction: column;}
.imageDetailed .cent li{width: 100%; padding: 10px 0; border-bottom: #EEEEEE 1px solid; display: flex; justify-content: space-between;}
.imageDetailed .th{width: 100%; padding: 10px 0; display: flex;}
.imageDetailed .tb{width: 100%; height: 185px; overflow: hidden;}
.imageDetailed .tb ul{width: 370px; height: 100%; overflow-y: auto;}
.imageDetailed .tb ul li{width: 350px; height: 50px; line-height: 50px; display: flex; align-items: center; border-bottom: #EEEEEE 1px solid;}
.imageDetailed .tb ul li span{display: flex; justify-content: center; align-items: center;}
.imageDetailed .tb ul li span i{width: 21px; height: 21px; font-size: 14px; border-radius: 50%; display: flex; justify-content: center; align-items: center;}

/*错误404提示*/
.error-box{width:100%;height:500px;display: flex; flex-direction: column; align-items: center; justify-content: center;}
.error-box h2{font-size: 100px; line-height:80px;font-weight: bold;color: #009688; letter-spacing:10px;}
.error-box i{font-size: 50px; line-height:50px;color: #009688;}
.error-box p{line-height: 14px; font-size: 14px; color: #009688; margin-top: 30px;}
.error-box a{width: 160px; height: 40px; background: #009688; margin-top: 30px;border-radius: 50px;color: #ffffff; text-decoration: none; text-align: center; line-height: 40px;}

/* 头部区域 */
.layui-nav-bar {display: none;}
.layui-header {background-image: linear-gradient(90deg, #009688 20%,#06b5a5 80%)!important;}
.layui-header {height: 66px!important;}
.layui-header .layui-nav{display: flex;}
.layui-header .layui-nav .layui-this:after{display: none!important;}
.layui-header .layui-nav .layui-nav-item {height: 66px!important;line-height: 66px!important;margin: 0!important;position: relative;}
.layui-header .layui-nav .layui-nav-item:hover{background: #027b70; display: block;}
.layui-header .layui-nav .layui-nav-item a{padding:0 20px;}
.layui-header .layui-nav .layui-nav-item a,.layui-header .layui-nav .layui-nav-item a cite{height: 100%;color: #FFFFFF!important;}
.layui-header .layui-layout-left{padding: 0!important;}
.layui-header .layui-layout-right .remind {position: absolute;padding: 0 5px;min-height: 14px;text-align: center;line-height: 14px;background: #ff5722;border-radius: 4px;font-size: 6px;top: 20px;left: 30px;}
.layui-header .layui-layout-right .select_padding{padding-right: 20px;!important;position: relative!important;}
.layui-header .layui-layout-right .layui-nav-more{right:15px;!important;border-top-color: #FFFFFF!important;}
.layui-header .layui-layout-right .layui-nav-mored{border-color: transparent!important; border-bottom-color: #FFFFFF!important;}
.layui-header .layui-layout-right .layui-nav-child{top: 70px!important;}
.layui-header .layui-layout-right .layui-nav-child a{color: #333!important;}
.layui-header .layui-layout-right .layui-nav-child a:hover {background-color: #e5f4f3!important;color: #000000!important;}
.layui-header .layui-layout-right .layui-badge-dot{margin-left: 0;}

/* 侧边菜单 */
.layui-side {width: 180px!important;box-shadow: 2px 0 8px 0 rgba(29,35,41,.05)!important;background-color: #FFFFFF!important;}
.layui-side-menu .layui-logo {width: 180px!important; height: 66px!important; padding: 0!important; display: flex; justify-content: center; align-items: center;background-color: #009688!important;box-shadow:none!important;color: #FFFFFF!important;}
.layui-side-menu .layui-logo img{max-width: 130px; max-height: 30px;}
.layui-side-menu .layui-side-scroll {width: 200px!important;}
.layui-side-menu .layui-nav-tree{width: 180px!important;margin-top: 66px!important;background: none!important;}
.layui-side-menu .layui-nav .layui-nav-item {position: static!important;}
.layui-side-menu .layui-nav-tree .layui-nav-item a{height: 48px!important;color: #515a6e!important; display: flex; align-items: center; padding:0 15px 0 20px!important;box-sizing: border-box!important; justify-content: space-between;}
.layui-side-menu .layui-nav-tree .layui-nav-item .iconfont{position: static!important;font-size: 19px!important; flex-shrink:0; margin-top: inherit!important;}
.layui-side-menu .layui-nav-tree .layui-nav-item .layui-icon{position: static!important;font-size: 10px!important; flex-shrink:0; margin-top: inherit!important;}
.layui-side-menu .layui-nav-tree .layui-nav-item cite{flex-grow: 1; margin-left: 15px;}
.layui-side-menu .layui-nav-tree .layui-nav-item span{display: none!important;}
.layui-side-menu .layui-nav-tree .layui-nav-item em{width: 12px; height: 16px; display: flex; justify-content: center; align-items: center;}
.layui-side-menu .layui-nav-tree .layui-nav-item a:hover{color: #009688!important;}
.layui-side-menu .layui-nav-tree .layui-nav-itemed em{transform: rotate(180deg);}
.layui-side-menu .layui-nav-tree .layui-this a, .layui-side-menu .layui-nav-tree .layui-nav-item .layui-nav-child dd.layui-this a{background-color: #e5f4f3;border-right: 2px #009688 solid;box-sizing: border-box;transition: none!important;color: #009688!important;}
.layui-side-menu .layui-nav-tree .layui-nav-item .layui-nav-child a{padding-left: 54px!important;}
.layui-side-menu .layui-nav-tree .layui-this a:hover,.layui-side-menu .layui-nav-tree .layui-nav-item .layui-nav-child a:hover{background-color: #e5f4f3!important;}
.layui-nav-itemed > .layui-nav-child {display: block;padding: 0;background-color: #FFFFFF!important;}
.layui-side-menu .layui-nav .layui-nav-itemed > .layui-nav-child {padding: 0!important;}

/* 主体内容 */
.layui-layout-admin .layui-layout-left, .layadmin-pagetabs, .layui-layout-admin .layui-body, .layui-layout-admin .layui-footer {left:180px!important;}
.layui-body {top: 66px!important;}

/* 右侧弹出 */
.layui-layer-adminRight {top: 66px !important;}

/* 实时概况 */
.real{width: 100%; height: 240px; display: flex; flex-direction: column; padding: 0 20px; box-sizing: border-box;box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);}
.real .real-top{width: 100%; height: 60px; display: flex; justify-content: space-between; align-items: center;border-bottom: #F6F6F6 1px solid;}
.real .real-top p{font-size: 15px;}
.real .real-top em{width: 40px; height: 20px; text-align: center; line-height: 20px; border:#009688 1px solid; border-radius: 4px; font-size: 12px;}
.real .real-center{flex-grow: 1; display: flex; flex-direction: column; justify-content: center;}
.real .real-center h2{font-size: 36px;font-weight: 400;}
.real .real-center p{display: flex; align-items: center;}
.real .real-center p i{ display: flex; justify-content: center; align-items: center; font-size: 12px!important;}
.real .real-center p i.up{transform: rotate(-135deg); margin-top: 3px;}
.real .real-center p i.down{transform: rotate(45deg); margin-top: -6px;}
.real .real-bottom{width: 100%; height: 50px; display: flex; justify-content: space-between; align-items: center; border-top: #F6F6F6 1px solid;}

/* 快捷方式 */
.quick{width: 100%; height:286px; display: flex; flex-direction: column; align-items: center;box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);}
.quick dt{width: 100%; height: 60px; border-bottom: #F6F6F6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.quick dt p{font-size: 15px;}
.quick dd{width: 100%;}
.quick dd ul{width: 100%;display: flex; flex-wrap: wrap;}
.quick dd ul li{width: calc((100% - 75px) / 4); height: 90px; background: #f5f7f9; margin: 15px 0 0 15px;}
.quick dd ul li a{width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;color: #666666; border-radius: 4px;text-align: center;}
.quick dd ul li a span{font-size: 28px; line-height: 26px; font-weight: 400;}
.quick dd ul li a i{width: 100%; height: 30px; line-height: 30px; font-size: 30px;color: #009688!important;font-style:normal;}
.quick dd ul li a p{width: 100%; height: 14px; line-height: 14px;}
.quick dd ul li a:hover i{color: #027b70!important;}
.quick dd ul li a:hover p{color: #333333!important;}

/* 图表 */
.plot{width: 100%; height: 500px; display: flex; flex-direction: column; align-items: center;box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);}
.plot dt{width: 100%; height: 60px; border-bottom: #F6F6F6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.plot dt p{font-size: 15px;}
.plot dd{width: calc(100% - 30px); height: 404px;}

/* 操作帮助 */
.help{width: 100%; height: 100%; display: flex; flex-direction: column;}
.help li{line-height: 30px; position: relative;}
.help li:not(:first-child){margin-top:6px;}
.help li i{color: #009688; margin-right: 8px;}
.help li b{color: #009688; margin: 0 10px;}

/* 图标选择器 */
.layui-iconpicker {max-width: 100%;}
.layui-iconpicker-item {border: 1px solid #E8EAEC;box-sizing: border-box;border-radius: 4px;cursor: pointer;position: relative;display: flex;align-items: center;}
.layui-iconpicker-icon {border-radius: 4px;box-sizing: border-box;display: block;height: 100%;background: #fff;transition: all .3s;flex-grow: 1;}
.layui-iconpicker-icon i {line-height: 38px;font-size: 24px;margin-left: 10px; width: 20px;}
.layui-iconpicker-item > .layui-edge {flex-shrink: 0;}
.layui-iconpicker-item:hover {border-color: #009688 !important;}
.layui-iconpicker.layui-form-selected .layui-iconpicker-item {border-color: #009688!important;box-shadow: 0 0 0 2px rgba(0,150,136,.2)}
.layui-iconpicker .layui-anim {display: none;position: absolute;left: 0;top: 45px;z-index: 899;min-width: 100%;border: 1px solid #E8EAEC;background-color: #fff;border-radius: 4px;box-shadow: 0 2px 4px rgba(0, 0, 0, .12);box-sizing: border-box;}
.layui-iconpicker.layui-form-selected .layui-anim {display: block;}
.layui-iconpicker .layui-iconpicker-list .layui-iconpicker-icon-limit{overflow: hidden; padding-bottom: 15px;}
.layui-iconpicker .layui-iconpicker-icon-item {width: calc((100% - 135px) / 8);height: 42px;cursor: pointer;display: flex;justify-content: center;align-items: center;margin-left: 15px;margin-top: 15px;border: 1px solid #E8EAEC;border-radius: 4px;float: left;box-sizing: border-box;}
.layui-iconpicker .layui-iconpicker-icon-item:nth-child(8n){margin-right: 0;}
.layui-iconpicker .layui-iconpicker-icon-item i.iconfont {font-size: 24px!important;}
.layui-iconpicker .layui-iconpicker-icon-item:hover {background-color: #ebf7f6;}

/* 块状 */
.layui-elem-field{margin-bottom: 15px!important;}
.layui-elem-field legend{font-weight: bold!important; font-size: 16px!important;}
.layui-field-box {padding: 15px 15px 15px 15px!important;}

/* 批量设置 */
.allSet{width: 100%; height: 100%; display: flex; flex-direction: column;}
.allSet .msg{width: 100%; height: 38px; line-height: 38px; background: #e5f4f3;border: 1px dashed #99d5cf; box-sizing: border-box; padding: 0 10px;}
.allSet .cent{width: 100%; height: 300px; display: flex; border-bottom: #E8EAEC 1px solid; padding-bottom: 20px;}
.allSet .cent .allLeft{width: 100px; border-right: #E8EAEC 1px solid; display: flex; flex-direction: column;}
.allSet .cent .allLeft li{width: 100%; margin-bottom: 20px;}
.allSet .cent .allLeft li.off{color: #666666;}
.allSet .cent .allLeft li.on{color: #009688; font-weight: bold;}
.allSet .cent .allRight{flex-grow: 1; display: flex; flex-direction: column;}
.allSet .butt{width: 100%; display: flex; justify-content: center;}

/* 链接选择 */
.getUrl{width: 100%; height: 100%; display: flex; flex-direction: column;}
.getUrl .cent{width: 100%; height: 450px; display: flex; flex-direction: column; border-bottom: #E8EAEC 1px solid; padding-bottom: 20px;}
.getUrl .cent .types{width: 100%; display: flex; flex-wrap: wrap; margin-top: 10px; margin-bottom: 20px;}
.getUrl .cent .types li{height: 30px; line-height: 30px; font-size: 12px; padding: 0 15px; border-radius: 2px; margin: 10px 10px 0 0; cursor: pointer;}
.getUrl .cent .types li.off{border: #EEEEEE 1px solid;}
.getUrl .cent .types li.on{border: #009688 1px solid;background: #e5f4f3; color: #009688;}
.getUrl .cent .select{display: flex; flex-direction: column;}
.getUrl .cent .select .layui-form-select dl{top: auto;bottom: 40px;}
.getUrl .butt{width: 100%; display: flex; justify-content: center;}

/* 风格选择 */
.getStyle{width: 100%; height: 100%; display: flex; flex-direction: column;}
.getStyle .cent{width: 100%; height: 450px; display: flex; flex-direction: column; border-bottom: #E8EAEC 1px solid; padding-bottom: 20px; overflow: hidden;}
.getStyle .cent ul{width: calc(100% + 20px); height: 100%; overflow-y: auto; display: flex; flex-wrap: wrap;}
.getStyle .cent ul li{width: 200px; display: flex; flex-direction: column; align-items: center; margin: 20px 20px 0 0;}
.getStyle .cent ul li:nth-child(-n+4){margin-top: 0;}
.getStyle .cent ul li:nth-child(4n){margin-right: 0;}
.getStyle .cent ul li .image{width: 196px; overflow: hidden; position: relative;}
.getStyle .cent ul li .image img{width: 100%;}
.getStyle .cent ul li.off .image{border: #EEEEEE 2px solid;}
.getStyle .cent ul li.on .image{border: #009688 2px solid;}
/* 列表风格 */
.getStyle .cent ul.lists li .image{height: 200px;}
/* 提交按钮 */
.getStyle .butt{width: 100%; display: flex; justify-content: center;}

/* 首页装修 */
.diy{width: 100%; height: 100%; display: flex; justify-content: space-between;}
/* 左侧模块 */
.diy .model{width: 300px; padding: 0 20px; box-sizing: border-box; display: flex; flex-direction: column; align-items: self-start;}
.diy .model dt{width: 100%; height: 50px; display: flex; align-items: center;}
.diy .model dt i{width: 15px; height: 15px; font-size: 18px;}
.diy .model dt p{line-height: 14px;}
/* 模块 */
.diy .model .icons{max-width: 258px; display: flex; flex-wrap: wrap; position: relative;}
.diy .model .icons::after{width: 100%; height: 100%; position: absolute; content: '';border-top: #EEEEEE 1px solid; border-left: #EEEEEE 1px solid;}
.diy .model .icons li{width: 86px; height: 86px; border: #EEEEEE 1px solid; border-left: 0; border-top: 0; box-sizing: border-box; position: relative; z-index: 2;display: flex; flex-direction: column; justify-content: center; align-items: center; color: #666666; cursor: pointer;}
.diy .model .icons li i{width: 24px; height: 24px; font-size: 30px;}
.diy .model .icons li p{font-size: 12px; margin-top: 8px;}
.diy .model .icons li::after{width: 100%; height: 100%; position: absolute; content: ''; box-sizing: border-box; border: #009688 1px solid; visibility: hidden;}
.diy .model .icons li:hover{ background: #e5f4f3; color: #009688; }
.diy .model .icons li:hover::after{border: #009688 1px solid; visibility: visible;}
.diy .model .icons li.select{color: #009688;}
/* 表单设置 */
.diy .setting{width: 400px; margin-bottom: 64px; overflow: hidden;}
.diy .setting .dl{width: 420px; height: 100%; overflow-y: auto; }
.diy .setting .dl .dd{width: 400px; height: 100%; padding: 0 20px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center;}
.diy .setting .dl .dd.off{display:none;}
.diy .setting .dl .dd .title{width: 100%; height: 60px; line-height: 60px; border-bottom: #EEEEEE 1px solid; font-size: 18px;}
.diy .setting .dl .dd .sub_title{width: 100%; padding: 20px 0; display: flex; flex-direction: column; align-items: self-start!important; border-bottom: #EEEEEE 1px solid;}
.diy .setting .dl .dd .forms{width: 100%; display: flex; flex-direction: column; padding-bottom: 30px;}
.diy .setting .dl .dd .forms .column{display: flex; flex-direction: column;}
.diy .setting .dl .dd .forms .off{display: none;}
.diy .setting .dl .dd .forms li{display: flex; justify-content: space-between; align-items: center; position: relative;}
.diy .setting .dl .dd .forms li label{flex-shrink: 0;}
.diy .setting .dl .dd .forms li .color{position: absolute; right: 8px;}
.diy .setting .dl .dd .forms li .img{margin-right: 0!important;}
.diy .setting .dl .dd .forms li .layui-input-block{margin-left: 0!important;}
.diy .setting .dl .dd .forms li .ps{display: flex;}
.diy .setting .dl .dd .forms li .time{width: 20px; height: 20px; font-size: 20px; position: absolute; right: 8px;}
.diy .setting .dl .dd .forms li .icon{width: 20px; height: 20px;}
.diy .setting .dl .dd .forms li .layui-form-radio{margin: 0!important; padding: 0!important;}
.diy .setting .dl .dd .forms li .icons{display: flex;}
.diy .setting .dl .dd .forms li .icons .ico{width: 50px; height: 30px; font-size: 20px; display: flex; justify-content: center; align-items: center;}
.diy .setting .dl .dd .forms li .icons .ico.off{border: #EEEEEE 1px solid; color: #999999;}
.diy .setting .dl .dd .forms li .icons .ico.on{border: #009688 1px solid;background: #e5f4f3; color: #009688;}
.diy .setting .dl .dd .forms li .banner{width: 80px;height: 80px;border: 1px dashed #e5e5e5;border-radius: 5px; position: relative; display: flex; justify-content: center; align-items: center;}
.diy .setting .dl .dd .forms li .banner .close{width: 20px; height: 20px; background: #009688; position: absolute; top: -8px; right: -8px; border-radius: 50%; display: flex; justify-content: center; align-items: center;}
.diy .setting .dl .dd .forms li .banner .msg{width: 100%; height: 25px; background: rgba(0,0,0,0.5); display: flex; justify-content: center; align-items: center; position: absolute; left: 0; bottom: 0;}
.diy .setting .dl .dd .forms li .imageUl{height: 80px; display: flex; flex-direction: column; justify-content: space-between;}
.diy .setting .dl .dd .forms li .imageUl .link{display: flex; justify-content: space-between; align-items: center;}
.diy .setting .dl .dd .forms li .imageUl .link .url_title{width: 180px; height: 20px; overflow: hidden; text-align: right; text-overflow: ellipsis;}
.diy .setting .dl .dd .forms li .add{width: 100%; height: 50px; border-radius: 4px; border: #EEEEEE 1px solid; box-sizing: border-box; display: flex; justify-content: center; align-items: center;}
.diy .setting .dl .dd .forms li .add .iconfont{font-size: 20px;}
.diy .setting .dl .dd .forms li .img-wrap{background: #F4F4F4;}
/* 页面展示 */
.diy .page{width: 375px; margin-top: 50px; margin-bottom: 114px; overflow: hidden; position: relative; border: #FFFFFF 5px solid;}
/* 顶部 */
.diy .page .head{width: 100%; height: 68px; position: absolute; top: 0; left: 0; background: url("../image/xcx_head.png") no-repeat; display: flex; align-items: center; z-index: 5;}
.diy .page .head .info{width: 240px; height: 30px; margin-top: 20px; position: relative; display: flex; align-items: center;}
.diy .page .head .on{display: flex;}
.diy .page .head .off{display: none;}
.diy .page .head .logo{max-width:50px;max-height: 24px; position: absolute; left: 0; top: 0; bottom: 0; margin: auto;}
.diy .page .head .input{width: 180px; min-width: 180px; max-width: 240px; height: 30px; line-height: 30px; background: #F8F8F8; position: absolute; top: 0; right: 0; display: flex; align-items: center; padding: 0 10px; box-sizing: border-box; z-index: 1;}
.diy .page .head .input i{width: 15px; height: 15px;}
.diy .page .head_bg{width: 100%; height: 68px; position: absolute; top: 0; left: 0; z-index: 3; opacity: 0;}
.diy .page .head_title{width: 100%; height: 68px; line-height: 30px; position: absolute; top: 0; left: 0; z-index: 4; padding-top: 28px; padding-left: 10px; box-sizing: border-box;}
.diy .page .head_title.on{display: block;}
.diy .page .head_title.off{display: none;}
/* 弹出 */
.diy .page .eject{width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0,0,0,0.5); z-index: 6; display: flex; justify-content: center; align-items: center;}
.diy .page .eject .adv{max-width: 300px; display: flex; flex-direction: column; align-items: center;}
.diy .page .eject .adv img{max-width: 100%; max-height: 400px;}
.diy .page .eject .adv .close{width: 30px; height: 30px; font-size: 20px; border: #FFFFFF 1px solid;}
/* 收藏 */
.diy .page .follow{padding: 0 12px 0 15px; height: 30px; line-height: 30px; background:rgba(0,0,0,0.8); position: absolute; right: 12px; top: 70px; z-index: 5; display: flex; align-items: center;}
.diy .page .follow::after{position: absolute;content: "";width: 0;height: 0;border-width: 6px;border-style: solid;border-color: transparent transparent rgba(0,0,0,0.8) transparent;;top:-12px;right: 65px;}
.diy .page .follow .close{width: 16px; height: 16px; font-size: 12px; margin-left: 3px;}
/* 主体 */
.diy .page .xcx{width: 395px; height: 100%; overflow-y: auto; position: relative;}
.diy .page .xcx .cent{width: 375px; display: flex; flex-direction: column; align-items: center; font-size: 12px; padding-top: 68px; padding-bottom: 46px; position: relative; overflow: hidden;}
/* 铺满 */
.diy .page .full{width: 375px; height: 100%; padding-top: 68px; overflow: hidden;}
.diy .page .full img{width: 100%;}
/* 背景 */
.diy .page .xcx .cent .bg{width: 180%; height: 180px; position: absolute; top: 0; left: -40%; border-radius: 0 0 50% 50%;}
.diy .page .xcx .cent .bg_image{width: 100%; height: 500px; position: absolute; top: 0;}
.diy .page .xcx .cent .bg_image image{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.diy .page .xcx .cent .bg_image .bg_mask{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background:linear-gradient(rgba(245,247,250,0) 50%,rgba(245,247,250,1));}
/* 轮播 */
.diy .page .xcx .cent .banner{width: 355px; height: 155px; z-index: 2; position: relative; display: flex; justify-content: center; overflow: hidden;}
.diy .page .xcx .cent .banner img{width: 100%; height: 100%;}
.diy .page .xcx .cent .banner .banner_indicator{width: 200px; height: 4px; position: absolute; bottom: 15px;}
/* 金刚区 */
.diy .page .xcx .cent .kingkong{width: 355px;padding:0 15px 15px 15px; box-sizing: border-box; display: flex; flex-wrap: wrap; z-index: 1; position: relative;}
.diy .page .xcx .cent .kingkong li{display: flex; flex-direction: column; justify-content: space-between;align-items: center; margin-right: 21px; margin-top: 15px;}
.diy .page .xcx .cent .kingkong li:nth-child(5n){margin-right: 0;}
.diy .page .xcx .cent .kingkong li img{width: 48px;height: 48px;}
/* 热门活动 */
.diy .page .xcx .cent .hots{width: 355px; height: 85px; display: flex; justify-content: space-between; z-index: 1; position: relative;}
.diy .page .xcx .cent .hots img{width: 173px; height: 100%;}
/* 营销专题 */
.diy .page .xcx .cent .market{width: 355px; height: 170px; display: flex; justify-content: space-between; z-index: 1; position: relative;}
.diy .page .xcx .cent .market .l_img,.diy .page .xcx .cent .market .r_img{width: 173px; height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.diy .page .xcx .cent .market .big{width: 100%; height: 100%;}
.diy .page .xcx .cent .market .small{width: 100%; height: 80px;}
/* 商品 */
.diy .page .xcx .cent .productBox{width: 355px; display: flex; flex-direction: column; align-items: center; z-index: 2; position: relative;}
/* 标题 */
.diy .page .xcx .cent .headline{width: 100%; padding:10px 0; display: flex; justify-content: center; align-items: center; position: relative; z-index: 1;}
.diy .page .xcx .cent .headline .en{font-size: 35px; line-height: 35px; opacity: 0.05;letter-spacing: 5px;}
.diy .page .xcx .cent .headline .title{height: 18px; position: absolute; display: flex; flex-direction: row; align-items: center;}
.diy .page .xcx .cent .headline .title .icon{font-size: 22px; line-height: 22px;}
/* 商品列表 */
.diy .page .xcx .cent .block_product{width: 100%; display: flex; flex-wrap: wrap; z-index: 1;}
.diy .page .xcx .cent .block_product li{width: 172px; height: 264px; overflow: hidden; margin-top: 10px; margin-right: 10px; display: flex; flex-direction: column;}
.diy .page .xcx .cent .block_product li:nth-child(2n){margin-right: 0;}
.diy .page .xcx .cent .block_product li img{width: 100%; height: 172px; background: #FCFCFC;}
.diy .page .xcx .cent .block_product li .title{width: 153px; line-height: 14px; font-size: 14px;}
.diy .page .xcx .cent .block_product li .price{width: 153px; display: flex; align-items: center;}
/* 商品平铺 */
.diy .page .xcx .cent .row_product{width: 355px; display: flex; flex-direction: column; z-index: 1;}
.diy .page .xcx .cent .row_product li{width: 100%; height: 130px; padding: 10px; box-sizing: border-box; margin-top: 10px; display: flex; justify-content: space-between; align-items: center;}
.diy .page .xcx .cent .row_product li img{width: 110px; height: 110px; background: #FCFCFC;}
.diy .page .xcx .cent .row_product li .info{width: 210px; height: 100%; display: flex; flex-direction: column;}
.diy .page .xcx .cent .row_product li .info .title{line-height: 14px; font-size: 14px;}
.diy .page .xcx .cent .row_product li .info .sub_title{line-height: 24px;}
.diy .page .xcx .cent .row_product li .price{display: flex; align-items: center;}
/* 加载更多 */
.diy .page .xcx .cent .more{height: 15px; padding: 15px 0; display: flex; align-items: center;}
.diy .page .xcx .cent .more img{width: 15px; height: 15px;}
/* 底部 */
.diy .page .foot{width: 100%; height: 46px; position: absolute; bottom: 0; left: 0; background: url("../image/xcx_foot.png") no-repeat;z-index: 9;}
/* 鼠标经过 */
.diyPageOver:hover::after{width:100%; height: 100%; position: absolute; left: 0; top: 0; border: #009688 1px dashed;background: rgba(229,244,243,0.25); box-sizing: border-box; content: ''; z-index: 9;}
/* 选中 */
.diyPageSelect::after{width:100%; height: 100%; position: absolute; left: 0; top: 0; border: #009688 1px dashed;background: rgba(229,244,243,0.2); box-sizing: border-box; content: ''; z-index: 9;}
/* 订单统计 */
.order_count{width: 100%; height: 110px; display: flex; justify-content: space-between;}
.order_count ul{width: 100%; height: 100%; display: flex; justify-content: space-between;}
.order_count li{width: calc((100% - 45px) / 4); height: 100%; padding: 25px; box-sizing: border-box; display: flex; align-items: center; }
.order_count li i{width: 48px; height: 48px; border-radius: 50px; font-size: 26px;}
.order_count li i.a{background: #009688; border: #d9efed 6px solid;}
.order_count li i.b{background: #ff5722; border: #ffe6de 6px solid;}
.order_count li i.c{background: #1e9fff; border: #ddf1ff 6px solid;}
.order_count li i.d{background: #2f4056; border: #e0e3e6 6px solid;}
.order_count li p{height: 50px; display: flex; flex-direction: column; justify-content: space-between;}
.order_count li p span{font-size: 24px;}
.order_count li p em{font-size: 12px;}
/* 订单列表 */
.order_box{width: 100%; font-size: 13px;}
/* 选项卡 */
.tabs{width: 100%; height: 45px; display: flex; position: relative;}
.tabs::after{width: 100%; height: 1px; background: #F2F2F2; position: absolute; left: 0; bottom: 0; content: ''}
.tabs li{height: 100%; padding: 0 20px; border: #F2F2F2 1px solid; border-bottom: 0; box-sizing: border-box; z-index: 2; margin-left: -1px; display: flex; justify-content: center; align-items: center; cursor: pointer;}
.tabs li:first-child{border-radius: 4px 0 0 0; margin-left: 0;}
.tabs li:last-child{border-radius: 0 4px 0 0;}
.tabs li.off{height: 44px; background: #F8F8F8;}
.tabs li.on{height: 45px; background: #FFFFFF;}
/* 栏目 */
.order_box .title{width: 100%; height: 45px; background: #F8F8F8; display: flex;}
.order_box .title li{display: flex; justify-content: center; align-items: center;}
/* 订单 */
.order_box .orders{width: 100%; display: flex; flex-direction: column; min-height: 500px;}
.order_box .orders .order{width: 100%; border: #F2F2F2 1px solid; box-sizing: border-box; display: flex; flex-direction: column;}
.order_box .orders .order .dt{width: 100%; height: 40px;  background: #F8F8F8; border-bottom: #F2F2F2 1px solid; display: flex; justify-content: space-between;}
.order_box .orders .order .ps{display: flex; align-items: center;}
.order_box .orders .order .dd{width: 100%; display: flex; font-size: 13px;}
.order_box .orders .order .dd ul{display: flex; justify-content: center; align-items: center; border-right: #F2F2F2 1px solid; box-sizing: border-box;}
.order_box .orders .order .dd ul:last-child{border: 0;}
.order_box .orders .order .dd ul li.row{display: flex;}
.order_box .orders .order .dd .products{flex-grow: 1; display: flex; flex-direction: column;}
.order_box .orders .order .dd .products li{width: 100%;height: 100%; display: flex; box-sizing: border-box;}
.order_box .orders .order .dd .products li:not(:last-child){border-bottom: #F2F2F2 1px solid;}
.order_box .orders .order .dd .products li .info{flex-grow: 1; display: flex; align-items: center; padding: 10px; box-sizing: border-box;}
.order_box .orders .order .dd .products li .info img{width: 60px; height: 60px;}
.order_box .orders .order .dd .products li .info .titles{min-height: 60px; display: flex; flex-direction: column; justify-content: space-between;}
.order_box .orders .order .dd .price{display: flex; flex-direction: column; justify-content: center; align-items: center;}
.order_box .orders .order .dd .user{display: flex; flex-direction: column; align-items: self-start;padding:10px 13px;}
.order_box .orders .order .dd .tool i{margin-top: -3px;}
/* 分页 */
.order_box .page{width: 100%; height: 30px; display: flex; justify-content: flex-end;}
.order_box .page .layui-laypage{margin: 0;}
/* 无数据 */
.null{width: 100%; height: 500px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.null img{width: 100px; height: 100px;}
/* 订单详情 */
.order_detailed{width: 610px; height: 100%; overflow: hidden;}
.order_detailed .cent{width: 630px; height: 100%; overflow-y: auto; display: flex; flex-direction: column;}
.order_detailed .cent ul{width: 610px; font-size: 13px; display: flex;}
.order_detailed .cent ul.border_bottom{border-bottom: #F2F2F2 1px dashed; padding-bottom: 20px;}
.order_detailed .cent ul.row{display: flex; flex-wrap: wrap;}
.order_detailed .cent ul.row li{width: calc((100% - 20px) / 2); display: flex; align-items: center; margin-right: 20px; }
.order_detailed .cent ul.row li:nth-child(2n){margin-right: 0;}
.order_detailed .cent .order_products{width: 100%; margin-top: 15px; margin-bottom: 0; display: flex; flex-direction: column;}
.order_detailed .cent .order_products li{width: 100%; display: flex; align-items: center;}
.order_detailed .cent .order_products li.head{height: 40px;}
.order_detailed .cent .order_products li.tr{height: 60px;border-bottom: #F2F2F2 1px solid;}
.order_detailed .cent .order_products li.tr img{width: 40px; height: 40px;}
.order_detailed .cent .order_products li.tr .info{width: 360px; height: 40px;}
/* 订单记录 */
.order_record{width: 610px; height: 100%; overflow: hidden;}
.order_record .layui-table-cell {min-height: 36px;line-height: 36px;height: auto;}
/* 订单修改 */
.order_edit{width: 610px; height: 540px; background: #CCCCCC; display: flex; flex-direction: column;}
/* 订单发货 */
.order_delivery{width: 800px; display: flex; flex-direction: column; justify-content: space-between;}
.order_delivery .cent{width: 100%; height: 400px; display: flex;}
.order_delivery .cent.border{border-bottom: #F2F2F2 1px solid; padding-bottom: 20px;}
.order_delivery .cent .form{width: 400px; border-right: #F2F2F2 1px solid; padding-right: 20px; box-sizing: border-box;}
.order_delivery .cent .form .order{width: 100%; height: 60px; display: flex; border-bottom: #F2F2F2 1px dashed; padding-bottom: 20px;}
.order_delivery .cent .form .order img{width: 60px; height: 60px;}
.order_delivery .cent .form .order .info{flex-grow: 1; height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.order_delivery .cent .express{width: 380px; overflow: hidden; padding-left: 20px; box-sizing: border-box; }
.order_delivery .cent .express ul{width: 380px; padding-right: 10px; box-sizing: border-box; height:360px;display: flex; flex-direction: column; overflow-y: auto; font-size: 12px;}
.order_delivery .cent .express ul li{display: flex; padding-bottom: 16px; position: relative;}
.order_delivery .cent .express ul li:last-child{padding-bottom: 0;}
.order_delivery .cent .express ul li i{width: 5px; height: 5px; margin-top: 7px; border-radius: 50%; flex-shrink: 0; z-index: 2;}
.order_delivery .cent .express ul li::before{width: 1px;height: 100%;position: absolute;left: 2px;top: 8px; background:#F2F2F2; content: ''; z-index: 1;}
.order_delivery .cent .express ul li:last-child::before{display: none;}
.order_delivery .cent .express ul li span{flex-grow: 1; display: flex; flex-direction: column; margin-left: 15px;}
/* 会员详情 */
.user_detailed{width: 900px; height: 500px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden;}
.user_detailed .top{width: 100%; height:60px; border-bottom:#F2F2F2 1px solid; padding-bottom: 19px;  display: flex; align-items: center;}
.user_detailed .top .avatar{width: 50px; height: 50px; position: relative;}
.user_detailed .top .avatar i{width: 16px; height: 16px; border: #F2F2F2 1px solid; position: absolute; top: 0; right: 0; display: flex; justify-content: center; align-items: center; font-size: 10px;}
.user_detailed .top .avatar img{width: 100%; height: 100%; border: #F2F2F2 1px solid; box-sizing: border-box;}
.user_detailed .top .info{height: 50px; display: flex; flex-direction: column; justify-content: space-between;}
.user_detailed .top .info ul{width: 100%; display: flex; align-items: center;}
.user_detailed .top .info ul li{width: 33%; font-size: 13px; display: flex; align-items: center;}
.user_detailed .cent{width: 100%; height: 400px; display: flex; justify-content: space-between; }
.user_detailed .cent .left{width: 150px; position: relative; z-index: 2; }
.user_detailed .cent .left::after{width: 1px; height: 100%; background: #F2F2F2; position: absolute; top: 0; right: 0; content: ''; z-index: -1;}
.user_detailed .cent .left li{width: 100%; height: 50px; display: flex; align-items: center; border-right: #F2F2F2 1px solid; box-sizing: border-box; padding: 15px;}
.user_detailed .cent .left li:hover{color: #009688;}
.user_detailed .cent .left li.on{border-right: #009688 2px solid; background: #e5f4f3; color: #009688;}
.user_detailed .cent .right{width: 730px;}
.user_detailed .cent .right .layui-table-cell {min-height: 40px;line-height: 40px;height: auto;}
.user_detailed .cent .right .off{display: none;}

/* 商品选择 */
.product_detailed{width: 900px; display: flex; flex-direction: column; overflow: hidden;}
.product_detailed .table{width: 100%; height: 374px;}
.product_detailed .table .layui-table-cell {min-height: 40px;line-height: 40px;height: auto;}

/* 专题预览 */
.tpc_box{padding: 10px!important;height: 667px!important;}
.special_ctp{width: 375px; height: 667px; overflow: hidden; position: relative;}
.special_ctp .top{width: 100%; height: 68px; position: absolute; left: 0; top: 0; z-index: 2; display: flex; opacity: 0;}
.special_ctp .top .back{width: 10px; height: 28px; margin-top: 30px; font-size: 24px;}
.special_ctp .top .title{width: 200px; height: 28px; line-height: 28px; margin-top: 30px;}
.special_ctp .head{width: 375px; height: 64px; background: url("../image/xcx_head.png") no-repeat; position: absolute; left: 0; top: 0; z-index: 2}
.special_ctp .box{width: 395px; height: 100%; overflow-y: auto;}
.special_ctp .box .cent{width: 375px; min-height: 667px; display: flex; flex-direction: column; align-items: center;}
.special_ctp .box .cent .main_title{display: flex; justify-content: center; align-items: center;}
.special_ctp .box .cent .main_title img{width: 19px; height: 12px;}
.special_ctp .box .cent .main_title p{line-height: 16px; font-size: 16px; margin-top: 1px;}
/* 商品列表 */
.special_ctp .box .cent .block_product{width: 100%; display: flex; flex-wrap: wrap; z-index: 1;}
.special_ctp .box .cent .block_product li{width: 172px; height: 296px; overflow: hidden; margin-top: 10px; margin-left: 10px; display: flex; flex-direction: column;}
.special_ctp .box .cent .block_product li:nth-child(2n){margin-right: 0;}
.special_ctp .box .cent .block_product li img{width: 100%; height: 173px; background: #FCFCFC;}
.special_ctp .box .cent .block_product li .title{width: 153px; line-height: 14px; font-size: 14px;}
.special_ctp .box .cent .block_product li .sub_title{width: 153px; line-height: 12px; font-size: 12px;}
.special_ctp .box .cent .block_product li .price{width: 153px; display: flex; align-items: center;}
.special_ctp .box .cent .block_product li .button{width: 153px; height: 30px; line-height: 30px; font-size: 12px; text-align: center; border-radius: 2px;}
/* 商品平铺 */
.special_ctp .box .cent .row_product{width: 355px; display: flex; flex-direction: column; z-index: 1;}
.special_ctp .box .cent .row_product li{width: 100%; height: 130px; padding: 10px; box-sizing: border-box; margin-top: 10px; display: flex; justify-content: space-between; align-items: center;}
.special_ctp .box .cent .row_product li img{width: 110px; height: 110px; background: #FCFCFC;}
.special_ctp .box .cent .row_product li .info{width: 210px; height: 100%; display: flex; flex-direction: column; position: relative;}
.special_ctp .box .cent .row_product li .info .title{line-height: 14px; font-size: 14px;}
.special_ctp .box .cent .row_product li .info .sub_title{line-height: 20px; font-size: 12px;}
.special_ctp .box .cent .row_product li .info .foot{width: 100%; height: 30px; display: flex; justify-content: space-between; align-items: center; position: absolute; left: 0; bottom: 0;}
.special_ctp .box .cent .row_product li .info .foot .price{display: flex; align-items: center;}
.special_ctp .box .cent .row_product li .info .foot .button{width: 80px; height: 30px; line-height: 30px; font-size: 12px; text-align: center; border-radius: 2px;}

/* 统计图表 */
.char_basic{width: 100%; padding: 0 20px 20px 20px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center;}
.char_basic.h_702{min-height: 702px;}
.char_basic.h_561{min-height: 561px;}
.char_basic .dt{width: 100%; height: 60px; border-bottom: #F6F6F6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.char_basic .dt .search{height: 38px; display: flex; align-items: center;}
.char_basic .dd{width: 100%; display: flex; flex-direction: column;}
.char_basic .dd .count{width: 100%; height: 80px; display: flex;border-bottom: #F6F6F6 1px solid; padding-bottom: 30px;}
.char_basic .dd .count li{width: 20%; height: 100%; border-right: #F6F6F6 1px solid; box-sizing: border-box; display: flex; flex-direction: column;justify-content: space-between; padding: 0 20px;}
.char_basic .dd .count li:last-child{border-right: 0;}
.char_basic .dd .count li p{display: flex; align-items: center;}
.char_basic .dd .count li p i{width: 15px; height: 15px; font-size: 18px;}
.char_basic .dd .count li p.num{font-size: 24px;}
.char_basic .dd .char{width: 100%; height: 450px;}

/* 排行 */
.ranking_table{width: 100%; display: flex; flex-direction: column;}
.ranking_table ul{width: 100%; display: flex;}
.ranking_table ul.th{height: 50px; line-height: 50px;}
.ranking_table ul.th li{text-align: center; font-weight: bold;}
.ranking_table ul.tr{height: 68px;border-bottom: #F6F6F6 1px solid;}
.ranking_table ul.tr li{padding: 5px; box-sizing: border-box; display: flex;justify-content: center; align-items: center;}
.ranking_table ul.tr li .product{width: 100%; height: 40px; display: flex; align-items: center;}
.ranking_table ul.tr li .product img{width: 40px; height: 100%;}
.ranking_table ul.tr li .product .title{height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.ranking_table ul.tr li .value{height:36px; display: flex; flex-direction: column; justify-content: space-between; align-items: center;}
.ranking_table ul.tr li .keyword{width: 100%; height: 40px; display: flex; align-items: center;}

/* 栅格 */
.char_row{width: 100%; height: 450px; display: flex; justify-content: space-between;}

/* 地域分布 */
.char_map{width: calc(100% - 420px); height: 100%; padding: 0 20px 20px 20px; box-sizing: border-box;}
.char_map .dt{width: 100%; height: 60px; border-bottom: #F6F6F6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.char_map .dd{width: 100%; height: 350px; overflow: hidden;}

/* 城市 */
.char_city{width: calc(100% - 420px); height: 100%; padding: 0 20px 20px 20px; box-sizing: border-box;}
.char_city .dt{width: 100%; height: 60px; border-bottom: #F6F6F6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.char_city .dd{width: 100%; height: 350px; overflow: hidden;}
.char_city .dd .cent{width: calc(100% + 20px); height: 100%; overflow-y: auto; overflow-x: hidden;}
.char_city .dd .cent li{width: calc(100% - 20px); height: 50px; display: flex; justify-content: space-between; align-items: center; border-bottom: #F6F6F6 1px solid;}
.char_city .dd .cent li p{min-width: 80px; text-align: center; padding: 0 15px; box-sizing: border-box;}
.char_city .dd .cent li p:first-child{text-align: left;}
/* 性别 */
.char_sex{width: 400px; height: 100%; padding: 0 20px 20px 20px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center;}
.char_sex .dt{width: 100%; height: 60px; border-bottom: #F6F6F6 1px solid; display: flex; justify-content: space-between; align-items: center;}
.char_sex .dd{width: 100%; height: 350px;}

/* 商品预览 */
.product_ctp{width: 375px; height: 667px; overflow: hidden; position: relative;}
.product_ctp .top{width: 100%; height: 68px; position: absolute; left: 0; top: 0; z-index: 2; display: flex; opacity: 0;}
.product_ctp .top .back{width: 10px; height: 28px; margin-top: 30px; font-size: 24px;}
.product_ctp .top .title{width: 200px; height: 28px; line-height: 28px; margin-top: 30px;}
.product_ctp .head{width: 375px; height: 64px; background: url("../image/xcx_head.png") no-repeat; position: absolute; left: 0; top: 0; z-index: 2}
.product_ctp .box{width: 395px; height: 100%; overflow-y: auto; overflow-x: hidden;}
.product_ctp .box .cent{width: 375px; min-height: 667px; padding-bottom: 48px; display: flex; flex-direction: column; align-items: center;}
.product_ctp .box .cent .banner{width: 375px; height: 375px;}
.product_ctp .box .cent .banner img{width: 100%; height: 100%; object-fit: cover;}
.product_ctp .box .cent .top_box{width: 100%; padding: 10px; box-sizing: border-box; display: flex; flex-direction: column;}
.product_ctp .box .cent .top_box .price{display: flex; justify-content: space-between; align-items:center;}
.product_ctp .box .cent .top_box .price .iconfont{font-size: 22px;}
.product_ctp .box .cent .top_box .title{display: flex; align-items:center;}
.product_ctp .box .cent .top_box .title span{height: 20px; line-height: 20px; font-size: 12px; padding: 0 5px; border-radius: 2px;}
.product_ctp .box .cent .top_box .info{padding-top: 10px; display: flex; justify-content: space-between; align-items: center;border-top: #F6F6F6 1px solid;}
.product_ctp .box .cent .select{width: 100%; padding: 0 10px; box-sizing: border-box; display: flex; flex-direction: column;}
.product_ctp .box .cent .select li{width: 100%; padding: 15px 0; display: flex; justify-content: space-between; align-items: center;border-bottom: #F6F6F6 1px solid;}
.product_ctp .box .cent .service{width: 100%; padding: 15px 10px; box-sizing: border-box; display: flex;}
.product_ctp .box .cent .service li{display: flex; align-items: center; margin-right: 15px;}
.product_ctp .box .cent .service li .iconfont{margin-top: 1px;}
.product_ctp .box .cent .content img{max-width: 375px;}
.product_ctp .foot{width: 100%; height: 48px; background: url("../image/product_foot.png") no-repeat; position: absolute; left: 0; bottom: 0; z-index: 2;}

/* 搜索结果 */
.search_ctp{width: 375px; height: 667px; overflow: hidden; position: relative;}
.search_ctp .top{width: 100%; height: 118px; position: absolute; left: 0; top: 0; z-index: 2; background: url("../image/search_top.jpg") no-repeat; display: flex;}
.search_ctp .top .keyword{height: 26px; background: #888888; margin-top: 80px; margin-left: 14px; font-size: 12px; display: flex; align-items: center; border-radius: 50px; padding: 0 10px; color: #FFFFFF;align-self: baseline;}
.search_ctp .box{width: 395px; height: 100%; overflow-y: auto; overflow-x: hidden;}
.search_ctp .box .cent{width: 375px; min-height: 667px; display: flex; flex-direction: column; align-items: center;}
.search_ctp .box .cent .block_product{width: 100%; margin-top: 118px; display: flex; flex-wrap: wrap; z-index: 1;}
.search_ctp .box .cent .block_product li{width: 172px; height: 260px; overflow: hidden; margin-top: 10px; margin-left: 10px; display: flex; flex-direction: column;}
.search_ctp .box .cent .block_product li:nth-child(2n){margin-right: 0;}
.search_ctp .box .cent .block_product li img{width: 100%; height: 173px; background: #FCFCFC;}
.search_ctp .box .cent .block_product li .title{width: 153px; line-height: 14px; font-size: 14px;}
.search_ctp .box .cent .block_product li .price{width: 153px; display: flex; align-items: center;}

/* 商品分析 */
.product_analysis{width: 900px; height: 500px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden;}
.product_analysis .top{width: 100%; height:50px; border-bottom:#F2F2F2 1px solid; padding-bottom: 19px;  display: flex; align-items: center;}
.product_analysis .top .image{width: 50px; height: 50px;}
.product_analysis .top .image img{width: 100%; height: 100%; border: #F2F2F2 1px solid; box-sizing: border-box;}
.product_analysis .top .info{height: 50px; display: flex; flex-direction: column; justify-content: space-between;}
.product_analysis .top .info .title{display: flex; align-items: center;}
.product_analysis .top .info .title i{padding: 0 5px; border-radius: 2px;}
.product_analysis .top .info ul{width: 100%; display: flex; align-items: center; line-height: 14px; margin-bottom: -2px;}
.product_analysis .top .info ul li{width: 16%; font-size: 13px; display: flex; align-items: center;}
.product_analysis .chars{width: 100%; height: 408px; }

/* 地图标记 */
.mapBox{height: 500px; position: relative; border-radius: 4px;}
.mapBox .map{width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1;border-radius: 4px; border: #E8EAEC 1px solid; box-sizing: border-box;}
.mapBox .forms{width: 706px; height: 40px; position: absolute; top: 15px; right: 15px; z-index: 2; display: flex;}
.mapBox .forms input{width:376px;height:100%;}
.mapBox .forms p{width: 150px; height: 40px;display: flex;align-items: center;justify-content: flex-start;border: #E8EAEC 1px solid;border-radius: 4px;box-sizing: border-box;padding: 0 10px;color: #000000;cursor: not-allowed;}
.amap-sug-result{border:#E8EAEC 1px solid;border-radius: 4px;}
.auto-item{white-space: nowrap;font-size: 12px;cursor: pointer;padding:10px 10px;}
.auto-item:hover{background: #e5f4f3;color: #009688;}