@charset "utf-8";

@font-face {
    font-family: 'alibaba';
	font-weight: 600;
    src: url('alibaba.woff2') format('woff2');
	font-display: swap;
}

/************************************************************************/
/**基础属性设置************************************************************/
/************************************************************************/
* { font-family: 'alibaba'; }
body{ background: url(../images/bg.png) #E6F3FF; padding: 0px; margin: 0px auto; overflow-x: hidden; font-family: 'alibaba'; }

ul { margin:0px; padding:0px; }
li { list-style:none; }
a { text-decoration:none; }
img { border:none; vertical-align: middle; }

/**********************************/
/**公共样式*************************/
/**********************************/

/**系统主色调********/
:root {
	--theme-color: #0b6bd9;
	--theme-family: Arial;
}
#hand { color: #ff7300; cursor: pointer; font-weight: normal; }
#hand_red { color: red; cursor: pointer; }
#hand_green { color: green; cursor: pointer; }

#map_dom { z-index: 5; }

/**********************************/
/**页面加载动作**********************/
/**********************************/
.loading { width: 100%; height: 100%; background: none; position: fixed; top: 0; left: 0px; z-index: 99999; display: flex; flex-direction:column; justify-content:center; align-items:center; align-content:center; font-size: 0.9em; color: var(--theme-color); }
.loading_img { width: 100%; height: auto; text-align: center; margin-bottom: 10px; -webkit-animation:1.2s loading infinite; animation: loading 1s infinite; }
.loading_img img { max-width: 56px; width: auto; height: auto; }
@keyframes loading{
	0% {transform: translateY(0px); opacity: 1; }
	50% {transform: translateY(-15px); opacity: 0.8;}
	100% {transform: translateY(0px); opacity: 1;}
}

.iframe_load { width: 100%; height: 100%; background: #fff; display: flex; flex-direction:column; justify-content:center; align-items:center; font-size: 15px; color: #999; }
.iframe_load svg { width: auto; height: auto; margin-bottom: 15px; }


.go2top { width: 48px; height: 48px; background: rgba(0,0,0,0.4); border-radius: 6px; display: flex; flex-direction:column; justify-content:center; align-items:center; position: fixed; right: 15px; bottom: 20px; z-index: 2; }
.go2top img { height: 25px; width: 25px; }

.bottom_tip { width: 100%; height: auto; margin: 30px auto; color: #ccc; font-size: 12px; text-align: center; }

.app { width: 100%; height: 100%; display: flex; flex-direction:column; justify-content:space-between; align-items:center; }

/**********************************/
/**公共部分*************************/
/**********************************/
/*顶部*/
.app_top { width: 100%; height: 88px; margin-bottom: 10px; background: url(../images/top.png) center center no-repeat; background-size: 100% 100%; display: flex; justify-content:center; align-items:center; position: relative; }
.app_top img { height: 35px; width: auto; margin-bottom: 8px; }
.app_top font { color: #999; font-size: 16px; position: absolute; z-index: 1; right: 30px; top: 20px; }
.app_top font a { color: #00A0E9; font-size: 16px; margin-left: 15px; }

/*底部*/
.app_bottom { width: 100%; height: 35px; margin-top: 10px; background: url(../images/bottom.png) center center no-repeat; background-size: auto 100%; }
/*中间*/
.app_middle { width: calc(100% - 40px); height: calc(100% - 153px); }
/*中间上面*/
.app_middle_top { width: 100%; height: calc(75% - 10px); display: flex; justify-content:space-between; align-items:flex-start; }
/*左侧目录*/
.app_middle_menu { width: calc(14% - 40px); height: calc(100% - 4px); padding: 0 20px; background: linear-gradient(to bottom , #ffffff , #DEEFFF); border: 2px solid rgba(255,255,255); border-radius: 9px; display: flex; flex-direction:column; justify-content:center; align-items:center; }
.app_middle_menu a { width: calc(100% - 4px); height: calc(11% - 10px); min-height: 50px; margin: 3.2% auto; border: 2px solid #fff; border-radius: 6px; background: linear-gradient(180deg, rgba(145,212,246,0.6), rgba(255,255,255,0)); box-shadow: inset 0px 4px 6px 0px rgba(255,255,255,0.98); font-size: 20px; color: #5292CA; display: flex; justify-content:center; align-items:center; cursor: pointer; }
.app_middle_menu a:hover { background: linear-gradient(180deg, #FFE7C2 0%, rgba(251,253,255,0)); color: #E7A11E; }
#menuHover { background: linear-gradient(180deg, #FFE7C2 0%, rgba(251,253,255,0)); color: #E7A11E; }
/*中间地图*/
.app_middle_map { width: calc(52% - 40px); height: calc(100% - 20px); margin: 0 20px; border: 10px solid rgba(255,255,255,0.9); border-radius: 9px; display: flex; flex-direction:column; justify-content:flex-end; align-items:center; position: relative; }
.map_div { width: 100%; height: 100%; background: #f6f6f6; border-radius: 6px; overflow: hidden; }
.map_build { width: 180px; height: 120px; padding: 10px 20px; background: linear-gradient(to bottom, rgba(255,255,255),rgba(222,239,255)); border-top: 10px solid #fff; border-right: 10px solid #fff; border-radius: 0px 6px 6px 0; display: flex; flex-direction:column; justify-content:flex-start; align-items:center; position: absolute; z-index: 999999; left: 0; bottom: 0; font-size: 14px; color: #666; }
.map_build .title { width: 100%;height: 35px; line-height: 25px; font-size: 16px; color: #415B73; }
.map_build .info { width: 100%; height: 30px; line-height: 25px; font-size: 14px; color: #415B73; }
.map_build .info font { color: #00A0E9; }
.map_build .detail { width: 100%; height: 25px; line-height: 24px; font-size: 14px; color: #00A0E9; text-align: right; cursor: pointer; }
.map_build_close { width: 32px; height: 32px; position: absolute; z-index: 1; }
.map_build_select { width: 200px; height: 42px; background: rgba(255,255,255,0.8); text-indent: 7px; border: 1px solid #bbb; border-radius: 5px; color: #666; font-size: 15px; position: absolute; z-index: 999999; left: 10px; top: 10px; }

.app_middle_map .tips { width: auto; height: 50px; background: rgba(0,0,0,0.2); color: #415B73; font-size: 15px; padding: 0 30px; border: 2px solid rgba(255,255,255,0.7); border-radius: 28px; margin-bottom: 15%; display: flex; justify-content:center; align-items:center; cursor: pointer; }
.app_middle_map .tips:hover { background: #00A0E9; color: #fff; }
.app_middle_map .tips img { height: 24px; width: auto; margin-right: 8px; }
.home_board_layer { width: 220px; height: 36px; position: absolute; z-index: 10001; top: 20px; left: 20px; display: flex; justify-content:center; align-items:center; padding: 0 5px; border-radius: 5px; background: rgba(255,255,255,0.7); font-size: 14px; color: #555; }
/*右侧图表*/
.app_middle_charts { width: 34%; height: 100%; }

/*中间下面*/
.app_middle_bottom { width: 100%; height: calc(25% - 10px); margin-top: 20px; display: flex; justify-content:space-between; align-items:flex-start; }


/*分页按钮样式*/
.page_url { width: 92%; height: 60px; margin: 20px auto 0; display: flex; justify-content:center; align-items:center;color: #415B73; font-size: 14px; }
.page_url div { width: auto; height: 32px; margin: 0 15px; padding: 0 15px; background: #F2F8FC; border-radius: 3px; display: flex; justify-content:center; align-items:center; }
.page_url div input { width: 50px; height: 28px; background: #DAEDF9; text-align: center; color: #666; border: 1px solid #fff; border-radius: 3px; margin: 0 10px; }
.page_url div button { width: auto; height: 28px; font-size: 14px; color: #415B73; background: none; border-radius: 4px; border: none; cursor: pointer; margin-left: 10px; }
.page_url div button:hover { color: #333; }
.page_url font { width: 32px; height: 32px; line-height: 32px; text-align: center; color: #415B73; margin: 0 10px; font-size: 14px; }
.page_url a { width: auto; height: 32px; line-height: 32px; margin: 0 6px; padding: 0 12px; border: 1px solid #fff; border-radius: 3px; color: #415B73; font-size: 14px; background: #DAEDF9; }
.page_url a:hover { color: #fff; background: #00A0E9; border: 1px solid #00A0E9; }
#pageHover { color: #fff; background: #00A0E9; border: 1px solid #00A0E9; }
.page_url span { padding: 4px 8px; color: #415B73; margin: 0 10px; font-size: 14px; }
.page_url select { width: 50px; height: 25px; border: 1px solid #ddd; border-radius: 5px; text-align: center; font-size: 13px; font-weight: 300; background: none; margin: 0 5px; }
.page_url img { height: 16px; width: auto; margin: 0 5px; cursor: pointer; opacity: 0.6; }
#pageimg { width: auto; height: auto; border: none; background: none; }

/************/
/**登录页样式**/
/************/
.login_body { background: url(../images/login_bg.jpg) center center no-repeat; background-size: 100% 100%; }
.login_video { width: 100%; height: 100%; background: url(../images/login_bg.jpg) center center no-repeat; background-size: 100% 100%; overflow: hidden; display: flex; justify-content:center; align-items:center; }
.login_video video { width: 100%; height: auto; }
.login_box { height: 100%; width: 100%; display: flex; flex-direction:column; justify-content:space-between; align-items:center; position: fixed; z-index: 1; top: 0; }
.login_top { width: 100%; height: 100px; display: flex; justify-content:space-between; align-items:center; }
.login_top_logo { width: 40%; height: 50px; margin-left: 5%; display: flex; justify-content:flex-start; align-items:center; }
.login_top_logo img { max-height: 40px; width: auto; height: auto; }
.login_top_link { flex: 1; height: 70px; text-align: right; margin-right: 5%; }
.login_top_link font { font-size: 14px; color: #666; margin-left: 30px; cursor: pointer; }
.login_top_link font:hover { color: var(--theme-color); }
.login_middle { flex: 1; margin: 30px 0; display: flex; justify-content:space-between; align-items:center; }
.login_poster { flex: 1; height: 450px; margin-right: 150px; display: flex; justify-content:center; align-items:center; }
.login_poster img { max-width: 100%; width: auto; height: auto; }
.login_input_box { width: 400px; height: 490px; background: rgba(255,255,255,1); border-radius: 10px; }
.login_input_box_title { width: 100%; height: 100px; display: flex; justify-content:center; align-items:center; font-size: 25px; font-weight: bold; color: #555; }
.login_input_box_dom { width: 340px; height: 50px; margin: 0 auto 20px; border: 1px solid #ccc; border-radius: 5px; display: flex; justify-content:space-between; align-items:center; }
.login_input_box_dom div { width: 80px; height: 20px; line-height: 20px; color: #777; font-size: 15px; border-right: 1px solid #ccc; text-align: right; }
.login_input_box_dom img { margin-right: 10px; }
.login_input_box_dom_input { height: 40px; width: 240px; margin: 0 10px; margin-right: 10px; border: none; font-size: 15px; background: none; }
.login_input_box_dom_authcode { height: 40px; width: 150px; margin: 0 10px; border: none; font-size: 15px; background: none; }
.login_input_box_btn { width: 340px; height: 50px; margin: 50px auto 0px; background: var(--theme-color); border: none; border-radius: 5px; color: #fff; font-size: 20px; cursor: pointer; display: flex; justify-content:center; align-items:center; }

.login_footer { width: 100%; height: 60px; text-align: center; line-height: 60px; font-size: 13px; color: #999; }
.login_footer font { margin: 0 10px; font-size: 13px; color: var(--theme-color);}
.login_footer a { color: #ccc; margin: 0 10px; font-size: 13px; }
.login_footer a:hover { color: var(--theme-color); }

.login_layer { width: 100%; height: 100%; background: rgba(0,0,0,0.8); display: flex; flex-direction:column; justify-content:center; align-items:center; position: fixed; z-index: 5; top: 0; }
.login_layer_loading { width: 160px; height: 160px; padding:10px; margin-bottom: 30px; background: rgba(255,255,255,0.5); border-radius: 7px; display: flex; flex-direction:column; justify-content:center; align-items:center; }
.login_layer_loading img { height: 64px; width: auto; }
.login_layer_loading font { font-size: 16px; color: #fff; margin-top: 15px; }

/**********************************/
/**首页*****************************/
/**********************************/
/*右侧均分设备*/
.index_charts_box { width: calc(100% - 4px); height: calc(33.3% - 17px); margin-bottom: 20px; background: linear-gradient(to bottom, rgba(255,255,255),rgba(222,239,255)); border: 2px solid #fff; border-radius: 9px; display: flex; flex-direction:column; justify-content:flex-start; align-items:center; overflow: hidden; }
.index_charts_3 { margin-bottom: 0; }
.index_charts_title { width: 100%; height: 40px; margin-bottom: 10px; background: url(../images/line_right.png) right bottom no-repeat; background-size: 98% 2px; display: flex; justify-content:space-between; align-items:center; }
.index_charts_title div { width: auto; height: auto; color: #415B73; font-size: 16px; display: flex; justify-content:flex-start; align-items:center; }
.index_charts_title div img { height: 16px; margin-left: 12px; margin-right: 8px; }
.index_charts_title font { font-size: 12px; color: #7395B3; font-family: 'arial'; font-weight: 400; margin-right: 12px; margin-top: 5px; text-transform: uppercase; }

.index_count { width: calc(100% - 20px); height: 100%; margin-bottom: 10px; background: url(../images/count_bg.png) center center no-repeat; background-size: 100% 100%; display: flex; justify-content:center; align-items:center; }
.index_count div { width: 30%; height: 60px; display: flex; flex-direction:column; justify-content:center; align-items:center; font-size: 16px; color: #415B73; }
.index_count div font { font-size: 26px; color: #00A0E9; }
.index_chart { width: calc(100% - 20px); height: 100%; display: flex; flex-direction:column; justify-content:center; align-items:center; color: #999; font-size: 14px; }
.index_chart img { height: 32px; width: auto; margin-bottom: 10px; }
/*底部投诉和温度*/
.index_ts { width: calc(66% - 56px); height: calc(100% - 15px); padding: 0 20px 15px; background: linear-gradient(to bottom, rgba(255,255,255),rgba(222,239,255)); border: 2px solid #fff; border-radius: 9px; display: flex; flex-direction:column; justify-content:flex-start; align-items:center; }
.index_ts_dom { width: 100%; height: 100%; }
.index_ts_list { width: 100%; height: calc(25% - 5px); max-height: 50px; margin-bottom: 5px; background: #D8EDFB; display: flex; justify-content:center; align-items:center; }
.index_ts_list .tags { background: #D6EBF9; }
.index_ts_list .sort { width: 8%; color: #405B73; font-size: 14px; display: flex; justify-content:center; align-items:center; }
.index_ts_list .time { width: 17%; color: #405B73; font-size: 14px; display: flex; justify-content:flex-start; align-items:center; }
.index_ts_list .gname { width: 15%; color: #405B73; font-size: 14px; display: flex; justify-content:flex-start; align-items:center; }
.index_ts_list .state { width: 10%; color: #405B73; font-size: 14px; display: flex; justify-content:flex-start; align-items:center; }
.index_ts_list .con { width: 45%; color: #405B73; font-size: 14px; padding-right: 5%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display: flex; justify-content:flex-start; align-items:center; }

/*日温度*/
.index_avg { width: calc(34% - 10px); height: 100%; background: linear-gradient(to bottom, rgba(255,255,255),rgba(222,239,255)); border: 2px solid #fff; border-radius: 9px; display: flex; flex-direction:column; justify-content:flex-start; align-items:center; }

/*地图层*/
.index_map_layer { width: 100%; height: 100%; position: fixed; z-index: 99999; top: 0; background: rgba(255,255,255,0.95); display: flex; flex-direction:column; justify-content:center; align-items:center; }
.index_map_title { width: 100%; height: 60px; line-height: 80px; text-align: center; margin-bottom: 20px; font-size: 24px; color: #405B73; }
.index_map_dom { width: 90%; height: calc(100% - 150px); background: #eee; display: flex; justify-content:center; align-items:center; border: 5px solid rgba(10, 139, 207, 0.12);border-radius: 6px; overflow: hidden; position: relative; box-shadow: 1px 1px 5px #ccc; }
.index_map_close { width: 220px; height: 40px; margin: 20px auto; background: #409EFF; font-size: 16px; color: #fff; border-radius: 4px; cursor: pointer; text-align: center; line-height: 40px; }

/**********************************/
/**地图页***************************/
/**********************************/
.map_dom { width: 100%; height: 100%; display: flex; }
.map_info { width: 240px; height: calc(100% - 20px); padding: 10px; background: #eee; display: flex; flex-direction:column; justify-content:space-between; align-items:center; }
.map_info_dom { width: 100%; height: auto; display: flex; flex-direction:column; justify-content:center; align-items:center; }
.map_info_dom .title { width: 100%; min-height: 40px; line-height: 23px; font-size: 18px; color: #415B73; text-align: center; margin-top: 10px; }
.map_info_dom .info { width: 100%; height: 35px; line-height: 40px; font-size: 15px; color: #415B73; }
.map_info_dom .info font { color: #00A0E9; }
.map_info_dom .detail { width: 100%; height: 50px; line-height: 50px; font-size: 15px; color: #00A0E9; text-align: center; cursor: pointer; }
.map_info_choose { width: 100%; height: auto; display: flex; flex-direction:column; justify-content:center; align-items:center; color: #415B73; font-size: 15px; }

/**********************************/
/**其他*****************************/
/**********************************/
.app2 { width: 100%; min-height: 100%; display: flex; flex-direction:column; justify-content:space-between; align-items:center; }

.app2_middle { flex: 1; width: calc(100% - 40px); display: flex; justify-content:space-between; align-items:flex-start; }
.app2_middle_menu { width: calc(14% - 40px); height: auto; padding: 15px 20px; background: linear-gradient(to bottom , #ffffff , #DEEFFF); border: 2px solid rgba(255,255,255); border-radius: 9px; display: flex; flex-direction:column; justify-content:center; align-items:center; }
.app2_middle_menu a { width: calc(100% - 4px); height: calc(11% - 4px); min-height: 58px; margin: 3.2% auto; border: 2px solid #fff; border-radius: 6px; background: linear-gradient(180deg, rgba(145,212,246,0.6), rgba(255,255,255,0)); box-shadow: inset 0px 4px 6px 0px rgba(255,255,255,0.98); font-size: 20px; color: #5292CA; display: flex; justify-content:center; align-items:center; cursor: pointer; }
.app2_middle_menu a:hover { background: linear-gradient(180deg, #FFE7C2 0%, rgba(251,253,255,0)); color: #E7A11E; }
#menuHover { background: linear-gradient(180deg, #FFE7C2 0%, rgba(251,253,255,0)); color: #E7A11E; }

.app2_list_dom { width: 86%; height: 100%; background: linear-gradient(to bottom, #F9FCFF, #E0F0FF); margin-left: 20px; padding: 0 20px 10px; border: 2px solid #fff; border-radius: 9px; display: flex; flex-direction:column; justify-content:flex-start; align-items:center; }
.app2_list_title { width: 100%; height: 43px; margin-bottom: 20px; background: url(../images/line_list.png) center bottom no-repeat; background-size: 100% 2px; display: flex; justify-content:space-between; align-items:center; }
.app2_list_title div { width: auto; height: auto; color: #415B73; font-size: 16px; display: flex; justify-content:flex-start; align-items:center; }
.app2_list_title div img { height: 16px; margin-right: 8px; }
.app2_list_title font { font-size: 12px; color: #7395B3; font-family: 'arial'; font-weight: 400; margin-top: 5px; text-transform: uppercase; }

.app2_search_dom { width: 100%; height: 50px; margin-bottom: 20px; display: flex; justify-content:center; align-items:center; }
.app2_search_div { width: 26%; height: 44px; margin-right: 1%; display: flex; justify-content:flex-start; align-items:center; }
.app2_search_div div { width: 70px; color: #415B73; font-size: 14px; text-align: right; margin-right: 10px; }
.app2_search_div select { flex: 1; height: 42px; border: 1px solid #DCDFE6; border-radius: 4px; font-size: 14px; text-indent: 5px; color: #999; }
.app2_search_btn { width: 19%; height: 43px; display: flex; justify-content:space-between; align-items:center; }
.app2_search_btn img { height: 16px; width: auto; margin-right: 8px; }
.search_submit { width: 47%; height: 43px; background: #00A0E9; color: #fff; font-size: 18px; border-radius: 4px; display: flex; justify-content:center; align-items:center; cursor: pointer; }
.search_reset { width: 47%; height: 41px; background: #fff; border: 1px solid #DCDFE6; color: #415B73; font-size: 18px; border-radius: 4px; display: flex; justify-content:center; align-items:center; cursor: pointer; }

.app2_search_div2 { width: 27%; height: 44px; margin-right: 1%; display: flex; justify-content:flex-start; align-items:center; }
.app2_search_div2 div { width: 70px; color: #415B73; font-size: 14px; text-align: right; margin-right: 10px; }
.app2_search_div2 select { flex: 1; height: 42px; border: 1px solid #DCDFE6; border-radius: 4px; font-size: 14px; text-indent: 5px; color: #999; }
.app2_search_btn2 { width: 16%; height: 43px; display: flex; justify-content:flex-end; align-items:center; }
.app2_search_btn2 img { height: 16px; width: auto; margin-right: 8px; }
.search_submit2 { width: 90%; height: 42px; background: #00A0E9; color: #fff; font-size: 18px; border-radius: 4px; display: flex; justify-content:center; align-items:center; cursor: pointer; }
.search_reset2 { width: 90%; height: 41px; background: #fff; border: 1px solid #DCDFE6; color: #415B73; font-size: 18px; border-radius: 4px; display: flex; justify-content:center; align-items:center; cursor: pointer; }
/*自然周期单选按钮*/
.count_param_list_label { display: block; height: 32px; margin: 0 10px; padding: 0 15px; border-radius: 4px; background: #ddd; color: #666; font-size: 14px; text-align: center; line-height: 33px; cursor: pointer; margin-top: 2px; white-space: nowrap; }
.count_param_list_label input { display: none; }
.count_choose { background: #00A0E9; color: #fff; }
.count_param_list_submit { width: 100%; height: 60px; display: flex; justify-content:center; align-items:flex-end; overflow: hidden; }
.count_param_list_submit botton { width: 180px; height: 40px; border-radius: 5px; background: #7A9CC6; color: #fff; font-size: 15px; font-weight: bold; border: none; cursor: pointer; text-align: center; line-height: 40px; }
.count_param_list_input { height: 40px; width: calc(50% - 45px); border: 1px solid #ddd; border-radius: 5px; padding: 0 7px; font-size: 14px; }
.app2_search_div2 span { display: block; width: 20px; height: 40px; font-size: 18px; font-weight: bold; color: #999; text-align: center; line-height: 39px; }


/**********************************/
/**监控*****************************/
/**********************************/
.ts_dom_tr { background: #DAEDF9; }
.ts_dom_tr td { font-size: 14px; color: #415B73; }
.ts_list_tr { background: #ccc; }
#ts_normal { background: #EEF7FF; }
#ts_dark { background: #E0F0FC; }
.ts_list_tr td { font-size: 14px; color: #415B73; border-top: 6px solid rgba(255,255,255,0.4); }
.ts_list_tr td span { color: #00A0E9; cursor: pointer; }
.ts_list_tr td a { color: #00A0E9; cursor: pointer; }


/**********************************/
/**温度看板*************************/
/**********************************/
.temp_board_layer { width: 100%; height: 100%; position: fixed; z-index: 1; top: 0; background: rgba(255,255,255,0.9); display: flex; flex-direction:column; justify-content:center; align-items:center; }
.temp_borad_close { width: 180px; height: 42px; background: #00A0E9; border-radius: 5px; border: none; display: flex; justify-content:center; align-items:center; cursor: pointer; margin-top: 10px;  }
.temp_borad_close font { color: #fff; font-size: 16px; margin-top: 2px; }

.human_board_dom { width: 1200px; height: 700px; background: #fff; padding: 10px; border-radius: 5px; display: flex; flex-direction:column; justify-content:center; align-items:center; }
.human_board_info { width: 1200px; height: 60px; overflow: hidden; }
.human_board_info div { width: 100%; height: 60px; margin-left: 10px; margin-bottom: 1px; display: flex; justify-content:center; align-items:center; }
.human_board_info div span { display: block; width: auto; height: 24px; font-size: 15px; font-weight: bold; color: #fff; padding: 3px 15px 0; margin-left: 25px; margin-bottom: 5px; border-radius: 3px; }
.human_board_info div font { font-size: 24px; color: #444; font-weight: bold; font-family: 'douyin'; margin-bottom: 5px; margin-left: 100px;  }
.human_board_chart { width: 1200px; height: 640px; display: flex; flex-wrap: wrap; }
#chart_d1 { width: 600px; height: 320px; background: #eee; border-radius: 5px 0px 0px 0px; }
#chart_d7 { width: 600px; height: 320px; background: #eee; border-radius: 0px 5px 0px 0px; }
#chart_d30 { width: 100%; height: 320px; background: #eee; border-radius: 0px 0px 5px 5px; }


/**********************************/
/**手机浏览页面样式*******************/
/**********************************/
.mobile_dom { width: 86%; min-height: 82vh; background: linear-gradient(to bottom, #F9FCFF, #E0F0FF); margin-left: 20px; padding: 0 20px 10px; border: 2px solid #fff; border-radius: 9px; display: flex; flex-direction:column; justify-content:center; align-items:center; font-size: 15px; color: #7A9CC6; line-height: 23px; text-align: center; }
.mobile_dom img { height: 220px; margin-bottom: 15px;}


/**********************************/
/**手机浏览页面样式*******************/
/**********************************/
.ts_dom { width: 100%; height: auto; display: flex; flex-direction:column; justify-content:flex-start; align-items:center; }

/*搜索结果容器*/
.search_res_dom { width: 100%; height: auto; margin: 10px auto 20px; display: flex; flex-wrap: wrap; }
.search_res_list { width: calc(25% - 40px); height: 50px; padding: 0 10px; margin: 10px; background: #f6f6f6; border-radius: 5px; display: flex; justify-content:flex-start; align-items:center; position: relative; }
.search_res_list:hover { background: #eee; }
.search_res_list img { height: 22px; width: auto; margin-right: 10px; margin-left: 20px; }
.search_res_list font { font-size: 14px; font-weight: bold; color: #555; }
.search_res_list mark { position: absolute; z-index: 1; right: 10px; background: #7A9CC6; font-size: 13px; color: #fff; cursor: pointer; border-radius: 5px; padding: 3px 10px; }


/**********************************/
/**供热查询页面样式*******************/
/**********************************/
/*数据统计容器*/
.count_tables { flex: 1; width: 100%; margin: 10px auto; display: flex; flex-direction:column; justify-content:flex-start; align-items:center; }
.count_tables2 { flex: 1; width: 100%; margin: 10px auto; display: flex; justify-content:space-between; align-items:flex-start; }
.count_tables_load { width: 100%; height: auto; margin: 50px auto; display: none; text-align: center; line-height: 40px; color: #999; }

/*左侧信息*/
.count_tables_info { width: 260px; height: auto; font-size: 12px; color: #415B73; margin-right: 20px; background: none; border-radius: 5px; }
.count_tables_info table { width: 240px; height: auto; margin: 20px auto 7px; }
.count_tables_info table tr td { font-size: 14px; color: #415B73; }
.count_tables_info table tr td font { color: #00A0E9; }
#count_con { font-size: 14px; color: #00A0E9; font-weight: bold; line-height: 20px; }
/*右侧图表*/
.count_tables_chart { flex: 1; display: flex; flex-direction:column; justify-content:space-between; align-items:flex-start; }
.count_baseinfo { width: 100%; height: 100px; display: flex; justify-content:space-between; align-items:center; }
.count_baseinfo_div { width: 24%; height: 100%; background: #fff; border-radius: 5px; margin: 0 auto; display: flex; flex-direction:column; justify-content:center; align-items:center; font-size: 14px; font-weight: bold; color: #415B73; white-space: nowrap; }
.count_baseinfo_div span { color: #00A0E9; font-size: 35px; font-weight: bold; white-space: nowrap; margin-top: 7px; }
.count_baseinfo_div a { display: block; height: 24px; width: auto; padding: 0 15px; border-radius: 5px; background: #0b6bd9; font-size: 12px; color: #fff; font-weight: normal; line-height: 24px; white-space: nowrap; }
#count_charts_dom { width: 99%; height: 400px; margin: 20px auto 0; }

/****************************/
/*投诉记录*/
/****************************/
.ts_layer { width: 100%; height: 100%; background: rgba(0,0,0,0.3); position: fixed; z-index: 1; top: 0; display: flex; justify-content:center; align-items:center; }
.ts_layer_dom { width: 60%; height: calc(100% - 180px); padding: 20px; background: #fff; display: flex; flex-direction:column; justify-content:space-between; align-items:center; border-radius: 5px; overflow: hidden; }
.ts_show { animation: ts2show 0.3s 1 alternate forwards; }
@keyframes ts2show{
	0% {transform: scale(0); }
	100% {transform: scale(1);}
}
.ts_title { width: 100%; height: 50px; line-height: 35px; font-size: 22px; font-weight: bold; color: #000; border-bottom: 1px solid rgba(0,0,0,0.1); }
.ts_title font { font-size: 13px; color: #aaa; font-weight: normal; float: right;margin-top: 5px; }
.ts_list { width: calc(100% - 10px); height: calc(100% - 290px); display: flex; flex-direction:column; padding-right: 10px; }
.ts_human_left { width: 80%; height: auto; margin: 10px 20% 10px 0; display: flex; justify-content:flex-start; align-items:flex-start; flex-wrap: wrap; }
.ts_human_avatar { height: 48px; width: 48px; display: flex; justify-content:center; align-items:center; background: #eee; border-radius: 7px 0px 7px 7px; overflow: hidden; }
.ts_human_avatar img { height: 32px; width: auto; }
.ts_human_text { width: auto; max-width: calc(90% - 48px); min-height: 38px; height: auto; background: #eee; border-radius: 0px 7px 7px 7px; padding: 5px 10px; margin-left: 15px; font-size: 14px; color: #333; line-height: 26px; display: flex; justify-content:flex-start; align-items:center; }
.ts_human_time { width: calc(100% - 80px); height: 35px; line-height: 35px; margin-left: 65px; font-size: 13px; color: #999; }
.ts_worker_right { width: 80%; height: auto; margin: 10px 0 10px 20%; display: flex; justify-content:flex-end; align-items:flex-start; flex-wrap: wrap; }
.ts_worker_avatar { height: 48px; width: 48px; display: flex; justify-content:center; align-items:center; background: #eee; border-radius: 5px 0px 5px 5px; overflow: hidden; }
.ts_worker_avatar img { height: 28px; width: auto; }
.ts_worker_text { width: auto; max-width: calc(90% - 48px); min-height: 38px; height: auto; background: #eee; border-radius: 5px 0px 5px 5px; padding: 5px 10px; margin-right: 15px; font-size: 14px; color: #333; line-height: 26px; display: flex; justify-content:flex-start; align-items:center; }
.ts_worker_time { width: calc(100% - 80px); height: 30px; line-height: 30px; margin-right: 65px; text-align: right; font-size: 13px; color: #999; }

.ts_reply { width: 100%; height: 220px; display: flex; flex-direction:column; justify-content:space-between; align-items:center; }
.ts_reply textarea { width: 100%; height: 150px; padding: 10px; font-size: 14px; font-family: '黑体'; line-height: 22px; color: #333; border: 1px solid #ccc; border-radius: 5px; background: #fff; }
.ts_reply div { width: 100%; height: 50px; display: flex; justify-content:flex-end; align-items:center; position: relative; }
.ts_reply div input { width: 120px; height: 40px; background: var(--theme-color); color: #fff; font-size: 14px; font-weight: bold; border: none; border-radius: 5px; cursor: pointer; }
.ts_reply div font { display: block; width: 90px; height: 40px; line-height: 40px; text-align: center; background: #999; color: #fff; font-size: 14px; font-weight: bold; border-radius: 5px; cursor: pointer; margin-left: 30px; }
.ts_reply div select { width: 160px; height: 35px; padding-left: 5px; font-size: 13px; border: 1px solid #ccc; border-radius: 5px; position: absolute; z-index: 1; left: 0; top: 0; }

/**表单录入**/
.form_dom { width: calc(100% - 260px); height: auto; margin: 80px 20px 0 240px; background: #fff; position: relative; border-radius: 4px; display: flex; justify-content:space-between; }
.form_dom form { width: 100%; height: auto; display: flex; flex-wrap: wrap; justify-content:flex-start; align-items:flex-start; }
.form_dom_section { width: 100%; display: flex; flex-wrap: wrap; justify-content:flex-start; align-items:flex-start; }
.form_dom_section_title { width: 100%; height: 40px; display: flex; justify-content:flex-start; align-items:flex-end; }
.form_dom_section_title_tag { max-width: 240px; height: 32px; color: #fff; border-radius: 5px; text-align: center; line-height: 32px; font-size: 15px; font-weight: bold; white-space: nowrap; margin-right: 20px; cursor: pointer; background: #bbb; padding: 0px 15px; }
.form_dom_section_title_tag i { margin-right: 10px;  }
.form_dom_section_title_tag:hover { background: var(--theme-color); }
.form_pro_full { width: 97%; height: auto; margin: 10px 1.5%; }
.form_pro_half { width: 47%; height: auto; margin: 10px 1.5%; }
.form_pro_quarter { width: 22%; height: auto; margin: 10px 1.5%; }
/*表单用标头*/
.form_pro_title { width: 100%; height: 35px; color: #666; display: flex; justify-content:flex-start; align-items:center; }
.form_pro_title font { font-size: 12px; color: #fff; background: #f17164; border-radius: 3px; padding: 0px 13px 2px; cursor: pointer; margin-left: 10px; }
.form_pro_title span { font-size: 12px; color: #fff; background: #00bee4; border-radius: 3px; padding: 0px 13px 2px; cursor: pointer; margin-left: 10px; }
.form_pro_title mark { font-size: 12px; color: #fff; background: #999; border-radius: 3px; padding: 0px 13px 2px; cursor: pointer; margin-left: 10px; }
.form_pro_title a { font-size: 12px; color: #fff; background: #406DFF; border-radius: 3px; padding: 0px 13px 2px; cursor: pointer; margin-left: 10px; }
.form_pro_title b { font-size: 12px; color: #fff; background: #888; border-radius: 3px; padding: 0px 13px 2px; cursor: pointer; margin-left: 10px; }
/*表单用组件*/
.form_pro_input { width: 100%; height: auto; display: flex; flex-wrap: wrap; }
.form_pro_input input { width: 100%; height: 40px; border: 1px solid #ccc; border-radius: 4px; text-indent: 8px; font-size: 14px; }
.form_pro_input select { width: 100%; height: 40px; border: 1px solid #ccc; border-radius: 4px; text-indent: 8px; font-size: 14px; }
.form_pro_input textarea { width: 100%; height: 80px; border: 1px solid #ccc; border-radius: 4px; font-size: 14px; font-family: "微软雅黑"; }
.form_pro_input_text { width: 100%; height: auto; background:#ccc; }
.form_pro_input_text textarea { width: 100%; height: auto;}
.form_pro_submit { width: 100%; height: 80px; display: flex; justify-content:center; align-items:center; align-content:center; }
.form_pro_submit input { width: 160; height: 40px; background: var(--theme-color); border-radius: 5px; color: #fff; font-size: 14px; cursor: pointer; border: none; font-weight: bold; margin: 0 10px; }
#refill { width: 160; height: 40px; background: #aaa; border-radius: 5px; color: #fff; font-size: 14px; cursor: pointer; border: none; font-weight: bold; margin: 0 10px; display: flex; justify-content:center; align-items:center; }
.form_pro_input div { width: 24%; height: 35px; margin: 10px 1% 0px 0; line-height: 35px; display: flex; justify-content:flex-start; align-items:center; align-content:center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: #f4f4f4; border-radius: 5px; }
.form_pro_input div label { color: #666; margin-left: 10px; cursor: pointer; }
.form_pro_input div input { width: 14px; height: 14px; margin-left: 10px; }
.form_pro_uedit { width: 100%; height: auto; }
#checkbox_title { background: none; width: 100%; height: 25px; border-radius: 0px; margin-top: 12px; font-size: 14px; color: #666; font-weight: bold; display: block; }
#checkbox_title i { margin-right: 10px; margin-left: 5px; color: var(--theme-color); }
#list_div { width: 100%; height: 45px; line-height: 50px; background: none; border-bottom: 1px solid #ddd; border-radius: 0; color: #900; }
#list_div i { margin-left: 5px; margin-right: 10px; color: #999; }

.form_type_dom { width: 100%; height: auto; display: flex; flex-wrap: wrap; justify-content:flex-start; align-items:flex-start; }